@almadar/ui 5.32.2 → 5.32.3

package/dist/components/index.cjs

@@ -28819,7 +28819,7 @@ var init_MapView = __esm({
         shadowSize: [41, 41]
       });
       L.Marker.prototype.options.icon = defaultIcon;
-      const { useEffect: useEffect72, useRef: useRef69, useCallback: useCallback114, useState: useState101 } = React74__namespace.default;
+      const { useEffect: useEffect72, useRef: useRef69, useCallback: useCallback115, useState: useState105 } = React74__namespace.default;
       const { Typography: Typography2 } = await Promise.resolve().then(() => (init_Typography(), Typography_exports));
       const { useEventBus: useEventBus2 } = await Promise.resolve().then(() => (init_useEventBus(), useEventBus_exports));
       function MapUpdater({ centerLat, centerLng, zoom }) {
@@ -28864,8 +28864,8 @@ var init_MapView = __esm({
         showAttribution = true
       }) {
         const eventBus = useEventBus2();
-        const [clickedPosition, setClickedPosition] = useState101(null);
-        const handleMapClick = useCallback114((lat, lng) => {
+        const [clickedPosition, setClickedPosition] = useState105(null);
+        const handleMapClick = useCallback115((lat, lng) => {
           if (showClickedPin) {
             setClickedPosition({ lat, lng });
           }
@@ -28874,7 +28874,7 @@ var init_MapView = __esm({
             eventBus.emit(`UI:${mapClickEvent}`, { latitude: lat, longitude: lng });
           }
         }, [onMapClick, mapClickEvent, eventBus, showClickedPin]);
-        const handleMarkerClick = useCallback114((marker) => {
+        const handleMarkerClick = useCallback115((marker) => {
           onMarkerClick?.(marker);
           if (markerClickEvent) {
             eventBus.emit(`UI:${markerClickEvent}`, { ...marker });
@@ -37577,6 +37577,384 @@ var init_GraphCanvas = __esm({
     exports.GraphCanvas.displayName = "GraphCanvas";
   }
 });
+exports.ActivationBlock = void 0;
+var init_ActivationBlock = __esm({
+  "components/core/molecules/ActivationBlock.tsx"() {
+    "use client";
+    init_useEventBus();
+    init_cn();
+    exports.ActivationBlock = ({
+      question,
+      savedResponse,
+      saveEvent = "SAVE_ACTIVATION",
+      className
+    }) => {
+      const [response, setResponse] = React74.useState(savedResponse ?? "");
+      const [isExpanded, setIsExpanded] = React74.useState(!savedResponse);
+      const { emit } = useEventBus();
+      const handleSubmit = () => {
+        emit(`UI:${saveEvent}`, { response });
+        setIsExpanded(false);
+      };
+      return /* @__PURE__ */ jsxRuntime.jsx(
+        "div",
+        {
+          className: cn(
+            "bg-indigo-50 dark:bg-indigo-900/20 border-2 border-indigo-200 dark:border-indigo-800 rounded-lg p-5 mb-6",
+            className
+          ),
+          children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-start gap-3", children: [
+            /* @__PURE__ */ jsxRuntime.jsx(LucideIcons2.Lightbulb, { className: "text-indigo-600 dark:text-indigo-400 flex-shrink-0 mt-1", size: 24 }),
+            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex-1", children: [
+              /* @__PURE__ */ jsxRuntime.jsx("h4", { className: "font-semibold text-indigo-900 dark:text-indigo-100 mb-2", children: "Before You Begin..." }),
+              /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-gray-700 dark:text-gray-300 mb-3 text-sm md:text-base", children: question }),
+              isExpanded ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+                /* @__PURE__ */ jsxRuntime.jsx(
+                  "textarea",
+                  {
+                    className: "w-full p-3 border border-indigo-300 dark:border-indigo-700 rounded-md bg-white dark:bg-gray-800 text-gray-900 dark:text-gray-100 focus:ring-2 focus:ring-indigo-500 focus:border-transparent text-sm",
+                    placeholder: "Jot down your thoughts...",
+                    value: response,
+                    onChange: (e) => setResponse(e.target.value),
+                    rows: 3
+                  }
+                ),
+                /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex gap-2 mt-3", children: [
+                  /* @__PURE__ */ jsxRuntime.jsx(
+                    "button",
+                    {
+                      onClick: handleSubmit,
+                      className: "px-4 py-2 bg-indigo-600 text-white rounded-md hover:bg-indigo-700 text-sm font-medium transition-colors",
+                      children: "Continue to Lesson \u2192"
+                    }
+                  ),
+                  /* @__PURE__ */ jsxRuntime.jsx(
+                    "button",
+                    {
+                      onClick: () => {
+                        emit(`UI:${saveEvent}`, { response: "" });
+                        setIsExpanded(false);
+                      },
+                      className: "px-4 py-2 text-indigo-600 dark:text-indigo-400 hover:underline text-sm",
+                      children: "Skip for now"
+                    }
+                  )
+                ] })
+              ] }) : /* @__PURE__ */ jsxRuntime.jsx(
+                "button",
+                {
+                  onClick: () => setIsExpanded(true),
+                  className: "text-sm text-indigo-600 dark:text-indigo-400 hover:underline font-medium",
+                  children: "\u2713 Answered \xB7 Edit response"
+                }
+              )
+            ] })
+          ] })
+        }
+      );
+    };
+    exports.ActivationBlock.displayName = "ActivationBlock";
+  }
+});
+exports.ReflectionBlock = void 0;
+var init_ReflectionBlock = __esm({
+  "components/core/molecules/ReflectionBlock.tsx"() {
+    "use client";
+    init_useEventBus();
+    init_cn();
+    exports.ReflectionBlock = ({
+      prompt,
+      index,
+      savedNote,
+      saveEvent = "SAVE_REFLECTION",
+      className
+    }) => {
+      const [note, setNote] = React74.useState(savedNote ?? "");
+      const [isExpanded, setIsExpanded] = React74.useState(false);
+      const { emit } = useEventBus();
+      const handleSave = () => {
+        emit(`UI:${saveEvent}`, { index, note });
+        setIsExpanded(false);
+      };
+      return /* @__PURE__ */ jsxRuntime.jsx(
+        "div",
+        {
+          className: cn(
+            "my-6 border-l-4 border-amber-400 bg-amber-50 dark:bg-amber-900/20 rounded-r-lg p-4",
+            className
+          ),
+          children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-start gap-3", children: [
+            /* @__PURE__ */ jsxRuntime.jsx(LucideIcons2.PauseCircle, { className: "text-amber-600 dark:text-amber-400 flex-shrink-0 mt-1", size: 20 }),
+            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex-1", children: [
+              /* @__PURE__ */ jsxRuntime.jsx("div", { className: "font-medium text-amber-900 dark:text-amber-100 mb-2", children: "Pause & Reflect" }),
+              /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-gray-700 dark:text-gray-300 text-sm mb-3", children: prompt }),
+              isExpanded ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+                /* @__PURE__ */ jsxRuntime.jsx(
+                  "textarea",
+                  {
+                    className: "w-full p-2 border border-amber-300 dark:border-amber-700 rounded text-sm bg-white dark:bg-gray-800 text-gray-900 dark:text-gray-100 focus:ring-2 focus:ring-amber-500 focus:border-transparent",
+                    placeholder: "Your thoughts...",
+                    value: note,
+                    onChange: (e) => setNote(e.target.value),
+                    rows: 2
+                  }
+                ),
+                /* @__PURE__ */ jsxRuntime.jsx(
+                  "button",
+                  {
+                    onClick: handleSave,
+                    className: "mt-2 text-sm px-3 py-1 bg-amber-600 text-white rounded hover:bg-amber-700 transition-colors",
+                    children: "Save & Continue"
+                  }
+                )
+              ] }) : /* @__PURE__ */ jsxRuntime.jsx(
+                "button",
+                {
+                  onClick: () => setIsExpanded(true),
+                  className: "text-sm text-amber-600 dark:text-amber-400 hover:underline",
+                  children: savedNote ? "\u2713 Answered \xB7 Edit" : "Answer this question"
+                }
+              )
+            ] })
+          ] })
+        }
+      );
+    };
+    exports.ReflectionBlock.displayName = "ReflectionBlock";
+  }
+});
+exports.ConnectionBlock = void 0;
+var init_ConnectionBlock = __esm({
+  "components/core/molecules/ConnectionBlock.tsx"() {
+    "use client";
+    init_MarkdownContent();
+    init_cn();
+    exports.ConnectionBlock = ({ content, className }) => /* @__PURE__ */ jsxRuntime.jsx(
+      "div",
+      {
+        className: cn(
+          "bg-emerald-50 dark:bg-emerald-900/20 border-l-4 border-emerald-500 rounded-r-lg p-5 mb-6",
+          className
+        ),
+        children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-start gap-3", children: [
+          /* @__PURE__ */ jsxRuntime.jsx(LucideIcons2.Link2, { className: "text-emerald-600 dark:text-emerald-400 flex-shrink-0 mt-1", size: 20 }),
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex-1", children: [
+            /* @__PURE__ */ jsxRuntime.jsx("h4", { className: "font-semibold text-emerald-900 dark:text-emerald-100 mb-2", children: "Building On What You Know" }),
+            /* @__PURE__ */ jsxRuntime.jsx("div", { className: "prose dark:prose-invert prose-sm max-w-none text-gray-700 dark:text-gray-300", children: /* @__PURE__ */ jsxRuntime.jsx(exports.MarkdownContent, { content }) })
+          ] })
+        ] })
+      }
+    );
+    exports.ConnectionBlock.displayName = "ConnectionBlock";
+  }
+});
+
+// components/core/molecules/lessonSegmentUtils.ts
+function parseMarkdownWithCodeBlocks2(content) {
+  const segments = [];
+  const codeBlockRegex = /```([\w-]+)?(?:\s+(run))?\n([\s\S]*?)```/g;
+  let lastIndex = 0;
+  let match;
+  while ((match = codeBlockRegex.exec(content)) !== null) {
+    const before = content.slice(lastIndex, match.index);
+    if (before.trim()) {
+      segments.push({ type: "markdown", content: before });
+    }
+    const rawLanguage = match[1] ?? "text";
+    const runModifier = !!match[2];
+    const suffixRunnable = rawLanguage.endsWith("-runnable");
+    const runnable = runModifier || suffixRunnable;
+    const baseLanguage = suffixRunnable ? rawLanguage.slice(0, -"-runnable".length) || "text" : rawLanguage;
+    segments.push({ type: "code", language: baseLanguage, content: match[3].trim(), runnable });
+    lastIndex = codeBlockRegex.lastIndex;
+  }
+  const remaining = content.slice(lastIndex);
+  if (remaining.trim()) {
+    segments.push({ type: "markdown", content: remaining });
+  }
+  return segments;
+}
+var init_lessonSegmentUtils = __esm({
+  "components/core/molecules/lessonSegmentUtils.ts"() {
+  }
+});
+var BLOOM_CONFIG; exports.BloomQuizBlock = void 0;
+var init_BloomQuizBlock = __esm({
+  "components/core/molecules/BloomQuizBlock.tsx"() {
+    "use client";
+    init_MarkdownContent();
+    init_CodeBlock();
+    init_lessonSegmentUtils();
+    init_useEventBus();
+    init_cn();
+    BLOOM_CONFIG = {
+      remember: { color: "bg-gray-500", bgColor: "bg-gray-50 dark:bg-gray-900/30", label: "Remember" },
+      understand: { color: "bg-blue-500", bgColor: "bg-blue-50 dark:bg-blue-900/30", label: "Understand" },
+      apply: { color: "bg-green-500", bgColor: "bg-green-50 dark:bg-green-900/30", label: "Apply" },
+      analyze: { color: "bg-yellow-500", bgColor: "bg-yellow-50 dark:bg-yellow-900/30", label: "Analyze" },
+      evaluate: { color: "bg-orange-500", bgColor: "bg-orange-50 dark:bg-orange-900/30", label: "Evaluate" },
+      create: { color: "bg-purple-500", bgColor: "bg-purple-50 dark:bg-purple-900/30", label: "Create" }
+    };
+    exports.BloomQuizBlock = ({
+      level,
+      question,
+      answer,
+      index,
+      isAnswered,
+      answerEvent = "ANSWER_BLOOM",
+      className
+    }) => {
+      const [revealed, setRevealed] = React74.useState(false);
+      const config = BLOOM_CONFIG[level];
+      const { emit } = useEventBus();
+      const questionSegments = React74.useMemo(() => parseMarkdownWithCodeBlocks2(question), [question]);
+      const answerSegments = React74.useMemo(() => parseMarkdownWithCodeBlocks2(answer), [answer]);
+      const handleReveal = () => {
+        if (!revealed) {
+          emit(`UI:${answerEvent}`, { index: index ?? 0, level });
+        }
+        setRevealed(!revealed);
+      };
+      return /* @__PURE__ */ jsxRuntime.jsxs(
+        "div",
+        {
+          className: cn(
+            "rounded-lg border border-indigo-100 dark:border-indigo-800 p-4 my-4 transition-all",
+            config.bgColor,
+            className
+          ),
+          children: [
+            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between mb-3", children: [
+              /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2 flex-wrap", children: [
+                index !== void 0 && /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "text-gray-500 dark:text-gray-400 font-medium text-sm", children: [
+                  "Question ",
+                  index + 1
+                ] }),
+                /* @__PURE__ */ jsxRuntime.jsx("span", { className: cn(config.color, "text-white text-xs px-2 py-1 rounded-full font-medium"), children: config.label })
+              ] }),
+              isAnswered && /* @__PURE__ */ jsxRuntime.jsx(LucideIcons2.CheckCircle, { className: "text-green-600 dark:text-green-400 flex-shrink-0", size: 20 })
+            ] }),
+            /* @__PURE__ */ jsxRuntime.jsx("div", { className: "font-semibold text-indigo-900 dark:text-indigo-200 mb-3 space-y-2", children: questionSegments.map(
+              (segment, idx) => segment.type === "markdown" ? /* @__PURE__ */ jsxRuntime.jsx(exports.MarkdownContent, { content: segment.content }, `q-md-${idx}`) : /* @__PURE__ */ jsxRuntime.jsx(
+                exports.CodeBlock,
+                {
+                  language: segment.language ?? "text",
+                  code: segment.content
+                },
+                `q-code-${idx}`
+              )
+            ) }),
+            /* @__PURE__ */ jsxRuntime.jsx(
+              "button",
+              {
+                type: "button",
+                className: "inline-flex items-center rounded-md bg-indigo-600 dark:bg-indigo-500 px-3 py-1.5 text-sm font-medium text-white hover:bg-indigo-700 dark:hover:bg-indigo-600 transition-colors",
+                onClick: handleReveal,
+                children: revealed ? "Hide Answer" : "Reveal Answer"
+              }
+            ),
+            revealed && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "rounded-lg bg-white/80 dark:bg-gray-800/80 p-3 text-sm text-slate-800 dark:text-gray-200 shadow-sm border border-indigo-100 dark:border-indigo-800 mt-3 space-y-2", children: [
+              /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-xs text-gray-600 dark:text-gray-400 mb-1 font-medium uppercase tracking-wide", children: "Answer:" }),
+              answerSegments.map(
+                (segment, idx) => segment.type === "markdown" ? /* @__PURE__ */ jsxRuntime.jsx(exports.MarkdownContent, { content: segment.content }, `a-md-${idx}`) : /* @__PURE__ */ jsxRuntime.jsx(
+                  exports.CodeBlock,
+                  {
+                    language: segment.language ?? "text",
+                    code: segment.content
+                  },
+                  `a-code-${idx}`
+                )
+              )
+            ] })
+          ]
+        }
+      );
+    };
+    exports.BloomQuizBlock.displayName = "BloomQuizBlock";
+  }
+});
+
+// components/core/molecules/parseLessonSegments.ts
+function extractTagContent(content, tagName) {
+  const closedTagRegex = new RegExp(`<${tagName}>([\\s\\S]*?)<\\/${tagName}>`, "i");
+  const closedMatch = content.match(closedTagRegex);
+  if (closedMatch) {
+    return { content: closedMatch[1].trim(), fullMatch: closedMatch[0] };
+  }
+  const unclosedTagRegex = new RegExp(
+    `<${tagName}>([\\s\\S]*?)(?=<(?:activate|connect|reflect|bloom|prq|question|answer|visualize)|\\n\\n#|$)`,
+    "i"
+  );
+  const unclosedMatch = content.match(unclosedTagRegex);
+  if (unclosedMatch) {
+    return { content: unclosedMatch[1].trim(), fullMatch: unclosedMatch[0] };
+  }
+  return null;
+}
+function parseLessonSegments(lesson) {
+  if (!lesson) return [];
+  let content = lesson.replace(/<prq>[\s\S]*?<\/prq>/gi, "").trim();
+  const segments = [];
+  const activateResult = extractTagContent(content, "activate");
+  if (activateResult) {
+    segments.push({ type: "activate", question: activateResult.content });
+    content = content.replace(activateResult.fullMatch, "").trim();
+  }
+  const connectResult = extractTagContent(content, "connect");
+  if (connectResult) {
+    segments.push({ type: "connect", content: connectResult.content });
+    content = content.replace(connectResult.fullMatch, "").trim();
+  }
+  const tagRegex = new RegExp(
+    '(?<reflect><reflect>(?<reflectClosed>[\\s\\S]*?)<\\/reflect>)|(?<reflectUnclosed><reflect>(?<reflectOpen>[\\s\\S]*?)(?=<(?:activate|connect|reflect|bloom|prq|question|answer|visualize)|\\n\\n#|$))|(?<bloom><bloom\\s+level="(?<bloomLevel>remember|understand|apply|analyze|evaluate|create)">(?<bloomClosed>[\\s\\S]*?)<\\/bloom>)|(?<bloomUnclosed><bloom\\s+level="(?<bloomLevelUn>remember|understand|apply|analyze|evaluate|create)">(?<bloomOpen>[\\s\\S]*?)(?=<(?:activate|connect|reflect|bloom|prq|question|answer|visualize)|\\n\\n#|$))|(?<quiz><question>(?<quizQuestion>[\\s\\S]*?)<\\/question>\\s*<answer>(?<quizAnswer>[\\s\\S]*?)<\\/answer>)|(?<visualize><visualize\\s+type="(?<vizType>chart|simulation)"\\s+description="(?<vizDesc>[^"]*?)"\\s*\\/?>)',
+    "gi"
+  );
+  let lastIndex = 0;
+  let match;
+  while ((match = tagRegex.exec(content)) !== null) {
+    const before = content.slice(lastIndex, match.index);
+    if (before.trim()) {
+      segments.push(...parseMarkdownWithCodeBlocks2(before));
+    }
+    const g = match.groups ?? {};
+    if (g.reflect || g.reflectUnclosed) {
+      const prompt = (g.reflectClosed ?? g.reflectOpen ?? "").trim();
+      if (prompt) segments.push({ type: "reflect", prompt });
+    } else if (g.bloom || g.bloomUnclosed) {
+      const level = g.bloomLevel ?? g.bloomLevelUn;
+      const bloomContent = g.bloomClosed ?? g.bloomOpen ?? "";
+      if (level && bloomContent) {
+        const qMatch = bloomContent.match(/<question>([\s\S]*?)<\/question>/i);
+        const aMatch = bloomContent.match(/<answer>([\s\S]*?)<\/answer>/i);
+        if (qMatch && aMatch) {
+          segments.push({ type: "bloom", level, question: qMatch[1].trim(), answer: aMatch[1].trim() });
+        } else if (qMatch) {
+          segments.push({ type: "bloom", level, question: qMatch[1].trim(), answer: "(Answer not provided)" });
+        } else {
+          const clean = bloomContent.replace(/^\*\*Question\s*\d*:?\*\*\s*/i, "").replace(/^\*\*Q\d*:?\*\*\s*/i, "").trim();
+          if (clean) segments.push({ type: "bloom", level, question: clean, answer: "(See answers section below)" });
+        }
+      }
+    } else if (g.quiz) {
+      segments.push({ type: "quiz", question: g.quizQuestion.trim(), answer: g.quizAnswer.trim() });
+    } else if (g.visualize) {
+      segments.push({
+        type: "visualization",
+        visualizationType: g.vizType,
+        description: g.vizDesc ?? ""
+      });
+    }
+    lastIndex = tagRegex.lastIndex;
+  }
+  const remaining = content.slice(lastIndex);
+  if (remaining.trim()) segments.push(...parseMarkdownWithCodeBlocks2(remaining));
+  return segments;
+}
+var init_parseLessonSegments = __esm({
+  "components/core/molecules/parseLessonSegments.ts"() {
+    init_lessonSegmentUtils();
+  }
+});
 
 // components/core/molecules/index.ts
 var init_molecules2 = __esm({
@@ -37708,6 +38086,12 @@ var init_molecules2 = __esm({
     init_SignaturePad();
     init_DocumentViewer();
     init_GraphCanvas();
+    init_ActivationBlock();
+    init_ReflectionBlock();
+    init_ConnectionBlock();
+    init_BloomQuizBlock();
+    init_parseLessonSegments();
+    init_lessonSegmentUtils();
   }
 });
 
@@ -50091,6 +50475,271 @@ init_ShowcaseOrganism();
 init_TeamOrganism();
 init_CaseStudyOrganism();
 
+// components/core/organisms/CodeRunnerPanel.tsx
+init_Box();
+init_Button();
+init_Badge();
+init_Typography();
+init_Stack();
+init_CodeBlock();
+init_useEventBus();
+init_cn();
+var CodeRunnerPanel = ({
+  code: initialCode,
+  language,
+  runnable = true,
+  onRun,
+  runEvent = "RUN_CODE",
+  className
+}) => {
+  const eventBus = useEventBus();
+  const { t } = hooks.useTranslate();
+  const [code, setCode] = React74.useState(initialCode);
+  const [output, setOutput] = React74.useState(null);
+  const [error, setError] = React74.useState(null);
+  const [isRunning, setIsRunning] = React74.useState(false);
+  const handleRun = React74.useCallback(async () => {
+    if (!onRun) return;
+    setIsRunning(true);
+    setError(null);
+    setOutput(null);
+    try {
+      const result = await onRun(code);
+      setOutput(result);
+      eventBus.emit(`UI:${runEvent}`, { language, exitCode: result.exitCode });
+    } catch (err) {
+      const message = err instanceof Error ? err.message : t("common.error");
+      setError(message);
+      eventBus.emit(`UI:${runEvent}`, { language, exitCode: 1, error: message });
+    } finally {
+      setIsRunning(false);
+    }
+  }, [code, language, onRun, runEvent, eventBus, t]);
+  const handleReset = React74.useCallback(() => {
+    setCode(initialCode);
+    setOutput(null);
+    setError(null);
+  }, [initialCode]);
+  if (!runnable || !onRun) {
+    return /* @__PURE__ */ jsxRuntime.jsx(exports.Box, { className, children: /* @__PURE__ */ jsxRuntime.jsx(exports.CodeBlock, { language, code }) });
+  }
+  const hasOutput = output !== null || error !== null;
+  return /* @__PURE__ */ jsxRuntime.jsxs(exports.Box, { className: cn("space-y-3", className), children: [
+    /* @__PURE__ */ jsxRuntime.jsx(
+      exports.CodeBlock,
+      {
+        language,
+        code,
+        editable: true,
+        onChange: setCode,
+        showLanguageBadge: true,
+        showCopyButton: true
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsxs(exports.HStack, { gap: "sm", justify: "between", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs(exports.HStack, { gap: "sm", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(
+          exports.Button,
+          {
+            variant: "primary",
+            size: "sm",
+            onClick: handleRun,
+            disabled: isRunning,
+            className: "min-w-[5rem]",
+            children: isRunning ? /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "inline-flex items-center gap-2", children: [
+              /* @__PURE__ */ jsxRuntime.jsx(LucideIcons2.RotateCcw, { size: 16, className: "animate-spin" }),
+              t("common.loading")
+            ] }) : /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "inline-flex items-center gap-2", children: [
+              /* @__PURE__ */ jsxRuntime.jsx(LucideIcons2.Play, { size: 16 }),
+              "Run"
+            ] })
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          exports.Button,
+          {
+            variant: "secondary",
+            size: "sm",
+            onClick: handleReset,
+            disabled: isRunning,
+            children: /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "inline-flex items-center gap-2", children: [
+              /* @__PURE__ */ jsxRuntime.jsx(LucideIcons2.RotateCcw, { size: 16 }),
+              "Reset"
+            ] })
+          }
+        )
+      ] }),
+      output && /* @__PURE__ */ jsxRuntime.jsxs(
+        exports.Badge,
+        {
+          variant: output.exitCode === 0 ? "success" : "danger",
+          size: "sm",
+          children: [
+            "Exit ",
+            output.exitCode
+          ]
+        }
+      )
+    ] }),
+    hasOutput && /* @__PURE__ */ jsxRuntime.jsxs(exports.Box, { className: "rounded-lg border border-gray-700 bg-[#0d0d0d] overflow-hidden", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs(
+        exports.HStack,
+        {
+          gap: "sm",
+          align: "center",
+          className: "px-3 py-2 bg-gray-800 border-b border-gray-700",
+          children: [
+            /* @__PURE__ */ jsxRuntime.jsx(LucideIcons2.Terminal, { size: 16, className: "text-gray-400" }),
+            /* @__PURE__ */ jsxRuntime.jsx(exports.Typography, { variant: "small", className: "text-gray-300 font-medium", children: "Output" })
+          ]
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsx(exports.VStack, { gap: "none", className: "p-3 font-mono text-sm", children: error ? /* @__PURE__ */ jsxRuntime.jsx(exports.Typography, { variant: "small", className: "text-red-400 whitespace-pre-wrap", children: error }) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+        output?.stdout ? /* @__PURE__ */ jsxRuntime.jsx(exports.Typography, { variant: "small", className: "text-gray-200 whitespace-pre-wrap", children: output.stdout }) : null,
+        output?.stderr ? /* @__PURE__ */ jsxRuntime.jsx(exports.Typography, { variant: "small", className: "text-red-400 whitespace-pre-wrap", children: output.stderr }) : null,
+        !output?.stdout && !output?.stderr ? /* @__PURE__ */ jsxRuntime.jsx(exports.Typography, { variant: "small", className: "text-gray-500 italic", children: "No output" }) : null,
+        output && output.testResults.length > 0 && /* @__PURE__ */ jsxRuntime.jsx(exports.Box, { className: "mt-3 pt-3 border-t border-gray-700 space-y-2", children: output.testResults.map((test, index) => /* @__PURE__ */ jsxRuntime.jsxs(exports.HStack, { gap: "sm", align: "start", className: "text-xs", children: [
+          test.passed ? /* @__PURE__ */ jsxRuntime.jsx(LucideIcons2.CheckCircle, { size: 14, className: "text-green-400 mt-0.5" }) : /* @__PURE__ */ jsxRuntime.jsx(LucideIcons2.XCircle, { size: 14, className: "text-red-400 mt-0.5" }),
+          /* @__PURE__ */ jsxRuntime.jsxs(exports.VStack, { gap: "xs", className: "flex-1", children: [
+            /* @__PURE__ */ jsxRuntime.jsxs(
+              exports.Typography,
+              {
+                variant: "small",
+                className: test.passed ? "text-green-400" : "text-red-400",
+                children: [
+                  "Test ",
+                  index + 1,
+                  ": ",
+                  test.passed ? "passed" : "failed"
+                ]
+              }
+            ),
+            /* @__PURE__ */ jsxRuntime.jsxs(exports.Typography, { variant: "small", className: "text-gray-400", children: [
+              "Input: ",
+              test.input
+            ] }),
+            /* @__PURE__ */ jsxRuntime.jsxs(exports.Typography, { variant: "small", className: "text-gray-400", children: [
+              "Expected: ",
+              test.expectedOutput
+            ] }),
+            /* @__PURE__ */ jsxRuntime.jsxs(exports.Typography, { variant: "small", className: "text-gray-400", children: [
+              "Actual: ",
+              test.actualOutput
+            ] })
+          ] })
+        ] }, index)) })
+      ] }) })
+    ] })
+  ] });
+};
+CodeRunnerPanel.displayName = "CodeRunnerPanel";
+
+// components/core/organisms/SegmentRenderer.tsx
+init_MarkdownContent();
+init_CodeBlock();
+init_QuizBlock();
+init_ActivationBlock();
+init_ConnectionBlock();
+init_ReflectionBlock();
+init_BloomQuizBlock();
+init_cn();
+var SegmentRenderer = ({
+  segments,
+  className,
+  containerClassName,
+  userProgress,
+  onRunCodeSimulation,
+  onRenderVisualization
+}) => {
+  if (segments.length === 0) return null;
+  let reflectIndex = 0;
+  let bloomIndex = 0;
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      className: cn(
+        "border border-gray-200 dark:border-gray-700 rounded-lg p-2 md:p-4 overflow-x-auto space-y-6",
+        containerClassName,
+        className
+      ),
+      children: segments.map((segment, index) => {
+        if (segment.type === "markdown") {
+          return /* @__PURE__ */ jsxRuntime.jsx(exports.MarkdownContent, { content: segment.content }, `md-${index}`);
+        }
+        if (segment.type === "code") {
+          if (segment.runnable && onRunCodeSimulation) {
+            return /* @__PURE__ */ jsxRuntime.jsx(
+              CodeRunnerPanel,
+              {
+                language: segment.language,
+                code: segment.content,
+                runnable: true,
+                onRun: (code) => onRunCodeSimulation(code, segment.language)
+              },
+              `code-${index}`
+            );
+          }
+          return /* @__PURE__ */ jsxRuntime.jsx(
+            exports.CodeBlock,
+            {
+              language: segment.language ?? "text",
+              code: segment.content
+            },
+            `code-${index}`
+          );
+        }
+        if (segment.type === "quiz") {
+          return /* @__PURE__ */ jsxRuntime.jsx(exports.QuizBlock, { question: segment.question, answer: segment.answer }, `quiz-${index}`);
+        }
+        if (segment.type === "activate") {
+          return /* @__PURE__ */ jsxRuntime.jsx(
+            exports.ActivationBlock,
+            {
+              question: segment.question,
+              savedResponse: userProgress?.activationResponse
+            },
+            `activate-${index}`
+          );
+        }
+        if (segment.type === "connect") {
+          return /* @__PURE__ */ jsxRuntime.jsx(exports.ConnectionBlock, { content: segment.content }, `connect-${index}`);
+        }
+        if (segment.type === "reflect") {
+          const ri = reflectIndex++;
+          return /* @__PURE__ */ jsxRuntime.jsx(
+            exports.ReflectionBlock,
+            {
+              prompt: segment.prompt,
+              index: ri,
+              savedNote: userProgress?.reflectionNotes?.[ri]
+            },
+            `reflect-${index}`
+          );
+        }
+        if (segment.type === "bloom") {
+          const bi = bloomIndex++;
+          return /* @__PURE__ */ jsxRuntime.jsx(
+            exports.BloomQuizBlock,
+            {
+              level: segment.level,
+              question: segment.question,
+              answer: segment.answer,
+              index: bi,
+              isAnswered: userProgress?.bloomAnswered?.[bi]
+            },
+            `bloom-${index}`
+          );
+        }
+        if (segment.type === "visualization") {
+          return onRenderVisualization ? onRenderVisualization(segment.visualizationType, segment.description, index) ?? null : null;
+        }
+        return null;
+      })
+    }
+  );
+};
+SegmentRenderer.displayName = "SegmentRenderer";
+
 // components/core/templates/index.ts
 init_DashboardLayout();
 init_AuthLayout();
