@elizaos/app-core 2.0.0-alpha.74 → 2.0.0-alpha.76

package/src/components/apps/AppsCatalogGrid.tsx

@@ -1,137 +0,0 @@
-import { Button } from "@elizaos/ui";
-import type { RegistryAppInfo } from "../../api";
-import { useApp } from "../../state";
-import { getAppEmoji, getAppShortName } from "./helpers";
-
-interface AppsCatalogGridProps {
-  activeAppNames: Set<string>;
-  activeGameDisplayName: string;
-  error: string | null;
-  hasCurrentGame: boolean;
-  loading: boolean;
-  searchQuery: string;
-  selectedAppName: string | null;
-  showActiveOnly: boolean;
-  visibleApps: RegistryAppInfo[];
-  onOpenCurrentGame: () => void;
-  onRefresh: () => void;
-  onSearchQueryChange: (value: string) => void;
-  onSelectApp: (appName: string) => void;
-  onToggleActiveOnly: () => void;
-}
-
-export function AppsCatalogGrid({
-  activeAppNames,
-  activeGameDisplayName,
-  error,
-  hasCurrentGame,
-  loading,
-  searchQuery,
-  selectedAppName,
-  showActiveOnly,
-  visibleApps,
-  onOpenCurrentGame,
-  onRefresh,
-  onSearchQueryChange,
-  onSelectApp,
-  onToggleActiveOnly,
-}: AppsCatalogGridProps) {
-  const { t } = useApp();
-
-  return (
-    <>
-      <div className="mb-4">
-        <input
-          type="text"
-          placeholder="Search..."
-          value={searchQuery}
-          onChange={(event) => onSearchQueryChange(event.target.value)}
-          className="w-full px-3 py-2 text-[12px] rounded-xl border border-border bg-surface text-txt placeholder:text-muted/50 focus:border-accent focus:outline-none"
-        />
-      </div>
-
-      <div className="mb-4 flex gap-2">
-        <Button
-          variant="outline"
-          size="sm"
-          className="rounded-xl shadow-sm"
-          onClick={onRefresh}
-        >
-          {t("appsview.Refresh")}
-        </Button>
-        <Button
-          variant={showActiveOnly ? "default" : "outline"}
-          size="sm"
-          className="rounded-xl shadow-sm"
-          onClick={onToggleActiveOnly}
-        >
-          {t("appsview.ActiveOnly")}
-        </Button>
-      </div>
-
-      {hasCurrentGame ? (
-        <button
-          type="button"
-          className="w-full mb-4 px-3 py-2.5 rounded-xl border border-ok/30 bg-ok/5 flex items-center gap-2 cursor-pointer hover:bg-ok/10 transition-colors"
-          onClick={onOpenCurrentGame}
-        >
-          <span className="w-2 h-2 rounded-full bg-ok animate-pulse" />
-          <span className="text-[11px] font-semibold text-txt flex-1 text-left truncate">
-            {activeGameDisplayName || "Game running"}
-          </span>
-          <span className="text-[10px] text-muted">→</span>
-        </button>
-      ) : null}
-
-      {error ? (
-        <div className="px-3 py-2 border border-danger/30 rounded-xl text-danger text-[11px] mb-4">
-          {error}
-        </div>
-      ) : null}
-
-      {loading ? (
-        <div className="text-center py-16 text-muted text-[12px]">
-          Loading...
-        </div>
-      ) : visibleApps.length === 0 ? (
-        <div className="text-center py-16 text-muted text-[12px]">
-          {searchQuery ? "No apps found" : "No apps available"}
-        </div>
-      ) : (
-        <div
-          style={{
-            display: "grid",
-            gridTemplateColumns: "repeat(3, 1fr)",
-            gap: "14px 4px",
-            justifyItems: "center",
-          }}
-        >
-          {visibleApps.map((app) => {
-            const isActive = activeAppNames.has(app.name);
-            const isSelected = selectedAppName === app.name;
-            const displayName = app.displayName ?? getAppShortName(app);
-
-            return (
-              <button
-                key={app.name}
-                type="button"
-                className={`phone-app-tile group ${isSelected ? "is-selected" : ""}`}
-                title={`Open ${displayName}`}
-                aria-label={`Open ${displayName}`}
-                onClick={() => onSelectApp(app.name)}
-              >
-                <div className="phone-app-icon">
-                  {isActive ? (
-                    <span className="absolute -top-0.5 -right-0.5 w-2.5 h-2.5 rounded-full bg-ok border-2 border-card z-10" />
-                  ) : null}
-                  <span className="text-xl">{getAppEmoji(app)}</span>
-                </div>
-                <span className="phone-app-label">{getAppShortName(app)}</span>
-              </button>
-            );
-          })}
-        </div>
-      )}
-    </>
-  );
-}

