@almadar/ui 2.31.0 → 2.33.2

package/dist/components/index.js

@@ -1,5 +1,5 @@
-import * as React91 from 'react';
-import React91__default, { useCallback, createContext, useState, useRef, useEffect, useLayoutEffect, 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';
@@ -17,7 +17,6 @@ import dark from 'react-syntax-highlighter/dist/esm/styles/prism/vsc-dark-plus';
 import { MapContainer, TileLayer, Marker, Popup, useMap } from 'react-leaflet';
 import L from 'leaflet';
 import 'leaflet/dist/leaflet.css';
-import { Handle, Position, getBezierPath, BaseEdge, EdgeLabelRenderer } from '@xyflow/react';
 import { useUISlots } from '@almadar/ui/context';
 import { getComponentForPattern as getComponentForPattern$1 } from '@almadar/patterns';
 import { Link, Outlet, useLocation } from 'react-router-dom';
@@ -270,7 +269,7 @@ function resolveIconProp(value, sizeClass) {
     const IconComp = value;
     return /* @__PURE__ */ jsx(IconComp, { className: sizeClass });
   }
-  if (React91__default.isValidElement(value)) {
+  if (React90__default.isValidElement(value)) {
     return value;
   }
   if (typeof value === "object" && value !== null && "render" in value) {
@@ -279,7 +278,7 @@ function resolveIconProp(value, sizeClass) {
   }
   return value;
 }
-var Button = React91__default.forwardRef(
+var Button = React90__default.forwardRef(
   ({
     className,
     variant = "primary",
@@ -338,7 +337,7 @@ var Button = React91__default.forwardRef(
   }
 );
 Button.displayName = "Button";
-var Input = React91__default.forwardRef(
+var Input = React90__default.forwardRef(
   ({
     className,
     inputType,
@@ -450,7 +449,7 @@ var Input = React91__default.forwardRef(
   }
 );
 Input.displayName = "Input";
-var Label = React91__default.forwardRef(
+var Label = React90__default.forwardRef(
   ({ className, required, children, ...props }, ref) => {
     return /* @__PURE__ */ jsxs(
       "label",
@@ -470,7 +469,7 @@ var Label = React91__default.forwardRef(
   }
 );
 Label.displayName = "Label";
-var Textarea = React91__default.forwardRef(
+var Textarea = React90__default.forwardRef(
   ({ className, error, ...props }, ref) => {
     return /* @__PURE__ */ jsx(
       "textarea",
@@ -493,7 +492,7 @@ var Textarea = React91__default.forwardRef(
   }
 );
 Textarea.displayName = "Textarea";
-var Select = React91__default.forwardRef(
+var Select = React90__default.forwardRef(
   ({ className, options, placeholder, error, ...props }, ref) => {
     return /* @__PURE__ */ jsxs("div", { className: "relative", children: [
       /* @__PURE__ */ jsxs(
@@ -529,7 +528,7 @@ var Select = React91__default.forwardRef(
   }
 );
 Select.displayName = "Select";
-var Checkbox = React91__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: [
@@ -605,7 +604,7 @@ var shadowStyles = {
   md: "shadow",
   lg: "shadow-lg"
 };
-var Card = React91__default.forwardRef(
+var Card = React90__default.forwardRef(
   ({
     className,
     variant = "bordered",
@@ -641,9 +640,9 @@ var Card = React91__default.forwardRef(
   }
 );
 Card.displayName = "Card";
-var CardHeader = React91__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 = React91__default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+var CardTitle = React90__default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
   "h3",
   {
     ref,
@@ -656,11 +655,11 @@ var CardTitle = React91__default.forwardRef(({ className, ...props }, ref) => /*
   }
 ));
 CardTitle.displayName = "CardTitle";
-var CardContent = React91__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 = React91__default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+var CardFooter = React90__default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
   "div",
   {
     ref,
@@ -706,7 +705,7 @@ var sizeStyles2 = {
   md: "px-2.5 py-1 text-sm",
   lg: "px-3 py-1.5 text-base"
 };
-var Badge = React91__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" ? (() => {
@@ -739,7 +738,7 @@ var sizeStyles3 = {
   md: "h-6 w-6",
   lg: "h-8 w-8"
 };
-var Spinner = React91__default.forwardRef(
+var Spinner = React90__default.forwardRef(
   ({ className, size = "md", ...props }, ref) => {
     return /* @__PURE__ */ jsx(
       "div",
@@ -1004,7 +1003,7 @@ var positionStyles = {
   fixed: "fixed",
   sticky: "sticky"
 };
-var Box = React91__default.forwardRef(
+var Box = React90__default.forwardRef(
   ({
     padding,
     paddingX,
@@ -1351,7 +1350,7 @@ var ProgressBar = ({
   return null;
 };
 ProgressBar.displayName = "ProgressBar";
-var Radio = React91__default.forwardRef(
+var Radio = React90__default.forwardRef(
   ({
     label,
     helperText,
@@ -1455,7 +1454,7 @@ var Radio = React91__default.forwardRef(
   }
 );
 Radio.displayName = "Radio";
-var Switch = React91.forwardRef(
+var Switch = React90.forwardRef(
   ({
     checked,
     defaultChecked = false,
@@ -1466,10 +1465,10 @@ var Switch = React91.forwardRef(
     name,
     className
   }, ref) => {
-    const [isChecked, setIsChecked] = React91.useState(
+    const [isChecked, setIsChecked] = React90.useState(
       checked !== void 0 ? checked : defaultChecked
     );
-    React91.useEffect(() => {
+    React90.useEffect(() => {
       if (checked !== void 0) {
         setIsChecked(checked);
       }
@@ -1775,7 +1774,7 @@ var Typography = ({
   align,
   weight,
   size,
-  truncate: truncate2 = false,
+  truncate = false,
   overflow,
   as,
   id,
@@ -1797,7 +1796,7 @@ var Typography = ({
         weight && weightStyles[weight],
         size && typographySizeStyles[size],
         align && `text-${align}`,
-        truncate2 && "truncate overflow-hidden text-ellipsis",
+        truncate && "truncate overflow-hidden text-ellipsis",
         overflow && overflowStyles2[overflow],
         className
       ),
@@ -2171,10 +2170,11 @@ var Overlay = ({
     "div",
     {
       className: cn(
-        "fixed inset-0 z-40 bg-black/50",
+        "fixed inset-0 z-40",
         blur && "backdrop-blur-sm",
         className
       ),
+      style: { backgroundColor: "rgba(0, 0, 0, 0.6)" },
       onClick: action || onClick ? handleClick : void 0,
       "aria-hidden": "true"
     }
@@ -2263,8 +2263,8 @@ var LawReferenceTooltip = ({
   position = "top",
   className
 }) => {
-  const [isVisible, setIsVisible] = React91__default.useState(false);
-  const timeoutRef = React91__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);
@@ -2273,7 +2273,7 @@ var LawReferenceTooltip = ({
     if (timeoutRef.current) clearTimeout(timeoutRef.current);
     setIsVisible(false);
   };
-  React91__default.useEffect(() => {
+  React90__default.useEffect(() => {
     return () => {
       if (timeoutRef.current) clearTimeout(timeoutRef.current);
     };
@@ -2461,7 +2461,7 @@ var sizeStyles5 = {
   md: "w-2.5 h-2.5",
   lg: "w-3 h-3"
 };
-var StatusDot = React91__default.forwardRef(
+var StatusDot = React90__default.forwardRef(
   ({ className, status = "offline", pulse = false, size = "md", label, ...props }, ref) => {
     return /* @__PURE__ */ jsx(
       "span",
@@ -2508,7 +2508,7 @@ var iconMap = {
   down: TrendingDown,
   flat: ArrowRight
 };
-var TrendIndicator = React91__default.forwardRef(
+var TrendIndicator = React90__default.forwardRef(
   ({
     className,
     value,
@@ -2567,7 +2567,7 @@ var thumbSizes = {
   md: "w-4 h-4",
   lg: "w-5 h-5"
 };
-var RangeSlider = React91__default.forwardRef(
+var RangeSlider = React90__default.forwardRef(
   ({
     className,
     min = 0,
@@ -3099,7 +3099,7 @@ var paddingClasses = {
   md: "py-16",
   lg: "py-24"
 };
-var ContentSection = React91__default.forwardRef(
+var ContentSection = React90__default.forwardRef(
   ({ children, background = "default", padding = "lg", id, className }, ref) => {
     return /* @__PURE__ */ jsx(
       Box,
@@ -3620,7 +3620,7 @@ var animatedStyles = {
   "scale-up": { opacity: 1, transform: "scale(1) translateY(0)" },
   "none": {}
 };
-var AnimatedReveal = React91__default.forwardRef(
+var AnimatedReveal = React90__default.forwardRef(
   ({
     trigger = "scroll",
     animation = "fade-up",
@@ -3773,7 +3773,7 @@ function applyMorphAnimation(container, animate, duration, delay, easing) {
     el.style.opacity = animate ? "1" : "0";
   });
 }
-var AnimatedGraphic = React91__default.forwardRef(
+var AnimatedGraphic = React90__default.forwardRef(
   ({
     src,
     svgContent,
@@ -3796,7 +3796,7 @@ var AnimatedGraphic = React91__default.forwardRef(
     const fetchedSvg = useFetchedSvg(svgContent ? void 0 : src);
     const resolvedSvg = svgContent ?? fetchedSvg;
     const prevAnimateRef = useRef(animate);
-    const setRef = React91__default.useCallback(
+    const setRef = React90__default.useCallback(
       (node) => {
         containerRef.current = node;
         if (typeof ref === "function") ref(node);
@@ -3967,9 +3967,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] = React91.useState(resolvedValue);
-  const [isAnimating, setIsAnimating] = React91.useState(false);
-  React91.useEffect(() => {
+  const [displayValue, setDisplayValue] = React90.useState(resolvedValue);
+  const [isAnimating, setIsAnimating] = React90.useState(false);
+  React90.useEffect(() => {
     if (!animated || displayValue === resolvedValue) {
       setDisplayValue(resolvedValue);
       return;
@@ -4042,9 +4042,9 @@ function ControlButton({
   className
 }) {
   const eventBus = useEventBus();
-  const [isPressed, setIsPressed] = React91.useState(false);
+  const [isPressed, setIsPressed] = React90.useState(false);
   const actualPressed = pressed ?? isPressed;
-  const handlePointerDown = React91.useCallback(
+  const handlePointerDown = React90.useCallback(
     (e) => {
       e.preventDefault();
       if (disabled) return;
@@ -4054,7 +4054,7 @@ function ControlButton({
     },
     [disabled, pressEvent, eventBus, onPress]
   );
-  const handlePointerUp = React91.useCallback(
+  const handlePointerUp = React90.useCallback(
     (e) => {
       e.preventDefault();
       if (disabled) return;
@@ -4064,7 +4064,7 @@ function ControlButton({
     },
     [disabled, releaseEvent, eventBus, onRelease]
   );
-  const handlePointerLeave = React91.useCallback(
+  const handlePointerLeave = React90.useCallback(
     (e) => {
       if (isPressed) {
         setIsPressed(false);
@@ -4890,9 +4890,9 @@ function MiniMap({
   viewportRect,
   className
 }) {
-  const canvasRef = React91.useRef(null);
-  const frameRef = React91.useRef(0);
-  React91.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");
@@ -4967,225 +4967,6 @@ function MiniMap({
   );
 }
 MiniMap.displayName = "MiniMap";
-var FlowPort = ({
-  direction,
-  portType,
-  label,
-  connected = false,
-  compatible = false,
-  className
-}) => {
-  const dot = /* @__PURE__ */ jsx(
-    Box,
-    {
-      className: cn(
-        "w-3 h-3 rounded-full shrink-0 transition-all duration-150",
-        connected ? "bg-primary" : "bg-transparent border-[length:var(--border-width)] border-muted-foreground",
-        compatible && "ring-2 ring-success ring-offset-1 ring-offset-background",
-        className
-      ),
-      role: "presentation",
-      "aria-label": `${direction} port: ${portType}`
-    }
-  );
-  if (!label) return dot;
-  return /* @__PURE__ */ jsxs(HStack, { gap: "xs", align: "center", className: cn(direction === "in" ? "flex-row-reverse" : "flex-row"), children: [
-    dot,
-    /* @__PURE__ */ jsx(Typography, { variant: "caption", className: "text-muted-foreground select-none whitespace-nowrap", children: label })
-  ] });
-};
-FlowPort.displayName = "FlowPort";
-var FlowNodeShell = ({
-  selected = false,
-  warning = false,
-  nodeType,
-  headerColor = "var(--color-primary)",
-  children,
-  className
-}) => /* @__PURE__ */ jsxs(
-  Box,
-  {
-    className: cn(
-      "rounded-md overflow-hidden bg-card",
-      "border-[length:var(--border-width)] border-border",
-      "shadow-sm transition-shadow duration-150 min-w-[140px]",
-      selected && "ring-2 ring-primary",
-      warning && !selected && "ring-2 ring-dashed ring-warning",
-      className
-    ),
-    children: [
-      /* @__PURE__ */ jsx(
-        Box,
-        {
-          className: "flex items-center px-2",
-          style: { backgroundColor: headerColor, height: 8 },
-          children: nodeType && /* @__PURE__ */ jsx(
-            Typography,
-            {
-              variant: "caption",
-              className: "text-white/90 font-semibold select-none leading-none sr-only",
-              children: nodeType
-            }
-          )
-        }
-      ),
-      nodeType && /* @__PURE__ */ jsx(Box, { className: "px-2 pt-1.5 pb-0.5", children: /* @__PURE__ */ jsx(Typography, { variant: "caption", className: "text-muted-foreground font-semibold uppercase tracking-wider select-none", children: nodeType }) }),
-      /* @__PURE__ */ jsx(Box, { className: "px-2 pb-2", children })
-    ]
-  }
-);
-FlowNodeShell.displayName = "FlowNodeShell";
-var variantToBadge = {
-  default: "neutral",
-  primary: "primary",
-  warning: "warning",
-  error: "danger"
-};
-var FlowLabel = ({
-  text,
-  truncate: truncate2,
-  variant = "default",
-  className
-}) => {
-  const isTruncated = truncate2 != null && text.length > truncate2;
-  const display = isTruncated ? `${text.slice(0, truncate2)}...` : text;
-  return /* @__PURE__ */ jsx(
-    Badge,
-    {
-      variant: variantToBadge[variant],
-      size: "sm",
-      className: cn("max-w-[180px] cursor-default", className),
-      title: isTruncated ? text : void 0,
-      children: display
-    }
-  );
-};
-FlowLabel.displayName = "FlowLabel";
-
-// components/atoms/avl/types.ts
-var AVL_OPERATOR_COLORS = {
-  arithmetic: "#4A90D9",
-  comparison: "#E8913A",
-  logic: "#9B59B6",
-  string: "#27AE60",
-  collection: "#1ABC9C",
-  time: "#F39C12",
-  control: "#E74C3C",
-  async: "#E91E8F"
-};
-var STATE_COLORS = {
-  initial: { fill: "#22C55E1F", border: "#16A34A" },
-  terminal: { fill: "#EF44441F", border: "#DC2626" },
-  hub: { fill: "#3B82F61F", border: "#2563EB" },
-  error: { fill: "#F59E0B1F", border: "#D97706" },
-  default: { fill: "#6B72801F", border: "#4B5563" }
-};
-var EFFECT_CATEGORY_COLORS = {
-  ui: { color: "#8B5CF6", bg: "#8B5CF614" },
-  data: { color: "#3B82F6", bg: "#3B82F614" },
-  communication: { color: "#F97316", bg: "#F9731614" },
-  lifecycle: { color: "#10B981", bg: "#10B98114" },
-  control: { color: "#6B7280", bg: "#6B728014" }
-};
-var EFFECT_TYPE_TO_CATEGORY = {
-  "render-ui": "ui",
-  "navigate": "ui",
-  "set": "data",
-  "persist": "data",
-  "fetch": "data",
-  "emit": "communication",
-  "notify": "communication",
-  "call-service": "communication",
-  "spawn": "lifecycle",
-  "despawn": "lifecycle",
-  "do": "control",
-  "if": "control",
-  "log": "control"
-};
-var CONNECTION_COLORS = {
-  forward: { color: "#1E293B", width: 2, dash: "none" },
-  backward: { color: "#94A3B8", width: 1.5, dash: "6 3" },
-  emitListen: { color: "#F97316", width: 1.5, dash: "4 3" }
-};
-var wireTypeToColor = {
-  transition: CONNECTION_COLORS.forward.color,
-  event: CONNECTION_COLORS.emitListen.color,
-  data: "#3B82F6",
-  guard: "#9B59B6"
-};
-var wireTypeToWidth = {
-  transition: CONNECTION_COLORS.forward.width,
-  event: CONNECTION_COLORS.emitListen.width,
-  data: 1.5,
-  guard: 1.5
-};
-var wireTypeToDash = {
-  transition: void 0,
-  event: CONNECTION_COLORS.emitListen.dash,
-  data: "5 3",
-  guard: "3 3"
-};
-function getFlowWireStyle(props) {
-  const { wireType = "transition", status = "valid", animated = false } = props;
-  let stroke = wireTypeToColor[wireType];
-  if (status === "invalid") {
-    stroke = "var(--color-destructive, #EF4444)";
-  }
-  const strokeWidth = wireTypeToWidth[wireType];
-  let strokeDasharray = wireTypeToDash[wireType];
-  if (status === "pending") {
-    strokeDasharray = "6 4";
-  }
-  const animation = animated || status === "pending" ? "flow-wire-dash 1s linear infinite" : void 0;
-  return { stroke, strokeWidth, strokeDasharray, animation };
-}
-var FlowWire = ({
-  wireType = "transition",
-  status = "valid",
-  animated = false,
-  d,
-  className
-}) => {
-  const style = getFlowWireStyle({ wireType, status, animated });
-  return /* @__PURE__ */ jsx(
-    "path",
-    {
-      d,
-      fill: "none",
-      stroke: style.stroke,
-      strokeWidth: style.strokeWidth,
-      strokeDasharray: style.strokeDasharray,
-      className: cn(
-        "transition-colors duration-150",
-        (animated || status === "pending") && "animate-[flow-wire-dash_1s_linear_infinite]",
-        className
-      ),
-      style: style.animation ? { animation: style.animation } : void 0
-    }
-  );
-};
-FlowWire.displayName = "FlowWire";
-var MINIMAP_COLORS = {
-  nodeColor: "var(--color-primary, #3B82F6)",
-  maskColor: "var(--color-background, #ffffff80)",
-  nodeStrokeColor: "var(--color-border, #E5E7EB)"
-};
-var FlowMinimap = ({
-  className,
-  children
-}) => /* @__PURE__ */ jsx(
-  Box,
-  {
-    className: cn(
-      "rounded-md overflow-hidden",
-      "bg-card border-[length:var(--border-width)] border-border",
-      "shadow-sm",
-      className
-    ),
-    children
-  }
-);
-FlowMinimap.displayName = "FlowMinimap";
 
 // locales/en.json
 var en_default = {
@@ -5352,7 +5133,7 @@ var ErrorState = ({
   );
 };
 ErrorState.displayName = "ErrorState";
-var ErrorBoundary = class extends React91__default.Component {
+var ErrorBoundary = class extends React90__default.Component {
   constructor(props) {
     super(props);
     __publicField(this, "reset", () => {
@@ -7088,8 +6869,8 @@ var Menu = ({
     "bottom-start": "top-full left-0 mt-2",
     "bottom-end": "top-full right-0 mt-2"
   };
-  const triggerChild = React91__default.isValidElement(trigger) ? trigger : /* @__PURE__ */ jsx("span", { children: trigger });
-  const triggerElement = React91__default.cloneElement(
+  const triggerChild = React90__default.isValidElement(trigger) ? trigger : /* @__PURE__ */ jsx("span", { children: trigger });
+  const triggerElement = React90__default.cloneElement(
     triggerChild,
     {
       ref: triggerRef,
@@ -7188,11 +6969,18 @@ var Menu = ({
 Menu.displayName = "Menu";
 var sizeClasses5 = {
   sm: "max-w-md",
-  md: "max-w-lg",
-  lg: "max-w-2xl",
-  xl: "max-w-4xl",
+  md: "max-w-2xl",
+  lg: "max-w-3xl",
+  xl: "max-w-5xl",
   full: "max-w-full mx-4"
 };
+var minWidths = {
+  sm: "400px",
+  md: "520px",
+  lg: "600px",
+  xl: "700px",
+  full: "0"
+};
 var Modal = ({
   isOpen = true,
   onClose = () => {
@@ -7266,102 +7054,113 @@ var Modal = ({
         className: "z-40"
       }
     ),
-    /* @__PURE__ */ jsx("div", { className: cn(
-      "fixed inset-0 z-50 pointer-events-none",
-      "flex items-center justify-center p-4",
-      "max-sm:items-end max-sm:p-0"
-    ), children: /* @__PURE__ */ jsxs(
-      Box,
+    /* @__PURE__ */ jsx(
+      "div",
       {
-        ref: modalRef,
-        bg: "surface",
-        border: true,
-        shadow: "lg",
-        rounded: "md",
         className: cn(
-          "pointer-events-auto w-full flex flex-col max-h-[90vh]",
-          sizeClasses5[size],
-          "max-sm:max-w-full max-sm:max-h-[85vh] max-sm:rounded-b-none max-sm:rounded-t-2xl",
-          className
+          "fixed inset-0 z-50 pointer-events-none",
+          "flex items-start justify-center px-4 pb-4",
+          "max-sm:items-end max-sm:p-0"
         ),
-        style: dragY > 0 ? {
-          transform: `translateY(${dragY}px)`,
-          transition: isDragging.current ? "none" : "transform 200ms ease-out"
-        } : void 0,
-        role: "dialog",
-        "aria-modal": "true",
-        ...title && { "aria-labelledby": "modal-title" },
-        children: [
-          /* @__PURE__ */ jsx(
-            "div",
-            {
-              className: "hidden max-sm:flex justify-center py-2 cursor-grab active:cursor-grabbing touch-none",
-              onPointerDown: (e) => {
-                if (!swipeDownToClose) return;
-                dragStartY.current = e.clientY;
-                isDragging.current = true;
-                e.target.setPointerCapture(e.pointerId);
-              },
-              onPointerMove: (e) => {
-                if (!isDragging.current) return;
-                const dy = Math.max(0, e.clientY - dragStartY.current);
-                setDragY(dy);
-              },
-              onPointerUp: () => {
-                if (!isDragging.current) return;
-                isDragging.current = false;
-                if (dragY > 100) {
-                  handleClose();
+        style: { paddingTop: "10vh" },
+        children: /* @__PURE__ */ jsxs(
+          Box,
+          {
+            ref: modalRef,
+            bg: "surface",
+            border: true,
+            shadow: "lg",
+            rounded: "md",
+            className: cn(
+              "pointer-events-auto w-full flex flex-col",
+              sizeClasses5[size],
+              "max-sm:max-w-full max-sm:rounded-b-none max-sm:rounded-t-2xl",
+              className
+            ),
+            style: {
+              minWidth: minWidths[size],
+              maxHeight: "80vh",
+              ...dragY > 0 && {
+                transform: `translateY(${dragY}px)`,
+                transition: isDragging.current ? "none" : "transform 200ms ease-out"
+              }
+            },
+            role: "dialog",
+            "aria-modal": "true",
+            ...title && { "aria-labelledby": "modal-title" },
+            children: [
+              /* @__PURE__ */ jsx(
+                "div",
+                {
+                  className: "hidden max-sm:flex justify-center py-2 cursor-grab active:cursor-grabbing touch-none",
+                  onPointerDown: (e) => {
+                    if (!swipeDownToClose) return;
+                    dragStartY.current = e.clientY;
+                    isDragging.current = true;
+                    e.target.setPointerCapture(e.pointerId);
+                  },
+                  onPointerMove: (e) => {
+                    if (!isDragging.current) return;
+                    const dy = Math.max(0, e.clientY - dragStartY.current);
+                    setDragY(dy);
+                  },
+                  onPointerUp: () => {
+                    if (!isDragging.current) return;
+                    isDragging.current = false;
+                    if (dragY > 100) {
+                      handleClose();
+                    }
+                    setDragY(0);
+                  },
+                  onPointerCancel: () => {
+                    isDragging.current = false;
+                    setDragY(0);
+                  },
+                  children: /* @__PURE__ */ jsx("div", { className: "w-10 h-1 rounded-full bg-border" })
                 }
-                setDragY(0);
-              },
-              onPointerCancel: () => {
-                isDragging.current = false;
-                setDragY(0);
-              },
-              children: /* @__PURE__ */ jsx("div", { className: "w-10 h-1 rounded-full bg-border" })
-            }
-          ),
-          (title || showCloseButton) && /* @__PURE__ */ jsxs(
-            "div",
-            {
-              className: cn(
-                "px-6 py-4 flex items-center justify-between",
-                "border-b-[length:var(--border-width)] border-border"
               ),
-              children: [
-                title && /* @__PURE__ */ jsx(Typography, { variant: "h4", as: "h2", id: "modal-title", children: title }),
-                showCloseButton && /* @__PURE__ */ jsx(
-                  "button",
-                  {
-                    type: "button",
-                    onClick: handleClose,
-                    "data-event": "CLOSE",
-                    className: cn(
-                      "p-1 transition-colors rounded-sm",
-                      "hover:bg-muted"
-                    ),
-                    "aria-label": "Close modal",
-                    children: /* @__PURE__ */ jsx(Icon, { icon: X, size: "md" })
-                  }
-                )
-              ]
-            }
-          ),
-          /* @__PURE__ */ jsx("div", { className: "flex-1 overflow-y-auto p-6", children }),
-          footer && /* @__PURE__ */ jsx(
-            "div",
-            {
-              className: cn(
-                "px-6 py-4 bg-muted",
-                "border-t-[length:var(--border-width)] border-border"
+              (title || showCloseButton) && /* @__PURE__ */ jsxs(
+                "div",
+                {
+                  className: cn(
+                    "px-6 py-4 flex items-center justify-between",
+                    "border-b-[length:var(--border-width)] border-border"
+                  ),
+                  children: [
+                    title && /* @__PURE__ */ jsx(Typography, { variant: "h4", as: "h2", id: "modal-title", children: title }),
+                    showCloseButton && /* @__PURE__ */ jsx(
+                      "button",
+                      {
+                        type: "button",
+                        onClick: handleClose,
+                        "data-event": "CLOSE",
+                        className: cn(
+                          "p-1 transition-colors rounded-sm",
+                          "hover:bg-muted"
+                        ),
+                        "aria-label": "Close modal",
+                        children: /* @__PURE__ */ jsx(Icon, { icon: X, size: "md" })
+                      }
+                    )
+                  ]
+                }
               ),
-              children: footer
-            }
-          )
-        ]
+              /* @__PURE__ */ jsx("div", { className: "flex-1 overflow-y-auto p-6", children }),
+              footer && /* @__PURE__ */ jsx(
+                "div",
+                {
+                  className: cn(
+                    "px-6 py-4 bg-muted",
+                    "border-t-[length:var(--border-width)] border-border"
+                  ),
+                  children: footer
+                }
+              )
+            ]
+          }
+        )
       }
-    ) })
+    )
   ] });
 };
 Modal.displayName = "Modal";
@@ -7594,8 +7393,8 @@ var Popover = ({
     onMouseEnter: handleOpen,
     onMouseLeave: handleClose
   };
-  const childElement = React91__default.isValidElement(children) ? children : /* @__PURE__ */ jsx("span", { children });
-  const triggerElement = React91__default.cloneElement(
+  const childElement = React90__default.isValidElement(children) ? children : /* @__PURE__ */ jsx("span", { children });
+  const triggerElement = React90__default.cloneElement(
     childElement,
     {
       ref: triggerRef,
@@ -8350,8 +8149,8 @@ var Tooltip = ({
       if (hideTimeoutRef.current) clearTimeout(hideTimeoutRef.current);
     };
   }, []);
-  const triggerElement = React91__default.isValidElement(children) ? children : /* @__PURE__ */ jsx("span", { children });
-  const trigger = React91__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,
@@ -8600,7 +8399,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(React91__default.Fragment, { children: [
+        return /* @__PURE__ */ jsxs(React90__default.Fragment, { children: [
           /* @__PURE__ */ jsx(
             "button",
             {
@@ -8730,7 +8529,7 @@ var WizardNavigation = ({
   );
 };
 WizardNavigation.displayName = "WizardNavigation";
-var MarkdownContent = React91__default.memo(
+var MarkdownContent = React90__default.memo(
   ({ content, direction, className }) => {
     const { t: _t } = useTranslate();
     const safeContent = typeof content === "string" ? content : String(content ?? "");
@@ -8832,7 +8631,7 @@ var MarkdownContent = React91__default.memo(
   (prev, next) => prev.content === next.content && prev.className === next.className && prev.direction === next.direction
 );
 MarkdownContent.displayName = "MarkdownContent";
-var CodeBlock = React91__default.memo(
+var CodeBlock = React90__default.memo(
   ({
     code: rawCode,
     language = "text",
@@ -9953,8 +9752,8 @@ function DPad({
 }) {
   const eventBus = useEventBus();
   const sizes = sizeMap15[size];
-  const [activeDirections, setActiveDirections] = React91.useState(/* @__PURE__ */ new Set());
-  const handlePress = React91.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 });
@@ -9962,7 +9761,7 @@ function DPad({
     },
     [directionEvent, eventBus, onDirection]
   );
-  const handleRelease = React91.useCallback(
+  const handleRelease = React90.useCallback(
     (direction) => {
       setActiveDirections((prev) => {
         const next = new Set(prev);
@@ -10020,8 +9819,8 @@ function ActionButtons({
   disabled
 }) {
   const eventBus = useEventBus();
-  const [activeButtons, setActiveButtons] = React91.useState(/* @__PURE__ */ new Set());
-  const handlePress = React91.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 });
@@ -10029,7 +9828,7 @@ function ActionButtons({
     },
     [actionEvent, eventBus, onAction]
   );
-  const handleRelease = React91.useCallback(
+  const handleRelease = React90.useCallback(
     (id) => {
       setActiveButtons((prev) => {
         const next = new Set(prev);
@@ -10214,7 +10013,7 @@ function InventoryGrid({
   const eventBus = useEventBus();
   const slotCount = totalSlots ?? items.length;
   const emptySlotCount = Math.max(0, slotCount - items.length);
-  const handleSelect = React91.useCallback(
+  const handleSelect = React90.useCallback(
     (id) => {
       onSelect?.(id);
       if (selectEvent) {
@@ -10338,7 +10137,7 @@ function CraftingRecipe({
   className
 }) {
   const eventBus = useEventBus();
-  const handleCraft = React91.useCallback(() => {
+  const handleCraft = React90.useCallback(() => {
     onCraft?.();
     if (craftEvent) {
       eventBus.emit(craftEvent, { output: output.label });
@@ -10355,7 +10154,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(React91.Fragment, { children: [
+          return /* @__PURE__ */ jsxs(React90.Fragment, { children: [
             /* @__PURE__ */ jsx(Box, { className: "relative", children: /* @__PURE__ */ jsx(
               ItemSlot,
               {
@@ -10457,15 +10256,15 @@ function GameCanvas2D({
   fps = 60,
   className
 }) {
-  const canvasRef = React91.useRef(null);
-  const rafRef = React91.useRef(0);
-  const frameRef = React91.useRef(0);
-  const lastTimeRef = React91.useRef(0);
-  const onDrawRef = React91.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 = React91.useRef(onTick);
+  const onTickRef = React90.useRef(onTick);
   onTickRef.current = onTick;
-  React91.useEffect(() => {
+  React90.useEffect(() => {
     const canvas = canvasRef.current;
     if (!canvas) return;
     const ctx = canvas.getContext("2d");
@@ -10718,7 +10517,7 @@ function TurnPanel({
   className
 }) {
   const eventBus = useEventBus();
-  const handleAction = React91.useCallback(
+  const handleAction = React90.useCallback(
     (event) => {
       if (event) {
         eventBus.emit(event, { turn: currentTurn, phase, activeTeam });
@@ -10843,7 +10642,7 @@ function UnitCommandBar({
   className
 }) {
   const eventBus = useEventBus();
-  const handleCommand = React91.useCallback(
+  const handleCommand = React90.useCallback(
     (event) => {
       if (event) {
         eventBus.emit(event, { unitId: selectedUnitId });
@@ -11382,7 +11181,7 @@ function GameMenu({
   } catch {
   }
   const eventBus = eventBusProp || eventBusFromHook;
-  const handleOptionClick = React91.useCallback(
+  const handleOptionClick = React90.useCallback(
     (option) => {
       if (option.event && eventBus) {
         eventBus.emit(`UI:${option.event}`, { option });
@@ -11505,7 +11304,7 @@ function GameOverScreen({
   } catch {
   }
   const eventBus = eventBusProp || eventBusFromHook;
-  const handleActionClick = React91.useCallback(
+  const handleActionClick = React90.useCallback(
     (action) => {
       if (action.event && eventBus) {
         eventBus.emit(`UI:${action.event}`, { action });
@@ -14321,7 +14120,7 @@ var DataList = ({
 }) => {
   const eventBus = useEventBus();
   const { t } = useTranslate();
-  const [visibleCount, setVisibleCount] = React91__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;
@@ -14358,7 +14157,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(React91__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}`;
@@ -14561,7 +14360,7 @@ var DataList = ({
         className
       ),
       children: [
-        groups.map((group, gi) => /* @__PURE__ */ jsxs(React91__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)
@@ -16293,7 +16092,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(React91__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" })
@@ -16304,7 +16103,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(React91__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 }),
@@ -17035,498 +16834,6 @@ var EdgeDecoration = ({
   )) });
 };
 EdgeDecoration.displayName = "EdgeDecoration";
-function resolveRole(data) {
-  if (data.isInitial) return "initial";
-  if (data.isTerminal) return "terminal";
-  return "default";
-}
-var FlowStateNode = ({
-  data,
-  selected = false
-}) => {
-  const role = resolveRole(data);
-  const colors = STATE_COLORS[role];
-  return /* @__PURE__ */ jsxs(
-    FlowNodeShell,
-    {
-      selected,
-      nodeType: "State",
-      headerColor: colors.border,
-      className: cn("min-w-[120px]"),
-      children: [
-        /* @__PURE__ */ jsx(
-          Handle,
-          {
-            type: "target",
-            position: Position.Top,
-            className: "!bg-muted-foreground !w-2 !h-2"
-          }
-        ),
-        /* @__PURE__ */ jsx(Typography, { variant: "body", className: "font-semibold text-center select-none", children: data.name }),
-        (data.isInitial || data.isTerminal) && /* @__PURE__ */ jsxs(HStack, { gap: "xs", justify: "center", className: "mt-1", children: [
-          data.isInitial && /* @__PURE__ */ jsx(Badge, { variant: "success", size: "sm", children: "initial" }),
-          data.isTerminal && /* @__PURE__ */ jsx(Badge, { variant: "danger", size: "sm", children: "terminal" })
-        ] }),
-        /* @__PURE__ */ jsx(
-          Handle,
-          {
-            type: "source",
-            position: Position.Bottom,
-            className: "!bg-muted-foreground !w-2 !h-2"
-          }
-        )
-      ]
-    }
-  );
-};
-FlowStateNode.displayName = "FlowStateNode";
-var OrbitalNode = ({
-  data,
-  selected = false
-}) => {
-  const handleSpacing = 24;
-  const maxPorts = Math.max(data.emits.length, data.listens.length, 1);
-  const bodyHeight = maxPorts * handleSpacing + 24;
-  return /* @__PURE__ */ jsxs(
-    FlowNodeShell,
-    {
-      selected,
-      nodeType: "Orbital",
-      headerColor: "var(--color-primary)",
-      className: cn("min-w-[180px]"),
-      children: [
-        data.listens.map((event, i) => /* @__PURE__ */ jsx(
-          Handle,
-          {
-            type: "target",
-            position: Position.Left,
-            id: `listen-${event}`,
-            className: "!bg-orange-500 !w-2 !h-2",
-            style: { top: 48 + i * handleSpacing }
-          },
-          `listen-${event}`
-        )),
-        /* @__PURE__ */ jsxs(VStack, { gap: "xs", style: { minHeight: bodyHeight }, children: [
-          /* @__PURE__ */ jsx(Typography, { variant: "body", className: "font-semibold select-none", children: data.name }),
-          /* @__PURE__ */ jsx(Typography, { variant: "caption", className: "text-muted-foreground select-none", children: data.entityName }),
-          /* @__PURE__ */ jsxs(Typography, { variant: "caption", className: "text-muted-foreground select-none", children: [
-            data.traitCount,
-            " traits, ",
-            data.pageCount,
-            " pages"
-          ] }),
-          data.listens.length > 0 && /* @__PURE__ */ jsx(VStack, { gap: "none", className: "mt-1", children: data.listens.map((event) => /* @__PURE__ */ jsx(
-            Typography,
-            {
-              variant: "caption",
-              className: "text-orange-500 select-none text-left",
-              children: event
-            },
-            event
-          )) }),
-          data.emits.length > 0 && /* @__PURE__ */ jsx(VStack, { gap: "none", className: "mt-1", children: data.emits.map((event) => /* @__PURE__ */ jsx(
-            Typography,
-            {
-              variant: "caption",
-              className: "text-orange-500 select-none text-right",
-              children: event
-            },
-            event
-          )) })
-        ] }),
-        data.emits.map((event, i) => /* @__PURE__ */ jsx(
-          Handle,
-          {
-            type: "source",
-            position: Position.Right,
-            id: `emit-${event}`,
-            className: "!bg-orange-500 !w-2 !h-2",
-            style: { top: 48 + i * handleSpacing }
-          },
-          `emit-${event}`
-        ))
-      ]
-    }
-  );
-};
-OrbitalNode.displayName = "OrbitalNode";
-var MAX_DESC = 60;
-function truncate(text, max) {
-  if (!text) return "";
-  return text.length > max ? `${text.slice(0, max)}...` : text;
-}
-var BehaviorNode = ({
-  data,
-  selected = false
-}) => {
-  const handleSpacing = 24;
-  const maxPorts = Math.max(data.emits.length, data.listens.length, 1);
-  const bodyHeight = maxPorts * handleSpacing + 24;
-  return /* @__PURE__ */ jsxs(
-    FlowNodeShell,
-    {
-      selected,
-      nodeType: "Behavior",
-      headerColor: "#10B981",
-      className: cn("min-w-[170px]"),
-      children: [
-        data.listens.map((event, i) => /* @__PURE__ */ jsx(
-          Handle,
-          {
-            type: "target",
-            position: Position.Left,
-            id: `listen-${event}`,
-            className: "!bg-orange-500 !w-2 !h-2",
-            style: { top: 48 + i * handleSpacing }
-          },
-          `listen-${event}`
-        )),
-        /* @__PURE__ */ jsxs(VStack, { gap: "xs", style: { minHeight: bodyHeight }, children: [
-          /* @__PURE__ */ jsx(Typography, { variant: "body", className: "font-semibold select-none", children: data.name }),
-          data.description && /* @__PURE__ */ jsx(Box, { title: data.description.length > MAX_DESC ? data.description : void 0, children: /* @__PURE__ */ jsx(
-            Typography,
-            {
-              variant: "caption",
-              className: "text-muted-foreground select-none",
-              children: truncate(data.description, MAX_DESC)
-            }
-          ) }),
-          /* @__PURE__ */ jsxs(Typography, { variant: "caption", className: "text-muted-foreground select-none", children: [
-            data.stateCount,
-            " states"
-          ] })
-        ] }),
-        data.emits.map((event, i) => /* @__PURE__ */ jsx(
-          Handle,
-          {
-            type: "source",
-            position: Position.Right,
-            id: `emit-${event}`,
-            className: "!bg-orange-500 !w-2 !h-2",
-            style: { top: 48 + i * handleSpacing }
-          },
-          `emit-${event}`
-        ))
-      ]
-    }
-  );
-};
-BehaviorNode.displayName = "BehaviorNode";
-var ExprNode = ({
-  data,
-  selected = false
-}) => {
-  const ns = data.namespace ?? "arithmetic";
-  const headerColor = AVL_OPERATOR_COLORS[ns];
-  const handleSpacing = 22;
-  const bodyHeight = Math.max(data.operandCount, 1) * handleSpacing + 12;
-  return /* @__PURE__ */ jsxs(
-    FlowNodeShell,
-    {
-      selected,
-      nodeType: "Expr",
-      headerColor,
-      className: cn("min-w-[100px]"),
-      children: [
-        Array.from({ length: data.operandCount }, (_, i) => /* @__PURE__ */ jsx(
-          Handle,
-          {
-            type: "target",
-            position: Position.Left,
-            id: `operand-${i}`,
-            className: "!w-2 !h-2",
-            style: {
-              top: 40 + i * handleSpacing,
-              backgroundColor: headerColor
-            }
-          },
-          `op-${i}`
-        )),
-        /* @__PURE__ */ jsx(
-          Typography,
-          {
-            variant: "body",
-            className: "font-mono font-bold text-center select-none",
-            style: { color: headerColor, minHeight: bodyHeight },
-            children: data.operator
-          }
-        ),
-        /* @__PURE__ */ jsx(
-          Handle,
-          {
-            type: "source",
-            position: Position.Right,
-            id: "result",
-            className: "!w-2 !h-2",
-            style: { backgroundColor: headerColor }
-          }
-        )
-      ]
-    }
-  );
-};
-ExprNode.displayName = "ExprNode";
-var EFFECT_ICONS = {
-  "render-ui": "\u229E",
-  // grid
-  "set": "\u270E",
-  // pencil
-  "persist": "\u26C1",
-  // cylinder
-  "fetch": "\u21E3",
-  // down arrow
-  "emit": "\u{1F4E1}",
-  // antenna
-  "navigate": "\u21E2",
-  // right arrow
-  "notify": "\u{1F514}",
-  // bell
-  "call-service": "\u21C4",
-  // bidirectional
-  "spawn": "\u2295",
-  // plus circle
-  "despawn": "\u2296",
-  // minus circle
-  "do": "\u25B6",
-  // play
-  "if": "\u25C7",
-  // diamond
-  "log": "\xB6"
-  // pilcrow
-};
-function resolveCategory(data) {
-  if (data.category) return data.category;
-  const mapped = EFFECT_TYPE_TO_CATEGORY[data.effectType];
-  return mapped ?? "control";
-}
-var EffectNode = ({
-  data,
-  selected = false
-}) => {
-  const category = resolveCategory(data);
-  const colors = EFFECT_CATEGORY_COLORS[category];
-  const icon = EFFECT_ICONS[data.effectType] ?? "\u2022";
-  return /* @__PURE__ */ jsxs(
-    FlowNodeShell,
-    {
-      selected,
-      nodeType: "Effect",
-      headerColor: colors.color,
-      className: cn("min-w-[120px]"),
-      children: [
-        /* @__PURE__ */ jsx(
-          Handle,
-          {
-            type: "target",
-            position: Position.Left,
-            className: "!w-2 !h-2",
-            style: { backgroundColor: colors.color }
-          }
-        ),
-        /* @__PURE__ */ jsxs(HStack, { gap: "xs", align: "center", children: [
-          /* @__PURE__ */ jsx(
-            Typography,
-            {
-              variant: "body",
-              className: "select-none",
-              style: { color: colors.color },
-              children: icon
-            }
-          ),
-          /* @__PURE__ */ jsx(Typography, { variant: "body", className: "font-semibold select-none", children: data.effectType })
-        ] }),
-        data.args && /* @__PURE__ */ jsx(Typography, { variant: "caption", className: "text-muted-foreground select-none mt-0.5 truncate max-w-[160px]", children: data.args }),
-        /* @__PURE__ */ jsx(
-          Handle,
-          {
-            type: "source",
-            position: Position.Right,
-            className: "!w-2 !h-2",
-            style: { backgroundColor: colors.color }
-          }
-        )
-      ]
-    }
-  );
-};
-EffectNode.displayName = "EffectNode";
-var TransitionEdge = ({
-  id,
-  sourceX,
-  sourceY,
-  targetX,
-  targetY,
-  sourcePosition,
-  targetPosition,
-  data,
-  markerEnd,
-  style
-}) => {
-  const [edgePath, labelX, labelY] = getBezierPath({
-    sourceX,
-    sourceY,
-    targetX,
-    targetY,
-    sourcePosition,
-    targetPosition
-  });
-  const isBackward = targetX < sourceX;
-  const connStyle = isBackward ? CONNECTION_COLORS.backward : CONNECTION_COLORS.forward;
-  return /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsx(
-      BaseEdge,
-      {
-        id,
-        path: edgePath,
-        markerEnd,
-        style: {
-          stroke: connStyle.color,
-          strokeWidth: connStyle.width,
-          strokeDasharray: connStyle.dash,
-          ...style
-        }
-      }
-    ),
-    /* @__PURE__ */ jsx(EdgeLabelRenderer, { children: /* @__PURE__ */ jsxs(
-      Box,
-      {
-        className: cn(
-          "absolute pointer-events-all nodrag nopan",
-          "flex items-center gap-1"
-        ),
-        style: {
-          transform: `translate(-50%, -50%) translate(${labelX}px, ${labelY}px)`
-        },
-        children: [
-          data?.hasGuard && /* @__PURE__ */ jsx(
-            Box,
-            {
-              className: "w-3 h-3 rotate-45 border border-amber-500 bg-amber-500/10 shrink-0",
-              title: "Has guard"
-            }
-          ),
-          /* @__PURE__ */ jsx(
-            FlowLabel,
-            {
-              text: data?.event ?? "",
-              truncate: 20,
-              variant: "default"
-            }
-          ),
-          data?.hasEffects && /* @__PURE__ */ jsx(
-            Box,
-            {
-              className: "w-2.5 h-2.5 rounded-full bg-violet-500/80 shrink-0",
-              title: "Has effects"
-            }
-          )
-        ]
-      }
-    ) })
-  ] });
-};
-TransitionEdge.displayName = "TransitionEdge";
-var EventWireEdge = ({
-  id,
-  sourceX,
-  sourceY,
-  targetX,
-  targetY,
-  sourcePosition,
-  targetPosition,
-  data,
-  markerEnd,
-  style
-}) => {
-  const [edgePath, labelX, labelY] = getBezierPath({
-    sourceX,
-    sourceY,
-    targetX,
-    targetY,
-    sourcePosition,
-    targetPosition
-  });
-  const isCompatible = data?.compatible !== false;
-  const wireColor = isCompatible ? CONNECTION_COLORS.emitListen.color : "#EF4444";
-  return /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsx(
-      BaseEdge,
-      {
-        id,
-        path: edgePath,
-        markerEnd,
-        style: {
-          stroke: wireColor,
-          strokeWidth: CONNECTION_COLORS.emitListen.width,
-          strokeDasharray: CONNECTION_COLORS.emitListen.dash,
-          ...style
-        }
-      }
-    ),
-    /* @__PURE__ */ jsx(EdgeLabelRenderer, { children: /* @__PURE__ */ jsx(
-      Box,
-      {
-        className: cn(
-          "absolute pointer-events-all nodrag nopan",
-          "flex items-center"
-        ),
-        style: {
-          transform: `translate(-50%, -50%) translate(${labelX}px, ${labelY}px)`
-        },
-        children: /* @__PURE__ */ jsx(
-          FlowLabel,
-          {
-            text: data?.event ?? "",
-            truncate: 24,
-            variant: isCompatible ? "primary" : "error"
-          }
-        )
-      }
-    ) })
-  ] });
-};
-EventWireEdge.displayName = "EventWireEdge";
-var NodePalette = ({
-  categories,
-  className
-}) => {
-  const handleDragStart = useCallback(
-    (event, nodeType) => {
-      event.dataTransfer.setData("application/reactflow", nodeType);
-      event.dataTransfer.effectAllowed = "move";
-    },
-    []
-  );
-  return /* @__PURE__ */ jsx(VStack, { gap: "md", className: cn("p-3 select-none", className), children: categories.map((cat) => /* @__PURE__ */ jsxs(VStack, { gap: "xs", children: [
-    /* @__PURE__ */ jsx(
-      Typography,
-      {
-        variant: "caption",
-        className: "font-semibold uppercase tracking-wider text-muted-foreground",
-        children: cat.name
-      }
-    ),
-    /* @__PURE__ */ jsx(Box, { className: "grid grid-cols-2 gap-1.5", children: cat.items.map((item) => /* @__PURE__ */ jsxs(
-      Box,
-      {
-        draggable: true,
-        onDragStart: (e) => handleDragStart(e, item.type),
-        className: cn(
-          "flex flex-col items-center gap-1 p-2 rounded-md cursor-grab",
-          "border border-border bg-card hover:bg-accent/50",
-          "transition-colors duration-100",
-          "active:cursor-grabbing"
-        ),
-        children: [
-          /* @__PURE__ */ jsx(Icon, { name: item.icon, size: "sm" }),
-          /* @__PURE__ */ jsx(Typography, { variant: "caption", className: "text-center leading-tight", children: item.label })
-        ]
-      },
-      item.type
-    )) })
-  ] }, cat.name)) });
-};
-NodePalette.displayName = "NodePalette";
 
 // components/organisms/types.ts
 var EntityDisplayEvents = {
@@ -17963,7 +17270,7 @@ var StatCard = ({
   const labelToUse = propLabel ?? propTitle;
   const eventBus = useEventBus();
   const { t } = useTranslate();
-  const handleActionClick = React91__default.useCallback(() => {
+  const handleActionClick = React90__default.useCallback(() => {
     if (action?.event) {
       eventBus.emit(`UI:${action.event}`, {});
     }
@@ -17974,7 +17281,7 @@ var StatCard = ({
   const data = Array.isArray(entity) ? entity : entity ? [entity] : [];
   const isLoading = externalLoading ?? false;
   const error = externalError;
-  const computeMetricValue = React91__default.useCallback(
+  const computeMetricValue = React90__default.useCallback(
     (metric, items) => {
       if (metric.value !== void 0) {
         return metric.value;
@@ -18013,7 +17320,7 @@ var StatCard = ({
     },
     []
   );
-  const schemaStats = React91__default.useMemo(() => {
+  const schemaStats = React90__default.useMemo(() => {
     if (!metrics || metrics.length === 0) return null;
     return metrics.map((metric) => ({
       label: metric.label,
@@ -18021,7 +17328,7 @@ var StatCard = ({
       format: metric.format
     }));
   }, [metrics, data, computeMetricValue]);
-  const calculatedTrend = React91__default.useMemo(() => {
+  const calculatedTrend = React90__default.useMemo(() => {
     if (manualTrend !== void 0) return manualTrend;
     if (previousValue === void 0 || currentValue === void 0)
       return void 0;
@@ -18185,7 +17492,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(React91__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",
@@ -18711,7 +18018,7 @@ var FormSection = ({
   columns = 1,
   className
 }) => {
-  const [collapsed, setCollapsed] = React91__default.useState(defaultCollapsed);
+  const [collapsed, setCollapsed] = React90__default.useState(defaultCollapsed);
   const { t } = useTranslate();
   const eventBus = useEventBus();
   const gridClass = {
@@ -18719,7 +18026,7 @@ var FormSection = ({
     2: "grid-cols-1 md:grid-cols-2",
     3: "grid-cols-1 md:grid-cols-2 lg:grid-cols-3"
   }[columns];
-  React91__default.useCallback(() => {
+  React90__default.useCallback(() => {
     if (collapsible) {
       setCollapsed((prev) => !prev);
       eventBus.emit("UI:TOGGLE_COLLAPSE", { collapsed: !collapsed });
@@ -18931,7 +18238,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 = React91__default.useMemo(() => {
+  const entityDerivedFields = React90__default.useMemo(() => {
     if (fields && fields.length > 0) return void 0;
     if (!resolvedEntity) return void 0;
     return resolvedEntity.fields.map(
@@ -18950,14 +18257,14 @@ var Form = ({
   const conditionalFields = typeof conditionalFieldsRaw === "boolean" ? {} : conditionalFieldsRaw;
   const hiddenCalculations = typeof hiddenCalculationsRaw === "boolean" ? [] : hiddenCalculationsRaw;
   const violationTriggers = typeof violationTriggersRaw === "boolean" ? [] : violationTriggersRaw;
-  const [formData, setFormData] = React91__default.useState(
+  const [formData, setFormData] = React90__default.useState(
     normalizedInitialData
   );
-  const [collapsedSections, setCollapsedSections] = React91__default.useState(
+  const [collapsedSections, setCollapsedSections] = React90__default.useState(
     /* @__PURE__ */ new Set()
   );
   const shouldShowCancel = showCancel ?? (fields && fields.length > 0);
-  const evalContext = React91__default.useMemo(
+  const evalContext = React90__default.useMemo(
     () => ({
       formValues: formData,
       globalVariables: externalContext?.globalVariables ?? {},
@@ -18966,13 +18273,13 @@ var Form = ({
     }),
     [formData, externalContext]
   );
-  React91__default.useEffect(() => {
+  React90__default.useEffect(() => {
     const data = initialData;
     if (data && Object.keys(data).length > 0) {
       setFormData(data);
     }
   }, [initialData]);
-  const processCalculations = React91__default.useCallback(
+  const processCalculations = React90__default.useCallback(
     (changedFieldId, newFormData) => {
       if (!hiddenCalculations.length) return;
       const context = {
@@ -18997,7 +18304,7 @@ var Form = ({
     },
     [hiddenCalculations, externalContext, eventBus]
   );
-  const checkViolations = React91__default.useCallback(
+  const checkViolations = React90__default.useCallback(
     (changedFieldId, newFormData) => {
       if (!violationTriggers.length) return;
       const context = {
@@ -19034,7 +18341,7 @@ var Form = ({
     processCalculations(name, newFormData);
     checkViolations(name, newFormData);
   };
-  const isFieldVisible = React91__default.useCallback(
+  const isFieldVisible = React90__default.useCallback(
     (fieldName) => {
       const condition = conditionalFields[fieldName];
       if (!condition) return true;
@@ -19042,7 +18349,7 @@ var Form = ({
     },
     [conditionalFields, evalContext]
   );
-  const isSectionVisible = React91__default.useCallback(
+  const isSectionVisible = React90__default.useCallback(
     (section) => {
       if (!section.condition) return true;
       return Boolean(evaluateFormExpression(section.condition, evalContext));
@@ -19074,7 +18381,7 @@ var Form = ({
       eventBus.emit(`UI:${onCancel}`);
     }
   };
-  const renderField = React91__default.useCallback(
+  const renderField = React90__default.useCallback(
     (field) => {
       const fieldName = field.name || field.field;
       if (!fieldName) return null;
@@ -19095,7 +18402,7 @@ var Form = ({
     [formData, isFieldVisible, relationsData, relationsLoading, isLoading]
   );
   const effectiveFields = entityDerivedFields ?? fields;
-  const normalizedFields = React91__default.useMemo(() => {
+  const normalizedFields = React90__default.useMemo(() => {
     if (!effectiveFields || effectiveFields.length === 0) return [];
     return effectiveFields.map((field) => {
       if (typeof field === "string") {
@@ -19117,7 +18424,7 @@ var Form = ({
       return field;
     });
   }, [effectiveFields, resolvedEntity]);
-  const schemaFields = React91__default.useMemo(() => {
+  const schemaFields = React90__default.useMemo(() => {
     if (normalizedFields.length === 0) return null;
     if (isDebugEnabled()) {
       debugGroup(`Form: ${entityName || "unknown"}`);
@@ -19127,7 +18434,7 @@ var Form = ({
     }
     return normalizedFields.map(renderField).filter(Boolean);
   }, [normalizedFields, renderField, entityName, conditionalFields]);
-  const sectionElements = React91__default.useMemo(() => {
+  const sectionElements = React90__default.useMemo(() => {
     if (!sections || sections.length === 0) return null;
     return sections.map((section) => {
       if (!isSectionVisible(section)) {
@@ -20252,7 +19559,7 @@ var List = ({
     if (entity && typeof entity === "object" && "id" in entity) return [entity];
     return [];
   }, [entity]);
-  const getItemActions = React91__default.useCallback(
+  const getItemActions = React90__default.useCallback(
     (item) => {
       if (!itemActions) return [];
       if (typeof itemActions === "function") {
@@ -21018,7 +20325,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(React91__default.Fragment, { children: [
+          return /* @__PURE__ */ jsxs(React90__default.Fragment, { children: [
             /* @__PURE__ */ jsx(
               Button,
               {
@@ -22242,7 +21549,7 @@ var StateMachineView = ({
             style: { top: title ? 30 : 0 },
             children: [
               entity && /* @__PURE__ */ jsx(EntityBox, { entity, config }),
-              states.map((state) => renderStateNode ? /* @__PURE__ */ jsx(React91__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,
@@ -26688,7 +25995,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(React91__default.Fragment, { children: [
+      return /* @__PURE__ */ jsxs(React90__default.Fragment, { children: [
         i > 0 && /* @__PURE__ */ jsx(
           Typography,
           {
@@ -27342,7 +26649,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(React91__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,
       {
@@ -29641,7 +28948,7 @@ function subscribeToStore(listener) {
 function useEntityRef(entityType) {
   const versionRef = useRef(0);
   const dataRef = useRef([]);
-  const getSnapshotStable = React91__default.useCallback(() => {
+  const getSnapshotStable = React90__default.useCallback(() => {
     const currentVersion = getVersion(entityType);
     if (currentVersion !== versionRef.current) {
       versionRef.current = currentVersion;
@@ -29879,7 +29186,7 @@ function InputPattern({
   className
 }) {
   const { emit } = useEventBus();
-  const [localValue, setLocalValue] = React91__default.useState(value);
+  const [localValue, setLocalValue] = React90__default.useState(value);
   const handleChange = (e) => {
     setLocalValue(e.target.value);
     if (onChange) {
@@ -29916,7 +29223,7 @@ function TextareaPattern({
   className
 }) {
   const { emit } = useEventBus();
-  const [localValue, setLocalValue] = React91__default.useState(value);
+  const [localValue, setLocalValue] = React90__default.useState(value);
   const handleChange = (e) => {
     setLocalValue(e.target.value);
     if (onChange) {
@@ -29947,7 +29254,7 @@ function SelectPattern({
   className
 }) {
   const { emit } = useEventBus();
-  const [localValue, setLocalValue] = React91__default.useState(value);
+  const [localValue, setLocalValue] = React90__default.useState(value);
   const handleChange = (e) => {
     setLocalValue(e.target.value);
     if (onChange) {
@@ -29976,7 +29283,7 @@ function CheckboxPattern({
   className
 }) {
   const { emit } = useEventBus();
-  const [localChecked, setLocalChecked] = React91__default.useState(checked);
+  const [localChecked, setLocalChecked] = React90__default.useState(checked);
   const handleChange = (e) => {
     setLocalChecked(e.target.checked);
     if (onChange) {
@@ -31858,7 +31165,7 @@ var DocumentViewer = ({
 };
 DocumentViewer.displayName = "DocumentViewer";
 function extractTitle(children) {
-  if (!React91__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;
@@ -32456,7 +31763,7 @@ var MediaGallery = ({
     [selectable, selectedItems, selectionEvent, eventBus]
   );
   const entityData = Array.isArray(entity) ? entity : [];
-  const items = React91__default.useMemo(() => {
+  const items = React90__default.useMemo(() => {
     if (propItems) return propItems;
     if (entityData.length === 0) return [];
     return entityData.map((record, idx) => ({
@@ -32618,7 +31925,7 @@ var MediaGallery = ({
 };
 MediaGallery.displayName = "MediaGallery";
 function extractTitle2(children) {
-  if (!React91__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;
@@ -32704,7 +32011,7 @@ function subscribeToDebugEvents(listener) {
 
 // components/organisms/debug/hooks/useDebugData.ts
 function useDebugData() {
-  const [data, setData] = React91.useState(() => ({
+  const [data, setData] = React90.useState(() => ({
     traits: [],
     ticks: [],
     guards: [],
@@ -32718,7 +32025,7 @@ function useDebugData() {
     },
     lastUpdate: Date.now()
   }));
-  React91.useEffect(() => {
+  React90.useEffect(() => {
     const updateData = () => {
       setData({
         traits: getAllTraits(),
@@ -32987,15 +32294,15 @@ var TYPE_BADGES = {
   state: { variant: "danger", icon: "\u{1F4CA}" }
 };
 function EventFlowTab({ events: events2 }) {
-  const [filter, setFilter] = React91.useState("all");
-  const containerRef = React91.useRef(null);
-  const [autoScroll, setAutoScroll] = React91.useState(true);
-  React91.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 = React91.useMemo(() => {
+  const filteredEvents = React90.useMemo(() => {
     if (filter === "all") return events2;
     return events2.filter((e) => e.type === filter);
   }, [events2, filter]);
@@ -33094,7 +32401,7 @@ function EventFlowTab({ events: events2 }) {
 }
 EventFlowTab.displayName = "EventFlowTab";
 function GuardsPanel({ guards }) {
-  const [filter, setFilter] = React91.useState("all");
+  const [filter, setFilter] = React90.useState("all");
   if (guards.length === 0) {
     return /* @__PURE__ */ jsx(
       EmptyState,
@@ -33107,7 +32414,7 @@ function GuardsPanel({ guards }) {
   }
   const passedCount = guards.filter((g) => g.result).length;
   const failedCount = guards.length - passedCount;
-  const filteredGuards = React91.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);
@@ -33251,10 +32558,10 @@ function EffectBadge({ effect }) {
   ] });
 }
 function TransitionTimeline({ transitions }) {
-  const containerRef = React91.useRef(null);
-  const [autoScroll, setAutoScroll] = React91.useState(true);
-  const [expandedId, setExpandedId] = React91.useState(null);
-  React91.useEffect(() => {
+  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;
     }
@@ -33515,9 +32822,9 @@ function getAllEvents(traits2) {
 }
 function EventDispatcherTab({ traits: traits2, schema }) {
   const eventBus = useEventBus();
-  const [log, setLog] = React91.useState([]);
-  const prevStatesRef = React91.useRef(/* @__PURE__ */ new Map());
-  React91.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) {
@@ -33670,9 +32977,9 @@ function VerifyModePanel({
   serverCount,
   localCount
 }) {
-  const scrollRef = React91.useRef(null);
-  const prevCountRef = React91.useRef(0);
-  React91.useEffect(() => {
+  const scrollRef = React90.useRef(null);
+  const prevCountRef = React90.useRef(0);
+  React90.useEffect(() => {
     if (transitions.length > prevCountRef.current && scrollRef.current) {
       scrollRef.current.scrollTop = scrollRef.current.scrollHeight;
     }
@@ -33683,10 +32990,11 @@ function VerifyModePanel({
     {
       className: cn(
         "runtime-debugger runtime-debugger--verify",
-        "fixed bottom-0 left-0 right-0 z-[9999] h-[35vh] flex flex-col bg-gray-900 text-white border-t-2 border-cyan-500",
+        "fixed bottom-0 left-0 right-0 flex flex-col bg-gray-900 text-white border-t-2 border-cyan-500",
         className
       ),
       "data-testid": "debugger-verify",
+      style: { zIndex: 30, height: "25vh" },
       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" }),
@@ -33713,10 +33021,10 @@ function RuntimeDebugger({
   defaultTab,
   schema
 }) {
-  const [isCollapsed, setIsCollapsed] = React91.useState(mode === "verify" ? true : defaultCollapsed);
-  const [isVisible, setIsVisible] = React91.useState(mode === "inline" || mode === "verify" || isDebugEnabled2());
+  const [isCollapsed, setIsCollapsed] = React90.useState(mode === "verify" ? true : defaultCollapsed);
+  const [isVisible, setIsVisible] = React90.useState(mode === "inline" || mode === "verify" || isDebugEnabled2());
   const debugData = useDebugData();
-  React91.useEffect(() => {
+  React90.useEffect(() => {
     if (mode === "inline") return;
     return onDebugToggle((enabled) => {
       setIsVisible(enabled);
@@ -33725,7 +33033,7 @@ function RuntimeDebugger({
       }
     });
   }, [mode]);
-  React91.useEffect(() => {
+  React90.useEffect(() => {
     if (mode === "inline") return;
     const handleKeyDown = (e) => {
       if (e.key === "`" && isVisible) {
@@ -33873,12 +33181,13 @@ function RuntimeDebugger({
     {
       className: cn(
         "runtime-debugger",
-        "fixed z-[9999]",
+        "fixed",
         positionClasses3[position],
         isCollapsed ? "runtime-debugger--collapsed" : "runtime-debugger--expanded",
         className
       ),
       "data-testid": isCollapsed ? "debugger-collapsed" : "debugger-expanded",
+      style: { zIndex: 30 },
       children: isCollapsed ? /* @__PURE__ */ jsx(
         Button,
         {
@@ -34138,7 +33447,7 @@ var Timeline = ({
 }) => {
   const { t } = useTranslate();
   const entityData = Array.isArray(entity) ? entity : [];
-  const items = React91__default.useMemo(() => {
+  const items = React90__default.useMemo(() => {
     if (propItems) return propItems;
     if (entityData.length === 0) return [];
     return entityData.map((record, idx) => {
@@ -34240,7 +33549,7 @@ var Timeline = ({
 };
 Timeline.displayName = "Timeline";
 function extractToastProps(children) {
-  if (!React91__default.isValidElement(children)) {
+  if (!React90__default.isValidElement(children)) {
     if (typeof children === "string") {
       return { message: children };
     }
@@ -34271,7 +33580,7 @@ var ToastSlot = ({
     eventBus.emit("UI:CLOSE");
   };
   if (!isVisible) return null;
-  const isCustomContent = React91__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,
     {
@@ -34313,12 +33622,12 @@ WorldMapTemplate.displayName = "WorldMapTemplate";
 
 // components/organisms/component-registry.generated.ts
 function lazyThree(name, loader) {
-  const Lazy = React91__default.lazy(() => loader().then((m) => ({ default: m[name] })));
+  const Lazy = React90__default.lazy(() => loader().then((m) => ({ default: m[name] })));
   function ThreeWrapper(props) {
-    return React91__default.createElement(
-      React91__default.Suspense,
+    return React90__default.createElement(
+      React90__default.Suspense,
       { fallback: null },
-      React91__default.createElement(Lazy, props)
+      React90__default.createElement(Lazy, props)
     );
   }
   ThreeWrapper.displayName = `Lazy(${name})`;
@@ -34606,7 +33915,7 @@ function SuspenseConfigProvider({
   config,
   children
 }) {
-  return React91__default.createElement(
+  return React90__default.createElement(
     SuspenseConfigContext.Provider,
     { value: config },
     children
@@ -35015,7 +34324,8 @@ function renderPatternChildren(children, onDismiss, parentId = "root") {
       id: childId,
       pattern: child.type,
       props: child.props ?? {},
-      priority: 0
+      priority: 0,
+      nodeId: child._id
     };
     return /* @__PURE__ */ jsx(
       SlotContentRenderer,
@@ -35084,6 +34394,8 @@ function SlotContentRenderer({
         className: "slot-content",
         "data-pattern": content.pattern,
         "data-id": content.id,
+        "data-node-id": content.nodeId,
+        "data-source-trait": content.sourceTrait,
         children: /* @__PURE__ */ jsx(PatternComponent, { ...finalProps, children: renderedChildren })
       }
     );
@@ -35094,6 +34406,8 @@ function SlotContentRenderer({
       className: "slot-content",
       "data-pattern": content.pattern,
       "data-id": content.id,
+      "data-node-id": content.nodeId,
+      "data-source-trait": content.sourceTrait,
       children: content.props.children ?? /* @__PURE__ */ jsxs(Box, { className: "p-4 text-sm text-muted-foreground border border-dashed border-border rounded", children: [
         "Unknown pattern: ",
         content.pattern,
@@ -37005,7 +36319,7 @@ function EntityDataProvider({
   adapter,
   children
 }) {
-  return React91__default.createElement(
+  return React90__default.createElement(
     EntityDataContext.Provider,
     { value: adapter },
     children
@@ -37831,4 +37145,4 @@ function useGitHubBranches(owner, repo, enabled = true) {
   });
 }
 
-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, BehaviorNode, 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, EffectNode, EmptyState, EnemyPlate, EntityDataProvider, EntityDisplayEvents, ErrorBoundary, ErrorState, EventHandlerBoard, EventLog, EventWireEdge, ExprNode, FEATURE_COLORS, FEATURE_TYPES, FLOOR_HEIGHT, FeatureCard, FeatureDetailPageTemplate, FeatureGrid, FeatureGridOrganism, FilterGroup, Flex, FlipCard, FlipContainer, FloatingActionButton, FlowLabel, FlowMinimap, FlowNodeShell, FlowPort, FlowStateNode, FlowWire, 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, MINIMAP_COLORS, MapView, MarkdownContent, MarketingStatCard, MasterDetail, MediaGallery, Menu, Meter, MiniMap, Modal, ModalSlot, Navigation, NegotiatorBoard, NodePalette, NotifyListener, NumberStepper, ObjectRulePanel, OrbitalNode, 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, TransitionEdge, 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, getFlowWireStyle, 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 };