@tinyweb_dev/oe-exam-sdk 0.1.0 → 0.1.2

package/dist/components/questions/components/QuestionSearchDropdown.js

@@ -1,259 +1 @@
-'use client';
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useEffect, useMemo, useState } from 'react';
-import { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuTrigger, } from '../../../components/ui/dropdown-menu';
-import { Input } from '../../../components/ui/input';
-import { Badge } from '../../../components/ui/badge';
-import { Loader2, Search, Image as ImageIcon, FileText, Grid3X3, BookOpen, Library, Sparkles, Hash, BarChart3, Lightbulb, CheckCircle2, } from 'lucide-react';
-import { useQuery } from '@tanstack/react-query';
-import { ScrollArea } from '../../../components/ui/scroll-area';
-import { cn } from '../../../shared/lib/utils';
-const truncate = (text, maxLength) => {
-    if (!text)
-        return '';
-    // Convert to string if it's not already
-    const textStr = typeof text === 'string' ? text : String(text);
-    if (textStr.length <= maxLength)
-        return textStr;
-    return `${textStr.substring(0, maxLength)}...`;
-};
-// Image-based question types
-const IMAGE_BASED_TYPES = [
-    'LOOK_PICTURE_FILL_BLANK_CHOOSE_ANSWER',
-    'LOOK_PICTURE_CHOOSE_CORRECT_ANSWER',
-    'LOOK_PICTURE_FILL_WORD_HINT',
-    'FILL_IN_BLANK',
-    'LABEL_THE_PICTURE',
-    'READ_AND_COLOR_OBJECTS',
-    'IMAGE_OBJECT_MATCHING',
-    'FILL_IN_BLANK',
-];
-// Passage-based question types
-const PASSAGE_BASED_TYPES = [
-    'READ_PASSAGE_AND_ANSWER_QUESTIONS',
-    'READ_PASSAGE_AND_COMPLETE_STORY',
-];
-// Grid-based question types
-const GRID_BASED_TYPES = ['FILL_MISSING_WORDS_IN_GRID'];
-// Get display icon for question type
-const getQuestionTypeIcon = (type) => {
-    if (IMAGE_BASED_TYPES.includes(type)) {
-        return _jsx(ImageIcon, { className: "h-4 w-4 text-blue-500" });
-    }
-    if (PASSAGE_BASED_TYPES.includes(type)) {
-        return _jsx(BookOpen, { className: "h-4 w-4 text-green-500" });
-    }
-    if (GRID_BASED_TYPES.includes(type)) {
-        return _jsx(Grid3X3, { className: "h-4 w-4 text-purple-500" });
-    }
-    return _jsx(FileText, { className: "h-4 w-4 text-gray-500" });
-};
-// Get question type display name in Vietnamese
-const getQuestionTypeName = (type) => {
-    const typeMap = {
-        'LOOK_PICTURE_FILL_BLANK_CHOOSE_ANSWER': 'Nhìn tranh điền chỗ trống',
-        'LOOK_PICTURE_CHOOSE_CORRECT_ANSWER': 'Nhìn tranh chọn đáp án',
-        'LOOK_PICTURE_FILL_WORD_HINT': 'Nhìn tranh điền từ gợi ý',
-        'FILL_MISSING_WORDS_IN_GRID': 'Điền chữ trong bảng',
-        'CHOOSE_THE_CORRECT_ANSWER': 'Chọn đáp án đúng',
-        'LABEL_THE_PICTURE': 'Gắn nhãn hình ảnh',
-        'READ_AND_COLOR_OBJECTS': 'Đọc và tô màu',
-        'IMAGE_OBJECT_MATCHING': 'Ghép hình ảnh - Đối tượng',
-        'WRITE_CORRECT_VERB_FORM': 'Viết dạng động từ',
-        'FILL_IN_BLANK': 'Điền vào chỗ trống',
-        'READ_PASSAGE_AND_ANSWER_QUESTIONS': 'Đọc hiểu',
-    };
-    return type ? typeMap[type] || type.replace(/_/g, ' ').toLowerCase() : 'Chưa xác định';
-};
-// Enhanced function to extract display text from different question content structures
-export const getQuestionDisplayText = (question) => {
-    return getContentDisplayText(question.content, question.type);
-};
-// Extract display text from content object (for cases where we have content but not full Question)
-export const getContentDisplayText = (content, type) => {
-    if (!content)
-        return type || 'Câu hỏi';
-    // Handle string content directly
-    if (typeof content === 'string') {
-        return content;
-    }
-    // Handle object content based on question type
-    if (typeof content === 'object') {
-        // LOOK_PICTURE_FILL_BLANK_CHOOSE_ANSWER, LOOK_PICTURE_CHOOSE_CORRECT_ANSWER
-        if (content.subQuestions && Array.isArray(content.subQuestions)) {
-            const firstSubQ = content.subQuestions[0];
-            if (firstSubQ?.question) {
-                return firstSubQ.question;
-            }
-        }
-        // For content with direct question field (single question format)
-        if (content.question) {
-            return content.question;
-        }
-        // LOOK_PICTURE_FILL_WORD_HINT - show word pattern
-        if (content.word) {
-            return `Điền chữ: ${content.word}`;
-        }
-        // READ_PASSAGE_AND_ANSWER_QUESTIONS
-        if (content.passage) {
-            return content.passageTitle || truncate(content.passage, 60);
-        }
-        // FILL_MISSING_WORDS_IN_GRID
-        if (content.grid && content.rows && content.columns) {
-            return `Lưới ${content.rows}x${content.columns}`;
-        }
-        // LABEL_THE_PICTURE
-        if (content.wordBank) {
-            const words = content.wordBank.map((w) => w.text || w).slice(0, 3).join(', ');
-            return `Từ vựng: ${words}${content.wordBank.length > 3 ? '...' : ''}`;
-        }
-        // READ_AND_COLOR_OBJECTS / IMAGE_OBJECT_MATCHING
-        if (content.colorNodes || content.regionNodes) {
-            const regionCount = content.regionNodes?.length || 0;
-            return `${regionCount} vùng tô màu`;
-        }
-        // WRITE_A_SHORT_LETTER
-        if (content.contexts) {
-            const firstContext = content.contexts[0];
-            return firstContext?.text ? truncate(firstContext.text, 50) : 'Viết thư ngắn';
-        }
-        // CHOOSE_THE_CORRECT_ANSWER
-        if (content.options && Array.isArray(content.options)) {
-            return content.questionText || content.question || 'Câu hỏi trắc nghiệm';
-        }
-        // FILL_IN_BLANK
-        if (content.blanks) {
-            const firstBlank = content.blanks[0];
-            return firstBlank?.text || content.sentence || 'Điền vào chỗ trống';
-        }
-        // Fallback: try common field names
-        if (content.instruction)
-            return content.instruction;
-        if (content.mainTitle)
-            return content.mainTitle;
-        if (content.title)
-            return content.title;
-        if (content.text)
-            return content.text;
-    }
-    return type || 'Câu hỏi';
-};
-// Get difficulty badge color
-const getDifficultyBadgeClass = (difficulty) => {
-    switch (difficulty?.toUpperCase()) {
-        case 'EASY':
-            return 'bg-green-100 text-green-700 border-green-200';
-        case 'HARD':
-            return 'bg-red-100 text-red-700 border-red-200';
-        default:
-            return 'bg-yellow-100 text-yellow-700 border-yellow-200';
-    }
-};
-// Get difficulty display name
-const getDifficultyName = (difficulty) => {
-    switch (difficulty?.toUpperCase()) {
-        case 'EASY':
-            return 'Dễ';
-        case 'HARD':
-            return 'Khó';
-        case 'MEDIUM':
-            return 'TB';
-        default:
-            return 'TB';
-    }
-};
-// Get subquestion count if applicable
-const getSubQuestionCount = (question) => {
-    const content = question.content;
-    if (!content)
-        return null;
-    if (content.subQuestions && Array.isArray(content.subQuestions)) {
-        return content.subQuestions.length;
-    }
-    return null;
-};
-export function QuestionSearchDropdown({ questionType, onSelect, selectedQuestionLabel, placeholder = 'Tìm câu hỏi từ ngân hàng', disabled = false, buttonClassName, compact = false, searchQuestions, }) {
-    const [open, setOpen] = useState(false);
-    const [searchTerm, setSearchTerm] = useState('');
-    const [debouncedTerm, setDebouncedTerm] = useState('');
-    useEffect(() => {
-        const handler = setTimeout(() => {
-            setDebouncedTerm(searchTerm.trim());
-        }, 300);
-        return () => clearTimeout(handler);
-    }, [searchTerm]);
-    // Transform QuestionBankItem to Question format with extended info
-    const transformToQuestion = (item) => ({
-        id: item.id,
-        type: item.questionType,
-        content: item.content,
-        answer: item.correctAnswer,
-        points: parseFloat(String(item.points ?? 1)) || 1,
-        difficulty: item.difficulty?.toUpperCase(),
-        skill: (item.skill || undefined),
-        explanation: item.explanation || undefined,
-        level: 'A1', // Default value
-        createdAt: item.createdAt,
-        updatedAt: item.updatedAt,
-        // Extended info from question bank
-        code: item.code,
-        title: item.title || undefined,
-        usageCount: item.usageCount,
-    });
-    // Host app may provide dynamic search directly via component props.
-    const { data: questionBankData, isFetching } = useQuery({
-        queryKey: ['questionBanks', 'search', questionType, debouncedTerm],
-        queryFn: async () => {
-            if (!searchQuestions)
-                return { data: [], meta: { totalItems: 0 } };
-            return searchQuestions({
-                questionType,
-                keyword: debouncedTerm || undefined,
-                page: 1,
-                size: 10,
-            });
-        },
-        enabled: open && Boolean(questionType) && Boolean(searchQuestions) && (debouncedTerm.length > 0 || !!questionType),
-        staleTime: 60 * 1000,
-        refetchOnWindowFocus: false,
-    });
-    // Transform API response to Question array
-    const questions = useMemo(() => {
-        if (!questionBankData?.data)
-            return [];
-        return questionBankData.data.map(transformToQuestion);
-    }, [questionBankData]);
-    const totalItems = questionBankData?.meta?.totalItems || 0;
-    const hasNoResults = !isFetching && questions.length === 0 && debouncedTerm.length > 0;
-    // Show empty bank message when: API returned (questionBankData exists), no questions, and no search term
-    const hasEmptyBank = !isFetching && questionBankData && questions.length === 0 && debouncedTerm.length === 0;
-    // Only show initial tips when: not fetching, no API response yet (first open before any query)
-    const showInitialMessage = !isFetching && !questionBankData && questions.length === 0 && debouncedTerm.length === 0;
-    const buttonLabel = useMemo(() => {
-        if (selectedQuestionLabel) {
-            return truncate(selectedQuestionLabel, 40);
-        }
-        return placeholder;
-    }, [placeholder, selectedQuestionLabel]);
-    const handleSelect = (question) => {
-        onSelect(question);
-        setOpen(false);
-        setSearchTerm('');
-        setDebouncedTerm('');
-    };
-    return (_jsxs(DropdownMenu, { open: open, onOpenChange: (value) => setOpen(!disabled && value), children: [_jsx(DropdownMenuTrigger, { asChild: true, disabled: disabled, children: compact ? (_jsxs("button", { type: "button", className: cn('group inline-flex h-8 items-center gap-1.5 rounded-md border px-3 text-sm font-medium transition-all', selectedQuestionLabel
-                        ? 'border-emerald-200 bg-emerald-50 text-emerald-700 hover:bg-emerald-100'
-                        : 'border-indigo-200 text-indigo-600 hover:bg-indigo-50 hover:text-indigo-700', 'focus:outline-none focus:ring-2 focus:ring-indigo-200 focus:ring-offset-1', disabled && 'cursor-not-allowed opacity-50', buttonClassName), children: [selectedQuestionLabel ? (_jsx(CheckCircle2, { className: "h-4 w-4" })) : (_jsx(Library, { className: "h-4 w-4" })), selectedQuestionLabel ? 'Đã chọn' : 'Ngân hàng'] })) : (_jsxs("button", { type: "button", className: cn('group relative flex w-full items-center gap-3 rounded-xl border bg-white p-3 text-left shadow-sm transition-all', selectedQuestionLabel
-                        ? 'border-emerald-200 bg-gradient-to-r from-emerald-50/50 to-teal-50/50'
-                        : 'border-gray-200 hover:border-indigo-200 hover:bg-gradient-to-r hover:from-indigo-50/30 hover:to-purple-50/30', 'focus:outline-none focus:ring-2 focus:ring-indigo-200 focus:ring-offset-1', disabled && 'cursor-not-allowed opacity-50', buttonClassName), children: [_jsx("div", { className: cn('flex h-10 w-10 flex-shrink-0 items-center justify-center rounded-lg transition-all', selectedQuestionLabel
-                                ? 'bg-gradient-to-br from-emerald-500 to-teal-600 shadow-sm'
-                                : 'bg-gradient-to-br from-indigo-100 to-purple-100 group-hover:from-indigo-500 group-hover:to-purple-600 group-hover:shadow-sm'), children: selectedQuestionLabel ? (_jsx(CheckCircle2, { className: "h-5 w-5 text-white" })) : (_jsx(Library, { className: cn('h-5 w-5 transition-colors', 'text-indigo-500 group-hover:text-white') })) }), _jsxs("div", { className: "min-w-0 flex-1", children: [_jsx("div", { className: "flex items-center gap-2", children: _jsx("span", { className: cn('text-xs font-medium uppercase tracking-wide', selectedQuestionLabel ? 'text-emerald-600' : 'text-indigo-500'), children: selectedQuestionLabel ? '✓ Đã chọn từ ngân hàng' : 'Ngân hàng câu hỏi' }) }), _jsx("p", { className: cn('mt-0.5 truncate text-sm', selectedQuestionLabel ? 'font-medium text-gray-800' : 'text-gray-500'), children: selectedQuestionLabel
-                                        ? truncate(selectedQuestionLabel, 55)
-                                        : 'Nhấn để tìm và sử dụng câu hỏi có sẵn' })] }), _jsx("div", { className: cn('flex h-8 w-8 flex-shrink-0 items-center justify-center rounded-full transition-all', selectedQuestionLabel
-                                ? 'bg-emerald-100 text-emerald-600'
-                                : 'bg-gray-100 text-gray-400 group-hover:bg-indigo-100 group-hover:text-indigo-600'), children: _jsx(Search, { className: "h-4 w-4" }) })] })) }), _jsxs(DropdownMenuContent, { className: "w-[520px] p-0", align: compact ? "end" : "start", children: [_jsx("div", { className: "border-b border-gray-100 bg-gradient-to-r from-indigo-50 to-purple-50 px-4 py-3", children: _jsxs("div", { className: "flex items-center gap-3", children: [_jsx("div", { className: "flex h-9 w-9 items-center justify-center rounded-lg bg-gradient-to-br from-indigo-500 to-purple-600 shadow-sm", children: _jsx(Library, { className: "h-4 w-4 text-white" }) }), _jsxs("div", { className: "flex-1", children: [_jsx("h3", { className: "text-sm font-semibold text-gray-800", children: "Ng\u00E2n h\u00E0ng c\u00E2u h\u1ECFi" }), _jsx("p", { className: "text-xs text-gray-500", children: "Ch\u1ECDn c\u00E2u h\u1ECFi c\u00F3 s\u1EB5n \u0111\u1EC3 \u0111i\u1EC1n nhanh v\u00E0o form" })] })] }) }), _jsxs("div", { className: "border-b border-gray-100 bg-gray-50/50 p-3", children: [_jsxs("div", { className: "relative", children: [_jsx(Search, { className: "absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-gray-400" }), _jsx(Input, { placeholder: "T\u00ECm theo m\u00E3, ti\u00EAu \u0111\u1EC1 ho\u1EB7c n\u1ED9i dung...", value: searchTerm, onChange: (event) => setSearchTerm(event.target.value), autoFocus: true, className: "border-gray-200 bg-white pl-10 pr-10 transition-all focus:border-indigo-300 focus:ring-indigo-200" }), isFetching && (_jsx(Loader2, { className: "absolute right-3 top-1/2 h-4 w-4 -translate-y-1/2 animate-spin text-indigo-500" }))] }), _jsxs("div", { className: "mt-2 flex items-center justify-between", children: [_jsx("div", { className: "flex items-center gap-2", children: _jsx(Badge, { variant: "outline", className: "border-indigo-200 bg-indigo-50 text-indigo-700", children: getQuestionTypeName(questionType) }) }), totalItems > 0 && (_jsxs("span", { className: "text-xs text-gray-500", children: ["Hi\u1EC3n th\u1ECB ", questions.length, "/", totalItems, " k\u1EBFt qu\u1EA3"] }))] })] }), _jsx(ScrollArea, { className: "h-80", children: showInitialMessage ? (_jsxs("div", { className: "flex flex-col items-center justify-center p-8 text-center", children: [_jsx("div", { className: "mb-4 flex h-16 w-16 items-center justify-center rounded-full bg-gradient-to-br from-indigo-100 to-purple-100", children: _jsx(Sparkles, { className: "h-8 w-8 text-indigo-500" }) }), _jsx("p", { className: "text-sm font-medium text-gray-700", children: "T\u00ECm c\u00E2u h\u1ECFi t\u1EEB ng\u00E2n h\u00E0ng" }), _jsx("p", { className: "mt-1 text-xs text-gray-500", children: "Nh\u1EADp m\u00E3 c\u00E2u h\u1ECFi, ti\u00EAu \u0111\u1EC1 ho\u1EB7c t\u1EEB kh\u00F3a \u0111\u1EC3 t\u00ECm ki\u1EBFm" }), _jsx("div", { className: "mt-4 rounded-lg border border-blue-200 bg-blue-50 p-3", children: _jsxs("div", { className: "flex items-start gap-2", children: [_jsx(Lightbulb, { className: "mt-0.5 h-4 w-4 flex-shrink-0 text-blue-500" }), _jsxs("div", { className: "text-left text-xs text-blue-700", children: [_jsx("p", { className: "font-medium", children: "M\u1EB9o t\u00ECm ki\u1EBFm nhanh:" }), _jsxs("ul", { className: "mt-1 list-inside list-disc space-y-0.5 text-blue-600", children: [_jsx("li", { children: "Nh\u1EADp m\u00E3 c\u00E2u h\u1ECFi (VD: M001)" }), _jsx("li", { children: "Nh\u1EADp ti\u00EAu \u0111\u1EC1 ho\u1EB7c m\u1ED9t ph\u1EA7n n\u1ED9i dung" }), _jsx("li", { children: "K\u1EBFt qu\u1EA3 s\u1EBD t\u1EF1 \u0111\u1ED9ng c\u1EADp nh\u1EADt" })] })] })] }) })] })) : hasEmptyBank ? (_jsxs("div", { className: "flex flex-col items-center justify-center p-8 text-center", children: [_jsx("div", { className: "mb-4 flex h-16 w-16 items-center justify-center rounded-full bg-amber-100", children: _jsx(Library, { className: "h-8 w-8 text-amber-500" }) }), _jsx("p", { className: "text-sm font-medium text-gray-700", children: "Ch\u01B0a c\u00F3 c\u00E2u h\u1ECFi trong ng\u00E2n h\u00E0ng" }), _jsxs("p", { className: "mt-1 text-xs text-gray-500", children: ["Ng\u00E2n h\u00E0ng c\u00E2u h\u1ECFi ch\u01B0a c\u00F3 d\u1EEF li\u1EC7u cho lo\u1EA1i: ", _jsx("strong", { children: getQuestionTypeName(questionType) })] }), _jsx("p", { className: "mt-2 text-xs text-gray-400", children: "H\u00E3y th\u00EAm c\u00E2u h\u1ECFi v\u00E0o ng\u00E2n h\u00E0ng ho\u1EB7c t\u1EA1o c\u00E2u h\u1ECFi m\u1EDBi" })] })) : hasNoResults ? (_jsxs("div", { className: "flex flex-col items-center justify-center p-8 text-center", children: [_jsx("div", { className: "mb-4 flex h-16 w-16 items-center justify-center rounded-full bg-gray-100", children: _jsx(Search, { className: "h-8 w-8 text-gray-400" }) }), _jsx("p", { className: "text-sm font-medium text-gray-700", children: "Kh\u00F4ng t\u00ECm th\u1EA5y k\u1EBFt qu\u1EA3" }), _jsxs("p", { className: "mt-1 text-xs text-gray-500", children: ["Th\u1EED t\u00ECm v\u1EDBi t\u1EEB kh\u00F3a kh\u00E1c: \"", debouncedTerm, "\""] })] })) : (_jsx("div", { className: "divide-y divide-gray-100 p-2", children: questions.map((question) => {
-                                const subQuestionCount = getSubQuestionCount(question);
-                                return (_jsxs(DropdownMenuItem, { className: "flex cursor-pointer flex-col items-start gap-2 rounded-xl p-3 transition-all hover:bg-gradient-to-r hover:from-indigo-50 hover:to-purple-50 focus:bg-gradient-to-r focus:from-indigo-50 focus:to-purple-50", onSelect: () => handleSelect(question), children: [_jsxs("div", { className: "flex w-full items-start justify-between gap-2", children: [_jsxs("div", { className: "flex items-center gap-2", children: [question.code && (_jsxs("div", { className: "flex items-center gap-1 rounded-md bg-gradient-to-r from-indigo-500 to-purple-500 px-2 py-0.5 text-xs font-bold text-white shadow-sm", children: [_jsx(Hash, { className: "h-3 w-3" }), question.code] })), _jsx("div", { className: "flex-shrink-0", children: getQuestionTypeIcon(question.type) })] }), question.usageCount !== undefined && question.usageCount > 0 && (_jsxs("div", { className: "flex items-center gap-1 text-xs text-gray-500", title: "S\u1ED1 l\u1EA7n s\u1EED d\u1EE5ng", children: [_jsx(BarChart3, { className: "h-3 w-3" }), question.usageCount] }))] }), question.title && (_jsx("p", { className: "text-sm font-semibold text-gray-800", children: truncate(question.title, 60) })), _jsx("p", { className: "text-xs text-gray-600", children: truncate(getQuestionDisplayText(question), 80) }), _jsxs("div", { className: "flex flex-wrap items-center gap-1.5", children: [_jsx(Badge, { variant: "outline", className: cn('px-2 py-0.5 text-[10px] font-semibold', getDifficultyBadgeClass(question.difficulty)), children: getDifficultyName(question.difficulty) }), _jsxs(Badge, { variant: "outline", className: "border-blue-200 bg-blue-50 px-2 py-0.5 text-[10px] font-semibold text-blue-700", children: [question.points || 1, " \u0111i\u1EC3m"] }), question.skill && (_jsx(Badge, { variant: "outline", className: "border-gray-200 bg-gray-50 px-2 py-0.5 text-[10px] font-semibold text-gray-600", children: question.skill.toLowerCase() })), subQuestionCount && subQuestionCount > 1 && (_jsxs(Badge, { variant: "outline", className: "border-purple-200 bg-purple-50 px-2 py-0.5 text-[10px] font-semibold text-purple-700", children: [subQuestionCount, " c\u00E2u con"] }))] })] }, question.id));
-                            }) })) }), _jsx("div", { className: "border-t border-gray-100 bg-gray-50/50 px-4 py-2", children: _jsx("p", { className: "text-center text-xs text-gray-500", children: "Click \u0111\u1EC3 ch\u1ECDn c\u00E2u h\u1ECFi v\u00E0 t\u1EF1 \u0111\u1ED9ng \u0111i\u1EC1n v\u00E0o form" }) })] })] }));
-}
-//# sourceMappingURL=QuestionSearchDropdown.js.map
+"use client";import{jsx as e,jsxs as t}from"react/jsx-runtime";import{useEffect as n,useMemo as r,useState as i}from"react";import{DropdownMenu as s,DropdownMenuContent as a,DropdownMenuItem as o,DropdownMenuTrigger as l}from"../../../components/ui/dropdown-menu";import{Input as c}from"../../../components/ui/input";import{Badge as d}from"../../../components/ui/badge";import{Loader2 as m,Search as u,Image as h,FileText as g,Grid3X3 as p,BookOpen as x,Library as f,Sparkles as N,Hash as b,BarChart3 as y,Lightbulb as v,CheckCircle2 as _}from"lucide-react";import{useQuery as w}from"@tanstack/react-query";import{ScrollArea as C}from"../../../components/ui/scroll-area";import{cn as E}from"../../../shared/lib/utils";const A=(e,t)=>{if(!e)return"";const n="string"==typeof e?e:String(e);return n.length<=t?n:`${n.substring(0,t)}...`},T=["LOOK_PICTURE_FILL_BLANK_CHOOSE_ANSWER","LOOK_PICTURE_CHOOSE_CORRECT_ANSWER","LOOK_PICTURE_FILL_WORD_HINT","FILL_IN_BLANK","LABEL_THE_PICTURE","READ_AND_COLOR_OBJECTS","IMAGE_OBJECT_MATCHING","FILL_IN_BLANK"],O=["READ_PASSAGE_AND_ANSWER_QUESTIONS","READ_PASSAGE_AND_COMPLETE_STORY"],R=["FILL_MISSING_WORDS_IN_GRID"],I=e=>e?{LOOK_PICTURE_FILL_BLANK_CHOOSE_ANSWER:"Nhìn tranh điền chỗ trống",LOOK_PICTURE_CHOOSE_CORRECT_ANSWER:"Nhìn tranh chọn đáp án",LOOK_PICTURE_FILL_WORD_HINT:"Nhìn tranh điền từ gợi ý",FILL_MISSING_WORDS_IN_GRID:"Điền chữ trong bảng",CHOOSE_THE_CORRECT_ANSWER:"Chọn đáp án đúng",LABEL_THE_PICTURE:"Gắn nhãn hình ảnh",READ_AND_COLOR_OBJECTS:"Đọc và tô màu",IMAGE_OBJECT_MATCHING:"Ghép hình ảnh - Đối tượng",WRITE_CORRECT_VERB_FORM:"Viết dạng động từ",FILL_IN_BLANK:"Điền vào chỗ trống",READ_PASSAGE_AND_ANSWER_QUESTIONS:"Đọc hiểu"}[e]||e.replace(/_/g," ").toLowerCase():"Chưa xác định";export const getQuestionDisplayText=e=>getContentDisplayText(e.content,e.type);export const getContentDisplayText=(e,t)=>{if(!e)return t||"Câu hỏi";if("string"==typeof e)return e;if("object"==typeof e){if(e.subQuestions&&Array.isArray(e.subQuestions)){const t=e.subQuestions[0];if(t?.question)return t.question}if(e.question)return e.question;if(e.word)return`Điền chữ: ${e.word}`;if(e.passage)return e.passageTitle||A(e.passage,60);if(e.grid&&e.rows&&e.columns)return`Lưới ${e.rows}x${e.columns}`;if(e.wordBank){return`Từ vựng: ${e.wordBank.map(e=>e.text||e).slice(0,3).join(", ")}${e.wordBank.length>3?"...":""}`}if(e.colorNodes||e.regionNodes){return`${e.regionNodes?.length||0} vùng tô màu`}if(e.contexts){const t=e.contexts[0];return t?.text?A(t.text,50):"Viết thư ngắn"}if(e.options&&Array.isArray(e.options))return e.questionText||e.question||"Câu hỏi trắc nghiệm";if(e.blanks){const t=e.blanks[0];return t?.text||e.sentence||"Điền vào chỗ trống"}if(e.instruction)return e.instruction;if(e.mainTitle)return e.mainTitle;if(e.title)return e.title;if(e.text)return e.text}return t||"Câu hỏi"};const L=e=>{switch(e?.toUpperCase()){case"EASY":return"bg-green-100 text-green-700 border-green-200";case"HARD":return"bg-red-100 text-red-700 border-red-200";default:return"bg-yellow-100 text-yellow-700 border-yellow-200"}},S=e=>{switch(e?.toUpperCase()){case"EASY":return"Dễ";case"HARD":return"Khó";default:return"TB"}};export function QuestionSearchDropdown({questionType:k,onSelect:D,selectedQuestionLabel:B,placeholder:j="Tìm câu hỏi từ ngân hàng",disabled:q=!1,buttonClassName:H,compact:F=!1,searchQuestions:K}){const[G,Q]=i(!1),[U,W]=i(""),[P,M]=i("");n(()=>{const e=setTimeout(()=>{M(U.trim())},300);return()=>clearTimeout(e)},[U]);const $=e=>({id:e.id,type:e.questionType,content:e.content,answer:e.correctAnswer,points:parseFloat(String(e.points??1))||1,difficulty:e.difficulty?.toUpperCase(),skill:e.skill||void 0,explanation:e.explanation||void 0,level:"A1",createdAt:e.createdAt,updatedAt:e.updatedAt,code:e.code,title:e.title||void 0,usageCount:e.usageCount}),{data:J,isFetching:V}=w({queryKey:["questionBanks","search",k,P],queryFn:async()=>K?K({questionType:k,keyword:P||void 0,page:1,size:10}):{data:[],meta:{totalItems:0}},enabled:G&&Boolean(k)&&Boolean(K)&&(P.length>0||!!k),staleTime:6e4,refetchOnWindowFocus:!1}),Y=r(()=>J?.data?J.data.map($):[],[J]),z=J?.meta?.totalItems||0,X=!V&&0===Y.length&&P.length>0,Z=!V&&J&&0===Y.length&&0===P.length,ee=!V&&!J&&0===Y.length&&0===P.length;r(()=>B?A(B,40):j,[j,B]);return t(s,{open:G,onOpenChange:e=>Q(!q&&e),children:[e(l,{asChild:!0,disabled:q,children:t("button",F?{type:"button",className:E("group inline-flex h-8 items-center gap-1.5 rounded-md border px-3 text-sm font-medium transition-all",B?"border-emerald-200 bg-emerald-50 text-emerald-700 hover:bg-emerald-100":"border-indigo-200 text-indigo-600 hover:bg-indigo-50 hover:text-indigo-700","focus:outline-none focus:ring-2 focus:ring-indigo-200 focus:ring-offset-1",q&&"cursor-not-allowed opacity-50",H),children:[e(B?_:f,{className:"h-4 w-4"}),B?"Đã chọn":"Ngân hàng"]}:{type:"button",className:E("group relative flex w-full items-center gap-3 rounded-xl border bg-white p-3 text-left shadow-sm transition-all",B?"border-emerald-200 bg-gradient-to-r from-emerald-50/50 to-teal-50/50":"border-gray-200 hover:border-indigo-200 hover:bg-gradient-to-r hover:from-indigo-50/30 hover:to-purple-50/30","focus:outline-none focus:ring-2 focus:ring-indigo-200 focus:ring-offset-1",q&&"cursor-not-allowed opacity-50",H),children:[e("div",{className:E("flex h-10 w-10 flex-shrink-0 items-center justify-center rounded-lg transition-all",B?"bg-gradient-to-br from-emerald-500 to-teal-600 shadow-sm":"bg-gradient-to-br from-indigo-100 to-purple-100 group-hover:from-indigo-500 group-hover:to-purple-600 group-hover:shadow-sm"),children:B?e(_,{className:"h-5 w-5 text-white"}):e(f,{className:E("h-5 w-5 transition-colors","text-indigo-500 group-hover:text-white")})}),t("div",{className:"min-w-0 flex-1",children:[e("div",{className:"flex items-center gap-2",children:e("span",{className:E("text-xs font-medium uppercase tracking-wide",B?"text-emerald-600":"text-indigo-500"),children:B?"✓ Đã chọn từ ngân hàng":"Ngân hàng câu hỏi"})}),e("p",{className:E("mt-0.5 truncate text-sm",B?"font-medium text-gray-800":"text-gray-500"),children:B?A(B,55):"Nhấn để tìm và sử dụng câu hỏi có sẵn"})]}),e("div",{className:E("flex h-8 w-8 flex-shrink-0 items-center justify-center rounded-full transition-all",B?"bg-emerald-100 text-emerald-600":"bg-gray-100 text-gray-400 group-hover:bg-indigo-100 group-hover:text-indigo-600"),children:e(u,{className:"h-4 w-4"})})]})}),t(a,{className:"w-[520px] p-0",align:F?"end":"start",children:[e("div",{className:"border-b border-gray-100 bg-gradient-to-r from-indigo-50 to-purple-50 px-4 py-3",children:t("div",{className:"flex items-center gap-3",children:[e("div",{className:"flex h-9 w-9 items-center justify-center rounded-lg bg-gradient-to-br from-indigo-500 to-purple-600 shadow-sm",children:e(f,{className:"h-4 w-4 text-white"})}),t("div",{className:"flex-1",children:[e("h3",{className:"text-sm font-semibold text-gray-800",children:"Ngân hàng câu hỏi"}),e("p",{className:"text-xs text-gray-500",children:"Chọn câu hỏi có sẵn để điền nhanh vào form"})]})]})}),t("div",{className:"border-b border-gray-100 bg-gray-50/50 p-3",children:[t("div",{className:"relative",children:[e(u,{className:"absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-gray-400"}),e(c,{placeholder:"Tìm theo mã, tiêu đề hoặc nội dung...",value:U,onChange:e=>W(e.target.value),autoFocus:!0,className:"border-gray-200 bg-white pl-10 pr-10 transition-all focus:border-indigo-300 focus:ring-indigo-200"}),V&&e(m,{className:"absolute right-3 top-1/2 h-4 w-4 -translate-y-1/2 animate-spin text-indigo-500"})]}),t("div",{className:"mt-2 flex items-center justify-between",children:[e("div",{className:"flex items-center gap-2",children:e(d,{variant:"outline",className:"border-indigo-200 bg-indigo-50 text-indigo-700",children:I(k)})}),z>0&&t("span",{className:"text-xs text-gray-500",children:["Hiển thị ",Y.length,"/",z," kết quả"]})]})]}),e(C,{className:"h-80",children:ee?t("div",{className:"flex flex-col items-center justify-center p-8 text-center",children:[e("div",{className:"mb-4 flex h-16 w-16 items-center justify-center rounded-full bg-gradient-to-br from-indigo-100 to-purple-100",children:e(N,{className:"h-8 w-8 text-indigo-500"})}),e("p",{className:"text-sm font-medium text-gray-700",children:"Tìm câu hỏi từ ngân hàng"}),e("p",{className:"mt-1 text-xs text-gray-500",children:"Nhập mã câu hỏi, tiêu đề hoặc từ khóa để tìm kiếm"}),e("div",{className:"mt-4 rounded-lg border border-blue-200 bg-blue-50 p-3",children:t("div",{className:"flex items-start gap-2",children:[e(v,{className:"mt-0.5 h-4 w-4 flex-shrink-0 text-blue-500"}),t("div",{className:"text-left text-xs text-blue-700",children:[e("p",{className:"font-medium",children:"Mẹo tìm kiếm nhanh:"}),t("ul",{className:"mt-1 list-inside list-disc space-y-0.5 text-blue-600",children:[e("li",{children:"Nhập mã câu hỏi (VD: M001)"}),e("li",{children:"Nhập tiêu đề hoặc một phần nội dung"}),e("li",{children:"Kết quả sẽ tự động cập nhật"})]})]})]})})]}):Z?t("div",{className:"flex flex-col items-center justify-center p-8 text-center",children:[e("div",{className:"mb-4 flex h-16 w-16 items-center justify-center rounded-full bg-amber-100",children:e(f,{className:"h-8 w-8 text-amber-500"})}),e("p",{className:"text-sm font-medium text-gray-700",children:"Chưa có câu hỏi trong ngân hàng"}),t("p",{className:"mt-1 text-xs text-gray-500",children:["Ngân hàng câu hỏi chưa có dữ liệu cho loại: ",e("strong",{children:I(k)})]}),e("p",{className:"mt-2 text-xs text-gray-400",children:"Hãy thêm câu hỏi vào ngân hàng hoặc tạo câu hỏi mới"})]}):X?t("div",{className:"flex flex-col items-center justify-center p-8 text-center",children:[e("div",{className:"mb-4 flex h-16 w-16 items-center justify-center rounded-full bg-gray-100",children:e(u,{className:"h-8 w-8 text-gray-400"})}),e("p",{className:"text-sm font-medium text-gray-700",children:"Không tìm thấy kết quả"}),t("p",{className:"mt-1 text-xs text-gray-500",children:['Thử tìm với từ khóa khác: "',P,'"']})]}):e("div",{className:"divide-y divide-gray-100 p-2",children:Y.map(n=>{const r=(e=>{const t=e.content;return t&&t.subQuestions&&Array.isArray(t.subQuestions)?t.subQuestions.length:null})(n);return t(o,{className:"flex cursor-pointer flex-col items-start gap-2 rounded-xl p-3 transition-all hover:bg-gradient-to-r hover:from-indigo-50 hover:to-purple-50 focus:bg-gradient-to-r focus:from-indigo-50 focus:to-purple-50",onSelect:()=>(e=>{D(e),Q(!1),W(""),M("")})(n),children:[t("div",{className:"flex w-full items-start justify-between gap-2",children:[t("div",{className:"flex items-center gap-2",children:[n.code&&t("div",{className:"flex items-center gap-1 rounded-md bg-gradient-to-r from-indigo-500 to-purple-500 px-2 py-0.5 text-xs font-bold text-white shadow-sm",children:[e(b,{className:"h-3 w-3"}),n.code]}),e("div",{className:"flex-shrink-0",children:(i=n.type,T.includes(i)?e(h,{className:"h-4 w-4 text-blue-500"}):O.includes(i)?e(x,{className:"h-4 w-4 text-green-500"}):R.includes(i)?e(p,{className:"h-4 w-4 text-purple-500"}):e(g,{className:"h-4 w-4 text-gray-500"}))})]}),void 0!==n.usageCount&&n.usageCount>0&&t("div",{className:"flex items-center gap-1 text-xs text-gray-500",title:"Số lần sử dụng",children:[e(y,{className:"h-3 w-3"}),n.usageCount]})]}),n.title&&e("p",{className:"text-sm font-semibold text-gray-800",children:A(n.title,60)}),e("p",{className:"text-xs text-gray-600",children:A(getQuestionDisplayText(n),80)}),t("div",{className:"flex flex-wrap items-center gap-1.5",children:[e(d,{variant:"outline",className:E("px-2 py-0.5 text-[10px] font-semibold",L(n.difficulty)),children:S(n.difficulty)}),t(d,{variant:"outline",className:"border-blue-200 bg-blue-50 px-2 py-0.5 text-[10px] font-semibold text-blue-700",children:[n.points||1," điểm"]}),n.skill&&e(d,{variant:"outline",className:"border-gray-200 bg-gray-50 px-2 py-0.5 text-[10px] font-semibold text-gray-600",children:n.skill.toLowerCase()}),r&&r>1&&t(d,{variant:"outline",className:"border-purple-200 bg-purple-50 px-2 py-0.5 text-[10px] font-semibold text-purple-700",children:[r," câu con"]})]})]},n.id);var i})})}),e("div",{className:"border-t border-gray-100 bg-gray-50/50 px-4 py-2",children:e("p",{className:"text-center text-xs text-gray-500",children:"Click để chọn câu hỏi và tự động điền vào form"})})]})]})}

