@almadar/ui 6.23.0 → 6.24.0

package/dist/avl/index.js

@@ -7,7 +7,7 @@ import ELK from 'elkjs/lib/elk.bundled.js';
 import { MarkerType, useReactFlow, Handle, Position, getBezierPath, EdgeLabelRenderer, useNodeId, ReactFlowProvider, BaseEdge, useNodesState, useEdgesState, ReactFlow, Controls, Background, BackgroundVariant } from '@xyflow/react';
 import { useTranslate } from '@almadar/ui/hooks';
 import { InMemoryPersistence, StateMachineManager, collectDeclaredConfigDefaults, createServerEffectHandlers, EffectExecutor, LIFECYCLE_EVENTS, createContextFromBindings, createTickScheduler, isValidCronExpression, parseDurationString, normalizeCallSiteConfigToValues, interpolateValue } from '@almadar/runtime';
-import { FieldTypeSchema, isInlineTrait, isPageReference, buildResolvedTraitConfigs, collectCallsiteCaptureChildren, schemaToIR, getPage, mergeEntityFrame, isCircuitEvent, applyListenPayloadMapping, walkSExpr, isRenderBindingMarker, containsEntityBinding, isSExpr, isEventPayloadValue, RENDER_BINDING_MARKER, getNestedValue, isFileValue } from '@almadar/core';
+import { UI_SLOTS, FieldTypeSchema, isInlineTrait, isPageReference, buildResolvedTraitConfigs, collectCallsiteCaptureChildren, schemaToIR, getPage, mergeEntityFrame, isCircuitEvent, applyListenPayloadMapping, walkSExpr, isRenderBindingMarker, containsEntityBinding, isSExpr, isEventPayloadValue, RENDER_BINDING_MARKER, getNestedValue, isFileValue } from '@almadar/core';
 import * as LucideIcons2 from 'lucide-react';
 import { Loader2, X, Code, FileText, WrapText, Check, Copy, Lightbulb, CheckCircle, List, Printer, ChevronRight, ChevronLeft, GitBranch, Pencil, Eye, Plus, ArrowRight, Trash, RotateCcw, Play, Terminal, XCircle, AlertTriangle, Trash2, Link2, ArrowLeft, ZoomOut, ZoomIn, Download, DollarSign, ChevronDown, Menu as Menu$1, Package, Calendar, MoreHorizontal, Image as Image$1, Upload, HelpCircle, PauseCircle, Search, Bold, Italic, Underline, Strikethrough, Heading1, Heading2, Heading3, ListOrdered, Quote, Link as Link$1, Minus, Eraser, TrendingUp, TrendingDown, AlertCircle, Circle, Clock, CheckCircle2, ChevronUp } from 'lucide-react';
 import { createPortal } from 'react-dom';
@@ -37264,13 +37264,13 @@ var init_MapView = __esm({
         shadowSize: [41, 41]
       });
       L.Marker.prototype.options.icon = defaultIcon;