package/src/components/apps/extensions/registry.ts

@@ -1,13 +0,0 @@
-import type { RegistryAppInfo } from "../../../api";
-import type { AppDetailExtensionComponent } from "./types";
-
-const DETAIL_EXTENSION_COMPONENTS: Record<string, AppDetailExtensionComponent> =
-  {};
-
-export function getAppDetailExtension(
-  app: RegistryAppInfo,
-): AppDetailExtensionComponent | null {
-  const detailPanelId = app.uiExtension?.detailPanelId;
-  if (!detailPanelId) return null;
-  return DETAIL_EXTENSION_COMPONENTS[detailPanelId] ?? null;
-}

package/src/components/apps/extensions/types.ts

@@ -1,9 +0,0 @@
-import type { ComponentType } from "react";
-import type { RegistryAppInfo } from "../../../api";
-
-export interface AppDetailExtensionProps {
-  app: RegistryAppInfo;
-}
-
-export type AppDetailExtensionComponent =
-  ComponentType<AppDetailExtensionProps>;

package/src/components/apps/helpers.ts

@@ -1,43 +0,0 @@
-import type { RegistryAppInfo } from "../../api";
-
-export const DEFAULT_VIEWER_SANDBOX =
-  "allow-scripts allow-same-origin allow-popups";
-
-const PROD_ALLOWED_APPS = new Set(["@iqlabs-official/plugin-clawbal"]);
-
-export const CATEGORY_LABELS: Record<string, string> = {
-  game: "Game",
-  social: "Social",
-  platform: "Platform",
-  world: "World",
-};
-
-export function shouldShowAppInAppsView(
-  app: Pick<RegistryAppInfo, "name">,
-  isProd = import.meta.env.PROD,
-): boolean {
-  if (!isProd) return true;
-  return PROD_ALLOWED_APPS.has(app.name);
-}
-
-export function getAppShortName(app: RegistryAppInfo): string {
-  const display = app.displayName ?? app.name;
-  const clean = display.replace(/^@[^/]+\/app-/, "");
-  return clean.charAt(0).toUpperCase() + clean.slice(1);
-}
-
-export function getAppEmoji(app: RegistryAppInfo): string {
-  const name = (app.name ?? "").toLowerCase();
-  if (name.includes("2004") || name.includes("runescape")) return "⚔️";
-  if (name.includes("town")) return "🏘️";
-  if (name.includes("babylon")) return "🏛️";
-  if (name.includes("clawbal")) return "🎯";
-  if (name.includes("minecraft")) return "⛏️";
-  if (name.includes("roblox")) return "🧱";
-  if (name.includes("dungeons")) return "🗡️";
-  if (name.includes("hyperfy")) return "🌀";
-  if (app.category === "game") return "🎮";
-  if (app.category === "social") return "💬";
-  if (app.category === "world") return "🌍";
-  return "📦";
-}

package/src/components/avatar/VrmAnimationLoader.test.ts

