@gamelearn/arcade-components 2.23.10 → 2.24.0

package/dist/components/auto-evaluation-component/components/AutoEvaluation.js

@@ -183,9 +183,8 @@ var AutoEvaluation = function AutoEvaluation(_ref) {
     className: "survey--questions__container",
     "aria-label": "survey questions container"
   }, /*#__PURE__*/_react.default.createElement("div", {
-    className: "survey--questions__count",
-    "aria-label": "survey questions count"
-  }, /*#__PURE__*/_react.default.createElement("span", null, translate('auto-evaluation.question'), "\xA0", currentQuestion + 1, " ", translate('storylines.misc.of'), " ", questions.length), /*#__PURE__*/_react.default.createElement("span", null, translate('auto-evaluation.allQuestionsMandatory'))), /*#__PURE__*/_react.default.createElement("div", {
+    className: "survey--questions__intertitle"
+  }, /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement("span", null, translate('auto-evaluation.question'), "\xA0", currentQuestion + 1, " ", translate('storylines.misc.of'), " ", questions.length)), /*#__PURE__*/_react.default.createElement("div", null, translate('auto-evaluation.allQuestionsMandatory'))), /*#__PURE__*/_react.default.createElement("div", {
     key: "".concat(questions[currentQuestion])
   }, /*#__PURE__*/_react.default.createElement("div", {
     className: "survey--questions__item",

package/dist/components/decision-component/components/Options.js

@@ -71,11 +71,12 @@ var Options = function Options(_ref) {
   }).map(function (option) {
     return /*#__PURE__*/_react.default.createElement("div", {
       key: option.id,
-      className: "".concat(inherited ? 'conversation--question' : 'radio', "\n                ").concat(neutralDecisionVisualEffect === option.id ? 'radio-text-clicked' : '')
+      className: "".concat(inherited ? 'conversation--question custom-radio' : 'custom-radio', "\n                ").concat(neutralDecisionVisualEffect === option.id ? 'radio-text-clicked' : '')
     }, /*#__PURE__*/_react.default.createElement("input", {
       onChange: function onChange() {
         whenSelectOption(option);
       },
+      className: "radio",
       type: "radio",
       id: option.text,
       name: option.id,

package/dist/components/index.js

@@ -131,12 +131,6 @@ Object.defineProperty(exports, "LoginPuzzleComponent", {
     return _loginPuzzleComponent.default;
   }
 });
-Object.defineProperty(exports, "MediaVisor", {
-  enumerable: true,
-  get: function get() {
-    return _mediaVisor.default;
-  }
-});
 Object.defineProperty(exports, "NoticeComponent", {
   enumerable: true,
   get: function get() {
@@ -284,8 +278,6 @@ var _testComponent = _interopRequireDefault(require("./test-component"));
 
 var _surveyComponent = _interopRequireDefault(require("./survey-component"));
 
-var _mediaVisor = _interopRequireDefault(require("./media-visor"));
-
 var _autoEvaluationComponent = _interopRequireDefault(require("./auto-evaluation-component"));
 
 var _patternComponent = _interopRequireDefault(require("./pattern-component"));

package/dist/components/survey-component/components/ApplicableBox.js

@@ -33,18 +33,22 @@ var ApplicableBox = function ApplicableBox(_ref) {
   return /*#__PURE__*/_react.default.createElement("div", {
     className: "survey--page__item"
   }, OPTIONS.map(function (option, i) {
-    return /*#__PURE__*/_react.default.createElement("button", {
-      type: "button",
-      key: option,
-      onClick: function onClick() {
-        return select(option);
-      },
-      className: "unset-button survey--response__item ".concat(survey[id] === option ? 'selected' : '')
-    }, /*#__PURE__*/_react.default.createElement("div", {
-      className: "survey--response__index"
-    }, LETTERS[i]), /*#__PURE__*/_react.default.createElement("div", {
-      className: "survey--response__text"
-    }, translate("survey.".concat(option))));
+    return (
+      /*#__PURE__*/
+      // TODO: convert this buttons to radiobutton and not agilize this question in order to A11y
+      _react.default.createElement("button", {
+        type: "button",
+        key: option,
+        onClick: function onClick() {
+          return select(option);
+        },
+        className: "unset-button survey--response__item ".concat(survey[id] === option ? 'selected' : '')
+      }, /*#__PURE__*/_react.default.createElement("div", {
+        className: "survey--response__index"
+      }, LETTERS[i]), /*#__PURE__*/_react.default.createElement("div", {
+        className: "survey--response__text"
+      }, translate("survey.".concat(option))))
+    );
   }));
 };
 

package/dist/components/survey-component/components/SurveyComponent.js

@@ -112,11 +112,11 @@ var SurveyComponent = function SurveyComponent(_ref) {
   }, /*#__PURE__*/_react.default.createElement("div", {
     className: "survey--questions__container"
   }, /*#__PURE__*/_react.default.createElement("div", {
-    className: "survey--questions__count"
-  }, /*#__PURE__*/_react.default.createElement("span", null, translate('survey.numQuestion', {
+    className: "survey--questions__intertitle"
+  }, /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement("span", null, translate('survey.numQuestion', {
     init: page + 1,
     page: PAGES.length
-  })), /*#__PURE__*/_react.default.createElement("span", null, translate('auto-evaluation.allQuestionsMandatory'))), /*#__PURE__*/_react.default.createElement("label", {
+  }))), /*#__PURE__*/_react.default.createElement("div", null, translate('auto-evaluation.allQuestionsMandatory'))), /*#__PURE__*/_react.default.createElement("label", {
     className: "survey--questions__item",
     htmlFor: translate("survey.question".concat(page + 1), {
       ordinal: page + 1

package/dist/components/test-component/components/Container.js

@@ -11,7 +11,7 @@ var _react = _interopRequireWildcard(require("react"));
 
 var _Questions = _interopRequireDefault(require("./Questions"));
 
-var _Feedback = _interopRequireDefault(require("./Feedback"));
+var _Feedbacks = _interopRequireDefault(require("./Feedbacks"));
 
 var _LangIsRtl = _interopRequireDefault(require("../../../helpers/LangIsRtl"));
 
@@ -48,7 +48,10 @@ var Container = function Container(_ref) {
       disabled = _ref.disabled,
       translate = _ref.translate,
       soundActions = _ref.soundActions,
-      paused = _ref.paused;
+      paused = _ref.paused,
+      view = _ref.view,
+      correctQuestions = _ref.correctQuestions;
+  var layerToBeScrolled = document.querySelector(".test--container");
 
   var _useState = (0, _react.useState)(0),
       _useState2 = _slicedToArray(_useState, 2),
@@ -84,10 +87,11 @@ var Container = function Container(_ref) {
   }, [disabled, feedback, paused, saveInterval, setTime, time]);
 
   var nextPage = function nextPage() {
+    layerToBeScrolled.scrollTo(0, 0);
     play('click-ui');
 
     if (answered) {
-      if (result[qid].feedback && !disabled) {
+      if (result[qid][0].feedback && !disabled) {
         setFeedback(true);
       } else {
         answerPage(false);
@@ -96,7 +100,14 @@ var Container = function Container(_ref) {
     }
   };
 
+  var previousPage = function previousPage() {
+    play('click-ui');
+    setNextQuestion(currentQuestionId - 1);
+  };
+
   var nextPageFeedback = function nextPageFeedback() {
+    layerToBeScrolled.scrollTo(0, 0);
+
     if (questions[currentQuestionId + 1]) {
       setFeedback(false);
       answerPage(false);
@@ -107,9 +118,10 @@ var Container = function Container(_ref) {
   };
 
   var finishTest = function finishTest() {
+    layerToBeScrolled.scrollTo(0, 0);
     setTries(tries + 1);
 
-    if (result[qid].feedback && !disabled) {
+    if (result[qid][0].feedback && !disabled) {
       setFeedback(true);
     } else {
       showResults();
@@ -118,22 +130,52 @@ var Container = function Container(_ref) {
 
   var minutes = Math.floor(time / 60);
   var seconds = time % 60;
-  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, feedback ? /*#__PURE__*/_react.default.createElement(_Feedback.default, {
-    question: questions[currentQuestionId].text,
-    nextPage: function nextPage() {
-      return nextPageFeedback();
-    },
-    answer: result[qid],
-    translate: translate
-  }) : /*#__PURE__*/_react.default.createElement("div", {
+  (0, _react.useEffect)(function () {
+    // move scroll to checkbox in review mode
+    if (view === 'review') {
+      var idSelected = result["q".concat(currentQuestionId)][0].id;
+      var inputSelected = document.querySelector("#".concat(idSelected));
+      layerToBeScrolled.scrollTo(0, inputSelected.offsetTop);
+    }
+  }, [currentQuestionId, layerToBeScrolled, result, view]);
+
+  var questionAnsweredCorrectly = function questionAnsweredCorrectly() {
+    if (answered) {
+      var correctAnswers = correctQuestions[questions[currentQuestionId].id.substring(1)].answers;
+      var selectedAnswers = result[qid];
+      var thereAreWrongAnswersSelected = selectedAnswers.find(function (el) {
+        return el.isCorrect === false;
+      });
+      var fixedAnswers = 0;
+      selectedAnswers.forEach(function (el) {
+        if (correctAnswers.includes(el.id)) {
+          fixedAnswers += 1;
+        }
+      });
+      return !thereAreWrongAnswersSelected && fixedAnswers === correctAnswers.length;
+    }
+
+    return false;
+  };
+
+  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, view === 'review' || feedback ? /*#__PURE__*/_react.default.createElement("div", {
+    className: "test-feedback-header ".concat(questionAnsweredCorrectly() ? 'success' : 'failed')
+  }, /*#__PURE__*/_react.default.createElement("h2", null, /*#__PURE__*/_react.default.createElement("span", {
+    className: "".concat(questionAnsweredCorrectly() ? 'icon-correct-thumb' : 'icon-incorrect-thumb')
+  }), /*#__PURE__*/_react.default.createElement("span", {
+    className: "test-feedback-header__title"
+  }, questionAnsweredCorrectly() ? translate('tests.resolvedQuestion') : translate('tests.notResolvedQuestion')))) : null, /*#__PURE__*/_react.default.createElement("div", {
     className: "test--questions"
   }, /*#__PURE__*/_react.default.createElement("div", {
     className: "test--questions__container"
-  }, /*#__PURE__*/_react.default.createElement("div", {
-    className: "flex justify-space-between align-center"
-  }, /*#__PURE__*/_react.default.createElement("div", {
-    className: "test--questions__count"
-  }, (0, _LangIsRtl.default)() ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, currentQuestionId + 1, "/", questions.length, " ", /*#__PURE__*/_react.default.createElement("span", null, translate('tests.question'))) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("span", null, translate('tests.question')), " ", currentQuestionId + 1, "/", questions.length)), time >= 0 ? /*#__PURE__*/_react.default.createElement("div", {
+  }, feedback ? /*#__PURE__*/_react.default.createElement(_Feedbacks.default, {
+    selectedAnswers: result[qid],
+    correctQuestions: correctQuestions[questions[currentQuestionId].id.substring(1)].answers,
+    question: questions[currentQuestionId].text,
+    translate: translate
+  }) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("div", {
+    className: "test--questions__intertitle"
+  }, /*#__PURE__*/_react.default.createElement("div", null, (0, _LangIsRtl.default)() ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, currentQuestionId + 1, "/", questions.length, " ", /*#__PURE__*/_react.default.createElement("span", null, translate('tests.question'))) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("span", null, translate('tests.question')), " ", currentQuestionId + 1, "/", questions.length)), view !== 'review' && time >= 0 ? /*#__PURE__*/_react.default.createElement("div", {
     dir: "ltr",
     className: "count-down ".concat(time < 10 ? 'count-down--finalseconds' : '')
   }, /*#__PURE__*/_react.default.createElement("div", {
@@ -145,10 +187,23 @@ var Container = function Container(_ref) {
     answered: answered,
     updateForm: updateForm,
     question: questions[currentQuestionId],
+    correctQuestions: disabled ? correctQuestions[questions[currentQuestionId].id.substring(1)].answers : [],
     translate: translate
-  })), /*#__PURE__*/_react.default.createElement("div", {
-    className: "test--buttons next"
-  }, questions[currentQuestionId + 1] ? /*#__PURE__*/_react.default.createElement("button", {
+  }))), /*#__PURE__*/_react.default.createElement("div", {
+    className: "test--buttons ".concat(view === 'review' ? 'reviewmode' : 'next')
+  }, view === 'review' ? /*#__PURE__*/_react.default.createElement("button", {
+    disabled: currentQuestionId === 0,
+    id: "back-button",
+    onClick: function onClick() {
+      return previousPage();
+    },
+    type: "button",
+    className: "gat--btn__navigation ".concat(currentQuestionId === 0 ? 'disabled' : ''),
+    "aria-label": (0, _LangIsRtl.default)() ? translate('survey.next') : translate('survey.previous')
+  }, /*#__PURE__*/_react.default.createElement("span", {
+    className: (0, _LangIsRtl.default)() ? 'icon-next' : 'icon-back'
+  })) : null, !feedback && questions[currentQuestionId + 1] ? /*#__PURE__*/_react.default.createElement("button", {
+    disabled: !answered,
     id: "next-button",
     onClick: function onClick() {
       return nextPage();
@@ -158,7 +213,17 @@ var Container = function Container(_ref) {
     "aria-label": (0, _LangIsRtl.default)() ? translate('survey.previous') : translate('survey.next')
   }, /*#__PURE__*/_react.default.createElement("span", {
     className: (0, _LangIsRtl.default)() ? 'icon-back' : 'icon-next'
-  })) : /*#__PURE__*/_react.default.createElement("button", {
+  })) : null, feedback ? /*#__PURE__*/_react.default.createElement("button", {
+    id: "next-button",
+    onClick: function onClick() {
+      return nextPageFeedback();
+    },
+    type: "button",
+    className: "gat--btn__navigation"
+  }, /*#__PURE__*/_react.default.createElement("span", {
+    className: (0, _LangIsRtl.default)() ? 'icon-back' : 'icon-next'
+  })) : null, !feedback && questions[currentQuestionId].id.substring(1) === (questions.length - 1).toString() ? /*#__PURE__*/_react.default.createElement("button", {
+    disabled: !answered,
     id: "finish-button",
     onClick: function onClick() {
       play('click-ui');
@@ -172,7 +237,7 @@ var Container = function Container(_ref) {
     "aria-label": (0, _LangIsRtl.default)() ? translate('survey.previous') : translate('survey.next')
   }, /*#__PURE__*/_react.default.createElement("span", {
     className: (0, _LangIsRtl.default)() ? 'icon-back' : 'icon-next'
-  })))));
+  })) : null)));
 };
 
 var _default = Container;

package/dist/components/test-component/components/Feedbacks.js

@@ -0,0 +1,44 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+var LABELS_INDEX = ['A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'I', 'J'];
+
+var FeedbackItem = function FeedbackItem(_ref) {
+  var selectedAnswers = _ref.selectedAnswers,
+      correctQuestions = _ref.correctQuestions,
+      question = _ref.question,
+      translate = _ref.translate;
+
+  var questionAnsweredCorrectly = function questionAnsweredCorrectly(optionSelected) {
+    return correctQuestions.includes(optionSelected);
+  };
+
+  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("div", {
+    className: "test--questions__item"
+  }, /*#__PURE__*/_react.default.createElement("span", null, question)), selectedAnswers.map(function (answer) {
+    return /*#__PURE__*/_react.default.createElement("div", {
+      key: answer.text
+    }, /*#__PURE__*/_react.default.createElement("div", {
+      className: "test--response__item ".concat(questionAnsweredCorrectly(answer.id) ? 'success' : 'failed')
+    }, /*#__PURE__*/_react.default.createElement("div", {
+      className: "test--response__index"
+    }, LABELS_INDEX[answer.index]), /*#__PURE__*/_react.default.createElement("div", {
+      className: "test--response__text"
+    }, /*#__PURE__*/_react.default.createElement("span", null, answer.text)), /*#__PURE__*/_react.default.createElement("div", {
+      className: "test--response__icon ".concat(questionAnsweredCorrectly(answer.id) ? 'icon-check-circle-black color--success' : 'icon-error-circle-black color--error')
+    })), /*#__PURE__*/_react.default.createElement("div", {
+      className: "test--feedback"
+    }, /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement("b", null, /*#__PURE__*/_react.default.createElement("span", null, translate('test.feedback'), " ", selectedAnswers.length > 1 ? LABELS_INDEX[answer.index] : ''))), /*#__PURE__*/_react.default.createElement("span", null, answer.feedback)));
+  }));
+};
+
+var _default = FeedbackItem;
+exports.default = _default;

package/dist/components/test-component/components/Questions.js

@@ -1,13 +1,29 @@
 "use strict";
 
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
 
-var _react = _interopRequireDefault(require("react"));
+var _react = _interopRequireWildcard(require("react"));
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
 
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
+
+function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
+
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 
 var LABELS_INDEX = ['A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'I', 'J'];
 
@@ -17,31 +33,78 @@ var Questions = function Questions(_ref) {
       question = _ref.question,
       updateForm = _ref.updateForm,
       result = _ref.result,
+      correctQuestions = _ref.correctQuestions,
       translate = _ref.translate;
+
+  var _useState = (0, _react.useState)(false),
+      _useState2 = _slicedToArray(_useState, 2),
+      isMultiAnswers = _useState2[0],
+      setIsMultiAnswers = _useState2[1];
+
   var filteredAnswers = question.answers.filter(function (answer) {
     return answer.text;
   });
 
-  var getClass = function getClass(answer) {
-    var answerClass = '';
+  var checkIfCheckboxIsChecked = function checkIfCheckboxIsChecked(id) {
+    var isChecked = false;
 
-    if (answered && answer.id === result[question.id].id) {
-      answerClass = 'selected';
+    if (result[question.id].find(function (element) {
+      return element.id === id;
+    })) {
+      isChecked = true;
     }
 
-    if (disabled && answer.id === result[question.id].id) {
-      answerClass = result[question.id].isCorrect ? 'success' : 'failed';
+    return isChecked;
+  };
+
+  var getInputStatus = function getInputStatus(answer) {
+    var status = '';
+
+    if (isMultiAnswers) {
+      if (answered && checkIfCheckboxIsChecked(answer.id)) {
+        status = 'selected';
+      }
+
+      if (disabled && checkIfCheckboxIsChecked(answer.id) && correctQuestions.includes(answer.id)) {
+        status = 'success';
+      }
+
+      if (disabled && checkIfCheckboxIsChecked(answer.id) && !correctQuestions.includes(answer.id)) {
+        status = 'failed';
+      }
+    } else {
+      if (answered && answer.id === result[question.id][0].id) {
+        status = 'selected';
+      }
+
+      if (disabled && answer.id === result[question.id][0].id) {
+        status = result[question.id][0].isCorrect ? 'success' : 'failed';
+      }
     }
 
-    return answerClass;
+    return status;
   };
 
-  var show = function show(answer) {
-    if (disabled && answer.feedback && answer.id === result[question.id].id) {
-      return true;
+  var getIconStatus = function getIconStatus(answer) {
+    var status = getInputStatus(answer);
+
+    if (status === 'selected') {
+      return 'icon-check-circle-black color--selected';
+    }
+
+    if (status === 'success') {
+      return 'icon-check-circle-black color--success';
+    }
+
+    if (status === 'failed') {
+      return 'icon-error-circle-black color--error';
     }
 
-    return false;
+    return '';
+  };
+
+  var showTooltip = function showTooltip(answer) {
+    return disabled && answer.feedback && (isMultiAnswers && checkIfCheckboxIsChecked(answer.id) || answer.id === result[question.id][0].id);
   };
 
   var tooltipPosition = function tooltipPosition(answers, answerIndex) {
@@ -56,26 +119,57 @@ var Questions = function Questions(_ref) {
     return 'tooltip--center__right';
   };
 
+  var checkIfIsMultiAnswer = question.answers.filter(function (a) {
+    return a.isCorrect;
+  });
+  (0, _react.useEffect)(function () {
+    if (checkIfIsMultiAnswer.length === 1) {
+      setIsMultiAnswers(false);
+    } else {
+      setIsMultiAnswers(true);
+    }
+  }, [checkIfIsMultiAnswer.length, isMultiAnswers, question.answers]);
   return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("div", {
     className: "test--questions__item"
-  }, /*#__PURE__*/_react.default.createElement("span", null, question.text)), filteredAnswers.map(function (answer, index) {
-    return /*#__PURE__*/_react.default.createElement("button", {
-      type: "button",
-      onClick: function onClick() {
-        return !disabled ? updateForm(answer, question.id, index) : null;
-      },
-      key: answer.text,
-      className: "unset-button test--response__item ".concat(disabled ? 'review' : '', " ").concat(getClass(answer)),
-      disabled: disabled && !getClass(answer)
+  }, /*#__PURE__*/_react.default.createElement("span", null, question.text)), isMultiAnswers && !disabled ? /*#__PURE__*/_react.default.createElement("div", {
+    className: "test--questions__intertitle test--questions__intertitle--multiresponse"
+  }, translate('tests.chooseMoreOneAnswer')) : null, filteredAnswers.map(function (answer, index) {
+    return /*#__PURE__*/_react.default.createElement("div", {
+      className: "test--response__fakeinput",
+      key: answer.text
+    }, isMultiAnswers ? /*#__PURE__*/_react.default.createElement("input", {
+      checked: answered && checkIfCheckboxIsChecked(answer.id),
+      disabled: disabled && !checkIfCheckboxIsChecked(answer.id),
+      readOnly: disabled,
+      type: "checkbox",
+      id: answer.id,
+      onChange: function onChange() {
+        return !disabled ? updateForm(answer, question.id, index, 'isCheckbox', answer.id) : null;
+      }
+    }) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("input", {
+      checked: answered && answer.id === result[question.id][0].id,
+      disabled: disabled && !getInputStatus(answer),
+      type: "radio",
+      name: "name",
+      id: answer.id,
+      onChange: function onChange() {
+        return !disabled ? updateForm(answer, question.id, index, 'isRadio') : null;
+      }
+    })), /*#__PURE__*/_react.default.createElement("label", {
+      htmlFor: answer.id,
+      className: "test--response__item ".concat(getInputStatus(answer))
     }, /*#__PURE__*/_react.default.createElement("div", {
       className: "test--response__index"
     }, LABELS_INDEX[index]), /*#__PURE__*/_react.default.createElement("div", {
       className: "test--response__text"
-    }, /*#__PURE__*/_react.default.createElement("span", null, answer.text)), show(answer) ? /*#__PURE__*/_react.default.createElement("div", {
-      className: "test--feedback__info"
+    }, /*#__PURE__*/_react.default.createElement("span", null, answer.text)), /*#__PURE__*/_react.default.createElement("div", {
+      className: "test--response__icon ".concat(getIconStatus(answer))
+    })), disabled ? /*#__PURE__*/_react.default.createElement("div", {
+      className: "test--feedback__info ".concat(!showTooltip(answer) ? 'test--feedback__info--hidden' : '')
     }, /*#__PURE__*/_react.default.createElement("span", {
-      className: "icon-info2"
+      className: "icon-info2 ".concat(getInputStatus(answer) === 'success' ? 'color--success' : 'color--error')
     }), /*#__PURE__*/_react.default.createElement("div", {
+      id: "tooltipFeedback-".concat(index),
       className: "tooltip ".concat(tooltipPosition(filteredAnswers, index))
     }, /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement("b", null, /*#__PURE__*/_react.default.createElement("span", null, translate('test.feedback')))), /*#__PURE__*/_react.default.createElement("span", null, /*#__PURE__*/_react.default.createElement("span", null, answer.feedback)))) : null);
   }));