catchup-library-web 1.15.3 → 1.15.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.js CHANGED
@@ -80,6 +80,7 @@ __export(index_exports, {
80
80
  BaseLoading: () => BaseLoading_default,
81
81
  BaseLoadingWithText: () => BaseLoadingWithText_default,
82
82
  BaseModal: () => BaseModal_default,
83
+ BasePDF: () => BasePDF_default,
83
84
  BaseTitle: () => BaseTitle_default,
84
85
  BlueVerticalDividerLine: () => BlueVerticalDividerLine_default,
85
86
  BrandLabel: () => BrandLabel_default,
@@ -1198,15 +1199,66 @@ var BaseModal = ({
1198
1199
  };
1199
1200
  var BaseModal_default = BaseModal;
1200
1201
 
1201
- // src/components/activities/empty-content/ActivityEmptyContent.tsx
1202
+ // src/components/pdfs/BasePDF.tsx
1203
+ var import_react10 = require("react");
1204
+ var import_react_pdf = require("react-pdf");
1202
1205
  var import_jsx_runtime15 = require("react/jsx-runtime");
1206
+ var BasePDF = ({ file }) => {
1207
+ const [pageNumber, setPageNumber] = (0, import_react10.useState)(1);
1208
+ const [numberOfPages, setNumberOfPages] = (0, import_react10.useState)(0);
1209
+ const handleOnDocumentLoadSuccess = ({ numPages }) => {
1210
+ setPageNumber(1);
1211
+ setNumberOfPages(numPages);
1212
+ };
1213
+ return /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(import_react_pdf.Document, { file, onLoadSuccess: handleOnDocumentLoadSuccess, children: [
1214
+ /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_react_pdf.Page, { pageNumber }),
1215
+ /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("div", { className: "flex flex-row items-center justify-center", children: [
1216
+ pageNumber === 1 ? null : /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { className: "px-2", children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { className: "cursor-pointer", children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
1217
+ BaseImage_default,
1218
+ {
1219
+ alt: "arrow-left",
1220
+ src: "/icons/arrow-left.webp",
1221
+ size: "small",
1222
+ onClick: () => {
1223
+ setPageNumber(pageNumber - 1);
1224
+ }
1225
+ }
1226
+ ) }) }),
1227
+ Array.from(Array(numberOfPages).keys()).filter((index) => index < pageNumber + 5).filter((index) => index > pageNumber - 5).map((index) => /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { className: "px-2", children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
1228
+ "p",
1229
+ {
1230
+ className: `${pageNumber === index + 1 ? "text-2xl" : "text-md"} cursor-pointer`,
1231
+ onClick: () => {
1232
+ setPageNumber(index + 1);
1233
+ },
1234
+ children: index + 1
1235
+ }
1236
+ ) }, index)),
1237
+ numberOfPages === 0 || pageNumber === numberOfPages ? null : /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { className: "px-2", children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { className: "cursor-pointer", children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
1238
+ BaseImage_default,
1239
+ {
1240
+ src: "/icons/arrow-right.webp",
1241
+ alt: "arrow-right",
1242
+ size: "small",
1243
+ onClick: () => {
1244
+ setPageNumber(pageNumber + 1);
1245
+ }
1246
+ }
1247
+ ) }) })
1248
+ ] })
1249
+ ] });
1250
+ };
1251
+ var BasePDF_default = BasePDF;
1252
+
1253
+ // src/components/activities/empty-content/ActivityEmptyContent.tsx
1254
+ var import_jsx_runtime16 = require("react/jsx-runtime");
1203
1255
  var ActivityEmptyContent = () => {
1204
- return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { className: "flex flex-col items-center justify-center border-2 border-catchup-orange rounded-catchup-xlarge px-5 py-2 my-5 bg-catchup-orange", children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { className: "", children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("p", { className: "text-catchup-white text-xl", children: i18n_default.t("you_have_set_this_activity_as_empty") }) }) });
1256
+ return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { className: "flex flex-col items-center justify-center border-2 border-catchup-orange rounded-catchup-xlarge px-5 py-2 my-5 bg-catchup-orange", children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { className: "", children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("p", { className: "text-catchup-white text-xl", children: i18n_default.t("you_have_set_this_activity_as_empty") }) }) });
1205
1257
  };
1206
1258
  var ActivityEmptyContent_default = ActivityEmptyContent;
1207
1259
 
1208
1260
  // src/components/activities/body-content/ShowBodyMediaByContentType.tsx
1209
- var import_react10 = require("react");
1261
+ var import_react11 = require("react");
1210
1262
  var import_react_modal2 = __toESM(require("react-modal"));
1211
1263
 
1212
1264
  // src/utilization/CatchtivityUtilization.ts