package/dist/components/questions/components/QuestionTypeSelector.d.ts

@@ -6,4 +6,3 @@ interface QuestionTypeSelectorProps {
 }
 export declare function QuestionTypeSelector({ value, onValueChange, disabled, }: QuestionTypeSelectorProps): import("react").JSX.Element;
 export {};
-//# sourceMappingURL=QuestionTypeSelector.d.ts.map

package/dist/components/questions/components/QuestionTypeSelector.js

@@ -1,33 +1 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue, } from '../../../components/ui/select';
-import { getQuestionTypeLabel } from '../_shared/config/question-types.config';
-export function QuestionTypeSelector({ value, onValueChange, disabled, }) {
-    const questionTypes = [
-        'CHOOSE_THE_CORRECT_ANSWER',
-        'CHOOSE_THE_CORRECT_ANSWER',
-        'LISTEN_AND_FILL_IN_THE_BLANK_WITH_IMAGE',
-        'CHOOSE_THE_CORRECT_ANSWER',
-        'CHOOSE_THE_CORRECT_ANSWER',
-        'FILL_IN_BLANK',
-        'FILL_IN_BLANK',
-        'TICK_TRUE_OR_FALSE',
-        'TICK_YES_OR_NO',
-        'ARRANGE_LETTERS_INTO_WORDS',
-        'READ_PASSAGE_AND_COMPLETE_STORY',
-        'FILL_IN_BLANK',
-        'CHOOSE_THE_CORRECT_ANSWER',
-        'READ_AND_CHOOSE_APPROPRIATE_WORD',
-        'WRITE_SHORT_PARAGRAPH',
-        'FILL_MISSING_WORDS_IN_GRID',
-        'LOOK_PICTURE_CHOOSE_CORRECT_ANSWER',
-        'LOOK_PICTURE_FILL_WORD_HINT',
-        'LABEL_THE_PICTURE',
-        'READ_AND_COLOR_OBJECTS',
-        'ANSWER_THE_QUESTION',
-        'WORD_ORDERING',
-        'MATCH_BY_WRITING_ANSWER',
-        'WRITE_SENTENCES',
-    ];
-    return (_jsxs(Select, { value: value, onValueChange: onValueChange, disabled: disabled, children: [_jsx(SelectTrigger, { id: "questionType", className: "mt-1", children: _jsx(SelectValue, { placeholder: "Ch\u1ECDn lo\u1EA1i c\u00E2u h\u1ECFi" }) }), _jsx(SelectContent, { children: questionTypes.map((type) => (_jsx(SelectItem, { value: type, children: getQuestionTypeLabel(type) }, type))) })] }));
-}
-//# sourceMappingURL=QuestionTypeSelector.js.map
+import{jsx as _,jsxs as E}from"react/jsx-runtime";import{Select as R,SelectContent as O,SelectItem as T,SelectTrigger as N,SelectValue as e}from"../../../components/ui/select";import{getQuestionTypeLabel as A}from"../_shared/config/question-types.config";export function QuestionTypeSelector({value:C,onValueChange:S,disabled:I}){return E(R,{value:C,onValueChange:S,disabled:I,children:[_(N,{id:"questionType",className:"mt-1",children:_(e,{placeholder:"Chọn loại câu hỏi"})}),_(O,{children:["CHOOSE_THE_CORRECT_ANSWER","CHOOSE_THE_CORRECT_ANSWER","LISTEN_AND_FILL_IN_THE_BLANK_WITH_IMAGE","CHOOSE_THE_CORRECT_ANSWER","CHOOSE_THE_CORRECT_ANSWER","FILL_IN_BLANK","FILL_IN_BLANK","TICK_TRUE_OR_FALSE","TICK_YES_OR_NO","ARRANGE_LETTERS_INTO_WORDS","READ_PASSAGE_AND_COMPLETE_STORY","FILL_IN_BLANK","CHOOSE_THE_CORRECT_ANSWER","READ_AND_CHOOSE_APPROPRIATE_WORD","WRITE_SHORT_PARAGRAPH","FILL_MISSING_WORDS_IN_GRID","LOOK_PICTURE_CHOOSE_CORRECT_ANSWER","LOOK_PICTURE_FILL_WORD_HINT","LABEL_THE_PICTURE","READ_AND_COLOR_OBJECTS","ANSWER_THE_QUESTION","WORD_ORDERING","MATCH_BY_WRITING_ANSWER","WRITE_SENTENCES"].map(E=>_(T,{value:E,children:A(E)},E))})]})}

