@cuemath/leap 3.5.64 → 3.5.66-link0

package/dist/features/trial-session/comps/student-info/student-info.js

@@ -1,86 +1,121 @@
-import { jsxs as i, jsx as r } from "react/jsx-runtime";
-import { memo as x, useCallback as t, useEffect as B } from "react";
-import { ILLUSTRATIONS as E } from "../../../../assets/illustrations/illustrations.js";
-import { GOAL_CATEGORY as G } from "../../../milestone/constants.js";
-import { getCategorizedCurriculumStandards as O } from "../../../milestone/create/comps/class-details-step/class-details-utils.js";
-import { getGradesFromConfig as U } from "../../../milestone/create/milestone-create-helpers.js";
-import $ from "../../../ui/image/image.js";
-import D from "../../../ui/inputs/searchable-select-input/searchable-select-input.js";
-import H from "../../../ui/inputs/select-input/select-input.js";
-import W from "../../../ui/inputs/text-input/text-input.js";
-import k from "../../../ui/separator/separator.js";
+import { jsxs as n, jsx as e } from "react/jsx-runtime";
+import { memo as L, useCallback as s, useEffect as w } from "react";
+import { getGradesFromConfig as y } from "../../../milestone/create/milestone-create-helpers.js";
+import A from "../../../ui/image/image.js";
+import p from "../../../ui/inputs/select-input/select-input.js";
+import S from "../../../ui/inputs/text-input/text-input.js";
+import _ from "../../../ui/separator/separator.js";
 import { useTrialSessionContext as v } from "../../context/use-trial-session-context.js";
