@cuemath/leap 2.9.8-as3 → 2.9.8

package/dist/features/worksheet/worksheet/worksheet-question/worksheet-question.js

@@ -1,30 +1,30 @@
-import { jsxs as I, jsx as r, Fragment as Ut } from "react/jsx-runtime";
-import { memo as Kt, useMemo as R, useState as A, useRef as U, useCallback as Vt, useEffect as E, useLayoutEffect as Xt } from "react";
-import { IMAGES as Pt } from "../../../../assets/images/images.js";
-import jt from "../../../cue-canvas/cue-canvas.js";
-import Gt from "../../../pointer-sync/pointer.js";
-import bt from "../../../ui/layout/flex-view.js";
-import Yt from "../../constants/events.js";
-import { QUESTIONS_GAP as Zt, LEARNOSITY_KEYBOARD_HEIGHT as St } from "../constants.js";
-import { getPaperColorByQuestion as Jt, isConceptIntroWidget as qt, scrollToQuestion as Wt } from "../worksheet-helpers.js";
-import kt from "./header/header.js";
-import te from "./learnosity-question.js";
-import ee from "./question-backdrop/question-backdrop.js";
-import re from "./subjective-review.js";
-import ie from "./system-intros/advanced-practice-intro.js";
-import oe from "./system-intros/basic-practice-intro.js";
-import ne from "./system-intros/exit-ticket-intro.js";
-import ce from "./system-intros/regular-practice-intro.js";
-import { QuestionContainerWrapper as ae, StimulusReview as se, QuestionContainer as le, QuestionWrapper as me, LessonOverviewBanner as ue, CueCanvasWrapper as fe, Hint as he, Solution as de } from "./worksheet-question-styled.js";
-const Ie = Kt(
+import { jsxs as I, jsx as e, Fragment as Kt } from "react/jsx-runtime";
+import { memo as Vt, useMemo as R, useState as A, useRef as U, useCallback as Xt, useEffect as E, useLayoutEffect as Pt } from "react";
+import { IMAGES as jt } from "../../../../assets/images/images.js";
+import Gt from "../../../cue-canvas/cue-canvas.js";
+import Yt from "../../../pointer-sync/pointer.js";
+import Ht from "../../../ui/layout/flex-view.js";
+import Zt from "../../constants/events.js";
+import { QUESTIONS_GAP as Jt, LEARNOSITY_KEYBOARD_HEIGHT as bt } from "../constants.js";
+import { getPaperColorByQuestion as qt, isConceptIntroWidget as kt, scrollToQuestion as Wt } from "../worksheet-helpers.js";
+import ti from "./header/header.js";
+import ii from "./learnosity-question.js";
+import ei from "./question-backdrop/question-backdrop.js";
+import ri from "./subjective-review.js";
+import oi from "./system-intros/advanced-practice-intro.js";
+import ni from "./system-intros/basic-practice-intro.js";
+import ci from "./system-intros/exit-ticket-intro.js";
+import ai from "./system-intros/regular-practice-intro.js";
+import { QuestionContainerWrapper as si, StimulusReview as mi, QuestionContainer as li, QuestionWrapper as ui, LessonOverviewBanner as fi, CueCanvasWrapper as hi, Hint as di, Solution as gi } from "./worksheet-question-styled.js";
+const Ai = Vt(
   ({
     userType: c,
     signedRequest: Ct,
     worksheetCompleted: f,
     question: n,
-    response: e,
-    nextQuestionId: v,
-    isActive: w,
+    response: i,
+    nextQuestionId: S,
+    isActive: v,
     isHidden: M,
     canRender: K,
     loggerRef: O,
@@ -33,11 +33,12 @@ const Ie = Kt(
     behavior: X,
     layout: P,
     actionbarHeight: yt,
-    learnosity: H,
+    learnosity: w,
     intersectionObserver: j,
     background: G = "paper",
-    onMarkForReview: Bt,
-    userId: xt,
+    onMediaStateChange: Bt,
+    onMarkForReview: xt,
+    userId: Lt,
     onPublishStrokes: Y,
     onReceiveStrokes: Z,
     isScribblingEnabled: J,
@@ -45,61 +46,61 @@ const Ie = Kt(
     isCanvasEnabled: q,
     onPublishMouseMove: k,
     onSubscribeMouseMove: tt,
-    setActiveQuestionId: et,
-    canResolveDoubt: Lt,
-    onResolveDoubt: Tt,
-    studentId: It,
-    responses: At,
-    subjectiveProps: rt
+    setActiveQuestionId: it,
+    canResolveDoubt: Tt,
+    onResolveDoubt: It,
+    studentId: At,
+    responses: Mt,
+    subjectiveProps: et
   }) => {
     const C = R(
-      () => G === "paper" ? Jt(n) : void 0,
+      () => G === "paper" ? qt(n) : void 0,
       [G, n]
-    ), [y, Mt] = A(), [it, Ot] = A(), {
+    ), [y, Ot] = A(), [rt, Nt] = A(), {
       validation: ot,
       review: Q,
       maximumAttempts: nt,
       canExceedAttempts: ct,
-      teacherValidationEnabled: b,
+      teacherValidationEnabled: H,
       solutionHidden: at
-    } = X, { minQuestionHeight: Nt, topOffset: st, questionsScrollable: B } = P, {
+    } = X, { minQuestionHeight: Qt, topOffset: st, questionsScrollable: B } = P, {
       type: _,
-      response_id: i,
+      response_id: r,
       stimulus_review: $,
       item_type: h,
-      instructor_stimulus: lt,
-      metadata: { hints: d, solution: S, widget_reference: mt },
+      instructor_stimulus: mt,
+      metadata: { hints: d, solution: b, widget_reference: lt },
       item_reference: ut,
       question_number: ft,
       item_number: ht,
       item_display_number: dt
-    } = n, gt = !!$, x = h === "overview", m = qt(lt), g = lt === "SystemIntro", Et = m || g, _t = e == null ? void 0 : e.responseEdited, Qt = R(() => {
+    } = n, gt = !!$, x = h === "overview", l = kt(mt), g = mt === "SystemIntro", Et = l || g, _t = i == null ? void 0 : i.responseEdited, Ft = R(() => {
       const t = [];
-      return _t && c === "TEACHER" && t.push("attempting"), a || t.push("hidden"), _ === "hotspot" && t.push("correct-answers-hidden"), a && b && _ === "clozetext" && (!m || c === "STUDENT" ? t.push("response-hidden") : t.push("response-code-hidden")), x && t.push("lesson-overview"), m && t.push("concept-intro"), g && t.push("system-intro"), t.join(" ");
+      return _t && c === "TEACHER" && t.push("attempting"), a || t.push("hidden"), _ === "hotspot" && t.push("correct-answers-hidden"), a && H && _ === "clozetext" && (!l || c === "STUDENT" ? t.push("response-hidden") : t.push("response-code-hidden")), x && t.push("lesson-overview"), l && t.push("concept-intro"), g && t.push("system-intro"), t.join(" ");
     }, [
       a,
-      m,
+      l,
       x,
       g,
       _,
       _t,
-      b,
+      H,
       c
-    ]), F = U({}), L = (e == null ? void 0 : e.hintsUsed) ?? 0, [$t] = A((e == null ? void 0 : e.validatedByTeacher) ?? !1), T = U(null), z = U(null), D = R(() => d == null ? void 0 : d.slice(0, L), [d, L]), pt = R(() => c === "TEACHER" || f ? !0 : !e || !e.response || e.responseEdited ? !1 : ot, [e, c, ot, f]), Rt = R(() => {
+    ]), F = U({}), L = (i == null ? void 0 : i.hintsUsed) ?? 0, [$t] = A((i == null ? void 0 : i.validatedByTeacher) ?? !1), T = U(null), z = U(null), D = R(() => d == null ? void 0 : d.slice(0, L), [d, L]), pt = R(() => c === "TEACHER" || f ? !0 : !i || !i.response || i.responseEdited ? !1 : ot, [i, c, ot, f]), Rt = R(() => {
       if (c === "TEACHER") return !0;
       if (Q) {
-        const { attemptsHistory: t } = e ?? {};
+        const { attemptsHistory: t } = i ?? {};
         return ((t == null ? void 0 : t.length) ?? 0) >= nt && !ct;
       }
       return !1;
-    }, [ct, nt, e, Q, c]), Ft = R(
-      () => S && f && !at,
-      [at, S, f]
-    ), [vt, zt] = A({
+    }, [ct, nt, i, Q, c]), zt = R(
+      () => b && f && !at,
+      [at, b, f]
+    ), [St, Dt] = A({
       width: 0,
       height: 0
-    }), Dt = Vt((t) => {
-      Ot(t);
+    }), Ut = Xt((t) => {
+      Nt(t);
     }, []);
     return E(() => {
       T.current && j.observe(T.current);
@@ -109,46 +110,46 @@ const Ie = Kt(
           `.widget-${n.response_id} .lrn_draggable`
         );
         let s = 0, o = 0;
-        t.forEach((l) => {
-          s = Math.max(s, l.clientWidth + 33), o = Math.max(o, l.clientHeight + 1);
-        }), zt({
+        t.forEach((m) => {
+          s = Math.max(s, m.clientWidth + 33), o = Math.max(o, m.clientHeight + 1);
+        }), Dt({
           width: n.type !== "association" ? s : 0,
           height: o
         });
       }
     }, [a, n.response_id, n.type]), E(() => {
       if (a && pt) {
-        const t = H.question(i);
+        const t = w.question(r);
         t && t.validate({
           showCorrectAnswers: Rt
         });
       }
-    }, [a, H, i, Q, Rt, c, pt]), E(() => {
+    }, [a, w, r, Q, Rt, c, pt]), E(() => {
       const t = z.current;
-      if (a && t && O.current && F.current[i] === void 0 && !m && !g) {
+      if (a && t && O.current && F.current[r] === void 0 && !l && !g) {
         const s = t.clientWidth, o = t.querySelectorAll("*");
-        for (let l = 0; l < o.length; l++) {
-          const u = o[l];
+        for (let m = 0; m < o.length; m++) {
+          const u = o[m];
           if (u != null && u.closest(".resize-sensor"))
             continue;
           if (((u == null ? void 0 : u.clientWidth) ?? 0) > s) {
-            F.current[i] = !0, O.current(Yt.WORKSHEET_V3_GREATER_WIDTH_ELEMENT, {
+            F.current[r] = !0, O.current(Zt.WORKSHEET_V3_GREATER_WIDTH_ELEMENT, {
               item_reference: ut,
-              widget_reference: mt,
+              widget_reference: lt,
               question_type: _,
               question_number: ft,
-              responseId: i,
+              responseId: r,
               item_number: ht,
               item_display_number: dt
             });
             break;
           }
         }
-        F.current[i] = !1;
+        F.current[r] = !1;
       }
     }, [
       a,
-      m,
+      l,
       g,
       dt,
       ht,
@@ -156,64 +157,64 @@ const Ie = Kt(
       O,
       _,
       ft,
-      i,
-      mt
+      r,
+      lt
     ]), E(() => {
       const t = T.current, s = (o) => {
-        const l = o.querySelector(".lrn_response_wrapper");
-        if (!l)
+        const m = o.querySelector(".lrn_response_wrapper");
+        if (!m)
           return 0;
-        const u = o.getBoundingClientRect().bottom, W = l.getBoundingClientRect().bottom, p = Math.abs(u - W);
-        return p < St ? St - p : 0;
+        const u = o.getBoundingClientRect().bottom, W = m.getBoundingClientRect().bottom, p = Math.abs(u - W);
+        return p < bt ? bt - p : 0;
       };
-      a && t && Mt((o) => {
-        var Ht;
-        const W = ((Ht = n.ui_style) == null ? void 0 : Ht.type) === "floating-keyboard" && !(b && _ === "clozetext"), p = t.clientHeight;
+      a && t && Ot((o) => {
+        var wt;
+        const W = ((wt = n.ui_style) == null ? void 0 : wt.type) === "floating-keyboard" && !(H && _ === "clozetext"), p = t.clientHeight;
         if (p === 0)
           return o;
         if (!o)
           return Math.ceil(
             p + (W ? s(t) : 0)
           );
-        const wt = Math.ceil(
+        const vt = Math.ceil(
           p + (W ? s(t) : 0)
         );
-        return Math.abs(wt - o) > 4 ? wt : o;
+        return Math.abs(vt - o) > 4 ? vt : o;
       });
-    }), Xt(() => {
-      !B && !M && Wt(i);
-    }, [M, B, i, st]), E(() => {
-      (L || gt || S && f) && H.renderMath("mathjax");
-    }, [gt, L, H, S, f]), E(() => {
-      if (b && v && !$t && (e != null && e.validatedByTeacher)) {
+    }), Pt(() => {
+      !B && !M && Wt(r);
+    }, [M, B, r, st]), E(() => {
+      (L || gt || b && f) && w.renderMath("mathjax");
+    }, [gt, L, w, b, f]), E(() => {
+      if (H && S && !$t && (i != null && i.validatedByTeacher)) {
         const t = setTimeout(() => {
-          B ? Wt(v) : et(v);
+          B ? Wt(S) : it(S);
         }, 1e3);
         return () => {
           clearTimeout(t);
         };
       }
     }, [
-      v,
-      b,
+      S,
+      H,
       $t,
       B,
-      et,
-      e == null ? void 0 : e.validatedByTeacher
+      it,
+      i == null ? void 0 : i.validatedByTeacher
     ]), /* @__PURE__ */ I(
-      ae,
+      si,
       {
-        "data-response-id": i,
-        className: `widget-${i}`,
+        "data-response-id": r,
+        className: `widget-${r}`,
         ref: T,
         $topOffset: st,
         $flexDirection: $ ? "row" : "column",
         $alignItems: $ ? "flex-start" : "center",
         $hidden: M,
-        $marginBottom: Zt,
+        $marginBottom: Jt,
         children: [
-          $ && /* @__PURE__ */ r(
-            se,
+          $ && /* @__PURE__ */ e(
+            mi,
             {
               dangerouslySetInnerHTML: {
                 __html: $
@@ -221,95 +222,97 @@ const Ie = Kt(
             }
           ),
           /* @__PURE__ */ I(
-            le,
+            li,
             {
               ref: z,
               $width: $ ? "50%" : `${V}px`,
-              $minHeight: y ? Math.max(y - 72, it ?? 0) : Nt,
-              $isActive: w,
+              $minHeight: y ? Math.max(y - 72, rt ?? 0) : Qt,
+              $isActive: v,
               $paperColor: C,
-              $opacity: w ? 1 : 0.2,
+              $opacity: v ? 1 : 0.2,
               children: [
-                w && !!k && !!tt && q && /* @__PURE__ */ r(
-                  Gt,
+                v && !!k && !!tt && q && /* @__PURE__ */ e(
+                  Yt,
                   {
                     containerRef: z,
                     onPublish: k,
                     onSubscribe: tt,
-                    responseId: i
+                    responseId: r
                   }
                 ),
                 /* @__PURE__ */ I(
-                  me,
+                  ui,
                   {
-                    className: Qt,
-                    $dropzoneMinWidth: vt.width,
-                    $dropzoneMinHeight: vt.height,
+                    className: Ft,
+                    $dropzoneMinWidth: St.width,
+                    $dropzoneMinHeight: St.height,
                     children: [
-                      !(x || m || g) && /* @__PURE__ */ r(
-                        kt,
+                      !(x || l || g) && /* @__PURE__ */ e(
+                        ti,
                         {
                           userType: c,
                           question: n,
-                          response: e,
+                          response: i,
                           behavior: X,
                           layout: P,
                           paperColor: C,
-                          onMarkForReview: Bt,
+                          onMarkForReview: xt,
                           actionbarHeight: yt,
-                          canResolveDoubt: Lt,
-                          onResolveDoubt: Tt,
+                          canResolveDoubt: Tt,
+                          onResolveDoubt: It,
                           worksheetCompleted: f
                         }
                       ),
-                      x && /* @__PURE__ */ r(ue, { src: Pt.LESSON_OVERVIEW_BANNER }),
-                      m && C && /* @__PURE__ */ r(ee, { paperColor: C }),
-                      g ? /* @__PURE__ */ I(Ut, { children: [
-                        h === "practice-basic" && /* @__PURE__ */ r(oe, {}),
-                        h === "practice-regular" && /* @__PURE__ */ r(ce, {}),
-                        h === "exit-ticket" && /* @__PURE__ */ r(ne, {}),
-                        (h == null ? void 0 : h.startsWith("advanced-")) && /* @__PURE__ */ r(ie, {})
+                      x && /* @__PURE__ */ e(fi, { src: jt.LESSON_OVERVIEW_BANNER }),
+                      l && C && /* @__PURE__ */ e(ei, { paperColor: C }),
+                      g ? /* @__PURE__ */ I(Kt, { children: [
+                        h === "practice-basic" && /* @__PURE__ */ e(ni, {}),
+                        h === "practice-regular" && /* @__PURE__ */ e(ai, {}),
+                        h === "exit-ticket" && /* @__PURE__ */ e(ci, {}),
+                        (h == null ? void 0 : h.startsWith("advanced-")) && /* @__PURE__ */ e(oi, {})
                       ] }) : void 0,
-                      /* @__PURE__ */ r(
-                        te,
+                      /* @__PURE__ */ e(
+                        ii,
                         {
                           signedRequest: Ct,
                           appended: a,
                           question: n,
-                          response: e == null ? void 0 : e.response,
-                          canRender: K || w,
-                          learnosity: H,
+                          response: i == null ? void 0 : i.response,
+                          canRender: K || v,
+                          learnosity: w,
                           canForceAppend: c === "TEACHER",
-                          isConceptIntro: m
+                          isConceptIntro: l,
+                          simState: i == null ? void 0 : i.simState,
+                          onMediaStateChange: Bt
                         }
                       ),
-                      !Et && q && Y && Z && y !== void 0 && /* @__PURE__ */ r(fe, { $canScribble: J, children: /* @__PURE__ */ r(
-                        jt,
+                      !Et && q && Y && Z && y !== void 0 && /* @__PURE__ */ e(hi, { $canScribble: J, children: /* @__PURE__ */ e(
+                        Gt,
                         {
                           canRender: K,
-                          canScribble: J && w,
+                          canScribble: J && v,
                           appended: a,
-                          responseId: i,
+                          responseId: r,
                           width: V,
-                          height: Math.max(y, it ?? 0),
-                          onUpdateHeight: Dt,
+                          height: Math.max(y, rt ?? 0),
+                          onUpdateHeight: Ut,
                           onPublish: Y,
                           onSubscribe: Z,
-                          userId: xt,
-                          initialData: N == null ? void 0 : N[i],
+                          userId: Lt,
+                          initialData: N == null ? void 0 : N[r],
                           userType: c
                         }
                       ) }),
-                      !Et && D && D.length > 0 && /* @__PURE__ */ r(
-                        bt,
+                      !Et && D && D.length > 0 && /* @__PURE__ */ e(
+                        Ht,
                         {
                           $background: "BLUE_1",
                           $gutterX: 1,
                           $gapX: 0.5,
                           $borderRadiusX: 0,
                           $borderColor: "BLUE_2",
-                          children: D.map((t, s) => /* @__PURE__ */ r(
-                            he,
+                          children: D.map((t, s) => /* @__PURE__ */ e(
+                            di,
                             {
                               dangerouslySetInnerHTML: {
                                 __html: `<span style="color: #DA5107; font-weight: 600;">Hint${((d == null ? void 0 : d.length) ?? 0) > 1 ? ` ${s + 1}` : ""}:</span>&nbsp;${t}`
@@ -319,34 +322,34 @@ const Ie = Kt(
                           ))
                         }
                       ),
-                      Ft && /* @__PURE__ */ r(
-                        bt,
+                      zt && /* @__PURE__ */ e(
+                        Ht,
                         {
                           $background: "YELLOW_1",
                           $gutterX: 1,
                           $gapX: 0.875,
                           $borderRadiusX: 0,
                           $borderColor: "YELLOW_2",
-                          children: /* @__PURE__ */ r(
-                            de,
+                          children: /* @__PURE__ */ e(
+                            gi,
                             {
                               dangerouslySetInnerHTML: {
-                                __html: `<div style="color: #DA5107; font-weight: 600;">Solution:</div>${S}`
+                                __html: `<div style="color: #DA5107; font-weight: 600;">Solution:</div>${b}`
                               }
                             }
                           )
                         }
                       ),
-                      !!rt && /* @__PURE__ */ r(
-                        re,
+                      !!et && /* @__PURE__ */ e(
+                        ri,
                         {
-                          responses: At,
-                          response: e,
-                          nextQuestionId: v,
-                          responseId: i,
-                          studentId: It,
+                          responses: Mt,
+                          response: i,
+                          nextQuestionId: S,
+                          responseId: r,
+                          studentId: At,
                           userType: c,
-                          ...rt
+                          ...et
                         }
                       )
                     ]
@@ -361,6 +364,6 @@ const Ie = Kt(
   }
 );
 export {
-  Ie as default
+  Ai as default
 };
 //# sourceMappingURL=worksheet-question.js.map