@cuemath/leap 3.0.7-hg1 → 3.0.7

package/dist/features/milestone/create/milestone-create-hooks.js

@@ -0,0 +1,142 @@
+import { useState as P, useMemo as w, useRef as B, useCallback as N } from "react";
+import { TEST_TYPE_TO_TEST_NAME as v } from "../constants.js";
+import { checkIfCommittedFieldIsUpdated as k } from "../edit/goal-edit-helpers.js";
+import { GOAL_EDIT_FLOWS as p, BRANCHING_FIELDS as F } from "./milestone-create-constants.js";
+import W, { CHAPTERS_SELECTION_FORM_TREE as j, ADD_CUSTOM_CHAPTERS as H, SET_COMPLETION_DATE as y } from "./milestone-create-form-tree.js";
+import { appendSchoolDataToFormState as V, generateFormStateWithPrefilledSchoolData as Y, getCurrenStep as h, clearNextFields as q } from "./milestone-create-helpers.js";
+const $ = (l, {
+  schoolData: c,
+  board: t,
+  grade: r,
+  currentCountryCode: T,
+  flow: d
+}) => {
+  const [m, o] = P(() => l && p.includes(d) ? V(l, c, t, r) : {
+    ...Y(
+      c,
+      t,
+      r,
+      T
+    )
+  });
+  return { formDataState: m, setFormData: o };
+}, x = ({
+  flow: l,
+  formDataState: c,
+  isGoalCreation: t
+}) => {
+  const { testType: r } = c;
+  return w(() => {
+    if (p.includes(l) && r) {
+      const d = {
+        ...j,
+        isRootNode: !0,
+        title: v[r]
+      }, m = Object.assign({}, H), o = Object.assign({}, y);
+      return t || (m.buttonLabel = "Add to learning plan", d.buttonLabel = "Update"), l === "EDIT" && (o.buttonLabel = "Update goal"), (!t || r === "no-test") && (d.next = [m, o]), d;
+    }
+    return W;
+  }, [l, r, t]);
+}, a = ({
+  flow: l,
+  updatedFormTree: c,
+  formData: t,
+  formDataState: r,
+  setFormData: T,
+  handleExit: d
+}) => {
+  const m = B(r), o = (t == null ? void 0 : t.currentFlow) ?? l, i = w(
+    () => h(c, t, o),
+    [c, t, o]
+  ), O = i == null ? void 0 : i.name, b = !!(i != null && i.isRootNode), E = N(
+    (e) => {
+      T((s) => {
+        const S = s.testType;
+        if (p.includes(o)) {
+          const A = {
+            ...s.committed,
+            ...e.committed
+          }, C = [];
+          if (Object.entries((e == null ? void 0 : e.committed) || {}).forEach((R) => {
+            const n = R[0], U = !!R[1], M = e[n] ?? s[n];
+            if (k({
+              field: n,
+              isFieldCommited: U,
+              prevFormData: s,
+              newValueOfField: M,
+              formDataStateRef: m.current
+            })) {
+              let _ = [];
+              S && S === "no-test" && (_ = _.concat(["board"])), _.includes(n) || C.push(n);
+            }
+          }), C.length > 0 && C.some((n) => F.includes(n))) {
+            const n = q(
+              c,
+              s,
+              O,
+              b,
+              []
+            );
+            if (n)
+              return {
+                ...n,
+                ...e,
+                committed: {
+                  ...n.committed,
+                  ...e.committed
+                },
+                reviewed: {
+                  ...A
+                },
+                currentFlow: "CREATE"
+              };
+          }
+          return {
+            ...s,
+            ...e,
+            committed: {
+              ...s.committed,
+              ...e.committed
+            },
+            reviewed: A
+          };
+        }
+        const { committed: u, reviewed: f, ...L } = s;
+        return {
+          ...L,
+          ...e,
+          committed: {
+            ...u,
+            ...e.committed
+          },
+          reviewed: {}
+        };
+      });
+    },
+    [T, o, c, O, b]
+  ), I = N(() => {
+    if (i) {
+      const { reset: e, rollback: s, isRootNode: S } = i;
+      if (S) {
+        d == null || d();
+        return;
+      }
+      const u = {
+        committed: {},
+        reviewed: {}
+      };
+      p.includes(o) ? s.forEach((f) => {
+        u.reviewed[f] = void 0;
+      }) : e.forEach((f) => (u[f] = void 0, !0)), s.forEach((f) => {
+        u.committed[f] = void 0;
+      }), E(u);
+    }
+  }, [i, o, E, d]);
+  return { currentStep: i, updateFormData: E, handleBack: I };
+};
+export {
+  $ as useFormDataPrefiller,
+  a as useFormTreeTraversal,
+  x as useMilestoneFormTree
+};
+//# sourceMappingURL=milestone-create-hooks.js.map

