@thanh01.pmt/interactive-quiz-kit 1.0.74 → 1.0.76

package/dist/react-ui.cjs

@@ -102367,7 +102367,7 @@ var contextOptions = [
 ];
 
 // src/react-ui/components/authoring/AIFullQuizGeneratorModal.tsx
-var availableQuestionTypesForFullQuiz = [
+var ALL_AVAILABLE_QUESTION_TYPES = [
   { value: "true_false", label: "True/False" },
   { value: "multiple_choice", label: "Multiple Choice" },
   { value: "multiple_response", label: "Multiple Response" },
@@ -102382,8 +102382,11 @@ var AIFullQuizGeneratorModal = ({
   isOpen,
   onClose,
   onQuizGenerated,
-  language: language3
-  // <-- NHẬN PROP
+  language: language3,
+  maxQuestions = 100,
+  // Default value
+  allowedQuestionTypes = ALL_AVAILABLE_QUESTION_TYPES.map((qt) => qt.value)
+  // Default value
 }) => {
   const [totalQuestions, setTotalQuestions] = React169.useState(10);
   const [topics, setTopics] = React169.useState([{ id: generateUniqueId("topic_"), topic: "", ratio: 100 }]);
@@ -102394,9 +102397,7 @@ var AIFullQuizGeneratorModal = ({
   ]);
   const [selectedContextIds, setSelectedContextIds] = React169.useState([]);
   const [customContextInput, setCustomContextInput] = React169.useState("");
-  const [selectedQuestionTypes, setSelectedQuestionTypes] = React169.useState(
-    availableQuestionTypesForFullQuiz.map((qt) => qt.value)
-  );
+  const [selectedQuestionTypes, setSelectedQuestionTypes] = React169.useState([]);
   const [authorizeAISkipReview, setAuthorizeAISkipReview] = React169.useState(false);
   const [isLoading, setIsLoading] = React169.useState(false);
   const [error, setError] = React169.useState(null);
@@ -102405,6 +102406,9 @@ var AIFullQuizGeneratorModal = ({
   const { toast: toast2 } = useToast();
   const [isApiKeyManagerModalOpen, setIsApiKeyManagerModalOpen] = React169.useState(false);
   const [geminiApiKeyExists, setGeminiApiKeyExists] = React169.useState(false);
+  const availableQuestionTypesForFullQuiz = React169.useMemo(() => {
+    return ALL_AVAILABLE_QUESTION_TYPES.filter((qt) => allowedQuestionTypes.includes(qt.value));
+  }, [allowedQuestionTypes]);
   React169.useEffect(() => {
     if (isOpen) {
       setTotalQuestions(10);
@@ -102424,7 +102428,7 @@ var AIFullQuizGeneratorModal = ({
       setAiGeneratedPlan(null);
       setGeminiApiKeyExists(APIKeyService.hasAPIKey(GEMINI_API_KEY_SERVICE_NAME));
     }
-  }, [isOpen]);
+  }, [isOpen, availableQuestionTypesForFullQuiz]);
   const handleApiKeyModalClose = () => {
     setIsApiKeyManagerModalOpen(false);
     setGeminiApiKeyExists(APIKeyService.hasAPIKey(GEMINI_API_KEY_SERVICE_NAME));
@@ -102432,7 +102436,7 @@ var AIFullQuizGeneratorModal = ({
   const handleTotalQuestionsChange = (e3) => {
     let num = parseInt(e3.target.value, 10);
     if (isNaN(num) || num < 1) num = 1;
-    if (num > 100) num = 100;
+    if (num > maxQuestions) num = maxQuestions;
     setTotalQuestions(num);
   };
   const handleTopicChange = (id3, field, value) => {
@@ -102462,8 +102466,8 @@ var AIFullQuizGeneratorModal = ({
       setError("Gemini API Key is required for AI features. Please set it first.");
       return false;
     }
-    if (totalQuestions <= 0 || totalQuestions > 100) {
-      setError("Total questions must be between 1 and 100.");
+    if (totalQuestions <= 0 || totalQuestions > maxQuestions) {
+      setError(`Total questions must be between 1 and ${maxQuestions}.`);
       return false;
     }
     if (topics.some((t4) => !t4.topic.trim())) {
@@ -102502,7 +102506,6 @@ var AIFullQuizGeneratorModal = ({
       const stage2Input = {
         quizPlan: plan,
         language: language3,
-        // <-- SỬ DỤNG PROP
         imageContexts: []
       };
       const stage2Output = await generateQuestionsFromQuizPlan(stage2Input, apiKey);
@@ -102553,7 +102556,6 @@ var AIFullQuizGeneratorModal = ({
     try {
       const planInput = {
         language: language3,
-        // <-- SỬ DỤNG PROP
         totalQuestions,
         numCodingQuestions: 0,
         topics: topics.map((t4) => ({ topic: t4.topic, ratio: t4.ratio })),
@@ -102617,103 +102619,9 @@ var AIFullQuizGeneratorModal = ({
   };
   const renderContent3 = () => {
     if (currentStage === "review") {
-      return /* @__PURE__ */ React169__namespace.default.createElement("div", { className: "space-y-4 py-4" }, /* @__PURE__ */ React169__namespace.default.createElement("h3", { className: "text-lg font-Medium mb-2 text-primary flex items-center" }, /* @__PURE__ */ React169__namespace.default.createElement(Eye, { className: "mr-2 h-5 w-5" }), " Review & Adjust AI Generated Quiz Plan"), /* @__PURE__ */ React169__namespace.default.createElement("p", { className: "text-sm text-muted-foreground" }, "The AI has proposed the following plan. You can change question types, reorder, or remove questions before final generation. Note: 'Drag and Drop' type questions in the plan will be created as placeholders and require manual authoring of items/zones/answers."), aiGeneratedPlan && aiGeneratedPlan.length > 0 ? /* @__PURE__ */ React169__namespace.default.createElement(ScrollArea2, { className: "max-h-[calc(60vh - 120px)] pr-3" }, /* @__PURE__ */ React169__namespace.default.createElement("div", { className: "space-y-3" }, aiGeneratedPlan.map((plannedQ, index3) => /* @__PURE__ */ React169__namespace.default.createElement(Card, { key: `planned-${index3}-${plannedQ.plannedTopic.replace(/\s/g, "")}`, className: "p-3" }, /* @__PURE__ */ React169__namespace.default.createElement(CardContent, { className: "p-0 space-y-2" }, /* @__PURE__ */ React169__namespace.default.createElement("div", { className: "flex justify-between items-start" }, /* @__PURE__ */ React169__namespace.default.createElement("p", { className: "font-semibold text-sm" }, "Q", index3 + 1, ": ", plannedQ.plannedTopic), /* @__PURE__ */ React169__namespace.default.createElement("div", { className: "flex space-x-1" }, /* @__PURE__ */ React169__namespace.default.createElement(Button, { variant: "ghost", size: "icon", className: "h-7 w-7", onClick: () => handleMovePlannedQuestion(index3, "up"), disabled: index3 === 0 }, /* @__PURE__ */ React169__namespace.default.createElement(ArrowUp, { className: "h-4 w-4" })), /* @__PURE__ */ React169__namespace.default.createElement(Button, { variant: "ghost", size: "icon", className: "h-7 w-7", onClick: () => handleMovePlannedQuestion(index3, "down"), disabled: index3 === aiGeneratedPlan.length - 1 }, /* @__PURE__ */ React169__namespace.default.createElement(ArrowDown, { className: "h-4 w-4" })), /* @__PURE__ */ React169__namespace.default.createElement(Button, { variant: "ghost", size: "icon", className: "h-7 w-7 text-destructive", onClick: () => handleRemovePlannedQuestion(index3) }, /* @__PURE__ */ React169__namespace.default.createElement(Trash2, { className: "h-4 w-4" })))), /* @__PURE__ */ React169__namespace.default.createElement("div", { className: "grid grid-cols-2 gap-3 items-end" }, /* @__PURE__ */ React169__namespace.default.createElement("div", null, /* @__PURE__ */ React169__namespace.default.createElement(Label2, { htmlFor: `review-qtype-${index3}`, className: "text-xs" }, "Question Type"), /* @__PURE__ */ React169__namespace.default.createElement(
-        Select2,
-        {
-          value: plannedQ.plannedQuestionType,
-          onValueChange: (value) => handleChangePlannedQuestionType(index3, value)
-        },
-        /* @__PURE__ */ React169__namespace.default.createElement(SelectTrigger2, { id: `review-qtype-${index3}`, className: "h-9 text-xs" }, /* @__PURE__ */ React169__namespace.default.createElement(SelectValue2, null)),
-        /* @__PURE__ */ React169__namespace.default.createElement(SelectContent2, null, availableQuestionTypesForFullQuiz.map((qType) => /* @__PURE__ */ React169__namespace.default.createElement(SelectItem2, { key: qType.value, value: qType.value, className: "text-xs" }, qType.label)))
-      )), /* @__PURE__ */ React169__namespace.default.createElement("div", null, /* @__PURE__ */ React169__namespace.default.createElement(Label2, { className: "text-xs block" }, "Bloom Level"), /* @__PURE__ */ React169__namespace.default.createElement("p", { className: "text-xs p-2 h-9 border rounded-md bg-secondary/50 flex items-center capitalize" }, plannedQ.plannedBloomLevel)))))))) : /* @__PURE__ */ React169__namespace.default.createElement("p", { className: "text-muted-foreground" }, "No quiz plan generated or plan is empty."), error && /* @__PURE__ */ React169__namespace.default.createElement("p", { className: "text-sm text-destructive flex items-center mt-2" }, /* @__PURE__ */ React169__namespace.default.createElement(TriangleAlert, { className: "mr-1 h-4 w-4" }), " ", error));
+      return /* @__PURE__ */ React169__namespace.default.createElement("div", { className: "space-y-4 py-4" }, /* @__PURE__ */ React169__namespace.default.createElement("h3", { className: "text-lg font-Medium mb-2 text-primary flex items-center" }, /* @__PURE__ */ React169__namespace.default.createElement(Eye, { className: "mr-2 h-5 w-5" }), " Review & Adjust AI Generated Quiz Plan"), /* @__PURE__ */ React169__namespace.default.createElement("p", { className: "text-sm text-muted-foreground" }, "The AI has proposed the following plan. You can change question types, reorder, or remove questions before final generation. Note: 'Drag and Drop' type questions in the plan will be created as placeholders and require manual authoring of items/zones/answers."), aiGeneratedPlan && aiGeneratedPlan.length > 0 ? /* @__PURE__ */ React169__namespace.default.createElement(ScrollArea2, { className: "max-h-[calc(60vh - 120px)] pr-3" }, /* @__PURE__ */ React169__namespace.default.createElement("div", { className: "space-y-3" }, aiGeneratedPlan.map((plannedQ, index3) => /* @__PURE__ */ React169__namespace.default.createElement(Card, { key: `planned-${index3}-${plannedQ.plannedTopic.replace(/\s/g, "")}`, className: "p-3" }, /* @__PURE__ */ React169__namespace.default.createElement(CardContent, { className: "p-0 space-y-2" }, /* @__PURE__ */ React169__namespace.default.createElement("div", { className: "flex justify-between items-start" }, /* @__PURE__ */ React169__namespace.default.createElement("p", { className: "font-semibold text-sm" }, "Q", index3 + 1, ": ", plannedQ.plannedTopic), /* @__PURE__ */ React169__namespace.default.createElement("div", { className: "flex space-x-1" }, /* @__PURE__ */ React169__namespace.default.createElement(Button, { variant: "ghost", size: "icon", className: "h-7 w-7", onClick: () => handleMovePlannedQuestion(index3, "up"), disabled: index3 === 0 }, /* @__PURE__ */ React169__namespace.default.createElement(ArrowUp, { className: "h-4 w-4" })), /* @__PURE__ */ React169__namespace.default.createElement(Button, { variant: "ghost", size: "icon", className: "h-7 w-7", onClick: () => handleMovePlannedQuestion(index3, "down"), disabled: index3 === aiGeneratedPlan.length - 1 }, /* @__PURE__ */ React169__namespace.default.createElement(ArrowDown, { className: "h-4 w-4" })), /* @__PURE__ */ React169__namespace.default.createElement(Button, { variant: "ghost", size: "icon", className: "h-7 w-7 text-destructive", onClick: () => handleRemovePlannedQuestion(index3) }, /* @__PURE__ */ React169__namespace.default.createElement(Trash2, { className: "h-4 w-4" })))), /* @__PURE__ */ React169__namespace.default.createElement("div", { className: "grid grid-cols-2 gap-3 items-end" }, /* @__PURE__ */ React169__namespace.default.createElement("div", null, /* @__PURE__ */ React169__namespace.default.createElement(Label2, { htmlFor: `review-qtype-${index3}`, className: "text-xs" }, "Question Type"), /* @__PURE__ */ React169__namespace.default.createElement(Select2, { value: plannedQ.plannedQuestionType, onValueChange: (value) => handleChangePlannedQuestionType(index3, value) }, /* @__PURE__ */ React169__namespace.default.createElement(SelectTrigger2, { id: `review-qtype-${index3}`, className: "h-9 text-xs" }, /* @__PURE__ */ React169__namespace.default.createElement(SelectValue2, null)), /* @__PURE__ */ React169__namespace.default.createElement(SelectContent2, null, availableQuestionTypesForFullQuiz.map((qType) => /* @__PURE__ */ React169__namespace.default.createElement(SelectItem2, { key: qType.value, value: qType.value, className: "text-xs" }, qType.label))))), /* @__PURE__ */ React169__namespace.default.createElement("div", null, /* @__PURE__ */ React169__namespace.default.createElement(Label2, { className: "text-xs block" }, "Bloom Level"), /* @__PURE__ */ React169__namespace.default.createElement("p", { className: "text-xs p-2 h-9 border rounded-md bg-secondary/50 flex items-center capitalize" }, plannedQ.plannedBloomLevel)))))))) : /* @__PURE__ */ React169__namespace.default.createElement("p", { className: "text-muted-foreground" }, "No quiz plan generated or plan is empty."), error && /* @__PURE__ */ React169__namespace.default.createElement("p", { className: "text-sm text-destructive flex items-center mt-2" }, /* @__PURE__ */ React169__namespace.default.createElement(TriangleAlert, { className: "mr-1 h-4 w-4" }), " ", error));
     }
-    return /* @__PURE__ */ React169__namespace.default.createElement(ScrollArea2, { className: "max-h-[calc(70vh - 100px)] pl-4 pr-3 py-1" }, /* @__PURE__ */ React169__namespace.default.createElement("div", { className: "space-y-4 py-1 px-2" }, !geminiApiKeyExists && /* @__PURE__ */ React169__namespace.default.createElement("div", { className: "p-3 mb-4 border border-amber-500 bg-amber-50 rounded-md text-amber-700" }, /* @__PURE__ */ React169__namespace.default.createElement("div", { className: "flex items-start" }, /* @__PURE__ */ React169__namespace.default.createElement(TriangleAlert, { className: "h-5 w-5 mr-2 mt-0.5 flex-shrink-0" }), /* @__PURE__ */ React169__namespace.default.createElement("div", null, /* @__PURE__ */ React169__namespace.default.createElement("p", { className: "font-semibold" }, "Gemini API Key Required"), /* @__PURE__ */ React169__namespace.default.createElement("p", { className: "text-xs" }, "To use AI quiz generation, please set your Google Gemini API Key."), /* @__PURE__ */ React169__namespace.default.createElement(
-      Button,
-      {
-        variant: "link",
-        className: "p-0 h-auto text-xs text-amber-700 hover:text-amber-800 mt-1",
-        onClick: () => setIsApiKeyManagerModalOpen(true)
-      },
-      /* @__PURE__ */ React169__namespace.default.createElement(Settings, { className: "mr-1 h-3 w-3" }),
-      " Set API Key Now"
-    )))), /* @__PURE__ */ React169__namespace.default.createElement("div", null, /* @__PURE__ */ React169__namespace.default.createElement(Label2, { htmlFor: "total-questions" }, "Total Number of Questions (1-100)"), /* @__PURE__ */ React169__namespace.default.createElement(
-      Input,
-      {
-        id: "total-questions",
-        type: "number",
-        value: totalQuestions,
-        onChange: handleTotalQuestionsChange,
-        min: "1",
-        max: "100"
-      }
-    )), /* @__PURE__ */ React169__namespace.default.createElement("fieldset", { className: "border p-3 rounded-md" }, /* @__PURE__ */ React169__namespace.default.createElement("legend", { className: "text-sm font-Medium px-1" }, "Topic Distribution"), topics.map((topicItem, index3) => /* @__PURE__ */ React169__namespace.default.createElement("div", { key: topicItem.id, className: "flex items-center gap-2 mb-2" }, /* @__PURE__ */ React169__namespace.default.createElement(
-      Input,
-      {
-        type: "text",
-        placeholder: `Topic ${index3 + 1}`,
-        value: topicItem.topic,
-        onChange: (e3) => handleTopicChange(topicItem.id, "topic", e3.target.value),
-        className: "flex-grow"
-      }
-    ), /* @__PURE__ */ React169__namespace.default.createElement(
-      Input,
-      {
-        type: "number",
-        placeholder: "Ratio %",
-        value: topicItem.ratio,
-        onChange: (e3) => handleTopicChange(topicItem.id, "ratio", parseInt(e3.target.value, 10) || 0),
-        className: "w-24",
-        min: "0",
-        max: "100"
-      }
-    ), /* @__PURE__ */ React169__namespace.default.createElement(Button, { type: "button", variant: "ghost", size: "icon", onClick: () => removeTopic(topicItem.id), disabled: topics.length <= 1 }, /* @__PURE__ */ React169__namespace.default.createElement(Trash2, { className: "h-4 w-4 text-destructive" })))), /* @__PURE__ */ React169__namespace.default.createElement(Button, { type: "button", variant: "outline", size: "sm", onClick: addTopic }, /* @__PURE__ */ React169__namespace.default.createElement(CirclePlus, { className: "mr-2 h-4 w-4" }), " Add Topic")), /* @__PURE__ */ React169__namespace.default.createElement("fieldset", { className: "border p-3 rounded-md" }, /* @__PURE__ */ React169__namespace.default.createElement("legend", { className: "text-sm font-Medium px-1" }, "Bloom Level Distribution"), bloomLevels.map((bloomItem) => /* @__PURE__ */ React169__namespace.default.createElement("div", { key: bloomItem.id, className: "flex items-center gap-2 mb-2" }, /* @__PURE__ */ React169__namespace.default.createElement(Label2, { className: "w-32 capitalize flex-shrink-0" }, bloomItem.level), /* @__PURE__ */ React169__namespace.default.createElement(
-      Input,
-      {
-        type: "number",
-        placeholder: "Ratio %",
-        value: bloomItem.ratio,
-        onChange: (e3) => handleBloomRatioChange(bloomItem.id, parseInt(e3.target.value, 10) || 0),
-        className: "w-24",
-        min: "0",
-        max: "100"
-      }
-    )))), /* @__PURE__ */ React169__namespace.default.createElement("fieldset", { className: "border p-3 rounded-md" }, /* @__PURE__ */ React169__namespace.default.createElement("legend", { className: "text-sm font-Medium px-1" }, "Relevant Contexts (Optional, Select Multiple)"), /* @__PURE__ */ React169__namespace.default.createElement("div", { className: "grid grid-cols-2 gap-2 mt-2 max-h-40 overflow-y-auto" }, contextOptions.filter((opt) => opt.contextId !== "__none__" && opt.contextId !== "__custom__").map((opt) => /* @__PURE__ */ React169__namespace.default.createElement("div", { key: opt.contextId, className: "flex items-center space-x-2" }, /* @__PURE__ */ React169__namespace.default.createElement(
-      Checkbox2,
-      {
-        id: `ctx-full-${opt.contextId}`,
-        checked: selectedContextIds.includes(opt.contextId),
-        onCheckedChange: () => handleContextToggle(opt.contextId)
-      }
-    ), /* @__PURE__ */ React169__namespace.default.createElement(Label2, { htmlFor: `ctx-full-${opt.contextId}`, className: "text-xs font-normal cursor-pointer" }, opt.contextDescription, " (", opt.shortContextId, ")")))), /* @__PURE__ */ React169__namespace.default.createElement("div", { className: "mt-2" }, /* @__PURE__ */ React169__namespace.default.createElement(
-      Checkbox2,
-      {
-        id: `ctx-full-__custom__`,
-        checked: selectedContextIds.includes("__custom__"),
-        onCheckedChange: () => handleContextToggle("__custom__")
-      }
-    ), /* @__PURE__ */ React169__namespace.default.createElement(Label2, { htmlFor: `ctx-full-__custom__`, className: "text-xs font-normal cursor-pointer ml-2" }, "Other (Custom Input)")), selectedContextIds.includes("__custom__") && /* @__PURE__ */ React169__namespace.default.createElement(
-      Textarea,
-      {
-        value: customContextInput,
-        onChange: (e3) => setCustomContextInput(e3.target.value),
-        placeholder: "Enter your specific custom context here...",
-        className: "min-h-[60px] mt-2 text-sm"
-      }
-    )), /* @__PURE__ */ React169__namespace.default.createElement("fieldset", { className: "border p-3 rounded-md" }, /* @__PURE__ */ React169__namespace.default.createElement("legend", { className: "text-sm font-Medium px-1" }, "Question Types to Use (Select Multiple)"), /* @__PURE__ */ React169__namespace.default.createElement("div", { className: "grid grid-cols-2 gap-2 mt-2 max-h-40 overflow-y-auto" }, availableQuestionTypesForFullQuiz.map((qType) => /* @__PURE__ */ React169__namespace.default.createElement("div", { key: qType.value, className: "flex items-center space-x-2" }, /* @__PURE__ */ React169__namespace.default.createElement(
-      Checkbox2,
-      {
-        id: `qtype-full-${qType.value}`,
-        checked: selectedQuestionTypes.includes(qType.value),
-        onCheckedChange: () => handleQuestionTypeToggle(qType.value)
-      }
-    ), /* @__PURE__ */ React169__namespace.default.createElement(Label2, { htmlFor: `qtype-full-${qType.value}`, className: "text-xs font-normal cursor-pointer" }, qType.label))))), /* @__PURE__ */ React169__namespace.default.createElement("div", { className: "flex items-center space-x-2 pt-2" }, /* @__PURE__ */ React169__namespace.default.createElement(
-      Checkbox2,
-      {
-        id: "authorize-ai-skip-review",
-        checked: authorizeAISkipReview,
-        onCheckedChange: (checked) => setAuthorizeAISkipReview(!!checked)
-      }
-    ), /* @__PURE__ */ React169__namespace.default.createElement(Label2, { htmlFor: "authorize-ai-skip-review", className: "text-sm font-normal" }, "Authorize AI (Skip Review & Generate Directly)")), error && /* @__PURE__ */ React169__namespace.default.createElement("p", { className: "text-sm text-destructive flex items-center mt-2" }, /* @__PURE__ */ React169__namespace.default.createElement(TriangleAlert, { className: "mr-1 h-4 w-4" }), " ", error)));
+    return /* @__PURE__ */ React169__namespace.default.createElement(ScrollArea2, { className: "max-h-[calc(70vh - 100px)] pl-4 pr-3 py-1" }, /* @__PURE__ */ React169__namespace.default.createElement("div", { className: "space-y-4 py-1 px-2" }, !geminiApiKeyExists && /* @__PURE__ */ React169__namespace.default.createElement("div", { className: "p-3 mb-4 border border-amber-500 bg-amber-50 rounded-md text-amber-700" }, /* @__PURE__ */ React169__namespace.default.createElement("div", { className: "flex items-start" }, /* @__PURE__ */ React169__namespace.default.createElement(TriangleAlert, { className: "h-5 w-5 mr-2 mt-0.5 flex-shrink-0" }), /* @__PURE__ */ React169__namespace.default.createElement("div", null, /* @__PURE__ */ React169__namespace.default.createElement("p", { className: "font-semibold" }, "Gemini API Key Required"), /* @__PURE__ */ React169__namespace.default.createElement("p", { className: "text-xs" }, "To use AI quiz generation, please set your Google Gemini API Key."), /* @__PURE__ */ React169__namespace.default.createElement(Button, { variant: "link", className: "p-0 h-auto text-xs text-amber-700 hover:text-amber-800 mt-1", onClick: () => setIsApiKeyManagerModalOpen(true) }, /* @__PURE__ */ React169__namespace.default.createElement(Settings, { className: "mr-1 h-3 w-3" }), " Set API Key Now")))), /* @__PURE__ */ React169__namespace.default.createElement("div", null, /* @__PURE__ */ React169__namespace.default.createElement(Label2, { htmlFor: "total-questions" }, "Total Number of Questions (1-", maxQuestions, ")"), /* @__PURE__ */ React169__namespace.default.createElement(Input, { id: "total-questions", type: "number", value: totalQuestions, onChange: handleTotalQuestionsChange, min: "1", max: maxQuestions })), /* @__PURE__ */ React169__namespace.default.createElement("fieldset", { className: "border p-3 rounded-md" }, /* @__PURE__ */ React169__namespace.default.createElement("legend", { className: "text-sm font-Medium px-1" }, "Topic Distribution"), topics.map((topicItem, index3) => /* @__PURE__ */ React169__namespace.default.createElement("div", { key: topicItem.id, className: "flex items-center gap-2 mb-2" }, /* @__PURE__ */ React169__namespace.default.createElement(Input, { type: "text", placeholder: `Topic ${index3 + 1}`, value: topicItem.topic, onChange: (e3) => handleTopicChange(topicItem.id, "topic", e3.target.value), className: "flex-grow" }), /* @__PURE__ */ React169__namespace.default.createElement(Input, { type: "number", placeholder: "Ratio %", value: topicItem.ratio, onChange: (e3) => handleTopicChange(topicItem.id, "ratio", parseInt(e3.target.value, 10) || 0), className: "w-24", min: "0", max: "100" }), /* @__PURE__ */ React169__namespace.default.createElement(Button, { type: "button", variant: "ghost", size: "icon", onClick: () => removeTopic(topicItem.id), disabled: topics.length <= 1 }, /* @__PURE__ */ React169__namespace.default.createElement(Trash2, { className: "h-4 w-4 text-destructive" })))), /* @__PURE__ */ React169__namespace.default.createElement(Button, { type: "button", variant: "outline", size: "sm", onClick: addTopic }, /* @__PURE__ */ React169__namespace.default.createElement(CirclePlus, { className: "mr-2 h-4 w-4" }), " Add Topic")), /* @__PURE__ */ React169__namespace.default.createElement("fieldset", { className: "border p-3 rounded-md" }, /* @__PURE__ */ React169__namespace.default.createElement("legend", { className: "text-sm font-Medium px-1" }, "Bloom Level Distribution"), bloomLevels.map((bloomItem) => /* @__PURE__ */ React169__namespace.default.createElement("div", { key: bloomItem.id, className: "flex items-center gap-2 mb-2" }, /* @__PURE__ */ React169__namespace.default.createElement(Label2, { className: "w-32 capitalize flex-shrink-0" }, bloomItem.level), /* @__PURE__ */ React169__namespace.default.createElement(Input, { type: "number", placeholder: "Ratio %", value: bloomItem.ratio, onChange: (e3) => handleBloomRatioChange(bloomItem.id, parseInt(e3.target.value, 10) || 0), className: "w-24", min: "0", max: "100" })))), /* @__PURE__ */ React169__namespace.default.createElement("fieldset", { className: "border p-3 rounded-md" }, /* @__PURE__ */ React169__namespace.default.createElement("legend", { className: "text-sm font-Medium px-1" }, "Relevant Contexts (Optional, Select Multiple)"), /* @__PURE__ */ React169__namespace.default.createElement("div", { className: "grid grid-cols-2 gap-2 mt-2 max-h-40 overflow-y-auto" }, contextOptions.filter((opt) => opt.contextId !== "__none__" && opt.contextId !== "__custom__").map((opt) => /* @__PURE__ */ React169__namespace.default.createElement("div", { key: opt.contextId, className: "flex items-center space-x-2" }, /* @__PURE__ */ React169__namespace.default.createElement(Checkbox2, { id: `ctx-full-${opt.contextId}`, checked: selectedContextIds.includes(opt.contextId), onCheckedChange: () => handleContextToggle(opt.contextId) }), /* @__PURE__ */ React169__namespace.default.createElement(Label2, { htmlFor: `ctx-full-${opt.contextId}`, className: "text-xs font-normal cursor-pointer" }, opt.contextDescription, " (", opt.shortContextId, ")"))), /* @__PURE__ */ React169__namespace.default.createElement("div", { className: "mt-2" }, /* @__PURE__ */ React169__namespace.default.createElement(Checkbox2, { id: `ctx-full-__custom__`, checked: selectedContextIds.includes("__custom__"), onCheckedChange: () => handleContextToggle("__custom__") }), /* @__PURE__ */ React169__namespace.default.createElement(Label2, { htmlFor: `ctx-full-__custom__`, className: "text-xs font-normal cursor-pointer ml-2" }, "Other (Custom Input)")), selectedContextIds.includes("__custom__") && /* @__PURE__ */ React169__namespace.default.createElement(Textarea, { value: customContextInput, onChange: (e3) => setCustomContextInput(e3.target.value), placeholder: "Enter your specific custom context here...", className: "min-h-[60px] mt-2 text-sm" }))), /* @__PURE__ */ React169__namespace.default.createElement("fieldset", { className: "border p-3 rounded-md" }, /* @__PURE__ */ React169__namespace.default.createElement("legend", { className: "text-sm font-Medium px-1" }, "Question Types to Use (Select Multiple)"), /* @__PURE__ */ React169__namespace.default.createElement("div", { className: "grid grid-cols-2 gap-2 mt-2 max-h-40 overflow-y-auto" }, availableQuestionTypesForFullQuiz.map((qType) => /* @__PURE__ */ React169__namespace.default.createElement("div", { key: qType.value, className: "flex items-center space-x-2" }, /* @__PURE__ */ React169__namespace.default.createElement(Checkbox2, { id: `qtype-full-${qType.value}`, checked: selectedQuestionTypes.includes(qType.value), onCheckedChange: () => handleQuestionTypeToggle(qType.value) }), /* @__PURE__ */ React169__namespace.default.createElement(Label2, { htmlFor: `qtype-full-${qType.value}`, className: "text-xs font-normal cursor-pointer" }, qType.label))))), /* @__PURE__ */ React169__namespace.default.createElement("div", { className: "flex items-center space-x-2 pt-2" }, /* @__PURE__ */ React169__namespace.default.createElement(Checkbox2, { id: "authorize-ai-skip-review", checked: authorizeAISkipReview, onCheckedChange: (checked) => setAuthorizeAISkipReview(!!checked) }), /* @__PURE__ */ React169__namespace.default.createElement(Label2, { htmlFor: "authorize-ai-skip-review", className: "text-sm font-normal" }, "Authorize AI (Skip Review & Generate Directly)")), error && /* @__PURE__ */ React169__namespace.default.createElement("p", { className: "text-sm text-destructive flex items-center mt-2" }, /* @__PURE__ */ React169__namespace.default.createElement(TriangleAlert, { className: "mr-1 h-4 w-4" }), " ", error)));
   };
   return /* @__PURE__ */ React169__namespace.default.createElement(React169__namespace.default.Fragment, null, /* @__PURE__ */ React169__namespace.default.createElement(Dialog2, { open: isOpen, onOpenChange: (open) => !open && onClose() }, /* @__PURE__ */ React169__namespace.default.createElement(DialogContent2, { className: "sm:max-w-[650px] md:max-w-[750px] lg:max-w-[800px] max-h-[90vh] overflow-y-auto" }, /* @__PURE__ */ React169__namespace.default.createElement(DialogHeader, null, /* @__PURE__ */ React169__namespace.default.createElement(DialogTitle2, { className: "flex items-center font-headline text-2xl" }, /* @__PURE__ */ React169__namespace.default.createElement(FileText, { className: "mr-2 h-6 w-6 text-primary" }), " Generate Full Quiz with AI"), /* @__PURE__ */ React169__namespace.default.createElement(DialogDescription2, null, currentStage === "input" && "Define parameters for AI to generate a quiz plan.", currentStage === "review" && "Review and adjust the AI-generated quiz plan before generating questions.", currentStage === "generating" && "AI is working... Please wait.")), renderContent3(), /* @__PURE__ */ React169__namespace.default.createElement(DialogFooter, { className: "pt-4 border-t" }, /* @__PURE__ */ React169__namespace.default.createElement(DialogClose2, { asChild: true }, /* @__PURE__ */ React169__namespace.default.createElement(Button, { type: "button", variant: "outline", onClick: onClose }, "Cancel")), currentStage === "input" && /* @__PURE__ */ React169__namespace.default.createElement(Button, { type: "button", onClick: handleSubmitPlanGeneration, disabled: isLoading || !geminiApiKeyExists }, isLoading ? /* @__PURE__ */ React169__namespace.default.createElement(LoaderCircle, { className: "mr-2 h-4 w-4 animate-spin" }) : /* @__PURE__ */ React169__namespace.default.createElement(WandSparkles, { className: "mr-2 h-4 w-4" }), authorizeAISkipReview ? "Generate Quiz Directly" : "Generate Quiz Plan"), currentStage === "review" && !isLoading && /* @__PURE__ */ React169__namespace.default.createElement(Button, { type: "button", onClick: handleGenerateQuestionsFromReviewedPlan, disabled: isLoading || !aiGeneratedPlan || aiGeneratedPlan.length === 0 || !geminiApiKeyExists }, isLoading ? /* @__PURE__ */ React169__namespace.default.createElement(LoaderCircle, { className: "mr-2 h-4 w-4 animate-spin" }) : /* @__PURE__ */ React169__namespace.default.createElement(WandSparkles, { className: "mr-2 h-4 w-4" }), "Generate Questions from Plan"), currentStage === "generating" && isLoading && /* @__PURE__ */ React169__namespace.default.createElement(Button, { type: "button", disabled: true }, /* @__PURE__ */ React169__namespace.default.createElement(LoaderCircle, { className: "mr-2 h-4 w-4 animate-spin" }), "Generating... Please Wait")))), /* @__PURE__ */ React169__namespace.default.createElement(APIKeyManagerModal, { isOpen: isApiKeyManagerModalOpen, onClose: handleApiKeyModalClose }));
 };
@@ -138319,58 +138227,74 @@ var AVAILABLE_LANGUAGES = [
   { value: "Vietnamese", label: "Ti\u1EBFng Vi\u1EC7t" },
   { value: "English", label: "English" }
 ];
+var ALL_QUESTION_TYPE_LABELS = {
+  multiple_choice: "Multiple Choice",
+  multiple_response: "Multiple Response",
+  true_false: "True/False",
+  short_answer: "Short Answer",
+  numeric: "Numeric",
+  fill_in_the_blanks: "Fill in the Blanks",
+  sequence: "Sequence",
+  matching: "Matching",
+  drag_and_drop: "Drag & Drop",
+  hotspot: "Hotspot",
+  blockly_programming: "Blockly",
+  scratch_programming: "Scratch",
+  coding: "Coding"
+};
 var PracticeSetup = ({
   onStartPractice,
   isGenerating,
   initialLOs,
   initialDifficulty,
-  initialLanguage
+  initialLanguage,
+  maxQuestions = 20,
+  // Default max questions
+  allowedQuestionTypes = ["true_false", "multiple_choice", "multiple_response"]
+  // Default allowed types
 }) => {
   const { t: t4 } = useTranslation();
   const [subjects, setSubjects] = React169.useState([]);
-  const [categories, setCategories] = React169.useState([]);
-  const [topics, setTopics] = React169.useState([]);
+  const [categoriesBySubject, setCategoriesBySubject] = React169.useState({});
+  const [topicsByCategory, setTopicsByCategory] = React169.useState({});
   const [hasData, setHasData] = React169.useState(false);
   const [selectedSubject, setSelectedSubject] = React169.useState("");
-  const [selectedCategory, setSelectedCategory] = React169.useState("");
   const [selectedTopics, setSelectedTopics] = React169.useState(/* @__PURE__ */ new Set());
   const [selectedLanguage, setSelectedLanguage] = React169.useState(AVAILABLE_LANGUAGES[0].value);
   const [selectedDifficulty, setSelectedDifficulty] = React169.useState("");
-  const [includeCodingQuestions, setIncludeCodingQuestions] = React169.useState(false);
-  const [numCodingQuestions, setNumCodingQuestions] = React169.useState(1);
+  const [numQuestions, setNumQuestions] = React169.useState(10);
+  const [selectedQuestionTypes, setSelectedQuestionTypes] = React169.useState(new Set(allowedQuestionTypes));
   React169.useEffect(() => {
-    const allSubjects = TopicDataService.getSubjects();
-    setHasData(allSubjects.length > 0);
-    setSubjects(allSubjects);
+    const allLOs = TopicDataService.getData();
+    if (allLOs.length > 0) {
+      setHasData(true);
+      const uniqueSubjects = [...new Set(allLOs.map((lo) => lo.subject))].sort();
+      setSubjects(uniqueSubjects);
+      const catsBySub = {};
+      uniqueSubjects.forEach((sub) => {
+        catsBySub[sub] = [...new Set(allLOs.filter((lo) => lo.subject === sub).map((lo) => lo.category))].sort();
+      });
+      setCategoriesBySubject(catsBySub);
+      const topsByCat = {};
+      allLOs.forEach((lo) => {
+        if (!topsByCat[lo.category]) {
+          topsByCat[lo.category] = [];
+        }
+        topsByCat[lo.category].push(lo.topic);
+      });
+      Object.keys(topsByCat).forEach((cat) => {
+        topsByCat[cat] = [...new Set(topsByCat[cat])].sort();
+      });
+      setTopicsByCategory(topsByCat);
+    }
     if (initialLOs && initialLOs.length > 0) {
       const firstLO = initialLOs[0];
       setSelectedSubject(firstLO.subject);
-      setSelectedCategory(firstLO.category);
       setSelectedTopics(new Set(initialLOs.map((lo) => lo.topic)));
       setSelectedDifficulty(initialDifficulty || "Medium");
       setSelectedLanguage(initialLanguage || AVAILABLE_LANGUAGES[0].value);
     }
   }, [initialLOs, initialDifficulty, initialLanguage]);
-  React169.useEffect(() => {
-    if (selectedSubject) {
-      const filteredCategories = TopicDataService.getCategoriesBySubject(selectedSubject);
-      setCategories(filteredCategories);
-      if (!initialLOs) {
-        setSelectedCategory("");
-        setTopics([]);
-        setSelectedTopics(/* @__PURE__ */ new Set());
-      }
-    }
-  }, [selectedSubject, initialLOs]);
-  React169.useEffect(() => {
-    if (selectedCategory) {
-      const filteredTopics = TopicDataService.getTopicsByCategory(selectedCategory);
-      setTopics(filteredTopics);
-      if (!initialLOs) {
-        setSelectedTopics(/* @__PURE__ */ new Set());
-      }
-    }
-  }, [selectedCategory, initialLOs]);
   const handleTopicToggle = React169.useCallback((topic, checked) => {
     setSelectedTopics((prevSelected) => {
       const newSelected = new Set(prevSelected);
@@ -138379,37 +138303,36 @@ var PracticeSetup = ({
       return newSelected;
     });
   }, []);
+  const handleQuestionTypeToggle = React169.useCallback((type, checked) => {
+    setSelectedQuestionTypes((prev) => {
+      const newSet = new Set(prev);
+      if (checked) newSet.add(type);
+      else newSet.delete(type);
+      return newSet;
+    });
+  }, []);
   const handleStartClick = React169.useCallback(() => {
-    if (selectedTopics.size > 0 && selectedDifficulty && selectedLanguage) {
+    if (selectedTopics.size > 0 && selectedDifficulty && selectedLanguage && numQuestions > 0 && selectedQuestionTypes.size > 0) {
       const selectedLOs = TopicDataService.getLearningObjectivesByTopics(Array.from(selectedTopics));
-      onStartPractice(selectedLOs, selectedDifficulty, selectedLanguage, includeCodingQuestions, numCodingQuestions);
+      onStartPractice(selectedLOs, selectedDifficulty, selectedLanguage, numQuestions, Array.from(selectedQuestionTypes));
     }
-  }, [onStartPractice, selectedDifficulty, selectedLanguage, selectedTopics, includeCodingQuestions, numCodingQuestions]);
-  const handleNumCodingChange = (e3) => {
+  }, [onStartPractice, selectedDifficulty, selectedLanguage, selectedTopics, numQuestions, selectedQuestionTypes]);
+  const handleNumQuestionsChange = (e3) => {
     let value = parseInt(e3.target.value, 10);
     if (isNaN(value) || value < 1) value = 1;
-    if (value > 3) value = 3;
-    setNumCodingQuestions(value);
+    if (value > maxQuestions) value = maxQuestions;
+    setNumQuestions(value);
   };
   const isReadyToStart = React169.useMemo(() => {
-    return selectedTopics.size > 0 && !!selectedDifficulty && !!selectedLanguage && !isGenerating;
-  }, [selectedTopics, selectedDifficulty, selectedLanguage, isGenerating]);
+    return selectedTopics.size > 0 && !!selectedDifficulty && !!selectedLanguage && numQuestions > 0 && selectedQuestionTypes.size > 0 && !isGenerating;
+  }, [selectedTopics, selectedDifficulty, selectedLanguage, numQuestions, selectedQuestionTypes, isGenerating]);
   if (!hasData) {
     return /* @__PURE__ */ React169__namespace.default.createElement(Card, { className: "w-full max-w-2xl mx-auto" }, /* @__PURE__ */ React169__namespace.default.createElement(CardHeader, null, /* @__PURE__ */ React169__namespace.default.createElement(CardTitle, { className: "flex items-center text-2xl font-headline" }, /* @__PURE__ */ React169__namespace.default.createElement(BrainCircuit, { className: "mr-3 h-6 w-6 text-primary" }), t4("practiceFlow.setup.title"))), /* @__PURE__ */ React169__namespace.default.createElement(CardContent, null, /* @__PURE__ */ React169__namespace.default.createElement(Alert, { variant: "destructive" }, /* @__PURE__ */ React169__namespace.default.createElement(CircleAlert, { className: "h-4 w-4" }), /* @__PURE__ */ React169__namespace.default.createElement(AlertTitle, null, "No Learning Objective Data Found"), /* @__PURE__ */ React169__namespace.default.createElement(AlertDescription, null, 'Please import your curriculum data from a TSV file in the "Manage Topics" section before you can start a practice session.'))));
   }
-  return /* @__PURE__ */ React169__namespace.default.createElement(Card, { className: "w-full max-w-2xl mx-auto" }, /* @__PURE__ */ React169__namespace.default.createElement(CardHeader, null, /* @__PURE__ */ React169__namespace.default.createElement(CardTitle, { className: "flex items-center text-2xl font-headline" }, /* @__PURE__ */ React169__namespace.default.createElement(BrainCircuit, { className: "mr-3 h-6 w-6 text-primary" }), t4("practiceFlow.setup.title")), /* @__PURE__ */ React169__namespace.default.createElement(CardDescription, null, t4("practiceFlow.setup.description"))), /* @__PURE__ */ React169__namespace.default.createElement(CardContent, { className: "space-y-6" }, /* @__PURE__ */ React169__namespace.default.createElement("div", { className: "space-y-2" }, /* @__PURE__ */ React169__namespace.default.createElement(Label2, { htmlFor: "subject-select", className: "font-semibold" }, t4("practiceFlow.setup.step1_title")), /* @__PURE__ */ React169__namespace.default.createElement(Select2, { value: selectedSubject, onValueChange: setSelectedSubject, disabled: isGenerating }, /* @__PURE__ */ React169__namespace.default.createElement(SelectTrigger2, { id: "subject-select" }, /* @__PURE__ */ React169__namespace.default.createElement(SelectValue2, { placeholder: t4("practiceFlow.setup.step1_placeholder") })), /* @__PURE__ */ React169__namespace.default.createElement(SelectContent2, null, subjects.map((subject) => /* @__PURE__ */ React169__namespace.default.createElement(SelectItem2, { key: subject, value: subject }, subject))))), selectedSubject && /* @__PURE__ */ React169__namespace.default.createElement("div", { className: "space-y-2 animate-in fade-in duration-300" }, /* @__PURE__ */ React169__namespace.default.createElement(Label2, { htmlFor: "category-select", className: "font-semibold" }, t4("practiceFlow.setup.step2_title")), /* @__PURE__ */ React169__namespace.default.createElement(Select2, { value: selectedCategory, onValueChange: setSelectedCategory, disabled: !selectedSubject || isGenerating }, /* @__PURE__ */ React169__namespace.default.createElement(SelectTrigger2, { id: "category-select" }, /* @__PURE__ */ React169__namespace.default.createElement(SelectValue2, { placeholder: t4("practiceFlow.setup.step2_placeholder") })), /* @__PURE__ */ React169__namespace.default.createElement(SelectContent2, null, categories.map((category) => /* @__PURE__ */ React169__namespace.default.createElement(SelectItem2, { key: category, value: category }, category))))), selectedCategory && /* @__PURE__ */ React169__namespace.default.createElement("div", { className: "space-y-2 animate-in fade-in duration-500" }, /* @__PURE__ */ React169__namespace.default.createElement(Label2, { className: "font-semibold" }, t4("practiceFlow.setup.step3_title")), /* @__PURE__ */ React169__namespace.default.createElement(ScrollArea2, { className: "h-48 w-full rounded-md border p-4" }, topics.length > 0 ? /* @__PURE__ */ React169__namespace.default.createElement("div", { className: "space-y-2" }, topics.map((topic) => /* @__PURE__ */ React169__namespace.default.createElement("div", { key: topic, className: "flex items-center space-x-2" }, /* @__PURE__ */ React169__namespace.default.createElement(Checkbox2, { id: `topic-${topic.replace(/\s/g, "-")}`, checked: selectedTopics.has(topic), onCheckedChange: (checked) => handleTopicToggle(topic, !!checked), disabled: isGenerating }), /* @__PURE__ */ React169__namespace.default.createElement(Label2, { htmlFor: `topic-${topic.replace(/\s/g, "-")}`, className: "font-normal cursor-pointer" }, topic)))) : /* @__PURE__ */ React169__namespace.default.createElement("p", { className: "text-sm text-muted-foreground" }, t4("practiceFlow.setup.step3_empty")))), selectedTopics.size > 0 && /* @__PURE__ */ React169__namespace.default.createElement("div", { className: "space-y-4 p-4 border rounded-lg animate-in fade-in duration-700" }, /* @__PURE__ */ React169__namespace.default.createElement("div", { className: "grid grid-cols-1 sm:grid-cols-2 gap-4" }, /* @__PURE__ */ React169__namespace.default.createElement("div", { className: "space-y-2" }, /* @__PURE__ */ React169__namespace.default.createElement(Label2, { htmlFor: "language-select", className: "font-semibold" }, t4("practiceFlow.setup.step4_title")), /* @__PURE__ */ React169__namespace.default.createElement(Select2, { value: selectedLanguage, onValueChange: setSelectedLanguage, disabled: isGenerating }, /* @__PURE__ */ React169__namespace.default.createElement(SelectTrigger2, { id: "language-select" }, /* @__PURE__ */ React169__namespace.default.createElement(SelectValue2, { placeholder: t4("practiceFlow.setup.step4_placeholder") })), /* @__PURE__ */ React169__namespace.default.createElement(SelectContent2, null, AVAILABLE_LANGUAGES.map((lang) => /* @__PURE__ */ React169__namespace.default.createElement(SelectItem2, { key: lang.value, value: lang.value }, lang.label))))), /* @__PURE__ */ React169__namespace.default.createElement("div", { className: "space-y-2" }, /* @__PURE__ */ React169__namespace.default.createElement(Label2, { htmlFor: "difficulty-select", className: "font-semibold" }, t4("practiceFlow.setup.step5_title")), /* @__PURE__ */ React169__namespace.default.createElement(Select2, { value: selectedDifficulty, onValueChange: (v) => setSelectedDifficulty(v), disabled: isGenerating }, /* @__PURE__ */ React169__namespace.default.createElement(SelectTrigger2, { id: "difficulty-select" }, /* @__PURE__ */ React169__namespace.default.createElement(SelectValue2, { placeholder: t4("practiceFlow.setup.step5_placeholder") })), /* @__PURE__ */ React169__namespace.default.createElement(SelectContent2, null, DIFFICULTY_LEVELS.map((level) => /* @__PURE__ */ React169__namespace.default.createElement(SelectItem2, { key: level, value: level }, level)))))), /* @__PURE__ */ React169__namespace.default.createElement("div", { className: "space-y-2 pt-4 border-t" }, /* @__PURE__ */ React169__namespace.default.createElement(Label2, { className: "font-semibold flex items-center" }, /* @__PURE__ */ React169__namespace.default.createElement(Code, { className: "mr-2 h-4 w-4" }), t4("practiceFlow.setup.step6_title")), /* @__PURE__ */ React169__namespace.default.createElement("div", { className: "flex items-center space-x-2" }, /* @__PURE__ */ React169__namespace.default.createElement(Checkbox2, { id: "include-coding", checked: includeCodingQuestions, onCheckedChange: (checked) => setIncludeCodingQuestions(!!checked), disabled: isGenerating }), /* @__PURE__ */ React169__namespace.default.createElement(Label2, { htmlFor: "include-coding", className: "font-normal cursor-pointer" }, t4("practiceFlow.setup.includeCoding"))), includeCodingQuestions && /* @__PURE__ */ React169__namespace.default.createElement("div", { className: "pl-6 animate-in fade-in duration-300" }, /* @__PURE__ */ React169__namespace.default.createElement(Label2, { htmlFor: "num-coding-questions" }, t4("practiceFlow.setup.numCoding")), /* @__PURE__ */ React169__namespace.default.createElement(
-    Input,
-    {
-      id: "num-coding-questions",
-      type: "number",
-      value: numCodingQuestions,
-      onChange: handleNumCodingChange,
-      min: "1",
-      max: "3",
-      className: "w-24 mt-1",
-      disabled: isGenerating
-    }
-  ))))), /* @__PURE__ */ React169__namespace.default.createElement(CardFooter, null, /* @__PURE__ */ React169__namespace.default.createElement(Button, { onClick: handleStartClick, disabled: !isReadyToStart, className: "w-full" }, isGenerating ? /* @__PURE__ */ React169__namespace.default.createElement(React169__namespace.default.Fragment, null, /* @__PURE__ */ React169__namespace.default.createElement(LoaderCircle, { className: "mr-2 h-4 w-4 animate-spin" }), t4("practiceFlow.setup.generatingButton")) : /* @__PURE__ */ React169__namespace.default.createElement(React169__namespace.default.Fragment, null, /* @__PURE__ */ React169__namespace.default.createElement(WandSparkles, { className: "mr-2 h-4 w-4" }), t4("practiceFlow.setup.startButton")))));
+  return /* @__PURE__ */ React169__namespace.default.createElement(Card, { className: "w-full max-w-2xl mx-auto" }, /* @__PURE__ */ React169__namespace.default.createElement(CardHeader, null, /* @__PURE__ */ React169__namespace.default.createElement(CardTitle, { className: "flex items-center text-2xl font-headline" }, /* @__PURE__ */ React169__namespace.default.createElement(BrainCircuit, { className: "mr-3 h-6 w-6 text-primary" }), t4("practiceFlow.setup.title")), /* @__PURE__ */ React169__namespace.default.createElement(CardDescription, null, t4("practiceFlow.setup.description"))), /* @__PURE__ */ React169__namespace.default.createElement(CardContent, { className: "space-y-6" }, /* @__PURE__ */ React169__namespace.default.createElement("div", { className: "space-y-2" }, /* @__PURE__ */ React169__namespace.default.createElement(Label2, { htmlFor: "subject-select", className: "font-semibold" }, t4("practiceFlow.setup.step1_title")), /* @__PURE__ */ React169__namespace.default.createElement(Select2, { value: selectedSubject, onValueChange: (val) => {
+    setSelectedSubject(val);
+    setSelectedTopics(/* @__PURE__ */ new Set());
+  }, disabled: isGenerating }, /* @__PURE__ */ React169__namespace.default.createElement(SelectTrigger2, { id: "subject-select" }, /* @__PURE__ */ React169__namespace.default.createElement(SelectValue2, { placeholder: t4("practiceFlow.setup.step1_placeholder") })), /* @__PURE__ */ React169__namespace.default.createElement(SelectContent2, null, subjects.map((subject) => /* @__PURE__ */ React169__namespace.default.createElement(SelectItem2, { key: subject, value: subject }, subject))))), selectedSubject && /* @__PURE__ */ React169__namespace.default.createElement("div", { className: "space-y-2 animate-in fade-in duration-300" }, /* @__PURE__ */ React169__namespace.default.createElement(Label2, { className: "font-semibold" }, t4("practiceFlow.setup.step2_title_combined")), /* @__PURE__ */ React169__namespace.default.createElement(ScrollArea2, { className: "h-48 w-full rounded-md border p-2" }, /* @__PURE__ */ React169__namespace.default.createElement(Accordion2, { type: "multiple", className: "w-full" }, (categoriesBySubject[selectedSubject] || []).map((category) => /* @__PURE__ */ React169__namespace.default.createElement(AccordionItem2, { value: category, key: category }, /* @__PURE__ */ React169__namespace.default.createElement(AccordionTrigger2, { className: "text-sm font-medium px-2" }, category), /* @__PURE__ */ React169__namespace.default.createElement(AccordionContent2, { className: "pl-4" }, (topicsByCategory[category] || []).map((topic) => /* @__PURE__ */ React169__namespace.default.createElement("div", { key: topic, className: "flex items-center space-x-2 py-1" }, /* @__PURE__ */ React169__namespace.default.createElement(Checkbox2, { id: `topic-${topic.replace(/\s/g, "-")}`, checked: selectedTopics.has(topic), onCheckedChange: (checked) => handleTopicToggle(topic, !!checked), disabled: isGenerating }), /* @__PURE__ */ React169__namespace.default.createElement(Label2, { htmlFor: `topic-${topic.replace(/\s/g, "-")}`, className: "font-normal cursor-pointer" }, topic))))))))), selectedTopics.size > 0 && /* @__PURE__ */ React169__namespace.default.createElement("div", { className: "space-y-4 p-4 border rounded-lg animate-in fade-in duration-700" }, /* @__PURE__ */ React169__namespace.default.createElement("div", { className: "grid grid-cols-1 sm:grid-cols-2 gap-4" }, /* @__PURE__ */ React169__namespace.default.createElement("div", { className: "space-y-2" }, /* @__PURE__ */ React169__namespace.default.createElement(Label2, { htmlFor: "num-questions", className: "font-semibold" }, t4("practiceFlow.setup.step_num_questions", { max: maxQuestions })), /* @__PURE__ */ React169__namespace.default.createElement(Input, { id: "num-questions", type: "number", value: numQuestions, onChange: handleNumQuestionsChange, min: "1", max: maxQuestions, disabled: isGenerating })), /* @__PURE__ */ React169__namespace.default.createElement("div", { className: "space-y-2" }, /* @__PURE__ */ React169__namespace.default.createElement(Label2, { htmlFor: "difficulty-select", className: "font-semibold" }, t4("practiceFlow.setup.step5_title")), /* @__PURE__ */ React169__namespace.default.createElement(Select2, { value: selectedDifficulty, onValueChange: (v) => setSelectedDifficulty(v), disabled: isGenerating }, /* @__PURE__ */ React169__namespace.default.createElement(SelectTrigger2, { id: "difficulty-select" }, /* @__PURE__ */ React169__namespace.default.createElement(SelectValue2, { placeholder: t4("practiceFlow.setup.step5_placeholder") })), /* @__PURE__ */ React169__namespace.default.createElement(SelectContent2, null, DIFFICULTY_LEVELS.map((level) => /* @__PURE__ */ React169__namespace.default.createElement(SelectItem2, { key: level, value: level }, level)))))), /* @__PURE__ */ React169__namespace.default.createElement("div", { className: "space-y-2 pt-4 border-t" }, /* @__PURE__ */ React169__namespace.default.createElement(Label2, { className: "font-semibold" }, t4("practiceFlow.setup.step_question_types")), /* @__PURE__ */ React169__namespace.default.createElement("div", { className: "grid grid-cols-2 sm:grid-cols-3 gap-2" }, allowedQuestionTypes.map((type) => /* @__PURE__ */ React169__namespace.default.createElement("div", { key: type, className: "flex items-center space-x-2" }, /* @__PURE__ */ React169__namespace.default.createElement(Checkbox2, { id: `qtype-${type}`, checked: selectedQuestionTypes.has(type), onCheckedChange: (checked) => handleQuestionTypeToggle(type, !!checked), disabled: isGenerating }), /* @__PURE__ */ React169__namespace.default.createElement(Label2, { htmlFor: `qtype-${type}`, className: "font-normal cursor-pointer text-sm" }, ALL_QUESTION_TYPE_LABELS[type] || type))))), /* @__PURE__ */ React169__namespace.default.createElement("div", { className: "space-y-2" }, /* @__PURE__ */ React169__namespace.default.createElement(Label2, { htmlFor: "language-select", className: "font-semibold" }, t4("practiceFlow.setup.step4_title")), /* @__PURE__ */ React169__namespace.default.createElement(Select2, { value: selectedLanguage, onValueChange: setSelectedLanguage, disabled: isGenerating }, /* @__PURE__ */ React169__namespace.default.createElement(SelectTrigger2, { id: "language-select" }, /* @__PURE__ */ React169__namespace.default.createElement(SelectValue2, { placeholder: t4("practiceFlow.setup.step4_placeholder") })), /* @__PURE__ */ React169__namespace.default.createElement(SelectContent2, null, AVAILABLE_LANGUAGES.map((lang) => /* @__PURE__ */ React169__namespace.default.createElement(SelectItem2, { key: lang.value, value: lang.value }, lang.label))))))), /* @__PURE__ */ React169__namespace.default.createElement(CardFooter, null, /* @__PURE__ */ React169__namespace.default.createElement(Button, { onClick: handleStartClick, disabled: !isReadyToStart, className: "w-full" }, isGenerating ? /* @__PURE__ */ React169__namespace.default.createElement(React169__namespace.default.Fragment, null, /* @__PURE__ */ React169__namespace.default.createElement(LoaderCircle, { className: "mr-2 h-4 w-4 animate-spin" }), t4("practiceFlow.setup.generatingButton")) : /* @__PURE__ */ React169__namespace.default.createElement(React169__namespace.default.Fragment, null, /* @__PURE__ */ React169__namespace.default.createElement(WandSparkles, { className: "mr-2 h-4 w-4" }), t4("practiceFlow.setup.startButton")))));
 };
 
 // src/react-ui/components/practice/PracticeModeController.tsx
@@ -138429,7 +138352,10 @@ var mapDifficultyToBloomDistribution = (difficulty) => {
       return [{ level: "remembering", ratio: 50 }, { level: "understanding", ratio: 50 }];
   }
 };
-var PracticeModeController = () => {
+var PracticeModeController = ({
+  maxQuestions,
+  allowedQuestionTypes
+}) => {
   const router = navigation.useRouter();
   const [practiceState, setPracticeState] = React169.useState("initializing");
   const [quizConfig, setQuizConfig] = React169.useState(null);
@@ -138490,7 +138416,7 @@ var PracticeModeController = () => {
       setPracticeState("setup");
     }
   }, [toast2]);
-  const handleStartPractice = React169.useCallback(async (selectedLOs, difficulty, language3, includeCoding, numCoding) => {
+  const handleStartPractice = React169.useCallback(async (selectedLOs, difficulty, language3, numQuestions, selectedQuestionTypes) => {
     setPracticeState("loading");
     setErrorMessage("");
     const apiKey = APIKeyService.getAPIKey(GEMINI_API_KEY_SERVICE_NAME);
@@ -138502,19 +138428,12 @@ var PracticeModeController = () => {
       return;
     }
     try {
-      const totalQuestions = 10;
-      const numCodingQuestions = includeCoding ? numCoding : 0;
-      const standardQuestionTypes = ["multiple_choice", "multiple_response", "true_false", "fill_in_the_blanks", "short_answer", "numeric", "sequence"];
-      let selectedQuestionTypes = [...standardQuestionTypes];
-      if (includeCoding) {
-        selectedQuestionTypes.push("coding");
-      }
       const planInput = {
-        totalQuestions,
-        numCodingQuestions,
+        totalQuestions: numQuestions,
+        numCodingQuestions: selectedQuestionTypes.includes("coding") ? 1 : 0,
+        // Simplified logic for now
         topics: selectedLOs.map((lo) => ({
           topic: lo.name || lo.code,
-          // FIX: Provide fallback for name
           ratio: 100 / selectedLOs.length,
           originalLoId: lo.code,
           originalSubject: lo.subject,
@@ -138627,26 +138546,17 @@ var PracticeModeController = () => {
       case "initializing":
         return /* @__PURE__ */ React169__namespace.default.createElement("div", { className: "flex flex-col items-center justify-center min-h-[400px]" }, /* @__PURE__ */ React169__namespace.default.createElement(LoaderCircle, { className: "h-12 w-12 animate-spin text-primary" }), /* @__PURE__ */ React169__namespace.default.createElement("p", { className: "mt-4 text-muted-foreground" }, "Initializing Practice Mode..."));
       case "setup":
-        return /* @__PURE__ */ React169__namespace.default.createElement(
-          PracticeSetup,
-          {
-            onStartPractice: handleStartPractice,
-            isGenerating: false,
-            initialLOs: initialSuggestedLOs,
-            initialDifficulty: initialSuggestedDifficulty,
-            initialLanguage: initialSuggestedLanguage
-          }
-        );
       case "loading":
         return /* @__PURE__ */ React169__namespace.default.createElement(
           PracticeSetup,
           {
-            onStartPractice: () => {
-            },
-            isGenerating: true,
+            onStartPractice: handleStartPractice,
+            isGenerating: practiceState === "loading",
             initialLOs: initialSuggestedLOs,
             initialDifficulty: initialSuggestedDifficulty,
-            initialLanguage: initialSuggestedLanguage
+            initialLanguage: initialSuggestedLanguage,
+            maxQuestions,
+            allowedQuestionTypes
           }
         );
       case "playing":
@@ -140184,7 +140094,7 @@ function ApproachManager({
   };
   const handleEditItem = (item) => {
     setCurrentItem(item);
-    setFormState(item);
+    setFormState({ ...item, difficulty: Array.isArray(item.difficulty) ? item.difficulty : [item.difficulty] });
     setIsDialogOpen(true);
   };
   const handleDeleteItem = (item) => {
@@ -140277,11 +140187,18 @@ function ApproachManager({
       await onBulkAdd(validatedRecords);
     }
   };
-  return /* @__PURE__ */ React169__namespace.default.createElement(Card, null, /* @__PURE__ */ React169__namespace.default.createElement(CardHeader, null, /* @__PURE__ */ React169__namespace.default.createElement(CardTitle, { className: "flex justify-between items-center" }, /* @__PURE__ */ React169__namespace.default.createElement("span", { className: "flex items-center" }, /* @__PURE__ */ React169__namespace.default.createElement(Settings2, { className: "mr-2 h-5 w-5 text-primary" }), " Manage Approaches"), /* @__PURE__ */ React169__namespace.default.createElement("div", { className: "flex items-center gap-2" }, onBulkAdd && /* @__PURE__ */ React169__namespace.default.createElement(MetadataImportControls, { metadataName: "Approaches", onImport: handleImport }), /* @__PURE__ */ React169__namespace.default.createElement(Button, { onClick: handleAddItem, size: "sm" }, /* @__PURE__ */ React169__namespace.default.createElement(CirclePlus, { className: "mr-2 h-4 w-4" }), " Add Approach")))), /* @__PURE__ */ React169__namespace.default.createElement(CardContent, null, isLoading ? /* @__PURE__ */ React169__namespace.default.createElement("div", { className: "flex justify-center items-center h-32" }, /* @__PURE__ */ React169__namespace.default.createElement(LoaderCircle, { className: "h-8 w-8 animate-spin text-primary" })) : items.length === 0 ? /* @__PURE__ */ React169__namespace.default.createElement("p", { className: "text-center text-muted-foreground py-4" }, "No Approaches found.") : /* @__PURE__ */ React169__namespace.default.createElement("div", { className: "overflow-x-auto" }, /* @__PURE__ */ React169__namespace.default.createElement(Table3, null, /* @__PURE__ */ React169__namespace.default.createElement(TableHeader, null, /* @__PURE__ */ React169__namespace.default.createElement(TableRow, null, /* @__PURE__ */ React169__namespace.default.createElement(TableHead, null, "Approach ID"), /* @__PURE__ */ React169__namespace.default.createElement(TableHead, null, "Name"), /* @__PURE__ */ React169__namespace.default.createElement(TableHead, null, "Verb (VI)"), /* @__PURE__ */ React169__namespace.default.createElement(TableHead, null, "Cognitive Level"), /* @__PURE__ */ React169__namespace.default.createElement(TableHead, { className: "text-right w-[120px]" }, "Actions"))), /* @__PURE__ */ React169__namespace.default.createElement(TableBody, null, items.map((item) => /* @__PURE__ */ React169__namespace.default.createElement(TableRow, { key: item.id }, /* @__PURE__ */ React169__namespace.default.createElement(TableCell, { className: "font-Medium" }, item.code), /* @__PURE__ */ React169__namespace.default.createElement(TableCell, null, item.name), /* @__PURE__ */ React169__namespace.default.createElement(TableCell, null, item.verbVi), /* @__PURE__ */ React169__namespace.default.createElement(TableCell, null, item.bloomLevelCode), /* @__PURE__ */ React169__namespace.default.createElement(TableCell, { className: "text-right" }, /* @__PURE__ */ React169__namespace.default.createElement(Button, { variant: "ghost", size: "icon", onClick: () => handleEditItem(item), className: "mr-2" }, /* @__PURE__ */ React169__namespace.default.createElement(PenLine, { className: "h-4 w-4" })), /* @__PURE__ */ React169__namespace.default.createElement(Button, { variant: "ghost", size: "icon", onClick: () => handleDeleteItem(item), className: "text-destructive hover:text-destructive" }, /* @__PURE__ */ React169__namespace.default.createElement(Trash2, { className: "h-4 w-4" })))))))), /* @__PURE__ */ React169__namespace.default.createElement(Dialog2, { open: isDialogOpen, onOpenChange: setIsDialogOpen }, /* @__PURE__ */ React169__namespace.default.createElement(DialogContent2, { className: "sm:max-w-2xl max-h-[90vh] overflow-y-auto" }, /* @__PURE__ */ React169__namespace.default.createElement(DialogHeader, null, /* @__PURE__ */ React169__namespace.default.createElement(DialogTitle2, null, currentItem ? "Edit Approach" : "Add New Approach")), /* @__PURE__ */ React169__namespace.default.createElement("div", { className: "grid gap-4 py-4" }, /* @__PURE__ */ React169__namespace.default.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-4" }, /* @__PURE__ */ React169__namespace.default.createElement("div", null, /* @__PURE__ */ React169__namespace.default.createElement(Label2, { htmlFor: "code" }, "Approach Code"), /* @__PURE__ */ React169__namespace.default.createElement(Input, { id: "code", value: formState.code || "", onChange: (e3) => setFormState((s4) => ({ ...s4, code: e3.target.value.toUpperCase() })), placeholder: "e.g., REM-FAC-IDT-MCQ", disabled: !!currentItem })), /* @__PURE__ */ React169__namespace.default.createElement("div", null, /* @__PURE__ */ React169__namespace.default.createElement(Label2, { htmlFor: "name" }, "Name / Description"), /* @__PURE__ */ React169__namespace.default.createElement(Input, { id: "name", value: formState.name || "", onChange: (e3) => setFormState((s4) => ({ ...s4, name: e3.target.value })), placeholder: "e.g., Identify a Fact" }))), /* @__PURE__ */ React169__namespace.default.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-4" }, /* @__PURE__ */ React169__namespace.default.createElement("div", null, /* @__PURE__ */ React169__namespace.default.createElement(Label2, { htmlFor: "verbEn" }, "Verb (English)"), /* @__PURE__ */ React169__namespace.default.createElement(Input, { id: "verbEn", value: formState.verbEn || "", onChange: (e3) => setFormState((s4) => ({ ...s4, verbEn: e3.target.value })), placeholder: "e.g., Identify" })), /* @__PURE__ */ React169__namespace.default.createElement("div", null, /* @__PURE__ */ React169__namespace.default.createElement(Label2, { htmlFor: "verbVi" }, "Verb (Vietnamese)"), /* @__PURE__ */ React169__namespace.default.createElement(Input, { id: "verbVi", value: formState.verbVi || "", onChange: (e3) => setFormState((s4) => ({ ...s4, verbVi: e3.target.value })), placeholder: "e.g., Nh\u1EADn d\u1EA1ng" }))), /* @__PURE__ */ React169__namespace.default.createElement("div", { className: "grid grid-cols-1 md:grid-cols-3 gap-4" }, /* @__PURE__ */ React169__namespace.default.createElement("div", null, /* @__PURE__ */ React169__namespace.default.createElement(Label2, { htmlFor: "bloomLevelCode" }, "Cognitive Level"), /* @__PURE__ */ React169__namespace.default.createElement(Select2, { value: formState.bloomLevelCode, onValueChange: (v) => setFormState((s4) => ({ ...s4, bloomLevelCode: v })) }, /* @__PURE__ */ React169__namespace.default.createElement(SelectTrigger2, null, /* @__PURE__ */ React169__namespace.default.createElement(SelectValue2, null)), /* @__PURE__ */ React169__namespace.default.createElement(SelectContent2, null, bloomLevels.map((level) => /* @__PURE__ */ React169__namespace.default.createElement(SelectItem2, { key: level.code, value: level.code }, level.name))))), /* @__PURE__ */ React169__namespace.default.createElement("div", null, /* @__PURE__ */ React169__namespace.default.createElement(Label2, { htmlFor: "knowledgeDimension" }, "Knowledge Dimension"), /* @__PURE__ */ React169__namespace.default.createElement(Select2, { value: formState.knowledgeDimension, onValueChange: (v) => setFormState((s4) => ({ ...s4, knowledgeDimension: v })) }, /* @__PURE__ */ React169__namespace.default.createElement(SelectTrigger2, null, /* @__PURE__ */ React169__namespace.default.createElement(SelectValue2, null)), /* @__PURE__ */ React169__namespace.default.createElement(SelectContent2, null, knowledgeDimensions.map((kd) => /* @__PURE__ */ React169__namespace.default.createElement(SelectItem2, { key: kd, value: kd }, kd))))), /* @__PURE__ */ React169__namespace.default.createElement("div", null, /* @__PURE__ */ React169__namespace.default.createElement(Label2, { htmlFor: "iSpringQuizType" }, "iSpring Quiz Type"), /* @__PURE__ */ React169__namespace.default.createElement(Select2, { value: formState.iSpringQuizType, onValueChange: (v) => setFormState((s4) => ({ ...s4, iSpringQuizType: v })) }, /* @__PURE__ */ React169__namespace.default.createElement(SelectTrigger2, null, /* @__PURE__ */ React169__namespace.default.createElement(SelectValue2, null)), /* @__PURE__ */ React169__namespace.default.createElement(SelectContent2, null, questionTypes.map((qt) => /* @__PURE__ */ React169__namespace.default.createElement(SelectItem2, { key: qt.code, value: qt.code }, qt.name)))))), /* @__PURE__ */ React169__namespace.default.createElement("div", null, /* @__PURE__ */ React169__namespace.default.createElement(Label2, null, "Difficulty"), /* @__PURE__ */ React169__namespace.default.createElement("div", { className: "flex items-center space-x-4 pt-2" }, standardDifficulties.map((diff2) => /* @__PURE__ */ React169__namespace.default.createElement("div", { key: diff2, className: "flex items-center space-x-2" }, /* @__PURE__ */ React169__namespace.default.createElement(Checkbox2, { id: `diff-${diff2}`, checked: (formState.difficulty || []).includes(diff2), onCheckedChange: (checked) => {
-    const current = formState.difficulty || [];
-    const newDiff = checked ? [...current, diff2] : current.filter((d) => d !== diff2);
-    setFormState((s4) => ({ ...s4, difficulty: newDiff }));
-  } }), /* @__PURE__ */ React169__namespace.default.createElement(Label2, { htmlFor: `diff-${diff2}` }, diff2))))), /* @__PURE__ */ React169__namespace.default.createElement("div", null, /* @__PURE__ */ React169__namespace.default.createElement(Label2, { htmlFor: "suggestContext" }, "Suggest Context (comma-separated codes)"), /* @__PURE__ */ React169__namespace.default.createElement(Input, { id: "suggestContext", value: formState.suggestContext || "", onChange: (e3) => setFormState((s4) => ({ ...s4, suggestContext: e3.target.value })), placeholder: "e.g., A, B, D, G, H" })), /* @__PURE__ */ React169__namespace.default.createElement("div", null, /* @__PURE__ */ React169__namespace.default.createElement(Label2, { htmlFor: "exampleEn" }, "Example (English)"), /* @__PURE__ */ React169__namespace.default.createElement(Textarea, { id: "exampleEn", value: formState.exampleEn || "", onChange: (e3) => setFormState((s4) => ({ ...s4, exampleEn: e3.target.value })), placeholder: "English example prompt..." })), /* @__PURE__ */ React169__namespace.default.createElement("div", null, /* @__PURE__ */ React169__namespace.default.createElement(Label2, { htmlFor: "exampleVi" }, "Example (Vietnamese)"), /* @__PURE__ */ React169__namespace.default.createElement(Textarea, { id: "exampleVi", value: formState.exampleVi || "", onChange: (e3) => setFormState((s4) => ({ ...s4, exampleVi: e3.target.value })), placeholder: "Vietnamese example prompt..." }))), /* @__PURE__ */ React169__namespace.default.createElement(DialogFooter, null, /* @__PURE__ */ React169__namespace.default.createElement(Button, { type: "button", variant: "outline", onClick: () => setIsDialogOpen(false), disabled: isPending }, "Cancel"), /* @__PURE__ */ React169__namespace.default.createElement(Button, { type: "submit", onClick: handleSubmit, disabled: isPending }, isPending && /* @__PURE__ */ React169__namespace.default.createElement(LoaderCircle, { className: "mr-2 h-4 w-4 animate-spin" }), " Save")))), /* @__PURE__ */ React169__namespace.default.createElement(AlertDialog2, { open: isAlertOpen, onOpenChange: setIsAlertOpen }, /* @__PURE__ */ React169__namespace.default.createElement(AlertDialogContent2, null, /* @__PURE__ */ React169__namespace.default.createElement(AlertDialogHeader, null, /* @__PURE__ */ React169__namespace.default.createElement(AlertDialogTitle2, null, "Are you sure?"), /* @__PURE__ */ React169__namespace.default.createElement(AlertDialogDescription2, null, 'This will permanently delete "', itemToDelete?.code, '".')), /* @__PURE__ */ React169__namespace.default.createElement(AlertDialogFooter, null, /* @__PURE__ */ React169__namespace.default.createElement(AlertDialogCancel2, { disabled: isPending }, "Cancel"), /* @__PURE__ */ React169__namespace.default.createElement(AlertDialogAction2, { onClick: confirmDelete, disabled: isPending, className: "bg-destructive hover:bg-destructive/90" }, isPending && /* @__PURE__ */ React169__namespace.default.createElement(LoaderCircle, { className: "mr-2 h-4 w-4 animate-spin" }), " Delete"))))));
+  return /* @__PURE__ */ React169__namespace.default.createElement(Card, null, /* @__PURE__ */ React169__namespace.default.createElement(CardHeader, null, /* @__PURE__ */ React169__namespace.default.createElement(CardTitle, { className: "flex justify-between items-center" }, /* @__PURE__ */ React169__namespace.default.createElement("span", { className: "flex items-center" }, /* @__PURE__ */ React169__namespace.default.createElement(Settings2, { className: "mr-2 h-5 w-5 text-primary" }), " Manage Approaches"), /* @__PURE__ */ React169__namespace.default.createElement("div", { className: "flex items-center gap-2" }, onBulkAdd && /* @__PURE__ */ React169__namespace.default.createElement(MetadataImportControls, { metadataName: "Approaches", onImport: handleImport }), /* @__PURE__ */ React169__namespace.default.createElement(Button, { onClick: handleAddItem, size: "sm" }, /* @__PURE__ */ React169__namespace.default.createElement(CirclePlus, { className: "mr-2 h-4 w-4" }), " Add Approach")))), /* @__PURE__ */ React169__namespace.default.createElement(CardContent, null, isLoading ? /* @__PURE__ */ React169__namespace.default.createElement("div", { className: "flex justify-center items-center h-32" }, /* @__PURE__ */ React169__namespace.default.createElement(LoaderCircle, { className: "h-8 w-8 animate-spin text-primary" })) : items.length === 0 ? /* @__PURE__ */ React169__namespace.default.createElement("p", { className: "text-center text-muted-foreground py-4" }, "No Approaches found.") : /* @__PURE__ */ React169__namespace.default.createElement("div", { className: "overflow-x-auto" }, /* @__PURE__ */ React169__namespace.default.createElement(Table3, null, /* @__PURE__ */ React169__namespace.default.createElement(TableHeader, null, /* @__PURE__ */ React169__namespace.default.createElement(TableRow, null, /* @__PURE__ */ React169__namespace.default.createElement(TableHead, null, "Approach ID"), /* @__PURE__ */ React169__namespace.default.createElement(TableHead, null, "Name"), /* @__PURE__ */ React169__namespace.default.createElement(TableHead, null, "Verb (VI)"), /* @__PURE__ */ React169__namespace.default.createElement(TableHead, null, "Cognitive Level"), /* @__PURE__ */ React169__namespace.default.createElement(TableHead, { className: "text-right w-[120px]" }, "Actions"))), /* @__PURE__ */ React169__namespace.default.createElement(TableBody, null, items.map((item) => /* @__PURE__ */ React169__namespace.default.createElement(TableRow, { key: item.id }, /* @__PURE__ */ React169__namespace.default.createElement(TableCell, { className: "font-Medium" }, item.code), /* @__PURE__ */ React169__namespace.default.createElement(TableCell, null, item.name), /* @__PURE__ */ React169__namespace.default.createElement(TableCell, null, item.verbVi), /* @__PURE__ */ React169__namespace.default.createElement(TableCell, null, item.bloomLevelCode), /* @__PURE__ */ React169__namespace.default.createElement(TableCell, { className: "text-right" }, /* @__PURE__ */ React169__namespace.default.createElement(Button, { variant: "ghost", size: "icon", onClick: () => handleEditItem(item), className: "mr-2" }, /* @__PURE__ */ React169__namespace.default.createElement(PenLine, { className: "h-4 w-4" })), /* @__PURE__ */ React169__namespace.default.createElement(Button, { variant: "ghost", size: "icon", onClick: () => handleDeleteItem(item), className: "text-destructive hover:text-destructive" }, /* @__PURE__ */ React169__namespace.default.createElement(Trash2, { className: "h-4 w-4" })))))))), /* @__PURE__ */ React169__namespace.default.createElement(Dialog2, { open: isDialogOpen, onOpenChange: setIsDialogOpen }, /* @__PURE__ */ React169__namespace.default.createElement(DialogContent2, { className: "sm:max-w-2xl max-h-[90vh] overflow-y-auto" }, /* @__PURE__ */ React169__namespace.default.createElement(DialogHeader, null, /* @__PURE__ */ React169__namespace.default.createElement(DialogTitle2, null, currentItem ? "Edit Approach" : "Add New Approach")), /* @__PURE__ */ React169__namespace.default.createElement("div", { className: "grid gap-4 py-4" }, /* @__PURE__ */ React169__namespace.default.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-4" }, /* @__PURE__ */ React169__namespace.default.createElement("div", null, /* @__PURE__ */ React169__namespace.default.createElement(Label2, { htmlFor: "code" }, "Approach Code"), /* @__PURE__ */ React169__namespace.default.createElement(Input, { id: "code", value: formState.code || "", onChange: (e3) => setFormState((s4) => ({ ...s4, code: e3.target.value.toUpperCase() })), placeholder: "e.g., REM-FAC-IDT-MCQ", disabled: !!currentItem })), /* @__PURE__ */ React169__namespace.default.createElement("div", null, /* @__PURE__ */ React169__namespace.default.createElement(Label2, { htmlFor: "name" }, "Name / Description"), /* @__PURE__ */ React169__namespace.default.createElement(Input, { id: "name", value: formState.name || "", onChange: (e3) => setFormState((s4) => ({ ...s4, name: e3.target.value })), placeholder: "e.g., Identify a Fact" }))), /* @__PURE__ */ React169__namespace.default.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-4" }, /* @__PURE__ */ React169__namespace.default.createElement("div", null, /* @__PURE__ */ React169__namespace.default.createElement(Label2, { htmlFor: "verbEn" }, "Verb (English)"), /* @__PURE__ */ React169__namespace.default.createElement(Input, { id: "verbEn", value: formState.verbEn || "", onChange: (e3) => setFormState((s4) => ({ ...s4, verbEn: e3.target.value })), placeholder: "e.g., Identify" })), /* @__PURE__ */ React169__namespace.default.createElement("div", null, /* @__PURE__ */ React169__namespace.default.createElement(Label2, { htmlFor: "verbVi" }, "Verb (Vietnamese)"), /* @__PURE__ */ React169__namespace.default.createElement(Input, { id: "verbVi", value: formState.verbVi || "", onChange: (e3) => setFormState((s4) => ({ ...s4, verbVi: e3.target.value })), placeholder: "e.g., Nh\u1EADn d\u1EA1ng" }))), /* @__PURE__ */ React169__namespace.default.createElement("div", { className: "grid grid-cols-1 md:grid-cols-3 gap-4" }, /* @__PURE__ */ React169__namespace.default.createElement("div", null, /* @__PURE__ */ React169__namespace.default.createElement(Label2, { htmlFor: "bloomLevelCode" }, "Cognitive Level"), /* @__PURE__ */ React169__namespace.default.createElement(Select2, { value: formState.bloomLevelCode, onValueChange: (v) => setFormState((s4) => ({ ...s4, bloomLevelCode: v })) }, /* @__PURE__ */ React169__namespace.default.createElement(SelectTrigger2, null, /* @__PURE__ */ React169__namespace.default.createElement(SelectValue2, null)), /* @__PURE__ */ React169__namespace.default.createElement(SelectContent2, null, bloomLevels.map((level) => /* @__PURE__ */ React169__namespace.default.createElement(SelectItem2, { key: level.code, value: level.code }, level.name))))), /* @__PURE__ */ React169__namespace.default.createElement("div", null, /* @__PURE__ */ React169__namespace.default.createElement(Label2, { htmlFor: "knowledgeDimension" }, "Knowledge Dimension"), /* @__PURE__ */ React169__namespace.default.createElement(Select2, { value: formState.knowledgeDimension, onValueChange: (v) => setFormState((s4) => ({ ...s4, knowledgeDimension: v })) }, /* @__PURE__ */ React169__namespace.default.createElement(SelectTrigger2, null, /* @__PURE__ */ React169__namespace.default.createElement(SelectValue2, null)), /* @__PURE__ */ React169__namespace.default.createElement(SelectContent2, null, knowledgeDimensions.map((kd) => /* @__PURE__ */ React169__namespace.default.createElement(SelectItem2, { key: kd, value: kd }, kd))))), /* @__PURE__ */ React169__namespace.default.createElement("div", null, /* @__PURE__ */ React169__namespace.default.createElement(Label2, { htmlFor: "iSpringQuizType" }, "iSpring Quiz Type"), /* @__PURE__ */ React169__namespace.default.createElement(Select2, { value: formState.iSpringQuizType, onValueChange: (v) => setFormState((s4) => ({ ...s4, iSpringQuizType: v })) }, /* @__PURE__ */ React169__namespace.default.createElement(SelectTrigger2, null, /* @__PURE__ */ React169__namespace.default.createElement(SelectValue2, null)), /* @__PURE__ */ React169__namespace.default.createElement(SelectContent2, null, questionTypes.map((qt) => /* @__PURE__ */ React169__namespace.default.createElement(SelectItem2, { key: qt.code, value: qt.code }, qt.name)))))), /* @__PURE__ */ React169__namespace.default.createElement("div", null, /* @__PURE__ */ React169__namespace.default.createElement(Label2, null, "Difficulty"), /* @__PURE__ */ React169__namespace.default.createElement("div", { className: "flex items-center space-x-4 pt-2" }, standardDifficulties.map((diff2) => /* @__PURE__ */ React169__namespace.default.createElement("div", { key: diff2, className: "flex items-center space-x-2" }, /* @__PURE__ */ React169__namespace.default.createElement(
+    Checkbox2,
+    {
+      id: `diff-${diff2}`,
+      checked: (formState.difficulty || []).includes(diff2),
+      onCheckedChange: (checked) => {
+        const current = formState.difficulty || [];
+        const newDiff = checked ? [...current, diff2] : current.filter((d) => d !== diff2);
+        setFormState((s4) => ({ ...s4, difficulty: newDiff }));
+      }
+    }
+  ), /* @__PURE__ */ React169__namespace.default.createElement(Label2, { htmlFor: `diff-${diff2}` }, diff2))))), /* @__PURE__ */ React169__namespace.default.createElement("div", null, /* @__PURE__ */ React169__namespace.default.createElement(Label2, { htmlFor: "suggestContext" }, "Suggest Context (comma-separated codes)"), /* @__PURE__ */ React169__namespace.default.createElement(Input, { id: "suggestContext", value: formState.suggestContext || "", onChange: (e3) => setFormState((s4) => ({ ...s4, suggestContext: e3.target.value })), placeholder: "e.g., A, B, D, G, H" })), /* @__PURE__ */ React169__namespace.default.createElement("div", null, /* @__PURE__ */ React169__namespace.default.createElement(Label2, { htmlFor: "exampleEn" }, "Example (English)"), /* @__PURE__ */ React169__namespace.default.createElement(Textarea, { id: "exampleEn", value: formState.exampleEn || "", onChange: (e3) => setFormState((s4) => ({ ...s4, exampleEn: e3.target.value })), placeholder: "English example prompt..." })), /* @__PURE__ */ React169__namespace.default.createElement("div", null, /* @__PURE__ */ React169__namespace.default.createElement(Label2, { htmlFor: "exampleVi" }, "Example (Vietnamese)"), /* @__PURE__ */ React169__namespace.default.createElement(Textarea, { id: "exampleVi", value: formState.exampleVi || "", onChange: (e3) => setFormState((s4) => ({ ...s4, exampleVi: e3.target.value })), placeholder: "Vietnamese example prompt..." }))), /* @__PURE__ */ React169__namespace.default.createElement(DialogFooter, null, /* @__PURE__ */ React169__namespace.default.createElement(Button, { type: "button", variant: "outline", onClick: () => setIsDialogOpen(false), disabled: isPending }, "Cancel"), /* @__PURE__ */ React169__namespace.default.createElement(Button, { type: "submit", onClick: handleSubmit, disabled: isPending }, isPending && /* @__PURE__ */ React169__namespace.default.createElement(LoaderCircle, { className: "mr-2 h-4 w-4 animate-spin" }), " Save")))), /* @__PURE__ */ React169__namespace.default.createElement(AlertDialog2, { open: isAlertOpen, onOpenChange: setIsAlertOpen }, /* @__PURE__ */ React169__namespace.default.createElement(AlertDialogContent2, null, /* @__PURE__ */ React169__namespace.default.createElement(AlertDialogHeader, null, /* @__PURE__ */ React169__namespace.default.createElement(AlertDialogTitle2, null, "Are you sure?"), /* @__PURE__ */ React169__namespace.default.createElement(AlertDialogDescription2, null, 'This will permanently delete "', itemToDelete?.code, '".')), /* @__PURE__ */ React169__namespace.default.createElement(AlertDialogFooter, null, /* @__PURE__ */ React169__namespace.default.createElement(AlertDialogCancel2, { disabled: isPending }, "Cancel"), /* @__PURE__ */ React169__namespace.default.createElement(AlertDialogAction2, { onClick: confirmDelete, disabled: isPending, className: "bg-destructive hover:bg-destructive/90" }, isPending && /* @__PURE__ */ React169__namespace.default.createElement(LoaderCircle, { className: "mr-2 h-4 w-4 animate-spin" }), " Delete"))))));
 }
 
 // src/react-ui/components/metadata/MetadataTabs.tsx