@almadar/ui 5.65.0 → 5.67.0

package/dist/avl/index.js

@@ -46,7 +46,7 @@ import { GLTFLoader as GLTFLoader$1 } from 'three/examples/jsm/loaders/GLTFLoade
 import { clone } from 'three/examples/jsm/utils/SkeletonUtils';
 import { Canvas, useLoader, useFrame, useThree } from '@react-three/fiber';
 import { Billboard, Grid as Grid$1, OrbitControls } from '@react-three/drei';
-import { getPatternDefinition, getComponentForPattern as getComponentForPattern$1, isEntityAwarePattern } from '@almadar/patterns';
+import { getPatternDefinition, getComponentForPattern, isEntityAwarePattern } from '@almadar/patterns';
 import { OrbitalServerRuntime } from '@almadar/runtime/OrbitalServerRuntime';
 import { InMemoryPersistence, StateMachineManager, collectDeclaredConfigDefaults, createServerEffectHandlers, EffectExecutor, createContextFromBindings } from '@almadar/runtime';
 
@@ -11755,6 +11755,8 @@ var init_DialogueBubble = __esm({
 function ChoiceButton({
   text = "Charge forward into the fray",
   index,
+  assetUrl,
+  icon,
   disabled = false,
   selected = false,
   onClick,
@@ -11787,6 +11789,23 @@ function ChoiceButton({
             ]
           }
         ),
+        assetUrl ? /* @__PURE__ */ jsx(
+          "img",
+          {
+            src: assetUrl,
+            alt: "",
+            width: 16,
+            height: 16,
+            style: { imageRendering: "pixelated", objectFit: "contain" },
+            className: "flex-shrink-0"
+          }
+        ) : icon ? /* @__PURE__ */ jsx("span", { className: "flex-shrink-0 text-sm", children: typeof icon === "string" ? (() => {
+          const I = resolveIcon(icon);
+          return I ? /* @__PURE__ */ jsx(I, { className: "w-4 h-4" }) : null;
+        })() : /* @__PURE__ */ (() => {
+          const I = icon;
+          return /* @__PURE__ */ jsx(I, { className: "w-4 h-4" });
+        })() }) : null,
         /* @__PURE__ */ jsx("span", { className: "text-sm leading-snug", children: text })
       ]
     }
@@ -11795,6 +11814,7 @@ function ChoiceButton({
 var init_ChoiceButton = __esm({
   "components/game/atoms/ChoiceButton.tsx"() {
     init_cn();
+    init_Icon();
     ChoiceButton.displayName = "ChoiceButton";
   }
 });
@@ -14943,7 +14963,8 @@ function IsometricCanvas({
     const minX = Math.min(...allScreenPos.map((p2) => p2.x));
     const maxX = Math.max(...allScreenPos.map((p2) => p2.x + scaledTileWidth));
     const minY = Math.min(...allScreenPos.map((p2) => p2.y));
-    const maxY = Math.max(...allScreenPos.map((p2) => p2.y + scaledTileHeight));
+    const tileBottomExtent = tileLayout === "hex" ? scaledTileWidth : scaledTileHeight;
+    const maxY = Math.max(...allScreenPos.map((p2) => p2.y + tileBottomExtent));
     const worldW = maxX - minX;
     const worldH = maxY - minY;
     const scaleM = Math.min(mW / worldW, mH / worldH) * 0.9;
@@ -15035,7 +15056,7 @@ function IsometricCanvas({
           const drawW = scaledTileWidth;
           const drawH = scaledTileWidth * (img.naturalHeight / img.naturalWidth);
           const drawX = pos.x;
-          const drawY = pos.y + scaledTileHeight - drawH;
+          const drawY = tileLayout === "hex" ? pos.y : pos.y + scaledTileHeight - drawH;
           ctx.drawImage(img, drawX, drawY, drawW, drawH);
         }
       } else {
@@ -30958,6 +30979,7 @@ function PowerupSlots({
       /* @__PURE__ */ jsx(
         ItemSlot,
         {
+          assetUrl: powerup.assetUrl,
           icon: powerup.icon,
           label: powerup.label,
           rarity: "uncommon",
@@ -31207,13 +31229,26 @@ function HealthPanel({
             )
           }
         ),
-        effects && effects.length > 0 && /* @__PURE__ */ jsx(Box, { className: "flex items-center gap-1 flex-wrap", children: effects.map((effect, i) => /* @__PURE__ */ jsx(
+        effects && effects.length > 0 && /* @__PURE__ */ jsx(Box, { className: "flex items-center gap-1 flex-wrap", children: effects.map((effect, i) => /* @__PURE__ */ jsxs(
           Badge,
           {
             variant: effectVariantMap[effect.variant ?? "neutral"],
             size: "sm",
-            icon: effect.icon,
-            children: effect.label
+            icon: effect.assetUrl ? void 0 : effect.icon,
+            children: [
+              effect.assetUrl && /* @__PURE__ */ jsx(
+                "img",
+                {
+                  src: effect.assetUrl,
+                  alt: "",
+                  width: 12,
+                  height: 12,
+                  style: { imageRendering: "pixelated", objectFit: "contain" },
+                  className: "flex-shrink-0 inline-block"
+                }
+              ),
+              effect.label
+            ]
           },
           i
         )) })
@@ -31396,15 +31431,28 @@ function TurnPanel({
             activeTeam
           }
         ),
-        actions && actions.length > 0 && /* @__PURE__ */ jsx(Box, { className: "flex items-center gap-1.5 ml-auto", children: actions.map((action, i) => /* @__PURE__ */ jsx(
+        actions && actions.length > 0 && /* @__PURE__ */ jsx(Box, { className: "flex items-center gap-1.5 ml-auto", children: actions.map((action, i) => /* @__PURE__ */ jsxs(
           Button,
           {
             variant: "ghost",
             size: "sm",
             disabled: action.disabled,
-            leftIcon: action.icon,
+            leftIcon: action.assetUrl ? void 0 : action.icon,
             onClick: () => handleAction(action.event),
-            children: action.label
+            children: [
+              action.assetUrl && /* @__PURE__ */ jsx(
+                "img",
+                {
+                  src: action.assetUrl,
+                  alt: "",
+                  width: 14,
+                  height: 14,
+                  style: { imageRendering: "pixelated", objectFit: "contain" },
+                  className: "flex-shrink-0"
+                }
+              ),
+              action.label
+            ]
           },
           i
         )) })
@@ -45911,9 +45959,9 @@ var init_GameCanvas3D2 = __esm({
             const color = unit.faction === "player" ? 4491519 : unit.faction === "enemy" ? 16729156 : 16777028;
             const hasAtlas = unitAtlasUrl(unit) !== null;
             const initialFrame = hasAtlas ? resolveUnitFrame(unit.id) : null;
-            const modelScale = UNIT_BASE_MODEL_SCALE * unitScale;
-            const billboardHeight = UNIT_BASE_BILLBOARD_HEIGHT * unitScale;
-            const primitiveRadius = UNIT_BASE_PRIMITIVE_RADIUS * unitScale;
+            const modelScale = UNIT_BASE_MODEL_SCALE * unitScale * gridConfig.cellSize;
+            const billboardHeight = UNIT_BASE_BILLBOARD_HEIGHT * unitScale * gridConfig.cellSize;
+            const primitiveRadius = UNIT_BASE_PRIMITIVE_RADIUS * unitScale * gridConfig.cellSize;
             return /* @__PURE__ */ jsxs(
               "group",
               {
@@ -45960,7 +46008,7 @@ var init_GameCanvas3D2 = __esm({
                       /* @__PURE__ */ jsx("meshStandardMaterial", { color })
                     ] })
                   ] }),
-                  unit.health !== void 0 && unit.maxHealth !== void 0 && /* @__PURE__ */ jsxs("group", { position: [0, 1.2, 0], children: [
+                  unit.health !== void 0 && unit.maxHealth !== void 0 && /* @__PURE__ */ jsxs("group", { position: [0, billboardHeight, 0], children: [
                     /* @__PURE__ */ jsxs("mesh", { position: [-0.25, 0, 0], children: [
                       /* @__PURE__ */ jsx("planeGeometry", { args: [0.5, 0.05] }),
                       /* @__PURE__ */ jsx("meshBasicMaterial", { color: 3355443 })
@@ -45989,7 +46037,7 @@ var init_GameCanvas3D2 = __esm({
               }
             );
           },
-          [selectedUnitId, handleUnitClick, resolveUnitFrame, unitScale]
+          [selectedUnitId, handleUnitClick, resolveUnitFrame, unitScale, gridConfig]
         );
         const DefaultFeatureRenderer = useCallback(
           ({
@@ -46077,7 +46125,7 @@ var init_GameCanvas3D2 = __esm({
               {
                 ref: containerRef,
                 className: cn("game-canvas-3d relative w-full overflow-hidden", className),
-                style: { height: "85vh" },
+                style: { flex: "1 1 0", minHeight: "400px" },
                 "data-orientation": orientation,
                 "data-camera-mode": cameraMode,
                 "data-overlay": overlay,
@@ -46377,13 +46425,39 @@ var init_GameBoard3D = __esm({
     GameBoard3D.displayName = "GameBoard3D";
   }
 });
-var GameShell;
+function getSlotContentRenderer2() {
+  if (_scr) return _scr;
+  const mod = (init_UISlotRenderer(), __toCommonJS(UISlotRenderer_exports));
+  _scr = mod.SlotContentRenderer;
+  return _scr;
+}
+function resolveDescriptor(value, idPrefix) {
+  if (value === null || value === void 0) return value;
+  if (React93__default.isValidElement(value)) return value;
+  if (typeof value === "string" || typeof value === "number" || typeof value === "boolean") return value;
+  if (Array.isArray(value)) {
+    return value.map((item, i) => /* @__PURE__ */ jsx(React93__default.Fragment, { children: resolveDescriptor(item, `${idPrefix}-${i}`) }, i));
+  }
+  if (typeof value === "object") {
+    const rec = value;
+    if (typeof rec.type === "string" && getComponentForPattern(rec.type) !== null) {
+      const { type, props: nestedProps, _id, ...flatProps } = rec;
+      const resolvedProps = nestedProps !== void 0 ? nestedProps : flatProps;
+      const content = { id: _id ?? idPrefix, pattern: type, props: resolvedProps, priority: 0 };
+      const SCR = getSlotContentRenderer2();
+      return /* @__PURE__ */ jsx(SCR, { content, onDismiss: () => void 0 });
+    }
+  }
+  return null;
+}
+var _scr, GameShell;
 var init_GameShell = __esm({
   "components/game/templates/GameShell.tsx"() {
     init_cn();
     init_Box();
     init_Stack();
     init_Typography();
+    _scr = null;
     GameShell = ({
       appName = "Game",
       hud,
@@ -46432,7 +46506,7 @@ var init_GameShell = __esm({
                       children: appName
                     }
                   ),
-                  hud && /* @__PURE__ */ jsx(Box, { className: "game-shell__hud", children: hud })
+                  hud && /* @__PURE__ */ jsx(Box, { className: "game-shell__hud", children: resolveDescriptor(hud, "gs-hud") })
                 ]
               }
             ),
@@ -46445,7 +46519,7 @@ var init_GameShell = __esm({
                   overflow: "hidden",
                   position: "relative"
                 },
-                children
+                children: resolveDescriptor(children, "gs-children")
               }
             )
           ]
@@ -46455,7 +46529,32 @@ var init_GameShell = __esm({
     GameShell.displayName = "GameShell";
   }
 });
-var GameTemplate;
+function getSlotContentRenderer3() {
+  if (_scr2) return _scr2;
+  const mod = (init_UISlotRenderer(), __toCommonJS(UISlotRenderer_exports));
+  _scr2 = mod.SlotContentRenderer;
+  return _scr2;
+}
+function resolveDescriptor2(value, idPrefix) {
+  if (value === null || value === void 0) return value;
+  if (React93__default.isValidElement(value)) return value;
+  if (typeof value === "string" || typeof value === "number" || typeof value === "boolean") return value;
+  if (Array.isArray(value)) {
+    return value.map((item, i) => /* @__PURE__ */ jsx(React93__default.Fragment, { children: resolveDescriptor2(item, `${idPrefix}-${i}`) }, i));
+  }
+  if (typeof value === "object") {
+    const rec = value;
+    if (typeof rec.type === "string" && getComponentForPattern(rec.type) !== null) {
+      const { type, props: nestedProps, _id, ...flatProps } = rec;
+      const resolvedProps = nestedProps !== void 0 ? nestedProps : flatProps;
+      const content = { id: _id ?? idPrefix, pattern: type, props: resolvedProps, priority: 0 };
+      const SCR = getSlotContentRenderer3();
+      return /* @__PURE__ */ jsx(SCR, { content, onDismiss: () => void 0 });
+    }
+  }
+  return null;
+}
+var _scr2, GameTemplate;
 var init_GameTemplate = __esm({
   "components/game/templates/GameTemplate.tsx"() {
     init_cn();
@@ -46463,6 +46562,7 @@ var init_GameTemplate = __esm({
     init_Stack();
     init_Typography();
     init_Button();
+    _scr2 = null;
     GameTemplate = ({
       entity,
       title = "Game",
@@ -46530,13 +46630,13 @@ var init_GameTemplate = __esm({
                   fullWidth: true,
                   className: "flex-1 bg-muted",
                   children: [
-                    children,
+                    resolveDescriptor2(children, "gt-children"),
                     hud && /* @__PURE__ */ jsx(
                       Box,
                       {
                         position: "absolute",
                         className: "top-0 left-0 right-0 pointer-events-none",
-                        children: /* @__PURE__ */ jsx(Box, { padding: "md", className: "pointer-events-auto w-fit", children: hud })
+                        children: /* @__PURE__ */ jsx(Box, { padding: "md", className: "pointer-events-auto w-fit", children: resolveDescriptor2(hud, "gt-hud") })
                       }
                     )
                   ]
@@ -46561,7 +46661,7 @@ var init_GameTemplate = __esm({
                       children: /* @__PURE__ */ jsx(Typography, { variant: "h6", children: "Debug Panel" })
                     }
                   ),
-                  /* @__PURE__ */ jsx(Box, { padding: "md", children: debugPanel })
+                  /* @__PURE__ */ jsx(Box, { padding: "md", children: resolveDescriptor2(debugPanel, "gt-debug") })
                 ]
               }
             )
@@ -55140,8 +55240,8 @@ function getSlotFallback(slot, config) {
   const variant = SLOT_SKELETON_MAP[slot] ?? "text";
   return /* @__PURE__ */ jsx(Skeleton, { variant });
 }
-function getComponentForPattern(patternType) {
-  const mapping = getComponentForPattern$1(patternType);
+function getComponentForPattern3(patternType) {
+  const mapping = getComponentForPattern(patternType);
   if (!mapping) {
     return null;
   }
@@ -55663,7 +55763,7 @@ function isPatternConfig(value) {
   if (value instanceof Date) return false;
   if (typeof value === "function") return false;
   const record = value;
-  return "type" in record && typeof record.type === "string" && getComponentForPattern$1(record.type) !== null;
+  return "type" in record && typeof record.type === "string" && getComponentForPattern(record.type) !== null;
 }
 function isPlainConfigObject(value) {
   if (React93__default.isValidElement(value)) return false;
@@ -55771,7 +55871,8 @@ function SlotContentRenderer({
       entityDef = schemaCtx.entities.get(linkedEntity);
     }
   }
-  const PatternComponent = getComponentForPattern(content.pattern);
+  const orbitalName = schemaCtx && content.sourceTrait !== void 0 ? schemaCtx.orbitalsByTrait.get(content.sourceTrait) : void 0;
+  const PatternComponent = getComponentForPattern3(content.pattern);
   if (PatternComponent) {
     const childrenConfig = content.props.children;
     const isSingleChild = typeof childrenConfig === "string" || typeof childrenConfig === "object" && childrenConfig !== null && !Array.isArray(childrenConfig) && "type" in childrenConfig;
@@ -55869,6 +55970,7 @@ function SlotContentRenderer({
         "data-orb-entity": content.entity,
         "data-orb-path": myPath,
         "data-orb-pattern": content.pattern,
+        "data-orb-orbital": orbitalName,
         children: renderedChildren !== void 0 ? /* @__PURE__ */ jsx(PatternComponent, { ...finalProps, children: renderedChildren }) : /* @__PURE__ */ jsx(PatternComponent, { ...finalProps })
       }
     );
@@ -55888,6 +55990,7 @@ function SlotContentRenderer({
       "data-orb-entity": content.entity,
       "data-orb-path": patternPath ?? "root",
       "data-orb-pattern": content.pattern,
+      "data-orb-orbital": orbitalName,
       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,
@@ -59530,7 +59633,7 @@ function resolveLambdaBindings(body, params, item, index) {
   return body;
 }
 var _slotContentRenderer2 = null;
-function getSlotContentRenderer2() {
+function getSlotContentRenderer4() {
   if (_slotContentRenderer2) return _slotContentRenderer2;
   const mod = (init_UISlotRenderer(), __toCommonJS(UISlotRenderer_exports));
   _slotContentRenderer2 = mod.SlotContentRenderer;
@@ -59546,7 +59649,7 @@ function makeLambdaFn(params, lambdaBody, callerKey) {
     if (typeof record.type !== "string") {
       return null;
     }
-    const SlotContentRenderer2 = getSlotContentRenderer2();
+    const SlotContentRenderer2 = getSlotContentRenderer4();
     const rawChildProps = {};
     for (const [k, v] of Object.entries(record)) {
       if (k !== "type") rawChildProps[k] = v;
@@ -61906,6 +62009,33 @@ function formatPayloadTooltip(fields) {
   );
   return `{ ${parts.join(", ")} }`;
 }
+
+// components/avl/derive-edit-focus.ts
+function deriveEditFocusFromElement(el) {
+  const orbitalEl = el.getAttribute("data-orb-orbital") !== null ? el : el.closest("[data-orb-orbital]");
+  const orbital = orbitalEl?.getAttribute("data-orb-orbital") ?? "";
+  if (!orbital) return null;
+  const path = el.getAttribute("data-orb-path") ?? el.getAttribute("data-pattern-path");
+  const patternType = el.getAttribute("data-orb-pattern") ?? el.getAttribute("data-pattern");
+  const trait = el.getAttribute("data-orb-trait") ?? el.getAttribute("data-source-trait");
+  const focus = {
+    level: "node",
+    orbital,
+    label: patternType ?? trait ?? "element"
+  };
+  if (path !== null) focus.path = path;
+  if (trait !== null) focus.trait = trait;
+  if (patternType !== null) focus.patternType = patternType;
+  const transition = el.getAttribute("data-orb-transition");
+  if (transition !== null) focus.transition = transition;
+  const state = el.getAttribute("data-orb-state");
+  if (state !== null) focus.state = state;
+  const slot = el.getAttribute("data-orb-slot");
+  if (slot !== null) focus.slot = slot;
+  const entity = el.getAttribute("data-orb-entity");
+  if (entity !== null) focus.entity = entity;
+  return focus;
+}
 function entityNameOf(ref) {
   if (!ref) return void 0;
   if (typeof ref === "string") return ref;
@@ -62191,29 +62321,6 @@ function rectRelativeTo(el, container, zoom) {
     height: (u.bottom - u.top) / z
   };
 }
-function buildFocus(el, orbitalName) {
-  if (!orbitalName) return null;
-  const path = el.getAttribute("data-orb-path") ?? el.getAttribute("data-pattern-path");
-  const patternType = el.getAttribute("data-orb-pattern") ?? el.getAttribute("data-pattern");
-  const trait = el.getAttribute("data-orb-trait") ?? el.getAttribute("data-source-trait");
-  const focus = {
-    level: "node",
-    orbital: orbitalName,
-    label: patternType ?? trait ?? "element"
-  };
-  if (path !== null) focus.path = path;
-  if (trait !== null) focus.trait = trait;
-  if (patternType !== null) focus.patternType = patternType;
-  const transition = el.getAttribute("data-orb-transition");
-  if (transition !== null) focus.transition = transition;
-  const state = el.getAttribute("data-orb-state");
-  if (state !== null) focus.state = state;
-  const slot = el.getAttribute("data-orb-slot");
-  if (slot !== null) focus.slot = slot;
-  const entity = el.getAttribute("data-orb-entity");
-  if (entity !== null) focus.entity = entity;
-  return focus;
-}
 var OrbPreviewNodeInner = (props) => {
   const data = props.data;
   const screenSize = useContext(ScreenSizeContext);
@@ -62282,7 +62389,7 @@ var OrbPreviewNodeInner = (props) => {
         nodeData: data,
         rect: rect ?? void 0
       });
-      const focus = buildFocus(patternEl, data.orbitalName);
+      const focus = deriveEditFocusFromElement(patternEl);
       if (focus) eventBus.emit("UI:ELEMENT_SELECTED", { focus: { ...focus } });
     } else {
       setSelectedRect(null);
@@ -65523,4 +65630,4 @@ var AvlClickTarget = ({
 };
 AvlClickTarget.displayName = "AvlClickTarget";
 
-export { AVL_FIELD_TYPE_SHAPES, AVL_OPERATOR_COLORS, AvlApplication, AvlBackwardEdge, AvlBehaviorGlyph, AvlBinding, AvlBindingEdge, AvlBindingRef, AvlClickTarget, AvlClosedCircuit, AvlCosmicZoom, AvlEffect, AvlEmitListen, AvlEntity, AvlEvent, AvlEventWireEdge, AvlExprTree, AvlField, AvlFieldType, AvlGuard, AvlLiteral, AvlOperator, AvlOrbital, AvlOrbitalNode, AvlOrbitalUnit, AvlOrbitalsCosmicZoom, AvlPage, AvlPageEdge, AvlPersistence, AvlSExpr, AvlSlotMap, AvlState, AvlStateMachine, AvlSwimLane, AvlTrait, AvlTraitScene, AvlTransition, AvlTransitionEdge, AvlTransitionLane, AvlTransitionScene, BehaviorComposeNode, BehaviorView, CONNECTION_COLORS, CanvasDndProvider, DOMAIN_COLORS, DetailView, EFFECT_CATEGORY_COLORS, EFFECT_TYPE_TO_CATEGORY, EventFlowEdge, FlowCanvas, MiniStateMachine, ModuleCard, OrbInspector, OrbPreviewNode, STATE_COLORS, SystemNode, ZOOM_BAND_THRESHOLDS, ZoomBandContext, ZoomBreadcrumb, ZoomLegend, arcPath, behaviorsToComposeGraph, computeTraitLayout, computeZoomBand, curveControlPoint, edgePath, getStateRole, gridPositions, orbitalToExpandedGraph, parseApplicationLevel, parseOrbitalLevel, parseTraitLevel, parseTransitionLevel, radialPositions, registryEntryToCanvasEntry, ringPositions, schemaToFlowGraph, schemaToOverviewGraph, useCanvasDraggable, useCanvasDroppable, useZoomBand, zoomProgress };
+export { AVL_FIELD_TYPE_SHAPES, AVL_OPERATOR_COLORS, AvlApplication, AvlBackwardEdge, AvlBehaviorGlyph, AvlBinding, AvlBindingEdge, AvlBindingRef, AvlClickTarget, AvlClosedCircuit, AvlCosmicZoom, AvlEffect, AvlEmitListen, AvlEntity, AvlEvent, AvlEventWireEdge, AvlExprTree, AvlField, AvlFieldType, AvlGuard, AvlLiteral, AvlOperator, AvlOrbital, AvlOrbitalNode, AvlOrbitalUnit, AvlOrbitalsCosmicZoom, AvlPage, AvlPageEdge, AvlPersistence, AvlSExpr, AvlSlotMap, AvlState, AvlStateMachine, AvlSwimLane, AvlTrait, AvlTraitScene, AvlTransition, AvlTransitionEdge, AvlTransitionLane, AvlTransitionScene, BehaviorComposeNode, BehaviorView, CONNECTION_COLORS, CanvasDndProvider, DOMAIN_COLORS, DetailView, EFFECT_CATEGORY_COLORS, EFFECT_TYPE_TO_CATEGORY, EventFlowEdge, FlowCanvas, MiniStateMachine, ModuleCard, OrbInspector, OrbPreviewNode, STATE_COLORS, SystemNode, ZOOM_BAND_THRESHOLDS, ZoomBandContext, ZoomBreadcrumb, ZoomLegend, arcPath, behaviorsToComposeGraph, computeTraitLayout, computeZoomBand, curveControlPoint, deriveEditFocusFromElement, edgePath, getStateRole, gridPositions, orbitalToExpandedGraph, parseApplicationLevel, parseOrbitalLevel, parseTraitLevel, parseTransitionLevel, radialPositions, registryEntryToCanvasEntry, ringPositions, schemaToFlowGraph, schemaToOverviewGraph, useCanvasDraggable, useCanvasDroppable, useZoomBand, zoomProgress };

package/dist/components/avl/derive-edit-focus.d.ts

@@ -0,0 +1,8 @@
+import type { EditFocus } from '@almadar/core';
+/**
+ * Build an `EditFocus` from a clicked element's `data-orb-*` address (stamped by
+ * UISlotRenderer). The owning orbital is read from the DOM (`data-orb-orbital`,
+ * walking up via `closest` when the clicked node itself doesn't carry it); since
+ * `EditFocus.orbital` is required, returns `null` when it can't be resolved.
+ */
+export declare function deriveEditFocusFromElement(el: HTMLElement): EditFocus | null;

package/dist/components/core/organisms/ChatBar.d.ts

@@ -0,0 +1,31 @@
+/**
+ * ChatBar Organism
+ *
+ * The always-visible bottom chat bar. A single-row input surface for talking
+ * to the agent: status icon, optional context badge, text input, and a
+ * status-driven action button (Send / Pause+Stop / Resume / Retry).
+ *
+ * The agent's activity stream lives in the dedicated Trace tab (see
+ * SubagentTracePanel). ChatBar emits generic EventBus events
+ * (`UI:CHAT_SEND`, `UI:ELEMENT_SELECTED`, plus the declarative `UI:*` actions
+ * the Button atom raises) — it owns no app-specific state.
+ */
+import React from 'react';
+import type { DisplayStateProps } from './types';
+export type ChatBarStatus = 'idle' | 'running' | 'paused' | 'complete' | 'error';
+export interface ChatBarProps extends DisplayStateProps {
+    /** Pipeline status */
+    status?: ChatBarStatus;
+    /** Currently active gate label, e.g. "Gate 2: State machines" */
+    activeGate?: string;
+    /** JEPA validity probability 0-1 */
+    jepaValidity?: number;
+    /** Input placeholder text */
+    placeholder?: string;
+    /** Agent context description */
+    context?: string;
+}
+export declare function ChatBar({ status, activeGate, jepaValidity, placeholder, context, className, }: ChatBarProps): React.ReactElement;
+export declare namespace ChatBar {
+    var displayName: string;
+}

package/dist/components/core/organisms/SubagentTracePanel.d.ts

@@ -0,0 +1,50 @@
+/**
+ * SubagentTracePanel — contextual side panel that surfaces subagent activity.
+ *
+ * Density adapts to disclosure level:
+ *   - L1/L2 (builder/designer): compact mode — name + role badge + last message
+ *   - L3/L4 (architect): full mode — rich per-subagent activity streams
+ *
+ * Atomic design: composes Box / VStack / HStack / Typography / Badge / Icon /
+ * Button / Modal / Accordion / CodeBlock / MarkdownContent from this package.
+ * It reads the agent-trace view-model from `@almadar/core` (Trace* types) and
+ * owns no transport — the consumer feeds it already-mapped view-model props.
+ */
+import React from 'react';
+import type { DisplayStateProps } from './types';
+import type { TraceActivity, TraceSubagent, TraceChatMessage } from '@almadar/core';
+/** Disclosure level driving panel density (builder=1 … architect=4). */
+export type TraceDisclosureLevel = 1 | 2 | 3 | 4;
+export interface SubagentTracePanelProps extends DisplayStateProps {
+    /** All known subagents from the runner. */
+    subagents: TraceSubagent[];
+    /** Current canvas focus orbital — only used by overlay mode. Tab mode ignores this. */
+    focusedOrbital?: string;
+    /** Drives density: 1-2 → compact, 3-4 → full activity embed (when mode='overlay'). */
+    disclosureLevel: TraceDisclosureLevel;
+    /** Whether the panel is visible. Typically auto-opens during generation in overlay mode. */
+    open: boolean;
+    /** Optional dismiss handler. */
+    onClose?: () => void;
+    /** Full coordinator activities (tool calls, results, messages, errors). */
+    coordinatorActivities?: TraceActivity[];
+    /**
+     * Canonical Coordinator conversation — same shape live and on reload. When
+     * present, takes precedence over `coordinatorActivities` for the Coordinator
+     * section.
+     */
+    coordinatorMessages?: readonly TraceChatMessage[];
+    /**
+     * Rendering mode.
+     * - `'overlay'` (default): floating side panel positioned absolutely over the
+     *   canvas. Density follows `disclosureLevel` (compact L1/L2, rich L3+). The
+     *   `open` flag actually hides the panel when false.
+     * - `'tab'`: full-width content for a dedicated 'trace' supplemental tab.
+     *   Always renders rich (regardless of disclosure level), always visible (the
+     *   `open` flag is ignored), and includes an empty state when no subagents
+     *   are present so users see the surface even before generation starts.
+     */
+    mode?: 'overlay' | 'tab';
+}
+export declare const SubagentTracePanel: React.FC<SubagentTracePanelProps>;
+export default SubagentTracePanel;

package/dist/components/core/organisms/index.d.ts

@@ -28,3 +28,6 @@ export { TeamOrganism, type TeamOrganismProps, } from "../../marketing/organisms
 export { CaseStudyOrganism, type CaseStudyOrganismProps, } from "../../marketing/organisms/CaseStudyOrganism";
 export { CodeRunnerPanel, type CodeRunnerPanelProps, type CodeSimulationOutput, } from './CodeRunnerPanel';
 export { SegmentRenderer, type SegmentRendererProps, } from './SegmentRenderer';
+export { ChatBar, type ChatBarProps, type ChatBarStatus } from './ChatBar';
+export { ELEMENT_SELECTED_EVENT, parseEditFocus, } from './trace-edit-focus';
+export { SubagentTracePanel, type SubagentTracePanelProps, type TraceDisclosureLevel, } from './SubagentTracePanel';

package/dist/components/core/organisms/trace-edit-focus.d.ts

@@ -0,0 +1,14 @@
+/**
+ * Edit Focus — the contextual-edit selection contract for the trace chat bar.
+ *
+ * A canvas element-pick emits `UI:ELEMENT_SELECTED` on the EventBus carrying an
+ * `EditFocus`. This module names that event and narrows the bus payload back
+ * into a typed `EditFocus` for `ChatBar`'s focus chip. It depends only on
+ * `@almadar/core` types; the DOM→focus build lives at the emitting canvas
+ * (`avl/derive-edit-focus`), not here.
+ */
+import type { EditFocus, EventPayloadValue } from '@almadar/core';
+/** The dedicated bus event a canvas element-pick emits. */
+export declare const ELEMENT_SELECTED_EVENT = "UI:ELEMENT_SELECTED";
+/** Narrow a `UI:ELEMENT_SELECTED` payload value back into an `EditFocus`. */
+export declare function parseEditFocus(value: EventPayloadValue | undefined): EditFocus | null;

package/dist/components/game/atoms/ChoiceButton.d.ts

@@ -1,8 +1,14 @@
+import { type IconInput } from '../../core/atoms/Icon';
+import type { AssetUrl } from '@almadar/core';
 export interface ChoiceButtonProps {
     /** Choice text content */
     text: string;
     /** Choice index number (displayed as prefix) */
     index?: number;
+    /** Sprite image URL — takes precedence over icon when provided */
+    assetUrl?: AssetUrl;
+    /** Icon displayed before the text */
+    icon?: IconInput;
     /** Whether the choice is disabled */
     disabled?: boolean;
     /** Whether the choice is currently selected */
@@ -12,7 +18,7 @@ export interface ChoiceButtonProps {
     /** Additional CSS classes */
     className?: string;
 }
-export declare function ChoiceButton({ text, index, disabled, selected, onClick, className, }: ChoiceButtonProps): import("react/jsx-runtime").JSX.Element;
+export declare function ChoiceButton({ text, index, assetUrl, icon, disabled, selected, onClick, className, }: ChoiceButtonProps): import("react/jsx-runtime").JSX.Element;
 export declare namespace ChoiceButton {
     var displayName: string;
 }

package/dist/components/game/molecules/HealthPanel.d.ts

@@ -1,6 +1,9 @@
 import type { IconInput } from '../../core/atoms';
+import type { AssetUrl } from '@almadar/core';
 export interface HealthEffect {
     icon: IconInput;
+    /** Sprite image URL — takes precedence over icon when provided */
+    assetUrl?: AssetUrl;
     label?: string;
     variant?: 'buff' | 'debuff' | 'neutral';
 }

package/dist/components/game/molecules/PowerupSlots.d.ts

@@ -1,7 +1,10 @@
 import type { IconInput } from '../../core/atoms';
+import type { AssetUrl } from '@almadar/core';
 export interface ActivePowerup {
     /** Unique powerup ID */
     id: string;
+    /** Sprite image URL — takes precedence over icon when provided */
+    assetUrl?: AssetUrl;
     /** Icon component or emoji */
     icon?: IconInput;
     /** Powerup label */

package/dist/components/game/molecules/TurnPanel.d.ts

@@ -1,7 +1,10 @@
 import type { IconInput } from '../../core/atoms';
+import type { AssetUrl } from '@almadar/core';
 export interface TurnPanelAction {
     /** Action button label */
     label: string;
+    /** Sprite image URL — takes precedence over icon when provided */
+    assetUrl?: AssetUrl;
     /** Icon for the button */
     icon?: IconInput;
     /** Event name to emit when clicked */

package/dist/components/game/molecules/three/index.cjs

@@ -2845,9 +2845,9 @@ var GameCanvas3D = React11.forwardRef(
         const color = unit.faction === "player" ? 4491519 : unit.faction === "enemy" ? 16729156 : 16777028;
         const hasAtlas = unitAtlasUrl(unit) !== null;
         const initialFrame = hasAtlas ? resolveUnitFrame(unit.id) : null;
-        const modelScale = UNIT_BASE_MODEL_SCALE * unitScale;
-        const billboardHeight = UNIT_BASE_BILLBOARD_HEIGHT * unitScale;
-        const primitiveRadius = UNIT_BASE_PRIMITIVE_RADIUS * unitScale;
+        const modelScale = UNIT_BASE_MODEL_SCALE * unitScale * gridConfig.cellSize;
+        const billboardHeight = UNIT_BASE_BILLBOARD_HEIGHT * unitScale * gridConfig.cellSize;
+        const primitiveRadius = UNIT_BASE_PRIMITIVE_RADIUS * unitScale * gridConfig.cellSize;
         return /* @__PURE__ */ jsxRuntime.jsxs(
           "group",
           {
@@ -2894,7 +2894,7 @@ var GameCanvas3D = React11.forwardRef(
                   /* @__PURE__ */ jsxRuntime.jsx("meshStandardMaterial", { color })
                 ] })
               ] }),
-              unit.health !== void 0 && unit.maxHealth !== void 0 && /* @__PURE__ */ jsxRuntime.jsxs("group", { position: [0, 1.2, 0], children: [
+              unit.health !== void 0 && unit.maxHealth !== void 0 && /* @__PURE__ */ jsxRuntime.jsxs("group", { position: [0, billboardHeight, 0], children: [
                 /* @__PURE__ */ jsxRuntime.jsxs("mesh", { position: [-0.25, 0, 0], children: [
                   /* @__PURE__ */ jsxRuntime.jsx("planeGeometry", { args: [0.5, 0.05] }),
                   /* @__PURE__ */ jsxRuntime.jsx("meshBasicMaterial", { color: 3355443 })
@@ -2923,7 +2923,7 @@ var GameCanvas3D = React11.forwardRef(
           }
         );
       },
-      [selectedUnitId, handleUnitClick, resolveUnitFrame, unitScale]
+      [selectedUnitId, handleUnitClick, resolveUnitFrame, unitScale, gridConfig]
     );
     const DefaultFeatureRenderer = React11.useCallback(
       ({
@@ -3011,7 +3011,7 @@ var GameCanvas3D = React11.forwardRef(
           {
             ref: containerRef,
             className: cn("game-canvas-3d relative w-full overflow-hidden", className),
-            style: { height: "85vh" },
+            style: { flex: "1 1 0", minHeight: "400px" },
             "data-orientation": orientation,
             "data-camera-mode": cameraMode,
             "data-overlay": overlay,