package/dist/features/milestone/create/milestone-create-hooks.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"milestone-create-hooks.js","sources":["../../../../src/features/milestone/create/milestone-create-hooks.ts"],"sourcesContent":["import type IStudentSchool from '../../../types/models/school';\nimport type {\n  IFormStep,\n  IFormStepProps,\n  IMileStoneFormFields,\n  IMilestoneConfig,\n  IMilestoneFormData,\n  TMilestoneFormStateField,\n  TMilestoneFormFlow,\n} from './milestone-create-types';\n\nimport { useCallback, useMemo, useRef, useState } from 'react';\n\nimport { TEST_TYPE_TO_TEST_NAME } from '../constants';\nimport { checkIfCommittedFieldIsUpdated } from '../edit/goal-edit-helpers';\nimport { BRANCHING_FIELDS, GOAL_EDIT_FLOWS } from './milestone-create-constants';\nimport FORM_TREE, {\n  ADD_CUSTOM_CHAPTERS,\n  CHAPTERS_SELECTION_FORM_TREE,\n  SET_COMPLETION_DATE,\n} from './milestone-create-form-tree';\nimport {\n  appendSchoolDataToFormState,\n  clearNextFields,\n  generateFormStateWithPrefilledSchoolData,\n  getCurrenStep,\n} from './milestone-create-helpers';\n\n//TODO: right now it is for only one step, but should be for all steps in future if needed\nconst useFormDataPrefiller = (\n  formDataProp: IMilestoneFormData | undefined,\n  {\n    schoolData,\n    board,\n    grade,\n    currentCountryCode,\n    flow,\n  }: {\n    grade: string;\n    schoolData: IStudentSchool | undefined;\n    board: string | undefined;\n    config: IMilestoneConfig;\n    flow: TMilestoneFormFlow;\n    currentCountryCode?: string;\n  },\n) => {\n  const [formDataState, setFormData] = useState<IMilestoneFormData>(() => {\n    if (formDataProp && GOAL_EDIT_FLOWS.includes(flow)) {\n      return appendSchoolDataToFormState(formDataProp, schoolData, board, grade);\n    }\n\n    const formStateWithPrefilledSchoolData = generateFormStateWithPrefilledSchoolData(\n      schoolData,\n      board,\n      grade,\n      currentCountryCode,\n    );\n\n    return {\n      ...formStateWithPrefilledSchoolData,\n    };\n  });\n\n  return { formDataState, setFormData };\n};\n\n/**\n * Based on the flow returns the correct modified tree\n */\nconst useMilestoneFormTree = ({\n  flow,\n  formDataState,\n  isGoalCreation,\n}: {\n  flow: TMilestoneFormFlow;\n  formDataState: IMilestoneFormData;\n  isGoalCreation?: boolean;\n}) => {\n  const { testType } = formDataState;\n\n  const updatedFormTree: IFormStep = useMemo(() => {\n    if (GOAL_EDIT_FLOWS.includes(flow) && testType) {\n      const formTreeInfo = {\n        ...CHAPTERS_SELECTION_FORM_TREE,\n        isRootNode: true,\n        title: TEST_TYPE_TO_TEST_NAME[testType],\n      };\n\n      //* Creating a shallow copy as we need to change only first level element.\n      const addCustomChapter = Object.assign({}, ADD_CUSTOM_CHAPTERS);\n      const setCompletionDate = Object.assign({}, SET_COMPLETION_DATE);\n\n      //* To compensate existing milestones chapter addition.\n      if (!isGoalCreation) {\n        addCustomChapter.buttonLabel = 'Add to learning plan';\n        formTreeInfo.buttonLabel = 'Update';\n      }\n\n      if (flow === 'EDIT') {\n        setCompletionDate.buttonLabel = 'Update goal';\n      }\n\n      if (!isGoalCreation || testType === 'no-test') {\n        formTreeInfo.next = [addCustomChapter, setCompletionDate];\n      }\n\n      return formTreeInfo;\n    }\n\n    return FORM_TREE;\n  }, [flow, testType, isGoalCreation]);\n\n  return updatedFormTree;\n};\n\n/**\n * This hook holds the logic to run the traversal of the tree during different flows.\n * While most of the logic is same for all flows, DRAFT_EDIT and DRAFT_REVIEW flows require extra logic where a user can navigate back and forth steps without clearing data.\n * Internally, this hook uses a currentFlow variable which is initially set to the flow but changes to CREATE flow, when certain BRANCHING_FIELDS are edited.\n * BRANCHING_FIELDS are fields on edition of which the flow might change and hence the prefilled data, needs to be cleared.\n * @returns `currentStep` - the current step the tree should be at\n * @returns `updateFormData` - the method to update form data\n * @returns `handleBack` - the method to handle back navigation\n */\nconst useFormTreeTraversal = ({\n  flow,\n  updatedFormTree,\n  formData,\n  formDataState,\n  setFormData,\n  handleExit,\n}: {\n  flow: TMilestoneFormFlow;\n  updatedFormTree: IFormStep;\n  formData: IMilestoneFormData;\n  formDataState: IMilestoneFormData;\n  setFormData: React.Dispatch<React.SetStateAction<IMilestoneFormData>>;\n  handleExit?: () => void;\n}) => {\n  const formDataStateRef = useRef(formDataState);\n  const currentFlow = formData?.currentFlow ?? flow;\n\n  const currentStep = useMemo(\n    () => getCurrenStep(updatedFormTree, formData, currentFlow),\n    [updatedFormTree, formData, currentFlow],\n  );\n\n  const currentStepName = currentStep?.name;\n  const isCurrentStepRoot = Boolean(currentStep?.isRootNode);\n\n  const updateFormData = useCallback<IFormStepProps['onFormDataChange']>(\n    changedFormData => {\n      setFormData(prevFormData => {\n        const currentTestType = prevFormData.testType;\n\n        if (GOAL_EDIT_FLOWS.includes(currentFlow)) {\n          const updatedReviewed = {\n            ...prevFormData.committed,\n            ...changedFormData.committed,\n          };\n          const updatedFields: TMilestoneFormStateField[] = [];\n\n          Object.entries(changedFormData?.committed || {}).forEach(entry => {\n            const field = entry[0] as keyof IMileStoneFormFields;\n            const isFieldCommited = Boolean(entry[1]);\n            const newValueOfField = changedFormData[field] ?? prevFormData[field];\n\n            const isFieldUpdatedAndCommitted = checkIfCommittedFieldIsUpdated({\n              field,\n              isFieldCommited,\n              prevFormData,\n              newValueOfField,\n              formDataStateRef: formDataStateRef.current,\n            });\n\n            if (isFieldUpdatedAndCommitted) {\n              let exceptedFields: TMilestoneFormStateField[] = [];\n\n              if (currentTestType && currentTestType === 'no-test') {\n                exceptedFields = exceptedFields.concat(['board']);\n              }\n\n              if (!exceptedFields.includes(field)) {\n                updatedFields.push(field);\n              }\n            }\n          });\n\n          if (updatedFields.length > 0) {\n            const isBranchingFieldUpdated = updatedFields.some(field => {\n              return BRANCHING_FIELDS.includes(field);\n            });\n\n            if (isBranchingFieldUpdated) {\n              const updatedTree = clearNextFields(\n                updatedFormTree,\n                prevFormData,\n                currentStepName,\n                isCurrentStepRoot,\n                [],\n              );\n\n              if (updatedTree)\n                return {\n                  ...updatedTree,\n                  ...changedFormData,\n                  committed: {\n                    ...updatedTree.committed,\n                    ...changedFormData.committed,\n                  },\n                  reviewed: {\n                    ...updatedReviewed,\n                  },\n                  currentFlow: 'CREATE',\n                };\n            }\n          }\n\n          return {\n            ...prevFormData,\n            ...changedFormData,\n            committed: {\n              ...prevFormData.committed,\n              ...changedFormData.committed,\n            },\n            reviewed: updatedReviewed,\n          };\n        }\n\n        const { committed: prevFormCommitted, reviewed, ...fieldsData } = prevFormData;\n\n        return {\n          ...fieldsData,\n          ...changedFormData,\n          committed: {\n            ...prevFormCommitted,\n            ...changedFormData.committed,\n          },\n          reviewed: {},\n        };\n      });\n    },\n    [setFormData, currentFlow, updatedFormTree, currentStepName, isCurrentStepRoot],\n  );\n\n  const handleBack = useCallback(() => {\n    if (currentStep) {\n      const { reset, rollback, isRootNode } = currentStep;\n\n      if (isRootNode) {\n        handleExit?.();\n\n        return;\n      }\n\n      const data: IMilestoneFormData = {\n        committed: {},\n        reviewed: {},\n      };\n\n      if (!GOAL_EDIT_FLOWS.includes(currentFlow)) {\n        reset.forEach(field => {\n          data[field] = undefined;\n\n          return true;\n        });\n      } else {\n        rollback.forEach(field => {\n          data.reviewed[field] = undefined;\n        });\n      }\n      rollback.forEach(field => {\n        data.committed[field] = undefined;\n      });\n\n      updateFormData(data);\n    }\n  }, [currentStep, currentFlow, updateFormData, handleExit]);\n\n  return { currentStep, updateFormData, handleBack };\n};\n\nexport { useFormDataPrefiller, useFormTreeTraversal, useMilestoneFormTree };\n"],"names":["useFormDataPrefiller","formDataProp","schoolData","board","grade","currentCountryCode","flow","formDataState","setFormData","useState","GOAL_EDIT_FLOWS","appendSchoolDataToFormState","generateFormStateWithPrefilledSchoolData","useMilestoneFormTree","isGoalCreation","testType","useMemo","formTreeInfo","CHAPTERS_SELECTION_FORM_TREE","TEST_TYPE_TO_TEST_NAME","addCustomChapter","ADD_CUSTOM_CHAPTERS","setCompletionDate","SET_COMPLETION_DATE","FORM_TREE","useFormTreeTraversal","updatedFormTree","formData","handleExit","formDataStateRef","useRef","currentFlow","currentStep","getCurrenStep","currentStepName","isCurrentStepRoot","updateFormData","useCallback","changedFormData","prevFormData","currentTestType","updatedReviewed","updatedFields","entry","field","isFieldCommited","newValueOfField","checkIfCommittedFieldIsUpdated","exceptedFields","BRANCHING_FIELDS","updatedTree","clearNextFields","prevFormCommitted","reviewed","fieldsData","handleBack","reset","rollback","isRootNode","data"],"mappings":"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"}

package/dist/features/milestone/create/milestone-create-styled.js