@@ -50123,6 +50772,7 @@ exports.CastleBoard = CastleBoard;
 exports.CastleTemplate = CastleTemplate;
 exports.ChoiceButton = ChoiceButton;
 exports.ClassifierBoard = ClassifierBoard;
+exports.CodeRunnerPanel = CodeRunnerPanel;
 exports.CollapsibleSection = CollapsibleSection;
 exports.CombatLog = CombatLog;
 exports.ComboCounter = ComboCounter;
@@ -50180,6 +50830,7 @@ exports.SHEET_COLUMNS = SHEET_COLUMNS;
 exports.SPRITE_SHEET_LAYOUT = SPRITE_SHEET_LAYOUT;
 exports.ScoreBoard = ScoreBoard;
 exports.ScoreDisplay = ScoreDisplay;
+exports.SegmentRenderer = SegmentRenderer;
 exports.SequenceBar = SequenceBar;
 exports.SequencerBoard = SequencerBoard;
 exports.SimulationCanvas = SimulationCanvas;
@@ -50233,6 +50884,8 @@ exports.getTileDimensions = getTileDimensions;
 exports.inferDirection = inferDirection;
 exports.isoToScreen = isoToScreen;
 exports.mapBookData = mapBookData;
+exports.parseLessonSegments = parseLessonSegments;
+exports.parseMarkdownWithCodeBlocks = parseMarkdownWithCodeBlocks2;
 exports.resolveFieldMap = resolveFieldMap;
 exports.resolveFrame = resolveFrame;
 exports.resolveSheetDirection = resolveSheetDirection;