@cuemath/leap 2.9.1 → 2.9.2-as1

package/dist/features/homework/hw-card-list/hw-card-list.js

@@ -0,0 +1,182 @@
+import { jsxs as s, jsx as t, Fragment as J } from "react/jsx-runtime";
+import { useRef as D, useState as a, useCallback as n, useEffect as d } from "react";
+import ee from "../../../assets/line-icons/icons/chevron-left.js";
+import te from "../../../assets/line-icons/icons/chevron-right.js";
+import { getTopicsFromItems as oe } from "../../milestone/milestone-tests/tests-list/test-sheets-list/test-sheet-item/test-sheet-item-utils.js";
+import g from "../../ui/layout/flex-view.js";
+import $ from "../../ui/text/text.js";
+import re from "../homework-card.js";
+import { useGetHomeworks as ne } from "./api/get-homeworks.js";
+import { ContentWrapper as ie, HoverZone as k, ScrollButton as b, ScrollContainer as le, QueueWrapper as se, QueueText as ce } from "./hw-card-list-styled.js";
+const he = ({
+  userType: _ = "STUDENT",
+  studentId: f,
+  stream: p,
+  onTestStart: w,
+  onNodeAttempt: R,
+  onTestPreview: A,
+  onNodeView: E,
+  onTestReview: S,
+  onNodeReview: x,
+  onNodeUnassign: I
+}) => {
+  const r = D(null), [T, v] = a(!1), [y, C] = a(!1), [B, W] = a(!1), [N, j] = a(!0), {
+    get: L,
+    data: e,
+    isProcessingFailed: F,
+    isProcessing: u,
+    isStale: H
+  } = ne(f), K = n(() => {
+    r.current && r.current.scrollBy({ left: -200, behavior: "smooth" });
+  }, []), M = n(() => {
+    r.current && r.current.scrollBy({ left: 200, behavior: "smooth" });
+  }, []), G = n(() => {
+    v(!0);
+  }, []), P = n(() => {
+    v(!1);
+  }, []), Q = n(() => {
+    C(!0);
+  }, []), X = n(() => {
+    C(!1);
+  }, []), i = n(() => {
+    if (r.current) {
+      const { scrollLeft: o, scrollWidth: l, clientWidth: m } = r.current;
+      W(o > 10), j(o < l - m - 10);
+    }
+  }, []);
+  d(() => {
+    const o = r.current;
+    if (o)
+      return o.addEventListener("scroll", i), i(), () => {
+        o.removeEventListener("scroll", i);
+      };
+  }, [i]), d(() => {
+    i();
+  }, [e, i]);
+  const c = n(() => {
+    L(f, void 0, { stream: p });
+  }, [L, p, f]);
+  d(() => {
+    !u && H && c();
+  }, [c, u, H]), d(() => {
+    c();
+  }, [c]);
+  const O = ((e == null ? void 0 : e.filter((o) => o.state === "WAIT_FOR_REVIEW")) || []).length;
+  return e && e.length === 0 ? /* @__PURE__ */ s(g, { $flexRowGapX: 1, children: [
+    /* @__PURE__ */ s($, { $renderAs: "ac4-black", $color: "BLACK_T_60", children: [
+      "Homework (",
+      e == null ? void 0 : e.length,
+      ")"
+    ] }),
+    /* @__PURE__ */ t($, { $renderAs: "ab2", $color: "BLACK_T_60", children: "No Homework assigned yet" })
+  ] }) : F ? null : /* @__PURE__ */ s(ie, { $flexRowGapX: 1, $disablePointerEvents: u, children: [
+    /* @__PURE__ */ s($, { $renderAs: "ac4-black", $color: "BLACK_T_60", children: [
+      "Homework (",
+      O,
+      "/",
+      e == null ? void 0 : e.length,
+      ")"
+    ] }),
+    /* @__PURE__ */ s(g, { $position: "relative", onMouseEnter: i, children: [
+      B && /* @__PURE__ */ t(
+        k,
+        {
+          $position: "absolute",
+          $width: "60px",
+          left: "0",
+          right: "auto",
+          onMouseEnter: G,
+          onMouseLeave: P,
+          children: /* @__PURE__ */ t(
+            b,
+            {
+              $position: "absolute",
+              $background: "BLACK_T_60",
+              $justifyContent: "center",
+              $alignItems: "center",
+              $height: "100%",
+              onClick: K,
+              $visible: T,
+              left: "0px",
+              right: "auto",
+              children: /* @__PURE__ */ t(ee, { width: 24, height: 24 })
+            }
+          )
+        },
+        "left-hover-zone"
+      ),
+      /* @__PURE__ */ t(le, { ref: r, children: /* @__PURE__ */ t(g, { $flexDirection: "row", $flexGapX: 1, children: e == null ? void 0 : e.map((o, l) => {
+        const {
+          items: m,
+          node_id: V,
+          worksheet_id: z,
+          node_type: U,
+          title: Y,
+          subtext: Z
+        } = o, q = oe(m).join(", "), h = U === "DYNAMIC";
+        return /* @__PURE__ */ s(J, { children: [
+          e.length > 10 && l === 10 && /* @__PURE__ */ t(
+            se,
+            {
+              $widthX: 9.5,
+              $background: "BLACK_4",
+              $justifyContent: "center",
+              $gutter: 4,
+              $gap: 8,
+              children: /* @__PURE__ */ t(ce, { $renderAs: "ac3", $color: "WHITE", children: "In Queue" })
+            }
+          ),
+          /* @__PURE__ */ t(
+            re,
+            {
+              isInQueue: e.length > 10 && l > 9,
+              userType: _,
+              header: h ? q : Y,
+              subHeader: Z || "",
+              nodeData: o,
+              renderAs: "homework",
+              onNodeAttempt: h ? w : R,
+              shouldOpenOnRight: e.length > 3 && l === e.length - 1,
+              onNodeView: h ? A : E,
+              onNodeReview: h ? S : x,
+              onNodeUnassign: I
+            },
+            `${z}_${V}_${l}`
+          )
+        ] });
+      }) }) }),
+      N && /* @__PURE__ */ t(
+        k,
+        {
+          $position: "absolute",
+          $width: "60px",
+          right: "0",
+          left: "auto",
+          onMouseEnter: Q,
+          onMouseLeave: X,
+          children: /* @__PURE__ */ t(
+            b,
+            {
+              $position: "absolute",
+              $width: "60px",
+              $height: "100%",
+              $background: "BLACK_T_60",
+              $justifyContent: "center",
+              $alignItems: "center",
+              onClick: M,
+              $visible: y,
+              left: "auto",
+              right: "0px",
+              children: /* @__PURE__ */ t(te, { width: 24, height: 24 })
+            }
+          )
+        },
+        "right-hover-zone"
+      )
+    ] })
+  ] });
+}, He = he;
+export {
+  He as default
+};
+//# sourceMappingURL=hw-card-list.js.map

