@almadar/ui 5.33.1 → 5.34.0

package/dist/components/index.js

@@ -1,12 +1,12 @@
 import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
-import * as React74 from 'react';
-import React74__default, { useContext, useMemo, useRef, useEffect, useCallback, useState, useLayoutEffect, Suspense, lazy, createContext, useId, useSyncExternalStore } from 'react';
+import * as React77 from 'react';
+import React77__default, { useContext, useMemo, useRef, useEffect, useCallback, useState, Suspense, lazy, createContext, useLayoutEffect, useId, useSyncExternalStore } from 'react';
 import { clsx } from 'clsx';
 import { twMerge } from 'tailwind-merge';
 import { EventBusContext, useTraitScope, TraitScopeProvider } from '@almadar/ui/providers';
 import { createLogger, isLogLevelEnabled } from '@almadar/logger';
 import * as LucideIcons2 from 'lucide-react';
-import { Loader2, X, Code, FileText, WrapText, Check, Copy, HelpCircle, List, Printer, ChevronRight, ChevronLeft, CheckCircle, XCircle, Wrench, RotateCcw, Send, Lightbulb, PauseCircle, Link2, Search, ChevronUp, ChevronDown, MoreHorizontal, Bug, Package, Calendar, Pencil, Eye, Image as Image$1, Upload, ZoomIn, ArrowRight, Pause, Play, SkipForward, TrendingUp, TrendingDown, Minus, AlertCircle, Circle, Clock, CheckCircle2, Terminal, Type, Heading1, Heading2, Heading3, ListOrdered, Quote, GitBranch, Plus, Trash, ArrowLeft, Menu as Menu$1, AlertTriangle, Trash2, Eraser, ZoomOut, Download, Tag, User, DollarSign, Zap, Sword, Move, Heart, Shield } from 'lucide-react';
+import { Loader2, X, List, Printer, ChevronRight, ChevronLeft, CheckCircle, XCircle, Wrench, RotateCcw, Send, Play, Terminal, Search, ChevronUp, ChevronDown, MoreHorizontal, Bug, Package, Calendar, Pencil, Eye, Image as Image$1, Upload, ZoomIn, ArrowRight, Pause, SkipForward, TrendingUp, TrendingDown, Minus, AlertCircle, Circle, Clock, CheckCircle2, Code, FileText, WrapText, Check, Copy, HelpCircle, Type, Heading1, Heading2, Heading3, ListOrdered, Quote, GitBranch, Plus, Trash, ArrowLeft, Menu as Menu$1, AlertTriangle, Trash2, Eraser, ZoomOut, Download, Lightbulb, PauseCircle, Link2, Tag, User, DollarSign, Zap, Sword, Move, Heart, Shield } from 'lucide-react';
 import * as PhosphorIcons from '@phosphor-icons/react';
 import * as TablerIcons from '@tabler/icons-react';
 import * as FaIcons from 'react-icons/fa';
