catchup-library-web 2.7.0 → 2.7.1
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.d.mts +1 -34
- package/dist/index.d.ts +1 -34
- package/dist/index.js +166 -283
- package/dist/index.mjs +133 -250
- package/package.json +1 -1
- package/src/components/groups/InputGroup.tsx +75 -222
- package/src/properties/TextProperties.ts +1 -1
package/dist/index.mjs
CHANGED
|
@@ -3745,13 +3745,39 @@ var VerticalDividerLine = () => {
|
|
|
3745
3745
|
var VerticalDividerLine_default = VerticalDividerLine;
|
|
3746
3746
|
|
|
3747
3747
|
// src/components/activities/material-contents/DropdownActivityMaterialContent.tsx
|
|
3748
|
-
import { InlineMath as
|
|
3748
|
+
import { InlineMath as InlineMath3 } from "react-katex";
|
|
3749
3749
|
|
|
3750
3750
|
// src/components/groups/InputGroup.tsx
|
|
3751
3751
|
import Select from "react-select";
|
|
3752
3752
|
import Switch from "react-switch";
|
|
3753
|
-
import { useEffect as useEffect3, useRef, useState as useState13
|
|
3754
|
-
|
|
3753
|
+
import { useEffect as useEffect3, useRef, useState as useState13 } from "react";
|
|
3754
|
+
|
|
3755
|
+
// src/components/texts/InputWithSpecialExpression.tsx
|
|
3756
|
+
import { InlineMath as InlineMath2 } from "react-katex";
|
|
3757
|
+
import { jsx as jsx24 } from "react/jsx-runtime";
|
|
3758
|
+
var InputWithSpecialExpression = ({
|
|
3759
|
+
value,
|
|
3760
|
+
showSpecialOnly
|
|
3761
|
+
}) => {
|
|
3762
|
+
const inputWithSpecialExpressionList = constructInputWithSpecialExpressionList(value);
|
|
3763
|
+
return showSpecialOnly ? inputWithSpecialExpressionList.length > 1 ? /* @__PURE__ */ jsx24("div", { className: "m-2", children: /* @__PURE__ */ jsx24("span", { className: "whitespace-pre-wrap", children: inputWithSpecialExpressionList.map((inputPart, index) => /* @__PURE__ */ jsx24(
|
|
3764
|
+
"span",
|
|
3765
|
+
{
|
|
3766
|
+
className: `${inputPart.isBold ? "font-semibold" : ""} ${inputPart.isUnderline ? "underline" : ""}`,
|
|
3767
|
+
children: inputPart.isEquation ? /* @__PURE__ */ jsx24("span", { className: "text-lg", children: /* @__PURE__ */ jsx24(InlineMath2, { math: inputPart.value }, index) }) : inputPart.value
|
|
3768
|
+
}
|
|
3769
|
+
)) }) }) : null : /* @__PURE__ */ jsx24("div", { className: "m-2", children: /* @__PURE__ */ jsx24("span", { className: "whitespace-pre-wrap", children: inputWithSpecialExpressionList.map((inputPart, index) => /* @__PURE__ */ jsx24(
|
|
3770
|
+
"span",
|
|
3771
|
+
{
|
|
3772
|
+
className: `${inputPart.isBold ? "font-semibold" : ""} ${inputPart.isUnderline ? "underline" : ""}`,
|
|
3773
|
+
children: inputPart.isEquation ? /* @__PURE__ */ jsx24("span", { className: "text-lg", children: /* @__PURE__ */ jsx24(InlineMath2, { math: inputPart.value }, index) }) : inputPart.value
|
|
3774
|
+
}
|
|
3775
|
+
)) }) });
|
|
3776
|
+
};
|
|
3777
|
+
var InputWithSpecialExpression_default = InputWithSpecialExpression;
|
|
3778
|
+
|
|
3779
|
+
// src/components/groups/InputGroup.tsx
|
|
3780
|
+
import { Fragment, jsx as jsx25, jsxs as jsxs15 } from "react/jsx-runtime";
|
|
3755
3781
|
var InputGroup = ({
|
|
3756
3782
|
type,
|
|
3757
3783
|
title,
|
|
@@ -3777,11 +3803,7 @@ var InputGroup = ({
|
|
|
3777
3803
|
description
|
|
3778
3804
|
}) => {
|
|
3779
3805
|
const textAreaRef = useRef(null);
|
|
3780
|
-
const latexTextAreaRef = useRef(null);
|
|
3781
3806
|
const [showMathConstructor, setShowMathConstructor] = useState13(false);
|
|
3782
|
-
const [showCheatSheet, setShowCheatSheet] = useState13(false);
|
|
3783
|
-
const [mathValue, setMathValue] = useState13("");
|
|
3784
|
-
const mathFieldRef = useRef(null);
|
|
3785
3807
|
useEffect3(() => {
|
|
3786
3808
|
if (!textAreaRef) return;
|
|
3787
3809
|
if (!textAreaRef.current) return;
|
|
@@ -3791,23 +3813,6 @@ var InputGroup = ({
|
|
|
3791
3813
|
textAreaRef.current.style.height = `44px`;
|
|
3792
3814
|
}
|
|
3793
3815
|
}, [textAreaRef, value]);
|
|
3794
|
-
useEffect3(() => {
|
|
3795
|
-
if (!latexTextAreaRef) return;
|
|
3796
|
-
if (!latexTextAreaRef.current) return;
|
|
3797
|
-
if (value) {
|
|
3798
|
-
latexTextAreaRef.current.style.height = `${latexTextAreaRef.current.scrollHeight}px`;
|
|
3799
|
-
} else {
|
|
3800
|
-
latexTextAreaRef.current.style.height = `44px`;
|
|
3801
|
-
}
|
|
3802
|
-
}, [latexTextAreaRef, value]);
|
|
3803
|
-
useEffect3(() => {
|
|
3804
|
-
if (!useMath) return;
|
|
3805
|
-
import("mathlive").then(({ MathfieldElement }) => {
|
|
3806
|
-
if (!customElements.get("math-field")) {
|
|
3807
|
-
customElements.define("math-field", MathfieldElement);
|
|
3808
|
-
}
|
|
3809
|
-
});
|
|
3810
|
-
}, [useMath]);
|
|
3811
3816
|
const retrieveNullableOptionList = () => {
|
|
3812
3817
|
if (!optionList) return [];
|
|
3813
3818
|
const currentOptionList = {
|
|
@@ -3844,30 +3849,11 @@ var InputGroup = ({
|
|
|
3844
3849
|
onChange && onChange(e);
|
|
3845
3850
|
}
|
|
3846
3851
|
};
|
|
3847
|
-
const handleMathFieldChange = useCallback(() => {
|
|
3848
|
-
if (!mathFieldRef.current) return;
|
|
3849
|
-
const latexValue = mathFieldRef.current.value;
|
|
3850
|
-
const wasFocused = mathFieldRef.current === document.activeElement;
|
|
3851
|
-
const cursorPosition = mathFieldRef.current.position;
|
|
3852
|
-
setMathValue(latexValue);
|
|
3853
|
-
if (wasFocused) {
|
|
3854
|
-
setTimeout(() => {
|
|
3855
|
-
if (mathFieldRef.current) {
|
|
3856
|
-
mathFieldRef.current.focus();
|
|
3857
|
-
mathFieldRef.current.position = cursorPosition;
|
|
3858
|
-
}
|
|
3859
|
-
}, 0);
|
|
3860
|
-
}
|
|
3861
|
-
}, []);
|
|
3862
|
-
const handleCopyLatex = () => {
|
|
3863
|
-
navigator.clipboard.writeText(`$$${mathValue}$$`);
|
|
3864
|
-
};
|
|
3865
3852
|
const handleOpenMathConstructor = () => {
|
|
3866
|
-
setMathValue("");
|
|
3867
3853
|
setShowMathConstructor(true);
|
|
3868
3854
|
};
|
|
3869
3855
|
const MathConstructorModal = () => {
|
|
3870
|
-
return /* @__PURE__ */
|
|
3856
|
+
return /* @__PURE__ */ jsx25(
|
|
3871
3857
|
BaseModal_default,
|
|
3872
3858
|
{
|
|
3873
3859
|
title: i18n_default.t("math_editor"),
|
|
@@ -3878,151 +3864,74 @@ var InputGroup = ({
|
|
|
3878
3864
|
onRequestClose: () => {
|
|
3879
3865
|
setShowMathConstructor(false);
|
|
3880
3866
|
},
|
|
3881
|
-
children: /* @__PURE__ */
|
|
3882
|
-
/* @__PURE__ */
|
|
3883
|
-
|
|
3884
|
-
{
|
|
3885
|
-
|
|
3886
|
-
|
|
3887
|
-
|
|
3888
|
-
|
|
3889
|
-
"virtual-keyboard-mode": "onfocus",
|
|
3890
|
-
"smart-fence": true,
|
|
3891
|
-
"smart-mode": true,
|
|
3892
|
-
"smart-superscript": true,
|
|
3893
|
-
style: {
|
|
3894
|
-
fontSize: "14px",
|
|
3895
|
-
paddingRight: "16px",
|
|
3896
|
-
paddingLeft: "16px",
|
|
3897
|
-
paddingTop: "8px",
|
|
3898
|
-
paddingBottom: "8px",
|
|
3899
|
-
border: "none",
|
|
3900
|
-
outline: "none",
|
|
3901
|
-
width: "100%",
|
|
3902
|
-
backgroundColor: "transparent",
|
|
3903
|
-
borderRadius: "16px",
|
|
3904
|
-
fontFamily: "inherit"
|
|
3905
|
-
}
|
|
3906
|
-
}
|
|
3907
|
-
) }) }),
|
|
3908
|
-
/* @__PURE__ */ jsxs15("div", { children: [
|
|
3909
|
-
/* @__PURE__ */ jsx24("p", { className: "text-md font-semibold pl-2 py-1 text-catchup-gray-400", children: i18n_default.t("latex_output") }),
|
|
3910
|
-
/* @__PURE__ */ jsxs15("div", { className: "relative", children: [
|
|
3911
|
-
/* @__PURE__ */ jsx24(
|
|
3912
|
-
"textarea",
|
|
3913
|
-
{
|
|
3914
|
-
ref: latexTextAreaRef,
|
|
3915
|
-
readOnly: true,
|
|
3916
|
-
value: mathValue ? `$$${mathValue}$$` : "",
|
|
3917
|
-
className: "w-full h-[44px] py-2 px-4 bg-catchup-gray-50 border border-catchup-gray-100 rounded-catchup-large resize-none focus:outline-none",
|
|
3918
|
-
placeholder: i18n_default.t("latex_will_appear_here")
|
|
3919
|
-
}
|
|
3920
|
-
),
|
|
3921
|
-
/* @__PURE__ */ jsx24(
|
|
3922
|
-
"button",
|
|
3923
|
-
{
|
|
3924
|
-
onClick: handleCopyLatex,
|
|
3925
|
-
className: "absolute top-2 right-2 bg-catchup-blue-400 text-white px-3 py-1 rounded-md text-md hover:bg-catchup-blue-500 transition-colors",
|
|
3926
|
-
disabled: !mathValue,
|
|
3927
|
-
children: i18n_default.t("copy")
|
|
3928
|
-
}
|
|
3929
|
-
)
|
|
3930
|
-
] })
|
|
3931
|
-
] }),
|
|
3932
|
-
/* @__PURE__ */ jsxs15("div", { children: [
|
|
3933
|
-
/* @__PURE__ */ jsxs15(
|
|
3934
|
-
"button",
|
|
3935
|
-
{
|
|
3936
|
-
onClick: () => setShowCheatSheet(!showCheatSheet),
|
|
3937
|
-
className: "flex items-center gap-x-1 text-md font-semibold pl-2 py-1 text-catchup-blue-400 hover:text-catchup-blue-500 transition-colors",
|
|
3938
|
-
type: "button",
|
|
3939
|
-
children: [
|
|
3940
|
-
i18n_default.t("latex_cheat_sheet"),
|
|
3941
|
-
/* @__PURE__ */ jsx24(
|
|
3942
|
-
"svg",
|
|
3943
|
-
{
|
|
3944
|
-
className: `w-3 h-3 transition-transform ${showCheatSheet ? "rotate-180" : ""}`,
|
|
3945
|
-
fill: "none",
|
|
3946
|
-
stroke: "currentColor",
|
|
3947
|
-
viewBox: "0 0 24 24",
|
|
3948
|
-
children: /* @__PURE__ */ jsx24(
|
|
3949
|
-
"path",
|
|
3950
|
-
{
|
|
3951
|
-
strokeLinecap: "round",
|
|
3952
|
-
strokeLinejoin: "round",
|
|
3953
|
-
strokeWidth: 2,
|
|
3954
|
-
d: "M19 9l-7 7-7-7"
|
|
3955
|
-
}
|
|
3956
|
-
)
|
|
3957
|
-
}
|
|
3958
|
-
)
|
|
3959
|
-
]
|
|
3960
|
-
}
|
|
3961
|
-
),
|
|
3962
|
-
showCheatSheet && /* @__PURE__ */ jsx24("div", { className: "mt-2 bg-catchup-gray-50 border border-catchup-gray-100 rounded-catchup-large p-4", children: /* @__PURE__ */ jsxs15("table", { className: "w-full text-md", children: [
|
|
3963
|
-
/* @__PURE__ */ jsx24("thead", { children: /* @__PURE__ */ jsxs15("tr", { className: "text-left text-catchup-gray-400", children: [
|
|
3964
|
-
/* @__PURE__ */ jsx24("th", { className: "pb-2 font-semibold", children: "LaTeX" }),
|
|
3965
|
-
/* @__PURE__ */ jsx24("th", { className: "pb-2 font-semibold" })
|
|
3867
|
+
children: /* @__PURE__ */ jsx25("div", { className: "bg-catchup-white rounded-lg overflow-hidden", children: /* @__PURE__ */ jsxs15("div", { className: "space-y-6", children: [
|
|
3868
|
+
/* @__PURE__ */ jsx25("p", { className: "text-md text-catchup-gray-400 pl-2", children: i18n_default.t("write_equation_in_double_dollars") }),
|
|
3869
|
+
/* @__PURE__ */ jsxs15("div", { className: "bg-catchup-gray-50 border border-catchup-gray-100 rounded-catchup-large p-4", children: [
|
|
3870
|
+
/* @__PURE__ */ jsx25("p", { className: "text-md font-semibold pl-2 py-1 text-catchup-blue-400", children: i18n_default.t("latex_cheat_sheet") }),
|
|
3871
|
+
/* @__PURE__ */ jsxs15("table", { className: "w-full text-md", children: [
|
|
3872
|
+
/* @__PURE__ */ jsx25("thead", { children: /* @__PURE__ */ jsxs15("tr", { className: "text-left text-catchup-gray-400", children: [
|
|
3873
|
+
/* @__PURE__ */ jsx25("th", { className: "pb-2 font-semibold", children: "LaTeX" }),
|
|
3874
|
+
/* @__PURE__ */ jsx25("th", { className: "pb-2 font-semibold" })
|
|
3966
3875
|
] }) }),
|
|
3967
3876
|
/* @__PURE__ */ jsxs15("tbody", { className: "font-mono text-catchup-gray-400", children: [
|
|
3968
3877
|
/* @__PURE__ */ jsxs15("tr", { children: [
|
|
3969
|
-
/* @__PURE__ */
|
|
3970
|
-
/* @__PURE__ */
|
|
3878
|
+
/* @__PURE__ */ jsx25("td", { className: "py-1", children: "\\frac{a}{b}" }),
|
|
3879
|
+
/* @__PURE__ */ jsx25("td", { className: "py-1", children: /* @__PURE__ */ jsx25(InputWithSpecialExpression_default, { value: "$$\\frac{a}{b}$$" }) })
|
|
3971
3880
|
] }),
|
|
3972
3881
|
/* @__PURE__ */ jsxs15("tr", { children: [
|
|
3973
|
-
/* @__PURE__ */
|
|
3974
|
-
/* @__PURE__ */
|
|
3882
|
+
/* @__PURE__ */ jsx25("td", { className: "py-1", children: "x^{2}" }),
|
|
3883
|
+
/* @__PURE__ */ jsx25("td", { className: "py-1", children: /* @__PURE__ */ jsx25(InputWithSpecialExpression_default, { value: "$$x^{2}$$" }) })
|
|
3975
3884
|
] }),
|
|
3976
3885
|
/* @__PURE__ */ jsxs15("tr", { children: [
|
|
3977
|
-
/* @__PURE__ */
|
|
3978
|
-
/* @__PURE__ */
|
|
3886
|
+
/* @__PURE__ */ jsx25("td", { className: "py-1", children: "x_{i}" }),
|
|
3887
|
+
/* @__PURE__ */ jsx25("td", { className: "py-1", children: /* @__PURE__ */ jsx25(InputWithSpecialExpression_default, { value: "$$x_{i}$$" }) })
|
|
3979
3888
|
] }),
|
|
3980
3889
|
/* @__PURE__ */ jsxs15("tr", { children: [
|
|
3981
|
-
/* @__PURE__ */
|
|
3982
|
-
/* @__PURE__ */
|
|
3890
|
+
/* @__PURE__ */ jsx25("td", { className: "py-1", children: "\\sqrt{x}" }),
|
|
3891
|
+
/* @__PURE__ */ jsx25("td", { className: "py-1", children: /* @__PURE__ */ jsx25(InputWithSpecialExpression_default, { value: "$$\\sqrt{x}$$" }) })
|
|
3983
3892
|
] }),
|
|
3984
3893
|
/* @__PURE__ */ jsxs15("tr", { children: [
|
|
3985
|
-
/* @__PURE__ */
|
|
3986
|
-
/* @__PURE__ */
|
|
3894
|
+
/* @__PURE__ */ jsx25("td", { className: "py-1", children: "\\sqrt[3]{x}" }),
|
|
3895
|
+
/* @__PURE__ */ jsx25("td", { className: "py-1", children: /* @__PURE__ */ jsx25(InputWithSpecialExpression_default, { value: "$$\\sqrt[3]{x}$$" }) })
|
|
3987
3896
|
] }),
|
|
3988
3897
|
/* @__PURE__ */ jsxs15("tr", { children: [
|
|
3989
|
-
/* @__PURE__ */
|
|
3990
|
-
/* @__PURE__ */
|
|
3898
|
+
/* @__PURE__ */ jsx25("td", { className: "py-1", children: "\\sum_{i=1}^{n}" }),
|
|
3899
|
+
/* @__PURE__ */ jsx25("td", { className: "py-1", children: /* @__PURE__ */ jsx25(InputWithSpecialExpression_default, { value: "$$\\sum_{i=1}^{n}$$" }) })
|
|
3991
3900
|
] }),
|
|
3992
3901
|
/* @__PURE__ */ jsxs15("tr", { children: [
|
|
3993
|
-
/* @__PURE__ */
|
|
3994
|
-
/* @__PURE__ */
|
|
3902
|
+
/* @__PURE__ */ jsx25("td", { className: "py-1", children: "\\int_{a}^{b}" }),
|
|
3903
|
+
/* @__PURE__ */ jsx25("td", { className: "py-1", children: /* @__PURE__ */ jsx25(InputWithSpecialExpression_default, { value: "$$\\int_{a}^{b}$$" }) })
|
|
3995
3904
|
] }),
|
|
3996
3905
|
/* @__PURE__ */ jsxs15("tr", { children: [
|
|
3997
|
-
/* @__PURE__ */
|
|
3998
|
-
/* @__PURE__ */
|
|
3906
|
+
/* @__PURE__ */ jsx25("td", { className: "py-1", children: "\\infty" }),
|
|
3907
|
+
/* @__PURE__ */ jsx25("td", { className: "py-1", children: /* @__PURE__ */ jsx25(InputWithSpecialExpression_default, { value: "$$\\infty$$" }) })
|
|
3999
3908
|
] }),
|
|
4000
3909
|
/* @__PURE__ */ jsxs15("tr", { children: [
|
|
4001
|
-
/* @__PURE__ */
|
|
4002
|
-
/* @__PURE__ */
|
|
3910
|
+
/* @__PURE__ */ jsx25("td", { className: "py-1", children: "\\pi" }),
|
|
3911
|
+
/* @__PURE__ */ jsx25("td", { className: "py-1", children: /* @__PURE__ */ jsx25(InputWithSpecialExpression_default, { value: "$$\\pi$$" }) })
|
|
4003
3912
|
] }),
|
|
4004
3913
|
/* @__PURE__ */ jsxs15("tr", { children: [
|
|
4005
|
-
/* @__PURE__ */
|
|
4006
|
-
/* @__PURE__ */
|
|
3914
|
+
/* @__PURE__ */ jsx25("td", { className: "py-1", children: "\\alpha \\beta \\gamma" }),
|
|
3915
|
+
/* @__PURE__ */ jsx25("td", { className: "py-1", children: /* @__PURE__ */ jsx25(InputWithSpecialExpression_default, { value: "$$\\alpha \\beta \\gamma$$" }) })
|
|
4007
3916
|
] }),
|
|
4008
3917
|
/* @__PURE__ */ jsxs15("tr", { children: [
|
|
4009
|
-
/* @__PURE__ */
|
|
4010
|
-
/* @__PURE__ */
|
|
3918
|
+
/* @__PURE__ */ jsx25("td", { className: "py-1", children: "\\leq \\geq \\neq" }),
|
|
3919
|
+
/* @__PURE__ */ jsx25("td", { className: "py-1", children: /* @__PURE__ */ jsx25(InputWithSpecialExpression_default, { value: "$$\\leq \\geq \\neq$$" }) })
|
|
4011
3920
|
] }),
|
|
4012
3921
|
/* @__PURE__ */ jsxs15("tr", { children: [
|
|
4013
|
-
/* @__PURE__ */
|
|
4014
|
-
/* @__PURE__ */
|
|
3922
|
+
/* @__PURE__ */ jsx25("td", { className: "py-1", children: "\\pm \\times \\div" }),
|
|
3923
|
+
/* @__PURE__ */ jsx25("td", { className: "py-1", children: /* @__PURE__ */ jsx25(InputWithSpecialExpression_default, { value: "$$\\pm \\times \\div$$" }) })
|
|
4015
3924
|
] }),
|
|
4016
3925
|
/* @__PURE__ */ jsxs15("tr", { children: [
|
|
4017
|
-
/* @__PURE__ */
|
|
4018
|
-
/* @__PURE__ */
|
|
3926
|
+
/* @__PURE__ */ jsx25("td", { className: "py-1", children: "\\log_{a}{b}" }),
|
|
3927
|
+
/* @__PURE__ */ jsx25("td", { className: "py-1", children: /* @__PURE__ */ jsx25(InputWithSpecialExpression_default, { value: "$$\\log_{a}{b}$$" }) })
|
|
4019
3928
|
] }),
|
|
4020
3929
|
/* @__PURE__ */ jsxs15("tr", { children: [
|
|
4021
|
-
/* @__PURE__ */
|
|
4022
|
-
/* @__PURE__ */
|
|
3930
|
+
/* @__PURE__ */ jsx25("td", { className: "py-1", children: "\\sin \\cos \\tan" }),
|
|
3931
|
+
/* @__PURE__ */ jsx25("td", { className: "py-1", children: /* @__PURE__ */ jsx25(InputWithSpecialExpression_default, { value: "$$\\sin \\cos \\tan$$" }) })
|
|
4023
3932
|
] })
|
|
4024
3933
|
] })
|
|
4025
|
-
] })
|
|
3934
|
+
] })
|
|
4026
3935
|
] })
|
|
4027
3936
|
] }) })
|
|
4028
3937
|
}
|
|
@@ -4035,7 +3944,7 @@ var InputGroup = ({
|
|
|
4035
3944
|
className: "flex flex-row items-center gap-x-1 cursor-pointer",
|
|
4036
3945
|
onClick,
|
|
4037
3946
|
children: [
|
|
4038
|
-
/* @__PURE__ */
|
|
3947
|
+
/* @__PURE__ */ jsx25(
|
|
4039
3948
|
BaseImage_default,
|
|
4040
3949
|
{
|
|
4041
3950
|
src: value ? "/icons/checkbox.webp" : "/icons/checkbox-empty.webp",
|
|
@@ -4045,15 +3954,15 @@ var InputGroup = ({
|
|
|
4045
3954
|
}
|
|
4046
3955
|
}
|
|
4047
3956
|
),
|
|
4048
|
-
/* @__PURE__ */
|
|
3957
|
+
/* @__PURE__ */ jsx25("p", { className: "", children: title })
|
|
4049
3958
|
]
|
|
4050
3959
|
}
|
|
4051
3960
|
);
|
|
4052
3961
|
};
|
|
4053
3962
|
const FileInputGroup = () => {
|
|
4054
3963
|
return /* @__PURE__ */ jsxs15("div", { className: "my-1", children: [
|
|
4055
|
-
title ? /* @__PURE__ */
|
|
4056
|
-
/* @__PURE__ */
|
|
3964
|
+
title ? /* @__PURE__ */ jsx25("p", { className: "text-md font-semibold pl-2 py-1 text-catchup-gray-400", children: title }) : null,
|
|
3965
|
+
/* @__PURE__ */ jsx25(
|
|
4057
3966
|
"input",
|
|
4058
3967
|
{
|
|
4059
3968
|
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",
|
|
@@ -4071,8 +3980,8 @@ var InputGroup = ({
|
|
|
4071
3980
|
};
|
|
4072
3981
|
const DateInputGroup = () => {
|
|
4073
3982
|
return /* @__PURE__ */ jsxs15("div", { className: "my-1", children: [
|
|
4074
|
-
title ? /* @__PURE__ */
|
|
4075
|
-
/* @__PURE__ */
|
|
3983
|
+
title ? /* @__PURE__ */ jsx25("p", { className: "text-md font-semibold pl-2 py-1 text-catchup-gray-400", children: title }) : null,
|
|
3984
|
+
/* @__PURE__ */ jsx25(
|
|
4076
3985
|
"input",
|
|
4077
3986
|
{
|
|
4078
3987
|
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`,
|
|
@@ -4090,8 +3999,8 @@ var InputGroup = ({
|
|
|
4090
3999
|
};
|
|
4091
4000
|
const SearchableSelectInputGroup = () => {
|
|
4092
4001
|
return /* @__PURE__ */ jsxs15("div", { className: "my-1", children: [
|
|
4093
|
-
title ? /* @__PURE__ */
|
|
4094
|
-
/* @__PURE__ */
|
|
4002
|
+
title ? /* @__PURE__ */ jsx25("p", { className: "text-md font-semibold pl-2 py-1 text-catchup-gray-400 ", children: title }) : null,
|
|
4003
|
+
/* @__PURE__ */ jsx25(
|
|
4095
4004
|
Select,
|
|
4096
4005
|
{
|
|
4097
4006
|
options: convertOptionListToSelectComponent(
|
|
@@ -4177,14 +4086,14 @@ var InputGroup = ({
|
|
|
4177
4086
|
const TextAreaInputGroup = () => {
|
|
4178
4087
|
return /* @__PURE__ */ jsxs15("div", { className: "my-1 flex-1 flex flex-col relative", children: [
|
|
4179
4088
|
/* @__PURE__ */ jsxs15("div", { className: "flex flex-row justify-between items-center", children: [
|
|
4180
|
-
/* @__PURE__ */
|
|
4181
|
-
/* @__PURE__ */
|
|
4089
|
+
/* @__PURE__ */ jsx25("div", { children: title ? /* @__PURE__ */ jsx25("p", { className: "text-md font-semibold pl-2 py-1 text-catchup-gray-400", children: title }) : null }),
|
|
4090
|
+
/* @__PURE__ */ jsx25("div", { children: value && limit ? /* @__PURE__ */ jsxs15("p", { className: "text-md font-semibold pr-2 py-1 text-catchup-gray-400", children: [
|
|
4182
4091
|
value.length,
|
|
4183
4092
|
" / ",
|
|
4184
4093
|
limit
|
|
4185
4094
|
] }) : null })
|
|
4186
4095
|
] }),
|
|
4187
|
-
/* @__PURE__ */
|
|
4096
|
+
/* @__PURE__ */ jsx25(
|
|
4188
4097
|
"textarea",
|
|
4189
4098
|
{
|
|
4190
4099
|
ref: textAreaRef,
|
|
@@ -4197,22 +4106,22 @@ var InputGroup = ({
|
|
|
4197
4106
|
onKeyDown
|
|
4198
4107
|
}
|
|
4199
4108
|
),
|
|
4200
|
-
useMath && /* @__PURE__ */
|
|
4109
|
+
useMath && /* @__PURE__ */ jsx25(
|
|
4201
4110
|
"button",
|
|
4202
4111
|
{
|
|
4203
4112
|
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",
|
|
4204
4113
|
onClick: handleOpenMathConstructor,
|
|
4205
4114
|
type: "button",
|
|
4206
4115
|
children: /* @__PURE__ */ jsxs15("div", { className: "flex items-center gap-x-1", children: [
|
|
4207
|
-
/* @__PURE__ */
|
|
4208
|
-
/* @__PURE__ */
|
|
4116
|
+
/* @__PURE__ */ jsx25("span", { className: "text-sm font-medium", children: "\u{1D453}(x)" }),
|
|
4117
|
+
/* @__PURE__ */ jsx25(
|
|
4209
4118
|
"svg",
|
|
4210
4119
|
{
|
|
4211
4120
|
className: "w-3 h-3",
|
|
4212
4121
|
fill: "none",
|
|
4213
4122
|
stroke: "currentColor",
|
|
4214
4123
|
viewBox: "0 0 24 24",
|
|
4215
|
-
children: /* @__PURE__ */
|
|
4124
|
+
children: /* @__PURE__ */ jsx25(
|
|
4216
4125
|
"path",
|
|
4217
4126
|
{
|
|
4218
4127
|
strokeLinecap: "round",
|
|
@@ -4231,18 +4140,18 @@ var InputGroup = ({
|
|
|
4231
4140
|
const TextInputGroup = () => {
|
|
4232
4141
|
return /* @__PURE__ */ jsxs15("div", { className: "my-1 relative", children: [
|
|
4233
4142
|
/* @__PURE__ */ jsxs15("div", { className: "flex flex-row justify-between items-center", children: [
|
|
4234
|
-
/* @__PURE__ */
|
|
4235
|
-
/* @__PURE__ */
|
|
4143
|
+
/* @__PURE__ */ jsx25("div", { children: title ? /* @__PURE__ */ jsx25("p", { className: "text-md font-semibold pl-2 py-1 text-catchup-gray-400", children: title }) : null }),
|
|
4144
|
+
/* @__PURE__ */ jsx25("div", { children: value && limit ? /* @__PURE__ */ jsxs15("p", { className: "text-md font-semibold pr-2 py-1 text-catchup-gray-400", children: [
|
|
4236
4145
|
value.length,
|
|
4237
4146
|
" / ",
|
|
4238
4147
|
limit
|
|
4239
4148
|
] }) : null })
|
|
4240
4149
|
] }),
|
|
4241
|
-
/* @__PURE__ */
|
|
4150
|
+
/* @__PURE__ */ jsx25(
|
|
4242
4151
|
"div",
|
|
4243
4152
|
{
|
|
4244
4153
|
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-catchup-white"}`,
|
|
4245
|
-
children: /* @__PURE__ */
|
|
4154
|
+
children: /* @__PURE__ */ jsx25(
|
|
4246
4155
|
"input",
|
|
4247
4156
|
{
|
|
4248
4157
|
disabled,
|
|
@@ -4260,22 +4169,22 @@ var InputGroup = ({
|
|
|
4260
4169
|
)
|
|
4261
4170
|
}
|
|
4262
4171
|
),
|
|
4263
|
-
useMath && /* @__PURE__ */
|
|
4172
|
+
useMath && /* @__PURE__ */ jsx25(
|
|
4264
4173
|
"button",
|
|
4265
4174
|
{
|
|
4266
4175
|
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",
|
|
4267
4176
|
onClick: handleOpenMathConstructor,
|
|
4268
4177
|
type: "button",
|
|
4269
4178
|
children: /* @__PURE__ */ jsxs15("div", { className: "flex items-center gap-x-1", children: [
|
|
4270
|
-
/* @__PURE__ */
|
|
4271
|
-
/* @__PURE__ */
|
|
4179
|
+
/* @__PURE__ */ jsx25("span", { className: "text-sm font-medium", children: "\u{1D453}(x)" }),
|
|
4180
|
+
/* @__PURE__ */ jsx25(
|
|
4272
4181
|
"svg",
|
|
4273
4182
|
{
|
|
4274
4183
|
className: "w-3 h-3",
|
|
4275
4184
|
fill: "none",
|
|
4276
4185
|
stroke: "currentColor",
|
|
4277
4186
|
viewBox: "0 0 24 24",
|
|
4278
|
-
children: /* @__PURE__ */
|
|
4187
|
+
children: /* @__PURE__ */ jsx25(
|
|
4279
4188
|
"path",
|
|
4280
4189
|
{
|
|
4281
4190
|
strokeLinecap: "round",
|
|
@@ -4294,7 +4203,7 @@ var InputGroup = ({
|
|
|
4294
4203
|
const SwitchInputGroup = () => {
|
|
4295
4204
|
return /* @__PURE__ */ jsxs15("div", { className: "flex flex-col my-1", children: [
|
|
4296
4205
|
/* @__PURE__ */ jsxs15("div", { className: "flex flex-row items-center", children: [
|
|
4297
|
-
/* @__PURE__ */
|
|
4206
|
+
/* @__PURE__ */ jsx25(
|
|
4298
4207
|
Switch,
|
|
4299
4208
|
{
|
|
4300
4209
|
onChange: () => {
|
|
@@ -4313,7 +4222,7 @@ var InputGroup = ({
|
|
|
4313
4222
|
disabled
|
|
4314
4223
|
}
|
|
4315
4224
|
),
|
|
4316
|
-
/* @__PURE__ */
|
|
4225
|
+
/* @__PURE__ */ jsx25(
|
|
4317
4226
|
"p",
|
|
4318
4227
|
{
|
|
4319
4228
|
className: `${checked ? "font-bold" : "text-catchup-gray"} px-2 transition-all duration-300`,
|
|
@@ -4321,7 +4230,7 @@ var InputGroup = ({
|
|
|
4321
4230
|
}
|
|
4322
4231
|
)
|
|
4323
4232
|
] }),
|
|
4324
|
-
description ? /* @__PURE__ */
|
|
4233
|
+
description ? /* @__PURE__ */ jsx25("p", { className: "text-md text-catchup-gray-300 mt-1 ml-12", children: description }) : null
|
|
4325
4234
|
] });
|
|
4326
4235
|
};
|
|
4327
4236
|
const RenderMainContent = () => {
|
|
@@ -4345,7 +4254,7 @@ var InputGroup = ({
|
|
|
4345
4254
|
};
|
|
4346
4255
|
return /* @__PURE__ */ jsxs15(Fragment, { children: [
|
|
4347
4256
|
RenderMainContent(),
|
|
4348
|
-
/* @__PURE__ */
|
|
4257
|
+
/* @__PURE__ */ jsx25(MathConstructorModal, {})
|
|
4349
4258
|
] });
|
|
4350
4259
|
};
|
|
4351
4260
|
var InputGroup_default = InputGroup;
|
|
@@ -4477,7 +4386,7 @@ var getSystemLanguageFromCurriculumType = (curriculumType) => {
|
|
|
4477
4386
|
|
|
4478
4387
|
// src/components/dropdowns/MediaDropdown.tsx
|
|
4479
4388
|
import { useState as useState14, useEffect as useEffect4, useRef as useRef2 } from "react";
|
|
4480
|
-
import { jsx as
|
|
4389
|
+
import { jsx as jsx26, jsxs as jsxs16 } from "react/jsx-runtime";
|
|
4481
4390
|
var MediaDropdown = ({ id, answer, optionList }) => {
|
|
4482
4391
|
const [showDropdown, setShowDropdown] = useState14(false);
|
|
4483
4392
|
const dropdownRef = useRef2(null);
|
|
@@ -4508,7 +4417,7 @@ var MediaDropdown = ({ id, answer, optionList }) => {
|
|
|
4508
4417
|
setShowDropdown(false);
|
|
4509
4418
|
};
|
|
4510
4419
|
return /* @__PURE__ */ jsxs16("div", { ref: dropdownRef, className: "w-full relative", children: [
|
|
4511
|
-
/* @__PURE__ */
|
|
4420
|
+
/* @__PURE__ */ jsx26(
|
|
4512
4421
|
"div",
|
|
4513
4422
|
{
|
|
4514
4423
|
className: "w-full flex flex-col items-center justify-center cursor-pointer",
|
|
@@ -4516,7 +4425,7 @@ var MediaDropdown = ({ id, answer, optionList }) => {
|
|
|
4516
4425
|
children: answer
|
|
4517
4426
|
}
|
|
4518
4427
|
),
|
|
4519
|
-
/* @__PURE__ */
|
|
4428
|
+
/* @__PURE__ */ jsx26(
|
|
4520
4429
|
"ul",
|
|
4521
4430
|
{
|
|
4522
4431
|
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`,
|
|
@@ -4525,7 +4434,7 @@ var MediaDropdown = ({ id, answer, optionList }) => {
|
|
|
4525
4434
|
{
|
|
4526
4435
|
className: `${option.listItemClassNames ? option.listItemClassNames : ""}`,
|
|
4527
4436
|
children: [
|
|
4528
|
-
/* @__PURE__ */
|
|
4437
|
+
/* @__PURE__ */ jsx26(
|
|
4529
4438
|
"div",
|
|
4530
4439
|
{
|
|
4531
4440
|
className: `w-full flex flex-col my-2 cursor-pointer ${option.divClassNames ? option.divClassNames : ""}`,
|
|
@@ -4533,7 +4442,7 @@ var MediaDropdown = ({ id, answer, optionList }) => {
|
|
|
4533
4442
|
children: option.media
|
|
4534
4443
|
}
|
|
4535
4444
|
),
|
|
4536
|
-
index !== optionList.length - 1 ? /* @__PURE__ */
|
|
4445
|
+
index !== optionList.length - 1 ? /* @__PURE__ */ jsx26("div", { className: "w-full border my-1 border-catchup-light-blue rounded-catchup-full" }) : null
|
|
4537
4446
|
]
|
|
4538
4447
|
},
|
|
4539
4448
|
option.id
|
|
@@ -4547,7 +4456,7 @@ var MediaDropdown_default = MediaDropdown;
|
|
|
4547
4456
|
// src/components/activities/material-contents/ShowMaterialMediaByContentType.tsx
|
|
4548
4457
|
import { useEffect as useEffect5, useRef as useRef3, useState as useState15 } from "react";
|
|
4549
4458
|
import Modal3 from "react-modal";
|
|
4550
|
-
import { Fragment as Fragment2, jsx as
|
|
4459
|
+
import { Fragment as Fragment2, jsx as jsx27, jsxs as jsxs17 } from "react/jsx-runtime";
|
|
4551
4460
|
var ShowMaterialMediaByContentType = ({
|
|
4552
4461
|
key,
|
|
4553
4462
|
contentType,
|
|
@@ -4563,7 +4472,7 @@ var ShowMaterialMediaByContentType = ({
|
|
|
4563
4472
|
setIsLoaded(false);
|
|
4564
4473
|
}, []);
|
|
4565
4474
|
const RenderShowFullScreenItem = () => {
|
|
4566
|
-
return /* @__PURE__ */
|
|
4475
|
+
return /* @__PURE__ */ jsx27(
|
|
4567
4476
|
Modal3,
|
|
4568
4477
|
{
|
|
4569
4478
|
isOpen: showFullScreen,
|
|
@@ -4595,7 +4504,7 @@ var ShowMaterialMediaByContentType = ({
|
|
|
4595
4504
|
},
|
|
4596
4505
|
contentLabel: "",
|
|
4597
4506
|
children: /* @__PURE__ */ jsxs17("div", { className: "flex-1 flex flex-col", children: [
|
|
4598
|
-
/* @__PURE__ */
|
|
4507
|
+
/* @__PURE__ */ jsx27("div", { className: "ml-auto px-5 py-3", children: /* @__PURE__ */ jsx27(
|
|
4599
4508
|
BaseImage_default,
|
|
4600
4509
|
{
|
|
4601
4510
|
src: "/icons/cross-red.webp",
|
|
@@ -4607,7 +4516,7 @@ var ShowMaterialMediaByContentType = ({
|
|
|
4607
4516
|
}
|
|
4608
4517
|
}
|
|
4609
4518
|
) }),
|
|
4610
|
-
/* @__PURE__ */
|
|
4519
|
+
/* @__PURE__ */ jsx27("div", { className: "flex items-center justify-center h-[500px]", children: /* @__PURE__ */ jsx27(
|
|
4611
4520
|
BaseImage_default,
|
|
4612
4521
|
{
|
|
4613
4522
|
src: selectedFullScreenItem,
|
|
@@ -4622,8 +4531,8 @@ var ShowMaterialMediaByContentType = ({
|
|
|
4622
4531
|
};
|
|
4623
4532
|
return contentType === "IMAGE" ? /* @__PURE__ */ jsxs17(Fragment2, { children: [
|
|
4624
4533
|
RenderShowFullScreenItem(),
|
|
4625
|
-
/* @__PURE__ */
|
|
4626
|
-
/* @__PURE__ */
|
|
4534
|
+
/* @__PURE__ */ jsx27("div", { className: "my-2 w-full h-full", children: /* @__PURE__ */ jsx27("div", { className: "h-full flex items-center justify-center", children: /* @__PURE__ */ jsxs17("div", { className: "h-catchup-activity-media-box-item w-catchup-activity-media-box-item flex items-center justify-center relative", children: [
|
|
4535
|
+
/* @__PURE__ */ jsx27(
|
|
4627
4536
|
BaseImage_default,
|
|
4628
4537
|
{
|
|
4629
4538
|
src,
|
|
@@ -4638,7 +4547,7 @@ var ShowMaterialMediaByContentType = ({
|
|
|
4638
4547
|
}
|
|
4639
4548
|
}
|
|
4640
4549
|
),
|
|
4641
|
-
src !== null && src !== "" && src !== "DEFAULT_OPTION" && canFullScreen ? /* @__PURE__ */
|
|
4550
|
+
src !== null && src !== "" && src !== "DEFAULT_OPTION" && canFullScreen ? /* @__PURE__ */ jsx27(
|
|
4642
4551
|
"div",
|
|
4643
4552
|
{
|
|
4644
4553
|
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 bg-catchup-white bg-opacity-80",
|
|
@@ -4650,7 +4559,7 @@ var ShowMaterialMediaByContentType = ({
|
|
|
4650
4559
|
setShowFullScreen(true);
|
|
4651
4560
|
setSelectedFullScreenItem(src);
|
|
4652
4561
|
},
|
|
4653
|
-
children: /* @__PURE__ */
|
|
4562
|
+
children: /* @__PURE__ */ jsx27(
|
|
4654
4563
|
BaseImage_default,
|
|
4655
4564
|
{
|
|
4656
4565
|
src: "/icons/arrow-up.webp",
|
|
@@ -4662,7 +4571,7 @@ var ShowMaterialMediaByContentType = ({
|
|
|
4662
4571
|
}
|
|
4663
4572
|
) : null
|
|
4664
4573
|
] }) }) })
|
|
4665
|
-
] }) : contentType === "VIDEO" ? /* @__PURE__ */
|
|
4574
|
+
] }) : contentType === "VIDEO" ? /* @__PURE__ */ jsx27("div", { className: "my-2 w-full h-full", children: /* @__PURE__ */ jsx27("div", { className: "h-full flex items-center justify-center", children: /* @__PURE__ */ jsx27("div", { className: "h-catchup-activity-media-box-item w-catchup-activity-media-box-item flex items-center justify-center", children: /* @__PURE__ */ jsx27(
|
|
4666
4575
|
"video",
|
|
4667
4576
|
{
|
|
4668
4577
|
ref: videoRef,
|
|
@@ -4672,7 +4581,7 @@ var ShowMaterialMediaByContentType = ({
|
|
|
4672
4581
|
onClick: () => {
|
|
4673
4582
|
}
|
|
4674
4583
|
}
|
|
4675
|
-
) }) }) }) : contentType === "AUDIO" ? /* @__PURE__ */
|
|
4584
|
+
) }) }) }) : contentType === "AUDIO" ? /* @__PURE__ */ jsx27("div", { className: "my-2 w-full h-full", children: /* @__PURE__ */ jsx27("div", { className: "h-full flex items-center justify-center", children: /* @__PURE__ */ jsx27("div", { className: "h-catchup-activity-media-box-item w-catchup-activity-media-box-item flex items-center justify-center", children: /* @__PURE__ */ jsx27(
|
|
4676
4585
|
"audio",
|
|
4677
4586
|
{
|
|
4678
4587
|
className: "w-full rounded-catchup-xlarge",
|
|
@@ -4686,7 +4595,7 @@ var ShowMaterialMediaByContentType = ({
|
|
|
4686
4595
|
var ShowMaterialMediaByContentType_default = ShowMaterialMediaByContentType;
|
|
4687
4596
|
|
|
4688
4597
|
// src/components/activities/material-contents/DropdownActivityMaterialContent.tsx
|
|
4689
|
-
import { jsx as
|
|
4598
|
+
import { jsx as jsx28, jsxs as jsxs18 } from "react/jsx-runtime";
|
|
4690
4599
|
var DropdownActivityMaterialContent = ({
|
|
4691
4600
|
uniqueValue,
|
|
4692
4601
|
answerMap,
|
|
@@ -4712,19 +4621,19 @@ var DropdownActivityMaterialContent = ({
|
|
|
4712
4621
|
}
|
|
4713
4622
|
}, [showCorrectAnswer, answerMap, materialMap]);
|
|
4714
4623
|
return /* @__PURE__ */ jsxs18("div", { className: "flex flex-col h-full", children: [
|
|
4715
|
-
/* @__PURE__ */
|
|
4716
|
-
/* @__PURE__ */
|
|
4717
|
-
/* @__PURE__ */
|
|
4624
|
+
/* @__PURE__ */ jsx28("div", { className: "hidden md:block flex-shrink-0", children: /* @__PURE__ */ jsx28("span", { className: "font-semibold text-xl opacity-60", children: i18n_default.t("please_select_dropdown_text") }) }),
|
|
4625
|
+
/* @__PURE__ */ jsx28("div", { className: "hidden md:block flex-shrink-0", children: /* @__PURE__ */ jsx28(DividerLine_default, {}) }),
|
|
4626
|
+
/* @__PURE__ */ jsx28("div", { className: "flex-1 min-h-0 overflow-y-auto", children: /* @__PURE__ */ jsx28("div", { className: "w-full flex flex-row flex-wrap", children: Object.keys(displayAnswerMap).map(
|
|
4718
4627
|
(materialKey, index) => {
|
|
4719
4628
|
const answerKey = Object.keys(materialMap[materialKey])[0];
|
|
4720
4629
|
const learnerAnswerState = !isPreview ? null : checkAnswerState(answerKey, displayAnswerMap[materialKey]);
|
|
4721
|
-
return /* @__PURE__ */
|
|
4722
|
-
/* @__PURE__ */
|
|
4630
|
+
return /* @__PURE__ */ jsx28("div", { className: "w-full md:w-1/2", children: /* @__PURE__ */ jsx28("div", { className: "mx-2", children: /* @__PURE__ */ jsxs18("div", { className: "w-full flex flex-row my-2 gap-x-2", children: [
|
|
4631
|
+
/* @__PURE__ */ jsx28("div", { className: "my-auto", children: /* @__PURE__ */ jsxs18("p", { className: "text-xl", children: [
|
|
4723
4632
|
parseFloat(materialKey) + 1,
|
|
4724
4633
|
"."
|
|
4725
4634
|
] }) }),
|
|
4726
4635
|
/* @__PURE__ */ jsxs18("div", { className: "w-full relative", children: [
|
|
4727
|
-
/* @__PURE__ */
|
|
4636
|
+
/* @__PURE__ */ jsx28("div", { className: "flex-1", children: checkCanAnswerQuestion() ? contentMap.type === "TEXT" ? /* @__PURE__ */ jsx28("div", { className: "flex-1", children: /* @__PURE__ */ jsx28(
|
|
4728
4637
|
InputGroup_default,
|
|
4729
4638
|
{
|
|
4730
4639
|
type: "select",
|
|
@@ -4732,14 +4641,14 @@ var DropdownActivityMaterialContent = ({
|
|
|
4732
4641
|
optionList: shuffleArray(
|
|
4733
4642
|
materialMap[materialKey][answerKey]
|
|
4734
4643
|
).map((materialOption) => ({
|
|
4735
|
-
text: /* @__PURE__ */
|
|
4644
|
+
text: /* @__PURE__ */ jsx28("span", { className: "text-xl whitespace-pre-wrap", children: constructInputWithSpecialExpressionList(
|
|
4736
4645
|
materialOption
|
|
4737
|
-
).map((inputPart, index2) => /* @__PURE__ */
|
|
4646
|
+
).map((inputPart, index2) => /* @__PURE__ */ jsx28(
|
|
4738
4647
|
"span",
|
|
4739
4648
|
{
|
|
4740
4649
|
className: `${inputPart.isBold ? "font-bold" : ""} ${inputPart.isUnderline ? "underline" : ""}`,
|
|
4741
|
-
children: inputPart.isEquation ? /* @__PURE__ */
|
|
4742
|
-
|
|
4650
|
+
children: inputPart.isEquation ? /* @__PURE__ */ jsx28("span", { className: "text-xl", children: /* @__PURE__ */ jsx28(
|
|
4651
|
+
InlineMath3,
|
|
4743
4652
|
{
|
|
4744
4653
|
math: inputPart.value
|
|
4745
4654
|
}
|
|
@@ -4757,11 +4666,11 @@ var DropdownActivityMaterialContent = ({
|
|
|
4757
4666
|
);
|
|
4758
4667
|
}
|
|
4759
4668
|
}
|
|
4760
|
-
) }) : /* @__PURE__ */
|
|
4669
|
+
) }) : /* @__PURE__ */ jsx28(
|
|
4761
4670
|
MediaDropdown_default,
|
|
4762
4671
|
{
|
|
4763
4672
|
id: materialKey,
|
|
4764
|
-
answer: displayAnswerMap[materialKey] === "DEFAULT_OPTION" ? /* @__PURE__ */
|
|
4673
|
+
answer: displayAnswerMap[materialKey] === "DEFAULT_OPTION" ? /* @__PURE__ */ jsx28("div", { className: "w-catchup-activity-media-box-item h-catchup-activity-media-box-item border rounded-catchup-xlarge border-dashed border-catchup-blue", children: /* @__PURE__ */ jsx28("div", { className: "h-full flex flex-col items-center justify-center px-4 py-2", children: /* @__PURE__ */ jsx28("span", { className: "italic", children: i18n_default.t("please_select") }) }) }) : /* @__PURE__ */ jsx28(
|
|
4765
4674
|
ShowMaterialMediaByContentType_default,
|
|
4766
4675
|
{
|
|
4767
4676
|
contentType: contentMap.type,
|
|
@@ -4772,7 +4681,7 @@ var DropdownActivityMaterialContent = ({
|
|
|
4772
4681
|
),
|
|
4773
4682
|
optionList: materialMap[materialKey][answerKey].map((materialOption, index2) => ({
|
|
4774
4683
|
id: index2,
|
|
4775
|
-
media: /* @__PURE__ */
|
|
4684
|
+
media: /* @__PURE__ */ jsx28("div", { children: /* @__PURE__ */ jsx28(
|
|
4776
4685
|
ShowMaterialMediaByContentType_default,
|
|
4777
4686
|
{
|
|
4778
4687
|
contentType: contentMap.type,
|
|
@@ -4790,24 +4699,24 @@ var DropdownActivityMaterialContent = ({
|
|
|
4790
4699
|
}
|
|
4791
4700
|
}))
|
|
4792
4701
|
}
|
|
4793
|
-
) : /* @__PURE__ */
|
|
4702
|
+
) : /* @__PURE__ */ jsx28("p", { className: "text-xl whitespace-pre-wrap", children: constructInputWithSpecialExpressionList(
|
|
4794
4703
|
displayAnswerMap[materialKey]
|
|
4795
|
-
).map((inputPart, index2) => /* @__PURE__ */
|
|
4704
|
+
).map((inputPart, index2) => /* @__PURE__ */ jsx28(
|
|
4796
4705
|
"span",
|
|
4797
4706
|
{
|
|
4798
4707
|
className: `${inputPart.isBold ? "font-bold" : ""} ${inputPart.isUnderline ? "underline" : ""}`,
|
|
4799
|
-
children: inputPart.isEquation ? /* @__PURE__ */
|
|
4708
|
+
children: inputPart.isEquation ? /* @__PURE__ */ jsx28("span", { className: "text-xl", children: /* @__PURE__ */ jsx28(InlineMath3, { math: inputPart.value }) }) : inputPart.value
|
|
4800
4709
|
},
|
|
4801
4710
|
index2
|
|
4802
4711
|
)) }) }),
|
|
4803
|
-
learnerAnswerState === "CORRECT" ? /* @__PURE__ */
|
|
4712
|
+
learnerAnswerState === "CORRECT" ? /* @__PURE__ */ jsx28("div", { className: "absolute -top-2 right-3 bg-catchup-white", children: /* @__PURE__ */ jsx28(
|
|
4804
4713
|
BaseImage_default,
|
|
4805
4714
|
{
|
|
4806
4715
|
src: "/icons/checkbox.webp",
|
|
4807
4716
|
alt: "chekbbox",
|
|
4808
4717
|
size: "small"
|
|
4809
4718
|
}
|
|
4810
|
-
) }) : learnerAnswerState === "INCORRECT" ? /* @__PURE__ */
|
|
4719
|
+
) }) : learnerAnswerState === "INCORRECT" ? /* @__PURE__ */ jsx28("div", { className: "absolute -top-2 right-3 bg-catchup-white", children: /* @__PURE__ */ jsx28(
|
|
4811
4720
|
BaseImage_default,
|
|
4812
4721
|
{
|
|
4813
4722
|
src: "/icons/cross-red.webp",
|
|
@@ -4825,7 +4734,7 @@ var DropdownActivityMaterialContent_default = DropdownActivityMaterialContent;
|
|
|
4825
4734
|
|
|
4826
4735
|
// src/components/activities/DropdownActivityContent.tsx
|
|
4827
4736
|
import { useState as useState17, useEffect as useEffect7 } from "react";
|
|
4828
|
-
import { jsx as
|
|
4737
|
+
import { jsx as jsx29, jsxs as jsxs19 } from "react/jsx-runtime";
|
|
4829
4738
|
var DropdownActivityContent = ({
|
|
4830
4739
|
answerMap,
|
|
4831
4740
|
data,
|
|
@@ -4849,7 +4758,7 @@ var DropdownActivityContent = ({
|
|
|
4849
4758
|
changeAnswer(answerMap2);
|
|
4850
4759
|
};
|
|
4851
4760
|
return /* @__PURE__ */ jsxs19("div", { className: `flex flex-col ${isFullScreen ? "" : "md:flex-row"} h-full`, children: [
|
|
4852
|
-
/* @__PURE__ */
|
|
4761
|
+
/* @__PURE__ */ jsx29("div", { className: `${isFullScreen ? "w-full" : "w-full md:w-[60%] md:overflow-y-auto"}`, children: /* @__PURE__ */ jsx29(
|
|
4853
4762
|
ActivityBodyContent_default,
|
|
4854
4763
|
{
|
|
4855
4764
|
bodyMap: dropdownBodyMap,
|
|
@@ -4858,9 +4767,9 @@ var DropdownActivityContent = ({
|
|
|
4858
4767
|
templateType: "DROPDOWN"
|
|
4859
4768
|
}
|
|
4860
4769
|
) }),
|
|
4861
|
-
/* @__PURE__ */
|
|
4862
|
-
/* @__PURE__ */
|
|
4863
|
-
/* @__PURE__ */
|
|
4770
|
+
/* @__PURE__ */ jsx29("div", { className: `${isFullScreen ? "contents" : "contents md:hidden"}`, children: /* @__PURE__ */ jsx29(DividerLine_default, {}) }),
|
|
4771
|
+
/* @__PURE__ */ jsx29("div", { className: `${isFullScreen ? "hidden" : "hidden md:block"}`, children: /* @__PURE__ */ jsx29(VerticalDividerLine_default, {}) }),
|
|
4772
|
+
/* @__PURE__ */ jsx29("div", { className: `${isFullScreen ? "w-full" : "w-full md:flex-1 md:overflow-y-auto"}`, children: /* @__PURE__ */ jsx29(
|
|
4864
4773
|
DropdownActivityMaterialContent_default,
|
|
4865
4774
|
{
|
|
4866
4775
|
uniqueValue: JSON.stringify(data.contentMap),
|
|
@@ -4880,32 +4789,6 @@ var DropdownActivityContent_default = DropdownActivityContent;
|
|
|
4880
4789
|
// src/components/activities/material-contents/FillInTheBlanksActivityMaterialContent.tsx
|
|
4881
4790
|
import { InlineMath as InlineMath4 } from "react-katex";
|
|
4882
4791
|
import { useState as useState18, useEffect as useEffect8, useRef as useRef4 } from "react";
|
|
4883
|
-
|
|
4884
|
-
// src/components/texts/InputWithSpecialExpression.tsx
|
|
4885
|
-
import { InlineMath as InlineMath3 } from "react-katex";
|
|
4886
|
-
import { jsx as jsx29 } from "react/jsx-runtime";
|
|
4887
|
-
var InputWithSpecialExpression = ({
|
|
4888
|
-
value,
|
|
4889
|
-
showSpecialOnly
|
|
4890
|
-
}) => {
|
|
4891
|
-
const inputWithSpecialExpressionList = constructInputWithSpecialExpressionList(value);
|
|
4892
|
-
return showSpecialOnly ? inputWithSpecialExpressionList.length > 1 ? /* @__PURE__ */ jsx29("div", { className: "m-2", children: /* @__PURE__ */ jsx29("span", { className: "whitespace-pre-wrap", children: inputWithSpecialExpressionList.map((inputPart, index) => /* @__PURE__ */ jsx29(
|
|
4893
|
-
"span",
|
|
4894
|
-
{
|
|
4895
|
-
className: `${inputPart.isBold ? "font-semibold" : ""} ${inputPart.isUnderline ? "underline" : ""}`,
|
|
4896
|
-
children: inputPart.isEquation ? /* @__PURE__ */ jsx29("span", { className: "text-lg", children: /* @__PURE__ */ jsx29(InlineMath3, { math: inputPart.value }, index) }) : inputPart.value
|
|
4897
|
-
}
|
|
4898
|
-
)) }) }) : null : /* @__PURE__ */ jsx29("div", { className: "m-2", children: /* @__PURE__ */ jsx29("span", { className: "whitespace-pre-wrap", children: inputWithSpecialExpressionList.map((inputPart, index) => /* @__PURE__ */ jsx29(
|
|
4899
|
-
"span",
|
|
4900
|
-
{
|
|
4901
|
-
className: `${inputPart.isBold ? "font-semibold" : ""} ${inputPart.isUnderline ? "underline" : ""}`,
|
|
4902
|
-
children: inputPart.isEquation ? /* @__PURE__ */ jsx29("span", { className: "text-lg", children: /* @__PURE__ */ jsx29(InlineMath3, { math: inputPart.value }, index) }) : inputPart.value
|
|
4903
|
-
}
|
|
4904
|
-
)) }) });
|
|
4905
|
-
};
|
|
4906
|
-
var InputWithSpecialExpression_default = InputWithSpecialExpression;
|
|
4907
|
-
|
|
4908
|
-
// src/components/activities/material-contents/FillInTheBlanksActivityMaterialContent.tsx
|
|
4909
4792
|
import { jsx as jsx30, jsxs as jsxs20 } from "react/jsx-runtime";
|
|
4910
4793
|
var FillInTheBlanksActivityMaterialContent = ({
|
|
4911
4794
|
uniqueValue,
|