@almadar/ui 5.156.0 → 5.158.0

package/dist/providers/index.js

@@ -286,11 +286,32 @@ function isPlainObject(value) {
   if (typeof value === "function") return false;
   return true;
 }
+function subtreeHasMarker(value) {
+  const cached = markerPresenceCache.get(value);
+  if (cached !== void 0) return cached;
+  let found = false;
+  const children = Array.isArray(value) ? value : Object.values(value);
+  for (const child of children) {
+    if (isRenderBindingMarker(child)) {
+      found = true;
+      break;
+    }
+    if (Array.isArray(child) || isPlainObject(child)) {
+      if (subtreeHasMarker(child)) {
+        found = true;
+        break;
+      }
+    }
+  }
+  markerPresenceCache.set(value, found);
+  return found;
+}
 function walkValue(value, scopeTrait, entity, config, state) {
   if (isRenderBindingMarker(value)) {
     return { resolved: resolveMarkerExpression(value.expression, entity, config, state), changed: true };
   }
   if (Array.isArray(value)) {
+    if (!subtreeHasMarker(value)) return { resolved: value, changed: false };
     const out = [];
     let changed = false;
     for (const item of value) {
@@ -308,6 +329,7 @@ function walkValue(value, scopeTrait, entity, config, state) {
     return changed ? { resolved: out, changed: true } : { resolved: value, changed: false };
   }
   if (isPlainObject(value)) {
+    if (!subtreeHasMarker(value)) return { resolved: value, changed: false };
     const sourceTrait = value._sourceTrait;
     if (typeof sourceTrait === "string" && sourceTrait !== scopeTrait) {
       return { resolved: value, changed: false };
@@ -333,9 +355,11 @@ function resolveRenderBindingMarkers(props, scopeTrait, entity, config, state) {
   }
   return changed ? out : props;
 }
+var markerPresenceCache;
 var init_resolve_render_bindings = __esm({
   "lib/resolve-render-bindings.ts"() {
     "use client";
+    markerPresenceCache = /* @__PURE__ */ new WeakMap();
   }
 });
 function cn(...inputs) {
@@ -11962,6 +11986,8 @@ function drawShape(ctx, shape, width, height, allShapes) {
     case "path": {
       if (!shape.path) break;
       const p = new Path2D(shape.path);
+      ctx.lineJoin = "round";
+      ctx.lineCap = "round";
       if (fill) {
         ctx.fillStyle = fill;
         ctx.fill(p);
@@ -12170,7 +12196,7 @@ var init_LearningCanvas = __esm({
         ctx.setTransform(dpr, 0, 0, dpr, 0, 0);
         ctx.clearRect(0, 0, width, height);
         if (backgroundColor) {
-          ctx.fillStyle = backgroundColor;
+          ctx.fillStyle = resolveColor2(backgroundColor, ctx, backgroundColor);
           ctx.fillRect(0, 0, width, height);
         }
         for (const shape of derivedShapes) {
@@ -27366,7 +27392,7 @@ function fileIcon(name) {
       return "file";
   }
 }
-var TreeNodeItem, FileTree;
+var TreeNodeItem, FlatTreeNodeItem, FileTree;
 var init_FileTree = __esm({
   "components/core/molecules/FileTree.tsx"() {
     "use client";
@@ -27451,14 +27477,101 @@ var init_FileTree = __esm({
         )) })
       ] });
     };
+    FlatTreeNodeItem = ({
+      item,
+      depth,
+      indent,
+      childrenByParent,
+      onNodeSelect,
+      defaultExpanded = false
+    }) => {
+      const [expanded, setExpanded] = useState(defaultExpanded || depth < 1);
+      const children = childrenByParent.get(item.id);
+      const hasChildren = !!children && children.length > 0;
+      const handleClick = useCallback(() => {
+        if (hasChildren) setExpanded((prev) => !prev);
+        onNodeSelect?.(item.id);
+      }, [hasChildren, item.id, onNodeSelect]);
+      return /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsxs(
+          Box,
+          {
+            className: "flex items-center gap-1.5 py-0.5 px-2 cursor-pointer rounded-sm transition-colors hover:bg-muted",
+            style: { paddingLeft: depth * indent + 8 },
+            onClick: handleClick,
+            role: "treeitem",
+            "aria-expanded": hasChildren ? expanded : void 0,
+            children: [
+              hasChildren ? /* @__PURE__ */ jsx(
+                Icon,
+                {
+                  name: expanded ? "chevron-down" : "chevron-right",
+                  size: "xs",
+                  className: "text-[var(--color-muted-foreground)] flex-shrink-0"
+                }
+              ) : /* @__PURE__ */ jsx(Box, { style: { width: 12, flexShrink: 0 } }),
+              /* @__PURE__ */ jsx(
+                Icon,
+                {
+                  name: item.icon ?? (hasChildren ? expanded ? "folder-open" : "folder" : "file"),
+                  size: "xs",
+                  className: hasChildren ? "text-[var(--color-warning)]" : "text-[var(--color-muted-foreground)]"
+                }
+              ),
+              /* @__PURE__ */ jsx(Typography, { variant: "caption", className: "truncate font-mono text-xs", children: item.label })
+            ]
+          }
+        ),
+        hasChildren && expanded && /* @__PURE__ */ jsx(Box, { role: "group", children: children.map((child) => /* @__PURE__ */ jsx(
+          FlatTreeNodeItem,
+          {
+            item: child,
+            depth: depth + 1,
+            indent,
+            childrenByParent,
+            onNodeSelect
+          },
+          child.id
+        )) })
+      ] });
+    };
     FileTree = ({
       tree,
+      items,
       selectedPath,
       onFileSelect,
+      onNodeSelect,
       className,
       indent = 16
     }) => {
-      if (tree.length === 0) return null;
+      if (items) {
+        if (items.length === 0) return null;
+        const ids = new Set(items.map((node) => node.id));
+        const childrenByParent = /* @__PURE__ */ new Map();
+        const roots = [];
+        for (const item of items) {
+          if (item.parentId && ids.has(item.parentId)) {
+            const siblings = childrenByParent.get(item.parentId);
+            if (siblings) siblings.push(item);
+            else childrenByParent.set(item.parentId, [item]);
+          } else {
+            roots.push(item);
+          }
+        }
+        return /* @__PURE__ */ jsx(Box, { className: `py-1 overflow-y-auto ${className ?? ""}`, role: "tree", children: roots.map((item) => /* @__PURE__ */ jsx(
+          FlatTreeNodeItem,
+          {
+            item,
+            depth: 0,
+            indent,
+            childrenByParent,
+            onNodeSelect,
+            defaultExpanded: true
+          },
+          item.id
+        )) });
+      }
+      if (!tree || tree.length === 0) return null;
       return /* @__PURE__ */ jsx(Box, { className: `py-1 overflow-y-auto ${className ?? ""}`, role: "tree", children: tree.map((node) => /* @__PURE__ */ jsx(
         TreeNodeItem,
         {
@@ -28853,7 +28966,7 @@ var init_debug = __esm({
     createLogger("almadar:ui:debug:game-state");
   }
 });
-var isRelationsDebugEnabled, RelationSelect;
+var isRelationsDebugEnabled, MANY_CARDINALITIES, RelationSelect;
 var init_RelationSelect = __esm({
   "components/core/molecules/RelationSelect.tsx"() {
     "use client";
@@ -28867,6 +28980,11 @@ var init_RelationSelect = __esm({
     init_Typography();
     init_debug();
     isRelationsDebugEnabled = () => isDebugEnabled();
+    MANY_CARDINALITIES = [
+      "many",
+      "one-to-many",
+      "many-to-many"
+    ];
     RelationSelect = ({
       value,
       onChange,
@@ -30506,6 +30624,9 @@ var init_MathCanvas = __esm({
       showAxes = true,
       showGrid = true,
       gridStep = 1,
+      backgroundColor,
+      gridColor = "var(--color-border, #9ca3af)",
+      axisColor = "var(--color-muted-foreground, #374151)",
       showTickLabels = false,
       showCurveLabels = false,
       curves = [],
@@ -30528,17 +30649,21 @@ var init_MathCanvas = __esm({
       error
     }) => {
       const eventBus = useEventBus();
+      const keyMapKey = keyMap ? JSON.stringify(keyMap) : null;
+      const keyUpMapKey = keyUpMap ? JSON.stringify(keyUpMap) : null;
+      const stableKeyMap = useMemo(() => keyMap, [keyMapKey]);
+      const stableKeyUpMap = useMemo(() => keyUpMap, [keyUpMapKey]);
       useEffect(() => {
-        if (!keyMap && !keyUpMap) return;
+        if (!stableKeyMap && !stableKeyUpMap) return;
         const onDown = (e) => {
-          const ev = keyMap?.[e.code];
+          const ev = stableKeyMap?.[e.code];
           if (ev) {
             eventBus.emit(`UI:${ev}`, {});
             e.preventDefault();
           }
         };
         const onUp = (e) => {
-          const ev = keyUpMap?.[e.code];
+          const ev = stableKeyUpMap?.[e.code];
           if (ev) eventBus.emit(`UI:${ev}`, {});
         };
         window.addEventListener("keydown", onDown);
@@ -30547,7 +30672,7 @@ var init_MathCanvas = __esm({
           window.removeEventListener("keydown", onDown);
           window.removeEventListener("keyup", onUp);
         };
-      }, [keyMap, keyUpMap, eventBus]);
+      }, [stableKeyMap, stableKeyUpMap, eventBus]);
       const derivedShapes = useMemo(() => {
         const out = [];
         const margin = 24;
@@ -30560,11 +30685,11 @@ var init_MathCanvas = __esm({
         if (showGrid) {
           for (let x = Math.ceil(xMin / gridStep) * gridStep; x <= xMax; x += gridStep) {
             const px = mapX(x);
-            out.push({ type: "line", x1: px, y1: margin, x2: px, y2: height - margin, color: "#9ca3af", opacity: 0.35, lineWidth: 1 });
+            out.push({ type: "line", x1: px, y1: margin, x2: px, y2: height - margin, color: gridColor, opacity: 0.35, lineWidth: 1 });
           }
           for (let y = Math.ceil(yMin / gridStep) * gridStep; y <= yMax; y += gridStep) {
             const py = mapY(y);
-            out.push({ type: "line", x1: margin, y1: py, x2: width - margin, y2: py, color: "#9ca3af", opacity: 0.35, lineWidth: 1 });
+            out.push({ type: "line", x1: margin, y1: py, x2: width - margin, y2: py, color: gridColor, opacity: 0.35, lineWidth: 1 });
           }
         }
         if (showTickLabels) {
@@ -30635,8 +30760,8 @@ var init_MathCanvas = __esm({
           });
         }
         if (showAxes) {
-          out.push({ type: "line", x1: margin, y1: xAxisY, x2: width - margin, y2: xAxisY, color: "#374151", lineWidth: 2 });
-          out.push({ type: "line", x1: yAxisX, y1: margin, x2: yAxisX, y2: height - margin, color: "#374151", lineWidth: 2 });
+          out.push({ type: "line", x1: margin, y1: xAxisY, x2: width - margin, y2: xAxisY, color: axisColor, lineWidth: 2 });
+          out.push({ type: "line", x1: yAxisX, y1: margin, x2: yAxisX, y2: height - margin, color: axisColor, lineWidth: 2 });
         }
         for (const guide of guides) {
           const color = guide.color ?? "#9ca3af";
@@ -30659,23 +30784,36 @@ var init_MathCanvas = __esm({
         }
         for (const curve of curves) {
           if (!curve.samples || curve.samples.length < 2) continue;
+          let d = "";
+          let penDown = false;
           let lastInRange;
           for (let i = 1; i < curve.samples.length; i++) {
             const a = curve.samples[i - 1];
             const b = curve.samples[i];
-            if (a.x < xMin || a.x > xMax || b.x < xMin || b.x > xMax) continue;
-            out.push({
-              type: "line",
-              x1: mapX(a.x),
-              y1: mapY(a.y),
-              x2: mapX(b.x),
-              y2: mapY(b.y),
-              color: curve.color ?? "#2563eb",
-              lineWidth: 2,
-              dash: curve.dash
-            });
-            lastInRange = b;
-          }
+            if (a.x < xMin && b.x < xMin || a.x > xMax && b.x > xMax) {
+              penDown = false;
+              continue;
+            }
+            const clip = (p, q, xLim) => {
+              const t = q.x === p.x ? 0 : (xLim - p.x) / (q.x - p.x);
+              return { x: xLim, y: p.y + t * (q.y - p.y) };
+            };
+            const ca = a.x < xMin ? clip(a, b, xMin) : a.x > xMax ? clip(a, b, xMax) : a;
+            const cb = b.x < xMin ? clip(a, b, xMin) : b.x > xMax ? clip(a, b, xMax) : b;
+            const pax = mapX(ca.x);
+            const pay = mapY(ca.y);
+            d += `${penDown ? "L" : "M"} ${pax} ${pay} L ${mapX(cb.x)} ${mapY(cb.y)} `;
+            penDown = true;
+            if (b.x >= xMin && b.x <= xMax) lastInRange = b;
+          }
+          if (!d) continue;
+          out.push({
+            type: "path",
+            path: d,
+            color: curve.color ?? "#2563eb",
+            lineWidth: 2,
+            dash: curve.dash
+          });
           if (showCurveLabels && curve.label && lastInRange) {
             out.push({
               type: "text",
@@ -30790,6 +30928,8 @@ var init_MathCanvas = __esm({
         showAxes,
         showGrid,
         gridStep,
+        gridColor,
+        axisColor,
         showTickLabels,
         showCurveLabels,
         curves,
@@ -30809,6 +30949,7 @@ var init_MathCanvas = __esm({
           {
             width,
             height,
+            backgroundColor,
             shapes: derivedShapes,
             readouts,
             traces,
@@ -42968,6 +43109,9 @@ function determineInputType(field) {
   if (field.type === "relation" || field.relation) {
     return "relation";
   }
+  if (field.type === "array") {
+    return "array";
+  }
   if (field.type === "enum" || field.values || getEnumOptions(field).length > 0) {
     return "select";
   }
@@ -43043,6 +43187,7 @@ var init_Form = __esm({
     init_Typography();
     init_Icon();
     init_RelationSelect();
+    init_TagInput();
     init_UploadDropZone();
     init_Alert();
     init_useEventBus();
@@ -43122,7 +43267,7 @@ var init_Form = __esm({
             values: "values" in f3 ? f3.values : void 0,
             min: f3.min,
             max: f3.max,
-            relation: "relation" in f3 ? { entity: f3.relation.entity } : void 0
+            relation: "relation" in f3 ? { entity: f3.relation.entity, cardinality: f3.relation.cardinality } : void 0
           })
         );
       }, [entity, fields]);
@@ -43357,7 +43502,7 @@ var init_Form = __esm({
                 values: "values" in entityField ? entityField.values : void 0,
                 min: entityField.min,
                 max: entityField.max,
-                relation: "relation" in entityField ? { entity: entityField.relation.entity } : void 0
+                relation: "relation" in entityField ? { entity: entityField.relation.entity, cardinality: entityField.relation.cardinality } : void 0
               };
             }
             return { name: field, type: "string" };
@@ -43469,6 +43614,22 @@ var init_Form = __esm({
           case "relation": {
             const relationOptions = relationsData[fieldName] || [];
             const relationLoading = relationsLoading[fieldName] || false;
+            if (field.relation?.cardinality !== void 0 && MANY_CARDINALITIES.includes(field.relation.cardinality)) {
+              const selectedValues = Array.isArray(currentValue) ? currentValue.map((v) => String(v)) : [];
+              return /* @__PURE__ */ jsx(
+                Select,
+                {
+                  ...commonProps,
+                  multiple: true,
+                  searchable: true,
+                  clearable: true,
+                  options: [...relationOptions],
+                  value: selectedValues,
+                  onValueChange: (value) => handleChange(fieldName, Array.isArray(value) ? value : [value]),
+                  placeholder: field.placeholder || `Select ${label}...`
+                }
+              );
+            }
             return /* @__PURE__ */ jsx(
               RelationSelect,
               {
@@ -43483,6 +43644,18 @@ var init_Form = __esm({
               }
             );
           }
+          case "array": {
+            const arrayValue = Array.isArray(currentValue) ? currentValue.map((v) => String(v)) : currentValue != null && currentValue !== "" ? [String(currentValue)] : [];
+            return /* @__PURE__ */ jsx(
+              TagInput,
+              {
+                placeholder: field.placeholder,
+                disabled: isLoading,
+                value: arrayValue,
+                onChange: (next) => handleChange(fieldName, [...next])
+              }
+            );
+          }
           case "number":
             return /* @__PURE__ */ jsx(
               Input,
@@ -49032,7 +49205,10 @@ function enrichFormFields(fields, entityDef) {
           enriched.values = entityField.enumValues;
         }
         if (entityField.relation) {
-          enriched.relation = entityField.relation.entity;
+          enriched.relation = {
+            entity: entityField.relation.entity,
+            cardinality: entityField.relation.cardinality
+          };
         }
         return enriched;
       }
@@ -49060,7 +49236,10 @@ function enrichFormFields(fields, entityDef) {
         }
       }
       if (!obj.relation && entityField.relation) {
-        enriched.relation = entityField.relation.entity;
+        enriched.relation = {
+          entity: entityField.relation.entity,
+          cardinality: entityField.relation.cardinality
+        };
       }
       return enriched;
     }
@@ -49075,7 +49254,12 @@ function enrichDetailFields(fields, entityDef) {
     const meta = { type: entityField.type };
     const values = entityField.values ?? entityField.enumValues;
     if (values && values.length > 0) meta.values = values;
-    if (entityField.relation) meta.relation = entityField.relation.entity;
+    if (entityField.relation) {
+      meta.relation = {
+        entity: entityField.relation.entity,
+        cardinality: entityField.relation.cardinality
+      };
+    }
     return meta;
   };
   return fields.map((field) => {
@@ -49629,6 +49813,32 @@ function isPlainConfigObject(value) {
   const proto = Object.getPrototypeOf(value);
   return proto === Object.prototype || proto === null;
 }
+function subtreeHasTraitRef(value) {
+  const cached = traitRefPresenceCache.get(value);
+  if (cached !== void 0) return cached;
+  let found = false;
+  const children = Array.isArray(value) ? value : Object.values(value);
+  for (const child of children) {
+    if (typeof child === "string" && TRAIT_BINDING_RE.test(child)) {
+      found = true;
+      break;
+    }
+    if (isRenderBindingMarker(child)) continue;
+    if (Array.isArray(child)) {
+      if (subtreeHasTraitRef(child)) {
+        found = true;
+        break;
+      }
+    } else if (child !== null && typeof child === "object" && isPlainConfigObject(child)) {
+      if (subtreeHasTraitRef(child)) {
+        found = true;
+        break;
+      }
+    }
+  }
+  traitRefPresenceCache.set(value, found);
+  return found;
+}
 function substituteTraitRefsDeep(value, pathKey) {
   if (isRenderBindingMarker(value)) return value;
   if (typeof value === "string") {
@@ -49643,11 +49853,13 @@ function substituteTraitRefsDeep(value, pathKey) {
     return value;
   }
   if (Array.isArray(value)) {
+    if (!subtreeHasTraitRef(value)) return value;
     return value.map(
       (item, i) => substituteTraitRefsDeep(item, `${pathKey}[${i}]`)
     );
   }
   if (typeof value === "object" && isPlainConfigObject(value)) {
+    if (!subtreeHasTraitRef(value)) return value;
     const out = {};
     for (const [k, v] of Object.entries(value)) {
       out[k] = substituteTraitRefsDeep(v, `${pathKey}.${k}`);
@@ -49936,7 +50148,7 @@ function UISlotRenderer({
   }
   return wrapped;
 }
-var scopeWrapLog, TRAIT_BINDING_RE, SuspenseConfigContext, SlotContainedContext, SLOT_SKELETON_MAP, SELF_OVERLAY_PATTERNS, CONTENT_NODE_SLOTS, PATTERNS_WITH_CHILDREN;
+var scopeWrapLog, TRAIT_BINDING_RE, SuspenseConfigContext, SlotContainedContext, SLOT_SKELETON_MAP, SELF_OVERLAY_PATTERNS, CONTENT_NODE_SLOTS, PATTERNS_WITH_CHILDREN, traitRefPresenceCache;
 var init_UISlotRenderer = __esm({
   "components/core/organisms/UISlotRenderer.tsx"() {
     "use client";
@@ -50010,6 +50222,7 @@ var init_UISlotRenderer = __esm({
       "alert",
       "dialog"
     ]);
+    traitRefPresenceCache = /* @__PURE__ */ new WeakMap();
     UISlotRenderer.displayName = "UISlotRenderer";
   }
 });
@@ -51202,8 +51415,8 @@ function createHttpTransport(serverUrl) {
       } catch {
       }
     },
-    sendEvent: async (orbitalName, event, payload, clientId) => {
-      const body = { event, payload, clientId };
+    sendEvent: async (orbitalName, event, payload, clientId, tick, sourceTrait) => {
+      const body = { event, payload, clientId, tick, sourceTrait };
       const res = await fetch(`${serverUrl}/${orbitalName}/events`, {
         method: "POST",
         headers: { "Content-Type": "application/json" },
@@ -51248,12 +51461,15 @@ function ServerBridgeProvider({
     async () => transport.unregister(),
     [transport]
   );
-  const sendEvent = useCallback(async (orbitalName, event, payload) => {
+  const sendEvent = useCallback(async (orbitalName, event, payload, tick, sourceTrait) => {
     const emptyMeta = { success: false, clientEffects: 0, dataEntities: {}, emittedEvents: [] };
     if (!connected) return { effects: [], meta: emptyMeta };
     try {
-      const result = await transport.sendEvent(orbitalName, event, payload, getTabClientId());
+      const result = await transport.sendEvent(orbitalName, event, payload, getTabClientId(), tick, sourceTrait);
       const effects = [];
+      if (tick !== void 0) {
+        return { effects, meta: { ...emptyMeta, success: !!result.success, error: result.error } };
+      }
       const responseData = result.data || {};
       const dataEntities = {};
       for (const [entityName, records] of Object.entries(responseData)) {