@tinyweb_dev/oe-exam-sdk 0.1.0 → 0.1.2

package/dist/components/questions/creator/QuestionGroupCreator.js

@@ -1,120 +1 @@
-'use client';
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useState } from 'react';
-import { Button } from '../../../components/ui/button';
-import { Input } from '../../../components/ui/input';
-import { Label } from '../../../components/ui/label';
-import { Textarea } from '../../../components/ui/textarea';
-import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '../../../components/ui/card';
-import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue, } from '../../../components/ui/select';
-import { Badge } from '../../../components/ui/badge';
-import { Checkbox } from '../../../components/ui/checkbox';
-import { Plus, X, Upload, MoveUp, MoveDown, FileText, Music, Video, Image as ImageIcon, } from 'lucide-react';
-import { toast } from 'sonner';
-import { t } from '../../../shared/lib/i18n';
-export function QuestionGroupCreator({ onSave, onCancel, availableQuestions = [], }) {
-    const [step, setStep] = useState(1);
-    // Step 1: Basic info
-    const [name, setName] = useState('');
-    const [description, setDescription] = useState('');
-    const [groupType, setGroupType] = useState('');
-    const [level, setLevel] = useState('A1');
-    const [skill, setSkill] = useState('READING');
-    const [category, setCategory] = useState('');
-    const [tags, setTags] = useState([]);
-    const [tagInput, setTagInput] = useState('');
-    const [allowShuffle, setAllowShuffle] = useState(false);
-    // Step 2: Context
-    const [context, setContext] = useState({
-        instructions: '',
-    });
-    // Step 3: Questions
-    const [selectedQuestionIds, setSelectedQuestionIds] = useState([]);
-    const [questionSearchQuery, setQuestionSearchQuery] = useState('');
-    const getGroupTypeLabel = (type) => {
-        const labels = {
-            READING_PASSAGE: 'Đọc hiểu - Đoạn văn',
-            LISTENING_AUDIO: 'Nghe - Audio/Hội thoại',
-            LISTENING_VIDEO: 'Nghe - Video',
-            IMAGE_BASED: 'Dựa vào hình ảnh',
-            MIXED: 'Kết hợp nhiều loại',
-        };
-        return labels[type] || type;
-    };
-    const getGroupTypeIcon = (type) => {
-        switch (type) {
-            case 'READING_PASSAGE':
-                return _jsx(FileText, { className: "h-5 w-5" });
-            case 'LISTENING_AUDIO':
-                return _jsx(Music, { className: "h-5 w-5" });
-            case 'LISTENING_VIDEO':
-                return _jsx(Video, { className: "h-5 w-5" });
-            case 'IMAGE_BASED':
-                return _jsx(ImageIcon, { className: "h-5 w-5" });
-            default:
-                return _jsx(FileText, { className: "h-5 w-5" });
-        }
-    };
-    const addTag = () => {
-        if (tagInput.trim() && !tags.includes(tagInput.trim())) {
-            setTags([...tags, tagInput.trim()]);
-            setTagInput('');
-        }
-    };
-    const removeTag = (tagToRemove) => {
-        setTags(tags.filter((tag) => tag !== tagToRemove));
-    };
-    const toggleQuestionSelection = (questionId) => {
-        if (selectedQuestionIds.includes(questionId)) {
-            setSelectedQuestionIds(selectedQuestionIds.filter((id) => id !== questionId));
-        }
-        else {
-            setSelectedQuestionIds([...selectedQuestionIds, questionId]);
-        }
-    };
-    const moveQuestion = (index, direction) => {
-        const newIds = [...selectedQuestionIds];
-        const newIndex = direction === 'up' ? index - 1 : index + 1;
-        if (newIndex >= 0 && newIndex < newIds.length) {
-            [newIds[index], newIds[newIndex]] = [newIds[newIndex], newIds[index]];
-            setSelectedQuestionIds(newIds);
-        }
-    };
-    const filteredQuestions = availableQuestions.filter((q) => q.content.toLowerCase().includes(questionSearchQuery.toLowerCase()) ||
-        q.type.toLowerCase().includes(questionSearchQuery.toLowerCase()));
-    const selectedQuestions = selectedQuestionIds
-        .map((id) => availableQuestions.find((q) => q.id === id))
-        .filter(Boolean);
-    const totalPoints = selectedQuestions.reduce((sum, q) => sum + q.points, 0);
-    const handleSave = () => {
-        if (!name || !groupType || selectedQuestionIds.length === 0) {
-            toast.error(t('common.questionGroup.create.fillInfo'));
-            return;
-        }
-        const groupData = {
-            name,
-            description,
-            type: groupType,
-            context,
-            level,
-            skill,
-            category: category || undefined,
-            tags: tags.length > 0 ? tags : undefined,
-            allowShuffle,
-            questionIds: selectedQuestionIds,
-            questionCount: selectedQuestionIds.length,
-            totalPoints,
-        };
-        onSave?.(groupData);
-        toast.success(t('common.questionGroup.create.success'));
-    };
-    const canProceedToStep2 = name && groupType;
-    const canProceedToStep3 = canProceedToStep2 && context.instructions;
-    return (_jsxs("div", { className: "space-y-6", children: [_jsxs("div", { className: "flex items-center justify-center space-x-4", children: [_jsx("div", { className: `flex h-10 w-10 items-center justify-center rounded-full ${step >= 1 ? 'bg-blue-500 text-white' : 'bg-gray-200 text-gray-500'}`, children: "1" }), _jsx("div", { className: `h-1 w-20 ${step >= 2 ? 'bg-blue-500' : 'bg-gray-200'}` }), _jsx("div", { className: `flex h-10 w-10 items-center justify-center rounded-full ${step >= 2 ? 'bg-blue-500 text-white' : 'bg-gray-200 text-gray-500'}`, children: "2" }), _jsx("div", { className: `h-1 w-20 ${step >= 3 ? 'bg-blue-500' : 'bg-gray-200'}` }), _jsx("div", { className: `flex h-10 w-10 items-center justify-center rounded-full ${step >= 3 ? 'bg-blue-500 text-white' : 'bg-gray-200 text-gray-500'}`, children: "3" })] }), step === 1 && (_jsxs(Card, { children: [_jsxs(CardHeader, { children: [_jsx(CardTitle, { children: "B\u01B0\u1EDBc 1: Th\u00F4ng tin c\u01A1 b\u1EA3n" }), _jsx(CardDescription, { children: "Nh\u1EADp th\u00F4ng tin chung v\u1EC1 nh\u00F3m c\u00E2u h\u1ECFi" })] }), _jsxs(CardContent, { className: "space-y-4", children: [_jsxs("div", { children: [_jsx(Label, { htmlFor: "name", children: "T\u00EAn nh\u00F3m c\u00E2u h\u1ECFi *" }), _jsx(Input, { id: "name", value: name, onChange: (e) => setName(e.target.value), placeholder: "VD: TOEIC Part 3 - Conversation v\u1EC1 mua s\u1EAFm", className: "mt-1" })] }), _jsxs("div", { children: [_jsx(Label, { htmlFor: "description", children: "M\u00F4 t\u1EA3" }), _jsx(Textarea, { id: "description", value: description, onChange: (e) => setDescription(e.target.value), placeholder: "M\u00F4 t\u1EA3 ng\u1EAFn g\u1ECDn v\u1EC1 nh\u00F3m c\u00E2u h\u1ECFi n\u00E0y...", className: "mt-1", rows: 3 })] }), _jsxs("div", { children: [_jsx(Label, { htmlFor: "groupType", children: "Lo\u1EA1i nh\u00F3m c\u00E2u h\u1ECFi *" }), _jsxs(Select, { value: groupType, onValueChange: (value) => setGroupType(value), children: [_jsx(SelectTrigger, { id: "groupType", className: "mt-1", children: _jsx(SelectValue, { placeholder: "Ch\u1ECDn lo\u1EA1i nh\u00F3m c\u00E2u h\u1ECFi" }) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: "READING_PASSAGE", children: _jsxs("div", { className: "flex items-center gap-2", children: [_jsx(FileText, { className: "h-4 w-4" }), "\u0110\u1ECDc hi\u1EC3u - \u0110o\u1EA1n v\u0103n"] }) }), _jsx(SelectItem, { value: "LISTENING_AUDIO", children: _jsxs("div", { className: "flex items-center gap-2", children: [_jsx(Music, { className: "h-4 w-4" }), "Nghe - Audio/H\u1ED9i tho\u1EA1i"] }) }), _jsx(SelectItem, { value: "LISTENING_VIDEO", children: _jsxs("div", { className: "flex items-center gap-2", children: [_jsx(Video, { className: "h-4 w-4" }), "Nghe - Video"] }) }), _jsx(SelectItem, { value: "IMAGE_BASED", children: _jsxs("div", { className: "flex items-center gap-2", children: [_jsx(ImageIcon, { className: "h-4 w-4" }), "D\u1EF1a v\u00E0o h\u00ECnh \u1EA3nh"] }) }), _jsx(SelectItem, { value: "MIXED", children: "K\u1EBFt h\u1EE3p nhi\u1EC1u lo\u1EA1i" })] })] })] }), _jsxs("div", { className: "grid grid-cols-2 gap-4", children: [_jsxs("div", { children: [_jsx(Label, { htmlFor: "level", children: "C\u1EA5p \u0111\u1ED9 *" }), _jsxs(Select, { value: level, onValueChange: (value) => setLevel(value), children: [_jsx(SelectTrigger, { id: "level", className: "mt-1", children: _jsx(SelectValue, {}) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: "A1", children: "A1" }), _jsx(SelectItem, { value: "A2", children: "A2" }), _jsx(SelectItem, { value: "B1", children: "B1" }), _jsx(SelectItem, { value: "B2", children: "B2" }), _jsx(SelectItem, { value: "C1", children: "C1" }), _jsx(SelectItem, { value: "C2", children: "C2" })] })] })] }), _jsxs("div", { children: [_jsx(Label, { htmlFor: "skill", children: "K\u1EF9 n\u0103ng *" }), _jsxs(Select, { value: skill, onValueChange: (value) => setSkill(value), children: [_jsx(SelectTrigger, { id: "skill", className: "mt-1", children: _jsx(SelectValue, {}) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: "LISTENING", children: "Listening" }), _jsx(SelectItem, { value: "READING", children: "Reading" }), _jsx(SelectItem, { value: "WRITING", children: "Writing" }), _jsx(SelectItem, { value: "SPEAKING", children: "Speaking" })] })] })] })] }), _jsxs("div", { children: [_jsx(Label, { htmlFor: "category", children: "Ch\u1EE7 \u0111\u1EC1" }), _jsx(Input, { id: "category", value: category, onChange: (e) => setCategory(e.target.value), placeholder: "VD: Daily Life, Business, Academic...", className: "mt-1" })] }), _jsxs("div", { children: [_jsx(Label, { children: "Tags" }), _jsxs("div", { className: "mt-1 flex gap-2", children: [_jsx(Input, { value: tagInput, onChange: (e) => setTagInput(e.target.value), onKeyDown: (e) => {
-                                                    if (e.key === 'Enter') {
-                                                        e.preventDefault();
-                                                        addTag();
-                                                    }
-                                                }, placeholder: "Nh\u1EADp tag v\u00E0 Enter..." }), _jsx(Button, { type: "button", onClick: addTag, size: "sm", children: _jsx(Plus, { className: "h-4 w-4" }) })] }), tags.length > 0 && (_jsx("div", { className: "mt-2 flex flex-wrap gap-2", children: tags.map((tag) => (_jsxs(Badge, { variant: "secondary", className: "pr-1", children: [tag, _jsx("button", { onClick: () => removeTag(tag), className: "ml-1 rounded-full p-0.5 hover:bg-gray-300", children: _jsx(X, { className: "h-3 w-3" }) })] }, tag))) }))] }), _jsxs("div", { className: "flex items-center space-x-2", children: [_jsx(Checkbox, { id: "allowShuffle", checked: allowShuffle, onCheckedChange: (checked) => setAllowShuffle(checked) }), _jsx(Label, { htmlFor: "allowShuffle", className: "text-sm font-normal", children: "Cho ph\u00E9p x\u00E1o tr\u1ED9n th\u1EE9 t\u1EF1 c\u00E2u h\u1ECFi trong nh\u00F3m" })] })] })] })), step === 2 && groupType && (_jsxs(Card, { children: [_jsxs(CardHeader, { children: [_jsxs(CardTitle, { className: "flex items-center gap-2", children: [getGroupTypeIcon(groupType), "B\u01B0\u1EDBc 2: N\u1ED9i dung chung - ", getGroupTypeLabel(groupType)] }), _jsx(CardDescription, { children: "Nh\u1EADp n\u1ED9i dung chung m\u00E0 t\u1EA5t c\u1EA3 c\u00E2u h\u1ECFi trong nh\u00F3m s\u1EBD s\u1EED d\u1EE5ng" })] }), _jsxs(CardContent, { className: "space-y-4", children: [_jsxs("div", { children: [_jsx(Label, { htmlFor: "instructions", children: "H\u01B0\u1EDBng d\u1EABn chung *" }), _jsx(Textarea, { id: "instructions", value: context.instructions || '', onChange: (e) => setContext({ ...context, instructions: e.target.value }), placeholder: "VD: H\u00E3y \u0111\u1ECDc \u0111o\u1EA1n v\u0103n sau v\u00E0 tr\u1EA3 l\u1EDDi c\u00E1c c\u00E2u h\u1ECFi...", className: "mt-1", rows: 3 })] }), (groupType === 'READING_PASSAGE' || groupType === 'MIXED') && (_jsxs("div", { className: "space-y-4 rounded-lg border border-gray-200 bg-gray-50 p-4", children: [_jsx("h4", { className: "font-medium", children: "\u0110o\u1EA1n v\u0103n \u0111\u1ECDc hi\u1EC3u" }), _jsxs("div", { children: [_jsx(Label, { htmlFor: "passageTitle", children: "Ti\u00EAu \u0111\u1EC1 \u0111o\u1EA1n v\u0103n" }), _jsx(Input, { id: "passageTitle", value: context.passageTitle || '', onChange: (e) => setContext({ ...context, passageTitle: e.target.value }), placeholder: "Ti\u00EAu \u0111\u1EC1 c\u1EE7a \u0111o\u1EA1n v\u0103n...", className: "mt-1" })] }), _jsxs("div", { children: [_jsx(Label, { htmlFor: "passage", children: "N\u1ED9i dung \u0111o\u1EA1n v\u0103n" }), _jsx(Textarea, { id: "passage", value: context.passage || '', onChange: (e) => setContext({ ...context, passage: e.target.value }), placeholder: "Nh\u1EADp n\u1ED9i dung \u0111o\u1EA1n v\u0103n \u0111\u1ECDc hi\u1EC3u...", className: "mt-1", rows: 8 })] })] })), (groupType === 'LISTENING_AUDIO' || groupType === 'MIXED') && (_jsxs("div", { className: "space-y-4 rounded-lg border border-gray-200 bg-gray-50 p-4", children: [_jsx("h4", { className: "font-medium", children: "Audio" }), _jsxs("div", { children: [_jsx(Label, { htmlFor: "audioUrl", children: "File \u00E2m thanh" }), _jsxs("div", { className: "mt-1 flex gap-2", children: [_jsx(Input, { id: "audioUrl", value: context.audioUrl || '', onChange: (e) => setContext({ ...context, audioUrl: e.target.value }), placeholder: "URL ho\u1EB7c \u0111\u01B0\u1EDDng d\u1EABn file \u00E2m thanh" }), _jsx(Button, { variant: "outline", size: "icon", children: _jsx(Upload, { className: "h-4 w-4" }) })] })] }), _jsxs("div", { children: [_jsx(Label, { htmlFor: "audioScript", children: "Transcript (b\u1EA3n ghi \u00E2m)" }), _jsx(Textarea, { id: "audioScript", value: context.audioScript || '', onChange: (e) => setContext({ ...context, audioScript: e.target.value }), placeholder: "N\u1ED9i dung transcript c\u1EE7a audio...", className: "mt-1", rows: 5 })] })] })), (groupType === 'LISTENING_VIDEO' || groupType === 'MIXED') && (_jsxs("div", { className: "space-y-4 rounded-lg border border-gray-200 bg-gray-50 p-4", children: [_jsx("h4", { className: "font-medium", children: "Video" }), _jsxs("div", { children: [_jsx(Label, { htmlFor: "videoUrl", children: "File video" }), _jsxs("div", { className: "mt-1 flex gap-2", children: [_jsx(Input, { id: "videoUrl", value: context.videoUrl || '', onChange: (e) => setContext({ ...context, videoUrl: e.target.value }), placeholder: "URL ho\u1EB7c \u0111\u01B0\u1EDDng d\u1EABn file video" }), _jsx(Button, { variant: "outline", size: "icon", children: _jsx(Upload, { className: "h-4 w-4" }) })] })] }), _jsxs("div", { children: [_jsx(Label, { htmlFor: "videoScript", children: "Transcript video" }), _jsx(Textarea, { id: "videoScript", value: context.videoScript || '', onChange: (e) => setContext({ ...context, videoScript: e.target.value }), placeholder: "N\u1ED9i dung transcript c\u1EE7a video...", className: "mt-1", rows: 5 })] })] })), (groupType === 'IMAGE_BASED' || groupType === 'MIXED') && (_jsxs("div", { className: "space-y-4 rounded-lg border border-gray-200 bg-gray-50 p-4", children: [_jsx("h4", { className: "font-medium", children: "H\u00ECnh \u1EA3nh" }), _jsxs("div", { children: [_jsx(Label, { htmlFor: "imageUrl", children: "File h\u00ECnh \u1EA3nh" }), _jsxs("div", { className: "mt-1 flex gap-2", children: [_jsx(Input, { id: "imageUrl", value: context.imageUrl || '', onChange: (e) => setContext({ ...context, imageUrl: e.target.value }), placeholder: "URL ho\u1EB7c \u0111\u01B0\u1EDDng d\u1EABn file h\u00ECnh \u1EA3nh" }), _jsx(Button, { variant: "outline", size: "icon", children: _jsx(Upload, { className: "h-4 w-4" }) })] })] }), _jsxs("div", { children: [_jsx(Label, { htmlFor: "imageCaption", children: "Ch\u00FA th\u00EDch h\u00ECnh \u1EA3nh" }), _jsx(Input, { id: "imageCaption", value: context.imageCaption || '', onChange: (e) => setContext({ ...context, imageCaption: e.target.value }), placeholder: "M\u00F4 t\u1EA3 ng\u1EAFn v\u1EC1 h\u00ECnh \u1EA3nh...", className: "mt-1" })] })] }))] })] })), step === 3 && (_jsxs("div", { className: "space-y-6", children: [_jsxs(Card, { children: [_jsxs(CardHeader, { children: [_jsx(CardTitle, { children: "B\u01B0\u1EDBc 3: Ch\u1ECDn c\u00E2u h\u1ECFi" }), _jsx(CardDescription, { children: "Ch\u1ECDn c\u00E1c c\u00E2u h\u1ECFi thu\u1ED9c nh\u00F3m n\u00E0y. C\u00E1c c\u00E2u h\u1ECFi s\u1EBD chia s\u1EBB context chung." })] }), _jsxs(CardContent, { className: "space-y-4", children: [_jsx("div", { children: _jsx(Input, { value: questionSearchQuery, onChange: (e) => setQuestionSearchQuery(e.target.value), placeholder: "T\u00ECm ki\u1EBFm c\u00E2u h\u1ECFi...", className: "w-full" }) }), _jsx("div", { className: "max-h-[400px] space-y-2 overflow-y-auto rounded-lg border p-4", children: filteredQuestions.length === 0 ? (_jsx("p", { className: "py-8 text-center text-sm text-gray-500", children: "Kh\u00F4ng c\u00F3 c\u00E2u h\u1ECFi n\u00E0o \u0111\u1EC3 ch\u1ECDn" })) : (filteredQuestions.map((question) => (_jsxs("div", { className: "flex items-start gap-3 rounded-lg border p-3 hover:bg-gray-50", children: [_jsx(Checkbox, { checked: selectedQuestionIds.includes(question.id), onCheckedChange: () => toggleQuestionSelection(question.id) }), _jsxs("div", { className: "flex-1", children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx(Badge, { variant: "outline", children: question.type }), _jsxs(Badge, { children: [question.points, " \u0111i\u1EC3m"] }), _jsx(Badge, { variant: "secondary", children: question.level })] }), _jsx("p", { className: "mt-1 text-sm", children: question.content })] })] }, question.id)))) })] })] }), selectedQuestions.length > 0 && (_jsxs(Card, { children: [_jsxs(CardHeader, { children: [_jsxs(CardTitle, { children: ["C\u00E2u h\u1ECFi \u0111\u00E3 ch\u1ECDn (", selectedQuestions.length, " c\u00E2u - T\u1ED5ng ", totalPoints, " \u0111i\u1EC3m)"] }), _jsx(CardDescription, { children: "S\u1EAFp x\u1EBFp th\u1EE9 t\u1EF1 c\u00E2u h\u1ECFi b\u1EB1ng c\u00E1c n\u00FAt m\u0169i t\u00EAn" })] }), _jsx(CardContent, { children: _jsx("div", { className: "space-y-2", children: selectedQuestions.map((question, index) => (_jsxs("div", { className: "flex items-center gap-2 rounded-lg border bg-white p-3", children: [_jsxs("span", { className: "font-semibold text-gray-500", children: ["#", index + 1] }), _jsxs("div", { className: "flex-1", children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx(Badge, { variant: "outline", children: question.type }), _jsxs(Badge, { children: [question.points, " \u0111i\u1EC3m"] })] }), _jsx("p", { className: "mt-1 text-sm", children: question.content })] }), _jsxs("div", { className: "flex gap-1", children: [_jsx(Button, { variant: "ghost", size: "icon", onClick: () => moveQuestion(index, 'up'), disabled: index === 0, children: _jsx(MoveUp, { className: "h-4 w-4" }) }), _jsx(Button, { variant: "ghost", size: "icon", onClick: () => moveQuestion(index, 'down'), disabled: index === selectedQuestions.length - 1, children: _jsx(MoveDown, { className: "h-4 w-4" }) }), _jsx(Button, { variant: "ghost", size: "icon", onClick: () => toggleQuestionSelection(question.id), children: _jsx(X, { className: "h-4 w-4" }) })] })] }, question.id))) }) })] }))] })), _jsxs("div", { className: "flex justify-between", children: [_jsx("div", { children: step > 1 && (_jsx(Button, { variant: "outline", onClick: () => setStep(step - 1), children: "Quay l\u1EA1i" })) }), _jsxs("div", { className: "flex gap-3", children: [_jsx(Button, { variant: "outline", onClick: onCancel, children: "H\u1EE7y" }), step < 3 ? (_jsx(Button, { onClick: () => setStep(step + 1), disabled: (step === 1 && !canProceedToStep2) || (step === 2 && !canProceedToStep3), className: "bg-blue-500 hover:bg-blue-600", children: "Ti\u1EBFp theo" })) : (_jsx(Button, { onClick: handleSave, className: "bg-blue-500 hover:bg-blue-600", children: "L\u01B0u nh\u00F3m c\u00E2u h\u1ECFi" }))] })] })] }));
-}
-//# sourceMappingURL=QuestionGroupCreator.js.map
+"use client";import{jsx as e,jsxs as i}from"react/jsx-runtime";import{useState as l}from"react";import{Button as n}from"../../../components/ui/button";import{Input as a}from"../../../components/ui/input";import{Label as c}from"../../../components/ui/label";import{Textarea as r}from"../../../components/ui/textarea";import{Card as t,CardContent as d,CardDescription as h,CardHeader as s,CardTitle as o}from"../../../components/ui/card";import{Select as m,SelectContent as u,SelectItem as g,SelectTrigger as v,SelectValue as p}from"../../../components/ui/select";import{Badge as N}from"../../../components/ui/badge";import{Checkbox as f}from"../../../components/ui/checkbox";import{Plus as y,X as b,Upload as C,MoveUp as x,MoveDown as I,FileText as w,Music as E,Video as A,Image as S}from"lucide-react";import{toast as D}from"sonner";import{t as G}from"../../../shared/lib/i18n";export function QuestionGroupCreator({onSave:T,onCancel:k,availableQuestions:L=[]}){const[F,U]=l(1),[_,B]=l(""),[M,V]=l(""),[R,O]=l(""),[j,z]=l("A1"),[P,H]=l("READING"),[K,X]=l(""),[q,Q]=l([]),[W,J]=l(""),[Y,Z]=l(!1),[$,ee]=l({instructions:""}),[ie,le]=l([]),[ne,ae]=l(""),ce=()=>{W.trim()&&!q.includes(W.trim())&&(Q([...q,W.trim()]),J(""))},re=e=>{ie.includes(e)?le(ie.filter(i=>i!==e)):le([...ie,e])},te=(e,i)=>{const l=[...ie],n="up"===i?e-1:e+1;n>=0&&n<l.length&&([l[e],l[n]]=[l[n],l[e]],le(l))},de=L.filter(e=>e.content.toLowerCase().includes(ne.toLowerCase())||e.type.toLowerCase().includes(ne.toLowerCase())),he=ie.map(e=>L.find(i=>i.id===e)).filter(Boolean),se=he.reduce((e,i)=>e+i.points,0),oe=_&&R,me=oe&&$.instructions;return i("div",{className:"space-y-6",children:[i("div",{className:"flex items-center justify-center space-x-4",children:[e("div",{className:"flex h-10 w-10 items-center justify-center rounded-full "+(F>=1?"bg-blue-500 text-white":"bg-gray-200 text-gray-500"),children:"1"}),e("div",{className:"h-1 w-20 "+(F>=2?"bg-blue-500":"bg-gray-200")}),e("div",{className:"flex h-10 w-10 items-center justify-center rounded-full "+(F>=2?"bg-blue-500 text-white":"bg-gray-200 text-gray-500"),children:"2"}),e("div",{className:"h-1 w-20 "+(F>=3?"bg-blue-500":"bg-gray-200")}),e("div",{className:"flex h-10 w-10 items-center justify-center rounded-full "+(F>=3?"bg-blue-500 text-white":"bg-gray-200 text-gray-500"),children:"3"})]}),1===F&&i(t,{children:[i(s,{children:[e(o,{children:"Bước 1: Thông tin cơ bản"}),e(h,{children:"Nhập thông tin chung về nhóm câu hỏi"})]}),i(d,{className:"space-y-4",children:[i("div",{children:[e(c,{htmlFor:"name",children:"Tên nhóm câu hỏi *"}),e(a,{id:"name",value:_,onChange:e=>B(e.target.value),placeholder:"VD: TOEIC Part 3 - Conversation về mua sắm",className:"mt-1"})]}),i("div",{children:[e(c,{htmlFor:"description",children:"Mô tả"}),e(r,{id:"description",value:M,onChange:e=>V(e.target.value),placeholder:"Mô tả ngắn gọn về nhóm câu hỏi này...",className:"mt-1",rows:3})]}),i("div",{children:[e(c,{htmlFor:"groupType",children:"Loại nhóm câu hỏi *"}),i(m,{value:R,onValueChange:e=>O(e),children:[e(v,{id:"groupType",className:"mt-1",children:e(p,{placeholder:"Chọn loại nhóm câu hỏi"})}),i(u,{children:[e(g,{value:"READING_PASSAGE",children:i("div",{className:"flex items-center gap-2",children:[e(w,{className:"h-4 w-4"}),"Đọc hiểu - Đoạn văn"]})}),e(g,{value:"LISTENING_AUDIO",children:i("div",{className:"flex items-center gap-2",children:[e(E,{className:"h-4 w-4"}),"Nghe - Audio/Hội thoại"]})}),e(g,{value:"LISTENING_VIDEO",children:i("div",{className:"flex items-center gap-2",children:[e(A,{className:"h-4 w-4"}),"Nghe - Video"]})}),e(g,{value:"IMAGE_BASED",children:i("div",{className:"flex items-center gap-2",children:[e(S,{className:"h-4 w-4"}),"Dựa vào hình ảnh"]})}),e(g,{value:"MIXED",children:"Kết hợp nhiều loại"})]})]})]}),i("div",{className:"grid grid-cols-2 gap-4",children:[i("div",{children:[e(c,{htmlFor:"level",children:"Cấp độ *"}),i(m,{value:j,onValueChange:e=>z(e),children:[e(v,{id:"level",className:"mt-1",children:e(p,{})}),i(u,{children:[e(g,{value:"A1",children:"A1"}),e(g,{value:"A2",children:"A2"}),e(g,{value:"B1",children:"B1"}),e(g,{value:"B2",children:"B2"}),e(g,{value:"C1",children:"C1"}),e(g,{value:"C2",children:"C2"})]})]})]}),i("div",{children:[e(c,{htmlFor:"skill",children:"Kỹ năng *"}),i(m,{value:P,onValueChange:e=>H(e),children:[e(v,{id:"skill",className:"mt-1",children:e(p,{})}),i(u,{children:[e(g,{value:"LISTENING",children:"Listening"}),e(g,{value:"READING",children:"Reading"}),e(g,{value:"WRITING",children:"Writing"}),e(g,{value:"SPEAKING",children:"Speaking"})]})]})]})]}),i("div",{children:[e(c,{htmlFor:"category",children:"Chủ đề"}),e(a,{id:"category",value:K,onChange:e=>X(e.target.value),placeholder:"VD: Daily Life, Business, Academic...",className:"mt-1"})]}),i("div",{children:[e(c,{children:"Tags"}),i("div",{className:"mt-1 flex gap-2",children:[e(a,{value:W,onChange:e=>J(e.target.value),onKeyDown:e=>{"Enter"===e.key&&(e.preventDefault(),ce())},placeholder:"Nhập tag và Enter..."}),e(n,{type:"button",onClick:ce,size:"sm",children:e(y,{className:"h-4 w-4"})})]}),q.length>0&&e("div",{className:"mt-2 flex flex-wrap gap-2",children:q.map(l=>i(N,{variant:"secondary",className:"pr-1",children:[l,e("button",{onClick:()=>{return e=l,void Q(q.filter(i=>i!==e));var e},className:"ml-1 rounded-full p-0.5 hover:bg-gray-300",children:e(b,{className:"h-3 w-3"})})]},l))})]}),i("div",{className:"flex items-center space-x-2",children:[e(f,{id:"allowShuffle",checked:Y,onCheckedChange:e=>Z(e)}),e(c,{htmlFor:"allowShuffle",className:"text-sm font-normal",children:"Cho phép xáo trộn thứ tự câu hỏi trong nhóm"})]})]})]}),2===F&&R&&i(t,{children:[i(s,{children:[i(o,{className:"flex items-center gap-2",children:[(i=>{switch(i){case"READING_PASSAGE":default:return e(w,{className:"h-5 w-5"});case"LISTENING_AUDIO":return e(E,{className:"h-5 w-5"});case"LISTENING_VIDEO":return e(A,{className:"h-5 w-5"});case"IMAGE_BASED":return e(S,{className:"h-5 w-5"})}})(R),"Bước 2: Nội dung chung - ",(ue=R,{READING_PASSAGE:"Đọc hiểu - Đoạn văn",LISTENING_AUDIO:"Nghe - Audio/Hội thoại",LISTENING_VIDEO:"Nghe - Video",IMAGE_BASED:"Dựa vào hình ảnh",MIXED:"Kết hợp nhiều loại"}[ue]||ue)]}),e(h,{children:"Nhập nội dung chung mà tất cả câu hỏi trong nhóm sẽ sử dụng"})]}),i(d,{className:"space-y-4",children:[i("div",{children:[e(c,{htmlFor:"instructions",children:"Hướng dẫn chung *"}),e(r,{id:"instructions",value:$.instructions||"",onChange:e=>ee({...$,instructions:e.target.value}),placeholder:"VD: Hãy đọc đoạn văn sau và trả lời các câu hỏi...",className:"mt-1",rows:3})]}),("READING_PASSAGE"===R||"MIXED"===R)&&i("div",{className:"space-y-4 rounded-lg border border-gray-200 bg-gray-50 p-4",children:[e("h4",{className:"font-medium",children:"Đoạn văn đọc hiểu"}),i("div",{children:[e(c,{htmlFor:"passageTitle",children:"Tiêu đề đoạn văn"}),e(a,{id:"passageTitle",value:$.passageTitle||"",onChange:e=>ee({...$,passageTitle:e.target.value}),placeholder:"Tiêu đề của đoạn văn...",className:"mt-1"})]}),i("div",{children:[e(c,{htmlFor:"passage",children:"Nội dung đoạn văn"}),e(r,{id:"passage",value:$.passage||"",onChange:e=>ee({...$,passage:e.target.value}),placeholder:"Nhập nội dung đoạn văn đọc hiểu...",className:"mt-1",rows:8})]})]}),("LISTENING_AUDIO"===R||"MIXED"===R)&&i("div",{className:"space-y-4 rounded-lg border border-gray-200 bg-gray-50 p-4",children:[e("h4",{className:"font-medium",children:"Audio"}),i("div",{children:[e(c,{htmlFor:"audioUrl",children:"File âm thanh"}),i("div",{className:"mt-1 flex gap-2",children:[e(a,{id:"audioUrl",value:$.audioUrl||"",onChange:e=>ee({...$,audioUrl:e.target.value}),placeholder:"URL hoặc đường dẫn file âm thanh"}),e(n,{variant:"outline",size:"icon",children:e(C,{className:"h-4 w-4"})})]})]}),i("div",{children:[e(c,{htmlFor:"audioScript",children:"Transcript (bản ghi âm)"}),e(r,{id:"audioScript",value:$.audioScript||"",onChange:e=>ee({...$,audioScript:e.target.value}),placeholder:"Nội dung transcript của audio...",className:"mt-1",rows:5})]})]}),("LISTENING_VIDEO"===R||"MIXED"===R)&&i("div",{className:"space-y-4 rounded-lg border border-gray-200 bg-gray-50 p-4",children:[e("h4",{className:"font-medium",children:"Video"}),i("div",{children:[e(c,{htmlFor:"videoUrl",children:"File video"}),i("div",{className:"mt-1 flex gap-2",children:[e(a,{id:"videoUrl",value:$.videoUrl||"",onChange:e=>ee({...$,videoUrl:e.target.value}),placeholder:"URL hoặc đường dẫn file video"}),e(n,{variant:"outline",size:"icon",children:e(C,{className:"h-4 w-4"})})]})]}),i("div",{children:[e(c,{htmlFor:"videoScript",children:"Transcript video"}),e(r,{id:"videoScript",value:$.videoScript||"",onChange:e=>ee({...$,videoScript:e.target.value}),placeholder:"Nội dung transcript của video...",className:"mt-1",rows:5})]})]}),("IMAGE_BASED"===R||"MIXED"===R)&&i("div",{className:"space-y-4 rounded-lg border border-gray-200 bg-gray-50 p-4",children:[e("h4",{className:"font-medium",children:"Hình ảnh"}),i("div",{children:[e(c,{htmlFor:"imageUrl",children:"File hình ảnh"}),i("div",{className:"mt-1 flex gap-2",children:[e(a,{id:"imageUrl",value:$.imageUrl||"",onChange:e=>ee({...$,imageUrl:e.target.value}),placeholder:"URL hoặc đường dẫn file hình ảnh"}),e(n,{variant:"outline",size:"icon",children:e(C,{className:"h-4 w-4"})})]})]}),i("div",{children:[e(c,{htmlFor:"imageCaption",children:"Chú thích hình ảnh"}),e(a,{id:"imageCaption",value:$.imageCaption||"",onChange:e=>ee({...$,imageCaption:e.target.value}),placeholder:"Mô tả ngắn về hình ảnh...",className:"mt-1"})]})]})]})]}),3===F&&i("div",{className:"space-y-6",children:[i(t,{children:[i(s,{children:[e(o,{children:"Bước 3: Chọn câu hỏi"}),e(h,{children:"Chọn các câu hỏi thuộc nhóm này. Các câu hỏi sẽ chia sẻ context chung."})]}),i(d,{className:"space-y-4",children:[e("div",{children:e(a,{value:ne,onChange:e=>ae(e.target.value),placeholder:"Tìm kiếm câu hỏi...",className:"w-full"})}),e("div",{className:"max-h-[400px] space-y-2 overflow-y-auto rounded-lg border p-4",children:0===de.length?e("p",{className:"py-8 text-center text-sm text-gray-500",children:"Không có câu hỏi nào để chọn"}):de.map(l=>i("div",{className:"flex items-start gap-3 rounded-lg border p-3 hover:bg-gray-50",children:[e(f,{checked:ie.includes(l.id),onCheckedChange:()=>re(l.id)}),i("div",{className:"flex-1",children:[i("div",{className:"flex items-center gap-2",children:[e(N,{variant:"outline",children:l.type}),i(N,{children:[l.points," điểm"]}),e(N,{variant:"secondary",children:l.level})]}),e("p",{className:"mt-1 text-sm",children:l.content})]})]},l.id))})]})]}),he.length>0&&i(t,{children:[i(s,{children:[i(o,{children:["Câu hỏi đã chọn (",he.length," câu - Tổng ",se," điểm)"]}),e(h,{children:"Sắp xếp thứ tự câu hỏi bằng các nút mũi tên"})]}),e(d,{children:e("div",{className:"space-y-2",children:he.map((l,a)=>i("div",{className:"flex items-center gap-2 rounded-lg border bg-white p-3",children:[i("span",{className:"font-semibold text-gray-500",children:["#",a+1]}),i("div",{className:"flex-1",children:[i("div",{className:"flex items-center gap-2",children:[e(N,{variant:"outline",children:l.type}),i(N,{children:[l.points," điểm"]})]}),e("p",{className:"mt-1 text-sm",children:l.content})]}),i("div",{className:"flex gap-1",children:[e(n,{variant:"ghost",size:"icon",onClick:()=>te(a,"up"),disabled:0===a,children:e(x,{className:"h-4 w-4"})}),e(n,{variant:"ghost",size:"icon",onClick:()=>te(a,"down"),disabled:a===he.length-1,children:e(I,{className:"h-4 w-4"})}),e(n,{variant:"ghost",size:"icon",onClick:()=>re(l.id),children:e(b,{className:"h-4 w-4"})})]})]},l.id))})})]})]}),i("div",{className:"flex justify-between",children:[e("div",{children:F>1&&e(n,{variant:"outline",onClick:()=>U(F-1),children:"Quay lại"})}),i("div",{className:"flex gap-3",children:[e(n,{variant:"outline",onClick:k,children:"Hủy"}),e(n,F<3?{onClick:()=>U(F+1),disabled:1===F&&!oe||2===F&&!me,className:"bg-blue-500 hover:bg-blue-600",children:"Tiếp theo"}:{onClick:()=>{if(!_||!R||0===ie.length)return void D.error(G("common.questionGroup.create.fillInfo"));const e={name:_,description:M,type:R,context:$,level:j,skill:P,category:K||void 0,tags:q.length>0?q:void 0,allowShuffle:Y,questionIds:ie,questionCount:ie.length,totalPoints:se};T?.(e),D.success(G("common.questionGroup.create.success"))},className:"bg-blue-500 hover:bg-blue-600",children:"Lưu nhóm câu hỏi"})]})]})]});var ue}

