analytica-frontend-lib 1.0.86 → 1.0.87

package/dist/Quiz/index.js

@@ -28,6 +28,7 @@ __export(Quiz_exports, {
   QuizHeaderResult: () => QuizHeaderResult,
   QuizListResult: () => QuizListResult,
   QuizListResultByMateria: () => QuizListResultByMateria,
+  QuizMultipleChoice: () => QuizMultipleChoice,
   QuizQuestionList: () => QuizQuestionList,
   QuizResultHeaderTitle: () => QuizResultHeaderTitle,
   QuizResultPerformance: () => QuizResultPerformance,
@@ -35,7 +36,7 @@ __export(Quiz_exports, {
   QuizTitle: () => QuizTitle
 });
 module.exports = __toCommonJS(Quiz_exports);
-var import_phosphor_react6 = require("phosphor-react");
+var import_phosphor_react8 = require("phosphor-react");
 
 // src/components/Badge/Badge.tsx
 var import_phosphor_react = require("phosphor-react");
@@ -951,7 +952,7 @@ IconButton.displayName = "IconButton";
 var IconButton_default = IconButton;
 
 // src/components/Quiz/Quiz.tsx
-var import_react8 = require("react");
+var import_react11 = require("react");
 
 // src/components/Quiz/useQuizStore.ts
 var import_zustand2 = require("zustand");
@@ -992,6 +993,7 @@ var useQuizStore = (0, import_zustand2.create)()(
         setByActivity: (atividade) => set({ byActivity: atividade }),
         setByQuestionary: (aula) => set({ byQuestionary: aula }),
         setUserId: (userId) => set({ userId }),
+        setUserAnswers: (userAnswers) => set({ userAnswers }),
         getUserId: () => get().userId,
         // Navigation
         goToNextQuestion: () => {
@@ -1028,16 +1030,9 @@ var useQuizStore = (0, import_zustand2.create)()(
           const { getActiveQuiz, userAnswers } = get();
           const activeQuiz = getActiveQuiz();
           if (!activeQuiz) return;
-          const updatedQuestions = activeQuiz.quiz.questions.map(
-            (question) => question.id === questionId ? { ...question, answerKey: answerId } : question
-          );
-          const updatedQuiz = {
-            ...activeQuiz.quiz,
-            questions: updatedQuestions
-          };
           const activityId = activeQuiz.quiz.id;
           const userId = get().getUserId();
-          if (!userId) {
+          if (!userId || userId === "") {
             console.warn("selectAnswer called before userId is set");
             return;
           }
@@ -1048,7 +1043,7 @@ var useQuizStore = (0, import_zustand2.create)()(
             questionId,
             activityId,
             userId,
-            answer: answerId,
+            answer: null,
             optionId: answerId
           };
           let updatedUserAnswers;
@@ -1059,7 +1054,36 @@ var useQuizStore = (0, import_zustand2.create)()(
             updatedUserAnswers = [...userAnswers, newUserAnswer];
           }
           set({
-            [activeQuiz.type]: updatedQuiz,
+            userAnswers: updatedUserAnswers
+          });
+        },
+        selectMultipleAnswer: (questionId, answerIds) => {
+          const { getActiveQuiz, userAnswers } = get();
+          const activeQuiz = getActiveQuiz();
+          if (!activeQuiz) return;
+          const activityId = activeQuiz.quiz.id;
+          const userId = get().getUserId();
+          if (!userId || userId === "") {
+            console.warn("selectMultipleAnswer called before userId is set");
+            return;
+          }
+          const filteredUserAnswers = userAnswers.filter(
+            (answer) => answer.questionId !== questionId
+          );
+          const newUserAnswers = answerIds.map(
+            (answerId) => ({
+              questionId,
+              activityId,
+              userId,
+              answer: null,
+              optionId: answerId
+            })
+          );
+          const updatedUserAnswers = [
+            ...filteredUserAnswers,
+            ...newUserAnswers
+          ];
+          set({
             userAnswers: updatedUserAnswers
           });
         },
@@ -1071,6 +1095,10 @@ var useQuizStore = (0, import_zustand2.create)()(
           if (currentQuestion) {
             const activityId = activeQuiz.quiz.id;
             const userId = get().getUserId();
+            if (!userId || userId === "") {
+              console.warn("skipQuestion called before userId is set");
+              return;
+            }
             const existingAnswerIndex = userAnswers.findIndex(
               (answer) => answer.questionId === currentQuestion.id
             );
@@ -1099,6 +1127,10 @@ var useQuizStore = (0, import_zustand2.create)()(
           if (!activeQuiz) return;
           const activityId = activeQuiz.quiz.id;
           const userId = get().getUserId();
+          if (!userId || userId === "") {
+            console.warn("addUserAnswer called before userId is set");
+            return;
+          }
           const existingAnswerIndex = userAnswers.findIndex(
             (answer) => answer.questionId === questionId
           );
@@ -1106,7 +1138,7 @@ var useQuizStore = (0, import_zustand2.create)()(
             questionId,
             activityId,
             userId,
-            answer: answerId || null,
+            answer: null,
             optionId: answerId || null
           };
           if (existingAnswerIndex !== -1) {
@@ -1157,7 +1189,7 @@ var useQuizStore = (0, import_zustand2.create)()(
         },
         getAnsweredQuestions: () => {
           const { userAnswers } = get();
-          return userAnswers.filter((answer) => answer.answer !== null).length;
+          return userAnswers.filter((answer) => answer.optionId !== null).length;
         },
         getUnansweredQuestions: () => {
           const { getActiveQuiz, userAnswers } = get();
@@ -1168,8 +1200,8 @@ var useQuizStore = (0, import_zustand2.create)()(
             const userAnswer = userAnswers.find(
               (answer) => answer.questionId === question.id
             );
-            const isAnswered = userAnswer && userAnswer.answer !== null;
-            const isSkipped = userAnswer && userAnswer.answer === null;
+            const isAnswered = userAnswer && userAnswer.optionId !== null;
+            const isSkipped = userAnswer && userAnswer.optionId === null;
             if (!isAnswered && !isSkipped) {
               unansweredQuestions.push(index + 1);
             }
@@ -1178,7 +1210,7 @@ var useQuizStore = (0, import_zustand2.create)()(
         },
         getSkippedQuestions: () => {
           const { userAnswers } = get();
-          return userAnswers.filter((answer) => answer.answer === null).length;
+          return userAnswers.filter((answer) => answer.optionId === null).length;
         },
         getProgress: () => {
           const { getTotalQuestions, getAnsweredQuestions } = get();
@@ -1191,14 +1223,14 @@ var useQuizStore = (0, import_zustand2.create)()(
           const userAnswer = userAnswers.find(
             (answer) => answer.questionId === questionId
           );
-          return userAnswer ? userAnswer.answer !== null : false;
+          return userAnswer ? userAnswer.optionId !== null : false;
         },
         isQuestionSkipped: (questionId) => {
           const { userAnswers } = get();
           const userAnswer = userAnswers.find(
             (answer) => answer.questionId === questionId
           );
-          return userAnswer ? userAnswer.answer === null : false;
+          return userAnswer ? userAnswer.optionId === null : false;
         },
         getCurrentAnswer: () => {
           const { getCurrentQuestion, userAnswers } = get();
@@ -1207,7 +1239,16 @@ var useQuizStore = (0, import_zustand2.create)()(
           const userAnswer = userAnswers.find(
             (answer) => answer.questionId === currentQuestion.id
           );
-          return userAnswer?.answer;
+          return userAnswer?.optionId;
+        },
+        getAllCurrentAnswer: () => {
+          const { getCurrentQuestion, userAnswers } = get();
+          const currentQuestion = getCurrentQuestion();
+          if (!currentQuestion) return void 0;
+          const userAnswer = userAnswers.filter(
+            (answer) => answer.questionId === currentQuestion.id
+          );
+          return userAnswer;
         },
         getQuizTitle: () => {
           const { getActiveQuiz } = get();
@@ -1220,18 +1261,8 @@ var useQuizStore = (0, import_zustand2.create)()(
           return `${minutes.toString().padStart(2, "0")}:${remainingSeconds.toString().padStart(2, "0")}`;
         },
         getUserAnswers: () => {
-          const { getActiveQuiz, userAnswers } = get();
-          const activeQuiz = getActiveQuiz();
-          if (!activeQuiz) return [];
-          return activeQuiz.quiz.questions.map((question) => {
-            const userAnswer = userAnswers.find(
-              (answer) => answer.questionId === question.id
-            );
-            return {
-              ...question,
-              isSkipped: userAnswer ? userAnswer.answer === null : false
-            };
-          });
+          const { userAnswers } = get();
+          return userAnswers;
         },
         getUnansweredQuestionsFromUserAnswers: () => {
           const { getActiveQuiz, userAnswers } = get();
@@ -1242,8 +1273,8 @@ var useQuizStore = (0, import_zustand2.create)()(
             const userAnswer = userAnswers.find(
               (answer) => answer.questionId === question.id
             );
-            const hasAnswer = userAnswer && userAnswer.answer !== null;
-            const isSkipped = userAnswer && userAnswer.answer === null;
+            const hasAnswer = userAnswer && userAnswer.optionId !== null;
+            const isSkipped = userAnswer && userAnswer.optionId === null;
             if (!hasAnswer || isSkipped) {
               unansweredQuestions.push(index + 1);
             }
@@ -1274,7 +1305,7 @@ var useQuizStore = (0, import_zustand2.create)()(
           const answer = userAnswers.find(
             (answer2) => answer2.questionId === questionId
           );
-          return answer ? answer.answer !== null : false;
+          return answer ? answer.optionId !== null : false;
         },
         getQuestionStatusFromUserAnswers: (questionId) => {
           const { userAnswers } = get();
@@ -1282,12 +1313,27 @@ var useQuizStore = (0, import_zustand2.create)()(
             (answer2) => answer2.questionId === questionId
           );
           if (!answer) return "unanswered";
-          if (answer.answer === null) return "skipped";
+          if (answer.optionId === null) return "skipped";
           return "answered";
         },
         getUserAnswersForActivity: () => {
           const { userAnswers } = get();
           return userAnswers;
+        },
+        setCurrentQuestion: (question) => {
+          const { getActiveQuiz } = get();
+          const activeQuiz = getActiveQuiz();
+          if (!activeQuiz) return;
+          const questionIndex = activeQuiz.quiz.questions.findIndex(
+            (q) => q.id === question.id
+          );
+          if (questionIndex === -1) {
+            console.warn(
+              `Question with id "${question.id}" not found in active quiz`
+            );
+            return;
+          }
+          set({ currentQuestionIndex: questionIndex });
         }
       };
     },
@@ -3711,10 +3757,484 @@ var ProgressCircle = ({
 };
 var ProgressCircle_default = ProgressCircle;
 
-// src/components/Quiz/Quiz.tsx
+// src/components/MultipleChoice/MultipleChoice.tsx
+var import_react10 = require("react");
+
+// src/components/CheckBox/CheckboxList.tsx
+var import_react9 = require("react");
+var import_zustand4 = require("zustand");
+
+// src/components/CheckBox/CheckBox.tsx
+var import_react8 = require("react");
+var import_phosphor_react6 = require("phosphor-react");
 var import_jsx_runtime13 = require("react/jsx-runtime");
-var Quiz = (0, import_react8.forwardRef)(({ children, className, ...props }, ref) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+var SIZE_CLASSES9 = {
+  small: {
+    checkbox: "w-4 h-4",
+    // 16px x 16px
+    textSize: "sm",
+    spacing: "gap-1.5",
+    // 6px
+    borderWidth: "border-2",
+    iconSize: 14,
+    // pixels for Phosphor icons
+    labelHeight: "h-[21px]"
+  },
+  medium: {
+    checkbox: "w-5 h-5",
+    // 20px x 20px
+    textSize: "md",
+    spacing: "gap-2",
+    // 8px
+    borderWidth: "border-2",
+    iconSize: 16,
+    // pixels for Phosphor icons
+    labelHeight: "h-6"
+  },
+  large: {
+    checkbox: "w-6 h-6",
+    // 24px x 24px
+    textSize: "lg",
+    spacing: "gap-2",
+    // 8px
+    borderWidth: "border-[3px]",
+    // 3px border
+    iconSize: 20,
+    // pixels for Phosphor icons
+    labelHeight: "h-[27px]"
+  }
+};
+var BASE_CHECKBOX_CLASSES = "rounded border cursor-pointer transition-all duration-200 flex items-center justify-center focus:outline-none";
+var STATE_CLASSES2 = {
+  default: {
+    unchecked: "border-border-400 bg-background hover:border-border-500",
+    checked: "border-primary-950 bg-primary-950 text-text hover:border-primary-800 hover:bg-primary-800"
+  },
+  hovered: {
+    unchecked: "border-border-500 bg-background",
+    checked: "border-primary-800 bg-primary-800 text-text"
+  },
+  focused: {
+    unchecked: "border-indicator-info bg-background ring-2 ring-indicator-info/20",
+    checked: "border-indicator-info bg-primary-950 text-text ring-2 ring-indicator-info/20"
+  },
+  invalid: {
+    unchecked: "border-error-700 bg-background hover:border-error-600",
+    checked: "border-error-700 bg-primary-950 text-text"
+  },
+  disabled: {
+    unchecked: "border-border-400 bg-background cursor-not-allowed opacity-40",
+    checked: "border-primary-600 bg-primary-600 text-text cursor-not-allowed opacity-40"
+  }
+};
+var CheckBox = (0, import_react8.forwardRef)(
+  ({
+    label,
+    size = "medium",
+    state = "default",
+    indeterminate = false,
+    errorMessage,
+    helperText,
+    className = "",
+    labelClassName = "",
+    checked: checkedProp,
+    disabled,
+    id,
+    onChange,
+    ...props
+  }, ref) => {
+    const generatedId = (0, import_react8.useId)();
+    const inputId = id ?? `checkbox-${generatedId}`;
+    const [internalChecked, setInternalChecked] = (0, import_react8.useState)(false);
+    const isControlled = checkedProp !== void 0;
+    const checked = isControlled ? checkedProp : internalChecked;
+    const handleChange = (event) => {
+      if (!isControlled) {
+        setInternalChecked(event.target.checked);
+      }
+      onChange?.(event);
+    };
+    const currentState = disabled ? "disabled" : state;
+    const sizeClasses = SIZE_CLASSES9[size];
+    const checkVariant = checked || indeterminate ? "checked" : "unchecked";
+    const stylingClasses = STATE_CLASSES2[currentState][checkVariant];
+    const borderWidthClass = state === "focused" || state === "hovered" && size === "large" ? "border-[3px]" : sizeClasses.borderWidth;
+    const checkboxClasses = cn(
+      BASE_CHECKBOX_CLASSES,
+      sizeClasses.checkbox,
+      borderWidthClass,
+      stylingClasses,
+      className
+    );
+    const renderIcon = () => {
+      if (indeterminate) {
+        return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+          import_phosphor_react6.Minus,
+          {
+            size: sizeClasses.iconSize,
+            weight: "bold",
+            color: "currentColor"
+          }
+        );
+      }
+      if (checked) {
+        return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+          import_phosphor_react6.Check,
+          {
+            size: sizeClasses.iconSize,
+            weight: "bold",
+            color: "currentColor"
+          }
+        );
+      }
+      return null;
+    };
+    return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: "flex flex-col", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(
+        "div",
+        {
+          className: cn(
+            "flex flex-row items-center",
+            sizeClasses.spacing,
+            disabled ? "opacity-40" : ""
+          ),
+          children: [
+            /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+              "input",
+              {
+                ref,
+                type: "checkbox",
+                id: inputId,
+                checked,
+                disabled,
+                onChange: handleChange,
+                className: "sr-only",
+                ...props
+              }
+            ),
+            /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("label", { htmlFor: inputId, className: checkboxClasses, children: renderIcon() }),
+            label && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+              "div",
+              {
+                className: cn(
+                  "flex flex-row items-center",
+                  sizeClasses.labelHeight
+                ),
+                children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+                  Text_default,
+                  {
+                    as: "label",
+                    htmlFor: inputId,
+                    size: sizeClasses.textSize,
+                    weight: "normal",
+                    className: cn(
+                      "cursor-pointer select-none leading-[150%] flex items-center font-roboto",
+                      labelClassName
+                    ),
+                    children: label
+                  }
+                )
+              }
+            )
+          ]
+        }
+      ),
+      errorMessage && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+        Text_default,
+        {
+          size: "sm",
+          weight: "normal",
+          className: "mt-1.5",
+          color: "text-error-600",
+          children: errorMessage
+        }
+      ),
+      helperText && !errorMessage && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+        Text_default,
+        {
+          size: "sm",
+          weight: "normal",
+          className: "mt-1.5",
+          color: "text-text-500",
+          children: helperText
+        }
+      )
+    ] });
+  }
+);
+CheckBox.displayName = "CheckBox";
+var CheckBox_default = CheckBox;
+
+// src/components/CheckBox/CheckboxList.tsx
+var import_jsx_runtime14 = require("react/jsx-runtime");
+var createCheckboxListStore = (name, defaultValues, disabled, onValuesChange) => (0, import_zustand4.create)((set, get) => ({
+  values: defaultValues,
+  setValues: (values) => {
+    if (!get().disabled) {
+      set({ values });
+      get().onValuesChange?.(values);
+    }
+  },
+  toggleValue: (value) => {
+    if (!get().disabled) {
+      const currentValues = get().values;
+      const newValues = currentValues.includes(value) ? currentValues.filter((v) => v !== value) : [...currentValues, value];
+      set({ values: newValues });
+      get().onValuesChange?.(newValues);
+    }
+  },
+  onValuesChange,
+  disabled,
+  name
+}));
+var useCheckboxListStore = (externalStore) => {
+  if (!externalStore) {
+    throw new Error("CheckboxListItem must be used within a CheckboxList");
+  }
+  return externalStore;
+};
+var injectStore3 = (children, store) => import_react9.Children.map(children, (child) => {
+  if (!(0, import_react9.isValidElement)(child)) return child;
+  const typedChild = child;
+  const shouldInject = typedChild.type === CheckboxListItem;
+  return (0, import_react9.cloneElement)(typedChild, {
+    ...shouldInject ? { store } : {},
+    ...typedChild.props.children ? { children: injectStore3(typedChild.props.children, store) } : {}
+  });
+});
+var CheckboxList = (0, import_react9.forwardRef)(
+  ({
+    values: propValues,
+    defaultValues = [],
+    onValuesChange,
+    name: propName,
+    disabled = false,
+    className = "",
+    children,
+    ...props
+  }, ref) => {
+    const generatedId = (0, import_react9.useId)();
+    const name = propName || `checkbox-list-${generatedId}`;
+    const storeRef = (0, import_react9.useRef)(null);
+    storeRef.current ??= createCheckboxListStore(
+      name,
+      defaultValues,
+      disabled,
+      onValuesChange
+    );
+    const store = storeRef.current;
+    const { setValues } = (0, import_zustand4.useStore)(store, (s) => s);
+    (0, import_react9.useEffect)(() => {
+      const currentValues = store.getState().values;
+      if (currentValues.length > 0 && onValuesChange) {
+        onValuesChange(currentValues);
+      }
+    }, []);
+    (0, import_react9.useEffect)(() => {
+      if (propValues !== void 0) {
+        setValues(propValues);
+      }
+    }, [propValues, setValues]);
+    (0, import_react9.useEffect)(() => {
+      store.setState({ disabled });
+    }, [disabled, store]);
+    return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+      "div",
+      {
+        ref,
+        className: cn("flex flex-col gap-2 w-full", className),
+        "aria-label": name,
+        ...props,
+        children: injectStore3(children, store)
+      }
+    );
+  }
+);
+CheckboxList.displayName = "CheckboxList";
+var CheckboxListItem = (0, import_react9.forwardRef)(
+  ({
+    value,
+    store: externalStore,
+    disabled: itemDisabled,
+    size = "medium",
+    state = "default",
+    className = "",
+    id,
+    ...props
+  }, ref) => {
+    const store = useCheckboxListStore(externalStore);
+    const {
+      values: groupValues,
+      toggleValue,
+      disabled: groupDisabled,
+      name
+    } = (0, import_zustand4.useStore)(store);
+    const generatedId = (0, import_react9.useId)();
+    const inputId = id ?? `checkbox-item-${generatedId}`;
+    const isChecked = groupValues.includes(value);
+    const isDisabled = groupDisabled || itemDisabled;
+    const currentState = isDisabled ? "disabled" : state;
+    return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+      CheckBox_default,
+      {
+        ref,
+        id: inputId,
+        name,
+        value,
+        checked: isChecked,
+        disabled: isDisabled,
+        size,
+        state: currentState,
+        className,
+        onChange: () => {
+          if (!isDisabled) {
+            toggleValue(value);
+          }
+        },
+        ...props
+      }
+    );
+  }
+);
+CheckboxListItem.displayName = "CheckboxListItem";
+var CheckboxList_default = CheckboxList;
+
+// src/components/MultipleChoice/MultipleChoice.tsx
+var import_phosphor_react7 = require("phosphor-react");
+var import_jsx_runtime15 = require("react/jsx-runtime");
+var MultipleChoiceList = ({
+  disabled = false,
+  className = "",
+  choices,
+  name,
+  selectedValues,
+  onHandleSelectedValues,
+  mode = "interactive"
+}) => {
+  const [actualValue, setActualValue] = (0, import_react10.useState)(selectedValues);
+  (0, import_react10.useEffect)(() => {
+    setActualValue(selectedValues);
+  }, [selectedValues]);
+  const getStatusBadge = (status) => {
+    switch (status) {
+      case "correct":
+        return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(Badge_default, { variant: "solid", action: "success", iconLeft: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_phosphor_react7.CheckCircle, {}), children: "Resposta correta" });
+      case "incorrect":
+        return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(Badge_default, { variant: "solid", action: "error", iconLeft: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_phosphor_react7.XCircle, {}), children: "Resposta incorreta" });
+      default:
+        return null;
+    }
+  };
+  const getStatusStyles = (status) => {
+    switch (status) {
+      case "correct":
+        return "bg-success-background border-success-300";
+      case "incorrect":
+        return "bg-error-background border-error-300";
+      default:
+        return `bg-background border-border-100`;
+    }
+  };
+  const renderVisualCheckbox = (isSelected, isDisabled) => {
+    const checkboxClasses = cn(
+      "w-5 h-5 rounded border-2 cursor-default transition-all duration-200 flex items-center justify-center",
+      isSelected ? "border-primary-950 bg-primary-950 text-text" : "border-border-400 bg-background",
+      isDisabled && "opacity-40 cursor-not-allowed"
+    );
+    return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { className: checkboxClasses, children: isSelected && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_phosphor_react7.Check, { size: 16, weight: "bold" }) });
+  };
+  if (mode === "readonly") {
+    return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { className: cn("flex flex-col gap-2", className), children: choices.map((choice, i) => {
+      const isSelected = actualValue?.includes(choice.value) || false;
+      const statusStyles = getStatusStyles(choice.status);
+      const statusBadge = getStatusBadge(choice.status);
+      return /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
+        "div",
+        {
+          className: cn(
+            "flex flex-row justify-between gap-2 items-start p-2 rounded-lg transition-all",
+            statusStyles,
+            choice.disabled ? "opacity-50 cursor-not-allowed" : ""
+          ),
+          children: [
+            /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("div", { className: "flex items-center gap-2 flex-1", children: [
+              renderVisualCheckbox(isSelected, choice.disabled || disabled),
+              /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+                "span",
+                {
+                  className: cn(
+                    "flex-1",
+                    isSelected || choice.status && choice.status != "neutral" ? "text-text-950" : "text-text-600",
+                    choice.disabled || disabled ? "cursor-not-allowed" : "cursor-default"
+                  ),
+                  children: choice.label
+                }
+              )
+            ] }),
+            statusBadge && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { className: "flex-shrink-0", children: statusBadge })
+          ]
+        },
+        `readonly-${choice.value}-${i}`
+      );
+    }) });
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+    "div",
+    {
+      className: cn(
+        "flex flex-row justify-between gap-2 items-start p-2 rounded-lg transition-all",
+        disabled ? "opacity-50 cursor-not-allowed" : "",
+        className
+      ),
+      children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+        CheckboxList_default,
+        {
+          name,
+          values: actualValue,
+          onValuesChange: (v) => {
+            setActualValue(v);
+            onHandleSelectedValues?.(v);
+          },
+          disabled,
+          children: choices.map((choice, i) => /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
+            "div",
+            {
+              className: "flex flex-row gap-2 items-center",
+              children: [
+                /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+                  CheckboxListItem,
+                  {
+                    value: choice.value,
+                    id: `interactive-${choice.value}-${i}`,
+                    disabled: choice.disabled || disabled
+                  }
+                ),
+                /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+                  "label",
+                  {
+                    htmlFor: `interactive-${choice.value}-${i}`,
+                    className: cn(
+                      "flex-1",
+                      actualValue?.includes(choice.value) ? "text-text-950" : "text-text-600",
+                      choice.disabled || disabled ? "cursor-not-allowed" : "cursor-pointer"
+                    ),
+                    children: choice.label
+                  }
+                )
+              ]
+            },
+            `interactive-${choice.value}-${i}`
+          ))
+        }
+      )
+    }
+  );
+};
+
+// src/components/Quiz/Quiz.tsx
+var import_jsx_runtime16 = require("react/jsx-runtime");
+var Quiz = (0, import_react11.forwardRef)(({ children, className, ...props }, ref) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
     "div",
     {
       ref,
@@ -3727,31 +4247,56 @@ var Quiz = (0, import_react8.forwardRef)(({ children, className, ...props }, ref
     }
   );
 });