@@ -0,0 +1,87 @@
+import r from "styled-components";
+import n from "../../ui/layout/flex-view.js";
+const d = r.div(
+  ({ $height: o, $viewMode: e, $minHeight: t }) => `
+  display: flex;
+  flex-direction: column;
+  height: ${o ? typeof o == "number" ? `${o}px` : `${o}` : "auto"};
+  min-height: ${t || "auto"};
+  ${e ? `
+        cursor: not-allowed;
+        border: 2px solid black;
+        border-radius: 8px;
+        transform: scale3d(.9943, .9900, 1);
+        & ${a} {
+          pointer-events: auto;
+        }
+      ` : ""}
+`
+), l = r.div(
+  ({ theme: o, $viewMode: e }) => `
+  position: relative;
+  display: flex;
+  flex-direction: column;
+  flex-grow: 1;
+  margin-bottom: ${o.layout.gutter * 0.5}px;
+  border-radius: ${o.layout.gutter * 0.75}px;
+  ${e ? `
+        pointer-events: none;
+        // opacity:  0.85;
+      ` : ""}
+`
+), a = r.div(({ $overflowHidden: o }) => `
+    flex-grow: 1;
+    overflow-y: auto;
+
+    ${o && "overflow: hidden"};
+  `), u = r(n)(({ theme: o }) => `
+    position: sticky;
+    top: 0;
+    z-index: 2;
+    border-bottom: 1px solid ${o.colors.WHITE_5};
+    border-top-left-radius: ${o.layout.gutter * 0.75}px;
+    border-top-right-radius: ${o.layout.gutter * 0.75}px;
+  `), x = r(n)(() => `
+      align-self: flex-end;
+      position: fixed;
+      bottom: 24px;
+      right: 24px;
+    `), c = r.img(({ theme: o, $backgroundColor: e }) => {
+  const {
+    layout: { gutter: t },
+    colors: i
+  } = o;
+  return `
+    width: ${t * 6}px;
+    height: ${t * 6}px;
+    background: ${i[e]};
+    border-radius: ${t * 0.5}px;
+  `;
+}), f = r(n)(({ theme: o, $viewMode: e }) => {
+  const {
+    layout: { gutter: t }
+  } = o;
+  return `
+    position:relative;
+    min-height:${t * 2.75}px;
+    ${e ? `
+          pointer-events: none;
+          opacity:  0.85;
+        ` : ""}
+`;
+}), y = r.div`
+  position: absolute;
+  left: 50%;
+  transform: translateX(-50%);
+`;
+export {
+  l as BodyContainer,
+  d as Container,
+  a as ContentContainer,
+  x as FooterWrapper,
+  u as HeaderContainer,
+  f as HeaderWrapper,
+  c as RadioCardIcon,
+  y as StepperWrapper
+};
+//# sourceMappingURL=milestone-create-styled.js.map

package/dist/features/milestone/create/milestone-create-styled.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"milestone-create-styled.js","sources":["../../../../src/features/milestone/create/milestone-create-styled.tsx"],"sourcesContent":["import type { TColorNames } from '../../ui/types';\n\nimport styled from 'styled-components';\n\nimport FlexView from '../../ui/layout/flex-view';\n\ninterface ContainerProps {\n  $height?: string | number;\n  $minHeight?: string;\n  $viewMode: boolean;\n}\n\nconst Container = styled.div<ContainerProps>(\n  ({ $height, $viewMode, $minHeight }) => `\n  display: flex;\n  flex-direction: column;\n  height: ${$height ? (typeof $height === 'number' ? `${$height}px` : `${$height}`) : 'auto'};\n  min-height: ${$minHeight ? $minHeight : 'auto'};\n  ${\n    $viewMode\n      ? `\n        cursor: not-allowed;\n        border: 2px solid black;\n        border-radius: 8px;\n        transform: scale3d(.9943, .9900, 1);\n        & ${ContentContainer} {\n          pointer-events: auto;\n        }\n      `\n      : ``\n  }\n`,\n);\n\nconst BodyContainer = styled.div<{ $viewMode?: boolean }>(\n  ({ theme, $viewMode }) => `\n  position: relative;\n  display: flex;\n  flex-direction: column;\n  flex-grow: 1;\n  margin-bottom: ${theme.layout.gutter * 0.5}px;\n  border-radius: ${theme.layout.gutter * 0.75}px;\n  ${\n    $viewMode\n      ? `\n        pointer-events: none;\n        // opacity:  0.85;\n      `\n      : ``\n  }\n`,\n);\n\ninterface IContentContainer {\n  $overflowHidden?: boolean;\n}\n\nconst ContentContainer = styled.div<IContentContainer>(({ $overflowHidden }) => {\n  return `\n    flex-grow: 1;\n    overflow-y: auto;\n\n    ${$overflowHidden && 'overflow: hidden'};\n  `;\n});\n\nconst HeaderContainer = styled(FlexView)(({ theme }) => {\n  return `\n    position: sticky;\n    top: 0;\n    z-index: 2;\n    border-bottom: 1px solid ${theme.colors.WHITE_5};\n    border-top-left-radius: ${theme.layout.gutter * 0.75}px;\n    border-top-right-radius: ${theme.layout.gutter * 0.75}px;\n  `;\n});\n\nconst FooterWrapper = styled(FlexView)(() => {\n  return `\n      align-self: flex-end;\n      position: fixed;\n      bottom: 24px;\n      right: 24px;\n    `;\n});\n\ninterface IRadioCardIconProps {\n  $backgroundColor: TColorNames;\n}\n\nconst RadioCardIcon = styled.img<IRadioCardIconProps>(({ theme, $backgroundColor }) => {\n  const {\n    layout: { gutter },\n    colors,\n  } = theme;\n\n  return `\n    width: ${gutter * 6}px;\n    height: ${gutter * 6}px;\n    background: ${colors[$backgroundColor]};\n    border-radius: ${gutter * 0.5}px;\n  `;\n});\n\nconst HeaderWrapper = styled(FlexView)<{ $viewMode?: boolean }>(({ theme, $viewMode }) => {\n  const {\n    layout: { gutter },\n  } = theme;\n\n  return `\n    position:relative;\n    min-height:${gutter * 2.75}px;\n    ${\n      $viewMode\n        ? `\n          pointer-events: none;\n          opacity:  0.85;\n        `\n        : ``\n    }\n`;\n});\n\nconst StepperWrapper = styled.div`\n  position: absolute;\n  left: 50%;\n  transform: translateX(-50%);\n`;\n\nexport {\n  Container,\n  BodyContainer,\n  ContentContainer,\n  HeaderContainer,\n  FooterWrapper,\n  RadioCardIcon,\n  StepperWrapper,\n  HeaderWrapper,\n};\n"],"names":["Container","styled","$height","$viewMode","$minHeight","ContentContainer","BodyContainer","theme","$overflowHidden","HeaderContainer","FlexView","FooterWrapper","RadioCardIcon","$backgroundColor","gutter","colors","HeaderWrapper","StepperWrapper"],"mappings":";;AAYA,MAAMA,IAAYC,EAAO;AAAA,EACvB,CAAC,EAAE,SAAAC,GAAS,WAAAC,GAAW,YAAAC,EAAiB,MAAA;AAAA;AAAA;AAAA,YAG9BF,IAAW,OAAOA,KAAY,WAAW,GAAGA,CAAO,OAAO,GAAGA,CAAO,KAAM,MAAM;AAAA,gBAC5EE,KAA0B,MAAM;AAAA,IAE5CD,IACI;AAAA;AAAA;AAAA;AAAA;AAAA,YAKIE,CAAgB;AAAA;AAAA;AAAA,UAIpB,EACN;AAAA;AAEF,GAEMC,IAAgBL,EAAO;AAAA,EAC3B,CAAC,EAAE,OAAAM,GAAO,WAAAJ,EAAA,MAAgB;AAAA;AAAA;AAAA;AAAA;AAAA,mBAKTI,EAAM,OAAO,SAAS,GAAG;AAAA,mBACzBA,EAAM,OAAO,SAAS,IAAI;AAAA,IAEzCJ,IACI;AAAA;AAAA;AAAA,UAIA,EACN;AAAA;AAEF,GAMME,IAAmBJ,EAAO,IAAuB,CAAC,EAAE,iBAAAO,QACjD;AAAA;AAAA;AAAA;AAAA,MAIHA,KAAmB,kBAAkB;AAAA,GAE1C,GAEKC,IAAkBR,EAAOS,CAAQ,EAAE,CAAC,EAAE,OAAAH,QACnC;AAAA;AAAA;AAAA;AAAA,+BAIsBA,EAAM,OAAO,OAAO;AAAA,8BACrBA,EAAM,OAAO,SAAS,IAAI;AAAA,+BACzBA,EAAM,OAAO,SAAS,IAAI;AAAA,GAExD,GAEKI,IAAgBV,EAAOS,CAAQ,EAAE,MAC9B;AAAA;AAAA;AAAA;AAAA;AAAA,KAMR,GAMKE,IAAgBX,EAAO,IAAyB,CAAC,EAAE,OAAAM,GAAO,kBAAAM,QAAuB;AAC/E,QAAA;AAAA,IACJ,QAAQ,EAAE,QAAAC,EAAO;AAAA,IACjB,QAAAC;AAAA,EACE,IAAAR;AAEG,SAAA;AAAA,aACIO,IAAS,CAAC;AAAA,cACTA,IAAS,CAAC;AAAA,kBACNC,EAAOF,CAAgB,CAAC;AAAA,qBACrBC,IAAS,GAAG;AAAA;AAEjC,CAAC,GAEKE,IAAgBf,EAAOS,CAAQ,EAA2B,CAAC,EAAE,OAAAH,GAAO,WAAAJ,QAAgB;AAClF,QAAA;AAAA,IACJ,QAAQ,EAAE,QAAAW,EAAO;AAAA,EACf,IAAAP;AAEG,SAAA;AAAA;AAAA,iBAEQO,IAAS,IAAI;AAAA,MAExBX,IACI;AAAA;AAAA;AAAA,YAIA,EACN;AAAA;AAEJ,CAAC,GAEKc,IAAiBhB,EAAO;AAAA;AAAA;AAAA;AAAA;"}