package/dist/components/questions/creator/dedicated-component-router.d.ts

@@ -36,4 +36,3 @@ export interface DedicatedComponentRouterProps {
     headerExtra?: ReactNode;
 }
 export declare function renderDedicatedComponent(props: DedicatedComponentRouterProps): ReactNode | null;
-//# sourceMappingURL=dedicated-component-router.d.ts.map

package/dist/components/questions/creator/dedicated-component-router.js

@@ -1,80 +1 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { questionTypeRegistry } from './question-type-registry';
-export function renderDedicatedComponent(props) {
-    const { questionType, initialData, state, onSave, onCancel, onChange, onUnsavedChangesChange, externalErrors, optionCount, optionMode, defaultValue, defaultQuestion, viewMode, groups, groupConfig, groupType, articleCount, questionConfig, questionIndexInPart, partId, validationRef, suggestedAnswers, hasSuggestedAnswers, headerExtra, } = props;
-    const registration = questionTypeRegistry[questionType];
-    if (!registration)
-        return null;
-    const ctx = {
-        questionType,
-        initialData,
-        state,
-        onSave,
-        onCancel,
-        onChange,
-        onUnsavedChangesChange,
-        externalErrors,
-        optionCount,
-        optionMode,
-        defaultValue,
-        defaultQuestion,
-        viewMode,
-        groups,
-        groupConfig,
-        groupType,
-        articleCount,
-        questionConfig,
-        questionIndexInPart,
-        partId,
-        validationRef,
-        suggestedAnswers,
-        hasSuggestedAnswers,
-        headerExtra,
-    };
-    const questionData = {
-        content: state.content,
-        points: state.points,
-        level: state.level,
-        difficulty: state.difficulty,
-        skill: state.skill,
-    };
-    // Build initialData for the component
-    const componentInitialData = registration.transformInitialData
-        ? registration.transformInitialData(initialData, ctx)
-        : registration.useRawInitialData
-            ? initialData
-            : initialData?.answer;
-    // Build common props
-    const commonProps = {
-        initialData: componentInitialData,
-        onCancel,
-        ...(externalErrors && { externalErrors }),
-        ...(headerExtra && { headerExtra }),
-        ...(groupConfig && { groupConfig }),
-    };
-    // Add extra props from registration
-    if (registration.getExtraProps) {
-        Object.assign(commonProps, registration.getExtraProps(ctx));
-    }
-    // Default onSave wrapper
-    const defaultWrapSave = (data) => ({
-        type: questionType,
-        ...questionData,
-        answer: data,
-    });
-    // Default onChange wrapper
-    const defaultWrapChange = (data) => ({
-        type: questionType,
-        ...questionData,
-        answer: data,
-    });
-    const wrapSave = registration.wrapOnSave || defaultWrapSave;
-    const wrapChange = registration.wrapOnChange || defaultWrapChange;
-    const Component = registration.component;
-    return (_jsx(Component, { ...commonProps, onSave: (data) => {
-            onSave?.(wrapSave(data, ctx));
-        }, onChange: (data) => {
-            onChange?.(wrapChange(data, ctx));
-        } }));
-}
-//# sourceMappingURL=dedicated-component-router.js.map
+import{jsx as e}from"react/jsx-runtime";import{questionTypeRegistry as n}from"./question-type-registry";export function renderDedicatedComponent(t){const{questionType:a,initialData:o,state:r,onSave:i,onCancel:s,onChange:u,onUnsavedChangesChange:l,externalErrors:g,optionCount:p,optionMode:d,defaultValue:f,defaultQuestion:C,viewMode:c,groups:h,groupConfig:x,groupType:v,articleCount:w,questionConfig:y,questionIndexInPart:m,partId:I,validationRef:E,suggestedAnswers:q,hasSuggestedAnswers:D,headerExtra:S}=t,A=n[a];if(!A)return null;const M={questionType:a,initialData:o,state:r,onSave:i,onCancel:s,onChange:u,onUnsavedChangesChange:l,externalErrors:g,optionCount:p,optionMode:d,defaultValue:f,defaultQuestion:C,viewMode:c,groups:h,groupConfig:x,groupType:v,articleCount:w,questionConfig:y,questionIndexInPart:m,partId:I,validationRef:E,suggestedAnswers:q,hasSuggestedAnswers:D,headerExtra:S},P={content:r.content,points:r.points,level:r.level,difficulty:r.difficulty,skill:r.skill},T={initialData:A.transformInitialData?A.transformInitialData(o,M):A.useRawInitialData?o:o?.answer,onCancel:s,...g&&{externalErrors:g},...S&&{headerExtra:S},...x&&{groupConfig:x}};A.getExtraProps&&Object.assign(T,A.getExtraProps(M));const j=A.wrapOnSave||(e=>({type:a,...P,answer:e})),O=A.wrapOnChange||(e=>({type:a,...P,answer:e})),R=A.component;return e(R,{...T,onSave:e=>{i?.(j(e,M))},onChange:e=>{u?.(O(e,M))}})}