package/dist/features/homework/hw-card-list/hw-card-list.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"hw-card-list.js","sources":["../../../../src/features/homework/hw-card-list/hw-card-list.tsx"],"sourcesContent":["import type {\n  INodeCardCallbacks,\n  INodeDataProps,\n} from '../../chapters-v2/comps/node-card/node-card-types';\nimport type { TUserTypes } from '../../ui/types';\n\nimport React, { useCallback, useEffect, useRef, useState } from 'react';\n\nimport ChevronLeftIcon from '../../../assets/line-icons/icons/chevron-left';\nimport ChevronRightIcon from '../../../assets/line-icons/icons/chevron-right';\nimport { getTopicsFromItems } from '../../milestone/milestone-tests/tests-list/test-sheets-list/test-sheet-item/test-sheet-item-utils';\nimport FlexView from '../../ui/layout/flex-view';\nimport Text from '../../ui/text/text';\nimport HomeworkCard from '../homework-card';\nimport { useGetHomeworks } from './api/get-homeworks';\nimport * as Styled from './hw-card-list-styled';\n\ninterface HWCardListProps extends INodeCardCallbacks {\n  userType: TUserTypes;\n  studentId: string;\n  stream: string;\n  onTestPreview?: (sheetData: INodeDataProps, milestoneId?: string) => void;\n  onTestStart?: (sheetData: INodeDataProps) => void;\n  onTestReview?: (sheetData: INodeDataProps, milestoneId?: string) => void;\n}\n\nconst HWCardList: React.FC<HWCardListProps> = ({\n  userType = 'STUDENT',\n  studentId,\n  stream,\n  onTestStart,\n  onNodeAttempt,\n  onTestPreview,\n  onNodeView,\n  onTestReview,\n  onNodeReview,\n  onNodeUnassign,\n}) => {\n  const scrollRef = useRef<HTMLDivElement>(null);\n  const [isLeftHovered, setIsLeftHovered] = useState(false);\n  const [isRightHovered, setIsRightHovered] = useState(false);\n  const [canScrollLeft, setCanScrollLeft] = useState(false);\n  const [canScrollRight, setCanScrollRight] = useState(true);\n  const {\n    get: getHomeworks,\n    data: hwDetails,\n    isProcessingFailed,\n    isProcessing,\n    isStale,\n  } = useGetHomeworks(studentId);\n\n  const handleScrollLeft = useCallback(() => {\n    if (scrollRef.current) {\n      scrollRef.current.scrollBy({ left: -200, behavior: 'smooth' });\n    }\n  }, []);\n\n  const handleScrollRight = useCallback(() => {\n    if (scrollRef.current) {\n      scrollRef.current.scrollBy({ left: 200, behavior: 'smooth' });\n    }\n  }, []);\n\n  const handleLeftHoverEnter = useCallback(() => {\n    setIsLeftHovered(true);\n  }, []);\n\n  const handleLeftHoverLeave = useCallback(() => {\n    setIsLeftHovered(false);\n  }, []);\n\n  const handleRightHoverEnter = useCallback(() => {\n    setIsRightHovered(true);\n  }, []);\n\n  const handleRightHoverLeave = useCallback(() => {\n    setIsRightHovered(false);\n  }, []);\n\n  const checkScrollPosition = useCallback(() => {\n    if (scrollRef.current) {\n      const { scrollLeft, scrollWidth, clientWidth } = scrollRef.current;\n\n      setCanScrollLeft(scrollLeft > 10);\n      setCanScrollRight(scrollLeft < scrollWidth - clientWidth - 10);\n    }\n  }, []);\n\n  useEffect(() => {\n    const scrollElement = scrollRef.current;\n\n    if (scrollElement) {\n      scrollElement.addEventListener('scroll', checkScrollPosition);\n      checkScrollPosition();\n\n      return () => {\n        scrollElement.removeEventListener('scroll', checkScrollPosition);\n      };\n    }\n  }, [checkScrollPosition]);\n\n  // Also check when content changes\n  useEffect(() => {\n    checkScrollPosition();\n  }, [hwDetails, checkScrollPosition]);\n\n  const fetchHomeworks = useCallback(() => {\n    getHomeworks(studentId, undefined, { stream });\n  }, [getHomeworks, stream, studentId]);\n\n  useEffect(() => {\n    if (!isProcessing && isStale) {\n      fetchHomeworks();\n    }\n  }, [fetchHomeworks, isProcessing, isStale]);\n\n  useEffect(() => {\n    fetchHomeworks();\n  }, [fetchHomeworks]);\n\n  const waitForReviewSheets = (hwDetails?.filter(sheet => sheet.state === 'WAIT_FOR_REVIEW') || [])\n    .length;\n\n  if (hwDetails && hwDetails.length === 0) {\n    return (\n      <FlexView $flexRowGapX={1}>\n        <Text $renderAs=\"ac4-black\" $color=\"BLACK_T_60\">\n          Homework ({hwDetails?.length})\n        </Text>\n        <Text $renderAs=\"ab2\" $color=\"BLACK_T_60\">\n          No Homework assigned yet\n        </Text>\n      </FlexView>\n    );\n  }\n\n  if (isProcessingFailed) {\n    return null;\n  }\n\n  return (\n    <Styled.ContentWrapper $flexRowGapX={1} $disablePointerEvents={isProcessing}>\n      <Text $renderAs=\"ac4-black\" $color=\"BLACK_T_60\">\n        Homework ({waitForReviewSheets}/{hwDetails?.length})\n      </Text>\n      <FlexView $position=\"relative\" onMouseEnter={checkScrollPosition}>\n        {/* Left hover zone */}\n        {canScrollLeft && (\n          <Styled.HoverZone\n            key=\"left-hover-zone\"\n            $position=\"absolute\"\n            $width=\"60px\"\n            left=\"0\"\n            right=\"auto\"\n            onMouseEnter={handleLeftHoverEnter}\n            onMouseLeave={handleLeftHoverLeave}\n          >\n            {/* Left scroll button - only visible when hovered */}\n            <Styled.ScrollButton\n              $position=\"absolute\"\n              $background=\"BLACK_T_60\"\n              $justifyContent=\"center\"\n              $alignItems=\"center\"\n              $height=\"100%\"\n              onClick={handleScrollLeft}\n              $visible={isLeftHovered}\n              left=\"0px\"\n              right=\"auto\"\n            >\n              <ChevronLeftIcon width={24} height={24} />\n            </Styled.ScrollButton>\n          </Styled.HoverZone>\n        )}\n\n        <Styled.ScrollContainer ref={scrollRef}>\n          <FlexView $flexDirection=\"row\" $flexGapX={1}>\n            {hwDetails?.map((sheet, idx) => {\n              const {\n                items,\n                node_id: nodeId,\n                worksheet_id: worksheetId,\n                node_type: nodeType,\n                title,\n                subtext,\n              } = sheet;\n              const topics = getTopicsFromItems(items);\n              const testChapterName = topics.join(', ');\n              const isDynamicSheet = nodeType === 'DYNAMIC';\n\n              return (\n                <>\n                  {hwDetails.length > 10 && idx === 10 && (\n                    <Styled.QueueWrapper\n                      $widthX={9.5}\n                      $background=\"BLACK_4\"\n                      $justifyContent=\"center\"\n                      $gutter={4}\n                      $gap={8}\n                    >\n                      <Styled.QueueText $renderAs=\"ac3\" $color=\"WHITE\">\n                        In Queue\n                      </Styled.QueueText>\n                    </Styled.QueueWrapper>\n                  )}\n                  <HomeworkCard\n                    isInQueue={hwDetails.length > 10 && idx > 9}\n                    key={`${worksheetId}_${nodeId}_${idx}`}\n                    userType={userType}\n                    header={isDynamicSheet ? testChapterName : title}\n                    subHeader={subtext || ''}\n                    nodeData={sheet}\n                    renderAs=\"homework\"\n                    onNodeAttempt={isDynamicSheet ? onTestStart : onNodeAttempt}\n                    shouldOpenOnRight={hwDetails.length > 3 && idx === hwDetails.length - 1}\n                    onNodeView={isDynamicSheet ? onTestPreview : onNodeView}\n                    onNodeReview={isDynamicSheet ? onTestReview : onNodeReview}\n                    onNodeUnassign={onNodeUnassign}\n                  />\n                </>\n              );\n            })}\n          </FlexView>\n        </Styled.ScrollContainer>\n\n        {/* Right hover zone */}\n        {canScrollRight && (\n          <Styled.HoverZone\n            key=\"right-hover-zone\"\n            $position=\"absolute\"\n            $width=\"60px\"\n            right=\"0\"\n            left=\"auto\"\n            onMouseEnter={handleRightHoverEnter}\n            onMouseLeave={handleRightHoverLeave}\n          >\n            {/* Right scroll button - only visible when hovered */}\n            <Styled.ScrollButton\n              $position=\"absolute\"\n              $width=\"60px\"\n              $height=\"100%\"\n              $background=\"BLACK_T_60\"\n              $justifyContent=\"center\"\n              $alignItems=\"center\"\n              onClick={handleScrollRight}\n              $visible={isRightHovered}\n              left=\"auto\"\n              right=\"0px\"\n            >\n              <ChevronRightIcon width={24} height={24} />\n            </Styled.ScrollButton>\n          </Styled.HoverZone>\n        )}\n      </FlexView>\n    </Styled.ContentWrapper>\n  );\n};\n\nexport default HWCardList;\n"],"names":["HWCardList","userType","studentId","stream","onTestStart","onNodeAttempt","onTestPreview","onNodeView","onTestReview","onNodeReview","onNodeUnassign","scrollRef","useRef","isLeftHovered","setIsLeftHovered","useState","isRightHovered","setIsRightHovered","canScrollLeft","setCanScrollLeft","canScrollRight","setCanScrollRight","getHomeworks","hwDetails","isProcessingFailed","isProcessing","isStale","useGetHomeworks","handleScrollLeft","useCallback","handleScrollRight","handleLeftHoverEnter","handleLeftHoverLeave","handleRightHoverEnter","handleRightHoverLeave","checkScrollPosition","scrollLeft","scrollWidth","clientWidth","useEffect","scrollElement","fetchHomeworks","waitForReviewSheets","sheet","jsxs","FlexView","Text","Styled.ContentWrapper","jsx","Styled.HoverZone","Styled.ScrollButton","ChevronLeftIcon","Styled.ScrollContainer","idx","items","nodeId","worksheetId","nodeType","title","subtext","testChapterName","getTopicsFromItems","isDynamicSheet","Fragment","Styled.QueueWrapper","Styled.QueueText","HomeworkCard","ChevronRightIcon","HWCardList$1"],"mappings":"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"}

