@almadar/shell-web 0.1.0 → 1.0.0

package/dist/{chunk-PC7K4SK7.js → chunk-4T3P43NS.js}

@@ -1,9 +1,9 @@
-import { resolveThemeColor, parseComputedColor } from './chunk-DFNZUYX4.js';
-import { updateAssetStatus } from './chunk-B4BU77LT.js';
-import { resolveFxView, useTheme, useThemeScope, fxLifecycle, fxHash01 } from './chunk-MBQAMMSE.js';
+import { resolveThemeColor, parseComputedColor } from './chunk-UXLE3IPR.js';
+import { updateAssetStatus } from './chunk-ILZ7ORX7.js';
+import { useTheme, useThemeScope } from './chunk-4YXBKHHM.js';
 import { createContext, useContext, useState, useLayoutEffect, useEffect } from 'react';
 import { createLogger } from '@almadar/logger';
-import { DIAGRAM_TONES, DIAGRAM_TONE_COLOR_KEYS, DIAGRAM_TEXT_SIZES } from '@almadar/core';
+import { DIAGRAM_TONES, kernelEvaluator, DIAGRAM_TONE_COLOR_KEYS, DIAGRAM_TEXT_SIZES } from '@almadar/core';
 
 // src/lib/drawable/contract.ts
 function isValidScenePos(pos) {
@@ -300,97 +300,14 @@ function getOrLoadImage(url, onReady) {
 function getImageStatus(url) {
   return cache.get(url)?.status;
 }
-
-// src/lib/skinning.ts
-var IDENTITY = [1, 0, 0, 1, 0, 0];
-function composeAffine(a, b) {
-  return [
-    a[0] * b[0] + a[2] * b[1],
-    a[1] * b[0] + a[3] * b[1],
-    a[0] * b[2] + a[2] * b[3],
-    a[1] * b[2] + a[3] * b[3],
-    a[0] * b[4] + a[2] * b[5] + a[4],
-    a[1] * b[4] + a[3] * b[5] + a[5]
-  ];
-}
-function invertAffine(m) {
-  const det = m[0] * m[3] - m[1] * m[2];
-  if (!Number.isFinite(det) || Math.abs(det) < 1e-12) return IDENTITY;
-  const inv = 1 / det;
-  return [
-    m[3] * inv,
-    -m[1] * inv,
-    -m[2] * inv,
-    m[0] * inv,
-    (m[2] * m[5] - m[3] * m[4]) * inv,
-    (m[1] * m[4] - m[0] * m[5]) * inv
-  ];
-}
-function applyAffine(m, x, y) {
-  return [m[0] * x + m[2] * y + m[4], m[1] * x + m[3] * y + m[5]];
-}
-function rotationAbout(pivot, degrees) {
-  const r = degrees * Math.PI / 180;
-  const cos = Math.cos(r);
-  const sin = Math.sin(r);
-  const [px, py] = pivot;
-  return [cos, sin, -sin, cos, px - cos * px + sin * py, py - sin * px - cos * py];
-}
 function computeWorldMatrices(bones, pose) {
-  const indexByName = /* @__PURE__ */ new Map();
-  bones.forEach((b, i) => indexByName.set(b.name, i));
-  const world = new Array(bones.length);
-  const visiting = /* @__PURE__ */ new Set();
-  const resolve = (i) => {
-    const cached = world[i];
-    if (cached) return cached;
-    if (visiting.has(i)) return IDENTITY;
-    visiting.add(i);
-    const b = bones[i];
-    const parentIndex = b.parent === null ? void 0 : indexByName.get(b.parent);
-    const parentWorld = parentIndex === void 0 ? IDENTITY : resolve(parentIndex);
-    const local = rotationAbout(b.pivot, pose[b.name] ?? 0);
-    const m = composeAffine(parentWorld, local);
-    visiting.delete(i);
-    world[i] = m;
-    return m;
-  };
-  return bones.map((_, i) => resolve(i));
+  return JSON.parse(kernelEvaluator().skinWorldMatrices(JSON.stringify(bones), JSON.stringify(pose)));
 }
 function skinVertices(mesh, bindWorld, curWorld) {
-  const skinMats = /* @__PURE__ */ new Map();
-  const skinMat = (bone) => {
-    let m = skinMats.get(bone);
-    if (!m) {
-      m = composeAffine(curWorld[bone] ?? IDENTITY, invertAffine(bindWorld[bone] ?? IDENTITY));
-      skinMats.set(bone, m);
-    }
-    return m;
-  };
-  return mesh.vertices.map((v) => {
-    if (v.weights.length === 0) return [v.x, v.y];
-    let x = 0;
-    let y = 0;
-    for (const { bone, w } of v.weights) {
-      const [bx, by] = applyAffine(skinMat(bone), v.x, v.y);
-      x += w * bx;
-      y += w * by;
-    }
-    return [x, y];
-  });
+  return JSON.parse(kernelEvaluator().skinVertices(JSON.stringify(mesh), JSON.stringify(bindWorld), JSON.stringify(curWorld)));
 }
 function triangleAffine(src, dst) {
-  const [s0, s1, s2] = src;
-  const det = s0[0] * (s1[1] - s2[1]) + s1[0] * (s2[1] - s0[1]) + s2[0] * (s0[1] - s1[1]);
-  if (!Number.isFinite(det) || Math.abs(det) < 1e-12) return null;
-  const [d0, d1, d2] = dst;
-  const a = (d0[0] * (s1[1] - s2[1]) + d1[0] * (s2[1] - s0[1]) + d2[0] * (s0[1] - s1[1])) / det;
-  const c = (d0[0] * (s2[0] - s1[0]) + d1[0] * (s0[0] - s2[0]) + d2[0] * (s1[0] - s0[0])) / det;
-  const e = (d0[0] * (s1[0] * s2[1] - s2[0] * s1[1]) + d1[0] * (s2[0] * s0[1] - s0[0] * s2[1]) + d2[0] * (s0[0] * s1[1] - s1[0] * s0[1])) / det;
-  const b = (d0[1] * (s1[1] - s2[1]) + d1[1] * (s2[1] - s0[1]) + d2[1] * (s0[1] - s1[1])) / det;
-  const d = (d0[1] * (s2[0] - s1[0]) + d1[1] * (s0[0] - s2[0]) + d2[1] * (s1[0] - s0[0])) / det;
-  const f = (d0[1] * (s1[0] * s2[1] - s2[0] * s1[1]) + d1[1] * (s2[0] * s0[1] - s0[0] * s2[1]) + d2[1] * (s0[0] * s1[1] - s1[0] * s0[1])) / det;
-  return [a, b, c, d, e, f];
+  return JSON.parse(kernelEvaluator().skinTriangleAffine(JSON.stringify(src), JSON.stringify(dst)));
 }
 var meshCache = /* @__PURE__ */ new Map();
 function isRigBundle(json) {
@@ -417,18 +334,7 @@ function skinMeshFailed(url) {
   return meshCache.get(url) === null;
 }
 function vertexBounds(points) {
-  if (points.length === 0) return null;
-  let minX = Infinity;
-  let minY = Infinity;
-  let maxX = -Infinity;
-  let maxY = -Infinity;
-  for (const [x, y] of points) {
-    if (x < minX) minX = x;
-    if (y < minY) minY = y;
-    if (x > maxX) maxX = x;
-    if (y > maxY) maxY = y;
-  }
-  return { minX, minY, maxX, maxY };
+  return JSON.parse(kernelEvaluator().skinVertexBounds(JSON.stringify(points)));
 }
 
 // src/components/game/atoms/DrawSkinnedMesh.tsx
@@ -629,174 +535,17 @@ function DrawMesh(props) {
   if (register) register({ ...props, type: "draw-mesh" });
   return null;
 }
-
-// src/components/game/molecules/DrawFxLayer.tsx
 var DEFAULT_TICK_MS = 500;
 var DEFAULT_TEXT_COLOR = "#ffe066";
-var DEFAULT_SPARK_COLOR = "#ffffff";
-var easeOut = (t) => 1 - (1 - t) * (1 - t);
-function fxPosition(view, dim, ageSec) {
-  const g = view.gravity ?? 0;
-  const fall = 0.5 * g * ageSec * ageSec;
-  if (dim === "2d") {
-    const base2 = view.position ?? { x: view.x, y: view.z ?? view.y ?? 0 };
-    if (!Number.isFinite(base2.x) || !Number.isFinite(base2.y)) return void 0;
-    return {
-      x: base2.x + (view.vx ?? 0) * ageSec,
-      y: base2.y + (view.vz ?? 0) * ageSec + fall
-    };
-  }
-  const base = view.position ?? { x: view.x, y: view.z ?? 0, z: view.y };
-  if (!Number.isFinite(base.x) || !Number.isFinite(base.y)) return void 0;
-  return {
-    x: base.x + (view.vx ?? 0) * ageSec,
-    y: base.y + (view.vz ?? 0) * ageSec,
-    ...base.z !== void 0 || view.vy !== void 0 || g !== 0 ? { z: (base.z ?? 0) + (view.vy ?? 0) * ageSec - fall } : {}
-  };
-}
-function sparkShape(view, pos, i, fade, progress) {
-  const size = view.size ?? 0.5;
-  const angle = fxHash01(view.id, i * 3) * Math.PI * 2;
-  const dist = size * (0.4 + 0.6 * fxHash01(view.id, i * 3 + 1)) * easeOut(progress);
-  const r = size * (0.06 + 0.06 * fxHash01(view.id, i * 3 + 2));
-  const color = view.color ?? DEFAULT_SPARK_COLOR;
-  return {
-    type: "draw-shape",
-    shape: "ellipse",
-    position: { ...pos, x: pos.x + Math.cos(angle) * dist, y: pos.y + Math.sin(angle) * dist },
-    anchor: "center",
-    radiusX: r,
-    fill: color,
-    blendMode: "lighter",
-    opacity: fade,
-    ...view.glow ? { shadow: { color, blur: view.glow } } : {}
+var DEFAULT_FONT_FAMILY = "system-ui, sans-serif";
+function expandFxLayer(node, epochNowMs, dim, tileWidth, fontFamily) {
+  const layer = {
+    ...node,
+    tickMs: node.tickMs ?? DEFAULT_TICK_MS,
+    textColor: node.textColor ?? DEFAULT_TEXT_COLOR,
+    fontFamily: fontFamily ?? DEFAULT_FONT_FAMILY
   };
-}
-function proceduralShapes(view, pos, fade, progress) {
-  const size = view.size ?? 0.5;
-  const color = view.color ?? DEFAULT_SPARK_COLOR;
-  switch (view.shape ?? "spark") {
-    case "ring": {
-      return [
-        {
-          type: "draw-shape",
-          shape: "ellipse",
-          position: pos,
-          anchor: "center",
-          radiusX: size * easeOut(progress),
-          stroke: view.color2 ?? color,
-          strokeWidth: 2,
-          blendMode: "lighter",
-          opacity: fade,
-          ...view.glow ? { shadow: { color, blur: view.glow } } : {}
-        }
-      ];
-    }
-    case "puff": {
-      const count = view.count ?? 3;
-      return Array.from({ length: count }, (_, i) => {
-        const angle = fxHash01(view.id, i * 5) * Math.PI * 2;
-        const drift = size * 0.3 * fxHash01(view.id, i * 5 + 1) * easeOut(progress);
-        return {
-          type: "draw-shape",
-          shape: "ellipse",
-          position: { ...pos, x: pos.x + Math.cos(angle) * drift, y: pos.y + Math.sin(angle) * drift },
-          anchor: "center",
-          radiusX: size * (0.15 + 0.35 * progress) * (0.7 + 0.6 * fxHash01(view.id, i * 5 + 2)),
-          fill: i === 0 && view.color2 ? view.color2 : color,
-          opacity: fade * 0.6,
-          ...view.glow ? { shadow: { color, blur: view.glow } } : {}
-        };
-      });
-    }
-    case "streak": {
-      const count = view.count ?? 5;
-      return Array.from({ length: count }, (_, i) => {
-        const angle = fxHash01(view.id, i * 3) * Math.PI * 2;
-        const inner = size * (0.2 + 0.8 * easeOut(progress)) * (0.6 + 0.4 * fxHash01(view.id, i * 3 + 1));
-        const len = size * 0.35;
-        return {
-          type: "draw-shape",
-          shape: "ellipse",
-          position: pos,
-          anchor: "center",
-          offsetX: inner + len / 2,
-          offsetY: 0,
-          radiusX: len / 2,
-          radiusY: size * 0.04,
-          rotate: angle,
-          fill: color,
-          blendMode: "lighter",
-          opacity: fade,
-          ...view.glow ? { shadow: { color, blur: view.glow } } : {}
-        };
-      });
-    }
-    default: {
-      const count = view.count ?? 6;
-      return Array.from({ length: count }, (_, i) => sparkShape(view, pos, i, fade, progress));
-    }
-  }
-}
-function expandFxItem(view, node, epochNowMs, dim, projector, fontFamily) {
-  if (view.space === "screen") return [];
-  const tickMs = node.tickMs ?? DEFAULT_TICK_MS;
-  const { ageMs, progress, fade } = fxLifecycle(view, epochNowMs, tickMs);
-  if (progress >= 1) return [];
-  const pos = fxPosition(view, dim, ageMs / 1e3);
-  if (!pos) return [];
-  const out = [];
-  const artItems = node.art?.[view.type]?.["idle"];
-  const sprite = node.sprites?.[view.type];
-  if (Array.isArray(artItems)) {
-    out.push({
-      type: "draw-group",
-      position: pos,
-      opacity: fade,
-      ...view.size !== void 0 ? { scale: view.size } : {},
-      items: artItems
-    });
-  } else if (sprite?.url) {
-    const spriteSize = view.size ?? 0.6;
-    out.push({
-      type: "draw-sprite",
-      position: pos,
-      asset: sprite,
-      anchor: "center",
-      width: spriteSize,
-      height: spriteSize,
-      opacity: fade,
-      animation: view.animation ?? sprite.animations?.[0],
-      // One-shot fx rows (burst) play from the item's birth, not wall-time.
-      clockMs: ageMs
-    });
-  } else {
-    out.push(...proceduralShapes(view, pos, fade, progress));
-  }
-  if (view.message) {
-    const pxSize = projector && view.size !== void 0 ? Math.max(10, Math.round(view.size * projector.tileWidth)) : void 0;
-    const family = fontFamily ?? "system-ui, sans-serif";
-    const text = {
-      type: "draw-text",
-      text: view.message,
-      position: pos,
-      offsetY: -(0.15 + 0.55 * progress),
-      color: view.color ?? node.textColor ?? DEFAULT_TEXT_COLOR,
-      opacity: fade,
-      font: `bold ${pxSize ?? 14}px ${family}`
-    };
-    out.push(text);
-  }
-  return out;
-}
-function expandFxLayer(node, epochNowMs, dim, projector, fontFamily) {
-  if (!Array.isArray(node.items)) return [];
-  const out = [];
-  for (const item of node.items) {
-    if (!item || typeof item.id !== "string") continue;
-    out.push(...expandFxItem(resolveFxView(item, node.presets), node, epochNowMs, dim, projector, fontFamily));
-  }
-  return out;
+  return JSON.parse(kernelEvaluator().expandFxLayer(JSON.stringify(layer), epochNowMs, dim, tileWidth));
 }
 function DrawFxLayer(_props) {
   return null;
@@ -1151,7 +900,7 @@ function drawMarker(ctx, theme, x1, y1, x2, y2, color, width) {
   }
   ctx.restore();
 }
-function useCanvasTheme(scopeRef) {
+function useCanvasTheme(scopeRef, scopePresent = true) {
   const { appliedTheme } = useTheme();
   const scopeKey = JSON.stringify(useThemeScope());
   const [state, setState] = useState({ theme: null, version: 0 });
@@ -1160,7 +909,7 @@ function useCanvasTheme(scopeRef) {
     if (!scope) return;
     const theme = resolveCanvasTheme(scope);
     setState((prev) => ({ theme, version: prev.version + 1 }));
-  }, [appliedTheme, scopeKey, scopeRef]);
+  }, [appliedTheme, scopeKey, scopeRef, scopePresent]);
   return state;
 }