@tinyweb_dev/oe-exam-sdk 0.2.13 → 0.2.14

package/dist/components/questions/types/match-word-to-picture-group/map-match-word-to-picture-group-data.js

@@ -1,4 +1,4 @@
-import { MATCH_WORD_TO_PICTURE_GROUP_DEFAULT_INSTRUCTION, } from '../../_shared/types/match-word-to-picture-group.type';
+import { MATCH_WORD_TO_PICTURE_GROUP_DEFAULT_INSTRUCTION, fromMatchWordToPictureImageUrls, } from '../../_shared/types/match-word-to-picture-group.type';
 function isRecord(value) {
     return typeof value === 'object' && value !== null && !Array.isArray(value);
 }
@@ -30,7 +30,7 @@ export function mapMatchWordToPictureGroupItem(item, index, fallbackAnswer) {
     const correctAnswer = asRecord(record.correctAnswer);
     const isExample = record.isExample === true;
     return {
-        imageUrl: asString(content.imageUrl) || asString(record.imageUrl),
+        imageUrl: fromMatchWordToPictureImageUrls(content.imageUrl ?? record.imageUrl),
         correctAnswer: asString(correctAnswer.answer) ||
             asString(record.correctAnswer) ||
             asString(fallbackAnswer),
@@ -58,12 +58,17 @@ export function mapQuestionToMatchWordToPictureGroupData(question) {
                 ? asStringList(answer.wordBank)
                 : Array.from(new Set(items.map((item) => item.correctAnswer).filter(Boolean)));
         const title = asString(meta.title) || asString(answer.title);
-        const imageUrl = asString(meta.imageUrl).trim() || asString(answer.imageUrl).trim();
+        const passage = asString(meta.passage).trim() || asString(answer.passage).trim();
+        const audioUrl = asString(meta.audioUrl).trim() || asString(answer.audioUrl).trim();
+        const imageUrl = fromMatchWordToPictureImageUrls(meta.imageUrl)
+            ?? fromMatchWordToPictureImageUrls(answer.imageUrl);
         return {
             ...(title ? { title } : {}),
             instruction: asString(meta.instruction) ||
                 asString(answer.instruction) ||
                 MATCH_WORD_TO_PICTURE_GROUP_DEFAULT_INSTRUCTION,
+            ...(passage ? { passage } : {}),
+            ...(audioUrl ? { audioUrl } : {}),
             ...(imageUrl ? { imageUrl } : {}),
             wordBank,
             items,

package/dist/components/questions/types/match-word-to-picture-group/transform.js

@@ -1,4 +1,4 @@
-import { MATCH_WORD_TO_PICTURE_GROUP_DEFAULT_INSTRUCTION, MATCH_WORD_TO_PICTURE_ITEM_TYPE, } from '../../_shared/types/match-word-to-picture-group.type';
+import { MATCH_WORD_TO_PICTURE_GROUP_DEFAULT_INSTRUCTION, MATCH_WORD_TO_PICTURE_ITEM_TYPE, fromMatchWordToPictureImageUrls, } from '../../_shared/types/match-word-to-picture-group.type';
 function sumGradablePoints(items) {
     return items.reduce((total, item) => {
         if (item.isExample)
@@ -12,16 +12,20 @@ export const transformMatchWordToPictureGroup = (question) => {
     const wordBank = Array.isArray(answerData?.wordBank)
         ? answerData.wordBank.filter((word) => typeof word === 'string').map((word) => word.trim()).filter(Boolean)
         : [];
-    const apiItems = items.map((item, index) => ({
-        questionType: MATCH_WORD_TO_PICTURE_ITEM_TYPE,
-        ...(item.isExample ? { isExample: true } : {}),
-        content: {
-            ...(item.imageUrl?.trim() ? { imageUrl: item.imageUrl.trim() } : {}),
-        },
-        correctAnswer: { answer: item.correctAnswer || '' },
-        points: item.isExample ? 0 : (typeof item.points === 'number' ? item.points : 1),
-        questionNumber: item.questionNumber || index + 1,
-    }));
+    const groupImageUrl = fromMatchWordToPictureImageUrls(answerData?.imageUrl);
+    const apiItems = items.map((item, index) => {
+        const itemImageUrl = fromMatchWordToPictureImageUrls(item.imageUrl);
+        return {
+            questionType: MATCH_WORD_TO_PICTURE_ITEM_TYPE,
+            ...(item.isExample ? { isExample: true } : {}),
+            content: {
+                ...(itemImageUrl ? { imageUrl: itemImageUrl } : {}),
+            },
+            correctAnswer: { answer: item.correctAnswer || '' },
+            points: item.isExample ? 0 : (typeof item.points === 'number' ? item.points : 1),
+            questionNumber: item.questionNumber || index + 1,
+        };
+    });
     return {
         apiContent: {
             meta: {
@@ -29,9 +33,13 @@ export const transformMatchWordToPictureGroup = (question) => {
                 ...(typeof answerData?.title === 'string' && answerData.title.trim()
                     ? { title: answerData.title.trim() }
                     : {}),
-                ...(typeof answerData?.imageUrl === 'string' && answerData.imageUrl.trim()
-                    ? { imageUrl: answerData.imageUrl.trim() }
+                ...(typeof answerData?.passage === 'string' && answerData.passage.trim()
+                    ? { passage: answerData.passage }
+                    : {}),
+                ...(typeof answerData?.audioUrl === 'string' && answerData.audioUrl.trim()
+                    ? { audioUrl: answerData.audioUrl.trim() }
                     : {}),
+                ...(groupImageUrl ? { imageUrl: groupImageUrl } : {}),
                 wordBank,
             },
             items: apiItems,

package/dist/components/questions/types/sort-words-into-categories/SortWordsIntoCategoriesBoard.d.ts

@@ -0,0 +1,12 @@
+import type { SortWordsCategory, SortWordsPlacement, SortWordsWordItem } from '../../_shared/types/sort-words-into-categories.type';
+interface SortWordsIntoCategoriesBoardProps {
+    categories: SortWordsCategory[];
+    words: SortWordsWordItem[];
+    placements: SortWordsPlacement[];
+    correctPlacements?: SortWordsPlacement[];
+    onChange?: (next: SortWordsPlacement[]) => void;
+    disabled?: boolean;
+    isReviewMode?: boolean;
+}
+export declare function SortWordsIntoCategoriesBoard({ categories, words, placements, correctPlacements, onChange, disabled, isReviewMode, }: SortWordsIntoCategoriesBoardProps): import("react").JSX.Element;
+export {};

package/dist/components/questions/types/sort-words-into-categories/SortWordsIntoCategoriesBoard.js

@@ -0,0 +1,74 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useMemo, useState } from 'react';
+import { cn } from '../../../../shared/lib/utils';
+const POOL_ZONE = '__pool__';
+function placementMap(items) {
+    return new Map(items.map((item) => [item.wordId, item.categoryId]));
+}
+export function SortWordsIntoCategoriesBoard({ categories, words, placements, correctPlacements, onChange, disabled = false, isReviewMode = false, }) {
+    const [selectedWordId, setSelectedWordId] = useState(null);
+    const current = useMemo(() => placementMap(placements), [placements]);
+    const correct = useMemo(() => (correctPlacements ? placementMap(correctPlacements) : new Map()), [correctPlacements]);
+    const wordById = useMemo(() => new Map(words.map((word) => [word.id, word])), [words]);
+    const emit = (wordId, categoryId) => {
+        const word = wordById.get(wordId);
+        if (!word || word.isExample || disabled)
+            return;
+        const next = words.map((item) => ({
+            wordId: item.id,
+            categoryId: item.id === wordId ? categoryId : (current.get(item.id) ?? item.categoryId ?? ''),
+        }));
+        onChange?.(next);
+    };
+    const handleSelect = (wordId) => {
+        const word = wordById.get(wordId);
+        if (!word || word.isExample || disabled)
+            return;
+        setSelectedWordId((prev) => (prev === wordId ? null : wordId));
+    };
+    const handlePlace = (zoneId) => {
+        if (!selectedWordId)
+            return;
+        emit(selectedWordId, zoneId === POOL_ZONE ? '' : zoneId);
+        setSelectedWordId(null);
+    };
+    const handleDrop = (event, zoneId) => {
+        event.preventDefault();
+        const wordId = event.dataTransfer.getData('text/word-id');
+        if (!wordId)
+            return;
+        emit(wordId, zoneId === POOL_ZONE ? '' : zoneId);
+        setSelectedWordId(null);
+    };
+    const poolWords = words.filter((word) => {
+        if (word.isExample)
+            return false;
+        return !(current.get(word.id) || '');
+    });
+    const renderChip = (word) => {
+        const expected = correct.get(word.id) || word.categoryId || '';
+        const actual = current.get(word.id) ?? '';
+        const isSelected = selectedWordId === word.id;
+        const showReview = isReviewMode && !word.isExample && Boolean(expected);
+        const isCorrect = showReview && actual === expected;
+        const isWrong = showReview && actual !== expected;
+        return (_jsxs("button", { type: "button", draggable: !disabled && !word.isExample, onDragStart: (event) => {
+                event.dataTransfer.setData('text/word-id', word.id);
+                event.dataTransfer.effectAllowed = 'move';
+            }, onClick: () => handleSelect(word.id), onDoubleClick: () => {
+                if (!word.isExample)
+                    emit(word.id, '');
+            }, disabled: disabled || word.isExample, className: cn('rounded-md border px-3 py-1.5 text-sm shadow-sm transition-colors', word.isExample && 'cursor-default opacity-80', isSelected && 'border-black bg-black text-white', !isSelected && !isCorrect && !isWrong && 'border-gray-300 bg-white text-gray-900', isCorrect && 'border-emerald-500 bg-emerald-50 text-emerald-900', isWrong && 'border-red-500 bg-red-50 text-red-900'), children: [word.text || word.id, word.isExample && (_jsx("span", { className: "ml-1 text-[10px] uppercase tracking-wide opacity-70", children: "ex" }))] }, word.id));
+    };
+    return (_jsxs("div", { className: "space-y-4", children: [_jsx("div", { className: "min-h-[56px] rounded-lg border border-gray-200 bg-white p-3", onDragOver: (event) => event.preventDefault(), onDrop: (event) => handleDrop(event, POOL_ZONE), onClick: (event) => {
+                    if (event.target === event.currentTarget)
+                        handlePlace(POOL_ZONE);
+                }, children: _jsx("div", { className: "flex flex-wrap gap-2", children: poolWords.length === 0 ? (_jsx("p", { className: "text-sm text-gray-400", children: disabled ? 'Không còn từ trong pool.' : 'Chọn từ rồi bấm nhóm, hoặc kéo thả. Bấm nền này để trả từ về pool.' })) : (poolWords.map(renderChip)) }) }), _jsx("div", { className: cn('grid gap-4', categories.length <= 2 ? 'md:grid-cols-2' : 'md:grid-cols-3'), children: categories.map((category) => {
+                    const boxed = words.filter((word) => (current.get(word.id) || '') === category.id);
+                    return (_jsxs("section", { className: "overflow-hidden rounded-lg border border-gray-300 bg-white", onDragOver: (event) => event.preventDefault(), onDrop: (event) => handleDrop(event, category.id), children: [_jsx("button", { type: "button", className: "w-full bg-gray-200 px-3 py-2 text-center text-sm font-semibold text-gray-800", onClick: () => handlePlace(category.id), disabled: disabled, children: category.name || category.id }), _jsx("div", { className: "flex min-h-[160px] flex-wrap content-start gap-2 p-3", onClick: (event) => {
+                                    if (event.target === event.currentTarget)
+                                        handlePlace(category.id);
+                                }, children: boxed.map(renderChip) })] }, category.id));
+                }) })] }));
+}

package/dist/components/questions/types/sort-words-into-categories/SortWordsIntoCategoriesClient.d.ts

@@ -0,0 +1,2 @@
+import type { SortWordsIntoCategoriesClientProps } from '../../_shared/types/sort-words-into-categories.type';
+export declare function SortWordsIntoCategoriesClient({ questionData, isReviewMode, userPlacements, onPlacementsChange, }: SortWordsIntoCategoriesClientProps): import("react").JSX.Element;

package/dist/components/questions/types/sort-words-into-categories/SortWordsIntoCategoriesClient.js

@@ -0,0 +1,24 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Lightbulb } from 'lucide-react';
+import { SortWordsIntoCategoriesBoard } from './SortWordsIntoCategoriesBoard';
+import { buildPlacements, padPlacements } from './map-sort-words-into-categories-data';
+export function SortWordsIntoCategoriesClient({ questionData, isReviewMode = false, userPlacements, onPlacementsChange, }) {
+    const correctPlacements = buildPlacements(questionData.words);
+    const exampleLocked = questionData.words.map((word) => ({
+        wordId: word.id,
+        categoryId: word.isExample ? word.categoryId : '',
+    }));
+    const rawPlacements = isReviewMode && !userPlacements
+        ? correctPlacements
+        : (userPlacements ?? exampleLocked);
+    const placements = padPlacements(questionData.words, rawPlacements).map((item) => {
+        const word = questionData.words.find((entry) => entry.id === item.wordId);
+        if (word?.isExample) {
+            return { wordId: item.wordId, categoryId: word.categoryId };
+        }
+        return item;
+    });
+    const canEdit = Boolean(onPlacementsChange) && !isReviewMode;
+    return (_jsxs("div", { className: "space-y-4", children: [(questionData.title || questionData.instruction) && (_jsxs("div", { className: "rounded-xl border border-slate-200 bg-slate-50 px-4 py-3", children: [questionData.title && (_jsx("p", { className: "text-xs font-semibold uppercase tracking-wide text-slate-500", children: questionData.title })), questionData.instruction && (_jsx("p", { className: "text-sm font-medium text-slate-800", children: questionData.instruction }))] })), _jsx(SortWordsIntoCategoriesBoard, { categories: questionData.categories, words: questionData.words, placements: placements, correctPlacements: isReviewMode ? correctPlacements : undefined, onChange: canEdit ? onPlacementsChange : undefined, disabled: !canEdit, isReviewMode: isReviewMode }), isReviewMode && questionData.explanation && (_jsxs("div", { className: "flex items-start gap-2 rounded-xl border border-amber-100 bg-amber-50 px-4 py-3 text-sm text-amber-800", children: [_jsx(Lightbulb, { className: "mt-0.5 h-4 w-4 flex-shrink-0" }), questionData.explanation] }))] }));
+}

package/dist/components/questions/types/sort-words-into-categories/SortWordsIntoCategoriesCreator.d.ts

@@ -0,0 +1,2 @@
+import type { SortWordsIntoCategoriesCreatorProps } from '../../_shared/types/sort-words-into-categories.type';
+export declare function SortWordsIntoCategoriesCreator({ initialData, onChange, externalErrors, onUnsavedChangesChange, validationRef, }: SortWordsIntoCategoriesCreatorProps): import("react").JSX.Element;

package/dist/components/questions/types/sort-words-into-categories/SortWordsIntoCategoriesCreator.js

@@ -0,0 +1,171 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useEffect, useRef, useState } from 'react';
+import { Button } from '../../../../components/ui/button';
+import { Label } from '../../../../components/ui/label';
+import { Input } from '../../../../components/ui/input';
+import { PointsInput } from '../../../../components/ui/points-input';
+import { Textarea } from '../../../../components/ui/textarea';
+import { Card, CardContent, CardHeader, CardTitle } from '../../../../components/ui/card';
+import { Switch } from '../../../../components/ui/switch';
+import { useDebouncedCallback } from '../../../../shared/lib/hooks';
+import { Eye, Pencil, Plus, Star, Trash2 } from 'lucide-react';
+import { SortWordsIntoCategoriesClient } from './SortWordsIntoCategoriesClient';
+import { createEmptyCategory, createEmptyWord, sumGradablePoints, } from './map-sort-words-into-categories-data';
+import { SORT_WORDS_INTO_CATEGORIES_DEFAULT_INSTRUCTION } from '../../_shared/types/sort-words-into-categories.type';
+function normalizeCategories(raw) {
+    if (!Array.isArray(raw) || raw.length < 2) {
+        const first = createEmptyCategory([]);
+        const second = createEmptyCategory([first.id]);
+        return [
+            { ...first, name: raw?.[0]?.name || 'Technology item' },
+            { ...second, name: raw?.[1]?.name || 'Activity using technology' },
+        ];
+    }
+    return raw.map((item, index) => ({
+        id: item.id || `cat_${index + 1}`,
+        name: item.name || '',
+    }));
+}
+function normalizeWords(raw, categories) {
+    const fallbackCategory = categories[0]?.id || '';
+    if (!Array.isArray(raw) || raw.length === 0) {
+        const first = createEmptyWord([], fallbackCategory);
+        const second = createEmptyWord([first.id], categories[1]?.id || fallbackCategory);
+        return [first, second];
+    }
+    return raw.map((item, index) => ({
+        id: item.id || `w${index + 1}`,
+        text: item.text || '',
+        categoryId: item.categoryId || fallbackCategory,
+        isExample: item.isExample === true,
+        points: item.isExample ? 0 : (typeof item.points === 'number' ? item.points : 1),
+    }));
+}
+export function SortWordsIntoCategoriesCreator({ initialData, onChange, externalErrors, onUnsavedChangesChange, validationRef, }) {
+    const [title, setTitle] = useState(initialData?.title || '');
+    const [instruction, setInstruction] = useState(initialData?.instruction || SORT_WORDS_INTO_CATEGORIES_DEFAULT_INSTRUCTION);
+    const [categories, setCategories] = useState(() => normalizeCategories(initialData?.categories));
+    const [words, setWords] = useState(() => normalizeWords(initialData?.words, normalizeCategories(initialData?.categories)));
+    const [explanation, setExplanation] = useState(initialData?.explanation || '');
+    const [isClientMode, setIsClientMode] = useState(false);
+    const [errors, setErrors] = useState([]);
+    const onChangeRef = useRef(onChange);
+    const previousPayloadRef = useRef('');
+    useEffect(() => {
+        onChangeRef.current = onChange;
+    }, [onChange]);
+    const buildPayload = (nextTitle = title, nextInstruction = instruction, nextCategories = categories, nextWords = words, nextExplanation = explanation) => ({
+        title: nextTitle,
+        instruction: nextInstruction,
+        categories: nextCategories,
+        words: nextWords,
+        explanation: nextExplanation,
+        points: sumGradablePoints(nextWords),
+    });
+    const debouncedOnChange = useDebouncedCallback((payload) => {
+        onChangeRef.current?.(payload);
+    }, 300);
+    useEffect(() => {
+        const payload = buildPayload();
+        const serialized = JSON.stringify(payload);
+        if (serialized !== previousPayloadRef.current) {
+            previousPayloadRef.current = serialized;
+            debouncedOnChange(payload);
+            onUnsavedChangesChange?.(true);
+        }
+    }, [title, instruction, categories, words, explanation, debouncedOnChange, onUnsavedChangesChange]);
+    const validate = () => {
+        const nextErrors = [];
+        if (!instruction.trim()) {
+            nextErrors.push('Hướng dẫn (Instruction) không được để trống.');
+        }
+        if (categories.length < 2) {
+            nextErrors.push('Cần ít nhất 2 nhóm.');
+        }
+        const categoryIds = new Set();
+        categories.forEach((category, index) => {
+            if (!category.id.trim())
+                nextErrors.push(`Nhóm ${index + 1}: id không được để trống.`);
+            if (!category.name.trim())
+                nextErrors.push(`Nhóm ${index + 1}: tên không được để trống.`);
+            if (category.id.trim() && categoryIds.has(category.id.trim())) {
+                nextErrors.push(`Nhóm ${index + 1}: id "${category.id}" bị trùng.`);
+            }
+            categoryIds.add(category.id.trim());
+        });
+        if (words.length < 1) {
+            nextErrors.push('Cần ít nhất 1 từ.');
+        }
+        const wordIds = new Set();
+        words.forEach((word, index) => {
+            if (!word.id.trim())
+                nextErrors.push(`Từ ${index + 1}: id không được để trống.`);
+            if (!word.text.trim())
+                nextErrors.push(`Từ ${index + 1}: nội dung không được để trống.`);
+            if (word.id.trim() && wordIds.has(word.id.trim())) {
+                nextErrors.push(`Từ ${index + 1}: id "${word.id}" bị trùng.`);
+            }
+            wordIds.add(word.id.trim());
+            if (!word.categoryId.trim()) {
+                nextErrors.push(`Từ ${index + 1}: chưa chọn nhóm đúng.`);
+            }
+            else if (!categoryIds.has(word.categoryId)) {
+                nextErrors.push(`Từ ${index + 1}: nhóm không hợp lệ.`);
+            }
+        });
+        setErrors(nextErrors);
+        return nextErrors.length === 0;
+    };
+    useEffect(() => {
+        if (!validationRef)
+            return;
+        validationRef.current = {
+            triggerValidation: async () => validate(),
+            getFormData: () => buildPayload(),
+        };
+        return () => {
+            validationRef.current = null;
+        };
+    });
+    const updateCategory = (index, patch) => {
+        setCategories((prev) => prev.map((item, i) => (i === index ? { ...item, ...patch } : item)));
+    };
+    const updateWord = (index, patch) => {
+        setWords((prev) => prev.map((item, i) => {
+            if (i !== index)
+                return item;
+            const next = { ...item, ...patch };
+            if (next.isExample)
+                next.points = 0;
+            return next;
+        }));
+    };
+    const addCategory = () => {
+        setCategories((prev) => [...prev, createEmptyCategory(prev.map((item) => item.id))]);
+    };
+    const removeCategory = (index) => {
+        if (categories.length <= 2)
+            return;
+        const removedId = categories[index]?.id;
+        const nextCategories = categories.filter((_, i) => i !== index);
+        const fallback = nextCategories[0]?.id || '';
+        setCategories(nextCategories);
+        setWords((prev) => prev.map((word) => (word.categoryId === removedId ? { ...word, categoryId: fallback } : word)));
+    };
+    const addWord = () => {
+        setWords((prev) => [
+            ...prev,
+            createEmptyWord(prev.map((item) => item.id), categories[0]?.id || ''),
+        ]);
+    };
+    const removeWord = (index) => {
+        if (words.length <= 1)
+            return;
+        setWords((prev) => prev.filter((_, i) => i !== index));
+    };
+    const displayErrors = [...errors, ...(externalErrors || [])];
+    return (_jsxs("div", { className: "space-y-4", children: [_jsx("div", { className: "flex justify-end", children: _jsxs(Button, { type: "button", variant: "outline", size: "sm", onClick: () => setIsClientMode((v) => !v), children: [isClientMode ? _jsx(Pencil, { className: "mr-2 h-4 w-4" }) : _jsx(Eye, { className: "mr-2 h-4 w-4" }), isClientMode ? 'Sửa' : 'Xem trước'] }) }), isClientMode ? (_jsx(SortWordsIntoCategoriesClient, { questionData: buildPayload(), isReviewMode: true })) : (_jsxs(_Fragment, { children: [_jsxs("div", { className: "grid gap-4 md:grid-cols-2", children: [_jsxs("div", { children: [_jsx(Label, { htmlFor: "swc-title", children: "Ti\u00EAu \u0111\u1EC1 (optional)" }), _jsx(Input, { id: "swc-title", value: title, onChange: (event) => setTitle(event.target.value), placeholder: "VOCABULARY" })] }), _jsxs("div", { children: [_jsx(Label, { htmlFor: "swc-instruction", children: "H\u01B0\u1EDBng d\u1EABn" }), _jsx(Input, { id: "swc-instruction", value: instruction, onChange: (event) => setInstruction(event.target.value), placeholder: SORT_WORDS_INTO_CATEGORIES_DEFAULT_INSTRUCTION })] })] }), _jsxs(Card, { children: [_jsxs(CardHeader, { className: "flex flex-row items-center justify-between space-y-0", children: [_jsx(CardTitle, { className: "text-base", children: "Nh\u00F3m (categories)" }), _jsxs(Button, { type: "button", size: "sm", variant: "outline", onClick: addCategory, children: [_jsx(Plus, { className: "mr-1 h-4 w-4" }), " Th\u00EAm nh\u00F3m"] })] }), _jsx(CardContent, { className: "space-y-3", children: categories.map((category, index) => (_jsxs("div", { className: "flex items-center gap-2", children: [_jsx(Input, { value: category.name, onChange: (event) => updateCategory(index, { name: event.target.value }), placeholder: `Nhóm ${index + 1}` }), categories.length > 2 && (_jsx(Button, { type: "button", variant: "ghost", size: "sm", onClick: () => removeCategory(index), children: _jsx(Trash2, { className: "h-4 w-4 text-red-500" }) }))] }, category.id))) })] }), _jsxs(Card, { children: [_jsxs(CardHeader, { className: "flex flex-row items-center justify-between space-y-0", children: [_jsx(CardTitle, { className: "text-base", children: "T\u1EEB / c\u1EE5m t\u1EEB" }), _jsxs(Button, { type: "button", size: "sm", variant: "outline", onClick: addWord, children: [_jsx(Plus, { className: "mr-1 h-4 w-4" }), " Th\u00EAm t\u1EEB"] })] }), _jsx(CardContent, { className: "space-y-3", children: words.map((word, index) => (_jsxs("div", { className: "grid gap-2 rounded-lg border p-3 md:grid-cols-[1fr_180px_auto]", children: [_jsx(Input, { value: word.text, onChange: (event) => updateWord(index, { text: event.target.value }), placeholder: `Từ #${index + 1} (VD: press a button)` }), _jsx("select", { className: "h-10 rounded-md border border-input bg-background px-3 text-sm", value: word.categoryId, onChange: (event) => updateWord(index, { categoryId: event.target.value }), children: categories.map((category) => (_jsx("option", { value: category.id, children: category.name || category.id }, category.id))) }), _jsxs("div", { className: "flex items-center gap-2", children: [_jsxs("div", { className: "flex items-center gap-1", children: [_jsx(Switch, { id: `swc-example-${index}`, checked: word.isExample === true, onCheckedChange: (checked) => updateWord(index, { isExample: checked }) }), _jsxs(Label, { htmlFor: `swc-example-${index}`, className: "flex cursor-pointer items-center gap-1 text-xs", children: [_jsx(Star, { className: "h-3 w-3 text-amber-500" }), "Example"] })] }), !word.isExample && (_jsx(PointsInput, { value: word.points, allowZero: true, onChange: (event) => updateWord(index, {
+                                                        points: Number.parseInt(event.target.value, 10) || 1,
+                                                    }) })), words.length > 1 && (_jsx(Button, { type: "button", variant: "ghost", size: "sm", onClick: () => removeWord(index), children: _jsx(Trash2, { className: "h-4 w-4 text-red-500" }) }))] })] }, word.id))) })] }), _jsxs("div", { children: [_jsx(Label, { htmlFor: "swc-explanation", children: "Gi\u1EA3i th\u00EDch" }), _jsx(Textarea, { id: "swc-explanation", value: explanation, onChange: (event) => setExplanation(event.target.value) })] })] })), displayErrors.length > 0 && (_jsx("ul", { className: "list-disc space-y-1 rounded-md border border-red-200 bg-red-50 px-4 py-3 text-sm text-red-700", children: displayErrors.map((error) => (_jsx("li", { children: error }, error))) }))] }));
+}

package/dist/components/questions/types/sort-words-into-categories/index.d.ts

@@ -0,0 +1,4 @@
+export * from './SortWordsIntoCategoriesCreator';
+export * from './SortWordsIntoCategoriesClient';
+export * from './transform';
+export * from './register';

package/dist/components/questions/types/sort-words-into-categories/index.js

@@ -0,0 +1,4 @@
+export * from './SortWordsIntoCategoriesCreator';
+export * from './SortWordsIntoCategoriesClient';
+export * from './transform';
+export * from './register';

package/dist/components/questions/types/sort-words-into-categories/map-sort-words-into-categories-data.d.ts

@@ -0,0 +1,11 @@
+import type { SortWordsCategory, SortWordsIntoCategoriesData, SortWordsPlacement, SortWordsWordItem } from '../../_shared/types/sort-words-into-categories.type';
+export declare function nextPrefixedId(prefix: string, existing: string[]): string;
+export declare function sumGradablePoints(words: SortWordsWordItem[]): number;
+export declare function buildPlacements(words: SortWordsWordItem[]): SortWordsPlacement[];
+export declare function readPlacements(value: unknown): SortWordsPlacement[] | undefined;
+export declare function padPlacements(words: Array<{
+    id: string;
+}>, raw: unknown): SortWordsPlacement[];
+export declare function createEmptyCategory(existingIds: string[]): SortWordsCategory;
+export declare function createEmptyWord(existingIds: string[], categoryId: string): SortWordsWordItem;
+export declare function mapQuestionToSortWordsIntoCategoriesData(question: Record<string, unknown> | null | undefined): SortWordsIntoCategoriesData;

package/dist/components/questions/types/sort-words-into-categories/map-sort-words-into-categories-data.js

@@ -0,0 +1,153 @@
+import { SORT_WORDS_INTO_CATEGORIES_DEFAULT_INSTRUCTION } from '../../_shared/types/sort-words-into-categories.type';
+function isRecord(value) {
+    return typeof value === 'object' && value !== null && !Array.isArray(value);
+}
+function asRecord(value) {
+    return isRecord(value) ? value : {};
+}
+function asString(value, fallback = '') {
+    return typeof value === 'string' ? value : fallback;
+}
+export function nextPrefixedId(prefix, existing) {
+    let n = existing.length + 1;
+    const used = new Set(existing);
+    while (used.has(`${prefix}${n}`))
+        n += 1;
+    return `${prefix}${n}`;
+}
+export function sumGradablePoints(words) {
+    return words.reduce((total, word) => {
+        if (word.isExample)
+            return total;
+        return total + (typeof word.points === 'number' ? word.points : 1);
+    }, 0);
+}
+export function buildPlacements(words) {
+    return words.map((word) => ({
+        wordId: word.id,
+        categoryId: word.categoryId || '',
+    }));
+}
+export function readPlacements(value) {
+    const source = Array.isArray(value)
+        ? value
+        : isRecord(value) && Array.isArray(value.placements)
+            ? value.placements
+            : null;
+    if (!source)
+        return undefined;
+    return source.map((item) => {
+        const record = asRecord(item);
+        return {
+            wordId: asString(record.wordId),
+            categoryId: asString(record.categoryId),
+        };
+    });
+}
+export function padPlacements(words, raw) {
+    const source = readPlacements(raw) ?? [];
+    const byWord = new Map();
+    source.forEach((item) => {
+        const record = asRecord(item);
+        const wordId = asString(record.wordId);
+        if (!wordId || byWord.has(wordId))
+            return;
+        byWord.set(wordId, asString(record.categoryId));
+    });
+    return words.map((word) => ({
+        wordId: word.id,
+        categoryId: byWord.get(word.id) ?? '',
+    }));
+}
+export function createEmptyCategory(existingIds) {
+    return {
+        id: nextPrefixedId('cat_', existingIds),
+        name: '',
+    };
+}
+export function createEmptyWord(existingIds, categoryId) {
+    return {
+        id: nextPrefixedId('w', existingIds),
+        text: '',
+        categoryId,
+        isExample: false,
+        points: 1,
+    };
+}
+function mapCategories(raw) {
+    if (!Array.isArray(raw))
+        return [];
+    return raw.map((item, index) => {
+        const record = asRecord(item);
+        return {
+            id: asString(record.id, `cat_${index + 1}`),
+            name: asString(record.name),
+        };
+    });
+}
+function mapWords(rawWords, placements) {
+    if (!Array.isArray(rawWords))
+        return [];
+    const placementMap = new Map(placements.map((item) => [item.wordId, item.categoryId]));
+    return rawWords.map((item, index) => {
+        const record = asRecord(item);
+        const id = asString(record.id, `w${index + 1}`);
+        const isExample = record.isExample === true;
+        return {
+            id,
+            text: asString(record.text),
+            categoryId: asString(record.categoryId) || placementMap.get(id) || '',
+            isExample,
+            points: isExample ? 0 : (typeof record.points === 'number' ? record.points : 1),
+        };
+    });
+}
+export function mapQuestionToSortWordsIntoCategoriesData(question) {
+    const source = asRecord(question);
+    const content = asRecord(source.content);
+    const answer = asRecord(source.answer);
+    const correctAnswer = asRecord(source.correctAnswer ?? source.correct_answer ?? answer.correctAnswer);
+    const explanation = asString(source.explanation) || asString(answer.explanation);
+    const meta = asRecord(content.meta ?? answer.meta);
+    const placements = padPlacements(Array.isArray(content.words)
+        ? content.words.map((item, index) => ({ id: asString(asRecord(item).id, `w${index + 1}`) }))
+        : Array.isArray(answer.words)
+            ? answer.words.map((item, index) => ({ id: asString(asRecord(item).id, `w${index + 1}`) }))
+            : [], correctAnswer.placements ?? answer.placements);
+    if (Array.isArray(content.words) || Array.isArray(content.categories)) {
+        const words = mapWords(content.words, placements);
+        return {
+            title: asString(meta.title) || asString(answer.title),
+            instruction: asString(meta.instruction) ||
+                asString(answer.instruction) ||
+                SORT_WORDS_INTO_CATEGORIES_DEFAULT_INSTRUCTION,
+            categories: mapCategories(content.categories),
+            words,
+            explanation,
+            points: sumGradablePoints(words),
+        };
+    }
+    if (Array.isArray(answer.words) || Array.isArray(answer.categories)) {
+        const words = mapWords(answer.words, placements);
+        return {
+            title: asString(answer.title),
+            instruction: asString(answer.instruction) || SORT_WORDS_INTO_CATEGORIES_DEFAULT_INSTRUCTION,
+            categories: mapCategories(answer.categories),
+            words,
+            explanation,
+            points: typeof answer.points === 'number' ? answer.points : sumGradablePoints(words),
+        };
+    }
+    const firstCategory = createEmptyCategory([]);
+    const secondCategory = createEmptyCategory([firstCategory.id]);
+    const firstWord = createEmptyWord([], firstCategory.id);
+    const secondWord = createEmptyWord([firstWord.id], secondCategory.id);
+    return {
+        title: '',
+        instruction: SORT_WORDS_INTO_CATEGORIES_DEFAULT_INSTRUCTION,
+        categories: [firstCategory, secondCategory],
+        words: [firstWord, secondWord],
+        explanation,
+        points: 2,
+    };
+}

package/dist/components/questions/types/sort-words-into-categories/register.d.ts

@@ -0,0 +1,3 @@
+import type { QuestionTypeRegistration } from '../../creator/question-type-registry';
+export { buildPlacements, createEmptyCategory, createEmptyWord, mapQuestionToSortWordsIntoCategoriesData, padPlacements, readPlacements, sumGradablePoints, } from './map-sort-words-into-categories-data';
+export declare const sortWordsIntoCategoriesRegistration: QuestionTypeRegistration;

package/dist/components/questions/types/sort-words-into-categories/register.js

@@ -0,0 +1,37 @@
+import { SortWordsIntoCategoriesCreator } from './SortWordsIntoCategoriesCreator';
+import { mapQuestionToSortWordsIntoCategoriesData } from './map-sort-words-into-categories-data';
+export { buildPlacements, createEmptyCategory, createEmptyWord, mapQuestionToSortWordsIntoCategoriesData, padPlacements, readPlacements, sumGradablePoints, } from './map-sort-words-into-categories-data';
+export const sortWordsIntoCategoriesRegistration = {
+    component: SortWordsIntoCategoriesCreator,
+    transformInitialData: (initialData) => mapQuestionToSortWordsIntoCategoriesData(initialData),
+    getExtraProps: (ctx) => ({
+        onUnsavedChangesChange: ctx.onUnsavedChangesChange,
+        validationRef: ctx.validationRef,
+    }),
+    wrapOnSave: (data, ctx) => {
+        const payload = data;
+        return {
+            type: ctx.questionType,
+            content: ctx.state.content,
+            points: payload.points ?? ctx.state.points ?? 1,
+            level: ctx.state.level,
+            difficulty: ctx.state.difficulty,
+            skill: ctx.state.skill,
+            answer: payload,
+            explanation: payload.explanation || '',
+        };
+    },
+    wrapOnChange: (data, ctx) => {
+        const payload = data;
+        return {
+            type: ctx.questionType,
+            content: ctx.state.content,
+            points: payload.points ?? ctx.state.points ?? 1,
+            level: ctx.state.level,
+            difficulty: ctx.state.difficulty,
+            skill: ctx.state.skill,
+            answer: payload,
+            explanation: payload.explanation || '',
+        };
+    },
+};

package/dist/components/questions/types/sort-words-into-categories/transform.d.ts

@@ -0,0 +1,2 @@
+import type { TransformHandler } from '../../../../shared/lib/utils/question-transform-types';
+export declare const transformSortWordsIntoCategories: TransformHandler;

package/dist/components/questions/types/sort-words-into-categories/transform.js

@@ -0,0 +1,33 @@
+import { SORT_WORDS_INTO_CATEGORIES_DEFAULT_INSTRUCTION } from '../../_shared/types/sort-words-into-categories.type';
+import { sumGradablePoints } from './map-sort-words-into-categories-data';
+export const transformSortWordsIntoCategories = (question) => {
+    const answerData = question.answer;
+    const categories = Array.isArray(answerData?.categories) ? answerData.categories : [];
+    const words = Array.isArray(answerData?.words) ? answerData.words : [];
+    const title = typeof answerData?.title === 'string' ? answerData.title.trim() : '';
+    return {
+        apiContent: {
+            meta: {
+                instruction: answerData?.instruction || SORT_WORDS_INTO_CATEGORIES_DEFAULT_INSTRUCTION,
+                ...(title ? { title } : {}),
+            },
+            categories: categories.map((item) => ({
+                id: item.id || '',
+                name: item.name || '',
+            })),
+            words: words.map((item) => ({
+                id: item.id || '',
+                text: item.text || '',
+                points: item.isExample ? 0 : (typeof item.points === 'number' ? item.points : 1),
+                ...(item.isExample ? { isExample: true } : {}),
+            })),
+        },
+        apiCorrectAnswer: {
+            placements: words.map((item) => ({
+                wordId: item.id || '',
+                categoryId: item.categoryId || '',
+            })),
+        },
+        totalPoints: sumGradablePoints(words),
+    };
+};