package/dist/components/questions/components/QuestionTypeSpecificForms.d.ts

@@ -7,4 +7,3 @@ interface QuestionTypeSpecificFormsProps {
 }
 export declare function QuestionTypeSpecificForms(_props: QuestionTypeSpecificFormsProps): any;
 export {};
-//# sourceMappingURL=QuestionTypeSpecificForms.d.ts.map

package/dist/components/questions/components/QuestionTypeSpecificForms.js

@@ -1,7 +1 @@
-// eslint-disable-next-line @typescript-eslint/no-unused-vars
-export function QuestionTypeSpecificForms(_props) {
-    // Tất cả các loại câu hỏi đã có dedicated Creator components
-    // Component này không còn được sử dụng nữa
-    return null;
-}
-//# sourceMappingURL=QuestionTypeSpecificForms.js.map
+export function QuestionTypeSpecificForms(e){return null}

package/dist/components/questions/components/RegionNode.d.ts

@@ -17,4 +17,3 @@ interface RegionNodeProps {
 }
 export declare const RegionNode: import("react").MemoExoticComponent<({ data }: RegionNodeProps) => import("react").JSX.Element>;
 export {};
-//# sourceMappingURL=RegionNode.d.ts.map

package/dist/components/questions/components/RegionNode.js

@@ -1,95 +1 @@
-'use client';
-import { jsx as _jsx } from "react/jsx-runtime";
-import { memo, useState, useRef, useEffect } from 'react';
-import { Input } from '../../../components/ui/input';
-import { NameNode } from './NameNode';
-export const RegionNode = memo(({ data }) => {
-    const { label, width, height, onCreateNameNode, isClientMode, savedName: propSavedName, isUnassignedRegion, isHighlighted, } = data;
-    const [inputText, setInputText] = useState('');
-    const [showInput, setShowInput] = useState(false);
-    // Initialize: in client mode always empty, in edit mode use propSavedName if available
-    const [savedName, setSavedName] = useState(isClientMode ? '' : (propSavedName ?? label ?? ''));
-    const inputRef = useRef(null);
-    const nodeRef = useRef(null);
-    // Sync propSavedName and reset when switching modes
-    useEffect(() => {
-        if (isClientMode) {
-            // In client mode, always use propSavedName (from regionAssignments or empty)
-            // If switching TO client mode, clear any existing savedName
-            if (propSavedName) {
-                setSavedName(propSavedName);
-            }
-            else {
-                setSavedName(''); // Clear when switching to client mode
-            }
-        }
-        else {
-            // In edit mode, use propSavedName if provided (from region data)
-            if (propSavedName !== undefined) {
-                setSavedName(propSavedName);
-            }
-            else if (label) {
-                setSavedName(label);
-            }
-        }
-    }, [isClientMode, propSavedName, label]);
-    const handleInputKeyDown = (e) => {
-        if (e.key === 'Enter' && inputText.trim()) {
-            onCreateNameNode?.(inputText.trim());
-            setSavedName(inputText.trim()); // Lưu tên để hiển thị
-            setInputText('');
-            setShowInput(false);
-        }
-        else if (e.key === 'Escape') {
-            setInputText('');
-            setShowInput(false);
-        }
-    };
-    const handleInputBlur = () => {
-        if (inputText.trim()) {
-            onCreateNameNode?.(inputText.trim());
-            setSavedName(inputText.trim()); // Lưu tên để hiển thị
-        }
-        setInputText('');
-        setShowInput(false);
-    };
-    return (_jsx("div", { ref: nodeRef, className: `relative rounded-2xl transition-all ${
-        // Unassigned region has no visible styling (transparent)
-        isUnassignedRegion
-            ? '' // No border/background for unassigned region
-            : // In client mode, show transparent region (NameNode will be rendered separately)
-                isClientMode
-                    ? savedName
-                        ? '' // No border/background when NameNode is assigned
-                        : isHighlighted
-                            ? 'rounded-2xl border-2 border-dashed border-red-500 bg-red-100/30 ring-2 ring-red-300' // Highlighted empty region
-                            : 'rounded-2xl border-2 border-dashed border-red-400 bg-black/20' // Client mode - red border with semi-transparent black background when empty
-                    : savedName || label
-                        ? '' // Match client mode when region đã có tên
-                        : 'rounded-2xl border-2 border-dashed border-red-400 bg-black/10 backdrop-blur-sm' // Creator mode empty giống client
-        }`, style: isUnassignedRegion
-            ? {
-                width: '100%',
-                height: '100%',
-            }
-            : {
-                width: `${width}%`,
-                height: `${height}%`,
-                minWidth: '60px',
-                minHeight: '40px',
-                borderRadius: '16px',
-            }, children: !isClientMode && (_jsx("div", { className: "pointer-events-auto h-full w-full", children: showInput ? (_jsx(Input, { ref: inputRef, value: inputText, onChange: (e) => setInputText(e.target.value), onKeyDown: handleInputKeyDown, onBlur: handleInputBlur, placeholder: "Nh\u1EADp t\u00EAn...", className: "pointer-events-auto h-9 text-sm", onClick: (e) => {
-                    e.stopPropagation();
-                    e.preventDefault();
-                }, onMouseDown: (e) => {
-                    e.stopPropagation();
-                    e.preventDefault();
-                } })) : savedName || label ? (_jsx("div", { className: "pointer-events-none h-full w-full", children: _jsx(NameNode, { data: {
-                        name: savedName || label,
-                        isConnected: true,
-                        onRemove: () => { },
-                        displayMode: 'compact',
-                    }, variant: "client" }) })) : null })) }));
-});
-RegionNode.displayName = 'RegionNode';
-//# sourceMappingURL=RegionNode.js.map
+"use client";import{jsx as e}from"react/jsx-runtime";import{memo as r,useState as o,useRef as t,useEffect as n}from"react";import{Input as i}from"../../../components/ui/input";import{NameNode as d}from"./NameNode";export const RegionNode=r(({data:r})=>{const{label:a,width:l,height:s,onCreateNameNode:m,isClientMode:p,savedName:u,isUnassignedRegion:h,isHighlighted:c}=r,[g,b]=o(""),[v,N]=o(!1),[f,x]=o(p?"":u??a??""),w=t(null),k=t(null);n(()=>{p?x(u||""):void 0!==u?x(u):a&&x(a)},[p,u,a]);return e("div",{ref:k,className:"relative rounded-2xl transition-all "+(h?"":p?f?"":c?"rounded-2xl border-2 border-dashed border-red-500 bg-red-100/30 ring-2 ring-red-300":"rounded-2xl border-2 border-dashed border-red-400 bg-black/20":f||a?"":"rounded-2xl border-2 border-dashed border-red-400 bg-black/10 backdrop-blur-sm"),style:h?{width:"100%",height:"100%"}:{width:`${l}%`,height:`${s}%`,minWidth:"60px",minHeight:"40px",borderRadius:"16px"},children:!p&&e("div",{className:"pointer-events-auto h-full w-full",children:v?e(i,{ref:w,value:g,onChange:e=>b(e.target.value),onKeyDown:e=>{"Enter"===e.key&&g.trim()?(m?.(g.trim()),x(g.trim()),b(""),N(!1)):"Escape"===e.key&&(b(""),N(!1))},onBlur:()=>{g.trim()&&(m?.(g.trim()),x(g.trim())),b(""),N(!1)},placeholder:"Nhập tên...",className:"pointer-events-auto h-9 text-sm",onClick:e=>{e.stopPropagation(),e.preventDefault()},onMouseDown:e=>{e.stopPropagation(),e.preventDefault()}}):f||a?e("div",{className:"pointer-events-none h-full w-full",children:e(d,{data:{name:f||a,isConnected:!0,onRemove:()=>{},displayMode:"compact"},variant:"client"})}):null})})});RegionNode.displayName="RegionNode";

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

