@almadar/ui 5.61.0 → 5.62.0

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

@@ -377,12 +377,18 @@ function ModelLoader({
     });
     return cloned;
   }, [loadedModel, castShadow, receiveShadow]);
+  const normFactor = useMemo(() => {
+    if (!model) return 1;
+    const box = new THREE6.Box3().setFromObject(model);
+    const size = new THREE6.Vector3();
+    box.getSize(size);
+    const maxDim = Math.max(size.x, size.y, size.z);
+    return maxDim > 0 && Number.isFinite(maxDim) ? 1 / maxDim : 1;
+  }, [model]);
   const scaleArray = useMemo(() => {
-    if (typeof scale === "number") {
-      return [scale, scale, scale];
-    }
-    return scale;
-  }, [scale]);
+    const base = typeof scale === "number" ? [scale, scale, scale] : scale;
+    return [base[0] * normFactor, base[1] * normFactor, base[2] * normFactor];
+  }, [scale, normFactor]);
   const rotationRad = useMemo(() => {
     return [
       rotation[0] * Math.PI / 180,
@@ -2566,6 +2572,29 @@ var GameCanvas3D = forwardRef(
     const controlsRef = useRef(null);
     const [hoveredTile, setHoveredTile] = useState(null);
     const [internalError, setInternalError] = useState(null);
+    useEffect(() => {
+      const el = containerRef.current;
+      if (!el) return;
+      let node = el;
+      let depth = 0;
+      while (node && depth < 8) {
+        const cs = window.getComputedStyle(node);
+        const rect = node.getBoundingClientRect();
+        console.log("[almadar:ui:game:3d-height]", {
+          depth,
+          tag: node.tagName,
+          id: node.id || void 0,
+          className: node.className?.slice?.(0, 60) || void 0,
+          rectHeight: rect.height,
+          computedHeight: cs.height,
+          computedMinHeight: cs.minHeight,
+          computedFlex: cs.flex,
+          computedOverflow: cs.overflow
+        });
+        node = node.parentElement;
+        depth++;
+      }
+    }, []);
     const { sheetUrls: atlasSheetUrls, resolveUnitFrame } = useUnitSpriteAtlas(units);
     const preloadUrls = useMemo(() => [...preloadAssets, ...atlasSheetUrls], [preloadAssets, atlasSheetUrls]);
     const { isLoading: assetsLoading, progress, loaded, total } = useAssetLoader({
@@ -2955,7 +2984,7 @@ var GameCanvas3D = forwardRef(
           {
             ref: containerRef,
             className: cn("game-canvas-3d relative w-full overflow-hidden", className),
-            style: { minHeight: "85vh" },
+            style: { height: "85vh" },
             "data-orientation": orientation,
             "data-camera-mode": cameraMode,
             "data-overlay": overlay,
@@ -2970,7 +2999,7 @@ var GameCanvas3D = forwardRef(
                     near: 0.1,
                     far: 1e3
                   },
-                  style: { background: backgroundColor, height: "85vh", width: "100%" },
+                  style: { background: backgroundColor, position: "absolute", inset: 0 },
                   onClick: (e) => {
                     if (e.target === e.currentTarget) {
                       eventHandlers.handleCanvasClick(e);
@@ -4571,36 +4600,113 @@ var Box = React11.forwardRef(
   }
 );
 Box.displayName = "Box";
-var CDN = "https://almadar-kflow-assets.web.app/shared/3d/dungeon/floor";
-var FLOOR_WALL = `${CDN}/template-floor-detail-a.glb`;
-var FLOOR_DIRT = `${CDN}/template-floor-detail.glb`;
-var FLOOR_OPEN = `${CDN}/template-floor.glb`;
-var DEFAULT_3D_BATTLE_TILES = [
-  { id: "t00", x: 0, y: 0, z: 0, type: "stone", passable: false, modelUrl: FLOOR_WALL },
-  { id: "t10", x: 1, y: 0, z: 0, type: "stone", passable: false, modelUrl: FLOOR_WALL },
-  { id: "t20", x: 2, y: 0, z: 0, type: "stone", passable: false, modelUrl: FLOOR_WALL },
-  { id: "t30", x: 3, y: 0, z: 0, type: "stone", passable: false, modelUrl: FLOOR_WALL },
-  { id: "t40", x: 4, y: 0, z: 0, type: "stone", passable: false, modelUrl: FLOOR_WALL },
-  { id: "t01", x: 0, y: 1, z: 1, type: "stone", passable: false, modelUrl: FLOOR_WALL },
-  { id: "t11", x: 1, y: 1, z: 1, type: "dirt", passable: true, modelUrl: FLOOR_DIRT },
-  { id: "t21", x: 2, y: 1, z: 1, type: "grass", passable: true, modelUrl: FLOOR_OPEN },
-  { id: "t31", x: 3, y: 1, z: 1, type: "grass", passable: true, modelUrl: FLOOR_OPEN },
-  { id: "t41", x: 4, y: 1, z: 1, type: "stone", passable: false, modelUrl: FLOOR_WALL },
-  { id: "t02", x: 0, y: 2, z: 2, type: "stone", passable: false, modelUrl: FLOOR_WALL },
-  { id: "t12", x: 1, y: 2, z: 2, type: "grass", passable: true, modelUrl: FLOOR_OPEN },
-  { id: "t22", x: 2, y: 2, z: 2, type: "dirt", passable: true, modelUrl: FLOOR_DIRT },
-  { id: "t32", x: 3, y: 2, z: 2, type: "grass", passable: true, modelUrl: FLOOR_OPEN },
-  { id: "t42", x: 4, y: 2, z: 2, type: "stone", passable: false, modelUrl: FLOOR_WALL },
-  { id: "t03", x: 0, y: 3, z: 3, type: "stone", passable: false, modelUrl: FLOOR_WALL },
-  { id: "t13", x: 1, y: 3, z: 3, type: "grass", passable: true, modelUrl: FLOOR_OPEN },
-  { id: "t23", x: 2, y: 3, z: 3, type: "grass", passable: true, modelUrl: FLOOR_OPEN },
-  { id: "t33", x: 3, y: 3, z: 3, type: "dirt", passable: true, modelUrl: FLOOR_DIRT },
-  { id: "t43", x: 4, y: 3, z: 3, type: "stone", passable: false, modelUrl: FLOOR_WALL },
-  { id: "t04", x: 0, y: 4, z: 4, type: "stone", passable: false, modelUrl: FLOOR_WALL },
-  { id: "t14", x: 1, y: 4, z: 4, type: "stone", passable: false, modelUrl: FLOOR_WALL },
-  { id: "t24", x: 2, y: 4, z: 4, type: "stone", passable: false, modelUrl: FLOOR_WALL },
-  { id: "t34", x: 3, y: 4, z: 4, type: "stone", passable: false, modelUrl: FLOOR_WALL },
-  { id: "t44", x: 4, y: 4, z: 4, type: "stone", passable: false, modelUrl: FLOOR_WALL }
+
+// components/game/templates/game3dAssetManifest.ts
+function resolveManifestUrl(manifest, relative) {
+  if (relative == null) return void 0;
+  if (/^https?:\/\//.test(relative)) return relative;
+  const base = manifest?.baseUrl;
+  if (base == null) return relative;
+  const cleanBase = base.replace(/\/$/, "");
+  const cleanRel = relative.replace(/^\//, "");
+  return `${cleanBase}/${cleanRel}`;
+}
+function tileKind(type, passable) {
+  if (passable === false) return "wall";
+  if (type === "dirt" || type === "road") return "dirt";
+  return "open";
+}
+function resolveTilesWithModels(layout, manifest) {
+  return layout.map((t) => {
+    const kind = t.kind || tileKind(t.type, t.passable);
+    return {
+      id: t.id,
+      x: t.x,
+      y: t.y,
+      z: t.z,
+      type: t.type,
+      passable: t.passable,
+      modelUrl: resolveManifestUrl(manifest, manifest?.models?.[kind])
+    };
+  });
+}
+function resolvePropTiles(tiles, manifest) {
+  return tiles.map((t) => {
+    const kind = tileKind(t.type ?? "", t.passable);
+    return {
+      ...t,
+      modelUrl: t.modelUrl ?? resolveManifestUrl(manifest, manifest?.models?.[kind])
+    };
+  });
+}
+function resolveEntityTiles(entity, manifest) {
+  const row = boardEntity(entity);
+  if (!row) return [];
+  return rows(row.tiles).map((r) => {
+    const type = str(r.type) || str(r.terrain);
+    const passable = r.passable !== false;
+    const kind = tileKind(type, passable);
+    const explicitModel = r.modelUrl == null ? void 0 : str(r.modelUrl);
+    return {
+      id: r.id == null ? void 0 : str(r.id),
+      x: num(r.x),
+      y: num(r.y),
+      z: r.z == null ? void 0 : num(r.z),
+      type,
+      passable,
+      modelUrl: explicitModel ?? resolveManifestUrl(manifest, manifest?.models?.[kind])
+    };
+  });
+}
+function resolveFeaturesWithModels(features, manifest) {
+  return features.map((f) => ({
+    ...f,
+    assetUrl: f.assetUrl ?? resolveManifestUrl(manifest, manifest?.features?.[f.type])
+  }));
+}
+function resolveEntityFeatures(entity, manifest) {
+  const row = boardEntity(entity);
+  if (!row) return [];
+  return rows(row.features).map((r) => {
+    const type = str(r.type);
+    const explicit = r.assetUrl == null ? void 0 : str(r.assetUrl);
+    return {
+      id: r.id == null ? void 0 : str(r.id),
+      x: num(r.x),
+      y: num(r.y),
+      z: r.z == null ? void 0 : num(r.z),
+      type,
+      color: r.color == null ? void 0 : str(r.color),
+      assetUrl: explicit ?? resolveManifestUrl(manifest, manifest?.features?.[type])
+    };
+  });
+}
+var DEFAULT_3D_BATTLE_LAYOUT = [
+  { id: "t00", x: 0, y: 0, z: 0, type: "stone", passable: false, kind: "wall" },
+  { id: "t10", x: 1, y: 0, z: 0, type: "stone", passable: false, kind: "wall" },
+  { id: "t20", x: 2, y: 0, z: 0, type: "stone", passable: false, kind: "wall" },
+  { id: "t30", x: 3, y: 0, z: 0, type: "stone", passable: false, kind: "wall" },
+  { id: "t40", x: 4, y: 0, z: 0, type: "stone", passable: false, kind: "wall" },
+  { id: "t01", x: 0, y: 1, z: 1, type: "stone", passable: false, kind: "wall" },
+  { id: "t11", x: 1, y: 1, z: 1, type: "dirt", passable: true, kind: "dirt" },
+  { id: "t21", x: 2, y: 1, z: 1, type: "grass", passable: true, kind: "open" },
+  { id: "t31", x: 3, y: 1, z: 1, type: "grass", passable: true, kind: "open" },
+  { id: "t41", x: 4, y: 1, z: 1, type: "stone", passable: false, kind: "wall" },
+  { id: "t02", x: 0, y: 2, z: 2, type: "stone", passable: false, kind: "wall" },
+  { id: "t12", x: 1, y: 2, z: 2, type: "grass", passable: true, kind: "open" },
+  { id: "t22", x: 2, y: 2, z: 2, type: "dirt", passable: true, kind: "dirt" },
+  { id: "t32", x: 3, y: 2, z: 2, type: "grass", passable: true, kind: "open" },
+  { id: "t42", x: 4, y: 2, z: 2, type: "stone", passable: false, kind: "wall" },
+  { id: "t03", x: 0, y: 3, z: 3, type: "stone", passable: false, kind: "wall" },
+  { id: "t13", x: 1, y: 3, z: 3, type: "grass", passable: true, kind: "open" },
+  { id: "t23", x: 2, y: 3, z: 3, type: "grass", passable: true, kind: "open" },
+  { id: "t33", x: 3, y: 3, z: 3, type: "dirt", passable: true, kind: "dirt" },
+  { id: "t43", x: 4, y: 3, z: 3, type: "stone", passable: false, kind: "wall" },
+  { id: "t04", x: 0, y: 4, z: 4, type: "stone", passable: false, kind: "wall" },
+  { id: "t14", x: 1, y: 4, z: 4, type: "stone", passable: false, kind: "wall" },
+  { id: "t24", x: 2, y: 4, z: 4, type: "stone", passable: false, kind: "wall" },
+  { id: "t34", x: 3, y: 4, z: 4, type: "stone", passable: false, kind: "wall" },
+  { id: "t44", x: 4, y: 4, z: 4, type: "stone", passable: false, kind: "wall" }
 ];
 var DEFAULT_3D_BATTLE_FEATURES = [
   { id: "f1", x: 2, y: 2, z: 2, type: "gold_mine", color: "#f4c542" },
@@ -4608,8 +4714,9 @@ var DEFAULT_3D_BATTLE_FEATURES = [
 ];
 function GameCanvas3DBattleTemplate({
   entity,
-  tiles: propTiles = DEFAULT_3D_BATTLE_TILES,
+  tiles: propTiles,
   features: propFeatures = DEFAULT_3D_BATTLE_FEATURES,
+  assetManifest,
   cameraMode = "perspective",
   backgroundColor = "#2a1a1a",
   tileClickEvent,
@@ -4623,11 +4730,12 @@ function GameCanvas3DBattleTemplate({
   scale,
   className
 }) {
-  const resolved = entity && typeof entity === "object" && !Array.isArray(entity) ? entity : void 0;
-  const tiles = resolved ? Array.isArray(resolved.tiles) ? resolved.tiles : [] : propTiles;
-  const features = resolved ? Array.isArray(resolved.features) ? resolved.features : [] : propFeatures;
-  const currentTurn = resolved?.currentTeam;
-  const round = resolved?.turn == null ? void 0 : Number(resolved.turn);
+  const row = boardEntity(entity);
+  const hasEntityTiles = !!row && Array.isArray(row.tiles) && row.tiles.length > 0;
+  const tiles = hasEntityTiles ? resolveEntityTiles(entity, assetManifest) : propTiles ? resolvePropTiles(propTiles, assetManifest) : resolveTilesWithModels(DEFAULT_3D_BATTLE_LAYOUT, assetManifest);
+  const features = row && Array.isArray(row.features) && row.features.length > 0 ? resolveEntityFeatures(entity, assetManifest) : resolveFeaturesWithModels(propFeatures, assetManifest);
+  const currentTurn = row?.currentTeam == null ? void 0 : String(row.currentTeam);
+  const round = row?.turn == null ? void 0 : Number(row.turn);
   return /* @__PURE__ */ jsxs(
     Box,
     {
@@ -4673,36 +4781,32 @@ function GameCanvas3DBattleTemplate({
   );
 }
 GameCanvas3DBattleTemplate.displayName = "GameCanvas3DBattleTemplate";
-var CDN2 = "https://almadar-kflow-assets.web.app/shared/3d/dungeon/floor";
-var FLOOR_WALL2 = `${CDN2}/template-floor-detail-a.glb`;
-var FLOOR_DIRT2 = `${CDN2}/template-floor-detail.glb`;
-var FLOOR_OPEN2 = `${CDN2}/template-floor.glb`;
-var DEFAULT_3D_CASTLE_TILES = [
-  { id: "t00", x: 0, y: 0, z: 0, type: "wall", passable: false, modelUrl: FLOOR_WALL2 },
-  { id: "t10", x: 1, y: 0, z: 0, type: "wall", passable: false, modelUrl: FLOOR_WALL2 },
-  { id: "t20", x: 2, y: 0, z: 0, type: "wall", passable: false, modelUrl: FLOOR_WALL2 },
-  { id: "t30", x: 3, y: 0, z: 0, type: "wall", passable: false, modelUrl: FLOOR_WALL2 },
-  { id: "t40", x: 4, y: 0, z: 0, type: "wall", passable: false, modelUrl: FLOOR_WALL2 },
-  { id: "t01", x: 0, y: 1, z: 1, type: "wall", passable: false, modelUrl: FLOOR_WALL2 },
-  { id: "t11", x: 1, y: 1, z: 1, type: "floor", passable: true, modelUrl: FLOOR_DIRT2 },
-  { id: "t21", x: 2, y: 1, z: 1, type: "floor", passable: true, modelUrl: FLOOR_OPEN2 },
-  { id: "t31", x: 3, y: 1, z: 1, type: "floor", passable: true, modelUrl: FLOOR_OPEN2 },
-  { id: "t41", x: 4, y: 1, z: 1, type: "wall", passable: false, modelUrl: FLOOR_WALL2 },
-  { id: "t02", x: 0, y: 2, z: 2, type: "wall", passable: false, modelUrl: FLOOR_WALL2 },
-  { id: "t12", x: 1, y: 2, z: 2, type: "floor", passable: true, modelUrl: FLOOR_OPEN2 },
-  { id: "t22", x: 2, y: 2, z: 2, type: "floor", passable: true, modelUrl: FLOOR_DIRT2 },
-  { id: "t32", x: 3, y: 2, z: 2, type: "floor", passable: true, modelUrl: FLOOR_OPEN2 },
-  { id: "t42", x: 4, y: 2, z: 2, type: "wall", passable: false, modelUrl: FLOOR_WALL2 },
-  { id: "t03", x: 0, y: 3, z: 3, type: "wall", passable: false, modelUrl: FLOOR_WALL2 },
-  { id: "t13", x: 1, y: 3, z: 3, type: "floor", passable: true, modelUrl: FLOOR_OPEN2 },
-  { id: "t23", x: 2, y: 3, z: 3, type: "floor", passable: true, modelUrl: FLOOR_OPEN2 },
-  { id: "t33", x: 3, y: 3, z: 3, type: "floor", passable: true, modelUrl: FLOOR_DIRT2 },
-  { id: "t43", x: 4, y: 3, z: 3, type: "wall", passable: false, modelUrl: FLOOR_WALL2 },
-  { id: "t04", x: 0, y: 4, z: 4, type: "wall", passable: false, modelUrl: FLOOR_WALL2 },
-  { id: "t14", x: 1, y: 4, z: 4, type: "wall", passable: false, modelUrl: FLOOR_WALL2 },
-  { id: "t24", x: 2, y: 4, z: 4, type: "wall", passable: false, modelUrl: FLOOR_WALL2 },
-  { id: "t34", x: 3, y: 4, z: 4, type: "wall", passable: false, modelUrl: FLOOR_WALL2 },
-  { id: "t44", x: 4, y: 4, z: 4, type: "wall", passable: false, modelUrl: FLOOR_WALL2 }
+var DEFAULT_3D_CASTLE_LAYOUT = [
+  { id: "t00", x: 0, y: 0, z: 0, type: "wall", passable: false, kind: "wall" },
+  { id: "t10", x: 1, y: 0, z: 0, type: "wall", passable: false, kind: "wall" },
+  { id: "t20", x: 2, y: 0, z: 0, type: "wall", passable: false, kind: "wall" },
+  { id: "t30", x: 3, y: 0, z: 0, type: "wall", passable: false, kind: "wall" },
+  { id: "t40", x: 4, y: 0, z: 0, type: "wall", passable: false, kind: "wall" },
+  { id: "t01", x: 0, y: 1, z: 1, type: "wall", passable: false, kind: "wall" },
+  { id: "t11", x: 1, y: 1, z: 1, type: "floor", passable: true, kind: "dirt" },
+  { id: "t21", x: 2, y: 1, z: 1, type: "floor", passable: true, kind: "open" },
+  { id: "t31", x: 3, y: 1, z: 1, type: "floor", passable: true, kind: "open" },
+  { id: "t41", x: 4, y: 1, z: 1, type: "wall", passable: false, kind: "wall" },
+  { id: "t02", x: 0, y: 2, z: 2, type: "wall", passable: false, kind: "wall" },
+  { id: "t12", x: 1, y: 2, z: 2, type: "floor", passable: true, kind: "open" },
+  { id: "t22", x: 2, y: 2, z: 2, type: "floor", passable: true, kind: "dirt" },
+  { id: "t32", x: 3, y: 2, z: 2, type: "floor", passable: true, kind: "open" },
+  { id: "t42", x: 4, y: 2, z: 2, type: "wall", passable: false, kind: "wall" },
+  { id: "t03", x: 0, y: 3, z: 3, type: "wall", passable: false, kind: "wall" },
+  { id: "t13", x: 1, y: 3, z: 3, type: "floor", passable: true, kind: "open" },
+  { id: "t23", x: 2, y: 3, z: 3, type: "floor", passable: true, kind: "open" },
+  { id: "t33", x: 3, y: 3, z: 3, type: "floor", passable: true, kind: "dirt" },
+  { id: "t43", x: 4, y: 3, z: 3, type: "wall", passable: false, kind: "wall" },
+  { id: "t04", x: 0, y: 4, z: 4, type: "wall", passable: false, kind: "wall" },
+  { id: "t14", x: 1, y: 4, z: 4, type: "wall", passable: false, kind: "wall" },
+  { id: "t24", x: 2, y: 4, z: 4, type: "wall", passable: false, kind: "wall" },
+  { id: "t34", x: 3, y: 4, z: 4, type: "wall", passable: false, kind: "wall" },
+  { id: "t44", x: 4, y: 4, z: 4, type: "wall", passable: false, kind: "wall" }
 ];
 var DEFAULT_3D_CASTLE_FEATURES = [
   { id: "f1", x: 2, y: 2, z: 2, type: "chest", color: "#f4c542" },
@@ -4710,8 +4814,9 @@ var DEFAULT_3D_CASTLE_FEATURES = [
 ];
 function GameCanvas3DCastleTemplate({
   entity,
-  tiles: propTiles = DEFAULT_3D_CASTLE_TILES,
+  tiles: propTiles,
   features: propFeatures = DEFAULT_3D_CASTLE_FEATURES,
+  assetManifest,
   cameraMode = "isometric",
   backgroundColor = "#1e1e2e",
   buildingClickEvent,
@@ -4726,13 +4831,14 @@ function GameCanvas3DCastleTemplate({
   scale,
   className
 }) {
-  const resolved = entity && typeof entity === "object" && !Array.isArray(entity) ? entity : void 0;
-  const tiles = resolved ? Array.isArray(resolved.tiles) ? resolved.tiles : [] : propTiles;
-  const features = resolved ? Array.isArray(resolved.features) ? resolved.features : [] : propFeatures;
-  const name = resolved?.name == null ? void 0 : String(resolved.name);
-  const level = resolved?.level == null ? void 0 : Number(resolved.level);
-  const owner = resolved?.owner == null ? void 0 : String(resolved.owner);
-  const unitCount = resolved && Array.isArray(resolved.units) ? resolved.units.length : 0;
+  const row = boardEntity(entity);
+  const hasEntityTiles = !!row && Array.isArray(row.tiles) && row.tiles.length > 0;
+  const tiles = hasEntityTiles ? resolveEntityTiles(entity, assetManifest) : propTiles ? resolvePropTiles(propTiles, assetManifest) : resolveTilesWithModels(DEFAULT_3D_CASTLE_LAYOUT, assetManifest);
+  const features = row && Array.isArray(row.features) && row.features.length > 0 ? resolveEntityFeatures(entity, assetManifest) : resolveFeaturesWithModels(propFeatures, assetManifest);
+  const name = row?.name == null ? void 0 : str(row.name);
+  const level = row?.level == null ? void 0 : num(row.level);
+  const owner = row?.owner == null ? void 0 : str(row.owner);
+  const unitCount = row && Array.isArray(row.units) ? row.units.length : 0;
   return /* @__PURE__ */ jsxs(
     VStack,
     {
@@ -4778,36 +4884,32 @@ function GameCanvas3DCastleTemplate({
   );
 }
 GameCanvas3DCastleTemplate.displayName = "GameCanvas3DCastleTemplate";
-var CDN3 = "https://almadar-kflow-assets.web.app/shared/3d/dungeon/floor";
-var FLOOR_WALL3 = `${CDN3}/template-floor-detail-a.glb`;
-var FLOOR_DIRT3 = `${CDN3}/template-floor-detail.glb`;
-var FLOOR_OPEN3 = `${CDN3}/template-floor.glb`;
-var DEFAULT_3D_WORLDMAP_TILES = [
-  { id: "t00", x: 0, y: 0, z: 0, type: "mountain", passable: false, modelUrl: FLOOR_WALL3 },
-  { id: "t10", x: 1, y: 0, z: 0, type: "mountain", passable: false, modelUrl: FLOOR_WALL3 },
-  { id: "t20", x: 2, y: 0, z: 0, type: "water", passable: false, modelUrl: FLOOR_WALL3 },
-  { id: "t30", x: 3, y: 0, z: 0, type: "mountain", passable: false, modelUrl: FLOOR_WALL3 },
-  { id: "t40", x: 4, y: 0, z: 0, type: "mountain", passable: false, modelUrl: FLOOR_WALL3 },
-  { id: "t01", x: 0, y: 1, z: 1, type: "mountain", passable: false, modelUrl: FLOOR_WALL3 },
-  { id: "t11", x: 1, y: 1, z: 1, type: "grass", passable: true, modelUrl: FLOOR_OPEN3 },
-  { id: "t21", x: 2, y: 1, z: 1, type: "grass", passable: true, modelUrl: FLOOR_OPEN3 },
-  { id: "t31", x: 3, y: 1, z: 1, type: "grass", passable: true, modelUrl: FLOOR_OPEN3 },
-  { id: "t41", x: 4, y: 1, z: 1, type: "water", passable: false, modelUrl: FLOOR_WALL3 },
-  { id: "t02", x: 0, y: 2, z: 2, type: "water", passable: false, modelUrl: FLOOR_WALL3 },
-  { id: "t12", x: 1, y: 2, z: 2, type: "grass", passable: true, modelUrl: FLOOR_OPEN3 },
-  { id: "t22", x: 2, y: 2, z: 2, type: "road", passable: true, modelUrl: FLOOR_DIRT3 },
-  { id: "t32", x: 3, y: 2, z: 2, type: "grass", passable: true, modelUrl: FLOOR_OPEN3 },
-  { id: "t42", x: 4, y: 2, z: 2, type: "mountain", passable: false, modelUrl: FLOOR_WALL3 },
-  { id: "t03", x: 0, y: 3, z: 3, type: "mountain", passable: false, modelUrl: FLOOR_WALL3 },
-  { id: "t13", x: 1, y: 3, z: 3, type: "grass", passable: true, modelUrl: FLOOR_OPEN3 },
-  { id: "t23", x: 2, y: 3, z: 3, type: "grass", passable: true, modelUrl: FLOOR_OPEN3 },
-  { id: "t33", x: 3, y: 3, z: 3, type: "road", passable: true, modelUrl: FLOOR_DIRT3 },
-  { id: "t43", x: 4, y: 3, z: 3, type: "mountain", passable: false, modelUrl: FLOOR_WALL3 },
-  { id: "t04", x: 0, y: 4, z: 4, type: "mountain", passable: false, modelUrl: FLOOR_WALL3 },
-  { id: "t14", x: 1, y: 4, z: 4, type: "water", passable: false, modelUrl: FLOOR_WALL3 },
-  { id: "t24", x: 2, y: 4, z: 4, type: "grass", passable: true, modelUrl: FLOOR_OPEN3 },
-  { id: "t34", x: 3, y: 4, z: 4, type: "mountain", passable: false, modelUrl: FLOOR_WALL3 },
-  { id: "t44", x: 4, y: 4, z: 4, type: "mountain", passable: false, modelUrl: FLOOR_WALL3 }
+var DEFAULT_3D_WORLDMAP_LAYOUT = [
+  { id: "t00", x: 0, y: 0, z: 0, type: "mountain", passable: false, kind: "wall" },
+  { id: "t10", x: 1, y: 0, z: 0, type: "mountain", passable: false, kind: "wall" },
+  { id: "t20", x: 2, y: 0, z: 0, type: "water", passable: false, kind: "wall" },
+  { id: "t30", x: 3, y: 0, z: 0, type: "mountain", passable: false, kind: "wall" },
+  { id: "t40", x: 4, y: 0, z: 0, type: "mountain", passable: false, kind: "wall" },
+  { id: "t01", x: 0, y: 1, z: 1, type: "mountain", passable: false, kind: "wall" },
+  { id: "t11", x: 1, y: 1, z: 1, type: "grass", passable: true, kind: "open" },
+  { id: "t21", x: 2, y: 1, z: 1, type: "grass", passable: true, kind: "open" },
+  { id: "t31", x: 3, y: 1, z: 1, type: "grass", passable: true, kind: "open" },
+  { id: "t41", x: 4, y: 1, z: 1, type: "water", passable: false, kind: "wall" },
+  { id: "t02", x: 0, y: 2, z: 2, type: "water", passable: false, kind: "wall" },
+  { id: "t12", x: 1, y: 2, z: 2, type: "grass", passable: true, kind: "open" },
+  { id: "t22", x: 2, y: 2, z: 2, type: "road", passable: true, kind: "dirt" },
+  { id: "t32", x: 3, y: 2, z: 2, type: "grass", passable: true, kind: "open" },
+  { id: "t42", x: 4, y: 2, z: 2, type: "mountain", passable: false, kind: "wall" },
+  { id: "t03", x: 0, y: 3, z: 3, type: "mountain", passable: false, kind: "wall" },
+  { id: "t13", x: 1, y: 3, z: 3, type: "grass", passable: true, kind: "open" },
+  { id: "t23", x: 2, y: 3, z: 3, type: "grass", passable: true, kind: "open" },
+  { id: "t33", x: 3, y: 3, z: 3, type: "road", passable: true, kind: "dirt" },
+  { id: "t43", x: 4, y: 3, z: 3, type: "mountain", passable: false, kind: "wall" },
+  { id: "t04", x: 0, y: 4, z: 4, type: "mountain", passable: false, kind: "wall" },
+  { id: "t14", x: 1, y: 4, z: 4, type: "water", passable: false, kind: "wall" },
+  { id: "t24", x: 2, y: 4, z: 4, type: "grass", passable: true, kind: "open" },
+  { id: "t34", x: 3, y: 4, z: 4, type: "mountain", passable: false, kind: "wall" },
+  { id: "t44", x: 4, y: 4, z: 4, type: "mountain", passable: false, kind: "wall" }
 ];
 var DEFAULT_3D_WORLDMAP_FEATURES = [
   { id: "f1", x: 2, y: 2, z: 2, type: "capital", color: "#f4c542" },
@@ -4815,8 +4917,9 @@ var DEFAULT_3D_WORLDMAP_FEATURES = [
 ];
 function GameCanvas3DWorldMapTemplate({
   entity,
-  tiles: propTiles = DEFAULT_3D_WORLDMAP_TILES,
+  tiles: propTiles,
   features: propFeatures = DEFAULT_3D_WORLDMAP_FEATURES,
+  assetManifest,
   cameraMode = "isometric",
   backgroundColor = "#1a1a2e",
   tileClickEvent,
@@ -4830,9 +4933,10 @@ function GameCanvas3DWorldMapTemplate({
   scale,
   className
 }) {
-  const resolved = entity && typeof entity === "object" && !Array.isArray(entity) ? entity : void 0;
-  const tiles = resolved ? Array.isArray(resolved.tiles) ? resolved.tiles : [] : propTiles;
-  const features = resolved ? Array.isArray(resolved.features) ? resolved.features : [] : propFeatures;
+  const row = boardEntity(entity);
+  const hasEntityTiles = !!row && Array.isArray(row.tiles) && row.tiles.length > 0;
+  const tiles = hasEntityTiles ? resolveEntityTiles(entity, assetManifest) : propTiles ? resolvePropTiles(propTiles, assetManifest) : resolveTilesWithModels(DEFAULT_3D_WORLDMAP_LAYOUT, assetManifest);
+  const features = row && Array.isArray(row.features) && row.features.length > 0 ? resolveEntityFeatures(entity, assetManifest) : resolveFeaturesWithModels(propFeatures, assetManifest);
   return (
     /* GameBoard3D reads selectedUnitId/validMoves/attackTargets from entity */
     /* @__PURE__ */ jsx(

package/dist/components/game/organisms/CardBattlerBoard.d.ts

@@ -0,0 +1,46 @@
+import React from 'react';
+import type { AssetUrl, EventEmit, EntityRow } from '@almadar/core';
+import type { DisplayStateProps } from '../../core/organisms/types';
+/** Manifest of asset base-url + per-card sprite map (UI value DTO). */
+type CardBattlerAssetManifest = {
+    baseUrl?: AssetUrl;
+    cards?: Record<string, AssetUrl>;
+};
+/** One card as carried on the entity / passed as a prop. */
+export interface CardBattlerCard {
+    id: string;
+    iconKey?: string;
+    title?: string;
+    cost?: number;
+    attack?: number;
+    defense?: number;
+}
+export interface CardBattlerBoardProps extends DisplayStateProps {
+    entity?: EntityRow | readonly EntityRow[];
+    /** Cards remaining in the draw deck (count-only view). */
+    deck?: CardBattlerCard[];
+    /** Cards currently in the player's hand. */
+    hand?: CardBattlerCard[];
+    /** Cards played onto the board this match. */
+    board?: CardBattlerCard[];
+    mana?: number;
+    maxMana?: number;
+    turn?: number;
+    result?: 'none' | 'won' | 'lost';
+    /** Base-url + per-iconKey card sprite map (organism owns asset choice). */
+    assetManifest?: CardBattlerAssetManifest;
+    playCardEvent?: EventEmit<{
+        cardId: string;
+    }>;
+    endTurnEvent?: EventEmit<Record<string, never>>;
+    playAgainEvent?: EventEmit<Record<string, never>>;
+    gameEndEvent?: EventEmit<{
+        result: 'won' | 'lost';
+    }>;
+    className?: string;
+}
+export declare function CardBattlerBoard({ entity, deck: propDeck, hand: propHand, board: propBoard, mana: propMana, maxMana: propMaxMana, turn: propTurn, result: propResult, assetManifest: propAssetManifest, playCardEvent, endTurnEvent, playAgainEvent, gameEndEvent, className, }: CardBattlerBoardProps): React.JSX.Element;
+export declare namespace CardBattlerBoard {
+    var displayName: string;
+}
+export default CardBattlerBoard;

package/dist/components/game/organisms/CityBuilderBoard.d.ts

@@ -0,0 +1,63 @@
+import React from 'react';
+import type { AssetUrl, EventEmit, EntityRow } from '@almadar/core';
+import type { DisplayStateProps } from '../../core/organisms/types';
+/** Manifest of asset base-url + per-kind sprite maps (UI value DTO). */
+type CityBuilderAssetManifest = {
+    baseUrl?: AssetUrl;
+    terrains?: Record<string, AssetUrl>;
+    units?: Record<string, AssetUrl>;
+    features?: Record<string, AssetUrl>;
+};
+export interface CityBuilderTile {
+    x: number;
+    y: number;
+    terrain?: string;
+    terrainSprite?: AssetUrl;
+    passable?: boolean;
+}
+export interface CityBuilderBuilding {
+    id: string;
+    x: number;
+    y: number;
+    type: string;
+}
+/** A placeable building type shown in the build palette (UI value DTO). */
+export interface CityBuilderBuildType {
+    type: string;
+    label: string;
+    cost: number;
+}
+export interface CityBuilderBoardProps extends DisplayStateProps {
+    entity?: EntityRow | readonly EntityRow[];
+    tiles?: CityBuilderTile[];
+    buildings?: CityBuilderBuilding[];
+    /** Asset base-url + terrain/unit/feature sprite maps (organism owns asset choice). */
+    assetManifest?: CityBuilderAssetManifest;
+    buildTypes?: CityBuilderBuildType[];
+    pendingBuildType?: string;
+    gold?: number;
+    wood?: number;
+    population?: number;
+    tick?: number;
+    result?: 'none' | 'won' | 'lost';
+    scale?: number;
+    unitScale?: number;
+    spriteHeightRatio?: number;
+    spriteMaxWidthRatio?: number;
+    selectBuildTypeEvent?: EventEmit<{
+        buildType: string;
+    }>;
+    placeBuildingEvent?: EventEmit<{
+        x: number;
+        y: number;
+    }>;
+    gameEndEvent?: EventEmit<{
+        result: 'won' | 'lost';
+    }>;
+    className?: string;
+}
+export declare function CityBuilderBoard({ entity, tiles: propTiles, buildings: propBuildings, assetManifest: propAssetManifest, buildTypes: propBuildTypes, pendingBuildType: propPendingBuildType, gold: propGold, wood: propWood, population: propPopulation, result: propResult, scale, unitScale, spriteHeightRatio, spriteMaxWidthRatio, selectBuildTypeEvent, placeBuildingEvent, gameEndEvent, className, }: CityBuilderBoardProps): React.JSX.Element;
+export declare namespace CityBuilderBoard {
+    var displayName: string;
+}
+export default CityBuilderBoard;

package/dist/components/game/organisms/TopDownShooterBoard.d.ts

@@ -0,0 +1,64 @@
+import * as React from 'react';
+import type { AssetUrl, EventEmit, EntityRow } from '@almadar/core';
+/** Asset base-url + per-kind sprite maps (organism owns asset choice; UI value DTO). */
+type ShooterAssetManifest = {
+    baseUrl?: AssetUrl;
+    units?: Record<string, AssetUrl>;
+    features?: Record<string, AssetUrl>;
+    background?: AssetUrl;
+};
+export interface ShooterPlayer {
+    x: number;
+    y: number;
+}
+export interface ShooterEnemy {
+    id: string;
+    x: number;
+    y: number;
+    hp: number;
+}
+export interface ShooterProjectile {
+    id: string;
+    x: number;
+    y: number;
+    vx: number;
+    vy: number;
+}
+export interface TopDownShooterBoardProps {
+    /** Entity carrying all board state (player, enemies, projectiles, score, wave, lives, result). */
+    entity?: EntityRow | readonly EntityRow[];
+    /** Direct state — each takes priority over its entity-derived value. */
+    player?: ShooterPlayer;
+    enemies?: ShooterEnemy[];
+    projectiles?: ShooterProjectile[];
+    score?: number;
+    wave?: number;
+    lives?: number;
+    result?: 'none' | 'won' | 'lost';
+    /** Asset base-url + unit/feature sprite maps + background. */
+    assetManifest?: ShooterAssetManifest;
+    /** Canvas / arena dimensions in pixels. */
+    width?: number;
+    height?: number;
+    /** Pixel draw-size of sprites. */
+    spriteSize?: number;
+    /** Closed-circuit event emits (UI:{event}). */
+    moveEvent?: EventEmit<{
+        dx: number;
+        dy: number;
+    }>;
+    fireEvent?: EventEmit<{
+        tx: number;
+        ty: number;
+    }>;
+    playAgainEvent?: EventEmit<Record<string, never>>;
+    gameEndEvent?: EventEmit<{
+        result: 'won' | 'lost';
+    }>;
+    className?: string;
+}
+export declare function TopDownShooterBoard({ entity, player: propPlayer, enemies: propEnemies, projectiles: propProjectiles, score: propScore, wave: propWave, lives: propLives, result: propResult, assetManifest: propAssetManifest, width, height, spriteSize, moveEvent, fireEvent, playAgainEvent, gameEndEvent, className, }: TopDownShooterBoardProps): React.JSX.Element;
+export declare namespace TopDownShooterBoard {
+    var displayName: string;
+}
+export default TopDownShooterBoard;