@cuemath/leap 3.0.12-ays3 → 3.0.12-ays5

package/dist/features/chapters-v2/comps/node-card/node-card-styled.js

@@ -1,14 +1,20 @@
 import t from "styled-components";
-import a from "../../../../assets/line-icons/icons/important.js";
-import s from "../../../../assets/line-icons/icons/lock2.js";
+import d from "../../../../assets/line-icons/icons/important.js";
+import l from "../../../../assets/line-icons/icons/lock2.js";
 import e from "../../../ui/layout/flex-view.js";
-import d from "../../../ui/text/text.js";
-const b = t(e)(({ theme: o, $disabled: r }) => {
-  const { BLACK: i, BLACK_T_15: n } = o.colors;
+import c from "../../../ui/text/text.js";
+const m = t(e)(({
+  $showOutline: o,
+  theme: r,
+  $disabled: n,
+  $isSheetLocked: a
+}) => {
+  const { BLACK_1: p, BLACK: s, BLACK_T_15: i } = r.colors;
   return `
-    cursor: ${r ? "not-allowed" : "pointer"};
+    cursor: ${n ? "not-allowed" : "pointer"};
     position: relative;
-    border-image: linear-gradient(to right, ${n} 0%, ${n} 100%);
+    border-image: linear-gradient(to right, ${i} 0%, ${i} 100%);
+    ${o && `outline: 1px solid ${i};`};
 
     .node-card-border {
       position: absolute;
@@ -21,13 +27,43 @@ const b = t(e)(({ theme: o, $disabled: r }) => {
       background: transparent;
     }
 
+    .node-card-border > .border-path {
+      fill: none;
+      stroke: ${i};
+      stroke-width: 1.5;
+    }
+
+    .node-card-border > .border-path-animation {
+      fill: none;
+      stroke: ${s};
+      stroke-width: 1.5;
+      //* view box size 170 + 56 + 170 + 56 = 452
+      //* 452 / 2 = 226
+      stroke-dasharray: 226 226;
+      stroke-dashoffset: 0;
+
+      animation: dashmove 6s linear infinite;
+    }
+    
+    @keyframes dashmove {
+      to {
+        stroke-dashoffset: -900;
+      }
+    }
+    
     &:hover {
-      ${!r && `
-          outline: 1px solid ${i};
-        `}    
+      ${!n && `
+          .node-card-border > .border-path-animation {
+            stroke: ${p};
+            stroke-dasharray: 452;
+            animation: none;
+          }
+        `}
+
+      ${o && !a && `outline: 1px solid ${s};`};
     }
   `;
-}), h = t(a)(({ theme: o }) => {
+}), g = t(d)(({ theme: o }) => {
   const { layout: r } = o;
   return `
     width: ${r.gutter * 0.75}px;
@@ -36,16 +72,16 @@ const b = t(e)(({ theme: o, $disabled: r }) => {
     top: -2.5px;
     right: -2.5px;
   `;
-}), m = t(e)(({ $bgImage: o }) => `
+}), $ = t(e)(({ $bgImage: o }) => `
     background-image: url(${o});
 
     & .context-menu {
       justify-self: flex-end;
       margin-left: auto;
     }
-  `), f = t(e)`
+  `), k = t(e)`
   border-radius: 50%;
-`, $ = t(e)(() => `
+`, w = t(e)(() => `
     position: relative;
     padding: 12px 8px 12px 12px;
   `), I = t(e)(({ $top: o, $right: r }) => `
@@ -54,43 +90,43 @@ const b = t(e)(({ theme: o, $disabled: r }) => {
   right: ${r ?? 0}px;
   z-index: 3;
 `);
-t(s)(({}) => `
+t(l)(({}) => `
     width: 28px;
     height: 28px;
   `);
-const w = t(e)(({
+const v = t(e)(({
   theme: o,
   $paddingRight: r,
-  $paddingLeft: i
+  $paddingLeft: n
 }) => {
-  const { BLACK_1: n, WHITE_1: p } = o.colors;
+  const { BLACK_1: a, WHITE_1: p } = o.colors;
   return `
     position: absolute;
     top: -10px;
     right: -10px;
     padding: 0px;
-    padding-left: ${i}px;
+    padding-left: ${n}px;
     padding-right: ${r}px;
-    background: ${n};
+    background: ${a};
 
     path {
       fill: ${p};
     }
   `;
-}), W = t(d)(() => `
+}), y = t(c)(() => `
     display: -webkit-box;
     -webkit-box-orient: vertical;
     -webkit-line-clamp: 2;
     text-overflow: ellipsis;
     overflow: hidden;
-  `), k = t(e)(({ theme: o }) => `
+  `), C = t(e)(({ theme: o }) => `
     cursor: pointer;
     
     &:hover {
       border-radius: 50%;
       background: ${o.colors.WHITE_5}; 
     }
-  `), C = t(e)(({ theme: o, $visible: r }) => `
+  `), W = t(e)(({ theme: o, $visible: r }) => `
     cursor: pointer;
 
     position: absolute;
@@ -109,15 +145,15 @@ const w = t(e)(({
     }
   `);
 export {
-  f as IconWrapper,
-  w as InProgressIconWrapper,
-  b as NodeCardContainer,
-  $ as NodeCardContentWrapper,
-  m as NodeCardInfoWrapper,
-  W as NodeCardTitle,
-  k as NodeKebabMenuWrapper,
-  C as NodeMenuOptionsWrapper,
+  k as IconWrapper,
+  v as InProgressIconWrapper,
+  m as NodeCardContainer,
+  w as NodeCardContentWrapper,
+  $ as NodeCardInfoWrapper,
+  y as NodeCardTitle,
+  C as NodeKebabMenuWrapper,
+  W as NodeMenuOptionsWrapper,
   I as SheetTagWrapper,
-  h as StyledImportantIcon
+  g as StyledImportantIcon
 };
 //# sourceMappingURL=node-card-styled.js.map

package/dist/features/chapters-v2/comps/node-card/node-card-styled.js.map

@@ -1 +1 @@
-{"version":3,"file":"node-card-styled.js","sources":["../../../../../src/features/chapters-v2/comps/node-card/node-card-styled.tsx"],"sourcesContent":["import styled from 'styled-components';\n\nimport ImportantIcon from '../../../../assets/line-icons/icons/important';\nimport Lock2Icon from '../../../../assets/line-icons/icons/lock2';\nimport FlexView from '../../../ui/layout/flex-view';\nimport Text from '../../../ui/text/text';\n\ninterface INodeCardContainer {\n  $disabled: boolean;\n  $isSheetLocked?: boolean;\n}\n\nconst NodeCardContainer = styled(FlexView)<INodeCardContainer>(({ theme, $disabled }) => {\n  const { BLACK, BLACK_T_15 } = theme.colors;\n\n  return `\n    cursor: ${$disabled ? 'not-allowed' : 'pointer'};\n    position: relative;\n    border-image: linear-gradient(to right, ${BLACK_T_15} 0%, ${BLACK_T_15} 100%);\n\n    .node-card-border {\n      position: absolute;\n      top: 0;\n      left: 0;\n      z-index: 2;\n      width: 100%;\n      height: 100%;\n      pointer-events: none;\n      background: transparent;\n    }\n\n    &:hover {\n      ${\n        !$disabled &&\n        `\n          outline: 1px solid ${BLACK};\n        `\n      }    \n    }\n  `;\n});\n\nconst StyledImportantIcon = styled(ImportantIcon)(({ theme }) => {\n  const { layout } = theme;\n\n  return `\n    width: ${layout.gutter * 0.75}px;\n    height: ${layout.gutter * 0.75}px;\n    position: absolute;\n    top: -2.5px;\n    right: -2.5px;\n  `;\n});\n\ninterface INodeCardInfoWrapper {\n  $bgImage: string;\n}\n\nconst NodeCardInfoWrapper = styled(FlexView)<INodeCardInfoWrapper>(({ $bgImage }) => {\n  return `\n    background-image: url(${$bgImage});\n\n    & .context-menu {\n      justify-self: flex-end;\n      margin-left: auto;\n    }\n  `;\n});\n\nconst IconWrapper = styled(FlexView)`\n  border-radius: 50%;\n`;\n\nconst NodeCardContentWrapper = styled(FlexView)(() => {\n  return `\n    position: relative;\n    padding: 12px 8px 12px 12px;\n  `;\n});\n\ninterface ISheetTagWrapper {\n  $top?: number;\n  $right?: number;\n}\n\nconst SheetTagWrapper = styled(FlexView)<ISheetTagWrapper>(({ $top, $right }) => {\n  return `\n  position: absolute;\n  top: ${$top ?? 0}px;\n  right: ${$right ?? 0}px;\n  z-index: 3;\n`;\n});\n\nconst StyledLockIcon = styled(Lock2Icon)(({}) => {\n  return `\n    width: 28px;\n    height: 28px;\n  `;\n});\n\nconst InProgressIconWrapper = styled(FlexView)<{ $paddingRight: number; $paddingLeft: number }>(({\n  theme,\n  $paddingRight,\n  $paddingLeft,\n}) => {\n  const { BLACK_1, WHITE_1 } = theme.colors;\n\n  return `\n    position: absolute;\n    top: -10px;\n    right: -10px;\n    padding: 0px;\n    padding-left: ${$paddingLeft}px;\n    padding-right: ${$paddingRight}px;\n    background: ${BLACK_1};\n\n    path {\n      fill: ${WHITE_1};\n    }\n  `;\n});\n\nconst NodeCardTitle = styled(Text)(() => {\n  return `\n    display: -webkit-box;\n    -webkit-box-orient: vertical;\n    -webkit-line-clamp: 2;\n    text-overflow: ellipsis;\n    overflow: hidden;\n  `;\n});\n\nconst NodeKebabMenuWrapper = styled(FlexView)(({ theme }) => {\n  return `\n    cursor: pointer;\n    \n    &:hover {\n      border-radius: 50%;\n      background: ${theme.colors.WHITE_5}; \n    }\n  `;\n});\n\ninterface INodeOptionsMenuWrapper {\n  $visible: boolean;\n}\n\nconst NodeMenuOptionsWrapper = styled(FlexView)<INodeOptionsMenuWrapper>(({ theme, $visible }) => {\n  return `\n    cursor: pointer;\n\n    position: absolute;\n    z-index: 6;\n    top: calc(100% + 4px);\n    left: 0;\n\n    transform-origin: top;\n    transform: scaleY(${$visible ? 1 : 0});\n    opacity: ${$visible ? 1 : 0};\n    transition: transform 0.2s ease-in-out, opacity 0.2s ease-in-out;\n    \n    &:hover {\n      border-radius: 50%;\n      background: ${theme.colors.WHITE_5}; \n    }\n  `;\n});\n\nexport {\n  NodeCardContainer,\n  StyledImportantIcon,\n  NodeCardInfoWrapper,\n  IconWrapper,\n  NodeCardContentWrapper,\n  SheetTagWrapper,\n  StyledLockIcon,\n  InProgressIconWrapper,\n  NodeCardTitle,\n  NodeKebabMenuWrapper,\n  NodeMenuOptionsWrapper,\n};\n"],"names":["NodeCardContainer","styled","FlexView","theme","$disabled","BLACK","BLACK_T_15","StyledImportantIcon","ImportantIcon","layout","NodeCardInfoWrapper","$bgImage","IconWrapper","NodeCardContentWrapper","SheetTagWrapper","$top","$right","Lock2Icon","InProgressIconWrapper","$paddingRight","$paddingLeft","BLACK_1","WHITE_1","NodeCardTitle","Text","NodeKebabMenuWrapper","NodeMenuOptionsWrapper","$visible"],"mappings":";;;;;AAYM,MAAAA,IAAoBC,EAAOC,CAAQ,EAAsB,CAAC,EAAE,OAAAC,GAAO,WAAAC,QAAgB;AACvF,QAAM,EAAE,OAAAC,GAAO,YAAAC,MAAeH,EAAM;AAE7B,SAAA;AAAA,cACKC,IAAY,gBAAgB,SAAS;AAAA;AAAA,8CAELE,CAAU,QAAQA,CAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,QAelE,CAACF,KACD;AAAA,+BACuBC,CAAK;AAAA,SAE9B;AAAA;AAAA;AAGN,CAAC,GAEKE,IAAsBN,EAAOO,CAAa,EAAE,CAAC,EAAE,OAAAL,QAAY;AACzD,QAAA,EAAE,QAAAM,EAAW,IAAAN;AAEZ,SAAA;AAAA,aACIM,EAAO,SAAS,IAAI;AAAA,cACnBA,EAAO,SAAS,IAAI;AAAA;AAAA;AAAA;AAAA;AAKlC,CAAC,GAMKC,IAAsBT,EAAOC,CAAQ,EAAwB,CAAC,EAAE,UAAAS,QAC7D;AAAA,4BACmBA,CAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAOnC,GAEKC,IAAcX,EAAOC,CAAQ;AAAA;AAAA,GAI7BW,IAAyBZ,EAAOC,CAAQ,EAAE,MACvC;AAAA;AAAA;AAAA,GAIR,GAOKY,IAAkBb,EAAOC,CAAQ,EAAoB,CAAC,EAAE,MAAAa,GAAM,QAAAC,QAC3D;AAAA;AAAA,SAEAD,KAAQ,CAAC;AAAA,WACPC,KAAU,CAAC;AAAA;AAAA,CAGrB;AAEsBf,EAAOgB,CAAS,EAAE,CAAC,OACjC;AAAA;AAAA;AAAA,GAIR;AAED,MAAMC,IAAwBjB,EAAOC,CAAQ,EAAmD,CAAC;AAAA,EAC/F,OAAAC;AAAA,EACA,eAAAgB;AAAA,EACA,cAAAC;AACF,MAAM;AACJ,QAAM,EAAE,SAAAC,GAAS,SAAAC,MAAYnB,EAAM;AAE5B,SAAA;AAAA;AAAA;AAAA;AAAA;AAAA,oBAKWiB,CAAY;AAAA,qBACXD,CAAa;AAAA,kBAChBE,CAAO;AAAA;AAAA;AAAA,cAGXC,CAAO;AAAA;AAAA;AAGrB,CAAC,GAEKC,IAAgBtB,EAAOuB,CAAI,EAAE,MAC1B;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAOR,GAEKC,IAAuBxB,EAAOC,CAAQ,EAAE,CAAC,EAAE,OAAAC,QACxC;AAAA;AAAA;AAAA;AAAA;AAAA,oBAKWA,EAAM,OAAO,OAAO;AAAA;AAAA,GAGvC,GAMKuB,IAAyBzB,EAAOC,CAAQ,EAA2B,CAAC,EAAE,OAAAC,GAAO,UAAAwB,QAC1E;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,wBASeA,IAAW,IAAI,CAAC;AAAA,eACzBA,IAAW,IAAI,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA,oBAKXxB,EAAM,OAAO,OAAO;AAAA;AAAA,GAGvC;"}
+{"version":3,"file":"node-card-styled.js","sources":["../../../../../src/features/chapters-v2/comps/node-card/node-card-styled.tsx"],"sourcesContent":["import styled from 'styled-components';\n\nimport ImportantIcon from '../../../../assets/line-icons/icons/important';\nimport Lock2Icon from '../../../../assets/line-icons/icons/lock2';\nimport FlexView from '../../../ui/layout/flex-view';\nimport Text from '../../../ui/text/text';\n\ninterface INodeCardContainer {\n  $showOutline?: boolean;\n  $disabled: boolean;\n  $isSheetLocked?: boolean;\n}\n\nconst NodeCardContainer = styled(FlexView)<INodeCardContainer>(({\n  $showOutline,\n  theme,\n  $disabled,\n  $isSheetLocked,\n}) => {\n  const { BLACK_1, BLACK, BLACK_T_15 } = theme.colors;\n\n  return `\n    cursor: ${$disabled ? 'not-allowed' : 'pointer'};\n    position: relative;\n    border-image: linear-gradient(to right, ${BLACK_T_15} 0%, ${BLACK_T_15} 100%);\n    ${$showOutline && `outline: 1px solid ${BLACK_T_15};`};\n\n    .node-card-border {\n      position: absolute;\n      top: 0;\n      left: 0;\n      z-index: 2;\n      width: 100%;\n      height: 100%;\n      pointer-events: none;\n      background: transparent;\n    }\n\n    .node-card-border > .border-path {\n      fill: none;\n      stroke: ${BLACK_T_15};\n      stroke-width: 1.5;\n    }\n\n    .node-card-border > .border-path-animation {\n      fill: none;\n      stroke: ${BLACK};\n      stroke-width: 1.5;\n      //* view box size 170 + 56 + 170 + 56 = 452\n      //* 452 / 2 = 226\n      stroke-dasharray: 226 226;\n      stroke-dashoffset: 0;\n\n      animation: dashmove 6s linear infinite;\n    }\n    \n    @keyframes dashmove {\n      to {\n        stroke-dashoffset: -900;\n      }\n    }\n    \n    &:hover {\n      ${\n        !$disabled &&\n        `\n          .node-card-border > .border-path-animation {\n            stroke: ${BLACK_1};\n            stroke-dasharray: 452;\n            animation: none;\n          }\n        `\n      }\n\n      ${$showOutline && !$isSheetLocked && `outline: 1px solid ${BLACK};`};\n    }\n  `;\n});\n\nconst StyledImportantIcon = styled(ImportantIcon)(({ theme }) => {\n  const { layout } = theme;\n\n  return `\n    width: ${layout.gutter * 0.75}px;\n    height: ${layout.gutter * 0.75}px;\n    position: absolute;\n    top: -2.5px;\n    right: -2.5px;\n  `;\n});\n\ninterface INodeCardInfoWrapper {\n  $bgImage: string;\n}\n\nconst NodeCardInfoWrapper = styled(FlexView)<INodeCardInfoWrapper>(({ $bgImage }) => {\n  return `\n    background-image: url(${$bgImage});\n\n    & .context-menu {\n      justify-self: flex-end;\n      margin-left: auto;\n    }\n  `;\n});\n\nconst IconWrapper = styled(FlexView)`\n  border-radius: 50%;\n`;\n\nconst NodeCardContentWrapper = styled(FlexView)(() => {\n  return `\n    position: relative;\n    padding: 12px 8px 12px 12px;\n  `;\n});\n\ninterface ISheetTagWrapper {\n  $top?: number;\n  $right?: number;\n}\n\nconst SheetTagWrapper = styled(FlexView)<ISheetTagWrapper>(({ $top, $right }) => {\n  return `\n  position: absolute;\n  top: ${$top ?? 0}px;\n  right: ${$right ?? 0}px;\n  z-index: 3;\n`;\n});\n\nconst StyledLockIcon = styled(Lock2Icon)(({}) => {\n  return `\n    width: 28px;\n    height: 28px;\n  `;\n});\n\nconst InProgressIconWrapper = styled(FlexView)<{ $paddingRight: number; $paddingLeft: number }>(({\n  theme,\n  $paddingRight,\n  $paddingLeft,\n}) => {\n  const { BLACK_1, WHITE_1 } = theme.colors;\n\n  return `\n    position: absolute;\n    top: -10px;\n    right: -10px;\n    padding: 0px;\n    padding-left: ${$paddingLeft}px;\n    padding-right: ${$paddingRight}px;\n    background: ${BLACK_1};\n\n    path {\n      fill: ${WHITE_1};\n    }\n  `;\n});\n\nconst NodeCardTitle = styled(Text)(() => {\n  return `\n    display: -webkit-box;\n    -webkit-box-orient: vertical;\n    -webkit-line-clamp: 2;\n    text-overflow: ellipsis;\n    overflow: hidden;\n  `;\n});\n\nconst NodeKebabMenuWrapper = styled(FlexView)(({ theme }) => {\n  return `\n    cursor: pointer;\n    \n    &:hover {\n      border-radius: 50%;\n      background: ${theme.colors.WHITE_5}; \n    }\n  `;\n});\n\ninterface INodeOptionsMenuWrapper {\n  $visible: boolean;\n}\n\nconst NodeMenuOptionsWrapper = styled(FlexView)<INodeOptionsMenuWrapper>(({ theme, $visible }) => {\n  return `\n    cursor: pointer;\n\n    position: absolute;\n    z-index: 6;\n    top: calc(100% + 4px);\n    left: 0;\n\n    transform-origin: top;\n    transform: scaleY(${$visible ? 1 : 0});\n    opacity: ${$visible ? 1 : 0};\n    transition: transform 0.2s ease-in-out, opacity 0.2s ease-in-out;\n    \n    &:hover {\n      border-radius: 50%;\n      background: ${theme.colors.WHITE_5}; \n    }\n  `;\n});\n\nexport {\n  NodeCardContainer,\n  StyledImportantIcon,\n  NodeCardInfoWrapper,\n  IconWrapper,\n  NodeCardContentWrapper,\n  SheetTagWrapper,\n  StyledLockIcon,\n  InProgressIconWrapper,\n  NodeCardTitle,\n  NodeKebabMenuWrapper,\n  NodeMenuOptionsWrapper,\n};\n"],"names":["NodeCardContainer","styled","FlexView","$showOutline","theme","$disabled","$isSheetLocked","BLACK_1","BLACK","BLACK_T_15","StyledImportantIcon","ImportantIcon","layout","NodeCardInfoWrapper","$bgImage","IconWrapper","NodeCardContentWrapper","SheetTagWrapper","$top","$right","Lock2Icon","InProgressIconWrapper","$paddingRight","$paddingLeft","WHITE_1","NodeCardTitle","Text","NodeKebabMenuWrapper","NodeMenuOptionsWrapper","$visible"],"mappings":";;;;;AAaA,MAAMA,IAAoBC,EAAOC,CAAQ,EAAsB,CAAC;AAAA,EAC9D,cAAAC;AAAA,EACA,OAAAC;AAAA,EACA,WAAAC;AAAA,EACA,gBAAAC;AACF,MAAM;AACJ,QAAM,EAAE,SAAAC,GAAS,OAAAC,GAAO,YAAAC,EAAA,IAAeL,EAAM;AAEtC,SAAA;AAAA,cACKC,IAAY,gBAAgB,SAAS;AAAA;AAAA,8CAELI,CAAU,QAAQA,CAAU;AAAA,MACpEN,KAAgB,sBAAsBM,CAAU,GAAG;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,gBAezCA,CAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,gBAMVD,CAAK;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,QAkBb,CAACH,KACD;AAAA;AAAA,sBAEcE,CAAO;AAAA;AAAA;AAAA;AAAA,SAKvB;AAAA;AAAA,QAEEJ,KAAgB,CAACG,KAAkB,sBAAsBE,CAAK,GAAG;AAAA;AAAA;AAGzE,CAAC,GAEKE,IAAsBT,EAAOU,CAAa,EAAE,CAAC,EAAE,OAAAP,QAAY;AACzD,QAAA,EAAE,QAAAQ,EAAW,IAAAR;AAEZ,SAAA;AAAA,aACIQ,EAAO,SAAS,IAAI;AAAA,cACnBA,EAAO,SAAS,IAAI;AAAA;AAAA;AAAA;AAAA;AAKlC,CAAC,GAMKC,IAAsBZ,EAAOC,CAAQ,EAAwB,CAAC,EAAE,UAAAY,QAC7D;AAAA,4BACmBA,CAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAOnC,GAEKC,IAAcd,EAAOC,CAAQ;AAAA;AAAA,GAI7Bc,IAAyBf,EAAOC,CAAQ,EAAE,MACvC;AAAA;AAAA;AAAA,GAIR,GAOKe,IAAkBhB,EAAOC,CAAQ,EAAoB,CAAC,EAAE,MAAAgB,GAAM,QAAAC,QAC3D;AAAA;AAAA,SAEAD,KAAQ,CAAC;AAAA,WACPC,KAAU,CAAC;AAAA;AAAA,CAGrB;AAEsBlB,EAAOmB,CAAS,EAAE,CAAC,OACjC;AAAA;AAAA;AAAA,GAIR;AAED,MAAMC,IAAwBpB,EAAOC,CAAQ,EAAmD,CAAC;AAAA,EAC/F,OAAAE;AAAA,EACA,eAAAkB;AAAA,EACA,cAAAC;AACF,MAAM;AACJ,QAAM,EAAE,SAAAhB,GAAS,SAAAiB,MAAYpB,EAAM;AAE5B,SAAA;AAAA;AAAA;AAAA;AAAA;AAAA,oBAKWmB,CAAY;AAAA,qBACXD,CAAa;AAAA,kBAChBf,CAAO;AAAA;AAAA;AAAA,cAGXiB,CAAO;AAAA;AAAA;AAGrB,CAAC,GAEKC,IAAgBxB,EAAOyB,CAAI,EAAE,MAC1B;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAOR,GAEKC,IAAuB1B,EAAOC,CAAQ,EAAE,CAAC,EAAE,OAAAE,QACxC;AAAA;AAAA;AAAA;AAAA;AAAA,oBAKWA,EAAM,OAAO,OAAO;AAAA;AAAA,GAGvC,GAMKwB,IAAyB3B,EAAOC,CAAQ,EAA2B,CAAC,EAAE,OAAAE,GAAO,UAAAyB,QAC1E;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,wBASeA,IAAW,IAAI,CAAC;AAAA,eACzBA,IAAW,IAAI,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA,oBAKXzB,EAAM,OAAO,OAAO;AAAA;AAAA,GAGvC;"}

package/dist/features/chapters-v2/comps/node-card/student-actions/student-actions.js

@@ -1,126 +1,128 @@
-import { jsx as e, jsxs as d, Fragment as H } from "react/jsx-runtime";
-import { memo as K, useRef as X, useCallback as m } from "react";
-import j from "../../../../../assets/line-icons/icons/eye2.js";
-import G from "../../../../../assets/line-icons/icons/redo.js";
-import z from "../../../../ui/arrow-tooltip/arrow-tooltip.js";
-import F from "../../../../ui/context-menu/context-menu.js";
-import P from "../../../../ui/lottie-animation/lottie-animation.js";
-import Y from "../../../../ui/text/text.js";
-import { BLOCK_TYPE as Z } from "../../../constants/block-constants.js";
-import { NODE_CARD_STATES as q } from "../../../constants/node-constants.js";
-import { getNodeTypeBasedBgImage as J } from "../../../utils/index.js";
-import { getNodeCardBasedIcon as Q } from "../../../utils/node-card-utils.js";
-import { NodeCardContainer as U, NodeCardInfoWrapper as V, IconWrapper as ee, StyledImportantIcon as te, NodeCardContentWrapper as re, NodeCardTitle as ne } from "../node-card-styled.js";
-import oe from "../node-card-tags.js";
-import ae from "../node-menu-options/node-menu-options.js";
-const ie = { renderer: "canvas", autoplay: !1 }, be = K((k) => {
+import { jsx as e, jsxs as m, Fragment as j } from "react/jsx-runtime";
+import { memo as z, useRef as F, useCallback as l } from "react";
+import Y from "../../../../../assets/line-icons/icons/eye2.js";
+import Z from "../../../../../assets/line-icons/icons/redo.js";
+import q from "../../../../ui/arrow-tooltip/arrow-tooltip.js";
+import J from "../../../../ui/border-path-animation/border-path-animation.js";
+import Q from "../../../../ui/context-menu/context-menu.js";
+import U from "../../../../ui/lottie-animation/lottie-animation.js";
+import V from "../../../../ui/text/text.js";
+import { BLOCK_TYPE as ee } from "../../../constants/block-constants.js";
+import { NODE_CARD_STATES as $ } from "../../../constants/node-constants.js";
+import { getNodeTypeBasedBgImage as te } from "../../../utils/index.js";
+import { getNodeCardBasedIcon as oe } from "../../../utils/node-card-utils.js";
+import { NodeCardContainer as re, NodeCardInfoWrapper as ne, IconWrapper as ae, StyledImportantIcon as ie, NodeCardContentWrapper as se, NodeCardTitle as ce } from "../node-card-styled.js";
+import de from "../node-card-tags.js";
+import me from "../node-menu-options/node-menu-options.js";
+const le = { renderer: "canvas", autoplay: !1 }, Le = z((A) => {
   const {
     nodeData: t,
-    imageHue: O,
-    blockType: b,
+    imageHue: S,
+    blockType: T,
     onNodeAttempt: a,
     onNodeReattempt: i,
-    onNodeReview: c,
-    onNodeView: r,
-    isStudent: y
-  } = k, {
+    onNodeReview: s,
+    onNodeView: o,
+    isStudent: E
+  } = A, {
     accuracy: L,
-    attempt_location: S,
-    node_type: l,
-    card_header: A,
-    title: E,
-    state: C,
-    is_optional: T,
-    sheet_statement: $,
-    permissions: x,
-    marked_as_completed: s
+    attempt_location: y,
+    node_type: p,
+    card_header: R,
+    title: w,
+    state: c,
+    is_optional: g,
+    sheet_statement: _,
+    permissions: B,
+    marked_as_completed: d
   } = t, {
-    can_review: g,
-    can_start: p,
-    can_resume: u,
-    can_reset: _
-  } = x, R = b === Z.GOAL, o = C === q.LOCKED, v = S === "INCLASS", f = !(p || u) && (_ || g), h = X(null), w = J(l), { lottie: B } = Q(l), I = m(
-    (n) => {
-      switch (n) {
+    can_review: I,
+    can_start: u,
+    can_resume: h,
+    can_reset: O
+  } = B, x = T === ee.GOAL, n = c === $.LOCKED, N = c === $.NOT_STARTED, W = c === $.IN_PROGRESS, v = y === "INCLASS", M = u || h, b = !g && (W || N), f = !M && (O || I), C = F(null), D = te(p), { lottie: K } = oe(p), k = l(
+    (r) => {
+      switch (r) {
         case "node-card-review":
-          s ? r == null || r(t) : c == null || c(t);
+          d ? o == null || o(t) : s == null || s(t);
           return;
         case "node-card-reattempt":
           i == null || i(t);
           return;
         default:
-          throw new Error(`No callback function for ${n}`);
+          throw new Error(`No callback function for ${r}`);
       }
     },
-    [t, i, c, r, s]
-  ), M = m(() => {
-    f || o || (p || u ? a == null || a(t) : s && (r == null || r(t)));
+    [t, i, s, o, d]
+  ), G = l(() => {
+    f || n || (u || h ? a == null || a(t) : d && (o == null || o(t)));
   }, [
+    h,
     u,
-    p,
     t,
     a,
-    r,
-    f,
     o,
-    s
-  ]), W = m(() => {
-    var n;
-    o || (n = h.current) == null || n.play();
-  }, [o]), N = m(() => {
-    var n;
-    (n = h.current) == null || n.stop();
-  }, []), D = [
+    f,
+    n,
+    d
+  ]), H = l(() => {
+    var r;
+    n || (r = C.current) == null || r.play();
+  }, [n]), P = l(() => {
+    var r;
+    (r = C.current) == null || r.stop();
+  }, []), X = [
     {
       id: "node-card-review",
       label: "Review",
-      icon: j,
-      disabled: !g,
-      onClick: I
+      icon: Y,
+      disabled: !I,
+      onClick: k
     },
     {
       id: "node-card-reattempt",
       label: "Reattempt",
-      icon: G,
-      disabled: !_,
-      onClick: I
+      icon: Z,
+      disabled: !O,
+      onClick: k
     }
   ];
   return /* @__PURE__ */ e(
-    F,
+    Q,
     {
       targetElement: /* @__PURE__ */ e(
-        U,
+        re,
         {
-          $background: `${O}_2`,
-          $disabled: o,
-          onClick: M,
-          children: /* @__PURE__ */ d(
-            z,
+          $showOutline: !b,
+          $background: `${S}_2`,
+          $disabled: n,
+          onClick: G,
+          children: /* @__PURE__ */ m(
+            q,
             {
               renderAs: "primary",
-              tooltipItem: $,
+              tooltipItem: _,
               position: "bottom",
               zIndex: 5,
-              hidden: !$,
+              hidden: !_,
               parentWidth: "100%",
               widthX: 11.25,
               children: [
-                /* @__PURE__ */ d(
-                  V,
+                /* @__PURE__ */ m(
+                  ne,
                   {
                     $flexDirection: "row",
                     $alignItems: "center",
                     $heightX: 3.5,
-                    $bgImage: w,
+                    $bgImage: D,
                     $gutterX: 0.78125,
                     $flexGap: 8.5,
-                    $opacity: o ? 0.5 : 1,
-                    onMouseEnter: W,
-                    onMouseLeave: N,
+                    $opacity: n ? 0.5 : 1,
+                    onMouseEnter: H,
+                    onMouseLeave: P,
                     children: [
-                      /* @__PURE__ */ d(
-                        ee,
+                      /* @__PURE__ */ m(
+                        ae,
                         {
                           $width: 31,
                           $height: 31,
@@ -130,41 +132,42 @@ const ie = { renderer: "canvas", autoplay: !1 }, be = K((k) => {
                           $justifyContent: "center",
                           children: [
                             /* @__PURE__ */ e(
-                              P,
+                              U,
                               {
-                                src: B,
-                                ref: h,
-                                settings: ie
+                                src: K,
+                                ref: C,
+                                settings: le
                               }
                             ),
-                            !T && /* @__PURE__ */ e(te, {})
+                            !g && /* @__PURE__ */ e(ie, {})
                           ]
                         }
                       ),
-                      /* @__PURE__ */ d(Y, { $renderAs: "ac4-black", $color: "BLACK", children: [
-                        A,
+                      /* @__PURE__ */ m(V, { $renderAs: "ac4-black", $color: "BLACK", children: [
+                        R,
                         " ",
                         v && "• CW"
-                      ] })
+                      ] }),
+                      b && /* @__PURE__ */ e(J, { borderColor: "BLACK_1", borderWidth: 1 })
                     ]
                   }
                 ),
                 /* @__PURE__ */ e(
-                  oe,
+                  de,
                   {
-                    nodeType: l,
-                    state: C,
+                    nodeType: p,
+                    state: c,
                     accuracy: L,
-                    isStudent: y
+                    isStudent: E
                   }
                 ),
-                !R && /* @__PURE__ */ e(re, { $background: "WHITE_1", $heightX: 4, children: /* @__PURE__ */ e(
-                  ne,
+                !x && /* @__PURE__ */ e(se, { $background: "WHITE_1", $heightX: 4, children: /* @__PURE__ */ e(
+                  ce,
                   {
                     $renderAs: "ab3",
                     $color: "BLACK_1",
-                    $opacity: o ? 0.5 : 1,
-                    children: E
+                    $opacity: n ? 0.5 : 1,
+                    children: w
                   }
                 ) })
               ]
@@ -176,11 +179,11 @@ const ie = { renderer: "canvas", autoplay: !1 }, be = K((k) => {
       menuWidth: "100%",
       menuZIndex: 6,
       menuOffset: 2,
-      menuElement: f ? /* @__PURE__ */ e(ae, { options: D }) : /* @__PURE__ */ e(H, {})
+      menuElement: f ? /* @__PURE__ */ e(me, { options: X }) : /* @__PURE__ */ e(j, {})
     }
   );
 });
 export {
-  be as default
+  Le as default
 };
 //# sourceMappingURL=student-actions.js.map

package/dist/features/chapters-v2/comps/node-card/student-actions/student-actions.js.map

@@ -1 +1 @@
-{"version":3,"file":"student-actions.js","sources":["../../../../../../src/features/chapters-v2/comps/node-card/student-actions/student-actions.tsx"],"sourcesContent":["import type { ILottieAnimationRef } from '../../../../ui/lottie-animation/types';\nimport type { INodeCardProps } from '../node-card-types';\nimport type { INodeMenuOption } from '../node-menu-options/node-menu-options-types';\n\nimport { memo, useCallback, useRef, type FC } from 'react';\n\nimport Eye2Icon from '../../../../../assets/line-icons/icons/eye2';\nimport RedoIcon from '../../../../../assets/line-icons/icons/redo';\nimport ArrowTooltip from '../../../../ui/arrow-tooltip/arrow-tooltip';\nimport ContextMenu from '../../../../ui/context-menu/context-menu';\nimport LottieAnimation from '../../../../ui/lottie-animation/lottie-animation';\nimport Text from '../../../../ui/text/text';\nimport { BLOCK_TYPE } from '../../../constants/block-constants';\nimport { NODE_CARD_STATES } from '../../../constants/node-constants';\nimport { getNodeTypeBasedBgImage } from '../../../utils';\nimport { getNodeCardBasedIcon } from '../../../utils/node-card-utils';\nimport * as Styled from '../node-card-styled';\nimport NodeCardTags from '../node-card-tags';\nimport NodeMenuOptions from '../node-menu-options/node-menu-options';\n\nconst renderSettings = { renderer: 'canvas', autoplay: false };\n\nconst StudentActions: FC<Omit<INodeCardProps, 'userType'>> = memo(props => {\n  const {\n    nodeData,\n    imageHue,\n    blockType,\n    onNodeAttempt,\n    onNodeReattempt,\n    onNodeReview,\n    onNodeView,\n    isStudent,\n  } = props;\n  const {\n    accuracy,\n    attempt_location: attemptLocation,\n    node_type: nodeType,\n    card_header: cardHeader,\n    title,\n    state,\n    is_optional: isOptional,\n    sheet_statement: sheetStatement,\n    permissions,\n    marked_as_completed: teacherMarkedAsCompleted,\n  } = nodeData;\n  const {\n    can_review: canReview,\n    can_start: canStart,\n    can_resume: canResume,\n    can_reset: canReset,\n  } = permissions;\n\n  const isGoalBlock = blockType === BLOCK_TYPE.GOAL;\n  const sheetLocked = state === NODE_CARD_STATES.LOCKED;\n  const inClassSheet = attemptLocation === 'INCLASS';\n  const canStartOrResume = canStart || canResume;\n\n  const renderOptions = !canStartOrResume && (canReset || canReview);\n  const animationRef = useRef<ILottieAnimationRef | null>(null);\n  const nodeBgImage = getNodeTypeBasedBgImage(nodeType);\n  const { lottie: nodeCardLottie } = getNodeCardBasedIcon(nodeType);\n\n  const handleOnMenuOptionClick = useCallback(\n    (optionId: string) => {\n      switch (optionId) {\n        case 'node-card-review':\n          teacherMarkedAsCompleted ? onNodeView?.(nodeData) : onNodeReview?.(nodeData);\n\n          return;\n\n        case 'node-card-reattempt':\n          onNodeReattempt?.(nodeData);\n\n          return;\n\n        default:\n          throw new Error(`No callback function for ${optionId}`);\n      }\n    },\n    [nodeData, onNodeReattempt, onNodeReview, onNodeView, teacherMarkedAsCompleted],\n  );\n\n  const handleOnNodeCardClick = useCallback(() => {\n    if (renderOptions || sheetLocked) return;\n\n    if (canStart || canResume) {\n      onNodeAttempt?.(nodeData);\n    } else if (teacherMarkedAsCompleted) {\n      onNodeView?.(nodeData);\n    }\n  }, [\n    canResume,\n    canStart,\n    nodeData,\n    onNodeAttempt,\n    onNodeView,\n    renderOptions,\n    sheetLocked,\n    teacherMarkedAsCompleted,\n  ]);\n\n  const handleOnMouseEnter = useCallback(() => {\n    if (sheetLocked) return;\n    animationRef.current?.play();\n  }, [sheetLocked]);\n\n  const handleOnMouseLeave = useCallback(() => {\n    animationRef.current?.stop();\n  }, []);\n\n  const menuOptions: INodeMenuOption[] = [\n    {\n      id: 'node-card-review',\n      label: 'Review',\n      icon: Eye2Icon,\n      disabled: !canReview,\n      onClick: handleOnMenuOptionClick,\n    },\n    {\n      id: 'node-card-reattempt',\n      label: 'Reattempt',\n      icon: RedoIcon,\n      disabled: !canReset,\n      onClick: handleOnMenuOptionClick,\n    },\n  ];\n\n  return (\n    <ContextMenu\n      targetElement={\n        <Styled.NodeCardContainer\n          $background={`${imageHue}_2`}\n          $disabled={sheetLocked}\n          onClick={handleOnNodeCardClick}\n        >\n          <ArrowTooltip\n            renderAs=\"primary\"\n            tooltipItem={sheetStatement}\n            position=\"bottom\"\n            zIndex={5}\n            hidden={!sheetStatement}\n            parentWidth=\"100%\"\n            widthX={11.25}\n          >\n            <Styled.NodeCardInfoWrapper\n              $flexDirection=\"row\"\n              $alignItems=\"center\"\n              $heightX={3.5}\n              $bgImage={nodeBgImage}\n              $gutterX={0.78125}\n              $flexGap={8.5}\n              $opacity={sheetLocked ? 0.5 : 1}\n              onMouseEnter={handleOnMouseEnter}\n              onMouseLeave={handleOnMouseLeave}\n            >\n              <Styled.IconWrapper\n                $width={31}\n                $height={31}\n                $background=\"WHITE_1\"\n                $position=\"relative\"\n                $alignItems=\"center\"\n                $justifyContent=\"center\"\n              >\n                <LottieAnimation\n                  src={nodeCardLottie}\n                  ref={animationRef}\n                  settings={renderSettings}\n                />\n                {!isOptional && <Styled.StyledImportantIcon />}\n              </Styled.IconWrapper>\n\n              <Text $renderAs=\"ac4-black\" $color=\"BLACK\">\n                {cardHeader} {inClassSheet && `• CW`}\n              </Text>\n            </Styled.NodeCardInfoWrapper>\n\n            <NodeCardTags\n              nodeType={nodeType}\n              state={state}\n              accuracy={accuracy}\n              isStudent={isStudent}\n            />\n\n            {!isGoalBlock && (\n              <Styled.NodeCardContentWrapper $background=\"WHITE_1\" $heightX={4}>\n                <Styled.NodeCardTitle\n                  $renderAs=\"ab3\"\n                  $color=\"BLACK_1\"\n                  $opacity={sheetLocked ? 0.5 : 1}\n                >\n                  {title}\n                </Styled.NodeCardTitle>\n              </Styled.NodeCardContentWrapper>\n            )}\n          </ArrowTooltip>\n        </Styled.NodeCardContainer>\n      }\n      startLeft\n      menuWidth=\"100%\"\n      menuZIndex={6}\n      menuOffset={2}\n      menuElement={renderOptions ? <NodeMenuOptions options={menuOptions} /> : <></>}\n    />\n  );\n});\n\nexport default StudentActions;\n"],"names":["renderSettings","StudentActions","memo","props","nodeData","imageHue","blockType","onNodeAttempt","onNodeReattempt","onNodeReview","onNodeView","isStudent","accuracy","attemptLocation","nodeType","cardHeader","title","state","isOptional","sheetStatement","permissions","teacherMarkedAsCompleted","canReview","canStart","canResume","canReset","isGoalBlock","BLOCK_TYPE","sheetLocked","NODE_CARD_STATES","inClassSheet","renderOptions","animationRef","useRef","nodeBgImage","getNodeTypeBasedBgImage","nodeCardLottie","getNodeCardBasedIcon","handleOnMenuOptionClick","useCallback","optionId","handleOnNodeCardClick","handleOnMouseEnter","_a","handleOnMouseLeave","menuOptions","Eye2Icon","RedoIcon","jsx","ContextMenu","Styled.NodeCardContainer","jsxs","ArrowTooltip","Styled.NodeCardInfoWrapper","Styled.IconWrapper","LottieAnimation","Styled.StyledImportantIcon","Text","NodeCardTags","Styled.NodeCardContentWrapper","Styled.NodeCardTitle","NodeMenuOptions","Fragment"],"mappings":"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"}
+{"version":3,"file":"student-actions.js","sources":["../../../../../../src/features/chapters-v2/comps/node-card/student-actions/student-actions.tsx"],"sourcesContent":["import type { ILottieAnimationRef } from '../../../../ui/lottie-animation/types';\nimport type { INodeCardProps } from '../node-card-types';\nimport type { INodeMenuOption } from '../node-menu-options/node-menu-options-types';\n\nimport { memo, useCallback, useRef, type FC } from 'react';\n\nimport Eye2Icon from '../../../../../assets/line-icons/icons/eye2';\nimport RedoIcon from '../../../../../assets/line-icons/icons/redo';\nimport ArrowTooltip from '../../../../ui/arrow-tooltip/arrow-tooltip';\nimport BorderPathAnimation from '../../../../ui/border-path-animation/border-path-animation';\nimport ContextMenu from '../../../../ui/context-menu/context-menu';\nimport LottieAnimation from '../../../../ui/lottie-animation/lottie-animation';\nimport Text from '../../../../ui/text/text';\nimport { BLOCK_TYPE } from '../../../constants/block-constants';\nimport { NODE_CARD_STATES } from '../../../constants/node-constants';\nimport { getNodeTypeBasedBgImage } from '../../../utils';\nimport { getNodeCardBasedIcon } from '../../../utils/node-card-utils';\nimport * as Styled from '../node-card-styled';\nimport NodeCardTags from '../node-card-tags';\nimport NodeMenuOptions from '../node-menu-options/node-menu-options';\n\nconst renderSettings = { renderer: 'canvas', autoplay: false };\n\nconst StudentActions: FC<Omit<INodeCardProps, 'userType'>> = memo(props => {\n  const {\n    nodeData,\n    imageHue,\n    blockType,\n    onNodeAttempt,\n    onNodeReattempt,\n    onNodeReview,\n    onNodeView,\n    isStudent,\n  } = props;\n  const {\n    accuracy,\n    attempt_location: attemptLocation,\n    node_type: nodeType,\n    card_header: cardHeader,\n    title,\n    state,\n    is_optional: isOptional,\n    sheet_statement: sheetStatement,\n    permissions,\n    marked_as_completed: teacherMarkedAsCompleted,\n  } = nodeData;\n  const {\n    can_review: canReview,\n    can_start: canStart,\n    can_resume: canResume,\n    can_reset: canReset,\n  } = permissions;\n\n  const isGoalBlock = blockType === BLOCK_TYPE.GOAL;\n  const sheetLocked = state === NODE_CARD_STATES.LOCKED;\n  const sheetNotStarted = state === NODE_CARD_STATES.NOT_STARTED;\n  const sheetInProgress = state === NODE_CARD_STATES.IN_PROGRESS;\n  const inClassSheet = attemptLocation === 'INCLASS';\n  const canStartOrResume = canStart || canResume;\n\n  const showCardAnimation = !isOptional && (sheetInProgress || sheetNotStarted);\n  const renderOptions = !canStartOrResume && (canReset || canReview);\n  const animationRef = useRef<ILottieAnimationRef | null>(null);\n  const nodeBgImage = getNodeTypeBasedBgImage(nodeType);\n  const { lottie: nodeCardLottie } = getNodeCardBasedIcon(nodeType);\n\n  const handleOnMenuOptionClick = useCallback(\n    (optionId: string) => {\n      switch (optionId) {\n        case 'node-card-review':\n          teacherMarkedAsCompleted ? onNodeView?.(nodeData) : onNodeReview?.(nodeData);\n\n          return;\n\n        case 'node-card-reattempt':\n          onNodeReattempt?.(nodeData);\n\n          return;\n\n        default:\n          throw new Error(`No callback function for ${optionId}`);\n      }\n    },\n    [nodeData, onNodeReattempt, onNodeReview, onNodeView, teacherMarkedAsCompleted],\n  );\n\n  const handleOnNodeCardClick = useCallback(() => {\n    if (renderOptions || sheetLocked) return;\n\n    if (canStart || canResume) {\n      onNodeAttempt?.(nodeData);\n    } else if (teacherMarkedAsCompleted) {\n      onNodeView?.(nodeData);\n    }\n  }, [\n    canResume,\n    canStart,\n    nodeData,\n    onNodeAttempt,\n    onNodeView,\n    renderOptions,\n    sheetLocked,\n    teacherMarkedAsCompleted,\n  ]);\n\n  const handleOnMouseEnter = useCallback(() => {\n    if (sheetLocked) return;\n    animationRef.current?.play();\n  }, [sheetLocked]);\n\n  const handleOnMouseLeave = useCallback(() => {\n    animationRef.current?.stop();\n  }, []);\n\n  const menuOptions: INodeMenuOption[] = [\n    {\n      id: 'node-card-review',\n      label: 'Review',\n      icon: Eye2Icon,\n      disabled: !canReview,\n      onClick: handleOnMenuOptionClick,\n    },\n    {\n      id: 'node-card-reattempt',\n      label: 'Reattempt',\n      icon: RedoIcon,\n      disabled: !canReset,\n      onClick: handleOnMenuOptionClick,\n    },\n  ];\n\n  return (\n    <ContextMenu\n      targetElement={\n        <Styled.NodeCardContainer\n          $showOutline={!showCardAnimation}\n          $background={`${imageHue}_2`}\n          $disabled={sheetLocked}\n          onClick={handleOnNodeCardClick}\n        >\n          <ArrowTooltip\n            renderAs=\"primary\"\n            tooltipItem={sheetStatement}\n            position=\"bottom\"\n            zIndex={5}\n            hidden={!sheetStatement}\n            parentWidth=\"100%\"\n            widthX={11.25}\n          >\n            <Styled.NodeCardInfoWrapper\n              $flexDirection=\"row\"\n              $alignItems=\"center\"\n              $heightX={3.5}\n              $bgImage={nodeBgImage}\n              $gutterX={0.78125}\n              $flexGap={8.5}\n              $opacity={sheetLocked ? 0.5 : 1}\n              onMouseEnter={handleOnMouseEnter}\n              onMouseLeave={handleOnMouseLeave}\n            >\n              <Styled.IconWrapper\n                $width={31}\n                $height={31}\n                $background=\"WHITE_1\"\n                $position=\"relative\"\n                $alignItems=\"center\"\n                $justifyContent=\"center\"\n              >\n                <LottieAnimation\n                  src={nodeCardLottie}\n                  ref={animationRef}\n                  settings={renderSettings}\n                />\n                {!isOptional && <Styled.StyledImportantIcon />}\n              </Styled.IconWrapper>\n\n              <Text $renderAs=\"ac4-black\" $color=\"BLACK\">\n                {cardHeader} {inClassSheet && `• CW`}\n              </Text>\n              {showCardAnimation && <BorderPathAnimation borderColor=\"BLACK_1\" borderWidth={1} />}\n            </Styled.NodeCardInfoWrapper>\n\n            <NodeCardTags\n              nodeType={nodeType}\n              state={state}\n              accuracy={accuracy}\n              isStudent={isStudent}\n            />\n\n            {!isGoalBlock && (\n              <Styled.NodeCardContentWrapper $background=\"WHITE_1\" $heightX={4}>\n                <Styled.NodeCardTitle\n                  $renderAs=\"ab3\"\n                  $color=\"BLACK_1\"\n                  $opacity={sheetLocked ? 0.5 : 1}\n                >\n                  {title}\n                </Styled.NodeCardTitle>\n              </Styled.NodeCardContentWrapper>\n            )}\n          </ArrowTooltip>\n        </Styled.NodeCardContainer>\n      }\n      startLeft\n      menuWidth=\"100%\"\n      menuZIndex={6}\n      menuOffset={2}\n      menuElement={renderOptions ? <NodeMenuOptions options={menuOptions} /> : <></>}\n    />\n  );\n});\n\nexport default StudentActions;\n"],"names":["renderSettings","StudentActions","memo","props","nodeData","imageHue","blockType","onNodeAttempt","onNodeReattempt","onNodeReview","onNodeView","isStudent","accuracy","attemptLocation","nodeType","cardHeader","title","state","isOptional","sheetStatement","permissions","teacherMarkedAsCompleted","canReview","canStart","canResume","canReset","isGoalBlock","BLOCK_TYPE","sheetLocked","NODE_CARD_STATES","sheetNotStarted","sheetInProgress","inClassSheet","canStartOrResume","showCardAnimation","renderOptions","animationRef","useRef","nodeBgImage","getNodeTypeBasedBgImage","nodeCardLottie","getNodeCardBasedIcon","handleOnMenuOptionClick","useCallback","optionId","handleOnNodeCardClick","handleOnMouseEnter","_a","handleOnMouseLeave","menuOptions","Eye2Icon","RedoIcon","jsx","ContextMenu","Styled.NodeCardContainer","jsxs","ArrowTooltip","Styled.NodeCardInfoWrapper","Styled.IconWrapper","LottieAnimation","Styled.StyledImportantIcon","Text","BorderPathAnimation","NodeCardTags","Styled.NodeCardContentWrapper","Styled.NodeCardTitle","NodeMenuOptions","Fragment"],"mappings":"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"}