@almadar/ui 2.26.0 → 2.27.1

package/dist/components/index.js

@@ -1,5 +1,5 @@
-import * as React88 from 'react';
-import React88__default, { useCallback, createContext, useState, useRef, useLayoutEffect, useEffect, lazy, useContext, useMemo, useId, Suspense, useSyncExternalStore } from 'react';
+import * as React90 from 'react';
+import React90__default, { useCallback, createContext, useState, useRef, useEffect, useLayoutEffect, lazy, useContext, useMemo, useId, Suspense, useSyncExternalStore } from 'react';
 import { clsx } from 'clsx';
 import { twMerge } from 'tailwind-merge';
 import * as LucideIcons from 'lucide-react';
@@ -268,7 +268,7 @@ function resolveIconProp(value, sizeClass) {
     const IconComp = value;
     return /* @__PURE__ */ jsx(IconComp, { className: sizeClass });
   }
-  if (React88__default.isValidElement(value)) {
+  if (React90__default.isValidElement(value)) {
     return value;
   }
   if (typeof value === "object" && value !== null && "render" in value) {
@@ -277,7 +277,7 @@ function resolveIconProp(value, sizeClass) {
   }
   return value;
 }
-var Button = React88__default.forwardRef(
+var Button = React90__default.forwardRef(
   ({
     className,
     variant = "primary",
@@ -336,7 +336,7 @@ var Button = React88__default.forwardRef(
   }
 );
 Button.displayName = "Button";
-var Input = React88__default.forwardRef(
+var Input = React90__default.forwardRef(
   ({
     className,
     inputType,
@@ -448,7 +448,7 @@ var Input = React88__default.forwardRef(
   }
 );
 Input.displayName = "Input";
-var Label = React88__default.forwardRef(
+var Label = React90__default.forwardRef(
   ({ className, required, children, ...props }, ref) => {
     return /* @__PURE__ */ jsxs(
       "label",
@@ -468,7 +468,7 @@ var Label = React88__default.forwardRef(
   }
 );
 Label.displayName = "Label";
-var Textarea = React88__default.forwardRef(
+var Textarea = React90__default.forwardRef(
   ({ className, error, ...props }, ref) => {
     return /* @__PURE__ */ jsx(
       "textarea",
@@ -491,7 +491,7 @@ var Textarea = React88__default.forwardRef(
   }
 );
 Textarea.displayName = "Textarea";
-var Select = React88__default.forwardRef(
+var Select = React90__default.forwardRef(
   ({ className, options, placeholder, error, ...props }, ref) => {
     return /* @__PURE__ */ jsxs("div", { className: "relative", children: [
       /* @__PURE__ */ jsxs(
@@ -527,7 +527,7 @@ var Select = React88__default.forwardRef(
   }
 );
 Select.displayName = "Select";
-var Checkbox = React88__default.forwardRef(
+var Checkbox = React90__default.forwardRef(
   ({ className, label, id, ...props }, ref) => {
     const inputId = id || `checkbox-${Math.random().toString(36).substr(2, 9)}`;
     return /* @__PURE__ */ jsxs("div", { className: "flex items-center", children: [
@@ -603,7 +603,7 @@ var shadowStyles = {
   md: "shadow",
   lg: "shadow-lg"
 };
-var Card = React88__default.forwardRef(
+var Card = React90__default.forwardRef(
   ({
     className,
     variant = "bordered",
@@ -639,9 +639,9 @@ var Card = React88__default.forwardRef(
   }
 );
 Card.displayName = "Card";
-var CardHeader = React88__default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: cn("mb-4", className), ...props }));
+var CardHeader = React90__default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: cn("mb-4", className), ...props }));
 CardHeader.displayName = "CardHeader";
-var CardTitle = React88__default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+var CardTitle = React90__default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
   "h3",
   {
     ref,
@@ -654,11 +654,11 @@ var CardTitle = React88__default.forwardRef(({ className, ...props }, ref) => /*
   }
 ));
 CardTitle.displayName = "CardTitle";
-var CardContent = React88__default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: cn("", className), ...props }));
+var CardContent = React90__default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: cn("", className), ...props }));
 CardContent.displayName = "CardContent";
 var CardBody = CardContent;
 CardBody.displayName = "CardBody";
-var CardFooter = React88__default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+var CardFooter = React90__default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
   "div",
   {
     ref,
@@ -704,7 +704,7 @@ var sizeStyles2 = {
   md: "px-2.5 py-1 text-sm",
   lg: "px-3 py-1.5 text-base"
 };
-var Badge = React88__default.forwardRef(
+var Badge = React90__default.forwardRef(
   ({ className, variant = "default", size = "sm", amount, label, icon, children, ...props }, ref) => {
     const iconSizes2 = { sm: "w-3 h-3", md: "w-3.5 h-3.5", lg: "w-4 h-4" };
     const resolvedIcon = typeof icon === "string" ? (() => {
@@ -737,7 +737,7 @@ var sizeStyles3 = {
   md: "h-6 w-6",
   lg: "h-8 w-8"
 };
-var Spinner = React88__default.forwardRef(
+var Spinner = React90__default.forwardRef(
   ({ className, size = "md", ...props }, ref) => {
     return /* @__PURE__ */ jsx(
       "div",
@@ -1002,7 +1002,7 @@ var positionStyles = {
   fixed: "fixed",
   sticky: "sticky"
 };
-var Box = React88__default.forwardRef(
+var Box = React90__default.forwardRef(
   ({
     padding,
     paddingX,
@@ -1349,7 +1349,7 @@ var ProgressBar = ({
   return null;
 };
 ProgressBar.displayName = "ProgressBar";
-var Radio = React88__default.forwardRef(
+var Radio = React90__default.forwardRef(
   ({
     label,
     helperText,
@@ -1453,7 +1453,7 @@ var Radio = React88__default.forwardRef(
   }
 );
 Radio.displayName = "Radio";
-var Switch = React88.forwardRef(
+var Switch = React90.forwardRef(
   ({
     checked,
     defaultChecked = false,
@@ -1464,10 +1464,10 @@ var Switch = React88.forwardRef(
     name,
     className
   }, ref) => {
-    const [isChecked, setIsChecked] = React88.useState(
+    const [isChecked, setIsChecked] = React90.useState(
       checked !== void 0 ? checked : defaultChecked
     );
-    React88.useEffect(() => {
+    React90.useEffect(() => {
       if (checked !== void 0) {
         setIsChecked(checked);
       }
@@ -2261,8 +2261,8 @@ var LawReferenceTooltip = ({
   position = "top",
   className
 }) => {
-  const [isVisible, setIsVisible] = React88__default.useState(false);
-  const timeoutRef = React88__default.useRef(null);
+  const [isVisible, setIsVisible] = React90__default.useState(false);
+  const timeoutRef = React90__default.useRef(null);
   const handleMouseEnter = () => {
     if (timeoutRef.current) clearTimeout(timeoutRef.current);
     timeoutRef.current = setTimeout(() => setIsVisible(true), 200);
@@ -2271,7 +2271,7 @@ var LawReferenceTooltip = ({
     if (timeoutRef.current) clearTimeout(timeoutRef.current);
     setIsVisible(false);
   };
-  React88__default.useEffect(() => {
+  React90__default.useEffect(() => {
     return () => {
       if (timeoutRef.current) clearTimeout(timeoutRef.current);
     };
@@ -2459,7 +2459,7 @@ var sizeStyles5 = {
   md: "w-2.5 h-2.5",
   lg: "w-3 h-3"
 };
-var StatusDot = React88__default.forwardRef(
+var StatusDot = React90__default.forwardRef(
   ({ className, status = "offline", pulse = false, size = "md", label, ...props }, ref) => {
     return /* @__PURE__ */ jsx(
       "span",
@@ -2506,7 +2506,7 @@ var iconMap = {
   down: TrendingDown,
   flat: ArrowRight
 };
-var TrendIndicator = React88__default.forwardRef(
+var TrendIndicator = React90__default.forwardRef(
   ({
     className,
     value,
@@ -2565,7 +2565,7 @@ var thumbSizes = {
   md: "w-4 h-4",
   lg: "w-5 h-5"
 };
-var RangeSlider = React88__default.forwardRef(
+var RangeSlider = React90__default.forwardRef(
   ({
     className,
     min = 0,
@@ -3097,7 +3097,7 @@ var paddingClasses = {
   md: "py-16",
   lg: "py-24"
 };
-var ContentSection = React88__default.forwardRef(
+var ContentSection = React90__default.forwardRef(
   ({ children, background = "default", padding = "lg", id, className }, ref) => {
     return /* @__PURE__ */ jsx(
       Box,
@@ -3598,6 +3598,289 @@ function getTileDimensions(variant, size) {
   }
   return { width: size, height: size };
 }
+var initialStyles = {
+  "fade-up": { opacity: 0, transform: "translateY(24px)" },
+  "fade-down": { opacity: 0, transform: "translateY(-24px)" },
+  "fade-in": { opacity: 0 },
+  "fade-left": { opacity: 0, transform: "translateX(24px)" },
+  "fade-right": { opacity: 0, transform: "translateX(-24px)" },
+  "scale": { opacity: 0, transform: "scale(0.92)" },
+  "scale-up": { opacity: 0, transform: "scale(0.92) translateY(16px)" },
+  "none": {}
+};
+var animatedStyles = {
+  "fade-up": { opacity: 1, transform: "translateY(0)" },
+  "fade-down": { opacity: 1, transform: "translateY(0)" },
+  "fade-in": { opacity: 1 },
+  "fade-left": { opacity: 1, transform: "translateX(0)" },
+  "fade-right": { opacity: 1, transform: "translateX(0)" },
+  "scale": { opacity: 1, transform: "scale(1)" },
+  "scale-up": { opacity: 1, transform: "scale(1) translateY(0)" },
+  "none": {}
+};
+var AnimatedReveal = React90__default.forwardRef(
+  ({
+    trigger = "scroll",
+    animation = "fade-up",
+    duration = 600,
+    delay = 0,
+    threshold = 0.15,
+    once = true,
+    animate: manualAnimate,
+    easing = "cubic-bezier(0.16, 1, 0.3, 1)",
+    children,
+    className,
+    style,
+    ...props
+  }, forwardedRef) => {
+    const [isAnimated, setIsAnimated] = useState(false);
+    const internalRef = useRef(null);
+    const hasAnimated = useRef(false);
+    const setRef = useCallback(
+      (node) => {
+        internalRef.current = node;
+        if (typeof forwardedRef === "function") forwardedRef(node);
+        else if (forwardedRef) forwardedRef.current = node;
+      },
+      [forwardedRef]
+    );
+    useEffect(() => {
+      if (trigger !== "scroll") return;
+      const el = internalRef.current;
+      if (!el) return;
+      const observer = new IntersectionObserver(
+        ([entry]) => {
+          if (entry.isIntersecting) {
+            if (once && hasAnimated.current) return;
+            hasAnimated.current = true;
+            setIsAnimated(true);
+          } else if (!once) {
+            setIsAnimated(false);
+          }
+        },
+        { threshold }
+      );
+      observer.observe(el);
+      return () => observer.disconnect();
+    }, [trigger, threshold, once]);
+    const handleMouseEnter = trigger === "hover" ? () => setIsAnimated(true) : void 0;
+    const handleMouseLeave = trigger === "hover" ? () => {
+      if (!once || !hasAnimated.current) {
+        hasAnimated.current = true;
+        setIsAnimated(false);
+      }
+    } : void 0;
+    useEffect(() => {
+      if (trigger === "manual" && manualAnimate !== void 0) {
+        setIsAnimated(manualAnimate);
+      }
+    }, [trigger, manualAnimate]);
+    const active = isAnimated;
+    const currentStyle = active ? animatedStyles[animation] : initialStyles[animation];
+    return /* @__PURE__ */ jsx(
+      "div",
+      {
+        ref: setRef,
+        className: cn("will-change-[opacity,transform]", className),
+        style: {
+          ...currentStyle,
+          transitionProperty: "opacity, transform",
+          transitionDuration: `${duration}ms`,
+          transitionDelay: `${delay}ms`,
+          transitionTimingFunction: easing,
+          ...style
+        },
+        onMouseEnter: handleMouseEnter,
+        onMouseLeave: handleMouseLeave,
+        ...props,
+        children: typeof children === "function" ? children(active) : children
+      }
+    );
+  }
+);
+AnimatedReveal.displayName = "AnimatedReveal";
+function useFetchedSvg(src) {
+  const [svg, setSvg] = useState(null);
+  const cache = useRef({});
+  useEffect(() => {
+    if (!src) {
+      setSvg(null);
+      return;
+    }
+    if (cache.current[src]) {
+      setSvg(cache.current[src]);
+      return;
+    }
+    let cancelled = false;
+    fetch(src).then((res) => {
+      if (!res.ok) throw new Error(`Failed to fetch SVG: ${res.status}`);
+      return res.text();
+    }).then((text) => {
+      if (cancelled) return;
+      cache.current[src] = text;
+      setSvg(text);
+    }).catch(() => {
+      if (!cancelled) setSvg(null);
+    });
+    return () => {
+      cancelled = true;
+    };
+  }, [src]);
+  return svg;
+}
+function applyDrawAnimation(container, animate, duration, delay, easing) {
+  const paths = container.querySelectorAll("path, line, polyline, polygon, circle, ellipse, rect");
+  paths.forEach((el) => {
+    if ("getTotalLength" in el && typeof el.getTotalLength === "function") {
+      const len = el.getTotalLength();
+      el.style.strokeDasharray = `${len}`;
+      el.style.strokeDashoffset = animate ? "0" : `${len}`;
+      el.style.transition = `stroke-dashoffset ${duration}ms ${easing} ${delay}ms`;
+    }
+  });
+}
+function applyFillAnimation(container, animate, duration, delay, easing, fillColor) {
+  const paths = container.querySelectorAll("path, circle, ellipse, rect, polygon");
+  paths.forEach((el) => {
+    if ("getTotalLength" in el && typeof el.getTotalLength === "function") {
+      const geom = el;
+      const len = geom.getTotalLength();
+      geom.style.strokeDasharray = `${len}`;
+      geom.style.strokeDashoffset = animate ? "0" : `${len}`;
+      geom.style.transition = `stroke-dashoffset ${duration * 0.6}ms ${easing} ${delay}ms, fill-opacity ${duration * 0.4}ms ${easing} ${delay + duration * 0.6}ms`;
+    }
+    if (fillColor) el.style.fill = fillColor;
+    el.style.fillOpacity = animate ? "1" : "0";
+  });
+}
+function applyPulseAnimation(container, animate, duration) {
+  const svg = container.querySelector("svg");
+  if (!svg) return;
+  if (animate) {
+    svg.style.animation = `ag-pulse ${duration}ms ease-in-out infinite`;
+  } else {
+    svg.style.animation = "none";
+  }
+}
+function applyMorphAnimation(container, animate, duration, delay, easing) {
+  const paths = container.querySelectorAll("path, circle, ellipse, rect, polygon");
+  paths.forEach((el) => {
+    el.style.transition = `all ${duration}ms ${easing} ${delay}ms`;
+    el.style.transform = animate ? "scale(1)" : "scale(0)";
+    el.style.transformOrigin = "center";
+    el.style.opacity = animate ? "1" : "0";
+  });
+}
+var AnimatedGraphic = React90__default.forwardRef(
+  ({
+    src,
+    svgContent,
+    animation = "draw",
+    animate = false,
+    duration = 1200,
+    delay = 0,
+    easing = "cubic-bezier(0.16, 1, 0.3, 1)",
+    width,
+    height,
+    strokeColor,
+    fillColor,
+    alt,
+    className,
+    style,
+    children,
+    ...props
+  }, ref) => {
+    const containerRef = useRef(null);
+    const fetchedSvg = useFetchedSvg(svgContent ? void 0 : src);
+    const resolvedSvg = svgContent ?? fetchedSvg;
+    const prevAnimateRef = useRef(animate);
+    const setRef = React90__default.useCallback(
+      (node) => {
+        containerRef.current = node;
+        if (typeof ref === "function") ref(node);
+        else if (ref) ref.current = node;
+      },
+      [ref]
+    );
+    useEffect(() => {
+      const el = containerRef.current;
+      if (!el || !strokeColor) return;
+      const paths = el.querySelectorAll("path, line, polyline, polygon, circle, ellipse, rect");
+      paths.forEach((p2) => {
+        p2.style.stroke = strokeColor;
+      });
+    }, [resolvedSvg, strokeColor]);
+    useEffect(() => {
+      const el = containerRef.current;
+      if (!el || !resolvedSvg) return;
+      if (animation === "draw" || animation === "fill") {
+        const paths = el.querySelectorAll("path, line, polyline, polygon, circle, ellipse, rect");
+        paths.forEach((p2) => {
+          if ("getTotalLength" in p2 && typeof p2.getTotalLength === "function") {
+            const len = p2.getTotalLength();
+            p2.style.strokeDasharray = `${len}`;
+            p2.style.strokeDashoffset = `${len}`;
+          }
+          if (animation === "fill") {
+            p2.style.fillOpacity = "0";
+          }
+        });
+      }
+      if (animation === "morph") {
+        const paths = el.querySelectorAll("path, circle, ellipse, rect, polygon");
+        paths.forEach((p2) => {
+          p2.style.transform = "scale(0)";
+          p2.style.transformOrigin = "center";
+          p2.style.opacity = "0";
+        });
+      }
+    }, [resolvedSvg, animation]);
+    useEffect(() => {
+      const el = containerRef.current;
+      if (!el) return;
+      const id = requestAnimationFrame(() => {
+        switch (animation) {
+          case "draw":
+            applyDrawAnimation(el, animate, duration, delay, easing);
+            break;
+          case "fill":
+            applyFillAnimation(el, animate, duration, delay, easing, fillColor);
+            break;
+          case "pulse":
+            applyPulseAnimation(el, animate, duration);
+            break;
+          case "morph":
+            applyMorphAnimation(el, animate, duration, delay, easing);
+            break;
+        }
+      });
+      prevAnimateRef.current = animate;
+      return () => cancelAnimationFrame(id);
+    }, [animate, animation, duration, delay, easing, fillColor, resolvedSvg]);
+    return /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsx("style", { children: `@keyframes ag-pulse { 0%, 100% { transform: scale(1); opacity: 1; } 50% { transform: scale(1.04); opacity: 0.85; } }` }),
+      /* @__PURE__ */ jsx(
+        "div",
+        {
+          ref: setRef,
+          className: cn("inline-flex items-center justify-center", className),
+          style: { width, height, ...style },
+          role: alt ? "img" : void 0,
+          "aria-label": alt,
+          ...props,
+          children: resolvedSvg ? /* @__PURE__ */ jsx(
+            "div",
+            {
+              className: "w-full h-full [&>svg]:w-full [&>svg]:h-full",
+              dangerouslySetInnerHTML: { __html: resolvedSvg }
+            }
+          ) : children
+        }
+      )
+    ] });
+  }
+);
+AnimatedGraphic.displayName = "AnimatedGraphic";
 var heartIcon = (filled, size) => /* @__PURE__ */ jsx(
   "svg",
   {
@@ -3682,9 +3965,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] = React88.useState(resolvedValue);
-  const [isAnimating, setIsAnimating] = React88.useState(false);
-  React88.useEffect(() => {
+  const [displayValue, setDisplayValue] = React90.useState(resolvedValue);
+  const [isAnimating, setIsAnimating] = React90.useState(false);
+  React90.useEffect(() => {
     if (!animated || displayValue === resolvedValue) {
       setDisplayValue(resolvedValue);
       return;
@@ -3757,9 +4040,9 @@ function ControlButton({
   className
 }) {
   const eventBus = useEventBus();
-  const [isPressed, setIsPressed] = React88.useState(false);
+  const [isPressed, setIsPressed] = React90.useState(false);
   const actualPressed = pressed ?? isPressed;
-  const handlePointerDown = React88.useCallback(
+  const handlePointerDown = React90.useCallback(
     (e) => {
       e.preventDefault();
       if (disabled) return;
@@ -3769,7 +4052,7 @@ function ControlButton({
     },
     [disabled, pressEvent, eventBus, onPress]
   );
-  const handlePointerUp = React88.useCallback(
+  const handlePointerUp = React90.useCallback(
     (e) => {
       e.preventDefault();
       if (disabled) return;
@@ -3779,7 +4062,7 @@ function ControlButton({
     },
     [disabled, releaseEvent, eventBus, onRelease]
   );
-  const handlePointerLeave = React88.useCallback(
+  const handlePointerLeave = React90.useCallback(
     (e) => {
       if (isPressed) {
         setIsPressed(false);
@@ -4605,9 +4888,9 @@ function MiniMap({
   viewportRect,
   className
 }) {
-  const canvasRef = React88.useRef(null);
-  const frameRef = React88.useRef(0);
-  React88.useEffect(() => {
+  const canvasRef = React90.useRef(null);
+  const frameRef = React90.useRef(0);
+  React90.useEffect(() => {
     const canvas = canvasRef.current;
     if (!canvas) return;
     const ctx = canvas.getContext("2d");
@@ -4848,7 +5131,7 @@ var ErrorState = ({
   );
 };
 ErrorState.displayName = "ErrorState";
-var ErrorBoundary = class extends React88__default.Component {
+var ErrorBoundary = class extends React90__default.Component {
   constructor(props) {
     super(props);
     __publicField(this, "reset", () => {
@@ -6584,8 +6867,8 @@ var Menu = ({
     "bottom-start": "top-full left-0 mt-2",
     "bottom-end": "top-full right-0 mt-2"
   };
-  const triggerChild = React88__default.isValidElement(trigger) ? trigger : /* @__PURE__ */ jsx("span", { children: trigger });
-  const triggerElement = React88__default.cloneElement(
+  const triggerChild = React90__default.isValidElement(trigger) ? trigger : /* @__PURE__ */ jsx("span", { children: trigger });
+  const triggerElement = React90__default.cloneElement(
     triggerChild,
     {
       ref: triggerRef,
@@ -7090,8 +7373,8 @@ var Popover = ({
     onMouseEnter: handleOpen,
     onMouseLeave: handleClose
   };
-  const childElement = React88__default.isValidElement(children) ? children : /* @__PURE__ */ jsx("span", { children });
-  const triggerElement = React88__default.cloneElement(
+  const childElement = React90__default.isValidElement(children) ? children : /* @__PURE__ */ jsx("span", { children });
+  const triggerElement = React90__default.cloneElement(
     childElement,
     {
       ref: triggerRef,
@@ -7846,8 +8129,8 @@ var Tooltip = ({
       if (hideTimeoutRef.current) clearTimeout(hideTimeoutRef.current);
     };
   }, []);
-  const triggerElement = React88__default.isValidElement(children) ? children : /* @__PURE__ */ jsx("span", { children });
-  const trigger = React88__default.cloneElement(triggerElement, {
+  const triggerElement = React90__default.isValidElement(children) ? children : /* @__PURE__ */ jsx("span", { children });
+  const trigger = React90__default.cloneElement(triggerElement, {
     ref: triggerRef,
     onMouseEnter: handleMouseEnter,
     onMouseLeave: handleMouseLeave,
@@ -8096,7 +8379,7 @@ var WizardProgress = ({
       children: /* @__PURE__ */ jsx("div", { className: "flex items-center gap-2", children: steps.map((step, index) => {
         const isActive = index === currentStep;
         const isCompleted = index < currentStep;
-        return /* @__PURE__ */ jsxs(React88__default.Fragment, { children: [
+        return /* @__PURE__ */ jsxs(React90__default.Fragment, { children: [
           /* @__PURE__ */ jsx(
             "button",
             {
@@ -8226,7 +8509,7 @@ var WizardNavigation = ({
   );
 };
 WizardNavigation.displayName = "WizardNavigation";
-var MarkdownContent = React88__default.memo(
+var MarkdownContent = React90__default.memo(
   ({ content, direction, className }) => {
     const { t: _t } = useTranslate();
     const safeContent = typeof content === "string" ? content : String(content ?? "");
@@ -8328,7 +8611,7 @@ var MarkdownContent = React88__default.memo(
   (prev, next) => prev.content === next.content && prev.className === next.className && prev.direction === next.direction
 );
 MarkdownContent.displayName = "MarkdownContent";
-var CodeBlock = React88__default.memo(
+var CodeBlock = React90__default.memo(
   ({
     code: rawCode,
     language = "text",
@@ -9390,7 +9673,7 @@ var stateColors = {
 var ProgressDots = ({
   count,
   currentIndex,
-  getState,
+  getState: getState2,
   onDotClick,
   className,
   size = "md"
@@ -9402,7 +9685,7 @@ var ProgressDots = ({
     },
     [currentIndex]
   );
-  const resolveState = getState ?? defaultGetState;
+  const resolveState = getState2 ?? defaultGetState;
   const dims = sizeMap14[size];
   return /* @__PURE__ */ jsx(HStack, { gap: "xs", align: "center", className: cn(className), children: Array.from({ length: count }, (_, index) => {
     const state = resolveState(index);
@@ -9449,8 +9732,8 @@ function DPad({
 }) {
   const eventBus = useEventBus();
   const sizes = sizeMap15[size];
-  const [activeDirections, setActiveDirections] = React88.useState(/* @__PURE__ */ new Set());
-  const handlePress = React88.useCallback(
+  const [activeDirections, setActiveDirections] = React90.useState(/* @__PURE__ */ new Set());
+  const handlePress = React90.useCallback(
     (direction) => {
       setActiveDirections((prev) => new Set(prev).add(direction));
       if (directionEvent) eventBus.emit(`UI:${directionEvent}`, { direction, pressed: true });
@@ -9458,7 +9741,7 @@ function DPad({
     },
     [directionEvent, eventBus, onDirection]
   );
-  const handleRelease = React88.useCallback(
+  const handleRelease = React90.useCallback(
     (direction) => {
       setActiveDirections((prev) => {
         const next = new Set(prev);
@@ -9516,8 +9799,8 @@ function ActionButtons({
   disabled
 }) {
   const eventBus = useEventBus();
-  const [activeButtons, setActiveButtons] = React88.useState(/* @__PURE__ */ new Set());
-  const handlePress = React88.useCallback(
+  const [activeButtons, setActiveButtons] = React90.useState(/* @__PURE__ */ new Set());
+  const handlePress = React90.useCallback(
     (id) => {
       setActiveButtons((prev) => new Set(prev).add(id));
       if (actionEvent) eventBus.emit(`UI:${actionEvent}`, { id, pressed: true });
@@ -9525,7 +9808,7 @@ function ActionButtons({
     },
     [actionEvent, eventBus, onAction]
   );
-  const handleRelease = React88.useCallback(
+  const handleRelease = React90.useCallback(
     (id) => {
       setActiveButtons((prev) => {
         const next = new Set(prev);
@@ -9710,7 +9993,7 @@ function InventoryGrid({
   const eventBus = useEventBus();
   const slotCount = totalSlots ?? items.length;
   const emptySlotCount = Math.max(0, slotCount - items.length);
-  const handleSelect = React88.useCallback(
+  const handleSelect = React90.useCallback(
     (id) => {
       onSelect?.(id);
       if (selectEvent) {
@@ -9834,7 +10117,7 @@ function CraftingRecipe({
   className
 }) {
   const eventBus = useEventBus();
-  const handleCraft = React88.useCallback(() => {
+  const handleCraft = React90.useCallback(() => {
     onCraft?.();
     if (craftEvent) {
       eventBus.emit(craftEvent, { output: output.label });
@@ -9851,7 +10134,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(React88.Fragment, { children: [
+          return /* @__PURE__ */ jsxs(React90.Fragment, { children: [
             /* @__PURE__ */ jsx(Box, { className: "relative", children: /* @__PURE__ */ jsx(
               ItemSlot,
               {
@@ -9953,15 +10236,15 @@ function GameCanvas2D({
   fps = 60,
   className
 }) {
-  const canvasRef = React88.useRef(null);
-  const rafRef = React88.useRef(0);
-  const frameRef = React88.useRef(0);
-  const lastTimeRef = React88.useRef(0);
-  const onDrawRef = React88.useRef(onDraw);
+  const canvasRef = React90.useRef(null);
+  const rafRef = React90.useRef(0);
+  const frameRef = React90.useRef(0);
+  const lastTimeRef = React90.useRef(0);
+  const onDrawRef = React90.useRef(onDraw);
   onDrawRef.current = onDraw;
-  const onTickRef = React88.useRef(onTick);
+  const onTickRef = React90.useRef(onTick);
   onTickRef.current = onTick;
-  React88.useEffect(() => {
+  React90.useEffect(() => {
     const canvas = canvasRef.current;
     if (!canvas) return;
     const ctx = canvas.getContext("2d");
@@ -10214,7 +10497,7 @@ function TurnPanel({
   className
 }) {
   const eventBus = useEventBus();
-  const handleAction = React88.useCallback(
+  const handleAction = React90.useCallback(
     (event) => {
       if (event) {
         eventBus.emit(event, { turn: currentTurn, phase, activeTeam });
@@ -10339,7 +10622,7 @@ function UnitCommandBar({
   className
 }) {
   const eventBus = useEventBus();
-  const handleCommand = React88.useCallback(
+  const handleCommand = React90.useCallback(
     (event) => {
       if (event) {
         eventBus.emit(event, { unitId: selectedUnitId });
@@ -10878,7 +11161,7 @@ function GameMenu({
   } catch {
   }
   const eventBus = eventBusProp || eventBusFromHook;
-  const handleOptionClick = React88.useCallback(
+  const handleOptionClick = React90.useCallback(
     (option) => {
       if (option.event && eventBus) {
         eventBus.emit(`UI:${option.event}`, { option });
@@ -11001,7 +11284,7 @@ function GameOverScreen({
   } catch {
   }
   const eventBus = eventBusProp || eventBusFromHook;
-  const handleActionClick = React88.useCallback(
+  const handleActionClick = React90.useCallback(
     (action) => {
       if (action.event && eventBus) {
         eventBus.emit(`UI:${action.event}`, { action });
@@ -11084,17 +11367,30 @@ function GameOverScreen({
 GameOverScreen.displayName = "GameOverScreen";
 
 // lib/verificationRegistry.ts
-var checks = /* @__PURE__ */ new Map();
-var transitions = [];
-var listeners = /* @__PURE__ */ new Set();
+function getState() {
+  if (typeof window !== "undefined") {
+    const w = window;
+    if (!w.__verificationRegistryState) {
+      w.__verificationRegistryState = {
+        checks: /* @__PURE__ */ new Map(),
+        transitions: [],
+        bridgeHealth: null,
+        listeners: /* @__PURE__ */ new Set()
+      };
+    }
+    return w.__verificationRegistryState;
+  }
+  return { checks: /* @__PURE__ */ new Map(), transitions: [], bridgeHealth: null, listeners: /* @__PURE__ */ new Set() };
+}
 function getAllChecks() {
-  return Array.from(checks.values());
+  return Array.from(getState().checks.values());
 }
 function getTransitions() {
-  return [...transitions];
+  return [...getState().transitions];
 }
 function getBridgeHealth() {
-  return null;
+  const bh = getState().bridgeHealth;
+  return bh ? { ...bh } : null;
 }
 function getSummary() {
   const allChecks = getAllChecks();
@@ -11115,8 +11411,8 @@ function getSnapshot() {
   };
 }
 function subscribeToVerification(listener) {
-  listeners.add(listener);
-  return () => listeners.delete(listener);
+  getState().listeners.add(listener);
+  return () => getState().listeners.delete(listener);
 }
 function exposeOnWindow() {
   if (typeof window === "undefined") return;
@@ -11133,7 +11429,7 @@ function exposeOnWindow() {
 }
 function waitForTransition(event, timeoutMs = 1e4) {
   return new Promise((resolve) => {
-    const existing = transitions.find((t) => t.event === event);
+    const existing = getState().transitions.find((t) => t.event === event);
     if (existing) {
       resolve(existing);
       return;
@@ -11143,7 +11439,7 @@ function waitForTransition(event, timeoutMs = 1e4) {
       resolve(null);
     }, timeoutMs);
     const unsub = subscribeToVerification(() => {
-      const found = transitions.find((t) => t.event === event);
+      const found = getState().transitions.find((t) => t.event === event);
       if (found) {
         clearTimeout(timeout);
         unsub();
@@ -13804,7 +14100,7 @@ var DataList = ({
 }) => {
   const eventBus = useEventBus();
   const { t } = useTranslate();
-  const [visibleCount, setVisibleCount] = React88__default.useState(pageSize || Infinity);
+  const [visibleCount, setVisibleCount] = React90__default.useState(pageSize || Infinity);
   const fields = fieldsProp ?? columnsProp ?? [];
   const allData = Array.isArray(entity) ? entity : entity ? [entity] : [];
   const data = pageSize > 0 ? allData.slice(0, visibleCount) : allData;
@@ -13841,7 +14137,7 @@ var DataList = ({
     const items2 = data.map((item) => item);
     const groups2 = groupBy ? groupData(items2, groupBy) : [{ label: "", items: items2 }];
     const contentField = titleField?.name ?? fields[0]?.name ?? "";
-    return /* @__PURE__ */ jsx(VStack, { gap: "sm", className: cn("py-2", className), children: groups2.map((group, gi) => /* @__PURE__ */ jsxs(React88__default.Fragment, { children: [
+    return /* @__PURE__ */ jsx(VStack, { gap: "sm", className: cn("py-2", className), children: groups2.map((group, gi) => /* @__PURE__ */ jsxs(React90__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}`;
@@ -14044,7 +14340,7 @@ var DataList = ({
         className
       ),
       children: [
-        groups.map((group, gi) => /* @__PURE__ */ jsxs(React88__default.Fragment, { children: [
+        groups.map((group, gi) => /* @__PURE__ */ jsxs(React90__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)
@@ -15100,18 +15396,14 @@ var InstallBox = ({
     /* @__PURE__ */ jsx(
       Box,
       {
-        className: cn(
-          "bg-foreground",
-          "rounded-md",
-          "border-[length:var(--border-width)] border-border"
-        ),
+        className: "bg-surface rounded-md border-[length:var(--border-width)] border-border",
         padding: "md",
-        children: /* @__PURE__ */ jsxs(HStack, { gap: "md", align: "center", children: [
+        children: /* @__PURE__ */ jsxs(Box, { className: "flex items-center gap-3", children: [
           /* @__PURE__ */ jsx(
             Typography,
             {
               variant: "body2",
-              className: "font-mono flex-1 min-w-0 text-background select-all",
+              className: "font-mono flex-1 min-w-0 select-all",
               truncate: true,
               children: command
             }
@@ -15120,10 +15412,12 @@ var InstallBox = ({
             Button,
             {
               variant: "ghost",
-              size: "md",
+              size: "sm",
+              leftIcon: copied ? "check" : "copy",
               onClick: handleCopy,
-              className: "flex-shrink-0 text-background hover:text-background",
-              children: copied ? "Copied!" : "Copy"
+              className: "flex-shrink-0",
+              "aria-label": copied ? "Copied" : "Copy to clipboard",
+              children: copied ? "Copied" : "Copy"
             }
           )
         ] })
@@ -15778,7 +16072,7 @@ var StepFlow = ({
   className
 }) => {
   if (orientation === "vertical") {
-    return /* @__PURE__ */ jsx(VStack, { gap: "none", className: cn("w-full", className), children: steps.map((step, index) => /* @__PURE__ */ jsx(React88__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(React90__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" })
@@ -15789,7 +16083,7 @@ var StepFlow = ({
       ] })
     ] }) }, 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(React88__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(React90__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 }),
@@ -16956,7 +17250,7 @@ var StatCard = ({
   const labelToUse = propLabel ?? propTitle;
   const eventBus = useEventBus();
   const { t } = useTranslate();
-  const handleActionClick = React88__default.useCallback(() => {
+  const handleActionClick = React90__default.useCallback(() => {
     if (action?.event) {
       eventBus.emit(`UI:${action.event}`, {});
     }
@@ -16967,7 +17261,7 @@ var StatCard = ({
   const data = Array.isArray(entity) ? entity : entity ? [entity] : [];
   const isLoading = externalLoading ?? false;
   const error = externalError;
-  const computeMetricValue = React88__default.useCallback(
+  const computeMetricValue = React90__default.useCallback(
     (metric, items) => {
       if (metric.value !== void 0) {
         return metric.value;
@@ -17006,7 +17300,7 @@ var StatCard = ({
     },
     []
   );
-  const schemaStats = React88__default.useMemo(() => {
+  const schemaStats = React90__default.useMemo(() => {
     if (!metrics || metrics.length === 0) return null;
     return metrics.map((metric) => ({
       label: metric.label,
@@ -17014,7 +17308,7 @@ var StatCard = ({
       format: metric.format
     }));
   }, [metrics, data, computeMetricValue]);
-  const calculatedTrend = React88__default.useMemo(() => {
+  const calculatedTrend = React90__default.useMemo(() => {
     if (manualTrend !== void 0) return manualTrend;
     if (previousValue === void 0 || currentValue === void 0)
       return void 0;
@@ -17178,7 +17472,7 @@ var PageHeader = ({
     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(React88__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(React90__default.Fragment, { children: [
       idx > 0 && /* @__PURE__ */ jsx(Typography, { variant: "small", color: "muted", children: "/" }),
       crumb.href ? /* @__PURE__ */ jsx(
         "a",
@@ -17704,7 +17998,7 @@ var FormSection = ({
   columns = 1,
   className
 }) => {
-  const [collapsed, setCollapsed] = React88__default.useState(defaultCollapsed);
+  const [collapsed, setCollapsed] = React90__default.useState(defaultCollapsed);
   const { t } = useTranslate();
   const eventBus = useEventBus();
   const gridClass = {
@@ -17712,7 +18006,7 @@ var FormSection = ({
     2: "grid-cols-1 md:grid-cols-2",
     3: "grid-cols-1 md:grid-cols-2 lg:grid-cols-3"
   }[columns];
-  React88__default.useCallback(() => {
+  React90__default.useCallback(() => {
     if (collapsible) {
       setCollapsed((prev) => !prev);
       eventBus.emit("UI:TOGGLE_COLLAPSE", { collapsed: !collapsed });
@@ -17924,7 +18218,7 @@ var Form = ({
   const normalizedInitialData = initialData ?? {};
   const resolvedEntity = entity && typeof entity === "object" && !Array.isArray(entity) ? entity : void 0;
   const entityName = typeof entity === "string" ? entity : resolvedEntity?.name;
-  const entityDerivedFields = React88__default.useMemo(() => {
+  const entityDerivedFields = React90__default.useMemo(() => {
     if (fields && fields.length > 0) return void 0;
     if (!resolvedEntity) return void 0;
     return resolvedEntity.fields.map(
@@ -17943,14 +18237,14 @@ var Form = ({
   const conditionalFields = typeof conditionalFieldsRaw === "boolean" ? {} : conditionalFieldsRaw;
   const hiddenCalculations = typeof hiddenCalculationsRaw === "boolean" ? [] : hiddenCalculationsRaw;
   const violationTriggers = typeof violationTriggersRaw === "boolean" ? [] : violationTriggersRaw;
-  const [formData, setFormData] = React88__default.useState(
+  const [formData, setFormData] = React90__default.useState(
     normalizedInitialData
   );
-  const [collapsedSections, setCollapsedSections] = React88__default.useState(
+  const [collapsedSections, setCollapsedSections] = React90__default.useState(
     /* @__PURE__ */ new Set()
   );
   const shouldShowCancel = showCancel ?? (fields && fields.length > 0);
-  const evalContext = React88__default.useMemo(
+  const evalContext = React90__default.useMemo(
     () => ({
       formValues: formData,
       globalVariables: externalContext?.globalVariables ?? {},
@@ -17959,13 +18253,13 @@ var Form = ({
     }),
     [formData, externalContext]
   );
-  React88__default.useEffect(() => {
+  React90__default.useEffect(() => {
     const data = initialData;
     if (data && Object.keys(data).length > 0) {
       setFormData(data);
     }
   }, [initialData]);
-  const processCalculations = React88__default.useCallback(
+  const processCalculations = React90__default.useCallback(
     (changedFieldId, newFormData) => {
       if (!hiddenCalculations.length) return;
       const context = {
@@ -17990,7 +18284,7 @@ var Form = ({
     },
     [hiddenCalculations, externalContext, eventBus]
   );
-  const checkViolations = React88__default.useCallback(
+  const checkViolations = React90__default.useCallback(
     (changedFieldId, newFormData) => {
       if (!violationTriggers.length) return;
       const context = {
@@ -18027,7 +18321,7 @@ var Form = ({
     processCalculations(name, newFormData);
     checkViolations(name, newFormData);
   };
-  const isFieldVisible = React88__default.useCallback(
+  const isFieldVisible = React90__default.useCallback(
     (fieldName) => {
       const condition = conditionalFields[fieldName];
       if (!condition) return true;
@@ -18035,7 +18329,7 @@ var Form = ({
     },
     [conditionalFields, evalContext]
   );
-  const isSectionVisible = React88__default.useCallback(
+  const isSectionVisible = React90__default.useCallback(
     (section) => {
       if (!section.condition) return true;
       return Boolean(evaluateFormExpression(section.condition, evalContext));
@@ -18067,7 +18361,7 @@ var Form = ({
       eventBus.emit(`UI:${onCancel}`);
     }
   };
-  const renderField = React88__default.useCallback(
+  const renderField = React90__default.useCallback(
     (field) => {
       const fieldName = field.name || field.field;
       if (!fieldName) return null;
@@ -18088,7 +18382,7 @@ var Form = ({
     [formData, isFieldVisible, relationsData, relationsLoading, isLoading]
   );
   const effectiveFields = entityDerivedFields ?? fields;
-  const normalizedFields = React88__default.useMemo(() => {
+  const normalizedFields = React90__default.useMemo(() => {
     if (!effectiveFields || effectiveFields.length === 0) return [];
     return effectiveFields.map((field) => {
       if (typeof field === "string") {
@@ -18110,7 +18404,7 @@ var Form = ({
       return field;
     });
   }, [effectiveFields, resolvedEntity]);
-  const schemaFields = React88__default.useMemo(() => {
+  const schemaFields = React90__default.useMemo(() => {
     if (normalizedFields.length === 0) return null;
     if (isDebugEnabled()) {
       debugGroup(`Form: ${entityName || "unknown"}`);
@@ -18120,7 +18414,7 @@ var Form = ({
     }
     return normalizedFields.map(renderField).filter(Boolean);
   }, [normalizedFields, renderField, entityName, conditionalFields]);
-  const sectionElements = React88__default.useMemo(() => {
+  const sectionElements = React90__default.useMemo(() => {
     if (!sections || sections.length === 0) return null;
     return sections.map((section) => {
       if (!isSectionVisible(section)) {
@@ -19245,7 +19539,7 @@ var List = ({
     if (entity && typeof entity === "object" && "id" in entity) return [entity];
     return [];
   }, [entity]);
-  const getItemActions = React88__default.useCallback(
+  const getItemActions = React90__default.useCallback(
     (item) => {
       if (!itemActions) return [];
       if (typeof itemActions === "function") {
@@ -20011,7 +20305,7 @@ var WizardContainer = ({
           const isCompleted = index < currentStep;
           const stepKey = step.id ?? step.tabId ?? `step-${index}`;
           const stepTitle = step.title ?? step.name ?? `Step ${index + 1}`;
-          return /* @__PURE__ */ jsxs(React88__default.Fragment, { children: [
+          return /* @__PURE__ */ jsxs(React90__default.Fragment, { children: [
             /* @__PURE__ */ jsx(
               Button,
               {
@@ -21235,7 +21529,7 @@ var StateMachineView = ({
             style: { top: title ? 30 : 0 },
             children: [
               entity && /* @__PURE__ */ jsx(EntityBox, { entity, config }),
-              states.map((state) => renderStateNode ? /* @__PURE__ */ jsx(React88__default.Fragment, { children: renderStateNode(state, config) }, state.id) : /* @__PURE__ */ jsx(
+              states.map((state) => renderStateNode ? /* @__PURE__ */ jsx(React90__default.Fragment, { children: renderStateNode(state, config) }, state.id) : /* @__PURE__ */ jsx(
                 StateNode,
                 {
                   state,
@@ -21429,9 +21723,9 @@ function getEffectSummary(effects) {
   });
   return summaries.join(" | ");
 }
-function extractOutputsFromTransitions(transitions2) {
+function extractOutputsFromTransitions(transitions) {
   const outputs = /* @__PURE__ */ new Set();
-  transitions2.forEach((t) => {
+  transitions.forEach((t) => {
     if (t.effects) {
       t.effects.forEach((effect) => {
         if (Array.isArray(effect)) {
@@ -21456,7 +21750,7 @@ function getNodeRadius(stateName, config) {
   if (textLength > 6) return baseRadius + 8;
   return baseRadius;
 }
-function calculateLayout(states, transitions2, options, config) {
+function calculateLayout(states, transitions, options, config) {
   const positions = {};
   const entityBoxWidth = options.hasEntity ? 200 : 0;
   const outputBoxWidth = options.hasOutputs ? 200 : 0;
@@ -21465,7 +21759,7 @@ function calculateLayout(states, transitions2, options, config) {
   states.filter((s) => s.isFinal);
   states.filter((s) => !s.isInitial && !s.isFinal);
   let maxLabelLength = 0;
-  transitions2.forEach((t) => {
+  transitions.forEach((t) => {
     if (t.effects && t.effects.length > 0) {
       const summary = getEffectSummary(t.effects);
       maxLabelLength = Math.max(maxLabelLength, summary.length);
@@ -21491,7 +21785,7 @@ function calculateLayout(states, transitions2, options, config) {
       if (stateColumn[name] === void 0) {
         stateColumn[name] = col;
       }
-      transitions2.forEach((t) => {
+      transitions.forEach((t) => {
         if (t.from === name && t.from !== t.to && !visited.has(t.to)) {
           queue.push({ name: t.to, col: col + 1 });
         }
@@ -21540,11 +21834,11 @@ function calculateLayout(states, transitions2, options, config) {
   });
   return { positions, width, height: height + 60 };
 }
-function calculateTransitionPathData(from, to, transitions2, positions, config) {
+function calculateTransitionPathData(from, to, transitions, positions, config) {
   const fromPos = positions[from];
   const toPos = positions[to];
   if (!fromPos || !toPos) return null;
-  const relevantTransitions = transitions2.filter((t) => t.from === from && t.to === to);
+  const relevantTransitions = transitions.filter((t) => t.from === from && t.to === to);
   if (relevantTransitions.length === 0) return null;
   const fromRadius = getNodeRadius(from, config);
   const toRadius = getNodeRadius(to, config);
@@ -21575,7 +21869,7 @@ function calculateTransitionPathData(from, to, transitions2, positions, config)
   const startY = fromPos.y + ny * fromRadius;
   const endX = toPos.x - nx * (toRadius + 5);
   const endY = toPos.y - ny * (toRadius + 5);
-  const hasReverse = transitions2.some((t) => t.from === to && t.to === from);
+  const hasReverse = transitions.some((t) => t.from === to && t.to === from);
   const isReverse = hasReverse && from > to;
   const baseOffset = hasReverse ? 50 : 30;
   const curveOffset = baseOffset + (relevantTransitions.length > 1 ? 20 : 0);
@@ -21590,15 +21884,15 @@ function calculateTransitionPathData(from, to, transitions2, positions, config)
 }
 function renderStateMachineToDomData(stateMachine, options = {}, config = DEFAULT_CONFIG) {
   const states = stateMachine.states || [];
-  const transitions2 = stateMachine.transitions || [];
+  const transitions = stateMachine.transitions || [];
   const title = options.title || "";
   const entity = options.entity;
-  const outputs = extractOutputsFromTransitions(transitions2);
+  const outputs = extractOutputsFromTransitions(transitions);
   const layoutOptions = {
     hasEntity: !!entity,
     hasOutputs: outputs.length > 0
   };
-  const { positions, width, height } = calculateLayout(states, transitions2, layoutOptions, config);
+  const { positions, width, height } = calculateLayout(states, transitions, layoutOptions, config);
   const domStates = Object.entries(positions).map(([name, pos]) => ({
     id: `state-${name}`,
     name,
@@ -21612,14 +21906,14 @@ function renderStateMachineToDomData(stateMachine, options = {}, config = DEFAUL
   const domPaths = [];
   const domLabels = [];
   const drawnPairs = /* @__PURE__ */ new Set();
-  transitions2.forEach((transition, idx) => {
+  transitions.forEach((transition, idx) => {
     const pairKey = `${transition.from}->${transition.to}`;
     if (!drawnPairs.has(pairKey)) {
       drawnPairs.add(pairKey);
       const pathData2 = calculateTransitionPathData(
         transition.from,
         transition.to,
-        transitions2,
+        transitions,
         positions,
         config
       );
@@ -21640,7 +21934,7 @@ function renderStateMachineToDomData(stateMachine, options = {}, config = DEFAUL
     const pathData = calculateTransitionPathData(
       transition.from,
       transition.to,
-      transitions2,
+      transitions,
       positions,
       config
     );
@@ -24773,7 +25067,7 @@ function usePhysics2D(options = {}) {
     if (!state) return null;
     return { x: state.x, y: state.y };
   }, [manager]);
-  const getState = useCallback((unitId) => {
+  const getState2 = useCallback((unitId) => {
     return manager.getState(unitId);
   }, [manager]);
   const applyForce = useCallback((unitId, fx, fy) => {
@@ -24810,7 +25104,7 @@ function usePhysics2D(options = {}) {
     registerUnit,
     unregisterUnit,
     getPosition,
-    getState,
+    getState: getState2,
     applyForce,
     setVelocity,
     setPosition,
@@ -25681,7 +25975,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(React88__default.Fragment, { children: [
+      return /* @__PURE__ */ jsxs(React90__default.Fragment, { children: [
         i > 0 && /* @__PURE__ */ jsx(
           Typography,
           {
@@ -26335,7 +26629,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(React88__default.Fragment, { children: [
+  return /* @__PURE__ */ jsx(HStack, { className: cn("items-center", className), gap: "sm", children: paddedSlots.map((slot, i) => /* @__PURE__ */ jsxs(React90__default.Fragment, { children: [
     i > 0 && /* @__PURE__ */ jsx(
       Typography,
       {
@@ -27139,7 +27433,7 @@ function StateArchitectBoard({
 }) {
   const { emit } = useEventBus();
   const { t } = useTranslate();
-  const [transitions2, setTransitions] = useState(entity.transitions);
+  const [transitions, setTransitions] = useState(entity.transitions);
   const [headerError, setHeaderError] = useState(false);
   const [playState, setPlayState] = useState("editing");
   const [currentState, setCurrentState] = useState(entity.initialState);
@@ -27185,13 +27479,13 @@ function StateArchitectBoard({
     description: entity.description,
     states: entity.states,
     currentState,
-    transitions: transitions2.map((t2) => ({
+    transitions: transitions.map((t2) => ({
       from: t2.from,
       to: t2.to,
       event: t2.event,
       guardHint: t2.guardHint
     }))
-  }), [entity, currentState, transitions2]);
+  }), [entity, currentState, transitions]);
   const handleTest = useCallback(() => {
     if (playState !== "editing") return;
     if (testEvent) emit(`UI:${testEvent}`, {});
@@ -27218,7 +27512,7 @@ function StateArchitectBoard({
       const testCase = entity.testCases[testIdx];
       let state = entity.initialState;
       for (const event of testCase.events) {
-        const trans = transitions2.find((t2) => t2.from === state && t2.event === event);
+        const trans = transitions.find((t2) => t2.from === state && t2.event === event);
         if (trans) {
           state = trans.to;
         }
@@ -27234,7 +27528,7 @@ function StateArchitectBoard({
       timerRef.current = setTimeout(runNextTest, stepDurationMs);
     };
     timerRef.current = setTimeout(runNextTest, stepDurationMs);
-  }, [playState, transitions2, entity, stepDurationMs, testEvent, completeEvent, emit]);
+  }, [playState, transitions, entity, stepDurationMs, testEvent, completeEvent, emit]);
   const handleTryAgain = useCallback(() => {
     if (timerRef.current) clearTimeout(timerRef.current);
     setPlayState("editing");
@@ -27256,13 +27550,13 @@ function StateArchitectBoard({
     name: entity.entityName,
     states: entity.states,
     initialState: entity.initialState,
-    transitions: transitions2.map((t2) => ({
+    transitions: transitions.map((t2) => ({
       from: t2.from,
       to: t2.to,
       event: t2.event,
       ...t2.guardHint ? { guard: t2.guardHint } : {}
     }))
-  }), [entity, transitions2]);
+  }), [entity, transitions]);
   return /* @__PURE__ */ jsxs(
     VStack,
     {
@@ -27307,7 +27601,7 @@ function StateArchitectBoard({
                           /* @__PURE__ */ jsx("marker", { id: "arrowhead", markerWidth: "10", markerHeight: "7", refX: "10", refY: "3.5", orient: "auto", children: /* @__PURE__ */ jsx("polygon", { points: "0 0, 10 3.5, 0 7", fill: "var(--color-border)" }) }),
                           /* @__PURE__ */ jsx("marker", { id: "arrowhead-active", markerWidth: "10", markerHeight: "7", refX: "10", refY: "3.5", orient: "auto", children: /* @__PURE__ */ jsx("polygon", { points: "0 0, 10 3.5, 0 7", fill: "var(--color-primary)" }) })
                         ] }),
-                        transitions2.map((t2) => {
+                        transitions.map((t2) => {
                           const fromPos = positions[t2.from];
                           const toPos = positions[t2.to];
                           if (!fromPos || !toPos) return null;
@@ -27351,9 +27645,9 @@ function StateArchitectBoard({
                 children: selectedState ? t("stateArchitect.addTransition", { state: selectedState }) : t("stateArchitect.addTransitionPrompt")
               }
             ) }),
-            transitions2.length > 0 && /* @__PURE__ */ jsxs(VStack, { gap: "xs", className: "p-3 rounded-lg bg-muted/50 border border-border", children: [
-              /* @__PURE__ */ jsx(Typography, { variant: "caption", className: "text-muted-foreground font-medium", children: t("stateArchitect.transitions", { count: transitions2.length }) + ":" }),
-              transitions2.map((t2) => /* @__PURE__ */ jsxs(HStack, { className: "items-center text-xs", gap: "xs", children: [
+            transitions.length > 0 && /* @__PURE__ */ jsxs(VStack, { gap: "xs", className: "p-3 rounded-lg bg-muted/50 border border-border", children: [
+              /* @__PURE__ */ jsx(Typography, { variant: "caption", className: "text-muted-foreground font-medium", children: t("stateArchitect.transitions", { count: transitions.length }) + ":" }),
+              transitions.map((t2) => /* @__PURE__ */ jsxs(HStack, { className: "items-center text-xs", gap: "xs", children: [
                 /* @__PURE__ */ jsx(Typography, { variant: "caption", className: "text-foreground", children: t2.from }),
                 /* @__PURE__ */ jsx(Typography, { variant: "caption", className: "text-muted-foreground", children: "\u2014[" }),
                 /* @__PURE__ */ jsx(Typography, { variant: "caption", className: "text-accent font-medium", children: t2.event }),
@@ -28823,7 +29117,7 @@ function InputPattern({
   className
 }) {
   const { emit } = useEventBus();
-  const [localValue, setLocalValue] = React88__default.useState(value);
+  const [localValue, setLocalValue] = React90__default.useState(value);
   const handleChange = (e) => {
     setLocalValue(e.target.value);
     if (onChange) {
@@ -28860,7 +29154,7 @@ function TextareaPattern({
   className
 }) {
   const { emit } = useEventBus();
-  const [localValue, setLocalValue] = React88__default.useState(value);
+  const [localValue, setLocalValue] = React90__default.useState(value);
   const handleChange = (e) => {
     setLocalValue(e.target.value);
     if (onChange) {
@@ -28891,7 +29185,7 @@ function SelectPattern({
   className
 }) {
   const { emit } = useEventBus();
-  const [localValue, setLocalValue] = React88__default.useState(value);
+  const [localValue, setLocalValue] = React90__default.useState(value);
   const handleChange = (e) => {
     setLocalValue(e.target.value);
     if (onChange) {
@@ -28920,7 +29214,7 @@ function CheckboxPattern({
   className
 }) {
   const { emit } = useEventBus();
-  const [localChecked, setLocalChecked] = React88__default.useState(checked);
+  const [localChecked, setLocalChecked] = React90__default.useState(checked);
   const handleChange = (e) => {
     setLocalChecked(e.target.checked);
     if (onChange) {
@@ -30802,7 +31096,7 @@ var DocumentViewer = ({
 };
 DocumentViewer.displayName = "DocumentViewer";
 function extractTitle(children) {
-  if (!React88__default.isValidElement(children)) return void 0;
+  if (!React90__default.isValidElement(children)) return void 0;
   const props = children.props;
   if (typeof props.title === "string") {
     return props.title;
@@ -31400,7 +31694,7 @@ var MediaGallery = ({
     [selectable, selectedItems, selectionEvent, eventBus]
   );
   const entityData = Array.isArray(entity) ? entity : [];
-  const items = React88__default.useMemo(() => {
+  const items = React90__default.useMemo(() => {
     if (propItems) return propItems;
     if (entityData.length === 0) return [];
     return entityData.map((record, idx) => ({
@@ -31562,7 +31856,7 @@ var MediaGallery = ({
 };
 MediaGallery.displayName = "MediaGallery";
 function extractTitle2(children) {
-  if (!React88__default.isValidElement(children)) return void 0;
+  if (!React90__default.isValidElement(children)) return void 0;
   const props = children.props;
   if (typeof props.title === "string") {
     return props.title;
@@ -31599,35 +31893,35 @@ ModalSlot.displayName = "ModalSlot";
 
 // lib/traitRegistry.ts
 var traits = /* @__PURE__ */ new Map();
-var listeners2 = /* @__PURE__ */ new Set();
+var listeners = /* @__PURE__ */ new Set();
 function getAllTraits() {
   return Array.from(traits.values());
 }
 function subscribeToTraitChanges(listener) {
-  listeners2.add(listener);
-  return () => listeners2.delete(listener);
+  listeners.add(listener);
+  return () => listeners.delete(listener);
 }
 
 // lib/tickRegistry.ts
 var ticks = /* @__PURE__ */ new Map();
-var listeners3 = /* @__PURE__ */ new Set();
+var listeners2 = /* @__PURE__ */ new Set();
 function getAllTicks() {
   return Array.from(ticks.values());
 }
 function subscribeToTickChanges(listener) {
-  listeners3.add(listener);
-  return () => listeners3.delete(listener);
+  listeners2.add(listener);
+  return () => listeners2.delete(listener);
 }
 
 // lib/guardRegistry.ts
 var guardHistory = [];
-var listeners4 = /* @__PURE__ */ new Set();
+var listeners3 = /* @__PURE__ */ new Set();
 function getGuardHistory() {
   return [...guardHistory];
 }
 function subscribeToGuardChanges(listener) {
-  listeners4.add(listener);
-  return () => listeners4.delete(listener);
+  listeners3.add(listener);
+  return () => listeners3.delete(listener);
 }
 function getEntitySnapshot() {
   {
@@ -31637,18 +31931,18 @@ function getEntitySnapshot() {
 
 // lib/debugRegistry.ts
 var events = [];
-var listeners5 = /* @__PURE__ */ new Set();
+var listeners4 = /* @__PURE__ */ new Set();
 function getDebugEvents() {
   return [...events];
 }
 function subscribeToDebugEvents(listener) {
-  listeners5.add(listener);
-  return () => listeners5.delete(listener);
+  listeners4.add(listener);
+  return () => listeners4.delete(listener);
 }
 
 // components/organisms/debug/hooks/useDebugData.ts
 function useDebugData() {
-  const [data, setData] = React88.useState(() => ({
+  const [data, setData] = React90.useState(() => ({
     traits: [],
     ticks: [],
     guards: [],
@@ -31662,7 +31956,7 @@ function useDebugData() {
     },
     lastUpdate: Date.now()
   }));
-  React88.useEffect(() => {
+  React90.useEffect(() => {
     const updateData = () => {
       setData({
         traits: getAllTraits(),
@@ -31706,14 +32000,14 @@ function useDebugData() {
 
 // lib/debugUtils.ts
 var DEBUG_STORAGE_KEY = "orbital-debug";
-var listeners6 = /* @__PURE__ */ new Set();
+var listeners5 = /* @__PURE__ */ new Set();
 function isDebugEnabled2() {
   if (typeof window === "undefined") return false;
   return localStorage.getItem(DEBUG_STORAGE_KEY) === "true";
 }
 function onDebugToggle(listener) {
-  listeners6.add(listener);
-  return () => listeners6.delete(listener);
+  listeners5.add(listener);
+  return () => listeners5.delete(listener);
 }
 function TraitsTab({ traits: traits2 }) {
   if (traits2.length === 0) {
@@ -31931,15 +32225,15 @@ var TYPE_BADGES = {
   state: { variant: "danger", icon: "\u{1F4CA}" }
 };
 function EventFlowTab({ events: events2 }) {
-  const [filter, setFilter] = React88.useState("all");
-  const containerRef = React88.useRef(null);
-  const [autoScroll, setAutoScroll] = React88.useState(true);
-  React88.useEffect(() => {
+  const [filter, setFilter] = React90.useState("all");
+  const containerRef = React90.useRef(null);
+  const [autoScroll, setAutoScroll] = React90.useState(true);
+  React90.useEffect(() => {
     if (autoScroll && containerRef.current) {
       containerRef.current.scrollTop = containerRef.current.scrollHeight;
     }
   }, [events2.length, autoScroll]);
-  const filteredEvents = React88.useMemo(() => {
+  const filteredEvents = React90.useMemo(() => {
     if (filter === "all") return events2;
     return events2.filter((e) => e.type === filter);
   }, [events2, filter]);
@@ -32038,7 +32332,7 @@ function EventFlowTab({ events: events2 }) {
 }
 EventFlowTab.displayName = "EventFlowTab";
 function GuardsPanel({ guards }) {
-  const [filter, setFilter] = React88.useState("all");
+  const [filter, setFilter] = React90.useState("all");
   if (guards.length === 0) {
     return /* @__PURE__ */ jsx(
       EmptyState,
@@ -32051,7 +32345,7 @@ function GuardsPanel({ guards }) {
   }
   const passedCount = guards.filter((g) => g.result).length;
   const failedCount = guards.length - passedCount;
-  const filteredGuards = React88.useMemo(() => {
+  const filteredGuards = React90.useMemo(() => {
     if (filter === "all") return guards;
     if (filter === "passed") return guards.filter((g) => g.result);
     return guards.filter((g) => !g.result);
@@ -32116,8 +32410,8 @@ var STATUS_CONFIG = {
   warn: { variant: "warning", icon: "!", label: "WARN" },
   pending: { variant: "default", icon: "?", label: "PENDING" }
 };
-function VerificationTab({ checks: checks2, summary }) {
-  if (checks2.length === 0) {
+function VerificationTab({ checks, summary }) {
+  if (checks.length === 0) {
     return /* @__PURE__ */ jsx(
       EmptyState,
       {
@@ -32128,7 +32422,7 @@ function VerificationTab({ checks: checks2, summary }) {
     );
   }
   const sortOrder = { fail: 0, warn: 1, pending: 2, pass: 3 };
-  const sorted = [...checks2].sort(
+  const sorted = [...checks].sort(
     (a, b) => (sortOrder[a.status] ?? 4) - (sortOrder[b.status] ?? 4)
   );
   return /* @__PURE__ */ jsxs("div", { className: "debug-tab debug-tab--verification", children: [
@@ -32194,16 +32488,16 @@ function EffectBadge({ effect }) {
     effect.error && /* @__PURE__ */ jsx("span", { className: "text-red-500 truncate max-w-[120px]", title: effect.error, children: effect.error })
   ] });
 }
-function TransitionTimeline({ transitions: transitions2 }) {
-  const containerRef = React88.useRef(null);
-  const [autoScroll, setAutoScroll] = React88.useState(true);
-  const [expandedId, setExpandedId] = React88.useState(null);
-  React88.useEffect(() => {
+function TransitionTimeline({ transitions }) {
+  const containerRef = React90.useRef(null);
+  const [autoScroll, setAutoScroll] = React90.useState(true);
+  const [expandedId, setExpandedId] = React90.useState(null);
+  React90.useEffect(() => {
     if (autoScroll && containerRef.current) {
       containerRef.current.scrollTop = containerRef.current.scrollHeight;
     }
-  }, [transitions2.length, autoScroll]);
-  if (transitions2.length === 0) {
+  }, [transitions.length, autoScroll]);
+  if (transitions.length === 0) {
     return /* @__PURE__ */ jsx(
       EmptyState,
       {
@@ -32222,11 +32516,11 @@ function TransitionTimeline({ transitions: transitions2 }) {
       second: "2-digit"
     }) + "." + String(d.getMilliseconds()).padStart(3, "0");
   };
-  const sorted = [...transitions2].reverse();
+  const sorted = [...transitions].reverse();
   return /* @__PURE__ */ jsxs("div", { className: "debug-tab debug-tab--timeline", children: [
     /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between mb-2", children: [
       /* @__PURE__ */ jsxs(Typography, { variant: "small", className: "text-gray-500", children: [
-        transitions2.length,
+        transitions.length,
         " transitions recorded"
       ] }),
       /* @__PURE__ */ jsxs("label", { className: "flex items-center gap-1 text-xs text-gray-500 cursor-pointer", children: [
@@ -32459,9 +32753,9 @@ function getAllEvents(traits2) {
 }
 function EventDispatcherTab({ traits: traits2, schema }) {
   const eventBus = useEventBus();
-  const [log, setLog] = React88.useState([]);
-  const prevStatesRef = React88.useRef(/* @__PURE__ */ new Map());
-  React88.useEffect(() => {
+  const [log, setLog] = React90.useState([]);
+  const prevStatesRef = React90.useRef(/* @__PURE__ */ new Map());
+  React90.useEffect(() => {
     for (const trait of traits2) {
       const prev = prevStatesRef.current.get(trait.id);
       if (prev && prev !== trait.currentState) {
@@ -32504,7 +32798,7 @@ function EventDispatcherTab({ traits: traits2, schema }) {
     ] }),
     /* @__PURE__ */ jsxs("div", { className: "mb-3", children: [
       /* @__PURE__ */ jsx(Typography, { variant: "small", weight: "medium", className: "text-gray-500 mb-1", children: "Available Events" }),
-      availableEvents.length === 0 ? /* @__PURE__ */ jsx(Typography, { variant: "small", className: "text-gray-400 italic", children: "No transitions from current state" }) : /* @__PURE__ */ jsx(Stack, { gap: "xs", children: availableEvents.map(({ event, transitions: transitions2 }) => /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+      availableEvents.length === 0 ? /* @__PURE__ */ jsx(Typography, { variant: "small", className: "text-gray-400 italic", children: "No transitions from current state" }) : /* @__PURE__ */ jsx(Stack, { gap: "xs", children: availableEvents.map(({ event, transitions }) => /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
         /* @__PURE__ */ jsx(
           Button,
           {
@@ -32515,8 +32809,8 @@ function EventDispatcherTab({ traits: traits2, schema }) {
             children: event
           }
         ),
-        /* @__PURE__ */ jsx(Typography, { variant: "small", className: "text-gray-500", children: transitions2.map((t) => `${t.from} -> ${t.to}`).join(", ") }),
-        transitions2.some((t) => t.guard) && /* @__PURE__ */ jsx(Badge, { variant: "warning", size: "sm", children: "guarded" })
+        /* @__PURE__ */ jsx(Typography, { variant: "small", className: "text-gray-500", children: transitions.map((t) => `${t.from} -> ${t.to}`).join(", ") }),
+        transitions.some((t) => t.guard) && /* @__PURE__ */ jsx(Badge, { variant: "warning", size: "sm", children: "guarded" })
       ] }, event)) })
     ] }),
     unavailableEvents.length > 0 && /* @__PURE__ */ jsxs("div", { className: "mb-3", children: [
@@ -32544,10 +32838,10 @@ function RuntimeDebugger({
   defaultTab,
   schema
 }) {
-  const [isCollapsed, setIsCollapsed] = React88.useState(defaultCollapsed);
-  const [isVisible, setIsVisible] = React88.useState(mode === "inline" || isDebugEnabled2());
+  const [isCollapsed, setIsCollapsed] = React90.useState(mode === "verify" ? true : defaultCollapsed);
+  const [isVisible, setIsVisible] = React90.useState(mode === "inline" || mode === "verify" || isDebugEnabled2());
   const debugData = useDebugData();
-  React88.useEffect(() => {
+  React90.useEffect(() => {
     if (mode === "inline") return;
     return onDebugToggle((enabled) => {
       setIsVisible(enabled);
@@ -32556,7 +32850,7 @@ function RuntimeDebugger({
       }
     });
   }, [mode]);
-  React88.useEffect(() => {
+  React90.useEffect(() => {
     if (mode === "inline") return;
     const handleKeyDown = (e) => {
       if (e.key === "`" && isVisible) {
@@ -32683,6 +32977,56 @@ function RuntimeDebugger({
       }
     );
   }
+  if (mode === "verify") {
+    const traitStates = debugData.traits.map((t) => `${t.name}:${t.currentState}`).join(" | ");
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        className: cn(
+          "runtime-debugger runtime-debugger--verify",
+          "h-[35vh] flex flex-col bg-gray-900 text-white border-t-2 border-cyan-500",
+          className
+        ),
+        "data-testid": "debugger-verify",
+        children: [
+          /* @__PURE__ */ jsxs("div", { className: "px-3 py-1.5 flex items-center gap-3 text-xs font-mono border-b border-gray-700 flex-shrink-0", children: [
+            /* @__PURE__ */ jsx(Badge, { variant: failedChecks > 0 ? "danger" : "success", size: "sm", children: failedChecks > 0 ? `${failedChecks} fail` : "OK" }),
+            /* @__PURE__ */ jsxs("span", { className: "text-gray-400", children: [
+              verification.transitions.length,
+              " transitions"
+            ] }),
+            traitStates && /* @__PURE__ */ jsx("span", { className: "text-cyan-400 truncate max-w-[400px]", children: traitStates })
+          ] }),
+          /* @__PURE__ */ jsx("div", { className: "flex-1 overflow-y-auto", children: /* @__PURE__ */ jsx("div", { className: "px-2 py-1", children: verification.transitions.length === 0 ? /* @__PURE__ */ jsx("div", { className: "text-gray-500 text-xs font-mono py-2 text-center", children: "Waiting for transitions..." }) : /* @__PURE__ */ jsx("div", { className: "space-y-0.5", children: verification.transitions.map((trace) => {
+            const hasFailedEffects = trace.effects.some((e) => e.status === "failed");
+            return /* @__PURE__ */ jsxs("div", { className: "flex items-start gap-2 text-xs font-mono py-0.5 border-b border-gray-800 last:border-0", children: [
+              /* @__PURE__ */ jsx("span", { className: cn(
+                "mt-1.5 w-1.5 h-1.5 rounded-full flex-shrink-0",
+                hasFailedEffects ? "bg-red-500" : "bg-green-500"
+              ) }),
+              /* @__PURE__ */ jsx(Badge, { variant: "info", size: "sm", className: "flex-shrink-0", children: trace.event }),
+              /* @__PURE__ */ jsxs("span", { className: "text-gray-400 flex-shrink-0", children: [
+                trace.from,
+                " ",
+                "\u2192",
+                " ",
+                trace.to
+              ] }),
+              /* @__PURE__ */ jsx("span", { className: "flex flex-wrap gap-1 ml-1", children: trace.effects.map((eff, i) => /* @__PURE__ */ jsxs("span", { className: cn(
+                "px-1 rounded text-[10px]",
+                eff.status === "executed" ? "bg-green-900/50 text-green-400" : eff.status === "failed" ? "bg-red-900/50 text-red-400" : "bg-yellow-900/50 text-yellow-400"
+              ), children: [
+                eff.status === "executed" ? "\u2713" : eff.status === "failed" ? "\u2717" : "-",
+                " ",
+                eff.type,
+                eff.args.length > 0 && /* @__PURE__ */ jsx("span", { className: "text-gray-500 ml-0.5", children: JSON.stringify(eff.args).slice(0, 30) })
+              ] }, i)) })
+            ] }, trace.id);
+          }) }) }) })
+        ]
+      }
+    );
+  }
   return /* @__PURE__ */ jsx(
     "div",
     {
@@ -32953,7 +33297,7 @@ var Timeline = ({
 }) => {
   const { t } = useTranslate();
   const entityData = Array.isArray(entity) ? entity : [];
-  const items = React88__default.useMemo(() => {
+  const items = React90__default.useMemo(() => {
     if (propItems) return propItems;
     if (entityData.length === 0) return [];
     return entityData.map((record, idx) => {
@@ -33055,7 +33399,7 @@ var Timeline = ({
 };
 Timeline.displayName = "Timeline";
 function extractToastProps(children) {
-  if (!React88__default.isValidElement(children)) {
+  if (!React90__default.isValidElement(children)) {
     if (typeof children === "string") {
       return { message: children };
     }
@@ -33086,7 +33430,7 @@ var ToastSlot = ({
     eventBus.emit("UI:CLOSE");
   };
   if (!isVisible) return null;
-  const isCustomContent = React88__default.isValidElement(children) && !message;
+  const isCustomContent = React90__default.isValidElement(children) && !message;
   return /* @__PURE__ */ jsx(Box, { className: "fixed bottom-4 right-4 z-50", children: isCustomContent ? children : /* @__PURE__ */ jsx(
     Toast,
     {
@@ -33128,12 +33472,12 @@ WorldMapTemplate.displayName = "WorldMapTemplate";
 
 // components/organisms/component-registry.generated.ts
 function lazyThree(name, loader) {
-  const Lazy = React88__default.lazy(() => loader().then((m) => ({ default: m[name] })));
+  const Lazy = React90__default.lazy(() => loader().then((m) => ({ default: m[name] })));
   function ThreeWrapper(props) {
-    return React88__default.createElement(
-      React88__default.Suspense,
+    return React90__default.createElement(
+      React90__default.Suspense,
       { fallback: null },
-      React88__default.createElement(Lazy, props)
+      React90__default.createElement(Lazy, props)
     );
   }
   ThreeWrapper.displayName = `Lazy(${name})`;
@@ -33421,7 +33765,7 @@ function SuspenseConfigProvider({
   config,
   children
 }) {
-  return React88__default.createElement(
+  return React90__default.createElement(
     SuspenseConfigContext.Provider,
     { value: config },
     children
@@ -35804,7 +36148,7 @@ function EntityDataProvider({
   adapter,
   children
 }) {
-  return React88__default.createElement(
+  return React90__default.createElement(
     EntityDataContext.Provider,
     { value: adapter },
     children
@@ -36383,14 +36727,14 @@ function useEntityMutations(entityName, options) {
 
 // stores/entityStore.ts
 var entities = /* @__PURE__ */ new Map();
-var listeners7 = /* @__PURE__ */ new Set();
+var listeners6 = /* @__PURE__ */ new Set();
 var idCounter2 = 0;
 function subscribe(listener) {
-  listeners7.add(listener);
-  return () => listeners7.delete(listener);
+  listeners6.add(listener);
+  return () => listeners6.delete(listener);
 }
 function notify() {
-  listeners7.forEach((listener) => listener());
+  listeners6.forEach((listener) => listener());
 }
 function getEntity(id) {
   return entities.get(id);
@@ -36630,4 +36974,4 @@ function useGitHubBranches(owner, repo, enabled = true) {
   });
 }
 
-export { ALL_PRESETS, AR_BOOK_FIELDS, AboutPageTemplate, Accordion, ActionButton, ActionButtons, Card2 as ActionCard, ActionPalette, ActionTile, Alert, AnimatedCounter, ArticleSection, AuthLayout, Avatar, Badge, BattleBoard, BattleTemplate, BookChapterView, BookCoverPage, BookNavBar, BookTableOfContents, BookViewer, Box, 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, CodeBlock, CodeExample, CodeView, CodeViewer, CollapsibleSection, CombatLog, ComboCounter, CommunityLinks, ConditionalWrapper, ConfettiEffect, ConfirmDialog, Container, ContentRenderer, ContentSection, ControlButton, CounterTemplate, CraftingRecipe, DEFAULT_SLOTS, DIAMOND_TOP_Y, DPad, DamageNumber, DashboardGrid, DashboardLayout, DataGrid, DataList, DataTable, DateRangeSelector, DayCell, DebuggerBoard, DetailPanel, DialogueBox, DialogueBubble, Divider, DocumentViewer, StateMachineView as DomStateMachineVisualizer, Drawer, DrawerSlot, ENTITY_EVENTS, EdgeDecoration, EditorCheckbox, EditorSelect, EditorSlider, EditorTextInput, EditorToolbar, EmptyState, EnemyPlate, EntityDataProvider, EntityDisplayEvents, ErrorBoundary, ErrorState, EventHandlerBoard, EventLog, FEATURE_COLORS, FEATURE_TYPES, FLOOR_HEIGHT, FeatureCard, FeatureDetailPageTemplate, FeatureGrid, FeatureGridOrganism, FilterGroup, Flex, FlipCard, FlipContainer, FloatingActionButton, Form, FormActions, FormField, FormLayout, FormSection, FormSectionHeader, GameAudioContext, GameAudioProvider, GameAudioToggle, GameCanvas2D, GameHud, GameMenu, GameOverScreen, GameShell, GameTemplate, GenericAppTemplate, GeometricPattern, GraphCanvas, GraphView, Grid, HStack, Header, Heading, HealthBar, HealthPanel, HeroOrganism, HeroSection, I18nProvider, IDENTITY_BOOK_FIELDS, Icon, InfiniteScrollSentinel, Input, InputGroup, InstallBox, InventoryGrid, InventoryPanel, IsometricCanvas, ItemSlot, JazariStateMachine, Label, LandingPageTemplate, LawReferenceTooltip, Lightbox, LineChart, List, LoadingState, MapView, MarkdownContent, MarketingStatCard, MasterDetail, MediaGallery, Menu, Meter, MiniMap, Modal, ModalSlot, Navigation, NegotiatorBoard, NotifyListener, NumberStepper, ObjectRulePanel, StateMachineView as OrbitalStateMachineView, OrbitalVisualization, Overlay, PageHeader, Pagination, PatternTile, PhysicsManager, PlatformerCanvas, Popover, PowerupSlots, PricingCard, PricingGrid, PricingOrganism, PricingPageTemplate, ProgressBar, ProgressDots, PullToRefresh, QuestTracker, QuizBlock, Radio, RangeSlider, RelationSelect, RepeatableFormSection, ResourceBar, ResourceCounter, RuleEditor, RuntimeDebugger, SHEET_COLUMNS, SPRITE_SHEET_LAYOUT, ScaledDiagram, ScoreBoard, ScoreDisplay, SearchInput, Section, SectionHeader, Select, SequenceBar, SequencerBoard, ServiceCatalog, ShowcaseCard, ShowcaseOrganism, SidePanel, Sidebar, SignaturePad, SimpleGrid, SimulationCanvas, SimulationControls, SimulationGraph, SimulatorBoard, Skeleton, SlotContentRenderer, SocialProof, SortableList, Spacer, Spinner, Split, SplitPane, SplitSection, Sprite, Stack, StarRating, StatBadge, StatCard, StatDisplay, StateArchitectBoard, StateIndicator, StateMachineView, StateNode2 as StateNode, StatsGrid, StatsOrganism, StatusBar, StatusDot, StatusEffect, StepFlow, StepFlowOrganism, SwipeableRow, Switch, TERRAIN_COLORS, TILE_HEIGHT, TILE_WIDTH, TabbedContainer, Table, Tabs, TagCloud, TeamCard, TeamOrganism, TerrainPalette, Text, TextHighlight, Textarea, ThemeSelector, ThemeToggle, TimeSlotCell, Timeline, TimerDisplay, Toast, ToastSlot, Tooltip, TraitSlot, TraitStateViewer, TransitionArrow, TrendIndicator, TurnIndicator, TurnPanel, TypewriterText, Typography, UISlotComponent, UISlotRenderer, UncontrolledBattleBoard, UnitCommandBar, UploadDropZone, VStack, VariablePanel, ViolationAlert, WaypointMarker, WizardContainer, WizardNavigation, WizardProgress, WorldMapBoard, WorldMapTemplate, XPBar, applyTemporaryEffect, calculateAttackTargets, calculateDamage, calculateValidMoves, clearEntities, cn, combatAnimations, combatClasses, combatEffects, createInitialGameState, createTranslate, createUnitAnimationState, drawSprite, entityDataKeys, generateCombatMessage, getAllEntities, getByType, getCurrentFrame, getEntity, getSingleton, getTileDimensions, inferDirection, isoToScreen, mapBookData, parseQueryBinding, pendulum, projectileMotion, removeEntity, resolveFieldMap, resolveFrame, resolveSheetDirection, screenToIso, spawnEntity, springOscillator, tickAnimationState, transitionAnimation, updateEntity, updateSingleton, useAgentChat, useAuthContext, useBattleState, useCamera, useCompile, useConnectGitHub, useCreateEntity, useDeepAgentGeneration, useDeleteEntity, useDisconnectGitHub, useDragReorder, useEmitEvent, useEntities, useEntitiesByType, useEntity, useEntity2 as useEntityById, useEntityDataAdapter, useEntityDetail, useEntityList, useEntityListSuspense, useEntityMutations, useEntitySuspense, useEventBus, useEventListener, useExtensions, useFileEditor, useFileSystem, useGameAudio, useGameAudioContext, useGitHubBranches, useGitHubRepo, useGitHubRepos, useGitHubStatus, useImageCache, useInfiniteScroll, useInput, useLongPress, useOrbitalHistory, useOrbitalMutations, usePhysics, usePhysics2D, usePinchZoom, usePlayer, usePreview, usePullToRefresh, useQuerySingleton, useResolvedEntity, useSelectedEntity, useSendOrbitalEvent, useSingletonEntity, useSpriteAnimations, useSwipeGesture, useTranslate, useUIEvents, useUISlotManager, useUpdateEntity, useValidation };
+export { ALL_PRESETS, AR_BOOK_FIELDS, AboutPageTemplate, Accordion, ActionButton, ActionButtons, Card2 as ActionCard, ActionPalette, ActionTile, Alert, AnimatedCounter, AnimatedGraphic, AnimatedReveal, ArticleSection, AuthLayout, Avatar, Badge, BattleBoard, BattleTemplate, BookChapterView, BookCoverPage, BookNavBar, BookTableOfContents, BookViewer, Box, 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, CodeBlock, CodeExample, CodeView, CodeViewer, CollapsibleSection, CombatLog, ComboCounter, CommunityLinks, ConditionalWrapper, ConfettiEffect, ConfirmDialog, Container, ContentRenderer, ContentSection, ControlButton, CounterTemplate, CraftingRecipe, DEFAULT_SLOTS, DIAMOND_TOP_Y, DPad, DamageNumber, DashboardGrid, DashboardLayout, DataGrid, DataList, DataTable, DateRangeSelector, DayCell, DebuggerBoard, DetailPanel, DialogueBox, DialogueBubble, Divider, DocumentViewer, StateMachineView as DomStateMachineVisualizer, Drawer, DrawerSlot, ENTITY_EVENTS, EdgeDecoration, EditorCheckbox, EditorSelect, EditorSlider, EditorTextInput, EditorToolbar, EmptyState, EnemyPlate, EntityDataProvider, EntityDisplayEvents, ErrorBoundary, ErrorState, EventHandlerBoard, EventLog, FEATURE_COLORS, FEATURE_TYPES, FLOOR_HEIGHT, FeatureCard, FeatureDetailPageTemplate, FeatureGrid, FeatureGridOrganism, FilterGroup, Flex, FlipCard, FlipContainer, FloatingActionButton, Form, FormActions, FormField, FormLayout, FormSection, FormSectionHeader, GameAudioContext, GameAudioProvider, GameAudioToggle, GameCanvas2D, GameHud, GameMenu, GameOverScreen, GameShell, GameTemplate, GenericAppTemplate, GeometricPattern, GraphCanvas, GraphView, Grid, HStack, Header, Heading, HealthBar, HealthPanel, HeroOrganism, HeroSection, I18nProvider, IDENTITY_BOOK_FIELDS, Icon, InfiniteScrollSentinel, Input, InputGroup, InstallBox, InventoryGrid, InventoryPanel, IsometricCanvas, ItemSlot, JazariStateMachine, Label, LandingPageTemplate, LawReferenceTooltip, Lightbox, LineChart, List, LoadingState, MapView, MarkdownContent, MarketingStatCard, MasterDetail, MediaGallery, Menu, Meter, MiniMap, Modal, ModalSlot, Navigation, NegotiatorBoard, NotifyListener, NumberStepper, ObjectRulePanel, StateMachineView as OrbitalStateMachineView, OrbitalVisualization, Overlay, PageHeader, Pagination, PatternTile, PhysicsManager, PlatformerCanvas, Popover, PowerupSlots, PricingCard, PricingGrid, PricingOrganism, PricingPageTemplate, ProgressBar, ProgressDots, PullToRefresh, QuestTracker, QuizBlock, Radio, RangeSlider, RelationSelect, RepeatableFormSection, ResourceBar, ResourceCounter, RuleEditor, RuntimeDebugger, SHEET_COLUMNS, SPRITE_SHEET_LAYOUT, ScaledDiagram, ScoreBoard, ScoreDisplay, SearchInput, Section, SectionHeader, Select, SequenceBar, SequencerBoard, ServiceCatalog, ShowcaseCard, ShowcaseOrganism, SidePanel, Sidebar, SignaturePad, SimpleGrid, SimulationCanvas, SimulationControls, SimulationGraph, SimulatorBoard, Skeleton, SlotContentRenderer, SocialProof, SortableList, Spacer, Spinner, Split, SplitPane, SplitSection, Sprite, Stack, StarRating, StatBadge, StatCard, StatDisplay, StateArchitectBoard, StateIndicator, StateMachineView, StateNode2 as StateNode, StatsGrid, StatsOrganism, StatusBar, StatusDot, StatusEffect, StepFlow, StepFlowOrganism, SwipeableRow, Switch, TERRAIN_COLORS, TILE_HEIGHT, TILE_WIDTH, TabbedContainer, Table, Tabs, TagCloud, TeamCard, TeamOrganism, TerrainPalette, Text, TextHighlight, Textarea, ThemeSelector, ThemeToggle, TimeSlotCell, Timeline, TimerDisplay, Toast, ToastSlot, Tooltip, TraitSlot, TraitStateViewer, TransitionArrow, TrendIndicator, TurnIndicator, TurnPanel, TypewriterText, Typography, UISlotComponent, UISlotRenderer, UncontrolledBattleBoard, UnitCommandBar, UploadDropZone, VStack, VariablePanel, ViolationAlert, WaypointMarker, WizardContainer, WizardNavigation, WizardProgress, WorldMapBoard, WorldMapTemplate, XPBar, applyTemporaryEffect, calculateAttackTargets, calculateDamage, calculateValidMoves, clearEntities, cn, combatAnimations, combatClasses, combatEffects, createInitialGameState, createTranslate, createUnitAnimationState, drawSprite, entityDataKeys, generateCombatMessage, getAllEntities, getByType, getCurrentFrame, getEntity, getSingleton, getTileDimensions, inferDirection, isoToScreen, mapBookData, parseQueryBinding, pendulum, projectileMotion, removeEntity, resolveFieldMap, resolveFrame, resolveSheetDirection, screenToIso, spawnEntity, springOscillator, tickAnimationState, transitionAnimation, updateEntity, updateSingleton, useAgentChat, useAuthContext, useBattleState, useCamera, useCompile, useConnectGitHub, useCreateEntity, useDeepAgentGeneration, useDeleteEntity, useDisconnectGitHub, useDragReorder, useEmitEvent, useEntities, useEntitiesByType, useEntity, useEntity2 as useEntityById, useEntityDataAdapter, useEntityDetail, useEntityList, useEntityListSuspense, useEntityMutations, useEntitySuspense, useEventBus, useEventListener, useExtensions, useFileEditor, useFileSystem, useGameAudio, useGameAudioContext, useGitHubBranches, useGitHubRepo, useGitHubRepos, useGitHubStatus, useImageCache, useInfiniteScroll, useInput, useLongPress, useOrbitalHistory, useOrbitalMutations, usePhysics, usePhysics2D, usePinchZoom, usePlayer, usePreview, usePullToRefresh, useQuerySingleton, useResolvedEntity, useSelectedEntity, useSendOrbitalEvent, useSingletonEntity, useSpriteAnimations, useSwipeGesture, useTranslate, useUIEvents, useUISlotManager, useUpdateEntity, useValidation };