@@ -12,4 +12,3 @@ export { QuestionTypeSelector } from './QuestionTypeSelector';
 export { QuestionTypeSpecificForms } from './QuestionTypeSpecificForms';
 export { RegionNode } from './RegionNode';
 export { BasicQuestionGroupCard, type BasicQuestionGroupCardProps } from '../groups/BasicQuestionGroupCard';
-//# sourceMappingURL=index.d.ts.map

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

@@ -1,15 +1 @@
-export { ColorNode } from './ColorNode';
-export { ColorRegionClient } from './ColorRegionClient';
-export { ColorRegionCreator } from './ColorRegionCreator';
-export { ColorRegionNode } from './ColorRegionNode';
-export { CreatorGuide } from './CreatorGuide';
-export { NameNode } from './NameNode';
-export { QuestionBankOption } from './QuestionBankOption';
-export { QuestionBasicInfoForm } from './QuestionBasicInfoForm';
-export { QuestionCommonFields } from './QuestionCommonFields';
-export { QuestionSearchDropdown } from './QuestionSearchDropdown';
-export { QuestionTypeSelector } from './QuestionTypeSelector';
-export { QuestionTypeSpecificForms } from './QuestionTypeSpecificForms';
-export { RegionNode } from './RegionNode';
-export { BasicQuestionGroupCard } from '../groups/BasicQuestionGroupCard';
-//# sourceMappingURL=index.js.map
+export{ColorNode}from"./ColorNode";export{ColorRegionClient}from"./ColorRegionClient";export{ColorRegionCreator}from"./ColorRegionCreator";export{ColorRegionNode}from"./ColorRegionNode";export{CreatorGuide}from"./CreatorGuide";export{NameNode}from"./NameNode";export{QuestionBankOption}from"./QuestionBankOption";export{QuestionBasicInfoForm}from"./QuestionBasicInfoForm";export{QuestionCommonFields}from"./QuestionCommonFields";export{QuestionSearchDropdown}from"./QuestionSearchDropdown";export{QuestionTypeSelector}from"./QuestionTypeSelector";export{QuestionTypeSpecificForms}from"./QuestionTypeSpecificForms";export{RegionNode}from"./RegionNode";export{BasicQuestionGroupCard}from"../groups/BasicQuestionGroupCard";

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