package/dist/features/homework/node-progress.js

@@ -0,0 +1,29 @@
+import { jsx as t } from "react/jsx-runtime";
+import { memo as m } from "react";
+import a from "styled-components";
+import n from "../ui/layout/flex-view.js";
+import { differenceInDays as e } from "../../node_modules/date-fns/differenceInDays.js";
+const g = a(n)`
+  height: 100%;
+  border-radius: 4px;
+  transition: all 300ms;
+  width: ${(r) => r.progress}%;
+`, d = a(n)`
+  position: absolute;
+  top: -1px;
+  right: 0px;
+  width: 100%;
+  height: 2px;
+  background-color: ${(r) => r.theme.colors.BLACK};
+  z-index: 2;
+`, l = ({ unlockedOn: r, dueDate: i, progressBg: c }) => {
+  const p = (() => {
+    const o = e(i, r), s = e(/* @__PURE__ */ new Date(), r);
+    return s > o ? 100 : Math.min(Math.max(s / o * 100, 0), 100);
+  })();
+  return /* @__PURE__ */ t(d, { children: /* @__PURE__ */ t(g, { progress: p, $background: c }) });
+}, y = m(l);
+export {
+  y as default
+};
+//# sourceMappingURL=node-progress.js.map

package/dist/features/homework/node-progress.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"node-progress.js","sources":["../../../src/features/homework/node-progress.tsx"],"sourcesContent":["import type { TColorNames } from '../ui/types';\n\nimport { differenceInDays } from 'date-fns';\nimport React, { memo } from 'react';\nimport styled from 'styled-components';\n\nimport FlexView from '../ui/layout/flex-view';\n\ninterface NodeProgressProps {\n  unlockedOn: number | string | Date;\n  dueDate: number | string | Date;\n  progressBg: TColorNames;\n}\n\nconst ProgressBar = styled(FlexView)<{ progress: number }>`\n  height: 100%;\n  border-radius: 4px;\n  transition: all 300ms;\n  width: ${props => props.progress}%;\n`;\n\nconst ProgressContainer = styled(FlexView)`\n  position: absolute;\n  top: -1px;\n  right: 0px;\n  width: 100%;\n  height: 2px;\n  background-color: ${props => props.theme.colors.BLACK};\n  z-index: 2;\n`;\n\nconst NodeProgress: React.FC<NodeProgressProps> = ({ unlockedOn, dueDate, progressBg }) => {\n  const calculateProgress = () => {\n    const totalDays = differenceInDays(dueDate, unlockedOn);\n    const daysElapsed = differenceInDays(new Date(), unlockedOn);\n\n    if (daysElapsed > totalDays) return 100;\n\n    const progress = Math.min(Math.max((daysElapsed / totalDays) * 100, 0), 100);\n\n    return progress;\n  };\n\n  const progress = calculateProgress();\n\n  return (\n    <ProgressContainer>\n      <ProgressBar progress={progress} $background={progressBg} />\n    </ProgressContainer>\n  );\n};\n\nexport default memo(NodeProgress);\n"],"names":["ProgressBar","styled","FlexView","props","ProgressContainer","NodeProgress","unlockedOn","dueDate","progressBg","progress","totalDays","differenceInDays","daysElapsed","jsx","NodeProgress$1","memo"],"mappings":";;;;;AAcA,MAAMA,IAAcC,EAAOC,CAAQ;AAAA;AAAA;AAAA;AAAA,WAIxB,CAAAC,MAASA,EAAM,QAAQ;AAAA,GAG5BC,IAAoBH,EAAOC,CAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,sBAMnB,CAASC,MAAAA,EAAM,MAAM,OAAO,KAAK;AAAA;AAAA,GAIjDE,IAA4C,CAAC,EAAE,YAAAC,GAAY,SAAAC,GAAS,YAAAC,QAAiB;AAYzF,QAAMC,KAXoB,MAAM;AACxB,UAAAC,IAAYC,EAAiBJ,GAASD,CAAU,GAChDM,IAAcD,EAAqB,oBAAA,QAAQL,CAAU;AAEvD,WAAAM,IAAcF,IAAkB,MAEnB,KAAK,IAAI,KAAK,IAAKE,IAAcF,IAAa,KAAK,CAAC,GAAG,GAAG;AAAA,EAEpE;AAKT,2BACGN,GACC,EAAA,UAAA,gBAAAS,EAACb,KAAY,UAAAS,GAAoB,aAAaD,EAAY,CAAA,EAC5D,CAAA;AAEJ,GAEeM,IAAAC,EAAKV,CAAY;"}

package/dist/features/homework/styles.js

