@cuemath/leap 2.8.25-rj-4 → 2.8.25

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

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