-import R from "../slide-header/index.js";
-import { Container as j, StudentInfoWrapper as w, ImageWrapper as F, InformationWrapper as K } from "./student-info-styled.js";
-const ae = x(function() {
-  const { formData: c, milestoneConfig: m, updateSlideConfig: a, updateButtonState: s, trialHomeData: f } = v(), { name: d, grade: n, curriculum: l } = c || {}, g = U(m), { demo_info: h, student: C } = f, { enrollment_type: S } = C || {}, { stream: I, region_data: L } = h || {}, { opportunity_country: b = "US" } = L || {}, _ = O(m, {
-    countryCode: b,
-    grade: n ?? "",
-    goalCategory: G.SCHOOL_SUCCESS,
-    courseStream: I,
-    enrollmentType: S
-  }), u = !!(d && n && l), o = t(
-    (e, p) => {
-      a(e === "grade" ? { [e]: p, goals: [] } : { [e]: p });
+import N from "../slide-header/index.js";
+import { AbsoluteImage as B, MetaTextWrapper as E } from "./student-info-styled.js";
+import i from "../../../ui/layout/flex-view.js";
+import { getDummyProfileImage as G } from "../student-profile/student-profile-utils.js";
+import { RIGHT_PANEL_CONTENT_WIDTH as P } from "../../trial-session-constants.js";
+import { getCourseOptions as k } from "./student-info-helpers.js";
+const U = L(function() {
+  const { formData: g, milestoneConfig: h, updateSlideConfig: r, updateButtonState: m } = v(), { name: l, grade: o, course: d, studentProfile: f, numberInNameError: c } = g || {}, { dummyProfileImageIndex: C } = f || {}, b = y(h), I = G(C), a = k(Number(o)), u = !!(!(l && o && a.length > 0) || d), $ = s(
+    (t) => {
+      r({
+        name: t.target.value,
+        numberInNameError: !1
+      });
     },
-    [a]
-  ), A = t((e) => o("name", e.target.value), [o]), T = t(
-    (e) => o("grade", e),
-    [o]
-  ), y = t(
-    (e) => o("curriculum", e),
-    [o]
+    [r]
+  ), x = s(
+    (t) => {
+      r({ grade: t, course: "" });
+    },
+    [r]
+  ), T = s(
+    (t) => {
+      r({ course: t });
+    },
+    [r]
   );
-  return B(() => {
-    s("right", { isDisabled: !u, isLoading: !1 });
-  }, [u, s]), /* @__PURE__ */ i(j, { children: [
-    /* @__PURE__ */ r(k, { height: 60 }),
-    /* @__PURE__ */ r(R, {}),
-    /* @__PURE__ */ i(w, { $background: "BLUE_4", $borderColor: "BLACK_T_87", children: [
-      /* @__PURE__ */ r(F, { children: /* @__PURE__ */ r($, { withLoader: !1, src: E.BLUE_CLIP, width: 261, height: 31 }) }),
-      /* @__PURE__ */ i(K, { $flexGapX: 2.75, $background: "WHITE_1", $borderColor: "BLACK_T_87", children: [
-        /* @__PURE__ */ r(
-          W,
-          {
-            renderAs: "primary",
-            label: "Student name",
-            value: d,
-            type: "text",
-            name: "name",
-            shape: "borderLess",
-            onChange: A
-          }
-        ),
-        /* @__PURE__ */ r(
-          D,
-          {
-            renderAs: "primary",
-            label: "Grade",
-            value: n,
-            options: g,
-            shape: "borderLess",
-            onChange: T,
-            theme: "dark"
-          }
-        ),
-        /* @__PURE__ */ r(
-          H,
-          {
-            renderAs: "primary",
-            label: "Curriculum",
-            value: l,
-            options: _,
-            shape: "borderLess",
-            renderOptionsAs: "section-list",
-            theme: "dark",
-            onChange: y
-          }
-        )
-      ] })
-    ] })
+  return w(() => {
+    m("right", { isDisabled: !u, isLoading: !1 });
+  }, [u, m]), /* @__PURE__ */ n(i, { $justifyContent: "center", $alignItems: "center", children: [
+    /* @__PURE__ */ e(_, { height: 60 }),
+    /* @__PURE__ */ e(N, { marginBottom: 100 }),
+    /* @__PURE__ */ n(
+      i,
+      {
+        $position: "relative",
+        $width: P - 100,
+        $flexDirection: "row",
+        $alignItems: "center",
+        $flexGapX: 2,
+        $gutterX: 1.5,
+        $gapX: 3.125,
+        $background: "WHITE_2",
+        $borderColor: "BLACK_T_87",
+        $borderRadiusX: 0.5,
+        children: [
+          /* @__PURE__ */ e(B, {}),
+          /* @__PURE__ */ e(A, { withLoader: !0, height: 200, width: 200, src: I, borderColor: "BLACK_1" }),
+          /* @__PURE__ */ n(i, { $flexGap: 16, children: [
+            /* @__PURE__ */ e(
+              S,
+              {
+                renderAs: "primary",
+                label: "Name",
+                placeholder: "Student name",
+                value: l,
+                type: "text",
+                name: "name",
+                shape: "borderLess",
+                onChange: $,
+                width: "216px",
+                isTransparent: !0,
+                stickyLabel: !0,
+                errorMessage: c ? "Please enter a valid name" : void 0
+              }
+            ),
+            /* @__PURE__ */ e(
+              p,
+              {
+                renderAs: "primary",
+                label: "Grade",
+                value: o,
+                options: b,
+                shape: "borderLess",
+                onChange: x,
+                theme: "dark",
+                widthX: 10,
+                isTransparent: !0
+              }
+            ),
+            a.length > 0 ? /* @__PURE__ */ e(
+              p,
+              {
+                width: "216px",
+                renderAs: "primary",
+                label: "Course",
+                value: d,
+                options: a,
+                shape: "borderLess",
+                onChange: T,
+                theme: "dark",
+                isTransparent: !0
+              }
+            ) : null
+          ] }),
+          /* @__PURE__ */ e(
+            E,
+            {
+              $renderAs: "ub3-bold",
+              color: "BLACK_T_60",
+              $align: "right",
+              $width: "100%",
+              children: "We’ll solve questions from the selected grade"
+            }
+          )
+        ]
+      }
+    )
   ] });
 });
 export {
-  ae as default
+  U as default
 };
 //# sourceMappingURL=student-info.js.map

package/dist/features/trial-session/comps/student-info/student-info.js.map

@@ -1 +1 @@
-{"version":3,"file":"student-info.js","sources":["../../../../../src/features/trial-session/comps/student-info/student-info.tsx"],"sourcesContent":["import { memo, useCallback, useEffect, type InputHTMLAttributes } from 'react';\n\nimport { ILLUSTRATIONS } from '../../../../assets/illustrations/illustrations';\nimport { GOAL_CATEGORY } from '../../../milestone/constants';\nimport { getCategorizedCurriculumStandards } from '../../../milestone/create/comps/class-details-step/class-details-utils';\nimport { getGradesFromConfig } from '../../../milestone/create/milestone-create-helpers';\nimport Image from '../../../ui/image/image';\nimport SearchableSelectInput from '../../../ui/inputs/searchable-select-input/searchable-select-input';\nimport SelectInput from '../../../ui/inputs/select-input/select-input';\nimport TextInput from '../../../ui/inputs/text-input/text-input';\nimport Separator from '../../../ui/separator/separator';\nimport { useTrialSessionContext } from '../../context/use-trial-session-context';\nimport SlideHeader from '../slide-header';\nimport * as Styled from './student-info-styled';\n\nconst StudentInformation = memo(function StudentInformation() {\n  const { formData, milestoneConfig, updateSlideConfig, updateButtonState, trialHomeData } =\n    useTrialSessionContext();\n\n  const { name, grade, curriculum } = formData || {};\n  const grades = getGradesFromConfig(milestoneConfig);\n\n  const { demo_info: demoInfo, student } = trialHomeData;\n  const { enrollment_type: enrollmentType } = student || {};\n  const { stream, region_data: regionData } = demoInfo || {};\n  const { opportunity_country: countryCode = 'US' } = regionData || {};\n\n  const curriculumStandards = getCategorizedCurriculumStandards(milestoneConfig, {\n    countryCode,\n    grade: grade ?? '',\n    goalCategory: GOAL_CATEGORY.SCHOOL_SUCCESS,\n    courseStream: stream,\n    enrollmentType: enrollmentType,\n  });\n  const hasRequiredFields = Boolean(name && grade && curriculum);\n\n  const updateStudentInformation = useCallback(\n    (key: string, value: string) => {\n      if (key === 'grade') {\n        // reset goals as well if grade changes\n        updateSlideConfig({ [key]: value, goals: [] });\n      } else {\n        updateSlideConfig({ [key]: value });\n      }\n    },\n    [updateSlideConfig],\n  );\n\n  const handleNameChange = useCallback<\n    NonNullable<InputHTMLAttributes<HTMLInputElement>['onChange']>\n  >(event => updateStudentInformation('name', event.target.value), [updateStudentInformation]);\n\n  const handleGradeChange = useCallback(\n    (value: string) => updateStudentInformation('grade', value),\n    [updateStudentInformation],\n  );\n\n  const handleCurriculumChange = useCallback(\n    (value: string) => updateStudentInformation('curriculum', value),\n    [updateStudentInformation],\n  );\n\n  useEffect(() => {\n    updateButtonState('right', { isDisabled: !hasRequiredFields, isLoading: false });\n  }, [hasRequiredFields, updateButtonState]);\n\n  return (\n    <Styled.Container>\n      <Separator height={60} />\n      <SlideHeader />\n      <Styled.StudentInfoWrapper $background=\"BLUE_4\" $borderColor=\"BLACK_T_87\">\n        <Styled.ImageWrapper>\n          <Image withLoader={false} src={ILLUSTRATIONS.BLUE_CLIP} width={261} height={31} />\n        </Styled.ImageWrapper>\n        <Styled.InformationWrapper $flexGapX={2.75} $background=\"WHITE_1\" $borderColor=\"BLACK_T_87\">\n          <TextInput\n            renderAs=\"primary\"\n            label=\"Student name\"\n            value={name}\n            type=\"text\"\n            name=\"name\"\n            shape=\"borderLess\"\n            onChange={handleNameChange}\n          />\n          <SearchableSelectInput\n            renderAs=\"primary\"\n            label=\"Grade\"\n            value={grade}\n            options={grades}\n            shape=\"borderLess\"\n            onChange={handleGradeChange}\n            theme=\"dark\"\n          />\n          <SelectInput\n            renderAs=\"primary\"\n            label=\"Curriculum\"\n            value={curriculum}\n            options={curriculumStandards}\n            shape=\"borderLess\"\n            renderOptionsAs=\"section-list\"\n            theme=\"dark\"\n            onChange={handleCurriculumChange}\n          />\n        </Styled.InformationWrapper>\n      </Styled.StudentInfoWrapper>\n    </Styled.Container>\n  );\n});\n\nexport default StudentInformation;\n"],"names":["StudentInformation","memo","formData","milestoneConfig","updateSlideConfig","updateButtonState","trialHomeData","useTrialSessionContext","name","grade","curriculum","grades","getGradesFromConfig","demoInfo","student","enrollmentType","stream","regionData","countryCode","curriculumStandards","getCategorizedCurriculumStandards","GOAL_CATEGORY","hasRequiredFields","updateStudentInformation","useCallback","key","value","handleNameChange","event","handleGradeChange","handleCurriculumChange","useEffect","jsxs","Styled.Container","jsx","Separator","SlideHeader","Styled.StudentInfoWrapper","Styled.ImageWrapper","Image","ILLUSTRATIONS","Styled.InformationWrapper","TextInput","SearchableSelectInput","SelectInput"],"mappings":"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"}
+{"version":3,"file":"student-info.js","sources":["../../../../../src/features/trial-session/comps/student-info/student-info.tsx"],"sourcesContent":["import { memo, useCallback, useEffect, type InputHTMLAttributes } from 'react';\n\nimport { getGradesFromConfig } from '../../../milestone/create/milestone-create-helpers';\nimport Image from '../../../ui/image/image';\nimport SelectInput from '../../../ui/inputs/select-input/select-input';\nimport TextInput from '../../../ui/inputs/text-input/text-input';\nimport Separator from '../../../ui/separator/separator';\nimport { useTrialSessionContext } from '../../context/use-trial-session-context';\nimport SlideHeader from '../slide-header';\nimport * as Styled from './student-info-styled';\nimport FlexView from '../../../ui/layout/flex-view';\nimport { getDummyProfileImage } from '../student-profile/student-profile-utils';\nimport { RIGHT_PANEL_CONTENT_WIDTH } from '../../trial-session-constants';\nimport { getCourseOptions } from './student-info-helpers';\n\nconst StudentInformation = memo(function StudentInformation() {\n  const { formData, milestoneConfig, updateSlideConfig, updateButtonState } =\n    useTrialSessionContext();\n\n  const { name, grade, course, studentProfile, numberInNameError } = formData || {};\n  const { dummyProfileImageIndex } = studentProfile || {};\n\n  const grades = getGradesFromConfig(milestoneConfig);\n  const dummyProfileImage = getDummyProfileImage(dummyProfileImageIndex);\n  const courses = getCourseOptions(Number(grade));\n  const hasRequiredFields = Boolean(name && grade && courses.length > 0 ? course : true);\n\n  const handleNameChange = useCallback<\n    NonNullable<InputHTMLAttributes<HTMLInputElement>['onChange']>\n  >(\n    event => {\n      updateSlideConfig({\n        name: event.target.value,\n        numberInNameError: false,\n      });\n    },\n    [updateSlideConfig],\n  );\n\n  const handleGradeChange = useCallback(\n    (value: string) => {\n      updateSlideConfig({ grade: value, course: '' });\n    },\n    [updateSlideConfig],\n  );\n\n  const handleCourseChange = useCallback(\n    (value: string) => {\n      updateSlideConfig({ course: value });\n    },\n    [updateSlideConfig],\n  );\n\n  useEffect(() => {\n    updateButtonState('right', { isDisabled: !hasRequiredFields, isLoading: false });\n  }, [hasRequiredFields, updateButtonState]);\n\n  return (\n    <FlexView $justifyContent=\"center\" $alignItems=\"center\">\n      <Separator height={60} />\n      <SlideHeader marginBottom={100} />\n      <FlexView\n        $position=\"relative\"\n        $width={RIGHT_PANEL_CONTENT_WIDTH - 100}\n        $flexDirection=\"row\"\n        $alignItems=\"center\"\n        $flexGapX={2}\n        $gutterX={1.5}\n        $gapX={3.125}\n        $background=\"WHITE_2\"\n        $borderColor=\"BLACK_T_87\"\n        $borderRadiusX={0.5}\n      >\n        <Styled.AbsoluteImage />\n        <Image withLoader height={200} width={200} src={dummyProfileImage} borderColor=\"BLACK_1\" />\n\n        <FlexView $flexGap={16}>\n          <TextInput\n            renderAs=\"primary\"\n            label=\"Name\"\n            placeholder=\"Student name\"\n            value={name}\n            type=\"text\"\n            name=\"name\"\n            shape=\"borderLess\"\n            onChange={handleNameChange}\n            width=\"216px\"\n            isTransparent\n            stickyLabel\n            errorMessage={numberInNameError ? 'Please enter a valid name' : undefined}\n          />\n          <SelectInput\n            renderAs=\"primary\"\n            label=\"Grade\"\n            value={grade}\n            options={grades}\n            shape=\"borderLess\"\n            onChange={handleGradeChange}\n            theme=\"dark\"\n            widthX={10}\n            isTransparent\n          />\n          {courses.length > 0 ? (\n            <SelectInput\n              width=\"216px\"\n              renderAs=\"primary\"\n              label=\"Course\"\n              value={course}\n              options={courses}\n              shape=\"borderLess\"\n              onChange={handleCourseChange}\n              theme=\"dark\"\n              isTransparent\n            />\n          ) : null}\n        </FlexView>\n\n        <Styled.MetaTextWrapper\n          $renderAs=\"ub3-bold\"\n          color=\"BLACK_T_60\"\n          $align=\"right\"\n          $width=\"100%\"\n        >\n          We’ll solve questions from the selected grade\n        </Styled.MetaTextWrapper>\n      </FlexView>\n    </FlexView>\n  );\n});\n\nexport default StudentInformation;\n"],"names":["StudentInformation","memo","formData","milestoneConfig","updateSlideConfig","updateButtonState","useTrialSessionContext","name","grade","course","studentProfile","numberInNameError","dummyProfileImageIndex","grades","getGradesFromConfig","dummyProfileImage","getDummyProfileImage","courses","getCourseOptions","hasRequiredFields","handleNameChange","useCallback","event","handleGradeChange","value","handleCourseChange","useEffect","jsxs","FlexView","jsx","Separator","SlideHeader","RIGHT_PANEL_CONTENT_WIDTH","Styled.AbsoluteImage","Image","TextInput","SelectInput","Styled.MetaTextWrapper"],"mappings":"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"}

package/dist/features/trial-session/comps/student-personalization/student-personalization-styled.js

@@ -1,10 +1,5 @@
 import o from "styled-components";
-import r from "../../../ui/layout/flex-view.js";
-const a = o.div`
-  width: 100%;
-  height: 100%;
-  overflow: auto;
-`, e = o.div(
+const i = o.div(
   ({ theme: t }) => `
   position: relative;
   width: ${t.layout.gutter * 18.75}px;
@@ -18,12 +13,8 @@ const a = o.div`
     bottom: 0;
   }
 `
-), l = o(r)`
-  margin: auto;
-`;
+);
 export {
-  a as Container,
-  l as ContentWrapper,
-  e as ImageWrapper
+  i as ImageWrapper
 };
 //# sourceMappingURL=student-personalization-styled.js.map

package/dist/features/trial-session/comps/student-personalization/student-personalization-styled.js.map

@@ -1 +1 @@
-{"version":3,"file":"student-personalization-styled.js","sources":["../../../../../src/features/trial-session/comps/student-personalization/student-personalization-styled.tsx"],"sourcesContent":["import styled from 'styled-components';\n\nimport FlexView from '../../../ui/layout/flex-view';\n\nconst Container = styled.div`\n  width: 100%;\n  height: 100%;\n  overflow: auto;\n`;\n\nconst ImageWrapper = styled.div(\n  ({ theme }) => `\n  position: relative;\n  width: ${theme.layout.gutter * 18.75}px;\n  height: ${theme.layout.gutter * 25}px;\n  border: 1px solid ${theme.colors.BLACK_1};\n  .image {\n    position: absolute;\n    top: -${theme.layout.gutter * 0.15625}px;\n    left: -${theme.layout.gutter * 0.125}px;\n    right: 0;\n    bottom: 0;\n  }\n`,\n);\n\nconst ContentWrapper = styled(FlexView)`\n  margin: auto;\n`;\n\nexport { Container, ContentWrapper, ImageWrapper };\n"],"names":["Container","styled","ImageWrapper","theme","ContentWrapper","FlexView"],"mappings":";;AAIA,MAAMA,IAAYC,EAAO;AAAA;AAAA;AAAA;AAAA,GAMnBC,IAAeD,EAAO;AAAA,EAC1B,CAAC,EAAE,OAAAE,EAAA,MAAY;AAAA;AAAA,WAENA,EAAM,OAAO,SAAS,KAAK;AAAA,YAC1BA,EAAM,OAAO,SAAS,EAAE;AAAA,sBACdA,EAAM,OAAO,OAAO;AAAA;AAAA;AAAA,YAG9BA,EAAM,OAAO,SAAS,OAAO;AAAA,aAC5BA,EAAM,OAAO,SAAS,KAAK;AAAA;AAAA;AAAA;AAAA;AAKxC,GAEMC,IAAiBH,EAAOI,CAAQ;AAAA;AAAA;"}
+{"version":3,"file":"student-personalization-styled.js","sources":["../../../../../src/features/trial-session/comps/student-personalization/student-personalization-styled.tsx"],"sourcesContent":["import styled from 'styled-components';\n\nconst ImageWrapper = styled.div(\n  ({ theme }) => `\n  position: relative;\n  width: ${theme.layout.gutter * 18.75}px;\n  height: ${theme.layout.gutter * 25}px;\n  border: 1px solid ${theme.colors.BLACK_1};\n  .image {\n    position: absolute;\n    top: -${theme.layout.gutter * 0.15625}px;\n    left: -${theme.layout.gutter * 0.125}px;\n    right: 0;\n    bottom: 0;\n  }\n`,\n);\n\nexport { ImageWrapper };\n"],"names":["ImageWrapper","styled","theme"],"mappings":";AAEA,MAAMA,IAAeC,EAAO;AAAA,EAC1B,CAAC,EAAE,OAAAC,EAAA,MAAY;AAAA;AAAA,WAENA,EAAM,OAAO,SAAS,KAAK;AAAA,YAC1BA,EAAM,OAAO,SAAS,EAAE;AAAA,sBACdA,EAAM,OAAO,OAAO;AAAA;AAAA;AAAA,YAG9BA,EAAM,OAAO,SAAS,OAAO;AAAA,aAC5BA,EAAM,OAAO,SAAS,KAAK;AAAA;AAAA;AAAA;AAAA;AAKxC;"}

package/dist/features/trial-session/comps/student-personalization/student-personalization.js

@@ -1,37 +1,38 @@
 import { jsxs as o, jsx as e } from "react/jsx-runtime";
-import { memo as p, useMemo as f, useCallback as u, useEffect as h } from "react";
+import { memo as p, useMemo as u, useCallback as h, useEffect as g } from "react";
 import { ILLUSTRATIONS as C } from "../../../../assets/illustrations/illustrations.js";
-import { COURSE_STREAMS as g, PREFERENCE_CATEGORY as S } from "../../../milestone/constants.js";
-import { getPreferencesFromConfig as E } from "../../../milestone/create/milestone-create-helpers.js";
+import { COURSE_STREAMS as E, PREFERENCE_CATEGORY as S } from "../../../milestone/constants.js";
+import { getPreferencesFromConfig as T } from "../../../milestone/create/milestone-create-helpers.js";
 import b from "../../../ui/image/image.js";
-import x from "../../../ui/inputs/checkbox-input-list/checkbox-input-list.js";
-import A from "../../../ui/layout/flex-view.js";
-import $ from "../../../ui/separator/separator.js";
-import L from "../../../ui/text/text.js";
-import { useTrialSessionContext as O } from "../../context/use-trial-session-context.js";
-import R from "../slide-header/index.js";
-import { Container as T, ContentWrapper as j, ImageWrapper as I } from "./student-personalization-styled.js";
-const H = p(function() {
-  const { formData: m, milestoneConfig: r, updateSlideConfig: t, updateButtonState: i } = O(), { grade: n, personalizedObjectives: a = [] } = m || {}, s = a.length > 0, l = f(
-    () => E(r, {
-      grade: n ?? "",
-      courseStream: g.MATH,
+import $ from "../../../ui/inputs/checkbox-input-list/checkbox-input-list.js";
+import t from "../../../ui/layout/flex-view.js";
+import A from "../../../ui/separator/separator.js";
+import I from "../../../ui/text/text.js";
+import { useTrialSessionContext as x } from "../../context/use-trial-session-context.js";
+import L from "../slide-header/index.js";
+import { ImageWrapper as O } from "./student-personalization-styled.js";
+import { RIGHT_PANEL_CONTENT_WIDTH as R } from "../../trial-session-constants.js";
+const W = p(function() {
+  const { formData: l, milestoneConfig: r, updateSlideConfig: i, updateButtonState: n } = x(), { grade: a, personalizedObjectives: s = [] } = l || {}, m = s.length > 0, c = u(
+    () => T(r, {
+      grade: a ?? "",
+      courseStream: E.MATH,
       preferenceCategory: S.OBJECTIVES
     }),
-    [n, r]
-  ), d = u(
-    (c) => {
-      t({ personalizedObjectives: c });
+    [a, r]
+  ), d = h(
+    (f) => {
+      i({ personalizedObjectives: f });
     },
-    [t]
+    [i]
   );
-  return h(() => {
-    i("right", { isDisabled: !s, isLoading: !1 });
-  }, [s, i]), /* @__PURE__ */ o(T, { children: [
-    /* @__PURE__ */ e($, { height: 60 }),
-    /* @__PURE__ */ e(R, {}),
-    /* @__PURE__ */ o(j, { $width: 750, $flexDirection: "row", $justifyContent: "center", children: [
-      /* @__PURE__ */ e(I, { children: /* @__PURE__ */ e(
+  return g(() => {
+    n("right", { isDisabled: !m, isLoading: !1 });
+  }, [m, n]), /* @__PURE__ */ o(t, { $justifyContent: "center", $alignItems: "center", children: [
+    /* @__PURE__ */ e(A, { height: 60 }),
+    /* @__PURE__ */ e(L, {}),
+    /* @__PURE__ */ o(t, { $width: R, $flexDirection: "row", $justifyContent: "center", children: [
+      /* @__PURE__ */ e(O, { children: /* @__PURE__ */ e(
         b,
         {
           withLoader: !0,
@@ -42,7 +43,7 @@ const H = p(function() {
         }
       ) }),
       /* @__PURE__ */ o(
-        A,
+        t,
         {
           $flexGap: 24,
           $borderColor: "BLACK_1",
@@ -50,14 +51,14 @@ const H = p(function() {
           $gutterX: 1.5,
           $justifyContent: "center",
           children: [
-            /* @__PURE__ */ e(L, { $renderAs: "ab2-bold", $color: "BLACK_1", children: "What would you like your child to work on?" }),
+            /* @__PURE__ */ e(I, { $renderAs: "ab2-bold", $color: "BLACK_1", children: "What would you like your child to work on?" }),
             /* @__PURE__ */ e(
-              x,
+              $,
               {
                 size: "small",
                 renderAs: "black",
-                options: l,
-                value: a,
+                options: c,
+                value: s,
                 onChange: d,
                 optionFlexGap: 16
               }
@@ -69,6 +70,6 @@ const H = p(function() {
   ] });
 });
 export {
-  H as default
+  W as default
 };
 //# sourceMappingURL=student-personalization.js.map

package/dist/features/trial-session/comps/student-personalization/student-personalization.js.map

@@ -1 +1 @@
-{"version":3,"file":"student-personalization.js","sources":["../../../../../src/features/trial-session/comps/student-personalization/student-personalization.tsx"],"sourcesContent":["import { memo, useCallback, useEffect, useMemo } from 'react';\n\nimport { ILLUSTRATIONS } from '../../../../assets/illustrations/illustrations';\nimport { COURSE_STREAMS, PREFERENCE_CATEGORY } from '../../../milestone/constants';\nimport { getPreferencesFromConfig } from '../../../milestone/create/milestone-create-helpers';\nimport Image from '../../../ui/image/image';\nimport CheckboxInputList from '../../../ui/inputs/checkbox-input-list/checkbox-input-list';\nimport FlexView from '../../../ui/layout/flex-view';\nimport Separator from '../../../ui/separator/separator';\nimport Text from '../../../ui/text/text';\nimport { useTrialSessionContext } from '../../context/use-trial-session-context';\nimport SlideHeader from '../slide-header';\nimport * as Styled from './student-personalization-styled';\n\nconst StudentPersonalization = memo(function StudentPersonalization() {\n  const { formData, milestoneConfig, updateSlideConfig, updateButtonState } =\n    useTrialSessionContext();\n\n  const { grade, personalizedObjectives = [] } = formData || {};\n\n  const hasRequiredFields = Boolean(personalizedObjectives.length > 0);\n\n  const objectivesList = useMemo(\n    () =>\n      getPreferencesFromConfig(milestoneConfig, {\n        grade: grade ?? '',\n        courseStream: COURSE_STREAMS.MATH,\n        preferenceCategory: PREFERENCE_CATEGORY.OBJECTIVES,\n      }),\n    [grade, milestoneConfig],\n  );\n\n  const handleChangeObjectives = useCallback(\n    (value: string[]) => {\n      updateSlideConfig({ personalizedObjectives: value });\n    },\n    [updateSlideConfig],\n  );\n\n  useEffect(() => {\n    updateButtonState('right', { isDisabled: !hasRequiredFields, isLoading: false });\n  }, [hasRequiredFields, updateButtonState]);\n\n  return (\n    <Styled.Container>\n      <Separator height={60} />\n      <SlideHeader />\n      <Styled.ContentWrapper $width={750} $flexDirection=\"row\" $justifyContent=\"center\">\n        <Styled.ImageWrapper>\n          <Image\n            withLoader\n            height={402}\n            width={302}\n            className=\"image\"\n            src={ILLUSTRATIONS.PERSONALIZATION}\n          />\n        </Styled.ImageWrapper>\n        <FlexView\n          $flexGap={24}\n          $borderColor=\"BLACK_1\"\n          $background=\"GREEN_1\"\n          $gutterX={1.5}\n          $justifyContent=\"center\"\n        >\n          <Text $renderAs=\"ab2-bold\" $color=\"BLACK_1\">\n            What would you like your child to work on?\n          </Text>\n          <CheckboxInputList\n            size=\"small\"\n            renderAs=\"black\"\n            options={objectivesList}\n            value={personalizedObjectives}\n            onChange={handleChangeObjectives}\n            optionFlexGap={16}\n          />\n        </FlexView>\n      </Styled.ContentWrapper>\n    </Styled.Container>\n  );\n});\n\nexport default StudentPersonalization;\n"],"names":["StudentPersonalization","memo","formData","milestoneConfig","updateSlideConfig","updateButtonState","useTrialSessionContext","grade","personalizedObjectives","hasRequiredFields","objectivesList","useMemo","getPreferencesFromConfig","COURSE_STREAMS","PREFERENCE_CATEGORY","handleChangeObjectives","useCallback","value","useEffect","jsxs","Styled.Container","jsx","Separator","SlideHeader","Styled.ContentWrapper","Styled.ImageWrapper","Image","ILLUSTRATIONS","FlexView","Text","CheckboxInputList"],"mappings":";;;;;;;;;;;;;AAcM,MAAAA,IAAyBC,EAAK,WAAkC;AACpE,QAAM,EAAE,UAAAC,GAAU,iBAAAC,GAAiB,mBAAAC,GAAmB,mBAAAC,EAAA,IACpDC,KAEI,EAAE,OAAAC,GAAO,wBAAAC,IAAyB,CAAG,EAAA,IAAIN,KAAY,CAAA,GAErDO,IAA4BD,EAAuB,SAAS,GAE5DE,IAAiBC;AAAA,IACrB,MACEC,EAAyBT,GAAiB;AAAA,MACxC,OAAOI,KAAS;AAAA,MAChB,cAAcM,EAAe;AAAA,MAC7B,oBAAoBC,EAAoB;AAAA,IAAA,CACzC;AAAA,IACH,CAACP,GAAOJ,CAAe;AAAA,EAAA,GAGnBY,IAAyBC;AAAA,IAC7B,CAACC,MAAoB;AACD,MAAAb,EAAA,EAAE,wBAAwBa,EAAA,CAAO;AAAA,IACrD;AAAA,IACA,CAACb,CAAiB;AAAA,EAAA;AAGpB,SAAAc,EAAU,MAAM;AACd,IAAAb,EAAkB,SAAS,EAAE,YAAY,CAACI,GAAmB,WAAW,IAAO;AAAA,EAAA,GAC9E,CAACA,GAAmBJ,CAAiB,CAAC,GAGvC,gBAAAc,EAACC,GAAA,EACC,UAAA;AAAA,IAAC,gBAAAC,EAAAC,GAAA,EAAU,QAAQ,GAAI,CAAA;AAAA,sBACtBC,GAAY,EAAA;AAAA,IACb,gBAAAJ,EAACK,GAAA,EAAsB,QAAQ,KAAK,gBAAe,OAAM,iBAAgB,UACvE,UAAA;AAAA,MAAC,gBAAAH,EAAAI,GAAA,EACC,UAAA,gBAAAJ;AAAA,QAACK;AAAA,QAAA;AAAA,UACC,YAAU;AAAA,UACV,QAAQ;AAAA,UACR,OAAO;AAAA,UACP,WAAU;AAAA,UACV,KAAKC,EAAc;AAAA,QAAA;AAAA,MAAA,GAEvB;AAAA,MACA,gBAAAR;AAAA,QAACS;AAAA,QAAA;AAAA,UACC,UAAU;AAAA,UACV,cAAa;AAAA,UACb,aAAY;AAAA,UACZ,UAAU;AAAA,UACV,iBAAgB;AAAA,UAEhB,UAAA;AAAA,YAAA,gBAAAP,EAACQ,GAAK,EAAA,WAAU,YAAW,QAAO,WAAU,UAE5C,8CAAA;AAAA,YACA,gBAAAR;AAAA,cAACS;AAAA,cAAA;AAAA,gBACC,MAAK;AAAA,gBACL,UAAS;AAAA,gBACT,SAASpB;AAAA,gBACT,OAAOF;AAAA,gBACP,UAAUO;AAAA,gBACV,eAAe;AAAA,cAAA;AAAA,YACjB;AAAA,UAAA;AAAA,QAAA;AAAA,MACF;AAAA,IAAA,GACF;AAAA,EACF,EAAA,CAAA;AAEJ,CAAC;"}
+{"version":3,"file":"student-personalization.js","sources":["../../../../../src/features/trial-session/comps/student-personalization/student-personalization.tsx"],"sourcesContent":["import { memo, useCallback, useEffect, useMemo } from 'react';\n\nimport { ILLUSTRATIONS } from '../../../../assets/illustrations/illustrations';\nimport { COURSE_STREAMS, PREFERENCE_CATEGORY } from '../../../milestone/constants';\nimport { getPreferencesFromConfig } from '../../../milestone/create/milestone-create-helpers';\nimport Image from '../../../ui/image/image';\nimport CheckboxInputList from '../../../ui/inputs/checkbox-input-list/checkbox-input-list';\nimport FlexView from '../../../ui/layout/flex-view';\nimport Separator from '../../../ui/separator/separator';\nimport Text from '../../../ui/text/text';\nimport { useTrialSessionContext } from '../../context/use-trial-session-context';\nimport SlideHeader from '../slide-header';\nimport * as Styled from './student-personalization-styled';\nimport { RIGHT_PANEL_CONTENT_WIDTH } from '../../trial-session-constants';\n\nconst StudentPersonalization = memo(function StudentPersonalization() {\n  const { formData, milestoneConfig, updateSlideConfig, updateButtonState } =\n    useTrialSessionContext();\n\n  const { grade, personalizedObjectives = [] } = formData || {};\n\n  const hasRequiredFields = Boolean(personalizedObjectives.length > 0);\n\n  const objectivesList = useMemo(\n    () =>\n      getPreferencesFromConfig(milestoneConfig, {\n        grade: grade ?? '',\n        courseStream: COURSE_STREAMS.MATH,\n        preferenceCategory: PREFERENCE_CATEGORY.OBJECTIVES,\n      }),\n    [grade, milestoneConfig],\n  );\n\n  const handleChangeObjectives = useCallback(\n    (value: string[]) => {\n      updateSlideConfig({ personalizedObjectives: value });\n    },\n    [updateSlideConfig],\n  );\n\n  useEffect(() => {\n    updateButtonState('right', { isDisabled: !hasRequiredFields, isLoading: false });\n  }, [hasRequiredFields, updateButtonState]);\n\n  return (\n    <FlexView $justifyContent=\"center\" $alignItems=\"center\">\n      <Separator height={60} />\n      <SlideHeader />\n      <FlexView $width={RIGHT_PANEL_CONTENT_WIDTH} $flexDirection=\"row\" $justifyContent=\"center\">\n        <Styled.ImageWrapper>\n          <Image\n            withLoader\n            height={402}\n            width={302}\n            className=\"image\"\n            src={ILLUSTRATIONS.PERSONALIZATION}\n          />\n        </Styled.ImageWrapper>\n        <FlexView\n          $flexGap={24}\n          $borderColor=\"BLACK_1\"\n          $background=\"GREEN_1\"\n          $gutterX={1.5}\n          $justifyContent=\"center\"\n        >\n          <Text $renderAs=\"ab2-bold\" $color=\"BLACK_1\">\n            What would you like your child to work on?\n          </Text>\n          <CheckboxInputList\n            size=\"small\"\n            renderAs=\"black\"\n            options={objectivesList}\n            value={personalizedObjectives}\n            onChange={handleChangeObjectives}\n            optionFlexGap={16}\n          />\n        </FlexView>\n      </FlexView>\n    </FlexView>\n  );\n});\n\nexport default StudentPersonalization;\n"],"names":["StudentPersonalization","memo","formData","milestoneConfig","updateSlideConfig","updateButtonState","useTrialSessionContext","grade","personalizedObjectives","hasRequiredFields","objectivesList","useMemo","getPreferencesFromConfig","COURSE_STREAMS","PREFERENCE_CATEGORY","handleChangeObjectives","useCallback","value","useEffect","jsxs","FlexView","jsx","Separator","SlideHeader","RIGHT_PANEL_CONTENT_WIDTH","Styled.ImageWrapper","Image","ILLUSTRATIONS","Text","CheckboxInputList"],"mappings":";;;;;;;;;;;;;;AAeM,MAAAA,IAAyBC,EAAK,WAAkC;AACpE,QAAM,EAAE,UAAAC,GAAU,iBAAAC,GAAiB,mBAAAC,GAAmB,mBAAAC,EAAA,IACpDC,KAEI,EAAE,OAAAC,GAAO,wBAAAC,IAAyB,CAAG,EAAA,IAAIN,KAAY,CAAA,GAErDO,IAA4BD,EAAuB,SAAS,GAE5DE,IAAiBC;AAAA,IACrB,MACEC,EAAyBT,GAAiB;AAAA,MACxC,OAAOI,KAAS;AAAA,MAChB,cAAcM,EAAe;AAAA,MAC7B,oBAAoBC,EAAoB;AAAA,IAAA,CACzC;AAAA,IACH,CAACP,GAAOJ,CAAe;AAAA,EAAA,GAGnBY,IAAyBC;AAAA,IAC7B,CAACC,MAAoB;AACD,MAAAb,EAAA,EAAE,wBAAwBa,EAAA,CAAO;AAAA,IACrD;AAAA,IACA,CAACb,CAAiB;AAAA,EAAA;AAGpB,SAAAc,EAAU,MAAM;AACd,IAAAb,EAAkB,SAAS,EAAE,YAAY,CAACI,GAAmB,WAAW,IAAO;AAAA,EAAA,GAC9E,CAACA,GAAmBJ,CAAiB,CAAC,GAGtC,gBAAAc,EAAAC,GAAA,EAAS,iBAAgB,UAAS,aAAY,UAC7C,UAAA;AAAA,IAAC,gBAAAC,EAAAC,GAAA,EAAU,QAAQ,GAAI,CAAA;AAAA,sBACtBC,GAAY,EAAA;AAAA,sBACZH,GAAS,EAAA,QAAQI,GAA2B,gBAAe,OAAM,iBAAgB,UAChF,UAAA;AAAA,MAAC,gBAAAH,EAAAI,GAAA,EACC,UAAA,gBAAAJ;AAAA,QAACK;AAAA,QAAA;AAAA,UACC,YAAU;AAAA,UACV,QAAQ;AAAA,UACR,OAAO;AAAA,UACP,WAAU;AAAA,UACV,KAAKC,EAAc;AAAA,QAAA;AAAA,MAAA,GAEvB;AAAA,MACA,gBAAAR;AAAA,QAACC;AAAA,QAAA;AAAA,UACC,UAAU;AAAA,UACV,cAAa;AAAA,UACb,aAAY;AAAA,UACZ,UAAU;AAAA,UACV,iBAAgB;AAAA,UAEhB,UAAA;AAAA,YAAA,gBAAAC,EAACO,GAAK,EAAA,WAAU,YAAW,QAAO,WAAU,UAE5C,8CAAA;AAAA,YACA,gBAAAP;AAAA,cAACQ;AAAA,cAAA;AAAA,gBACC,MAAK;AAAA,gBACL,UAAS;AAAA,gBACT,SAASnB;AAAA,gBACT,OAAOF;AAAA,gBACP,UAAUO;AAAA,gBACV,eAAe;AAAA,cAAA;AAAA,YACjB;AAAA,UAAA;AAAA,QAAA;AAAA,MACF;AAAA,IAAA,GACF;AAAA,EACF,EAAA,CAAA;AAEJ,CAAC;"}

package/dist/features/trial-session/comps/student-profile/student-profile.js

@@ -1,46 +1,47 @@
 import { jsx as e, jsxs as i } from "react/jsx-runtime";
-import { memo as N, useMemo as C, useCallback as U, useEffect as f } from "react";
+import { memo as k, useMemo as C, useCallback as U, useEffect as f } from "react";
 import { ILLUSTRATIONS as c } from "../../../../assets/illustrations/illustrations.js";
 import { GOAL_CATEGORY as L } from "../../../milestone/constants.js";
-import W from "../../../ui/error/error.js";
-import v from "../../../ui/image/image.js";
-import A from "../../../ui/layout/flex-view.js";
-import K from "../../../ui/loader/app-loader/app-loader.js";
-import I from "../../../ui/separator/separator.js";
+import v from "../../../ui/error/error.js";
+import K from "../../../ui/image/image.js";
+import I from "../../../ui/layout/flex-view.js";
+import M from "../../../ui/loader/app-loader/app-loader.js";
+import A from "../../../ui/separator/separator.js";
 import u from "../../../ui/text/text.js";
-import { useGetStudentProfileSummary as M } from "../../api/student-profile-summary.js";
-import { useTrialSessionContext as X } from "../../context/use-trial-session-context.js";
-import { getFormattedStudentPersonalizedPreference as y } from "../../helper.js";
-import j from "../slide-header/index.js";
-import { GOAL_MAPPING as z } from "./constant.js";
-import F from "./student-profile-highlights/student-profile-highlights.js";
-import { Container as V, ContentWrapper as b, AbsoluteImage as Y, ImageWrapper as q } from "./student-profile-styled.js";
-import { getDummyProfileImage as J, getMilestoneGoalName as G } from "./student-profile-utils.js";
-const Pe = N(function() {
+import { useGetStudentProfileSummary as X } from "../../api/student-profile-summary.js";
+import { useTrialSessionContext as j } from "../../context/use-trial-session-context.js";
+import { getFormattedStudentPersonalizedPreference as T } from "../../helper.js";
+import z from "../slide-header/index.js";
+import { GOAL_MAPPING as F } from "./constant.js";
+import V from "./student-profile-highlights/student-profile-highlights.js";
+import { Container as Y, ContentWrapper as y, AbsoluteImage as q, ImageWrapper as J } from "./student-profile-styled.js";
+import { getDummyProfileImage as Q, getMilestoneGoalName as b } from "./student-profile-utils.js";
+import { RIGHT_PANEL_CONTENT_WIDTH as G } from "../../trial-session-constants.js";
+const Se = k(function() {
   const {
     isTeacher: n,
     studentId: p,
     formData: O,
-    slideConfig: T,
+    slideConfig: R,
     milestoneConfig: m,
     updateSlideConfig: g,
     updateButtonState: h
-  } = X(), { showProfileHighlights: r } = T, {
+  } = j(), { showProfileHighlights: r } = R, {
     name: x,
     goals: t = [],
     studentProfile: a,
     personalizedObjectives: P = [],
     personalizedPosition: _ = []
-  } = O || {}, { dummyProfileImageIndex: R, profileSummary: w } = a || {}, B = J(R), l = C(() => t && t.length > 0 ? {
-    school_success_goal: G(t, L.SCHOOL_SUCCESS),
-    test_prep_goal: G(t, L.TEST_PREP)
+  } = O || {}, { dummyProfileImageIndex: w, profileSummary: D } = a || {}, H = Q(w), l = C(() => t && t.length > 0 ? {
+    school_success_goal: b(t, L.SCHOOL_SUCCESS),
+    test_prep_goal: b(t, L.TEST_PREP)
   } : null, [t]), {
     get: S,
-    data: D,
+    data: N,
     isProcessing: s,
-    isProcessed: $,
-    isProcessingFailed: H
-  } = M(), { profile_summary: E } = D || {}, d = U(() => {
+    isProcessed: E,
+    isProcessingFailed: B
+  } = X(), { profile_summary: $ } = N || {}, d = U(() => {
     l && S(p, l);
   }, [S, l, p]);
   f(() => {
@@ -48,18 +49,18 @@ const Pe = N(function() {
   }, [s, h]), f(() => {
     n && !a && !r && d();
   }, [d, n, a, r]), f(() => {
-    n && $ && !r && g({
+    n && E && !r && g({
       studentProfile: {
-        profileSummary: E || "",
+        profileSummary: $ || "",
         dummyProfileImageIndex: Math.floor(Math.random() * 6)
       }
     });
-  }, [$, n, r, E, g]);
-  const k = C(
+  }, [E, n, r, $, g]);
+  const W = C(
     () => [
       {
         title: "Student Level",
-        description: `Catching up: ${y(
+        description: `Catching up: ${T(
           m,
           _
         ).map((o) => o.preference_description)}`,
@@ -70,7 +71,7 @@ const Pe = N(function() {
         illustration: c.ARROW_BOARD_GREEN,
         background: "GREEN_1",
         title: "Goals",
-        description: y(
+        description: T(
           m,
           P
         ).map((o) => o.preference_name)
@@ -80,23 +81,23 @@ const Pe = N(function() {
         background: "PURPLE_1",
         title: "Learning Plan",
         description: t.map(
-          (o) => `${z[o.goal_category]}: ${o.milestone_name}`
+          (o) => `${F[o.goal_category]}: ${o.milestone_name}`
         )
       }
     ],
     [t, m, P, _]
   );
-  return H ? /* @__PURE__ */ e(W, { height: "70vh", onTryAgain: d }) : s || !a && !r ? /* @__PURE__ */ e(K, { height: "100vh" }) : /* @__PURE__ */ i(V, { children: [
-    /* @__PURE__ */ e(I, { height: 60 }),
-    /* @__PURE__ */ e(j, { marginBottom: r ? 50 : 100 }),
-    r ? /* @__PURE__ */ i(b, { $width: 650, children: [
-      /* @__PURE__ */ e(F, { profileHighlights: k }),
-      /* @__PURE__ */ e(I, { height: 16 }),
+  return B ? /* @__PURE__ */ e(v, { height: "70vh", onTryAgain: d }) : s || !a && !r ? /* @__PURE__ */ e(M, { height: "100vh" }) : /* @__PURE__ */ i(Y, { children: [
+    /* @__PURE__ */ e(A, { height: 60 }),
+    /* @__PURE__ */ e(z, { marginBottom: r ? 50 : 100 }),
+    r ? /* @__PURE__ */ i(y, { $width: G - 100, children: [
+      /* @__PURE__ */ e(V, { profileHighlights: W }),
+      /* @__PURE__ */ e(A, { height: 16 }),
       /* @__PURE__ */ e(u, { $renderAs: "ub3", $color: "BLACK_T_60", $align: "center", children: "We can always revisit this later" })
-    ] }) : /* @__PURE__ */ i(b, { $widthX: 46.875, children: [
-      /* @__PURE__ */ e(Y, {}),
+    ] }) : /* @__PURE__ */ i(y, { $width: G, children: [
+      /* @__PURE__ */ e(q, {}),
       /* @__PURE__ */ i(
-        A,
+        I,
         {
           $width: "100%",
           $heightX: 21.875,
@@ -108,10 +109,10 @@ const Pe = N(function() {
           $borderColor: "BLACK_T_87",
           $borderRadiusX: 0.5,
           children: [
-            /* @__PURE__ */ e(q, { children: /* @__PURE__ */ e(v, { withLoader: !0, height: 200, width: 200, src: B }) }),
-            /* @__PURE__ */ i(A, { $flexGap: 16, children: [
+            /* @__PURE__ */ e(J, { children: /* @__PURE__ */ e(K, { withLoader: !0, height: 200, width: 200, src: H }) }),
+            /* @__PURE__ */ i(I, { $flexGap: 16, children: [
               /* @__PURE__ */ e(u, { $renderAs: "ac2-black", children: x }),
-              /* @__PURE__ */ e(u, { $renderAs: "ab1", children: w || "" })
+              /* @__PURE__ */ e(u, { $renderAs: "ab1", children: D || "" })
             ] })
           ]
         }
@@ -120,6 +121,6 @@ const Pe = N(function() {
   ] });
 });
 export {
-  Pe as default
+  Se as default
 };
 //# sourceMappingURL=student-profile.js.map