@tinyweb_dev/oe-exam-sdk 0.1.30 → 0.1.32

package/dist/components/exams/ExamPreviewDialog.d.ts

@@ -1,4 +1,5 @@
 import type { ExamQuestionsSdkApi } from '../../api/exam-questions.types';
+import { ExamPreviewMode } from './exam-preview.mode';
 export interface ExamPreviewDialogProps {
     open: boolean;
     onOpenChange: (open: boolean) => void;
@@ -8,12 +9,17 @@ export interface ExamPreviewDialogProps {
     api: ExamQuestionsSdkApi;
     /** Fallback heading shown until the exam name loads. */
     title?: string;
+    /** Initial preview mode. Default is student view without answers. */
+    defaultMode?: ExamPreviewMode;
 }
 /**
  * Read-only popup that previews an exam by id.
  *
+ * Supports two modes:
+ * - 'student' (default): interactive student taking view without revealing answers
+ * - 'answers': review view with correct answers highlighted and explanations
+ *
  * UI mirrors the host app: one Part per screen (all questions of that part),
- * Next/Prev navigates between parts. No attempt is created — data comes from
- * {@link ExamQuestionsSdkApi}. Questions render via QuestionViewer in review mode.
+ * Next/Prev navigates between parts. Data comes from {@link ExamQuestionsSdkApi}.
  */
-export declare function ExamPreviewDialog({ open, onOpenChange, examId, api, title, }: ExamPreviewDialogProps): import("react").JSX.Element;
+export declare function ExamPreviewDialog({ open, onOpenChange, examId, api, title, defaultMode, }: ExamPreviewDialogProps): import("react").JSX.Element;

package/dist/components/exams/ExamPreviewDialog.js

@@ -1,30 +1,42 @@
 'use client';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useEffect, useMemo, useRef, useState } from 'react';
-import { Eye } from 'lucide-react';
+import { CheckCircle2, Eye, GraduationCap } from 'lucide-react';
 import { Button } from '../../components/ui/button';
 import { Dialog, DialogContent, DialogHeader, DialogTitle } from '../../components/ui/dialog';
 import { useT } from '../../shared/lib/i18n';
+import { cn } from '../../shared/lib/utils';
+import { ExamPreviewMode } from './exam-preview.mode';
 import { ExamPreviewPartContent } from './ExamPreviewPartContent';
 import { ExamPreviewSidebar } from './ExamPreviewSidebar';
 import { getQuestionNumber, getQuestionPoints, groupQuestionsByPart, sumQuestionPoints, unwrapApiData, } from './exam-preview.types';
 /**
  * Read-only popup that previews an exam by id.
  *
+ * Supports two modes:
+ * - 'student' (default): interactive student taking view without revealing answers
+ * - 'answers': review view with correct answers highlighted and explanations
+ *
  * UI mirrors the host app: one Part per screen (all questions of that part),
- * Next/Prev navigates between parts. No attempt is created — data comes from
- * {@link ExamQuestionsSdkApi}. Questions render via QuestionViewer in review mode.
+ * Next/Prev navigates between parts. Data comes from {@link ExamQuestionsSdkApi}.
  */