@@ -32,4 +32,3 @@ export interface QuestionCreatorProps {
     headerExtra?: React.ReactNode;
 }
 export declare function QuestionCreator({ onSave, onCancel, initialData, prefilledType, prefilledSkill, optionCount, optionMode, defaultValue, defaultQuestion, viewMode, groups, groupConfig, groupType, articleCount, questionConfig, questionIndexInPart, partId, isEmbedded, onChange, onUnsavedChangesChange, externalErrors, validationRef, suggestedAnswers, hasSuggestedAnswers, headerExtra, }: QuestionCreatorProps): string | number | bigint | true | Iterable<import("react").ReactNode> | Promise<string | number | bigint | boolean | import("react").ReactPortal | import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>> | Iterable<import("react").ReactNode>> | import("react").JSX.Element;
-//# sourceMappingURL=QuestionCreator.d.ts.map

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

@@ -1,91 +1 @@
-'use client';
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { toast } from 'sonner';
-import { t } from '../../../shared/lib/i18n';
-import { Button } from '../../../components/ui/button';
-import { Card, CardDescription, CardHeader, CardTitle } from '../../../components/ui/card';
-import { useQuestionFormState } from '../_shared/hooks/useQuestionFormState';
-import { useQuestionInitialization } from '../_shared/hooks/useQuestionInitialization';
-import { useQuestionOnChange } from '../_shared/hooks/useQuestionOnChange';
-import { QuestionTypeSpecificForms } from '../components/QuestionTypeSpecificForms';
-import { renderDedicatedComponent } from './dedicated-component-router';
-import { buildAnswerPayload } from '../_shared/utils/answer-builder';
-import { validateQuestion } from '../_shared/utils/question-validation';
-import { QUESTION_TYPES_WITH_DEDICATED_COMPONENTS } from '../_shared/config/question-types.config';
-export function QuestionCreator({ onSave, onCancel, initialData, prefilledType, prefilledSkill, optionCount, optionMode, defaultValue, defaultQuestion, viewMode, groups, groupConfig, groupType, articleCount, questionConfig, questionIndexInPart, partId, isEmbedded = false, onChange, onUnsavedChangesChange, externalErrors, validationRef, suggestedAnswers, hasSuggestedAnswers, headerExtra, }) {
-    const { state, updateField } = useQuestionFormState();
-    const { isInitializing } = useQuestionInitialization({
-        initialData,
-        prefilledType,
-        prefilledSkill,
-        updateField,
-    });
-    useQuestionOnChange({
-        onChange,
-        state,
-        isInitializing,
-        prefilledType,
-    });
-    // Determine effective question type - use prefilledType as fallback for state.questionType
-    // This ensures dedicated components render on first render before state is updated
-    const effectiveQuestionType = (state.questionType || prefilledType);
-    // Check if current question type has a dedicated component
-    const hasDedicatedComponent = effectiveQuestionType &&
-        QUESTION_TYPES_WITH_DEDICATED_COMPONENTS.includes(effectiveQuestionType);
-    // Render dedicated component if applicable
-    // Note: We don't use useMemo here because dedicated components manage their own
-    // internal state and the callbacks (onChange, onSave) need fresh references.
-    // The performance optimization should be done inside each creator component.
-    if (hasDedicatedComponent) {
-        const dedicatedComponent = renderDedicatedComponent({
-            questionType: effectiveQuestionType,
-            initialData,
-            state,
-            onSave,
-            onCancel,
-            onChange,
-            onUnsavedChangesChange,
-            externalErrors,
-            optionCount,
-            optionMode,
-            defaultValue,
-            defaultQuestion,
-            viewMode,
-            groups,
-            groupConfig,
-            groupType,
-            articleCount,
-            questionConfig,
-            questionIndexInPart,
-            partId,
-            validationRef,
-            suggestedAnswers,
-            hasSuggestedAnswers,
-            headerExtra,
-        });
-        if (dedicatedComponent) {
-            return dedicatedComponent;
-        }
-    }
-    const handleSubmit = () => {
-        const validation = validateQuestion(state.questionType, state.content);
-        if (!validation.isValid) {
-            toast.error(validation.error || t('common.question.create.fillInfo'));
-            return;
-        }
-        const answer = buildAnswerPayload(state.questionType, state);
-        const questionData = {
-            type: state.questionType,
-            content: state.content,
-            answer,
-            points: state.points,
-            level: state.level,
-            difficulty: state.difficulty,
-            skill: state.skill,
-        };
-        onSave?.(questionData);
-        toast.success(t('common.question.create.success'));
-    };
-    return (_jsxs("div", { className: "space-y-6", children: [_jsx(Card, { children: !isEmbedded && (_jsxs(CardHeader, { children: [_jsx(CardTitle, { children: "T\u1EA1o c\u00E2u h\u1ECFi m\u1EDBi" }), _jsx(CardDescription, { children: "\u0110i\u1EC1n th\u00F4ng tin c\u01A1 b\u1EA3n v\u1EC1 c\u00E2u h\u1ECFi" })] })) }), state.questionType && !hasDedicatedComponent && (_jsx(QuestionTypeSpecificForms, { questionType: state.questionType, state: state, updateField: updateField })), _jsxs("div", { className: "flex justify-end gap-3", children: [_jsx(Button, { variant: "outline", onClick: onCancel, children: "H\u1EE7y" }), _jsx(Button, { onClick: handleSubmit, className: "bg-blue-500 hover:bg-blue-600", children: "L\u01B0u c\u00E2u h\u1ECFi" })] })] }));
-}
-//# sourceMappingURL=QuestionCreator.js.map
+"use client";import{jsx as e,jsxs as i}from"react/jsx-runtime";import{toast as o}from"sonner";import{t as n}from"../../../shared/lib/i18n";import{Button as t}from"../../../components/ui/button";import{Card as s,CardDescription as r,CardHeader as a,CardTitle as u}from"../../../components/ui/card";import{useQuestionFormState as l}from"../_shared/hooks/useQuestionFormState";import{useQuestionInitialization as d}from"../_shared/hooks/useQuestionInitialization";import{useQuestionOnChange as p}from"../_shared/hooks/useQuestionOnChange";import{QuestionTypeSpecificForms as c}from"../components/QuestionTypeSpecificForms";import{renderDedicatedComponent as f}from"./dedicated-component-router";import{buildAnswerPayload as m}from"../_shared/utils/answer-builder";import{validateQuestion as h}from"../_shared/utils/question-validation";import{QUESTION_TYPES_WITH_DEDICATED_COMPONENTS as g}from"../_shared/config/question-types.config";export function QuestionCreator({onSave:y,onCancel:C,initialData:v,prefilledType:q,prefilledSkill:T,optionCount:x,optionMode:I,defaultValue:b,defaultQuestion:k,viewMode:w,groups:S,groupConfig:Q,groupType:_,articleCount:E,questionConfig:F,questionIndexInPart:j,partId:A,isEmbedded:M=!1,onChange:z,onUnsavedChangesChange:D,externalErrors:N,validationRef:V,suggestedAnswers:P,hasSuggestedAnswers:R,headerExtra:U}){const{state:H,updateField:L}=l(),{isInitializing:O}=d({initialData:v,prefilledType:q,prefilledSkill:T,updateField:L});p({onChange:z,state:H,isInitializing:O,prefilledType:q});const B=H.questionType||q,G=B&&g.includes(B);if(G){const e=f({questionType:B,initialData:v,state:H,onSave:y,onCancel:C,onChange:z,onUnsavedChangesChange:D,externalErrors:N,optionCount:x,optionMode:I,defaultValue:b,defaultQuestion:k,viewMode:w,groups:S,groupConfig:Q,groupType:_,articleCount:E,questionConfig:F,questionIndexInPart:j,partId:A,validationRef:V,suggestedAnswers:P,hasSuggestedAnswers:R,headerExtra:U});if(e)return e}return i("div",{className:"space-y-6",children:[e(s,{children:!M&&i(a,{children:[e(u,{children:"Tạo câu hỏi mới"}),e(r,{children:"Điền thông tin cơ bản về câu hỏi"})]})}),H.questionType&&!G&&e(c,{questionType:H.questionType,state:H,updateField:L}),i("div",{className:"flex justify-end gap-3",children:[e(t,{variant:"outline",onClick:C,children:"Hủy"}),e(t,{onClick:()=>{const e=h(H.questionType,H.content);if(!e.isValid)return void o.error(e.error||n("common.question.create.fillInfo"));const i=m(H.questionType,H),t={type:H.questionType,content:H.content,answer:i,points:H.points,level:H.level,difficulty:H.difficulty,skill:H.skill};y?.(t),o.success(n("common.question.create.success"))},className:"bg-blue-500 hover:bg-blue-600",children:"Lưu câu hỏi"})]})]})}

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

@@ -5,4 +5,3 @@ export interface QuestionGroupCreatorProps {
     availableQuestions?: Question[];
 }
 export declare function QuestionGroupCreator({ onSave, onCancel, availableQuestions, }: QuestionGroupCreatorProps): import("react").JSX.Element;
-//# sourceMappingURL=QuestionGroupCreator.d.ts.map