analytica-frontend-lib 1.2.0 → 1.2.2

package/dist/index.js

@@ -8237,7 +8237,7 @@ var StatCard = ({ item, showPlaceholder = false }) => {
           {
             size: "xs",
             weight: "bold",
-            className: "uppercase text-[8px] leading-[9px] text-text-800 self-stretch",
+            className: "uppercase text-[8px] leading-[9px] text-text-800 whitespace-nowrap",
             children: item.label
           }
         )
@@ -8273,8 +8273,18 @@ var StatisticsCard = ({
       className: `bg-background rounded-xl p-4 h-auto lg:h-[185px] flex flex-col gap-2 ${className}`,
       children: [
         /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)("div", { className: "flex flex-row justify-between items-center gap-4", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(Text_default, { as: "h3", size: "sm", weight: "medium", color: "text-text-600", children: title }),
-          dropdownOptions && dropdownOptions.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("div", { className: "w-[99px]", children: /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(
+          /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
+            Text_default,
+            {
+              as: "h3",
+              size: "sm",
+              weight: "medium",
+              color: "text-text-600",
+              className: "flex-1 min-w-0",
+              children: title
+            }
+          ),
+          dropdownOptions && dropdownOptions.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("div", { className: "w-[120px] min-w-[90px] sm:shrink-0", children: /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(
             Select_default,
             {
               value: selectedDropdownValue,
@@ -8284,12 +8294,20 @@ var StatisticsCard = ({
                 /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
                   SelectTrigger,
                   {
-                    className: "border border-border-300 rounded whitespace-nowrap",
+                    className: "border border-border-300 rounded [&>span]:whitespace-nowrap [&>span]:overflow-hidden [&>span]:text-ellipsis",
                     "aria-label": dropdownAriaLabel,
                     children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(SelectValue, { placeholder: selectPlaceholder })
                   }
                 ),
-                /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(SelectContent, { children: dropdownOptions.map((option) => /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(SelectItem, { value: option.value, children: option.label }, option.value)) })
+                /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(SelectContent, { className: "min-w-[120px]", children: dropdownOptions.map((option) => /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
+                  SelectItem,
+                  {
+                    value: option.value,
+                    className: "whitespace-nowrap",
+                    children: option.label
+                  },
+                  option.value
+                )) })
               ]
             }
           ) })
@@ -11268,10 +11286,15 @@ var QuizAlternative = ({ paddingBottom }) => {
       const isSelected = currentQuestionResult?.selectedOptions.some(
         (selectedOption) => selectedOption.optionId === option.id
       );
-      if (isCorrectOption) {
-        status = "correct" /* CORRECT */;
-      } else if (isSelected && !isCorrectOption) {
-        status = "incorrect" /* INCORRECT */;
+      const shouldShowCorrectAnswers = currentQuestionResult?.answerStatus !== "PENDENTE_AVALIACAO" /* PENDENTE_AVALIACAO */ && currentQuestionResult?.answerStatus !== "NAO_RESPONDIDO" /* NAO_RESPONDIDO */;
+      if (shouldShowCorrectAnswers) {
+        if (isCorrectOption) {
+          status = "correct" /* CORRECT */;
+        } else if (isSelected && !isCorrectOption) {
+          status = "incorrect" /* INCORRECT */;
+        } else {
+          status = "neutral" /* NEUTRAL */;
+        }
       } else {
         status = "neutral" /* NEUTRAL */;
       }
@@ -11369,10 +11392,15 @@ var QuizMultipleChoice = ({ paddingBottom }) => {
       const isSelected = currentQuestionResult?.selectedOptions?.some(
         (op) => op.optionId === option.id
       );
-      if (isCorrectOption) {
-        status = "correct" /* CORRECT */;
-      } else if (isSelected && !isCorrectOption) {
-        status = "incorrect" /* INCORRECT */;
+      const shouldShowCorrectAnswers = currentQuestionResult?.answerStatus !== "PENDENTE_AVALIACAO" /* PENDENTE_AVALIACAO */ && currentQuestionResult?.answerStatus !== "NAO_RESPONDIDO" /* NAO_RESPONDIDO */;
+      if (shouldShowCorrectAnswers) {
+        if (isCorrectOption) {
+          status = "correct" /* CORRECT */;
+        } else if (isSelected && !isCorrectOption) {
+          status = "incorrect" /* INCORRECT */;
+        } else {
+          status = "neutral" /* NEUTRAL */;
+        }
       } else {
         status = "neutral" /* NEUTRAL */;
       }
@@ -11475,8 +11503,8 @@ var QuizTrueOrFalse = ({ paddingBottom }) => {
       isCorrect: false
     }
   ];
-  const getLetterByIndex = (index) => String.fromCharCode(97 + index);
-  const isDefaultVariant = variant == "default";
+  const getLetterByIndex = (index) => String.fromCodePoint(97 + index);
+  const isDefaultVariant = variant === "default";
   return /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)(import_jsx_runtime52.Fragment, { children: [
     /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(QuizSubTitle, { subTitle: "Alternativas" }),
     /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(QuizContainer, { className: cn("", paddingBottom), children: /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("div", { className: "flex flex-col gap-3.5", children: options.map((option, index) => {
@@ -11491,7 +11519,7 @@ var QuizTrueOrFalse = ({ paddingBottom }) => {
               {
                 className: cn(
                   "flex flex-row justify-between items-center gap-2 p-2 rounded-md",
-                  !isDefaultVariant ? getStatusStyles(variantCorrect) : ""
+                  isDefaultVariant ? "" : getStatusStyles(variantCorrect)
                 ),
                 children: [
                   /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("p", { className: "text-text-900 text-sm", children: getLetterByIndex(index).concat(") ").concat(option.label) }),
@@ -11592,7 +11620,7 @@ var QuizConnectDots = ({ paddingBottom }) => {
       return next;
     });
   };
-  const getLetterByIndex = (index) => String.fromCharCode(97 + index);
+  const getLetterByIndex = (index) => String.fromCodePoint(97 + index);
   const isDefaultVariant = variant === "default";
   const assignedDots = new Set(
     userAnswers.map((a) => a.dotOption).filter(Boolean)
@@ -11608,7 +11636,7 @@ var QuizConnectDots = ({ paddingBottom }) => {
           {
             className: cn(
               "flex flex-row justify-between items-center gap-2 p-2 rounded-md",
-              !isDefaultVariant ? getStatusStyles(variantCorrect) : ""
+              isDefaultVariant ? "" : getStatusStyles(variantCorrect)
             ),
             children: [
               /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("p", { className: "text-text-900 text-sm", children: getLetterByIndex(index) + ") " + option.label }),
@@ -11690,8 +11718,10 @@ var QuizFill = ({ paddingBottom }) => {
   const [answers, setAnswers] = (0, import_react36.useState)({});
   const baseId = (0, import_react36.useId)();
   const getAvailableOptionsForSelect = (selectId) => {
-    const usedOptions = Object.entries(answers).filter(([key]) => key !== selectId).map(([, value]) => value);
-    return options.filter((option) => !usedOptions.includes(option));
+    const usedOptions = new Set(
+      Object.entries(answers).filter(([key]) => key !== selectId).map(([, value]) => value)
+    );
+    return options.filter((option) => !usedOptions.has(option));
   };
   const handleSelectChange = (selectId, value) => {
     const newAnswers = { ...answers, [selectId]: value };
@@ -12576,7 +12606,11 @@ var QuizBadge = ({
 };
 var QuizHeaderResult = (0, import_react38.forwardRef)(
   ({ className, ...props }, ref) => {
-    const { getQuestionResultByQuestionId, getCurrentQuestion } = useQuizStore();
+    const {
+      getQuestionResultByQuestionId,
+      getCurrentQuestion,
+      questionsResult
+    } = useQuizStore();
     const [status, setStatus] = (0, import_react38.useState)(void 0);
     (0, import_react38.useEffect)(() => {
       const cq = getCurrentQuestion();
@@ -12589,9 +12623,13 @@ var QuizHeaderResult = (0, import_react38.forwardRef)(
     }, [
       getCurrentQuestion,
       getQuestionResultByQuestionId,
-      getCurrentQuestion()?.id
+      getCurrentQuestion()?.id,
+      questionsResult
     ]);
     const getClassesByAnswersStatus = () => {
+      if (status === void 0) {
+        return "bg-gray-100";
+      }
       switch (status) {
         case "RESPOSTA_CORRETA" /* RESPOSTA_CORRETA */:
           return "bg-success-background";
@@ -12604,6 +12642,9 @@ var QuizHeaderResult = (0, import_react38.forwardRef)(
       }
     };
     const getLabelByAnswersStatus = () => {
+      if (status === void 0) {
+        return "Carregando...";
+      }
       switch (status) {
         case "RESPOSTA_CORRETA" /* RESPOSTA_CORRETA */:
           return "\u{1F389} Parab\xE9ns!!";
@@ -12612,6 +12653,7 @@ var QuizHeaderResult = (0, import_react38.forwardRef)(
         case "PENDENTE_AVALIACAO" /* PENDENTE_AVALIACAO */:
           return "Avalia\xE7\xE3o pendente";
         case "NAO_RESPONDIDO" /* NAO_RESPONDIDO */:
+          return "N\xE3o foi dessa vez...voc\xEA deixou a resposta em branco";
         default:
           return "N\xE3o foi dessa vez...voc\xEA deixou a resposta em branco";
       }
@@ -12677,6 +12719,37 @@ var QuizResultTitle = (0, import_react38.forwardRef)(({ className, ...props }, r
     }
   );
 });
+var updateDifficultyStats = (stats, difficulty, isCorrect) => {
+  if (difficulty === "FACIL" /* FACIL */) {
+    stats.totalEasyQuestions++;
+    if (isCorrect) stats.correctEasyAnswers++;
+  } else if (difficulty === "MEDIO" /* MEDIO */) {
+    stats.totalMediumQuestions++;
+    if (isCorrect) stats.correctMediumAnswers++;
+  } else if (difficulty === "DIFICIL" /* DIFICIL */) {
+    stats.totalDifficultQuestions++;
+    if (isCorrect) stats.correctDifficultAnswers++;
+  }
+};
+var calculateAnswerStatistics = (answers) => {
+  const stats = {
+    correctAnswers: 0,
+    correctEasyAnswers: 0,
+    correctMediumAnswers: 0,
+    correctDifficultAnswers: 0,
+    totalEasyQuestions: 0,
+    totalMediumQuestions: 0,
+    totalDifficultQuestions: 0
+  };
+  for (const answer of answers) {
+    const isCorrect = answer.answerStatus === "RESPOSTA_CORRETA" /* RESPOSTA_CORRETA */;
+    if (isCorrect) {
+      stats.correctAnswers++;
+    }
+    updateDifficultyStats(stats, answer.difficultyLevel, isCorrect);
+  }
+  return stats;
+};
 var QuizResultPerformance = (0, import_react38.forwardRef)(({ showDetails = true, ...props }, ref) => {
   const {
     getTotalQuestions,
@@ -12686,38 +12759,16 @@ var QuizResultPerformance = (0, import_react38.forwardRef)(({ showDetails = true
   } = useQuizStore();
   const totalQuestions = getTotalQuestions();
   const questionResult = getQuestionResult();
-  let correctAnswers = 0;
-  let correctEasyAnswers = 0;
-  let correctMediumAnswers = 0;
-  let correctDifficultAnswers = 0;
-  let totalEasyQuestions = 0;
-  let totalMediumQuestions = 0;
-  let totalDifficultQuestions = 0;
-  if (questionResult) {
-    questionResult.answers.forEach((answer) => {
-      const isCorrect = answer.answerStatus == "RESPOSTA_CORRETA" /* RESPOSTA_CORRETA */;
-      if (isCorrect) {
-        correctAnswers++;
-      }
-      if (answer.difficultyLevel === "FACIL" /* FACIL */) {
-        totalEasyQuestions++;
-        if (isCorrect) {
-          correctEasyAnswers++;
-        }
-      } else if (answer.difficultyLevel === "MEDIO" /* MEDIO */) {
-        totalMediumQuestions++;
-        if (isCorrect) {
-          correctMediumAnswers++;
-        }
-      } else if (answer.difficultyLevel === "DIFICIL" /* DIFICIL */) {
-        totalDifficultQuestions++;
-        if (isCorrect) {
-          correctDifficultAnswers++;
-        }
-      }
-    });
-  }
-  const percentage = totalQuestions > 0 ? Math.round(correctAnswers / totalQuestions * 100) : 0;
+  const stats = questionResult ? calculateAnswerStatistics(questionResult.answers) : {
+    correctAnswers: 0,
+    correctEasyAnswers: 0,
+    correctMediumAnswers: 0,
+    correctDifficultAnswers: 0,
+    totalEasyQuestions: 0,
+    totalMediumQuestions: 0,
+    totalDifficultQuestions: 0
+  };
+  const percentage = totalQuestions > 0 ? Math.round(stats.correctAnswers / totalQuestions * 100) : 0;
   const classesJustifyBetween = showDetails ? "justify-between" : "justify-center";
   return /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)(
     "div",
@@ -12763,8 +12814,8 @@ var QuizResultPerformance = (0, import_react38.forwardRef)(({ showDetails = true
               className: "w-full",
               layout: "stacked",
               variant: "green",
-              value: correctEasyAnswers,
-              max: totalEasyQuestions,
+              value: stats.correctEasyAnswers,
+              max: stats.totalEasyQuestions,
               label: "F\xE1ceis",
               showHitCount: true,
               labelClassName: "text-base font-medium text-text-800 leading-none",
@@ -12777,8 +12828,8 @@ var QuizResultPerformance = (0, import_react38.forwardRef)(({ showDetails = true
               className: "w-full",
               layout: "stacked",
               variant: "green",
-              value: correctMediumAnswers,
-              max: totalMediumQuestions,
+              value: stats.correctMediumAnswers,
+              max: stats.totalMediumQuestions,
               label: "M\xE9dias",
               showHitCount: true,
               labelClassName: "text-base font-medium text-text-800 leading-none",
@@ -12791,8 +12842,8 @@ var QuizResultPerformance = (0, import_react38.forwardRef)(({ showDetails = true
               className: "w-full",
               layout: "stacked",
               variant: "green",
-              value: correctDifficultAnswers,
-              max: totalDifficultQuestions,
+              value: stats.correctDifficultAnswers,
+              max: stats.totalDifficultQuestions,
               label: "Dif\xEDceis",
               showHitCount: true,
               labelClassName: "text-base font-medium text-text-800 leading-none",
@@ -12812,13 +12863,13 @@ var QuizListResult = (0, import_react38.forwardRef)(({ className, onSubjectClick
     ([subjectId, questions]) => {
       let correct = 0;
       let incorrect = 0;
-      questions.forEach((question) => {
-        if (question.answerStatus == "RESPOSTA_CORRETA" /* RESPOSTA_CORRETA */) {
+      for (const question of questions) {
+        if (question.answerStatus === "RESPOSTA_CORRETA" /* RESPOSTA_CORRETA */) {
           correct++;
         } else {
           incorrect++;
         }
-      });
+      }
       return {
         subject: {
           name: questions?.[0]?.knowledgeMatrix?.[0]?.subject?.name ?? "Sem mat\xE9ria",