@@ -0,0 +1,130 @@
+import r from "styled-components";
+import n from "../../assets/line-icons/icons/minus2.js";
+import e from "../ui/layout/flex-view.js";
+import i from "../ui/text/text.js";
+const l = r(e)(({ theme: o }) => `
+    cursor: pointer;
+    width: 24px;
+    height: 24px;
+    
+    
+    &:hover {
+      border-radius: 50%;
+      background: ${o.colors.WHITE_5}; 
+    }
+  `), d = r(i)`
+  display: -webkit-box;
+  -webkit-line-clamp: 1;
+  -webkit-box-orient: vertical;
+  overflow: hidden;
+  text-overflow: ellipsis;
+`, u = r(e)(({
+  $shouldopenonright: o,
+  $visible: t
+}) => `
+    cursor: pointer;
+    position: absolute;
+    z-index: 6;
+    top: calc(100% + 4px);
+    right: ${o ? 0 : "auto"};
+    transform-origin: top;
+    transform: scaleY(${t ? 1 : 0});
+    opacity: ${t ? 1 : 0};
+    transition: transform 0.2s ease-in-out, opacity 0.2s ease-in-out;
+    box-shadow: 0px 6px 12px 0px rgba(0, 0, 0, 0.4);
+    z-index: 10;
+  `), x = r(e)`
+  border: 1px solid ${({ theme: o }) => o.colors.BLACK_T_15};
+
+  &:hover {
+    border: 1px solid ${({ theme: o }) => o.colors.BLACK};
+  }
+`, b = r(e)(({ $bgImage: o }) => o ? `
+      background-image: url(${o});
+      background-repeat: no-repeat;
+      background-size: cover;
+      background-position: center;
+      overflow: hidden;
+    ` : "overflow: hidden;"), h = r(e)`
+  display: flex;
+  align-items: center;
+  justify-content: center;
+`, w = r(e)`
+  position: absolute;
+  right: -18px;
+  top: -4px;
+`, f = r.img(({ theme: o }) => {
+  const { gutter: t } = o.layout;
+  return `
+    border: 1px solid ${o.colors.BLACK_T_15};
+    width: ${t * 4}px;
+    height: ${t * 4}px;
+    border-radius: 50%;
+  `;
+}), g = r(n)`
+  path {
+    stroke: ${({ theme: o }) => o.colors.WHITE};
+  }
+`, m = r(i)`
+  display: -webkit-box;
+  -webkit-line-clamp: 2;
+  -webkit-box-orient: vertical;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: break-spaces;
+`;
+r(e)``;
+const k = r(e)(({
+  theme: o,
+  $disabled: t
+}) => `
+    cursor: ${t ? "not-allowed" : "pointer"};
+    
+    &:hover {
+      background: ${t ? "transparent" : o.colors.BLACK};
+    };
+    
+    path {
+      fill: ${o.colors.WHITE_1};
+    }
+  `), v = r(i)`
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+`, C = r(e)`
+  position: absolute;
+  z-index: 6;
+  top: calc(100% - 36px);
+  right: 12px;
+  transform-origin: top;
+  transform: scaleY(1);
+`, $ = r(e)`
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  opacity: 0.5;
+`, y = r(e)`
+  position: absolute;
+  right: 42px;
+  top: 24px;
+`;
+export {
+  f as BannerImage,
+  w as BannerImageWrapper,
+  $ as BlurContainer,
+  y as BlurFlexView,
+  x as CardContainer,
+  l as CardKebabMenuWrapper,
+  u as CardMenuOptionsWrapper,
+  k as CardOptionWrapper,
+  b as CardWrapper,
+  m as HeaderText,
+  h as IconWrapper,
+  C as MenuWrapper,
+  v as OptionText,
+  g as StyledMinus2Icon,
+  d as SubHeaderText
+};
+//# sourceMappingURL=styles.js.map