-export function ExamPreviewDialog({ open, onOpenChange, examId, api, title, }) {
+export function ExamPreviewDialog({ open, onOpenChange, examId, api, title, defaultMode = ExamPreviewMode.STUDENT, }) {
     const t = useT();
     const [exam, setExam] = useState(null);
     const [questions, setQuestions] = useState([]);
     const [currentPartIndex, setCurrentPartIndex] = useState(0);
     const [showPartsDetail, setShowPartsDetail] = useState(false);
+    const [previewMode, setPreviewMode] = useState(defaultMode);
     const [loading, setLoading] = useState(false);
     const [error, setError] = useState(null);
     const [reloadKey, setReloadKey] = useState(0);
     const contentRef = useRef(null);
+    // Sync / reset previewMode whenever dialog opens
+    useEffect(() => {
+        if (open) {
+            setPreviewMode(defaultMode);
+        }
+    }, [open, defaultMode]);
     // Fetch exam + questions whenever the dialog opens for an exam.
     useEffect(() => {
         if (!open || !examId) {
@@ -117,5 +129,11 @@ export function ExamPreviewDialog({ open, onOpenChange, examId, api, title, }) {
             scrollToTop();
         }
     };
-    return (_jsx(Dialog, { open: open, onOpenChange: onOpenChange, children: _jsxs(DialogContent, { className: "max-h-[95vh] max-w-7xl overflow-y-auto", children: [_jsx(DialogHeader, { children: _jsxs(DialogTitle, { className: "flex items-center gap-2", children: [_jsx(Eye, { className: "h-5 w-5 text-blue-600" }), t('admin.exams.preview.title', { name: heading })] }) }), _jsxs("div", { className: "flex h-[80vh] flex-col gap-4 sm:flex-row", children: [_jsx(ExamPreviewSidebar, { examName: heading, duration: duration, totalPoints: totalPoints, questions: questions, questionsByPart: questionsByPart, currentPart: currentPart, currentPartIndex: currentPartIndex, totalParts: totalParts, progress: progress, loading: loading, showPartsDetail: showPartsDetail, onTogglePartsDetail: () => setShowPartsDetail((value) => !value), onGoToPart: goToPart }), _jsx(ExamPreviewPartContent, { loading: loading, error: error, questions: questions, currentPart: currentPart, currentPartQuestions: currentPartQuestions, currentPartIndex: currentPartIndex, totalParts: totalParts, partDisplayName: partDisplayName, partTotalPoints: partTotalPoints, contentRef: contentRef, onRetry: () => setReloadKey((key) => key + 1), onPreviousPart: goToPreviousPart, onNextPart: goToNextPart })] }), _jsx("div", { className: "border-t pt-4", children: _jsxs("div", { className: "flex items-center justify-between", children: [_jsx("div", { className: "text-sm text-gray-600", children: t('admin.exams.preview.footerNote') }), _jsx(Button, { variant: "outline", onClick: () => onOpenChange(false), className: "border-gray-300", children: t('admin.exams.preview.close') })] }) })] }) }));
+    return (_jsx(Dialog, { open: open, onOpenChange: onOpenChange, children: _jsxs(DialogContent, { className: "max-h-[95vh] max-w-7xl overflow-y-auto", children: [_jsxs(DialogHeader, { className: "flex flex-col gap-3 sm:flex-row sm:items-center sm:justify-between border-b pb-3 pr-8", children: [_jsxs(DialogTitle, { className: "flex items-center gap-2 text-lg font-bold", children: [_jsx(Eye, { className: "h-5 w-5 text-blue-600" }), t('admin.exams.preview.title', { name: heading })] }), _jsxs("div", { className: "inline-flex items-center rounded-lg border border-gray-200 bg-gray-100 p-1 shadow-inner", children: [_jsxs("button", { type: "button", onClick: () => setPreviewMode(ExamPreviewMode.STUDENT), className: cn('inline-flex items-center gap-1.5 rounded-md px-3 py-1.5 text-xs font-semibold transition-all', previewMode === ExamPreviewMode.STUDENT
+                                        ? 'bg-white text-blue-700 shadow-sm ring-1 ring-black/5'
+                                        : 'text-gray-600 hover:bg-gray-200/70 hover:text-gray-900'), children: [_jsx(GraduationCap, { className: "h-4 w-4" }), _jsx("span", { children: t('admin.exams.preview.mode.student') })] }), _jsxs("button", { type: "button", onClick: () => setPreviewMode(ExamPreviewMode.ANSWERS), className: cn('inline-flex items-center gap-1.5 rounded-md px-3 py-1.5 text-xs font-semibold transition-all', previewMode === ExamPreviewMode.ANSWERS
+                                        ? 'bg-emerald-600 text-white shadow-sm'
+                                        : 'text-gray-600 hover:bg-gray-200/70 hover:text-gray-900'), children: [_jsx(CheckCircle2, { className: "h-4 w-4" }), _jsx("span", { children: t('admin.exams.preview.mode.answers') })] })] })] }), _jsxs("div", { className: "flex h-[80vh] flex-col gap-4 sm:flex-row", children: [_jsx(ExamPreviewSidebar, { examName: heading, duration: duration, totalPoints: totalPoints, questions: questions, questionsByPart: questionsByPart, currentPart: currentPart, currentPartIndex: currentPartIndex, totalParts: totalParts, progress: progress, loading: loading, showPartsDetail: showPartsDetail, previewMode: previewMode, onTogglePartsDetail: () => setShowPartsDetail((value) => !value), onGoToPart: goToPart }), _jsx(ExamPreviewPartContent, { loading: loading, error: error, questions: questions, currentPart: currentPart, currentPartQuestions: currentPartQuestions, currentPartIndex: currentPartIndex, totalParts: totalParts, partDisplayName: partDisplayName, partTotalPoints: partTotalPoints, contentRef: contentRef, isReviewMode: previewMode === ExamPreviewMode.ANSWERS, onRetry: () => setReloadKey((key) => key + 1), onPreviousPart: goToPreviousPart, onNextPart: goToNextPart })] }), _jsx("div", { className: "border-t pt-4", children: _jsxs("div", { className: "flex items-center justify-between", children: [_jsx("div", { className: "text-sm text-gray-600", children: previewMode === ExamPreviewMode.ANSWERS
+                                    ? t('admin.exams.preview.footerNoteAnswers')
+                                    : t('admin.exams.preview.footerNoteStudent') }), _jsx(Button, { variant: "outline", onClick: () => onOpenChange(false), className: "border-gray-300", children: t('admin.exams.preview.close') })] }) })] }) }));
 }

package/dist/components/exams/ExamPreviewPartContent.d.ts

@@ -11,8 +11,9 @@ export interface ExamPreviewPartContentProps {
     partDisplayName: string;
     partTotalPoints: number;
     contentRef: RefObject<HTMLDivElement | null>;
+    isReviewMode?: boolean;
     onRetry: () => void;
     onPreviousPart: () => void;
     onNextPart: () => void;
 }
-export declare function ExamPreviewPartContent({ loading, error, questions, currentPart, currentPartQuestions, currentPartIndex, totalParts, partDisplayName, partTotalPoints, contentRef, onRetry, onPreviousPart, onNextPart, }: ExamPreviewPartContentProps): import("react").JSX.Element;
+export declare function ExamPreviewPartContent({ loading, error, questions, currentPart, currentPartQuestions, currentPartIndex, totalParts, partDisplayName, partTotalPoints, contentRef, isReviewMode, onRetry, onPreviousPart, onNextPart, }: ExamPreviewPartContentProps): import("react").JSX.Element;

package/dist/components/exams/ExamPreviewPartContent.js

@@ -5,8 +5,9 @@ import { Badge } from '../../components/ui/badge';
 import { Button } from '../../components/ui/button';
 import { QuestionViewer } from '../questions/viewer/QuestionViewer';
 import { useT } from '../../shared/lib/i18n';
+import { ExamPreviewMode } from './exam-preview.mode';
 import { difficultyBadgeClass, getQuestionDifficulty, getQuestionNumber, getQuestionPoints, } from './exam-preview.types';
-export function ExamPreviewPartContent({ loading, error, questions, currentPart, currentPartQuestions, currentPartIndex, totalParts, partDisplayName, partTotalPoints, contentRef, onRetry, onPreviousPart, onNextPart, }) {
+export function ExamPreviewPartContent({ loading, error, questions, currentPart, currentPartQuestions, currentPartIndex, totalParts, partDisplayName, partTotalPoints, contentRef, isReviewMode = false, onRetry, onPreviousPart, onNextPart, }) {
     const t = useT();
     return (_jsx("div", { className: "flex-1 overflow-y-auto", children: _jsxs("div", { className: "flex h-full flex-col", children: [_jsxs("div", { className: "flex items-center justify-between border-b pb-4", children: [_jsxs("div", { children: [_jsx("h3", { className: "text-lg font-semibold", children: loading ? (_jsx("span", { className: "text-gray-400", children: t('admin.exams.preview.loading') })) : totalParts > 0 ? (t('admin.exams.preview.partIndex', {
                                         index: String(currentPartIndex + 1),
@@ -22,6 +23,6 @@ export function ExamPreviewPartContent({ loading, error, questions, currentPart,
                                                     number: String(qNumber),
                                                 }) }), _jsxs("div", { className: "flex items-center gap-2", children: [_jsx(Badge, { variant: "outline", children: t('admin.exams.preview.points', {
                                                             count: String(getQuestionPoints(question)),
-                                                        }) }), _jsx(Badge, { className: difficultyBadgeClass(difficulty), children: difficulty })] })] }), _jsx(QuestionViewer, { question: question, isReviewMode: true })] }, question.id));
+                                                        }) }), _jsx(Badge, { className: difficultyBadgeClass(difficulty), children: difficulty })] })] }), _jsx(QuestionViewer, { question: question, isReviewMode: isReviewMode }, `${question.id}-${isReviewMode ? ExamPreviewMode.ANSWERS : ExamPreviewMode.STUDENT}`)] }, question.id));
                         }) })) : null }), !loading && totalParts > 0 && (_jsxs("div", { className: "mt-auto flex items-center justify-between border-t border-gray-200 bg-gray-50 px-4 py-3", children: [_jsxs(Button, { variant: "outline", onClick: onPreviousPart, disabled: currentPartIndex === 0, className: "flex h-9 items-center gap-2 px-3 text-sm", children: [_jsx(ArrowLeft, { className: "h-4 w-4" }), _jsx("span", { className: "hidden sm:inline", children: t('admin.exams.preview.prevPart') }), _jsx("span", { className: "sm:hidden", children: t('admin.exams.preview.prev') })] }), _jsxs("div", { className: "text-sm text-gray-600", children: [currentPartIndex + 1, " / ", totalParts] }), _jsxs(Button, { variant: "outline", onClick: onNextPart, disabled: currentPartIndex === totalParts - 1, className: "flex h-9 items-center gap-2 px-3 text-sm", children: [_jsx("span", { className: "hidden sm:inline", children: t('admin.exams.preview.nextPart') }), _jsx("span", { className: "sm:hidden", children: t('admin.exams.preview.next') }), _jsx(ArrowRight, { className: "h-4 w-4" })] })] }))] }) }));
 }