package/dist/features/milestone/create/milestone-create.js

@@ -0,0 +1,80 @@
+import { jsx as i } from "react/jsx-runtime";
+import { memo as y, useMemo as z, useCallback as A, useEffect as I } from "react";
+import J from "./milestone-create-components-map.js";
+import K from "./milestone-create-context.js";
+import { useFormDataPrefiller as L, useMilestoneFormTree as N, useFormTreeTraversal as Q } from "./milestone-create-hooks.js";
+import { Container as U, BodyContainer as W } from "./milestone-create-styled.js";
+const G = y(
+  ({
+    studentName: h,
+    studentId: x,
+    height: S,
+    minHeight: l,
+    formData: c,
+    config: a,
+    onChapterExitWarning: C,
+    onFormDataChange: e,
+    onPreSubmit: $,
+    onExit: b,
+    board: F,
+    schoolData: P,
+    grade: T,
+    flow: t,
+    milestoneId: k,
+    currentCountryCode: B,
+    isGoalCreation: d,
+    courseStream: E,
+    classRatio: V,
+    enrollmentType: u,
+    canDeleteGoal: j,
+    onDeleteGoal: r
+  }) => {
+    const { formDataState: s, setFormData: w } = L(c, {
+      schoolData: P,
+      board: F,
+      grade: T,
+      config: a,
+      flow: t,
+      currentCountryCode: B
+    }), H = N({
+      flow: t,
+      formDataState: s,
+      isGoalCreation: d
+    }), o = e ? s : c, m = e ? "edit" : "view", p = m === "view", { currentStep: n, updateFormData: O, handleBack: v } = Q({
+      flow: t,
+      updatedFormTree: H,
+      formData: o,
+      formDataState: s,
+      setFormData: w,
+      handleExit: b
+    }), { name: f } = n || {}, M = f ? J[f] : void 0, R = z(() => ({ handleBack: v, mode: m, flow: t }), [v, m, t]), q = A(() => {
+      r == null || r();
+    }, [r]);
+    return I(() => {
+      e && e(o);
+    }, [o, e]), /* @__PURE__ */ i(K.Provider, { value: R, children: /* @__PURE__ */ i(U, { $height: S, $minHeight: l, $viewMode: p, children: /* @__PURE__ */ i(W, { $viewMode: p, children: M && n && u ? /* @__PURE__ */ i(
+      M,
+      {
+        studentName: h,
+        currentStep: n,
+        isGoalCreation: d,
+        config: a,
+        formData: o,
+        onFormDataChange: O,
+        onChapterExitWarning: C,
+        studentId: x,
+        onPreSubmit: $,
+        milestoneId: k,
+        courseStream: E,
+        classRatio: V || 0,
+        enrollmentType: u,
+        canDeleteGoal: j,
+        onDeleteGoal: q
+      }
+    ) : void 0 }) }) });
+  }
+);
+export {
+  G as default
+};
+//# sourceMappingURL=milestone-create.js.map

package/dist/features/milestone/create/milestone-create.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"milestone-create.js","sources":["../../../../src/features/milestone/create/milestone-create.tsx"],"sourcesContent":["import type { MileStoneJourneyMode } from './milestone-create-context';\nimport type { IMileStoneCreateProps, IMilestoneFormData } from './milestone-create-types';\n\nimport React, { memo, useCallback, useEffect, useMemo } from 'react';\n\nimport ComponentsMap from './milestone-create-components-map';\nimport MilestoneCreateContext from './milestone-create-context';\nimport {\n  useFormDataPrefiller,\n  useFormTreeTraversal,\n  useMilestoneFormTree,\n} from './milestone-create-hooks';\nimport { BodyContainer, Container } from './milestone-create-styled';\n\nconst MilestoneCreate: React.FC<IMileStoneCreateProps> = memo(\n  ({\n    studentName,\n    studentId,\n    height,\n    minHeight,\n    formData: formDataProp,\n    config,\n    onChapterExitWarning,\n    onFormDataChange,\n    onPreSubmit: handlePreSubmit,\n    onExit: handleExit,\n    board,\n    schoolData,\n    grade,\n    flow,\n    milestoneId,\n    currentCountryCode,\n    isGoalCreation,\n    courseStream,\n    classRatio,\n    enrollmentType,\n    canDeleteGoal,\n    onDeleteGoal,\n  }) => {\n    const { formDataState, setFormData } = useFormDataPrefiller(formDataProp, {\n      schoolData,\n      board,\n      grade,\n      config,\n      flow,\n      currentCountryCode,\n    });\n\n    const updatedFormTree = useMilestoneFormTree({\n      flow,\n      formDataState,\n      isGoalCreation,\n    });\n\n    const formData = (onFormDataChange ? formDataState : formDataProp) as IMilestoneFormData; //TODO: make better\n\n    const mode: MileStoneJourneyMode = onFormDataChange ? 'edit' : 'view';\n    const isViewMode = mode === 'view';\n\n    const { currentStep, updateFormData, handleBack } = useFormTreeTraversal({\n      flow,\n      updatedFormTree,\n      formData,\n      formDataState,\n      setFormData,\n      handleExit,\n    });\n\n    const { name } = currentStep || {};\n    const StepComponent = name ? ComponentsMap[name] : undefined;\n\n    const contextValue = useMemo(() => ({ handleBack, mode, flow }), [handleBack, mode, flow]);\n\n    const handleOnDeleteGoal = useCallback(() => {\n      onDeleteGoal?.();\n    }, [onDeleteGoal]);\n\n    useEffect(() => {\n      if (onFormDataChange) {\n        onFormDataChange(formData);\n      }\n    }, [formData, onFormDataChange]);\n\n    return (\n      <MilestoneCreateContext.Provider value={contextValue}>\n        <Container $height={height} $minHeight={minHeight} $viewMode={isViewMode}>\n          <BodyContainer $viewMode={isViewMode}>\n            {StepComponent && currentStep && enrollmentType ? (\n              <StepComponent\n                studentName={studentName}\n                currentStep={currentStep}\n                isGoalCreation={isGoalCreation}\n                config={config}\n                formData={formData}\n                onFormDataChange={updateFormData}\n                onChapterExitWarning={onChapterExitWarning}\n                studentId={studentId}\n                onPreSubmit={handlePreSubmit}\n                milestoneId={milestoneId}\n                courseStream={courseStream}\n                classRatio={classRatio || 0}\n                enrollmentType={enrollmentType}\n                canDeleteGoal={canDeleteGoal}\n                onDeleteGoal={handleOnDeleteGoal}\n              />\n            ) : undefined}\n          </BodyContainer>\n        </Container>\n      </MilestoneCreateContext.Provider>\n    );\n  },\n);\n\nexport default MilestoneCreate;\n"],"names":["MilestoneCreate","memo","studentName","studentId","height","minHeight","formDataProp","config","onChapterExitWarning","onFormDataChange","handlePreSubmit","handleExit","board","schoolData","grade","flow","milestoneId","currentCountryCode","isGoalCreation","courseStream","classRatio","enrollmentType","canDeleteGoal","onDeleteGoal","formDataState","setFormData","useFormDataPrefiller","updatedFormTree","useMilestoneFormTree","formData","mode","isViewMode","currentStep","updateFormData","handleBack","useFormTreeTraversal","name","StepComponent","ComponentsMap","contextValue","useMemo","handleOnDeleteGoal","useCallback","useEffect","jsx","MilestoneCreateContext","Container","BodyContainer"],"mappings":";;;;;;AAcA,MAAMA,IAAmDC;AAAA,EACvD,CAAC;AAAA,IACC,aAAAC;AAAA,IACA,WAAAC;AAAA,IACA,QAAAC;AAAA,IACA,WAAAC;AAAA,IACA,UAAUC;AAAA,IACV,QAAAC;AAAA,IACA,sBAAAC;AAAA,IACA,kBAAAC;AAAA,IACA,aAAaC;AAAA,IACb,QAAQC;AAAA,IACR,OAAAC;AAAA,IACA,YAAAC;AAAA,IACA,OAAAC;AAAA,IACA,MAAAC;AAAA,IACA,aAAAC;AAAA,IACA,oBAAAC;AAAA,IACA,gBAAAC;AAAA,IACA,cAAAC;AAAA,IACA,YAAAC;AAAA,IACA,gBAAAC;AAAA,IACA,eAAAC;AAAA,IACA,cAAAC;AAAA,EAAA,MACI;AACJ,UAAM,EAAE,eAAAC,GAAe,aAAAC,MAAgBC,EAAqBpB,GAAc;AAAA,MACxE,YAAAO;AAAA,MACA,OAAAD;AAAA,MACA,OAAAE;AAAA,MACA,QAAAP;AAAA,MACA,MAAAQ;AAAA,MACA,oBAAAE;AAAA,IAAA,CACD,GAEKU,IAAkBC,EAAqB;AAAA,MAC3C,MAAAb;AAAA,MACA,eAAAS;AAAA,MACA,gBAAAN;AAAA,IAAA,CACD,GAEKW,IAAYpB,IAAmBe,IAAgBlB,GAE/CwB,IAA6BrB,IAAmB,SAAS,QACzDsB,IAAaD,MAAS,QAEtB,EAAE,aAAAE,GAAa,gBAAAC,GAAgB,YAAAC,EAAA,IAAeC,EAAqB;AAAA,MACvE,MAAApB;AAAA,MACA,iBAAAY;AAAA,MACA,UAAAE;AAAA,MACA,eAAAL;AAAA,MACA,aAAAC;AAAA,MACA,YAAAd;AAAA,IAAA,CACD,GAEK,EAAE,MAAAyB,EAAA,IAASJ,KAAe,IAC1BK,IAAgBD,IAAOE,EAAcF,CAAI,IAAI,QAE7CG,IAAeC,EAAQ,OAAO,EAAE,YAAAN,GAAY,MAAAJ,GAAM,MAAAf,EAAK,IAAI,CAACmB,GAAYJ,GAAMf,CAAI,CAAC,GAEnF0B,IAAqBC,EAAY,MAAM;AAC5B,MAAAnB,KAAA,QAAAA;AAAA,IAAA,GACd,CAACA,CAAY,CAAC;AAEjB,WAAAoB,EAAU,MAAM;AACd,MAAIlC,KACFA,EAAiBoB,CAAQ;AAAA,IAC3B,GACC,CAACA,GAAUpB,CAAgB,CAAC,GAG7B,gBAAAmC,EAACC,EAAuB,UAAvB,EAAgC,OAAON,GACtC,UAAA,gBAAAK,EAACE,KAAU,SAAS1C,GAAQ,YAAYC,GAAW,WAAW0B,GAC5D,UAAC,gBAAAa,EAAAG,GAAA,EAAc,WAAWhB,GACvB,UAAAM,KAAiBL,KAAeX,IAC/B,gBAAAuB;AAAA,MAACP;AAAA,MAAA;AAAA,QACC,aAAAnC;AAAA,QACA,aAAA8B;AAAA,QACA,gBAAAd;AAAA,QACA,QAAAX;AAAA,QACA,UAAAsB;AAAA,QACA,kBAAkBI;AAAA,QAClB,sBAAAzB;AAAA,QACA,WAAAL;AAAA,QACA,aAAaO;AAAA,QACb,aAAAM;AAAA,QACA,cAAAG;AAAA,QACA,YAAYC,KAAc;AAAA,QAC1B,gBAAAC;AAAA,QACA,eAAAC;AAAA,QACA,cAAcmB;AAAA,MAAA;AAAA,IAChB,IACE,OACN,CAAA,EACF,CAAA,EACF,CAAA;AAAA,EAEJ;AACF;"}

