UNPKG

analytica-frontend-lib

Version:

Repositório público dos componentes utilizados nas plataformas da Analytica Ensino

1,187 lines (1,090 loc) 73.4 kB
"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } } function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; } var _chunkOITBOOARjs = require('./chunk-OITBOOAR.js'); var _chunk536MQUJGjs = require('./chunk-536MQUJG.js'); var _chunk52VZ6TOFjs = require('./chunk-52VZ6TOF.js'); var _chunkAJC7YAEKjs = require('./chunk-AJC7YAEK.js'); var _chunkXOJ3ERALjs = require('./chunk-XOJ3ERAL.js'); var _chunk7W6XZZKKjs = require('./chunk-7W6XZZKK.js'); var _chunkHYCL2IYZjs = require('./chunk-HYCL2IYZ.js'); var _chunkYBM4EYPAjs = require('./chunk-YBM4EYPA.js'); var _chunkDR7XX7RNjs = require('./chunk-DR7XX7RN.js'); var _chunkHZE6VBF5js = require('./chunk-HZE6VBF5.js'); var _chunkHN2HFYUOjs = require('./chunk-HN2HFYUO.js'); var _chunkSZD7L65Qjs = require('./chunk-SZD7L65Q.js'); var _chunkZK5QTM5Cjs = require('./chunk-ZK5QTM5C.js'); var _chunkJR4KWECXjs = require('./chunk-JR4KWECX.js'); var _chunkLWUL5WRWjs = require('./chunk-LWUL5WRW.js'); var _chunkNEDUOGWUjs = require('./chunk-NEDUOGWU.js'); var _chunkMIEC42PLjs = require('./chunk-MIEC42PL.js'); var _chunkCMUIZOUVjs = require('./chunk-CMUIZOUV.js'); var _chunk7A33ZIFEjs = require('./chunk-7A33ZIFE.js'); var _chunkCFD6NHL7js = require('./chunk-CFD6NHL7.js'); var _chunkBJMKBBN3js = require('./chunk-BJMKBBN3.js'); var _chunkORRSVKFKjs = require('./chunk-ORRSVKFK.js'); var _chunkTCLRDUMFjs = require('./chunk-TCLRDUMF.js'); var _chunk34ST3MKOjs = require('./chunk-34ST3MKO.js'); var _chunkANT66KVKjs = require('./chunk-ANT66KVK.js'); var _chunkTN3AYOMVjs = require('./chunk-TN3AYOMV.js'); var _chunkB27BOQ2Ejs = require('./chunk-B27BOQ2E.js'); // src/components/RecommendedLessonDetails/RecommendedLessonDetails.tsx var _react = require('react'); // src/components/RecommendedLessonDetails/components/Breadcrumb.tsx var _react3 = require('@phosphor-icons/react'); var _jsxruntime = require('react/jsx-runtime'); var Breadcrumb = ({ items, onItemClick }) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "nav", { className: "flex items-center gap-2 text-sm", "aria-label": "Breadcrumb", children: items.map((item, index) => /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _chunkANT66KVKjs.Text_default, { as: "span", className: "flex items-center gap-2", children: [ index > 0 && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _react3.CaretRightIcon, { size: 14, className: "text-text-500" }), item.path ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "button", { type: "button", onClick: () => _optionalChain([onItemClick, 'optionalCall', _ => _(item.path)]), className: "text-text-600 hover:text-primary-700 transition-colors", children: item.label } ) : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkANT66KVKjs.Text_default, { as: "span", className: "text-text-950 font-medium", children: item.label }) ] }, _nullishCoalesce(item.path, () => ( item.label)) )) }); // src/components/RecommendedLessonDetails/components/LessonHeader.tsx // src/components/RecommendedLessonDetails/utils/lessonDetailsUtils.ts var formatDate = (dateString) => { if (!dateString) return "-"; const date = new Date(dateString); if (Number.isNaN(date.getTime())) return "-"; return date.toLocaleDateString("pt-BR", { day: "2-digit", month: "2-digit", year: "numeric" }); }; var transformStudentForDisplay = (student, deadline) => ({ id: student.userInstitutionId, name: student.name, status: _chunk536MQUJGjs.deriveStudentStatus.call(void 0, student.progress, student.completedAt, deadline), completionPercentage: student.progress, duration: _chunk536MQUJGjs.formatDaysToComplete.call(void 0, student.daysToComplete) }); // src/components/RecommendedLessonDetails/components/LessonHeader.tsx var LessonHeader = ({ data, onViewLesson, mapSubjectNameToEnum, viewLessonLabel }) => { const { recommendedClass, breakdown } = data; const subjectName = _optionalChain([recommendedClass, 'access', _2 => _2.lessons, 'access', _3 => _3[0], 'optionalAccess', _4 => _4.supLessonsProgress, 'optionalAccess', _5 => _5.lesson, 'optionalAccess', _6 => _6.subject, 'optionalAccess', _7 => _7.name]) || ""; const subjectEnum = _optionalChain([mapSubjectNameToEnum, 'optionalCall', _8 => _8(subjectName)]); const subjectInfo = subjectEnum ? _chunk7A33ZIFEjs.getSubjectInfo.call(void 0, subjectEnum) : null; return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "bg-background rounded-xl border border-border-50 p-6", children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex flex-col lg:flex-row lg:items-start lg:justify-between gap-4", children: [ /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex flex-col gap-2", children: [ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkANT66KVKjs.Text_default, { as: "h1", size: "xl", weight: "bold", className: "text-text-950 lg:text-2xl", children: recommendedClass.title } ), /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex flex-wrap items-center gap-2 text-sm text-text-600", children: [ /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _chunkANT66KVKjs.Text_default, { as: "span", size: "sm", className: "text-text-600", children: [ "In\xEDcio em ", formatDate(recommendedClass.startDate) ] }), /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkANT66KVKjs.Text_default, { as: "span", size: "sm", className: "text-text-400", children: "\u2022" }), /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _chunkANT66KVKjs.Text_default, { as: "span", size: "sm", className: "text-text-600", children: [ "Prazo final ", formatDate(recommendedClass.finalDate) ] }), _optionalChain([breakdown, 'optionalAccess', _9 => _9.schoolName]) && /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkANT66KVKjs.Text_default, { as: "span", size: "sm", className: "text-text-400", children: "\u2022" }), /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkANT66KVKjs.Text_default, { as: "span", size: "sm", className: "text-text-600", children: breakdown.schoolName }) ] }), subjectName && /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkANT66KVKjs.Text_default, { as: "span", size: "sm", className: "text-text-400", children: "\u2022" }), /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _chunkANT66KVKjs.Text_default, { as: "span", size: "sm", className: "flex items-center gap-1", children: [ subjectInfo && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkANT66KVKjs.Text_default, { as: "span", className: _chunkTN3AYOMVjs.cn.call(void 0, "size-5 rounded flex items-center justify-center text-white", subjectInfo.colorClass ), children: subjectInfo.icon } ), subjectName ] }) ] }), _optionalChain([breakdown, 'optionalAccess', _10 => _10.className]) && /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkANT66KVKjs.Text_default, { as: "span", size: "sm", className: "text-text-400", children: "\u2022" }), /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkANT66KVKjs.Text_default, { as: "span", size: "sm", className: "text-text-600", children: breakdown.className }) ] }) ] }) ] }), onViewLesson && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk34ST3MKOjs.Button_default, { variant: "solid", action: "primary", size: "small", iconLeft: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _react3.BookBookmarkIcon, { size: 16 }), onClick: onViewLesson, children: viewLessonLabel } ) ] }) }); }; // src/components/RecommendedLessonDetails/components/LoadingSkeleton.tsx var LoadingSkeleton = () => /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex flex-col gap-6", children: [ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkNEDUOGWUjs.SkeletonText, { width: 256 }), /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "bg-background rounded-xl border border-border-50 p-6", children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex flex-col gap-3", children: [ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkNEDUOGWUjs.SkeletonText, { width: "75%", height: 28 }), /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkNEDUOGWUjs.SkeletonText, { width: "50%" }) ] }) }), /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex flex-col gap-4", children: [ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkNEDUOGWUjs.SkeletonText, { width: 192, height: 20 }), /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "grid grid-cols-1 md:grid-cols-3 gap-4", children: [ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkNEDUOGWUjs.SkeletonRounded, { height: 140 }), /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkNEDUOGWUjs.SkeletonRounded, { height: 140 }), /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkNEDUOGWUjs.SkeletonRounded, { height: 140 }) ] }) ] }), /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "bg-background rounded-xl border border-border-50 p-4", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkNEDUOGWUjs.SkeletonTable, { rows: 4, columns: 5 }) }) ] }); // src/components/RecommendedLessonDetails/components/ResultsSection.tsx var ResultsSection = ({ data, labels }) => { const { details } = data; const { aggregated, contentPerformance } = details; return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex flex-col gap-4", children: [ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkANT66KVKjs.Text_default, { as: "h2", size: "md", weight: "semibold", className: "text-text-950", children: labels.resultsTitle }), /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "bg-background rounded-xl border border-border-50 p-4", children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "grid grid-cols-1 md:grid-cols-3 gap-4", children: [ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "flex flex-col items-center justify-center rounded-xl p-4 min-h-28 bg-primary-50", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkMIEC42PLjs.ProgressCircle_default, { value: aggregated.completionPercentage, size: "small", variant: "blue", label: labels.completedLabel, showPercentage: true } ) }), /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex flex-col items-center justify-center rounded-xl p-4 min-h-28 bg-success-200", children: [ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkANT66KVKjs.Text_default, { as: "span", className: "size-8 rounded-full flex items-center justify-center bg-warning-300 mb-2", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _react3.TrophyIcon, { size: 18, weight: "fill", className: "text-white" }) } ), /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkANT66KVKjs.Text_default, { size: "2xs", weight: "bold", className: "text-text-700 uppercase text-center leading-none mb-1", children: labels.bestResultLabel } ), /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkANT66KVKjs.Text_default, { size: "xl", weight: "bold", className: "text-success-700 text-center leading-none tracking-wide", children: _optionalChain([contentPerformance, 'access', _11 => _11.best, 'optionalAccess', _12 => _12.contentName]) || "-" } ) ] }), /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex flex-col items-center justify-center rounded-xl p-4 min-h-28 bg-error-100", children: [ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkANT66KVKjs.Text_default, { as: "span", className: "size-8 rounded-full flex items-center justify-center bg-error-300 mb-2", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _react3.WarningIcon, { size: 18, weight: "fill", className: "text-error-700" }) } ), /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkANT66KVKjs.Text_default, { size: "2xs", weight: "bold", className: "text-text-700 uppercase text-center leading-none mb-1", children: labels.hardestTopicLabel } ), /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkANT66KVKjs.Text_default, { size: "xl", weight: "bold", className: "text-error-700 text-center leading-none tracking-wide", children: _optionalChain([contentPerformance, 'access', _13 => _13.worst, 'optionalAccess', _14 => _14.contentName]) || "-" } ) ] }) ] }) }) ] }); }; // src/components/RecommendedLessonDetails/components/StudentsTable.tsx var StudentsTable = ({ students, onCorrectActivity, labels, emptyMessage = "Nenhum aluno encontrado" }) => { const { sortedData, sortColumn, sortDirection, handleSort } = _chunkLWUL5WRWjs.useTableSort.call(void 0, students); return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "bg-background rounded-xl border border-border-50 overflow-hidden", children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _chunkLWUL5WRWjs.Table_default, { children: [ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkLWUL5WRWjs.TableHeader, { children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _chunkLWUL5WRWjs.TableRow, { children: [ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkLWUL5WRWjs.TableHead, { sortable: true, sortDirection: sortColumn === "name" ? sortDirection : void 0, onSort: () => handleSort("name"), children: labels.studentColumn } ), /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkLWUL5WRWjs.TableHead, { sortable: true, sortDirection: sortColumn === "status" ? sortDirection : void 0, onSort: () => handleSort("status"), children: labels.statusColumn } ), /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkLWUL5WRWjs.TableHead, { sortable: true, sortDirection: sortColumn === "completionPercentage" ? sortDirection : void 0, onSort: () => handleSort("completionPercentage"), children: labels.completionColumn } ), /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkLWUL5WRWjs.TableHead, { children: labels.durationColumn }), /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkLWUL5WRWjs.TableHead, { className: "w-[160px]" }) ] }) }), /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkLWUL5WRWjs.TableBody, { children: sortedData.length === 0 ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkLWUL5WRWjs.TableRow, { children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkLWUL5WRWjs.TableCell, { colSpan: 5, className: "text-center py-8", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkANT66KVKjs.Text_default, { size: "sm", className: "text-text-500", children: emptyMessage }) }) }) : sortedData.map((student) => /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _chunkLWUL5WRWjs.TableRow, { children: [ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkLWUL5WRWjs.TableCell, { className: "max-w-[220px]", children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex items-center gap-2 min-w-0", children: [ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkANT66KVKjs.Text_default, { as: "span", className: "size-8 rounded-full bg-background-100 flex items-center justify-center shrink-0", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _react3.UserIcon, { size: 16, className: "text-text-500" }) } ), /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkZK5QTM5Cjs.TruncatedText, { size: "sm", color: "text-text-950", children: student.name }) ] }) }), /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkLWUL5WRWjs.TableCell, { children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkBJMKBBN3js.Badge_default, { variant: "solid", action: _chunk536MQUJGjs.getStudentStatusBadgeAction.call(void 0, student.status), size: "small", children: student.status } ) }), /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkLWUL5WRWjs.TableCell, { children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex flex-col gap-1 min-w-[120px]", children: [ /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _chunkANT66KVKjs.Text_default, { size: "sm", className: "text-primary-700 font-medium", children: [ student.completionPercentage, "%" ] }), /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkCMUIZOUVjs.ProgressBar_default, { value: student.completionPercentage, size: "small", variant: "blue", className: "w-full max-w-[100px]" } ) ] }) }), /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkLWUL5WRWjs.TableCell, { children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkANT66KVKjs.Text_default, { size: "sm", className: "text-text-700", children: _nullishCoalesce(student.duration, () => ( "-")) }) }), /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkLWUL5WRWjs.TableCell, { children: onCorrectActivity && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk34ST3MKOjs.Button_default, { variant: "outline", size: "extra-small", onClick: () => onCorrectActivity(student.id), children: labels.correctActivity } ) }) ] }, student.id)) }) ] }) }); }; // src/components/RecommendedLessonDetails/components/StudentPerformanceModal.tsx var _LightbulbFilament = require('@phosphor-icons/react/dist/csr/LightbulbFilament'); var _WarningCircle = require('@phosphor-icons/react/dist/csr/WarningCircle'); var _User = require('@phosphor-icons/react/dist/csr/User'); var _CheckCircle = require('@phosphor-icons/react/dist/csr/CheckCircle'); var _XCircle = require('@phosphor-icons/react/dist/csr/XCircle'); var PerformanceCard = ({ icon, label, value, secondaryLabel, secondaryValue, variant }) => { const headerBgColor = { success: "bg-success-200", error: "bg-error-100" }[variant]; const valueColor = { success: "text-success-700", error: "text-error-700" }[variant]; const iconBgColor = { success: "bg-warning-300", error: "bg-error-300" }[variant]; const secondaryLabelColor = { success: "text-success-600", error: "text-error-600" }[variant]; return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex flex-col rounded-xl border border-border-50 bg-background overflow-hidden", children: [ /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: `flex flex-col items-center justify-center p-4 gap-1 ${headerBgColor}`, children: [ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkANT66KVKjs.Text_default, { as: "span", className: `size-8 rounded-full flex items-center justify-center ${iconBgColor}`, children: icon } ), /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkANT66KVKjs.Text_default, { size: "2xs", weight: "medium", className: "text-text-800 uppercase text-center leading-none", children: label } ), /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkANT66KVKjs.Text_default, { size: "xl", weight: "bold", className: `${valueColor} text-center`, children: value }) ] } ), /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex flex-col items-center gap-2 px-4 py-3", children: [ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkANT66KVKjs.Text_default, { size: "2xs", weight: "medium", className: `${secondaryLabelColor} uppercase text-center`, children: secondaryLabel } ), /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkBJMKBBN3js.Badge_default, { size: "large", action: "info", children: secondaryValue || "-" }) ] }) ] }); }; var getAlternativeStatus = (isCorrect, isSelected) => { if (isCorrect) { return "correct" /* CORRECT */; } if (isSelected) { return "incorrect" /* INCORRECT */; } return void 0; }; var mapAlternatives = (question) => { return question.alternatives.map((alt) => ({ value: alt.id, label: alt.text, status: getAlternativeStatus(alt.isCorrect, alt.isSelected) })); }; var getSelectedValue = (question) => { const selected = question.alternatives.find((alt) => alt.isSelected); return _optionalChain([selected, 'optionalAccess', _15 => _15.id]); }; var QuestionAccordionItem = ({ question, index }) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkYBM4EYPAjs.CardAccordation, { value: question.id, className: "bg-background rounded-xl border border-border-50", triggerClassName: "py-5 px-5", contentClassName: "px-5 pb-5", trigger: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex items-center justify-between flex-1", children: [ /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _chunkANT66KVKjs.Text_default, { size: "sm", weight: "semibold", className: "text-text-950", children: [ "Quest\xE3o ", index + 1 ] }), /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkBJMKBBN3js.Badge_default, { size: "small", action: question.isCorrect ? "success" : "error", variant: "solid", iconLeft: question.isCorrect ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _CheckCircle.CheckCircleIcon, {}) : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _XCircle.XCircleIcon, {}), children: question.isCorrect ? "Correta" : "Incorreta" } ) ] }), children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex flex-col gap-3", children: [ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkHZE6VBF5js.HtmlMathRenderer_default, { content: question.statement, className: "text-sm text-text-700" } ), /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkYBM4EYPAjs.CardAccordation, { value: `${question.id}-alternatives`, className: "bg-background rounded-lg border border-border-50", triggerClassName: "py-5 px-5", contentClassName: "px-5 py-5", trigger: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkANT66KVKjs.Text_default, { size: "sm", weight: "medium", className: "text-text-800", children: "Alternativas" }), children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkDR7XX7RNjs.AlternativesList, { mode: "readonly", alternatives: mapAlternatives(question), selectedValue: getSelectedValue(question), layout: "default" } ) } ) ] }) } ); var LessonAccordionItem = ({ lesson }) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkYBM4EYPAjs.CardAccordation, { value: lesson.id, className: "bg-background rounded-xl border border-border-50", triggerClassName: "py-5 px-5", contentClassName: "px-5 pb-5", trigger: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex flex-col gap-1 flex-1", children: [ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkANT66KVKjs.Text_default, { size: "sm", weight: "semibold", className: "text-text-950", children: lesson.title }), /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkCMUIZOUVjs.ProgressBar_default, { value: lesson.progress, variant: "blue", size: "medium", showPercentage: true, layout: "default" } ) ] }), children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "flex flex-col gap-2", children: lesson.questions.map((question, index) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, QuestionAccordionItem, { question, index }, question.id )) }) } ); var LoadingSkeleton2 = () => /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex flex-col gap-4 animate-pulse", children: [ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-6 bg-background-200 rounded w-48" }), /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "grid grid-cols-2 gap-3", children: [ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-44 bg-background-200 rounded-xl" }), /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-44 bg-background-200 rounded-xl" }) ] }) ] }); var ErrorContent = ({ message }) => /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex flex-col items-center justify-center py-8 gap-3", children: [ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkANT66KVKjs.Text_default, { as: "span", className: "size-12 rounded-full bg-error-100 flex items-center justify-center", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _WarningCircle.WarningCircleIcon, { size: 24, className: "text-error-700" }) } ), /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkANT66KVKjs.Text_default, { size: "md", className: "text-error-700 text-center", children: message }) ] }); var PerformanceContent = ({ data, labels }) => /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex flex-col gap-5", children: [ /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex items-center gap-2", children: [ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkANT66KVKjs.Text_default, { as: "span", className: "size-8 rounded-full bg-background-100 flex items-center justify-center", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _User.UserIcon, { size: 16, className: "text-text-500" }) } ), /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkANT66KVKjs.Text_default, { size: "md", weight: "medium", className: "text-text-950", children: data.studentName }) ] }), /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "grid grid-cols-2 gap-3", children: [ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, PerformanceCard, { icon: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _LightbulbFilament.LightbulbFilamentIcon, { size: 18, weight: "fill", className: "text-white" } ), label: labels.correctAnswersLabel, value: data.correctAnswers, secondaryLabel: labels.bestResultLabel, secondaryValue: data.bestResult, variant: "success" } ), /* @__PURE__ */ _jsxruntime.jsx.call(void 0, PerformanceCard, { icon: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _WarningCircle.WarningCircleIcon, { size: 18, weight: "fill", className: "text-error-700" } ), label: labels.incorrectAnswersLabel, value: data.incorrectAnswers, secondaryLabel: labels.hardestTopicLabel, secondaryValue: data.hardestTopic, variant: "error" } ) ] }), data.lessons.length > 0 && /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex flex-col gap-3", children: [ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkANT66KVKjs.Text_default, { size: "md", weight: "semibold", className: "text-text-950", children: labels.lessonsTitle }), /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "flex flex-col gap-2", children: data.lessons.map((lesson) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, LessonAccordionItem, { lesson }, lesson.id)) }) ] }) ] }); var renderModalContent = (loading, error, data, labels) => { if (loading) { return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, LoadingSkeleton2, {}); } if (error) { return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, ErrorContent, { message: error }); } if (data) { return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, PerformanceContent, { data, labels }); } return null; }; var StudentPerformanceModal = ({ isOpen, onClose, data, loading = false, error = null, labels: customLabels }) => { const labels = _react.useMemo.call(void 0, () => ({ ..._chunkOITBOOARjs.DEFAULT_PERFORMANCE_LABELS, ...customLabels }), [customLabels] ); if (!data && !loading && !error) { return null; } return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkTCLRDUMFjs.Modal_default, { isOpen, onClose, title: labels.title, size: "lg", contentClassName: "max-h-[70vh] overflow-y-auto", children: renderModalContent(loading, error, data, labels) } ); }; // src/components/RecommendedLessonDetails/components/StudentActivityPerformanceModal.tsx var _Timer = require('@phosphor-icons/react/dist/csr/Timer'); var _Trophy = require('@phosphor-icons/react/dist/csr/Trophy'); var _Warning = require('@phosphor-icons/react/dist/csr/Warning'); var EssayCorrectionField = { IsCorrect: "isCorrect", TeacherFeedback: "teacherFeedback" }; var infoVariantConfig = { time: { borderColor: "border-primary-200", labelColor: "text-primary-600", IconComponent: _Timer.TimerIcon, iconColor: "text-primary-600" }, best: { borderColor: "border-success-200", labelColor: "text-success-600", IconComponent: _Trophy.TrophyIcon, iconColor: "text-success-600" }, hardest: { borderColor: "border-error-200", labelColor: "text-error-600", IconComponent: _Warning.WarningIcon, iconColor: "text-error-600" } }; var InfoCard = ({ label, value, variant }) => { const config = infoVariantConfig[variant]; return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: _chunkTN3AYOMVjs.cn.call(void 0, "border rounded-xl py-3 px-4 flex flex-col items-center justify-center gap-2", config.borderColor ), children: [ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkANT66KVKjs.Text_default, { className: _chunkTN3AYOMVjs.cn.call(void 0, "text-2xs font-medium uppercase", config.labelColor), children: label }), /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkBJMKBBN3js.Badge_default, { size: "large", action: "info", children: value || "-" }) ] } ); }; var getAlternativeStatus2 = (isCorrect, isSelected) => { if (isCorrect) return "correct" /* CORRECT */; if (isSelected) return "incorrect" /* INCORRECT */; return void 0; }; var mapAlternatives2 = (question) => { return question.alternatives.map((alt) => ({ value: alt.id, label: alt.text, status: getAlternativeStatus2(alt.isCorrect, alt.isSelected) })); }; var getSelectedValue2 = (question) => { const selected = question.alternatives.find((alt) => alt.isSelected); return _optionalChain([selected, 'optionalAccess', _16 => _16.id]); }; var getBadgeAction = (isCorrect) => { if (isCorrect === true) return "success"; if (isCorrect === false) return "error"; return "info"; }; var getBadgeLabel = (isCorrect, labels) => { if (isCorrect === true) return labels.markCorrect; if (isCorrect === false) return labels.markIncorrect; return labels.pending; }; var getQuestionKey = (question) => { if (question.answerId) { return question.answerId; } return `${question.activityId}-${question.id}`; }; var LessonItem = ({ lesson }) => /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "bg-background rounded-xl border border-border-50 py-4 px-4 flex flex-col gap-2", children: [ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkANT66KVKjs.Text_default, { size: "sm", weight: "semibold", className: "text-text-950", children: lesson.title }), /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex items-center gap-2", children: [ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkCMUIZOUVjs.ProgressBar_default, { value: lesson.progress, size: "small", variant: "blue", className: "flex-1" } ), /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _chunkANT66KVKjs.Text_default, { size: "xs", className: "text-primary-700 font-medium min-w-[40px] text-right", children: [ lesson.progress, "%" ] } ) ] }) ] }); var LoadingSkeleton3 = () => /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { "data-testid": "loading-skeleton", className: "flex flex-col gap-4 animate-pulse", children: [ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-6 bg-background-200 rounded w-48" }), /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "grid grid-cols-3 gap-3", children: [ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-28 bg-background-200 rounded-xl" }), /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-28 bg-background-200 rounded-xl" }), /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-28 bg-background-200 rounded-xl" }) ] }), /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "grid grid-cols-3 gap-3", children: [ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-20 bg-background-200 rounded-xl" }), /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-20 bg-background-200 rounded-xl" }), /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-20 bg-background-200 rounded-xl" }) ] }) ] } ); var ErrorContent2 = ({ message }) => /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex flex-col items-center justify-center py-8 gap-3", children: [ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkANT66KVKjs.Text_default, { as: "span", className: "size-12 rounded-full bg-error-100 flex items-center justify-center", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _WarningCircle.WarningCircleIcon, { size: 24, className: "text-error-700" }) } ), /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkANT66KVKjs.Text_default, { size: "md", className: "text-error-700 text-center", children: message }) ] }); var StudentActivityPerformanceModal = ({ isOpen, onClose, data, loading = false, error = null, apiClient, labels: customLabels }) => { const labels = _react.useMemo.call(void 0, () => ({ ..._chunkOITBOOARjs.DEFAULT_ACTIVITY_PERFORMANCE_LABELS, ...customLabels }), [customLabels] ); const addToast = _chunkHYCL2IYZjs.ToastStore_default.call(void 0, (state) => state.addToast); const [essayCorrections, setEssayCorrections] = _react.useState.call(void 0, {}); _react.useEffect.call(void 0, () => { if (isOpen && data) { const initialCorrections = {}; data.activities.forEach((activity) => { activity.questions.forEach((question) => { const questionKey = getQuestionKey(question); initialCorrections[questionKey] = { isCorrect: question.isCorrect, teacherFeedback: question.teacherFeedback || "", isSaving: false, isSaved: question.isCorrect != null }; }); }); setEssayCorrections(initialCorrections); } }, [isOpen, data]); const updateEssayCorrection = _react.useCallback.call(void 0, (questionId, field, value) => { setEssayCorrections((prev) => ({ ...prev, [questionId]: { ...prev[questionId], [field]: value, // Reset isSaved when any field changes so badge doesn't update until saved isSaved: false } })); }, [] ); const handleSaveEssayCorrection = _react.useCallback.call(void 0, async (question) => { if (!apiClient || !data) return; const questionKey = getQuestionKey(question); const correction = essayCorrections[questionKey]; if (_optionalChain([correction, 'optionalAccess', _17 => _17.isCorrect]) == null) { return; } setEssayCorrections((prev) => ({ ...prev, [questionKey]: { ...prev[questionKey], isSaving: true } })); try { await apiClient.post( `/activities/${question.activityId}/students/${data.userId}/questions/correction`, { questionId: question.id, isCorrect: correction.isCorrect, teacherFeedback: correction.teacherFeedback } ); setEssayCorrections((prev) => ({ ...prev, [questionKey]: { ...prev[questionKey], isSaving: false, isSaved: true } })); addToast({ title: "Corre\xE7\xE3o salva", description: `A corre\xE7\xE3o da quest\xE3o foi salva com sucesso.`, variant: "solid", action: "success", position: "top-right" }); } catch (err) { console.error("Erro ao salvar corre\xE7\xE3o da quest\xE3o:", err); setEssayCorrections((prev) => ({ ...prev, [questionKey]: { ...prev[questionKey], isSaving: false } })); addToast({ title: "Erro ao salvar corre\xE7\xE3o", description: "N\xE3o foi poss\xEDvel salvar a corre\xE7\xE3o. Tente novamente.", variant: "solid", action: "warning", position: "top-right" }); } }, [apiClient, data, essayCorrections, addToast] ); const handleClose = _react.useCallback.call(void 0, () => { setEssayCorrections({}); onClose(); }, [onClose]); const renderCorrectionFields = (question) => { const questionKey = getQuestionKey(question); const correction = essayCorrections[questionKey] || { isCorrect: null, teacherFeedback: "", isSaving: false, isSaved: false }; let radioValue; if (correction.isCorrect === null) { radioValue = void 0; } else if (correction.isCorrect) { radioValue = "true"; } else { radioValue = "false"; } return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "space-y-4 border-t border-border-100 pt-4 mt-4", children: [ /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "space-y-2", children: [ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkANT66KVKjs.Text_default, { className: "text-sm font-semibold text-text-950", children: labels.isCorrectQuestionLabel }), /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex gap-4", children: [ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkJR4KWECXjs.Radio_default, { name: `isCorrect-${questionKey}`, value: "true", id: `correct-yes-${questionKey}`, label: labels.correctYes, size: "medium", checked: radioValue === "true", disabled: correction.isSaving, onChange: (e) => { if (e.target.checked) { updateEssayCorrection( questionKey, EssayCorrectionField.IsCorrect, true ); } } } ), /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkJR4KWECXjs.Radio_default, { name: `isCorrect-${questionKey}`, value: "false", id: `correct-no-${questionKey}`, label: labels.correctNo, size: "medium", checked: radioValue === "false", disabled: correction.isSaving, onChange: (e) => { if (e.target.checked) { updateEssayCorrection( questionKey, EssayCorrectionField.IsCorrect, false ); } } } ) ] }) ] }), /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "space-y-2", children: [ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkANT66KVKjs.Text_default, { className: "text-sm font-semibold text-text-950", children: labels.observationLabel }), /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkSZD7L65Qjs.TextArea_default, { value: correction.teacherFeedback, onChange: (e) => { updateEssayCorrection( questionKey, EssayCorrectionField.TeacherFeedback, e.target.value ); }, placeholder: labels.feedbackPlaceholder, rows: 4, size: "medium", disabled: correction.isSaving } ) ] }), /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk34ST3MKOjs.Button_default, { size: "small", onClick: () => handleSaveEssayCorrection(question), disabled: correction.isCorrect === null || correction.isSaving, children: correction.isSaving ? labels.saving : labels.saveCorrection } ) ] }); }; const renderQuestionAccordionItem = (question, index) => { const questionKey = getQuestionKey(question); const localCorrection = essayCorrections[questionKey]; const hasLocalSavedCorrection = _optionalChain([localCorrection, 'optionalAccess', _18 => _18.isSaved]) && _optionalChain([localCorrection, 'optionalAccess', _19 => _19.isCorrect]) != null; const displayIsCorrect = hasLocalSavedCorrection ? localCorrection.isCorrect : question.isCorrect; return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkYBM4EYPAjs.CardAccordation, { value: questionKey, className: "bg-background rounded-xl border border-border-50", triggerClassName: "py-4 px-4", contentClassName: "px-4 pb-4", trigger: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex items-center justify-between flex-1", children: [ /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _chunkANT66KVKjs.Text_default, { size: "sm", weight: "semibold", className: "text-text-950", children: [ "Quest\xE3o ", index + 1 ] }), /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkBJMKBBN3js.Badge_default, { size: "small", action: getBadgeAction(displayIsCorrect), variant: "solid", children: getBadgeLabel(displayIsCorrect, labels) } ) ] }), children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex flex-col gap-4", children: [ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkHZE6VBF5js.HtmlMathRenderer_default, { content: question.statement, className: "text-sm text-text-700" } ), question.alternatives.length > 0 && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkYBM4EYPAjs.CardAccordation, { value: `${questionKey}-alternatives`, className: "bg-background rounded-lg border border-border-50", triggerClassName: "py-4 px-4", contentClassName: "px-4 py-4", trigger: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkANT66KVKjs.Text_default, { size: "sm", weight: "medium", className: "text-text-800", children: "Alternativas" }), children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkDR7XX7RNjs.AlternativesList, { mode: "readonly", alternatives: mapAlternatives2(question), selectedValue: getSelectedValue2(question), layout: "default" } ) } ), apiClient && question.questionType === "DISSERTATIVA" && renderCorrectionFields(question) ] }) }, questionKey ); }; const renderActivityAccordionItem = (activity) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkYBM4EYPAjs.CardAccordation, { value: activity.id, className: "bg-background rounded-xl border border-border-50", triggerClassName: "py-4 px-4", contentClassName: "px-4 pb-4", trigger: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkANT66KVKjs.Text_default, { size: "sm", weight: "semibold", className: "text-text-950", children: activity.title }), children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk7W6XZZKKjs.AccordionGroup, { type: "multiple", className: "flex flex-col gap-2", children: activity.questions.map( (question, index) => renderQuestionAccordionItem(question, index) ) }) }, activity.id ); if (!data && !loading && !error) { return null; } const renderContent = () => { if (loading) { return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, LoadingSkeleton3, {}); } if (error) { return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, ErrorContent2, { message: error }); } if (data) { const formattedScore = data.score == null ? "-" : data.score.toFixed(1); return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex flex-col gap-5", children: [ /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex items-center gap-2", children: [ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkANT66KVKjs.Text_default, { as: "span", className: "size-8 rounded-full bg-background-100 flex items-center justify-center", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _User.UserIcon, { size: 16, className: "text-text-500" }) } ), /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkANT66KVKjs.Text_default, { size: "md", weight: "medium", className: "text-text-950", children: data.studentName }) ] }), /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkANT66KVKjs.Text_default, { size: "md", weight: "semibold", className: "text-text-950", children: labels.resultTitle }), /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "grid grid-cols-3 gap-3", children: [ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkXOJ3ERALjs.StatCard, { label: labels.scoreLabel, value: formattedScore, variant: "score" } ), /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkXOJ3ERALjs.StatCard, { label: labels.correctAnswersLabel, value: data.correctAnswers, variant: "correct" } ), /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkXOJ3ERALjs.StatCard, { label: labels.incorrectAnswersLabel, value: data.incorrectAnswers, variant: "incorrect" } ) ] }), /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "grid grid-cols-3 gap-3", children: [ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, InfoCard, { label: labels.completionTimeLabel, value: data.completionTime, variant: "time" } ), /* @__PURE__ */ _jsxruntime.jsx.call(void 0, InfoCard, {