@@ -230,7 +230,7 @@ var init_SvgFlow = __esm({
       width = 100,
       height = 100
     }) => {
-      const markerId = React74__default.useMemo(() => {
+      const markerId = React77__default.useMemo(() => {
         flowIdCounter += 1;
         return `almadar-flow-arrow-${flowIdCounter}`;
       }, []);
@@ -823,7 +823,7 @@ var init_SvgRing = __esm({
       width = 100,
       height = 100
     }) => {
-      const gradientId = React74__default.useMemo(() => {
+      const gradientId = React77__default.useMemo(() => {
         ringIdCounter += 1;
         return `almadar-ring-glow-${ringIdCounter}`;
       }, []);
@@ -1931,7 +1931,7 @@ var init_Icon = __esm({
       const directIcon = typeof icon === "string" ? void 0 : icon;
       const effectiveName = typeof icon === "string" ? icon : name;
       const family = useIconFamily();
-      const RenderedComponent = React74__default.useMemo(() => {
+      const RenderedComponent = React77__default.useMemo(() => {
         if (directIcon) return null;
         return effectiveName ? resolveIconForFamily(effectiveName, family) : null;
       }, [directIcon, effectiveName, family]);
@@ -1990,7 +1990,7 @@ function resolveIconProp(value, sizeClass) {
     const IconComp = value;
     return /* @__PURE__ */ jsx(IconComp, { className: sizeClass });
   }
-  if (React74__default.isValidElement(value)) {
+  if (React77__default.isValidElement(value)) {
     return value;
   }
   if (typeof value === "object" && value !== null && "render" in value) {
@@ -2066,7 +2066,7 @@ var init_Button = __esm({
       md: "h-icon-default w-icon-default",
       lg: "h-icon-default w-icon-default"
     };
-    Button = React74__default.forwardRef(
+    Button = React77__default.forwardRef(
       ({
         className,
         variant = "primary",
@@ -2133,7 +2133,7 @@ var init_Input = __esm({
     init_cn();
     init_Icon();
     init_useEventBus();
-    Input = React74__default.forwardRef(
+    Input = React77__default.forwardRef(
       ({
         className,
         inputType,
@@ -2293,7 +2293,7 @@ var Label;
 var init_Label = __esm({
   "components/core/atoms/Label.tsx"() {
     init_cn();
-    Label = React74__default.forwardRef(
+    Label = React77__default.forwardRef(
       ({ className, required, children, ...props }, ref) => {
         return /* @__PURE__ */ jsxs(
           "label",
@@ -2320,7 +2320,7 @@ var init_Textarea = __esm({
   "components/core/atoms/Textarea.tsx"() {
     init_cn();
     init_useEventBus();
-    Textarea = React74__default.forwardRef(
+    Textarea = React77__default.forwardRef(
       ({ className, error, onChange, ...props }, ref) => {
         const eventBus = useEventBus();
         const handleChange = (e) => {
@@ -2559,7 +2559,7 @@ var init_Select = __esm({
     init_cn();
     init_Icon();
     init_useEventBus();
-    Select = React74__default.forwardRef(
+    Select = React77__default.forwardRef(
       (props, _ref) => {
         const { multiple, searchable, clearable } = props;
         if (multiple || searchable || clearable) {
@@ -2576,7 +2576,7 @@ var init_Checkbox = __esm({
   "components/core/atoms/Checkbox.tsx"() {
     init_cn();
     init_useEventBus();
-    Checkbox = React74__default.forwardRef(
+    Checkbox = React77__default.forwardRef(
       ({ className, label, id, onChange, ...props }, ref) => {
         const inputId = id || `checkbox-${Math.random().toString(36).substr(2, 9)}`;
         const eventBus = useEventBus();
@@ -2630,7 +2630,7 @@ var init_Spinner = __esm({
       md: "h-6 w-6",
       lg: "h-8 w-8"
     };
-    Spinner = React74__default.forwardRef(
+    Spinner = React77__default.forwardRef(
       ({ className, size = "md", overlay, ...props }, ref) => {
         if (overlay) {
           return /* @__PURE__ */ jsx(
@@ -2720,7 +2720,7 @@ var init_Card = __esm({
       chip: "shadow-none rounded-pill border-[length:var(--border-width)] border-border",
       "tile-image-first": "p-0 overflow-hidden"
     };
-    Card = React74__default.forwardRef(
+    Card = React77__default.forwardRef(
       ({
         className,
         variant = "bordered",
@@ -2768,9 +2768,9 @@ var init_Card = __esm({
       }
     );
     Card.displayName = "Card";
-    CardHeader = React74__default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: cn("mb-4", className), ...props }));
+    CardHeader = React77__default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: cn("mb-4", className), ...props }));
     CardHeader.displayName = "CardHeader";
-    CardTitle = React74__default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+    CardTitle = React77__default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
       "h3",
       {
         ref,
@@ -2783,11 +2783,11 @@ var init_Card = __esm({
       }
     ));
     CardTitle.displayName = "CardTitle";
-    CardContent = React74__default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: cn("", className), ...props }));
+    CardContent = React77__default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: cn("", className), ...props }));
     CardContent.displayName = "CardContent";
     CardBody = CardContent;
     CardBody.displayName = "CardBody";
-    CardFooter = React74__default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+    CardFooter = React77__default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
       "div",
       {
         ref,
@@ -2840,7 +2840,7 @@ var init_Badge = __esm({
       md: "px-2.5 py-1 text-sm",
       lg: "px-3 py-1.5 text-base"
     };
-    Badge = React74__default.forwardRef(
+    Badge = React77__default.forwardRef(
       ({ className, variant = "default", size = "sm", amount, label, icon, children, onRemove, removeLabel, ...props }, ref) => {
         const iconSizes3 = {
           sm: "h-icon-default w-icon-default",
@@ -2933,7 +2933,7 @@ var init_FilterPill = __esm({
       md: "w-3.5 h-3.5",
       lg: "w-4 h-4"
     };
-    FilterPill = React74__default.forwardRef(
+    FilterPill = React77__default.forwardRef(
       ({
         className,
         variant = "default",
@@ -3062,8 +3062,8 @@ var init_Avatar = __esm({
       actionPayload
     }) => {
       const eventBus = useEventBus();
-      const [imgFailed, setImgFailed] = React74__default.useState(false);
-      React74__default.useEffect(() => {
+      const [imgFailed, setImgFailed] = React77__default.useState(false);
+      React77__default.useEffect(() => {
         setImgFailed(false);
       }, [src]);
       const initials = providedInitials ?? (name ? generateInitials(name) : void 0);
@@ -3267,7 +3267,7 @@ var init_Box = __esm({
       fixed: "fixed",
       sticky: "sticky"
     };
-    Box = React74__default.forwardRef(
+    Box = React77__default.forwardRef(
       ({
         padding,
         paddingX,
@@ -3317,7 +3317,7 @@ var init_Box = __esm({
           onMouseLeave?.(e);
         }, [hoverEvent, eventBus, onMouseLeave]);
         const isClickable = action || onClick;
-        return React74__default.createElement(
+        return React77__default.createElement(
           Component,
           {
             ref,
@@ -3642,7 +3642,7 @@ var init_Radio = __esm({
       md: "w-2.5 h-2.5",
       lg: "w-3 h-3"
     };
-    Radio = React74__default.forwardRef(
+    Radio = React77__default.forwardRef(
       ({
         label,
         helperText,
@@ -3659,12 +3659,12 @@ var init_Radio = __esm({
         onChange,
         ...props
       }, ref) => {
-        const reactId = React74__default.useId();
+        const reactId = React77__default.useId();
         const baseId = id || `radio-${reactId}`;
         const hasError = !!error;
         const eventBus = useEventBus();
-        const [selected, setSelected] = React74__default.useState(value);
-        React74__default.useEffect(() => {
+        const [selected, setSelected] = React77__default.useState(value);
+        React77__default.useEffect(() => {
           if (value !== void 0) setSelected(value);
         }, [value]);
         const pick = (next, e) => {
@@ -3846,7 +3846,7 @@ var init_Switch = __esm({
   "components/core/atoms/Switch.tsx"() {
     "use client";
     init_cn();
-    Switch = React74.forwardRef(
+    Switch = React77.forwardRef(
       ({
         checked,
         defaultChecked = false,
@@ -3857,10 +3857,10 @@ var init_Switch = __esm({
         name,
         className
       }, ref) => {
-        const [isChecked, setIsChecked] = React74.useState(
+        const [isChecked, setIsChecked] = React77.useState(
           checked !== void 0 ? checked : defaultChecked
         );
-        React74.useEffect(() => {
+        React77.useEffect(() => {
           if (checked !== void 0) {
             setIsChecked(checked);
           }
@@ -4689,7 +4689,7 @@ var Dialog;
 var init_Dialog = __esm({
   "components/core/atoms/Dialog.tsx"() {
     init_cn();
-    Dialog = React74__default.forwardRef(
+    Dialog = React77__default.forwardRef(
       ({
         role = "dialog",
         "aria-modal": ariaModal = true,
@@ -4715,7 +4715,7 @@ var Aside;
 var init_Aside = __esm({
   "components/core/atoms/Aside.tsx"() {
     init_cn();
-    Aside = React74__default.forwardRef(
+    Aside = React77__default.forwardRef(
       ({ className, children, ...rest }, ref) => /* @__PURE__ */ jsx("aside", { ref, className: cn(className), ...rest, children })
     );
     Aside.displayName = "Aside";
@@ -4793,8 +4793,8 @@ var init_LawReferenceTooltip = __esm({
       className
     }) => {
       const { t } = useTranslate();
-      const [isVisible, setIsVisible] = React74__default.useState(false);
-      const timeoutRef = React74__default.useRef(null);
+      const [isVisible, setIsVisible] = React77__default.useState(false);
+      const timeoutRef = React77__default.useRef(null);
       const handleMouseEnter = () => {
         if (timeoutRef.current) clearTimeout(timeoutRef.current);
         timeoutRef.current = setTimeout(() => setIsVisible(true), 200);
@@ -4803,7 +4803,7 @@ var init_LawReferenceTooltip = __esm({
         if (timeoutRef.current) clearTimeout(timeoutRef.current);
         setIsVisible(false);
       };
-      React74__default.useEffect(() => {
+      React77__default.useEffect(() => {
         return () => {
           if (timeoutRef.current) clearTimeout(timeoutRef.current);
         };
@@ -5013,7 +5013,7 @@ var init_StatusDot = __esm({
       md: "w-2.5 h-2.5",
       lg: "w-3 h-3"
     };
-    StatusDot = React74__default.forwardRef(
+    StatusDot = React77__default.forwardRef(
       ({ className, status = "offline", pulse = false, size = "md", label, ...props }, ref) => {
         return /* @__PURE__ */ jsx(
           "span",
@@ -5067,7 +5067,7 @@ var init_TrendIndicator = __esm({
       down: "trending-down",
       flat: "arrow-right"
     };
-    TrendIndicator = React74__default.forwardRef(
+    TrendIndicator = React77__default.forwardRef(
       ({
         className,
         value,
@@ -5134,7 +5134,7 @@ var init_RangeSlider = __esm({
       md: "w-4 h-4",
       lg: "w-5 h-5"
     };
-    RangeSlider = React74__default.forwardRef(
+    RangeSlider = React77__default.forwardRef(
       ({
         className,
         min = 0,
@@ -5730,7 +5730,7 @@ var init_ContentSection = __esm({
       md: "py-16",
       lg: "py-24"
     };
-    ContentSection = React74__default.forwardRef(
+    ContentSection = React77__default.forwardRef(
       ({ children, background = "default", padding = "lg", id, className }, ref) => {
         return /* @__PURE__ */ jsx(
           Box,
@@ -6264,7 +6264,7 @@ var init_AnimatedReveal = __esm({
       "scale-up": { opacity: 1, transform: "scale(1) translateY(0)" },
       "none": {}
     };
-    AnimatedReveal = React74__default.forwardRef(
+    AnimatedReveal = React77__default.forwardRef(
       ({
         trigger = "scroll",
         animation = "fade-up",
@@ -6424,7 +6424,7 @@ var init_AnimatedGraphic = __esm({
   "components/marketing/atoms/AnimatedGraphic.tsx"() {
     "use client";
     init_cn();
-    AnimatedGraphic = React74__default.forwardRef(
+    AnimatedGraphic = React77__default.forwardRef(
       ({
         src,
         svgContent,
@@ -6447,7 +6447,7 @@ var init_AnimatedGraphic = __esm({
         const fetchedSvg = useFetchedSvg(svgContent ? void 0 : src);
         const resolvedSvg = svgContent ?? fetchedSvg;
         const prevAnimateRef = useRef(animate);
-        const setRef = React74__default.useCallback(
+        const setRef = React77__default.useCallback(
           (node) => {
             containerRef.current = node;
             if (typeof ref === "function") ref(node);
@@ -7129,7 +7129,7 @@ var init_ErrorBoundary = __esm({
         }
       );
     };
-    ErrorBoundary = class extends React74__default.Component {
+    ErrorBoundary = class extends React77__default.Component {
       constructor(props) {
         super(props);
         __publicField(this, "reset", () => {
@@ -8236,9 +8236,9 @@ function ControlButton({
   className
 }) {
   const eventBus = useEventBus();
-  const [isPressed, setIsPressed] = React74.useState(false);
+  const [isPressed, setIsPressed] = React77.useState(false);
   const actualPressed = pressed ?? isPressed;
-  const handlePointerDown = React74.useCallback(
+  const handlePointerDown = React77.useCallback(
     (e) => {
       e.preventDefault();
       if (disabled) return;
@@ -8248,7 +8248,7 @@ function ControlButton({
     },
     [disabled, pressEvent, eventBus, onPress]
   );
-  const handlePointerUp = React74.useCallback(
+  const handlePointerUp = React77.useCallback(
     (e) => {
       e.preventDefault();
       if (disabled) return;
@@ -8258,7 +8258,7 @@ function ControlButton({
     },
     [disabled, releaseEvent, eventBus, onRelease]
   );
-  const handlePointerLeave = React74.useCallback(
+  const handlePointerLeave = React77.useCallback(
     (e) => {
       if (isPressed) {
         setIsPressed(false);
@@ -8338,8 +8338,8 @@ function ActionButtons({
   disabled
 }) {
   const eventBus = useEventBus();
-  const [activeButtons, setActiveButtons] = React74.useState(/* @__PURE__ */ new Set());
-  const handlePress = React74.useCallback(
+  const [activeButtons, setActiveButtons] = React77.useState(/* @__PURE__ */ new Set());
+  const handlePress = React77.useCallback(
     (id) => {
       setActiveButtons((prev) => new Set(prev).add(id));
       if (actionEvent) eventBus.emit(`UI:${actionEvent}`, { id, pressed: true });
@@ -8347,7 +8347,7 @@ function ActionButtons({
     },
     [actionEvent, eventBus, onAction]
   );
-  const handleRelease = React74.useCallback(
+  const handleRelease = React77.useCallback(
     (id) => {
       setActiveButtons((prev) => {
         const next = new Set(prev);
@@ -8543,6 +8543,85 @@ var init_ActionPalette = __esm({
     ActionPalette.displayName = "ActionPalette";
   }
 });
+var ActivationBlock;
+var init_ActivationBlock = __esm({
+  "components/core/molecules/ActivationBlock.tsx"() {
+    "use client";
+    init_useEventBus();
+    init_cn();
+    ActivationBlock = ({
+      question,
+      savedResponse,
+      saveEvent = "SAVE_ACTIVATION",
+      className
+    }) => {
+      const [response, setResponse] = useState(savedResponse ?? "");
+      const [isExpanded, setIsExpanded] = useState(!savedResponse);
+      const { emit } = useEventBus();
+      const handleSubmit = () => {
+        emit(`UI:${saveEvent}`, { response });
+        setIsExpanded(false);
+      };
+      return /* @__PURE__ */ 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__ */ jsxs("div", { className: "flex items-start gap-3", children: [
+            /* @__PURE__ */ jsx(Lightbulb, { className: "text-indigo-600 dark:text-indigo-400 flex-shrink-0 mt-1", size: 24 }),
+            /* @__PURE__ */ jsxs("div", { className: "flex-1", children: [
+              /* @__PURE__ */ jsx("h4", { className: "font-semibold text-indigo-900 dark:text-indigo-100 mb-2", children: "Before You Begin..." }),
+              /* @__PURE__ */ jsx("p", { className: "text-gray-700 dark:text-gray-300 mb-3 text-sm md:text-base", children: question }),
+              isExpanded ? /* @__PURE__ */ jsxs(Fragment, { children: [
+                /* @__PURE__ */ 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__ */ jsxs("div", { className: "flex gap-2 mt-3", children: [
+                  /* @__PURE__ */ 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__ */ 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__ */ 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"
+                }
+              )
+            ] })
+          ] })
+        }
+      );
+    };
+    ActivationBlock.displayName = "ActivationBlock";
+  }
+});
 var variantBorderClasses, variantIconColors, iconMap2, Alert;
 var init_Alert = __esm({
   "components/core/molecules/Alert.tsx"() {
@@ -11467,102 +11546,6 @@ var init_BehaviorView = __esm({
     BehaviorView.displayName = "BehaviorView";
   }
 });
-var MIN_DIAGRAM_WIDTH, ScaledDiagram;
-var init_ScaledDiagram = __esm({
-  "components/core/molecules/ScaledDiagram.tsx"() {
-    init_Box();
-    init_cn();
-    MIN_DIAGRAM_WIDTH = 200;
-    ScaledDiagram = ({
-      children,
-      className
-    }) => {
-      const { t: _t } = useTranslate();
-      const wrapperRef = useRef(null);
-      const contentRef = useRef(null);
-      const [layout, setLayout] = useState(null);
-      const measure = useCallback(() => {
-        const wrapper = wrapperRef.current;
-        const content = contentRef.current;
-        if (!wrapper || !content) return;
-        const containerW = wrapper.clientWidth;
-        if (containerW <= 0) return;
-        let diagramW = 0;
-        let diagramH = 0;
-        const children2 = content.children;
-        for (let i = 0; i < children2.length; i++) {
-          const child = children2[i];
-          const w = child.style?.width;
-          const h = child.style?.height;
-          if (w && /^\d+/.test(w) && h && /^\d+/.test(h)) {
-            diagramW = parseFloat(w);
-            diagramH = parseFloat(h);
-            break;
-          }
-          if (child.offsetWidth > MIN_DIAGRAM_WIDTH) {
-            diagramW = child.offsetWidth;
-            diagramH = child.offsetHeight;
-            break;
-          }
-        }
-        if (diagramW < MIN_DIAGRAM_WIDTH || diagramH <= 0) {
-          setLayout(null);
-          return;
-        }
-        const s = Math.min(1, containerW / diagramW);
-        setLayout({ scale: s, height: diagramH * s });
-      }, []);
-      useEffect(() => {
-        const content = contentRef.current;
-        if (!content) return;
-        let raf1 = requestAnimationFrame(() => {
-          requestAnimationFrame(() => measure());
-        });
-        const mo = new MutationObserver(() => {
-          requestAnimationFrame(() => measure());
-        });
-        mo.observe(content, { childList: true, subtree: true, attributes: true });
-        return () => {
-          cancelAnimationFrame(raf1);
-          mo.disconnect();
-        };
-      }, [measure, children]);
-      useEffect(() => {
-        const wrapper = wrapperRef.current;
-        if (!wrapper) return;
-        const ro = new ResizeObserver(() => measure());
-        ro.observe(wrapper);
-        return () => ro.disconnect();
-      }, [measure]);
-      const hasLayout = layout !== null;
-      return /* @__PURE__ */ jsx(
-        Box,
-        {
-          ref: wrapperRef,
-          className: cn("w-full", className),
-          style: {
-            // Only clip overflow once we have a valid measurement
-            overflow: hasLayout ? "hidden" : void 0,
-            height: hasLayout ? layout.height : void 0
-          },
-          children: /* @__PURE__ */ jsx(
-            Box,
-            {
-              ref: contentRef,
-              style: {
-                width: "max-content",
-                transformOrigin: "top left",
-                transform: hasLayout && layout.scale < 1 ? `scale(${layout.scale})` : void 0
-              },
-              children
-            }
-          )
-        }
-      );
-    };
-    ScaledDiagram.displayName = "ScaledDiagram";
-  }
-});
 
 // node_modules/katex/dist/katex.min.css
 var init_katex_min = __esm({
@@ -12002,7 +11985,7 @@ var init_CodeBlock = __esm({
     };
     LINE_PROPS_FN = (n) => ({ "data-line": String(n - 1) });
     HIDDEN_LINE_NUMBERS = { display: "none" };
-    CodeBlock = React74__default.memo(
+    CodeBlock = React77__default.memo(
       ({
         code: rawCode,
         language = "text",
@@ -12589,7 +12572,7 @@ var init_MarkdownContent = __esm({
     init_Box();
     init_CodeBlock();
     init_cn();
-    MarkdownContent = React74__default.memo(
+    MarkdownContent = React77__default.memo(
       ({ content, direction = "ltr", className }) => {
         const { t: _t } = useTranslate();
         const safeContent = typeof content === "string" ? content : String(content ?? "");
@@ -12754,6 +12737,227 @@ var init_MarkdownContent = __esm({
     MarkdownContent.displayName = "MarkdownContent";
   }
 });
+
+// components/core/molecules/lessonSegmentUtils.ts
+function parseMarkdownWithCodeBlocks(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, BloomQuizBlock;
+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" }
+    };
+    BloomQuizBlock = ({
+      level,
+      question,
+      answer,
+      index,
+      isAnswered,
+      answerEvent = "ANSWER_BLOOM",
+      className
+    }) => {
+      const [revealed, setRevealed] = useState(false);
+      const config = BLOOM_CONFIG[level];
+      const { emit } = useEventBus();
+      const questionSegments = useMemo(() => parseMarkdownWithCodeBlocks(question), [question]);
+      const answerSegments = useMemo(() => parseMarkdownWithCodeBlocks(answer), [answer]);
+      const handleReveal = () => {
+        if (!revealed) {
+          emit(`UI:${answerEvent}`, { index: index ?? 0, level });
+        }
+        setRevealed(!revealed);
+      };
+      return /* @__PURE__ */ 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__ */ jsxs("div", { className: "flex items-center justify-between mb-3", children: [
+              /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 flex-wrap", children: [
+                index !== void 0 && /* @__PURE__ */ jsxs("span", { className: "text-gray-500 dark:text-gray-400 font-medium text-sm", children: [
+                  "Question ",
+                  index + 1
+                ] }),
+                /* @__PURE__ */ jsx("span", { className: cn(config.color, "text-white text-xs px-2 py-1 rounded-full font-medium"), children: config.label })
+              ] }),
+              isAnswered && /* @__PURE__ */ jsx(CheckCircle, { className: "text-green-600 dark:text-green-400 flex-shrink-0", size: 20 })
+            ] }),
+            /* @__PURE__ */ 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__ */ jsx(MarkdownContent, { content: segment.content }, `q-md-${idx}`) : /* @__PURE__ */ jsx(
+                CodeBlock,
+                {
+                  language: segment.language ?? "text",
+                  code: segment.content
+                },
+                `q-code-${idx}`
+              )
+            ) }),
+            /* @__PURE__ */ 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__ */ 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__ */ 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__ */ jsx(MarkdownContent, { content: segment.content }, `a-md-${idx}`) : /* @__PURE__ */ jsx(
+                  CodeBlock,
+                  {
+                    language: segment.language ?? "text",
+                    code: segment.content
+                  },
+                  `a-code-${idx}`
+                )
+              )
+            ] })
+          ]
+        }
+      );
+    };
+    BloomQuizBlock.displayName = "BloomQuizBlock";
+  }
+});
+var MIN_DIAGRAM_WIDTH, ScaledDiagram;
+var init_ScaledDiagram = __esm({
+  "components/core/molecules/ScaledDiagram.tsx"() {
+    init_Box();
+    init_cn();
+    MIN_DIAGRAM_WIDTH = 200;
+    ScaledDiagram = ({
+      children,
+      className
+    }) => {
+      const { t: _t } = useTranslate();
+      const wrapperRef = useRef(null);
+      const contentRef = useRef(null);
+      const [layout, setLayout] = useState(null);
+      const measure = useCallback(() => {
+        const wrapper = wrapperRef.current;
+        const content = contentRef.current;
+        if (!wrapper || !content) return;
+        const containerW = wrapper.clientWidth;
+        if (containerW <= 0) return;
+        let diagramW = 0;
+        let diagramH = 0;
+        const children2 = content.children;
+        for (let i = 0; i < children2.length; i++) {
+          const child = children2[i];
+          const w = child.style?.width;
+          const h = child.style?.height;
+          if (w && /^\d+/.test(w) && h && /^\d+/.test(h)) {
+            diagramW = parseFloat(w);
+            diagramH = parseFloat(h);
+            break;
+          }
+          if (child.offsetWidth > MIN_DIAGRAM_WIDTH) {
+            diagramW = child.offsetWidth;
+            diagramH = child.offsetHeight;
+            break;
+          }
+        }
+        if (diagramW < MIN_DIAGRAM_WIDTH || diagramH <= 0) {
+          setLayout(null);
+          return;
+        }
+        const s = Math.min(1, containerW / diagramW);
+        setLayout({ scale: s, height: diagramH * s });
+      }, []);
+      useEffect(() => {
+        const content = contentRef.current;
+        if (!content) return;
+        let raf1 = requestAnimationFrame(() => {
+          requestAnimationFrame(() => measure());
+        });
+        const mo = new MutationObserver(() => {
+          requestAnimationFrame(() => measure());
+        });
+        mo.observe(content, { childList: true, subtree: true, attributes: true });
+        return () => {
+          cancelAnimationFrame(raf1);
+          mo.disconnect();
+        };
+      }, [measure, children]);
+      useEffect(() => {
+        const wrapper = wrapperRef.current;
+        if (!wrapper) return;
+        const ro = new ResizeObserver(() => measure());
+        ro.observe(wrapper);
+        return () => ro.disconnect();
+      }, [measure]);
+      const hasLayout = layout !== null;
+      return /* @__PURE__ */ jsx(
+        Box,
+        {
+          ref: wrapperRef,
+          className: cn("w-full", className),
+          style: {
+            // Only clip overflow once we have a valid measurement
+            overflow: hasLayout ? "hidden" : void 0,
+            height: hasLayout ? layout.height : void 0
+          },
+          children: /* @__PURE__ */ jsx(
+            Box,
+            {
+              ref: contentRef,
+              style: {
+                width: "max-content",
+                transformOrigin: "top left",
+                transform: hasLayout && layout.scale < 1 ? `scale(${layout.scale})` : void 0
+              },
+              children
+            }
+          )
+        }
+      );
+    };
+    ScaledDiagram.displayName = "ScaledDiagram";
+  }
+});
 function useLongPress(onLongPress, options = {}) {
   const { duration = 500, moveThreshold = 10 } = options;
   const timerRef = useRef(null);
@@ -13685,7 +13889,7 @@ var init_StateMachineView = __esm({
                 style: { top: title ? 30 : 0 },
                 children: [
                   entity && /* @__PURE__ */ jsx(EntityBox, { entity, config }),
-                  states.map((state) => renderStateNode ? /* @__PURE__ */ jsx(React74__default.Fragment, { children: renderStateNode(state, config) }, state.id) : /* @__PURE__ */ jsx(
+                  states.map((state) => renderStateNode ? /* @__PURE__ */ jsx(React77__default.Fragment, { children: renderStateNode(state, config) }, state.id) : /* @__PURE__ */ jsx(
                     StateNode,
                     {
                       state,
@@ -14400,7 +14604,7 @@ function tryParseOrbitalSchema(code) {
   }
   return null;
 }
-function parseMarkdownWithCodeBlocks(content) {
+function parseMarkdownWithCodeBlocks2(content) {
   if (!content) return [];
   const segments = [];
   const codeBlockRegex = /```(\w+)?\n([\s\S]*?)```/g;
@@ -14439,7 +14643,7 @@ function parseContentSegments(content) {
   while ((match = tagRegex.exec(content)) !== null) {
     const before = content.slice(lastIndex, match.index);
     if (before.trim()) {
-      segments.push(...parseMarkdownWithCodeBlocks(before));
+      segments.push(...parseMarkdownWithCodeBlocks2(before));
     }
     segments.push({
       type: "quiz",
@@ -14450,7 +14654,7 @@ function parseContentSegments(content) {
   }
   const remaining = content.slice(lastIndex);
   if (remaining.trim()) {
-    segments.push(...parseMarkdownWithCodeBlocks(remaining));
+    segments.push(...parseMarkdownWithCodeBlocks2(remaining));
   }
   return segments;
 }
@@ -19520,6 +19724,169 @@ var init_ClassifierBoard = __esm({
     ClassifierBoard.displayName = "ClassifierBoard";
   }
 });
+var CodeRunnerPanel;
+var init_CodeRunnerPanel = __esm({
+  "components/core/organisms/CodeRunnerPanel.tsx"() {
+    "use client";
+    init_Box();
+    init_Button();
+    init_Badge();
+    init_Typography();
+    init_Stack();
+    init_CodeBlock();
+    init_useEventBus();
+    init_cn();
+    CodeRunnerPanel = ({
+      code: initialCode,
+      language,
+      runnable = true,
+      onRun,
+      runEvent = "RUN_CODE",
+      className
+    }) => {
+      const eventBus = useEventBus();
+      const { t } = useTranslate();
+      const [code, setCode] = useState(initialCode);
+      const [output, setOutput] = useState(null);
+      const [error, setError] = useState(null);
+      const [isRunning, setIsRunning] = useState(false);
+      const handleRun = 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 = useCallback(() => {
+        setCode(initialCode);
+        setOutput(null);
+        setError(null);
+      }, [initialCode]);
+      if (!runnable || !onRun) {
+        return /* @__PURE__ */ jsx(Box, { className, children: /* @__PURE__ */ jsx(CodeBlock, { language, code }) });
+      }
+      const hasOutput = output !== null || error !== null;
+      return /* @__PURE__ */ jsxs(Box, { className: cn("space-y-3", className), children: [
+        /* @__PURE__ */ jsx(
+          CodeBlock,
+          {
+            language,
+            code,
+            editable: true,
+            onChange: setCode,
+            showLanguageBadge: true,
+            showCopyButton: true
+          }
+        ),
+        /* @__PURE__ */ jsxs(HStack, { gap: "sm", justify: "between", children: [
+          /* @__PURE__ */ jsxs(HStack, { gap: "sm", children: [
+            /* @__PURE__ */ jsx(
+              Button,
+              {
+                variant: "primary",
+                size: "sm",
+                onClick: handleRun,
+                disabled: isRunning,
+                className: "min-w-[5rem]",
+                children: isRunning ? /* @__PURE__ */ jsxs("span", { className: "inline-flex items-center gap-2", children: [
+                  /* @__PURE__ */ jsx(RotateCcw, { size: 16, className: "animate-spin" }),
+                  t("common.loading")
+                ] }) : /* @__PURE__ */ jsxs("span", { className: "inline-flex items-center gap-2", children: [
+                  /* @__PURE__ */ jsx(Play, { size: 16 }),
+                  "Run"
+                ] })
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              Button,
+              {
+                variant: "secondary",
+                size: "sm",
+                onClick: handleReset,
+                disabled: isRunning,
+                children: /* @__PURE__ */ jsxs("span", { className: "inline-flex items-center gap-2", children: [
+                  /* @__PURE__ */ jsx(RotateCcw, { size: 16 }),
+                  "Reset"
+                ] })
+              }
+            )
+          ] }),
+          output && /* @__PURE__ */ jsxs(
+            Badge,
+            {
+              variant: output.exitCode === 0 ? "success" : "danger",
+              size: "sm",
+              children: [
+                "Exit ",
+                output.exitCode
+              ]
+            }
+          )
+        ] }),
+        hasOutput && /* @__PURE__ */ jsxs(Box, { className: "rounded-lg border border-gray-700 bg-[#0d0d0d] overflow-hidden", children: [
+          /* @__PURE__ */ jsxs(
+            HStack,
+            {
+              gap: "sm",
+              align: "center",
+              className: "px-3 py-2 bg-gray-800 border-b border-gray-700",
+              children: [
+                /* @__PURE__ */ jsx(Terminal, { size: 16, className: "text-gray-400" }),
+                /* @__PURE__ */ jsx(Typography, { variant: "small", className: "text-gray-300 font-medium", children: "Output" })
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsx(VStack, { gap: "none", className: "p-3 font-mono text-sm", children: error ? /* @__PURE__ */ jsx(Typography, { variant: "small", className: "text-red-400 whitespace-pre-wrap", children: error }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+            output?.stdout ? /* @__PURE__ */ jsx(Typography, { variant: "small", className: "text-gray-200 whitespace-pre-wrap", children: output.stdout }) : null,
+            output?.stderr ? /* @__PURE__ */ jsx(Typography, { variant: "small", className: "text-red-400 whitespace-pre-wrap", children: output.stderr }) : null,
+            !output?.stdout && !output?.stderr ? /* @__PURE__ */ jsx(Typography, { variant: "small", className: "text-gray-500 italic", children: "No output" }) : null,
+            output && output.testResults.length > 0 && /* @__PURE__ */ jsx(Box, { className: "mt-3 pt-3 border-t border-gray-700 space-y-2", children: output.testResults.map((test, index) => /* @__PURE__ */ jsxs(HStack, { gap: "sm", align: "start", className: "text-xs", children: [
+              test.passed ? /* @__PURE__ */ jsx(CheckCircle, { size: 14, className: "text-green-400 mt-0.5" }) : /* @__PURE__ */ jsx(XCircle, { size: 14, className: "text-red-400 mt-0.5" }),
+              /* @__PURE__ */ jsxs(VStack, { gap: "xs", className: "flex-1", children: [
+                /* @__PURE__ */ jsxs(
+                  Typography,
+                  {
+                    variant: "small",
+                    className: test.passed ? "text-green-400" : "text-red-400",
+                    children: [
+                      "Test ",
+                      index + 1,
+                      ": ",
+                      test.passed ? "passed" : "failed"
+                    ]
+                  }
+                ),
+                /* @__PURE__ */ jsxs(Typography, { variant: "small", className: "text-gray-400", children: [
+                  "Input: ",
+                  test.input
+                ] }),
+                /* @__PURE__ */ jsxs(Typography, { variant: "small", className: "text-gray-400", children: [
+                  "Expected: ",
+                  test.expectedOutput
+                ] }),
+                /* @__PURE__ */ jsxs(Typography, { variant: "small", className: "text-gray-400", children: [
+                  "Actual: ",
+                  test.actualOutput
+                ] })
+              ] })
+            ] }, index)) })
+          ] }) })
+        ] })
+      ] });
+    };
+    CodeRunnerPanel.displayName = "CodeRunnerPanel";
+  }
+});
 function CombatLog({
   events: events2,
   maxVisible = 50,
@@ -19827,6 +20194,31 @@ var init_ConfirmDialog = __esm({
     ConfirmDialog.displayName = "ConfirmDialog";
   }
 });
+var ConnectionBlock;
+var init_ConnectionBlock = __esm({
+  "components/core/molecules/ConnectionBlock.tsx"() {
+    "use client";
+    init_MarkdownContent();
+    init_cn();
+    ConnectionBlock = ({ content, className }) => /* @__PURE__ */ 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__ */ jsxs("div", { className: "flex items-start gap-3", children: [
+          /* @__PURE__ */ jsx(Link2, { className: "text-emerald-600 dark:text-emerald-400 flex-shrink-0 mt-1", size: 20 }),
+          /* @__PURE__ */ jsxs("div", { className: "flex-1", children: [
+            /* @__PURE__ */ jsx("h4", { className: "font-semibold text-emerald-900 dark:text-emerald-100 mb-2", children: "Building On What You Know" }),
+            /* @__PURE__ */ jsx("div", { className: "prose dark:prose-invert prose-sm max-w-none text-gray-700 dark:text-gray-300", children: /* @__PURE__ */ jsx(MarkdownContent, { content }) })
+          ] })
+        ] })
+      }
+    );
+    ConnectionBlock.displayName = "ConnectionBlock";
+  }
+});
 function CounterMinimal({
   entity,
   size = "md",
@@ -20127,7 +20519,7 @@ function CraftingRecipe({
   className
 }) {
   const eventBus = useEventBus();
-  const handleCraft = React74.useCallback(() => {
+  const handleCraft = React77.useCallback(() => {
     onCraft?.();
     if (craftEvent) {
       eventBus.emit(craftEvent, { output: output.label });
@@ -20144,7 +20536,7 @@ function CraftingRecipe({
       children: [
         /* @__PURE__ */ jsx(HStack, { gap: "xs", className: "flex-wrap items-center", children: inputs.map((ingredient, index) => {
           const hasSufficient = ingredient.available >= ingredient.required;
-          return /* @__PURE__ */ jsxs(React74.Fragment, { children: [
+          return /* @__PURE__ */ jsxs(React77.Fragment, { children: [
             /* @__PURE__ */ jsx(Box, { className: "relative", children: /* @__PURE__ */ jsx(
               ItemSlot,
               {
@@ -20207,8 +20599,8 @@ function DPad({
 }) {
   const eventBus = useEventBus();
   const sizes = sizeMap6[size];
-  const [activeDirections, setActiveDirections] = React74.useState(/* @__PURE__ */ new Set());
-  const handlePress = React74.useCallback(
+  const [activeDirections, setActiveDirections] = React77.useState(/* @__PURE__ */ new Set());
+  const handlePress = React77.useCallback(
     (direction) => {
       setActiveDirections((prev) => new Set(prev).add(direction));
       if (directionEvent) eventBus.emit(`UI:${directionEvent}`, { direction, pressed: true });
@@ -20216,7 +20608,7 @@ function DPad({
     },
     [directionEvent, eventBus, onDirection]
   );
-  const handleRelease = React74.useCallback(
+  const handleRelease = React77.useCallback(
     (direction) => {
       setActiveDirections((prev) => {
         const next = new Set(prev);
@@ -21072,8 +21464,8 @@ var init_Menu = __esm({
         "bottom-end": "bottom-start"
       };
       const effectivePosition = direction === "rtl" ? rtlMirror[position] ?? position : position;
-      const triggerChild = React74__default.isValidElement(trigger) ? trigger : /* @__PURE__ */ jsx(Typography, { variant: "small", as: "span", children: trigger });
-      const triggerElement = React74__default.cloneElement(
+      const triggerChild = React77__default.isValidElement(trigger) ? trigger : /* @__PURE__ */ jsx(Typography, { variant: "small", as: "span", children: trigger });
+      const triggerElement = React77__default.cloneElement(
         triggerChild,
         {
           ref: triggerRef,
@@ -21207,14 +21599,14 @@ function useDataDnd(args) {
   const isZone = Boolean(dragGroup || accepts || sortable);
   const enabled = isZone || Boolean(dndRoot);
   const eventBus = useEventBus();
-  const parentRoot = React74__default.useContext(RootCtx);
+  const parentRoot = React77__default.useContext(RootCtx);
   const isRoot = enabled && parentRoot === null;
-  const zoneId = React74__default.useId();
+  const zoneId = React77__default.useId();
   const ownGroup = dragGroup ?? accepts ?? zoneId;
-  const [optimisticOrders, setOptimisticOrders] = React74__default.useState(() => /* @__PURE__ */ new Map());
-  const optimisticOrdersRef = React74__default.useRef(optimisticOrders);
+  const [optimisticOrders, setOptimisticOrders] = React77__default.useState(() => /* @__PURE__ */ new Map());
+  const optimisticOrdersRef = React77__default.useRef(optimisticOrders);
   optimisticOrdersRef.current = optimisticOrders;
-  const clearOptimisticOrder = React74__default.useCallback((group) => {
+  const clearOptimisticOrder = React77__default.useCallback((group) => {
     setOptimisticOrders((prev) => {
       if (!prev.has(group)) return prev;
       const next = new Map(prev);
@@ -21239,7 +21631,7 @@ function useDataDnd(args) {
     const raw = it[dndItemIdField];
     return String(raw ?? `__idx_${idx}`);
   }).join("|");
-  const itemIds = React74__default.useMemo(
+  const itemIds = React77__default.useMemo(
     () => orderedItems.map((it, idx) => {
       const raw = it[dndItemIdField];
       return raw ?? `__idx_${idx}`;
@@ -21247,7 +21639,7 @@ function useDataDnd(args) {
     [itemIdsSignature]
   );
   const itemsContentSig = items.map((it, idx) => String(it[dndItemIdField] ?? `__${idx}`)).join("|");
-  React74__default.useEffect(() => {
+  React77__default.useEffect(() => {
     const root = isRoot ? null : parentRoot;
     if (root) {
       root.clearOptimisticOrder(ownGroup);
@@ -21255,20 +21647,20 @@ function useDataDnd(args) {
       clearOptimisticOrder(ownGroup);
     }
   }, [itemsContentSig, ownGroup]);
-  const zonesRef = React74__default.useRef(/* @__PURE__ */ new Map());
-  const registerZone = React74__default.useCallback((zoneId2, meta2) => {
+  const zonesRef = React77__default.useRef(/* @__PURE__ */ new Map());
+  const registerZone = React77__default.useCallback((zoneId2, meta2) => {
     zonesRef.current.set(zoneId2, meta2);
   }, []);
-  const unregisterZone = React74__default.useCallback((zoneId2) => {
+  const unregisterZone = React77__default.useCallback((zoneId2) => {
     zonesRef.current.delete(zoneId2);
   }, []);
-  const [activeDrag, setActiveDrag] = React74__default.useState(null);
-  const [overZoneGroup, setOverZoneGroup] = React74__default.useState(null);
-  const meta = React74__default.useMemo(
+  const [activeDrag, setActiveDrag] = React77__default.useState(null);
+  const [overZoneGroup, setOverZoneGroup] = React77__default.useState(null);
+  const meta = React77__default.useMemo(
     () => ({ group: ownGroup, dropEvent, reorderEvent, positionEvent, itemIds, rawItems: items, idField: dndItemIdField }),
     [ownGroup, dropEvent, reorderEvent, positionEvent, itemIds, items, dndItemIdField]
   );
-  React74__default.useEffect(() => {
+  React77__default.useEffect(() => {
     const target = isRoot ? null : parentRoot;
     if (!target) {
       zonesRef.current.set(zoneId, meta);
@@ -21287,7 +21679,7 @@ function useDataDnd(args) {
   }, [parentRoot, isRoot, zoneId, meta]);
   const sensors = useAlmadarDndSensors(true);
   const collisionDetection = almadarDndCollisionDetection;
-  const findZoneByItem = React74__default.useCallback(
+  const findZoneByItem = React77__default.useCallback(
     (id) => {
       for (const z of zonesRef.current.values()) {
         if (z.itemIds.includes(id)) return z;
@@ -21296,7 +21688,7 @@ function useDataDnd(args) {
     },
     []
   );
-  React74__default.useCallback(
+  React77__default.useCallback(
     (group) => {
       for (const z of zonesRef.current.values()) {
         if (z.group === group) return z;
@@ -21305,7 +21697,7 @@ function useDataDnd(args) {
     },
     []
   );
-  const handleDragEnd = React74__default.useCallback(
+  const handleDragEnd = React77__default.useCallback(
     (event) => {
       const { active, over } = event;
       const activeIdStr = String(active.id);
@@ -21396,8 +21788,8 @@ function useDataDnd(args) {
     },
     [eventBus]
   );
-  const sortableData = React74__default.useMemo(() => ({ dndGroup: ownGroup }), [ownGroup]);
-  const SortableItem = React74__default.useCallback(
+  const sortableData = React77__default.useMemo(() => ({ dndGroup: ownGroup }), [ownGroup]);
+  const SortableItem = React77__default.useCallback(
     ({ id, children }) => {
       const {
         attributes,
@@ -21437,7 +21829,7 @@ function useDataDnd(args) {
       id: droppableId,
       data: sortableData
     });
-    const ctx = React74__default.useContext(RootCtx);
+    const ctx = React77__default.useContext(RootCtx);
     const activeDrag2 = ctx?.activeDrag ?? null;
     const overZoneGroup2 = ctx?.overZoneGroup ?? null;
     const isThisZoneOver = overZoneGroup2 === ownGroup;
@@ -21452,7 +21844,7 @@ function useDataDnd(args) {
       showForeignPlaceholder,
       ctxAvailable: ctx != null
     });
-    React74__default.useEffect(() => {
+    React77__default.useEffect(() => {
       dndLog.info("dropzone:isOver:change", { droppableId, group: ownGroup, isOver, isThisZoneOver, showForeignPlaceholder, activeDragSourceGroup: activeDrag2?.sourceGroup ?? null });
     }, [droppableId, isOver, isThisZoneOver, showForeignPlaceholder]);
     return /* @__PURE__ */ jsx(
@@ -21466,11 +21858,11 @@ function useDataDnd(args) {
       }
     );
   };
-  const rootContextValue = React74__default.useMemo(
+  const rootContextValue = React77__default.useMemo(
     () => ({ registerZone, unregisterZone, activeDrag, overZoneGroup, optimisticOrders, clearOptimisticOrder }),
     [registerZone, unregisterZone, activeDrag, overZoneGroup, optimisticOrders, clearOptimisticOrder]
   );
-  const handleDragStart = React74__default.useCallback((event) => {
+  const handleDragStart = React77__default.useCallback((event) => {
     const sourceZone = findZoneByItem(event.active.id);
     const rect = event.active.rect.current.initial;
     const height = rect?.height && rect.height > 0 ? rect.height : 64;
@@ -21489,7 +21881,7 @@ function useDataDnd(args) {
       isRoot
     });
   }, [findZoneByItem, isRoot, zoneId]);
-  const handleDragOver = React74__default.useCallback((event) => {
+  const handleDragOver = React77__default.useCallback((event) => {
     const { active, over } = event;
     const overData = over?.data?.current;
     const overGroup = overData?.dndGroup ?? null;
@@ -21559,7 +21951,7 @@ function useDataDnd(args) {
       return next;
     });
   }, []);
-  const handleDragCancel = React74__default.useCallback((event) => {
+  const handleDragCancel = React77__default.useCallback((event) => {
     setActiveDrag(null);
     setOverZoneGroup(null);
     dndLog.warn("dragCancel", {
@@ -21567,12 +21959,12 @@ function useDataDnd(args) {
       reason: "dnd-kit cancelled the drag (escape key, pointer interrupted, or external)"
     });
   }, []);
-  const handleDragEndWithCleanup = React74__default.useCallback((event) => {
+  const handleDragEndWithCleanup = React77__default.useCallback((event) => {
     handleDragEnd(event);
     setActiveDrag(null);
     setOverZoneGroup(null);
   }, [handleDragEnd]);
-  const wrapContainer = React74__default.useCallback(
+  const wrapContainer = React77__default.useCallback(
     (children) => {
       if (!enabled) return children;
       const strategy = layout === "grid" ? rectSortingStrategy : verticalListSortingStrategy;
@@ -21626,7 +22018,7 @@ var init_useDataDnd = __esm({
     init_useAlmadarDndCollision();
     init_Box();
     dndLog = createLogger("almadar:ui:dnd");
-    RootCtx = React74__default.createContext(null);
+    RootCtx = React77__default.createContext(null);
   }
 });
 function renderIconInput(icon, props) {
@@ -22152,7 +22544,7 @@ function DataList({
 }) {
   const eventBus = useEventBus();
   const { t } = useTranslate();
-  const [visibleCount, setVisibleCount] = React74__default.useState(pageSize || Infinity);
+  const [visibleCount, setVisibleCount] = React77__default.useState(pageSize || Infinity);
   const fieldDefs = fields ?? columns ?? [];
   const allDataRaw = Array.isArray(entity) ? entity : entity ? [entity] : [];
   const dnd = useDataDnd({
@@ -22171,7 +22563,7 @@ function DataList({
   const data = pageSize > 0 ? allData.slice(0, visibleCount) : allData;
   const hasMoreLocal = pageSize > 0 && visibleCount < allData.length;
   const hasRenderProp = typeof children === "function";
-  React74__default.useEffect(() => {
+  React77__default.useEffect(() => {
     const renderItemTypeOf = typeof schemaRenderItem;
     const childrenTypeOf = typeof children;
     if (data.length > 0 && !hasRenderProp) {
@@ -22276,7 +22668,7 @@ function DataList({
     const items2 = data.map((item) => item);
     const groups2 = groupBy ? groupData(items2, groupBy) : [{ label: "", items: items2 }];
     const contentField = titleField?.name ?? fieldDefs[0]?.name ?? "";
-    return /* @__PURE__ */ jsx(VStack, { gap: "sm", className: cn("py-2", className), children: groups2.map((group, gi) => /* @__PURE__ */ jsxs(React74__default.Fragment, { children: [
+    return /* @__PURE__ */ jsx(VStack, { gap: "sm", className: cn("py-2", className), children: groups2.map((group, gi) => /* @__PURE__ */ jsxs(React77__default.Fragment, { children: [
       group.label && /* @__PURE__ */ jsx(Divider, { label: group.label, className: "my-2" }),
       group.items.map((itemData, index) => {
         const id = itemData.id || `${gi}-${index}`;
@@ -22417,7 +22809,7 @@ function DataList({
           className
         ),
         children: [
-          groups.map((group, gi) => /* @__PURE__ */ jsxs(React74__default.Fragment, { children: [
+          groups.map((group, gi) => /* @__PURE__ */ jsxs(React77__default.Fragment, { children: [
             group.label && /* @__PURE__ */ jsx(Divider, { label: group.label, className: gi > 0 ? "mt-4" : "mt-0" }),
             group.items.map(
               (itemData, index) => renderItem(itemData, index, gi === groups.length - 1 && index === group.items.length - 1)
@@ -22524,8 +22916,8 @@ function ScalarControl({
   }
   const numeric = typeof value === "number";
   const initial = value === null ? "" : String(value);
-  const [draft, setDraft] = React74__default.useState(initial);
-  React74__default.useEffect(() => setDraft(initial), [initial]);
+  const [draft, setDraft] = React77__default.useState(initial);
+  React77__default.useEffect(() => setDraft(initial), [initial]);
   const commit = () => {
     if (numeric) {
       const n = draft.trim() === "" ? 0 : Number(draft);
@@ -22593,8 +22985,8 @@ function Row({
   onRemove,
   readonly
 }) {
-  const [keyDraft, setKeyDraft] = React74__default.useState(rowKey);
-  React74__default.useEffect(() => setKeyDraft(rowKey), [rowKey]);
+  const [keyDraft, setKeyDraft] = React77__default.useState(rowKey);
+  React77__default.useEffect(() => setKeyDraft(rowKey), [rowKey]);
   const container = isObj(value) || isArr(value);
   return /* @__PURE__ */ jsxs(VStack, { gap: "none", className: "group w-max min-w-full", children: [
     /* @__PURE__ */ jsxs(HStack, { gap: "xs", align: "center", className: "py-0.5 w-max", children: [
@@ -22637,7 +23029,7 @@ function ContainerNode({
   depth,
   readonly
 }) {
-  const [open, setOpen] = React74__default.useState(depth < 2);
+  const [open, setOpen] = React77__default.useState(depth < 2);
   const array = isArr(value);
   const entries = array ? value.map((v, i) => [String(i), v]) : Object.entries(value);
   const setObjValue = (key, next) => {
@@ -22779,7 +23171,7 @@ var init_FormSection = __esm({
       columns = 1,
       className
     }) => {
-      const [collapsed, setCollapsed] = React74__default.useState(defaultCollapsed);
+      const [collapsed, setCollapsed] = React77__default.useState(defaultCollapsed);
       const { t } = useTranslate();
       const eventBus = useEventBus();
       const gridClass = {
@@ -22787,7 +23179,7 @@ var init_FormSection = __esm({
         2: "grid-cols-1 md:grid-cols-2",
         3: "grid-cols-1 md:grid-cols-2 lg:grid-cols-3"
       }[columns];
-      React74__default.useCallback(() => {
+      React77__default.useCallback(() => {
         if (collapsible) {
           setCollapsed((prev) => !prev);
           eventBus.emit("UI:TOGGLE_COLLAPSE", { collapsed: !collapsed });
@@ -23191,8 +23583,8 @@ function TextLikeControl({
   onCommit
 }) {
   const initial = value === void 0 || value === null ? "" : String(value);
-  const [draft, setDraft] = React74__default.useState(initial);
-  React74__default.useEffect(() => setDraft(initial), [initial]);
+  const [draft, setDraft] = React77__default.useState(initial);
+  React77__default.useEffect(() => setDraft(initial), [initial]);
   const commit = () => {
     if (numeric) {
       const n = draft.trim() === "" ? 0 : Number(draft);
@@ -23358,14 +23750,14 @@ var init_NodeSlotEditor = __esm({
     isObj2 = (v) => v !== null && v !== void 0 && typeof v === "object" && !Array.isArray(v);
     NodeSlotEditor = ({ value, onChange, className }) => {
       const { type, props, wasArray } = normalize(value);
-      const patterns = React74__default.useMemo(() => {
+      const patterns = React77__default.useMemo(() => {
         try {
           return [...getKnownPatterns()].sort();
         } catch {
           return [];
         }
       }, []);
-      const options = React74__default.useMemo(
+      const options = React77__default.useMemo(
         () => [{ value: "", label: "\u2014 none \u2014" }, ...patterns.map((p2) => ({ value: p2, label: p2 }))],
         [patterns]
       );
@@ -23377,7 +23769,7 @@ var init_NodeSlotEditor = __esm({
         const pattern = { type: nextType, ...nextProps };
         onChange(wasArray || value === void 0 ? [pattern] : pattern);
       };
-      const schemaEntries = React74__default.useMemo(() => {
+      const schemaEntries = React77__default.useMemo(() => {
         if (!type) return [];
         const def = getPatternDefinition(type);
         if (!def?.propsSchema) return [];
@@ -24271,7 +24663,7 @@ var init_Grid = __esm({
       as: Component = "div"
     }) => {
       const mergedStyle = rows2 ? { gridTemplateRows: `repeat(${rows2}, minmax(0, 1fr))`, ...style } : style;
-      return React74__default.createElement(
+      return React77__default.createElement(
         Component,
         {
           className: cn(
@@ -24459,8 +24851,8 @@ var init_Popover = __esm({
         onMouseEnter: handleOpen,
         onMouseLeave: handleClose
       };
-      const childElement = React74__default.isValidElement(children) ? children : /* @__PURE__ */ jsx("span", { children });
-      const triggerElement = React74__default.cloneElement(
+      const childElement = React77__default.isValidElement(children) ? children : /* @__PURE__ */ jsx("span", { children });
+      const triggerElement = React77__default.cloneElement(
         childElement,
         {
           ref: triggerRef,
@@ -25300,8 +25692,8 @@ var init_Tooltip = __esm({
           if (hideTimeoutRef.current) clearTimeout(hideTimeoutRef.current);
         };
       }, []);
-      const triggerElement = React74__default.isValidElement(children) ? children : /* @__PURE__ */ jsx("span", { children });
-      const trigger = React74__default.cloneElement(triggerElement, {
+      const triggerElement = React77__default.isValidElement(children) ? children : /* @__PURE__ */ jsx("span", { children });
+      const trigger = React77__default.cloneElement(triggerElement, {
         ref: triggerRef,
         onMouseEnter: handleMouseEnter,
         onMouseLeave: handleMouseLeave,
@@ -25387,7 +25779,7 @@ var init_WizardProgress = __esm({
           children: /* @__PURE__ */ jsx("div", { className: "flex items-center gap-2", children: normalizedSteps.map((step, index) => {
             const isActive = index === currentStep;
             const isCompleted = index < currentStep;
-            return /* @__PURE__ */ jsxs(React74__default.Fragment, { children: [
+            return /* @__PURE__ */ jsxs(React77__default.Fragment, { children: [
               /* @__PURE__ */ jsx(
                 "button",
                 {
@@ -26431,9 +26823,9 @@ function ScoreDisplay({
   ...rest
 }) {
   const resolvedValue = typeof value === "number" && !Number.isNaN(value) ? value : typeof rest.score === "number" && !Number.isNaN(rest.score) ? rest.score : 0;
-  const [displayValue, setDisplayValue] = React74.useState(resolvedValue);
-  const [isAnimating, setIsAnimating] = React74.useState(false);
-  React74.useEffect(() => {
+  const [displayValue, setDisplayValue] = React77.useState(resolvedValue);
+  const [isAnimating, setIsAnimating] = React77.useState(false);
+  React77.useEffect(() => {
     if (!animated || displayValue === resolvedValue) {
       setDisplayValue(resolvedValue);
       return;
@@ -26581,7 +26973,7 @@ function InventoryGrid({
   const eventBus = useEventBus();
   const slotCount = totalSlots ?? items.length;
   const emptySlotCount = Math.max(0, slotCount - items.length);
-  const handleSelect = React74.useCallback(
+  const handleSelect = React77.useCallback(
     (id) => {
       onSelect?.(id);
       if (selectEvent) {
@@ -26868,31 +27260,31 @@ function GameCanvas2D({
   assetBaseUrl = "https://almadar-kflow-assets.web.app/shared/",
   className
 }) {
-  const canvasRef = React74.useRef(null);
-  const rafRef = React74.useRef(0);
-  const frameRef = React74.useRef(0);
-  const lastTimeRef = React74.useRef(0);
-  const imageCache = React74.useRef(/* @__PURE__ */ new Map());
+  const canvasRef = React77.useRef(null);
+  const rafRef = React77.useRef(0);
+  const frameRef = React77.useRef(0);
+  const lastTimeRef = React77.useRef(0);
+  const imageCache = React77.useRef(/* @__PURE__ */ new Map());
   const emit = useEmitEvent();
-  const onDrawRef = React74.useRef(onDraw);
+  const onDrawRef = React77.useRef(onDraw);
   onDrawRef.current = onDraw;
-  const onTickRef = React74.useRef(onTick);
+  const onTickRef = React77.useRef(onTick);
   onTickRef.current = onTick;
-  const tickEventRef = React74.useRef(tickEvent);
+  const tickEventRef = React77.useRef(tickEvent);
   tickEventRef.current = tickEvent;
-  const drawEventRef = React74.useRef(drawEvent);
+  const drawEventRef = React77.useRef(drawEvent);
   drawEventRef.current = drawEvent;
-  const emitRef = React74.useRef(emit);
+  const emitRef = React77.useRef(emit);
   emitRef.current = emit;
-  const assetBaseUrlRef = React74.useRef(assetBaseUrl);
+  const assetBaseUrlRef = React77.useRef(assetBaseUrl);
   assetBaseUrlRef.current = assetBaseUrl;
-  const backgroundImageRef = React74.useRef(backgroundImage);
+  const backgroundImageRef = React77.useRef(backgroundImage);
   backgroundImageRef.current = backgroundImage;
-  const widthRef = React74.useRef(width);
+  const widthRef = React77.useRef(width);
   widthRef.current = width;
-  const heightRef = React74.useRef(height);
+  const heightRef = React77.useRef(height);
   heightRef.current = height;
-  const loadImage = React74.useCallback((url) => {
+  const loadImage = React77.useCallback((url) => {
     const fullUrl = url.startsWith("http") ? url : `${assetBaseUrlRef.current}${url}`;
     const cached = imageCache.current.get(fullUrl);
     if (cached?.complete && cached.naturalWidth > 0) return cached;
@@ -26904,7 +27296,7 @@ function GameCanvas2D({
     }
     return null;
   }, []);
-  React74.useEffect(() => {
+  React77.useEffect(() => {
     const canvas = canvasRef.current;
     if (!canvas) return;
     const ctx = canvas.getContext("2d");
@@ -27262,7 +27654,7 @@ function TurnPanel({
   className
 }) {
   const eventBus = useEventBus();
-  const handleAction = React74.useCallback(
+  const handleAction = React77.useCallback(
     (event) => {
       if (event) {
         eventBus.emit(event, { turn: currentTurn, phase, activeTeam });
@@ -27408,7 +27800,7 @@ function UnitCommandBar({
   className
 }) {
   const eventBus = useEventBus();
-  const handleCommand = React74.useCallback(
+  const handleCommand = React77.useCallback(
     (event) => {
       if (event) {
         eventBus.emit(event, { unitId: selectedUnitId });
@@ -27893,7 +28285,7 @@ function GameMenu({
   } catch {
   }
   const eventBus = eventBusProp || eventBusFromHook;
-  const handleOptionClick = React74.useCallback(
+  const handleOptionClick = React77.useCallback(
     (option) => {
       if (option.event && eventBus) {
         eventBus.emit(`UI:${option.event}`, { option });
@@ -28007,7 +28399,7 @@ function GameOverScreen({
   } catch {
   }
   const eventBus = eventBusProp || eventBusFromHook;
-  const handleActionClick = React74.useCallback(
+  const handleActionClick = React77.useCallback(
     (action) => {
       if (action.event && eventBus) {
         eventBus.emit(`UI:${action.event}`, { action });
@@ -28771,7 +29163,7 @@ var init_MapView = __esm({
         shadowSize: [41, 41]
       });
       L.Marker.prototype.options.icon = defaultIcon;
-      const { useEffect: useEffect72, useRef: useRef69, useCallback: useCallback115, useState: useState105 } = React74__default;
+      const { useEffect: useEffect72, useRef: useRef69, useCallback: useCallback115, useState: useState105 } = React77__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 }) {
@@ -29677,8 +30069,8 @@ function TableView({
 }) {
   const eventBus = useEventBus();
   const { t } = useTranslate();
-  const [visibleCount, setVisibleCount] = React74__default.useState(pageSize > 0 ? pageSize : Infinity);
-  const [localSelected, setLocalSelected] = React74__default.useState(/* @__PURE__ */ new Set());
+  const [visibleCount, setVisibleCount] = React77__default.useState(pageSize > 0 ? pageSize : Infinity);
+  const [localSelected, setLocalSelected] = React77__default.useState(/* @__PURE__ */ new Set());
   const colDefs = columns ?? fields ?? [];
   const allDataRaw = Array.isArray(entity) ? entity : entity ? [entity] : [];
   const dnd = useDataDnd({
@@ -29873,12 +30265,12 @@ function TableView({
         ]
       }
     );
-    return dnd.isZone ? /* @__PURE__ */ jsx(dnd.SortableItem, { id: row[idField] ?? id, children: rowInner }, id) : /* @__PURE__ */ jsx(React74__default.Fragment, { children: rowInner }, id);
+    return dnd.isZone ? /* @__PURE__ */ jsx(dnd.SortableItem, { id: row[idField] ?? id, children: rowInner }, id) : /* @__PURE__ */ jsx(React77__default.Fragment, { children: rowInner }, id);
   };
   const items = data.map((row) => row);
   const groups = groupBy ? groupData2(items, groupBy) : [{ label: "", items }];
   let runningIndex = 0;
-  const body = /* @__PURE__ */ jsx(Box, { role: "rowgroup", children: groups.map((group, gi) => /* @__PURE__ */ jsxs(React74__default.Fragment, { children: [
+  const body = /* @__PURE__ */ jsx(Box, { role: "rowgroup", children: groups.map((group, gi) => /* @__PURE__ */ jsxs(React77__default.Fragment, { children: [
     group.label && /* @__PURE__ */ jsx(Divider, { label: group.label, className: gi > 0 ? "mt-3" : "mt-0" }),
     group.items.map((row) => renderRow(row, runningIndex++))
   ] }, gi)) });
@@ -31235,7 +31627,7 @@ var init_StepFlow = __esm({
       className
     }) => {
       if (orientation === "vertical") {
-        return /* @__PURE__ */ jsx(VStack, { gap: "none", className: cn("w-full", className), children: steps.map((step, index) => /* @__PURE__ */ jsx(React74__default.Fragment, { children: /* @__PURE__ */ jsxs(HStack, { gap: "md", align: "start", className: "w-full", children: [
+        return /* @__PURE__ */ jsx(VStack, { gap: "none", className: cn("w-full", className), children: steps.map((step, index) => /* @__PURE__ */ jsx(React77__default.Fragment, { children: /* @__PURE__ */ jsxs(HStack, { gap: "md", align: "start", className: "w-full", children: [
           /* @__PURE__ */ jsxs(VStack, { gap: "none", align: "center", children: [
             /* @__PURE__ */ jsx(StepCircle, { step, index }),
             showConnectors && index < steps.length - 1 && /* @__PURE__ */ jsx(Box, { className: "w-px h-8 bg-border" })
@@ -31246,7 +31638,7 @@ var init_StepFlow = __esm({
           ] })
         ] }) }, index)) });
       }
-      return /* @__PURE__ */ jsx(Box, { className: cn("w-full flex flex-col md:flex-row items-start gap-0", className), children: steps.map((step, index) => /* @__PURE__ */ jsxs(React74__default.Fragment, { children: [
+      return /* @__PURE__ */ jsx(Box, { className: cn("w-full flex flex-col md:flex-row items-start gap-0", className), children: steps.map((step, index) => /* @__PURE__ */ jsxs(React77__default.Fragment, { children: [
         /* @__PURE__ */ jsxs(VStack, { gap: "sm", align: "center", className: "flex-1 w-full md:w-auto", children: [
           /* @__PURE__ */ jsx(StepCircle, { step, index }),
           /* @__PURE__ */ jsx(Typography, { variant: "h4", className: "text-center", children: step.title }),
@@ -32231,7 +32623,7 @@ var init_LikertScale = __esm({
       md: "text-base",
       lg: "text-lg"
     };
-    LikertScale = React74__default.forwardRef(
+    LikertScale = React77__default.forwardRef(
       ({
         question,
         options = DEFAULT_LIKERT_OPTIONS,
@@ -32243,7 +32635,7 @@ var init_LikertScale = __esm({
         variant = "radios",
         className
       }, ref) => {
-        const groupId = React74__default.useId();
+        const groupId = React77__default.useId();
         const eventBus = useEventBus();
         const handleSelect = useCallback(
           (next) => {
@@ -34525,7 +34917,7 @@ var init_DocBreadcrumb = __esm({
           "aria-label": t("aria.breadcrumb"),
           children: /* @__PURE__ */ jsx(HStack, { gap: "xs", align: "center", wrap: true, children: items.map((item, idx) => {
             const isLast = idx === items.length - 1;
-            return /* @__PURE__ */ jsxs(React74__default.Fragment, { children: [
+            return /* @__PURE__ */ jsxs(React77__default.Fragment, { children: [
               idx > 0 && /* @__PURE__ */ jsx(
                 Icon,
                 {
@@ -35394,7 +35786,7 @@ var init_MiniStateMachine = __esm({
           const x = 2 + i * (NODE_W + GAP2 + ARROW_W + GAP2);
           const tc = transitionCounts[s.name] ?? 0;
           const role = getStateRole(s.name, s.isInitial, s.isTerminal, tc, maxTC);
-          return /* @__PURE__ */ jsxs(React74__default.Fragment, { children: [
+          return /* @__PURE__ */ jsxs(React77__default.Fragment, { children: [
             /* @__PURE__ */ jsx(
               AvlState,
               {
@@ -35598,7 +35990,7 @@ var init_PageHeader = __esm({
         info: "bg-info/10 text-info"
       };
       return /* @__PURE__ */ jsxs(Box, { className: cn("mb-6", className), children: [
-        breadcrumbs && breadcrumbs.length > 0 && /* @__PURE__ */ jsx(Box, { as: "nav", className: "mb-4", children: /* @__PURE__ */ jsx(Box, { as: "ol", className: "flex items-center gap-2 text-sm", children: breadcrumbs.map((crumb, idx) => /* @__PURE__ */ jsxs(React74__default.Fragment, { children: [
+        breadcrumbs && breadcrumbs.length > 0 && /* @__PURE__ */ jsx(Box, { as: "nav", className: "mb-4", children: /* @__PURE__ */ jsx(Box, { as: "ol", className: "flex items-center gap-2 text-sm", children: breadcrumbs.map((crumb, idx) => /* @__PURE__ */ jsxs(React77__default.Fragment, { children: [
           idx > 0 && /* @__PURE__ */ jsx(Typography, { variant: "small", color: "muted", children: "/" }),
           crumb.href ? /* @__PURE__ */ jsx(
             "a",
@@ -36327,7 +36719,7 @@ var init_WizardContainer = __esm({
               const isCompleted = index < currentStep;
               const stepKey = step.id ?? step.tabId ?? `step-${index}`;
               const stepTitle = step.title ?? step.name ?? `Step ${index + 1}`;
-              return /* @__PURE__ */ jsxs(React74__default.Fragment, { children: [
+              return /* @__PURE__ */ jsxs(React77__default.Fragment, { children: [
                 /* @__PURE__ */ jsx(
                   Button,
                   {
@@ -37529,85 +37921,6 @@ var init_GraphCanvas = __esm({
     GraphCanvas.displayName = "GraphCanvas";
   }
 });
-var ActivationBlock;
-var init_ActivationBlock = __esm({
-  "components/core/molecules/ActivationBlock.tsx"() {
-    "use client";
-    init_useEventBus();
-    init_cn();
-    ActivationBlock = ({
-      question,
-      savedResponse,
-      saveEvent = "SAVE_ACTIVATION",
-      className
-    }) => {
-      const [response, setResponse] = useState(savedResponse ?? "");
-      const [isExpanded, setIsExpanded] = useState(!savedResponse);
-      const { emit } = useEventBus();
-      const handleSubmit = () => {
-        emit(`UI:${saveEvent}`, { response });
-        setIsExpanded(false);
-      };
-      return /* @__PURE__ */ 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__ */ jsxs("div", { className: "flex items-start gap-3", children: [
-            /* @__PURE__ */ jsx(Lightbulb, { className: "text-indigo-600 dark:text-indigo-400 flex-shrink-0 mt-1", size: 24 }),
-            /* @__PURE__ */ jsxs("div", { className: "flex-1", children: [
-              /* @__PURE__ */ jsx("h4", { className: "font-semibold text-indigo-900 dark:text-indigo-100 mb-2", children: "Before You Begin..." }),
-              /* @__PURE__ */ jsx("p", { className: "text-gray-700 dark:text-gray-300 mb-3 text-sm md:text-base", children: question }),
-              isExpanded ? /* @__PURE__ */ jsxs(Fragment, { children: [
-                /* @__PURE__ */ 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__ */ jsxs("div", { className: "flex gap-2 mt-3", children: [
-                  /* @__PURE__ */ 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__ */ 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__ */ 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"
-                }
-              )
-            ] })
-          ] })
-        }
-      );
-    };
-    ActivationBlock.displayName = "ActivationBlock";
-  }
-});
 var ReflectionBlock;
 var init_ReflectionBlock = __esm({
   "components/core/molecules/ReflectionBlock.tsx"() {
@@ -37675,156 +37988,6 @@ var init_ReflectionBlock = __esm({
     ReflectionBlock.displayName = "ReflectionBlock";
   }
 });
-var ConnectionBlock;
-var init_ConnectionBlock = __esm({
-  "components/core/molecules/ConnectionBlock.tsx"() {
-    "use client";
-    init_MarkdownContent();
-    init_cn();
-    ConnectionBlock = ({ content, className }) => /* @__PURE__ */ 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__ */ jsxs("div", { className: "flex items-start gap-3", children: [
-          /* @__PURE__ */ jsx(Link2, { className: "text-emerald-600 dark:text-emerald-400 flex-shrink-0 mt-1", size: 20 }),
-          /* @__PURE__ */ jsxs("div", { className: "flex-1", children: [
-            /* @__PURE__ */ jsx("h4", { className: "font-semibold text-emerald-900 dark:text-emerald-100 mb-2", children: "Building On What You Know" }),
-            /* @__PURE__ */ jsx("div", { className: "prose dark:prose-invert prose-sm max-w-none text-gray-700 dark:text-gray-300", children: /* @__PURE__ */ jsx(MarkdownContent, { content }) })
-          ] })
-        ] })
-      }
-    );
-    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, BloomQuizBlock;
-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" }
-    };
-    BloomQuizBlock = ({
-      level,
-      question,
-      answer,
-      index,
-      isAnswered,
-      answerEvent = "ANSWER_BLOOM",
-      className
-    }) => {
-      const [revealed, setRevealed] = useState(false);
-      const config = BLOOM_CONFIG[level];
-      const { emit } = useEventBus();
-      const questionSegments = useMemo(() => parseMarkdownWithCodeBlocks2(question), [question]);
-      const answerSegments = useMemo(() => parseMarkdownWithCodeBlocks2(answer), [answer]);
-      const handleReveal = () => {
-        if (!revealed) {
-          emit(`UI:${answerEvent}`, { index: index ?? 0, level });
-        }
-        setRevealed(!revealed);
-      };
-      return /* @__PURE__ */ 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__ */ jsxs("div", { className: "flex items-center justify-between mb-3", children: [
-              /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 flex-wrap", children: [
-                index !== void 0 && /* @__PURE__ */ jsxs("span", { className: "text-gray-500 dark:text-gray-400 font-medium text-sm", children: [
-                  "Question ",
-                  index + 1
-                ] }),
-                /* @__PURE__ */ jsx("span", { className: cn(config.color, "text-white text-xs px-2 py-1 rounded-full font-medium"), children: config.label })
-              ] }),
-              isAnswered && /* @__PURE__ */ jsx(CheckCircle, { className: "text-green-600 dark:text-green-400 flex-shrink-0", size: 20 })
-            ] }),
-            /* @__PURE__ */ 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__ */ jsx(MarkdownContent, { content: segment.content }, `q-md-${idx}`) : /* @__PURE__ */ jsx(
-                CodeBlock,
-                {
-                  language: segment.language ?? "text",
-                  code: segment.content
-                },
-                `q-code-${idx}`
-              )
-            ) }),
-            /* @__PURE__ */ 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__ */ 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__ */ 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__ */ jsx(MarkdownContent, { content: segment.content }, `a-md-${idx}`) : /* @__PURE__ */ jsx(
-                  CodeBlock,
-                  {
-                    language: segment.language ?? "text",
-                    code: segment.content
-                  },
-                  `a-code-${idx}`
-                )
-              )
-            ] })
-          ]
-        }
-      );
-    };
-    BloomQuizBlock.displayName = "BloomQuizBlock";
-  }
-});
 
 // components/core/molecules/parseLessonSegments.ts
 function extractTagContent(content, tagName) {
@@ -37866,7 +38029,7 @@ function parseLessonSegments(lesson) {
   while ((match = tagRegex.exec(content)) !== null) {
     const before = content.slice(lastIndex, match.index);
     if (before.trim()) {
-      segments.push(...parseMarkdownWithCodeBlocks2(before));
+      segments.push(...parseMarkdownWithCodeBlocks(before));
     }
     const g = match.groups ?? {};
     if (g.reflect || g.reflectUnclosed) {
@@ -37899,7 +38062,7 @@ function parseLessonSegments(lesson) {
     lastIndex = tagRegex.lastIndex;
   }
   const remaining = content.slice(lastIndex);
-  if (remaining.trim()) segments.push(...parseMarkdownWithCodeBlocks2(remaining));
+  if (remaining.trim()) segments.push(...parseMarkdownWithCodeBlocks(remaining));
   return segments;
 }
 var init_parseLessonSegments = __esm({
@@ -39157,7 +39320,7 @@ var init_DialogueBubble = __esm({
   }
 });
 function extractTitle(children) {
-  if (!React74__default.isValidElement(children)) return void 0;
+  if (!React77__default.isValidElement(children)) return void 0;
   const props = children.props;
   if (typeof props.title === "string") {
     return props.title;
@@ -39270,7 +39433,7 @@ function LinearView({
     /* @__PURE__ */ jsx(HStack, { className: "flex-wrap items-center", gap: "xs", children: trait.states.map((state, i) => {
       const isDone = i < currentIdx;
       const isCurrent = i === currentIdx;
-      return /* @__PURE__ */ jsxs(React74__default.Fragment, { children: [
+      return /* @__PURE__ */ jsxs(React77__default.Fragment, { children: [
         i > 0 && /* @__PURE__ */ jsx(
           Typography,
           {
@@ -40228,12 +40391,12 @@ var init_Form = __esm({
       const isSchemaEntity = isOrbitalEntitySchema(entity);
       const resolvedEntity = isSchemaEntity ? entity : void 0;
       const entityName = typeof entity === "string" ? entity : resolvedEntity?.name;
-      const normalizedInitialData = React74__default.useMemo(() => {
+      const normalizedInitialData = React77__default.useMemo(() => {
         const entityRowAsInitial = isPlainEntityRow(entity) ? entity : void 0;
         const callerInitial = initialData !== null && typeof initialData === "object" && !Array.isArray(initialData) ? initialData : {};
         return entityRowAsInitial !== void 0 ? { ...entityRowAsInitial, ...callerInitial } : callerInitial;
       }, [entity, initialData]);
-      const entityDerivedFields = React74__default.useMemo(() => {
+      const entityDerivedFields = React77__default.useMemo(() => {
         if (fields && fields.length > 0) return void 0;
         if (!resolvedEntity) return void 0;
         return resolvedEntity.fields.map(
@@ -40253,16 +40416,16 @@ var init_Form = __esm({
       const conditionalFields = typeof conditionalFieldsRaw === "boolean" ? {} : conditionalFieldsRaw;
       const hiddenCalculations = typeof hiddenCalculationsRaw === "boolean" ? [] : hiddenCalculationsRaw;
       const violationTriggers = typeof violationTriggersRaw === "boolean" ? [] : violationTriggersRaw;
-      const [formData, setFormData] = React74__default.useState(
+      const [formData, setFormData] = React77__default.useState(
         normalizedInitialData
       );
-      const [collapsedSections, setCollapsedSections] = React74__default.useState(
+      const [collapsedSections, setCollapsedSections] = React77__default.useState(
         /* @__PURE__ */ new Set()
       );
-      const [submitError, setSubmitError] = React74__default.useState(null);
-      const formRef = React74__default.useRef(null);
+      const [submitError, setSubmitError] = React77__default.useState(null);
+      const formRef = React77__default.useRef(null);
       const formMode = props.mode;
-      const mountedRef = React74__default.useRef(false);
+      const mountedRef = React77__default.useRef(false);
       if (!mountedRef.current) {
         mountedRef.current = true;
         debug("forms", "mount", {
@@ -40275,7 +40438,7 @@ var init_Form = __esm({
         });
       }
       const shouldShowCancel = showCancel ?? (fields && fields.length > 0);
-      const evalContext = React74__default.useMemo(
+      const evalContext = React77__default.useMemo(
         () => ({
           formValues: formData,
           globalVariables: externalContext?.globalVariables ?? {},
@@ -40284,7 +40447,7 @@ var init_Form = __esm({
         }),
         [formData, externalContext]
       );
-      React74__default.useEffect(() => {
+      React77__default.useEffect(() => {
         debug("forms", "initialData-sync", {
           mode: formMode,
           normalizedInitialData,
@@ -40295,7 +40458,7 @@ var init_Form = __esm({
           setFormData(normalizedInitialData);
         }
       }, [normalizedInitialData]);
-      const processCalculations = React74__default.useCallback(
+      const processCalculations = React77__default.useCallback(
         (changedFieldId, newFormData) => {
           if (!hiddenCalculations.length) return;
           const context = {
@@ -40320,7 +40483,7 @@ var init_Form = __esm({
         },
         [hiddenCalculations, externalContext, eventBus]
       );
-      const checkViolations = React74__default.useCallback(
+      const checkViolations = React77__default.useCallback(
         (changedFieldId, newFormData) => {
           if (!violationTriggers.length) return;
           const context = {
@@ -40358,7 +40521,7 @@ var init_Form = __esm({
         processCalculations(name, newFormData);
         checkViolations(name, newFormData);
       };
-      const isFieldVisible = React74__default.useCallback(
+      const isFieldVisible = React77__default.useCallback(
         (fieldName) => {
           const condition = conditionalFields[fieldName];
           if (!condition) return true;
@@ -40366,7 +40529,7 @@ var init_Form = __esm({
         },
         [conditionalFields, evalContext]
       );
-      const isSectionVisible = React74__default.useCallback(
+      const isSectionVisible = React77__default.useCallback(
         (section) => {
           if (!section.condition) return true;
           return Boolean(evaluateFormExpression(section.condition, evalContext));
@@ -40442,7 +40605,7 @@ var init_Form = __esm({
           eventBus.emit(`UI:${onCancel}`);
         }
       };
-      const renderField = React74__default.useCallback(
+      const renderField = React77__default.useCallback(
         (field) => {
           const fieldName = field.name || field.field;
           if (!fieldName) return null;
@@ -40463,7 +40626,7 @@ var init_Form = __esm({
         [formData, isFieldVisible, relationsData, relationsLoading, isLoading]
       );
       const effectiveFields = entityDerivedFields ?? fields;
-      const normalizedFields = React74__default.useMemo(() => {
+      const normalizedFields = React77__default.useMemo(() => {
         if (!effectiveFields || effectiveFields.length === 0) return [];
         return effectiveFields.map((field) => {
           if (typeof field === "string") {
@@ -40486,7 +40649,7 @@ var init_Form = __esm({
           return field;
         });
       }, [effectiveFields, resolvedEntity]);
-      const schemaFields = React74__default.useMemo(() => {
+      const schemaFields = React77__default.useMemo(() => {
         if (normalizedFields.length === 0) return null;
         if (isDebugEnabled()) {
           debugGroup(`Form: ${entityName || "unknown"}`);
@@ -40496,7 +40659,7 @@ var init_Form = __esm({
         }
         return normalizedFields.map(renderField).filter(Boolean);
       }, [normalizedFields, renderField, entityName, conditionalFields]);
-      const sectionElements = React74__default.useMemo(() => {
+      const sectionElements = React77__default.useMemo(() => {
         if (!sections || sections.length === 0) return null;
         return sections.map((section) => {
           if (!isSectionVisible(section)) {
@@ -41778,7 +41941,7 @@ var init_List = __esm({
         if (entity && typeof entity === "object" && "id" in entity) return [entity];
         return [];
       }, [entity]);
-      const getItemActions = React74__default.useCallback(
+      const getItemActions = React77__default.useCallback(
         (item) => {
           if (!itemActions) return [];
           if (typeof itemActions === "function") {
@@ -42254,7 +42417,7 @@ var init_MediaGallery = __esm({
         [selectable, selectedItems, selectionEvent, eventBus]
       );
       const entityData = Array.isArray(entity) ? entity : [];
-      const items = React74__default.useMemo(() => {
+      const items = React77__default.useMemo(() => {
         if (propItems) return propItems;
         if (entityData.length === 0) return [];
         return entityData.map((record, idx) => ({
@@ -42424,9 +42587,9 @@ function MiniMap({
   viewportRect,
   className
 }) {
-  const canvasRef = React74.useRef(null);
-  const frameRef = React74.useRef(0);
-  React74.useEffect(() => {
+  const canvasRef = React77.useRef(null);
+  const frameRef = React77.useRef(0);
+  React77.useEffect(() => {
     const canvas = canvasRef.current;
     if (!canvas) return;
     const ctx = canvas.getContext("2d");
@@ -42508,7 +42671,7 @@ var init_MiniMap = __esm({
   }
 });
 function extractTitle2(children) {
-  if (!React74__default.isValidElement(children)) return void 0;
+  if (!React77__default.isValidElement(children)) return void 0;
   const props = children.props;
   if (typeof props.title === "string") {
     return props.title;
@@ -42974,7 +43137,7 @@ var init_debugRegistry = __esm({
   }
 });
 function useDebugData() {
-  const [data, setData] = React74.useState(() => ({
+  const [data, setData] = React77.useState(() => ({
     traits: [],
     ticks: [],
     guards: [],
@@ -42988,7 +43151,7 @@ function useDebugData() {
     },
     lastUpdate: Date.now()
   }));
-  React74.useEffect(() => {
+  React77.useEffect(() => {
     const updateData = () => {
       setData({
         traits: getAllTraits(),
@@ -43097,12 +43260,12 @@ function layoutGraph(states, transitions, initialState, width, height) {
   return positions;
 }
 function WalkMinimap() {
-  const [walkStep, setWalkStep] = React74.useState(null);
-  const [traits2, setTraits] = React74.useState([]);
-  const [coveredEdges, setCoveredEdges] = React74.useState([]);
-  const [completedTraits, setCompletedTraits] = React74.useState(/* @__PURE__ */ new Set());
-  const prevTraitRef = React74.useRef(null);
-  React74.useEffect(() => {
+  const [walkStep, setWalkStep] = React77.useState(null);
+  const [traits2, setTraits] = React77.useState([]);
+  const [coveredEdges, setCoveredEdges] = React77.useState([]);
+  const [completedTraits, setCompletedTraits] = React77.useState(/* @__PURE__ */ new Set());
+  const prevTraitRef = React77.useRef(null);
+  React77.useEffect(() => {
     const interval = setInterval(() => {
       const w = window;
       const step = w.__orbitalWalkStep;
@@ -43538,15 +43701,15 @@ var init_EntitiesTab = __esm({
 });
 function EventFlowTab({ events: events2 }) {
   const { t } = useTranslate();
-  const [filter, setFilter] = React74.useState("all");
-  const containerRef = React74.useRef(null);
-  const [autoScroll, setAutoScroll] = React74.useState(true);
-  React74.useEffect(() => {
+  const [filter, setFilter] = React77.useState("all");
+  const containerRef = React77.useRef(null);
+  const [autoScroll, setAutoScroll] = React77.useState(true);
+  React77.useEffect(() => {
     if (autoScroll && containerRef.current) {
       containerRef.current.scrollTop = containerRef.current.scrollHeight;
     }
   }, [events2.length, autoScroll]);
-  const filteredEvents = React74.useMemo(() => {
+  const filteredEvents = React77.useMemo(() => {
     if (filter === "all") return events2;
     return events2.filter((e) => e.type === filter);
   }, [events2, filter]);
@@ -43662,7 +43825,7 @@ var init_EventFlowTab = __esm({
 });
 function GuardsPanel({ guards }) {
   const { t } = useTranslate();
-  const [filter, setFilter] = React74.useState("all");
+  const [filter, setFilter] = React77.useState("all");
   if (guards.length === 0) {
     return /* @__PURE__ */ jsx(
       EmptyState,
@@ -43675,7 +43838,7 @@ function GuardsPanel({ guards }) {
   }
   const passedCount = guards.filter((g) => g.result).length;
   const failedCount = guards.length - passedCount;
-  const filteredGuards = React74.useMemo(() => {
+  const filteredGuards = React77.useMemo(() => {
     if (filter === "all") return guards;
     if (filter === "passed") return guards.filter((g) => g.result);
     return guards.filter((g) => !g.result);
@@ -43838,10 +44001,10 @@ function EffectBadge({ effect }) {
 }
 function TransitionTimeline({ transitions }) {
   const { t } = useTranslate();
-  const containerRef = React74.useRef(null);
-  const [autoScroll, setAutoScroll] = React74.useState(true);
-  const [expandedId, setExpandedId] = React74.useState(null);
-  React74.useEffect(() => {
+  const containerRef = React77.useRef(null);
+  const [autoScroll, setAutoScroll] = React77.useState(true);
+  const [expandedId, setExpandedId] = React77.useState(null);
+  React77.useEffect(() => {
     if (autoScroll && containerRef.current) {
       containerRef.current.scrollTop = containerRef.current.scrollHeight;
     }
@@ -44121,9 +44284,9 @@ function getAllEvents(traits2) {
 function EventDispatcherTab({ traits: traits2, schema }) {
   const eventBus = useEventBus();
   const { t } = useTranslate();
-  const [log9, setLog] = React74.useState([]);
-  const prevStatesRef = React74.useRef(/* @__PURE__ */ new Map());
-  React74.useEffect(() => {
+  const [log9, setLog] = React77.useState([]);
+  const prevStatesRef = React77.useRef(/* @__PURE__ */ new Map());
+  React77.useEffect(() => {
     for (const trait of traits2) {
       const prev = prevStatesRef.current.get(trait.id);
       if (prev && prev !== trait.currentState) {
@@ -44292,10 +44455,10 @@ function VerifyModePanel({
   localCount
 }) {
   const { t } = useTranslate();
-  const [expanded, setExpanded] = React74.useState(true);
-  const scrollRef = React74.useRef(null);
-  const prevCountRef = React74.useRef(0);
-  React74.useEffect(() => {
+  const [expanded, setExpanded] = React77.useState(true);
+  const scrollRef = React77.useRef(null);
+  const prevCountRef = React77.useRef(0);
+  React77.useEffect(() => {
     if (expanded && transitions.length > prevCountRef.current && scrollRef.current) {
       scrollRef.current.scrollTop = scrollRef.current.scrollHeight;
     }
@@ -44352,10 +44515,10 @@ function RuntimeDebugger({
   schema
 }) {
   const { t } = useTranslate();
-  const [isCollapsed, setIsCollapsed] = React74.useState(mode === "verify" ? true : defaultCollapsed);
-  const [isVisible, setIsVisible] = React74.useState(mode === "inline" || mode === "verify" || isDebugEnabled2());
+  const [isCollapsed, setIsCollapsed] = React77.useState(mode === "verify" ? true : defaultCollapsed);
+  const [isVisible, setIsVisible] = React77.useState(mode === "inline" || mode === "verify" || isDebugEnabled2());
   const debugData = useDebugData();
-  React74.useEffect(() => {
+  React77.useEffect(() => {
     if (mode === "inline") return;
     return onDebugToggle((enabled) => {
       setIsVisible(enabled);
@@ -44364,7 +44527,7 @@ function RuntimeDebugger({
       }
     });
   }, [mode]);
-  React74.useEffect(() => {
+  React77.useEffect(() => {
     if (mode === "inline") return;
     const handleKeyDown = (e) => {
       if (e.key === "`" && isVisible) {
@@ -44584,6 +44747,117 @@ var init_RuntimeDebugger2 = __esm({
     RuntimeDebugger.displayName = "RuntimeDebugger";
   }
 });
+var SegmentRenderer;
+var init_SegmentRenderer = __esm({
+  "components/core/organisms/SegmentRenderer.tsx"() {
+    "use client";
+    init_MarkdownContent();
+    init_CodeBlock();
+    init_QuizBlock();
+    init_ActivationBlock();
+    init_ConnectionBlock();
+    init_ReflectionBlock();
+    init_BloomQuizBlock();
+    init_CodeRunnerPanel();
+    init_cn();
+    SegmentRenderer = ({
+      segments,
+      className,
+      containerClassName,
+      userProgress,
+      onRunCodeSimulation,
+      onRenderVisualization
+    }) => {
+      if (segments.length === 0) return null;
+      let reflectIndex = 0;
+      let bloomIndex = 0;
+      return /* @__PURE__ */ 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__ */ jsx(MarkdownContent, { content: segment.content }, `md-${index}`);
+            }
+            if (segment.type === "code") {
+              if (segment.runnable && onRunCodeSimulation) {
+                return /* @__PURE__ */ jsx(
+                  CodeRunnerPanel,
+                  {
+                    language: segment.language,
+                    code: segment.content,
+                    runnable: true,
+                    onRun: (code) => onRunCodeSimulation(code, segment.language)
+                  },
+                  `code-${index}`
+                );
+              }
+              return /* @__PURE__ */ jsx(
+                CodeBlock,
+                {
+                  language: segment.language ?? "text",
+                  code: segment.content
+                },
+                `code-${index}`
+              );
+            }
+            if (segment.type === "quiz") {
+              return /* @__PURE__ */ jsx(QuizBlock, { question: segment.question, answer: segment.answer }, `quiz-${index}`);
+            }
+            if (segment.type === "activate") {
+              return /* @__PURE__ */ jsx(
+                ActivationBlock,
+                {
+                  question: segment.question,
+                  savedResponse: userProgress?.activationResponse
+                },
+                `activate-${index}`
+              );
+            }
+            if (segment.type === "connect") {
+              return /* @__PURE__ */ jsx(ConnectionBlock, { content: segment.content }, `connect-${index}`);
+            }
+            if (segment.type === "reflect") {
+              const ri = reflectIndex++;
+              return /* @__PURE__ */ jsx(
+                ReflectionBlock,
+                {
+                  prompt: segment.prompt,
+                  index: ri,
+                  savedNote: userProgress?.reflectionNotes?.[ri]
+                },
+                `reflect-${index}`
+              );
+            }
+            if (segment.type === "bloom") {
+              const bi = bloomIndex++;
+              return /* @__PURE__ */ jsx(
+                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";
+  }
+});
 function TraitSlot({
   slotNumber,
   equippedItem,
@@ -44813,7 +45087,7 @@ function SequenceBar({
     onSlotRemove(index);
   }, [onSlotRemove, playing]);
   const paddedSlots = Array.from({ length: maxSlots }, (_, i) => slots[i]);
-  return /* @__PURE__ */ jsx(HStack, { className: cn("items-center", className), gap: "sm", children: paddedSlots.map((slot, i) => /* @__PURE__ */ jsxs(React74__default.Fragment, { children: [
+  return /* @__PURE__ */ jsx(HStack, { className: cn("items-center", className), gap: "sm", children: paddedSlots.map((slot, i) => /* @__PURE__ */ jsxs(React77__default.Fragment, { children: [
     i > 0 && /* @__PURE__ */ jsx(
       Typography,
       {
@@ -45903,7 +46177,7 @@ var init_StatCard = __esm({
       const labelToUse = propLabel ?? propTitle;
       const eventBus = useEventBus();
       const { t } = useTranslate();
-      const handleActionClick = React74__default.useCallback(() => {
+      const handleActionClick = React77__default.useCallback(() => {
         if (action?.event) {
           eventBus.emit(`UI:${action.event}`, {});
         }
@@ -45914,7 +46188,7 @@ var init_StatCard = __esm({
       const data = Array.isArray(entity) ? entity : entity ? [entity] : [];
       const isLoading = externalLoading ?? false;
       const error = externalError;
-      const computeMetricValue = React74__default.useCallback(
+      const computeMetricValue = React77__default.useCallback(
         (metric, items) => {
           if (metric.value !== void 0) {
             return metric.value;
@@ -45953,7 +46227,7 @@ var init_StatCard = __esm({
         },
         []
       );
-      const schemaStats = React74__default.useMemo(() => {
+      const schemaStats = React77__default.useMemo(() => {
         if (!metrics || metrics.length === 0) return null;
         return metrics.map((metric) => ({
           label: metric.label,
@@ -45961,7 +46235,7 @@ var init_StatCard = __esm({
           format: metric.format
         }));
       }, [metrics, data, computeMetricValue]);
-      const calculatedTrend = React74__default.useMemo(() => {
+      const calculatedTrend = React77__default.useMemo(() => {
         if (manualTrend !== void 0) return manualTrend;
         if (previousValue === void 0 || currentValue2 === void 0)
           return void 0;
@@ -46998,7 +47272,7 @@ var init_Timeline = __esm({
     }) => {
       const { t } = useTranslate();
       const entityData = Array.isArray(entity) ? entity : [];
-      const items = React74__default.useMemo(() => {
+      const items = React77__default.useMemo(() => {
         if (propItems) return propItems;
         if (entityData.length === 0) return [];
         return entityData.map((record, idx) => {
@@ -47155,7 +47429,7 @@ var init_TimerDisplay = __esm({
   }
 });
 function extractToastProps(children) {
-  if (!React74__default.isValidElement(children)) {
+  if (!React77__default.isValidElement(children)) {
     if (typeof children === "string") {
       return { message: children };
     }
@@ -47193,7 +47467,7 @@ var init_ToastSlot = __esm({
         eventBus.emit("UI:CLOSE");
       };
       if (!isVisible) return null;
-      const isCustomContent = React74__default.isValidElement(children) && !message;
+      const isCustomContent = React77__default.isValidElement(children) && !message;
       return /* @__PURE__ */ jsx(Box, { className: "fixed bottom-4 right-4 z-50", children: isCustomContent ? children : /* @__PURE__ */ jsx(
         Toast,
         {
@@ -47737,8 +48011,8 @@ function XPBar({
 }) {
   const sizes = sizeMap18[size];
   const percentage = max > 0 ? Math.max(0, Math.min(100, current / max * 100)) : 0;
-  const [fillWidth, setFillWidth] = React74.useState(animated ? 0 : percentage);
-  React74.useEffect(() => {
+  const [fillWidth, setFillWidth] = React77.useState(animated ? 0 : percentage);
+  React77.useEffect(() => {
     if (!animated) {
       setFillWidth(percentage);
       return;
@@ -47811,7 +48085,7 @@ var init_XPBar = __esm({
   }
 });
 function lazyThree(name, loader) {
-  const Lazy = React74__default.lazy(
+  const Lazy = React77__default.lazy(
     () => loader().then((m) => {
       const Resolved = m[name];
       if (!Resolved) {
@@ -47823,13 +48097,13 @@ function lazyThree(name, loader) {
     })
   );
   function ThreeWrapper(props) {
-    return React74__default.createElement(
+    return React77__default.createElement(
       ThreeBoundary,
       { name },
-      React74__default.createElement(
-        React74__default.Suspense,
+      React77__default.createElement(
+        React77__default.Suspense,
         { fallback: null },
-        React74__default.createElement(Lazy, props)
+        React77__default.createElement(Lazy, props)
       )
     );
   }
@@ -47845,6 +48119,7 @@ var init_component_registry_generated = __esm({
     init_ActionButtons();
     init_ActionPalette();
     init_ActionTile();
+    init_ActivationBlock();
     init_ComponentPatterns();
     init_AnimatedCounter2();
     init_AnimatedGraphic();
@@ -47857,6 +48132,7 @@ var init_component_registry_generated = __esm({
     init_BattleBoard();
     init_BattleTemplate();
     init_BehaviorView();
+    init_BloomQuizBlock();
     init_BookChapterView();
     init_BookCoverPage();
     init_BookNavBar();
@@ -47884,12 +48160,14 @@ var init_component_registry_generated = __esm({
     init_ChoiceButton();
     init_ClassifierBoard();
     init_CodeBlock();
+    init_CodeRunnerPanel();
     init_CombatLog();
     init_ComboCounter();
     init_CommunityLinks();
     init_ConditionalWrapper();
     init_ConfettiEffect();
     init_ConfirmDialog();
+    init_ConnectionBlock();
     init_Container();
     init_ContentRenderer();
     init_ContentSection();
@@ -48017,6 +48295,7 @@ var init_component_registry_generated = __esm({
     init_QuizBlock();
     init_Radio();
     init_RangeSlider();
+    init_ReflectionBlock();
     init_RelationSelect();
     init_RepeatableFormSection();
     init_ReplyTree();
@@ -48031,6 +48310,7 @@ var init_component_registry_generated = __esm({
     init_SearchInput();
     init_Section();
     init_SectionHeader();
+    init_SegmentRenderer();
     init_Select();
     init_SequenceBar();
     init_SequencerBoard();
@@ -48122,7 +48402,7 @@ var init_component_registry_generated = __esm({
     init_WorldMapBoard();
     init_WorldMapTemplate();
     init_XPBar();
-    ThreeBoundary = class extends React74__default.Component {
+    ThreeBoundary = class extends React77__default.Component {
       constructor() {
         super(...arguments);
         __publicField(this, "state", { failed: false });
@@ -48132,7 +48412,7 @@ var init_component_registry_generated = __esm({
       }
       render() {
         if (this.state.failed) {
-          return React74__default.createElement(
+          return React77__default.createElement(
             "div",
             {
               "data-testid": "three-unavailable",
@@ -48156,6 +48436,7 @@ var init_component_registry_generated = __esm({
       "ActionButtons": ActionButtons,
       "ActionPalette": ActionPalette,
       "ActionTile": ActionTile,
+      "ActivationBlock": ActivationBlock,
       "Alert": AlertPattern,
       "AlertPattern": AlertPattern,
       "AnimatedCounter": AnimatedCounter2,
@@ -48169,6 +48450,7 @@ var init_component_registry_generated = __esm({
       "BattleBoard": BattleBoard,
       "BattleTemplate": BattleTemplate,
       "BehaviorView": BehaviorView,
+      "BloomQuizBlock": BloomQuizBlock,
       "BookChapterView": BookChapterView,
       "BookCoverPage": BookCoverPage,
       "BookNavBar": BookNavBar,
@@ -48199,12 +48481,14 @@ var init_component_registry_generated = __esm({
       "ChoiceButton": ChoiceButton,
       "ClassifierBoard": ClassifierBoard,
       "CodeBlock": CodeBlock,
+      "CodeRunnerPanel": CodeRunnerPanel,
       "CombatLog": CombatLog,
       "ComboCounter": ComboCounter,
       "CommunityLinks": CommunityLinks,
       "ConditionalWrapper": ConditionalWrapper,
       "ConfettiEffect": ConfettiEffect,
       "ConfirmDialog": ConfirmDialog,
+      "ConnectionBlock": ConnectionBlock,
       "Container": Container,
       "ContentRenderer": ContentRenderer,
       "ContentSection": ContentSection,
@@ -48341,6 +48625,7 @@ var init_component_registry_generated = __esm({
       "QuizBlock": QuizBlock,
       "Radio": Radio,
       "RangeSlider": RangeSlider,
+      "ReflectionBlock": ReflectionBlock,
       "RelationSelect": RelationSelect,
       "RepeatableFormSection": RepeatableFormSection,
       "ReplyTree": ReplyTree,
@@ -48355,6 +48640,7 @@ var init_component_registry_generated = __esm({
       "SearchInput": SearchInput,
       "Section": Section,
       "SectionHeader": SectionHeader,
+      "SegmentRenderer": SegmentRenderer,
       "Select": Select,
       "SequenceBar": SequenceBar,
       "SequencerBoard": SequencerBoard,
@@ -48468,7 +48754,7 @@ function SuspenseConfigProvider({
   config,
   children
 }) {
-  return React74__default.createElement(
+  return React77__default.createElement(
     SuspenseConfigContext.Provider,
     { value: config },
     children
@@ -48958,7 +49244,7 @@ function renderPatternChildren(children, onDismiss, parentId = "root", parentPat
         const key = `${parentId}-${index}-trait:${traitName}`;
         return /* @__PURE__ */ jsx(TraitFrame, { traitName }, key);
       }
-      return /* @__PURE__ */ jsx(React74__default.Fragment, { children: child }, `${parentId}-${index}`);
+      return /* @__PURE__ */ jsx(React77__default.Fragment, { children: child }, `${parentId}-${index}`);
     }
     if (!child || typeof child !== "object") return null;
     const childId = `${parentId}-${index}`;
@@ -48998,14 +49284,14 @@ function isPatternConfig(value) {
   if (value === null || value === void 0) return false;
   if (typeof value !== "object") return false;
   if (Array.isArray(value)) return false;
-  if (React74__default.isValidElement(value)) return false;
+  if (React77__default.isValidElement(value)) return false;
   if (value instanceof Date) return false;
   if (typeof value === "function") return false;
   const record = value;
   return "type" in record && typeof record.type === "string";
 }
 function isPlainConfigObject(value) {
-  if (React74__default.isValidElement(value)) return false;
+  if (React77__default.isValidElement(value)) return false;
   if (value instanceof Date) return false;
   const proto = Object.getPrototypeOf(value);
   return proto === Object.prototype || proto === null;
@@ -50426,271 +50712,8 @@ init_StepFlowOrganism();
 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 } = useTranslate();
-  const [code, setCode] = useState(initialCode);
-  const [output, setOutput] = useState(null);
-  const [error, setError] = useState(null);
-  const [isRunning, setIsRunning] = useState(false);
-  const handleRun = 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 = useCallback(() => {
-    setCode(initialCode);
-    setOutput(null);
-    setError(null);
-  }, [initialCode]);
-  if (!runnable || !onRun) {
-    return /* @__PURE__ */ jsx(Box, { className, children: /* @__PURE__ */ jsx(CodeBlock, { language, code }) });
-  }
-  const hasOutput = output !== null || error !== null;
-  return /* @__PURE__ */ jsxs(Box, { className: cn("space-y-3", className), children: [
-    /* @__PURE__ */ jsx(
-      CodeBlock,
-      {
-        language,
-        code,
-        editable: true,
-        onChange: setCode,
-        showLanguageBadge: true,
-        showCopyButton: true
-      }
-    ),
-    /* @__PURE__ */ jsxs(HStack, { gap: "sm", justify: "between", children: [
-      /* @__PURE__ */ jsxs(HStack, { gap: "sm", children: [
-        /* @__PURE__ */ jsx(
-          Button,
-          {
-            variant: "primary",
-            size: "sm",
-            onClick: handleRun,
-            disabled: isRunning,
-            className: "min-w-[5rem]",
-            children: isRunning ? /* @__PURE__ */ jsxs("span", { className: "inline-flex items-center gap-2", children: [
-              /* @__PURE__ */ jsx(RotateCcw, { size: 16, className: "animate-spin" }),
-              t("common.loading")
-            ] }) : /* @__PURE__ */ jsxs("span", { className: "inline-flex items-center gap-2", children: [
-              /* @__PURE__ */ jsx(Play, { size: 16 }),
-              "Run"
-            ] })
-          }
-        ),
-        /* @__PURE__ */ jsx(
-          Button,
-          {
-            variant: "secondary",
-            size: "sm",
-            onClick: handleReset,
-            disabled: isRunning,
-            children: /* @__PURE__ */ jsxs("span", { className: "inline-flex items-center gap-2", children: [
-              /* @__PURE__ */ jsx(RotateCcw, { size: 16 }),
-              "Reset"
-            ] })
-          }
-        )
-      ] }),
-      output && /* @__PURE__ */ jsxs(
-        Badge,
-        {
-          variant: output.exitCode === 0 ? "success" : "danger",
-          size: "sm",
-          children: [
-            "Exit ",
-            output.exitCode
-          ]
-        }
-      )
-    ] }),
-    hasOutput && /* @__PURE__ */ jsxs(Box, { className: "rounded-lg border border-gray-700 bg-[#0d0d0d] overflow-hidden", children: [
-      /* @__PURE__ */ jsxs(
-        HStack,
-        {
-          gap: "sm",
-          align: "center",
-          className: "px-3 py-2 bg-gray-800 border-b border-gray-700",
-          children: [
-            /* @__PURE__ */ jsx(Terminal, { size: 16, className: "text-gray-400" }),
-            /* @__PURE__ */ jsx(Typography, { variant: "small", className: "text-gray-300 font-medium", children: "Output" })
-          ]
-        }
-      ),
-      /* @__PURE__ */ jsx(VStack, { gap: "none", className: "p-3 font-mono text-sm", children: error ? /* @__PURE__ */ jsx(Typography, { variant: "small", className: "text-red-400 whitespace-pre-wrap", children: error }) : /* @__PURE__ */ jsxs(Fragment, { children: [
-        output?.stdout ? /* @__PURE__ */ jsx(Typography, { variant: "small", className: "text-gray-200 whitespace-pre-wrap", children: output.stdout }) : null,
-        output?.stderr ? /* @__PURE__ */ jsx(Typography, { variant: "small", className: "text-red-400 whitespace-pre-wrap", children: output.stderr }) : null,
-        !output?.stdout && !output?.stderr ? /* @__PURE__ */ jsx(Typography, { variant: "small", className: "text-gray-500 italic", children: "No output" }) : null,
-        output && output.testResults.length > 0 && /* @__PURE__ */ jsx(Box, { className: "mt-3 pt-3 border-t border-gray-700 space-y-2", children: output.testResults.map((test, index) => /* @__PURE__ */ jsxs(HStack, { gap: "sm", align: "start", className: "text-xs", children: [
-          test.passed ? /* @__PURE__ */ jsx(CheckCircle, { size: 14, className: "text-green-400 mt-0.5" }) : /* @__PURE__ */ jsx(XCircle, { size: 14, className: "text-red-400 mt-0.5" }),
-          /* @__PURE__ */ jsxs(VStack, { gap: "xs", className: "flex-1", children: [
-            /* @__PURE__ */ jsxs(
-              Typography,
-              {
-                variant: "small",
-                className: test.passed ? "text-green-400" : "text-red-400",
-                children: [
-                  "Test ",
-                  index + 1,
-                  ": ",
-                  test.passed ? "passed" : "failed"
-                ]
-              }
-            ),
-            /* @__PURE__ */ jsxs(Typography, { variant: "small", className: "text-gray-400", children: [
-              "Input: ",
-              test.input
-            ] }),
-            /* @__PURE__ */ jsxs(Typography, { variant: "small", className: "text-gray-400", children: [
-              "Expected: ",
-              test.expectedOutput
-            ] }),
-            /* @__PURE__ */ jsxs(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__ */ 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__ */ jsx(MarkdownContent, { content: segment.content }, `md-${index}`);
-        }
-        if (segment.type === "code") {
-          if (segment.runnable && onRunCodeSimulation) {
-            return /* @__PURE__ */ jsx(
-              CodeRunnerPanel,
-              {
-                language: segment.language,
-                code: segment.content,
-                runnable: true,
-                onRun: (code) => onRunCodeSimulation(code, segment.language)
-              },
-              `code-${index}`
-            );
-          }
-          return /* @__PURE__ */ jsx(
-            CodeBlock,
-            {
-              language: segment.language ?? "text",
-              code: segment.content
-            },
-            `code-${index}`
-          );
-        }
-        if (segment.type === "quiz") {
-          return /* @__PURE__ */ jsx(QuizBlock, { question: segment.question, answer: segment.answer }, `quiz-${index}`);
-        }
-        if (segment.type === "activate") {
-          return /* @__PURE__ */ jsx(
-            ActivationBlock,
-            {
-              question: segment.question,
-              savedResponse: userProgress?.activationResponse
-            },
-            `activate-${index}`
-          );
-        }
-        if (segment.type === "connect") {
-          return /* @__PURE__ */ jsx(ConnectionBlock, { content: segment.content }, `connect-${index}`);
-        }
-        if (segment.type === "reflect") {
-          const ri = reflectIndex++;
-          return /* @__PURE__ */ jsx(
-            ReflectionBlock,
-            {
-              prompt: segment.prompt,
-              index: ri,
-              savedNote: userProgress?.reflectionNotes?.[ri]
-            },
-            `reflect-${index}`
-          );
-        }
-        if (segment.type === "bloom") {
-          const bi = bloomIndex++;
-          return /* @__PURE__ */ jsx(
-            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";
+init_CodeRunnerPanel();
+init_SegmentRenderer();
 
 // components/core/templates/index.ts
 init_DashboardLayout();
@@ -50710,4 +50733,4 @@ init_AboutPageTemplate();
 // components/index.ts
 init_cn();
 
-export { ALL_PRESETS, AR_BOOK_FIELDS, AboutPageTemplate, Accordion, ActionButton, ActionButtons, Card2 as ActionCard, ActionPalette, ActionTile, ActivationBlock, Alert, AnimatedCounter, AnimatedGraphic, AnimatedReveal, ArticleSection, Aside, AssetPicker, AuthLayout, Avatar, Badge, BattleBoard, BattleTemplate, BehaviorView, BloomQuizBlock, BookChapterView, BookCoverPage, BookNavBar, BookTableOfContents, BookViewer, Box, BranchingLogicBuilder, Breadcrumb, BuilderBoard, Button, ButtonGroup, CTABanner, CalendarGrid, CanvasEffect, Card, CardBody, CardContent, CardFooter, CardGrid, CardHeader, CardTitle, Carousel, CaseStudyCard, CaseStudyOrganism, CastleBoard, CastleTemplate, Center, Chart, ChartLegend, Checkbox, ChoiceButton, ClassifierBoard, Coachmark, CodeBlock, CodeRunnerPanel, CollapsibleSection, CombatLog, ComboCounter, CommunityLinks, ConditionalWrapper, ConfettiEffect, ConfirmDialog, ConnectionBlock, Container, ContentRenderer, ContentSection, ControlButton, CounterTemplate, CraftingRecipe, DEFAULT_LIKERT_OPTIONS, DEFAULT_MATRIX_COLUMNS, DIAMOND_TOP_Y, DPad, DamageNumber, DashboardGrid, DashboardLayout, DataGrid, DataList, DataTable, DateRangePicker, DateRangeSelector, DayCell, DebuggerBoard, DetailPanel, Dialog, DialogueBox, DialogueBubble, Divider, DocBreadcrumb, DocPagination, DocSearch, DocSidebar, DocTOC, DocumentViewer, StateMachineView as DomStateMachineVisualizer, Drawer, DrawerSlot, EdgeDecoration, EditorCheckbox, EditorSelect, EditorSlider, EditorTextInput, EditorToolbar, EmptyState, EnemyPlate, EntityDisplayEvents, ErrorBoundary, ErrorState, EventHandlerBoard, EventLog, FEATURE_COLORS, FEATURE_TYPES, FLOOR_HEIGHT, FeatureCard, FeatureDetailPageTemplate, FeatureGrid, FeatureGridOrganism, FileTree, FilterGroup, FilterPill, Flex, FlipCard, FlipContainer, FloatingActionButton, Form, FormActions, FormField, FormLayout, FormSection, FormSectionHeader, GameAudioContext, GameAudioProvider, GameAudioToggle, GameCanvas2D, GameHud, GameMenu, GameOverScreen, GameShell, GameTemplate, GenericAppTemplate, GeometricPattern, GradientDivider, GraphCanvas, GraphView, Grid, GridPicker, HStack, Header, HealthBar, HealthPanel, HeroOrganism, HeroSection, IDENTITY_BOOK_FIELDS, Icon, IconPicker, InfiniteScrollSentinel, Input, InputGroup, InstallBox, InventoryGrid, InventoryPanel, IsometricCanvas, ItemSlot, JazariStateMachine, JsonTreeEditor, Label, LandingPageTemplate, LawReferenceTooltip, Lightbox, LikertScale, LineChart2 as LineChart, List3 as List, LoadingState, MapView, MarkdownContent, MarketingFooter, MarketingStatCard, MasterDetail, MasterDetailLayout, MatrixQuestion, MediaGallery, Menu, Meter, MiniMap, Modal, ModalSlot, ModuleCard, Navigation, NegotiatorBoard, NodeSlotEditor, NotifyListener, NumberStepper, ObjectRulePanel, OnboardingSpotlight, OptionConstraintGroup, StateMachineView as OrbitalStateMachineView, OrbitalVisualization, Overlay, PageHeader, Pagination, PatternTile, PhysicsManager, PlatformerCanvas, Popover, PositionedCanvas, PowerupSlots, PricingCard, PricingGrid, PricingOrganism, PricingPageTemplate, ProgressBar, ProgressDots, PropertyInspector, PullQuote, PullToRefresh, QrScanner, QuestTracker, QuizBlock, Radio, RangeSlider, ReflectionBlock, RelationSelect, RepeatableFormSection, ReplyTree, ResourceBar, ResourceCounter, RichBlockEditor, RuleEditor, RuntimeDebugger, SHEET_COLUMNS, SPRITE_SHEET_LAYOUT, ScaledDiagram, ScoreBoard, ScoreDisplay, SearchInput, Section, SectionHeader, SegmentRenderer, Select, SequenceBar, SequencerBoard, ServiceCatalog, ShowcaseCard, ShowcaseOrganism, SidePanel, Sidebar, SignaturePad, SimpleGrid, SimulationCanvas, SimulationControls, SimulationGraph, SimulatorBoard, Skeleton, SlotContentRenderer, SocialProof, SortableList, Spacer, Sparkline, Spinner, Split, SplitPane, SplitSection, Sprite, Stack, StarRating, StatBadge, StatCard, StatDisplay, StateArchitectBoard, StateIndicator, StateJsonView, StateMachineView, StateNode2 as StateNode, StatsGrid, StatsOrganism, StatusBar, StatusDot, StatusEffect, StepFlow, StepFlowOrganism, SvgBranch, SvgConnection, SvgFlow, SvgGrid, SvgLobe, SvgMesh, SvgMorph, SvgNode, SvgPulse, SvgRing, SvgShield, SvgStack, SwipeableRow, Switch, TERRAIN_COLORS, TILE_HEIGHT, TILE_WIDTH, TabbedContainer, TableView, Tabs, TagCloud, TagInput, TeamCard, TeamOrganism, TerrainPalette, TextHighlight, Textarea, ThemeSelector, ThemeToggle, TimeSlotCell, Timeline, TimerDisplay, Toast, ToastSlot, Tooltip, TraitFrame, TraitSlot, TraitStateViewer, TransitionArrow, TrendIndicator, TurnIndicator, TurnPanel, TypewriterText, Typography, UISlotComponent, UISlotRenderer, UncontrolledBattleBoard, UnitCommandBar, UploadDropZone, VStack, VariablePanel, VersionDiff, ViolationAlert, VoteStack, WaypointMarker, WizardContainer, WizardNavigation, WizardProgress, WorldMapBoard, WorldMapTemplate, XPBar, applyTemporaryEffect, calculateAttackTargets, calculateDamage, calculateValidMoves, cn, combatAnimations, combatClasses, combatEffects, createInitialGameState, createUnitAnimationState, drawSprite, generateCombatMessage, getCurrentFrame, getTileDimensions, inferDirection, isoToScreen, mapBookData, parseLessonSegments, parseMarkdownWithCodeBlocks2 as parseMarkdownWithCodeBlocks, pendulum, projectileMotion, resolveFieldMap, resolveFrame, resolveSheetDirection, screenToIso, springOscillator, tickAnimationState, toCodeLanguage, transitionAnimation, useAnchorRect, useBattleState, useCamera, useGameAudio, useGameAudioContext, useImageCache, usePhysics2D, useSpriteAnimations };
+export { ALL_PRESETS, AR_BOOK_FIELDS, AboutPageTemplate, Accordion, ActionButton, ActionButtons, Card2 as ActionCard, ActionPalette, ActionTile, ActivationBlock, Alert, AnimatedCounter, AnimatedGraphic, AnimatedReveal, ArticleSection, Aside, AssetPicker, AuthLayout, Avatar, Badge, BattleBoard, BattleTemplate, BehaviorView, BloomQuizBlock, BookChapterView, BookCoverPage, BookNavBar, BookTableOfContents, BookViewer, Box, BranchingLogicBuilder, Breadcrumb, BuilderBoard, Button, ButtonGroup, CTABanner, CalendarGrid, CanvasEffect, Card, CardBody, CardContent, CardFooter, CardGrid, CardHeader, CardTitle, Carousel, CaseStudyCard, CaseStudyOrganism, CastleBoard, CastleTemplate, Center, Chart, ChartLegend, Checkbox, ChoiceButton, ClassifierBoard, Coachmark, CodeBlock, CodeRunnerPanel, CollapsibleSection, CombatLog, ComboCounter, CommunityLinks, ConditionalWrapper, ConfettiEffect, ConfirmDialog, ConnectionBlock, Container, ContentRenderer, ContentSection, ControlButton, CounterTemplate, CraftingRecipe, DEFAULT_LIKERT_OPTIONS, DEFAULT_MATRIX_COLUMNS, DIAMOND_TOP_Y, DPad, DamageNumber, DashboardGrid, DashboardLayout, DataGrid, DataList, DataTable, DateRangePicker, DateRangeSelector, DayCell, DebuggerBoard, DetailPanel, Dialog, DialogueBox, DialogueBubble, Divider, DocBreadcrumb, DocPagination, DocSearch, DocSidebar, DocTOC, DocumentViewer, StateMachineView as DomStateMachineVisualizer, Drawer, DrawerSlot, EdgeDecoration, EditorCheckbox, EditorSelect, EditorSlider, EditorTextInput, EditorToolbar, EmptyState, EnemyPlate, EntityDisplayEvents, ErrorBoundary, ErrorState, EventHandlerBoard, EventLog, FEATURE_COLORS, FEATURE_TYPES, FLOOR_HEIGHT, FeatureCard, FeatureDetailPageTemplate, FeatureGrid, FeatureGridOrganism, FileTree, FilterGroup, FilterPill, Flex, FlipCard, FlipContainer, FloatingActionButton, Form, FormActions, FormField, FormLayout, FormSection, FormSectionHeader, GameAudioContext, GameAudioProvider, GameAudioToggle, GameCanvas2D, GameHud, GameMenu, GameOverScreen, GameShell, GameTemplate, GenericAppTemplate, GeometricPattern, GradientDivider, GraphCanvas, GraphView, Grid, GridPicker, HStack, Header, HealthBar, HealthPanel, HeroOrganism, HeroSection, IDENTITY_BOOK_FIELDS, Icon, IconPicker, InfiniteScrollSentinel, Input, InputGroup, InstallBox, InventoryGrid, InventoryPanel, IsometricCanvas, ItemSlot, JazariStateMachine, JsonTreeEditor, Label, LandingPageTemplate, LawReferenceTooltip, Lightbox, LikertScale, LineChart2 as LineChart, List3 as List, LoadingState, MapView, MarkdownContent, MarketingFooter, MarketingStatCard, MasterDetail, MasterDetailLayout, MatrixQuestion, MediaGallery, Menu, Meter, MiniMap, Modal, ModalSlot, ModuleCard, Navigation, NegotiatorBoard, NodeSlotEditor, NotifyListener, NumberStepper, ObjectRulePanel, OnboardingSpotlight, OptionConstraintGroup, StateMachineView as OrbitalStateMachineView, OrbitalVisualization, Overlay, PageHeader, Pagination, PatternTile, PhysicsManager, PlatformerCanvas, Popover, PositionedCanvas, PowerupSlots, PricingCard, PricingGrid, PricingOrganism, PricingPageTemplate, ProgressBar, ProgressDots, PropertyInspector, PullQuote, PullToRefresh, QrScanner, QuestTracker, QuizBlock, Radio, RangeSlider, ReflectionBlock, RelationSelect, RepeatableFormSection, ReplyTree, ResourceBar, ResourceCounter, RichBlockEditor, RuleEditor, RuntimeDebugger, SHEET_COLUMNS, SPRITE_SHEET_LAYOUT, ScaledDiagram, ScoreBoard, ScoreDisplay, SearchInput, Section, SectionHeader, SegmentRenderer, Select, SequenceBar, SequencerBoard, ServiceCatalog, ShowcaseCard, ShowcaseOrganism, SidePanel, Sidebar, SignaturePad, SimpleGrid, SimulationCanvas, SimulationControls, SimulationGraph, SimulatorBoard, Skeleton, SlotContentRenderer, SocialProof, SortableList, Spacer, Sparkline, Spinner, Split, SplitPane, SplitSection, Sprite, Stack, StarRating, StatBadge, StatCard, StatDisplay, StateArchitectBoard, StateIndicator, StateJsonView, StateMachineView, StateNode2 as StateNode, StatsGrid, StatsOrganism, StatusBar, StatusDot, StatusEffect, StepFlow, StepFlowOrganism, SvgBranch, SvgConnection, SvgFlow, SvgGrid, SvgLobe, SvgMesh, SvgMorph, SvgNode, SvgPulse, SvgRing, SvgShield, SvgStack, SwipeableRow, Switch, TERRAIN_COLORS, TILE_HEIGHT, TILE_WIDTH, TabbedContainer, TableView, Tabs, TagCloud, TagInput, TeamCard, TeamOrganism, TerrainPalette, TextHighlight, Textarea, ThemeSelector, ThemeToggle, TimeSlotCell, Timeline, TimerDisplay, Toast, ToastSlot, Tooltip, TraitFrame, TraitSlot, TraitStateViewer, TransitionArrow, TrendIndicator, TurnIndicator, TurnPanel, TypewriterText, Typography, UISlotComponent, UISlotRenderer, UncontrolledBattleBoard, UnitCommandBar, UploadDropZone, VStack, VariablePanel, VersionDiff, ViolationAlert, VoteStack, WaypointMarker, WizardContainer, WizardNavigation, WizardProgress, WorldMapBoard, WorldMapTemplate, XPBar, applyTemporaryEffect, calculateAttackTargets, calculateDamage, calculateValidMoves, cn, combatAnimations, combatClasses, combatEffects, createInitialGameState, createUnitAnimationState, drawSprite, generateCombatMessage, getCurrentFrame, getTileDimensions, inferDirection, isoToScreen, mapBookData, parseLessonSegments, parseMarkdownWithCodeBlocks, pendulum, projectileMotion, resolveFieldMap, resolveFrame, resolveSheetDirection, screenToIso, springOscillator, tickAnimationState, toCodeLanguage, transitionAnimation, useAnchorRect, useBattleState, useCamera, useGameAudio, useGameAudioContext, useImageCache, usePhysics2D, useSpriteAnimations };