@@ -3250,15 +3302,15 @@ var retrieveDifficultyByActivityTypeFromData = (type, data) => {
3250
3302
 
3251
3303
  // src/components/activities/body-content/ShowBodyMediaByContentType.tsx
3252
3304
  var import_react_katex = require("react-katex");
3253
- var import_jsx_runtime16 = require("react/jsx-runtime");
3305
+ var import_jsx_runtime17 = require("react/jsx-runtime");
3254
3306
  var ShowBodyMediaByContentType = ({
3255
3307
  index,
3256
3308
  type,
3257
3309
  value,
3258
3310
  size
3259
3311
  }) => {
3260
- const [showFullScreen, setShowFullScreen] = (0, import_react10.useState)(false);
3261
- const [selectedFullScreenItem, setSelectedFullScreenItem] = (0, import_react10.useState)("");
3312
+ const [showFullScreen, setShowFullScreen] = (0, import_react11.useState)(false);
3313
+ const [selectedFullScreenItem, setSelectedFullScreenItem] = (0, import_react11.useState)("");
3262
3314
  const convertToPercentage = (size2) => {
3263
3315
  switch (size2) {
3264
3316
  case "1/3":
@@ -3272,11 +3324,11 @@ var ShowBodyMediaByContentType = ({
3272
3324
  }
3273
3325
  };
3274
3326
  const renderSpecialExpressions = (inputPart, inputPartIndex) => {
3275
- return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
3327
+ return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
3276
3328
  "span",
3277
3329
  {
3278
3330
  className: `${inputPart.isBold ? "font-bold" : ""} ${inputPart.isUnderline ? "underline" : ""}`,
3279
- children: inputPart.isEquation ? /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("span", { className: "text-2xl", children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_react_katex.InlineMath, { math: inputPart.value }) }) : inputPart.value
3331
+ children: inputPart.isEquation ? /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("span", { className: "text-2xl", children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_react_katex.InlineMath, { math: inputPart.value }) }) : inputPart.value
3280
3332
  },
3281
3333
  inputPartIndex
3282
3334
  );
@@ -3296,7 +3348,7 @@ var ShowBodyMediaByContentType = ({
3296
3348
  };
3297
3349
  const renderTextContent = (text, itemKey) => {
3298
3350
  const balancedText = balanceSpecialChars(text);
3299
- return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("span", { className: "text-xl", children: constructInputWithSpecialExpressionList(balancedText).map(
3351
+ return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("span", { className: "text-xl", children: constructInputWithSpecialExpressionList(balancedText).map(
3300
3352
  (inputPart, inputPartIndex) => renderSpecialExpressions(inputPart, inputPartIndex)
3301
3353
  ) }, itemKey);
3302
3354
  };
@@ -3329,7 +3381,7 @@ var ShowBodyMediaByContentType = ({
3329
3381
  currentIndex++;
3330
3382
  const itemKey = `text-inside-${index}-${currentIndex}`;
3331
3383
  valuePartList.push(
3332
- /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("span", { className: "text-xl font-bold", children: constructInputWithSpecialExpressionList(textInsideTag).map(
3384
+ /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("span", { className: "text-xl font-bold", children: constructInputWithSpecialExpressionList(textInsideTag).map(
3333
3385
  (inputPart, inputPartIndex) => renderSpecialExpressions(inputPart, inputPartIndex)
3334
3386
  ) }, itemKey)
3335
3387
  );
@@ -3349,7 +3401,7 @@ var ShowBodyMediaByContentType = ({
3349
3401
  if (textBeforeTag.trim() !== "") {
3350
3402
  currentIndex++;
3351
3403
  valuePartList.push(
3352
- /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
3404
+ /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
3353
3405
  "p",
3354
3406
  {
3355
3407
  className: "text-xl",
@@ -3368,12 +3420,12 @@ var ShowBodyMediaByContentType = ({
3368
3420
  );
3369
3421
  currentIndex++;
3370
3422
  valuePartList.push(
3371
- /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(
3423
+ /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(
3372
3424
  "div",
3373
3425
  {
3374
3426
  className: "relative w-[200px]",
3375
3427
  children: [
3376
- /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
3428
+ /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
3377
3429
  BaseImage_default,
3378
3430
  {
3379
3431
  src: imageSource,
@@ -3382,12 +3434,12 @@ var ShowBodyMediaByContentType = ({
3382
3434
  className: "rounded-catchup-xlarge"
3383
3435
  }
3384
3436
  ),
3385
- /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
3437
+ /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
3386
3438
  "div",
3387
3439
  {
3388
3440
  className: "absolute flex items-center justify-center top-2 right-2 h-6 w-6 cursor-pointer border rounded-catchup-xlarge border-catchup-blue p-1",
3389
3441
  onClick: () => handleOpenFullScreen(imageSource),
3390
- children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
3442
+ children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
3391
3443
  BaseImage_default,
3392
3444
  {
3393
3445
  src: "/icons/arrow-up.webp",
@@ -3416,7 +3468,7 @@ var ShowBodyMediaByContentType = ({
3416
3468
  if (textBeforeTag.trim() !== "") {
3417
3469
  currentIndex++;
3418
3470
  valuePartList.push(
3419
- /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
3471
+ /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
3420
3472
  "p",
3421
3473
  {
3422
3474
  className: "text-xl",
@@ -3435,7 +3487,7 @@ var ShowBodyMediaByContentType = ({
3435
3487
  );
3436
3488
  currentIndex++;
3437
3489
  valuePartList.push(
3438
- /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
3490
+ /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
3439
3491
  "video",
3440
3492
  {
3441
3493
  src: videoSource,
@@ -3458,7 +3510,7 @@ var ShowBodyMediaByContentType = ({
3458
3510
  if (textBeforeTag.trim() !== "") {
3459
3511
  currentIndex++;
3460
3512
  valuePartList.push(
3461
- /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
3513
+ /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
3462
3514
  "p",
3463
3515
  {
3464
3516
  className: "text-xl",
@@ -3477,7 +3529,7 @@ var ShowBodyMediaByContentType = ({
3477
3529
  );
3478
3530
  currentIndex++;
3479
3531
  valuePartList.push(
3480
- /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
3532
+ /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
3481
3533
  "audio",
3482
3534
  {
3483
3535
  src: audioSource,
@@ -3503,13 +3555,13 @@ var ShowBodyMediaByContentType = ({
3503
3555
  if (regexMatchImageText) {
3504
3556
  const imageText = regexMatchImageText[1];
3505
3557
  valuePartList.push(
3506
- /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(
3558
+ /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(
3507
3559
  "div",
3508
3560
  {
3509
3561
  className: "bg-catchup-gray-50 relative px-4 py-4 rounded-catchup-small mt-2",
3510
3562
  children: [
3511
- /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { className: "absolute -top-3 bg-catchup-white border rounded-catchup-small px-2 left-2", children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("p", { className: "font-bold", children: i18n_default.t("image_description") }) }),
3512
- /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("span", { className: "text-xl", children: imageText })
3563
+ /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { className: "absolute -top-3 bg-catchup-white border rounded-catchup-small px-2 left-2", children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("p", { className: "font-bold", children: i18n_default.t("image_description") }) }),
3564
+ /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("span", { className: "text-xl", children: imageText })
3513
3565
  ]
3514
3566
  },
3515
3567
  `img-desc-${index}-${currentIndex}`
@@ -3523,7 +3575,7 @@ var ShowBodyMediaByContentType = ({
3523
3575
  return valuePartList;
3524
3576
  };
3525
3577
  const RenderShowFullScreenItem = () => {
3526
- return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
3578
+ return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
3527
3579
  import_react_modal2.default,
3528
3580
  {
3529
3581
  isOpen: showFullScreen,
@@ -3552,8 +3604,8 @@ var ShowBodyMediaByContentType = ({
3552
3604
  }
3553
3605
  },
3554
3606
  contentLabel: "Image Fullscreen View",
3555
- children: /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { className: "flex-1 flex flex-col", children: [
3556
- /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { className: "ml-auto px-5 py-3", children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
3607
+ children: /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { className: "flex-1 flex flex-col", children: [
3608
+ /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { className: "ml-auto px-5 py-3", children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
3557
3609
  BaseImage_default,
3558
3610
  {
3559
3611
  src: "/icons/cross-red.webp",
@@ -3565,7 +3617,7 @@ var ShowBodyMediaByContentType = ({
3565
3617
  }
3566
3618
  }
3567
3619
  ) }),
3568
- /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { className: "flex items-center justify-center h-[500]", children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
3620
+ /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { className: "flex items-center justify-center h-[500]", children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
3569
3621
  BaseImage_default,
3570
3622
  {
3571
3623
  src: selectedFullScreenItem,
@@ -3581,16 +3633,16 @@ var ShowBodyMediaByContentType = ({
3581
3633
  const RenderMainContent = () => {
3582
3634
  switch (type) {
3583
3635
  case "TEXT":
3584
- return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { className: "mb-1 flex flex-row flex-wrap items-center mx-auto w-full", children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("p", { className: "whitespace-pre-wrap", children: retrieveValueParts(value) }) });
3636
+ return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { className: "mb-1 flex flex-row flex-wrap items-center mx-auto w-full", children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("p", { className: "whitespace-pre-wrap", children: retrieveValueParts(value) }) });
3585
3637
  case "IMAGE":
3586
- return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { className: "mb-1 flex flex-col items-center relative", children: /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(
3638
+ return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { className: "mb-1 flex flex-col items-center relative", children: /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(
3587
3639
  "div",
3588
3640
  {
3589
3641
  className: `${convertToPercentage(
3590
3642
  size || ""
3591
3643
  )} rounded-catchup-xlarge relative`,
3592
3644
  children: [
3593
- /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
3645
+ /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
3594
3646
  BaseImage_default,
3595
3647
  {
3596
3648
  src: value,
@@ -3599,12 +3651,12 @@ var ShowBodyMediaByContentType = ({
3599
3651
  className: "w-full rounded-catchup-xlarge"
3600
3652
  }
3601
3653
  ),
3602
- /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
3654
+ /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
3603
3655
  "div",
3604
3656
  {
3605
3657
  className: "absolute flex items-center justify-center top-2 right-2 h-6 w-6 cursor-pointer border rounded-catchup-xlarge border-catchup-blue p-1",
3606
3658
  onClick: () => handleOpenFullScreen(value),
3607
- children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
3659
+ children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
3608
3660
  BaseImage_default,
3609
3661
  {
3610
3662
  src: "/icons/arrow-up.webp",
@@ -3619,7 +3671,7 @@ var ShowBodyMediaByContentType = ({
3619
3671
  }
3620
3672
  ) });
3621
3673
  case "VIDEO":
3622
- return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { className: "mb-1 flex flex-col items-center", children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
3674
+ return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { className: "mb-1 flex flex-col items-center", children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
3623
3675
  "video",
3624
3676
  {
3625
3677
  src: value,
@@ -3630,12 +3682,12 @@ var ShowBodyMediaByContentType = ({
3630
3682
  }
3631
3683
  ) });
3632
3684
  case "AUDIO":
3633
- return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { className: "mb-1 flex flex-col items-center", children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("audio", { src: value, controls: true, className: "rounded-catchup-xlarge" }) });
3685
+ return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { className: "mb-1 flex flex-col items-center", children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("audio", { src: value, controls: true, className: "rounded-catchup-xlarge" }) });
3634
3686
  default:
3635
3687
  return null;
3636
3688
  }
3637
3689
  };
3638
- return /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { className: "w-full", children: [
3690
+ return /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { className: "w-full", children: [
3639
3691
  RenderShowFullScreenItem(),
3640
3692
  RenderMainContent()
3641
3693
  ] }, `body-content-${index}`);
@@ -3643,7 +3695,7 @@ var ShowBodyMediaByContentType = ({
3643
3695
  var ShowBodyMediaByContentType_default = ShowBodyMediaByContentType;
3644
3696
 
3645
3697
  // src/components/activities/body-content/ActivityBodyContent.tsx
3646
- var import_jsx_runtime17 = require("react/jsx-runtime");
3698
+ var import_jsx_runtime18 = require("react/jsx-runtime");
3647
3699
  var ActivityBodyContent = ({
3648
3700
  templateType,
3649
3701
  bodyMap,
@@ -3724,7 +3776,7 @@ var ActivityBodyContent = ({
3724
3776
  key
3725
3777
  });
3726
3778
  }).filter(Boolean);
3727
- return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { className: "flex flex-col justify-center items-center", children: processedBodies.map((body, index) => /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
3779
+ return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { className: "flex flex-col justify-center items-center", children: processedBodies.map((body, index) => /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
3728
3780
  ShowBodyMediaByContentType_default,
3729
3781
  {
3730
3782
  index,
@@ -3738,16 +3790,16 @@ var ActivityBodyContent = ({
3738
3790
  var ActivityBodyContent_default = ActivityBodyContent;
3739
3791
 
3740
3792
  // src/components/dividers/DividerLine.tsx
3741
- var import_jsx_runtime18 = require("react/jsx-runtime");
3793
+ var import_jsx_runtime19 = require("react/jsx-runtime");
3742
3794
  var DividerLine = () => {
3743
- return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { className: "bg-catchup-gray-50 h-[1px] w-full my-3" });
3795
+ return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: "bg-catchup-gray-50 h-[1px] w-full my-3" });
3744
3796
  };
3745
3797
  var DividerLine_default = DividerLine;
3746
3798
 
3747
3799
  // src/components/dividers/VerticalDividerLine.tsx
3748
- var import_jsx_runtime19 = require("react/jsx-runtime");
3800
+ var import_jsx_runtime20 = require("react/jsx-runtime");
3749
3801
  var VerticalDividerLine = () => {
3750
- return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: "bg-catchup-gray-50 h-full w-[1px] mx-3" });
3802
+ return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "bg-catchup-gray-50 h-full w-[1px] mx-3" });
3751
3803
  };
3752
3804
  var VerticalDividerLine_default = VerticalDividerLine;
3753
3805
 
@@ -3756,8 +3808,8 @@ var import_react_katex2 = require("react-katex");
3756
3808
 
3757
3809
  // src/components/groups/InputGroup.tsx
3758
3810
  var import_react_select = __toESM(require("react-select"));
3759
- var import_react11 = require("react");
3760
- var import_jsx_runtime20 = require("react/jsx-runtime");
3811
+ var import_react12 = require("react");
3812
+ var import_jsx_runtime21 = require("react/jsx-runtime");
3761
3813
  var InputGroup = ({
3762
3814
  type,
3763
3815
  title,
@@ -3778,12 +3830,12 @@ var InputGroup = ({
3778
3830
  limit,
3779
3831
  useMath
3780
3832
  }) => {
3781
- const textAreaRef = (0, import_react11.useRef)(null);
3782
- const latexTextAreaRef = (0, import_react11.useRef)(null);
3783
- const [showMathConstructor, setShowMathConstructor] = (0, import_react11.useState)(false);
3784
- const [mathValue, setMathValue] = (0, import_react11.useState)("");
3785
- const mathFieldRef = (0, import_react11.useRef)(null);
3786
- (0, import_react11.useEffect)(() => {
3833
+ const textAreaRef = (0, import_react12.useRef)(null);
3834
+ const latexTextAreaRef = (0, import_react12.useRef)(null);
3835
+ const [showMathConstructor, setShowMathConstructor] = (0, import_react12.useState)(false);
3836
+ const [mathValue, setMathValue] = (0, import_react12.useState)("");
3837
+ const mathFieldRef = (0, import_react12.useRef)(null);
3838
+ (0, import_react12.useEffect)(() => {
3787
3839
  if (!textAreaRef) return;
3788
3840
  if (!textAreaRef.current) return;
3789
3841
  if (value) {
@@ -3792,7 +3844,7 @@ var InputGroup = ({
3792
3844
  textAreaRef.current.style.height = `44px`;
3793
3845
  }
3794
3846
  }, [textAreaRef, value]);
3795
- (0, import_react11.useEffect)(() => {
3847
+ (0, import_react12.useEffect)(() => {
3796
3848
  if (!latexTextAreaRef) return;
3797
3849
  if (!latexTextAreaRef.current) return;
3798
3850
  if (value) {
@@ -3801,7 +3853,7 @@ var InputGroup = ({
3801
3853
  latexTextAreaRef.current.style.height = `44px`;
3802
3854
  }
3803
3855
  }, [latexTextAreaRef, value]);
3804
- (0, import_react11.useEffect)(() => {
3856
+ (0, import_react12.useEffect)(() => {
3805
3857
  if (!useMath) return;
3806
3858
  import("mathlive").then(({ MathfieldElement }) => {
3807
3859
  if (!customElements.get("math-field")) {
@@ -3836,7 +3888,7 @@ var InputGroup = ({
3836
3888
  onChange && onChange(e);
3837
3889
  }
3838
3890
  };
3839
- const handleMathFieldChange = (0, import_react11.useCallback)(() => {
3891
+ const handleMathFieldChange = (0, import_react12.useCallback)(() => {
3840
3892
  if (!mathFieldRef.current) return;
3841
3893
  const latexValue = mathFieldRef.current.value;
3842
3894
  const wasFocused = mathFieldRef.current === document.activeElement;
@@ -3859,7 +3911,7 @@ var InputGroup = ({
3859
3911
  setShowMathConstructor(true);
3860
3912
  };
3861
3913
  const MathConstructorModal = () => {
3862
- return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
3914
+ return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
3863
3915
  BaseModal_default,
3864
3916
  {
3865
3917
  isOpen: showMathConstructor,
@@ -3870,10 +3922,10 @@ var InputGroup = ({
3870
3922
  setShowMathConstructor(false);
3871
3923
  },
3872
3924
  size: "large",
3873
- children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(FullCard_default, { children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "bg-white rounded-lg overflow-hidden", children: /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "p-6 space-y-6", children: [
3874
- /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { children: [
3875
- /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("p", { className: "text-md font-semibold pl-2 py-1 text-catchup-gray-400", children: i18n_default.t("math_editor") }),
3876
- /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "border border-catchup-gray-100 rounded-catchup-large focus-within:border-catchup-blue-400 focus-within:shadow-input", children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
3925
+ children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(FullCard_default, { children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "bg-white rounded-lg overflow-hidden", children: /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "p-6 space-y-6", children: [
3926
+ /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { children: [
3927
+ /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("p", { className: "text-md font-semibold pl-2 py-1 text-catchup-gray-400", children: i18n_default.t("math_editor") }),
3928
+ /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "border border-catchup-gray-100 rounded-catchup-large focus-within:border-catchup-blue-400 focus-within:shadow-input", children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
3877
3929
  "math-field",
3878
3930
  {
3879
3931
  ref: mathFieldRef,
@@ -3900,10 +3952,10 @@ var InputGroup = ({
3900
3952
  }
3901
3953
  ) })
3902
3954
  ] }),
3903
- /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { children: [
3904
- /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("p", { className: "text-md font-semibold pl-2 py-1 text-catchup-gray-400", children: i18n_default.t("latex_output") }),
3905
- /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "relative", children: [
3906
- /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
3955
+ /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { children: [
3956
+ /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("p", { className: "text-md font-semibold pl-2 py-1 text-catchup-gray-400", children: i18n_default.t("latex_output") }),
3957
+ /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "relative", children: [
3958
+ /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
3907
3959
  "textarea",
3908
3960
  {
3909
3961
  ref: latexTextAreaRef,
@@ -3913,7 +3965,7 @@ var InputGroup = ({
3913
3965
  placeholder: i18n_default.t("latex_will_appear_here")
3914
3966
  }
3915
3967
  ),
3916
- /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
3968
+ /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
3917
3969
  "button",
3918
3970
  {
3919
3971
  onClick: handleCopyLatex,
@@ -3929,13 +3981,13 @@ var InputGroup = ({
3929
3981
  );
3930
3982
  };
3931
3983
  const CheckboxInputGroup = () => {
3932
- return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
3984
+ return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
3933
3985
  "div",
3934
3986
  {
3935
3987
  className: "flex flex-row items-center gap-x-1 cursor-pointer",
3936
3988
  onClick,
3937
3989
  children: [
3938
- /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
3990
+ /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
3939
3991
  BaseImage_default,
3940
3992
  {
3941
3993
  src: value ? "/icons/checkbox.webp" : "/icons/checkbox-empty.webp",
@@ -3945,15 +3997,15 @@ var InputGroup = ({
3945
3997
  }
3946
3998
  }
3947
3999
  ),
3948
- /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("p", { className: "", children: title })
4000
+ /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("p", { className: "", children: title })
3949
4001
  ]
3950
4002
  }
3951
4003
  );
3952
4004
  };
3953
4005
  const FileInputGroup = () => {
3954
- return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "my-1", children: [
3955
- title ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("p", { className: "text-md font-semibold pl-2 py-1 text-catchup-gray-400", children: title }) : null,
3956
- /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
4006
+ return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "my-1", children: [
4007
+ title ? /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("p", { className: "text-md font-semibold pl-2 py-1 text-catchup-gray-400", children: title }) : null,
4008
+ /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
3957
4009
  "input",
3958
4010
  {
3959
4011
  className: "w-full py-2 px-4 border border-catchup-gray-100 placeholder-catchup-gray-200 rounded-catchup-large text-black focus:outline-none focus:border-catchup-blue-400 focus:shadow-input",
@@ -3970,9 +4022,9 @@ var InputGroup = ({
3970
4022
  ] });
3971
4023
  };
3972
4024
  const DateInputGroup = () => {
3973
- return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "my-1", children: [
3974
- title ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("p", { className: "text-md font-semibold pl-2 py-1 text-catchup-gray-400", children: title }) : null,
3975
- /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
4025
+ return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "my-1", children: [
4026
+ title ? /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("p", { className: "text-md font-semibold pl-2 py-1 text-catchup-gray-400", children: title }) : null,
4027
+ /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
3976
4028
  "input",
3977
4029
  {
3978
4030
  className: `w-full py-2 px-4 border ${errorText ? "border-catchup-red shadow-error" : theme === "red" ? "border-catchup-red bg-catchup-red text-catchup-white focus:border-catchup-red" : "border-catchup-gray-100 placeholder-catchup-gray-200 focus:border-catchup-blue-400"} rounded-catchup-large text-black focus:outline-none focus:shadow-input`,
@@ -3987,9 +4039,9 @@ var InputGroup = ({
3987
4039
  ] });
3988
4040
  };
3989
4041
  const SearchableSelectInputGroup = () => {
3990
- return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "my-1", children: [
3991
- title ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("p", { className: "text-md font-semibold pl-2 py-1 text-catchup-gray-400 ", children: title }) : null,
3992
- /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
4042
+ return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "my-1", children: [
4043
+ title ? /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("p", { className: "text-md font-semibold pl-2 py-1 text-catchup-gray-400 ", children: title }) : null,
4044
+ /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
3993
4045
  import_react_select.default,
3994
4046
  {
3995
4047
  options: convertOptionListToSelectComponent(
@@ -4052,16 +4104,16 @@ var InputGroup = ({
4052
4104
  ] });
4053
4105
  };
4054
4106
  const TextAreaInputGroup = () => {
4055
- return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "my-1 flex-1 flex flex-col relative", children: [
4056
- /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "flex flex-row justify-between items-center", children: [
4057
- /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { children: title ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("p", { className: "text-md font-semibold pl-2 py-1 text-catchup-gray-400", children: title }) : null }),
4058
- /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { children: value && limit ? /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("p", { className: "text-md font-semibold pr-2 py-1 text-catchup-gray-400", children: [
4107
+ return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "my-1 flex-1 flex flex-col relative", children: [
4108
+ /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "flex flex-row justify-between items-center", children: [
4109
+ /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { children: title ? /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("p", { className: "text-md font-semibold pl-2 py-1 text-catchup-gray-400", children: title }) : null }),
4110
+ /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { children: value && limit ? /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("p", { className: "text-md font-semibold pr-2 py-1 text-catchup-gray-400", children: [
4059
4111
  value.length,
4060
4112
  " / ",
4061
4113
  limit
4062
4114
  ] }) : null })
4063
4115
  ] }),
4064
- /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
4116
+ /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
4065
4117
  "textarea",
4066
4118
  {
4067
4119
  ref: textAreaRef,
@@ -4074,22 +4126,22 @@ var InputGroup = ({
4074
4126
  onKeyDown
4075
4127
  }
4076
4128
  ),
4077
- useMath && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
4129
+ useMath && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
4078
4130
  "button",
4079
4131
  {
4080
4132
  className: "absolute right-2 top-1/2 transform -translate-y-1/2 bg-catchup-blue-400 text-white rounded-md px-3 py-1 shadow-sm hover:bg-catchup-blue-500 transition-colors duration-200 z-10",
4081
4133
  onClick: handleOpenMathConstructor,
4082
4134
  type: "button",
4083
- children: /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "flex items-center gap-x-1", children: [
4084
- /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { className: "text-sm font-medium", children: "\u{1D453}(x)" }),
4085
- /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
4135
+ children: /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "flex items-center gap-x-1", children: [
4136
+ /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "text-sm font-medium", children: "\u{1D453}(x)" }),
4137
+ /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
4086
4138
  "svg",
4087
4139
  {
4088
4140
  className: "w-3 h-3",
4089
4141
  fill: "none",
4090
4142
  stroke: "currentColor",
4091
4143
  viewBox: "0 0 24 24",
4092
- children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
4144
+ children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
4093
4145
  "path",
4094
4146
  {
4095
4147
  strokeLinecap: "round",
@@ -4106,13 +4158,13 @@ var InputGroup = ({
4106
4158
  ] });
4107
4159
  };
4108
4160
  const TextInputGroup = () => {
4109
- return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "my-1 relative", children: [
4110
- title ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("p", { className: "text-md font-semibold pl-2 py-1 text-catchup-gray-400", children: title }) : null,
4111
- /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
4161
+ return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "my-1 relative", children: [
4162
+ title ? /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("p", { className: "text-md font-semibold pl-2 py-1 text-catchup-gray-400", children: title }) : null,
4163
+ /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
4112
4164
  "div",
4113
4165
  {
4114
4166
  className: `w-full border ${errorText ? "border-catchup-red shadow-error" : "border-catchup-gray-100"} rounded-catchup-large focus-within:border-catchup-blue-400 focus-within:shadow-input ${disabled ? "bg-catchup-lighter-gray" : "bg-white"}`,
4115
- children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
4167
+ children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
4116
4168
  "input",
4117
4169
  {
4118
4170
  disabled,
@@ -4128,22 +4180,22 @@ var InputGroup = ({
4128
4180
  )
4129
4181
  }
4130
4182
  ),
4131
- useMath && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
4183
+ useMath && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
4132
4184
  "button",
4133
4185
  {
4134
4186
  className: "absolute right-2 top-1/2 transform -translate-y-1/2 bg-catchup-blue-400 text-white rounded-md px-3 py-1 shadow-sm hover:bg-catchup-blue-500 transition-colors duration-200",
4135
4187
  onClick: handleOpenMathConstructor,
4136
4188
  type: "button",
4137
- children: /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "flex items-center gap-x-1", children: [
4138
- /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { className: "text-sm font-medium", children: "\u{1D453}(x)" }),
4139
- /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
4189
+ children: /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "flex items-center gap-x-1", children: [
4190
+ /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "text-sm font-medium", children: "\u{1D453}(x)" }),
4191
+ /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
4140
4192
  "svg",
4141
4193
  {
4142
4194
  className: "w-3 h-3",
4143
4195
  fill: "none",
4144
4196
  stroke: "currentColor",
4145
4197
  viewBox: "0 0 24 24",
4146
- children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
4198
+ children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
4147
4199
  "path",
4148
4200
  {
4149
4201
  strokeLinecap: "round",
@@ -4176,16 +4228,16 @@ var InputGroup = ({
4176
4228
  return CheckboxInputGroup();
4177
4229
  }
4178
4230
  };
4179
- return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_jsx_runtime20.Fragment, { children: [
4231
+ return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(import_jsx_runtime21.Fragment, { children: [
4180
4232
  RenderMainContent(),
4181
- /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(MathConstructorModal, {})
4233
+ /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(MathConstructorModal, {})
4182
4234
  ] });
4183
4235
  };
4184
4236
  var InputGroup_default = InputGroup;
4185
4237
 
4186
4238
  // src/components/activities/material-content/DropdownActivityMaterialContent.tsx
4187
- var import_react14 = require("react");
4188
4239
  var import_react15 = require("react");
4240
+ var import_react16 = require("react");
4189
4241
 
4190
4242
  // src/utilization/AppUtilization.ts
4191
4243
  var colors = [
@@ -4285,11 +4337,11 @@ var getColorByIndex = (index) => {
4285
4337
  };
4286
4338
 
4287
4339
  // src/components/dropdowns/MediaDropdown.tsx
4288
- var import_react12 = require("react");
4289
- var import_jsx_runtime21 = require("react/jsx-runtime");
4340
+ var import_react13 = require("react");
4341
+ var import_jsx_runtime22 = require("react/jsx-runtime");
4290
4342
  var MediaDropdown = ({ id, answer, optionList }) => {
4291
- const [showDropdown, setShowDropdown] = (0, import_react12.useState)(false);
4292
- return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
4343
+ const [showDropdown, setShowDropdown] = (0, import_react13.useState)(false);
4344
+ return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
4293
4345
  "div",
4294
4346
  {
4295
4347
  className: "w-full relative",
@@ -4300,17 +4352,17 @@ var MediaDropdown = ({ id, answer, optionList }) => {
4300
4352
  setShowDropdown(false);
4301
4353
  },
4302
4354
  children: [
4303
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "w-full flex flex-col items-center justify-center", children: answer }),
4304
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
4355
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "w-full flex flex-col items-center justify-center", children: answer }),
4356
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
4305
4357
  "ul",
4306
4358
  {
4307
4359
  className: `absolute ${showDropdown ? "opacity-100 visible" : "opacity-0 invisible"} flex flex-col items-center w-[300px] rounded-catchup-xlarge border-3 transition-all duration-300 border-catchup-blue bg-catchup-white px-4 py-4 translate-x-1/2 right-1/2 mt-2 z-10`,
4308
- children: optionList.map((option, index) => /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
4360
+ children: optionList.map((option, index) => /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
4309
4361
  "li",
4310
4362
  {
4311
4363
  className: `${option.listItemClassNames ? option.listItemClassNames : ""}`,
4312
4364
  children: [
4313
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
4365
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
4314
4366
  "div",
4315
4367
  {
4316
4368
  className: `w-full flex flex-col my-2 ${option.divClassNames ? option.divClassNames : ""}`,
@@ -4318,7 +4370,7 @@ var MediaDropdown = ({ id, answer, optionList }) => {
4318
4370
  children: option.media
4319
4371
  }
4320
4372
  ),
4321
- index !== optionList.length - 1 ? /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "w-full border my-1 border-catchup-light-blue rounded-catchup-full" }) : null
4373
+ index !== optionList.length - 1 ? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "w-full border my-1 border-catchup-light-blue rounded-catchup-full" }) : null
4322
4374
  ]
4323
4375
  },
4324
4376
  option.id
@@ -4333,24 +4385,24 @@ var MediaDropdown = ({ id, answer, optionList }) => {
4333
4385
  var MediaDropdown_default = MediaDropdown;
4334
4386
 
4335
4387
  // src/components/activities/material-content/ShowMaterialMediaByContentType.tsx
4336
- var import_react13 = require("react");
4388
+ var import_react14 = require("react");
4337
4389
  var import_react_modal3 = __toESM(require("react-modal"));
4338
- var import_jsx_runtime22 = require("react/jsx-runtime");
4390
+ var import_jsx_runtime23 = require("react/jsx-runtime");
4339
4391
  var ShowMaterialMediaByContentType = ({
4340
4392
  key,
4341
4393
  contentType,
4342
4394
  src,
4343
4395
  canFullScreen
4344
4396
  }) => {
4345
- const [showFullScreen, setShowFullScreen] = (0, import_react13.useState)(false);
4346
- const [selectedFullScreenItem, setSelectedFullScreenItem] = (0, import_react13.useState)(null);
4347
- const [isLoaded, setIsLoaded] = (0, import_react13.useState)(false);
4348
- const [isFullHeight, setIsFullHeight] = (0, import_react13.useState)(false);
4349
- const imageRef = (0, import_react13.useRef)(null);
4350
- (0, import_react13.useEffect)(() => {
4397
+ const [showFullScreen, setShowFullScreen] = (0, import_react14.useState)(false);
4398
+ const [selectedFullScreenItem, setSelectedFullScreenItem] = (0, import_react14.useState)(null);
4399
+ const [isLoaded, setIsLoaded] = (0, import_react14.useState)(false);
4400
+ const [isFullHeight, setIsFullHeight] = (0, import_react14.useState)(false);
4401
+ const imageRef = (0, import_react14.useRef)(null);
4402
+ (0, import_react14.useEffect)(() => {
4351
4403
  setIsLoaded(false);
4352
4404
  }, []);
4353
- (0, import_react13.useEffect)(() => {
4405
+ (0, import_react14.useEffect)(() => {
4354
4406
  if (!isLoaded) return;
4355
4407
  if (!imageRef) return;
4356
4408
  if (!imageRef.current) return;
@@ -4363,7 +4415,7 @@ var ShowMaterialMediaByContentType = ({
4363
4415
  }
4364
4416
  }, [isLoaded, key]);
4365
4417
  const RenderShowFullScreenItem = () => {
4366
- return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
4418
+ return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
4367
4419
  import_react_modal3.default,
4368
4420
  {
4369
4421
  isOpen: showFullScreen,
@@ -4394,8 +4446,8 @@ var ShowMaterialMediaByContentType = ({
4394
4446
  }
4395
4447
  },
4396
4448
  contentLabel: "",
4397
- children: /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "flex-1 flex flex-col", children: [
4398
- /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "ml-auto px-5 py-3", children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
4449
+ children: /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "flex-1 flex flex-col", children: [
4450
+ /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "ml-auto px-5 py-3", children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
4399
4451
  BaseImage_default,
4400
4452
  {
4401
4453
  src: "/icons/cross-red.webp",
@@ -4407,7 +4459,7 @@ var ShowMaterialMediaByContentType = ({
4407
4459
  }
4408
4460
  }
4409
4461
  ) }),
4410
- /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "flex items-center justify-center h-[500px]", children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
4462
+ /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "flex items-center justify-center h-[500px]", children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
4411
4463
  BaseImage_default,
4412
4464
  {
4413
4465
  src: selectedFullScreenItem,
@@ -4420,14 +4472,14 @@ var ShowMaterialMediaByContentType = ({
4420
4472
  }
4421
4473
  );
4422
4474
  };
4423
- return contentType === "IMAGE" ? /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { children: [
4475
+ return contentType === "IMAGE" ? /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { children: [
4424
4476
  RenderShowFullScreenItem(),
4425
- /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "my-2", children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "h-full flex flex-row flex-wrap items-center", children: /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
4477
+ /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "my-2", children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "h-full flex flex-row flex-wrap items-center", children: /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
4426
4478
  "div",
4427
4479
  {
4428
4480
  className: `${isFullHeight ? "h-catchup-activity-box-item" : "max-w-catchup-activity-box-item"} flex flex-col justify-center items-center relative`,
4429
4481
  children: [
4430
- /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
4482
+ /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
4431
4483
  BaseImage_default,
4432
4484
  {
4433
4485
  src,
@@ -4440,7 +4492,7 @@ var ShowMaterialMediaByContentType = ({
4440
4492
  }
4441
4493
  }
4442
4494
  ),
4443
- src !== null && src !== "" && src !== "DEFAULT_OPTION" && canFullScreen ? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
4495
+ src !== null && src !== "" && src !== "DEFAULT_OPTION" && canFullScreen ? /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
4444
4496
  "div",
4445
4497
  {
4446
4498
  className: "absolute flex items-center justify-center top-2 right-2 h-6 w-6 cursor-pointer border rounded-catchup-xlarge border-catchup-blue p-1",
@@ -4452,7 +4504,7 @@ var ShowMaterialMediaByContentType = ({
4452
4504
  setShowFullScreen(true);
4453
4505
  setSelectedFullScreenItem(src);
4454
4506
  },
4455
- children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
4507
+ children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
4456
4508
  BaseImage_default,
4457
4509
  {
4458
4510
  src: "/icons/arrow-up.webp",
@@ -4466,7 +4518,7 @@ var ShowMaterialMediaByContentType = ({
4466
4518
  ]
4467
4519
  }
4468
4520
  ) }) })
4469
- ] }, key) : contentType === "VIDEO" ? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "my-2", children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "h-full flex flex-row flex-wrap items-center", children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "h-full flex flex-col justify-center items-center", children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
4521
+ ] }, key) : contentType === "VIDEO" ? /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "my-2", children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "h-full flex flex-row flex-wrap items-center", children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "h-full flex flex-col justify-center items-center", children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
4470
4522
  "video",
4471
4523
  {
4472
4524
  className: "h-catchup-activity-box-item rounded-catchup-xlarge",
@@ -4475,7 +4527,7 @@ var ShowMaterialMediaByContentType = ({
4475
4527
  onClick: () => {
4476
4528
  }
4477
4529
  }
4478
- ) }) }) }) : contentType === "AUDIO" ? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "my-2", children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "h-full flex flex-row flex-wrap items-center", children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "h-full flex flex-col justify-center items-center", children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
4530
+ ) }) }) }) : contentType === "AUDIO" ? /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "my-2", children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "h-full flex flex-row flex-wrap items-center", children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "h-full flex flex-col justify-center items-center", children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
4479
4531
  "audio",
4480
4532
  {
4481
4533
  className: "h-catchup-activity-box-item rounded-catchup-xlarge",
@@ -4489,7 +4541,7 @@ var ShowMaterialMediaByContentType = ({
4489
4541
  var ShowMaterialMediaByContentType_default = ShowMaterialMediaByContentType;
4490
4542
 
4491
4543
  // src/components/activities/material-content/DropdownActivityMaterialContent.tsx
4492
- var import_jsx_runtime23 = require("react/jsx-runtime");
4544
+ var import_jsx_runtime24 = require("react/jsx-runtime");
4493
4545
  var DropdownActivityMaterialContent = ({
4494
4546
  uniqueValue,
4495
4547
  answer,
@@ -4500,8 +4552,8 @@ var DropdownActivityMaterialContent = ({
4500
4552
  isPreview,
4501
4553
  showCorrectAnswer
4502
4554
  }) => {
4503
- const [updated, setUpdated] = (0, import_react15.useState)(false);
4504
- (0, import_react14.useEffect)(() => {
4555
+ const [updated, setUpdated] = (0, import_react16.useState)(false);
4556
+ (0, import_react15.useEffect)(() => {
4505
4557
  if (!showCorrectAnswer) return;
4506
4558
  const foundAnswer = answer.data.find(
4507
4559
  (answerData) => answerData.type === "DROPDOWN"
@@ -4514,7 +4566,7 @@ var DropdownActivityMaterialContent = ({
4514
4566
  onChange(answer, 0, Object.keys(materialMap[0])[0]);
4515
4567
  setUpdated(true);
4516
4568
  }, [showCorrectAnswer]);
4517
- (0, import_react14.useEffect)(() => {
4569
+ (0, import_react15.useEffect)(() => {
4518
4570
  if (!updated) return;
4519
4571
  setUpdated(false);
4520
4572
  }, [updated]);
@@ -4532,22 +4584,22 @@ var DropdownActivityMaterialContent = ({
4532
4584
  return "INCORRECT";
4533
4585
  };
4534
4586
  const answerMap = retrieveAnswerMap();
4535
- return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "flex flex-row flex-wrap items-center", children: [
4536
- /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "hidden md:block", children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("span", { className: "font-semibold text-xl opacity-60", children: i18n_default.t("please_select_dropdown_text") }) }),
4537
- /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "hidden md:contents", children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(DividerLine_default, {}) }),
4538
- /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "w-full flex flex-row flex-wrap", children: Object.keys(answerMap).map((materialKey, index) => {
4587
+ return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: "flex flex-row flex-wrap items-center", children: [
4588
+ /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: "hidden md:block", children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("span", { className: "font-semibold text-xl opacity-60", children: i18n_default.t("please_select_dropdown_text") }) }),
4589
+ /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: "hidden md:contents", children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(DividerLine_default, {}) }),
4590
+ /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: "w-full flex flex-row flex-wrap", children: Object.keys(answerMap).map((materialKey, index) => {
4539
4591
  const answerKey = Object.keys(materialMap[materialKey])[0];
4540
4592
  const learnerAnswerState = checkAnswerState(
4541
4593
  answerKey,
4542
4594
  answerMap[materialKey]
4543
4595
  );
4544
- return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "w-full md:w-1/2", children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "mx-2", children: /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "w-full flex flex-row my-2 gap-x-2", children: [
4545
- /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "my-auto", children: /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("p", { className: "text-xl", children: [
4596
+ return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: "w-full md:w-1/2", children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: "mx-2", children: /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: "w-full flex flex-row my-2 gap-x-2", children: [
4597
+ /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: "my-auto", children: /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("p", { className: "text-xl", children: [
4546
4598
  parseFloat(materialKey) + 1,
4547
4599
  "."
4548
4600
  ] }) }),
4549
- /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "w-full relative", children: [
4550
- /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "flex-1", children: checkCanAnswerQuestion() ? contentMap.type === "TEXT" ? /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "flex-1", children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
4601
+ /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: "w-full relative", children: [
4602
+ /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: "flex-1", children: checkCanAnswerQuestion() ? contentMap.type === "TEXT" ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: "flex-1", children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
4551
4603
  InputGroup_default,
4552
4604
  {
4553
4605
  type: "select",
@@ -4555,13 +4607,13 @@ var DropdownActivityMaterialContent = ({
4555
4607
  optionList: shuffleArray(
4556
4608
  materialMap[materialKey][answerKey]
4557
4609
  ).map((materialOption) => ({
4558
- text: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("span", { className: "text-xl whitespace-pre-wrap", children: constructInputWithSpecialExpressionList(
4610
+ text: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("span", { className: "text-xl whitespace-pre-wrap", children: constructInputWithSpecialExpressionList(
4559
4611
  materialOption
4560
- ).map((inputPart, index2) => /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
4612
+ ).map((inputPart, index2) => /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
4561
4613
  "span",
4562
4614
  {
4563
4615
  className: `${inputPart.isBold ? "font-bold" : ""} ${inputPart.isUnderline ? "underline" : ""}`,
4564
- children: inputPart.isEquation ? /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("span", { className: "text-2xl", children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
4616
+ children: inputPart.isEquation ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("span", { className: "text-2xl", children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
4565
4617
  import_react_katex2.InlineMath,
4566
4618
  {
4567
4619
  math: inputPart.value
@@ -4576,11 +4628,11 @@ var DropdownActivityMaterialContent = ({
4576
4628
  onChange(answer, materialKey, e.target.value);
4577
4629
  }
4578
4630
  }
4579
- ) }) : /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
4631
+ ) }) : /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
4580
4632
  MediaDropdown_default,
4581
4633
  {
4582
4634
  id: materialKey,
4583
- answer: answerMap[materialKey] === "DEFAULT_OPTION" ? /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "w-catchup-activity-box-item border h-catchup-activity-box-item rounded-catchup-xlarge border-dashed border-catchup-blue", children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "h-full flex flex-col items-center justify-center px-4 py-2", children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("span", { className: "italic", children: i18n_default.t("please_select") }) }) }) : /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
4635
+ answer: answerMap[materialKey] === "DEFAULT_OPTION" ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: "w-catchup-activity-box-item border h-catchup-activity-box-item rounded-catchup-xlarge border-dashed border-catchup-blue", children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: "h-full flex flex-col items-center justify-center px-4 py-2", children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("span", { className: "italic", children: i18n_default.t("please_select") }) }) }) : /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
4584
4636
  ShowMaterialMediaByContentType_default,
4585
4637
  {
4586
4638
  contentType: contentMap.type,
@@ -4592,7 +4644,7 @@ var DropdownActivityMaterialContent = ({
4592
4644
  optionList: materialMap[materialKey][answerKey].map(
4593
4645
  (materialOption, index2) => ({
4594
4646
  id: index2,
4595
- media: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
4647
+ media: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
4596
4648
  ShowMaterialMediaByContentType_default,
4597
4649
  {
4598
4650
  contentType: contentMap.type,
@@ -4611,24 +4663,24 @@ var DropdownActivityMaterialContent = ({
4611
4663
  })
4612
4664
  )
4613
4665
  }
4614
- ) : /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("p", { className: "text-xl whitespace-pre-wrap", children: constructInputWithSpecialExpressionList(
4666
+ ) : /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("p", { className: "text-xl whitespace-pre-wrap", children: constructInputWithSpecialExpressionList(
4615
4667
  answerMap[materialKey]
4616
- ).map((inputPart, index2) => /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
4668
+ ).map((inputPart, index2) => /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
4617
4669
  "span",
4618
4670
  {
4619
4671
  className: `${inputPart.isBold ? "font-bold" : ""} ${inputPart.isUnderline ? "underline" : ""}`,
4620
- children: inputPart.isEquation ? /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("span", { className: "text-2xl", children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_react_katex2.InlineMath, { math: inputPart.value }) }) : inputPart.value
4672
+ children: inputPart.isEquation ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("span", { className: "text-2xl", children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_react_katex2.InlineMath, { math: inputPart.value }) }) : inputPart.value
4621
4673
  },
4622
4674
  index2
4623
4675
  )) }) }),
4624
- learnerAnswerState === "CORRECT" ? /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "absolute -top-2 right-3 bg-catchup-white", children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
4676
+ learnerAnswerState === "CORRECT" ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: "absolute -top-2 right-3 bg-catchup-white", children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
4625
4677
  BaseImage_default,
4626
4678
  {
4627
4679
  src: "/icons/checkbox.webp",
4628
4680
  alt: "chekbbox",
4629
4681
  size: "small"
4630
4682
  }
4631
- ) }) : learnerAnswerState === "INCORRECT" ? /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "absolute -top-2 right-3 bg-catchup-white", children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
4683
+ ) }) : learnerAnswerState === "INCORRECT" ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: "absolute -top-2 right-3 bg-catchup-white", children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
4632
4684
  BaseImage_default,
4633
4685
  {
4634
4686
  src: "/icons/cross-red.webp",
@@ -4644,8 +4696,8 @@ var DropdownActivityMaterialContent = ({
4644
4696
  var DropdownActivityMaterialContent_default = DropdownActivityMaterialContent;
4645
4697
 
4646
4698
  // src/components/activities/DropdownActivityContent.tsx
4647
- var import_react16 = require("react");
4648
- var import_jsx_runtime24 = require("react/jsx-runtime");
4699
+ var import_react17 = require("react");
4700
+ var import_jsx_runtime25 = require("react/jsx-runtime");
4649
4701
  var DropdownActivityContent = ({
4650
4702
  answer,
4651
4703
  data,
@@ -4658,7 +4710,7 @@ var DropdownActivityContent = ({
4658
4710
  const contentMap = parseContentMapFromData(data);
4659
4711
  const dropdownBodyMap = parseBodyMapFromData(data, "DROPDOWN");
4660
4712
  const dropdownMaterialMap = parseMaterialMapFromData(data, "DROPDOWN");
4661
- const [currentAnswerMap, setCurrentAnswerMap] = (0, import_react16.useState)(() => {
4713
+ const [currentAnswerMap, setCurrentAnswerMap] = (0, import_react17.useState)(() => {
4662
4714
  return retrieveCurrentAnswerMap();
4663
4715
  });
4664
4716
  function retrieveCurrentAnswerMap() {
@@ -4667,7 +4719,7 @@ var DropdownActivityContent = ({
4667
4719
  );
4668
4720
  return answer.data[foundIndex].answerMap;
4669
4721
  }
4670
- (0, import_react16.useEffect)(() => {
4722
+ (0, import_react17.useEffect)(() => {
4671
4723
  setCurrentAnswerMap(retrieveCurrentAnswerMap());
4672
4724
  }, [answer]);
4673
4725
  const handleDropdownAnswerOnChange = (answerObj, key, value) => {
@@ -4687,8 +4739,8 @@ var DropdownActivityContent = ({
4687
4739
  setCurrentAnswerMap(newAnswerMap);
4688
4740
  changeAnswer(newAnswer);
4689
4741
  };
4690
- return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: "flex flex-row flex-wrap", children: [
4691
- /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: `${isFullScreen ? "w-full" : "w-full md:w-[60%]"}`, children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
4742
+ return /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { className: "flex flex-row flex-wrap", children: [
4743
+ /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("div", { className: `${isFullScreen ? "w-full" : "w-full md:w-[60%]"}`, children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
4692
4744
  ActivityBodyContent_default,
4693
4745
  {
4694
4746
  bodyMap: dropdownBodyMap,
@@ -4697,9 +4749,9 @@ var DropdownActivityContent = ({
4697
4749
  templateType: "DROPDOWN"
4698
4750
  }
4699
4751
  ) }),
4700
- /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: `${isFullScreen ? "contents" : "contents md:hidden"}`, children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(DividerLine_default, {}) }),
4701
- /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: `${isFullScreen ? "hidden" : "hidden md:block"}`, children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(VerticalDividerLine_default, {}) }),
4702
- /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: `${isFullScreen ? "w-full" : "w-full md:flex-1"}`, children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
4752
+ /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("div", { className: `${isFullScreen ? "contents" : "contents md:hidden"}`, children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(DividerLine_default, {}) }),
4753
+ /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("div", { className: `${isFullScreen ? "hidden" : "hidden md:block"}`, children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(VerticalDividerLine_default, {}) }),
4754
+ /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("div", { className: `${isFullScreen ? "w-full" : "w-full md:flex-1"}`, children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
4703
4755
  DropdownActivityMaterialContent_default,
4704
4756
  {
4705
4757
  uniqueValue: JSON.stringify(data.contentMap),
@@ -4718,13 +4770,13 @@ var DropdownActivityContent_default = DropdownActivityContent;
4718
4770
 
4719
4771
  // src/components/activities/material-content/FillInTheBlanksActivityMaterialContent.tsx
4720
4772
  var import_react_katex3 = require("react-katex");
4721
- var import_react18 = require("react");
4722
4773
  var import_react19 = require("react");
4774
+ var import_react20 = require("react");
4723
4775
  var import_react_dnd3 = require("react-dnd");
4724
4776
 
4725
4777
  // src/components/dnds/DraggableItem.tsx
4726
4778
  var import_react_dnd = require("react-dnd");
4727
- var import_jsx_runtime25 = require("react/jsx-runtime");
4779
+ var import_jsx_runtime26 = require("react/jsx-runtime");
4728
4780
  var DraggableItem = ({
4729
4781
  item,
4730
4782
  type,
@@ -4745,20 +4797,20 @@ var DraggableItem = ({
4745
4797
  })
4746
4798
  });
4747
4799
  const opacity = isDragging ? 0.4 : 1;
4748
- return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
4800
+ return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
4749
4801
  "div",
4750
4802
  {
4751
4803
  className: `${isDragging ? "w-[0px] opacity-0" : "opacity-100"} transition-all duration-500`,
4752
- children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("div", { ref: drag, className: "", style: { opacity }, children: component })
4804
+ children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("div", { ref: drag, className: "", style: { opacity }, children: component })
4753
4805
  }
4754
4806
  );
4755
4807
  };
4756
4808
  var DraggableItem_default = DraggableItem;
4757
4809
 
4758
4810
  // src/components/dnds/DroppableItem.tsx
4759
- var import_react17 = require("react");
4811
+ var import_react18 = require("react");
4760
4812
  var import_react_dnd2 = require("react-dnd");
4761
- var import_jsx_runtime26 = require("react/jsx-runtime");
4813
+ var import_jsx_runtime27 = require("react/jsx-runtime");
4762
4814
  var DroppableItem = ({
4763
4815
  item,
4764
4816
  type,
@@ -4767,7 +4819,7 @@ var DroppableItem = ({
4767
4819
  target,
4768
4820
  setTarget
4769
4821
  }) => {
4770
- const ref = (0, import_react17.useRef)(null);
4822
+ const ref = (0, import_react18.useRef)(null);
4771
4823
  const [, drop] = (0, import_react_dnd2.useDrop)({
4772
4824
  accept: type,
4773
4825
  hover() {
@@ -4777,12 +4829,12 @@ var DroppableItem = ({
4777
4829
  }
4778
4830
  });
4779
4831
  dropRef(drop(ref));
4780
- return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("div", { className: `w-full transition-all duration-500 h-full`, ref, children: component });
4832
+ return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("div", { className: `w-full transition-all duration-500 h-full`, ref, children: component });
4781
4833
  };
4782
4834
  var DroppableItem_default = DroppableItem;
4783
4835
 
4784
4836
  // src/components/activities/material-content/FillInTheBlanksActivityMaterialContent.tsx
4785
- var import_jsx_runtime27 = require("react/jsx-runtime");
4837
+ var import_jsx_runtime28 = require("react/jsx-runtime");
4786
4838
  var FillInTheBlanksActivityMaterialContent = ({
4787
4839
  uniqueValue,
4788
4840
  answer,
@@ -4794,9 +4846,9 @@ var FillInTheBlanksActivityMaterialContent = ({
4794
4846
  isPreview,
4795
4847
  showCorrectAnswer
4796
4848
  }) => {
4797
- const [shuffleOptionList, setShuffleOptionList] = (0, import_react18.useState)([]);
4798
- const [selectedOption, setSelectedOption] = (0, import_react18.useState)(null);
4799
- const [pasteOptionIndex, setPasteOptionIndex] = (0, import_react18.useState)(null);
4849
+ const [shuffleOptionList, setShuffleOptionList] = (0, import_react19.useState)([]);
4850
+ const [selectedOption, setSelectedOption] = (0, import_react19.useState)(null);
4851
+ const [pasteOptionIndex, setPasteOptionIndex] = (0, import_react19.useState)(null);
4800
4852
  const [{ isOver, canDrop }, drop] = (0, import_react_dnd3.useDrop)({
4801
4853
  accept: "FILL_IN_THE_BLANKS",
4802
4854
  drop: () => {
@@ -4806,10 +4858,10 @@ var FillInTheBlanksActivityMaterialContent = ({
4806
4858
  canDrop: monitor.canDrop()
4807
4859
  })
4808
4860
  });
4809
- (0, import_react19.useEffect)(() => {
4861
+ (0, import_react20.useEffect)(() => {
4810
4862
  setShuffleOptionList(shuffleArray(optionList));
4811
4863
  }, []);
4812
- (0, import_react19.useEffect)(() => {
4864
+ (0, import_react20.useEffect)(() => {
4813
4865
  if (!showCorrectAnswer) return;
4814
4866
  const foundAnswer = answer.data.find(
4815
4867
  (answerData) => answerData.type === "FILL_IN_THE_BLANKS"
@@ -4841,12 +4893,12 @@ var FillInTheBlanksActivityMaterialContent = ({
4841
4893
  return Object.keys(answerMap2).findIndex((key) => answerMap2[key] === option) !== -1;
4842
4894
  };
4843
4895
  const answerMap = retrieveAnswerMap();
4844
- return /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("div", { className: "flex flex-row flex-wrap items-center", onMouseUp: () => {
4896
+ return /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "flex flex-row flex-wrap items-center", onMouseUp: () => {
4845
4897
  }, children: [
4846
- /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("div", { className: "hidden md:block", children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("span", { className: "font-semibold text-xl opacity-60", children: i18n_default.t("please_select_fill_in_the_blanks_text") }) }),
4847
- /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("div", { className: "hidden md:contents", children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(DividerLine_default, {}) }),
4848
- /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("div", { className: "w-full flex flex-row flex-wrap gap-x-2 gap-y-2 my-2", children: shuffleOptionList.map(
4849
- (option, index) => checkAnswerProvided(answerMap, option) ? /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("div", { className: "opacity-30", children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
4898
+ /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "hidden md:block", children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { className: "font-semibold text-xl opacity-60", children: i18n_default.t("please_select_fill_in_the_blanks_text") }) }),
4899
+ /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "hidden md:contents", children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(DividerLine_default, {}) }),
4900
+ /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "w-full flex flex-row flex-wrap gap-x-2 gap-y-2 my-2", children: shuffleOptionList.map(
4901
+ (option, index) => checkAnswerProvided(answerMap, option) ? /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "opacity-30", children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
4850
4902
  ShowMaterialMediaByContentType_default,
4851
4903
  {
4852
4904
  contentType: contentMap.type,
@@ -4854,12 +4906,12 @@ var FillInTheBlanksActivityMaterialContent = ({
4854
4906
  canFullScreen: true
4855
4907
  },
4856
4908
  `${uniqueValue}-${index}`
4857
- ) }, index) : /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
4909
+ ) }, index) : /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
4858
4910
  DraggableItem_default,
4859
4911
  {
4860
4912
  item: { index: option },
4861
4913
  type: "FILL_IN_THE_BLANKS",
4862
- component: contentMap.type === "TEXT" ? /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
4914
+ component: contentMap.type === "TEXT" ? /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
4863
4915
  "div",
4864
4916
  {
4865
4917
  className: "border-catchup-blue border-2 px-2 py-1 rounded-catchup-xlarge cursor-pointer",
@@ -4867,9 +4919,9 @@ var FillInTheBlanksActivityMaterialContent = ({
4867
4919
  setSelectedOption(option);
4868
4920
  setPasteOptionIndex(null);
4869
4921
  },
4870
- children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("p", { className: "italic whitespace-pre-wrap", children: option })
4922
+ children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("p", { className: "italic whitespace-pre-wrap", children: option })
4871
4923
  }
4872
- ) : /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
4924
+ ) : /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
4873
4925
  "div",
4874
4926
  {
4875
4927
  className: "border-catchup-blue border-2 px-2 py-1 rounded-catchup-xlarge cursor-pointer",
@@ -4877,7 +4929,7 @@ var FillInTheBlanksActivityMaterialContent = ({
4877
4929
  setSelectedOption(option);
4878
4930
  setPasteOptionIndex(null);
4879
4931
  },
4880
- children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
4932
+ children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
4881
4933
  ShowMaterialMediaByContentType_default,
4882
4934
  {
4883
4935
  contentType: contentMap.type,
@@ -4895,12 +4947,12 @@ var FillInTheBlanksActivityMaterialContent = ({
4895
4947
  index
4896
4948
  )
4897
4949
  ) }),
4898
- /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("div", { className: "flex flex-row flex-wrap", children: Object.keys(answerMap).map((materialKey, index) => {
4950
+ /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "flex flex-row flex-wrap", children: Object.keys(answerMap).map((materialKey, index) => {
4899
4951
  const learnerAnswerState = checkAnswerState(
4900
4952
  JSON.parse(materialMap[materialKey]),
4901
4953
  answerMap[materialKey]
4902
4954
  );
4903
- return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("div", { className: "w-full md:w-1/2", children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("div", { className: "mx-2", children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
4955
+ return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "w-full md:w-1/2", children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "mx-2", children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
4904
4956
  DroppableItem_default,
4905
4957
  {
4906
4958
  item: { index },
@@ -4908,13 +4960,13 @@ var FillInTheBlanksActivityMaterialContent = ({
4908
4960
  target: pasteOptionIndex,
4909
4961
  setTarget: setPasteOptionIndex,
4910
4962
  dropRef: drop,
4911
- component: /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("div", { className: "w-full flex flex-row my-2 gap-x-2", children: [
4912
- /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("div", { className: "my-auto", children: /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("p", { className: "text-xl", children: [
4963
+ component: /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "w-full flex flex-row my-2 gap-x-2", children: [
4964
+ /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "my-auto", children: /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("p", { className: "text-xl", children: [
4913
4965
  parseFloat(materialKey) + 1,
4914
4966
  "."
4915
4967
  ] }) }),
4916
- /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("div", { className: "flex-1", children: checkCanAnswerQuestion() ? contentMap.type === "TEXT" ? /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("div", { className: "relative", children: [
4917
- /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("div", { className: "flex-1", children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
4968
+ /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "flex-1", children: checkCanAnswerQuestion() ? contentMap.type === "TEXT" ? /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "relative", children: [
4969
+ /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "flex-1", children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
4918
4970
  InputGroup_default,
4919
4971
  {
4920
4972
  type: "textarea",
@@ -4929,14 +4981,14 @@ var FillInTheBlanksActivityMaterialContent = ({
4929
4981
  }
4930
4982
  }
4931
4983
  ) }),
4932
- learnerAnswerState === "CORRECT" ? /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("div", { className: "absolute -top-[10px] right-4 bg-catchup-white", children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
4984
+ learnerAnswerState === "CORRECT" ? /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "absolute -top-[10px] right-4 bg-catchup-white", children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
4933
4985
  BaseImage_default,
4934
4986
  {
4935
4987
  src: "/icons/checkbox.webp",
4936
4988
  alt: "checkbox",
4937
4989
  size: "small"
4938
4990
  }
4939
- ) }) : learnerAnswerState === "INCORRECT" ? /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("div", { className: "absolute -top-[10px] right-4 bg-catchup-white", children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
4991
+ ) }) : learnerAnswerState === "INCORRECT" ? /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "absolute -top-[10px] right-4 bg-catchup-white", children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
4940
4992
  BaseImage_default,
4941
4993
  {
4942
4994
  src: "/icons/cross-red.webp",
@@ -4944,20 +4996,20 @@ var FillInTheBlanksActivityMaterialContent = ({
4944
4996
  size: "small"
4945
4997
  }
4946
4998
  ) }) : null
4947
- ] }) : answerMap[materialKey] === "" ? /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
4999
+ ] }) : answerMap[materialKey] === "" ? /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
4948
5000
  "div",
4949
5001
  {
4950
5002
  className: `w-catchup-activity-box-item border h-catchup-activity-box-item rounded-catchup-xlarge border-dashed ${learnerAnswerState === "CORRECT" ? "border-catchup-green" : learnerAnswerState === "INCORRECT" ? "border-catchup-red" : "border-catchup-blue"}`,
4951
- children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("div", { className: "h-full flex flex-col items-center justify-center px-4 py-2", children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("span", { className: "italic", children: i18n_default.t("please_drop_here") }) })
5003
+ children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "h-full flex flex-col items-center justify-center px-4 py-2", children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { className: "italic", children: i18n_default.t("please_drop_here") }) })
4952
5004
  }
4953
- ) : /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
5005
+ ) : /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
4954
5006
  "div",
4955
5007
  {
4956
5008
  className: "flex-1 cursor-pointer",
4957
5009
  onClick: () => {
4958
5010
  onChange(answer, materialKey, "");
4959
5011
  },
4960
- children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
5012
+ children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
4961
5013
  ShowMaterialMediaByContentType_default,
4962
5014
  {
4963
5015
  contentType: contentMap.type,
@@ -4967,13 +5019,13 @@ var FillInTheBlanksActivityMaterialContent = ({
4967
5019
  `${uniqueValue}-${index}`
4968
5020
  )
4969
5021
  }
4970
- ) : /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("p", { className: "text-xl", children: constructInputWithSpecialExpressionList(
5022
+ ) : /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("p", { className: "text-xl", children: constructInputWithSpecialExpressionList(
4971
5023
  answerMap[materialKey]
4972
- ).map((inputPart, index2) => /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
5024
+ ).map((inputPart, index2) => /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
4973
5025
  "span",
4974
5026
  {
4975
5027
  className: `${inputPart.isBold ? "font-bold" : ""} ${inputPart.isUnderline ? "underline" : ""}`,
4976
- children: inputPart.isEquation ? /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("span", { className: "text-2xl", children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_react_katex3.InlineMath, { math: inputPart.value }) }) : inputPart.value
5028
+ children: inputPart.isEquation ? /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { className: "text-2xl", children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_react_katex3.InlineMath, { math: inputPart.value }) }) : inputPart.value
4977
5029
  },
4978
5030
  index2
4979
5031
  )) }, materialKey) })
@@ -4987,8 +5039,8 @@ var FillInTheBlanksActivityMaterialContent = ({
4987
5039
  var FillInTheBlanksActivityMaterialContent_default = FillInTheBlanksActivityMaterialContent;
4988
5040
 
4989
5041
  // src/components/activities/FillInTheBlanksActivityContent.tsx
4990
- var import_react20 = require("react");
4991
- var import_jsx_runtime28 = require("react/jsx-runtime");
5042
+ var import_react21 = require("react");
5043
+ var import_jsx_runtime29 = require("react/jsx-runtime");
4992
5044
  var FillInTheBlanksActivityContent = ({
4993
5045
  answer,
4994
5046
  data,
@@ -5008,7 +5060,7 @@ var FillInTheBlanksActivityContent = ({
5008
5060
  "FILL_IN_THE_BLANKS"
5009
5061
  );
5010
5062
  const fillInTheBlanksIncorrectList = data.fillInTheBlanksIncorrectList ? JSON.parse(data.fillInTheBlanksIncorrectList) : [];
5011
- const [currentAnswerMap, setCurrentAnswerMap] = (0, import_react20.useState)(() => {
5063
+ const [currentAnswerMap, setCurrentAnswerMap] = (0, import_react21.useState)(() => {
5012
5064
  return retrieveCurrentAnswerMap();
5013
5065
  });
5014
5066
  function retrieveCurrentAnswerMap() {
@@ -5017,7 +5069,7 @@ var FillInTheBlanksActivityContent = ({
5017
5069
  );
5018
5070
  return answer.data[foundIndex].answerMap;
5019
5071
  }
5020
- (0, import_react20.useEffect)(() => {
5072
+ (0, import_react21.useEffect)(() => {
5021
5073
  setCurrentAnswerMap(retrieveCurrentAnswerMap());
5022
5074
  }, [answer]);
5023
5075
  const constructAnswerOptionList = () => {
@@ -5055,8 +5107,8 @@ var FillInTheBlanksActivityContent = ({
5055
5107
  setCurrentAnswerMap(newAnswerMap);
5056
5108
  changeAnswer(newAnswer);
5057
5109
  };
5058
- return /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "flex flex-row flex-wrap", children: [
5059
- /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: `${isFullScreen ? "w-full" : "w-full md:w-[60%]"}`, children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
5110
+ return /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)("div", { className: "flex flex-row flex-wrap", children: [
5111
+ /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("div", { className: `${isFullScreen ? "w-full" : "w-full md:w-[60%]"}`, children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
5060
5112
  ActivityBodyContent_default,
5061
5113
  {
5062
5114
  bodyMap: fillInTheBlanksBodyMap,
@@ -5065,9 +5117,9 @@ var FillInTheBlanksActivityContent = ({
5065
5117
  templateType: "FILL_IN_THE_BLANKS"
5066
5118
  }
5067
5119
  ) }),
5068
- /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: `${isFullScreen ? "contents" : "contents md:hidden"}`, children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(DividerLine_default, {}) }),
5069
- /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: `${isFullScreen ? "hidden" : "hidden md:block"}`, children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(VerticalDividerLine_default, {}) }),
5070
- /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: `${isFullScreen ? "w-full" : "w-full md:flex-1"}`, children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
5120
+ /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("div", { className: `${isFullScreen ? "contents" : "contents md:hidden"}`, children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(DividerLine_default, {}) }),
5121
+ /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("div", { className: `${isFullScreen ? "hidden" : "hidden md:block"}`, children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(VerticalDividerLine_default, {}) }),
5122
+ /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("div", { className: `${isFullScreen ? "w-full" : "w-full md:flex-1"}`, children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
5071
5123
  FillInTheBlanksActivityMaterialContent_default,
5072
5124
  {
5073
5125
  uniqueValue: JSON.stringify(data.contentMap),
@@ -5086,22 +5138,22 @@ var FillInTheBlanksActivityContent = ({
5086
5138
  var FillInTheBlanksActivityContent_default = FillInTheBlanksActivityContent;
5087
5139
 
5088
5140
  // src/components/activities/material-content/GroupingActivityMaterialContent.tsx
5089
- var import_react22 = require("react");
5141
+ var import_react23 = require("react");
5090
5142
  var import_react_dnd4 = require("react-dnd");
5091
5143
  var import_react_katex4 = require("react-katex");
5092
5144
 
5093
5145
  // src/hooks/useScreenSize.ts
5094
- var import_react21 = require("react");
5146
+ var import_react22 = require("react");
5095
5147
  var useScreenSize = () => {
5096
- const [containerSize, setContainerSize] = (0, import_react21.useState)({
5148
+ const [containerSize, setContainerSize] = (0, import_react22.useState)({
5097
5149
  width: 0,
5098
5150
  height: 0
5099
5151
  });
5100
- const [screenSize, setScreenSize] = (0, import_react21.useState)({
5152
+ const [screenSize, setScreenSize] = (0, import_react22.useState)({
5101
5153
  width: window.innerWidth,
5102
5154
  height: window.innerHeight
5103
5155
  });
5104
- (0, import_react21.useEffect)(() => {
5156
+ (0, import_react22.useEffect)(() => {
5105
5157
  const handleResize = () => {
5106
5158
  setScreenSize({
5107
5159
  width: window.innerWidth,
@@ -5126,7 +5178,7 @@ var useScreenSize = () => {
5126
5178
  var useScreenSize_default = useScreenSize;
5127
5179
 
5128
5180
  // src/components/activities/material-content/GroupingActivityMaterialContent.tsx
5129
- var import_jsx_runtime29 = require("react/jsx-runtime");
5181
+ var import_jsx_runtime30 = require("react/jsx-runtime");
5130
5182
  var GroupingActivityMaterialContent = ({
5131
5183
  uniqueValue,
5132
5184
  answer,
@@ -5137,10 +5189,10 @@ var GroupingActivityMaterialContent = ({
5137
5189
  isPreview,
5138
5190
  showCorrectAnswer
5139
5191
  }) => {
5140
- const [selectedValue, setSelectedValue] = (0, import_react22.useState)(null);
5141
- const [selectedTargetKey, setSelectedTargetKey] = (0, import_react22.useState)(null);
5142
- const [isShuffled, setIsShuffled] = (0, import_react22.useState)(false);
5143
- const [shuffledMaterialList, setShuffledMaterialList] = (0, import_react22.useState)([]);
5192
+ const [selectedValue, setSelectedValue] = (0, import_react23.useState)(null);
5193
+ const [selectedTargetKey, setSelectedTargetKey] = (0, import_react23.useState)(null);
5194
+ const [isShuffled, setIsShuffled] = (0, import_react23.useState)(false);
5195
+ const [shuffledMaterialList, setShuffledMaterialList] = (0, import_react23.useState)([]);
5144
5196
  const { screenSize, containerSize } = useScreenSize_default();
5145
5197
  const [{ isOver, canDrop }, drop] = (0, import_react_dnd4.useDrop)({
5146
5198
  accept: "GROUPING",
@@ -5151,16 +5203,16 @@ var GroupingActivityMaterialContent = ({
5151
5203
  canDrop: monitor.canDrop()
5152
5204
  })
5153
5205
  });
5154
- const ref = (0, import_react22.useRef)(null);
5155
- const itemsRef = (0, import_react22.useRef)(null);
5156
- const [maxWidth, setMaxWidth] = (0, import_react22.useState)(0);
5157
- (0, import_react22.useEffect)(() => {
5206
+ const ref = (0, import_react23.useRef)(null);
5207
+ const itemsRef = (0, import_react23.useRef)(null);
5208
+ const [maxWidth, setMaxWidth] = (0, import_react23.useState)(0);
5209
+ (0, import_react23.useEffect)(() => {
5158
5210
  if (!ref) return;
5159
5211
  if (!ref.current) return;
5160
5212
  if (!screenSize) return;
5161
5213
  setMaxWidth(ref.current.offsetWidth - 12);
5162
5214
  }, [ref, screenSize]);
5163
- (0, import_react22.useEffect)(() => {
5215
+ (0, import_react23.useEffect)(() => {
5164
5216
  const shuffleArray2 = (array) => {
5165
5217
  if (!isShuffled) {
5166
5218
  const copyArray = JSON.parse(JSON.stringify(array));
@@ -5181,7 +5233,7 @@ var GroupingActivityMaterialContent = ({
5181
5233
  });
5182
5234
  setShuffledMaterialList(shuffleArray2(materialList));
5183
5235
  }, []);
5184
- (0, import_react22.useEffect)(() => {
5236
+ (0, import_react23.useEffect)(() => {
5185
5237
  if (!showCorrectAnswer) return;
5186
5238
  answer.data.find(
5187
5239
  (answerData) => answerData.type === "GROUPING"
@@ -5225,19 +5277,19 @@ var GroupingActivityMaterialContent = ({
5225
5277
  };
5226
5278
  const answerMap = retrieveAnswerMap();
5227
5279
  const filteredMaterialList = retrieveFilteredMaterialList(answerMap);
5228
- return /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(import_jsx_runtime29.Fragment, { children: [
5229
- /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
5280
+ return /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(import_jsx_runtime30.Fragment, { children: [
5281
+ /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
5230
5282
  "div",
5231
5283
  {
5232
5284
  ref: itemsRef,
5233
5285
  className: "flex-1 flex flex-row gap-x-4 gap-y-4 overflow-auto py-2",
5234
5286
  children: filteredMaterialList.map((materialValue, index) => {
5235
- return /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
5287
+ return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
5236
5288
  DraggableItem_default,
5237
5289
  {
5238
5290
  item: { index: materialValue },
5239
5291
  type: "GROUPING",
5240
- component: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
5292
+ component: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
5241
5293
  "div",
5242
5294
  {
5243
5295
  className: `${selectedValue === materialValue ? "border-catchup-blue" : "border-catchup-lighter-gray"} h-catchup-activity-covering-box-item flex flex-col items-center justify-center border-2 rounded-catchup-xlarge cursor-pointer transition-all duration-300`,
@@ -5251,22 +5303,22 @@ var GroupingActivityMaterialContent = ({
5251
5303
  setSelectedValue(null);
5252
5304
  }
5253
5305
  },
5254
- children: contentMap.type === "TEXT" ? /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
5306
+ children: contentMap.type === "TEXT" ? /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
5255
5307
  "div",
5256
5308
  {
5257
5309
  className: `flex flex-col items-center justify-center m-4 min-h-[64px] min-w-[200px]`,
5258
- children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("p", { className: "text-xl text-center whitespace-pre-wrap", children: constructInputWithSpecialExpressionList(
5310
+ children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("p", { className: "text-xl text-center whitespace-pre-wrap", children: constructInputWithSpecialExpressionList(
5259
5311
  materialValue
5260
- ).map((inputPart, index2) => /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
5312
+ ).map((inputPart, index2) => /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
5261
5313
  "span",
5262
5314
  {
5263
5315
  className: `${inputPart.isBold ? "font-bold" : ""} ${inputPart.isUnderline ? "underline" : ""}`,
5264
- children: inputPart.isEquation ? /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("span", { className: "text-2xl", children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_react_katex4.InlineMath, { math: inputPart.value }) }) : inputPart.value
5316
+ children: inputPart.isEquation ? /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("span", { className: "text-2xl", children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_react_katex4.InlineMath, { math: inputPart.value }) }) : inputPart.value
5265
5317
  },
5266
5318
  index2
5267
5319
  )) })
5268
5320
  }
5269
- ) : /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
5321
+ ) : /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
5270
5322
  ShowMaterialMediaByContentType_default,
5271
5323
  {
5272
5324
  contentType: contentMap.type,
@@ -5291,22 +5343,22 @@ var GroupingActivityMaterialContent = ({
5291
5343
  })
5292
5344
  }
5293
5345
  ),
5294
- filteredMaterialList.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(DividerLine_default, {}) : null,
5295
- Object.keys(answerMap).map((answerMapKey, index) => /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)("div", { className: "flex flex-row w-full", children: [
5296
- /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("div", { className: "w-1/3", children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
5346
+ filteredMaterialList.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(DividerLine_default, {}) : null,
5347
+ Object.keys(answerMap).map((answerMapKey, index) => /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)("div", { className: "flex flex-row w-full", children: [
5348
+ /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("div", { className: "w-1/3", children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
5297
5349
  "div",
5298
5350
  {
5299
5351
  className: `border-catchup-blue h-catchup-activity-outer-box-item flex flex-col items-center justify-center border-2 rounded-catchup-xlarge transition-all duration-300 my-3`,
5300
- children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
5352
+ children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
5301
5353
  "div",
5302
5354
  {
5303
5355
  className: `flex flex-col items-center justify-center transition-all duration-300 m-4`,
5304
- children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("p", { className: "text-xl p-5 whitespace-pre-wrap", children: constructInputWithSpecialExpressionList(answerMapKey).map(
5305
- (inputPart, index2) => /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
5356
+ children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("p", { className: "text-xl p-5 whitespace-pre-wrap", children: constructInputWithSpecialExpressionList(answerMapKey).map(
5357
+ (inputPart, index2) => /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
5306
5358
  "span",
5307
5359
  {
5308
5360
  className: `${inputPart.isBold ? "font-bold" : ""} ${inputPart.isUnderline ? "underline" : ""}`,
5309
- children: inputPart.isEquation ? /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("span", { className: "text-2xl", children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_react_katex4.InlineMath, { math: inputPart.value }) }) : inputPart.value
5361
+ children: inputPart.isEquation ? /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("span", { className: "text-2xl", children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_react_katex4.InlineMath, { math: inputPart.value }) }) : inputPart.value
5310
5362
  },
5311
5363
  index2
5312
5364
  )
@@ -5315,12 +5367,12 @@ var GroupingActivityMaterialContent = ({
5315
5367
  )
5316
5368
  }
5317
5369
  ) }),
5318
- /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("div", { className: "mx-4 w-[2px] bg-catchup-lighter-gray" }),
5319
- /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("div", { className: "flex-1", ref, children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("div", { className: "h-full py-3", children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
5370
+ /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("div", { className: "mx-4 w-[2px] bg-catchup-lighter-gray" }),
5371
+ /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("div", { className: "flex-1", ref, children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("div", { className: "h-full py-3", children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
5320
5372
  "div",
5321
5373
  {
5322
5374
  className: `${canDrop ? selectedTargetKey === answerMapKey ? "bg-catchup-light-blue" : "bg-catchup-light-blue opacity-40" : ""} flex-1 border-catchup-blue rounded-catchup-xlarge border-2 h-full p-1`,
5323
- children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
5375
+ children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
5324
5376
  DroppableItem_default,
5325
5377
  {
5326
5378
  item: { index: answerMapKey },
@@ -5328,7 +5380,7 @@ var GroupingActivityMaterialContent = ({
5328
5380
  target: selectedTargetKey,
5329
5381
  setTarget: setSelectedTargetKey,
5330
5382
  dropRef: drop,
5331
- component: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
5383
+ component: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
5332
5384
  "div",
5333
5385
  {
5334
5386
  className: "h-full flex-1 flex flex-row items-center overflow-x-auto",
@@ -5341,7 +5393,7 @@ var GroupingActivityMaterialContent = ({
5341
5393
  materialMap[answerMapKey],
5342
5394
  answerMapValue
5343
5395
  );
5344
- return /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("div", { className: "p-1", children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("div", { className: "h-catchup-activity-box-item", children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
5396
+ return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("div", { className: "p-1", children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("div", { className: "h-catchup-activity-box-item", children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
5345
5397
  "div",
5346
5398
  {
5347
5399
  className: `${learnerAnswerState === "EMPTY" ? "border-catchup-lighter-gray" : learnerAnswerState === "CORRECT" ? "border-catchup-green" : learnerAnswerState === "INCORRECT" ? "border-catchup-red" : "border-catchup-blue"} border-2 rounded-catchup-xlarge h-full flex flex-col items-center justify-center transition-all duration-300 cursor-pointer`,
@@ -5357,17 +5409,17 @@ var GroupingActivityMaterialContent = ({
5357
5409
  setSelectedValue(null);
5358
5410
  }
5359
5411
  },
5360
- children: contentMap.type === "TEXT" ? /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
5412
+ children: contentMap.type === "TEXT" ? /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
5361
5413
  "div",
5362
5414
  {
5363
5415
  className: `flex flex-col items-center justify-center transition-all duration-300 min-h-[64px] min-w-[200px]`,
5364
- children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("div", { className: "m-2", children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("p", { className: "text-xl text-center whitespace-pre-wrap", children: constructInputWithSpecialExpressionList(
5416
+ children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("div", { className: "m-2", children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("p", { className: "text-xl text-center whitespace-pre-wrap", children: constructInputWithSpecialExpressionList(
5365
5417
  answerMapValue
5366
- ).map((inputPart, index2) => /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
5418
+ ).map((inputPart, index2) => /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
5367
5419
  "span",
5368
5420
  {
5369
5421
  className: `${inputPart.isBold ? "font-bold" : ""} ${inputPart.isUnderline ? "underline" : ""}`,
5370
- children: inputPart.isEquation ? /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("span", { className: "text-2xl", children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
5422
+ children: inputPart.isEquation ? /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("span", { className: "text-2xl", children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
5371
5423
  import_react_katex4.InlineMath,
5372
5424
  {
5373
5425
  math: inputPart.value
@@ -5377,7 +5429,7 @@ var GroupingActivityMaterialContent = ({
5377
5429
  index2
5378
5430
  )) }) })
5379
5431
  }
5380
- ) : /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
5432
+ ) : /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
5381
5433
  ShowMaterialMediaByContentType_default,
5382
5434
  {
5383
5435
  contentType: contentMap.type,
@@ -5403,7 +5455,7 @@ var GroupingActivityMaterialContent = ({
5403
5455
  var GroupingActivityMaterialContent_default = GroupingActivityMaterialContent;
5404
5456
 
5405
5457
  // src/components/activities/GroupingActivityContent.tsx
5406
- var import_jsx_runtime30 = require("react/jsx-runtime");
5458
+ var import_jsx_runtime31 = require("react/jsx-runtime");
5407
5459
  var GroupingActivityContent = ({
5408
5460
  answer,
5409
5461
  data,
@@ -5428,16 +5480,16 @@ var GroupingActivityContent = ({
5428
5480
  }
5429
5481
  changeAnswer(answer2);
5430
5482
  };
5431
- return /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(import_jsx_runtime30.Fragment, { children: [
5432
- /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
5483
+ return /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(import_jsx_runtime31.Fragment, { children: [
5484
+ /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
5433
5485
  ActivityBodyContent_default,
5434
5486
  {
5435
5487
  bodyMap: groupingBodyMap,
5436
5488
  templateType: "GROUPING"
5437
5489
  }
5438
5490
  ),
5439
- /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(DividerLine_default, {}),
5440
- /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
5491
+ /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(DividerLine_default, {}),
5492
+ /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
5441
5493
  GroupingActivityMaterialContent_default,
5442
5494
  {
5443
5495
  uniqueValue: JSON.stringify(data.contentMap),
@@ -5455,10 +5507,10 @@ var GroupingActivityContent = ({
5455
5507
  var GroupingActivityContent_default = GroupingActivityContent;
5456
5508
 
5457
5509
  // src/components/activities/material-content/MatchingActivityMaterialContent.tsx
5458
- var import_react23 = require("react");
5510
+ var import_react24 = require("react");
5459
5511
  var import_react_dnd5 = require("react-dnd");
5460
5512
  var import_react_katex5 = require("react-katex");
5461
- var import_jsx_runtime31 = require("react/jsx-runtime");
5513
+ var import_jsx_runtime32 = require("react/jsx-runtime");
5462
5514
  var MatchingActivityMaterialContent = ({
5463
5515
  uniqueValue,
5464
5516
  answer,
@@ -5469,10 +5521,10 @@ var MatchingActivityMaterialContent = ({
5469
5521
  isPreview,
5470
5522
  showCorrectAnswer
5471
5523
  }) => {
5472
- const [selectedValue, setSelectedValue] = (0, import_react23.useState)(null);
5473
- const [selectedTargetKey, setSelectedTargetKey] = (0, import_react23.useState)(null);
5474
- const [isShuffled, setIsShuffled] = (0, import_react23.useState)(false);
5475
- const [shuffledMaterialList, setShuffledMaterialList] = (0, import_react23.useState)([]);
5524
+ const [selectedValue, setSelectedValue] = (0, import_react24.useState)(null);
5525
+ const [selectedTargetKey, setSelectedTargetKey] = (0, import_react24.useState)(null);
5526
+ const [isShuffled, setIsShuffled] = (0, import_react24.useState)(false);
5527
+ const [shuffledMaterialList, setShuffledMaterialList] = (0, import_react24.useState)([]);
5476
5528
  const [{ isOver, canDrop }, drop] = (0, import_react_dnd5.useDrop)({
5477
5529
  accept: "MATCHING",
5478
5530
  drop: () => {
@@ -5483,8 +5535,8 @@ var MatchingActivityMaterialContent = ({
5483
5535
  })
5484
5536
  });
5485
5537
  const { containerSize } = useScreenSize_default();
5486
- const itemsRef = (0, import_react23.useRef)(null);
5487
- (0, import_react23.useEffect)(() => {
5538
+ const itemsRef = (0, import_react24.useRef)(null);
5539
+ (0, import_react24.useEffect)(() => {
5488
5540
  const shuffleArray2 = (array) => {
5489
5541
  if (!isShuffled) {
5490
5542
  const copyArray = JSON.parse(JSON.stringify(array));
@@ -5503,13 +5555,13 @@ var MatchingActivityMaterialContent = ({
5503
5555
  });
5504
5556
  setShuffledMaterialList(shuffleArray2(materialList));
5505
5557
  }, []);
5506
- (0, import_react23.useEffect)(() => {
5558
+ (0, import_react24.useEffect)(() => {
5507
5559
  if (!showCorrectAnswer) return;
5508
5560
  answer.data.find(
5509
5561
  (answerData) => answerData.type === "MATCHING"
5510
5562
  ).answerMap = materialMap;
5511
5563
  }, [showCorrectAnswer]);
5512
- (0, import_react23.useEffect)(() => {
5564
+ (0, import_react24.useEffect)(() => {
5513
5565
  if (!itemsRef) return;
5514
5566
  if (!itemsRef.current) return;
5515
5567
  if (!containerSize) return;
@@ -5554,18 +5606,18 @@ var MatchingActivityMaterialContent = ({
5554
5606
  };
5555
5607
  const answerMap = retrieveAnswerMap();
5556
5608
  const filteredMaterialList = retrieveFilteredMaterialList(answerMap);
5557
- return /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(import_jsx_runtime31.Fragment, { children: [
5558
- /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
5609
+ return /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(import_jsx_runtime32.Fragment, { children: [
5610
+ /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
5559
5611
  "div",
5560
5612
  {
5561
5613
  ref: itemsRef,
5562
5614
  className: "flex-1 flex flex-row gap-x-4 gap-y-4 overflow-auto py-2",
5563
- children: filteredMaterialList.map((materialValue, index) => /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
5615
+ children: filteredMaterialList.map((materialValue, index) => /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
5564
5616
  DraggableItem_default,
5565
5617
  {
5566
5618
  item: { index: materialValue },
5567
5619
  type: "MATCHING",
5568
- component: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
5620
+ component: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
5569
5621
  "div",
5570
5622
  {
5571
5623
  className: `${selectedValue === materialValue ? "border-catchup-blue" : "border-catchup-lighter-gray"} h-catchup-activity-covering-box-item flex flex-col items-center justify-center border-2 rounded-catchup-xlarge cursor-pointer transition-all duration-300`,
@@ -5579,22 +5631,22 @@ var MatchingActivityMaterialContent = ({
5579
5631
  setSelectedValue(null);
5580
5632
  }
5581
5633
  },
5582
- children: contentMap.type === "TEXT" ? /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
5634
+ children: contentMap.type === "TEXT" ? /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
5583
5635
  "div",
5584
5636
  {
5585
5637
  className: `flex flex-col items-center justify-center m-4 min-h-[64px] min-w-[200px]`,
5586
- children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)("p", { className: "text-xl p-5 whitespace-pre-wrap", children: constructInputWithSpecialExpressionList(
5638
+ children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("p", { className: "text-xl p-5 whitespace-pre-wrap", children: constructInputWithSpecialExpressionList(
5587
5639
  materialValue
5588
- ).map((inputPart, index2) => /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
5640
+ ).map((inputPart, index2) => /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
5589
5641
  "span",
5590
5642
  {
5591
5643
  className: `${inputPart.isBold ? "font-bold" : ""} ${inputPart.isUnderline ? "underline" : ""}`,
5592
- children: inputPart.isEquation ? /* @__PURE__ */ (0, import_jsx_runtime31.jsx)("span", { className: "text-2xl", children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_react_katex5.InlineMath, { math: inputPart.value }) }) : inputPart.value
5644
+ children: inputPart.isEquation ? /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("span", { className: "text-2xl", children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_react_katex5.InlineMath, { math: inputPart.value }) }) : inputPart.value
5593
5645
  },
5594
5646
  index2
5595
5647
  )) })
5596
5648
  }
5597
- ) : /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
5649
+ ) : /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
5598
5650
  ShowMaterialMediaByContentType_default,
5599
5651
  {
5600
5652
  contentType: contentMap.type,
@@ -5618,27 +5670,27 @@ var MatchingActivityMaterialContent = ({
5618
5670
  ))
5619
5671
  }
5620
5672
  ),
5621
- filteredMaterialList.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(DividerLine_default, {}) : null,
5673
+ filteredMaterialList.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(DividerLine_default, {}) : null,
5622
5674
  Object.keys(answerMap).map((answerMapKey, index) => {
5623
5675
  const learnerAnswerState = checkAnswerState(
5624
5676
  materialMap[answerMapKey],
5625
5677
  answerMap[answerMapKey]
5626
5678
  );
5627
- return /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)("div", { className: "flex flex-row w-full", children: [
5628
- /* @__PURE__ */ (0, import_jsx_runtime31.jsx)("div", { className: "w-1/3", children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
5679
+ return /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)("div", { className: "flex flex-row w-full", children: [
5680
+ /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("div", { className: "w-1/3", children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
5629
5681
  "div",
5630
5682
  {
5631
5683
  className: `h-catchup-activity-outer-box-item flex flex-col items-center justify-center border-2 rounded-catchup-xlarge transition-all duration-300 my-3 ${learnerAnswerState === "EMPTY" ? "border-catchup-blue" : learnerAnswerState === "CORRECT" ? "border-catchup-green" : learnerAnswerState === "INCORRECT" ? "border-catchup-red" : "border-catchup-blue"}`,
5632
- children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
5684
+ children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
5633
5685
  "div",
5634
5686
  {
5635
5687
  className: `flex flex-col items-center justify-center transition-all duration-300 m-4`,
5636
- children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)("p", { className: "text-xl p-5 whitespace-pre-wrap", children: constructInputWithSpecialExpressionList(answerMapKey).map(
5637
- (inputPart, index2) => /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
5688
+ children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("p", { className: "text-xl p-5 whitespace-pre-wrap", children: constructInputWithSpecialExpressionList(answerMapKey).map(
5689
+ (inputPart, index2) => /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
5638
5690
  "span",
5639
5691
  {
5640
5692
  className: `${inputPart.isBold ? "font-bold" : ""} ${inputPart.isUnderline ? "underline" : ""}`,
5641
- children: inputPart.isEquation ? /* @__PURE__ */ (0, import_jsx_runtime31.jsx)("span", { className: "text-2xl", children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_react_katex5.InlineMath, { math: inputPart.value }) }) : inputPart.value
5693
+ children: inputPart.isEquation ? /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("span", { className: "text-2xl", children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_react_katex5.InlineMath, { math: inputPart.value }) }) : inputPart.value
5642
5694
  },
5643
5695
  index2
5644
5696
  )
@@ -5647,8 +5699,8 @@ var MatchingActivityMaterialContent = ({
5647
5699
  )
5648
5700
  }
5649
5701
  ) }),
5650
- /* @__PURE__ */ (0, import_jsx_runtime31.jsx)("div", { className: "mx-4 w-[2px] bg-catchup-lighter-gray" }),
5651
- /* @__PURE__ */ (0, import_jsx_runtime31.jsx)("div", { className: "flex-1", children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
5702
+ /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("div", { className: "mx-4 w-[2px] bg-catchup-lighter-gray" }),
5703
+ /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("div", { className: "flex-1", children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
5652
5704
  "div",
5653
5705
  {
5654
5706
  className: `${canDrop ? selectedTargetKey === answerMapKey ? "bg-catchup-light-blue" : "bg-catchup-light-blue opacity-40" : ""} h-catchup-activity-outer-box-item flex flex-col items-center justify-center border-2 rounded-catchup-xlarge cursor-pointer transition-all duration-300 my-3 ${learnerAnswerState === "EMPTY" ? "border-catchup-blue" : learnerAnswerState === "CORRECT" ? "border-catchup-green" : learnerAnswerState === "INCORRECT" ? "border-catchup-red" : "border-catchup-blue"}`,
@@ -5657,7 +5709,7 @@ var MatchingActivityMaterialContent = ({
5657
5709
  setSelectedValue(null);
5658
5710
  }
5659
5711
  },
5660
- children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
5712
+ children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
5661
5713
  DroppableItem_default,
5662
5714
  {
5663
5715
  item: { index: answerMapKey },
@@ -5665,7 +5717,7 @@ var MatchingActivityMaterialContent = ({
5665
5717
  target: selectedTargetKey,
5666
5718
  setTarget: setSelectedTargetKey,
5667
5719
  dropRef: drop,
5668
- component: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
5720
+ component: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
5669
5721
  "div",
5670
5722
  {
5671
5723
  className: `h-full flex-1 flex flex-row items-center justify-center `,
@@ -5678,16 +5730,16 @@ var MatchingActivityMaterialContent = ({
5678
5730
  );
5679
5731
  }
5680
5732
  },
5681
- children: contentMap.type === "TEXT" ? /* @__PURE__ */ (0, import_jsx_runtime31.jsx)("p", { className: "text-xl p-5 whitespace-pre-wrap", children: constructInputWithSpecialExpressionList(
5733
+ children: contentMap.type === "TEXT" ? /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("p", { className: "text-xl p-5 whitespace-pre-wrap", children: constructInputWithSpecialExpressionList(
5682
5734
  answerMap[answerMapKey]
5683
- ).map((inputPart, index2) => /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
5735
+ ).map((inputPart, index2) => /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
5684
5736
  "span",
5685
5737
  {
5686
5738
  className: `${inputPart.isBold ? "font-bold" : ""} ${inputPart.isUnderline ? "underline" : ""}`,
5687
- children: inputPart.isEquation ? /* @__PURE__ */ (0, import_jsx_runtime31.jsx)("span", { className: "text-2xl", children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_react_katex5.InlineMath, { math: inputPart.value }) }) : inputPart.value
5739
+ children: inputPart.isEquation ? /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("span", { className: "text-2xl", children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_react_katex5.InlineMath, { math: inputPart.value }) }) : inputPart.value
5688
5740
  },
5689
5741
  index2
5690
- )) }) : /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
5742
+ )) }) : /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
5691
5743
  ShowMaterialMediaByContentType_default,
5692
5744
  {
5693
5745
  contentType: contentMap.type,
@@ -5710,7 +5762,7 @@ var MatchingActivityMaterialContent = ({
5710
5762
  var MatchingActivityMaterialContent_default = MatchingActivityMaterialContent;
5711
5763
 
5712
5764
  // src/components/activities/MatchingActivityContent.tsx
5713
- var import_jsx_runtime32 = require("react/jsx-runtime");
5765
+ var import_jsx_runtime33 = require("react/jsx-runtime");
5714
5766
  var MatchingActivityContent = ({
5715
5767
  answer,
5716
5768
  data,
@@ -5731,16 +5783,16 @@ var MatchingActivityContent = ({
5731
5783
  answerMap[key] = value;
5732
5784
  changeAnswer(answer2);
5733
5785
  };
5734
- return /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(import_jsx_runtime32.Fragment, { children: [
5735
- /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
5786
+ return /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)(import_jsx_runtime33.Fragment, { children: [
5787
+ /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
5736
5788
  ActivityBodyContent_default,
5737
5789
  {
5738
5790
  bodyMap: matchingBodyMap,
5739
5791
  templateType: "MATCHING"
5740
5792
  }
5741
5793
  ),
5742
- /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(DividerLine_default, {}),
5743
- /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
5794
+ /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(DividerLine_default, {}),
5795
+ /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
5744
5796
  MatchingActivityMaterialContent_default,
5745
5797
  {
5746
5798
  uniqueValue: JSON.stringify(data.contentMap),
@@ -5759,7 +5811,7 @@ var MatchingActivityContent_default = MatchingActivityContent;
5759
5811
 
5760
5812
  // src/components/activities/material-content/MCMAActivityMaterialContent.tsx
5761
5813
  var import_react_katex6 = require("react-katex");
5762
- var import_jsx_runtime33 = require("react/jsx-runtime");
5814
+ var import_jsx_runtime34 = require("react/jsx-runtime");
5763
5815
  var MCMAActivityMaterialContent = ({
5764
5816
  uniqueValue,
5765
5817
  answer,
@@ -5792,10 +5844,10 @@ var MCMAActivityMaterialContent = ({
5792
5844
  const answerMap = retrieveAnswerMap();
5793
5845
  const correctAnswerList = retrieveCorrectAnswerList();
5794
5846
  return Object.keys(materialMap).map((materialKey, index) => {
5795
- return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("div", { className: "flex flex-row items-center my-1", children: /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)("div", { className: "flex-1 flex flex-col justify-center border-catchup-lighter-gray rounded-catchup-xlarge px-5 md:px-0", children: [
5796
- /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("div", { className: "hidden md:block", children: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("span", { className: "font-semibold text-xl opacity-60", children: i18n_default.t("please_select_mcma_text") }) }),
5797
- /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("div", { className: "hidden md:contents", children: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(DividerLine_default, {}) }),
5798
- checkCanAnswerQuestion() ? /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("div", { className: "flex flex-row w-full flex-wrap ", children: materialMap[materialKey].map(
5847
+ return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("div", { className: "flex flex-row items-center my-1", children: /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)("div", { className: "flex-1 flex flex-col justify-center border-catchup-lighter-gray rounded-catchup-xlarge px-5 md:px-0", children: [
5848
+ /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("div", { className: "hidden md:block", children: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("span", { className: "font-semibold text-xl opacity-60", children: i18n_default.t("please_select_mcma_text") }) }),
5849
+ /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("div", { className: "hidden md:contents", children: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(DividerLine_default, {}) }),
5850
+ checkCanAnswerQuestion() ? /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("div", { className: "flex flex-row w-full flex-wrap ", children: materialMap[materialKey].map(
5799
5851
  (materialSubKey, index2) => {
5800
5852
  const foundAnswer = answerMap[materialKey].find(
5801
5853
  (learnerAnswer) => learnerAnswer === materialSubKey
@@ -5808,7 +5860,7 @@ var MCMAActivityMaterialContent = ({
5808
5860
  const foundIndex = correctAnswerList.findIndex(
5809
5861
  (correctAnswer) => correctAnswer === materialSubKey
5810
5862
  );
5811
- return /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)(
5863
+ return /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)(
5812
5864
  "div",
5813
5865
  {
5814
5866
  className: `w-full flex flex-row items-center justify-center cursor-pointer my-2 gap-x-2 ${learnerAnswerState === "EMPTY" && foundIndex !== -1 || learnerAnswerState === "CORRECT" ? "border-2 border-catchup-green rounded-catchup-xlarge p-2" : learnerAnswerState === "INCORRECT" ? "border-2 border-catchup-red rounded-catchup-xlarge p-2" : ""}`,
@@ -5816,7 +5868,7 @@ var MCMAActivityMaterialContent = ({
5816
5868
  onChange(answer, materialKey, materialSubKey);
5817
5869
  },
5818
5870
  children: [
5819
- /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
5871
+ /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
5820
5872
  BaseImage_default,
5821
5873
  {
5822
5874
  src: answerMap[materialKey].includes(materialSubKey) ? "/icons/checkbox.webp" : "/icons/checkbox-empty.webp",
@@ -5826,16 +5878,16 @@ var MCMAActivityMaterialContent = ({
5826
5878
  }
5827
5879
  }
5828
5880
  ),
5829
- /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("div", { className: "flex-1", children: contentMap.type === "TEXT" ? /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("p", { className: "text-xl whitespace-pre-wrap", children: constructInputWithSpecialExpressionList(
5881
+ /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("div", { className: "flex-1", children: contentMap.type === "TEXT" ? /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("p", { className: "text-xl whitespace-pre-wrap", children: constructInputWithSpecialExpressionList(
5830
5882
  materialSubKey
5831
- ).map((inputPart, index3) => /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
5883
+ ).map((inputPart, index3) => /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
5832
5884
  "span",
5833
5885
  {
5834
5886
  className: `${inputPart.isBold ? "font-bold" : ""} ${inputPart.isUnderline ? "underline" : ""}`,
5835
- children: inputPart.isEquation ? /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("span", { className: "text-2xl", children: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_react_katex6.InlineMath, { math: inputPart.value }) }) : inputPart.value
5887
+ children: inputPart.isEquation ? /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("span", { className: "text-2xl", children: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(import_react_katex6.InlineMath, { math: inputPart.value }) }) : inputPart.value
5836
5888
  },
5837
5889
  index3
5838
- )) }) : /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
5890
+ )) }) : /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
5839
5891
  ShowMaterialMediaByContentType_default,
5840
5892
  {
5841
5893
  contentType: contentMap.type,
@@ -5849,13 +5901,13 @@ var MCMAActivityMaterialContent = ({
5849
5901
  index2
5850
5902
  );
5851
5903
  }
5852
- ) }) : /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("p", { className: "text-xl", children: constructInputWithSpecialExpressionList(
5904
+ ) }) : /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("p", { className: "text-xl", children: constructInputWithSpecialExpressionList(
5853
5905
  answerMap[materialKey]
5854
- ).map((inputPart, index2) => /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
5906
+ ).map((inputPart, index2) => /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
5855
5907
  "span",
5856
5908
  {
5857
5909
  className: `${inputPart.isBold ? "font-bold" : ""} ${inputPart.isUnderline ? "underline" : ""}`,
5858
- children: inputPart.isEquation ? /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("span", { className: "text-2xl", children: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_react_katex6.InlineMath, { math: inputPart.value }) }) : inputPart.value
5910
+ children: inputPart.isEquation ? /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("span", { className: "text-2xl", children: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(import_react_katex6.InlineMath, { math: inputPart.value }) }) : inputPart.value
5859
5911
  },
5860
5912
  index2
5861
5913
  )) }, materialKey)
@@ -5865,7 +5917,7 @@ var MCMAActivityMaterialContent = ({
5865
5917
  var MCMAActivityMaterialContent_default = MCMAActivityMaterialContent;
5866
5918
 
5867
5919
  // src/components/activities/MCMAActivityContent.tsx
5868
- var import_jsx_runtime34 = require("react/jsx-runtime");
5920
+ var import_jsx_runtime35 = require("react/jsx-runtime");
5869
5921
  var MCMAActivityContent = ({
5870
5922
  answer,
5871
5923
  data,
@@ -5892,11 +5944,11 @@ var MCMAActivityContent = ({
5892
5944
  }
5893
5945
  changeAnswer(answer2);
5894
5946
  };
5895
- return /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)("div", { className: "flex flex-row flex-wrap", children: [
5896
- /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("div", { className: `${isFullScreen ? "w-full" : "w-full md:w-[60%]"}`, children: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(ActivityBodyContent_default, { bodyMap: MCMABodyMap, templateType: "MCMA" }) }),
5897
- /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("div", { className: `${isFullScreen ? "contents" : "contents md:hidden"}`, children: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(DividerLine_default, {}) }),
5898
- /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("div", { className: `${isFullScreen ? "hidden" : "hidden md:block"}`, children: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(VerticalDividerLine_default, {}) }),
5899
- /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("div", { className: `${isFullScreen ? "w-full" : "w-full md:flex-1"}`, children: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
5947
+ return /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)("div", { className: "flex flex-row flex-wrap", children: [
5948
+ /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("div", { className: `${isFullScreen ? "w-full" : "w-full md:w-[60%]"}`, children: /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(ActivityBodyContent_default, { bodyMap: MCMABodyMap, templateType: "MCMA" }) }),
5949
+ /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("div", { className: `${isFullScreen ? "contents" : "contents md:hidden"}`, children: /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(DividerLine_default, {}) }),
5950
+ /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("div", { className: `${isFullScreen ? "hidden" : "hidden md:block"}`, children: /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(VerticalDividerLine_default, {}) }),
5951
+ /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("div", { className: `${isFullScreen ? "w-full" : "w-full md:flex-1"}`, children: /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
5900
5952
  MCMAActivityMaterialContent_default,
5901
5953
  {
5902
5954
  uniqueValue: JSON.stringify(data.contentMap),
@@ -5914,7 +5966,7 @@ var MCMAActivityContent_default = MCMAActivityContent;
5914
5966
 
5915
5967
  // src/components/activities/material-content/MCSAActivityMaterialContent.tsx
5916
5968
  var import_react_katex7 = require("react-katex");
5917
- var import_jsx_runtime35 = require("react/jsx-runtime");
5969
+ var import_jsx_runtime36 = require("react/jsx-runtime");
5918
5970
  var MCSAActivityMaterialContent = ({
5919
5971
  uniqueValue,
5920
5972
  answer,
@@ -5944,10 +5996,10 @@ var MCSAActivityMaterialContent = ({
5944
5996
  const answerMap = retrieveAnswerMap();
5945
5997
  const correctAnswer = retrieveCorrectAnswer();
5946
5998
  return Object.keys(materialMap).map((materialKey, index) => {
5947
- return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("div", { className: "flex flex-row items-center my-1", children: /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)("div", { className: "flex-1 flex flex-col justify-center border-catchup-lighter-gray rounded-catchup-xlarge px-5 md:px-0", children: [
5948
- /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("div", { className: "hidden md:block", children: /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("span", { className: "font-semibold text-xl opacity-60", children: i18n_default.t("please_select_mcsa_text") }) }),
5949
- /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("div", { className: "hidden md:contents", children: /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(DividerLine_default, {}) }),
5950
- checkCanAnswerQuestion() ? /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
5999
+ return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("div", { className: "flex flex-row items-center my-1", children: /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)("div", { className: "flex-1 flex flex-col justify-center border-catchup-lighter-gray rounded-catchup-xlarge px-5 md:px-0", children: [
6000
+ /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("div", { className: "hidden md:block", children: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("span", { className: "font-semibold text-xl opacity-60", children: i18n_default.t("please_select_mcsa_text") }) }),
6001
+ /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("div", { className: "hidden md:contents", children: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(DividerLine_default, {}) }),
6002
+ checkCanAnswerQuestion() ? /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
5951
6003
  "div",
5952
6004
  {
5953
6005
  className: `flex flex-row w-full ${Object.keys(materialMap[materialKey]).length <= 4 ? "justify-center" : ""} flex-wrap`,
@@ -5958,7 +6010,7 @@ var MCSAActivityMaterialContent = ({
5958
6010
  materialSubKey,
5959
6011
  answerMap[materialKey]
5960
6012
  );
5961
- return /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)(
6013
+ return /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(
5962
6014
  "div",
5963
6015
  {
5964
6016
  className: `w-full flex flex-row items-center justify-center cursor-pointer my-2 gap-x-2 ${learnerAnswerState === "EMPTY" && materialSubKey === correctAnswer || learnerAnswerState === "CORRECT" ? "border-2 border-catchup-green rounded-catchup-xlarge p-2" : learnerAnswerState === "INCORRECT" ? "border-2 border-catchup-red rounded-catchup-xlarge p-2" : ""}`,
@@ -5966,7 +6018,7 @@ var MCSAActivityMaterialContent = ({
5966
6018
  onChange(answer, materialKey, materialSubKey);
5967
6019
  },
5968
6020
  children: [
5969
- /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
6021
+ /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
5970
6022
  BaseImage_default,
5971
6023
  {
5972
6024
  src: answerMap[materialKey] === materialSubKey ? "/icons/item-element.webp" : "/icons/not-selected-item-element.webp",
@@ -5976,16 +6028,16 @@ var MCSAActivityMaterialContent = ({
5976
6028
  }
5977
6029
  }
5978
6030
  ),
5979
- /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("div", { className: "flex-1", children: contentMap.type === "TEXT" ? /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("p", { className: "text-xl whitespace-pre-wrap", children: constructInputWithSpecialExpressionList(
6031
+ /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("div", { className: "flex-1", children: contentMap.type === "TEXT" ? /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("p", { className: "text-xl whitespace-pre-wrap", children: constructInputWithSpecialExpressionList(
5980
6032
  materialSubKey
5981
- ).map((inputPart, index3) => /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
6033
+ ).map((inputPart, index3) => /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
5982
6034
  "span",
5983
6035
  {
5984
6036
  className: `${inputPart.isBold ? "font-bold" : ""} ${inputPart.isUnderline ? "underline" : ""}`,
5985
- children: inputPart.isEquation ? /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("span", { className: "text-2xl", children: /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_react_katex7.InlineMath, { math: inputPart.value }) }) : inputPart.value
6037
+ children: inputPart.isEquation ? /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("span", { className: "text-2xl", children: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(import_react_katex7.InlineMath, { math: inputPart.value }) }) : inputPart.value
5986
6038
  },
5987
6039
  index3
5988
- )) }) : /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
6040
+ )) }) : /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
5989
6041
  ShowMaterialMediaByContentType_default,
5990
6042
  {
5991
6043
  contentType: contentMap.type,
@@ -6001,13 +6053,13 @@ var MCSAActivityMaterialContent = ({
6001
6053
  }
6002
6054
  )
6003
6055
  }
6004
- ) : /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("p", { className: "text-xl whitespace-pre-wrap", children: constructInputWithSpecialExpressionList(
6056
+ ) : /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("p", { className: "text-xl whitespace-pre-wrap", children: constructInputWithSpecialExpressionList(
6005
6057
  answerMap[materialKey]
6006
- ).map((inputPart, index2) => /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
6058
+ ).map((inputPart, index2) => /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
6007
6059
  "span",
6008
6060
  {
6009
6061
  className: `${inputPart.isBold ? "font-bold" : ""} ${inputPart.isUnderline ? "underline" : ""}`,
6010
- children: inputPart.isEquation ? /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("span", { className: "text-2xl", children: /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_react_katex7.InlineMath, { math: inputPart.value }) }) : inputPart.value
6062
+ children: inputPart.isEquation ? /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("span", { className: "text-2xl", children: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(import_react_katex7.InlineMath, { math: inputPart.value }) }) : inputPart.value
6011
6063
  },
6012
6064
  index2
6013
6065
  )) })
@@ -6017,7 +6069,7 @@ var MCSAActivityMaterialContent = ({
6017
6069
  var MCSAActivityMaterialContent_default = MCSAActivityMaterialContent;
6018
6070
 
6019
6071
  // src/components/activities/MCSAActivityContent.tsx
6020
- var import_jsx_runtime36 = require("react/jsx-runtime");
6072
+ var import_jsx_runtime37 = require("react/jsx-runtime");
6021
6073
  var MCSAActivityContent = ({
6022
6074
  answer,
6023
6075
  data,
@@ -6037,11 +6089,11 @@ var MCSAActivityContent = ({
6037
6089
  answerMap[key] = value;
6038
6090
  changeAnswer(answer2);
6039
6091
  };
6040
- return /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)("div", { className: "flex flex-row flex-wrap", children: [
6041
- /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("div", { className: `${isFullScreen ? "w-full" : "w-full md:w-[60%]"}`, children: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(ActivityBodyContent_default, { bodyMap: MCSABodyMap, templateType: "MCSA" }) }),
6042
- /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("div", { className: `${isFullScreen ? "contents" : "contents md:hidden"}`, children: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(DividerLine_default, {}) }),
6043
- /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("div", { className: `${isFullScreen ? "hidden" : "hidden md:block"}`, children: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(VerticalDividerLine_default, {}) }),
6044
- /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("div", { className: `${isFullScreen ? "w-full" : "w-full md:flex-1"}`, children: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
6092
+ return /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)("div", { className: "flex flex-row flex-wrap", children: [
6093
+ /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("div", { className: `${isFullScreen ? "w-full" : "w-full md:w-[60%]"}`, children: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(ActivityBodyContent_default, { bodyMap: MCSABodyMap, templateType: "MCSA" }) }),
6094
+ /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("div", { className: `${isFullScreen ? "contents" : "contents md:hidden"}`, children: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(DividerLine_default, {}) }),
6095
+ /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("div", { className: `${isFullScreen ? "hidden" : "hidden md:block"}`, children: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(VerticalDividerLine_default, {}) }),
6096
+ /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("div", { className: `${isFullScreen ? "w-full" : "w-full md:flex-1"}`, children: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
6045
6097
  MCSAActivityMaterialContent_default,
6046
6098
  {
6047
6099
  uniqueValue: JSON.stringify(data.contentMap),
@@ -6057,11 +6109,40 @@ var MCSAActivityContent = ({
6057
6109
  };
6058
6110
  var MCSAActivityContent_default = MCSAActivityContent;
6059
6111
 
6112
+ // src/utilization/StorageUtilization.ts
6113
+ var convertDataURLtoFile = (dataurl, filename) => {
6114
+ var arr = dataurl.split(","), mime = (arr[0].match(/:(.*?);/) || [])[1], bstr = atob(arr[arr.length - 1]), n = bstr.length, u8arr = new Uint8Array(n);
6115
+ while (n--) {
6116
+ u8arr[n] = bstr.charCodeAt(n);
6117
+ }
6118
+ return new File([u8arr], filename, { type: mime });
6119
+ };
6120
+ var retrieveDocumentTypeFromAcceptedFormat = (format) => {
6121
+ if (format === "application/pdf") {
6122
+ return "PDF";
6123
+ } else if (format === "image/jpeg" || format === "image/png" || format === "image/jpg" || format === "image/webp") {
6124
+ return "IMAGE";
6125
+ } else if (format === "audio/mp3") {
6126
+ return "AUDIO";
6127
+ }
6128
+ };
6129
+ var retrieveDocumentTypeFromExtension = (format) => {
6130
+ if (format === "pdf") {
6131
+ return "PDF";
6132
+ } else if (format === "jpeg" || format === "png" || format === "jpg" || format === "webp") {
6133
+ return "IMAGE";
6134
+ } else if (format === "mp3") {
6135
+ return "AUDIO";
6136
+ }
6137
+ return "";
6138
+ };
6139
+
6060
6140
  // src/components/activities/material-content/OpenEndedActivityMaterialContent.tsx
6061
- var import_jsx_runtime37 = require("react/jsx-runtime");
6141
+ var import_jsx_runtime38 = require("react/jsx-runtime");
6062
6142
  var OpenEndedActivityMaterialContent = ({
6063
6143
  answer,
6064
6144
  contentMap,
6145
+ checkCanAnswerQuestion,
6065
6146
  onChange
6066
6147
  }) => {
6067
6148
  const retrieveAnswer = () => {
@@ -6081,33 +6162,93 @@ var OpenEndedActivityMaterialContent = ({
6081
6162
  };
6082
6163
  const RenderTextContent = (answerMap2) => {
6083
6164
  const answerMapAnswer = answerMap2["ANSWER"];
6084
- return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
6085
- InputGroup_default,
6165
+ let documentType = "TEXT";
6166
+ if (answerMapAnswer.startsWith(`https://`) || answerMapAnswer.startsWith(`http://`)) {
6167
+ const extension = answerMapAnswer.split(".").pop();
6168
+ documentType = retrieveDocumentTypeFromExtension(extension);
6169
+ }
6170
+ if (documentType === "IMAGE") {
6171
+ return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("div", { className: "flex flex-col justify-center items-center my-5", children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
6172
+ BaseImage_default,
6173
+ {
6174
+ src: answerMapAnswer,
6175
+ alt: "document",
6176
+ size: "custom",
6177
+ className: "w-[80%] rounded-catchup-xlarge"
6178
+ }
6179
+ ) });
6180
+ } else if (documentType === "PDF") {
6181
+ return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(BasePDF_default, { file: answerMapAnswer });
6182
+ } else if (documentType === "AUDIO") {
6183
+ return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("div", { className: "h-[56px]", children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
6184
+ "audio",
6185
+ {
6186
+ className: "h-full w-full rounded-catchup-xlarge",
6187
+ src: answerMapAnswer,
6188
+ controls: true,
6189
+ onClick: () => {
6190
+ }
6191
+ }
6192
+ ) });
6193
+ } else if (documentType === "TEXT") {
6194
+ return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
6195
+ InputGroup_default,
6196
+ {
6197
+ type: "textarea",
6198
+ value: answerMapAnswer,
6199
+ useMinHeight: true,
6200
+ onChange: (e) => {
6201
+ if (checkCanAnswerQuestion()) {
6202
+ onChange(answer, e.target.value);
6203
+ }
6204
+ }
6205
+ }
6206
+ );
6207
+ }
6208
+ };
6209
+ const RenderImageContent = (answerMap2) => {
6210
+ const answerMapAnswer = answerMap2["ANSWER"];
6211
+ const extension = answerMapAnswer.split(".").pop();
6212
+ const documentType = retrieveDocumentTypeFromExtension(extension);
6213
+ return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(import_jsx_runtime38.Fragment, { children: documentType === "IMAGE" ? /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("div", { className: "flex flex-col justify-center items-center my-5", children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
6214
+ BaseImage_default,
6086
6215
  {
6087
- type: "textarea",
6088
- value: answerMapAnswer,
6089
- useMinHeight: true,
6090
- onChange: (e) => {
6091
- onChange(answer, e.target.value);
6216
+ src: answerMapAnswer,
6217
+ alt: "document",
6218
+ size: "custom",
6219
+ className: "w-[80%] rounded-catchup-xlarge"
6220
+ }
6221
+ ) }) : documentType === "PDF" ? /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("div", { className: "flex flex-col justify-center items-center my-5", children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(BasePDF_default, { file: answerMapAnswer }) }) : null });
6222
+ };
6223
+ const RenderAudioContent = (answerMap2) => {
6224
+ const answerMapAnswer = answerMap2["ANSWER"];
6225
+ return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("div", { className: "h-[56px]", children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
6226
+ "audio",
6227
+ {
6228
+ className: "h-full w-full rounded-catchup-xlarge",
6229
+ src: answerMapAnswer,
6230
+ controls: true,
6231
+ onClick: () => {
6092
6232
  }
6093
6233
  }
6094
- );
6234
+ ) });
6095
6235
  };
6096
6236
  const answerMap = retrieveAnswerMap();
6097
- return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_jsx_runtime37.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)("div", { className: "", children: [
6098
- /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("div", { className: "hidden md:block", children: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("span", { className: "font-semibold text-xl opacity-60", children: i18n_default.t("please_select_open_ended_text") }) }),
6099
- /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("div", { className: "hidden md:contents", children: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(DividerLine_default, {}) }),
6100
- contentMap.type === "TEXT" ? RenderTextContent(answerMap) : null
6237
+ return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(import_jsx_runtime38.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)("div", { className: "", children: [
6238
+ /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("div", { className: "hidden md:block", children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("span", { className: "font-semibold text-xl opacity-60", children: i18n_default.t("please_select_open_ended_text") }) }),
6239
+ /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("div", { className: "hidden md:contents", children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(DividerLine_default, {}) }),
6240
+ contentMap.type === "TEXT" ? RenderTextContent(answerMap) : contentMap.type === "IMAGE" ? RenderImageContent(answerMap) : contentMap.type === "AUDIO" ? RenderAudioContent(answerMap) : null
6101
6241
  ] }) });
6102
6242
  };
6103
6243
  var OpenEndedActivityMaterialContent_default = OpenEndedActivityMaterialContent;
6104
6244
 
6105
6245
  // src/components/activities/OpenEndedActivityContent.tsx
6106
- var import_jsx_runtime38 = require("react/jsx-runtime");
6246
+ var import_jsx_runtime39 = require("react/jsx-runtime");
6107
6247
  var OpenEndedActivityContent = ({
6108
6248
  answer,
6109
6249
  data,
6110
6250
  changeAnswer,
6251
+ canAnswerQuestion,
6111
6252
  showMaterialContent,
6112
6253
  isFullScreen
6113
6254
  }) => {
@@ -6121,12 +6262,12 @@ var OpenEndedActivityContent = ({
6121
6262
  answerMap["ANSWER"] = value;
6122
6263
  changeAnswer(answer2);
6123
6264
  };
6124
- return /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)("div", { className: "flex flex-row flex-wrap", children: [
6125
- /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
6265
+ return /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)("div", { className: "flex flex-row flex-wrap", children: [
6266
+ /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
6126
6267
  "div",
6127
6268
  {
6128
6269
  className: `${showMaterialContent ? isFullScreen ? "w-full" : "w-full md:w-[40%]" : "w-full"}`,
6129
- children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
6270
+ children: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
6130
6271
  ActivityBodyContent_default,
6131
6272
  {
6132
6273
  bodyMap: openEndedBodyMap,
@@ -6135,20 +6276,21 @@ var OpenEndedActivityContent = ({
6135
6276
  )
6136
6277
  }
6137
6278
  ),
6138
- showMaterialContent ? /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)(import_jsx_runtime38.Fragment, { children: [
6139
- /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
6279
+ showMaterialContent ? /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)(import_jsx_runtime39.Fragment, { children: [
6280
+ /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
6140
6281
  "div",
6141
6282
  {
6142
6283
  className: `${isFullScreen ? "contents" : "contents md:hidden"}`,
6143
- children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(DividerLine_default, {})
6284
+ children: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(DividerLine_default, {})
6144
6285
  }
6145
6286
  ),
6146
- /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("div", { className: `${isFullScreen ? "hidden" : "hidden md:block"}`, children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(VerticalDividerLine_default, {}) }),
6147
- /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("div", { className: `${isFullScreen ? "w-full" : "w-full md:flex-1"}`, children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
6287
+ /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("div", { className: `${isFullScreen ? "hidden" : "hidden md:block"}`, children: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(VerticalDividerLine_default, {}) }),
6288
+ /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("div", { className: `${isFullScreen ? "w-full" : "w-full md:flex-1"}`, children: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
6148
6289
  OpenEndedActivityMaterialContent_default,
6149
6290
  {
6150
6291
  answer,
6151
6292
  contentMap,
6293
+ checkCanAnswerQuestion: canAnswerQuestion,
6152
6294
  onChange: handleOpenEndedAnswerOnChange
6153
6295
  }
6154
6296
  ) })
@@ -6158,14 +6300,14 @@ var OpenEndedActivityContent = ({
6158
6300
  var OpenEndedActivityContent_default = OpenEndedActivityContent;
6159
6301
 
6160
6302
  // src/components/activities/material-content/OrderingActivityMaterialContent.tsx
6161
- var import_react25 = require("react");
6303
+ var import_react26 = require("react");
6162
6304
  var import_react_dnd7 = require("react-dnd");
6163
6305
  var import_react_katex8 = require("react-katex");
6164
6306
 
6165
6307
  // src/components/dnds/DraggableDroppableItem.tsx
6166
- var import_react24 = require("react");
6308
+ var import_react25 = require("react");
6167
6309
  var import_react_dnd6 = require("react-dnd");
6168
- var import_jsx_runtime39 = require("react/jsx-runtime");
6310
+ var import_jsx_runtime40 = require("react/jsx-runtime");
6169
6311
  var DraggableDroppableItem = ({
6170
6312
  item,
6171
6313
  type,
@@ -6175,7 +6317,7 @@ var DraggableDroppableItem = ({
6175
6317
  target,
6176
6318
  setTarget
6177
6319
  }) => {
6178
- const ref = (0, import_react24.useRef)(null);
6320
+ const ref = (0, import_react25.useRef)(null);
6179
6321
  const [, drop] = (0, import_react_dnd6.useDrop)({
6180
6322
  accept: type,
6181
6323
  hover() {
@@ -6202,19 +6344,19 @@ var DraggableDroppableItem = ({
6202
6344
  });
6203
6345
  const opacity = isDragging ? 0.4 : 1;
6204
6346
  drag(drop(ref));
6205
- return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
6347
+ return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
6206
6348
  "div",
6207
6349
  {
6208
6350
  className: `${isDragging ? "w-[0px] opacity-0" : "w-full opacity-100"} transition-all duration-500`,
6209
6351
  ref: dropRef,
6210
- children: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("div", { ref, className: "w-full", style: { opacity }, children: component })
6352
+ children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("div", { ref, className: "w-full", style: { opacity }, children: component })
6211
6353
  }
6212
6354
  );
6213
6355
  };
6214
6356
  var DraggableDroppableItem_default = DraggableDroppableItem;
6215
6357
 
6216
6358
  // src/components/activities/material-content/OrderingActivityMaterialContent.tsx
6217
- var import_jsx_runtime40 = require("react/jsx-runtime");
6359
+ var import_jsx_runtime41 = require("react/jsx-runtime");
6218
6360
  var OrderingActivityMaterialContent = ({
6219
6361
  uniqueValue,
6220
6362
  answer,
@@ -6225,10 +6367,10 @@ var OrderingActivityMaterialContent = ({
6225
6367
  isPreview,
6226
6368
  showCorrectAnswer
6227
6369
  }) => {
6228
- const [selectedTargetKey, setSelectedTargetKey] = (0, import_react25.useState)(null);
6229
- const [selectedKey, setSelectedKey] = (0, import_react25.useState)(null);
6370
+ const [selectedTargetKey, setSelectedTargetKey] = (0, import_react26.useState)(null);
6371
+ const [selectedKey, setSelectedKey] = (0, import_react26.useState)(null);
6230
6372
  const { screenSize } = useScreenSize_default();
6231
- const [view, setView] = (0, import_react25.useState)("PC");
6373
+ const [view, setView] = (0, import_react26.useState)("PC");
6232
6374
  const [{ isOver, canDrop }, drop] = (0, import_react_dnd7.useDrop)({
6233
6375
  accept: "ORDERING",
6234
6376
  drop: () => {
@@ -6238,7 +6380,7 @@ var OrderingActivityMaterialContent = ({
6238
6380
  canDrop: monitor.canDrop()
6239
6381
  })
6240
6382
  });
6241
- (0, import_react25.useEffect)(() => {
6383
+ (0, import_react26.useEffect)(() => {
6242
6384
  if (!screenSize) return;
6243
6385
  if (screenSize.width <= 768) {
6244
6386
  setView("TABLET");
@@ -6246,7 +6388,7 @@ var OrderingActivityMaterialContent = ({
6246
6388
  setView("PC");
6247
6389
  }
6248
6390
  }, [screenSize]);
6249
- (0, import_react25.useEffect)(() => {
6391
+ (0, import_react26.useEffect)(() => {
6250
6392
  if (!showCorrectAnswer) return;
6251
6393
  const answerMap2 = answer.data.find(
6252
6394
  (answerData) => answerData.type === "ORDERING"
@@ -6291,12 +6433,12 @@ var OrderingActivityMaterialContent = ({
6291
6433
  return 0;
6292
6434
  };
6293
6435
  const answerMap = retrieveAnswerMap();
6294
- return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("div", { className: "flex flex-row flex-wrap", children: Object.keys(answerMap).map((materialKey, index) => {
6436
+ return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("div", { className: "flex flex-row flex-wrap", children: Object.keys(answerMap).map((materialKey, index) => {
6295
6437
  const learnerAnswerState = checkAnswerState(
6296
6438
  answerMap[materialKey] + "",
6297
6439
  index + ""
6298
6440
  );
6299
- return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("div", { className: "w-full lg:w-1/2", children: /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(
6441
+ return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("div", { className: "w-full lg:w-1/2", children: /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(
6300
6442
  "div",
6301
6443
  {
6302
6444
  className: `flex flex-row items-center my-4 mx-2`,
@@ -6304,26 +6446,26 @@ var OrderingActivityMaterialContent = ({
6304
6446
  marginTop: view === "PC" ? calculateMarginTop(parseFloat(materialKey)) : 0
6305
6447
  },
6306
6448
  children: [
6307
- /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("div", { className: "mr-3", children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
6449
+ /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("div", { className: "mr-3", children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
6308
6450
  "div",
6309
6451
  {
6310
6452
  className: `min-h-catchup-activity-outer-box-item w-catchup-activity-box-item flex flex-col items-center justify-center cursor-pointer transition-all duration-300`,
6311
- children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
6453
+ children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
6312
6454
  "div",
6313
6455
  {
6314
6456
  className: `${selectedKey === materialKey ? "border-2 border-catchup-light-gray" : "border-2 border-catchup-blue"} flex flex-col items-center justify-center transition-all duration-300 rounded-catchup-full w-[50px] h-[50px]`,
6315
- children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("p", { className: "", children: parseFloat(materialKey) + 1 })
6457
+ children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("p", { className: "", children: parseFloat(materialKey) + 1 })
6316
6458
  }
6317
6459
  )
6318
6460
  }
6319
6461
  ) }),
6320
- /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
6462
+ /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
6321
6463
  DraggableDroppableItem_default,
6322
6464
  {
6323
6465
  item: { index: materialKey },
6324
6466
  type: "ORDERING",
6325
6467
  dropRef: drop,
6326
- component: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
6468
+ component: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
6327
6469
  "div",
6328
6470
  {
6329
6471
  className: `${canDrop ? selectedKey !== materialKey ? selectedTargetKey === materialKey ? "bg-catchup-light-blue rounded-catchup-xlarge" : "bg-catchup-light-blue rounded-catchup-xlarge opacity-40" : "" : ""} flex-1 min-h-catchup-activity-outer-box-item flex flex-col items-center justify-center border-2 rounded-catchup-xlarge cursor-pointer p-3 ${learnerAnswerState === "CORRECT" ? "border-catchup-green" : learnerAnswerState === "INCORRECT" ? "border-catchup-red" : "border-catchup-blue"}`,
@@ -6332,16 +6474,16 @@ var OrderingActivityMaterialContent = ({
6332
6474
  setSelectedKey(materialKey);
6333
6475
  }
6334
6476
  },
6335
- children: contentMap.type === "TEXT" ? /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("p", { className: "text-xl whitespace-pre-wrap", children: constructInputWithSpecialExpressionList(
6477
+ children: contentMap.type === "TEXT" ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("p", { className: "text-xl whitespace-pre-wrap", children: constructInputWithSpecialExpressionList(
6336
6478
  materialMap[answerMap[materialKey]]
6337
- ).map((inputPart, index2) => /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
6479
+ ).map((inputPart, index2) => /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
6338
6480
  "span",
6339
6481
  {
6340
6482
  className: `${inputPart.isBold ? "font-bold" : ""} ${inputPart.isUnderline ? "underline" : ""}`,
6341
- children: inputPart.isEquation ? /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("span", { className: "text-2xl", children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_react_katex8.InlineMath, { math: inputPart.value }) }) : inputPart.value
6483
+ children: inputPart.isEquation ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("span", { className: "text-2xl", children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_react_katex8.InlineMath, { math: inputPart.value }) }) : inputPart.value
6342
6484
  },
6343
6485
  index2
6344
- )) }) : /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
6486
+ )) }) : /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
6345
6487
  ShowMaterialMediaByContentType_default,
6346
6488
  {
6347
6489
  contentType: contentMap.type,
@@ -6373,7 +6515,7 @@ var OrderingActivityMaterialContent = ({
6373
6515
  var OrderingActivityMaterialContent_default = OrderingActivityMaterialContent;
6374
6516
 
6375
6517
  // src/components/activities/OrderingActivityContent.tsx
6376
- var import_jsx_runtime41 = require("react/jsx-runtime");
6518
+ var import_jsx_runtime42 = require("react/jsx-runtime");
6377
6519
  var OrderingActivityContent = ({
6378
6520
  answer,
6379
6521
  data,
@@ -6396,16 +6538,16 @@ var OrderingActivityContent = ({
6396
6538
  answerMap[secondaryKey] = prevValue;
6397
6539
  changeAnswer(answer2);
6398
6540
  };
6399
- return /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(import_jsx_runtime41.Fragment, { children: [
6400
- /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
6541
+ return /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(import_jsx_runtime42.Fragment, { children: [
6542
+ /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
6401
6543
  ActivityBodyContent_default,
6402
6544
  {
6403
6545
  bodyMap: orderingBodyMap,
6404
6546
  templateType: "ORDERING"
6405
6547
  }
6406
6548
  ),
6407
- /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(DividerLine_default, {}),
6408
- /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
6549
+ /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(DividerLine_default, {}),
6550
+ /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
6409
6551
  OrderingActivityMaterialContent_default,
6410
6552
  {
6411
6553
  uniqueValue: JSON.stringify(data.contentMap),
@@ -6423,9 +6565,9 @@ var OrderingActivityContent = ({
6423
6565
  var OrderingActivityContent_default = OrderingActivityContent;
6424
6566
 
6425
6567
  // src/components/activities/material-content/TrueFalseActivityMaterialContent.tsx
6426
- var import_react26 = require("react");
6568
+ var import_react27 = require("react");
6427
6569
  var import_react_katex9 = require("react-katex");
6428
- var import_jsx_runtime42 = require("react/jsx-runtime");
6570
+ var import_jsx_runtime43 = require("react/jsx-runtime");
6429
6571
  var TrueFalseActivityMaterialContent = ({
6430
6572
  uniqueValue,
6431
6573
  answer,
@@ -6437,8 +6579,8 @@ var TrueFalseActivityMaterialContent = ({
6437
6579
  showCorrectAnswer
6438
6580
  }) => {
6439
6581
  const { screenSize } = useScreenSize_default();
6440
- const [shuffleOptionList, setShuffleOptionList] = (0, import_react26.useState)([]);
6441
- (0, import_react26.useEffect)(() => {
6582
+ const [shuffleOptionList, setShuffleOptionList] = (0, import_react27.useState)([]);
6583
+ (0, import_react27.useEffect)(() => {
6442
6584
  const optionList = [];
6443
6585
  optionList.push(...materialMap.trueList);
6444
6586
  optionList.push(...materialMap.falseList);
@@ -6448,7 +6590,7 @@ var TrueFalseActivityMaterialContent = ({
6448
6590
  setShuffleOptionList(shuffleArray(optionList));
6449
6591
  }
6450
6592
  }, []);
6451
- (0, import_react26.useEffect)(() => {
6593
+ (0, import_react27.useEffect)(() => {
6452
6594
  if (!showCorrectAnswer) return;
6453
6595
  answer.data.find(
6454
6596
  (answerData) => answerData.type === "TRUE_FALSE"
@@ -6478,14 +6620,14 @@ var TrueFalseActivityMaterialContent = ({
6478
6620
  return "INCORRECT";
6479
6621
  };
6480
6622
  const answerMap = retrieveAnswerMap();
6481
- return /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)("div", { className: "", children: [
6482
- /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("div", { className: "hidden md:block", children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("span", { className: "font-semibold text-xl opacity-60", children: i18n_default.t("please_select_true_false_text") }) }),
6483
- /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("div", { className: "hidden md:contents", children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(DividerLine_default, {}) }),
6484
- /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)("div", { className: "flex flex-row justify-end items-center gap-x-2", children: [
6485
- /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("div", { className: "w-[50px]", children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("p", { className: "font-bold text-lg", children: i18n_default.t("true") }) }),
6486
- /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("div", { className: "w-[50px]", children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("p", { className: "font-bold text-lg", children: i18n_default.t("false") }) })
6623
+ return /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)("div", { className: "", children: [
6624
+ /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("div", { className: "hidden md:block", children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("span", { className: "font-semibold text-xl opacity-60", children: i18n_default.t("please_select_true_false_text") }) }),
6625
+ /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("div", { className: "hidden md:contents", children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(DividerLine_default, {}) }),
6626
+ /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)("div", { className: "flex flex-row justify-end items-center gap-x-2", children: [
6627
+ /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("div", { className: "w-[50px]", children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("p", { className: "font-bold text-lg", children: i18n_default.t("true") }) }),
6628
+ /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("div", { className: "w-[50px]", children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("p", { className: "font-bold text-lg", children: i18n_default.t("false") }) })
6487
6629
  ] }),
6488
- checkCanAnswerQuestion() ? /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("div", { className: `flex flex-row w-full justify-center flex-wrap`, children: shuffleOptionList.map((shuffleOption, index) => {
6630
+ checkCanAnswerQuestion() ? /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("div", { className: `flex flex-row w-full justify-center flex-wrap`, children: shuffleOptionList.map((shuffleOption, index) => {
6489
6631
  const correctAnswer = materialMap.trueList.find(
6490
6632
  (trueItem) => trueItem === shuffleOption
6491
6633
  ) !== void 0 ? "TRUE" : "FALSE";
@@ -6496,21 +6638,21 @@ var TrueFalseActivityMaterialContent = ({
6496
6638
  correctAnswer,
6497
6639
  learnerAnswer
6498
6640
  );
6499
- return /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(
6641
+ return /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)(
6500
6642
  "div",
6501
6643
  {
6502
6644
  className: `w-full flex flex-row items-center justify-center cursor-pointer my-2 ${learnerAnswerState === "CORRECT" ? "border-2 border-catchup-green rounded-catchup-xlarge p-2" : learnerAnswerState === "INCORRECT" ? "border-2 border-catchup-red rounded-catchup-xlarge p-2" : ""}`,
6503
6645
  children: [
6504
- /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("div", { className: "flex-1", children: contentMap.type === "TEXT" ? /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("p", { className: "text-xl p-2 whitespace-pre-wrap", children: constructInputWithSpecialExpressionList(
6646
+ /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("div", { className: "flex-1", children: contentMap.type === "TEXT" ? /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("p", { className: "text-xl p-2 whitespace-pre-wrap", children: constructInputWithSpecialExpressionList(
6505
6647
  shuffleOption
6506
- ).map((inputPart, index2) => /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
6648
+ ).map((inputPart, index2) => /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
6507
6649
  "span",
6508
6650
  {
6509
6651
  className: `${inputPart.isBold ? "font-bold" : ""} ${inputPart.isUnderline ? "underline" : ""}`,
6510
- children: inputPart.isEquation ? /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("span", { className: "text-2xl", children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_react_katex9.InlineMath, { math: inputPart.value }) }) : inputPart.value
6652
+ children: inputPart.isEquation ? /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("span", { className: "text-2xl", children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_react_katex9.InlineMath, { math: inputPart.value }) }) : inputPart.value
6511
6653
  },
6512
6654
  index2
6513
- )) }) : /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
6655
+ )) }) : /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
6514
6656
  ShowMaterialMediaByContentType_default,
6515
6657
  {
6516
6658
  contentType: contentMap.type,
@@ -6519,8 +6661,8 @@ var TrueFalseActivityMaterialContent = ({
6519
6661
  },
6520
6662
  `${uniqueValue}-${index}`
6521
6663
  ) }),
6522
- /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)("div", { className: "flex flex-row items-center gap-x-2", children: [
6523
- /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("div", { className: "w-[50px]", children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("div", { className: "flex flex-col items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
6664
+ /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)("div", { className: "flex flex-row items-center gap-x-2", children: [
6665
+ /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("div", { className: "w-[50px]", children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("div", { className: "flex flex-col items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
6524
6666
  BaseImage_default,
6525
6667
  {
6526
6668
  src: answerMap.trueList.includes(shuffleOption) ? "/icons/checkbox.webp" : "/icons/checkbox-empty.webp",
@@ -6531,7 +6673,7 @@ var TrueFalseActivityMaterialContent = ({
6531
6673
  }
6532
6674
  }
6533
6675
  ) }) }),
6534
- /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("div", { className: "w-[50px]", children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("div", { className: "flex flex-col items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
6676
+ /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("div", { className: "w-[50px]", children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("div", { className: "flex flex-col items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
6535
6677
  BaseImage_default,
6536
6678
  {
6537
6679
  src: answerMap.falseList.includes(shuffleOption) ? "/icons/checkbox.webp" : "/icons/checkbox-empty.webp",
@@ -6547,14 +6689,14 @@ var TrueFalseActivityMaterialContent = ({
6547
6689
  },
6548
6690
  index
6549
6691
  );
6550
- }) }) : /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(import_jsx_runtime42.Fragment, { children: [
6551
- answerMap.trueList.map((item) => /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)("div", { className: "flex flex-row items-center gap-x-2", children: [
6552
- /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("div", { className: "flex-1", children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("p", { children: item }) }),
6553
- /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("div", { className: "w-[50px]", children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("p", { className: "underline", children: i18n_default.t("true") }) })
6692
+ }) }) : /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)(import_jsx_runtime43.Fragment, { children: [
6693
+ answerMap.trueList.map((item) => /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)("div", { className: "flex flex-row items-center gap-x-2", children: [
6694
+ /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("div", { className: "flex-1", children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("p", { children: item }) }),
6695
+ /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("div", { className: "w-[50px]", children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("p", { className: "underline", children: i18n_default.t("true") }) })
6554
6696
  ] })),
6555
- answerMap.falseList.map((item) => /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)("div", { className: "flex flex-row items-center gap-x-2", children: [
6556
- /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("div", { className: "flex-1", children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("p", { children: item }) }),
6557
- /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("div", { className: "w-[50px]", children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("p", { className: "underline", children: i18n_default.t("false") }) })
6697
+ answerMap.falseList.map((item) => /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)("div", { className: "flex flex-row items-center gap-x-2", children: [
6698
+ /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("div", { className: "flex-1", children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("p", { children: item }) }),
6699
+ /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("div", { className: "w-[50px]", children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("p", { className: "underline", children: i18n_default.t("false") }) })
6558
6700
  ] }))
6559
6701
  ] })
6560
6702
  ] });
@@ -6562,7 +6704,7 @@ var TrueFalseActivityMaterialContent = ({
6562
6704
  var TrueFalseActivityMaterialContent_default = TrueFalseActivityMaterialContent;
6563
6705
 
6564
6706
  // src/components/activities/TrueFalseActivityContent.tsx
6565
- var import_jsx_runtime43 = require("react/jsx-runtime");
6707
+ var import_jsx_runtime44 = require("react/jsx-runtime");
6566
6708
  var TrueFalseActivityContent = ({
6567
6709
  answer,
6568
6710
  data,
@@ -6612,17 +6754,17 @@ var TrueFalseActivityContent = ({
6612
6754
  }
6613
6755
  changeAnswer(answer2);
6614
6756
  };
6615
- return /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)("div", { className: "flex flex-row flex-wrap", children: [
6616
- /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("div", { className: `${isFullScreen ? "w-full" : "w-full md:w-[40%]"}`, children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
6757
+ return /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)("div", { className: "flex flex-row flex-wrap", children: [
6758
+ /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("div", { className: `${isFullScreen ? "w-full" : "w-full md:w-[40%]"}`, children: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
6617
6759
  ActivityBodyContent_default,
6618
6760
  {
6619
6761
  bodyMap: trueFalseBodyMap,
6620
6762
  templateType: "GROUPING"
6621
6763
  }
6622
6764
  ) }),
6623
- /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("div", { className: `${isFullScreen ? "contents" : "contents md:hidden"}`, children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(DividerLine_default, {}) }),
6624
- /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("div", { className: `${isFullScreen ? "hidden" : "hidden md:block"}`, children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(VerticalDividerLine_default, {}) }),
6625
- /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("div", { className: `${isFullScreen ? "w-full" : "w-full md:flex-1"}`, children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
6765
+ /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("div", { className: `${isFullScreen ? "contents" : "contents md:hidden"}`, children: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(DividerLine_default, {}) }),
6766
+ /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("div", { className: `${isFullScreen ? "hidden" : "hidden md:block"}`, children: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(VerticalDividerLine_default, {}) }),
6767
+ /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("div", { className: `${isFullScreen ? "w-full" : "w-full md:flex-1"}`, children: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
6626
6768
  TrueFalseActivityMaterialContent_default,
6627
6769
  {
6628
6770
  uniqueValue: JSON.stringify(data.contentMap),
@@ -6641,7 +6783,7 @@ var TrueFalseActivityContent_default = TrueFalseActivityContent;
6641
6783
 
6642
6784
  // src/components/activities/solution-content/ActivitySolutionContent.tsx
6643
6785
  var import_react_katex10 = require("react-katex");
6644
- var import_jsx_runtime44 = require("react/jsx-runtime");
6786
+ var import_jsx_runtime45 = require("react/jsx-runtime");
6645
6787
  var ActivitySolutionContent = ({
6646
6788
  activityTemplateType,
6647
6789
  data
@@ -6671,8 +6813,8 @@ var ActivitySolutionContent = ({
6671
6813
  return null;
6672
6814
  }
6673
6815
  if (!solutionMap || Object.keys(solutionMap).length === 0) return null;
6674
- return /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("div", { className: "mx-2", children: /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)("div", { className: "p-4 border-catchup-blue border-2 rounded-catchup-xlarge", children: [
6675
- /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("p", { className: "text-xl font-bold text-center mb-3", children: i18n_default.t("solution") }),
6816
+ return /* @__PURE__ */ (0, import_jsx_runtime45.jsx)("div", { className: "mx-2", children: /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)("div", { className: "p-4 border-catchup-blue border-2 rounded-catchup-xlarge", children: [
6817
+ /* @__PURE__ */ (0, import_jsx_runtime45.jsx)("p", { className: "text-xl font-bold text-center mb-3", children: i18n_default.t("solution") }),
6676
6818
  Object.keys(solutionMap).map((key) => {
6677
6819
  let currentItem;
6678
6820
  try {
@@ -6682,12 +6824,12 @@ var ActivitySolutionContent = ({
6682
6824
  return null;
6683
6825
  }
6684
6826
  const { value } = currentItem;
6685
- return /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("div", { className: "my-3 text-xl", children: constructInputWithSpecialExpressionList(value).map(
6686
- (inputPart, partIndex) => /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
6827
+ return /* @__PURE__ */ (0, import_jsx_runtime45.jsx)("div", { className: "my-3 text-xl", children: constructInputWithSpecialExpressionList(value).map(
6828
+ (inputPart, partIndex) => /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(
6687
6829
  "span",
6688
6830
  {
6689
6831
  className: `${inputPart.isBold ? "font-bold" : ""} ${inputPart.isUnderline ? "underline" : ""}`,
6690
- children: inputPart.isEquation ? /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("span", { className: "text-2xl", children: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_react_katex10.InlineMath, { math: inputPart.value }) }) : inputPart.value
6832
+ children: inputPart.isEquation ? /* @__PURE__ */ (0, import_jsx_runtime45.jsx)("span", { className: "text-2xl", children: /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_react_katex10.InlineMath, { math: inputPart.value }) }) : inputPart.value
6691
6833
  },
6692
6834
  `${key}_part_${partIndex}`
6693
6835
  )
@@ -6699,7 +6841,7 @@ var ActivitySolutionContent_default = ActivitySolutionContent;
6699
6841
 
6700
6842
  // src/components/activities/evaluation-rubric-content/ActivityEvaluationRubricContent.tsx
6701
6843
  var import_react_katex11 = require("react-katex");
6702
- var import_jsx_runtime45 = require("react/jsx-runtime");
6844
+ var import_jsx_runtime46 = require("react/jsx-runtime");
6703
6845
  var ActivityEvaluationRubricContent = ({
6704
6846
  activityTemplateType,
6705
6847
  data
@@ -6728,21 +6870,21 @@ var ActivityEvaluationRubricContent = ({
6728
6870
  }
6729
6871
  if (!evaluationRubricMap || Object.keys(evaluationRubricMap).length === 0)
6730
6872
  return null;
6731
- return /* @__PURE__ */ (0, import_jsx_runtime45.jsx)("div", { className: "mx-2", children: /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)("div", { className: "p-4 border-catchup-gray-400 border-2 rounded-catchup-xlarge", children: [
6732
- /* @__PURE__ */ (0, import_jsx_runtime45.jsx)("p", { className: "text-xl font-bold text-center mb-3", children: i18n_default.t("evaluation_rubric") }),
6873
+ return /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("div", { className: "mx-2", children: /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)("div", { className: "p-4 border-catchup-gray-400 border-2 rounded-catchup-xlarge", children: [
6874
+ /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("p", { className: "text-xl font-bold text-center mb-3", children: i18n_default.t("evaluation_rubric") }),
6733
6875
  Object.keys(evaluationRubricMap).map((key, index) => {
6734
6876
  const currentItem = JSON.parse(evaluationRubricMap[key]);
6735
6877
  const { value } = currentItem;
6736
- return /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(
6878
+ return /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
6737
6879
  "p",
6738
6880
  {
6739
6881
  className: "my-1 text-xl whitespace-pre-wrap",
6740
6882
  children: constructInputWithSpecialExpressionList(value).map(
6741
- (inputPart, index2) => /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(
6883
+ (inputPart, index2) => /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
6742
6884
  "span",
6743
6885
  {
6744
6886
  className: `${inputPart.isBold ? "font-bold" : ""} ${inputPart.isUnderline ? "underline" : ""}`,
6745
- children: inputPart.isEquation ? /* @__PURE__ */ (0, import_jsx_runtime45.jsx)("span", { className: "text-2xl", children: /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_react_katex11.InlineMath, { math: inputPart.value }) }) : inputPart.value
6887
+ children: inputPart.isEquation ? /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("span", { className: "text-2xl", children: /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(import_react_katex11.InlineMath, { math: inputPart.value }) }) : inputPart.value
6746
6888
  },
6747
6889
  index2
6748
6890
  )
@@ -6756,31 +6898,31 @@ var ActivityEvaluationRubricContent = ({
6756
6898
  var ActivityEvaluationRubricContent_default = ActivityEvaluationRubricContent;
6757
6899
 
6758
6900
  // src/components/activities/ActivityPreviewByData.tsx
6759
- var import_react27 = require("react");
6901
+ var import_react28 = require("react");
6760
6902
 
6761
6903
  // src/components/boxes/SelectionBox.tsx
6762
- var import_jsx_runtime46 = require("react/jsx-runtime");
6904
+ var import_jsx_runtime47 = require("react/jsx-runtime");
6763
6905
  var SelectionBox = ({
6764
6906
  optionList,
6765
6907
  selectedId,
6766
6908
  handleSelectOnClick
6767
6909
  }) => {
6768
- return /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("div", { className: "flex flex-row items-center gap-x-4 gap-y-2 flex-wrap text-center", children: optionList.map((option, index) => /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
6910
+ return /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("div", { className: "flex flex-row items-center gap-x-4 gap-y-2 flex-wrap text-center", children: optionList.map((option, index) => /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
6769
6911
  "div",
6770
6912
  {
6771
6913
  className: `${option.id === selectedId ? "border-catchup-blue-400" : "border-catchup-gray-100 hover:border-catchup-blue-500"} border-2 rounded-catchup-xlarge py-3 px-8 cursor-pointer duration-300 transition-all`,
6772
6914
  onClick: () => {
6773
6915
  handleSelectOnClick(option.id);
6774
6916
  },
6775
- children: /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)(
6917
+ children: /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)(
6776
6918
  "div",
6777
6919
  {
6778
6920
  className: `flex flex-row items-center gap-x-1 ${option.id === selectedId ? "opacity-100" : "opacity-50"}`,
6779
6921
  children: [
6780
6922
  option.icon,
6781
- /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)("div", { className: "flex-1 flex flex-col items-center", children: [
6782
- /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("p", { children: option.text }),
6783
- option.subText ? /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)("p", { className: "text-md", children: [
6923
+ /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)("div", { className: "flex-1 flex flex-col items-center", children: [
6924
+ /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("p", { children: option.text }),
6925
+ option.subText ? /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)("p", { className: "text-md", children: [
6784
6926
  "(",
6785
6927
  option.subText,
6786
6928
  ")"
@@ -6796,7 +6938,7 @@ var SelectionBox = ({
6796
6938
  var SelectionBox_default = SelectionBox;
6797
6939
 
6798
6940
  // src/components/activities/ActivityPreviewByData.tsx
6799
- var import_jsx_runtime47 = require("react/jsx-runtime");
6941
+ var import_jsx_runtime48 = require("react/jsx-runtime");
6800
6942
  var ActivityPreviewByData = ({
6801
6943
  data,
6802
6944
  showType,
@@ -6808,14 +6950,14 @@ var ActivityPreviewByData = ({
6808
6950
  showDifficulty,
6809
6951
  isFullScreen
6810
6952
  }) => {
6811
- const [key, setKey] = (0, import_react27.useState)((/* @__PURE__ */ new Date()).getTime());
6812
- const [selectedType, setSelectedType] = (0, import_react27.useState)(null);
6813
- const [optionList, setOptionList] = (0, import_react27.useState)([]);
6814
- (0, import_react27.useEffect)(() => {
6953
+ const [key, setKey] = (0, import_react28.useState)((/* @__PURE__ */ new Date()).getTime());
6954
+ const [selectedType, setSelectedType] = (0, import_react28.useState)(null);
6955
+ const [optionList, setOptionList] = (0, import_react28.useState)([]);
6956
+ (0, import_react28.useEffect)(() => {
6815
6957
  if (!data) return;
6816
6958
  setKey((/* @__PURE__ */ new Date()).getTime());
6817
6959
  }, [data]);
6818
- (0, import_react27.useEffect)(() => {
6960
+ (0, import_react28.useEffect)(() => {
6819
6961
  if (!typeOptionList) return;
6820
6962
  if (typeOptionList.length === 0) return;
6821
6963
  let foundTypeOption;
@@ -6830,7 +6972,7 @@ var ActivityPreviewByData = ({
6830
6972
  setSelectedType(typeOptionList[0].id);
6831
6973
  }
6832
6974
  }, [typeOptionList, lockedType]);
6833
- (0, import_react27.useEffect)(() => {
6975
+ (0, import_react28.useEffect)(() => {
6834
6976
  if (!data) return;
6835
6977
  if (!typeOptionList) return;
6836
6978
  if (typeOptionList.length === 0) return;
@@ -6854,10 +6996,10 @@ var ActivityPreviewByData = ({
6854
6996
  }, [data, lockedType, typeOptionList, showDifficulty]);
6855
6997
  if (!data) return;
6856
6998
  const answer = constructAnswerBasedOnData(data);
6857
- return /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)("div", { children: [
6858
- showType ? /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)("div", { className: "mb-4", children: [
6859
- showDescription ? /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("div", { className: "my-2", children: /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("p", { className: "font-semibold text-lg", children: i18n_default.t("activity_template") }) }) : null,
6860
- /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
6999
+ return /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)("div", { children: [
7000
+ showType ? /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)("div", { className: "mb-4", children: [
7001
+ showDescription ? /* @__PURE__ */ (0, import_jsx_runtime48.jsx)("div", { className: "my-2", children: /* @__PURE__ */ (0, import_jsx_runtime48.jsx)("p", { className: "font-semibold text-lg", children: i18n_default.t("activity_template") }) }) : null,
7002
+ /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
6861
7003
  SelectionBox_default,
6862
7004
  {
6863
7005
  optionList,
@@ -6868,7 +7010,7 @@ var ActivityPreviewByData = ({
6868
7010
  }
6869
7011
  )
6870
7012
  ] }) : null,
6871
- selectedType ? /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("div", { className: "", children: selectedType === "ORDERING" && data["orderingBodyMap"] != null && data["orderingMaterialMap"] != null ? /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
7013
+ selectedType ? /* @__PURE__ */ (0, import_jsx_runtime48.jsx)("div", { className: "", children: selectedType === "ORDERING" && data["orderingBodyMap"] != null && data["orderingMaterialMap"] != null ? /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
6872
7014
  OrderingActivityContent_default,
6873
7015
  {
6874
7016
  answer,
@@ -6882,7 +7024,7 @@ var ActivityPreviewByData = ({
6882
7024
  showCorrectAnswer: true,
6883
7025
  isFullScreen
6884
7026
  }
6885
- ) : selectedType === "DROPDOWN" && data["dropdownBodyMap"] != null && data["dropdownMaterialMap"] != null ? /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
7027
+ ) : selectedType === "DROPDOWN" && data["dropdownBodyMap"] != null && data["dropdownMaterialMap"] != null ? /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
6886
7028
  DropdownActivityContent_default,
6887
7029
  {
6888
7030
  answer,
@@ -6896,7 +7038,7 @@ var ActivityPreviewByData = ({
6896
7038
  showCorrectAnswer: true,
6897
7039
  isFullScreen
6898
7040
  }
6899
- ) : selectedType === "MCSA" && data["MCSABodyMap"] != null && data["MCSAMaterialMap"] != null ? /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
7041
+ ) : selectedType === "MCSA" && data["MCSABodyMap"] != null && data["MCSAMaterialMap"] != null ? /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
6900
7042
  MCSAActivityContent_default,
6901
7043
  {
6902
7044
  answer,
@@ -6910,7 +7052,7 @@ var ActivityPreviewByData = ({
6910
7052
  showCorrectAnswer: true,
6911
7053
  isFullScreen
6912
7054
  }
6913
- ) : selectedType === "MCMA" && data["MCMABodyMap"] != null && data["MCMAMaterialMap"] != null ? /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
7055
+ ) : selectedType === "MCMA" && data["MCMABodyMap"] != null && data["MCMAMaterialMap"] != null ? /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
6914
7056
  MCMAActivityContent_default,
6915
7057
  {
6916
7058
  answer,
@@ -6924,7 +7066,7 @@ var ActivityPreviewByData = ({
6924
7066
  showCorrectAnswer: true,
6925
7067
  isFullScreen
6926
7068
  }
6927
- ) : selectedType === "MATCHING" && data["matchingBodyMap"] != null && data["matchingMaterialMap"] != null ? /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
7069
+ ) : selectedType === "MATCHING" && data["matchingBodyMap"] != null && data["matchingMaterialMap"] != null ? /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
6928
7070
  MatchingActivityContent_default,
6929
7071
  {
6930
7072
  answer,
@@ -6938,7 +7080,7 @@ var ActivityPreviewByData = ({
6938
7080
  showCorrectAnswer: true,
6939
7081
  isFullScreen
6940
7082
  }
6941
- ) : selectedType === "GROUPING" && data["groupingBodyMap"] != null && data["groupingMaterialMap"] != null ? /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
7083
+ ) : selectedType === "GROUPING" && data["groupingBodyMap"] != null && data["groupingMaterialMap"] != null ? /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
6942
7084
  GroupingActivityContent_default,
6943
7085
  {
6944
7086
  answer,
@@ -6952,7 +7094,7 @@ var ActivityPreviewByData = ({
6952
7094
  showCorrectAnswer: true,
6953
7095
  isFullScreen
6954
7096
  }
6955
- ) : selectedType === "FILL_IN_THE_BLANKS" && data["fillInTheBlanksBodyMap"] != null && data["fillInTheBlanksMaterialMap"] != null ? /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
7097
+ ) : selectedType === "FILL_IN_THE_BLANKS" && data["fillInTheBlanksBodyMap"] != null && data["fillInTheBlanksMaterialMap"] != null ? /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
6956
7098
  FillInTheBlanksActivityContent_default,
6957
7099
  {
6958
7100
  answer,
@@ -6966,17 +7108,18 @@ var ActivityPreviewByData = ({
6966
7108
  showCorrectAnswer: true,
6967
7109
  isFullScreen
6968
7110
  }
6969
- ) : selectedType === "OPEN_ENDED" && data["openEndedBodyMap"] != null ? /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
7111
+ ) : selectedType === "OPEN_ENDED" && data["openEndedBodyMap"] != null ? /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
6970
7112
  OpenEndedActivityContent_default,
6971
7113
  {
6972
7114
  answer,
7115
+ canAnswerQuestion: () => false,
6973
7116
  changeAnswer: () => {
6974
7117
  },
6975
7118
  showMaterialContent: true,
6976
7119
  data,
6977
7120
  isFullScreen
6978
7121
  }
6979
- ) : selectedType === "TRUE_FALSE" && data["trueFalseBodyMap"] != null && data["trueFalseMaterialMap"] != null ? /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
7122
+ ) : selectedType === "TRUE_FALSE" && data["trueFalseBodyMap"] != null && data["trueFalseMaterialMap"] != null ? /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
6980
7123
  TrueFalseActivityContent_default,
6981
7124
  {
6982
7125
  answer,
@@ -6991,14 +7134,14 @@ var ActivityPreviewByData = ({
6991
7134
  isFullScreen
6992
7135
  }
6993
7136
  ) : null }, selectedType) : null,
6994
- selectedType && showSolution ? /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("div", { className: "my-4", children: /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
7137
+ selectedType && showSolution ? /* @__PURE__ */ (0, import_jsx_runtime48.jsx)("div", { className: "my-4", children: /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
6995
7138
  ActivitySolutionContent_default,
6996
7139
  {
6997
7140
  activityTemplateType: selectedType,
6998
7141
  data
6999
7142
  }
7000
7143
  ) }) : null,
7001
- selectedType && showEvaluationRubric ? /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("div", { className: "my-4", children: /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
7144
+ selectedType && showEvaluationRubric ? /* @__PURE__ */ (0, import_jsx_runtime48.jsx)("div", { className: "my-4", children: /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
7002
7145
  ActivityEvaluationRubricContent_default,
7003
7146
  {
7004
7147
  activityTemplateType: selectedType,
@@ -7010,8 +7153,8 @@ var ActivityPreviewByData = ({
7010
7153
  var ActivityPreviewByData_default = ActivityPreviewByData;
7011
7154
 
7012
7155
  // src/components/activities/ActivityPreviewByAnswerData.tsx
7013
- var import_react28 = require("react");
7014
- var import_jsx_runtime48 = require("react/jsx-runtime");
7156
+ var import_react29 = require("react");
7157
+ var import_jsx_runtime49 = require("react/jsx-runtime");
7015
7158
  var ActivityPreviewByAnswerData = ({
7016
7159
  data,
7017
7160
  showType = true,
@@ -7025,11 +7168,11 @@ var ActivityPreviewByAnswerData = ({
7025
7168
  showCorrectAnswer = false
7026
7169
  }) => {
7027
7170
  var _a;
7028
- const [key, setKey] = (0, import_react28.useState)((/* @__PURE__ */ new Date()).getTime());
7029
- const [selectedType, setSelectedType] = (0, import_react28.useState)(null);
7030
- const [optionList, setOptionList] = (0, import_react28.useState)([]);
7031
- const [answer, setAnswer] = (0, import_react28.useState)({ data: [] });
7032
- (0, import_react28.useEffect)(() => {
7171
+ const [key, setKey] = (0, import_react29.useState)((/* @__PURE__ */ new Date()).getTime());
7172
+ const [selectedType, setSelectedType] = (0, import_react29.useState)(null);
7173
+ const [optionList, setOptionList] = (0, import_react29.useState)([]);
7174
+ const [answer, setAnswer] = (0, import_react29.useState)({ data: [] });
7175
+ (0, import_react29.useEffect)(() => {
7033
7176
  if (!data) return;
7034
7177
  setKey((/* @__PURE__ */ new Date()).getTime());
7035
7178
  }, [data]);
@@ -7042,7 +7185,7 @@ var ActivityPreviewByAnswerData = ({
7042
7185
  }
7043
7186
  return null;
7044
7187
  };
7045
- (0, import_react28.useEffect)(() => {
7188
+ (0, import_react29.useEffect)(() => {
7046
7189
  if (!data) return;
7047
7190
  const constructAnswerBasedOnData2 = () => {
7048
7191
  const newAnswer = { data: [] };
@@ -7081,7 +7224,7 @@ var ActivityPreviewByAnswerData = ({
7081
7224
  };
7082
7225
  constructAnswerBasedOnData2();
7083
7226
  }, [data, lockedType]);
7084
- (0, import_react28.useEffect)(() => {
7227
+ (0, import_react29.useEffect)(() => {
7085
7228
  if (!data || !answer.data.length) return;
7086
7229
  let currentTypeOptionList = typeOptionList || answer.data.map((item) => ({
7087
7230
  id: item.type,
@@ -7116,37 +7259,37 @@ var ActivityPreviewByAnswerData = ({
7116
7259
  };
7117
7260
  switch (selectedType) {
7118
7261
  case "ORDERING":
7119
- return data.orderingBodyMap && data.orderingMaterialMap ? /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(OrderingActivityContent_default, __spreadValues({}, commonProps)) : null;
7262
+ return data.orderingBodyMap && data.orderingMaterialMap ? /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(OrderingActivityContent_default, __spreadValues({}, commonProps)) : null;
7120
7263
  case "DROPDOWN":
7121
- return data.dropdownBodyMap && data.dropdownMaterialMap ? /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(DropdownActivityContent_default, __spreadValues({}, commonProps)) : null;
7264
+ return data.dropdownBodyMap && data.dropdownMaterialMap ? /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(DropdownActivityContent_default, __spreadValues({}, commonProps)) : null;
7122
7265
  case "MCSA":
7123
- return data.MCSABodyMap && data.MCSAMaterialMap ? /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(MCSAActivityContent_default, __spreadValues({}, commonProps)) : null;
7266
+ return data.MCSABodyMap && data.MCSAMaterialMap ? /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(MCSAActivityContent_default, __spreadValues({}, commonProps)) : null;
7124
7267
  case "MCMA":
7125
- return data.MCMABodyMap && data.MCMAMaterialMap ? /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(MCMAActivityContent_default, __spreadValues({}, commonProps)) : null;
7268
+ return data.MCMABodyMap && data.MCMAMaterialMap ? /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(MCMAActivityContent_default, __spreadValues({}, commonProps)) : null;
7126
7269
  case "MATCHING":
7127
- return data.matchingBodyMap && data.matchingMaterialMap ? /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(MatchingActivityContent_default, __spreadValues({}, commonProps)) : null;
7270
+ return data.matchingBodyMap && data.matchingMaterialMap ? /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(MatchingActivityContent_default, __spreadValues({}, commonProps)) : null;
7128
7271
  case "GROUPING":
7129
- return data.groupingBodyMap && data.groupingMaterialMap ? /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(GroupingActivityContent_default, __spreadValues({}, commonProps)) : null;
7272
+ return data.groupingBodyMap && data.groupingMaterialMap ? /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(GroupingActivityContent_default, __spreadValues({}, commonProps)) : null;
7130
7273
  case "FILL_IN_THE_BLANKS":
7131
- return data.fillInTheBlanksBodyMap && data.fillInTheBlanksMaterialMap ? /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(FillInTheBlanksActivityContent_default, __spreadValues({}, commonProps)) : null;
7274
+ return data.fillInTheBlanksBodyMap && data.fillInTheBlanksMaterialMap ? /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(FillInTheBlanksActivityContent_default, __spreadValues({}, commonProps)) : null;
7132
7275
  case "OPEN_ENDED":
7133
- return data.openEndedBodyMap ? /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
7276
+ return data.openEndedBodyMap ? /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
7134
7277
  OpenEndedActivityContent_default,
7135
7278
  __spreadProps(__spreadValues({}, commonProps), {
7136
7279
  showMaterialContent: true
7137
7280
  })
7138
7281
  ) : null;
7139
7282
  case "TRUE_FALSE":
7140
- return data.trueFalseBodyMap && data.trueFalseMaterialMap ? /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(TrueFalseActivityContent_default, __spreadValues({}, commonProps)) : null;
7283
+ return data.trueFalseBodyMap && data.trueFalseMaterialMap ? /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(TrueFalseActivityContent_default, __spreadValues({}, commonProps)) : null;
7141
7284
  default:
7142
7285
  return null;
7143
7286
  }
7144
7287
  };
7145
7288
  if (!data) return null;
7146
- return /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)("div", { children: [
7147
- showType && optionList.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)("div", { className: "mb-4", children: [
7148
- showDescription ? /* @__PURE__ */ (0, import_jsx_runtime48.jsx)("div", { className: "my-2", children: /* @__PURE__ */ (0, import_jsx_runtime48.jsx)("p", { className: "font-semibold text-lg", children: i18n_default.t("activity_template") }) }) : null,
7149
- /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
7289
+ return /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)("div", { children: [
7290
+ showType && optionList.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)("div", { className: "mb-4", children: [
7291
+ showDescription ? /* @__PURE__ */ (0, import_jsx_runtime49.jsx)("div", { className: "my-2", children: /* @__PURE__ */ (0, import_jsx_runtime49.jsx)("p", { className: "font-semibold text-lg", children: i18n_default.t("activity_template") }) }) : null,
7292
+ /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
7150
7293
  SelectionBox_default,
7151
7294
  {
7152
7295
  optionList,
@@ -7157,19 +7300,19 @@ var ActivityPreviewByAnswerData = ({
7157
7300
  }
7158
7301
  )
7159
7302
  ] }) : null,
7160
- /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(DividerLine_default, {}),
7161
- /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)("div", { className: "flex flex-col my-2 w-full p-5", children: [
7162
- ((_a = answer == null ? void 0 : answer.data[0]) == null ? void 0 : _a.isEmpty) ? /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(ActivityEmptyContent_default, {}) : null,
7163
- selectedType ? /* @__PURE__ */ (0, import_jsx_runtime48.jsx)("div", { children: RenderSelectedActivityContent() }, selectedType) : null
7303
+ /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(DividerLine_default, {}),
7304
+ /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)("div", { className: "flex flex-col my-2 w-full p-5", children: [
7305
+ ((_a = answer == null ? void 0 : answer.data[0]) == null ? void 0 : _a.isEmpty) ? /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(ActivityEmptyContent_default, {}) : null,
7306
+ selectedType ? /* @__PURE__ */ (0, import_jsx_runtime49.jsx)("div", { children: RenderSelectedActivityContent() }, selectedType) : null
7164
7307
  ] }),
7165
- selectedType && showSolution ? /* @__PURE__ */ (0, import_jsx_runtime48.jsx)("div", { className: "my-4", children: /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
7308
+ selectedType && showSolution ? /* @__PURE__ */ (0, import_jsx_runtime49.jsx)("div", { className: "my-4", children: /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
7166
7309
  ActivitySolutionContent_default,
7167
7310
  {
7168
7311
  activityTemplateType: selectedType,
7169
7312
  data
7170
7313
  }
7171
7314
  ) }) : null,
7172
- selectedType && showEvaluationRubric ? /* @__PURE__ */ (0, import_jsx_runtime48.jsx)("div", { className: "my-4", children: /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
7315
+ selectedType && showEvaluationRubric ? /* @__PURE__ */ (0, import_jsx_runtime49.jsx)("div", { className: "my-4", children: /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
7173
7316
  ActivityEvaluationRubricContent_default,
7174
7317
  {
7175
7318
  activityTemplateType: selectedType,
@@ -7181,9 +7324,9 @@ var ActivityPreviewByAnswerData = ({
7181
7324
  var ActivityPreviewByAnswerData_default = ActivityPreviewByAnswerData;
7182
7325
 
7183
7326
  // src/components/dividers/BlueVerticalDividerLine.tsx
7184
- var import_jsx_runtime49 = require("react/jsx-runtime");
7327
+ var import_jsx_runtime50 = require("react/jsx-runtime");
7185
7328
  var BlueVerticalDividerLine = ({ opacity }) => {
7186
- return /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
7329
+ return /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
7187
7330
  "div",
7188
7331
  {
7189
7332
  className: `w-[2px] h-[40px] my-4 bg-catchup-blue ${opacity === "medium" ? "opacity-50" : ""}`
@@ -7193,7 +7336,7 @@ var BlueVerticalDividerLine = ({ opacity }) => {
7193
7336
  var BlueVerticalDividerLine_default = BlueVerticalDividerLine;
7194
7337
 
7195
7338
  // src/components/groups/LeftTextRightInputGroup.tsx
7196
- var import_jsx_runtime50 = require("react/jsx-runtime");
7339
+ var import_jsx_runtime51 = require("react/jsx-runtime");
7197
7340
  var LeftTextRightInputGroup = ({
7198
7341
  type,
7199
7342
  title,
@@ -7203,9 +7346,9 @@ var LeftTextRightInputGroup = ({
7203
7346
  disabled,
7204
7347
  errorText
7205
7348
  }) => {
7206
- return /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { className: "w-full flex flex-row mx-2", children: [
7207
- /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("div", { className: "w-catchup-input-group-title py-5", children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("p", { children: title }) }),
7208
- /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("div", { className: "flex-1", children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
7349
+ return /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)("div", { className: "w-full flex flex-row mx-2", children: [
7350
+ /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("div", { className: "w-catchup-input-group-title py-5", children: /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("p", { children: title }) }),
7351
+ /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("div", { className: "flex-1", children: /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
7209
7352
  InputGroup_default,
7210
7353
  {
7211
7354
  type,
@@ -7221,14 +7364,14 @@ var LeftTextRightInputGroup = ({
7221
7364
  var LeftTextRightInputGroup_default = LeftTextRightInputGroup;
7222
7365
 
7223
7366
  // src/components/boxes/SelectionCheckbox.tsx
7224
- var import_jsx_runtime51 = require("react/jsx-runtime");
7367
+ var import_jsx_runtime52 = require("react/jsx-runtime");
7225
7368
  var SelectionCheckbox = ({
7226
7369
  optionList,
7227
7370
  selectedIdList,
7228
7371
  handleSelectOnClick,
7229
7372
  handleRemoveOnClick
7230
7373
  }) => {
7231
- return /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("div", { className: "flex flex-row items-center gap-x-4 gap-y-2 flex-wrap text-center", children: optionList.map((option, index) => /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
7374
+ return /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("div", { className: "flex flex-row items-center gap-x-4 gap-y-2 flex-wrap text-center", children: optionList.map((option, index) => /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
7232
7375
  "div",
7233
7376
  {
7234
7377
  className: `${selectedIdList.findIndex(
@@ -7243,14 +7386,14 @@ var SelectionCheckbox = ({
7243
7386
  handleRemoveOnClick(option.id);
7244
7387
  }
7245
7388
  },
7246
- children: /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(
7389
+ children: /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)(
7247
7390
  "div",
7248
7391
  {
7249
7392
  className: `flex flex-row items-center gap-x-1 ${selectedIdList.findIndex(
7250
7393
  (selectedId) => selectedId === option.id
7251
7394
  ) > -1 ? "opacity-100" : "opacity-50"}`,
7252
7395
  children: [
7253
- /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
7396
+ /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
7254
7397
  BaseImage_default,
7255
7398
  {
7256
7399
  src: selectedIdList.findIndex(
@@ -7260,7 +7403,7 @@ var SelectionCheckbox = ({
7260
7403
  size: "small"
7261
7404
  }
7262
7405
  ),
7263
- /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("div", { className: "flex-1", children: /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("p", { children: option.text }) })
7406
+ /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("div", { className: "flex-1", children: /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("p", { children: option.text }) })
7264
7407
  ]
7265
7408
  }
7266
7409
  )
@@ -7271,7 +7414,7 @@ var SelectionCheckbox = ({
7271
7414
  var SelectionCheckbox_default = SelectionCheckbox;
7272
7415
 
7273
7416
  // src/components/tabs/SelectionTab.tsx
7274
- var import_jsx_runtime52 = require("react/jsx-runtime");
7417
+ var import_jsx_runtime53 = require("react/jsx-runtime");
7275
7418
  var SelectionTab = ({
7276
7419
  optionList,
7277
7420
  selectedId,
@@ -7281,7 +7424,7 @@ var SelectionTab = ({
7281
7424
  textColor,
7282
7425
  borderColor
7283
7426
  }) => {
7284
- return /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("div", { className: "flex flex-row items-center gap-x-4 gap-y-2 flex-wrap mb-2 text-center", children: optionList.map((option, index) => /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)(
7427
+ return /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("div", { className: "flex flex-row items-center gap-x-4 gap-y-2 flex-wrap mb-2 text-center", children: optionList.map((option, index) => /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(
7285
7428
  "div",
7286
7429
  {
7287
7430
  className: `${selectedId === option.id ? selectedTextColor ? selectedTextColor : "text-catchup-blue-500" : textColor ? textColor : "text-catchup-gray-300"} ${selectedId === option.id ? selectedBorderColor ? selectedBorderColor : "border-catchup-blue-500" : borderColor ? borderColor : "border-catchup-gray-50"} border-b-2 transition-all duration-300 p-3 cursor-pointer`,
@@ -7289,8 +7432,8 @@ var SelectionTab = ({
7289
7432
  handleSelectOnClick(option.id);
7290
7433
  },
7291
7434
  children: [
7292
- /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("p", { className: "text-lg", children: option.title }),
7293
- option.subTitle ? /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("p", { className: "text-md", children: option.subTitle }) : null
7435
+ /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("p", { className: "text-lg", children: option.title }),
7436
+ option.subTitle ? /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("p", { className: "text-md", children: option.subTitle }) : null
7294
7437
  ]
7295
7438
  },
7296
7439
  index
@@ -7299,20 +7442,20 @@ var SelectionTab = ({
7299
7442
  var SelectionTab_default = SelectionTab;
7300
7443
 
7301
7444
  // src/components/tabs/SelectionTabFill.tsx
7302
- var import_jsx_runtime53 = require("react/jsx-runtime");
7445
+ var import_jsx_runtime54 = require("react/jsx-runtime");
7303
7446
  var SelectionTabFill = ({
7304
7447
  optionList,
7305
7448
  selectedId,
7306
7449
  handleSelectOnClick
7307
7450
  }) => {
7308
- return /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("div", { className: "w-full flex flex-row bg-catchup-gray-50 gap-x-2 rounded-catchup-medium px-4 py-2 justify-center text-center", children: optionList.map((option, index) => /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
7451
+ return /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("div", { className: "w-full flex flex-row bg-catchup-gray-50 gap-x-2 rounded-catchup-medium px-4 py-2 justify-center text-center", children: optionList.map((option, index) => /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
7309
7452
  "div",
7310
7453
  {
7311
7454
  className: "cursor-pointer",
7312
7455
  onClick: () => {
7313
7456
  handleSelectOnClick(option.id);
7314
7457
  },
7315
- children: /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
7458
+ children: /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
7316
7459
  "p",
7317
7460
  {
7318
7461
  className: `${selectedId === option.id ? "text-catchup-white bg-catchup-blue-500" : "text-catchup-gray-300"} transition-all duration-300 rounded-catchup-medium px-2 py-1`,
@@ -7326,57 +7469,57 @@ var SelectionTabFill = ({
7326
7469
  var SelectionTabFill_default = SelectionTabFill;
7327
7470
 
7328
7471
  // src/components/labels/ActivityTemplateLabel.tsx
7329
- var import_jsx_runtime54 = require("react/jsx-runtime");
7472
+ var import_jsx_runtime55 = require("react/jsx-runtime");
7330
7473
  var ActivityTemplateLabel = ({
7331
7474
  title,
7332
7475
  font
7333
7476
  }) => {
7334
- return /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("div", { className: "px-3 py-1 gap-x-3 border border-grade-label-border bg-grade-label text-grade-label-text rounded-catchup-3xlarge", children: /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("div", { className: "flex flex-row items-center gap-x-2", children: [
7335
- /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(BaseImage_default, { src: "/icons/activity.webp", alt: "label", size: "xsmall" }),
7336
- /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("p", { className: font ? font : "text-sm", children: title })
7477
+ return /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("div", { className: "px-3 py-1 gap-x-3 border border-grade-label-border bg-grade-label text-grade-label-text rounded-catchup-3xlarge", children: /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)("div", { className: "flex flex-row items-center gap-x-2", children: [
7478
+ /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(BaseImage_default, { src: "/icons/activity.webp", alt: "label", size: "xsmall" }),
7479
+ /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("p", { className: font ? font : "text-sm", children: title })
7337
7480
  ] }) });
7338
7481
  };
7339
7482
  var ActivityTemplateLabel_default = ActivityTemplateLabel;
7340
7483
 
7341
7484
  // src/components/labels/BrandLabel.tsx
7342
- var import_jsx_runtime55 = require("react/jsx-runtime");
7485
+ var import_jsx_runtime56 = require("react/jsx-runtime");
7343
7486
  var BrandLabel = ({ title, icon, font }) => {
7344
- return /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("div", { className: "px-3 py-1 gap-x-3 border border-brand-label-border bg-brand-label text-brand-label-text rounded-catchup-3xlarge", children: /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)("div", { className: "flex flex-row items-center gap-x-2", children: [
7345
- icon ? icon : /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(BaseImage_default, { src: "/icons/brand-label.webp", alt: "label", size: "xsmall" }),
7346
- /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("p", { className: font ? font : "text-sm", children: title })
7487
+ return /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { className: "px-3 py-1 gap-x-3 border border-brand-label-border bg-brand-label text-brand-label-text rounded-catchup-3xlarge", children: /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("div", { className: "flex flex-row items-center gap-x-2", children: [
7488
+ icon ? icon : /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(BaseImage_default, { src: "/icons/brand-label.webp", alt: "label", size: "xsmall" }),
7489
+ /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("p", { className: font ? font : "text-sm", children: title })
7347
7490
  ] }) });
7348
7491
  };
7349
7492
  var BrandLabel_default = BrandLabel;
7350
7493
 
7351
7494
  // src/components/labels/CoterieLabel.tsx
7352
- var import_jsx_runtime56 = require("react/jsx-runtime");
7495
+ var import_jsx_runtime57 = require("react/jsx-runtime");
7353
7496
  var CoterieLabel = ({ title, font }) => {
7354
- return /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { className: "px-3 py-1 gap-x-3 border border-brand-label-border bg-brand-label text-brand-label-text rounded-catchup-3xlarge", children: /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("p", { className: font ? font : "text-sm", children: title }) });
7497
+ return /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("div", { className: "px-3 py-1 gap-x-3 border border-brand-label-border bg-brand-label text-brand-label-text rounded-catchup-3xlarge", children: /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("p", { className: font ? font : "text-sm", children: title }) });
7355
7498
  };
7356
7499
  var CoterieLabel_default = CoterieLabel;
7357
7500
 
7358
7501
  // src/components/labels/GradeLabel.tsx
7359
- var import_jsx_runtime57 = require("react/jsx-runtime");
7502
+ var import_jsx_runtime58 = require("react/jsx-runtime");
7360
7503
  var GradeLabel = ({ title, font }) => {
7361
- return /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("div", { className: "px-3 py-1 gap-x-3 border border-grade-label-border bg-grade-label text-grade-label-text rounded-catchup-3xlarge", children: /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("p", { className: font ? font : "text-sm", children: title }) });
7504
+ return /* @__PURE__ */ (0, import_jsx_runtime58.jsx)("div", { className: "px-3 py-1 gap-x-3 border border-grade-label-border bg-grade-label text-grade-label-text rounded-catchup-3xlarge", children: /* @__PURE__ */ (0, import_jsx_runtime58.jsx)("p", { className: font ? font : "text-sm", children: title }) });
7362
7505
  };
7363
7506
  var GradeLabel_default = GradeLabel;
7364
7507
 
7365
7508
  // src/components/labels/OutcomeLabel.tsx
7366
- var import_jsx_runtime58 = require("react/jsx-runtime");
7509
+ var import_jsx_runtime59 = require("react/jsx-runtime");
7367
7510
  var OutcomeLabel = ({ title, font }) => {
7368
- return /* @__PURE__ */ (0, import_jsx_runtime58.jsx)("div", { className: "px-3 py-1 gap-x-3 border border-brand-label-border bg-brand-label text-brand-label-text rounded-catchup-3xlarge", children: /* @__PURE__ */ (0, import_jsx_runtime58.jsxs)("div", { className: "flex flex-row items-center gap-x-2", children: [
7369
- /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(BaseImage_default, { src: "/icons/category.webp", alt: "label", size: "xsmall" }),
7370
- /* @__PURE__ */ (0, import_jsx_runtime58.jsx)("p", { className: font ? font : "text-sm", children: title })
7511
+ return /* @__PURE__ */ (0, import_jsx_runtime59.jsx)("div", { className: "px-3 py-1 gap-x-3 border border-brand-label-border bg-brand-label text-brand-label-text rounded-catchup-3xlarge", children: /* @__PURE__ */ (0, import_jsx_runtime59.jsxs)("div", { className: "flex flex-row items-center gap-x-2", children: [
7512
+ /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(BaseImage_default, { src: "/icons/category.webp", alt: "label", size: "xsmall" }),
7513
+ /* @__PURE__ */ (0, import_jsx_runtime59.jsx)("p", { className: font ? font : "text-sm", children: title })
7371
7514
  ] }) });
7372
7515
  };
7373
7516
  var OutcomeLabel_default = OutcomeLabel;
7374
7517
 
7375
7518
  // src/components/labels/PersonalLabel.tsx
7376
- var import_jsx_runtime59 = require("react/jsx-runtime");
7519
+ var import_jsx_runtime60 = require("react/jsx-runtime");
7377
7520
  var PersonalLabel = ({ title, icon, font }) => {
7378
- return /* @__PURE__ */ (0, import_jsx_runtime59.jsx)("div", { className: "px-3 py-1 gap-x-3 border border-personal-label-border bg-personal-label text-personal-label-text rounded-catchup-3xlarge", children: /* @__PURE__ */ (0, import_jsx_runtime59.jsxs)("div", { className: "flex flex-row items-center gap-x-2", children: [
7379
- icon ? icon : /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(
7521
+ return /* @__PURE__ */ (0, import_jsx_runtime60.jsx)("div", { className: "px-3 py-1 gap-x-3 border border-personal-label-border bg-personal-label text-personal-label-text rounded-catchup-3xlarge", children: /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)("div", { className: "flex flex-row items-center gap-x-2", children: [
7522
+ icon ? icon : /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(
7380
7523
  BaseImage_default,
7381
7524
  {
7382
7525
  src: "/icons/personal-label.webp",
@@ -7384,16 +7527,16 @@ var PersonalLabel = ({ title, icon, font }) => {
7384
7527
  size: "xsmall"
7385
7528
  }
7386
7529
  ),
7387
- /* @__PURE__ */ (0, import_jsx_runtime59.jsx)("p", { className: font ? font : "text-sm", children: title })
7530
+ /* @__PURE__ */ (0, import_jsx_runtime60.jsx)("p", { className: font ? font : "text-sm", children: title })
7388
7531
  ] }) });
7389
7532
  };
7390
7533
  var PersonalLabel_default = PersonalLabel;
7391
7534
 
7392
7535
  // src/components/labels/PublishingHouseLabel.tsx
7393
- var import_jsx_runtime60 = require("react/jsx-runtime");
7536
+ var import_jsx_runtime61 = require("react/jsx-runtime");
7394
7537
  var PublishingHouseLabel = ({ title, icon, font }) => {
7395
- return /* @__PURE__ */ (0, import_jsx_runtime60.jsx)("div", { className: "px-3 py-1 gap-x-3 border border-publishing-house-label-border bg-publishing-house-label text-publishing-house-label-text rounded-catchup-3xlarge", children: /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)("div", { className: "flex flex-row items-center gap-x-2", children: [
7396
- icon ? icon : /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(
7538
+ return /* @__PURE__ */ (0, import_jsx_runtime61.jsx)("div", { className: "px-3 py-1 gap-x-3 border border-publishing-house-label-border bg-publishing-house-label text-publishing-house-label-text rounded-catchup-3xlarge", children: /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)("div", { className: "flex flex-row items-center gap-x-2", children: [
7539
+ icon ? icon : /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
7397
7540
  BaseImage_default,
7398
7541
  {
7399
7542
  src: "/icons/publishing-house-label.webp",
@@ -7401,79 +7544,79 @@ var PublishingHouseLabel = ({ title, icon, font }) => {
7401
7544
  size: "xsmall"
7402
7545
  }
7403
7546
  ),
7404
- /* @__PURE__ */ (0, import_jsx_runtime60.jsx)("p", { className: font ? font : "text-sm", children: title })
7547
+ /* @__PURE__ */ (0, import_jsx_runtime61.jsx)("p", { className: font ? font : "text-sm", children: title })
7405
7548
  ] }) });
7406
7549
  };
7407
7550
  var PublishingHouseLabel_default = PublishingHouseLabel;
7408
7551
 
7409
7552
  // src/components/labels/ActivityLabel.tsx
7410
- var import_jsx_runtime61 = require("react/jsx-runtime");
7553
+ var import_jsx_runtime62 = require("react/jsx-runtime");
7411
7554
  var ActivityLabel = ({ title, font }) => {
7412
- return /* @__PURE__ */ (0, import_jsx_runtime61.jsx)("div", { className: "px-3 py-1 gap-x-3 border border-publishing-house-label-border bg-publishing-house-label text-publishing-house-label-text rounded-catchup-3xlarge", children: /* @__PURE__ */ (0, import_jsx_runtime61.jsx)("p", { className: font ? font : "text-sm", children: title }) });
7555
+ return /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("div", { className: "px-3 py-1 gap-x-3 border border-publishing-house-label-border bg-publishing-house-label text-publishing-house-label-text rounded-catchup-3xlarge", children: /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("p", { className: font ? font : "text-sm", children: title }) });
7413
7556
  };
7414
7557
  var ActivityLabel_default = ActivityLabel;
7415
7558
 
7416
7559
  // src/components/infos/InfoWithText.tsx
7417
- var import_jsx_runtime62 = require("react/jsx-runtime");
7560
+ var import_jsx_runtime63 = require("react/jsx-runtime");
7418
7561
  var InfoWithText = (props) => {
7419
7562
  const { value } = props;
7420
- return /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)("div", { className: "w-full flex flex-row items-center gap-x-2 my-2", children: [
7421
- /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(BaseImage_default, { src: "/icons/info.webp", alt: "info", size: "small" }),
7422
- /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("div", { className: "flex-1", children: /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("p", { className: "", children: value }) })
7563
+ return /* @__PURE__ */ (0, import_jsx_runtime63.jsxs)("div", { className: "w-full flex flex-row items-center gap-x-2 my-2", children: [
7564
+ /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(BaseImage_default, { src: "/icons/info.webp", alt: "info", size: "small" }),
7565
+ /* @__PURE__ */ (0, import_jsx_runtime63.jsx)("div", { className: "flex-1", children: /* @__PURE__ */ (0, import_jsx_runtime63.jsx)("p", { className: "", children: value }) })
7423
7566
  ] });
7424
7567
  };
7425
7568
  var InfoWithText_default = InfoWithText;
7426
7569
 
7427
7570
  // src/components/texts/InputWithSpecialExpression.tsx
7428
7571
  var import_react_katex12 = require("react-katex");
7429
- var import_jsx_runtime63 = require("react/jsx-runtime");
7572
+ var import_jsx_runtime64 = require("react/jsx-runtime");
7430
7573
  var InputWithSpecialExpression = ({
7431
7574
  value,
7432
7575
  showSpecialOnly
7433
7576
  }) => {
7434
7577
  const inputWithSpecialExpressionList = constructInputWithSpecialExpressionList(value);
7435
- return showSpecialOnly ? inputWithSpecialExpressionList.length > 1 ? /* @__PURE__ */ (0, import_jsx_runtime63.jsx)("div", { className: "m-2", children: /* @__PURE__ */ (0, import_jsx_runtime63.jsx)("span", { className: "whitespace-pre-wrap", children: inputWithSpecialExpressionList.map((inputPart, index) => /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
7578
+ return showSpecialOnly ? inputWithSpecialExpressionList.length > 1 ? /* @__PURE__ */ (0, import_jsx_runtime64.jsx)("div", { className: "m-2", children: /* @__PURE__ */ (0, import_jsx_runtime64.jsx)("span", { className: "whitespace-pre-wrap", children: inputWithSpecialExpressionList.map((inputPart, index) => /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(
7436
7579
  "span",
7437
7580
  {
7438
7581
  className: `${inputPart.isBold ? "font-semibold" : ""} ${inputPart.isUnderline ? "underline" : ""}`,
7439
- children: inputPart.isEquation ? /* @__PURE__ */ (0, import_jsx_runtime63.jsx)("span", { className: "text-lg", children: /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(import_react_katex12.InlineMath, { math: inputPart.value }, index) }) : inputPart.value
7582
+ children: inputPart.isEquation ? /* @__PURE__ */ (0, import_jsx_runtime64.jsx)("span", { className: "text-lg", children: /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(import_react_katex12.InlineMath, { math: inputPart.value }, index) }) : inputPart.value
7440
7583
  }
7441
- )) }) }) : null : /* @__PURE__ */ (0, import_jsx_runtime63.jsx)("div", { className: "m-2", children: /* @__PURE__ */ (0, import_jsx_runtime63.jsx)("span", { className: "whitespace-pre-wrap", children: inputWithSpecialExpressionList.map((inputPart, index) => /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
7584
+ )) }) }) : null : /* @__PURE__ */ (0, import_jsx_runtime64.jsx)("div", { className: "m-2", children: /* @__PURE__ */ (0, import_jsx_runtime64.jsx)("span", { className: "whitespace-pre-wrap", children: inputWithSpecialExpressionList.map((inputPart, index) => /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(
7442
7585
  "span",
7443
7586
  {
7444
7587
  className: `${inputPart.isBold ? "font-semibold" : ""} ${inputPart.isUnderline ? "underline" : ""}`,
7445
- children: inputPart.isEquation ? /* @__PURE__ */ (0, import_jsx_runtime63.jsx)("span", { className: "text-lg", children: /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(import_react_katex12.InlineMath, { math: inputPart.value }, index) }) : inputPart.value
7588
+ children: inputPart.isEquation ? /* @__PURE__ */ (0, import_jsx_runtime64.jsx)("span", { className: "text-lg", children: /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(import_react_katex12.InlineMath, { math: inputPart.value }, index) }) : inputPart.value
7446
7589
  }
7447
7590
  )) }) });
7448
7591
  };
7449
7592
  var InputWithSpecialExpression_default = InputWithSpecialExpression;
7450
7593
 
7451
7594
  // src/components/titles/BaseTitle.tsx
7452
- var import_jsx_runtime64 = require("react/jsx-runtime");
7595
+ var import_jsx_runtime65 = require("react/jsx-runtime");
7453
7596
  var BaseTitle = ({
7454
7597
  title,
7455
7598
  totalItemCount,
7456
7599
  itemName,
7457
7600
  description
7458
7601
  }) => {
7459
- return /* @__PURE__ */ (0, import_jsx_runtime64.jsxs)("div", { className: "flex flex-col gap-y-2", children: [
7460
- /* @__PURE__ */ (0, import_jsx_runtime64.jsxs)("p", { className: "text-2xl font-medium", children: [
7602
+ return /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)("div", { className: "flex flex-col gap-y-2", children: [
7603
+ /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)("p", { className: "text-2xl font-medium", children: [
7461
7604
  title,
7462
- totalItemCount && itemName ? /* @__PURE__ */ (0, import_jsx_runtime64.jsxs)("span", { className: "p-2 text-base text-catchup-blue-600 border border-catchup-blue-300 rounded-catchup-3xlarge mx-2 bg-catchup-blue-100", children: [
7605
+ totalItemCount && itemName ? /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)("span", { className: "p-2 text-base text-catchup-blue-600 border border-catchup-blue-300 rounded-catchup-3xlarge mx-2 bg-catchup-blue-100", children: [
7463
7606
  totalItemCount,
7464
7607
  " ",
7465
7608
  itemName
7466
7609
  ] }) : null
7467
7610
  ] }),
7468
- description ? /* @__PURE__ */ (0, import_jsx_runtime64.jsx)("p", { className: "", children: description }) : null
7611
+ description ? /* @__PURE__ */ (0, import_jsx_runtime65.jsx)("p", { className: "", children: description }) : null
7469
7612
  ] });
7470
7613
  };
7471
7614
  var BaseTitle_default = BaseTitle;
7472
7615
 
7473
7616
  // src/components/titles/SubTitle.tsx
7474
- var import_jsx_runtime65 = require("react/jsx-runtime");
7617
+ var import_jsx_runtime66 = require("react/jsx-runtime");
7475
7618
  var SubTitle = ({ title }) => {
7476
- return /* @__PURE__ */ (0, import_jsx_runtime65.jsx)("p", { className: "text-xl font-medium text-catchup-darker-blue", children: title });
7619
+ return /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("p", { className: "text-xl font-medium text-catchup-darker-blue", children: title });
7477
7620
  };
7478
7621
  var SubTitle_default = SubTitle;
7479
7622
 
@@ -9876,33 +10019,6 @@ var constructCombinedOutcomeActivityScoreMapFromCombinedReport = (combinedCatchx
9876
10019
  return combinedOutcomeActivityScoreMap;
9877
10020
  };
9878
10021
 
9879
- // src/utilization/StorageUtilization.ts
9880
- var convertDataURLtoFile = (dataurl, filename) => {
9881
- var arr = dataurl.split(","), mime = (arr[0].match(/:(.*?);/) || [])[1], bstr = atob(arr[arr.length - 1]), n = bstr.length, u8arr = new Uint8Array(n);
9882
- while (n--) {
9883
- u8arr[n] = bstr.charCodeAt(n);
9884
- }
9885
- return new File([u8arr], filename, { type: mime });
9886
- };
9887
- var retrieveDocumentTypeFromAcceptedFormat = (format) => {
9888
- if (format === "application/pdf") {
9889
- return "PDF";
9890
- } else if (format === "image/jpeg" || format === "image/png" || format === "image/jpg" || format === "image/webp") {
9891
- return "IMAGE";
9892
- } else if (format === "audio/mp3") {
9893
- return "AUDIO";
9894
- }
9895
- };
9896
- var retrieveDocumentTypeFromExtension = (format) => {
9897
- if (format === "pdf") {
9898
- return "PDF";
9899
- } else if (format === "jpeg" || format === "png" || format === "jpg" || format === "webp") {
9900
- return "IMAGE";
9901
- } else if (format === "mp3") {
9902
- return "AUDIO";
9903
- }
9904
- };
9905
-
9906
10022
  // src/utilization/TokenUtilization.ts
9907
10023
  var retrieveTokenUsageTypeOptionList = () => {
9908
10024
  return [
@@ -10145,6 +10261,7 @@ var retrieveActivityMethodologyOptionList = () => {
10145
10261
  BaseLoading,
10146
10262
  BaseLoadingWithText,
10147
10263
  BaseModal,
10264
+ BasePDF,
10148
10265
  BaseTitle,
10149
10266
  BlueVerticalDividerLine,
10150
10267
  BrandLabel,