@@ -1,164 +0,0 @@
-import type { VRM } from "@pixiv/three-vrm";
-import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
-
-const hoisted = vi.hoisted(() => ({
-  fetchMock: vi.fn(),
-  gltfParseAsyncMock: vi.fn(),
-  fbxParseMock: vi.fn(),
-  retargetGltfMock: vi.fn(),
-  retargetFbxMock: vi.fn(),
-}));
-
-vi.mock("three/examples/jsm/loaders/GLTFLoader.js", () => ({
-  GLTFLoader: class MockGLTFLoader {
-    parseAsync = hoisted.gltfParseAsyncMock;
-  },
-}));
-
-vi.mock("three/examples/jsm/loaders/FBXLoader.js", () => ({
-  FBXLoader: class MockFBXLoader {
-    parse = hoisted.fbxParseMock;
-  },
-}));
-
-vi.mock("./retargetMixamoGltfToVrm", () => ({
-  retargetMixamoGltfToVrm: hoisted.retargetGltfMock,
-}));
-
-vi.mock("./retargetMixamoFbxToVrm", () => ({
-  retargetMixamoFbxToVrm: hoisted.retargetFbxMock,
-}));
-
-import { loadEmoteClip, loadIdleClip } from "./VrmAnimationLoader";
-
-describe("VrmAnimationLoader", () => {
-  const originalFetch = globalThis.fetch;
-  const originalDecompressionStream = globalThis.DecompressionStream;
-
-  beforeEach(() => {
-    vi.restoreAllMocks();
-    hoisted.fetchMock.mockReset();
-    hoisted.gltfParseAsyncMock.mockReset();
-    hoisted.fbxParseMock.mockReset();
-    hoisted.retargetGltfMock.mockReset();
-    hoisted.retargetFbxMock.mockReset();
-    Object.assign(globalThis, {
-      fetch: hoisted.fetchMock,
-    });
-  });
-
-  afterEach(() => {
-    Object.assign(globalThis, {
-      fetch: originalFetch,
-      DecompressionStream: originalDecompressionStream,
-    });
-  });
-
-  it("loads a gzipped idle GLB animation", async () => {
-    const compressed = new Uint8Array([0x1f, 0x8b, 0x08, 0x00]).buffer;
-    const decompressed = new ArrayBuffer(32);
-    hoisted.fetchMock.mockResolvedValueOnce({
-      ok: true,
-      arrayBuffer: vi.fn().mockResolvedValue(compressed),
-    });
-
-    class MockDecompressionStream {
-      readable = new ReadableStream<Uint8Array>();
-      writable = new WritableStream<Uint8Array>();
-    }
-
-    Object.assign(globalThis, {
-      DecompressionStream:
-        MockDecompressionStream as typeof DecompressionStream,
-    });
-
-    const pipeThroughSpy = vi.spyOn(Blob.prototype, "stream").mockReturnValue({
-      pipeThrough: vi.fn(() => new ReadableStream<Uint8Array>()),
-    } as ReturnType<Blob["stream"]>);
-    const responseArrayBufferSpy = vi
-      .spyOn(Response.prototype, "arrayBuffer")
-      .mockResolvedValueOnce(decompressed);
-
-    const vrm = {
-      scene: { updateMatrixWorld: vi.fn() },
-    } as VRM;
-    const gltf = {
-      scene: { updateMatrixWorld: vi.fn() },
-      animations: [],
-    };
-    const clip = { name: "idle" };
-    hoisted.gltfParseAsyncMock.mockResolvedValueOnce(gltf);
-    hoisted.retargetGltfMock.mockReturnValueOnce(clip);
-
-    const result = await loadIdleClip(vrm, "/animations/idle.glb.gz", {
-      isAborted: () => false,
-      isCurrentVrm: () => true,
-    });
-
-    expect(result).toBe(clip);
-    expect(hoisted.fetchMock).toHaveBeenCalledWith("/animations/idle.glb.gz");
-    expect(hoisted.gltfParseAsyncMock).toHaveBeenCalledWith(
-      decompressed,
-      "/animations/",
-    );
-    expect(hoisted.retargetGltfMock).toHaveBeenCalledWith(gltf, vrm);
-
-    responseArrayBufferSpy.mockRestore();
-    pipeThroughSpy.mockRestore();
-  });
-
-  it("loads a gzipped Mixamo FBX emote", async () => {
-    const compressed = new Uint8Array([0x1f, 0x8b, 0x08, 0x00]).buffer;
-    const decompressed = new ArrayBuffer(64);
-    hoisted.fetchMock.mockResolvedValueOnce({
-      ok: true,
-      arrayBuffer: vi.fn().mockResolvedValue(compressed),
-    });
-
-    class MockDecompressionStream {
-      readable = new ReadableStream<Uint8Array>();
-      writable = new WritableStream<Uint8Array>();
-    }
-
-    Object.assign(globalThis, {
-      DecompressionStream:
-        MockDecompressionStream as typeof DecompressionStream,
-    });
-
-    const pipeThroughSpy = vi.spyOn(Blob.prototype, "stream").mockReturnValue({
-      pipeThrough: vi.fn(() => new ReadableStream<Uint8Array>()),
-    } as ReturnType<Blob["stream"]>);
-    const responseArrayBufferSpy = vi
-      .spyOn(Response.prototype, "arrayBuffer")
-      .mockResolvedValueOnce(decompressed);
-
-    const vrm = {
-      scene: { updateMatrixWorld: vi.fn() },
-    } as VRM;
-    const sourceClip = { name: "happy" };
-    const fbx = {
-      animations: [sourceClip],
-    };
-    const clip = { name: "happy" };
-    hoisted.fbxParseMock.mockReturnValueOnce(fbx);
-    hoisted.retargetFbxMock.mockReturnValueOnce(clip);
-
-    const result = await loadEmoteClip("/animations/mixamo/Happy.fbx.gz", vrm, {
-      isAborted: () => false,
-      isCurrentVrm: () => true,
-    });
-
-    expect(result).toBe(clip);
-    expect(hoisted.fetchMock).toHaveBeenCalledWith(
-      "/animations/mixamo/Happy.fbx.gz",
-    );
-    expect(hoisted.fbxParseMock).toHaveBeenCalledWith(
-      decompressed,
-      "/animations/mixamo/",
-    );
-    expect(hoisted.retargetFbxMock).toHaveBeenCalledWith(fbx, sourceClip, vrm);
-
-    responseArrayBufferSpy.mockRestore();
-    pipeThroughSpy.mockRestore();
-  });
-});