package/dist/features/homework/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles.js","sources":["../../../src/features/homework/styles.ts"],"sourcesContent":["import styled from 'styled-components';\n\nimport Minus2Icon from '../../assets/line-icons/icons/minus2';\nimport FlexView from '../ui/layout/flex-view';\nimport Text from '../ui/text/text';\n\ninterface ICardWrapperProps {\n  $bgImage: string;\n}\ninterface ICardOptionsMenuWrapperProps {\n  $visible: boolean;\n  $shouldopenonright: boolean;\n}\n\nexport const CardKebabMenuWrapper = styled(FlexView)(({ theme }) => {\n  return `\n    cursor: pointer;\n    width: 24px;\n    height: 24px;\n    \n    \n    &:hover {\n      border-radius: 50%;\n      background: ${theme.colors.WHITE_5}; \n    }\n  `;\n});\n\nexport const SubHeaderText = styled(Text)`\n  display: -webkit-box;\n  -webkit-line-clamp: 1;\n  -webkit-box-orient: vertical;\n  overflow: hidden;\n  text-overflow: ellipsis;\n`;\n\nexport const CardMenuOptionsWrapper = styled(FlexView)<ICardOptionsMenuWrapperProps>(({\n  $shouldopenonright,\n  $visible,\n}) => {\n  return `\n    cursor: pointer;\n    position: absolute;\n    z-index: 6;\n    top: calc(100% + 4px);\n    right: ${$shouldopenonright ? 0 : 'auto'};\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    box-shadow: 0px 6px 12px 0px rgba(0, 0, 0, 0.4);\n    z-index: 10;\n  `;\n});\n\nexport const CardContainer = styled(FlexView)`\n  border: 1px solid ${({ theme }) => theme.colors.BLACK_T_15};\n\n  &:hover {\n    border: 1px solid ${({ theme }) => theme.colors.BLACK};\n  }\n`;\n\nexport const CardWrapper = styled(FlexView)<ICardWrapperProps>(({ $bgImage }) => {\n  if ($bgImage) {\n    return `\n      background-image: url(${$bgImage});\n      background-repeat: no-repeat;\n      background-size: cover;\n      background-position: center;\n      overflow: hidden;\n    `;\n  }\n\n  return 'overflow: hidden;';\n});\n\nexport const IconWrapper = styled(FlexView)`\n  display: flex;\n  align-items: center;\n  justify-content: center;\n`;\n\nexport const BannerImageWrapper = styled(FlexView)`\n  position: absolute;\n  right: -18px;\n  top: -4px;\n`;\n\nexport const BannerImage = styled.img(({ theme }) => {\n  const { gutter } = theme.layout;\n\n  return `\n    border: 1px solid ${theme.colors.BLACK_T_15};\n    width: ${gutter * 4}px;\n    height: ${gutter * 4}px;\n    border-radius: 50%;\n  `;\n});\n\nexport const StyledMinus2Icon = styled(Minus2Icon)`\n  path {\n    stroke: ${({ theme }) => theme.colors.WHITE};\n  }\n`;\n\nexport const HeaderText = styled(Text)`\n  display: -webkit-box;\n  -webkit-line-clamp: 2;\n  -webkit-box-orient: vertical;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: break-spaces;\n`;\n\ninterface ICardOptionWrapperProps {\n  $disabled?: boolean;\n}\ninterface ICardOptionsProps {\n  $top: number;\n  $left: number;\n}\n\nexport const CardOptions = styled(FlexView)<ICardOptionsProps>``;\n\nexport const CardOptionWrapper = styled(FlexView)<ICardOptionWrapperProps>(({\n  theme,\n  $disabled,\n}) => {\n  return `\n    cursor: ${$disabled ? 'not-allowed' : 'pointer'};\n    \n    &:hover {\n      background: ${$disabled ? 'transparent' : theme.colors.BLACK};\n    };\n    \n    path {\n      fill: ${theme.colors.WHITE_1};\n    }\n  `;\n});\n\nexport const OptionText = styled(Text)`\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n`;\n\nexport const MenuWrapper = styled(FlexView)`\n  position: absolute;\n  z-index: 6;\n  top: calc(100% - 36px);\n  right: 12px;\n  transform-origin: top;\n  transform: scaleY(1);\n`;\n\nexport const BlurContainer = styled(FlexView)`\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  opacity: 0.5;\n`;\n\nexport const BlurFlexView = styled(FlexView)`\n  position: absolute;\n  right: 42px;\n  top: 24px;\n`;\n"],"names":["CardKebabMenuWrapper","styled","FlexView","theme","SubHeaderText","Text","CardMenuOptionsWrapper","$shouldopenonright","$visible","CardContainer","CardWrapper","$bgImage","IconWrapper","BannerImageWrapper","BannerImage","gutter","StyledMinus2Icon","Minus2Icon","HeaderText","CardOptionWrapper","$disabled","OptionText","MenuWrapper","BlurContainer","BlurFlexView"],"mappings":";;;;AAcO,MAAMA,IAAuBC,EAAOC,CAAQ,EAAE,CAAC,EAAE,OAAAC,QAC/C;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,oBAQWA,EAAM,OAAO,OAAO;AAAA;AAAA,GAGvC,GAEYC,IAAgBH,EAAOI,CAAI;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAQ3BC,IAAyBL,EAAOC,CAAQ,EAAgC,CAAC;AAAA,EACpF,oBAAAK;AAAA,EACA,UAAAC;AACF,MACS;AAAA;AAAA;AAAA;AAAA;AAAA,aAKID,IAAqB,IAAI,MAAM;AAAA;AAAA,wBAEpBC,IAAW,IAAI,CAAC;AAAA,eACzBA,IAAW,IAAI,CAAC;AAAA;AAAA;AAAA;AAAA,GAK9B,GAEYC,IAAgBR,EAAOC,CAAQ;AAAA,sBACtB,CAAC,EAAE,OAAAC,EAAA,MAAYA,EAAM,OAAO,UAAU;AAAA;AAAA;AAAA,wBAGpC,CAAC,EAAE,OAAAA,EAAA,MAAYA,EAAM,OAAO,KAAK;AAAA;AAAA,GAI5CO,IAAcT,EAAOC,CAAQ,EAAqB,CAAC,EAAE,UAAAS,QAC5DA,IACK;AAAA,8BACmBA,CAAQ;AAAA;AAAA;AAAA;AAAA;AAAA,QAQ7B,mBACR,GAEYC,IAAcX,EAAOC,CAAQ;AAAA;AAAA;AAAA;AAAA,GAM7BW,IAAqBZ,EAAOC,CAAQ;AAAA;AAAA;AAAA;AAAA,GAMpCY,IAAcb,EAAO,IAAI,CAAC,EAAE,OAAAE,QAAY;AAC7C,QAAA,EAAE,QAAAY,EAAO,IAAIZ,EAAM;AAElB,SAAA;AAAA,wBACeA,EAAM,OAAO,UAAU;AAAA,aAClCY,IAAS,CAAC;AAAA,cACTA,IAAS,CAAC;AAAA;AAAA;AAGxB,CAAC,GAEYC,IAAmBf,EAAOgB,CAAU;AAAA;AAAA,cAEnC,CAAC,EAAE,OAAAd,EAAA,MAAYA,EAAM,OAAO,KAAK;AAAA;AAAA,GAIlCe,IAAajB,EAAOI,CAAI;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAiBVJ,EAAOC,CAAQ;AAEnC,MAAMiB,IAAoBlB,EAAOC,CAAQ,EAA2B,CAAC;AAAA,EAC1E,OAAAC;AAAA,EACA,WAAAiB;AACF,MACS;AAAA,cACKA,IAAY,gBAAgB,SAAS;AAAA;AAAA;AAAA,oBAG/BA,IAAY,gBAAgBjB,EAAM,OAAO,KAAK;AAAA;AAAA;AAAA;AAAA,cAIpDA,EAAM,OAAO,OAAO;AAAA;AAAA,GAGjC,GAEYkB,IAAapB,EAAOI,CAAI;AAAA;AAAA;AAAA;AAAA,GAMxBiB,IAAcrB,EAAOC,CAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAS7BqB,IAAgBtB,EAAOC,CAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAS/BsB,IAAevB,EAAOC,CAAQ;AAAA;AAAA;AAAA;AAAA;"}

package/dist/features/milestone/create/api/goal-submit.js

@@ -1,5 +1,5 @@
 import { createPostAPI as t } from "@cuemath/rest-api";
-import { BASE_URL_V3_1 as e } from "../../../../constants/api.js";
+import { BASE_URL_V3_2 as e } from "../../../../constants/api.js";
 const { usePost: i } = t({
   getURL: (s, { studentId: o }) => `${e}/users/${o}/milestones/`
 });

package/dist/features/milestone/create/api/goal-submit.js.map

@@ -1 +1 @@
-{"version":3,"file":"goal-submit.js","sources":["../../../../../src/features/milestone/create/api/goal-submit.ts"],"sourcesContent":["import type { TMilestonePayload } from '../milestone-create-types';\n\nimport { createPostAPI } from '@cuemath/rest-api';\n\nimport { BASE_URL_V3_1 } from '../../../../constants/api';\n\nconst { usePost: useGoalCreationPost } = createPostAPI<\n  { id: string },\n  TMilestonePayload,\n  { studentId: string }\n>({\n  getURL: (_, { studentId }) => `${BASE_URL_V3_1}/users/${studentId}/milestones/`,\n});\n\nexport { useGoalCreationPost };\n"],"names":["useGoalCreationPost","createPostAPI","_","studentId","BASE_URL_V3_1"],"mappings":";;AAMA,MAAM,EAAE,SAASA,EAAoB,IAAIC,EAIvC;AAAA,EACA,QAAQ,CAACC,GAAG,EAAE,WAAAC,EAAgB,MAAA,GAAGC,CAAa,UAAUD,CAAS;AACnE,CAAC;"}
+{"version":3,"file":"goal-submit.js","sources":["../../../../../src/features/milestone/create/api/goal-submit.ts"],"sourcesContent":["import type { TMilestonePayload } from '../milestone-create-types';\n\nimport { createPostAPI } from '@cuemath/rest-api';\n\nimport { BASE_URL_V3_2 } from '../../../../constants/api';\n\nconst { usePost: useGoalCreationPost } = createPostAPI<\n  { id: string },\n  TMilestonePayload,\n  { studentId: string }\n>({\n  getURL: (_, { studentId }) => `${BASE_URL_V3_2}/users/${studentId}/milestones/`,\n});\n\nexport { useGoalCreationPost };\n"],"names":["useGoalCreationPost","createPostAPI","_","studentId","BASE_URL_V3_2"],"mappings":";;AAMA,MAAM,EAAE,SAASA,EAAoB,IAAIC,EAIvC;AAAA,EACA,QAAQ,CAACC,GAAG,EAAE,WAAAC,EAAgB,MAAA,GAAGC,CAAa,UAAUD,CAAS;AACnE,CAAC;"}

package/dist/features/milestone/create/comps/chapter-item/chapter-item.js

@@ -1,75 +1,68 @@
 import { jsxs as n, jsx as t } from "react/jsx-runtime";
-import { memo as G, useState as L, useRef as N, useCallback as p } from "react";
-import { SHEET_STATE as c } from "../../../../sheets/constants/sheet.js";
-import O from "../../../../ui/arrow-tooltip/arrow-tooltip.js";
-import X from "../../../../ui/hooks/use-context-menu-click-handler.js";
-import j from "../../../../ui/image/image.js";
+import { memo as B, useState as G, useRef as L, useCallback as s } from "react";
+import { SHEET_STATE as p } from "../../../../sheets/constants/sheet.js";
+import N from "../../../../ui/arrow-tooltip/arrow-tooltip.js";
+import O from "../../../../ui/hooks/use-context-menu-click-handler.js";
+import X from "../../../../ui/image/image.js";
 import w from "../../../../ui/layout/flex-view.js";