package/dist/features/milestone/create/styled-comps/progressive-loader.js

@@ -0,0 +1,24 @@
+import e, { keyframes as t, css as a } from "styled-components";
+import r from "../../../ui/layout/flex-view.js";
+const s = t`
+  from {
+    opacity: 0;
+  }
+
+  to {
+    opacity: 1;
+  }
+  `, f = e(r)(
+  ({ $stepNumber: i, $disabled: o = !1 }) => a`
+    opacity: ${o ? 1 : 0};
+    animation: ${!o && a`
+      ${s} 0.5s ease-in-out 1
+    `};
+    animation-fill-mode: forwards;
+    animation-delay: ${i * 1}s;
+  `
+);
+export {
+  f as ProgressiveLoader
+};
+//# sourceMappingURL=progressive-loader.js.map

package/dist/features/milestone/create/styled-comps/progressive-loader.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"progressive-loader.js","sources":["../../../../../src/features/milestone/create/styled-comps/progressive-loader.ts"],"sourcesContent":["import styled, { css, keyframes } from 'styled-components';\n\nimport FlexView from '../../../ui/layout/flex-view';\n\nconst fadein = keyframes`\n  from {\n    opacity: 0;\n  }\n\n  to {\n    opacity: 1;\n  }\n  `;\n\ninterface IProgressiveLoaderProps {\n  $stepNumber: number;\n  $disabled?: boolean;\n}\n\nconst ProgressiveLoader = styled(FlexView)<IProgressiveLoaderProps>(\n  ({ $stepNumber, $disabled = false }) => css`\n    opacity: ${$disabled ? 1 : 0};\n    animation: ${!$disabled &&\n    css`\n      ${fadein} 0.5s ease-in-out 1\n    `};\n    animation-fill-mode: forwards;\n    animation-delay: ${$stepNumber * 1}s;\n  `,\n);\n\nexport { ProgressiveLoader };\n"],"names":["fadein","keyframes","ProgressiveLoader","styled","FlexView","$stepNumber","$disabled","css"],"mappings":";;AAIA,MAAMA,IAASC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,KAeTC,IAAoBC,EAAOC,CAAQ;AAAA,EACvC,CAAC,EAAE,aAAAC,GAAa,WAAAC,IAAY,SAAYC;AAAA,eAC3BD,IAAY,IAAI,CAAC;AAAA,iBACf,CAACA,KACdC;AAAA,QACIP,CAAM;AAAA,KACT;AAAA;AAAA,uBAEkBK,IAAc,CAAC;AAAA;AAEtC;"}

package/dist/features/milestone/create/submit-modal/submit-modal.js

@@ -0,0 +1,44 @@
+import { jsx as d } from "react/jsx-runtime";
+import { useState as M } from "react";
+import c from "./submit-with-plan-modal/submit-with-plan-modal.js";
+import p from "./use-submit-milestone.js";
+const f = ({
+  flow: t,
+  isWithoutPlan: h,
+  formData: o,
+  milestoneId: s = null,
+  studentId: e,
+  onSubmit: r,
+  isMilestoneEdit: m = !1,
+  analyticsProps: i,
+  courseStream: n,
+  ...u
+}) => {
+  const [l, a] = M(""), { submit: b, isProcessing: S } = p({
+    formData: o,
+    isMilestoneEdit: !!m,
+    studentId: e,
+    milestoneId: s,
+    onSubmit: r,
+    setError: a,
+    analyticsProps: i,
+    flow: t,
+    courseStream: n
+  });
+  return /* @__PURE__ */ d(
+    c,
+    {
+      error: l,
+      flow: t,
+      formData: o,
+      ...u,
+      isProcessing: S,
+      onSubmit: b,
+      submitAnalyticsProps: i
+    }
+  );
+}, g = f;
+export {
+  g as default
+};
+//# sourceMappingURL=submit-modal.js.map

