@almadar/ui 5.35.0 → 5.37.0

package/dist/components/index.js

@@ -7,9 +7,6 @@ import { EventBusContext, useTraitScope, TraitScopeProvider } from '@almadar/ui/
 import { createLogger, isLogLevelEnabled } from '@almadar/logger';
 import * as LucideIcons2 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';
 import { useTranslate } from '@almadar/ui/hooks';
 export * from '@almadar/ui/hooks';
 import { evaluate, createMinimalContext } from '@almadar/evaluator';
@@ -1226,6 +1223,41 @@ function kebabToPascal(name) {
     return part.charAt(0).toUpperCase() + part.slice(1);
   }).join("");
 }
+function loadLib(key, importer) {
+  let p2 = libPromises.get(key);
+  if (!p2) {
+    p2 = importer().then((m) => m);
+    libPromises.set(key, p2);
+  }
+  return p2;
+}
+function lazyFamilyIcon(libKey, importer, pick, fallbackName, family) {
+  const Lazy = React77__default.lazy(async () => {
+    const lib = await loadLib(libKey, importer);
+    const Comp = pick(lib);
+    if (!Comp) {
+      warnFallback(fallbackName, family);
+      return { default: makeLucideAdapter(fallbackName, true) };
+    }
+    return { default: Comp };
+  });
+  const Wrapped = (props) => /* @__PURE__ */ jsx(
+    React77__default.Suspense,
+    {
+      fallback: /* @__PURE__ */ jsx(
+        "span",
+        {
+          "aria-hidden": true,
+          className: props.className,
+          style: { display: "inline-block", ...props.style }
+        }
+      ),
+      children: /* @__PURE__ */ jsx(Lazy, { ...props })
+    }
+  );
+  Wrapped.displayName = `Lazy.${libKey}.${fallbackName}`;
+  return Wrapped;
+}
 function resolveLucide(name) {
   if (lucideAliases[name]) return lucideAliases[name];
   const pascal = kebabToPascal(name);
@@ -1236,60 +1268,81 @@ function resolveLucide(name) {
   if (asIs && typeof asIs === "object") return asIs;
   return LucideIcons2.HelpCircle;
 }
-function resolvePhosphor(name, weight) {
+function resolvePhosphor(name, weight, family) {
   const target = phosphorAliases[name] ?? kebabToPascal(name);
-  const map = PhosphorIcons;
-  const PhosphorComp = map[target];
-  if (!PhosphorComp || typeof PhosphorComp !== "object") return null;
-  const Component = PhosphorComp;
-  const Adapter = (props) => /* @__PURE__ */ jsx(
-    Component,
-    {
-      weight,
-      className: props.className,
-      style: props.style,
-      size: props.size ?? "1em"
-    }
+  return lazyFamilyIcon(
+    "phosphor",
+    () => import('@phosphor-icons/react'),
+    (lib) => {
+      const PhosphorComp = lib[target];
+      if (!PhosphorComp || typeof PhosphorComp !== "object") return null;
+      const Component = PhosphorComp;
+      const Adapter = (props) => /* @__PURE__ */ jsx(
+        Component,
+        {
+          weight,
+          className: props.className,
+          style: props.style,
+          size: props.size ?? "1em"
+        }
+      );
+      Adapter.displayName = `Phosphor.${target}.${weight}`;
+      return Adapter;
+    },
+    name,
+    family
   );
-  Adapter.displayName = `Phosphor.${target}.${weight}`;
-  return Adapter;
 }
-function resolveTabler(name) {
+function resolveTabler(name, family) {
   const suffix = tablerAliases[name] ?? kebabToPascal(name);
   const target = `Icon${suffix}`;
-  const map = TablerIcons;
-  const TablerComp = map[target];
-  if (!TablerComp || typeof TablerComp !== "object") return null;
-  const Component = TablerComp;
-  const Adapter = (props) => /* @__PURE__ */ jsx(
-    Component,
-    {
-      stroke: props.strokeWidth ?? 1.5,
-      className: props.className,
-      style: props.style,
-      size: props.size ?? 24
-    }
+  return lazyFamilyIcon(
+    "tabler",
+    () => import('@tabler/icons-react'),
+    (lib) => {
+      const TablerComp = lib[target];
+      if (!TablerComp || typeof TablerComp !== "object") return null;
+      const Component = TablerComp;
+      const Adapter = (props) => /* @__PURE__ */ jsx(
+        Component,
+        {
+          stroke: props.strokeWidth ?? 1.5,
+          className: props.className,
+          style: props.style,
+          size: props.size ?? 24
+        }
+      );
+      Adapter.displayName = `Tabler.${target}`;
+      return Adapter;
+    },
+    name,
+    family
   );
-  Adapter.displayName = `Tabler.${target}`;
-  return Adapter;
 }
-function resolveFa(name) {
+function resolveFa(name, family) {
   const suffix = faAliases[name] ?? kebabToPascal(name);
   const target = `Fa${suffix}`;
-  const map = FaIcons;
-  const FaComp = map[target];
-  if (!FaComp || typeof FaComp !== "function") return null;
-  const Component = FaComp;
-  const Adapter = (props) => /* @__PURE__ */ jsx(
-    Component,
-    {
-      className: props.className,
-      style: props.style,
-      size: props.size ?? "1em"
-    }
+  return lazyFamilyIcon(
+    "fa",
+    () => import('react-icons/fa'),
+    (lib) => {
+      const FaComp = lib[target];
+      if (!FaComp || typeof FaComp !== "function") return null;
+      const Component = FaComp;
+      const Adapter = (props) => /* @__PURE__ */ jsx(
+        Component,
+        {
+          className: props.className,
+          style: props.style,
+          size: props.size ?? "1em"
+        }
+      );
+      Adapter.displayName = `Fa.${target}`;
+      return Adapter;
+    },
+    name,
+    family
   );
-  Adapter.displayName = `Fa.${target}`;
-  return Adapter;
 }
 function warnFallback(name, family) {
   const key = `${family}::${name}`;
@@ -1323,39 +1376,22 @@ function resolveIconForFamily(name, family) {
   switch (family) {
     case "lucide":
       return makeLucideAdapter(name, false);
-    case "phosphor-outline": {
-      const p2 = resolvePhosphor(name, "regular");
-      if (p2) return p2;
-      warnFallback(name, family);
-      return makeLucideAdapter(name, true);
-    }
-    case "phosphor-fill": {
-      const p2 = resolvePhosphor(name, "fill");
-      if (p2) return p2;
-      warnFallback(name, family);
-      return makeLucideAdapter(name, true);
-    }
-    case "phosphor-duotone": {
-      const p2 = resolvePhosphor(name, "duotone");
-      if (p2) return p2;
-      warnFallback(name, family);
-      return makeLucideAdapter(name, true);
-    }
-    case "tabler": {
-      const t = resolveTabler(name);
-      if (t) return t;
-      warnFallback(name, family);
-      return makeLucideAdapter(name, true);
-    }
-    case "fa-solid": {
-      const f3 = resolveFa(name);
-      if (f3) return f3;
-      warnFallback(name, family);
-      return makeLucideAdapter(name, true);
-    }
-  }
-}
-var DEFAULT_FAMILY, VALID_FAMILIES, cachedFamily, listeners, observer, lucideAliases, phosphorAliases, tablerAliases, faAliases, warned;
+    // Non-lucide families resolve to a lazy, Suspense-wrapped component that
+    // dynamic-imports the library on first render and falls back to lucide
+    // internally when the family lacks the icon (see lazyFamilyIcon).
+    case "phosphor-outline":
+      return resolvePhosphor(name, "regular", family);
+    case "phosphor-fill":
+      return resolvePhosphor(name, "fill", family);
+    case "phosphor-duotone":
+      return resolvePhosphor(name, "duotone", family);
+    case "tabler":
+      return resolveTabler(name, family);
+    case "fa-solid":
+      return resolveFa(name, family);
+  }
+}
+var DEFAULT_FAMILY, VALID_FAMILIES, cachedFamily, listeners, observer, libPromises, lucideAliases, phosphorAliases, tablerAliases, faAliases, warned;
 var init_iconFamily = __esm({
   "lib/iconFamily.tsx"() {
     "use client";
@@ -1371,6 +1407,7 @@ var init_iconFamily = __esm({
     cachedFamily = null;
     listeners = /* @__PURE__ */ new Set();
     observer = null;
+    libPromises = /* @__PURE__ */ new Map();
     lucideAliases = {
       close: LucideIcons2.X,
       trash: LucideIcons2.Trash2,
@@ -15929,61 +15966,53 @@ var init_Breadcrumb = __esm({
 function BuilderBoard({
   entity,
   completeEvent = "PUZZLE_COMPLETE",
+  placeEvent,
+  checkEvent,
+  playAgainEvent,
   className
 }) {
   const { emit } = useEventBus();
   const { t } = useTranslate();
   const resolved = boardEntity(entity);
-  const [placements, setPlacements] = useState({});
   const [headerError, setHeaderError] = useState(false);
-  const [submitted, setSubmitted] = useState(false);
-  const [attempts, setAttempts] = useState(0);
-  const [showHint, setShowHint] = useState(false);
+  const [selectedComponent, setSelectedComponent] = useState(null);
   const components = Array.isArray(resolved?.components) ? resolved.components : [];
   const slots = Array.isArray(resolved?.slots) ? resolved.slots : [];
+  const placements = {};
+  for (const slot of slots) {
+    if (slot.placedComponentId) placements[slot.id] = slot.placedComponentId;
+  }
+  const attempts = num(resolved?.attempts);
+  const result = str(resolved?.result) || "none";
+  const submitted = result === "win";
   const usedComponentIds = new Set(Object.values(placements));
   const availableComponents = components.filter((c) => !usedComponentIds.has(c.id));
-  const [selectedComponent, setSelectedComponent] = useState(null);
-  const allPlaced = Object.keys(placements).length === slots.length;
+  const allPlaced = slots.length > 0 && slots.every((s) => Boolean(placements[s.id]));
   const results = submitted ? slots.map((slot) => ({
     slot,
     placed: placements[slot.id],
-    correct: placements[slot.id] === slot.acceptsComponentId
+    correct: placements[slot.id] === slot.requiredComponentId
   })) : [];
-  const allCorrect = results.length > 0 && results.every((r) => r.correct);
+  const showHint = attempts >= 2 && Boolean(str(resolved?.hint));
   const handlePlaceComponent = (slotId) => {
     if (submitted || !selectedComponent) return;
-    setPlacements((prev) => ({ ...prev, [slotId]: selectedComponent }));
+    if (placeEvent) emit(`UI:${placeEvent}`, { slotId, componentId: selectedComponent });
     setSelectedComponent(null);
   };
   const handleRemoveFromSlot = (slotId) => {
     if (submitted) return;
-    setPlacements((prev) => {
-      const next = { ...prev };
-      delete next[slotId];
-      return next;
-    });
+    if (placeEvent) emit(`UI:${placeEvent}`, { slotId, componentId: "" });
   };
-  const handleSubmit = useCallback(() => {
-    setSubmitted(true);
-    setAttempts((a) => a + 1);
-    const correct = slots.every((slot) => placements[slot.id] === slot.acceptsComponentId);
-    if (correct) {
+  const handleSubmit = () => {
+    if (checkEvent) emit(`UI:${checkEvent}`, {});
+    const solved = slots.length > 0 && slots.every((s) => placements[s.id] === s.requiredComponentId);
+    if (solved && completeEvent) {
       emit(`UI:${completeEvent}`, { success: true, attempts: attempts + 1 });
     }
-  }, [slots, placements, attempts, completeEvent, emit]);
-  const handleReset = () => {
-    setSubmitted(false);
-    if (attempts >= 2 && str(resolved?.hint)) {
-      setShowHint(true);
-    }
   };
-  const handleFullReset = () => {
-    setPlacements({});
-    setSubmitted(false);
+  const handlePlayAgain = () => {
     setSelectedComponent(null);
-    setAttempts(0);
-    setShowHint(false);
+    if (playAgainEvent) emit(`UI:${playAgainEvent}`, {});
   };
   const getComponentById = (id) => components.find((c) => c.id === id);
   if (!resolved) return null;
@@ -16033,13 +16062,13 @@ function BuilderBoard({
           /* @__PURE__ */ jsx(Typography, { variant: "small", weight: "bold", className: "uppercase tracking-wider text-muted-foreground", children: t("builder.blueprint") }),
           /* @__PURE__ */ jsx(VStack, { gap: "sm", children: slots.map((slot) => {
             const placedComp = placements[slot.id] ? getComponentById(placements[slot.id]) : null;
-            const result = results.find((r) => r.slot.id === slot.id);
+            const result2 = results.find((r) => r.slot.id === slot.id);
             return /* @__PURE__ */ jsxs(
               HStack,
               {
                 gap: "sm",
                 align: "center",
-                className: `p-3 border-2 rounded ${result ? result.correct ? "border-success" : "border-error" : selectedComponent ? "border-dashed border-foreground cursor-pointer" : "border-border"}`,
+                className: `p-3 border-2 rounded ${result2 ? result2.correct ? "border-success" : "border-error" : selectedComponent ? "border-dashed border-foreground cursor-pointer" : "border-border"}`,
                 onClick: () => handlePlaceComponent(slot.id),
                 children: [
                   /* @__PURE__ */ jsxs(VStack, { gap: "none", className: "flex-1", children: [
@@ -16054,7 +16083,7 @@ function BuilderBoard({
                       ] }) : null,
                       placedComp.label
                     ] }),
-                    result && /* @__PURE__ */ jsx(Icon, { icon: result.correct ? CheckCircle : XCircle, size: "sm", className: result.correct ? "text-success" : "text-error" })
+                    result2 && /* @__PURE__ */ jsx(Icon, { icon: result2.correct ? CheckCircle : XCircle, size: "sm", className: result2.correct ? "text-success" : "text-error" })
                   ] }) : /* @__PURE__ */ jsx(Typography, { variant: "caption", className: "text-muted-foreground", children: t("builder.empty") })
                 ]
               },
@@ -16063,16 +16092,16 @@ function BuilderBoard({
           }) })
         ] }) }),
         submitted && /* @__PURE__ */ jsx(Card, { className: "p-4", children: /* @__PURE__ */ jsxs(VStack, { gap: "sm", align: "center", children: [
-          /* @__PURE__ */ jsx(Icon, { icon: allCorrect ? CheckCircle : XCircle, size: "lg", className: allCorrect ? "text-success" : "text-error" }),
-          /* @__PURE__ */ jsx(Typography, { variant: "body", weight: "bold", children: allCorrect ? str(resolved.successMessage) || t("builder.success") : str(resolved.failMessage) || t("builder.incorrect") })
+          /* @__PURE__ */ jsx(Icon, { icon: CheckCircle, size: "lg", className: "text-success" }),
+          /* @__PURE__ */ jsx(Typography, { variant: "body", weight: "bold", children: str(resolved.successMessage) || t("builder.success") })
         ] }) }),
         showHint && hint && /* @__PURE__ */ jsx(Card, { className: "p-4 border-l-4 border-l-warning", children: /* @__PURE__ */ jsx(Typography, { variant: "body", children: hint }) }),
         /* @__PURE__ */ jsxs(HStack, { gap: "sm", justify: "center", children: [
-          !submitted ? /* @__PURE__ */ jsxs(Button, { variant: "primary", onClick: handleSubmit, disabled: !allPlaced, children: [
+          !submitted && /* @__PURE__ */ jsxs(Button, { variant: "primary", onClick: handleSubmit, disabled: !allPlaced, children: [
             /* @__PURE__ */ jsx(Icon, { icon: Wrench, size: "sm" }),
             t("builder.build")
-          ] }) : !allCorrect ? /* @__PURE__ */ jsx(Button, { variant: "primary", onClick: handleReset, children: t("builder.tryAgain") }) : null,
-          /* @__PURE__ */ jsxs(Button, { variant: "secondary", onClick: handleFullReset, children: [
+          ] }),
+          /* @__PURE__ */ jsxs(Button, { variant: "secondary", onClick: handlePlayAgain, children: [
             /* @__PURE__ */ jsx(Icon, { icon: RotateCcw, size: "sm" }),
             t("builder.reset")
           ] })
@@ -19574,57 +19603,84 @@ var init_ChoiceButton = __esm({
 function ClassifierBoard({
   entity,
   completeEvent = "PUZZLE_COMPLETE",
+  assignEvent,
+  checkEvent,
+  playAgainEvent,
   className
 }) {
   const { emit } = useEventBus();
   const { t } = useTranslate();
   const resolved = boardEntity(entity);
-  const [assignments, setAssignments] = useState({});
+  const [localAssignments, setLocalAssignments] = useState({});
   const [headerError, setHeaderError] = useState(false);
-  const [submitted, setSubmitted] = useState(false);
-  const [attempts, setAttempts] = useState(0);
+  const [localSubmitted, setLocalSubmitted] = useState(false);
+  const [localAttempts, setLocalAttempts] = useState(0);
   const [showHint, setShowHint] = useState(false);
   const items = Array.isArray(resolved?.items) ? resolved.items : [];
   const categories = Array.isArray(resolved?.categories) ? resolved.categories : [];
+  const entityResult = str(resolved?.result);
+  const entityDrivesResult = entityResult.length > 0;
+  const entityHasAssignments = items.some((item) => item.assignedCategory != null);
+  const assignments = entityHasAssignments ? items.reduce((acc, item) => {
+    if (item.assignedCategory != null) acc[item.id] = item.assignedCategory;
+    return acc;
+  }, {}) : localAssignments;
+  const attempts = entityDrivesResult ? num(resolved?.attempts) : localAttempts;
+  const submitted = entityDrivesResult || localSubmitted;
   const unassignedItems = items.filter((item) => !assignments[item.id]);
-  const allAssigned = Object.keys(assignments).length === items.length;
+  const allAssigned = items.length > 0 && Object.keys(assignments).length === items.length;
   const results = submitted ? items.map((item) => ({
     item,
     assigned: assignments[item.id],
     correct: assignments[item.id] === item.correctCategory
   })) : [];
-  const allCorrect = results.length > 0 && results.every((r) => r.correct);
+  const allCorrect = entityDrivesResult ? entityResult === "success" : results.length > 0 && results.every((r) => r.correct);
   const correctCount = results.filter((r) => r.correct).length;
   const handleAssign = (itemId, categoryId) => {
     if (submitted) return;
-    setAssignments((prev) => ({ ...prev, [itemId]: categoryId }));
+    if (assignEvent) {
+      emit(`UI:${assignEvent}`, { itemId, categoryId });
+    }
+    if (!entityHasAssignments) {
+      setLocalAssignments((prev) => ({ ...prev, [itemId]: categoryId }));
+    }
   };
   const handleUnassign = (itemId) => {
     if (submitted) return;
-    setAssignments((prev) => {
-      const next = { ...prev };
-      delete next[itemId];
-      return next;
-    });
+    if (!entityHasAssignments) {
+      setLocalAssignments((prev) => {
+        const next = { ...prev };
+        delete next[itemId];
+        return next;
+      });
+    }
   };
   const handleSubmit = useCallback(() => {
-    setSubmitted(true);
-    setAttempts((a) => a + 1);
-    const correct = items.every((item) => assignments[item.id] === item.correctCategory);
-    if (correct) {
-      emit(`UI:${completeEvent}`, { success: true, attempts: attempts + 1 });
+    if (checkEvent) {
+      emit(`UI:${checkEvent}`, {});
+    }
+    if (!entityDrivesResult) {
+      setLocalSubmitted(true);
+      setLocalAttempts((a) => a + 1);
+      const correct = items.every((item) => assignments[item.id] === item.correctCategory);
+      if (correct) {
+        emit(`UI:${completeEvent}`, { success: true, attempts: attempts + 1 });
+      }
     }
-  }, [items, assignments, attempts, completeEvent, emit]);
+  }, [checkEvent, entityDrivesResult, items, assignments, attempts, completeEvent, emit]);
   const handleReset = () => {
-    setSubmitted(false);
+    if (!entityDrivesResult) setLocalSubmitted(false);
     if (attempts >= 2 && str(resolved?.hint)) {
       setShowHint(true);
     }
   };
   const handleFullReset = () => {
-    setAssignments({});
-    setSubmitted(false);
-    setAttempts(0);
+    if (playAgainEvent) {
+      emit(`UI:${playAgainEvent}`, {});
+    }
+    setLocalAssignments({});
+    setLocalSubmitted(false);
+    setLocalAttempts(0);
     setShowHint(false);
   };
   if (!resolved) return null;
@@ -23276,7 +23332,7 @@ var init_FormSection = __esm({
     FormActions.displayName = "FormActions";
   }
 });
-var ALL_CATEGORY, GridPicker;
+var ALL_CATEGORY, MAX_RENDERED, GridPicker;
 var init_GridPicker = __esm({
   "components/core/molecules/GridPicker.tsx"() {
     "use client";
@@ -23285,6 +23341,7 @@ var init_GridPicker = __esm({
     init_Badge();
     init_Stack();
     ALL_CATEGORY = "__all__";
+    MAX_RENDERED = 300;
     GridPicker = ({
       items,
       value,
@@ -23314,6 +23371,8 @@ var init_GridPicker = __esm({
           return matchesCategory && matchesSearch;
         });
       }, [items, search, activeCategory]);
+      const visible = useMemo(() => filtered.slice(0, MAX_RENDERED), [filtered]);
+      const truncated = filtered.length - visible.length;
       const select = useCallback(
         (item) => {
           onChange(item.id);
@@ -23415,7 +23474,7 @@ var init_GridPicker = __esm({
             style: {
               gridTemplateColumns: `repeat(auto-fill, minmax(${cellSize}px, 1fr))`
             },
-            children: filtered.map((item, index) => {
+            children: visible.map((item, index) => {
               const selected = item.id === value;
               return /* @__PURE__ */ jsx(
                 "button",
@@ -23442,7 +23501,8 @@ var init_GridPicker = __esm({
               );
             })
           }
-        )
+        ),
+        truncated > 0 && /* @__PURE__ */ jsx("div", { className: "px-1 text-xs text-muted-foreground", children: `+${truncated} more \u2014 refine your search` })
       ] });
     };
     GridPicker.displayName = "GridPicker";
@@ -29163,13 +29223,13 @@ var init_MapView = __esm({
         shadowSize: [41, 41]
       });
       L.Marker.prototype.options.icon = defaultIcon;
-      const { useEffect: useEffect72, useRef: useRef69, useCallback: useCallback115, useState: useState105 } = React77__default;
+      const { useEffect: useEffect73, useRef: useRef70, useCallback: useCallback113, 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 }) {
         const map = useMap();
-        const prevRef = useRef69({ centerLat, centerLng, zoom });
-        useEffect72(() => {
+        const prevRef = useRef70({ centerLat, centerLng, zoom });
+        useEffect73(() => {
           const prev = prevRef.current;
           if (prev.centerLat !== centerLat || prev.centerLng !== centerLng || prev.zoom !== zoom) {
             map.setView([centerLat, centerLng], zoom);
@@ -29180,7 +29240,7 @@ var init_MapView = __esm({
       }
       function MapClickHandler({ onMapClick }) {
         const map = useMap();
-        useEffect72(() => {
+        useEffect73(() => {
           if (!onMapClick) return;
           const handler = (e) => {
             onMapClick(e.latlng.lat, e.latlng.lng);
@@ -29209,7 +29269,7 @@ var init_MapView = __esm({
       }) {
         const eventBus = useEventBus2();
         const [clickedPosition, setClickedPosition] = useState105(null);
-        const handleMapClick = useCallback115((lat, lng) => {
+        const handleMapClick = useCallback113((lat, lng) => {
           if (showClickedPin) {
             setClickedPosition({ lat, lng });
           }
@@ -29218,7 +29278,7 @@ var init_MapView = __esm({
             eventBus.emit(`UI:${mapClickEvent}`, { latitude: lat, longitude: lng });
           }
         }, [onMapClick, mapClickEvent, eventBus, showClickedPin]);
-        const handleMarkerClick = useCallback115((marker) => {
+        const handleMarkerClick = useCallback113((marker) => {
           onMarkerClick?.(marker);
           if (markerClickEvent) {
             eventBus.emit(`UI:${markerClickEvent}`, { ...marker });
@@ -38652,51 +38712,52 @@ var init_DataTable = __esm({
 function DebuggerBoard({
   entity,
   completeEvent = "PUZZLE_COMPLETE",
+  toggleFlagEvent,
+  checkEvent,
+  playAgainEvent,
   className
 }) {
   const { emit } = useEventBus();
   const { t } = useTranslate();
   const resolved = boardEntity(entity);
-  const [flaggedLines, setFlaggedLines] = useState(/* @__PURE__ */ new Set());
   const [headerError, setHeaderError] = useState(false);
-  const [submitted, setSubmitted] = useState(false);
-  const [attempts, setAttempts] = useState(0);
   const [showHint, setShowHint] = useState(false);
+  const lines = Array.isArray(resolved?.lines) ? resolved.lines : [];
+  const result = resolved?.result ?? null;
+  const attempts = num(resolved?.attempts);
+  const submitted = result != null;
+  const bugLines = lines.filter((l) => l.isBug);
+  const flaggedLines = lines.filter((l) => l.isFlagged);
+  const correctFlags = lines.filter((l) => l.isBug && l.isFlagged);
+  const falseFlags = lines.filter((l) => !l.isBug && l.isFlagged);
+  const allCorrect = result === "win";
   const toggleLine = (lineId) => {
     if (submitted) return;
-    setFlaggedLines((prev) => {
-      const next = new Set(prev);
-      if (next.has(lineId)) {
-        next.delete(lineId);
-      } else {
-        next.add(lineId);
-      }
-      return next;
-    });
+    if (toggleFlagEvent) {
+      emit(`UI:${toggleFlagEvent}`, { lineId });
+    }
   };
-  const lines = Array.isArray(resolved?.lines) ? resolved.lines : [];
-  const bugLines = lines.filter((l) => l.isBug);
-  const correctFlags = lines.filter((l) => l.isBug && flaggedLines.has(l.id));
-  const falseFlags = lines.filter((l) => !l.isBug && flaggedLines.has(l.id));
-  const allCorrect = submitted && correctFlags.length === bugLines.length && falseFlags.length === 0;
   const handleSubmit = useCallback(() => {
-    setSubmitted(true);
-    setAttempts((a) => a + 1);
+    if (checkEvent) {
+      emit(`UI:${checkEvent}`, {});
+    }
     const correct = correctFlags.length === bugLines.length && falseFlags.length === 0;
     if (correct) {
       emit(`UI:${completeEvent}`, { success: true, attempts: attempts + 1 });
     }
-  }, [correctFlags.length, bugLines.length, falseFlags.length, attempts, completeEvent, emit]);
+  }, [checkEvent, correctFlags.length, bugLines.length, falseFlags.length, attempts, completeEvent, emit]);
   const handleReset = () => {
-    setSubmitted(false);
+    if (playAgainEvent) {
+      emit(`UI:${playAgainEvent}`, {});
+    }
     if (attempts >= 2 && str(resolved?.hint)) {
       setShowHint(true);
     }
   };
   const handleFullReset = () => {
-    setFlaggedLines(/* @__PURE__ */ new Set());
-    setSubmitted(false);
-    setAttempts(0);
+    if (playAgainEvent) {
+      emit(`UI:${playAgainEvent}`, {});
+    }
     setShowHint(false);
   };
   if (!resolved) return null;
@@ -38724,7 +38785,7 @@ function DebuggerBoard({
           /* @__PURE__ */ jsx(Typography, { variant: "caption", className: "text-muted-foreground", children: t("debugger.findBugs", { count: String(num(resolved.bugCount)) }) })
         ] }) }),
         /* @__PURE__ */ jsx(Card, { className: "p-0 overflow-hidden", children: /* @__PURE__ */ jsx(VStack, { gap: "none", children: lines.map((line, i) => {
-          const isFlagged = flaggedLines.has(line.id);
+          const isFlagged = !!line.isFlagged;
           let lineStyle = "";
           if (submitted) {
             if (line.isBug && isFlagged) lineStyle = "bg-success/10";
@@ -38758,9 +38819,9 @@ function DebuggerBoard({
             /* @__PURE__ */ jsx(
               Icon,
               {
-                icon: flaggedLines.has(line.id) ? CheckCircle : XCircle,
+                icon: line.isFlagged ? CheckCircle : XCircle,
                 size: "xs",
-                className: flaggedLines.has(line.id) ? "text-success mt-0.5" : "text-warning mt-0.5"
+                className: line.isFlagged ? "text-success mt-0.5" : "text-warning mt-0.5"
               }
             ),
             /* @__PURE__ */ jsxs(VStack, { gap: "none", children: [
@@ -38771,7 +38832,7 @@ function DebuggerBoard({
         ] }) }),
         showHint && hint && /* @__PURE__ */ jsx(Card, { className: "p-4 border-l-4 border-l-warning", children: /* @__PURE__ */ jsx(Typography, { variant: "body", children: hint }) }),
         /* @__PURE__ */ jsxs(HStack, { gap: "sm", justify: "center", children: [
-          !submitted ? /* @__PURE__ */ jsxs(Button, { variant: "primary", onClick: handleSubmit, disabled: flaggedLines.size === 0, children: [
+          !submitted ? /* @__PURE__ */ jsxs(Button, { variant: "primary", onClick: handleSubmit, disabled: flaggedLines.length === 0, children: [
             /* @__PURE__ */ jsx(Icon, { icon: Send, size: "sm" }),
             t("debugger.submit")
           ] }) : !allCorrect ? /* @__PURE__ */ jsx(Button, { variant: "primary", onClick: handleReset, children: t("debugger.tryAgain") }) : null,
@@ -42731,6 +42792,9 @@ function getOpponentAction(strategy, actions, history) {
 function NegotiatorBoard({
   entity,
   completeEvent = "PUZZLE_COMPLETE",
+  playRoundEvent,
+  finishEvent,
+  playAgainEvent,
   className
 }) {
   const { emit } = useEventBus();
@@ -42739,13 +42803,14 @@ function NegotiatorBoard({
   const [history, setHistory] = useState([]);
   const [headerError, setHeaderError] = useState(false);
   const [showHint, setShowHint] = useState(false);
-  const totalRounds = num(resolved?.totalRounds);
+  const totalRounds = num(resolved?.maxRounds);
   const targetScore = num(resolved?.targetScore);
-  const currentRound = history.length;
-  const isComplete = currentRound >= totalRounds;
-  const playerTotal = history.reduce((s, r) => s + r.playerPayoff, 0);
+  const currentRound = num(resolved?.round);
+  const result = str(resolved?.result) || "none";
+  const playerTotal = num(resolved?.score);
+  const isComplete = result !== "none" || totalRounds > 0 && currentRound >= totalRounds;
+  const won = result === "win";
   const opponentTotal = history.reduce((s, r) => s + r.opponentPayoff, 0);
-  const won = isComplete && playerTotal >= targetScore;
   const actions = Array.isArray(resolved?.actions) ? resolved.actions : [];
   const payoffMatrix = Array.isArray(resolved?.payoffMatrix) ? resolved.payoffMatrix : [];
   const handleAction = useCallback((actionId) => {
@@ -42754,29 +42819,45 @@ function NegotiatorBoard({
     const payoff = payoffMatrix.find(
       (p2) => p2.playerAction === actionId && p2.opponentAction === opponentAction
     );
-    const result = {
-      round: currentRound + 1,
-      playerAction: actionId,
-      opponentAction,
-      playerPayoff: payoff?.playerPayoff ?? 0,
-      opponentPayoff: payoff?.opponentPayoff ?? 0
-    };
-    const newHistory = [...history, result];
-    setHistory(newHistory);
-    if (newHistory.length >= totalRounds) {
-      const total = newHistory.reduce((s, r) => s + r.playerPayoff, 0);
-      if (total >= targetScore) {
-        emit(`UI:${completeEvent}`, { success: true, score: total });
-      }
-      if (newHistory.length >= 3 && str(resolved?.hint)) {
+    const playerPayoff = payoff?.playerPayoff ?? 0;
+    setHistory((prev) => [
+      ...prev,
+      {
+        round: prev.length + 1,
+        playerAction: actionId,
+        opponentAction,
+        playerPayoff,
+        opponentPayoff: payoff?.opponentPayoff ?? 0
+      }
+    ]);
+    if (playRoundEvent) {
+      emit(`UI:${playRoundEvent}`, { playerAction: actionId, payoff: playerPayoff });
+    }
+    if (totalRounds > 0 && currentRound + 1 >= totalRounds) {
+      if (finishEvent) {
+        emit(`UI:${finishEvent}`, {});
+      }
+      if (str(resolved?.hint)) {
         setShowHint(true);
       }
     }
-  }, [isComplete, resolved, totalRounds, targetScore, actions, payoffMatrix, history, currentRound, completeEvent, emit]);
-  const handleReset = () => {
+  }, [isComplete, resolved, totalRounds, currentRound, actions, payoffMatrix, history, playRoundEvent, finishEvent, emit]);
+  const handleReset = useCallback(() => {
     setHistory([]);
     setShowHint(false);
-  };
+    if (playAgainEvent) {
+      emit(`UI:${playAgainEvent}`, {});
+    }
+  }, [playAgainEvent, emit]);
+  const completedRef = useRef(false);
+  useEffect(() => {
+    if (result === "win" && !completedRef.current) {
+      completedRef.current = true;
+      emit(`UI:${completeEvent}`, { success: true, score: playerTotal });
+    } else if (result === "none") {
+      completedRef.current = false;
+    }
+  }, [result, playerTotal, completeEvent, emit]);
   const getActionLabel = (id) => actions.find((a) => a.id === id)?.label ?? id;
   if (!resolved) return null;
   const theme = resolved.theme ?? void 0;
@@ -45777,67 +45858,47 @@ var init_SimulationGraph = __esm({
 function SimulatorBoard({
   entity,
   completeEvent = "PUZZLE_COMPLETE",
+  setAEvent,
+  setBEvent,
+  checkEvent,
+  playAgainEvent,
   className
 }) {
   const { emit } = useEventBus();
   const { t } = useTranslate();
   const resolved = boardEntity(entity);
   const parameters = Array.isArray(resolved?.parameters) ? resolved.parameters : [];
-  const [values, setValues] = useState(() => {
-    const init = {};
-    for (const p2 of parameters) {
-      init[p2.id] = p2.initial;
-    }
-    return init;
-  });
   const [headerError, setHeaderError] = useState(false);
-  const [submitted, setSubmitted] = useState(false);
-  const [attempts, setAttempts] = useState(0);
-  const [showHint, setShowHint] = useState(false);
-  const computeOutput = useCallback((params) => {
-    try {
-      const fn = new Function("params", `return (${str(resolved?.computeExpression)})`);
-      return fn(params);
-    } catch {
-      return 0;
-    }
-  }, [resolved?.computeExpression]);
-  const output = useMemo(() => computeOutput(values) ?? 0, [computeOutput, values]);
-  const targetValue = num(resolved?.targetValue);
-  const targetTolerance = num(resolved?.targetTolerance);
-  const isCorrect = Math.abs(output - targetValue) <= targetTolerance;
-  const handleParameterChange = (id, value) => {
-    if (submitted) return;
-    setValues((prev) => ({ ...prev, [id]: value }));
-  };
-  const handleSubmit = () => {
-    setSubmitted(true);
-    setAttempts((a) => a + 1);
-    if (isCorrect) {
-      emit(`UI:${completeEvent}`, { success: true, attempts: attempts + 1 });
-    }
+  if (!resolved) return null;
+  const paramA = num(resolved.paramA);
+  const paramB = num(resolved.paramB);
+  const output = num(resolved.output);
+  const targetValue = num(resolved.target);
+  const targetTolerance = num(resolved.tolerance);
+  const attempts = num(resolved.attempts);
+  const result = str(resolved.result);
+  const isWin = result === "win";
+  const isComplete = result !== "none" && result !== "";
+  const paramAValue = parameters[0];
+  const paramBValue = parameters[1];
+  const sliderValues = [paramA, paramB];
+  const sliderEvents = [setAEvent, setBEvent];
+  const handleParameterChange = (index, value) => {
+    if (isComplete) return;
+    const ev = sliderEvents[index];
+    if (ev) emit(`UI:${ev}`, { value });
   };
-  const handleReset = () => {
-    setSubmitted(false);
-    if (attempts >= 2 && str(resolved?.hint)) {
-      setShowHint(true);
-    }
+  const handleCheck = () => {
+    if (checkEvent) emit(`UI:${checkEvent}`, {});
   };
-  const handleFullReset = () => {
-    const init = {};
-    for (const p2 of parameters) {
-      init[p2.id] = p2.initial;
-    }
-    setValues(init);
-    setSubmitted(false);
-    setAttempts(0);
-    setShowHint(false);
+  const handlePlayAgain = () => {
+    if (playAgainEvent) emit(`UI:${playAgainEvent}`, {});
   };
-  if (!resolved) return null;
   const theme = resolved.theme ?? void 0;
   const themeBackground = theme?.background;
   const headerImage = str(resolved.headerImage);
   const hint = str(resolved.hint);
+  const showHint = isComplete && !isWin && attempts >= 2 && Boolean(hint);
   const outputLabel = str(resolved.outputLabel);
   const outputUnit = str(resolved.outputUnit);
   return /* @__PURE__ */ jsx(
@@ -45857,41 +45918,43 @@ function SimulatorBoard({
         ] }) }),
         /* @__PURE__ */ jsx(Card, { className: "p-4", children: /* @__PURE__ */ jsxs(VStack, { gap: "md", children: [
           /* @__PURE__ */ jsx(Typography, { variant: "small", weight: "bold", className: "uppercase tracking-wider text-muted-foreground", children: t("simulator.parameters") }),
-          parameters.map((param) => /* @__PURE__ */ jsxs(VStack, { gap: "xs", children: [
-            /* @__PURE__ */ jsxs(HStack, { justify: "between", align: "center", children: [
-              /* @__PURE__ */ jsx(Typography, { variant: "body", weight: "medium", children: param.label }),
-              /* @__PURE__ */ jsxs(Badge, { size: "sm", children: [
-                values[param.id],
-                " ",
-                param.unit
-              ] })
-            ] }),
-            /* @__PURE__ */ jsx(
-              "input",
-              {
-                type: "range",
-                min: param.min,
-                max: param.max,
-                step: param.step,
-                value: values[param.id],
-                onChange: (e) => handleParameterChange(param.id, Number(e.target.value)),
-                disabled: submitted,
-                className: "w-full accent-foreground"
-              }
-            ),
-            /* @__PURE__ */ jsxs(HStack, { justify: "between", children: [
-              /* @__PURE__ */ jsxs(Typography, { variant: "caption", className: "text-muted-foreground", children: [
-                param.min,
-                " ",
-                param.unit
+          [paramAValue, paramBValue].map(
+            (param, index) => param ? /* @__PURE__ */ jsxs(VStack, { gap: "xs", children: [
+              /* @__PURE__ */ jsxs(HStack, { justify: "between", align: "center", children: [
+                /* @__PURE__ */ jsx(Typography, { variant: "body", weight: "medium", children: param.label }),
+                /* @__PURE__ */ jsxs(Badge, { size: "sm", children: [
+                  sliderValues[index],
+                  " ",
+                  param.unit
+                ] })
               ] }),
-              /* @__PURE__ */ jsxs(Typography, { variant: "caption", className: "text-muted-foreground", children: [
-                param.max,
-                " ",
-                param.unit
+              /* @__PURE__ */ jsx(
+                "input",
+                {
+                  type: "range",
+                  min: param.min,
+                  max: param.max,
+                  step: param.step,
+                  value: sliderValues[index],
+                  onChange: (e) => handleParameterChange(index, Number(e.target.value)),
+                  disabled: isComplete,
+                  className: "w-full accent-foreground"
+                }
+              ),
+              /* @__PURE__ */ jsxs(HStack, { justify: "between", children: [
+                /* @__PURE__ */ jsxs(Typography, { variant: "caption", className: "text-muted-foreground", children: [
+                  param.min,
+                  " ",
+                  param.unit
+                ] }),
+                /* @__PURE__ */ jsxs(Typography, { variant: "caption", className: "text-muted-foreground", children: [
+                  param.max,
+                  " ",
+                  param.unit
+                ] })
               ] })
-            ] })
-          ] }, param.id))
+            ] }, param.id ?? index) : null
+          )
         ] }) }),
         /* @__PURE__ */ jsx(Card, { className: "p-4", children: /* @__PURE__ */ jsxs(VStack, { gap: "sm", align: "center", children: [
           /* @__PURE__ */ jsx(Typography, { variant: "small", weight: "bold", className: "uppercase tracking-wider text-muted-foreground", children: outputLabel }),
@@ -45900,9 +45963,9 @@ function SimulatorBoard({
             " ",
             outputUnit
           ] }),
-          submitted && /* @__PURE__ */ jsxs(HStack, { gap: "xs", align: "center", children: [
-            /* @__PURE__ */ jsx(Icon, { icon: isCorrect ? CheckCircle : XCircle, size: "sm", className: isCorrect ? "text-success" : "text-error" }),
-            /* @__PURE__ */ jsx(Typography, { variant: "body", className: isCorrect ? "text-success" : "text-error", children: isCorrect ? str(resolved.successMessage) || t("simulator.correct") : str(resolved.failMessage) || t("simulator.incorrect") })
+          isComplete && /* @__PURE__ */ jsxs(HStack, { gap: "xs", align: "center", children: [
+            /* @__PURE__ */ jsx(Icon, { icon: isWin ? CheckCircle : XCircle, size: "sm", className: isWin ? "text-success" : "text-error" }),
+            /* @__PURE__ */ jsx(Typography, { variant: "body", className: isWin ? "text-success" : "text-error", children: isWin ? str(resolved.successMessage) || t("simulator.correct") : str(resolved.failMessage) || t("simulator.incorrect") })
           ] }),
           /* @__PURE__ */ jsxs(Typography, { variant: "caption", className: "text-muted-foreground", children: [
             t("simulator.target"),
@@ -45917,11 +45980,11 @@ function SimulatorBoard({
         ] }) }),
         showHint && hint && /* @__PURE__ */ jsx(Card, { className: "p-4 border-l-4 border-l-warning", children: /* @__PURE__ */ jsx(Typography, { variant: "body", children: hint }) }),
         /* @__PURE__ */ jsxs(HStack, { gap: "sm", justify: "center", children: [
-          !submitted ? /* @__PURE__ */ jsxs(Button, { variant: "primary", onClick: handleSubmit, children: [
+          !isComplete ? /* @__PURE__ */ jsxs(Button, { variant: "primary", onClick: handleCheck, children: [
             /* @__PURE__ */ jsx(Icon, { icon: Play, size: "sm" }),
             t("simulator.simulate")
-          ] }) : !isCorrect ? /* @__PURE__ */ jsx(Button, { variant: "primary", onClick: handleReset, children: t("simulator.tryAgain") }) : null,
-          /* @__PURE__ */ jsxs(Button, { variant: "secondary", onClick: handleFullReset, children: [
+          ] }) : null,
+          /* @__PURE__ */ jsxs(Button, { variant: "secondary", onClick: handlePlayAgain, children: [
             /* @__PURE__ */ jsx(Icon, { icon: RotateCcw, size: "sm" }),
             t("simulator.reset")
           ] })