-var QuizHeaderResult = (0, import_react8.forwardRef)(
+var QuizHeaderResult = (0, import_react11.forwardRef)(
   ({ className, ...props }, ref) => {
-    const { getCurrentQuestion, getCurrentAnswer } = useQuizStore();
+    const { getCurrentQuestion, getCurrentAnswer, getAllCurrentAnswer } = useQuizStore();
     const currentQuestion = getCurrentQuestion();
     const userAnswer = getCurrentAnswer();
-    const isCorrect = userAnswer === currentQuestion?.correctOptionId;
-    return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(
+    const [isCorrect, setIsCorrect] = (0, import_react11.useState)(false);
+    (0, import_react11.useEffect)(() => {
+      if (currentQuestion?.type === "MULTIPLA_CHOICE" /* MULTIPLA_CHOICE */) {
+        const allCurrentAnswers = getAllCurrentAnswer();
+        const isCorrectOption = currentQuestion.options.filter(
+          (op) => op.isCorrect
+        );
+        if (allCurrentAnswers?.length !== isCorrectOption.length) {
+          setIsCorrect(false);
+          return;
+        }
+        setIsCorrect(true);
+        allCurrentAnswers.forEach((answer) => {
+          const findInCorrectOptions = isCorrectOption.find(
+            (op) => op.id === answer.optionId
+          );
+          if (!findInCorrectOptions) {
+            setIsCorrect(false);
+          }
+        });
+      } else {
+        setIsCorrect(
+          currentQuestion?.options.find((op) => op.id === userAnswer)?.isCorrect || false
+        );
+      }
+    }, [currentQuestion, getAllCurrentAnswer]);
+    return /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(
       "div",
       {
         ref,
         className: cn(
-          "flex flex-row items-center gap-10 p-3.5 rounded-xl",
+          "flex flex-row items-center gap-10 p-3.5 rounded-xl mb-4",
           isCorrect ? "bg-success-background" : "bg-error-background",
           className
         ),
         ...props,
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("p", { className: "text-text-950 font-bold text-lg", children: "Resultado" }),
-          /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("p", { className: "text-text-700 text-md", children: isCorrect ? "\u{1F389} Parab\xE9ns!!" : "N\xE3o foi dessa vez..." })
+          /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("p", { className: "text-text-950 font-bold text-lg", children: "Resultado" }),
+          /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("p", { className: "text-text-700 text-md", children: isCorrect ? "\u{1F389} Parab\xE9ns!!" : "N\xE3o foi dessa vez..." })
         ]
       }
     );
   }
 );
-var QuizTitle = (0, import_react8.forwardRef)(
+var QuizTitle = (0, import_react11.forwardRef)(
   ({ className, ...props }, ref) => {
     const {
       currentQuestionIndex,
@@ -3763,7 +4308,7 @@ var QuizTitle = (0, import_react8.forwardRef)(
     } = useQuizStore();
     const totalQuestions = getTotalQuestions();
     const quizTitle = getQuizTitle();
-    return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(
+    return /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(
       "div",
       {
         ref,
@@ -3773,11 +4318,11 @@ var QuizTitle = (0, import_react8.forwardRef)(
         ),
         ...props,
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("span", { className: "flex flex-col gap-2 text-center", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("p", { className: "text-text-950 font-bold text-md", children: quizTitle }),
-            /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("p", { className: "text-text-600 text-xs", children: totalQuestions > 0 ? `${currentQuestionIndex + 1} de ${totalQuestions}` : "0 de 0" })
+          /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("span", { className: "flex flex-col gap-2 text-center", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("p", { className: "text-text-950 font-bold text-md", children: quizTitle }),
+            /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("p", { className: "text-text-600 text-xs", children: totalQuestions > 0 ? `${currentQuestionIndex + 1} de ${totalQuestions}` : "0 de 0" })
           ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { className: "absolute right-2", children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(Badge_default, { variant: "outlined", action: "info", iconLeft: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_phosphor_react6.Clock, {}), children: isStarted ? formatTime(timeElapsed) : "00:00" }) })
+          /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("span", { className: "absolute right-2", children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(Badge_default, { variant: "outlined", action: "info", iconLeft: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_phosphor_react8.Clock, {}), children: isStarted ? formatTime(timeElapsed) : "00:00" }) })
         ]
       }
     );
@@ -3786,7 +4331,7 @@ var QuizTitle = (0, import_react8.forwardRef)(
 var QuizHeader = () => {
   const { getCurrentQuestion } = useQuizStore();
   const currentQuestion = getCurrentQuestion();
-  return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
     HeaderAlternative,
     {
       title: currentQuestion ? `Quest\xE3o ${currentQuestion.id}` : "Quest\xE3o",
@@ -3795,10 +4340,12 @@ var QuizHeader = () => {
     }
   );
 };
-var QuizContent = (0, import_react8.forwardRef)(({ type = "Alternativas", children, className, ...props }, ref) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(import_jsx_runtime13.Fragment, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("div", { className: "px-4 pb-2 pt-6", children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("p", { className: "font-bold text-lg text-text-950", children: type }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+var QuizContent = (0, import_react11.forwardRef)(({ type = "Alternativas", className, variant, ...props }, ref) => {
+  const { getCurrentQuestion } = useQuizStore();
+  const currentQuestion = getCurrentQuestion();
+  return /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(import_jsx_runtime16.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { className: "px-4 pb-2 pt-6", children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("p", { className: "font-bold text-lg text-text-950", children: type }) }),
+    /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
       "div",
       {
         ref,
@@ -3807,7 +4354,11 @@ var QuizContent = (0, import_react8.forwardRef)(({ type = "Alternativas", childr
           className
         ),
         ...props,
-        children
+        children: currentQuestion && /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(import_jsx_runtime16.Fragment, { children: [
+          currentQuestion.type === "ALTERNATIVA" /* ALTERNATIVA */ && /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(QuizAlternative, { variant }),
+          currentQuestion.type === "MULTIPLA_CHOICE" /* MULTIPLA_CHOICE */ && /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(QuizMultipleChoice, { variant }),
+          currentQuestion.type === "DISSERTATIVA" /* DISSERTATIVA */ && /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { children: "Componente de dissertativa" })
+        ] })
       }
     )
   ] });
@@ -3819,9 +4370,12 @@ var QuizAlternative = ({ variant = "default" }) => {
   const alternatives = currentQuestion?.options?.map((option) => {
     let status = "neutral" /* NEUTRAL */;
     if (variant === "result") {
-      if (option.id === currentQuestion.correctOptionId) {
+      const isCorrectOption = currentQuestion.options.find(
+        (op) => op.isCorrect
+      );
+      if (isCorrectOption?.id === option.id) {
         status = "correct" /* CORRECT */;
-      } else if (currentAnswer === option.id && option.id !== currentQuestion.correctOptionId) {
+      } else if (currentAnswer === option.id && option.id !== isCorrectOption?.id) {
         status = "incorrect" /* INCORRECT */;
       }
     }
@@ -3832,8 +4386,8 @@ var QuizAlternative = ({ variant = "default" }) => {
     };
   });
   if (!alternatives)
-    return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("div", { children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("p", { children: "N\xE3o h\xE1 Alternativas" }) });
-  return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("div", { className: "space-y-4", children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("p", { children: "N\xE3o h\xE1 Alternativas" }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { className: "space-y-4", children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
     AlternativesList,
     {
       mode: variant === "default" ? "interactive" : "readonly",
@@ -3851,6 +4405,77 @@ var QuizAlternative = ({ variant = "default" }) => {
     `question-${currentQuestion?.id || "1"}`
   ) });
 };
+var QuizMultipleChoice = ({
+  variant = "default"
+}) => {
+  const { getCurrentQuestion, selectMultipleAnswer, getAllCurrentAnswer } = useQuizStore();
+  const currentQuestion = getCurrentQuestion();
+  const allCurrentAnswers = getAllCurrentAnswer();
+  const prevSelectedValuesRef = (0, import_react11.useRef)([]);
+  const prevQuestionIdRef = (0, import_react11.useRef)("");
+  const allCurrentAnswerIds = (0, import_react11.useMemo)(() => {
+    return allCurrentAnswers?.map((answer) => answer.optionId) || [];
+  }, [allCurrentAnswers]);
+  const selectedValues = (0, import_react11.useMemo)(() => {
+    return allCurrentAnswerIds?.filter((id) => id !== null) || [];
+  }, [allCurrentAnswerIds]);
+  const stableSelectedValues = (0, import_react11.useMemo)(() => {
+    const currentQuestionId = currentQuestion?.id || "";
+    const hasQuestionChanged = prevQuestionIdRef.current !== currentQuestionId;
+    if (hasQuestionChanged) {
+      prevQuestionIdRef.current = currentQuestionId;
+      prevSelectedValuesRef.current = selectedValues;
+      return selectedValues;
+    }
+    const hasValuesChanged = JSON.stringify(prevSelectedValuesRef.current) !== JSON.stringify(selectedValues);
+    if (hasValuesChanged) {
+      prevSelectedValuesRef.current = selectedValues;
+      return selectedValues;
+    }
+    return prevSelectedValuesRef.current;
+  }, [selectedValues, currentQuestion?.id]);
+  const handleSelectedValues = (0, import_react11.useCallback)(
+    (values) => {
+      if (currentQuestion) {
+        selectMultipleAnswer(currentQuestion.id, values);
+      }
+    },
+    [currentQuestion, selectMultipleAnswer]
+  );
+  const questionKey = (0, import_react11.useMemo)(
+    () => `question-${currentQuestion?.id || "1"}`,
+    [currentQuestion?.id]
+  );
+  const choices = currentQuestion?.options?.map((option) => {
+    let status = "neutral" /* NEUTRAL */;
+    if (variant === "result") {
+      const isAllCorrectOptionId = currentQuestion.options.filter((op) => op.isCorrect).map((op) => op.id);
+      if (isAllCorrectOptionId.includes(option.id)) {
+        status = "correct" /* CORRECT */;
+      } else if (allCurrentAnswerIds?.includes(option.id) && !isAllCorrectOptionId.includes(option.id)) {
+        status = "incorrect" /* INCORRECT */;
+      }
+    }
+    return {
+      label: option.option,
+      value: option.id,
+      status
+    };
+  });
+  if (!choices)
+    return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("p", { children: "N\xE3o h\xE1 Escolhas Multiplas" }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { className: "space-y-4", children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+    MultipleChoiceList,
+    {
+      choices,
+      name: questionKey,
+      selectedValues: stableSelectedValues,
+      onHandleSelectedValues: handleSelectedValues,
+      mode: variant === "default" ? "interactive" : "readonly"
+    },
+    questionKey
+  ) });
+};
 var QuizQuestionList = ({
   filterType = "all",
   onQuestionClick
@@ -3902,16 +4527,16 @@ var QuizQuestionList = ({
         return "Em branco";
     }
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("div", { className: "space-y-6 px-4", children: Object.entries(filteredGroupedQuestions).map(
-    ([subjectId, questions]) => /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("section", { className: "flex flex-col gap-2", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("span", { className: "pt-6 pb-4 flex flex-row gap-2", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("div", { className: "bg-primary-500 p-1 rounded-sm flex items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_phosphor_react6.BookOpen, { size: 17, className: "text-white" }) }),
-        /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("p", { className: "text-text-800 font-bold text-lg", children: subjectId })
+  return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { className: "space-y-6 px-4", children: Object.entries(filteredGroupedQuestions).map(
+    ([subjectId, questions]) => /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("section", { className: "flex flex-col gap-2", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("span", { className: "pt-6 pb-4 flex flex-row gap-2", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { className: "bg-primary-500 p-1 rounded-sm flex items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_phosphor_react8.BookOpen, { size: 17, className: "text-white" }) }),
+        /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("p", { className: "text-text-800 font-bold text-lg", children: subjectId })
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("ul", { className: "flex flex-col gap-2", children: questions.map((question) => {
+      /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("ul", { className: "flex flex-col gap-2", children: questions.map((question) => {
         const status = getQuestionStatus(question.id);
         const questionNumber = getQuestionIndex(question.id);
-        return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+        return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
           CardStatus,
           {
             header: `Quest\xE3o ${questionNumber.toString().padStart(2, "0")}`,
@@ -3927,236 +4552,255 @@ var QuizQuestionList = ({
     ] }, subjectId)
   ) });
 };
-var QuizFooter = (0, import_react8.forwardRef)(({ className, onGoToSimulated, onDetailResult, ...props }, ref) => {
-  const {
-    currentQuestionIndex,
-    getUserAnswers,
-    getTotalQuestions,
-    goToNextQuestion,
-    goToPreviousQuestion,
-    getUnansweredQuestionsFromUserAnswers,
-    getCurrentAnswer,
-    skipQuestion,
-    getCurrentQuestion,
-    getQuestionStatusFromUserAnswers
-  } = useQuizStore();
-  const totalQuestions = getTotalQuestions();
-  const isFirstQuestion = currentQuestionIndex === 0;
-  const isLastQuestion = currentQuestionIndex === totalQuestions - 1;
-  const currentAnswer = getCurrentAnswer();
-  const currentQuestion = getCurrentQuestion();
-  const isCurrentQuestionSkipped = currentQuestion ? getQuestionStatusFromUserAnswers(currentQuestion.id) === "skipped" : false;
-  const [alertDialogOpen, setAlertDialogOpen] = (0, import_react8.useState)(false);
-  const [modalResultOpen, setModalResultOpen] = (0, import_react8.useState)(false);
-  const [modalNavigateOpen, setModalNavigateOpen] = (0, import_react8.useState)(false);
-  const [filterType, setFilterType] = (0, import_react8.useState)("all");
-  const unansweredQuestions = getUnansweredQuestionsFromUserAnswers();
-  const userAnswers = getUserAnswers();
-  const allQuestions = getTotalQuestions();
-  return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(import_jsx_runtime13.Fragment, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(
-      "footer",
-      {
-        ref,
-        className: cn(
-          "w-full px-2 bg-background lg:max-w-[1000px] not-lg:max-w-[calc(100vw-32px)] border-t border-border-50 fixed bottom-0 min-h-[80px] flex flex-row justify-between items-center",
-          className
-        ),
-        ...props,
-        children: [
-          /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: "flex flex-row items-center gap-1", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
-              IconButton_default,
-              {
-                icon: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_phosphor_react6.SquaresFour, { size: 24, className: "text-text-950" }),
-                size: "md",
-                onClick: () => setModalNavigateOpen(true)
-              }
-            ),
-            isFirstQuestion ? /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+var QuizFooter = (0, import_react11.forwardRef)(
+  ({
+    className,
+    onGoToSimulated,
+    onDetailResult,
+    variant = "default",
+    ...props
+  }, ref) => {
+    const {
+      currentQuestionIndex,
+      getUserAnswers,
+      getTotalQuestions,
+      goToNextQuestion,
+      goToPreviousQuestion,
+      getUnansweredQuestionsFromUserAnswers,
+      getCurrentAnswer,
+      skipQuestion,
+      getCurrentQuestion,
+      getQuestionStatusFromUserAnswers,
+      getActiveQuiz
+    } = useQuizStore();
+    const totalQuestions = getTotalQuestions();
+    const isFirstQuestion = currentQuestionIndex === 0;
+    const isLastQuestion = currentQuestionIndex === totalQuestions - 1;
+    const currentAnswer = getCurrentAnswer();
+    const currentQuestion = getCurrentQuestion();
+    const isCurrentQuestionSkipped = currentQuestion ? getQuestionStatusFromUserAnswers(currentQuestion.id) === "skipped" : false;
+    const [alertDialogOpen, setAlertDialogOpen] = (0, import_react11.useState)(false);
+    const [modalResultOpen, setModalResultOpen] = (0, import_react11.useState)(false);
+    const [modalNavigateOpen, setModalNavigateOpen] = (0, import_react11.useState)(false);
+    const [filterType, setFilterType] = (0, import_react11.useState)("all");
+    const unansweredQuestions = getUnansweredQuestionsFromUserAnswers();
+    const userAnswers = getUserAnswers();
+    const allQuestions = getTotalQuestions();
+    return /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(import_jsx_runtime16.Fragment, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+        "footer",
+        {
+          ref,
+          className: cn(
+            "w-full px-2 bg-background lg:max-w-[1000px] not-lg:max-w-[calc(100vw-32px)] border-t border-border-50 fixed bottom-0 min-h-[80px] flex flex-row justify-between items-center",
+            className
+          ),
+          ...props,
+          children: variant === "default" ? /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(import_jsx_runtime16.Fragment, { children: [
+            /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { className: "flex flex-row items-center gap-1", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+                IconButton_default,
+                {
+                  icon: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_phosphor_react8.SquaresFour, { size: 24, className: "text-text-950" }),
+                  size: "md",
+                  onClick: () => setModalNavigateOpen(true)
+                }
+              ),
+              isFirstQuestion ? /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+                Button_default,
+                {
+                  variant: "outline",
+                  size: "small",
+                  onClick: () => {
+                    skipQuestion();
+                    goToNextQuestion();
+                  },
+                  children: "Pular"
+                }
+              ) : /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+                Button_default,
+                {
+                  size: "medium",
+                  variant: "link",
+                  action: "primary",
+                  iconLeft: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_phosphor_react8.CaretLeft, { size: 18 }),
+                  onClick: () => {
+                    goToPreviousQuestion();
+                  },
+                  children: "Voltar"
+                }
+              )
+            ] }),
+            !isFirstQuestion && /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
               Button_default,
               {
-                variant: "outline",
                 size: "small",
+                variant: "outline",
+                action: "primary",
                 onClick: () => {
                   skipQuestion();
                   goToNextQuestion();
                 },
                 children: "Pular"
               }
-            ) : /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+            ),
+            isLastQuestion ? /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+              Button_default,
+              {
+                size: "medium",
+                variant: "solid",
+                action: "primary",
+                disabled: !currentAnswer && !isCurrentQuestionSkipped,
+                onClick: () => {
+                  if (unansweredQuestions.length > 0) {
+                    setAlertDialogOpen(true);
+                  } else {
+                    setModalResultOpen(true);
+                  }
+                },
+                children: "Finalizar"
+              }
+            ) : /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
               Button_default,
               {
                 size: "medium",
                 variant: "link",
                 action: "primary",
-                iconLeft: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_phosphor_react6.CaretLeft, { size: 18 }),
+                iconRight: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_phosphor_react8.CaretRight, { size: 18 }),
+                disabled: !currentAnswer && !isCurrentQuestionSkipped,
                 onClick: () => {
-                  goToPreviousQuestion();
+                  goToNextQuestion();
                 },
-                children: "Voltar"
+                children: "Avan\xE7ar"
               }
             )
-          ] }),
-          !isFirstQuestion && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
-            Button_default,
-            {
-              size: "small",
-              variant: "outline",
-              action: "primary",
-              onClick: () => {
-                skipQuestion();
-                goToNextQuestion();
-              },
-              children: "Pular"
-            }
-          ),
-          isLastQuestion ? /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
-            Button_default,
-            {
-              size: "medium",
-              variant: "solid",
-              action: "primary",
-              disabled: !currentAnswer && !isCurrentQuestionSkipped,
-              onClick: () => {
-                if (unansweredQuestions.length > 0) {
-                  setAlertDialogOpen(true);
-                } else {
-                  setModalResultOpen(true);
-                }
-              },
-              children: "Finalizar"
-            }
-          ) : /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
-            Button_default,
-            {
-              size: "medium",
-              variant: "link",
-              action: "primary",
-              iconRight: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_phosphor_react6.CaretRight, { size: 18 }),
-              disabled: !currentAnswer && !isCurrentQuestionSkipped,
-              onClick: () => {
-                goToNextQuestion();
-              },
-              children: "Avan\xE7ar"
-            }
-          )
-        ]
-      }
-    ),
-    /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
-      AlertDialog,
-      {
-        isOpen: alertDialogOpen,
-        onChangeOpen: setAlertDialogOpen,
-        title: "Finalizar simulado?",
-        description: unansweredQuestions.length > 0 ? `Voc\xEA deixou as quest\xF5es ${unansweredQuestions.join(", ")} sem resposta. Finalizar agora pode impactar seu desempenho.` : "Tem certeza que deseja finalizar o simulado?",
-        cancelButtonLabel: "Voltar e revisar",
-        submitButtonLabel: "Finalizar Mesmo Assim",
-        onSubmit: () => {
-          setModalResultOpen(true);
+          ] }) : /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { className: "flex flex-row items-center justify-end w-full", children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(Button_default, { variant: "solid", action: "primary", size: "medium", children: "Ver Resolu\xE7\xE3o" }) })
         }
-      }
-    ),
-    /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
-      Modal_default,
-      {
-        isOpen: modalResultOpen,
-        onClose: () => setModalResultOpen(false),
-        title: "",
-        closeOnBackdropClick: false,
-        closeOnEscape: false,
-        hideCloseButton: true,
-        size: "md",
-        children: /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: "flex flex-col w-full h-full items-center justify-center gap-4", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
-            "img",
-            {
-              src: simulated_result_default,
-              alt: "Simulated Result",
-              className: "w-[282px] h-auto object-cover"
-            }
-          ),
-          /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: "flex flex-col gap-2 text-center", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("h2", { className: "text-text-950 font-bold text-lg", children: "Voc\xEA concluiu o simulado!" }),
-            /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("p", { className: "text-text-500 font-sm", children: [
-              "Voc\xEA acertou",
-              " ",
-              userAnswers.filter(
-                (answer) => answer.answerKey === answer.correctOptionId
-              ).length,
-              " ",
-              "de ",
-              allQuestions,
-              " quest\xF5es."
-            ] })
-          ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: "px-6 flex flex-row items-center gap-2 w-full", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
-              Button_default,
+      ),
+      /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+        AlertDialog,
+        {
+          isOpen: alertDialogOpen,
+          onChangeOpen: setAlertDialogOpen,
+          title: "Finalizar simulado?",
+          description: unansweredQuestions.length > 0 ? `Voc\xEA deixou as quest\xF5es ${unansweredQuestions.join(", ")} sem resposta. Finalizar agora pode impactar seu desempenho.` : "Tem certeza que deseja finalizar o simulado?",
+          cancelButtonLabel: "Voltar e revisar",
+          submitButtonLabel: "Finalizar Mesmo Assim",
+          onSubmit: () => {
+            setModalResultOpen(true);
+          }
+        }
+      ),
+      /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+        Modal_default,
+        {
+          isOpen: modalResultOpen,
+          onClose: () => setModalResultOpen(false),
+          title: "",
+          closeOnBackdropClick: false,
+          closeOnEscape: false,
+          hideCloseButton: true,
+          size: "md",
+          children: /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { className: "flex flex-col w-full h-full items-center justify-center gap-4", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+              "img",
               {
-                variant: "outline",
-                className: "w-full",
-                size: "small",
-                onClick: onGoToSimulated,
-                children: "Ir para simulados"
+                src: simulated_result_default,
+                alt: "Simulated Result",
+                className: "w-[282px] h-auto object-cover"
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(Button_default, { className: "w-full", onClick: onDetailResult, children: "Detalhar resultado" })
-          ] })
-        ] })
-      }
-    ),
-    /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
-      Modal_default,
-      {
-        isOpen: modalNavigateOpen,
-        onClose: () => setModalNavigateOpen(false),
-        title: "Quest\xF5es",
-        size: "lg",
-        children: /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: "flex flex-col w-full h-full", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: "flex flex-row justify-between items-center py-6 pt-6 pb-4 border-b border-border-200", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("p", { className: "text-text-950 font-bold text-lg", children: "Filtrar por" }),
-            /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { className: "max-w-[266px]", children: /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(Select_default, { value: filterType, onValueChange: setFilterType, children: [
-              /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(SelectTrigger, { variant: "rounded", className: "max-w-[266px]", children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(SelectValue, { placeholder: "Selecione uma op\xE7\xE3o" }) }),
-              /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(SelectContent, { children: [
-                /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(SelectItem, { value: "all", children: "Todas" }),
-                /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(SelectItem, { value: "unanswered", children: "Em branco" }),
-                /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(SelectItem, { value: "answered", children: "Respondidas" })
+            /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { className: "flex flex-col gap-2 text-center", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("h2", { className: "text-text-950 font-bold text-lg", children: "Voc\xEA concluiu o simulado!" }),
+              /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("p", { className: "text-text-500 font-sm", children: [
+                "Voc\xEA acertou",
+                " ",
+                (() => {
+                  const activeQuiz = getActiveQuiz();
+                  if (!activeQuiz) return 0;
+                  return userAnswers.filter((answer) => {
+                    const question = activeQuiz.quiz.questions.find(
+                      (q) => q.id === answer.questionId
+                    );
+                    const isCorrectOption = question?.options.find(
+                      (op) => op.isCorrect
+                    );
+                    return question && answer.optionId === isCorrectOption?.id;
+                  }).length;
+                })(),
+                " ",
+                "de ",
+                allQuestions,
+                " quest\xF5es."
               ] })
-            ] }) })
-          ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("div", { className: "flex flex-col gap-2 not-lg:h-[calc(100vh-200px)] lg:max-h-[687px] overflow-y-auto", children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
-            QuizQuestionList,
-            {
-              filterType,
-              onQuestionClick: () => setModalNavigateOpen(false)
-            }
-          ) })
-        ] })
-      }
-    )
-  ] });
-});
-var QuizResultHeaderTitle = (0, import_react8.forwardRef)(({ className, ...props }, ref) => {
+            ] }),
+            /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { className: "px-6 flex flex-row items-center gap-2 w-full", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+                Button_default,
+                {
+                  variant: "outline",
+                  className: "w-full",
+                  size: "small",
+                  onClick: onGoToSimulated,
+                  children: "Ir para simulados"
+                }
+              ),
+              /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(Button_default, { className: "w-full", onClick: onDetailResult, children: "Detalhar resultado" })
+            ] })
+          ] })
+        }
+      ),
+      /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+        Modal_default,
+        {
+          isOpen: modalNavigateOpen,
+          onClose: () => setModalNavigateOpen(false),
+          title: "Quest\xF5es",
+          size: "lg",
+          children: /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { className: "flex flex-col w-full h-full", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { className: "flex flex-row justify-between items-center py-6 pt-6 pb-4 border-b border-border-200", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("p", { className: "text-text-950 font-bold text-lg", children: "Filtrar por" }),
+              /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("span", { className: "max-w-[266px]", children: /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(Select_default, { value: filterType, onValueChange: setFilterType, children: [
+                /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(SelectTrigger, { variant: "rounded", className: "max-w-[266px]", children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(SelectValue, { placeholder: "Selecione uma op\xE7\xE3o" }) }),
+                /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(SelectContent, { children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(SelectItem, { value: "all", children: "Todas" }),
+                  /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(SelectItem, { value: "unanswered", children: "Em branco" }),
+                  /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(SelectItem, { value: "answered", children: "Respondidas" })
+                ] })
+              ] }) })
+            ] }),
+            /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { className: "flex flex-col gap-2 not-lg:h-[calc(100vh-200px)] lg:max-h-[687px] overflow-y-auto", children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+              QuizQuestionList,
+              {
+                filterType,
+                onQuestionClick: () => setModalNavigateOpen(false)
+              }
+            ) })
+          ] })
+        }
+      )
+    ] });
+  }
+);
+var QuizResultHeaderTitle = (0, import_react11.forwardRef)(({ className, ...props }, ref) => {
   const { bySimulated } = useQuizStore();
-  return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(
     "div",
     {
       ref,
       className: cn("flex flex-row pt-4 justify-between", className),
       ...props,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("p", { className: "text-text-950 font-bold text-2xl", children: "Resultado" }),
-        bySimulated && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(Badge_default, { variant: "solid", action: "info", children: bySimulated.category })
+        /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("p", { className: "text-text-950 font-bold text-2xl", children: "Resultado" }),
+        bySimulated && /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(Badge_default, { variant: "solid", action: "info", children: bySimulated.category })
       ]
     }
   );
 });