package/dist/features/milestone/create/submit-modal/submit-modal.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"submit-modal.js","sources":["../../../../../src/features/milestone/create/submit-modal/submit-modal.tsx"],"sourcesContent":["import type {\n  IMilestoneFormData,\n  TCourseStream,\n  TMilestoneFormFlow,\n} from '../milestone-create-types';\n\nimport { useState } from 'react';\n\nimport SubmitWithPlanModal from './submit-with-plan-modal/submit-with-plan-modal';\nimport useSubmitMilestone from './use-submit-milestone';\n\ninterface ISubmitModalProps {\n  studentName: string;\n  studentId: string;\n  parentName: string;\n  teacherName: string;\n  formData: Required<IMilestoneFormData>; //should we make a type like this\n  parentId: string;\n  onSubmit: () => void;\n  onError: () => void;\n  isMilestoneEdit?: boolean;\n  milestoneId?: string;\n  analyticsProps: Record<string, unknown>;\n  isWithoutPlan: boolean;\n  submitBaseMessage: string;\n  flow: TMilestoneFormFlow;\n  courseStream: TCourseStream;\n}\n\nconst SubmitModal: React.FC<ISubmitModalProps> = ({\n  flow,\n  isWithoutPlan,\n  formData,\n  milestoneId = null,\n  studentId,\n  onSubmit,\n  isMilestoneEdit = false,\n  analyticsProps,\n  courseStream,\n  ...props\n}) => {\n  const [error, setError] = useState('');\n  const { submit: handleMilestoneSubmit, isProcessing } = useSubmitMilestone({\n    formData,\n    isMilestoneEdit: Boolean(isMilestoneEdit),\n    studentId,\n    milestoneId,\n    onSubmit,\n    setError,\n    analyticsProps,\n    flow,\n    courseStream,\n  });\n\n  return (\n    <SubmitWithPlanModal\n      error={error}\n      flow={flow}\n      formData={formData}\n      {...props}\n      isProcessing={isProcessing}\n      onSubmit={handleMilestoneSubmit}\n      submitAnalyticsProps={analyticsProps}\n    />\n  );\n};\n\nexport default SubmitModal;\n"],"names":["SubmitModal","flow","isWithoutPlan","formData","milestoneId","studentId","onSubmit","isMilestoneEdit","analyticsProps","courseStream","props","error","setError","useState","handleMilestoneSubmit","isProcessing","useSubmitMilestone","jsx","SubmitWithPlanModal","SubmitModal$1"],"mappings":";;;;AA6BA,MAAMA,IAA2C,CAAC;AAAA,EAChD,MAAAC;AAAA,EACA,eAAAC;AAAA,EACA,UAAAC;AAAA,EACA,aAAAC,IAAc;AAAA,EACd,WAAAC;AAAA,EACA,UAAAC;AAAA,EACA,iBAAAC,IAAkB;AAAA,EAClB,gBAAAC;AAAA,EACA,cAAAC;AAAA,EACA,GAAGC;AACL,MAAM;AACJ,QAAM,CAACC,GAAOC,CAAQ,IAAIC,EAAS,EAAE,GAC/B,EAAE,QAAQC,GAAuB,cAAAC,EAAA,IAAiBC,EAAmB;AAAA,IACzE,UAAAb;AAAA,IACA,iBAAiB,EAAQI;AAAA,IACzB,WAAAF;AAAA,IACA,aAAAD;AAAA,IACA,UAAAE;AAAA,IACA,UAAAM;AAAA,IACA,gBAAAJ;AAAA,IACA,MAAAP;AAAA,IACA,cAAAQ;AAAA,EAAA,CACD;AAGC,SAAA,gBAAAQ;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,OAAAP;AAAA,MACA,MAAAV;AAAA,MACA,UAAAE;AAAA,MACC,GAAGO;AAAA,MACJ,cAAAK;AAAA,MACA,UAAUD;AAAA,MACV,sBAAsBN;AAAA,IAAA;AAAA,EAAA;AAG5B,GAEAW,IAAenB;"}

package/dist/features/milestone/create/submit-modal/submit-with-plan-modal/submit-with-plan-modal-styled.js

@@ -0,0 +1,53 @@
+import e from "styled-components";
+import i from "../../../../ui/layout/flex-view.js";
+import p from "../../../../ui/text/text.js";
+const s = e.textarea(({ theme: o }) => {
+  const {
+    colors: { GREY_4: t, BLACK: r }
+  } = o;
+  return `border: 1px solid ${t};
+  border-radius: 8px;
+  width: 100%;
+  height: 280px;
+  padding: 16px;
+  white-space: pre-line;
+  font-family: 'Untitled Sans Regular';
+  font-weight: 400;
+  font-size: 14px;
+  line-height: 24px;
+  color: ${r};
+  resize: none;
+`;
+});
+e(p)`
+  max-width: 400px;
+`;
+e(i)(({ theme: o }) => {
+  const {
+    colors: { GREY_2: t },
+    layout: { gutter: r }
+  } = o;
+  return `border-bottom: 1px solid ${t};
+  padding-bottom: ${r * 1.5}px;
+  `;
+});
+e(i)`
+  cursor: pointer;
+  margin-right: 16px;
+  position: relative;
+`;
+const l = e(i)(({ theme: o }) => {
+  const {
+    layout: { gutter: t },
+    colors: { GREY_2: r }
+  } = o;
+  return `
+  border-top: 1px solid ${r};
+  padding: ${t * 1}px 0px ${t * 1.5}px;
+`;
+});
+export {
+  l as BottomWrapper,
+  s as StyledTextArea
+};
+//# sourceMappingURL=submit-with-plan-modal-styled.js.map

package/dist/features/milestone/create/submit-modal/submit-with-plan-modal/submit-with-plan-modal-styled.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"submit-with-plan-modal-styled.js","sources":["../../../../../../src/features/milestone/create/submit-modal/submit-with-plan-modal/submit-with-plan-modal-styled.tsx"],"sourcesContent":["import styled from 'styled-components';\n\nimport FlexView from '../../../../ui/layout/flex-view';\nimport Text from '../../../../ui/text/text';\n\nconst StyledTextArea = styled.textarea(({ theme }) => {\n  const {\n    colors: { GREY_4, BLACK },\n  } = theme;\n\n  return `border: 1px solid ${GREY_4};\n  border-radius: 8px;\n  width: 100%;\n  height: 280px;\n  padding: 16px;\n  white-space: pre-line;\n  font-family: 'Untitled Sans Regular';\n  font-weight: 400;\n  font-size: 14px;\n  line-height: 24px;\n  color: ${BLACK};\n  resize: none;\n`;\n});\n\nconst HelperText = styled(Text)`\n  max-width: 400px;\n`;\nconst Wrapper = styled(FlexView)(({ theme }) => {\n  const {\n    colors: { GREY_2 },\n    layout: { gutter },\n  } = theme;\n\n  return `border-bottom: 1px solid ${GREY_2};\n  padding-bottom: ${gutter * 1.5}px;\n  `;\n});\n\nconst PreviewWrapper = styled(FlexView)`\n  cursor: pointer;\n  margin-right: 16px;\n  position: relative;\n`;\n\nconst BottomWrapper = styled(FlexView)(({ theme }) => {\n  const {\n    layout: { gutter },\n    colors: { GREY_2 },\n  } = theme;\n\n  return `\n  border-top: 1px solid ${GREY_2};\n  padding: ${gutter * 1}px 0px ${gutter * 1.5}px;\n`;\n});\n\nexport { BottomWrapper, HelperText, PreviewWrapper, StyledTextArea, Wrapper };\n"],"names":["StyledTextArea","styled","theme","GREY_4","BLACK","Text","FlexView","GREY_2","gutter","BottomWrapper"],"mappings":";;;AAKA,MAAMA,IAAiBC,EAAO,SAAS,CAAC,EAAE,OAAAC,QAAY;AAC9C,QAAA;AAAA,IACJ,QAAQ,EAAE,QAAAC,GAAQ,OAAAC,EAAM;AAAA,EACtB,IAAAF;AAEJ,SAAO,qBAAqBC,CAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,WAUzBC,CAAK;AAAA;AAAA;AAGhB,CAAC;AAEkBH,EAAOI,CAAI;AAAA;AAAA;AAGdJ,EAAOK,CAAQ,EAAE,CAAC,EAAE,OAAAJ,QAAY;AACxC,QAAA;AAAA,IACJ,QAAQ,EAAE,QAAAK,EAAO;AAAA,IACjB,QAAQ,EAAE,QAAAC,EAAO;AAAA,EACf,IAAAN;AAEJ,SAAO,4BAA4BK,CAAM;AAAA,oBACvBC,IAAS,GAAG;AAAA;AAEhC,CAAC;AAEsBP,EAAOK,CAAQ;AAAA;AAAA;AAAA;AAAA;AAMtC,MAAMG,IAAgBR,EAAOK,CAAQ,EAAE,CAAC,EAAE,OAAAJ,QAAY;AAC9C,QAAA;AAAA,IACJ,QAAQ,EAAE,QAAAM,EAAO;AAAA,IACjB,QAAQ,EAAE,QAAAD,EAAO;AAAA,EACf,IAAAL;AAEG,SAAA;AAAA,0BACiBK,CAAM;AAAA,aACnBC,IAAS,CAAC,UAAUA,IAAS,GAAG;AAAA;AAE7C,CAAC;"}