package/dist/components/questions/creator/index.d.ts

@@ -1,4 +1,3 @@
 export { QuestionCreator } from './QuestionCreator';
 export { QuestionGroupCreator } from './QuestionGroupCreator';
 export { renderDedicatedComponent } from './dedicated-component-router';
-//# sourceMappingURL=index.d.ts.map

package/dist/components/questions/creator/index.js

@@ -1,4 +1 @@
-export { QuestionCreator } from './QuestionCreator';
-export { QuestionGroupCreator } from './QuestionGroupCreator';
-export { renderDedicatedComponent } from './dedicated-component-router';
-//# sourceMappingURL=index.js.map
+export{QuestionCreator}from"./QuestionCreator";export{QuestionGroupCreator}from"./QuestionGroupCreator";export{renderDedicatedComponent}from"./dedicated-component-router";

package/dist/components/questions/creator/question-type-registry.d.ts

@@ -63,4 +63,3 @@ export interface QuestionTypeRegistration {
     useRawInitialData?: boolean;
 }
 export declare const questionTypeRegistry: Partial<Record<QuestionType, QuestionTypeRegistration>>;
-//# sourceMappingURL=question-type-registry.d.ts.map

package/dist/components/questions/creator/question-type-registry.js

@@ -1,81 +1 @@
-// ─── Registration imports ───────────────────────────────────────────────────
-import { fillInBlankRegistration } from '../types/fill-in-blank/register';
-import { arrangeLettersIntoWordsRegistration } from '../types/arrange-letters-into-words/register';
-import { writeShortParagraphRegistration } from '../types/write-short-paragraph/register';
-import { fillMissingWordsInGridRegistration } from '../types/fill-missing-words-in-grid/register';
-import { lookPictureChooseCorrectAnswerRegistration } from '../types/look-picture-choose-correct-answer/register';
-import { lookPictureFillBlankChooseAnswerRegistration } from '../types/look-picture-fill-blank-choose-answer/register';
-import { lookPictureFillWordHintRegistration } from '../types/look-picture-fill-word-hint/register';
-import { labelThePictureRegistration } from '../types/label-the-picture/register';
-import { readAndColorObjectsRegistration } from '../types/read-and-color-objects/register';
-import { imageObjectMatchingRegistration } from '../types/image-object-matching/register';
-import { readPassageAndAnswerQuestionsRegistration } from '../types/read-passage-and-answer-questions/register';
-import { chooseTheCorrectAnswerRegistration } from '../types/choose-the-correct-answer/register';
-import { writeAShortLetterRegistration } from '../types/write-a-short-letter/register';
-import { writeCorrectVerbFormRegistration } from '../types/write-correct-verb-form/register';
-import { chooseCorrectAdjectiveRegistration } from '../types/choose-correct-adjective/register';
-import { answerTheQuestionRegistration } from '../types/answer-the-question/register';
-import { trueFalseRegistration } from '../types/true-false/register';
-import { wordOrderingRegistration } from '../types/word-ordering/register';
-import { wordFillParagraphRegistration } from '../types/word-fill-paragraph/register';
-import { matchByWritingAnswerRegistration } from '../types/match-by-writing-answer/register';
-import { writeSentencesRegistration } from '../types/write-sentences/register';
-import { listenAndChooseFromAnswerGroupRegistration } from '../types/listen-and-choose-from-answer-group/register';
-import { listenAndChooseObjectsInSceneRegistration } from '../types/listen-and-choose-objects-in-scene/register';
-import { listenAndDragObjectsIntoSceneRegistration } from '../types/listen-and-drag-objects-into-scene/register';
-import { listenAndSpeakAnswerRegistration } from '../types/listen-and-speak-answer/register';
-import { listenAndSpeakImageGroupRegistration } from '../types/listen-and-speak-image-group/register';
-import { listenAndSpeakQuestionListRegistration } from '../types/listen-and-speak-question-list/register';
-import { ListenAndSpeakCompareImagesRegistration } from '../types/listen-and-speak-compare-images/register';
-import { listenAndSpeakWithStoryImagesRegistration } from '../types/listen-and-speak-with-story-images/register';
-import { listenAndSpeakOddOneOutRegistration } from '../types/listen-and-speak-odd-one-out/register';
-import { listenAndSpeakInfoExchangeRegistration } from '../types/listen-and-speak-info-exchange/register';
-import { speakingDescribeImageRegistration } from '../types/speaking-describe-image/register';
-import { spontaneousQARegistration } from '../types/spontaneous-qa/register';
-import { readDisplayedContentRegistration } from '../types/read-displayed-content/register';
-import { speakingConversationRegistration } from '../types/speaking-conversation/register';
-import { gnSpeakingInterviewRegistration } from '../types/gn-speaking-interview/register';
-import { speakingCueCardRegistration } from '../types/speaking-cue-card/register';
-import { wordFillStructuredFormRegistration } from '../types/word-fill-structured-form/register';
-// ─── Registry map ───────────────────────────────────────────────────────────
-export const questionTypeRegistry = {
-    CHOOSE_THE_CORRECT_ANSWER: chooseTheCorrectAnswerRegistration,
-    FILL_IN_BLANK: fillInBlankRegistration,
-    ARRANGE_LETTERS_INTO_WORDS: arrangeLettersIntoWordsRegistration,
-    WRITE_SHORT_PARAGRAPH: writeShortParagraphRegistration,
-    FILL_MISSING_WORDS_IN_GRID: fillMissingWordsInGridRegistration,
-    LOOK_PICTURE_CHOOSE_CORRECT_ANSWER: lookPictureChooseCorrectAnswerRegistration,
-    LOOK_PICTURE_FILL_BLANK_CHOOSE_ANSWER: lookPictureFillBlankChooseAnswerRegistration,
-    LOOK_PICTURE_FILL_WORD_HINT: lookPictureFillWordHintRegistration,
-    LABEL_THE_PICTURE: labelThePictureRegistration,
-    READ_AND_COLOR_OBJECTS: readAndColorObjectsRegistration,
-    IMAGE_OBJECT_MATCHING: imageObjectMatchingRegistration,
-    READ_PASSAGE_AND_ANSWER_QUESTIONS: readPassageAndAnswerQuestionsRegistration,
-    WRITE_A_SHORT_LETTER: writeAShortLetterRegistration,
-    WRITE_CORRECT_VERB_FORM: writeCorrectVerbFormRegistration,
-    CHOOSE_CORRECT_ADJECTIVE: chooseCorrectAdjectiveRegistration,
-    ANSWER_THE_QUESTION: answerTheQuestionRegistration,
-    TRUE_FALSE: trueFalseRegistration,
-    WORD_ORDERING: wordOrderingRegistration,
-    WORD_FILL_PARAGRAPH: wordFillParagraphRegistration, // Will need to handle viewMode mapping either here or in wrapper
-    MATCH_BY_WRITING_ANSWER: matchByWritingAnswerRegistration,
-    WRITE_SENTENCES: writeSentencesRegistration,
-    LISTEN_AND_CHOOSE_FROM_ANSWER_GROUP: listenAndChooseFromAnswerGroupRegistration,
-    LISTEN_AND_CHOOSE_OBJECTS_IN_SCENE: listenAndChooseObjectsInSceneRegistration,
-    LISTEN_AND_DRAG_OBJECTS_INTO_SCENE: listenAndDragObjectsIntoSceneRegistration,
-    LISTEN_AND_SPEAK_ANSWER: listenAndSpeakAnswerRegistration,
-    LISTEN_AND_SPEAK_IMAGE_GROUP: listenAndSpeakImageGroupRegistration,
-    LISTEN_AND_SPEAK_QUESTION_LIST: listenAndSpeakQuestionListRegistration,
-    LISTEN_AND_SPEAK_COMPARE_IMAGES: ListenAndSpeakCompareImagesRegistration,
-    LISTEN_AND_SPEAK_WITH_STORY_IMAGES: listenAndSpeakWithStoryImagesRegistration,
-    LISTEN_AND_SPEAK_ODD_ONE_OUT: listenAndSpeakOddOneOutRegistration,
-    LISTEN_AND_SPEAK_INFO_EXCHANGE: listenAndSpeakInfoExchangeRegistration,
-    SPEAKING_DESCRIBE_IMAGE: speakingDescribeImageRegistration,
-    SPONTANEOUS_QA: spontaneousQARegistration,
-    READ_DISPLAYED_CONTENT: readDisplayedContentRegistration,
-    SPEAKING_CONVERSATION: speakingConversationRegistration,
-    GN_SPEAKING_INTERVIEW: gnSpeakingInterviewRegistration,
-    SPEAKING_CUE_CARD: speakingCueCardRegistration,
-    WORD_FILL_STRUCTURED_FORM: wordFillStructuredFormRegistration,
-};
-//# sourceMappingURL=question-type-registry.js.map
+import{fillInBlankRegistration as r}from"../types/fill-in-blank/register";import{arrangeLettersIntoWordsRegistration as e}from"../types/arrange-letters-into-words/register";import{writeShortParagraphRegistration as t}from"../types/write-short-paragraph/register";import{fillMissingWordsInGridRegistration as s}from"../types/fill-missing-words-in-grid/register";import{lookPictureChooseCorrectAnswerRegistration as o}from"../types/look-picture-choose-correct-answer/register";import{lookPictureFillBlankChooseAnswerRegistration as i}from"../types/look-picture-fill-blank-choose-answer/register";import{lookPictureFillWordHintRegistration as _}from"../types/look-picture-fill-word-hint/register";import{labelThePictureRegistration as p}from"../types/label-the-picture/register";import{readAndColorObjectsRegistration as E}from"../types/read-and-color-objects/register";import{imageObjectMatchingRegistration as m}from"../types/image-object-matching/register";import{readPassageAndAnswerQuestionsRegistration as n}from"../types/read-passage-and-answer-questions/register";import{chooseTheCorrectAnswerRegistration as S}from"../types/choose-the-correct-answer/register";import{writeAShortLetterRegistration as a}from"../types/write-a-short-letter/register";import{writeCorrectVerbFormRegistration as A}from"../types/write-correct-verb-form/register";import{chooseCorrectAdjectiveRegistration as N}from"../types/choose-correct-adjective/register";import{answerTheQuestionRegistration as R}from"../types/answer-the-question/register";import{trueFalseRegistration as g}from"../types/true-false/register";import{wordOrderingRegistration as T}from"../types/word-ordering/register";import{wordFillParagraphRegistration as I}from"../types/word-fill-paragraph/register";import{matchByWritingAnswerRegistration as O}from"../types/match-by-writing-answer/register";import{writeSentencesRegistration as f}from"../types/write-sentences/register";import{listenAndChooseFromAnswerGroupRegistration as y}from"../types/listen-and-choose-from-answer-group/register";import{listenAndChooseObjectsInSceneRegistration as c}from"../types/listen-and-choose-objects-in-scene/register";import{listenAndDragObjectsIntoSceneRegistration as C}from"../types/listen-and-drag-objects-into-scene/register";import{listenAndSpeakAnswerRegistration as l}from"../types/listen-and-speak-answer/register";import{listenAndSpeakImageGroupRegistration as L}from"../types/listen-and-speak-image-group/register";import{listenAndSpeakQuestionListRegistration as d}from"../types/listen-and-speak-question-list/register";import{ListenAndSpeakCompareImagesRegistration as D}from"../types/listen-and-speak-compare-images/register";import{listenAndSpeakWithStoryImagesRegistration as P}from"../types/listen-and-speak-with-story-images/register";import{listenAndSpeakOddOneOutRegistration as G}from"../types/listen-and-speak-odd-one-out/register";import{listenAndSpeakInfoExchangeRegistration as w}from"../types/listen-and-speak-info-exchange/register";import{speakingDescribeImageRegistration as W}from"../types/speaking-describe-image/register";import{spontaneousQARegistration as h}from"../types/spontaneous-qa/register";import{readDisplayedContentRegistration as H}from"../types/read-displayed-content/register";import{speakingConversationRegistration as k}from"../types/speaking-conversation/register";import{gnSpeakingInterviewRegistration as u}from"../types/gn-speaking-interview/register";import{speakingCueCardRegistration as K}from"../types/speaking-cue-card/register";import{wordFillStructuredFormRegistration as U}from"../types/word-fill-structured-form/register";export const questionTypeRegistry={CHOOSE_THE_CORRECT_ANSWER:S,FILL_IN_BLANK:r,ARRANGE_LETTERS_INTO_WORDS:e,WRITE_SHORT_PARAGRAPH:t,FILL_MISSING_WORDS_IN_GRID:s,LOOK_PICTURE_CHOOSE_CORRECT_ANSWER:o,LOOK_PICTURE_FILL_BLANK_CHOOSE_ANSWER:i,LOOK_PICTURE_FILL_WORD_HINT:_,LABEL_THE_PICTURE:p,READ_AND_COLOR_OBJECTS:E,IMAGE_OBJECT_MATCHING:m,READ_PASSAGE_AND_ANSWER_QUESTIONS:n,WRITE_A_SHORT_LETTER:a,WRITE_CORRECT_VERB_FORM:A,CHOOSE_CORRECT_ADJECTIVE:N,ANSWER_THE_QUESTION:R,TRUE_FALSE:g,WORD_ORDERING:T,WORD_FILL_PARAGRAPH:I,MATCH_BY_WRITING_ANSWER:O,WRITE_SENTENCES:f,LISTEN_AND_CHOOSE_FROM_ANSWER_GROUP:y,LISTEN_AND_CHOOSE_OBJECTS_IN_SCENE:c,LISTEN_AND_DRAG_OBJECTS_INTO_SCENE:C,LISTEN_AND_SPEAK_ANSWER:l,LISTEN_AND_SPEAK_IMAGE_GROUP:L,LISTEN_AND_SPEAK_QUESTION_LIST:d,LISTEN_AND_SPEAK_COMPARE_IMAGES:D,LISTEN_AND_SPEAK_WITH_STORY_IMAGES:P,LISTEN_AND_SPEAK_ODD_ONE_OUT:G,LISTEN_AND_SPEAK_INFO_EXCHANGE:w,SPEAKING_DESCRIBE_IMAGE:W,SPONTANEOUS_QA:h,READ_DISPLAYED_CONTENT:H,SPEAKING_CONVERSATION:k,GN_SPEAKING_INTERVIEW:u,SPEAKING_CUE_CARD:K,WORD_FILL_STRUCTURED_FORM:U};

