@almadar/ui 2.26.0 → 2.27.0

package/dist/providers/index.js

@@ -1,5 +1,5 @@
-import * as React110 from 'react';
-import React110__default, { createContext, useCallback, useState, useRef, useLayoutEffect, useEffect, lazy, useContext, useMemo } from 'react';
+import * as React112 from 'react';
+import React112__default, { createContext, useCallback, useState, useRef, useEffect, useLayoutEffect, lazy, useContext, useMemo } from 'react';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import { EventBusContext } from '@almadar/ui/providers';
 import 'react-dom';
@@ -357,8 +357,8 @@ function EventBusProvider({ children, debug: debug2 = false }) {
       payload,
       timestamp: Date.now()
     };
-    const listeners7 = listenersRef.current.get(type);
-    const listenerCount = listeners7?.size ?? 0;
+    const listeners6 = listenersRef.current.get(type);
+    const listenerCount = listeners6?.size ?? 0;
     if (debug2) {
       if (listenerCount > 0) {
         console.log(`[EventBus] Emit: ${type} \u2192 ${listenerCount} listener(s)`, payload);
@@ -366,8 +366,8 @@ function EventBusProvider({ children, debug: debug2 = false }) {
         console.warn(`[EventBus] Emit: ${type} (NO LISTENERS - event may be lost!)`, payload);
       }
     }
-    if (listeners7) {
-      const listenersCopy = Array.from(listeners7);
+    if (listeners6) {
+      const listenersCopy = Array.from(listeners6);
       for (const listener of listenersCopy) {
         try {
           listener(event);
@@ -389,17 +389,17 @@ function EventBusProvider({ children, debug: debug2 = false }) {
     if (!listenersRef.current.has(type)) {
       listenersRef.current.set(type, /* @__PURE__ */ new Set());
     }
-    const listeners7 = listenersRef.current.get(type);
-    listeners7.add(listener);
+    const listeners6 = listenersRef.current.get(type);
+    listeners6.add(listener);
     if (debug2) {
-      console.log(`[EventBus] Subscribed to '${type}', total: ${listeners7.size}`);
+      console.log(`[EventBus] Subscribed to '${type}', total: ${listeners6.size}`);
     }
     return () => {
-      listeners7.delete(listener);
+      listeners6.delete(listener);
       if (debug2) {
-        console.log(`[EventBus] Unsubscribed from '${type}', remaining: ${listeners7.size}`);
+        console.log(`[EventBus] Unsubscribed from '${type}', remaining: ${listeners6.size}`);
       }
-      if (listeners7.size === 0) {
+      if (listeners6.size === 0) {
         listenersRef.current.delete(type);
       }
     };
@@ -412,8 +412,8 @@ function EventBusProvider({ children, debug: debug2 = false }) {
     return on(type, wrappedListener);
   }, [on]);
   const hasListeners = useCallback((type) => {
-    const listeners7 = listenersRef.current.get(type);
-    return listeners7 !== void 0 && listeners7.size > 0;
+    const listeners6 = listenersRef.current.get(type);
+    return listeners6 !== void 0 && listeners6.size > 0;
   }, []);
   const onAny = useCallback((listener) => {
     anyListenersRef.current.add(listener);
@@ -674,7 +674,7 @@ var positionStyles = {
   fixed: "fixed",
   sticky: "sticky"
 };
-var Box = React110__default.forwardRef(
+var Box = React112__default.forwardRef(
   ({
     padding,
     paddingX,
@@ -944,7 +944,7 @@ function resolveIconProp(value, sizeClass) {
     const IconComp = value;
     return /* @__PURE__ */ jsx(IconComp, { className: sizeClass });
   }
-  if (React110__default.isValidElement(value)) {
+  if (React112__default.isValidElement(value)) {
     return value;
   }
   if (typeof value === "object" && value !== null && "render" in value) {
@@ -953,7 +953,7 @@ function resolveIconProp(value, sizeClass) {
   }
   return value;
 }
-var Button = React110__default.forwardRef(
+var Button = React112__default.forwardRef(
   ({
     className,
     variant = "primary",
@@ -1049,7 +1049,7 @@ var sizeStyles3 = {
   md: "px-2.5 py-1 text-sm",
   lg: "px-3 py-1.5 text-base"
 };
-var Badge = React110__default.forwardRef(
+var Badge = React112__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" ? (() => {
@@ -1076,7 +1076,7 @@ var Badge = React110__default.forwardRef(
   }
 );
 Badge.displayName = "Badge";
-var Input = React110__default.forwardRef(
+var Input = React112__default.forwardRef(
   ({
     className,
     inputType,
@@ -1188,7 +1188,7 @@ var Input = React110__default.forwardRef(
   }
 );
 Input.displayName = "Input";
-var Label = React110__default.forwardRef(
+var Label = React112__default.forwardRef(
   ({ className, required, children, ...props }, ref) => {
     return /* @__PURE__ */ jsxs(
       "label",
@@ -1208,7 +1208,7 @@ var Label = React110__default.forwardRef(
   }
 );
 Label.displayName = "Label";
-var Textarea = React110__default.forwardRef(
+var Textarea = React112__default.forwardRef(
   ({ className, error, ...props }, ref) => {
     return /* @__PURE__ */ jsx(
       "textarea",
@@ -1231,7 +1231,7 @@ var Textarea = React110__default.forwardRef(
   }
 );
 Textarea.displayName = "Textarea";
-var Select = React110__default.forwardRef(
+var Select = React112__default.forwardRef(
   ({ className, options, placeholder, error, ...props }, ref) => {
     return /* @__PURE__ */ jsxs("div", { className: "relative", children: [
       /* @__PURE__ */ jsxs(
@@ -1267,7 +1267,7 @@ var Select = React110__default.forwardRef(
   }
 );
 Select.displayName = "Select";
-var Checkbox = React110__default.forwardRef(
+var Checkbox = React112__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: [
@@ -1343,7 +1343,7 @@ var shadowStyles2 = {
   md: "shadow",
   lg: "shadow-lg"
 };
-var Card = React110__default.forwardRef(
+var Card = React112__default.forwardRef(
   ({
     className,
     variant = "bordered",
@@ -1379,9 +1379,9 @@ var Card = React110__default.forwardRef(
   }
 );
 Card.displayName = "Card";
-var CardHeader = React110__default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: cn("mb-4", className), ...props }));
+var CardHeader = React112__default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: cn("mb-4", className), ...props }));
 CardHeader.displayName = "CardHeader";
-var CardTitle = React110__default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+var CardTitle = React112__default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
   "h3",
   {
     ref,
@@ -1394,11 +1394,11 @@ var CardTitle = React110__default.forwardRef(({ className, ...props }, ref) => /
   }
 ));
 CardTitle.displayName = "CardTitle";
-var CardContent = React110__default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: cn("", className), ...props }));
+var CardContent = React112__default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: cn("", className), ...props }));
 CardContent.displayName = "CardContent";
 var CardBody = CardContent;
 CardBody.displayName = "CardBody";
-var CardFooter = React110__default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+var CardFooter = React112__default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
   "div",
   {
     ref,
@@ -1413,7 +1413,7 @@ var sizeStyles4 = {
   md: "h-6 w-6",
   lg: "h-8 w-8"
 };
-var Spinner = React110__default.forwardRef(
+var Spinner = React112__default.forwardRef(
   ({ className, size = "md", ...props }, ref) => {
     return /* @__PURE__ */ jsx(
       "div",
@@ -1427,7 +1427,7 @@ var Spinner = React110__default.forwardRef(
   }
 );
 Spinner.displayName = "Spinner";
-var Radio = React110__default.forwardRef(
+var Radio = React112__default.forwardRef(
   ({
     label,
     helperText,
@@ -1531,7 +1531,7 @@ var Radio = React110__default.forwardRef(
   }
 );
 Radio.displayName = "Radio";
-var Switch = React110.forwardRef(
+var Switch = React112.forwardRef(
   ({
     checked,
     defaultChecked = false,
@@ -1542,10 +1542,10 @@ var Switch = React110.forwardRef(
     name,
     className
   }, ref) => {
-    const [isChecked, setIsChecked] = React110.useState(
+    const [isChecked, setIsChecked] = React112.useState(
       checked !== void 0 ? checked : defaultChecked
     );
-    React110.useEffect(() => {
+    React112.useEffect(() => {
       if (checked !== void 0) {
         setIsChecked(checked);
       }
@@ -1703,7 +1703,7 @@ var sizeStyles5 = {
   md: "w-2.5 h-2.5",
   lg: "w-3 h-3"
 };
-var StatusDot = React110__default.forwardRef(
+var StatusDot = React112__default.forwardRef(
   ({ className, status = "offline", pulse = false, size = "md", label, ...props }, ref) => {
     return /* @__PURE__ */ jsx(
       "span",
@@ -1750,7 +1750,7 @@ var iconMap2 = {
   down: TrendingDown,
   flat: ArrowRight
 };
-var TrendIndicator = React110__default.forwardRef(
+var TrendIndicator = React112__default.forwardRef(
   ({
     className,
     value,
@@ -1809,7 +1809,7 @@ var thumbSizes = {
   md: "w-4 h-4",
   lg: "w-5 h-5"
 };
-var RangeSlider = React110__default.forwardRef(
+var RangeSlider = React112__default.forwardRef(
   ({
     className,
     min = 0,
@@ -2012,7 +2012,7 @@ var paddingClasses = {
   md: "py-16",
   lg: "py-24"
 };
-var ContentSection = React110__default.forwardRef(
+var ContentSection = React112__default.forwardRef(
   ({ children, background = "default", padding = "lg", id, className }, ref) => {
     return /* @__PURE__ */ jsx(
       Box,
@@ -2031,6 +2031,289 @@ var ContentSection = React110__default.forwardRef(
   }
 );
 ContentSection.displayName = "ContentSection";
+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 = React112__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 = React112__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 = React112__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";
 
 // locales/en.json
 var en_default = {
@@ -2186,7 +2469,7 @@ var ErrorState = ({
   );
 };
 ErrorState.displayName = "ErrorState";
-var ErrorBoundary = class extends React110__default.Component {
+var ErrorBoundary = class extends React112__default.Component {
   constructor(props) {
     super(props);
     __publicField(this, "reset", () => {
@@ -2614,29 +2897,41 @@ var defaultIcon = L.icon({
 L.Marker.prototype.options.icon = defaultIcon;
 
 // lib/verificationRegistry.ts
-var checks = /* @__PURE__ */ new Map();
-var transitions = [];
 var MAX_TRANSITIONS = 500;
-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 notifyListeners() {
-  listeners.forEach((l) => l());
+  getState().listeners.forEach((l) => l());
   exposeOnWindow();
 }
 function registerCheck(id, label, status = "pending", details) {
-  checks.set(id, { id, label, status, details, updatedAt: Date.now() });
+  getState().checks.set(id, { id, label, status, details, updatedAt: Date.now() });
   notifyListeners();
 }
 function getAllChecks() {
-  return Array.from(checks.values());
+  return Array.from(getState().checks.values());
 }
 function recordTransition(trace) {
   const entry = {
     ...trace,
     id: `t-${Date.now()}-${Math.random().toString(36).slice(2, 9)}`
   };
-  transitions.push(entry);
-  if (transitions.length > MAX_TRANSITIONS) {
-    transitions.shift();
+  getState().transitions.push(entry);
+  if (getState().transitions.length > MAX_TRANSITIONS) {
+    getState().transitions.shift();
   }
   if (entry.event === "INIT") {
     const hasFetch = entry.effects.some((e) => e.type === "fetch");
@@ -2671,10 +2966,11 @@ function recordTransition(trace) {
   notifyListeners();
 }
 function getTransitions() {
-  return [...transitions];
+  return [...getState().transitions];
 }
 function getBridgeHealth() {
-  return null;
+  const bh = getState().bridgeHealth;
+  return bh ? { ...bh } : null;
 }
 function getSummary() {
   const allChecks = getAllChecks();
@@ -2695,8 +2991,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;
@@ -2713,7 +3009,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;
@@ -2723,7 +3019,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();
@@ -2766,7 +3062,7 @@ function bindTraitStateGetter(getter) {
   }
 }
 exposeOnWindow();
-var MarkdownContent = React110__default.memo(
+var MarkdownContent = React112__default.memo(
   ({ content, direction, className }) => {
     const { t: _t } = useTranslate();
     const safeContent = typeof content === "string" ? content : String(content ?? "");
@@ -2868,7 +3164,7 @@ var MarkdownContent = React110__default.memo(
   (prev, next) => prev.content === next.content && prev.className === next.className && prev.direction === next.direction
 );
 MarkdownContent.displayName = "MarkdownContent";
-var CodeBlock = React110__default.memo(
+var CodeBlock = React112__default.memo(
   ({
     code: rawCode,
     language = "text",
@@ -2985,12 +3281,12 @@ GameAudioContext.displayName = "GameAudioContext";
 
 // components/organisms/component-registry.generated.ts
 function lazyThree(name, loader) {
-  const Lazy = React110__default.lazy(() => loader().then((m) => ({ default: m[name] })));
+  const Lazy = React112__default.lazy(() => loader().then((m) => ({ default: m[name] })));
   function ThreeWrapper(props) {
-    return React110__default.createElement(
-      React110__default.Suspense,
+    return React112__default.createElement(
+      React112__default.Suspense,
       { fallback: null },
-      React110__default.createElement(Lazy, props)
+      React112__default.createElement(Lazy, props)
     );
   }
   ThreeWrapper.displayName = `Lazy(${name})`;
@@ -3017,7 +3313,7 @@ function SuspenseConfigProvider({
   config,
   children
 }) {
-  return React110__default.createElement(
+  return React112__default.createElement(
     SuspenseConfigContext.Provider,
     { value: config },
     children
@@ -3090,7 +3386,7 @@ function VerificationProvider({
         })) : [];
         recordTransition({
           traitName: parsed.traitName,
-          from: pending?.from ?? "unknown",
+          from: pending?.from ?? (parsed.event === "INIT" ? "init" : "unknown"),
           to: newState,
           event: parsed.event,
           effects,