-      const { useEffect: useEffect71, useRef: useRef70, useCallback: useCallback101, useState: useState109 } = React96__default;
+      const { useEffect: useEffect72, useRef: useRef71, useCallback: useCallback102, useState: useState110 } = React96__default;
       const { Typography: Typography2 } = await Promise.resolve().then(() => (init_Typography(), Typography_exports));
       const { useEventBus: useEventBus2 } = await Promise.resolve().then(() => (init_useEventBus(), useEventBus_exports));
       function MapUpdater({ centerLat, centerLng, zoom }) {
         const map = useMap();
-        const prevRef = useRef70({ centerLat, centerLng, zoom });
-        useEffect71(() => {
+        const prevRef = useRef71({ centerLat, centerLng, zoom });
+        useEffect72(() => {
           const prev = prevRef.current;
           if (prev.centerLat !== centerLat || prev.centerLng !== centerLng || prev.zoom !== zoom) {
             map.setView([centerLat, centerLng], zoom);
@@ -37281,7 +37281,7 @@ var init_MapView = __esm({
       }
       function MapClickHandler({ onMapClick }) {
         const map = useMap();
-        useEffect71(() => {
+        useEffect72(() => {
           if (!onMapClick) return;
           const handler = (e) => {
             onMapClick(e.latlng.lat, e.latlng.lng);
@@ -37309,8 +37309,8 @@ var init_MapView = __esm({
         showAttribution = true
       }) {
         const eventBus = useEventBus2();
-        const [clickedPosition, setClickedPosition] = useState109(null);
-        const handleMapClick = useCallback101((lat, lng) => {
+        const [clickedPosition, setClickedPosition] = useState110(null);
+        const handleMapClick = useCallback102((lat, lng) => {
           if (showClickedPin) {
             setClickedPosition({ lat, lng });
           }
@@ -37319,7 +37319,7 @@ var init_MapView = __esm({
             eventBus.emit(`UI:${mapClickEvent}`, { latitude: lat, longitude: lng });
           }
         }, [onMapClick, mapClickEvent, eventBus, showClickedPin]);
-        const handleMarkerClick = useCallback101((marker) => {
+        const handleMarkerClick = useCallback102((marker) => {
           onMarkerClick?.(marker);
           if (markerClickEvent) {
             eventBus.emit(`UI:${markerClickEvent}`, { ...marker });
@@ -51635,7 +51635,7 @@ function getAllEvents(traits2) {
 function EventDispatcherTab({ traits: traits2, schema }) {
   const eventBus = useEventBus();
   const { t } = useTranslate();
-  const [log12, setLog] = React96.useState([]);
+  const [log13, setLog] = React96.useState([]);
   const prevStatesRef = React96.useRef(/* @__PURE__ */ new Map());
   React96.useEffect(() => {
     for (const trait of traits2) {
@@ -51699,9 +51699,9 @@ function EventDispatcherTab({ traits: traits2, schema }) {
       /* @__PURE__ */ jsx(Typography, { variant: "small", weight: "medium", className: "text-muted-foreground mb-1", children: t("debug.otherEvents") }),
       /* @__PURE__ */ jsx("div", { className: "flex flex-wrap gap-1", children: unavailableEvents.map((event) => /* @__PURE__ */ jsx(Badge, { variant: "default", size: "sm", className: "opacity-50", children: event }, event)) })
     ] }),
-    log12.length > 0 && /* @__PURE__ */ jsxs("div", { children: [
+    log13.length > 0 && /* @__PURE__ */ jsxs("div", { children: [
       /* @__PURE__ */ jsx(Typography, { variant: "small", weight: "medium", className: "text-muted-foreground mb-1", children: t("debug.recentTransitions") }),
-      /* @__PURE__ */ jsx(Stack, { gap: "xs", children: log12.map((entry, i) => /* @__PURE__ */ jsxs(Typography, { variant: "small", className: "font-mono text-xs", children: [
+      /* @__PURE__ */ jsx(Stack, { gap: "xs", children: log13.map((entry, i) => /* @__PURE__ */ jsxs(Typography, { variant: "small", className: "font-mono text-xs", children: [
         /* @__PURE__ */ jsx("span", { className: "text-primary", children: entry.traitName }),
         " ",
         /* @__PURE__ */ jsx("span", { className: "text-muted-foreground", children: entry.from }),
@@ -58996,7 +58996,25 @@ function convertFnFormLambdasInProps(props) {
 
 // hooks/index.ts
 init_useEventBus();
-var log8 = createLogger("almadar:ui:shared-entity-store");
+createLogger("almadar:ui:ui-slots");
+var ALL_SLOTS2 = UI_SLOTS.filter(
+  (slot) => !slot.includes(".") && slot !== "hud" && slot !== "screen"
+);
+ALL_SLOTS2.reduce(
+  (acc, slot) => {
+    acc[slot] = null;
+    return acc;
+  },
+  {}
+);
+ALL_SLOTS2.reduce(
+  (acc, slot) => {
+    acc[slot] = {};
+    return acc;
+  },
+  {}
+);
+var log9 = createLogger("almadar:ui:shared-entity-store");
 var EMPTY_ENTITY_STATE = {};
 function createSharedEntityStore() {
   const states = /* @__PURE__ */ new Map();
@@ -59026,7 +59044,7 @@ function createSharedEntityStore() {
       try {
         callback();
       } catch (error) {
-        log8.error("Shared entity subscriber error", {
+        log9.error("Shared entity subscriber error", {
           entityId,
           error: error instanceof Error ? error : String(error)
         });
@@ -59057,7 +59075,7 @@ function runTickFrame(entityId, orderedWriters, store) {
   store.commit(entityId, scratch);
   return scratch;
 }
-var log9 = createLogger("almadar:ui:effects:client-handlers");
+var log10 = createLogger("almadar:ui:effects:client-handlers");
 function createClientEffectHandlers(options) {
   const { eventBus, slotSetter, navigate, navigateBack, callService, liveEntity, persistDelegated, callServiceDelegated } = options;
   return {
@@ -59066,7 +59084,7 @@ function createClientEffectHandlers(options) {
       eventBus.emit(prefixedEvent, payload, source);
     },
     persist: async () => {
-      log9.debug("persist is server-side only, ignored on client");
+      log10.debug("persist is server-side only, ignored on client");
     },
     // Bridge mode: the server runs every persist and the response
     // carries its outcome — tell the executor so the placeholder above is
@@ -59076,7 +59094,7 @@ function createClientEffectHandlers(options) {
     // @almadar/runtime EffectHandlers.set types value:unknown — should be FieldValue (upstream fix queued)
     set: ((_entityId, field, value) => {
       if (!liveEntity) {
-        log9.warn("set is server-side only, ignored on client (no live entity)");
+        log10.warn("set is server-side only, ignored on client (no live entity)");
         return;
       }
       liveEntity[field] = value;
@@ -59112,10 +59130,10 @@ function createClientEffectHandlers(options) {
         window.location.href = path;
         return;
       }
-      log9.warn("No navigate handler, ignoring", { path });
+      log10.warn("No navigate handler, ignoring", { path });
     }),
     navigateBack: navigateBack ?? (() => {
-      log9.warn("No navigate-back handler, ignoring");
+      log10.warn("No navigate-back handler, ignoring");
     })
   };
 }
@@ -59197,6 +59215,13 @@ function effectsCallOp(effects, ops) {
   }
   return false;
 }
+function diffDroppedTraitNames(prev, next) {
+  const dropped = [];
+  for (const name of prev) {
+    if (!next.has(name)) dropped.push(name);
+  }
+  return dropped;
+}
 function classifySharedTick(tick) {
   const writes = effectsCallOp(tick.effects, SHARED_ENTITY_WRITE_OPS);
   const renders = effectsCallOp(tick.effects, SHARED_ENTITY_RENDER_OPS);
@@ -59399,6 +59424,7 @@ function useTraitStateMachine(traitBindings, uiSlots, options) {
   const uiSlotsRef = useRef(uiSlots);
   const embeddedTraitsRef = useRef(options?.embeddedTraits);
   const optionsRef = useRef(options);
+  const prevActiveTraitNamesRef = useRef(/* @__PURE__ */ new Set());
   useEffect(() => {
     traitBindingsRef.current = traitBindings;
   }, [traitBindings]);
@@ -59527,6 +59553,18 @@ function useTraitStateMachine(traitBindings, uiSlots, options) {
     };
   }, [traitBindings]);
   useEffect(() => {
+    const nextActiveTraitNames = new Set(
+      traitBindings.map((b) => b.trait.name).filter((n) => !!n)
+    );
+    const dropped = diffDroppedTraitNames(prevActiveTraitNamesRef.current, nextActiveTraitNames);
+    if (dropped.length > 0) {
+      for (const traitName of dropped) {
+        for (const slot of ALL_SLOTS2) {
+          uiSlotsRef.current.clearBySource(slot, traitName);
+        }
+      }
+    }
+    prevActiveTraitNamesRef.current = nextActiveTraitNames;
     const newManager = managerRef.current;
     newManager.resetAll();
     setTraitStates(newManager.getAllStates());
@@ -59574,7 +59612,7 @@ function useTraitStateMachine(traitBindings, uiSlots, options) {
     };
   }, [traitBindings]);
   const executeTransitionEffects = useCallback(async (params) => {
-    const { binding, previousState, newState, payload, flushEvent, syncOnly, log: log12, callsitePayload } = params;
+    const { binding, previousState, newState, payload, flushEvent, syncOnly, log: log13, callsitePayload } = params;
     const traitName = binding.trait.name;
     const linkedEntity = binding.linkedEntity || "";
     const entityId = payload?.entityId;
@@ -59711,7 +59749,7 @@ function useTraitStateMachine(traitBindings, uiSlots, options) {
         if (sharedKey !== void 0) {
           sharedWrites.push({ field, value });
         }
-        log12.debug("set:write", {
+        log13.debug("set:write", {
           traitName,
           field,
           value: JSON.stringify(value),
@@ -59783,7 +59821,7 @@ function useTraitStateMachine(traitBindings, uiSlots, options) {
           mergeEntityFrame(sharedEntityStore.getSnapshot(sharedKey), sharedWrites)
         );
       }
-      log12.debug("effects:executed", () => ({
+      log13.debug("effects:executed", () => ({
         traitName,
         transition: `${previousState}->${newState}`,
         event: flushEvent,
@@ -59793,7 +59831,7 @@ function useTraitStateMachine(traitBindings, uiSlots, options) {
         slotsTouched: Array.from(pendingSlots.keys()).join(",")
       }));
       for (const [slot, patterns] of pendingSlots) {
-        log12.debug("flush:slot", {
+        log13.debug("flush:slot", {
           traitName,
           slot,
           patternCount: patterns.length,
@@ -59811,7 +59849,7 @@ function useTraitStateMachine(traitBindings, uiSlots, options) {
         publishBindingSnapshot(traitName, liveEntity);
       }
     } catch (error) {
-      log12.error("effects:error", {
+      log13.error("effects:error", {
         traitName,
         transition: `${previousState}->${newState}`,
         event: flushEvent,
@@ -59821,7 +59859,7 @@ function useTraitStateMachine(traitBindings, uiSlots, options) {
     }
     return { emitted: emittedDuringExec, serverEffectResults };
   }, [eventBus, flushSlot, sharedEntityStore, publishBindingSnapshot, orbitalsByTrait, viewer]);
-  const reRenderCallsiteCaptureChildren = useCallback(async (traitName, callsitePayload, entityByTrait, log12, visited = /* @__PURE__ */ new Set()) => {
+  const reRenderCallsiteCaptureChildren = useCallback(async (traitName, callsitePayload, entityByTrait, log13, visited = /* @__PURE__ */ new Set()) => {
     const children = callsiteCaptureChildrenByTrait?.get(traitName);
     if (!children || children.size === 0) return;
     const mgr = managerRef.current;
@@ -59835,7 +59873,7 @@ function useTraitStateMachine(traitBindings, uiSlots, options) {
       if (lifecycleEvent === void 0) continue;
       const [entry] = mgr.sendEvent(lifecycleEvent, {}, void 0, entityByTrait, void 0, childName);
       if (!entry || !entry.result.executed) continue;
-      log12.debug("callsite-capture-child:rerender", {
+      log13.debug("callsite-capture-child:rerender", {
         referrer: traitName,
         child: childName,
         lifecycleEvent,
@@ -59849,10 +59887,10 @@ function useTraitStateMachine(traitBindings, uiSlots, options) {
         payload: {},
         flushEvent: lifecycleEvent,
         syncOnly: false,
-        log: log12,
+        log: log13,
         callsitePayload
       });
-      await reRenderCallsiteCaptureChildren(childName, callsitePayload, entityByTrait, log12, visited);
+      await reRenderCallsiteCaptureChildren(childName, callsitePayload, entityByTrait, log13, visited);
     }
   }, [callsiteCaptureChildrenByTrait, executeTransitionEffects]);
   const runTickEffects = useCallback((tick, binding) => {
@@ -61076,7 +61114,7 @@ init_useEventBus();
 // components/avl/hooks/useCanvasDnd.tsx
 init_useEventBus();
 init_useAlmadarDndCollision();
-var log10 = createLogger("almadar:ui:canvas-dnd");
+var log11 = createLogger("almadar:ui:canvas-dnd");
 function useCanvasDraggable({
   id,
   payload,
@@ -61114,7 +61152,7 @@ function defaultEmit(eventBus, drop) {
   if (payload.kind === "pattern") {
     const patternType = payload.data["type"];
     if (typeof patternType !== "string") {
-      log10.warn("default-emit:pattern:missing-type");
+      log11.warn("default-emit:pattern:missing-type");
       return;
     }
     const out = { patternType, containerNode: target.containerNode };
@@ -61123,26 +61161,26 @@ function defaultEmit(eventBus, drop) {
       out.index = resolved.index;
     }
     eventBus.emit("UI:PATTERN_DROP", out);
-    log10.info("default-emit:pattern", { patternType, level: target.level });
+    log11.info("default-emit:pattern", { patternType, level: target.level });
     return;
   }
   if (payload.kind === "behavior") {
     const behaviorName = payload.data["name"];
     if (typeof behaviorName !== "string") {
-      log10.warn("default-emit:behavior:missing-name");
+      log11.warn("default-emit:behavior:missing-name");
       return;
     }
     eventBus.emit("UI:BEHAVIOR_DROP", {
       behaviorName,
       containerNode: target.containerNode
     });
-    log10.info("default-emit:behavior", { behaviorName, level: target.level });
+    log11.info("default-emit:behavior", { behaviorName, level: target.level });
     return;
   }
   if (payload.kind === "pattern-instance") {
     const fromPath = payload.data["fromPath"];
     if (typeof fromPath !== "string") {
-      log10.warn("default-emit:pattern-instance:missing-fromPath");
+      log11.warn("default-emit:pattern-instance:missing-fromPath");
       return;
     }
     const out = { fromPath, loc: payload.data["loc"] };
@@ -61151,10 +61189,10 @@ function defaultEmit(eventBus, drop) {
       out.toIndex = resolved.index;
     }
     eventBus.emit("UI:PATTERN_MOVE", out);
-    log10.info("default-emit:pattern-instance", { fromPath, level: target.level });
+    log11.info("default-emit:pattern-instance", { fromPath, level: target.level });
     return;
   }
-  log10.debug("default-emit:unhandled-kind", { kind: payload.kind });
+  log11.debug("default-emit:unhandled-kind", { kind: payload.kind });
 }
 function CanvasDndProvider({
   children,
@@ -61177,9 +61215,9 @@ function CanvasDndProvider({
     if (payload) {
       setActivePayload(payload);
       eventBus.emit("UI:DRAG_START", { kind: payload.kind, data: payload.data });
-      log10.info("dragStart", { id: e.active.id, kind: payload.kind });
+      log11.info("dragStart", { id: e.active.id, kind: payload.kind });
     } else {
-      log10.warn("dragStart:missing-payload", { id: e.active.id });
+      log11.warn("dragStart:missing-payload", { id: e.active.id });
     }
   }, [eventBus, trackPointer]);
   const handleDragEnd = React96__default.useCallback((e) => {
@@ -61190,7 +61228,7 @@ function CanvasDndProvider({
     const overData = e.over?.data.current;
     const target = overData?.target;
     const accepts = overData?.accepts;
-    log10.info("dragEnd", {
+    log11.info("dragEnd", {
       activeId: e.active.id,
       overId: e.over?.id,
       hasPayload: !!payload,
@@ -61202,12 +61240,12 @@ function CanvasDndProvider({
     }
     if (!payload || !target) return;
     if (accepts && !accepts.includes(payload.kind)) {
-      log10.debug("dragEnd:rejected:kind", { kind: payload.kind, accepts: [...accepts] });
+      log11.debug("dragEnd:rejected:kind", { kind: payload.kind, accepts: [...accepts] });
       return;
     }
     const cursor = lastPointerRef.current;
     const resolved = target.resolvePath && cursor ? target.resolvePath(cursor) : null;
-    log10.debug("dragEnd:resolve", {
+    log11.debug("dragEnd:resolve", {
       hasResolver: !!target.resolvePath,
       cursorX: cursor?.x,
       cursorY: cursor?.y,
@@ -61221,7 +61259,7 @@ function CanvasDndProvider({
   const handleDragCancel = React96__default.useCallback(() => {
     setActivePayload(null);
     document.removeEventListener("pointermove", trackPointer);
-    log10.info("dragCancel");
+    log11.info("dragCancel");
   }, [trackPointer]);
   return /* @__PURE__ */ jsxs(
     DndContext,
@@ -63280,7 +63318,7 @@ init_AvlTransitionLane();
 init_AvlSwimLane();
 init_avl_atom_types();
 init_avl_elk_layout();
-var log11 = createLogger("almadar:ui:avl:trait-scene");
+var log12 = createLogger("almadar:ui:avl:trait-scene");
 var SWIM_GUTTER2 = 120;
 var CENTER_W2 = 360;
 var AvlTraitScene = ({
@@ -63293,7 +63331,7 @@ var AvlTraitScene = ({
   const dataKey = useMemo(() => JSON.stringify(data), [data]);
   useEffect(() => {
     computeTraitLayout(data).then(setLayout).catch((error) => {
-      log11.error("computeTraitLayout failed", { error: error instanceof Error ? error : String(error) });
+      log12.error("computeTraitLayout failed", { error: error instanceof Error ? error : String(error) });
     });
   }, [dataKey]);
   if (!layout) {