package/dist/features/milestone/create/submit-modal/submit-with-plan-modal/submit-with-plan-modal-util.js

@@ -0,0 +1,15 @@
+import { replaceAll as p } from "../../../../../helpers/label-text.js";
+const _ = (e, { parentName: t, teacherName: a, studentName: n, testDate: r, testName: o, testType: s, grade: m }) => {
+  const l = s === "no-test" ? `completing grade ${m} course` : `“${o}“`;
+  return p(e, {
+    "<parent_name>": t,
+    "<student_name>": n,
+    "<milestone_name>": l,
+    "<test_date>": r,
+    "<teacher_name>": a
+  });
+};
+export {
+  _ as createPlanApprovalMessage
+};
+//# sourceMappingURL=submit-with-plan-modal-util.js.map

package/dist/features/milestone/create/submit-modal/submit-with-plan-modal/submit-with-plan-modal-util.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"submit-with-plan-modal-util.js","sources":["../../../../../../src/features/milestone/create/submit-modal/submit-with-plan-modal/submit-with-plan-modal-util.ts"],"sourcesContent":["import type { TTestType } from '../../../types';\n\nimport { replaceAll } from '../../../../../helpers/label-text';\n\ninterface IMessageOptions {\n  parentName: string;\n  teacherName: string;\n  studentName: string;\n  testName: string;\n  testDate: string;\n  testType: TTestType;\n  grade: string;\n}\n\nconst createPlanApprovalMessage = (\n  baseMessage: string,\n  { parentName, teacherName, studentName, testDate, testName, testType, grade }: IMessageOptions,\n) => {\n  const testNameToDisplay =\n    testType === 'no-test' ? `completing grade ${grade} course` : `“${testName}“`;\n\n  return replaceAll(baseMessage, {\n    '<parent_name>': parentName,\n    '<student_name>': studentName,\n    '<milestone_name>': testNameToDisplay,\n    '<test_date>': testDate,\n    '<teacher_name>': teacherName,\n  });\n};\n\nexport { createPlanApprovalMessage };\n"],"names":["createPlanApprovalMessage","baseMessage","parentName","teacherName","studentName","testDate","testName","testType","grade","testNameToDisplay","replaceAll"],"mappings":";AAcM,MAAAA,IAA4B,CAChCC,GACA,EAAE,YAAAC,GAAY,aAAAC,GAAa,aAAAC,GAAa,UAAAC,GAAU,UAAAC,GAAU,UAAAC,GAAU,OAAAC,QACnE;AACH,QAAMC,IACJF,MAAa,YAAY,oBAAoBC,CAAK,YAAY,IAAIF,CAAQ;AAE5E,SAAOI,EAAWT,GAAa;AAAA,IAC7B,iBAAiBC;AAAA,IACjB,kBAAkBE;AAAA,IAClB,oBAAoBK;AAAA,IACpB,eAAeJ;AAAA,IACf,kBAAkBF;AAAA,EAAA,CACnB;AACH;"}

package/dist/features/milestone/create/submit-modal/submit-with-plan-modal/submit-with-plan-modal.js

@@ -0,0 +1,85 @@
+import { jsxs as t, Fragment as B, jsx as e } from "react/jsx-runtime";
+import { useState as C, useCallback as x } from "react";
+import p from "../../../../ui/buttons/button/button.js";
+import $ from "../../../../ui/layout/flex-view.js";
+import r from "../../../../ui/text/text.js";
+import { StyledTextArea as S, BottomWrapper as E } from "./submit-with-plan-modal-styled.js";
+import { createPlanApprovalMessage as v } from "./submit-with-plan-modal-util.js";
+const j = ({
+  studentName: o,
+  parentName: l,
+  teacherName: g,
+  formData: u,
+  onSubmit: s,
+  error: d,
+  isProcessing: m,
+  submitAnalyticsProps: h,
+  submitBaseMessage: b,
+  flow: f
+}) => {
+  const [i, y] = C(() => {
+    const { milestoneEndDate: a, testName: w, testType: A, grade: X } = u;
+    return v(b, {
+      parentName: l,
+      teacherName: g,
+      studentName: o,
+      testName: w,
+      testDate: a,
+      testType: A,
+      grade: X
+    });
+  }), n = f === "EDIT", c = x(() => {
+    s(n ? "" : i);
+  }, [s, n, i]);
+  return /* @__PURE__ */ t(B, { children: [
+    /* @__PURE__ */ t($, { $gapX: 1, $gutterX: 1, children: [
+      /* @__PURE__ */ e(r, { $renderAs: "h4", $marginBottomX: 0.75, children: "Share learning plan with parent" }),
+      /* @__PURE__ */ e(r, { $renderAs: "body2", color: "BLACK_75", $marginBottomX: 0.75, children: "Edit the message if needed, before you share it with the parent." }),
+      /* @__PURE__ */ t(r, { $renderAs: "body1Medium", $marginBottomX: 0.75, children: [
+        l,
+        " ",
+        /* @__PURE__ */ t(r, { $renderAs: "body2", $inline: !0, children: [
+          "(",
+          o,
+          "'s parent)"
+        ] })
+      ] }),
+      /* @__PURE__ */ e(S, { onChange: (a) => y(a.target.value), value: i })
+    ] }),
+    /* @__PURE__ */ t(E, { $alignItems: "center", children: [
+      /* @__PURE__ */ e(r, { color: "BLACK_75", $renderAs: "body3", $align: "center", $widthX: 26, $marginBottomX: 1, children: "ℹ️ On tapping, the plan will be saved, & the parent will be updated via Email, WhatsApp & CueChat (if installed)" }),
+      d && /* @__PURE__ */ e(r, { $renderAs: "body2", $color: "RED", $align: "center", $widthX: 26, $marginBottomX: 1, children: d }),
+      /* @__PURE__ */ t($, { $flexDirection: "row", $alignItems: "center", $flexGap: 12, children: [
+        n && /* @__PURE__ */ e(
+          p,
+          {
+            renderAs: "secondary",
+            size: "small",
+            widthX: 13.5,
+            label: "Submit without share",
+            onClick: c,
+            busy: m,
+            analyticsProps: h
+          }
+        ),
+        /* @__PURE__ */ e(
+          p,
+          {
+            renderAs: "primary",
+            size: "small",
+            widthX: 13.5,
+            label: "Submit & share",
+            onClick: c,
+            busy: m,
+            disabled: i === "",
+            analyticsProps: h
+          }
+        )
+      ] })
+    ] })
+  ] });
+};
+export {
+  j as default
+};
+//# sourceMappingURL=submit-with-plan-modal.js.map