package/dist/components/questions/groups/ArticlesGroupCard.d.ts

@@ -32,4 +32,3 @@ export interface ArticlesGroupCardProps {
  * such as KEY_FOR_SCHOOLS Reading Part 2.
  */
 export declare function ArticlesGroupCard({ groupNumber, articleCount, articles, onArticlesChange, title, onTitleChange, isReadOnly, uploadIdPrefix, }: ArticlesGroupCardProps): import("react").JSX.Element;
-//# sourceMappingURL=ArticlesGroupCard.d.ts.map

package/dist/components/questions/groups/ArticlesGroupCard.js

@@ -1,122 +1 @@
-'use client';
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useEffect, useState } from 'react';
-import { useEditor, EditorContent } from '@tiptap/react';
-import StarterKit from '@tiptap/starter-kit';
-import TextAlign from '@tiptap/extension-text-align';
-import { ImagePreview } from '../../../components/ui/image-preview';
-import { Input } from '../../../components/ui/input';
-import { Label } from '../../../components/ui/label';
-import { Card, CardContent, CardHeader, CardTitle } from '../../../components/ui/card';
-import { FileUpload } from '../../../components/ui/file-upload';
-import { ImageIcon, Layers, Type, FileText, PlusCircle, Trash2, Bold, Italic, Strikethrough, Heading1, Heading2, List, ListOrdered, AlignLeft, AlignCenter, AlignRight, Undo2, Redo2, } from 'lucide-react';
-import { Button } from '../../../components/ui/button';
-import { usePresignedFileUrl } from '../../../shared/lib/hooks';
-// ---------------------------------------------------------------------------
-// Toolbar helpers
-// ---------------------------------------------------------------------------
-function ToolbarBtn({ onClick, active, disabled, title, children, }) {
-    return (_jsx("button", { type: "button", title: title, onClick: onClick, disabled: disabled, className: `flex h-7 w-7 items-center justify-center rounded-md text-sm transition-colors
-        ${active ? 'bg-teal-500 text-white shadow-sm' : 'text-gray-600 hover:bg-gray-200 hover:text-gray-900'}
-        ${disabled ? 'cursor-not-allowed opacity-40' : 'cursor-pointer'}
-      `, children: children }));
-}
-function ToolbarSep() {
-    return _jsx("div", { className: "mx-0.5 h-5 w-px shrink-0 bg-gray-300" });
-}
-function ArticleEditor({ value, onChange, isReadOnly = false }) {
-    const [mounted, setMounted] = useState(false);
-    const editor = useEditor({
-        immediatelyRender: false,
-        editable: !isReadOnly,
-        extensions: [
-            StarterKit,
-            TextAlign.configure({ types: ['heading', 'paragraph'] }),
-        ],
-        content: value || '',
-        onUpdate: ({ editor }) => {
-            onChange(editor.getHTML());
-        },
-        editorProps: {
-            attributes: {
-                class: [
-                    'focus:outline-none min-h-[120px] max-h-[400px] overflow-y-auto p-3 text-sm text-gray-800 leading-relaxed',
-                    'prose prose-sm max-w-none',
-                    '[&_h1]:text-xl [&_h1]:font-bold [&_h1]:mb-2',
-                    '[&_h2]:text-lg [&_h2]:font-bold [&_h2]:mb-1.5',
-                    '[&_ul]:list-disc [&_ul]:ml-5 [&_ol]:list-decimal [&_ol]:ml-5',
-                    '[&_li]:mb-0.5',
-                    '[&_strong]:font-bold [&_em]:italic [&_s]:line-through',
-                    '[&_hr]:border-gray-300 [&_hr]:my-3',
-                    isReadOnly ? 'bg-gray-50 cursor-not-allowed' : 'bg-white',
-                ].join(' '),
-            },
-        },
-    });
-    useEffect(() => { setMounted(true); }, []);
-    useEffect(() => {
-        if (editor && value !== undefined && value !== editor.getHTML()) {
-            setTimeout(() => editor.commands.setContent(value, { emitUpdate: false }), 0);
-        }
-    }, [value, editor]);
-    useEffect(() => {
-        editor?.setEditable(!isReadOnly);
-    }, [isReadOnly, editor]);
-    if (!mounted)
-        return null;
-    return (_jsxs("div", { className: `overflow-hidden rounded-sm border-2 transition-all ${isReadOnly
-            ? 'border-gray-200 bg-gray-50'
-            : 'border-gray-200 bg-white focus-within:border-teal-400 focus-within:shadow-sm focus-within:shadow-teal-100'}`, children: [!isReadOnly && (_jsxs("div", { className: "flex flex-wrap items-center gap-1 border-b border-gray-200 bg-gray-50/80 px-2 py-1.5", children: [_jsx(ToolbarBtn, { title: "Ho\u00E0n t\u00E1c", onClick: () => editor?.chain().focus().undo().run(), disabled: !editor?.can().undo(), children: _jsx(Undo2, { className: "h-3.5 w-3.5" }) }), _jsx(ToolbarBtn, { title: "L\u00E0m l\u1EA1i", onClick: () => editor?.chain().focus().redo().run(), disabled: !editor?.can().redo(), children: _jsx(Redo2, { className: "h-3.5 w-3.5" }) }), _jsx(ToolbarSep, {}), _jsx(ToolbarBtn, { title: "Heading 1", active: editor?.isActive('heading', { level: 1 }), onClick: () => editor?.chain().focus().toggleHeading({ level: 1 }).run(), children: _jsx(Heading1, { className: "h-3.5 w-3.5" }) }), _jsx(ToolbarBtn, { title: "Heading 2", active: editor?.isActive('heading', { level: 2 }), onClick: () => editor?.chain().focus().toggleHeading({ level: 2 }).run(), children: _jsx(Heading2, { className: "h-3.5 w-3.5" }) }), _jsx(ToolbarSep, {}), _jsx(ToolbarBtn, { title: "In \u0111\u1EADm", active: editor?.isActive('bold'), onClick: () => editor?.chain().focus().toggleBold().run(), children: _jsx(Bold, { className: "h-3.5 w-3.5" }) }), _jsx(ToolbarBtn, { title: "In nghi\u00EAng", active: editor?.isActive('italic'), onClick: () => editor?.chain().focus().toggleItalic().run(), children: _jsx(Italic, { className: "h-3.5 w-3.5" }) }), _jsx(ToolbarBtn, { title: "G\u1EA1ch ngang", active: editor?.isActive('strike'), onClick: () => editor?.chain().focus().toggleStrike().run(), children: _jsx(Strikethrough, { className: "h-3.5 w-3.5" }) }), _jsx(ToolbarSep, {}), _jsx(ToolbarBtn, { title: "Danh s\u00E1ch ch\u1EA5m", active: editor?.isActive('bulletList'), onClick: () => editor?.chain().focus().toggleBulletList().run(), children: _jsx(List, { className: "h-3.5 w-3.5" }) }), _jsx(ToolbarBtn, { title: "Danh s\u00E1ch s\u1ED1", active: editor?.isActive('orderedList'), onClick: () => editor?.chain().focus().toggleOrderedList().run(), children: _jsx(ListOrdered, { className: "h-3.5 w-3.5" }) }), _jsx(ToolbarSep, {}), _jsx(ToolbarBtn, { title: "C\u0103n tr\u00E1i", active: editor?.isActive({ textAlign: 'left' }), onClick: () => editor?.chain().focus().setTextAlign('left').run(), children: _jsx(AlignLeft, { className: "h-3.5 w-3.5" }) }), _jsx(ToolbarBtn, { title: "C\u0103n gi\u1EEFa", active: editor?.isActive({ textAlign: 'center' }), onClick: () => editor?.chain().focus().setTextAlign('center').run(), children: _jsx(AlignCenter, { className: "h-3.5 w-3.5" }) }), _jsx(ToolbarBtn, { title: "C\u0103n ph\u1EA3i", active: editor?.isActive({ textAlign: 'right' }), onClick: () => editor?.chain().focus().setTextAlign('right').run(), children: _jsx(AlignRight, { className: "h-3.5 w-3.5" }) })] })), _jsx(EditorContent, { editor: editor })] }));
-}
-// ---------------------------------------------------------------------------
-// Sub-component: single article image preview with presigned URL
-// ---------------------------------------------------------------------------
-function ArticleImagePreview({ src, alt }) {
-    const { previewUrl } = usePresignedFileUrl(src);
-    const displayUrl = previewUrl || '';
-    if (!displayUrl)
-        return null;
-    return (_jsx(ImagePreview, { src: displayUrl, alt: alt, className: "mt-2 h-40 w-full max-w-xs rounded-lg border border-gray-200" }));
-}
-// ---------------------------------------------------------------------------
-// Component
-// ---------------------------------------------------------------------------
-/**
- * `ArticlesGroupCard`
- *
- * Renders N article cards within a single group. Each article has:
- *   - name (e.g. "Ariel", "Clive", "Vicky")
- *   - content (textarea for the reading passage)
- *   - imageUrl (file upload for the person's photo)
- *
- * Used for question types that require multiple reading passages per group,
- * such as KEY_FOR_SCHOOLS Reading Part 2.
- */
-export function ArticlesGroupCard({ groupNumber, articleCount, articles, onArticlesChange, title = '', onTitleChange, isReadOnly = false, uploadIdPrefix = 'articles-group', }) {
-    // Use the articles array directly. If empty, fallback to articleCount
-    const displayArticles = articles.length > 0
-        ? articles
-        : Array.from({ length: articleCount }, () => ({ name: '', content: '', imageUrl: '' }));
-    const handleFieldChange = (index, field, value) => {
-        if (isReadOnly)
-            return;
-        const updated = displayArticles.map((article, i) => i === index ? { ...article, [field]: value } : article);
-        onArticlesChange(updated);
-    };
-    const handleAddArticle = () => {
-        if (isReadOnly)
-            return;
-        onArticlesChange([...displayArticles, { name: '', content: '', imageUrl: '' }]);
-    };
-    const handleDeleteArticle = (index) => {
-        if (isReadOnly)
-            return;
-        const updated = displayArticles.filter((_, i) => i !== index);
-        onArticlesChange(updated);
-    };
-    return (_jsxs(Card, { className: "overflow-hidden border-0 bg-white shadow-lg shadow-teal-100/50", children: [_jsx("div", { className: "h-1.5 bg-gradient-to-r from-teal-500 via-emerald-500 to-green-500" }), _jsx(CardHeader, { className: "pb-4", children: _jsxs("div", { className: "flex items-center gap-3", children: [_jsx("div", { className: "flex h-10 w-10 shrink-0 items-center justify-center rounded-xl bg-gradient-to-br from-teal-500 to-emerald-600 shadow-md", children: _jsx(Layers, { className: "h-5 w-5 text-white" }) }), _jsxs("div", { className: "flex-1", children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx(CardTitle, { className: "text-lg font-bold text-gray-900", children: "B\u00E0i vi\u1EBFt nh\u00F3m" }), _jsxs("span", { className: "inline-flex items-center rounded-full border border-teal-300 bg-teal-100 px-2.5 py-0.5 text-xs font-semibold text-teal-700", children: ["Nh\u00F3m ", groupNumber] }), _jsxs("span", { className: "inline-flex items-center rounded-full border border-emerald-200 bg-emerald-50 px-2.5 py-0.5 text-xs font-medium text-emerald-600", children: [articles.length || articleCount, " b\u00E0i vi\u1EBFt"] })] }), _jsxs("p", { className: "text-sm text-gray-500", children: ["Nh\u1EADp n\u1ED9i dung t\u1EEBng b\u00E0i vi\u1EBFt \u2014 d\u00F9ng chung cho t\u1EA5t c\u1EA3 c\u00E2u h\u1ECFi trong Nh\u00F3m ", groupNumber, ". B\u1EA1n c\u00F3 th\u1EC3 th\u00EAm ho\u1EB7c x\u00F3a b\u00E0i vi\u1EBFt."] })] })] }) }), _jsxs(CardContent, { className: "space-y-5", children: [_jsxs("div", { className: "space-y-2 pb-2", children: [_jsxs(Label, { htmlFor: `${uploadIdPrefix}-title`, className: "flex items-center gap-2 text-sm font-semibold text-gray-800", children: [_jsx(Type, { className: "h-4 w-4 text-teal-500" }), "Ti\u00EAu \u0111\u1EC1 nh\u00F3m b\u00E0i vi\u1EBFt", ' ', _jsx("span", { className: "text-xs font-normal text-gray-500", children: "(T\u00F9y ch\u1ECDn)" })] }), _jsx(Input, { id: `${uploadIdPrefix}-title`, value: title, onChange: (e) => onTitleChange?.(e.target.value), placeholder: "Nh\u1EADp ti\u00EAu \u0111\u1EC1 chung cho nh\u00F3m b\u00E0i vi\u1EBFt\u2026", readOnly: isReadOnly, className: `border-gray-200 bg-white transition-all focus:border-teal-300 focus:ring-teal-200 ${isReadOnly ? 'bg-gray-50 text-gray-500 cursor-not-allowed border-transparent focus:border-transparent focus:ring-0' : ''}` })] }), displayArticles.map((article, index) => {
-                        const letter = String.fromCharCode(65 + index); // A, B, C...
-                        return (_jsxs("div", { className: "rounded-xl border-2 border-gray-200 bg-gradient-to-r from-gray-50 to-slate-50 p-4 transition-all hover:border-teal-200 hover:shadow-sm", children: [_jsxs("div", { className: "mb-3 flex items-center justify-between", children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx("div", { className: "flex h-8 w-8 items-center justify-center rounded-lg bg-gradient-to-br from-teal-500 to-emerald-600 text-sm font-bold text-white shadow-sm", children: letter }), _jsxs("span", { className: "text-sm font-semibold text-gray-700", children: ["B\u00E0i vi\u1EBFt ", index + 1] })] }), displayArticles.length > 1 && !isReadOnly && (_jsx(Button, { type: "button", variant: "ghost", size: "sm", onClick: () => handleDeleteArticle(index), className: "h-8 w-8 p-0 text-red-500 hover:bg-red-50 hover:text-red-600", title: "X\u00F3a b\u00E0i vi\u1EBFt", children: _jsx(Trash2, { className: "h-4 w-4" }) }))] }), _jsxs("div", { className: "space-y-3", children: [_jsxs("div", { className: "space-y-1.5", children: [_jsxs(Label, { htmlFor: `${uploadIdPrefix}-name-${index}`, className: "flex items-center gap-1.5 text-sm font-medium text-gray-700", children: [_jsx(Type, { className: "h-3.5 w-3.5 text-teal-500" }), "T\u00EAn ng\u01B0\u1EDDi / ti\u00EAu \u0111\u1EC1"] }), _jsx(Input, { id: `${uploadIdPrefix}-name-${index}`, value: article.name, onChange: (e) => handleFieldChange(index, 'name', e.target.value), placeholder: `VD: Ariel, Clive, Vicky...`, readOnly: isReadOnly, className: `border-gray-200 bg-white transition-all focus:border-teal-300 focus:ring-teal-200 ${isReadOnly ? 'bg-gray-50 text-gray-500 cursor-not-allowed border-transparent focus:border-transparent focus:ring-0' : ''}` })] }), _jsxs("div", { className: "space-y-1.5", children: [_jsxs(Label, { className: "flex items-center gap-1.5 text-sm font-medium text-gray-700", children: [_jsx(FileText, { className: "h-3.5 w-3.5 text-teal-500" }), "N\u1ED9i dung b\u00E0i vi\u1EBFt"] }), _jsx(ArticleEditor, { value: article.content, onChange: (html) => handleFieldChange(index, 'content', html), isReadOnly: isReadOnly })] }), _jsxs("div", { className: "space-y-1.5", children: [_jsxs(Label, { className: "flex items-center gap-1.5 text-sm font-medium text-gray-700", children: [_jsx(ImageIcon, { className: "h-3.5 w-3.5 text-teal-500" }), "H\u00ECnh \u1EA3nh", ' ', _jsx("span", { className: "text-xs font-normal text-gray-400", children: "(T\u00F9y ch\u1ECDn)" })] }), !isReadOnly && (_jsx(FileUpload, { id: `${uploadIdPrefix}-image-${index}`, label: "", accept: "image/*", value: article.imageUrl, onChange: (url) => handleFieldChange(index, 'imageUrl', url), maxSize: 5, placeholder: "Upload \u1EA3nh ho\u1EB7c paste URL", autoUpload: true, prefix: "questions" })), article.imageUrl && (_jsx(ArticleImagePreview, { src: article.imageUrl, alt: `Article ${letter} image` }))] })] })] }, index));
-                    }), !isReadOnly && (_jsxs(Button, { type: "button", variant: "outline", className: "w-full border-dashed border-teal-300 bg-teal-50/50 text-teal-700 hover:bg-teal-50 hover:text-teal-800 hover:border-teal-400", onClick: handleAddArticle, children: [_jsx(PlusCircle, { className: "mr-2 h-4 w-4" }), "Th\u00EAm b\u00E0i vi\u1EBFt"] }))] })] }));
-}
-//# sourceMappingURL=ArticlesGroupCard.js.map
+"use client";import{jsx as e,jsxs as t}from"react/jsx-runtime";import{useEffect as a,useState as i}from"react";import{useEditor as r,EditorContent as l}from"@tiptap/react";import n from"@tiptap/starter-kit";import s from"@tiptap/extension-text-align";import{ImagePreview as o}from"../../../components/ui/image-preview";import{Input as c}from"../../../components/ui/input";import{Label as d}from"../../../components/ui/label";import{Card as m,CardContent as h,CardHeader as g,CardTitle as u}from"../../../components/ui/card";import{FileUpload as p}from"../../../components/ui/file-upload";import{ImageIcon as f,Layers as x,Type as b,FileText as v,PlusCircle as N,Trash2 as y,Bold as w,Italic as C,Strikethrough as k,Heading1 as A,Heading2 as _,List as T,ListOrdered as U,AlignLeft as $,AlignCenter as j,AlignRight as H,Undo2 as L,Redo2 as O}from"lucide-react";import{Button as B}from"../../../components/ui/button";import{usePresignedFileUrl as R}from"../../../shared/lib/hooks";function I({onClick:t,active:a,disabled:i,title:r,children:l}){return e("button",{type:"button",title:r,onClick:t,disabled:i,className:`flex h-7 w-7 items-center justify-center rounded-md text-sm transition-colors\n        ${a?"bg-teal-500 text-white shadow-sm":"text-gray-600 hover:bg-gray-200 hover:text-gray-900"}\n        ${i?"cursor-not-allowed opacity-40":"cursor-pointer"}\n      `,children:l})}function D(){return e("div",{className:"mx-0.5 h-5 w-px shrink-0 bg-gray-300"})}function S({value:o,onChange:c,isReadOnly:d=!1}){const[m,h]=i(!1),g=r({immediatelyRender:!1,editable:!d,extensions:[n,s.configure({types:["heading","paragraph"]})],content:o||"",onUpdate:({editor:e})=>{c(e.getHTML())},editorProps:{attributes:{class:["focus:outline-none min-h-[120px] max-h-[400px] overflow-y-auto p-3 text-sm text-gray-800 leading-relaxed","prose prose-sm max-w-none","[&_h1]:text-xl [&_h1]:font-bold [&_h1]:mb-2","[&_h2]:text-lg [&_h2]:font-bold [&_h2]:mb-1.5","[&_ul]:list-disc [&_ul]:ml-5 [&_ol]:list-decimal [&_ol]:ml-5","[&_li]:mb-0.5","[&_strong]:font-bold [&_em]:italic [&_s]:line-through","[&_hr]:border-gray-300 [&_hr]:my-3",d?"bg-gray-50 cursor-not-allowed":"bg-white"].join(" ")}}});return a(()=>{h(!0)},[]),a(()=>{g&&void 0!==o&&o!==g.getHTML()&&setTimeout(()=>g.commands.setContent(o,{emitUpdate:!1}),0)},[o,g]),a(()=>{g?.setEditable(!d)},[d,g]),m?t("div",{className:"overflow-hidden rounded-sm border-2 transition-all "+(d?"border-gray-200 bg-gray-50":"border-gray-200 bg-white focus-within:border-teal-400 focus-within:shadow-sm focus-within:shadow-teal-100"),children:[!d&&t("div",{className:"flex flex-wrap items-center gap-1 border-b border-gray-200 bg-gray-50/80 px-2 py-1.5",children:[e(I,{title:"Hoàn tác",onClick:()=>g?.chain().focus().undo().run(),disabled:!g?.can().undo(),children:e(L,{className:"h-3.5 w-3.5"})}),e(I,{title:"Làm lại",onClick:()=>g?.chain().focus().redo().run(),disabled:!g?.can().redo(),children:e(O,{className:"h-3.5 w-3.5"})}),e(D,{}),e(I,{title:"Heading 1",active:g?.isActive("heading",{level:1}),onClick:()=>g?.chain().focus().toggleHeading({level:1}).run(),children:e(A,{className:"h-3.5 w-3.5"})}),e(I,{title:"Heading 2",active:g?.isActive("heading",{level:2}),onClick:()=>g?.chain().focus().toggleHeading({level:2}).run(),children:e(_,{className:"h-3.5 w-3.5"})}),e(D,{}),e(I,{title:"In đậm",active:g?.isActive("bold"),onClick:()=>g?.chain().focus().toggleBold().run(),children:e(w,{className:"h-3.5 w-3.5"})}),e(I,{title:"In nghiêng",active:g?.isActive("italic"),onClick:()=>g?.chain().focus().toggleItalic().run(),children:e(C,{className:"h-3.5 w-3.5"})}),e(I,{title:"Gạch ngang",active:g?.isActive("strike"),onClick:()=>g?.chain().focus().toggleStrike().run(),children:e(k,{className:"h-3.5 w-3.5"})}),e(D,{}),e(I,{title:"Danh sách chấm",active:g?.isActive("bulletList"),onClick:()=>g?.chain().focus().toggleBulletList().run(),children:e(T,{className:"h-3.5 w-3.5"})}),e(I,{title:"Danh sách số",active:g?.isActive("orderedList"),onClick:()=>g?.chain().focus().toggleOrderedList().run(),children:e(U,{className:"h-3.5 w-3.5"})}),e(D,{}),e(I,{title:"Căn trái",active:g?.isActive({textAlign:"left"}),onClick:()=>g?.chain().focus().setTextAlign("left").run(),children:e($,{className:"h-3.5 w-3.5"})}),e(I,{title:"Căn giữa",active:g?.isActive({textAlign:"center"}),onClick:()=>g?.chain().focus().setTextAlign("center").run(),children:e(j,{className:"h-3.5 w-3.5"})}),e(I,{title:"Căn phải",active:g?.isActive({textAlign:"right"}),onClick:()=>g?.chain().focus().setTextAlign("right").run(),children:e(H,{className:"h-3.5 w-3.5"})})]}),e(l,{editor:g})]}):null}function z({src:t,alt:a}){const{previewUrl:i}=R(t),r=i||"";return r?e(o,{src:r,alt:a,className:"mt-2 h-40 w-full max-w-xs rounded-lg border border-gray-200"}):null}export function ArticlesGroupCard({groupNumber:a,articleCount:i,articles:r,onArticlesChange:l,title:n="",onTitleChange:s,isReadOnly:o=!1,uploadIdPrefix:w="articles-group"}){const C=r.length>0?r:Array.from({length:i},()=>({name:"",content:"",imageUrl:""})),k=(e,t,a)=>{if(o)return;const i=C.map((i,r)=>r===e?{...i,[t]:a}:i);l(i)};return t(m,{className:"overflow-hidden border-0 bg-white shadow-lg shadow-teal-100/50",children:[e("div",{className:"h-1.5 bg-gradient-to-r from-teal-500 via-emerald-500 to-green-500"}),e(g,{className:"pb-4",children:t("div",{className:"flex items-center gap-3",children:[e("div",{className:"flex h-10 w-10 shrink-0 items-center justify-center rounded-xl bg-gradient-to-br from-teal-500 to-emerald-600 shadow-md",children:e(x,{className:"h-5 w-5 text-white"})}),t("div",{className:"flex-1",children:[t("div",{className:"flex items-center gap-2",children:[e(u,{className:"text-lg font-bold text-gray-900",children:"Bài viết nhóm"}),t("span",{className:"inline-flex items-center rounded-full border border-teal-300 bg-teal-100 px-2.5 py-0.5 text-xs font-semibold text-teal-700",children:["Nhóm ",a]}),t("span",{className:"inline-flex items-center rounded-full border border-emerald-200 bg-emerald-50 px-2.5 py-0.5 text-xs font-medium text-emerald-600",children:[r.length||i," bài viết"]})]}),t("p",{className:"text-sm text-gray-500",children:["Nhập nội dung từng bài viết — dùng chung cho tất cả câu hỏi trong Nhóm ",a,". Bạn có thể thêm hoặc xóa bài viết."]})]})]})}),t(h,{className:"space-y-5",children:[t("div",{className:"space-y-2 pb-2",children:[t(d,{htmlFor:`${w}-title`,className:"flex items-center gap-2 text-sm font-semibold text-gray-800",children:[e(b,{className:"h-4 w-4 text-teal-500"}),"Tiêu đề nhóm bài viết"," ",e("span",{className:"text-xs font-normal text-gray-500",children:"(Tùy chọn)"})]}),e(c,{id:`${w}-title`,value:n,onChange:e=>s?.(e.target.value),placeholder:"Nhập tiêu đề chung cho nhóm bài viết…",readOnly:o,className:"border-gray-200 bg-white transition-all focus:border-teal-300 focus:ring-teal-200 "+(o?"bg-gray-50 text-gray-500 cursor-not-allowed border-transparent focus:border-transparent focus:ring-0":"")})]}),C.map((a,i)=>{const r=String.fromCharCode(65+i);return t("div",{className:"rounded-xl border-2 border-gray-200 bg-gradient-to-r from-gray-50 to-slate-50 p-4 transition-all hover:border-teal-200 hover:shadow-sm",children:[t("div",{className:"mb-3 flex items-center justify-between",children:[t("div",{className:"flex items-center gap-2",children:[e("div",{className:"flex h-8 w-8 items-center justify-center rounded-lg bg-gradient-to-br from-teal-500 to-emerald-600 text-sm font-bold text-white shadow-sm",children:r}),t("span",{className:"text-sm font-semibold text-gray-700",children:["Bài viết ",i+1]})]}),C.length>1&&!o&&e(B,{type:"button",variant:"ghost",size:"sm",onClick:()=>(e=>{if(o)return;const t=C.filter((t,a)=>a!==e);l(t)})(i),className:"h-8 w-8 p-0 text-red-500 hover:bg-red-50 hover:text-red-600",title:"Xóa bài viết",children:e(y,{className:"h-4 w-4"})})]}),t("div",{className:"space-y-3",children:[t("div",{className:"space-y-1.5",children:[t(d,{htmlFor:`${w}-name-${i}`,className:"flex items-center gap-1.5 text-sm font-medium text-gray-700",children:[e(b,{className:"h-3.5 w-3.5 text-teal-500"}),"Tên người / tiêu đề"]}),e(c,{id:`${w}-name-${i}`,value:a.name,onChange:e=>k(i,"name",e.target.value),placeholder:"VD: Ariel, Clive, Vicky...",readOnly:o,className:"border-gray-200 bg-white transition-all focus:border-teal-300 focus:ring-teal-200 "+(o?"bg-gray-50 text-gray-500 cursor-not-allowed border-transparent focus:border-transparent focus:ring-0":"")})]}),t("div",{className:"space-y-1.5",children:[t(d,{className:"flex items-center gap-1.5 text-sm font-medium text-gray-700",children:[e(v,{className:"h-3.5 w-3.5 text-teal-500"}),"Nội dung bài viết"]}),e(S,{value:a.content,onChange:e=>k(i,"content",e),isReadOnly:o})]}),t("div",{className:"space-y-1.5",children:[t(d,{className:"flex items-center gap-1.5 text-sm font-medium text-gray-700",children:[e(f,{className:"h-3.5 w-3.5 text-teal-500"}),"Hình ảnh"," ",e("span",{className:"text-xs font-normal text-gray-400",children:"(Tùy chọn)"})]}),!o&&e(p,{id:`${w}-image-${i}`,label:"",accept:"image/*",value:a.imageUrl,onChange:e=>k(i,"imageUrl",e),maxSize:5,placeholder:"Upload ảnh hoặc paste URL",autoUpload:!0,prefix:"questions"}),a.imageUrl&&e(z,{src:a.imageUrl,alt:`Article ${r} image`})]})]})]},i)}),!o&&t(B,{type:"button",variant:"outline",className:"w-full border-dashed border-teal-300 bg-teal-50/50 text-teal-700 hover:bg-teal-50 hover:text-teal-800 hover:border-teal-400",onClick:()=>{o||l([...C,{name:"",content:"",imageUrl:""}])},children:[e(N,{className:"mr-2 h-4 w-4"}),"Thêm bài viết"]})]})]})}

package/dist/components/questions/groups/BasicQuestionGroupCard.d.ts

@@ -48,4 +48,3 @@ export interface BasicQuestionGroupCardProps {
  * (managed by `useBasicQuestionGroup`).
  */
 export declare function BasicQuestionGroupCard({ groupNumber, title, subtitle, content, imageUrl, onTitleChange, onSubtitleChange, onContentChange, onImageChange, onImagePresignedUrlChange, showContent, groupConfig, uploadIdPrefix, isReadOnly, }: BasicQuestionGroupCardProps): import("react").JSX.Element;
-//# sourceMappingURL=BasicQuestionGroupCard.d.ts.map