@elice/material-quiz 1.240912.1 → 1.241004.0-aidt.2

package/cjs/components/material-quiz/MaterialQuiz.js

@@ -106,7 +106,9 @@ var MaterialQuiz = function MaterialQuiz() {
   var isRenderQuestionWithPassage = (vertical || !isLongPassage || isQuizGroupType) && !!materialQuiz;
   React__default.default.useEffect(function () {
     if (debouncedWidth > 0) {
-      setVertical(debouncedWidth <= designTokens.base.screen.medium);
+      // Make always vertical false for horizontal layout
+      // ref: https://elicer.atlassian.net/browse/LXP-4406
+      setVertical(false);
     }
   }, [debouncedWidth, setVertical]);
   var renderQuestionOption = function renderQuestionOption() {

package/cjs/components/material-quiz/MaterialQuizAnswerExplanation.js

@@ -35,6 +35,7 @@ var MaterialQuizAnswerExplanation = function MaterialQuizAnswerExplanation() {
     margintop: "1rem",
     children: jsxRuntime.jsx(StyledAccordion, {
       dark: true,
+      defaultExpanded: true,
       header: jsxRuntime.jsx(blocks.Text, {
         bold: true,
         role: "navy0",

package/cjs/components/material-quiz/MaterialQuizSelectMultiple.js

@@ -249,7 +249,7 @@ var MaterialQuizSelectMultiple = function MaterialQuizSelectMultiple(_ref) {
               var materialQuizResponseAnswer = materialQuizResponse.answer;
               return (_a = materialQuizResponseAnswer.includes(index)) !== null && _a !== void 0 ? _a : false;
             };
-            var status = index.getOptionStatus({
+            var status = index.getQuizSelectMultipleOptionResultStatus(index$1, materialQuiz) || index.getOptionStatus({
               materialQuizResponse: materialQuizResponse,
               isSelected: getIsSelected(index$1, materialQuizResponse),
               isActive: isActive

package/cjs/components/material-quiz/MaterialQuizSelectMultipleOrder.js

@@ -505,10 +505,11 @@ var MaterialQuizSelectMultipleOrder = function MaterialQuizSelectMultipleOrder(_
     return jsxRuntime.jsx(StyledQuizAnswersDropZone, {
       children: answerList.map(function (option, index$1) {
         var getRole = function getRole() {
+          var _a;
           if (isActive) {
             return 'default';
           }
-          var status = index.getQuizResultStatus(materialQuizResponse);
+          var status = (_a = index.getQuizSelectMultipleOrderOptionResultStatus(index$1, materialQuiz, materialQuizResponse)) !== null && _a !== void 0 ? _a : index.getQuizResultStatus(materialQuizResponse);
           switch (status) {
             case index.QuizResultStatus.Correct:
               return 'correct';

package/cjs/components/material-quiz/locales/th.json.js

@@ -2,6 +2,6 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var th = {"materialQuiz.anchorLabel.question":"ทางเดิน","materialQuiz.anchorLabel.answer":"ดคำตอบ","materialQuiz.error":"เกิดข้อผิดพลาดในการโหลดข้อสอบ กรุณาลองอีกครั้งในภายหลัง","materialQuiz.submit":"ส่ง","materialQuiz.resubmit":"ส่งอีกครั้ง","materialQuiz.submittedAnswer":"คำตอบที่ส่ง","materialQuiz.answer":"ตอบ","materialQuiz.next":"ไปยังข้อถัดไป >","materialQuiz.selectOne.answer.title":"เลือกคำตอบจากตัวเลือกด้านล่าง","materialQuiz.selectMultiple.answer.title":"เลือกคำตอบจากตัวเลือกด้านล่าง (สามารถเลือกได้หลายข้อ)","materialQuiz.selectMultipleOrder.answer.title":"ลากและวางคำตอบของคุณ","materialQuiz.text.answer.title":"กรุณาเขียนคำตอบของคุณ","materialQuiz.empty.title":"ข้อสอบยังไม่พร้อมใช้งาน","materialQuiz.empty.description":"กรุณาลองอีกครั้งหลังจากเผยแพร่ข้อสอบ!","materialQuiz.survey.empty.title":"แบบสำรวจยังไม่พร้อมใช้งาน","materialQuiz.survey.empty.description":"โปรดตรวจสอบอีกครั้งหลังจากโพสต์แบบสำรวจ!","materialQuiz.submitStatus.success":"ส่งเรียบร้อยแล้ว","materialQuiz.submitStatus.failure":"ส่งล้มเหลว","materialQuiz.resultStatus.correct":"ถูกต้อง","materialQuiz.resultStatus.wrong":"กรุณาลองแก้ปัญหาอีกครั้ง","materialQuiz.resultStatus.submitted":"ส่งคำตอบแล้ว","materialQuiz.explanation.close":"ปิดคำอธิบาย","materialQuiz.explanation.show":"ดูคำอธิบาย","materialQuiz.explanation.empty":"ไม่มีคำอธิบาย","materialQuiz.text.placeholder":"กรุณากรอกคำตอบ","materialQuiz.text.correct":"ถูกต้อง!","materialQuiz.text.wrong":"นั่นผิด ลองอีกครั้ง!","materialQuiz.order.answerEmpty":"คุณสามารถย้ายตัวเลือกกลับมาที่นี่ได้","materialQuiz.bottomSheet.title":"ตัวเลือก","materialQuiz.bottomSheet.optionEmpty":"คุณได้จัดเรียงตัวเลือกทั้งหมดลงในกลุ่มแล้ว","materialQuiz.dropzone.desktop.answerEmpty":"ลากและวางตัวเลือกของคุณลงในพื้นที่นี้","materialQuiz.dropzone.mobile.answerEmpty":"แตะที่นี่เพื่อใส่ตัวเลือก","materialQuiz.dropzone.optionEmpty":"ตัวเลือก","materialQuiz.dropzone.optionReset":"รีเซ็ตคำตอบ"};
+var th = {"materialQuiz.anchorLabel.question":"ทางเดิน","materialQuiz.anchorLabel.answer":"ดคำตอบ","materialQuiz.error":"ไม่สามารถดึงควิซได้","materialQuiz.submit":"ส่งใบสมัคร","materialQuiz.resubmit":"ส่งอีกครั้ง","materialQuiz.submittedAnswer":"ฉันสามารถตอบคำถามเช่นนี้ได้","materialQuiz.answer":"ตอบ","materialQuiz.next":"คำถามถัดไป >","materialQuiz.selectOne.answer.title":"เลือกจากมุมมองด้านล่างนี้","materialQuiz.selectMultiple.answer.title":"เลือกจากรายการด้านล่าง (มีการเลือกที่ซ้ำซ้อน)","materialQuiz.selectMultipleOrder.answer.title":"ลากและวางคำตอบของคุณ","materialQuiz.text.answer.title":"กรุณากรอกคำตอบ","materialQuiz.empty.title":"ควิซกำลังเตรียมอยู่ตอนนี้","materialQuiz.empty.description":"โปรดตรวจสอบอีกครั้งหลังจากโพสต์ควิซ!","materialQuiz.survey.empty.title":"การสำรวจกำลังเตรียมการอยู่ค่ะ","materialQuiz.survey.empty.description":"โปรดตรวจสอบอีกครั้งหลังจากโพสต์แบบสำรวจ!","materialQuiz.submitStatus.success":"เสนอ","materialQuiz.submitStatus.failure":"การส่งล้มเหลว","materialQuiz.resultStatus.correct":"ถูกต้อง","materialQuiz.resultStatus.wrong":"กรุณาลองแก้ปัญหาอีกครั้ง","materialQuiz.resultStatus.submitted":"เสนอ","materialQuiz.explanation.close":"ปิดคำอธิบายควิซ","materialQuiz.explanation.show":"แสดงคำอธิบายของควิซ","materialQuiz.explanation.empty":"ไม่ให้อธิบาย","materialQuiz.text.placeholder":"กรุณากรอกคำตอบ","materialQuiz.text.correct":"ถูกต้อง!","materialQuiz.text.wrong":"นั่นผิด ลองอีกครั้ง!","materialQuiz.order.answerEmpty":"คุณสามารถย้ายตัวเลือกกลับมาที่นี่ได้","materialQuiz.bottomSheet.title":"ตัวเลือก","materialQuiz.bottomSheet.optionEmpty":"ทุกมุมมองได้ถูกวางไว้ในกลุ่มแล้ว","materialQuiz.dropzone.desktop.answerEmpty":"ลากมุมมองเข้าสู่พื้นที่","materialQuiz.dropzone.mobile.answerEmpty":"คลิกที่นี่เพื่อเพิ่มมุมมอง","materialQuiz.dropzone.optionEmpty":"ตัวเลือก","materialQuiz.dropzone.optionReset":"รีเซ็ตคำตอบ"};
 
 exports.default = th;

package/cjs/components/material-quiz-edit/locales/th.json.js

@@ -2,6 +2,6 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var th = {"common.option":"ตัวเลือก {number}","common.group":"กลุ่ม {group}","common.errorMessage.range":"กรุณาใส่ข้อมูล {min} ~ {max} ตัวอักษร","content.title":"คำถาม","content.title.errorMessage.required":"กรุณากรอกคำถาม","content.title.placeholder":"กรุณากรอกคำถามสำหรับปัญหานี้ค่ะ","content.description.title":"คำอธิบายของปัญหา","content.description.placeholder":"กรุณากรอกคำอธิบายปัญหาอย่างละเอียดพร้อมโค้ดหรือรูปภาพ เป็นต้น","content.option.title":"ตอบ","content.option.tooltip.disabled":"ไม่สามารถแก้ไขได้หากมี {_termPathRoleStudent} ส่งคำตอบแล้ว หรือข้อสอบถูกเผยแพร่","content.option.select.items.selectOne":"การเลือกคำตอบหลายตัวเลือก (เลือกได้เพียงหนึ่งคำตอบ)","content.option.select.items.selectMultiple":"ตัวเลือกหลายตัวเลือก (ตอบได้หลายตัวเลือก)","content.option.select.items.selectMultipleOrder":"ลากและวาง","content.option.select.items.text":"ข้อความ","content.option.optionsSetEnabled.label":"สุ่มลำดับคำตอบ","content.option.optionsSetEnabled.tooltip":"เปิดใช้งานฟังก์ชันนี้เพื่อสุ่มลำดับคำตอบให้ {_termPathRoleStudent} แต่ละคน","content.option.alert.randomized.title":"เปิดใช้งานการสุ่มลำดับคำตอบ","content.option.alert.randomized.description":"คำตอบจะแสดงสุ่มลำดับให้ {_termPathRoleStudent}","content.option.select.items.group":"ลากและวาง (ประเภทกลุ่ม)","content.option.statusText.dragNDrop":"ใส่ตัวเลือกแล้วคลิกตามลำดับคำตอบที่ถูกต้อง\nตรวจสอบปัญหาที่สร้างไว้ได้ที่แท็บ 'เรียนรู้ {_termLibraryLecturePage}' ทางซ้าย","content.option.statusText.dragNDropGroup":"ตรวจสอบปัญหาที่สร้างไว้ได้ที่แท็บ 'เรียนรู้ {_termLibraryLecturePage}' ทางซ้าย","content.option.errorMessage.required":"กรุณาเลือกคำตอบ","content.answerHint.title":"ตั้งค่าข้อความแนะนำในช่องตอบ","content.answerHint.description":"ตั้งค่าข้อความแนะนำสำหรับช่องตอบที่ผู้ใช้ใส่คำตอบ","content.answerHint.placeholder":"ใส่ข้อความแนะนำ","content.explanationInfo.title":"เขียนอธิบาย","content.explanationInfo.description":"คำอธิบายนี้จะปรากฏหลังจากปัญหาได้รับการแก้ไขแล้ว","content.explanationInfo.checkbox.label":"เปิดใช้งาน","content.explanationInfo.textarea.placeholder":"กรุณาใส่คำอธิบาย","content.explanationInfo.textarea.errorMessage.required":"โปรดเขียนคำอธิบายเกี่ยวกับปัญหา","option.common.select.errorMessage.required":"กรุณากรอกตัวเลือก","option.common.select.placeholder":"ป้อนตัวเลือก","option.common.select.tooltip.minOptionInfoItem":"คุณต้องป้อนตัวเลือกอย่างน้อย 2 ตัวเลือก","option.common.select.tooltip.maxOptionInfoItem":"คุณไม่สามารถป้อนตัวเลือกได้มากกว่า 20 ตัวเลือก","option.common.select.addButton":"เพิ่มตัวเลือก","option.text.answerInfo.errorMessage.required":"กรุณากรอกคำตอบที่ถูกต้อง","option.text.answerInfo.hintText":"คำตอบจะถูกให้คะแนนโดยใช้ regular expressions หากคำตอบที่ถูกต้องรวมถึง meta-characters (^[]$()|*+?{}.\\) โปรดเติมเครื่องหมาย backslash (\\) ไว้ข้างหน้า","option.text.isAutoGrade.checkbox.label":"การให้คะแนนโดยการตรวจสอบโดยไม่ระบุคำตอบ","group.option.title":"กลุ่ม","group.option.addButton":"เพิ่มกลุ่ม","group.option.errorMessage.required":"กรุณาใส่ชื่อกลุ่ม","group.option.errorMessage.notChild":"มีกลุ่มที่ถูกสร้างขึ้นแล้ว ซึ่งไม่ได้อยู่ในตัวเลือกใดๆ ","group.option.tooltip.minDisabled":"คุณต้องกำหนดค่าอย่างน้อย 2 กลุ่ม","group.option.tooltip.maxDisabled":"คุณสามารถกำหนดค่ากลุ่มได้สูงสุด 6 กลุ่ม","answer.option.errorMessage":"ต้องมีตัวเลือกหรือไฟล์","answer.option.title.text":"ตัวเลือก","answer.option.title.file":"ไฟล์","answer.option.title.group":"กลุ่มที่ตัวเลือกอยู่","answer.option.addButton":"เพิ่มตัวเลือก","answer.option.file.label":"อัพโหลดไฟล์","answer.option.file.description.imageSize":"ขนาดภาพที่แนะนำ: 1:1 (185 x 185 พิกเซล)","answer.option.file.description.fileSize":"คุณสามารถอัพโหลดไฟล์ได้สูงสุด 3MB","answer.option.file.description.extension":"รองรับสกุลไฟล์ .mp3, .mp4, .mov, .png, .jpg, .svg และ .gif","answer.option.file.errorMessage.maxSize":"คุณสามารถอัพโหลดได้สูงสุด {size}MB.","answer.option.default.group":"ไม่มี","answer.option.tooltip.minDisabled":"คุณต้องกำหนดค่าอย่างน้อย 2 ตัวเลือก","answer.option.tooltip.maxDisabled":"คุณสามารถสร้างตัวเลือกได้สูงสุด 20 ตัวเลือก"};
+var th = {"common.option":"ตัวเลือก {number}","common.group":"กลุ่ม {group}","common.errorMessage.range":"กรุณากรอกภายใน {min} ~ {max} ตัวอักษร","content.title":"คำถาม","content.title.errorMessage.required":"กรุณากรอกคำถาม","content.title.placeholder":"กรุณากรอกคำถามสำหรับปัญหานี้ค่ะ","content.description.title":"คำอธิบายของปัญหา","content.description.placeholder":"กรุณากรอกคำอธิบายปัญหาอย่างละเอียดพร้อมโค้ดหรือรูปภาพ เป็นต้น","content.option.title":"ตอบ","content.option.tooltip.disabled":"การแก้ไขไม่สามารถทำได้ถ้าควิซเป็นสาธารณะหรือถ้ามีนักเรียนที่ส่งปัญหาไปแล้ว {_termPathRoleStudent} คุณสามารถตรวจสอบปัญหาที่กำหนดค่าไว้ในแท็บ {_termLibraryLecturePage} ของผู้เรียนทางซ้ายได้เลย","content.option.select.items.selectOne":"การเลือกคำตอบหลายตัวเลือก (เลือกได้เพียงหนึ่งคำตอบ)","content.option.select.items.selectMultiple":"ตัวเลือกหลายตัวเลือก (ตอบได้หลายตัวเลือก)","content.option.select.items.selectMultipleOrder":"ลากและวาง","content.option.select.items.text":"อาการที่เป็นเรื่องส่วนบุคคล","content.option.optionsSetEnabled.label":"สับเปลี่ยนลำดับคำตอบ","content.option.optionsSetEnabled.tooltip":"เมื่อเปิดใช้งานคุณลักษณะนี้ ลำดับของคำตอบจะถูกสลับสลายสำหรับแต่ละ {_termPathRoleStudent}","content.option.alert.randomized.title":"การสับเปลี่ยนลำดับของคำตอบถูกเปิดใช้งาน","content.option.alert.randomized.description":"{_termPathRoleStudent} จะเห็นการเรียงลำดับของคำตอบของพวกเขาที่สลับกัน","content.option.select.items.group":"ลากและวาง (ประเภทกลุ่ม)","content.option.statusText.dragNDrop":"หลังจากป้อนตัวเลือกเสร็จ ให้คลิกตามลำดับของคำตอบที่ถูกต้อง\nคุณสามารถเช็คปัญหาที่กำหนดค่าไว้ได้ในแท็บ {_termLibraryLecturePage} ทางซ้าย","content.option.statusText.dragNDropGroup":"คุณสามารถตรวจสอบปัญหาที่กำหนดค่าไว้ในแท็บ {_termLibraryLecturePage} ของผู้เรียนทางด้านซ้ายได้","content.option.errorMessage.required":"โปรดเลือกคำตอบ","content.answerHint.title":"ระบุข้อความในช่องข้อมูลที่แสดงคำใบ้","content.answerHint.description":"คุณสามารถระบุข้อความใบ้สำหรับช่องป้อนที่จะใส่คำตอบได้","content.answerHint.placeholder":"ป้อนข้อความในช่องใส่ข้อมูล","content.explanationInfo.title":"เขียนอธิบาย","content.explanationInfo.description":"คำอธิบายนี้จะปรากฏหลังจากปัญหาได้รับการแก้ไขแล้ว","content.explanationInfo.checkbox.label":"ใช้","content.explanationInfo.textarea.placeholder":"กรุณาใส่คำอธิบาย","content.explanationInfo.textarea.errorMessage.required":"โปรดเขียนคำอธิบายเกี่ยวกับปัญหา","option.common.select.errorMessage.required":"กรุณากรอกตัวเลือก","option.common.select.placeholder":"ป้อนตัวเลือก","option.common.select.tooltip.minOptionInfoItem":"คุณต้องป้อนตัวเลือกอย่างน้อย 2 ตัวเลือก","option.common.select.tooltip.maxOptionInfoItem":"คุณไม่สามารถป้อนตัวเลือกได้มากกว่า 20 ตัวเลือก","option.common.select.addButton":"เพิ่มตัวเลือก","option.text.answerInfo.errorMessage.required":"กรุณากรอกคำตอบที่ถูกต้อง","option.text.answerInfo.hintText":"คำตอบจะถูกให้คะแนนโดยใช้ regular expressions หากคำตอบที่ถูกต้องรวมถึง meta-characters (^[]$()|*+?{}.\\) โปรดเติมเครื่องหมาย backslash (\\) ไว้ข้างหน้า","option.text.isAutoGrade.checkbox.label":"การให้คะแนนโดยการตรวจสอบโดยไม่ระบุคำตอบ","group.option.title":"กลุ่ม","group.option.addButton":"เพิ่มกลุ่ม","group.option.errorMessage.required":"กรุณาใส่ชื่อกลุ่ม","group.option.errorMessage.notChild":"มีกลุ่มที่ถูกสร้างขึ้นแล้ว ซึ่งไม่ได้อยู่ในตัวเลือกใดๆ ","group.option.tooltip.minDisabled":"คุณต้องกำหนดค่าอย่างน้อย 2 กลุ่ม","group.option.tooltip.maxDisabled":"คุณสามารถกำหนดค่ากลุ่มได้สูงสุด 6 กลุ่ม","answer.option.errorMessage":"ต้องมีตัวเลือกหรือค่าไฟล์","answer.option.title.text":"ตัวเลือก","answer.option.title.file":"ไฟล์","answer.option.title.group":"กลุ่มที่ตัวเลือกเป็นส่วนหนึ่งของ","answer.option.addButton":"เพิ่มตัวเลือก","answer.option.file.label":"อัพโหลดไฟล์","answer.option.file.description.imageSize":"อัตราส่วนที่แนะนำสำหรับไฟล์คือ 1:1 (185 x 185px)","answer.option.file.description.fileSize":"คุณสามารถอัพโหลดไฟล์ได้สูงสุด 3MB","answer.option.file.description.extension":"รองรับสกุลไฟล์ .mp3, .mp4, .mov, .png, .jpg, .svg และ .gif","answer.option.file.errorMessage.maxSize":"คุณสามารถอัพโหลดได้สูงสุด {size}MB.","answer.option.default.group":"ไม่มี","answer.option.tooltip.minDisabled":"คุณต้องกำหนดค่าอย่างน้อย 2 ตัวเลือก","answer.option.tooltip.maxDisabled":"คุณสามารถกำหนดค่าตั้งค่าได้สูงสุด 20 ตัวเลือก"};
 
 exports.default = th;

package/cjs/components/shared/QuestionBox.js

@@ -10,6 +10,7 @@ var reactUse = require('react-use');
 var blocks = require('@elice/blocks');
 var designTokens = require('@elice/design-tokens');
 var intl = require('@elice/intl');
+var markdown = require('@elice/markdown');
 var material = require('@mui/material');
 var animateScrollTo = require('animated-scroll-to');
 var styled = require('styled-components');
@@ -72,7 +73,11 @@ var StyledQuestionBoxFooterActions = styled__default.default.div.withConfig({
 var StyledPrimaryButton = styled__default.default(blocks.Button).withConfig({
   componentId: "sc-6qfyxj-6"
 })(["background-color:", ";border-color:", ";"], designTokens.base.color.primary6, designTokens.base.color.primary6);
+var StyledMarkdownTypography = styled__default.default(markdown.MarkdownTypography).withConfig({
+  componentId: "sc-6qfyxj-7"
+})(["p{margin:0 !important;padding:0 !important;}"]);
 var QuestionBox = function QuestionBox(_a) {
+  var _b;
   var children = _a.children,
     _a$footerActions = _a.footerActions,
     footerActions = _a$footerActions === void 0 ? [] : _a$footerActions,
@@ -89,7 +94,8 @@ var QuestionBox = function QuestionBox(_a) {
   var _useMaterialQuizState = MaterialQuizContext.useMaterialQuizState(),
     vertical = _useMaterialQuizState.vertical,
     isLongPassage = _useMaterialQuizState.isLongPassage,
-    isRecommendLecture = _useMaterialQuizState.isRecommendLecture;
+    isRecommendLecture = _useMaterialQuizState.isRecommendLecture,
+    course = _useMaterialQuizState.course;
   var intersectionRef = React__default.default.useRef(null);
   var headerRef = React__default.default.useRef(null);
   var bodyRef = React__default.default.useRef(null);
@@ -148,11 +154,13 @@ var QuestionBox = function QuestionBox(_a) {
           marginRight: '0.5rem'
         },
         children: titlePrefix
-      }) : null, jsxRuntime.jsx(blocks.Text, {
-        bold: true,
-        role: "navy0",
-        size: "large",
-        wordBreak: "break-word",
+      }) : null, ((_b = course === null || course === void 0 ? void 0 : course.preference) === null || _b === void 0 ? void 0 : _b.renderMarkdownInQuizOptions) ? jsxRuntime.jsx(StyledMarkdownTypography, {
+        color: "text.primary",
+        variant: "subtitle2",
+        children: title
+      }) : jsxRuntime.jsx(material.Typography, {
+        color: "text.primary",
+        variant: "subtitle2",
         children: title
       })]
     })

package/cjs/components/shared/StyledMarkdown.js

@@ -11,6 +11,6 @@ var styled__default = /*#__PURE__*/_interopDefaultCompat(styled);
 
 var StyledMarkdown = styled__default.default(markdown.Markdown).withConfig({
   componentId: "sc-l6r531-0"
-})(["& > .elicemd{overflow:hidden;}p{margin:0 !important;}code{white-space:pre-wrap;word-break:break-all;}"]);
+})(["& > .elicemd{overflow:hidden;}p{margin:0 !important;display:flex;align-items:center;}code{white-space:pre-wrap;word-break:break-all;}"]);
 
 exports.default = StyledMarkdown;

package/cjs/helpers/index.d.ts

@@ -1,4 +1,4 @@
-import type { GetOrgLectureGetResponses, GetOrgMaterialQuizResponseGetResponses } from '@elice/types';
+import type { GetOrgLectureGetResponses, GetOrgMaterialQuizGetResponses, GetOrgMaterialQuizResponseGetResponses } from '@elice/types';
 import type { QuizOptionType } from '@elice/types/es/enums';
 import type { QuizGroupOption } from "../components/material-quiz/material-quiz-group/context/context";
 interface OptionInfo {
@@ -22,6 +22,8 @@ export declare enum QuizResultStatus {
     NotSubmitted = 4
 }
 export declare function getQuizResultStatus(materialQuizResponse?: GetOrgMaterialQuizResponseGetResponses['quizResponse']): QuizResultStatus.Correct | QuizResultStatus.Wrong | QuizResultStatus.Submitted | QuizResultStatus.NotSubmitted;
+export declare function getQuizSelectMultipleOrderOptionResultStatus(index: number, materialQuiz?: GetOrgMaterialQuizGetResponses['materialQuiz'], materialQuizResponse?: GetOrgMaterialQuizResponseGetResponses['quizResponse']): QuizResultStatus.Correct | undefined;
+export declare function getQuizSelectMultipleOptionResultStatus(index: number, materialQuiz?: GetOrgMaterialQuizGetResponses['materialQuiz']): "correct" | undefined;
 export declare const getOptionStatus: ({ isSelected, isActive, materialQuizResponse, }: {
     isSelected: boolean;
     isActive: boolean;

package/cjs/helpers/index.js

@@ -22,6 +22,22 @@ function getQuizResultStatus(materialQuizResponse) {
   }
   return exports.QuizResultStatus.NotSubmitted;
 }
+function getQuizSelectMultipleOrderOptionResultStatus(index, materialQuiz, materialQuizResponse) {
+  var _a;
+  var userAnswer = materialQuizResponse === null || materialQuizResponse === void 0 ? void 0 : materialQuizResponse.answer[index];
+  var correctAnswer = (_a = materialQuiz === null || materialQuiz === void 0 ? void 0 : materialQuiz.answerInfo) === null || _a === void 0 ? void 0 : _a[index];
+  if (userAnswer === correctAnswer) {
+    return exports.QuizResultStatus.Correct;
+  }
+  return;
+}
+function getQuizSelectMultipleOptionResultStatus(index, materialQuiz) {
+  var answerInfo = materialQuiz === null || materialQuiz === void 0 ? void 0 : materialQuiz.answerInfo;
+  if (answerInfo.includes(index)) {
+    return 'correct';
+  }
+  return;
+}
 var getOptionStatus = function getOptionStatus(_ref) {
   var isSelected = _ref.isSelected,
     isActive = _ref.isActive,
@@ -77,4 +93,6 @@ exports.checkUserLectureTestEnded = checkUserLectureTestEnded;
 exports.getOptionStatus = getOptionStatus;
 exports.getQuizResult = getQuizResult;
 exports.getQuizResultStatus = getQuizResultStatus;
+exports.getQuizSelectMultipleOptionResultStatus = getQuizSelectMultipleOptionResultStatus;
+exports.getQuizSelectMultipleOrderOptionResultStatus = getQuizSelectMultipleOrderOptionResultStatus;
 exports.shouldResetOptions = shouldResetOptions;

package/cjs/hooks/useCaculatePassage.js

@@ -4,7 +4,6 @@ var _rollupPluginBabelHelpers = require('../_virtual/_rollupPluginBabelHelpers.j
 var React = require('react');
 var reactUse = require('react-use');
 var MaterialQuizContext = require('../components/material-quiz/context/MaterialQuizContext.js');
-var element = require('../constant/element.js');
 
 var useCaculatePassage = function useCaculatePassage() {
   var _useMaterialQuizState = MaterialQuizContext.useMaterialQuizState(),
@@ -14,18 +13,17 @@ var useCaculatePassage = function useCaculatePassage() {
     setIsLongPassage = _useMaterialQuizDispa.setIsLongPassage,
     setIsInitialLoading = _useMaterialQuizDispa.setIsInitialLoading;
   var _useMeasure = reactUse.useMeasure(),
-    _useMeasure2 = _rollupPluginBabelHelpers.slicedToArray(_useMeasure, 2),
-    questionRef = _useMeasure2[0],
-    questionDetailHeight = _useMeasure2[1].height;
+    _useMeasure2 = _rollupPluginBabelHelpers.slicedToArray(_useMeasure, 1),
+    questionRef = _useMeasure2[0];
   var _useMeasure3 = reactUse.useMeasure(),
     _useMeasure4 = _rollupPluginBabelHelpers.slicedToArray(_useMeasure3, 2),
     containerRef = _useMeasure4[0],
     containerHeight = _useMeasure4[1].height;
   React.useEffect(function () {
-    var _a, _b;
-    var currentContainerHeight = vertical ? (_b = (_a = document.getElementById(element.MATERIAL_QUIZ_CONTAINER_ID)) === null || _a === void 0 ? void 0 : _a.offsetHeight) !== null && _b !== void 0 ? _b : 0 : containerHeight;
-    if (currentContainerHeight && questionDetailHeight && materialQuiz) {
-      setIsLongPassage(questionDetailHeight > currentContainerHeight);
+    if (materialQuiz && materialQuiz.questionDescription) {
+      // Make always long passage true for horizontal layout
+      // ref: https://elicer.atlassian.net/browse/LXP-4406
+      setIsLongPassage(true);
       // add timeout for forcing caculate layout and render in the parent
       // finish before turning off loading
       setTimeout(function () {
@@ -34,7 +32,7 @@ var useCaculatePassage = function useCaculatePassage() {
     } else if (materialQuiz && !materialQuiz.questionDescription) {
       setIsInitialLoading(false);
     }
-  }, [containerHeight, questionDetailHeight, materialQuiz, setIsLongPassage, vertical, setIsInitialLoading]);
+  }, [containerHeight, materialQuiz, setIsLongPassage, vertical, setIsInitialLoading]);
   return {
     questionRef: questionRef,
     containerRef: containerRef

package/es/components/material-quiz/MaterialQuiz.js

@@ -97,7 +97,9 @@ var MaterialQuiz = function MaterialQuiz() {
   var isRenderQuestionWithPassage = (vertical || !isLongPassage || isQuizGroupType) && !!materialQuiz;
   React.useEffect(function () {
     if (debouncedWidth > 0) {
-      setVertical(debouncedWidth <= base.screen.medium);
+      // Make always vertical false for horizontal layout
+      // ref: https://elicer.atlassian.net/browse/LXP-4406
+      setVertical(false);
     }
   }, [debouncedWidth, setVertical]);
   var renderQuestionOption = function renderQuestionOption() {

package/es/components/material-quiz/MaterialQuizAnswerExplanation.js

@@ -27,6 +27,7 @@ var MaterialQuizAnswerExplanation = function MaterialQuizAnswerExplanation() {
     margintop: "1rem",
     children: jsx(StyledAccordion, {
       dark: true,
+      defaultExpanded: true,
       header: jsx(Text, {
         bold: true,
         role: "navy0",

package/es/components/material-quiz/MaterialQuizSelectMultiple.js

@@ -6,7 +6,7 @@ import { base } from '@elice/design-tokens';
 import { useRawEliceIntl } from '@elice/intl';
 import { useTheme, Stack } from '@mui/material';
 import { MATERIAL_QUIZ_PASSIVE_ID, MATERIAL_QUIZ_ANSWER_ID } from '../../constant/element.js';
-import { checkUserLectureTestEnded, shouldResetOptions, getOptionStatus, getQuizResult } from '../../helpers/index.js';
+import { checkUserLectureTestEnded, shouldResetOptions, getQuizSelectMultipleOptionResultStatus, getOptionStatus, getQuizResult } from '../../helpers/index.js';
 import { useCaculatePassage } from '../../hooks/useCaculatePassage.js';
 import '../shared/QuizDraggbleDroppedOption.js';
 import '../shared/QuizDraggbleDummyOption.js';
@@ -241,7 +241,7 @@ var MaterialQuizSelectMultiple = function MaterialQuizSelectMultiple(_ref) {
               var materialQuizResponseAnswer = materialQuizResponse.answer;
               return (_a = materialQuizResponseAnswer.includes(index)) !== null && _a !== void 0 ? _a : false;
             };
-            var status = getOptionStatus({
+            var status = getQuizSelectMultipleOptionResultStatus(index, materialQuiz) || getOptionStatus({
               materialQuizResponse: materialQuizResponse,
               isSelected: getIsSelected(index, materialQuizResponse),
               isActive: isActive

package/es/components/material-quiz/MaterialQuizSelectMultipleOrder.js

@@ -10,7 +10,7 @@ import { useRawEliceIntl } from '@elice/intl';
 import { useTheme, Stack } from '@mui/material';
 import styled from 'styled-components';
 import { MATERIAL_QUIZ_PASSIVE_ID, MATERIAL_QUIZ_ANSWER_ID } from '../../constant/element.js';
-import { checkUserLectureTestEnded, getQuizResultStatus, QuizResultStatus, getQuizResult } from '../../helpers/index.js';
+import { checkUserLectureTestEnded, getQuizSelectMultipleOrderOptionResultStatus, getQuizResultStatus, QuizResultStatus, getQuizResult } from '../../helpers/index.js';
 import { useCaculatePassage } from '../../hooks/useCaculatePassage.js';
 import EbDroppable from '../eb-sortable/EbDroppable.js';
 import QuestionBox from '../shared/QuestionBox.js';
@@ -496,10 +496,11 @@ var MaterialQuizSelectMultipleOrder = function MaterialQuizSelectMultipleOrder(_
     return jsx(StyledQuizAnswersDropZone, {
       children: answerList.map(function (option, index) {
         var getRole = function getRole() {
+          var _a;
           if (isActive) {
             return 'default';
           }
-          var status = getQuizResultStatus(materialQuizResponse);
+          var status = (_a = getQuizSelectMultipleOrderOptionResultStatus(index, materialQuiz, materialQuizResponse)) !== null && _a !== void 0 ? _a : getQuizResultStatus(materialQuizResponse);
           switch (status) {
             case QuizResultStatus.Correct:
               return 'correct';

package/es/components/material-quiz/locales/th.json.js

@@ -1,3 +1,3 @@
-var th = {"materialQuiz.anchorLabel.question":"ทางเดิน","materialQuiz.anchorLabel.answer":"ดคำตอบ","materialQuiz.error":"เกิดข้อผิดพลาดในการโหลดข้อสอบ กรุณาลองอีกครั้งในภายหลัง","materialQuiz.submit":"ส่ง","materialQuiz.resubmit":"ส่งอีกครั้ง","materialQuiz.submittedAnswer":"คำตอบที่ส่ง","materialQuiz.answer":"ตอบ","materialQuiz.next":"ไปยังข้อถัดไป >","materialQuiz.selectOne.answer.title":"เลือกคำตอบจากตัวเลือกด้านล่าง","materialQuiz.selectMultiple.answer.title":"เลือกคำตอบจากตัวเลือกด้านล่าง (สามารถเลือกได้หลายข้อ)","materialQuiz.selectMultipleOrder.answer.title":"ลากและวางคำตอบของคุณ","materialQuiz.text.answer.title":"กรุณาเขียนคำตอบของคุณ","materialQuiz.empty.title":"ข้อสอบยังไม่พร้อมใช้งาน","materialQuiz.empty.description":"กรุณาลองอีกครั้งหลังจากเผยแพร่ข้อสอบ!","materialQuiz.survey.empty.title":"แบบสำรวจยังไม่พร้อมใช้งาน","materialQuiz.survey.empty.description":"โปรดตรวจสอบอีกครั้งหลังจากโพสต์แบบสำรวจ!","materialQuiz.submitStatus.success":"ส่งเรียบร้อยแล้ว","materialQuiz.submitStatus.failure":"ส่งล้มเหลว","materialQuiz.resultStatus.correct":"ถูกต้อง","materialQuiz.resultStatus.wrong":"กรุณาลองแก้ปัญหาอีกครั้ง","materialQuiz.resultStatus.submitted":"ส่งคำตอบแล้ว","materialQuiz.explanation.close":"ปิดคำอธิบาย","materialQuiz.explanation.show":"ดูคำอธิบาย","materialQuiz.explanation.empty":"ไม่มีคำอธิบาย","materialQuiz.text.placeholder":"กรุณากรอกคำตอบ","materialQuiz.text.correct":"ถูกต้อง!","materialQuiz.text.wrong":"นั่นผิด ลองอีกครั้ง!","materialQuiz.order.answerEmpty":"คุณสามารถย้ายตัวเลือกกลับมาที่นี่ได้","materialQuiz.bottomSheet.title":"ตัวเลือก","materialQuiz.bottomSheet.optionEmpty":"คุณได้จัดเรียงตัวเลือกทั้งหมดลงในกลุ่มแล้ว","materialQuiz.dropzone.desktop.answerEmpty":"ลากและวางตัวเลือกของคุณลงในพื้นที่นี้","materialQuiz.dropzone.mobile.answerEmpty":"แตะที่นี่เพื่อใส่ตัวเลือก","materialQuiz.dropzone.optionEmpty":"ตัวเลือก","materialQuiz.dropzone.optionReset":"รีเซ็ตคำตอบ"};
+var th = {"materialQuiz.anchorLabel.question":"ทางเดิน","materialQuiz.anchorLabel.answer":"ดคำตอบ","materialQuiz.error":"ไม่สามารถดึงควิซได้","materialQuiz.submit":"ส่งใบสมัคร","materialQuiz.resubmit":"ส่งอีกครั้ง","materialQuiz.submittedAnswer":"ฉันสามารถตอบคำถามเช่นนี้ได้","materialQuiz.answer":"ตอบ","materialQuiz.next":"คำถามถัดไป >","materialQuiz.selectOne.answer.title":"เลือกจากมุมมองด้านล่างนี้","materialQuiz.selectMultiple.answer.title":"เลือกจากรายการด้านล่าง (มีการเลือกที่ซ้ำซ้อน)","materialQuiz.selectMultipleOrder.answer.title":"ลากและวางคำตอบของคุณ","materialQuiz.text.answer.title":"กรุณากรอกคำตอบ","materialQuiz.empty.title":"ควิซกำลังเตรียมอยู่ตอนนี้","materialQuiz.empty.description":"โปรดตรวจสอบอีกครั้งหลังจากโพสต์ควิซ!","materialQuiz.survey.empty.title":"การสำรวจกำลังเตรียมการอยู่ค่ะ","materialQuiz.survey.empty.description":"โปรดตรวจสอบอีกครั้งหลังจากโพสต์แบบสำรวจ!","materialQuiz.submitStatus.success":"เสนอ","materialQuiz.submitStatus.failure":"การส่งล้มเหลว","materialQuiz.resultStatus.correct":"ถูกต้อง","materialQuiz.resultStatus.wrong":"กรุณาลองแก้ปัญหาอีกครั้ง","materialQuiz.resultStatus.submitted":"เสนอ","materialQuiz.explanation.close":"ปิดคำอธิบายควิซ","materialQuiz.explanation.show":"แสดงคำอธิบายของควิซ","materialQuiz.explanation.empty":"ไม่ให้อธิบาย","materialQuiz.text.placeholder":"กรุณากรอกคำตอบ","materialQuiz.text.correct":"ถูกต้อง!","materialQuiz.text.wrong":"นั่นผิด ลองอีกครั้ง!","materialQuiz.order.answerEmpty":"คุณสามารถย้ายตัวเลือกกลับมาที่นี่ได้","materialQuiz.bottomSheet.title":"ตัวเลือก","materialQuiz.bottomSheet.optionEmpty":"ทุกมุมมองได้ถูกวางไว้ในกลุ่มแล้ว","materialQuiz.dropzone.desktop.answerEmpty":"ลากมุมมองเข้าสู่พื้นที่","materialQuiz.dropzone.mobile.answerEmpty":"คลิกที่นี่เพื่อเพิ่มมุมมอง","materialQuiz.dropzone.optionEmpty":"ตัวเลือก","materialQuiz.dropzone.optionReset":"รีเซ็ตคำตอบ"};
 
 export { th as default };

package/es/components/material-quiz-edit/locales/th.json.js

@@ -1,3 +1,3 @@
-var th = {"common.option":"ตัวเลือก {number}","common.group":"กลุ่ม {group}","common.errorMessage.range":"กรุณาใส่ข้อมูล {min} ~ {max} ตัวอักษร","content.title":"คำถาม","content.title.errorMessage.required":"กรุณากรอกคำถาม","content.title.placeholder":"กรุณากรอกคำถามสำหรับปัญหานี้ค่ะ","content.description.title":"คำอธิบายของปัญหา","content.description.placeholder":"กรุณากรอกคำอธิบายปัญหาอย่างละเอียดพร้อมโค้ดหรือรูปภาพ เป็นต้น","content.option.title":"ตอบ","content.option.tooltip.disabled":"ไม่สามารถแก้ไขได้หากมี {_termPathRoleStudent} ส่งคำตอบแล้ว หรือข้อสอบถูกเผยแพร่","content.option.select.items.selectOne":"การเลือกคำตอบหลายตัวเลือก (เลือกได้เพียงหนึ่งคำตอบ)","content.option.select.items.selectMultiple":"ตัวเลือกหลายตัวเลือก (ตอบได้หลายตัวเลือก)","content.option.select.items.selectMultipleOrder":"ลากและวาง","content.option.select.items.text":"ข้อความ","content.option.optionsSetEnabled.label":"สุ่มลำดับคำตอบ","content.option.optionsSetEnabled.tooltip":"เปิดใช้งานฟังก์ชันนี้เพื่อสุ่มลำดับคำตอบให้ {_termPathRoleStudent} แต่ละคน","content.option.alert.randomized.title":"เปิดใช้งานการสุ่มลำดับคำตอบ","content.option.alert.randomized.description":"คำตอบจะแสดงสุ่มลำดับให้ {_termPathRoleStudent}","content.option.select.items.group":"ลากและวาง (ประเภทกลุ่ม)","content.option.statusText.dragNDrop":"ใส่ตัวเลือกแล้วคลิกตามลำดับคำตอบที่ถูกต้อง\nตรวจสอบปัญหาที่สร้างไว้ได้ที่แท็บ 'เรียนรู้ {_termLibraryLecturePage}' ทางซ้าย","content.option.statusText.dragNDropGroup":"ตรวจสอบปัญหาที่สร้างไว้ได้ที่แท็บ 'เรียนรู้ {_termLibraryLecturePage}' ทางซ้าย","content.option.errorMessage.required":"กรุณาเลือกคำตอบ","content.answerHint.title":"ตั้งค่าข้อความแนะนำในช่องตอบ","content.answerHint.description":"ตั้งค่าข้อความแนะนำสำหรับช่องตอบที่ผู้ใช้ใส่คำตอบ","content.answerHint.placeholder":"ใส่ข้อความแนะนำ","content.explanationInfo.title":"เขียนอธิบาย","content.explanationInfo.description":"คำอธิบายนี้จะปรากฏหลังจากปัญหาได้รับการแก้ไขแล้ว","content.explanationInfo.checkbox.label":"เปิดใช้งาน","content.explanationInfo.textarea.placeholder":"กรุณาใส่คำอธิบาย","content.explanationInfo.textarea.errorMessage.required":"โปรดเขียนคำอธิบายเกี่ยวกับปัญหา","option.common.select.errorMessage.required":"กรุณากรอกตัวเลือก","option.common.select.placeholder":"ป้อนตัวเลือก","option.common.select.tooltip.minOptionInfoItem":"คุณต้องป้อนตัวเลือกอย่างน้อย 2 ตัวเลือก","option.common.select.tooltip.maxOptionInfoItem":"คุณไม่สามารถป้อนตัวเลือกได้มากกว่า 20 ตัวเลือก","option.common.select.addButton":"เพิ่มตัวเลือก","option.text.answerInfo.errorMessage.required":"กรุณากรอกคำตอบที่ถูกต้อง","option.text.answerInfo.hintText":"คำตอบจะถูกให้คะแนนโดยใช้ regular expressions หากคำตอบที่ถูกต้องรวมถึง meta-characters (^[]$()|*+?{}.\\) โปรดเติมเครื่องหมาย backslash (\\) ไว้ข้างหน้า","option.text.isAutoGrade.checkbox.label":"การให้คะแนนโดยการตรวจสอบโดยไม่ระบุคำตอบ","group.option.title":"กลุ่ม","group.option.addButton":"เพิ่มกลุ่ม","group.option.errorMessage.required":"กรุณาใส่ชื่อกลุ่ม","group.option.errorMessage.notChild":"มีกลุ่มที่ถูกสร้างขึ้นแล้ว ซึ่งไม่ได้อยู่ในตัวเลือกใดๆ ","group.option.tooltip.minDisabled":"คุณต้องกำหนดค่าอย่างน้อย 2 กลุ่ม","group.option.tooltip.maxDisabled":"คุณสามารถกำหนดค่ากลุ่มได้สูงสุด 6 กลุ่ม","answer.option.errorMessage":"ต้องมีตัวเลือกหรือไฟล์","answer.option.title.text":"ตัวเลือก","answer.option.title.file":"ไฟล์","answer.option.title.group":"กลุ่มที่ตัวเลือกอยู่","answer.option.addButton":"เพิ่มตัวเลือก","answer.option.file.label":"อัพโหลดไฟล์","answer.option.file.description.imageSize":"ขนาดภาพที่แนะนำ: 1:1 (185 x 185 พิกเซล)","answer.option.file.description.fileSize":"คุณสามารถอัพโหลดไฟล์ได้สูงสุด 3MB","answer.option.file.description.extension":"รองรับสกุลไฟล์ .mp3, .mp4, .mov, .png, .jpg, .svg และ .gif","answer.option.file.errorMessage.maxSize":"คุณสามารถอัพโหลดได้สูงสุด {size}MB.","answer.option.default.group":"ไม่มี","answer.option.tooltip.minDisabled":"คุณต้องกำหนดค่าอย่างน้อย 2 ตัวเลือก","answer.option.tooltip.maxDisabled":"คุณสามารถสร้างตัวเลือกได้สูงสุด 20 ตัวเลือก"};
+var th = {"common.option":"ตัวเลือก {number}","common.group":"กลุ่ม {group}","common.errorMessage.range":"กรุณากรอกภายใน {min} ~ {max} ตัวอักษร","content.title":"คำถาม","content.title.errorMessage.required":"กรุณากรอกคำถาม","content.title.placeholder":"กรุณากรอกคำถามสำหรับปัญหานี้ค่ะ","content.description.title":"คำอธิบายของปัญหา","content.description.placeholder":"กรุณากรอกคำอธิบายปัญหาอย่างละเอียดพร้อมโค้ดหรือรูปภาพ เป็นต้น","content.option.title":"ตอบ","content.option.tooltip.disabled":"การแก้ไขไม่สามารถทำได้ถ้าควิซเป็นสาธารณะหรือถ้ามีนักเรียนที่ส่งปัญหาไปแล้ว {_termPathRoleStudent} คุณสามารถตรวจสอบปัญหาที่กำหนดค่าไว้ในแท็บ {_termLibraryLecturePage} ของผู้เรียนทางซ้ายได้เลย","content.option.select.items.selectOne":"การเลือกคำตอบหลายตัวเลือก (เลือกได้เพียงหนึ่งคำตอบ)","content.option.select.items.selectMultiple":"ตัวเลือกหลายตัวเลือก (ตอบได้หลายตัวเลือก)","content.option.select.items.selectMultipleOrder":"ลากและวาง","content.option.select.items.text":"อาการที่เป็นเรื่องส่วนบุคคล","content.option.optionsSetEnabled.label":"สับเปลี่ยนลำดับคำตอบ","content.option.optionsSetEnabled.tooltip":"เมื่อเปิดใช้งานคุณลักษณะนี้ ลำดับของคำตอบจะถูกสลับสลายสำหรับแต่ละ {_termPathRoleStudent}","content.option.alert.randomized.title":"การสับเปลี่ยนลำดับของคำตอบถูกเปิดใช้งาน","content.option.alert.randomized.description":"{_termPathRoleStudent} จะเห็นการเรียงลำดับของคำตอบของพวกเขาที่สลับกัน","content.option.select.items.group":"ลากและวาง (ประเภทกลุ่ม)","content.option.statusText.dragNDrop":"หลังจากป้อนตัวเลือกเสร็จ ให้คลิกตามลำดับของคำตอบที่ถูกต้อง\nคุณสามารถเช็คปัญหาที่กำหนดค่าไว้ได้ในแท็บ {_termLibraryLecturePage} ทางซ้าย","content.option.statusText.dragNDropGroup":"คุณสามารถตรวจสอบปัญหาที่กำหนดค่าไว้ในแท็บ {_termLibraryLecturePage} ของผู้เรียนทางด้านซ้ายได้","content.option.errorMessage.required":"โปรดเลือกคำตอบ","content.answerHint.title":"ระบุข้อความในช่องข้อมูลที่แสดงคำใบ้","content.answerHint.description":"คุณสามารถระบุข้อความใบ้สำหรับช่องป้อนที่จะใส่คำตอบได้","content.answerHint.placeholder":"ป้อนข้อความในช่องใส่ข้อมูล","content.explanationInfo.title":"เขียนอธิบาย","content.explanationInfo.description":"คำอธิบายนี้จะปรากฏหลังจากปัญหาได้รับการแก้ไขแล้ว","content.explanationInfo.checkbox.label":"ใช้","content.explanationInfo.textarea.placeholder":"กรุณาใส่คำอธิบาย","content.explanationInfo.textarea.errorMessage.required":"โปรดเขียนคำอธิบายเกี่ยวกับปัญหา","option.common.select.errorMessage.required":"กรุณากรอกตัวเลือก","option.common.select.placeholder":"ป้อนตัวเลือก","option.common.select.tooltip.minOptionInfoItem":"คุณต้องป้อนตัวเลือกอย่างน้อย 2 ตัวเลือก","option.common.select.tooltip.maxOptionInfoItem":"คุณไม่สามารถป้อนตัวเลือกได้มากกว่า 20 ตัวเลือก","option.common.select.addButton":"เพิ่มตัวเลือก","option.text.answerInfo.errorMessage.required":"กรุณากรอกคำตอบที่ถูกต้อง","option.text.answerInfo.hintText":"คำตอบจะถูกให้คะแนนโดยใช้ regular expressions หากคำตอบที่ถูกต้องรวมถึง meta-characters (^[]$()|*+?{}.\\) โปรดเติมเครื่องหมาย backslash (\\) ไว้ข้างหน้า","option.text.isAutoGrade.checkbox.label":"การให้คะแนนโดยการตรวจสอบโดยไม่ระบุคำตอบ","group.option.title":"กลุ่ม","group.option.addButton":"เพิ่มกลุ่ม","group.option.errorMessage.required":"กรุณาใส่ชื่อกลุ่ม","group.option.errorMessage.notChild":"มีกลุ่มที่ถูกสร้างขึ้นแล้ว ซึ่งไม่ได้อยู่ในตัวเลือกใดๆ ","group.option.tooltip.minDisabled":"คุณต้องกำหนดค่าอย่างน้อย 2 กลุ่ม","group.option.tooltip.maxDisabled":"คุณสามารถกำหนดค่ากลุ่มได้สูงสุด 6 กลุ่ม","answer.option.errorMessage":"ต้องมีตัวเลือกหรือค่าไฟล์","answer.option.title.text":"ตัวเลือก","answer.option.title.file":"ไฟล์","answer.option.title.group":"กลุ่มที่ตัวเลือกเป็นส่วนหนึ่งของ","answer.option.addButton":"เพิ่มตัวเลือก","answer.option.file.label":"อัพโหลดไฟล์","answer.option.file.description.imageSize":"อัตราส่วนที่แนะนำสำหรับไฟล์คือ 1:1 (185 x 185px)","answer.option.file.description.fileSize":"คุณสามารถอัพโหลดไฟล์ได้สูงสุด 3MB","answer.option.file.description.extension":"รองรับสกุลไฟล์ .mp3, .mp4, .mov, .png, .jpg, .svg และ .gif","answer.option.file.errorMessage.maxSize":"คุณสามารถอัพโหลดได้สูงสุด {size}MB.","answer.option.default.group":"ไม่มี","answer.option.tooltip.minDisabled":"คุณต้องกำหนดค่าอย่างน้อย 2 ตัวเลือก","answer.option.tooltip.maxDisabled":"คุณสามารถกำหนดค่าตั้งค่าได้สูงสุด 20 ตัวเลือก"};
 
 export { th as default };

package/es/components/shared/QuestionBox.js

@@ -6,7 +6,8 @@ import { useIntersection } from 'react-use';
 import { Button, Flex, Text, Box } from '@elice/blocks';
 import { base } from '@elice/design-tokens';
 import { useRawEliceIntl } from '@elice/intl';
-import { useTheme } from '@mui/material';
+import { MarkdownTypography } from '@elice/markdown';
+import { useTheme, Typography } from '@mui/material';
 import animateScrollTo from 'animated-scroll-to';
 import styled from 'styled-components';
 import { MATERIAL_QUIZ_ANSWER_ID, MATERIAL_QUIZ_PASSIVE_ID } from '../../constant/element.js';
@@ -62,7 +63,11 @@ var StyledQuestionBoxFooterActions = styled.div.withConfig({
 var StyledPrimaryButton = styled(Button).withConfig({
   componentId: "sc-6qfyxj-6"
 })(["background-color:", ";border-color:", ";"], base.color.primary6, base.color.primary6);
+var StyledMarkdownTypography = styled(MarkdownTypography).withConfig({
+  componentId: "sc-6qfyxj-7"
+})(["p{margin:0 !important;padding:0 !important;}"]);
 var QuestionBox = function QuestionBox(_a) {
+  var _b;
   var children = _a.children,
     _a$footerActions = _a.footerActions,
     footerActions = _a$footerActions === void 0 ? [] : _a$footerActions,
@@ -79,7 +84,8 @@ var QuestionBox = function QuestionBox(_a) {
   var _useMaterialQuizState = useMaterialQuizState(),
     vertical = _useMaterialQuizState.vertical,
     isLongPassage = _useMaterialQuizState.isLongPassage,
-    isRecommendLecture = _useMaterialQuizState.isRecommendLecture;
+    isRecommendLecture = _useMaterialQuizState.isRecommendLecture,
+    course = _useMaterialQuizState.course;
   var intersectionRef = React.useRef(null);
   var headerRef = React.useRef(null);
   var bodyRef = React.useRef(null);
@@ -138,11 +144,13 @@ var QuestionBox = function QuestionBox(_a) {
           marginRight: '0.5rem'
         },
         children: titlePrefix
-      }) : null, jsx(Text, {
-        bold: true,
-        role: "navy0",
-        size: "large",
-        wordBreak: "break-word",
+      }) : null, ((_b = course === null || course === void 0 ? void 0 : course.preference) === null || _b === void 0 ? void 0 : _b.renderMarkdownInQuizOptions) ? jsx(StyledMarkdownTypography, {
+        color: "text.primary",
+        variant: "subtitle2",
+        children: title
+      }) : jsx(Typography, {
+        color: "text.primary",
+        variant: "subtitle2",
         children: title
       })]
     })

package/es/components/shared/StyledMarkdown.js

@@ -3,6 +3,6 @@ import styled from 'styled-components';
 
 var StyledMarkdown = styled(Markdown).withConfig({
   componentId: "sc-l6r531-0"
-})(["& > .elicemd{overflow:hidden;}p{margin:0 !important;}code{white-space:pre-wrap;word-break:break-all;}"]);
+})(["& > .elicemd{overflow:hidden;}p{margin:0 !important;display:flex;align-items:center;}code{white-space:pre-wrap;word-break:break-all;}"]);
 
 export { StyledMarkdown as default };

package/es/helpers/index.d.ts

@@ -1,4 +1,4 @@
-import type { GetOrgLectureGetResponses, GetOrgMaterialQuizResponseGetResponses } from '@elice/types';
+import type { GetOrgLectureGetResponses, GetOrgMaterialQuizGetResponses, GetOrgMaterialQuizResponseGetResponses } from '@elice/types';
 import type { QuizOptionType } from '@elice/types/es/enums';
 import type { QuizGroupOption } from "../components/material-quiz/material-quiz-group/context/context";
 interface OptionInfo {
@@ -22,6 +22,8 @@ export declare enum QuizResultStatus {
     NotSubmitted = 4
 }
 export declare function getQuizResultStatus(materialQuizResponse?: GetOrgMaterialQuizResponseGetResponses['quizResponse']): QuizResultStatus.Correct | QuizResultStatus.Wrong | QuizResultStatus.Submitted | QuizResultStatus.NotSubmitted;
+export declare function getQuizSelectMultipleOrderOptionResultStatus(index: number, materialQuiz?: GetOrgMaterialQuizGetResponses['materialQuiz'], materialQuizResponse?: GetOrgMaterialQuizResponseGetResponses['quizResponse']): QuizResultStatus.Correct | undefined;
+export declare function getQuizSelectMultipleOptionResultStatus(index: number, materialQuiz?: GetOrgMaterialQuizGetResponses['materialQuiz']): "correct" | undefined;
 export declare const getOptionStatus: ({ isSelected, isActive, materialQuizResponse, }: {
     isSelected: boolean;
     isActive: boolean;

package/es/helpers/index.js

@@ -20,6 +20,22 @@ function getQuizResultStatus(materialQuizResponse) {
   }
   return QuizResultStatus.NotSubmitted;
 }
+function getQuizSelectMultipleOrderOptionResultStatus(index, materialQuiz, materialQuizResponse) {
+  var _a;
+  var userAnswer = materialQuizResponse === null || materialQuizResponse === void 0 ? void 0 : materialQuizResponse.answer[index];
+  var correctAnswer = (_a = materialQuiz === null || materialQuiz === void 0 ? void 0 : materialQuiz.answerInfo) === null || _a === void 0 ? void 0 : _a[index];
+  if (userAnswer === correctAnswer) {
+    return QuizResultStatus.Correct;
+  }
+  return;
+}
+function getQuizSelectMultipleOptionResultStatus(index, materialQuiz) {
+  var answerInfo = materialQuiz === null || materialQuiz === void 0 ? void 0 : materialQuiz.answerInfo;
+  if (answerInfo.includes(index)) {
+    return 'correct';
+  }
+  return;
+}
 var getOptionStatus = function getOptionStatus(_ref) {
   var isSelected = _ref.isSelected,
     isActive = _ref.isActive,
@@ -70,4 +86,4 @@ var addAltTextToImage = function addAltTextToImage(_ref3) {
   return content === null || content === void 0 ? void 0 : content.replace(regex, "![".concat(title, "]($1)"));
 };
 
-export { QuizResultStatus, addAltTextToImage, checkUserLectureTestEnded, getOptionStatus, getQuizResult, getQuizResultStatus, shouldResetOptions };
+export { QuizResultStatus, addAltTextToImage, checkUserLectureTestEnded, getOptionStatus, getQuizResult, getQuizResultStatus, getQuizSelectMultipleOptionResultStatus, getQuizSelectMultipleOrderOptionResultStatus, shouldResetOptions };

package/es/hooks/useCaculatePassage.js

@@ -2,7 +2,6 @@ import { slicedToArray as _slicedToArray } from '../_virtual/_rollupPluginBabelH
 import { useEffect } from 'react';
 import { useMeasure } from 'react-use';
 import { useMaterialQuizState, useMaterialQuizDispatch } from '../components/material-quiz/context/MaterialQuizContext.js';
-import { MATERIAL_QUIZ_CONTAINER_ID } from '../constant/element.js';
 
 var useCaculatePassage = function useCaculatePassage() {
   var _useMaterialQuizState = useMaterialQuizState(),
@@ -12,18 +11,17 @@ var useCaculatePassage = function useCaculatePassage() {
     setIsLongPassage = _useMaterialQuizDispa.setIsLongPassage,
     setIsInitialLoading = _useMaterialQuizDispa.setIsInitialLoading;
   var _useMeasure = useMeasure(),
-    _useMeasure2 = _slicedToArray(_useMeasure, 2),
-    questionRef = _useMeasure2[0],
-    questionDetailHeight = _useMeasure2[1].height;
+    _useMeasure2 = _slicedToArray(_useMeasure, 1),
+    questionRef = _useMeasure2[0];
   var _useMeasure3 = useMeasure(),
     _useMeasure4 = _slicedToArray(_useMeasure3, 2),
     containerRef = _useMeasure4[0],
     containerHeight = _useMeasure4[1].height;
   useEffect(function () {
-    var _a, _b;
-    var currentContainerHeight = vertical ? (_b = (_a = document.getElementById(MATERIAL_QUIZ_CONTAINER_ID)) === null || _a === void 0 ? void 0 : _a.offsetHeight) !== null && _b !== void 0 ? _b : 0 : containerHeight;
-    if (currentContainerHeight && questionDetailHeight && materialQuiz) {
-      setIsLongPassage(questionDetailHeight > currentContainerHeight);
+    if (materialQuiz && materialQuiz.questionDescription) {
+      // Make always long passage true for horizontal layout
+      // ref: https://elicer.atlassian.net/browse/LXP-4406
+      setIsLongPassage(true);
       // add timeout for forcing caculate layout and render in the parent
       // finish before turning off loading
       setTimeout(function () {
@@ -32,7 +30,7 @@ var useCaculatePassage = function useCaculatePassage() {
     } else if (materialQuiz && !materialQuiz.questionDescription) {
       setIsInitialLoading(false);
     }
-  }, [containerHeight, questionDetailHeight, materialQuiz, setIsLongPassage, vertical, setIsInitialLoading]);
+  }, [containerHeight, materialQuiz, setIsLongPassage, vertical, setIsInitialLoading]);
   return {
     questionRef: questionRef,
     containerRef: containerRef

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@elice/material-quiz",
-  "version": "1.240912.1",
+  "version": "1.241004.0-aidt.2",
   "description": "User view and editing components of Elice material quiz",
   "repository": "https://git.elicer.io/elice/frontend/library/elice-material",
   "license": "UNLICENSED",
@@ -55,6 +55,7 @@
     "jquery": "^3.6.0",
     "jquery-ui": "^1.13.1",
     "lodash-es": "^4.17.21",
+    "marked": "^14.1.2",
     "react-hook-form": "~7.45.4",
     "react-transition-group": "^4.4.0",
     "tslib": "^2.6.1"
@@ -67,14 +68,14 @@
     "@elice/icons": "^1.230814.0",
     "@elice/icons-legacy": "npm:@elice/icons@0.230814.0",
     "@elice/intl": "0.240425.0-rc.2",
-    "@elice/markdown": "^1.240124.0",
-    "@elice/material-shared-types": "1.240912.1",
-    "@elice/material-shared-utils": "1.240912.1",
+    "@elice/markdown": "1.241007.0-aidt.0",
+    "@elice/material-shared-types": "1.241004.0-aidt.2",
+    "@elice/material-shared-utils": "1.241004.0-aidt.2",
     "@elice/mui-elements": "^5.240820.0",
     "@elice/mui-system": "^5.240820.0",
     "@elice/openapi-client-course": "^1.230814.0",
     "@elice/types": "1.240709.0",
-    "@elice/wysiwyg": "1.240716.1",
+    "@elice/wysiwyg": "1.241004.0-aidt.0",
     "@emotion/react": "^11.10.5",
     "@emotion/styled": "^11.10.5",
     "@fortawesome/pro-regular-svg-icons": "^6.4.2",