@almadar/ui 5.157.0 → 5.158.0

package/dist/components/index.cjs

@@ -6361,11 +6361,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 (core.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 (core.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) {
@@ -6383,6 +6404,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 };
@@ -6408,9 +6430,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();
   }
 });
 var sizeClasses6, minWidthClasses, lookStyles2; exports.Modal = void 0;
@@ -25790,7 +25814,7 @@ function fileIcon(name) {
       return "file";
   }
 }
-var TreeNodeItem; exports.FileTree = void 0;
+var TreeNodeItem, FlatTreeNodeItem; exports.FileTree = void 0;
 var init_FileTree = __esm({
   "components/core/molecules/FileTree.tsx"() {
     "use client";
@@ -25875,14 +25899,101 @@ var init_FileTree = __esm({
         )) })
       ] });
     };
+    FlatTreeNodeItem = ({
+      item,
+      depth,
+      indent,
+      childrenByParent,
+      onNodeSelect,
+      defaultExpanded = false
+    }) => {
+      const [expanded, setExpanded] = React77.useState(defaultExpanded || depth < 1);
+      const children = childrenByParent.get(item.id);
+      const hasChildren = !!children && children.length > 0;
+      const handleClick = React77.useCallback(() => {
+        if (hasChildren) setExpanded((prev) => !prev);
+        onNodeSelect?.(item.id);
+      }, [hasChildren, item.id, onNodeSelect]);
+      return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+        /* @__PURE__ */ jsxRuntime.jsxs(
+          exports.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__ */ jsxRuntime.jsx(
+                exports.Icon,
+                {
+                  name: expanded ? "chevron-down" : "chevron-right",
+                  size: "xs",
+                  className: "text-[var(--color-muted-foreground)] flex-shrink-0"
+                }
+              ) : /* @__PURE__ */ jsxRuntime.jsx(exports.Box, { style: { width: 12, flexShrink: 0 } }),
+              /* @__PURE__ */ jsxRuntime.jsx(
+                exports.Icon,
+                {
+                  name: item.icon ?? (hasChildren ? expanded ? "folder-open" : "folder" : "file"),
+                  size: "xs",
+                  className: hasChildren ? "text-[var(--color-warning)]" : "text-[var(--color-muted-foreground)]"
+                }
+              ),
+              /* @__PURE__ */ jsxRuntime.jsx(exports.Typography, { variant: "caption", className: "truncate font-mono text-xs", children: item.label })
+            ]
+          }
+        ),
+        hasChildren && expanded && /* @__PURE__ */ jsxRuntime.jsx(exports.Box, { role: "group", children: children.map((child) => /* @__PURE__ */ jsxRuntime.jsx(
+          FlatTreeNodeItem,
+          {
+            item: child,
+            depth: depth + 1,
+            indent,
+            childrenByParent,
+            onNodeSelect
+          },
+          child.id
+        )) })
+      ] });
+    };
     exports.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__ */ jsxRuntime.jsx(exports.Box, { className: `py-1 overflow-y-auto ${className ?? ""}`, role: "tree", children: roots.map((item) => /* @__PURE__ */ jsxRuntime.jsx(
+          FlatTreeNodeItem,
+          {
+            item,
+            depth: 0,
+            indent,
+            childrenByParent,
+            onNodeSelect,
+            defaultExpanded: true
+          },
+          item.id
+        )) });
+      }
+      if (!tree || tree.length === 0) return null;
       return /* @__PURE__ */ jsxRuntime.jsx(exports.Box, { className: `py-1 overflow-y-auto ${className ?? ""}`, role: "tree", children: tree.map((node) => /* @__PURE__ */ jsxRuntime.jsx(
         TreeNodeItem,
         {
@@ -27535,7 +27646,7 @@ var init_debug = __esm({
     logger.createLogger("almadar:ui:debug:game-state");
   }
 });
-var isRelationsDebugEnabled; exports.RelationSelect = void 0;
+var isRelationsDebugEnabled, MANY_CARDINALITIES; exports.RelationSelect = void 0;
 var init_RelationSelect = __esm({
   "components/core/molecules/RelationSelect.tsx"() {
     "use client";
@@ -27549,6 +27660,11 @@ var init_RelationSelect = __esm({
     init_Typography();
     init_debug();
     isRelationsDebugEnabled = () => isDebugEnabled();
+    MANY_CARDINALITIES = [
+      "many",
+      "one-to-many",
+      "many-to-many"
+    ];
     exports.RelationSelect = ({
       value,
       onChange,
@@ -31645,17 +31761,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 = React77.useMemo(() => keyMap, [keyMapKey]);
+      const stableKeyUpMap = React77.useMemo(() => keyUpMap, [keyUpMapKey]);
       React77.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);
@@ -31664,7 +31784,7 @@ var init_MathCanvas = __esm({
           window.removeEventListener("keydown", onDown);
           window.removeEventListener("keyup", onUp);
         };
-      }, [keyMap, keyUpMap, eventBus]);
+      }, [stableKeyMap, stableKeyUpMap, eventBus]);
       const derivedShapes = React77.useMemo(() => {
         const out = [];
         const margin = 24;
@@ -44326,6 +44446,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";
   }
@@ -44401,6 +44524,7 @@ var init_Form = __esm({
     init_Typography();
     init_Icon();
     init_RelationSelect();
+    init_TagInput();
     init_UploadDropZone();
     init_Alert();
     init_useEventBus();
@@ -44480,7 +44604,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]);
@@ -44715,7 +44839,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" };
@@ -44827,6 +44951,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(currentValue2) ? currentValue2.map((v) => String(v)) : [];
+              return /* @__PURE__ */ jsxRuntime.jsx(
+                exports.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__ */ jsxRuntime.jsx(
               exports.RelationSelect,
               {
@@ -44841,6 +44981,18 @@ var init_Form = __esm({
               }
             );
           }
+          case "array": {
+            const arrayValue = Array.isArray(currentValue2) ? currentValue2.map((v) => String(v)) : currentValue2 != null && currentValue2 !== "" ? [String(currentValue2)] : [];
+            return /* @__PURE__ */ jsxRuntime.jsx(
+              exports.TagInput,
+              {
+                placeholder: field.placeholder,
+                disabled: isLoading,
+                value: arrayValue,
+                onChange: (next) => handleChange(fieldName, [...next])
+              }
+            );
+          }
           case "number":
             return /* @__PURE__ */ jsxRuntime.jsx(
               exports.Input,
@@ -50390,7 +50542,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;
       }
@@ -50418,7 +50573,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;
     }
@@ -50433,7 +50591,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) => {
@@ -50987,6 +51150,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 (core.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 (core.isRenderBindingMarker(value)) return value;
   if (typeof value === "string") {
@@ -51001,11 +51190,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}`);
@@ -51294,7 +51485,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";
@@ -51368,6 +51559,7 @@ var init_UISlotRenderer = __esm({
       "alert",
       "dialog"
     ]);
+    traitRefPresenceCache = /* @__PURE__ */ new WeakMap();
     UISlotRenderer.displayName = "UISlotRenderer";
   }
 });

package/dist/components/index.d.cts

@@ -3735,13 +3735,33 @@ interface FileTreeNode {
     /** Detected language for syntax highlighting */
     language?: string;
 }
+/** Flat tree row for `items` mode — nested at render time by `parentId`. */
+interface FileTreeItem {
+    /** Unique node id */
+    id: string;
+    /** Display label */
+    label: string;
+    /** Id of this node's parent; empty/absent marks a root */
+    parentId?: string;
+    /** Icon name override (falls back to folder/file by presence of children) */
+    icon?: string;
+}
 interface FileTreeProps {
-    /** The tree data */
-    tree: FileTreeNode[];
+    /** The tree data (pre-nested). Ignored when `items` is provided. */
+    tree?: FileTreeNode[];
+    /** Flat node list, nested by `parentId` at render time — takes precedence
+     *  over `tree` when provided. A `parentId` with no matching row renders
+     *  that node as a root rather than dropping it. */
+    items?: FileTreeItem[];
     /** Currently selected file path */
     selectedPath?: string;
     /** Called when a file is clicked */
     onFileSelect?: (path: string) => void;
+    /** Called when a node is clicked, in flat `items` mode; carries the
+     *  selected node's id. Presence-gated: binding this prop is what turns on
+     *  the click-to-select affordance, mirroring Badge's `onRemove`.
+     *  @offByDefault */
+    onNodeSelect?: (id: string) => void;
     /** CSS class */
     className?: string;
     /** Indent size per level in px (default: 16) */
@@ -4789,6 +4809,11 @@ declare const OnboardingSpotlight: React__default.FC<OnboardingSpotlightProps>;
  * Composed from: Box, HStack, VStack, Input, Button, Spinner, Typography atoms
  */
 
+/** Relation cardinality vocabulary — mirrors `@almadar/core`'s
+ *  `RelationCardinality` (spelled inline: the pattern extractor resolves
+ *  components-tree aliases to `enumValues`, but treats core imports as
+ *  opaque). `many`/`one-to-many`/`many-to-many` drive multi-value pickers. */
+type RelationFieldCardinality = "one" | "many" | "one-to-many" | "many-to-one" | "many-to-many";
 interface RelationOption {
     /** The value to store (typically the ID) */
     value: string;
@@ -10727,6 +10752,13 @@ declare const StatCard: React__default.FC<StatCardProps>;
  * Extends DisplayStateProps (see ./types.ts) and declares `entity?: EntityRow`.
  */
 
+/** Relation descriptor injected onto a display field — target entity +
+ *  cardinality, mirroring the `.lolo` `{type:"relation", relation:{...}}`
+ *  descriptor. */
+interface DetailRelationMeta {
+    entity: string;
+    cardinality?: RelationFieldCardinality;
+}
 interface DetailField {
     label: string;
     value: React__default.ReactNode;
@@ -10762,12 +10794,12 @@ type FieldDef$2 = string | {
     header?: string;
     type?: string;
     values?: readonly string[];
-    relation?: string;
+    relation?: DetailRelationMeta;
 } | {
     name: string;
     type: string;
     values?: readonly string[];
-    relation?: string;
+    relation?: DetailRelationMeta;
 };
 interface DetailPanelStatus {
     label: string;
@@ -10895,8 +10927,10 @@ interface RelationConfig {
     entity: string;
     /** Field on target entity to display (defaults to 'name') */
     displayField?: string;
-    /** Cardinality: one-to-one or one-to-many */
-    cardinality?: "one" | "many";
+    /** Cardinality of the relation — many-valued spellings drive the
+     *  multi-select picker below; anything else (including absent) stays
+     *  single-select. */
+    cardinality?: RelationFieldCardinality;
 }
 /**
  * Validation-rule bundle for a schema field. Only `enum` is actually read

package/dist/components/index.d.ts

@@ -3735,13 +3735,33 @@ interface FileTreeNode {
     /** Detected language for syntax highlighting */
     language?: string;
 }
+/** Flat tree row for `items` mode — nested at render time by `parentId`. */
+interface FileTreeItem {
+    /** Unique node id */
+    id: string;
+    /** Display label */
+    label: string;
+    /** Id of this node's parent; empty/absent marks a root */
+    parentId?: string;
+    /** Icon name override (falls back to folder/file by presence of children) */
+    icon?: string;
+}
 interface FileTreeProps {
-    /** The tree data */
-    tree: FileTreeNode[];
+    /** The tree data (pre-nested). Ignored when `items` is provided. */
+    tree?: FileTreeNode[];
+    /** Flat node list, nested by `parentId` at render time — takes precedence
+     *  over `tree` when provided. A `parentId` with no matching row renders
+     *  that node as a root rather than dropping it. */
+    items?: FileTreeItem[];
     /** Currently selected file path */
     selectedPath?: string;
     /** Called when a file is clicked */
     onFileSelect?: (path: string) => void;
+    /** Called when a node is clicked, in flat `items` mode; carries the
+     *  selected node's id. Presence-gated: binding this prop is what turns on
+     *  the click-to-select affordance, mirroring Badge's `onRemove`.
+     *  @offByDefault */
+    onNodeSelect?: (id: string) => void;
     /** CSS class */
     className?: string;
     /** Indent size per level in px (default: 16) */
@@ -4789,6 +4809,11 @@ declare const OnboardingSpotlight: React__default.FC<OnboardingSpotlightProps>;
  * Composed from: Box, HStack, VStack, Input, Button, Spinner, Typography atoms
  */
 
+/** Relation cardinality vocabulary — mirrors `@almadar/core`'s
+ *  `RelationCardinality` (spelled inline: the pattern extractor resolves
+ *  components-tree aliases to `enumValues`, but treats core imports as
+ *  opaque). `many`/`one-to-many`/`many-to-many` drive multi-value pickers. */
+type RelationFieldCardinality = "one" | "many" | "one-to-many" | "many-to-one" | "many-to-many";
 interface RelationOption {
     /** The value to store (typically the ID) */
     value: string;
@@ -10727,6 +10752,13 @@ declare const StatCard: React__default.FC<StatCardProps>;
  * Extends DisplayStateProps (see ./types.ts) and declares `entity?: EntityRow`.
  */
 
+/** Relation descriptor injected onto a display field — target entity +
+ *  cardinality, mirroring the `.lolo` `{type:"relation", relation:{...}}`
+ *  descriptor. */
+interface DetailRelationMeta {
+    entity: string;
+    cardinality?: RelationFieldCardinality;
+}
 interface DetailField {
     label: string;
     value: React__default.ReactNode;
@@ -10762,12 +10794,12 @@ type FieldDef$2 = string | {
     header?: string;
     type?: string;
     values?: readonly string[];
-    relation?: string;
+    relation?: DetailRelationMeta;
 } | {
     name: string;
     type: string;
     values?: readonly string[];
-    relation?: string;
+    relation?: DetailRelationMeta;
 };
 interface DetailPanelStatus {
     label: string;
@@ -10895,8 +10927,10 @@ interface RelationConfig {
     entity: string;
     /** Field on target entity to display (defaults to 'name') */
     displayField?: string;
-    /** Cardinality: one-to-one or one-to-many */
-    cardinality?: "one" | "many";
+    /** Cardinality of the relation — many-valued spellings drive the
+     *  multi-select picker below; anything else (including absent) stays
+     *  single-select. */
+    cardinality?: RelationFieldCardinality;
 }
 /**
  * Validation-rule bundle for a schema field. Only `enum` is actually read