package/dist/components/exams/ExamPreviewSidebar.d.ts

@@ -1,3 +1,4 @@
+import { ExamPreviewMode } from './exam-preview.mode';
 import { type PreviewQuestion, type QuestionsByPart } from './exam-preview.types';
 export interface ExamPreviewSidebarProps {
     examName: string;
@@ -11,7 +12,8 @@ export interface ExamPreviewSidebarProps {
     progress: number;
     loading: boolean;
     showPartsDetail: boolean;
+    previewMode?: ExamPreviewMode;
     onTogglePartsDetail: () => void;
     onGoToPart: (index: number) => void;
 }
-export declare function ExamPreviewSidebar({ examName, duration, totalPoints, questions, questionsByPart, currentPart, currentPartIndex, totalParts, progress, loading, showPartsDetail, onTogglePartsDetail, onGoToPart, }: ExamPreviewSidebarProps): import("react").JSX.Element;
+export declare function ExamPreviewSidebar({ examName, duration, totalPoints, questions, questionsByPart, currentPart, currentPartIndex, totalParts, progress, loading, showPartsDetail, previewMode, onTogglePartsDetail, onGoToPart, }: ExamPreviewSidebarProps): import("react").JSX.Element;

package/dist/components/exams/ExamPreviewSidebar.js

@@ -6,10 +6,15 @@ import { Card, CardContent, CardHeader, CardTitle } from '../../components/ui/ca
 import { Progress } from '../../components/ui/progress';
 import { Loader2 } from 'lucide-react';
 import { useT } from '../../shared/lib/i18n';
+import { ExamPreviewMode } from './exam-preview.mode';
 import { getQuestionNumber, } from './exam-preview.types';
-export function ExamPreviewSidebar({ examName, duration, totalPoints, questions, questionsByPart, currentPart, currentPartIndex, totalParts, progress, loading, showPartsDetail, onTogglePartsDetail, onGoToPart, }) {
+export function ExamPreviewSidebar({ examName, duration, totalPoints, questions, questionsByPart, currentPart, currentPartIndex, totalParts, progress, loading, showPartsDetail, previewMode = ExamPreviewMode.STUDENT, onTogglePartsDetail, onGoToPart, }) {
     const t = useT();
-    return (_jsx("div", { className: "w-full overflow-y-auto border-b border-gray-200 sm:w-80 sm:border-b-0 sm:border-r", children: _jsxs("div", { className: "space-y-4 p-4", children: [_jsxs(Card, { children: [_jsx(CardHeader, { className: "pb-3", children: _jsx(CardTitle, { className: "text-base", children: t('admin.exams.preview.examInfo') }) }), _jsxs(CardContent, { className: "space-y-3", children: [_jsxs("div", { className: "flex items-center justify-between", children: [_jsx("span", { className: "text-sm text-gray-600", children: t('admin.exams.preview.duration') }), _jsx("span", { className: "text-sm font-medium", children: t('admin.exams.view.minutes', { count: String(duration) }) })] }), _jsxs("div", { className: "flex items-center justify-between", children: [_jsx("span", { className: "text-sm text-gray-600", children: t('admin.exams.preview.questionCount') }), _jsx("span", { className: "text-sm font-medium", children: loading
+    return (_jsx("div", { className: "w-full overflow-y-auto border-b border-gray-200 sm:w-80 sm:border-b-0 sm:border-r", children: _jsxs("div", { className: "space-y-4 p-4", children: [_jsxs(Card, { children: [_jsx(CardHeader, { className: "pb-3", children: _jsx(CardTitle, { className: "text-base", children: t('admin.exams.preview.examInfo') }) }), _jsxs(CardContent, { className: "space-y-3", children: [_jsxs("div", { className: "flex items-center justify-between", children: [_jsx("span", { className: "text-sm text-gray-600", children: t('admin.exams.preview.mode.label') }), _jsx(Badge, { variant: "outline", className: previewMode === ExamPreviewMode.ANSWERS
+                                                ? 'border-emerald-300 bg-emerald-50 text-emerald-700 font-semibold'
+                                                : 'border-blue-300 bg-blue-50 text-blue-700 font-semibold', children: previewMode === ExamPreviewMode.ANSWERS
+                                                ? t('admin.exams.preview.mode.answers')
+                                                : t('admin.exams.preview.mode.student') })] }), _jsxs("div", { className: "flex items-center justify-between", children: [_jsx("span", { className: "text-sm text-gray-600", children: t('admin.exams.preview.duration') }), _jsx("span", { className: "text-sm font-medium", children: t('admin.exams.view.minutes', { count: String(duration) }) })] }), _jsxs("div", { className: "flex items-center justify-between", children: [_jsx("span", { className: "text-sm text-gray-600", children: t('admin.exams.preview.questionCount') }), _jsx("span", { className: "text-sm font-medium", children: loading
                                                 ? '...'
                                                 : t('admin.exams.preview.questions', { count: String(questions.length) }) })] }), _jsxs("div", { className: "flex items-center justify-between", children: [_jsx("span", { className: "text-sm text-gray-600", children: t('admin.exams.preview.totalPoints') }), _jsx("span", { className: "text-sm font-medium", children: t('admin.exams.preview.points', { count: String(totalPoints) }) })] })] })] }), !loading && totalParts > 0 && (_jsx(Card, { children: _jsx(CardContent, { className: "p-4", children: _jsxs("div", { className: "space-y-2", children: [_jsxs("div", { className: "flex justify-between text-sm", children: [_jsx("span", { children: t('admin.exams.preview.progress') }), _jsxs("span", { className: "font-medium", children: [currentPartIndex + 1, "/", totalParts] })] }), _jsx(Progress, { value: progress, className: "h-2" })] }) }) })), loading ? (_jsx("div", { className: "flex items-center justify-center py-4", children: _jsxs("div", { className: "flex items-center gap-2 text-gray-500", children: [_jsx(Loader2, { className: "h-4 w-4 animate-spin" }), _jsx("span", { className: "text-sm", children: t('admin.exams.preview.loading') })] }) })) : (totalParts > 0 && (_jsxs("div", { className: "space-y-3", children: [_jsx("h4", { className: "text-sm font-medium text-gray-700", children: t('admin.exams.preview.questionNavigation') }), _jsx("div", { className: "flex flex-wrap gap-2", children: questionsByPart.map((part, index) => {
                                 const isCurrent = index === currentPartIndex;

package/dist/components/exams/exam-preview.mode.d.ts

@@ -0,0 +1,4 @@
+export declare enum ExamPreviewMode {
+    STUDENT = "student",
+    ANSWERS = "answers"
+}

package/dist/components/exams/exam-preview.mode.js

@@ -0,0 +1,5 @@
+export var ExamPreviewMode;
+(function (ExamPreviewMode) {
+    ExamPreviewMode["STUDENT"] = "student";
+    ExamPreviewMode["ANSWERS"] = "answers";
+})(ExamPreviewMode || (ExamPreviewMode = {}));

package/dist/components/exams/index.d.ts

@@ -32,5 +32,6 @@ export { EXAM_DIFFICULTY, ExamViewDialog } from './ExamViewDialog';
 export type { ExamDifficulty, ExamViewDialogExam, ExamViewDialogProps } from './ExamViewDialog';
 export { ExamPreviewDialog } from './ExamPreviewDialog';
 export type { ExamPreviewDialogProps } from './ExamPreviewDialog';
+export { ExamPreviewMode } from './exam-preview.mode';
 export type { PreviewQuestion, QuestionsByPart } from './exam-preview.types';
 export { QuestionStatus, clearQuestionStatuses, getQuestionStatus, initializeQuestionStatusesFromAPI, setQuestionStatus } from './exam-question-status';

package/dist/components/exams/index.js

@@ -16,4 +16,5 @@ export { UnsavedChangesDialog } from './UnsavedChangesDialog';
 export { CompletionDialog } from './CompletionDialog';
 export { EXAM_DIFFICULTY, ExamViewDialog } from './ExamViewDialog';
 export { ExamPreviewDialog } from './ExamPreviewDialog';
+export { ExamPreviewMode } from './exam-preview.mode';
 export { QuestionStatus, clearQuestionStatuses, getQuestionStatus, initializeQuestionStatusesFromAPI, setQuestionStatus } from './exam-question-status';

package/dist/components/exams/take/components/QuestionRenderer.js

@@ -8,9 +8,9 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
  * 2. Transforms data to renderer-specific props
  * 3. Renders the correct component for each question type
  */
-import { MoversListenAndWriteRenderer, MoversChooseBestAnswerRenderer, MoversChooseAdjectiveRenderer, MoversWritingRenderer, MoversColoringRenderer, MoversPictureChooseRenderer, MoversPictureFillBlankChooseRenderer, MoversReadingPassageRenderer, MoversLabelThePictureRenderer, MoversFillWordHintRenderer, MoversGridFillRenderer, MoversTrueFalseRenderer, MoversCrossOutWordGroupRenderer, MoversAnswerTheQuestionRenderer, MoversWriteSentencesRenderer, MoversWordOrderingRenderer, MoversWordFillParagraphRenderer, MoversMatchByWritingAnswerRenderer, MoversWordFillStructuredFormRenderer, MoversWordOrderAndMatchGroupRenderer, } from './question-renderers';
+import { MoversListenAndWriteRenderer, MoversChooseBestAnswerRenderer, MoversChooseAdjectiveRenderer, MoversWritingRenderer, MoversColoringRenderer, MoversPictureChooseRenderer, MoversPictureFillBlankChooseRenderer, MoversReadingPassageRenderer, MoversLabelThePictureRenderer, MoversFillWordHintRenderer, MoversGridFillRenderer, MoversTrueFalseRenderer, MoversCrossOutWordGroupRenderer, MoversAnswerTheQuestionRenderer, MoversWriteSentencesRenderer, MoversWordOrderingRenderer, MoversWordFillParagraphRenderer, MoversMatchByWritingAnswerRenderer, MoversWordFillStructuredFormRenderer, MoversWordOrderAndMatchGroupRenderer, MoversCrosswordPuzzleRenderer, } from './question-renderers';
 import { SpeakingQuestionRenderer } from './speaking/renderers';
-import { transformFillInBlank, transformWriteCorrectVerbForm, transformChooseCorrectAnswer, transformChooseTheCorrectAnswerGroup, transformChooseCorrectAdjective, transformWriteShortLetter, transformColorObjects, transformPictureChoose, transformPictureFillBlankChoose, transformReadingPassage, transformLabelPicture, transformFillWordHint, transformGridFill, transformAnswerTheQuestion, transformTrueFalse, transformTrueFalseGroup, transformWordOrdering, transformWordFillParagraph, transformMatchByWritingAnswer, transformWriteSentences, transformWordFillStructuredForm, transformWordOrderAndMatchGroup, } from '../utils/question-transformers';
+import { transformFillInBlank, transformWriteCorrectVerbForm, transformChooseCorrectAnswer, transformChooseTheCorrectAnswerGroup, transformChooseCorrectAdjective, transformWriteShortLetter, transformColorObjects, transformPictureChoose, transformPictureFillBlankChoose, transformReadingPassage, transformLabelPicture, transformFillWordHint, transformGridFill, transformAnswerTheQuestion, transformAnswerTheQuestionGroup, transformTrueFalse, transformTrueFalseGroup, transformWordOrdering, transformWordFillParagraph, transformMatchByWritingAnswer, transformWriteSentences, transformWordFillStructuredForm, transformWordOrderAndMatchGroup, transformCrosswordPuzzle, } from '../utils/question-transformers';
 import { transformCrossOutWordGroup } from '../utils/cross-out-word-group.transformer';
 import { normalizeColoringAssignments } from '../utils/coloring-assignments';
 export function QuestionRenderer({ part, answers, onAnswerChange, isReviewMode = false, onExit, onPartComplete, onPartBack, speakingTheme, initialQuestionIndex, skipTeacherVideo, onTeacherIntroPlayed, currentQuestionIndex, }) {
@@ -112,6 +112,10 @@ export function QuestionRenderer({ part, answers, onAnswerChange, isReviewMode =
             const data = transformGridFill(questions);
             return (_jsx(MoversGridFillRenderer, { partNumber: partNo, partName: part.name, questionCount: questionCount, instruction: part.instructions || data.instruction, grid: data.grid, rows: data.rows, columns: data.columns, cellAnswers: {}, answers: answers, onAnswerChange: onAnswerChange, isReviewMode: isReviewMode, disabledCells: data.disabledCells }));
         }
+        case 'CROSSWORD_PUZZLE': {
+            const data = transformCrosswordPuzzle(questions);
+            return (_jsx(MoversCrosswordPuzzleRenderer, { partNumber: partNo, partName: part.name, questionCount: questionCount, instruction: part.instructions || data.instruction, title: data.title, gridSize: data.gridSize, clues: data.clues, answers: answers, correctAnswers: data.correctAnswers, onAnswerChange: onAnswerChange, isReviewMode: isReviewMode }));
+        }
         case 'IMAGE_OBJECT_MATCHING': {
             // Reuse coloring renderer — same content structure as READ_AND_COLOR_OBJECTS
             const data = transformColorObjects(questions);
@@ -137,6 +141,10 @@ export function QuestionRenderer({ part, answers, onAnswerChange, isReviewMode =
             const data = transformAnswerTheQuestion(questions);
             return (_jsx(MoversAnswerTheQuestionRenderer, { partNumber: partNo, partName: part.name, questionCount: questionCount, instruction: part.instructions || data.instruction, imageUrl: data.imageUrl, audioUrl: part.audioUrl, title: data.title, groupContent: data.groupContent, questions: getRenderQuestions(data.questions), answers: answers, onAnswerChange: onAnswerChange, isReviewMode: isReviewMode }));
         }
+        case 'ANSWER_THE_QUESTION_GROUP': {
+            const data = transformAnswerTheQuestionGroup(questions);
+            return (_jsx(MoversAnswerTheQuestionRenderer, { partNumber: partNo, partName: part.name, questionCount: questionCount, instruction: part.instructions || data.instruction, groupContent: data.groupContent, questions: getRenderQuestions(data.questions), answers: answers, onAnswerChange: onAnswerChange, isReviewMode: isReviewMode }));
+        }
         case 'TRUE_FALSE_GROUP': {
             const data = transformTrueFalseGroup(questions);
             return (_jsx(MoversTrueFalseRenderer, { partNumber: partNo, partName: part.name, questionCount: questionCount, instruction: part.instructions || data.instruction, imageUrl: data.imageUrl, groupContent: data.groupContent, questions: getRenderQuestions(data.questions), answers: answers, onAnswerChange: onAnswerChange, isReviewMode: isReviewMode }));

package/dist/components/exams/take/components/question-renderers/MoversCrosswordPuzzleRenderer.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import type { MoversCrosswordPuzzleRendererProps } from '../../types';
+export declare function MoversCrosswordPuzzleRenderer({ partNumber, partName, questionCount, instruction, title, gridSize, clues, answers, correctAnswers, onAnswerChange, isReviewMode, caseSensitive, }: MoversCrosswordPuzzleRendererProps): React.JSX.Element;

package/dist/components/exams/take/components/question-renderers/MoversCrosswordPuzzleRenderer.js

@@ -0,0 +1,285 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useState, useMemo, useRef, useEffect } from 'react';
+import { Check, X } from 'lucide-react';
+import CambridgeYlePartBanner from '../../../../themes/cambridge-yle/CambridgeYlePartBanner';
+import CambridgeYleInstructionBanner from '../../../../themes/cambridge-yle/CambridgeYleInstructionBanner';
+export function MoversCrosswordPuzzleRenderer({ partNumber, partName, questionCount, instruction, title, gridSize, clues, answers = {}, correctAnswers = {}, onAnswerChange, isReviewMode = false, caseSensitive = false, }) {
+    const rows = gridSize?.rows || 12;
+    const cols = gridSize?.cols || 12;
+    const acrossClues = useMemo(() => clues?.across || [], [clues?.across]);
+    const downClues = useMemo(() => clues?.down || [], [clues?.down]);
+    const [activeDirection, setActiveDirection] = useState('across');
+    const [activeClueNumber, setActiveClueNumber] = useState(() => {
+        return acrossClues[0]?.number || downClues[0]?.number || 1;
+    });
+    const [selectedCell, setSelectedCell] = useState(null);
+    const inputRefs = useRef(new Map());
+    const { cellMap, clueNumberMap, wordCellsMap } = useMemo(() => {
+        const cMap = new Map();
+        const numMap = new Map();
+        const wMap = new Map();
+        for (const c of acrossClues) {
+            numMap.set(`${c.startRow}-${c.startCol}`, c.number);
+            const cells = [];
+            for (let i = 0; i < c.length; i++) {
+                const key = `${c.startRow}-${c.startCol + i}`;
+                cells.push({ r: c.startRow, c: c.startCol + i });
+                const existing = cMap.get(key) || {};
+                cMap.set(key, { ...existing, across: c });
+            }
+            wMap.set(`across-${c.number}`, cells);
+        }
+        for (const c of downClues) {
+            if (!numMap.has(`${c.startRow}-${c.startCol}`)) {
+                numMap.set(`${c.startRow}-${c.startCol}`, c.number);
+            }
+            const cells = [];
+            for (let i = 0; i < c.length; i++) {
+                const key = `${c.startRow + i}-${c.startCol}`;
+                cells.push({ r: c.startRow + i, c: c.startCol });
+                const existing = cMap.get(key) || {};
+                cMap.set(key, { ...existing, down: c });
+            }
+            wMap.set(`down-${c.number}`, cells);
+        }
+        return { cellMap: cMap, clueNumberMap: numMap, wordCellsMap: wMap };
+    }, [acrossClues, downClues]);
+    useEffect(() => {
+        if (!selectedCell) {
+            const firstClue = acrossClues[0] || downClues[0];
+            if (firstClue) {
+                setSelectedCell({ r: firstClue.startRow, c: firstClue.startCol });
+            }
+        }
+    }, [acrossClues, downClues, selectedCell]);
+    const activeWordCells = useMemo(() => {
+        return wordCellsMap.get(`${activeDirection}-${activeClueNumber}`) || [];
+    }, [wordCellsMap, activeDirection, activeClueNumber]);
+    const handleSelectClue = (number, direction) => {
+        setActiveDirection(direction);
+        setActiveClueNumber(number);
+        const clueList = direction === 'across' ? acrossClues : downClues;
+        const clue = clueList.find((c) => c.number === number);
+        if (clue) {
+            setSelectedCell({ r: clue.startRow, c: clue.startCol });
+            const key = `${clue.startRow}-${clue.startCol}`;
+            inputRefs.current.get(key)?.focus();
+        }
+    };
+    const handleCellClick = (r, c) => {
+        const key = `${r}-${c}`;
+        const cellInfo = cellMap.get(key);
+        if (!cellInfo)
+            return;
+        if (selectedCell?.r === r && selectedCell?.c === c && cellInfo.across && cellInfo.down) {
+            const newDir = activeDirection === 'across' ? 'down' : 'across';
+            setActiveDirection(newDir);
+            const newClue = newDir === 'across' ? cellInfo.across : cellInfo.down;
+            if (newClue)
+                setActiveClueNumber(newClue.number);
+        }
+        else {
+            if (activeDirection === 'across' && cellInfo.across) {
+                setActiveClueNumber(cellInfo.across.number);
+            }
+            else if (activeDirection === 'down' && cellInfo.down) {
+                setActiveClueNumber(cellInfo.down.number);
+            }
+            else if (cellInfo.across) {
+                setActiveDirection('across');
+                setActiveClueNumber(cellInfo.across.number);
+            }
+            else if (cellInfo.down) {
+                setActiveDirection('down');
+                setActiveClueNumber(cellInfo.down.number);
+            }
+            setSelectedCell({ r, c });
+        }
+    };
+    const moveToNextCell = (r, c) => {
+        const cells = activeWordCells;
+        const currIdx = cells.findIndex((cell) => cell.r === r && cell.c === c);
+        if (currIdx >= 0 && currIdx < cells.length - 1) {
+            const next = cells[currIdx + 1];
+            setSelectedCell(next);
+            inputRefs.current.get(`${next.r}-${next.c}`)?.focus();
+        }
+    };
+    const moveToPrevCell = (r, c) => {
+        const cells = activeWordCells;
+        const currIdx = cells.findIndex((cell) => cell.r === r && cell.c === c);
+        if (currIdx > 0) {
+            const prev = cells[currIdx - 1];
+            setSelectedCell(prev);
+            inputRefs.current.get(`${prev.r}-${prev.c}`)?.focus();
+        }
+    };
+    const handleKeyDown = (e, r, c) => {
+        if (isReviewMode)
+            return;
+        if (e.key === 'Backspace') {
+            const key = `${r}-${c}`;
+            if (!answers[key]) {
+                e.preventDefault();
+                moveToPrevCell(r, c);
+                const cells = activeWordCells;
+                const currIdx = cells.findIndex((cell) => cell.r === r && cell.c === c);
+                if (currIdx > 0) {
+                    const prev = cells[currIdx - 1];
+                    onAnswerChange(`${prev.r}-${prev.c}`, '');
+                }
+            }
+            else {
+                onAnswerChange(key, '');
+            }
+        }
+        else if (e.key === 'ArrowRight') {
+            e.preventDefault();
+            if (activeDirection !== 'across') {
+                setActiveDirection('across');
+                const info = cellMap.get(`${r}-${c}`);
+                if (info?.across)
+                    setActiveClueNumber(info.across.number);
+            }
+            else {
+                moveToNextCell(r, c);
+            }
+        }
+        else if (e.key === 'ArrowLeft') {
+            e.preventDefault();
+            if (activeDirection !== 'across') {
+                setActiveDirection('across');
+                const info = cellMap.get(`${r}-${c}`);
+                if (info?.across)
+                    setActiveClueNumber(info.across.number);
+            }
+            else {
+                moveToPrevCell(r, c);
+            }
+        }
+        else if (e.key === 'ArrowDown') {
+            e.preventDefault();
+            if (activeDirection !== 'down') {
+                setActiveDirection('down');
+                const info = cellMap.get(`${r}-${c}`);
+                if (info?.down)
+                    setActiveClueNumber(info.down.number);
+            }
+            else {
+                moveToNextCell(r, c);
+            }
+        }
+        else if (e.key === 'ArrowUp') {
+            e.preventDefault();
+            if (activeDirection !== 'down') {
+                setActiveDirection('down');
+                const info = cellMap.get(`${r}-${c}`);
+                if (info?.down)
+                    setActiveClueNumber(info.down.number);
+            }
+            else {
+                moveToPrevCell(r, c);
+            }
+        }
+    };
+    const handleInputChange = (val, r, c) => {
+        if (isReviewMode)
+            return;
+        const cleanVal = val.slice(-1).toUpperCase();
+        const key = `${r}-${c}`;
+        onAnswerChange(key, cleanVal);
+        if (cleanVal) {
+            moveToNextCell(r, c);
+        }
+    };
+    const getCellReviewStatus = (r, c) => {
+        if (!isReviewMode)
+            return null;
+        const key = `${r}-${c}`;
+        const userLetter = (answers[key] || '').trim();
+        const cellInfo = cellMap.get(key);
+        if (!cellInfo)
+            return null;
+        let expectedLetter = '';
+        if (cellInfo.across && correctAnswers[`across-${cellInfo.across.number}`]) {
+            const word = correctAnswers[`across-${cellInfo.across.number}`];
+            const offset = c - cellInfo.across.startCol;
+            expectedLetter = word[offset] || '';
+        }
+        else if (cellInfo.down && correctAnswers[`down-${cellInfo.down.number}`]) {
+            const word = correctAnswers[`down-${cellInfo.down.number}`];
+            const offset = r - cellInfo.down.startRow;
+            expectedLetter = word[offset] || '';
+        }
+        if (!expectedLetter)
+            return null;
+        const isMatch = caseSensitive
+            ? userLetter === expectedLetter
+            : userLetter.toLowerCase() === expectedLetter.toLowerCase();
+        return { isCorrect: isMatch, expected: expectedLetter, user: userLetter };
+    };
+    return (_jsxs("div", { className: "flex h-full flex-col gap-4 overflow-y-auto p-3 sm:gap-5 sm:p-4 md:gap-6 md:p-6", children: [_jsxs("div", { className: "flex flex-col gap-4", children: [_jsx(CambridgeYlePartBanner, { partNumber: partNumber, questionCount: questionCount, partName: partName, isReviewMode: isReviewMode }), _jsx(CambridgeYleInstructionBanner, { instruction: instruction, isReviewMode: isReviewMode })] }), title && (_jsx("h3", { className: "text-center text-lg font-bold text-gray-800 tracking-wide", children: title })), _jsxs("div", { className: "grid grid-cols-1 lg:grid-cols-12 gap-6 items-start", children: [_jsxs("div", { className: "lg:col-span-5 flex flex-col gap-4", children: [_jsxs("div", { className: "rounded-xl border-2 border-blue-200 bg-blue-50/40 p-4 shadow-sm", children: [_jsxs("h4", { className: "font-bold text-blue-900 mb-3 flex items-center justify-between", children: [_jsxs("span", { className: "flex items-center gap-2", children: [_jsx("span", { className: "px-2 py-0.5 rounded bg-blue-600 text-white text-xs font-bold uppercase", children: "Across" }), _jsx("span", { children: "H\u00E0ng ngang" })] }), _jsxs("span", { className: "text-xs text-blue-600 font-medium", children: ["(", acrossClues.length, " c\u00E2u)"] })] }), _jsx("div", { className: "flex flex-col gap-2 max-h-72 overflow-y-auto pr-1", children: acrossClues.map((c) => {
+                                            const isActive = activeDirection === 'across' && activeClueNumber === c.number;
+                                            const answerKey = `across-${c.number}`;
+                                            const expectedWord = correctAnswers[answerKey];
+                                            let userWord = '';
+                                            for (let i = 0; i < c.length; i++) {
+                                                userWord += (answers[`${c.startRow}-${c.startCol + i}`] || '').trim();
+                                            }
+                                            const isFilled = userWord.length === c.length;
+                                            return (_jsxs("button", { type: "button", onClick: () => handleSelectClue(c.number, 'across'), className: `flex items-start gap-2.5 p-2.5 rounded-lg border text-left transition ${isActive
+                                                    ? 'border-blue-600 bg-blue-100/90 shadow-sm ring-1 ring-blue-500'
+                                                    : 'border-gray-200 bg-white hover:border-blue-300 hover:bg-blue-50/60'}`, children: [_jsx("span", { className: `flex items-center justify-center h-6 w-6 rounded-md text-xs font-bold ${isActive ? 'bg-blue-600 text-white' : 'bg-blue-100 text-blue-800'}`, children: c.number }), _jsxs("div", { className: "flex-1 min-w-0", children: [_jsx("p", { className: "text-sm font-semibold text-gray-800", children: c.clue }), isReviewMode && expectedWord && (_jsxs("div", { className: "text-xs mt-1 flex items-center gap-2", children: [_jsx("span", { className: "text-gray-500", children: "\u0110\u00E1p \u00E1n:" }), _jsx("span", { className: "font-bold text-green-700", children: expectedWord }), userWord && userWord !== expectedWord && (_jsx("span", { className: "line-through text-red-500 font-semibold", children: userWord }))] }))] }), _jsxs("div", { className: "flex items-center gap-1.5", children: [_jsxs("span", { className: "text-xs text-gray-400 font-medium", children: ["(", c.length, ")"] }), isFilled && !isReviewMode && (_jsx("span", { className: "h-2 w-2 rounded-full bg-blue-500" }))] })] }, `across-${c.number}`));
+                                        }) })] }), _jsxs("div", { className: "rounded-xl border-2 border-purple-200 bg-purple-50/40 p-4 shadow-sm", children: [_jsxs("h4", { className: "font-bold text-purple-900 mb-3 flex items-center justify-between", children: [_jsxs("span", { className: "flex items-center gap-2", children: [_jsx("span", { className: "px-2 py-0.5 rounded bg-purple-600 text-white text-xs font-bold uppercase", children: "Down" }), _jsx("span", { children: "H\u00E0ng d\u1ECDc" })] }), _jsxs("span", { className: "text-xs text-purple-600 font-medium", children: ["(", downClues.length, " c\u00E2u)"] })] }), _jsx("div", { className: "flex flex-col gap-2 max-h-72 overflow-y-auto pr-1", children: downClues.map((c) => {
+                                            const isActive = activeDirection === 'down' && activeClueNumber === c.number;
+                                            const answerKey = `down-${c.number}`;
+                                            const expectedWord = correctAnswers[answerKey];
+                                            let userWord = '';
+                                            for (let i = 0; i < c.length; i++) {
+                                                userWord += (answers[`${c.startRow + i}-${c.startCol}`] || '').trim();
+                                            }
+                                            const isFilled = userWord.length === c.length;
+                                            return (_jsxs("button", { type: "button", onClick: () => handleSelectClue(c.number, 'down'), className: `flex items-start gap-2.5 p-2.5 rounded-lg border text-left transition ${isActive
+                                                    ? 'border-purple-600 bg-purple-100/90 shadow-sm ring-1 ring-purple-500'
+                                                    : 'border-gray-200 bg-white hover:border-purple-300 hover:bg-purple-50/60'}`, children: [_jsx("span", { className: `flex items-center justify-center h-6 w-6 rounded-md text-xs font-bold ${isActive ? 'bg-purple-600 text-white' : 'bg-purple-100 text-purple-800'}`, children: c.number }), _jsxs("div", { className: "flex-1 min-w-0", children: [_jsx("p", { className: "text-sm font-semibold text-gray-800", children: c.clue }), isReviewMode && expectedWord && (_jsxs("div", { className: "text-xs mt-1 flex items-center gap-2", children: [_jsx("span", { className: "text-gray-500", children: "\u0110\u00E1p \u00E1n:" }), _jsx("span", { className: "font-bold text-green-700", children: expectedWord }), userWord && userWord !== expectedWord && (_jsx("span", { className: "line-through text-red-500 font-semibold", children: userWord }))] }))] }), _jsxs("div", { className: "flex items-center gap-1.5", children: [_jsxs("span", { className: "text-xs text-gray-400 font-medium", children: ["(", c.length, ")"] }), isFilled && !isReviewMode && (_jsx("span", { className: "h-2 w-2 rounded-full bg-purple-500" }))] })] }, `down-${c.number}`));
+                                        }) })] })] }), _jsxs("div", { className: "lg:col-span-7 flex flex-col items-center gap-4 bg-gray-50/80 p-4 sm:p-6 rounded-2xl border-2 border-gray-200 shadow-sm", children: [!isReviewMode && (_jsxs("div", { className: "flex items-center gap-3 text-xs font-semibold text-gray-600 bg-white px-3 py-1.5 rounded-full border border-gray-200 shadow-sm", children: [_jsx("span", { children: "\u0110ang ch\u1ECDn:" }), _jsx("span", { className: "flex items-center gap-1 text-blue-700", children: activeDirection === 'across' ? (_jsxs(_Fragment, { children: [_jsxs("span", { className: "font-bold", children: ["Across ", activeClueNumber] }), _jsx("span", { className: "text-gray-400 font-normal", children: "(Ngang)" })] })) : (_jsxs(_Fragment, { children: [_jsxs("span", { className: "font-bold", children: ["Down ", activeClueNumber] }), _jsx("span", { className: "text-gray-400 font-normal", children: "(D\u1ECDc)" })] })) }), _jsx("span", { className: "text-gray-300", children: "|" }), _jsx("span", { className: "text-gray-500 font-normal", children: "Click \u0111\u00FAp \u00F4 giao nhau \u0111\u1EC3 \u0111\u1ED5i chi\u1EC1u" })] })), _jsx("div", { className: "overflow-x-auto max-w-full p-2", children: _jsx("div", { className: "inline-grid gap-1 sm:gap-1.5", style: {
+                                        gridTemplateColumns: `repeat(${cols}, minmax(0, 1fr))`,
+                                    }, children: Array.from({ length: rows }).map((_, rIdx) => {
+                                        const r = rIdx + 1;
+                                        return Array.from({ length: cols }).map((_, cIdx) => {
+                                            const c = cIdx + 1;
+                                            const key = `${r}-${c}`;
+                                            const cellInfo = cellMap.get(key);
+                                            const clueNum = clueNumberMap.get(key);
+                                            if (!cellInfo) {
+                                                return (_jsx("div", { className: "h-8 w-8 sm:h-10 sm:w-10 md:h-11 md:w-11 bg-transparent" }, key));
+                                            }
+                                            const isSelected = selectedCell?.r === r && selectedCell?.c === c;
+                                            const isWordActive = activeWordCells.some((cell) => cell.r === r && cell.c === c);
+                                            const reviewStatus = getCellReviewStatus(r, c);
+                                            const cellValue = answers[key] || '';
+                                            let cellStyle = 'border-gray-400 bg-white text-gray-800';
+                                            if (isReviewMode && reviewStatus) {
+                                                if (reviewStatus.isCorrect) {
+                                                    cellStyle = 'border-green-500 bg-green-100 text-green-700 font-bold';
+                                                }
+                                                else {
+                                                    cellStyle = 'border-red-500 bg-red-100 text-red-700 font-bold';
+                                                }
+                                            }
+                                            else if (isSelected) {
+                                                cellStyle = 'border-blue-600 bg-blue-100 ring-2 ring-blue-500 text-blue-900 font-bold';
+                                            }
+                                            else if (isWordActive) {
+                                                cellStyle = 'border-blue-400 bg-blue-50 text-blue-900';
+                                            }
+                                            return (_jsxs("div", { onClick: () => handleCellClick(r, c), className: `relative flex items-center justify-center rounded-lg border-2 font-bold shadow-sm h-8 w-8 sm:h-10 sm:w-10 md:h-11 md:w-11 text-base sm:text-lg transition-all select-none cursor-pointer ${cellStyle}`, children: [clueNum && (_jsx("span", { className: "absolute top-0.5 left-1 text-[9px] sm:text-[10px] font-bold text-gray-500 leading-none", children: clueNum })), !isReviewMode ? (_jsx("input", { ref: (el) => {
+                                                            if (el)
+                                                                inputRefs.current.set(key, el);
+                                                            else
+                                                                inputRefs.current.delete(key);
+                                                        }, type: "text", maxLength: 1, value: cellValue, onChange: (e) => handleInputChange(e.target.value, r, c), onKeyDown: (e) => handleKeyDown(e, r, c), onFocus: () => handleCellClick(r, c), className: "w-full h-full text-center bg-transparent uppercase font-bold outline-none cursor-pointer" })) : (_jsxs("div", { className: "flex flex-col items-center justify-center", children: [_jsx("span", { children: cellValue || '—' }), reviewStatus && !reviewStatus.isCorrect && (_jsx("span", { className: "absolute -bottom-1 -right-1 text-[9px] bg-green-600 text-white font-bold px-1 rounded-full shadow", children: reviewStatus.expected }))] })), isReviewMode && reviewStatus && (_jsx("span", { className: `absolute -top-1 -right-1 rounded-full p-0.5 text-white ${reviewStatus.isCorrect ? 'bg-green-500' : 'bg-red-500'}`, children: reviewStatus.isCorrect ? (_jsx(Check, { className: "h-2.5 w-2.5" })) : (_jsx(X, { className: "h-2.5 w-2.5" })) }))] }, key));
+                                        });
+                                    }) }) })] })] })] }));
+}

package/dist/components/exams/take/components/question-renderers/index.d.ts

@@ -18,4 +18,5 @@ export { MoversWordFillParagraphRenderer } from './MoversWordFillParagraphRender
 export { MoversMatchByWritingAnswerRenderer } from './MoversMatchByWritingAnswerRenderer';
 export { MoversWordFillStructuredFormRenderer } from './MoversWordFillStructuredFormRenderer';
 export { MoversWordOrderAndMatchGroupRenderer } from './MoversWordOrderAndMatchGroupRenderer';
+export { MoversCrosswordPuzzleRenderer } from './MoversCrosswordPuzzleRenderer';
 export { ArticlesViewer } from './ArticlesViewer';

package/dist/components/exams/take/components/question-renderers/index.js

@@ -22,4 +22,5 @@ export { MoversWordFillParagraphRenderer } from './MoversWordFillParagraphRender
 export { MoversMatchByWritingAnswerRenderer } from './MoversMatchByWritingAnswerRenderer';
 export { MoversWordFillStructuredFormRenderer } from './MoversWordFillStructuredFormRenderer';
 export { MoversWordOrderAndMatchGroupRenderer } from './MoversWordOrderAndMatchGroupRenderer';
+export { MoversCrosswordPuzzleRenderer } from './MoversCrosswordPuzzleRenderer';
 export { ArticlesViewer } from './ArticlesViewer';

package/dist/components/exams/take/types.d.ts

@@ -287,3 +287,33 @@ export interface MoversGridFillRendererProps {
     caseSensitive?: boolean;
     disabledCells?: string[];
 }
+export interface CrosswordClueItem {
+    number: number;
+    clue: string;
+    startRow: number;
+    startCol: number;
+    length: number;
+    isExample?: boolean;
+}
+export interface MoversCrosswordPuzzleRendererProps {
+    partNumber: number;
+    partName?: string;
+    questionCount: number;
+    instruction: string;
+    title?: string;
+    gridSize: {
+        rows: number;
+        cols: number;
+    };
+    markedColumn?: number;
+    hiddenWord?: string;
+    clues: {
+        across: CrosswordClueItem[];
+        down: CrosswordClueItem[];
+    };
+    answers: Record<string, string>;
+    correctAnswers?: Record<string, string>;
+    onAnswerChange: (key: string, value: string) => void;
+    isReviewMode?: boolean;
+    caseSensitive?: boolean;
+}