-import F from "../sheets-list/sheets-list.js";
-import { ChapterInfoWrapper as K, ChapterInfoIcon as P, SheetsListWrapper as U, ChapterListWrapper as q, ChapterProgressSVG as z, ChapterProgressSVGCircle as _, StyledText as A } from "./chapter-item-styled.js";
-const J = [
+import j from "../sheets-list/sheets-list.js";
+import { ChapterInfoWrapper as F, ChapterInfoIcon as K, SheetsListWrapper as P, ChapterListWrapper as U, ChapterProgressSVG as q, ChapterProgressSVGCircle as A, StyledText as E } from "./chapter-item-styled.js";
+const z = [
   "STARTED",
-  c.FAMILIAR,
-  c.PROFICIENT,
-  c.MASTERED
-], le = G((E) => {
-  const { chapterData: x, onChapterItemClick: h, isThisPrimaryChapter: R, showChapterTags: k, canAddChapter: l } = E, {
+  p.FAMILIAR,
+  p.PROFICIENT,
+  p.MASTERED
+], ie = B((_) => {
+  const { chapterData: x, onChapterItemClick: h, isThisPrimaryChapter: R, showChapterTags: k, canAddChapter: l } = _, {
     name: d,
-    image_url: y,
+    image_url: W,
     added: m,
     learning_sheet_data: g,
-    total_supplementary_sheets: W,
     id: f,
     chapter_tags: H,
     state: a
-  } = x, M = a && J.includes(a) && g.length > 0, u = a === "MASTERED", [e, C] = L(null), i = N(null), V = p(() => {
-    var I;
-    const { current: T } = i;
-    if (T) {
-      const r = (I = T.children[0]) == null ? void 0 : I.getBoundingClientRect();
+  } = x, M = a && z.includes(a) && g.length > 0, u = a === "MASTERED", [e, C] = G(null), i = L(null), V = s(() => {
+    var b;
+    const { current: I } = i;
+    if (I) {
+      const r = (b = I.children[0]) == null ? void 0 : b.getBoundingClientRect();
       if (r) {
-        const B = window.innerWidth, b = window.innerHeight, o = {};
-        r.left + 296 < B ? o.left = r.left : o.left = r.left + 20 - 296, r.top + 252 < b ? o.top = r.top + 20 : o.bottom = b - r.top + 8, Object.keys(o).length && C({ ...o });
+        const v = window.innerWidth, S = window.innerHeight, o = {};
+        r.left + 296 < v ? o.left = r.left : o.left = r.left + 20 - 296, r.top + 252 < S ? o.top = r.top + 20 : o.bottom = S - r.top + 8, Object.keys(o).length && C({ ...o });
       }
     }
   }, [C, i]), {
-    menuVisible: s,
+    menuVisible: c,
     onMenuClick: $,
-    hideMenu: S
-  } = X(i, V), D = p(() => {
-    s ? S() : $();
-  }, [$, S, s]), v = p(() => {
+    hideMenu: T
+  } = O(i, V), y = s(() => {
+    c ? T() : $();
+  }, [$, T, c]), D = s(() => {
     if (!l) return null;
     h(f);
   }, [l, f, h]);
   return /* @__PURE__ */ n(w, { $flexGap: 4, $position: "relative", children: [
-    /* @__PURE__ */ n(K, { ref: i, onClick: D, children: [
-      /* @__PURE__ */ t(P, { className: "goal-chapter-info-icon" }),
-      s && /* @__PURE__ */ t(
-        U,
+    /* @__PURE__ */ n(F, { ref: i, onClick: y, children: [
+      /* @__PURE__ */ t(K, { className: "goal-chapter-info-icon" }),
+      c && /* @__PURE__ */ t(
+        P,
         {
           $top: e == null ? void 0 : e.top,
           $left: e == null ? void 0 : e.left,
           $bottom: e == null ? void 0 : e.bottom,
-          children: /* @__PURE__ */ t(
-            F,
-            {
-              learningSheetData: g,
-              supplementarySheetsCount: W
-            }
-          )
+          children: /* @__PURE__ */ t(j, { learningSheetData: g })
         }
       )
     ] }),
     /* @__PURE__ */ t(
-      O,
+      N,
       {
         position: "bottom",
         renderAs: "primary",
         tooltipItem: "Duplicates can’t be added",
         hidden: !R,
         children: /* @__PURE__ */ n(
-          q,
+          U,
           {
             $widthX: 9.5,
             $heightX: 8.875,
@@ -81,13 +74,13 @@ const J = [
             $selectable: l,
             $borderColor: m ? "BLACK_T_87" : "WHITE_5",
             $background: m ? "WHITE_3" : "WHITE_1",
-            onClick: v,
+            onClick: D,
             children: [
               /* @__PURE__ */ n(w, { $position: "relative", children: [
-                M && /* @__PURE__ */ n(z, { width: "62px", height: "62px", children: [
-                  /* @__PURE__ */ t(_, { $progress: 0, r: "30", cx: "31", cy: "31" }),
+                M && /* @__PURE__ */ n(q, { width: "62px", height: "62px", children: [
+                  /* @__PURE__ */ t(A, { $progress: 0, r: "30", cx: "31", cy: "31" }),
                   /* @__PURE__ */ t(
-                    _,
+                    A,
                     {
                       $progressCircle: !0,
                       $progressBackground: u ? "GREEN_5" : "BLACK",
@@ -99,9 +92,9 @@ const J = [
                   )
                 ] }),
                 /* @__PURE__ */ t(
-                  j,
+                  X,
                   {
-                    src: y || "",
+                    src: W || "",
                     alt: d,
                     withLoader: !0,
                     width: 56,
@@ -110,16 +103,16 @@ const J = [
                   }
                 )
               ] }),
-              /* @__PURE__ */ t(A, { $renderAs: "ab3", $align: "center", children: d })
+              /* @__PURE__ */ t(E, { $renderAs: "ab3", $align: "center", children: d })
             ]
           }
         )
       }
     ),
-    k && /* @__PURE__ */ t(A, { $renderAs: "ab3", $lineClampNo: 1, $color: "BLACK_T_60", children: H })
+    k && /* @__PURE__ */ t(E, { $renderAs: "ab3", $lineClampNo: 1, $color: "BLACK_T_60", children: H })
   ] });
 });
 export {
-  le as default
+  ie as default
 };
 //# sourceMappingURL=chapter-item.js.map

package/dist/features/milestone/create/comps/chapter-item/chapter-item.js.map

@@ -1 +1 @@
-{"version":3,"file":"chapter-item.js","sources":["../../../../../../src/features/milestone/create/comps/chapter-item/chapter-item.tsx"],"sourcesContent":["import type { IChapterItem, ISheetsListPosition } from './chapter-item-types';\nimport type { FC } from 'react';\n\nimport { memo, useCallback, useRef, useState } from 'react';\n\nimport { SHEET_STATE } from '../../../../sheets/constants/sheet';\nimport ArrowTooltip from '../../../../ui/arrow-tooltip/arrow-tooltip';\nimport useContextMenuClickHandler from '../../../../ui/hooks/use-context-menu-click-handler';\nimport Image from '../../../../ui/image/image';\nimport FlexView from '../../../../ui/layout/flex-view';\nimport SheetsList from '../sheets-list/sheets-list';\nimport * as Styled from './chapter-item-styled';\n\nconst progressVisibleStates = [\n  'STARTED',\n  SHEET_STATE.FAMILIAR,\n  SHEET_STATE.PROFICIENT,\n  SHEET_STATE.MASTERED,\n];\n\nconst ChapterItemV2: FC<IChapterItem> = memo(props => {\n  const { chapterData, onChapterItemClick, isThisPrimaryChapter, showChapterTags, canAddChapter } =\n    props;\n  const {\n    name,\n    image_url: imageUrl,\n    added,\n    learning_sheet_data: learningSheetData,\n    total_supplementary_sheets: totalSupplementarySheets,\n    id: chapterId,\n    chapter_tags: chapterTags,\n    state,\n  } = chapterData;\n\n  const showProgress =\n    state && progressVisibleStates.includes(state) && learningSheetData.length > 0;\n  const isMastered = state === 'MASTERED';\n\n  const [sheetsListPositionCoordinates, setSheetsListPositionCoordinates] =\n    useState<ISheetsListPosition | null>(null);\n  const containerRef = useRef<HTMLDivElement>(null);\n\n  const handleSetCoordinates = useCallback(() => {\n    const { current } = containerRef;\n\n    if (current) {\n      const boundingClientRect = current.children[0]?.getBoundingClientRect();\n\n      if (boundingClientRect) {\n        const viewportWidth = window.innerWidth;\n        const viewportHeight = window.innerHeight;\n\n        const positions: ISheetsListPosition = {};\n\n        //* 288 (Width of card) + 8 (left position) = 296\n        if (boundingClientRect.left + 296 < viewportWidth) {\n          positions.left = boundingClientRect.left;\n        } else {\n          positions.left = boundingClientRect.left + 20 - 296;\n        }\n\n        //* 252 (Max height of card)\n        if (boundingClientRect.top + 252 < viewportHeight) {\n          positions.top = boundingClientRect.top + 20;\n        } else {\n          positions.bottom = viewportHeight - boundingClientRect.top + 8;\n        }\n\n        if (Object.keys(positions).length) {\n          setSheetsListPositionCoordinates({ ...positions });\n        }\n      }\n    }\n  }, [setSheetsListPositionCoordinates, containerRef]);\n\n  const {\n    menuVisible,\n    onMenuClick: onMenuClick,\n    hideMenu,\n  } = useContextMenuClickHandler(containerRef, handleSetCoordinates);\n\n  const handleOnSheetsView = useCallback(() => {\n    if (!menuVisible) {\n      onMenuClick();\n    } else {\n      hideMenu();\n    }\n  }, [onMenuClick, hideMenu, menuVisible]);\n\n  const handleOnChapterItemClick = useCallback(() => {\n    if (!canAddChapter) return null;\n\n    onChapterItemClick(chapterId);\n  }, [canAddChapter, chapterId, onChapterItemClick]);\n\n  return (\n    <FlexView $flexGap={4} $position=\"relative\">\n      <Styled.ChapterInfoWrapper ref={containerRef} onClick={handleOnSheetsView}>\n        <Styled.ChapterInfoIcon className=\"goal-chapter-info-icon\" />\n        {menuVisible && (\n          <Styled.SheetsListWrapper\n            $top={sheetsListPositionCoordinates?.top}\n            $left={sheetsListPositionCoordinates?.left}\n            $bottom={sheetsListPositionCoordinates?.bottom}\n          >\n            <SheetsList\n              learningSheetData={learningSheetData}\n              supplementarySheetsCount={totalSupplementarySheets}\n            />\n          </Styled.SheetsListWrapper>\n        )}\n      </Styled.ChapterInfoWrapper>\n\n      <ArrowTooltip\n        position=\"bottom\"\n        renderAs=\"primary\"\n        tooltipItem=\"Duplicates can’t be added\"\n        hidden={!isThisPrimaryChapter}\n      >\n        <Styled.ChapterListWrapper\n          $widthX={9.5}\n          $heightX={8.875}\n          $gapX={1}\n          $gutterX={1}\n          $flexGap={12}\n          $position=\"relative\"\n          $alignItems=\"center\"\n          $selectable={canAddChapter}\n          $borderColor={added ? 'BLACK_T_87' : 'WHITE_5'}\n          $background={added ? 'WHITE_3' : 'WHITE_1'}\n          onClick={handleOnChapterItemClick}\n        >\n          <FlexView $position=\"relative\">\n            {showProgress && (\n              <Styled.ChapterProgressSVG width=\"62px\" height=\"62px\">\n                <Styled.ChapterProgressSVGCircle $progress={0} r=\"30\" cx=\"31\" cy=\"31\" />\n                <Styled.ChapterProgressSVGCircle\n                  $progressCircle\n                  $progressBackground={isMastered ? 'GREEN_5' : 'BLACK'}\n                  $progress={isMastered ? 360 : 95}\n                  r=\"30\"\n                  cx=\"31\"\n                  cy=\"31\"\n                />\n              </Styled.ChapterProgressSVG>\n            )}\n            <Image\n              src={imageUrl || ''}\n              alt={name}\n              withLoader\n              width={56}\n              height={56}\n              borderRadius={50}\n            />\n          </FlexView>\n\n          <Styled.StyledText $renderAs=\"ab3\" $align=\"center\">\n            {name}\n          </Styled.StyledText>\n        </Styled.ChapterListWrapper>\n      </ArrowTooltip>\n\n      {showChapterTags && (\n        <Styled.StyledText $renderAs=\"ab3\" $lineClampNo={1} $color=\"BLACK_T_60\">\n          {chapterTags}\n        </Styled.StyledText>\n      )}\n    </FlexView>\n  );\n});\n\nexport default ChapterItemV2;\n"],"names":["progressVisibleStates","SHEET_STATE","ChapterItemV2","memo","props","chapterData","onChapterItemClick","isThisPrimaryChapter","showChapterTags","canAddChapter","name","imageUrl","added","learningSheetData","totalSupplementarySheets","chapterId","chapterTags","state","showProgress","isMastered","sheetsListPositionCoordinates","setSheetsListPositionCoordinates","useState","containerRef","useRef","handleSetCoordinates","useCallback","current","boundingClientRect","_a","viewportWidth","viewportHeight","positions","menuVisible","onMenuClick","hideMenu","useContextMenuClickHandler","handleOnSheetsView","handleOnChapterItemClick","jsxs","FlexView","Styled.ChapterInfoWrapper","jsx","Styled.ChapterInfoIcon","Styled.SheetsListWrapper","SheetsList","ArrowTooltip","Styled.ChapterListWrapper","Styled.ChapterProgressSVG","Styled.ChapterProgressSVGCircle","Image","Styled.StyledText"],"mappings":"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"}
+{"version":3,"file":"chapter-item.js","sources":["../../../../../../src/features/milestone/create/comps/chapter-item/chapter-item.tsx"],"sourcesContent":["import type { IChapterItem, ISheetsListPosition } from './chapter-item-types';\nimport type { FC } from 'react';\n\nimport { memo, useCallback, useRef, useState } from 'react';\n\nimport { SHEET_STATE } from '../../../../sheets/constants/sheet';\nimport ArrowTooltip from '../../../../ui/arrow-tooltip/arrow-tooltip';\nimport useContextMenuClickHandler from '../../../../ui/hooks/use-context-menu-click-handler';\nimport Image from '../../../../ui/image/image';\nimport FlexView from '../../../../ui/layout/flex-view';\nimport SheetsList from '../sheets-list/sheets-list';\nimport * as Styled from './chapter-item-styled';\n\nconst progressVisibleStates = [\n  'STARTED',\n  SHEET_STATE.FAMILIAR,\n  SHEET_STATE.PROFICIENT,\n  SHEET_STATE.MASTERED,\n];\n\nconst ChapterItemV2: FC<IChapterItem> = memo(props => {\n  const { chapterData, onChapterItemClick, isThisPrimaryChapter, showChapterTags, canAddChapter } =\n    props;\n  const {\n    name,\n    image_url: imageUrl,\n    added,\n    learning_sheet_data: learningSheetData,\n    id: chapterId,\n    chapter_tags: chapterTags,\n    state,\n  } = chapterData;\n\n  const showProgress =\n    state && progressVisibleStates.includes(state) && learningSheetData.length > 0;\n  const isMastered = state === 'MASTERED';\n\n  const [sheetsListPositionCoordinates, setSheetsListPositionCoordinates] =\n    useState<ISheetsListPosition | null>(null);\n  const containerRef = useRef<HTMLDivElement>(null);\n\n  const handleSetCoordinates = useCallback(() => {\n    const { current } = containerRef;\n\n    if (current) {\n      const boundingClientRect = current.children[0]?.getBoundingClientRect();\n\n      if (boundingClientRect) {\n        const viewportWidth = window.innerWidth;\n        const viewportHeight = window.innerHeight;\n\n        const positions: ISheetsListPosition = {};\n\n        //* 288 (Width of card) + 8 (left position) = 296\n        if (boundingClientRect.left + 296 < viewportWidth) {\n          positions.left = boundingClientRect.left;\n        } else {\n          positions.left = boundingClientRect.left + 20 - 296;\n        }\n\n        //* 252 (Max height of card)\n        if (boundingClientRect.top + 252 < viewportHeight) {\n          positions.top = boundingClientRect.top + 20;\n        } else {\n          positions.bottom = viewportHeight - boundingClientRect.top + 8;\n        }\n\n        if (Object.keys(positions).length) {\n          setSheetsListPositionCoordinates({ ...positions });\n        }\n      }\n    }\n  }, [setSheetsListPositionCoordinates, containerRef]);\n\n  const {\n    menuVisible,\n    onMenuClick: onMenuClick,\n    hideMenu,\n  } = useContextMenuClickHandler(containerRef, handleSetCoordinates);\n\n  const handleOnSheetsView = useCallback(() => {\n    if (!menuVisible) {\n      onMenuClick();\n    } else {\n      hideMenu();\n    }\n  }, [onMenuClick, hideMenu, menuVisible]);\n\n  const handleOnChapterItemClick = useCallback(() => {\n    if (!canAddChapter) return null;\n\n    onChapterItemClick(chapterId);\n  }, [canAddChapter, chapterId, onChapterItemClick]);\n\n  return (\n    <FlexView $flexGap={4} $position=\"relative\">\n      <Styled.ChapterInfoWrapper ref={containerRef} onClick={handleOnSheetsView}>\n        <Styled.ChapterInfoIcon className=\"goal-chapter-info-icon\" />\n        {menuVisible && (\n          <Styled.SheetsListWrapper\n            $top={sheetsListPositionCoordinates?.top}\n            $left={sheetsListPositionCoordinates?.left}\n            $bottom={sheetsListPositionCoordinates?.bottom}\n          >\n            <SheetsList learningSheetData={learningSheetData} />\n          </Styled.SheetsListWrapper>\n        )}\n      </Styled.ChapterInfoWrapper>\n\n      <ArrowTooltip\n        position=\"bottom\"\n        renderAs=\"primary\"\n        tooltipItem=\"Duplicates can’t be added\"\n        hidden={!isThisPrimaryChapter}\n      >\n        <Styled.ChapterListWrapper\n          $widthX={9.5}\n          $heightX={8.875}\n          $gapX={1}\n          $gutterX={1}\n          $flexGap={12}\n          $position=\"relative\"\n          $alignItems=\"center\"\n          $selectable={canAddChapter}\n          $borderColor={added ? 'BLACK_T_87' : 'WHITE_5'}\n          $background={added ? 'WHITE_3' : 'WHITE_1'}\n          onClick={handleOnChapterItemClick}\n        >\n          <FlexView $position=\"relative\">\n            {showProgress && (\n              <Styled.ChapterProgressSVG width=\"62px\" height=\"62px\">\n                <Styled.ChapterProgressSVGCircle $progress={0} r=\"30\" cx=\"31\" cy=\"31\" />\n                <Styled.ChapterProgressSVGCircle\n                  $progressCircle\n                  $progressBackground={isMastered ? 'GREEN_5' : 'BLACK'}\n                  $progress={isMastered ? 360 : 95}\n                  r=\"30\"\n                  cx=\"31\"\n                  cy=\"31\"\n                />\n              </Styled.ChapterProgressSVG>\n            )}\n            <Image\n              src={imageUrl || ''}\n              alt={name}\n              withLoader\n              width={56}\n              height={56}\n              borderRadius={50}\n            />\n          </FlexView>\n\n          <Styled.StyledText $renderAs=\"ab3\" $align=\"center\">\n            {name}\n          </Styled.StyledText>\n        </Styled.ChapterListWrapper>\n      </ArrowTooltip>\n\n      {showChapterTags && (\n        <Styled.StyledText $renderAs=\"ab3\" $lineClampNo={1} $color=\"BLACK_T_60\">\n          {chapterTags}\n        </Styled.StyledText>\n      )}\n    </FlexView>\n  );\n});\n\nexport default ChapterItemV2;\n"],"names":["progressVisibleStates","SHEET_STATE","ChapterItemV2","memo","props","chapterData","onChapterItemClick","isThisPrimaryChapter","showChapterTags","canAddChapter","name","imageUrl","added","learningSheetData","chapterId","chapterTags","state","showProgress","isMastered","sheetsListPositionCoordinates","setSheetsListPositionCoordinates","useState","containerRef","useRef","handleSetCoordinates","useCallback","current","boundingClientRect","_a","viewportWidth","viewportHeight","positions","menuVisible","onMenuClick","hideMenu","useContextMenuClickHandler","handleOnSheetsView","handleOnChapterItemClick","jsxs","FlexView","Styled.ChapterInfoWrapper","jsx","Styled.ChapterInfoIcon","Styled.SheetsListWrapper","SheetsList","ArrowTooltip","Styled.ChapterListWrapper","Styled.ChapterProgressSVG","Styled.ChapterProgressSVGCircle","Image","Styled.StyledText"],"mappings":"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"}

package/dist/features/milestone/create/comps/chapters-selection-step/chapters-selection-step-styled.js

@@ -1,9 +1,17 @@
 import r from "styled-components";
-import p from "../../../../ui/layout/flex-view.js";
-const e = r(p)(({ theme: o }) => `
-    box-shadow: 0px 10px 20px 0px ${o.colors.BLACK_T_20};
+import o from "../../../../ui/layout/flex-view.js";
+const x = r(o)(({ theme: t }) => `
+    box-shadow: 0px 10px 20px 0px ${t.colors.BLACK_T_20};
+  `), n = r(o)(() => `
+    margin-left: auto;
+    
+    svg {
+      width: 24px;
+      height: 24px;
+    }
   `);
 export {
-  e as ButtonWrapper
+  n as BinIconWrapper,
+  x as ButtonWrapper
 };
 //# sourceMappingURL=chapters-selection-step-styled.js.map