-var QuizResultTitle = (0, import_react8.forwardRef)(({ className, ...props }, ref) => {
+var QuizResultTitle = (0, import_react11.forwardRef)(({ className, ...props }, ref) => {
   const { getQuizTitle } = useQuizStore();
   const quizTitle = getQuizTitle();
-  return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
     "p",
     {
       className: cn("pt-6 pb-4 text-text-950 font-bold text-lg", className),
@@ -4166,7 +4810,7 @@ var QuizResultTitle = (0, import_react8.forwardRef)(({ className, ...props }, re
     }
   );
 });
-var QuizResultPerformance = (0, import_react8.forwardRef)(
+var QuizResultPerformance = (0, import_react11.forwardRef)(
   ({ ...props }, ref) => {
     const {
       getTotalQuestions,
@@ -4174,7 +4818,8 @@ var QuizResultPerformance = (0, import_react8.forwardRef)(
       formatTime,
       bySimulated,
       byActivity,
-      byQuestionary
+      byQuestionary,
+      getUserAnswerByQuestionId
     } = useQuizStore();
     const totalQuestions = getTotalQuestions();
     const quiz = bySimulated || byActivity || byQuestionary;
@@ -4187,8 +4832,10 @@ var QuizResultPerformance = (0, import_react8.forwardRef)(
     let totalDifficultQuestions = 0;
     if (quiz) {
       quiz.questions.forEach((question) => {
-        const userAnswer = question.answerKey;
-        const isCorrect = userAnswer && userAnswer === question.correctOptionId;
+        const userAnswerItem = getUserAnswerByQuestionId(question.id);
+        const userAnswer = userAnswerItem?.optionId;
+        const isCorrectOption = question?.options.find((op) => op.isCorrect);
+        const isCorrect = userAnswer && userAnswer === isCorrectOption?.id;
         if (isCorrect) {
           correctAnswers++;
         }
@@ -4211,15 +4858,15 @@ var QuizResultPerformance = (0, import_react8.forwardRef)(
       });
     }
     const percentage = totalQuestions > 0 ? Math.round(correctAnswers / totalQuestions * 100) : 0;
-    return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(
+    return /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(
       "div",
       {
         className: "flex flex-row gap-6 p-6 rounded-xl bg-background justify-between",
         ref,
         ...props,
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: "relative", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { className: "relative", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
               ProgressCircle_default,
               {
                 size: "medium",
@@ -4229,21 +4876,21 @@ var QuizResultPerformance = (0, import_react8.forwardRef)(
                 label: ""
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: "absolute inset-0 flex flex-col items-center justify-center", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: "flex items-center gap-1 mb-1", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_phosphor_react6.Clock, { size: 12, weight: "regular", className: "text-text-800" }),
-                /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { className: "text-2xs font-medium text-text-800", children: formatTime(timeElapsed) })
+            /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { className: "absolute inset-0 flex flex-col items-center justify-center", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { className: "flex items-center gap-1 mb-1", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_phosphor_react8.Clock, { size: 12, weight: "regular", className: "text-text-800" }),
+                /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("span", { className: "text-2xs font-medium text-text-800", children: formatTime(timeElapsed) })
               ] }),
-              /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: "text-2xl font-medium text-text-800 leading-7", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { className: "text-2xl font-medium text-text-800 leading-7", children: [
                 correctAnswers,
                 " de ",
                 totalQuestions
               ] }),
-              /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("div", { className: "text-2xs font-medium text-text-600 mt-1", children: "Corretas" })
+              /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { className: "text-2xs font-medium text-text-600 mt-1", children: "Corretas" })
             ] })
           ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: "flex flex-col gap-4 w-full", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { className: "flex flex-col gap-4 w-full", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
               ProgressBar_default,
               {
                 className: "w-full",
@@ -4257,7 +4904,7 @@ var QuizResultPerformance = (0, import_react8.forwardRef)(
                 percentageClassName: "text-xs font-medium leading-[14px] text-right"
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
               ProgressBar_default,
               {
                 className: "w-full",
@@ -4271,7 +4918,7 @@ var QuizResultPerformance = (0, import_react8.forwardRef)(
                 percentageClassName: "text-xs font-medium leading-[14px] text-right"
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
               ProgressBar_default,
               {
                 className: "w-full",
@@ -4291,8 +4938,12 @@ var QuizResultPerformance = (0, import_react8.forwardRef)(
     );
   }
 );
-var QuizListResult = (0, import_react8.forwardRef)(({ className, onSubjectClick, ...props }, ref) => {
-  const { getQuestionsGroupedBySubject, isQuestionAnswered } = useQuizStore();
+var QuizListResult = (0, import_react11.forwardRef)(({ className, onSubjectClick, ...props }, ref) => {
+  const {
+    getQuestionsGroupedBySubject,
+    isQuestionAnswered,
+    getUserAnswerByQuestionId
+  } = useQuizStore();
   const groupedQuestions = getQuestionsGroupedBySubject();
   const subjectsStats = Object.entries(groupedQuestions).map(
     ([subjectId, questions]) => {
@@ -4300,8 +4951,10 @@ var QuizListResult = (0, import_react8.forwardRef)(({ className, onSubjectClick,
       let incorrect = 0;
       questions.forEach((question) => {
         if (isQuestionAnswered(question.id)) {
-          const userAnswer = question.answerKey;
-          if (userAnswer === question.correctOptionId) {
+          const userAnswerItem = getUserAnswerByQuestionId(question.id);
+          const userAnswer = userAnswerItem?.optionId;
+          const isCorrectOption = question?.options.find((op) => op.isCorrect);
+          if (userAnswer === isCorrectOption?.id) {
             correct++;
           } else {
             incorrect++;
@@ -4316,9 +4969,9 @@ var QuizListResult = (0, import_react8.forwardRef)(({ className, onSubjectClick,
       };
     }
   );
-  return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("section", { ref, className, ...props, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("p", { className: "pt-6 pb-4 text-text-950 font-bold text-lg", children: "Mat\xE9rias" }),
-    /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("ul", { className: "flex flex-col gap-2", children: subjectsStats.map((subject) => /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("li", { children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("section", { ref, className, ...props, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("p", { className: "pt-6 pb-4 text-text-950 font-bold text-lg", children: "Mat\xE9rias" }),
+    /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("ul", { className: "flex flex-col gap-2", children: subjectsStats.map((subject) => /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("li", { children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
       CardResults,
       {
         onClick: () => onSubjectClick?.(subject.subject),
@@ -4326,7 +4979,7 @@ var QuizListResult = (0, import_react8.forwardRef)(({ className, onSubjectClick,
         header: subject.subject,
         correct_answers: subject.correct,
         incorrect_answers: subject.incorrect,
-        icon: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_phosphor_react6.Book, { size: 20 }),
+        icon: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_phosphor_react8.Book, { size: 20 }),
         direction: "row"
       }
     ) }, subject.subject)) })
@@ -4336,19 +4989,25 @@ var QuizListResultByMateria = ({
   subject,
   onQuestionClick
 }) => {
-  const { getQuestionsGroupedBySubject } = useQuizStore();
+  const { getQuestionsGroupedBySubject, getUserAnswerByQuestionId } = useQuizStore();
   const groupedQuestions = getQuestionsGroupedBySubject();
   const answeredQuestions = groupedQuestions[subject] || [];
-  return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: "w-full max-w-[1000px] flex flex-col mx-auto h-full relative not-lg:px-6", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("div", { className: "flex flex-row pt-4 justify-between", children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("p", { className: "text-text-950 font-bold text-2xl", children: subject }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("section", { className: "flex flex-col ", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("p", { className: "pt-6 pb-4 text-text-950 font-bold text-lg", children: "Resultado das quest\xF5es" }),
-      /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("ul", { className: "flex flex-col gap-2 pt-4", children: answeredQuestions.map((question) => /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("li", { children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { className: "w-full max-w-[1000px] flex flex-col mx-auto h-full relative not-lg:px-6", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { className: "flex flex-row pt-4 justify-between", children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("p", { className: "text-text-950 font-bold text-2xl", children: subject }) }),
+    /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("section", { className: "flex flex-col ", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("p", { className: "pt-6 pb-4 text-text-950 font-bold text-lg", children: "Resultado das quest\xF5es" }),
+      /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("ul", { className: "flex flex-col gap-2 pt-4", children: answeredQuestions.map((question) => /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("li", { children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
         CardStatus,
         {
           className: "max-w-full",
           header: `Quest\xE3o ${question.id}`,
-          status: question.answerKey === question.correctOptionId ? "correct" : "incorrect",
+          status: (() => {
+            const userAnswer = getUserAnswerByQuestionId(question.id);
+            const isCorrectOption = question?.options.find(
+              (op) => op.isCorrect
+            );
+            return userAnswer && userAnswer.optionId === isCorrectOption?.id ? "correct" : "incorrect";
+          })(),
           onClick: () => onQuestionClick?.(question)
         }
       ) }, question.id)) })
@@ -4365,10 +5024,10 @@ var QuizListResultByMateria = ({
   QuizHeaderResult,
   QuizListResult,
   QuizListResultByMateria,
+  QuizMultipleChoice,
   QuizQuestionList,
   QuizResultHeaderTitle,
   QuizResultPerformance,
   QuizResultTitle,
   QuizTitle
 });
-//# sourceMappingURL=index.js.map