@almadar/ui 6.12.0 → 6.14.0

package/dist/providers/index.cjs

@@ -7856,7 +7856,7 @@ var init_DialogueBubble = __esm({
     init_Typography();
     init_GameIcon();
     DEFAULT_PORTRAIT = {
-      url: "https://almadar-kflow-assets.web.app/shared/characters/archetypes/04_hero.png",
+      url: "https://almadar-kflow-assets.web.app/shared/ui-winter-ski-board/default/units/hero/hero.png",
       role: "effect",
       category: "character"
     };
@@ -9180,6 +9180,14 @@ function createWebPainter(ctx, onAssetLoad) {
         ctx.drawImage(img, dest.x, dest.y, dw, dh);
       }
     },
+    blitTransformed(tex, src, affine) {
+      const img = imageByHandle.get(tex);
+      if (!img) return;
+      ctx.save();
+      ctx.transform(affine[0], affine[1], affine[2], affine[3], affine[4], affine[5]);
+      ctx.drawImage(img, src.x, src.y, src.w, src.h, src.x, src.y, src.w, src.h);
+      ctx.restore();
+    },
     fillRect(x, y, w, h, style) {
       ctx.fillStyle = toCanvasStyle(style);
       ctx.fillRect(x, y, w, h);
@@ -9686,6 +9694,271 @@ var init_DrawGroup = __esm({
     init_registry();
   }
 });
+
+// lib/skinning.ts
+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));
+}
+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];
+  });
+}
+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 f3 = (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, f3];
+}
+function isRigBundle(json) {
+  return json.mesh !== void 0 || json.bones !== void 0;
+}
+function getRigBundle(url, onReady) {
+  if (meshCache.has(url)) return meshCache.get(url) ?? void 0;
+  meshCache.set(url, void 0);
+  fetch(url).then((r) => {
+    if (!r.ok) throw new Error(`rigbundle fetch failed: HTTP ${r.status}`);
+    return r.json();
+  }).then((json) => {
+    const ok = isRigBundle(json) || Array.isArray(json.vertices);
+    if (!ok) throw new Error("rigbundle payload is neither a SkinMesh nor a rigbundle");
+    meshCache.set(url, json);
+    onReady();
+  }).catch(() => {
+    meshCache.set(url, null);
+    onReady();
+  });
+  return void 0;
+}
+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 };
+}
+var IDENTITY, meshCache;
+var init_skinning = __esm({
+  "lib/skinning.ts"() {
+    IDENTITY = [1, 0, 0, 1, 0, 0];
+    meshCache = /* @__PURE__ */ new Map();
+  }
+});
+function warnMissingOnce2(reason, node) {
+  const key = `${reason}:${node.asset.url}:${String(node.meshUrl)}`;
+  if (loggedMissing2.has(key)) return;
+  loggedMissing2.add(key);
+  skinnedLog.warn("draw-skinned-mesh unresolvable \u2014 painting fallback", { reason, url: node.asset.url, meshUrl: node.meshUrl });
+}
+function dominantBone(v) {
+  let best = -1;
+  let bestW = 0;
+  for (const { bone, w } of v.weights) {
+    if (w > bestW) {
+      bestW = w;
+      best = bone;
+    }
+  }
+  return best;
+}
+function resolveSkinPose(node, clip) {
+  const effectiveClip = clip ?? node.clip;
+  if (effectiveClip && node.frame !== void 0 && effectiveClip.frames.length > 0) {
+    return effectiveClip.frames[node.frame % effectiveClip.frames.length];
+  }
+  return node.pose ?? {};
+}
+function resolveRig(node, dctx) {
+  const fetched = node.meshUrl ? getRigBundle(node.meshUrl, dctx.invalidate) : void 0;
+  if (node.meshUrl && fetched === void 0) return void 0;
+  const rb = fetched && isRigBundle(fetched) ? fetched : void 0;
+  const mesh = node.mesh ?? rb?.mesh ?? (!rb ? fetched : void 0);
+  if (!mesh) return void 0;
+  const bones = node.bones.length > 0 ? node.bones : rb?.bones ?? [];
+  if (bones.length === 0) return void 0;
+  const clip = node.clip ?? (node.clipName ? rb?.clips?.[node.clipName] : void 0);
+  return { mesh, bones, clip };
+}
+function meshHasPixelUVs(mesh) {
+  const cached = pixelUVByMesh.get(mesh);
+  if (cached !== void 0) return cached;
+  let pixel = false;
+  for (const v of mesh.vertices) {
+    if (v.u < 0 || v.u > 1 || v.v < 0 || v.v > 1) {
+      pixel = true;
+      break;
+    }
+  }
+  pixelUVByMesh.set(mesh, pixel);
+  return pixel;
+}
+function paintMeshPass(painter, node, bones, mesh, tex, dctx, pose, opacity) {
+  const bindWorld = computeWorldMatrices(bones, {});
+  const curWorld = computeWorldMatrices(bones, pose);
+  const skinned = skinVertices(mesh, bindWorld, curWorld);
+  const origin = dctx.projector.project(node.position);
+  const tw = dctx.projector.tileWidth;
+  painter.save();
+  if (opacity !== 1) painter.setAlpha(opacity);
+  for (const [i0, i1, i2] of mesh.triangles) {
+    const v0 = mesh.vertices[i0];
+    const v1 = mesh.vertices[i1];
+    const v2 = mesh.vertices[i2];
+    const p0 = skinned[i0];
+    const p1 = skinned[i1];
+    const p2 = skinned[i2];
+    if (!v0 || !v1 || !v2 || !p0 || !p1 || !p2) continue;
+    const dst = [
+      [origin.x + p0[0] * tw, origin.y + p0[1] * tw],
+      [origin.x + p1[0] * tw, origin.y + p1[1] * tw],
+      [origin.x + p2[0] * tw, origin.y + p2[1] * tw]
+    ];
+    if (node.weightsOverlay || !tex) {
+      if (!node.weightsOverlay) continue;
+      const bone = dominantBone(v0);
+      painter.fillPoly(
+        dst.map(([x, y]) => ({ x, y })),
+        WEIGHT_PALETTE[(bone % WEIGHT_PALETTE.length + WEIGHT_PALETTE.length) % WEIGHT_PALETTE.length]
+      );
+      continue;
+    }
+    const pixelUV = meshHasPixelUVs(mesh);
+    const uv = pixelUV ? [[v0.u, v0.v], [v1.u, v1.v], [v2.u, v2.v]] : [
+      [v0.u * tex.width, v0.v * tex.height],
+      [v1.u * tex.width, v1.v * tex.height],
+      [v2.u * tex.width, v2.v * tex.height]
+    ];
+    const affine = triangleAffine(uv, dst);
+    if (!affine) continue;
+    painter.save();
+    painter.clipPath(`M ${dst[0][0]} ${dst[0][1]} L ${dst[1][0]} ${dst[1][1]} L ${dst[2][0]} ${dst[2][1]} Z`);
+    painter.blitTransformed(tex, { x: 0, y: 0, w: tex.width, h: tex.height }, affine);
+    painter.restore();
+  }
+  painter.restore();
+}
+function DrawSkinnedMesh(props) {
+  const register = React89.useContext(DrawableRegistryContext);
+  if (register) register({ ...props, type: "draw-skinned-mesh" });
+  return null;
+}
+var skinnedLog, loggedMissing2, WEIGHT_PALETTE, pixelUVByMesh, paintSkinnedMesh;
+var init_DrawSkinnedMesh = __esm({
+  "components/game/atoms/DrawSkinnedMesh.tsx"() {
+    "use client";
+    init_imageCache();
+    init_contract();
+    init_registry();
+    init_skinning();
+    skinnedLog = logger.createLogger("almadar:ui:draw-skinned-mesh");
+    loggedMissing2 = /* @__PURE__ */ new Set();
+    WEIGHT_PALETTE = Array.from({ length: 10 }, (_, i) => `hsl(${i * 36 % 360}, 70%, 55%)`);
+    pixelUVByMesh = /* @__PURE__ */ new WeakMap();
+    paintSkinnedMesh = (painter, node, dctx) => {
+      if (!isValidScenePos(node.position)) return;
+      const rig = resolveRig(node, dctx);
+      if (!rig) {
+        if (node.meshUrl && skinMeshFailed(node.meshUrl)) warnMissingOnce2("mesh-failed", node);
+        else if (!node.mesh && !node.meshUrl) warnMissingOnce2("mesh-missing", node);
+        return;
+      }
+      const tex = node.weightsOverlay ? null : painter.resolveTexture(node.asset.url);
+      if (!node.weightsOverlay && !tex) {
+        if (getImageStatus(node.asset.url) === "failed") warnMissingOnce2("texture-failed", node);
+        return;
+      }
+      if (node.ghost && rig.clip && rig.clip.frames.length > 0) {
+        paintMeshPass(painter, node, rig.bones, rig.mesh, tex, dctx, rig.clip.frames[node.ghost.frame % rig.clip.frames.length], node.ghost.opacity);
+      }
+      paintMeshPass(painter, node, rig.bones, rig.mesh, tex, dctx, resolveSkinPose(node, rig.clip), node.opacity ?? 1);
+    };
+  }
+});
 function applyMeshAnimation(node, timeMs) {
   const anim = node.animation;
   if (!anim || !(anim.durationMs > 0) || anim.keyframes.length === 0) return null;
@@ -10010,6 +10283,9 @@ function paintDrawable(painter, node, dctx) {
     case "draw-mesh":
       warnUnsupported2d("draw-mesh");
       break;
+    case "draw-skinned-mesh":
+      paintSkinnedMesh(painter, node, dctx);
+      break;
     case "draw-sprite-layer":
       paintSpriteLayer(painter, node, dctx);
       break;
@@ -10034,6 +10310,7 @@ var init_paintDispatch = __esm({
     init_DrawShape();
     init_DrawText();
     init_DrawGroup();
+    init_DrawSkinnedMesh();
     init_DrawMesh();
     init_DrawSpriteLayer();
     init_DrawShapeLayer();
@@ -10054,6 +10331,21 @@ function shapeDrawnItem(n) {
   if (n.shape !== "rect") return { pos: n.position, id: n.id };
   return { pos: n.position, id: n.id, anchor: n.anchor, width: n.width, height: n.height, rotation: n.rotate };
 }
+function skinnedMeshDrawnItem(n) {
+  const mesh = n.mesh;
+  if (!mesh || n.bones.length === 0) return { pos: n.position, id: n.id };
+  const bindWorld = computeWorldMatrices(n.bones, {});
+  const curWorld = computeWorldMatrices(n.bones, resolveSkinPose(n));
+  const bounds = vertexBounds(skinVertices(mesh, bindWorld, curWorld));
+  if (!bounds) return { pos: n.position, id: n.id };
+  return {
+    pos: { ...n.position, x: n.position.x + bounds.minX, y: n.position.y + bounds.minY },
+    id: n.id,
+    anchor: "top-left",
+    width: bounds.maxX - bounds.minX,
+    height: bounds.maxY - bounds.minY
+  };
+}
 function collectDrawnItems(nodes) {
   const out = [];
   for (const n of nodes) {
@@ -10064,6 +10356,9 @@ function collectDrawnItems(nodes) {
       case "draw-shape":
         if (isValidScenePos(n.position)) out.push(shapeDrawnItem(n));
         break;
+      case "draw-skinned-mesh":
+        if (isValidScenePos(n.position)) out.push(skinnedMeshDrawnItem(n));
+        break;
       case "draw-text":
       case "draw-group":
       case "draw-mesh":
@@ -10131,6 +10426,8 @@ function rotatePoint(p, center, radians) {
 var init_hitTest = __esm({
   "lib/drawable/hitTest.ts"() {
     init_contract();
+    init_DrawSkinnedMesh();
+    init_skinning();
   }
 });
 function normalizeBackdrop(bg) {
@@ -11320,7 +11617,7 @@ var init_StateIndicator = __esm({
     init_cn();
     init_GameIcon();
     DEFAULT_ASSET_URL = {
-      url: "https://almadar-kflow-assets.web.app/shared/isometric-dungeon/Isometric/chestClosed_E.png",
+      url: "https://almadar-kflow-assets.web.app/shared/ui-topdown-dungeon-board/default/features/chest/chest.png",
       role: "ui",
       category: "state"
     };
@@ -12936,11 +13233,6 @@ function executeEffect(effect, config) {
       executeNavigate(path, params, config);
       break;
     }
-    case "notify": {
-      const [message, options] = args;
-      executeNotify(message, options, config);
-      break;
-    }
     case "emit": {
       const [event, payload] = args;
       executeEmit(event, payload, config);
@@ -12956,9 +13248,6 @@ function executeRenderUI(slot, patternConfig, config) {
 function executeNavigate(path, params, config) {
   config.navigate(path, params);
 }
-function executeNotify(message, options, config) {
-  config.notify(message, options);
-}
 function executeEmit(event, payload, config) {
   config.eventBus.emit(event, payload);
 }
@@ -13246,7 +13535,6 @@ var init_offline_executor = __esm({
               // Client effects - execute immediately
               case "render-ui":
               case "navigate":
-              case "notify":
               case "emit":
                 clientEffects.push(effect);
                 break;
@@ -15674,7 +15962,6 @@ var init_avl_atom_types = __esm({
       "persist": "data",
       "fetch": "data",
       "emit": "communication",
-      "notify": "communication",
       "call-service": "communication",
       "spawn": "lifecycle",
       "despawn": "lifecycle",
@@ -15822,12 +16109,6 @@ function effectIcon(type, x, y, s, color) {
         /* @__PURE__ */ jsxRuntime.jsx("line", { x1: x - s, y1: y, x2: x + s * 0.6, y2: y, stroke: color, strokeWidth: 1.5 }),
         /* @__PURE__ */ jsxRuntime.jsx("polyline", { points: `${x + s * 0.1},${y - s * 0.5} ${x + s},${y} ${x + s * 0.1},${y + s * 0.5}`, fill: "none", stroke: color, strokeWidth: 1.5, strokeLinejoin: "round" })
       ] });
-    case "notify":
-      return /* @__PURE__ */ jsxRuntime.jsxs("g", { children: [
-        /* @__PURE__ */ jsxRuntime.jsx("path", { d: `M${x - s * 0.7},${y + s * 0.3} Q${x - s * 0.7},${y - s} ${x},${y - s} Q${x + s * 0.7},${y - s} ${x + s * 0.7},${y + s * 0.3} Z`, fill: "none", stroke: color, strokeWidth: 1.5 }),
-        /* @__PURE__ */ jsxRuntime.jsx("line", { x1: x - s * 0.8, y1: y + s * 0.3, x2: x + s * 0.8, y2: y + s * 0.3, stroke: color, strokeWidth: 1.5 }),
-        /* @__PURE__ */ jsxRuntime.jsx("circle", { cx: x, cy: y + s * 0.7, r: s * 0.2, fill: color })
-      ] });
     case "call-service":
       return /* @__PURE__ */ jsxRuntime.jsxs("g", { children: [
         /* @__PURE__ */ jsxRuntime.jsx("line", { x1: x - s, y1: y - s * 0.3, x2: x + s, y2: y - s * 0.3, stroke: color, strokeWidth: 1.5 }),
@@ -21081,9 +21362,6 @@ function getEffectSummary(effects) {
       case "emit":
         summaries.push(`\u2191 ${effect[1] || "event"}`);
         break;
-      case "notify":
-        summaries.push(`\u{1F4E7} ${effect[1] || ""}`);
-        break;
       case "persist":
         summaries.push(`\u{1F4BE} ${effect[1] || "save"}`);
         break;
@@ -21109,7 +21387,7 @@ function extractOutputsFromTransitions(transitions) {
       t.effects.forEach((effect) => {
         if (Array.isArray(effect)) {
           const op = effect[0];
-          if (["emit", "notify", "persist", "navigate", "call-service"].includes(op)) {
+          if (["emit", "persist", "navigate", "call-service"].includes(op)) {
             if (isArraySExpr(effect)) {
               const humanText = formatSExprEffectToDomain(effect);
               outputs.add(humanText);
@@ -26493,6 +26771,18 @@ var init_useAuthContext = __esm({
   "hooks/useAuthContext.ts"() {
   }
 });
+function resolveActiveNavHref(items, currentPath) {
+  let best;
+  for (const item of items) {
+    for (const href of item.children?.length ? [item.href, ...item.children.map((c) => c.href)] : [item.href]) {
+      if (currentPath === href) return href;
+      if (currentPath.startsWith(href + "/") && (!best || href.length > best.length)) {
+        best = href;
+      }
+    }
+  }
+  return best;
+}
 var DashboardLayout, NavLink, NavLinkTopnav, NavLinkBottom;
 var init_DashboardLayout = __esm({
   "components/core/templates/DashboardLayout.tsx"() {
@@ -26564,6 +26854,7 @@ var init_DashboardLayout = __esm({
       const location = reactRouterDom.useLocation();
       const ctxPagePath = providers.useCurrentPagePath();
       const activePath = (currentPath || void 0) ?? ctxPagePath ?? location.pathname;
+      const activeHref = React89.useMemo(() => resolveActiveNavHref(navItems, activePath), [navItems, activePath]);
       const { signOut: authSignOut } = useAuthContext();
       const user = userProp || (null);
       const { t } = hooks.useTranslate();
@@ -26656,7 +26947,7 @@ var init_DashboardLayout = __esm({
                         NavLink,
                         {
                           item,
-                          currentPath: activePath,
+                          activeHref,
                           compact: isRail
                         },
                         item.href
@@ -26723,7 +27014,7 @@ var init_DashboardLayout = __esm({
                                 NavLinkTopnav,
                                 {
                                   item,
-                                  currentPath: activePath
+                                  activeHref
                                 },
                                 item.href
                               ))
@@ -26899,7 +27190,7 @@ var init_DashboardLayout = __esm({
                     NavLinkBottom,
                     {
                       item,
-                      currentPath: activePath
+                      activeHref
                     },
                     item.href
                   )) })
@@ -26913,15 +27204,71 @@ var init_DashboardLayout = __esm({
     DashboardLayout.displayName = "DashboardLayout";
     NavLink = ({
       item,
-      currentPath,
+      activeHref,
       compact = false
     }) => {
-      const isActive = currentPath === item.href || currentPath.startsWith(item.href + "/");
+      const hasChildren = !!item.children?.length;
+      const childActive = hasChildren && item.children.some((child) => child.href === activeHref);
+      const isActive = item.href === activeHref || childActive;
+      const [open, setOpen] = React89.useState(childActive);
       const iconClassName = cn(
         "h-5 w-5",
         isActive ? "text-primary-foreground" : "text-muted-foreground"
       );
       if (compact) {
+        if (hasChildren) {
+          return /* @__PURE__ */ jsxRuntime.jsxs(Box, { className: "relative", children: [
+            /* @__PURE__ */ jsxRuntime.jsx(
+              Button,
+              {
+                variant: "ghost",
+                title: item.label,
+                "aria-label": item.label,
+                "aria-expanded": open,
+                className: cn(
+                  "flex items-center justify-center w-full px-2 py-2 rounded-lg transition-colors",
+                  isActive ? "bg-primary text-primary-foreground shadow-sm" : "text-muted-foreground hover:bg-muted hover:text-foreground"
+                ),
+                onClick: () => setOpen(!open),
+                children: /* @__PURE__ */ jsxRuntime.jsxs(Box, { as: "span", className: "relative inline-flex", children: [
+                  item.icon ? typeof item.icon === "string" ? /* @__PURE__ */ jsxRuntime.jsx(Icon, { name: item.icon, className: iconClassName }) : /* @__PURE__ */ jsxRuntime.jsx(item.icon, { className: iconClassName }) : /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "small", className: "font-semibold", as: "span", children: item.label.charAt(0).toUpperCase() }),
+                  item.badge && /* @__PURE__ */ jsxRuntime.jsx(
+                    Badge,
+                    {
+                      variant: isActive ? "primary" : "default",
+                      size: "sm",
+                      className: "absolute -top-2 -right-2 px-1 py-0 text-[10px] leading-4",
+                      children: item.badge
+                    }
+                  )
+                ] })
+              }
+            ),
+            open && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+              /* @__PURE__ */ jsxRuntime.jsx(Box, { className: "fixed inset-0 z-20", onClick: () => setOpen(false) }),
+              /* @__PURE__ */ jsxRuntime.jsx(Box, { className: "absolute left-full top-0 ml-2 w-48 bg-card dark:bg-card rounded-lg shadow-lg border border-border dark:border-border py-1 z-30", children: item.children.map((child) => {
+                const childIsActive = child.href === activeHref;
+                return /* @__PURE__ */ jsxRuntime.jsxs(
+                  reactRouterDom.Link,
+                  {
+                    to: child.href,
+                    onClick: () => setOpen(false),
+                    className: cn(
+                      "flex items-center gap-2 px-3 py-2 text-sm transition-colors",
+                      childIsActive ? "bg-muted text-foreground font-medium" : "text-muted-foreground hover:bg-muted hover:text-foreground"
+                    ),
+                    children: [
+                      child.icon && (typeof child.icon === "string" ? /* @__PURE__ */ jsxRuntime.jsx(Icon, { name: child.icon, className: "h-4 w-4" }) : /* @__PURE__ */ jsxRuntime.jsx(child.icon, { className: "h-4 w-4" })),
+                      /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "small", className: "flex-1", as: "span", children: child.label }),
+                      child.badge && /* @__PURE__ */ jsxRuntime.jsx(Badge, { variant: childIsActive ? "primary" : "default", size: "sm", children: child.badge })
+                    ]
+                  },
+                  child.href
+                );
+              }) })
+            ] })
+          ] });
+        }
         return /* @__PURE__ */ jsxRuntime.jsx(
           reactRouterDom.Link,
           {
@@ -26947,6 +27294,78 @@ var init_DashboardLayout = __esm({
           }
         );
       }
+      if (hasChildren) {
+        return /* @__PURE__ */ jsxRuntime.jsxs(Box, { children: [
+          /* @__PURE__ */ jsxRuntime.jsxs(
+            Button,
+            {
+              variant: "ghost",
+              "aria-expanded": open,
+              className: cn(
+                "flex items-center gap-3 w-full px-3 py-2 rounded-lg text-sm font-medium transition-colors",
+                isActive ? "bg-primary text-primary-foreground shadow-sm" : "text-muted-foreground hover:bg-muted hover:text-foreground"
+              ),
+              onClick: () => setOpen(!open),
+              children: [
+                item.icon && (typeof item.icon === "string" ? /* @__PURE__ */ jsxRuntime.jsx(Icon, { name: item.icon, className: iconClassName }) : /* @__PURE__ */ jsxRuntime.jsx(item.icon, { className: iconClassName })),
+                /* @__PURE__ */ jsxRuntime.jsx(
+                  Typography,
+                  {
+                    variant: "small",
+                    color: isActive ? "inherit" : "primary",
+                    className: "flex-1 text-left",
+                    as: "span",
+                    children: item.label
+                  }
+                ),
+                item.badge && /* @__PURE__ */ jsxRuntime.jsx(Badge, { variant: isActive ? "primary" : "default", size: "sm", children: item.badge }),
+                /* @__PURE__ */ jsxRuntime.jsx(
+                  Icon,
+                  {
+                    name: "chevron-down",
+                    className: cn("h-4 w-4 shrink-0 transition-transform", open && "rotate-180")
+                  }
+                )
+              ]
+            }
+          ),
+          open && /* @__PURE__ */ jsxRuntime.jsx(
+            VStack,
+            {
+              gap: "none",
+              className: "mt-1 ml-4 pl-4 border-l border-border dark:border-border space-y-1",
+              children: item.children.map((child) => {
+                const childIsActive = child.href === activeHref;
+                return /* @__PURE__ */ jsxRuntime.jsxs(
+                  reactRouterDom.Link,
+                  {
+                    to: child.href,
+                    className: cn(
+                      "flex items-center gap-2 px-3 py-1.5 rounded-lg text-sm transition-colors",
+                      childIsActive ? "bg-primary text-primary-foreground shadow-sm" : "text-muted-foreground hover:bg-muted hover:text-foreground"
+                    ),
+                    children: [
+                      child.icon && (typeof child.icon === "string" ? /* @__PURE__ */ jsxRuntime.jsx(Icon, { name: child.icon, className: "h-4 w-4" }) : /* @__PURE__ */ jsxRuntime.jsx(child.icon, { className: "h-4 w-4" })),
+                      /* @__PURE__ */ jsxRuntime.jsx(
+                        Typography,
+                        {
+                          variant: "small",
+                          color: childIsActive ? "inherit" : "primary",
+                          className: "flex-1",
+                          as: "span",
+                          children: child.label
+                        }
+                      ),
+                      child.badge && /* @__PURE__ */ jsxRuntime.jsx(Badge, { variant: childIsActive ? "primary" : "default", size: "sm", children: child.badge })
+                    ]
+                  },
+                  child.href
+                );
+              })
+            }
+          )
+        ] });
+      }
       return /* @__PURE__ */ jsxRuntime.jsxs(
         reactRouterDom.Link,
         {
@@ -26975,9 +27394,63 @@ var init_DashboardLayout = __esm({
     NavLink.displayName = "NavLink";
     NavLinkTopnav = ({
       item,
-      currentPath
+      activeHref
     }) => {
-      const isActive = currentPath === item.href || currentPath.startsWith(item.href + "/");
+      const hasChildren = !!item.children?.length;
+      const childActive = hasChildren && item.children.some((child) => child.href === activeHref);
+      const isActive = item.href === activeHref || childActive;
+      const [open, setOpen] = React89.useState(false);
+      if (hasChildren) {
+        return /* @__PURE__ */ jsxRuntime.jsxs(Box, { className: "relative", children: [
+          /* @__PURE__ */ jsxRuntime.jsxs(
+            Button,
+            {
+              variant: "ghost",
+              "aria-expanded": open,
+              className: cn(
+                "flex items-center gap-1.5 px-3 py-1.5 rounded-md text-sm font-medium transition-colors whitespace-nowrap",
+                isActive ? "bg-primary text-primary-foreground shadow-sm" : "text-muted-foreground hover:bg-muted hover:text-foreground"
+              ),
+              onClick: () => setOpen(!open),
+              children: [
+                item.icon && (typeof item.icon === "string" ? /* @__PURE__ */ jsxRuntime.jsx(Icon, { name: item.icon, className: "h-4 w-4" }) : /* @__PURE__ */ jsxRuntime.jsx(item.icon, { className: "h-4 w-4" })),
+                /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "small", color: "inherit", className: "flex-1", as: "span", children: item.label }),
+                item.badge && /* @__PURE__ */ jsxRuntime.jsx(Badge, { variant: isActive ? "primary" : "default", size: "sm", children: item.badge }),
+                /* @__PURE__ */ jsxRuntime.jsx(
+                  Icon,
+                  {
+                    name: "chevron-down",
+                    className: cn("h-3.5 w-3.5 shrink-0 transition-transform", open && "rotate-180")
+                  }
+                )
+              ]
+            }
+          ),
+          open && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+            /* @__PURE__ */ jsxRuntime.jsx(Box, { className: "fixed inset-0 z-20", onClick: () => setOpen(false) }),
+            /* @__PURE__ */ jsxRuntime.jsx(Box, { className: "absolute left-0 top-full mt-1 w-48 bg-card dark:bg-card rounded-lg shadow-lg border border-border dark:border-border py-1 z-30", children: item.children.map((child) => {
+              const childIsActive = child.href === activeHref;
+              return /* @__PURE__ */ jsxRuntime.jsxs(
+                reactRouterDom.Link,
+                {
+                  to: child.href,
+                  onClick: () => setOpen(false),
+                  className: cn(
+                    "flex items-center gap-2 px-3 py-2 text-sm transition-colors",
+                    childIsActive ? "bg-muted text-foreground font-medium" : "text-muted-foreground hover:bg-muted hover:text-foreground"
+                  ),
+                  children: [
+                    child.icon && (typeof child.icon === "string" ? /* @__PURE__ */ jsxRuntime.jsx(Icon, { name: child.icon, className: "h-4 w-4" }) : /* @__PURE__ */ jsxRuntime.jsx(child.icon, { className: "h-4 w-4" })),
+                    /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "small", className: "flex-1", as: "span", children: child.label }),
+                    child.badge && /* @__PURE__ */ jsxRuntime.jsx(Badge, { variant: childIsActive ? "primary" : "default", size: "sm", children: child.badge })
+                  ]
+                },
+                child.href
+              );
+            }) })
+          ] })
+        ] });
+      }
       return /* @__PURE__ */ jsxRuntime.jsxs(
         reactRouterDom.Link,
         {
@@ -26997,9 +27470,9 @@ var init_DashboardLayout = __esm({
     NavLinkTopnav.displayName = "NavLinkTopnav";
     NavLinkBottom = ({
       item,
-      currentPath
+      activeHref
     }) => {
-      const isActive = currentPath === item.href || currentPath.startsWith(item.href + "/");
+      const isActive = item.href === activeHref;
       const iconClassName = cn(
         "h-5 w-5",
         isActive ? "text-primary" : "text-muted-foreground"
@@ -27938,7 +28411,9 @@ function DataGrid({
   const cardClickAction = actionDefs.find((a) => a.variant !== "danger");
   const handleCardClick = cardClickAction ? (itemData) => () => fireAction(cardClickAction, itemData) : void 0;
   const stopCardClick = handleCardClick ? (e) => e.stopPropagation() : void 0;
-  const hasRenderProp = typeof children === "function";
+  const renderItemFn = typeof schemaRenderItem === "function" ? schemaRenderItem : void 0;
+  const itemRenderer = typeof children === "function" ? children : renderItemFn;
+  const hasRenderProp = typeof itemRenderer === "function";
   React89.useEffect(() => {
     if (data.length > 0 && !hasRenderProp && fieldDefs.length === 0) {
       const schemaArr = Array.isArray(schemaRenderItem) ? schemaRenderItem : null;
@@ -28012,7 +28487,7 @@ function DataGrid({
                     onClick: handleCardClick?.(itemData),
                     className: cn("relative group/rowactions", handleCardClick && "cursor-pointer", isSelected && "ring-2 ring-primary rounded-lg"),
                     children: [
-                      children(itemData, index),
+                      itemRenderer(itemData, index),
                       actionDefs.length > 0 && /* @__PURE__ */ jsxRuntime.jsx(Box, { onClick: stopCardClick, className: "absolute top-2 right-2 z-10 opacity-0 group-hover/rowactions:opacity-100 focus-within:opacity-100 [@media(pointer:coarse)]:opacity-100 transition-opacity duration-fast", children: /* @__PURE__ */ jsxRuntime.jsxs(HStack, { gap: "xs", className: "rounded-md border border-border bg-card/95 backdrop-blur-sm shadow-sm p-0.5", children: [
                         inlineCardActions.map((action, idx) => /* @__PURE__ */ jsxRuntime.jsxs(
                           Button,
@@ -28345,7 +28820,9 @@ function DataList({
   );
   const data = pageSize > 0 ? allData.slice(0, visibleCount) : allData;
   const hasMoreLocal = pageSize > 0 && visibleCount < allData.length;
-  const hasRenderProp = typeof children === "function";
+  const renderItemFn = typeof schemaRenderItem === "function" ? schemaRenderItem : void 0;
+  const itemRenderer = typeof children === "function" ? children : renderItemFn;
+  const hasRenderProp = typeof itemRenderer === "function";
   React89__namespace.default.useEffect(() => {
     const renderItemTypeOf = typeof schemaRenderItem;
     const childrenTypeOf = typeof children;
@@ -28563,7 +29040,7 @@ function DataList({
       const actions = renderItemActions(itemData);
       return wrapDnd(
         /* @__PURE__ */ jsxRuntime.jsxs(Box, { "data-entity-row": true, "data-entity-id": id2, onClick: rowClickEvent ? handleRowClick(itemData) : void 0, className: cn("relative group/rowactions", rowClickEvent && "cursor-pointer"), children: [
-          children(itemData, index),
+          itemRenderer(itemData, index),
           actions && /* @__PURE__ */ jsxRuntime.jsxs(Box, { className: "absolute top-2 right-2 z-10 opacity-0 group-hover/rowactions:opacity-100 focus-within:opacity-100 [@media(pointer:coarse)]:opacity-100 transition-opacity duration-fast", children: [
             /* @__PURE__ */ jsxRuntime.jsx(Box, { className: "rounded-md border border-border bg-card/95 backdrop-blur-sm shadow-sm p-0.5 [@media(pointer:coarse)]:hidden", children: actions }),
             /* @__PURE__ */ jsxRuntime.jsx(Box, { className: "hidden [@media(pointer:coarse)]:block rounded-md border border-border bg-card/95 backdrop-blur-sm shadow-sm p-0.5", children: /* @__PURE__ */ jsxRuntime.jsx(
@@ -35107,7 +35584,7 @@ function TableView({
   columns,
   fields,
   itemActions,
-  maxInlineActions: _maxInlineActions,
+  maxInlineActions,
   itemClickEvent = "",
   selectable = false,
   selectEvent,
@@ -35140,6 +35617,12 @@ function TableView({
   const [localSelected, setLocalSelected] = React89__namespace.default.useState(/* @__PURE__ */ new Set());
   const colDefs = (Array.isArray(columns) ? columns : void 0) ?? (Array.isArray(fields) ? fields : void 0) ?? [];
   const actionDefs = Array.isArray(itemActions) ? itemActions : [];
+  const inlineActions = maxInlineActions != null ? actionDefs.slice(0, maxInlineActions) : [];
+  const overflowActions = maxInlineActions != null ? actionDefs.slice(maxInlineActions) : actionDefs;
+  const fireAction = (action, row) => eventBus.emit(`UI:${action.event}`, {
+    id: row.id,
+    row
+  });
   const allDataRaw = Array.isArray(entity) ? entity : entity ? [entity] : [];
   const dnd = useDataDnd({
     items: allDataRaw,
@@ -35315,7 +35798,7 @@ function TableView({
             }
             return /* @__PURE__ */ jsxRuntime.jsx(Box, { role: "cell", className: cellBase, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "truncate text-foreground", children: formatCell(raw, col.format) }) }, col.key);
           }),
-          hasActions && /* @__PURE__ */ jsxRuntime.jsx(
+          hasActions && /* @__PURE__ */ jsxRuntime.jsxs(
             HStack,
             {
               gap: "xs",
@@ -35329,23 +35812,38 @@ function TableView({
                 "border-l border-[var(--color-border)]",
                 lk.striped && index % 2 === 1 ? "bg-[var(--color-surface-subtle)]" : "bg-[var(--color-card)] group-hover:bg-[var(--color-surface-subtle)]"
               ),
-              children: /* @__PURE__ */ jsxRuntime.jsx(
-                Menu,
-                {
-                  position: "bottom-end",
-                  trigger: /* @__PURE__ */ jsxRuntime.jsx(Button, { variant: "ghost", size: "sm", "aria-label": t("common.actions"), "data-testid": "action-overflow", "data-row-id": String(row.id), children: /* @__PURE__ */ jsxRuntime.jsx(Icon, { name: "more-horizontal", size: "xs" }) }),
-                  items: actionDefs.map((action) => ({
-                    label: action.label,
-                    icon: action.icon,
-                    event: action.event,
-                    variant: action.variant === "danger" ? "danger" : "default",
-                    onClick: () => eventBus.emit(`UI:${action.event}`, {
-                      id: row.id,
-                      row
-                    })
-                  }))
-                }
-              )
+              children: [
+                inlineActions.map((action) => /* @__PURE__ */ jsxRuntime.jsxs(
+                  Button,
+                  {
+                    variant: action.variant ?? "ghost",
+                    size: "sm",
+                    onClick: () => fireAction(action, row),
+                    "data-testid": `action-${action.event}`,
+                    "data-row-id": String(row.id),
+                    className: cn(action.variant === "danger" && "text-error hover:bg-error/10"),
+                    children: [
+                      action.icon && renderIconInput3(action.icon, { size: "xs", className: "mr-1" }),
+                      action.label
+                    ]
+                  },
+                  action.event
+                )),
+                overflowActions.length > 0 && /* @__PURE__ */ jsxRuntime.jsx(
+                  Menu,
+                  {
+                    position: "bottom-end",
+                    trigger: /* @__PURE__ */ jsxRuntime.jsx(Button, { variant: "ghost", size: "sm", "aria-label": t("common.actions"), "data-testid": "action-overflow", "data-row-id": String(row.id), children: /* @__PURE__ */ jsxRuntime.jsx(Icon, { name: "more-horizontal", size: "xs" }) }),
+                    items: overflowActions.map((action) => ({
+                      label: action.label,
+                      icon: action.icon,
+                      event: action.event,
+                      variant: action.variant === "danger" ? "danger" : "default",
+                      onClick: () => fireAction(action, row)
+                    }))
+                  }
+                )
+              ]
             }
           )
         ]
@@ -51177,6 +51675,7 @@ var init_component_registry_generated = __esm({
     init_DrawMesh();
     init_DrawShape();
     init_DrawShapeLayer();
+    init_DrawSkinnedMesh();
     init_DrawSprite();
     init_DrawSpriteLayer();
     init_DrawText();
@@ -51455,6 +51954,7 @@ var init_component_registry_generated = __esm({
       "DrawMesh": DrawMesh,
       "DrawShape": DrawShape,
       "DrawShapeLayer": DrawShapeLayer,
+      "DrawSkinnedMesh": DrawSkinnedMesh,
       "DrawSprite": DrawSprite,
       "DrawSpriteLayer": DrawSpriteLayer,
       "DrawText": DrawText,
@@ -51783,7 +52283,7 @@ function renderContainedPortal(t, slot, content, onDismiss) {
   const slotId = `slot-${slot}`;
   switch (slot) {
     case "modal":
-      if (SELF_OVERLAY_PATTERNS.has(content.pattern)) {
+      if (patterns.SELF_OVERLAY_PATTERN_TYPES.has(content.pattern)) {
         return /* @__PURE__ */ jsxRuntime.jsx(Box, { id: slotId, className: "contents", children: slotContent });
       }
       return /* @__PURE__ */ jsxRuntime.jsx(
@@ -52126,7 +52626,7 @@ function CompiledPortal({ slot, className, pattern, sourceTrait, children }) {
           children
         }
       );
-      wrapper = pattern !== void 0 && SELF_OVERLAY_PATTERNS.has(pattern) ? innerContent : /* @__PURE__ */ jsxRuntime.jsx(Modal, { isOpen: true, onClose: handleDismiss, showCloseButton: true, size: "lg", children: innerContent });
+      wrapper = pattern !== void 0 && patterns.SELF_OVERLAY_PATTERN_TYPES.has(pattern) ? innerContent : /* @__PURE__ */ jsxRuntime.jsx(Modal, { isOpen: true, onClose: handleDismiss, showCloseButton: true, size: "lg", children: innerContent });
       break;
     }
     case "drawer":
@@ -52186,7 +52686,7 @@ function SlotPortal({
   let wrapper;
   switch (slot) {
     case "modal":
-      wrapper = SELF_OVERLAY_PATTERNS.has(content.pattern) ? /* @__PURE__ */ jsxRuntime.jsx(Box, { id: slotId, children: slotContent }) : /* @__PURE__ */ jsxRuntime.jsx(
+      wrapper = patterns.SELF_OVERLAY_PATTERN_TYPES.has(content.pattern) ? /* @__PURE__ */ jsxRuntime.jsx(Box, { id: slotId, children: slotContent }) : /* @__PURE__ */ jsxRuntime.jsx(
         Modal,
         {
           isOpen: true,
@@ -52693,7 +53193,7 @@ function UISlotRenderer({
   }
   return wrapped;
 }
-var scopeWrapLog, TRAIT_BINDING_RE, SuspenseConfigContext, SlotContainedContext, SLOT_SKELETON_MAP, SELF_OVERLAY_PATTERNS, CONTENT_NODE_SLOTS, PATTERNS_WITH_CHILDREN, traitRefPresenceCache;
+var scopeWrapLog, TRAIT_BINDING_RE, SuspenseConfigContext, SlotContainedContext, SLOT_SKELETON_MAP, CONTENT_NODE_SLOTS, PATTERNS_WITH_CHILDREN, traitRefPresenceCache;
 var init_UISlotRenderer = __esm({
   "components/core/organisms/UISlotRenderer.tsx"() {
     "use client";
@@ -52724,7 +53224,6 @@ var init_UISlotRenderer = __esm({
       modal: "form",
       drawer: "form"
     };
-    SELF_OVERLAY_PATTERNS = /* @__PURE__ */ new Set(["modal", "confirm-dialog"]);
     CONTENT_NODE_SLOTS = /* @__PURE__ */ new Set([
       "logo",
       "master",
@@ -54145,9 +54644,6 @@ function ServerBridgeProvider({
               });
             } else if (effectType === "navigate-back") {
               effects.push({ type: "navigate-back", traitName });
-            } else if (effectType === "notify") {
-              const message = effect[1];
-              effects.push({ type: "notify", message: typeof message === "string" ? message : void 0, traitName });
             }
           }
           if (result.emittedEvents) {