package/dist/features/milestone/create/submit-modal/submit-with-plan-modal/submit-with-plan-modal.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"submit-with-plan-modal.js","sources":["../../../../../../src/features/milestone/create/submit-modal/submit-with-plan-modal/submit-with-plan-modal.tsx"],"sourcesContent":["import type { IMilestoneFormData, TMilestoneFormFlow } from '../../milestone-create-types';\n\nimport { useCallback, useState } from 'react';\n\nimport Button from '../../../../ui/buttons/button/button';\nimport FlexView from '../../../../ui/layout/flex-view';\nimport Text from '../../../../ui/text/text';\nimport * as Styled from './submit-with-plan-modal-styled';\nimport { createPlanApprovalMessage } from './submit-with-plan-modal-util';\n\ninterface ISubmitWithPlanModalProps {\n  studentName: string;\n  parentName: string;\n  teacherName: string;\n  formData: Required<IMilestoneFormData>; //should we make a type like this\n  parentId: string;\n  onSubmit: (message: string) => void;\n  onError: () => void;\n  isMilestoneEdit?: boolean;\n  milestoneId?: string;\n  error: string;\n  isProcessing: boolean;\n  submitAnalyticsProps?: Record<string, unknown>;\n  submitBaseMessage: string;\n  flow: TMilestoneFormFlow;\n}\n\nconst SubmitWithPlanModal: React.FC<ISubmitWithPlanModalProps> = ({\n  studentName,\n  parentName,\n  teacherName,\n  formData,\n  onSubmit: handleSubmit,\n  error,\n  isProcessing,\n  submitAnalyticsProps,\n  submitBaseMessage,\n  flow,\n}) => {\n  const [message, setMessage] = useState(() => {\n    const { milestoneEndDate, testName, testType, grade } = formData;\n\n    return createPlanApprovalMessage(submitBaseMessage, {\n      parentName,\n      teacherName,\n      studentName,\n      testName,\n      testDate: milestoneEndDate,\n      testType,\n      grade,\n    });\n  });\n\n  const isEditFlow = flow === 'EDIT';\n\n  const handleSubmitClick = useCallback(() => {\n    handleSubmit(isEditFlow ? '' : message);\n  }, [handleSubmit, isEditFlow, message]);\n\n  return (\n    <>\n      <FlexView $gapX={1} $gutterX={1}>\n        <Text $renderAs=\"h4\" $marginBottomX={0.75}>\n          Share learning plan with parent\n        </Text>\n\n        <Text $renderAs=\"body2\" color=\"BLACK_75\" $marginBottomX={0.75}>\n          Edit the message if needed, before you share it with the parent.\n        </Text>\n\n        <Text $renderAs=\"body1Medium\" $marginBottomX={0.75}>\n          {parentName}{' '}\n          <Text $renderAs=\"body2\" $inline>\n            ({studentName}'s parent)\n          </Text>\n        </Text>\n\n        <Styled.StyledTextArea onChange={e => setMessage(e.target.value)} value={message} />\n      </FlexView>\n\n      <Styled.BottomWrapper $alignItems=\"center\">\n        <Text color=\"BLACK_75\" $renderAs=\"body3\" $align=\"center\" $widthX={26} $marginBottomX={1}>\n          ℹ️ On tapping, the plan will be saved, & the parent will be updated via Email, WhatsApp &\n          CueChat (if installed)\n        </Text>\n\n        {error && (\n          <Text $renderAs=\"body2\" $color=\"RED\" $align=\"center\" $widthX={26} $marginBottomX={1}>\n            {error}\n          </Text>\n        )}\n\n        <FlexView $flexDirection=\"row\" $alignItems=\"center\" $flexGap={12}>\n          {isEditFlow && (\n            <Button\n              renderAs=\"secondary\"\n              size=\"small\"\n              widthX={13.5}\n              label=\"Submit without share\"\n              onClick={handleSubmitClick}\n              busy={isProcessing}\n              analyticsProps={submitAnalyticsProps}\n            />\n          )}\n\n          <Button\n            renderAs=\"primary\"\n            size=\"small\"\n            widthX={13.5}\n            label=\"Submit & share\"\n            onClick={handleSubmitClick}\n            busy={isProcessing}\n            disabled={message === ''}\n            analyticsProps={submitAnalyticsProps}\n          />\n        </FlexView>\n      </Styled.BottomWrapper>\n    </>\n  );\n};\n\nexport default SubmitWithPlanModal;\n"],"names":["SubmitWithPlanModal","studentName","parentName","teacherName","formData","handleSubmit","error","isProcessing","submitAnalyticsProps","submitBaseMessage","flow","message","setMessage","useState","milestoneEndDate","testName","testType","grade","createPlanApprovalMessage","isEditFlow","handleSubmitClick","useCallback","jsxs","Fragment","FlexView","jsx","Text","Styled.StyledTextArea","e","Styled.BottomWrapper","Button"],"mappings":";;;;;;;AA2BA,MAAMA,IAA2D,CAAC;AAAA,EAChE,aAAAC;AAAA,EACA,YAAAC;AAAA,EACA,aAAAC;AAAA,EACA,UAAAC;AAAA,EACA,UAAUC;AAAA,EACV,OAAAC;AAAA,EACA,cAAAC;AAAA,EACA,sBAAAC;AAAA,EACA,mBAAAC;AAAA,EACA,MAAAC;AACF,MAAM;AACJ,QAAM,CAACC,GAASC,CAAU,IAAIC,EAAS,MAAM;AAC3C,UAAM,EAAE,kBAAAC,GAAkB,UAAAC,GAAU,UAAAC,GAAU,OAAAC,MAAUb;AAExD,WAAOc,EAA0BT,GAAmB;AAAA,MAClD,YAAAP;AAAA,MACA,aAAAC;AAAA,MACA,aAAAF;AAAA,MACA,UAAAc;AAAA,MACA,UAAUD;AAAA,MACV,UAAAE;AAAA,MACA,OAAAC;AAAA,IAAA,CACD;AAAA,EAAA,CACF,GAEKE,IAAaT,MAAS,QAEtBU,IAAoBC,EAAY,MAAM;AAC7B,IAAAhB,EAAAc,IAAa,KAAKR,CAAO;AAAA,EACrC,GAAA,CAACN,GAAcc,GAAYR,CAAO,CAAC;AAEtC,SAEI,gBAAAW,EAAAC,GAAA,EAAA,UAAA;AAAA,IAAA,gBAAAD,EAACE,GAAS,EAAA,OAAO,GAAG,UAAU,GAC5B,UAAA;AAAA,MAAA,gBAAAC,EAACC,GAAK,EAAA,WAAU,MAAK,gBAAgB,MAAM,UAE3C,mCAAA;AAAA,MAEA,gBAAAD,EAACC,KAAK,WAAU,SAAQ,OAAM,YAAW,gBAAgB,MAAM,UAE/D,mEAAA,CAAA;AAAA,MAEC,gBAAAJ,EAAAI,GAAA,EAAK,WAAU,eAAc,gBAAgB,MAC3C,UAAA;AAAA,QAAAxB;AAAA,QAAY;AAAA,QACZ,gBAAAoB,EAAAI,GAAA,EAAK,WAAU,SAAQ,SAAO,IAAC,UAAA;AAAA,UAAA;AAAA,UAC5BzB;AAAA,UAAY;AAAA,QAAA,GAChB;AAAA,MAAA,GACF;AAAA,MAEC,gBAAAwB,EAAAE,GAAA,EAAsB,UAAU,CAAAC,MAAKhB,EAAWgB,EAAE,OAAO,KAAK,GAAG,OAAOjB,EAAS,CAAA;AAAA,IAAA,GACpF;AAAA,IAEC,gBAAAW,EAAAO,GAAA,EAAqB,aAAY,UAChC,UAAA;AAAA,MAAC,gBAAAJ,EAAAC,GAAA,EAAK,OAAM,YAAW,WAAU,SAAQ,QAAO,UAAS,SAAS,IAAI,gBAAgB,GAAG,UAGzF,oHAAA;AAAA,MAECpB,KACC,gBAAAmB,EAACC,GAAK,EAAA,WAAU,SAAQ,QAAO,OAAM,QAAO,UAAS,SAAS,IAAI,gBAAgB,GAC/E,UACHpB,GAAA;AAAA,wBAGDkB,GAAS,EAAA,gBAAe,OAAM,aAAY,UAAS,UAAU,IAC3D,UAAA;AAAA,QACCL,KAAA,gBAAAM;AAAA,UAACK;AAAA,UAAA;AAAA,YACC,UAAS;AAAA,YACT,MAAK;AAAA,YACL,QAAQ;AAAA,YACR,OAAM;AAAA,YACN,SAASV;AAAA,YACT,MAAMb;AAAA,YACN,gBAAgBC;AAAA,UAAA;AAAA,QAClB;AAAA,QAGF,gBAAAiB;AAAA,UAACK;AAAA,UAAA;AAAA,YACC,UAAS;AAAA,YACT,MAAK;AAAA,YACL,QAAQ;AAAA,YACR,OAAM;AAAA,YACN,SAASV;AAAA,YACT,MAAMb;AAAA,YACN,UAAUI,MAAY;AAAA,YACtB,gBAAgBH;AAAA,UAAA;AAAA,QAClB;AAAA,MAAA,GACF;AAAA,IAAA,GACF;AAAA,EACF,EAAA,CAAA;AAEJ;"}