package/src/components/avatar/VrmAnimationLoader.ts

@@ -1,151 +0,0 @@
-import type { VRM } from "@pixiv/three-vrm";
-import type * as THREE from "three";
-import { FBXLoader } from "three/examples/jsm/loaders/FBXLoader.js";
-import { GLTFLoader } from "three/examples/jsm/loaders/GLTFLoader.js";
-
-/**
- * Context needed by the animation loader to check whether the owning engine
- * is still alive / relevant for the load request.
- */
-export type AnimationLoaderContext = {
-  /** Returns `true` if the loading sequence was aborted (engine disposed). */
-  isAborted: () => boolean;
-  /** Returns `true` if `vrm` is still the active model in the engine. */
-  isCurrentVrm: (vrm: VRM) => boolean;
-};
-
-function isGzipBuffer(buffer: ArrayBuffer): boolean {
-  if (buffer.byteLength < 2) return false;
-  const bytes = new Uint8Array(buffer, 0, 2);
-  return bytes[0] === 0x1f && bytes[1] === 0x8b;
-}
-
-async function decompressGzipBuffer(buffer: ArrayBuffer): Promise<ArrayBuffer> {
-  if (typeof DecompressionStream !== "function") {
-    throw new Error(
-      "This runtime does not support gzip-compressed animation assets.",
-    );
-  }
-
-  const stream = new Blob([buffer])
-    .stream()
-    .pipeThrough(new DecompressionStream("gzip"));
-  return await new Response(stream).arrayBuffer();
-}
-
-async function fetchAnimationBuffer(path: string): Promise<ArrayBuffer> {
-  const response = await fetch(path);
-  if (!response.ok) {
-    throw new Error(`Failed to fetch animation asset: ${response.status}`);
-  }
-
-  const buffer = await response.arrayBuffer();
-  return isGzipBuffer(buffer) ? await decompressGzipBuffer(buffer) : buffer;
-}
-
-function getAssetResourcePath(path: string): string {
-  const withoutQuery = path.split(/[?#]/, 1)[0] ?? path;
-  const lastSlash = withoutQuery.lastIndexOf("/");
-  return lastSlash >= 0 ? withoutQuery.slice(0, lastSlash + 1) : "./";
-}
-
-function isFbxAsset(path: string): boolean {
-  const normalized = path.toLowerCase();
-  return normalized.endsWith(".fbx") || normalized.endsWith(".fbx.gz");
-}
-
-/**
- * Load and return an idle {@link THREE.AnimationClip} for the given VRM.
- *
- * Loads the GLB idle animation and retargets it to VRM bones.
- * Returns `null` when the load was aborted (engine disposed / VRM replaced).
- * Throws when the idle clip cannot be loaded.
- */
-export async function loadIdleClip(
-  vrm: VRM,
-  idleGlbUrl: string,
-  ctx: AnimationLoaderContext,
-): Promise<THREE.AnimationClip | null> {
-  const { retargetMixamoGltfToVrm } = await import("./retargetMixamoGltfToVrm");
-  if (ctx.isAborted() || !ctx.isCurrentVrm(vrm)) return null;
-
-  const gltfLoader = new GLTFLoader();
-  const gltf = await gltfLoader.parseAsync(
-    await fetchAnimationBuffer(idleGlbUrl),
-    getAssetResourcePath(idleGlbUrl),
-  );
-  if (ctx.isAborted() || !ctx.isCurrentVrm(vrm)) return null;
-
-  gltf.scene.updateMatrixWorld(true);
-  vrm.scene.updateMatrixWorld(true);
-  const clip = retargetMixamoGltfToVrm(
-    { scene: gltf.scene, animations: gltf.animations },
-    vrm,
-  );
-
-  if (!clip) {
-    throw new Error("No usable idle animation (idle.glb)");
-  }
-
-  if (ctx.isAborted() || !ctx.isCurrentVrm(vrm)) return null;
-  return clip;
-}
-
-/**
- * Load a single emote animation clip (GLB/FBX) and retarget it to
- * the supplied VRM. Returns `null` when the load was aborted or the file
- * format could not be processed.
- *
- * Supports both `.glb` / `.gltf` files (retargeted via retargetMixamoGltfToVrm)
- * and Mixamo `.fbx` files (retargeted via retargetMixamoFbxToVrm).
- */
-export async function loadEmoteClip(
-  path: string,
-  vrm: VRM,
-  ctx: AnimationLoaderContext,
-): Promise<THREE.AnimationClip | null> {
-  try {
-    if (!ctx.isCurrentVrm(vrm)) return null;
-
-    const isFbx = isFbxAsset(path);
-
-    if (isFbx) {
-      const { retargetMixamoFbxToVrm } = await import(
-        "./retargetMixamoFbxToVrm"
-      );
-      const fbxLoader = new FBXLoader();
-      const fbx = fbxLoader.parse(
-        await fetchAnimationBuffer(path),
-        getAssetResourcePath(path),
-      );
-      if (!ctx.isCurrentVrm(vrm)) return null;
-
-      const sourceClip = fbx.animations[0];
-      if (!sourceClip) {
-        console.warn(`[VrmEngine] FBX has no animations: ${path}`);
-        return null;
-      }
-      return retargetMixamoFbxToVrm(fbx, sourceClip, vrm);
-    }
-
-    const { retargetMixamoGltfToVrm } = await import(
-      "./retargetMixamoGltfToVrm"
-    );
-    const loader = new GLTFLoader();
-    const gltf = await loader.parseAsync(
-      await fetchAnimationBuffer(path),
-      getAssetResourcePath(path),
-    );
-    if (!ctx.isCurrentVrm(vrm)) return null;
-
-    gltf.scene.updateMatrixWorld(true);
-    vrm.scene.updateMatrixWorld(true);
-    return retargetMixamoGltfToVrm(
-      { scene: gltf.scene, animations: gltf.animations },
-      vrm,
-    );
-  } catch (err) {
-    console.error(`[VrmEngine] Failed to load emote: ${path}`, err);
-    return null;
-  }
-}

package/src/components/avatar/VrmBlinkController.ts

@@ -1,118 +0,0 @@
-/** Blink animation phase */
-type BlinkPhase = "idle" | "closing" | "closed" | "opening";
-
-/**
- * Self-contained blink state machine for VRM eye-blink animation.
- *
- * State flow: idle -> closing -> closed -> opening -> idle
- * Random interval between blinks with occasional double-blinks.
- */
-export class VrmBlinkController {
-  private blinkPhase: BlinkPhase = "idle";
-  private blinkTimer = 0;
-  private blinkPhaseTimer = 0;
-  private _blinkValue = 0;
-  private nextBlinkDelay = 2 + Math.random() * 3;
-
-  /** Duration (seconds) for eyelids to close */
-  private static readonly BLINK_CLOSE_DURATION = 0.06;
-  /** Duration (seconds) eyelids stay fully closed */
-  private static readonly BLINK_HOLD_DURATION = 0.04;
-  /** Duration (seconds) for eyelids to re-open */
-  private static readonly BLINK_OPEN_DURATION = 0.12;
-  /** Minimum seconds between blinks */
-  private static readonly BLINK_MIN_INTERVAL = 1.8;
-  /** Maximum seconds between blinks */
-  private static readonly BLINK_MAX_INTERVAL = 5.5;
-  /** Probability of a quick double-blink */
-  private static readonly DOUBLE_BLINK_CHANCE = 0.15;
-
-  /** Current blink expression weight (0 = open, 1 = closed). */
-  get blinkValue(): number {
-    return this._blinkValue;
-  }
-
-  /**
-   * Advance the blink state machine by `delta` seconds.
-   * Returns the current blink expression weight (0..1).
-   */
-  update(delta: number): number {
-    switch (this.blinkPhase) {
-      case "idle":
-        this.blinkTimer += delta;
-        if (this.blinkTimer >= this.nextBlinkDelay) {
-          this.blinkPhase = "closing";
-          this.blinkPhaseTimer = 0;
-        }
-        break;
-
-      case "closing": {
-        this.blinkPhaseTimer += delta;
-        const t = Math.min(
-          1,
-          this.blinkPhaseTimer / VrmBlinkController.BLINK_CLOSE_DURATION,
-        );
-        // Ease-in (accelerate) — eyelids speed up as they close
-        this._blinkValue = t * t;
-        if (t >= 1) {
-          this.blinkPhase = "closed";
-          this.blinkPhaseTimer = 0;
-          this._blinkValue = 1;
-        }
-        break;
-      }
-
-      case "closed":
-        this.blinkPhaseTimer += delta;
-        if (this.blinkPhaseTimer >= VrmBlinkController.BLINK_HOLD_DURATION) {
-          this.blinkPhase = "opening";
-          this.blinkPhaseTimer = 0;
-        }
-        break;
-
-      case "opening": {
-        this.blinkPhaseTimer += delta;
-        const t = Math.min(
-          1,
-          this.blinkPhaseTimer / VrmBlinkController.BLINK_OPEN_DURATION,
-        );
-        // Ease-out (decelerate) — eyelids slow down as they finish opening
-        const eased = 1 - (1 - t) * (1 - t);
-        this._blinkValue = 1 - eased;
-        if (t >= 1) {
-          this.blinkPhase = "idle";
-          this.blinkPhaseTimer = 0;
-          this._blinkValue = 0;
-          this.blinkTimer = 0;
-          this.scheduleNextBlink();
-        }
-        break;
-      }
-    }
-
-    return this._blinkValue;
-  }
-
-  /** Reset blink state (called when a new VRM is loaded). */
-  reset(): void {
-    this.blinkPhase = "idle";
-    this.blinkTimer = 0;
-    this.blinkPhaseTimer = 0;
-    this._blinkValue = 0;
-    this.nextBlinkDelay = 1.5 + Math.random() * 2;
-  }
-
-  /** Pick the delay (seconds) until the next blink. */
-  private scheduleNextBlink(): void {
-    const range =
-      VrmBlinkController.BLINK_MAX_INTERVAL -
-      VrmBlinkController.BLINK_MIN_INTERVAL;
-    this.nextBlinkDelay =
-      VrmBlinkController.BLINK_MIN_INTERVAL + Math.random() * range;
-
-    // Occasional quick double-blink
-    if (Math.random() < VrmBlinkController.DOUBLE_BLINK_CHANCE) {
-      this.nextBlinkDelay = 0.12 + Math.random() * 0.08;
-    }
-  }
-}