talking-head-studio 0.4.10 → 0.4.12

package/dist/wgpu/R3FWebGpuCanvas.js

@@ -0,0 +1,176 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.R3FWebGpuCanvas = R3FWebGpuCanvas;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const react_native_1 = require("react-native");
+const THREE = __importStar(require("three"));
+const fiber_1 = require("@react-three/fiber");
+const react_native_wgpu_1 = require("react-native-wgpu");
+function formatErrorMessage(error) {
+    if (error instanceof Error)
+        return error.message;
+    return String(error);
+}
+class ReactNativeCanvas {
+    constructor(canvas) {
+        this.canvas = canvas;
+    }
+    get width() { return this.canvas.width; }
+    set width(width) { this.canvas.width = width; }
+    get height() { return this.canvas.height; }
+    set height(height) { this.canvas.height = height; }
+    get clientWidth() { return this.canvas.width; }
+    set clientWidth(width) { this.canvas.width = width; }
+    get clientHeight() { return this.canvas.height; }
+    set clientHeight(height) { this.canvas.height = height; }
+    addEventListener() { }
+    removeEventListener() { }
+    dispatchEvent() { }
+    setPointerCapture() { }
+    releasePointerCapture() { }
+}
+const THREE_WITH_WEBGPU = THREE;
+(0, fiber_1.extend)(THREE);
+function R3FWebGpuCanvas({ children, style, camera, clearColor = '#000', onCreated, onError, }) {
+    const canvasRef = (0, react_1.useRef)(null);
+    const rootRef = (0, react_1.useRef)(null);
+    const contextRef = (0, react_1.useRef)(null);
+    const rendererRef = (0, react_1.useRef)(null);
+    const surfaceRef = (0, react_1.useRef)(null);
+    const rendererPatchedRef = (0, react_1.useRef)(false);
+    const rendererInitializedRef = (0, react_1.useRef)(false);
+    const [layoutSize, setLayoutSize] = (0, react_1.useState)({ width: 0, height: 0 });
+    const [configured, setConfigured] = (0, react_1.useState)(false);
+    const childrenRef = (0, react_1.useRef)(children);
+    (0, react_1.useEffect)(() => {
+        childrenRef.current = children;
+    }, [children]);
+    const handleLayout = (0, react_1.useCallback)((event) => {
+        const { width, height } = event.nativeEvent.layout;
+        setLayoutSize((prev) => (prev.width === width && prev.height === height ? prev : { width, height }));
+    }, []);
+    (0, react_1.useEffect)(() => {
+        if (!canvasRef.current || layoutSize.width <= 0 || layoutSize.height <= 0)
+            return;
+        let cancelled = false;
+        const configure = async () => {
+            try {
+                if (!contextRef.current) {
+                    contextRef.current = canvasRef.current?.getContext('webgpu');
+                }
+                const context = contextRef.current;
+                if (!context)
+                    throw new Error('Unable to acquire a WebGPU canvas context');
+                const surface = surfaceRef.current ?? new ReactNativeCanvas(context.canvas);
+                surfaceRef.current = surface;
+                const dpr = react_native_1.PixelRatio.get();
+                surface.width = Math.max(1, Math.round(layoutSize.width * dpr));
+                surface.height = Math.max(1, Math.round(layoutSize.height * dpr));
+                const root = rootRef.current ?? (0, fiber_1.createRoot)(surface);
+                rootRef.current = root;
+                const renderer = rendererRef.current ?? new THREE_WITH_WEBGPU.WebGPURenderer({
+                    alpha: false,
+                    antialias: true,
+                    canvas: surface,
+                    context,
+                });
+                rendererRef.current = renderer;
+                if (!rendererInitializedRef.current) {
+                    await renderer.init();
+                    rendererInitializedRef.current = true;
+                }
+                await root.configure({
+                    dpr: 1,
+                    frameloop: 'always',
+                    size: {
+                        width: surface.clientWidth,
+                        height: surface.clientHeight,
+                        top: 0,
+                        left: 0,
+                    },
+                    camera: camera,
+                    gl: renderer,
+                    onCreated: (state) => {
+                        if (!rendererPatchedRef.current) {
+                            const originalRender = state.gl.render.bind(state.gl);
+                            state.gl.render = (scene, camera) => {
+                                const result = originalRender(scene, camera);
+                                context.present();
+                                return result;
+                            };
+                            rendererPatchedRef.current = true;
+                        }
+                        state.scene.background = new THREE.Color(clearColor);
+                        onCreated?.(state);
+                    },
+                });
+                if (!cancelled) {
+                    root.render(childrenRef.current);
+                    setConfigured(true);
+                }
+            }
+            catch (error) {
+                if (!cancelled) {
+                    setConfigured(false);
+                    onError?.(formatErrorMessage(error));
+                }
+            }
+        };
+        void configure();
+        return () => {
+            cancelled = true;
+        };
+    }, [camera, clearColor, layoutSize.height, layoutSize.width, onCreated, onError]);
+    (0, react_1.useEffect)(() => {
+        if (!configured || !rootRef.current)
+            return;
+        rootRef.current.render(children);
+    }, [children, configured]);
+    (0, react_1.useEffect)(() => () => {
+        rootRef.current?.unmount();
+        rootRef.current = null;
+        contextRef.current = null;
+        rendererRef.current = null;
+        surfaceRef.current = null;
+        rendererPatchedRef.current = false;
+        rendererInitializedRef.current = false;
+    }, []);
+    return ((0, jsx_runtime_1.jsx)(react_native_1.View, { style: [styles.container, style], onLayout: handleLayout, children: (0, jsx_runtime_1.jsx)(react_native_wgpu_1.Canvas, { ref: canvasRef, style: react_native_1.StyleSheet.absoluteFill, transparent: true }) }));
+}
+const styles = react_native_1.StyleSheet.create({
+    container: { overflow: 'hidden' },
+});

package/dist/wgpu/WgpuAvatar.d.ts

@@ -1,26 +1,49 @@
 /**
  * WgpuAvatar — drop-in replacement for FilamentAvatar using react-three-fiber
- * + react-native-wgpu (or expo-gl fallback). Exposes the same ref interface as
+ * + react-native-wgpu. Exposes the same ref interface as
  * FilamentAvatarRef so siteclaw can swap renderers without changing call sites.
  *
  * No SurfaceTexture, no choreographer, no JNI surface lifecycle bugs.
  *
  * Peer deps required by the host app:
- *   react-native-wgpu  (or expo-gl for the expo-gl fallback canvas)
+ *   react-native-wgpu
  *   @react-three/fiber >= 8
  *   @react-three/drei  >= 9
  *   three              >= 0.170
  */
+import './blobShim';
 import React from 'react';
 import { type StyleProp, type ViewStyle } from 'react-native';
 import * as THREE from 'three';
 import type { TalkingHeadMood, TalkingHeadAccessory, TalkingHeadVisemeSchedule } from '../index';
+import { type MotionKey, type TalkingHeadGesture, type TalkingHeadPose } from '../core/avatar/motion';
 export interface WgpuAvatarRef {
     setMood: (mood: TalkingHeadMood) => void;
     sendAmplitude: (amplitude: number) => void;
     sendViseme: (viseme: string, weight?: number) => void;
     scheduleVisemes: (schedule: TalkingHeadVisemeSchedule) => void;
     clearVisemes: () => void;
+    /** Play a procedural body motion (e.g. 'attack', 'defend', 'groove'). */
+    playMotion(name: MotionKey): void;
+    playMotion(name: string): void;
+    /** Stop the active procedural motion and restore the rest pose. */
+    stopMotion: () => void;
+    /** Procedural fallback for upstream TalkingHead gestures on native WGPU. */
+    playGesture: (name: TalkingHeadGesture | string, opts?: {
+        ms?: number;
+    }) => void;
+    stopGesture: () => void;
+    /** Procedural fallback for upstream TalkingHead pose templates on native WGPU. */
+    playPose: (name: TalkingHeadPose | string) => void;
+    stopPose: () => void;
+    /** Play an animation clip from a GLB loaded by the native WGPU path. */
+    playAnimation: (url: string, opts?: {
+        dur?: number;
+        index?: number;
+    }) => void;
+    stopAnimation: () => void;
+    /** Triggers a single natural blink — use as a reaction to accessory snap-on. */
+    triggerBlink: () => void;
 }
 interface WgpuAvatarProps {
     style?: StyleProp<ViewStyle>;
@@ -32,6 +55,7 @@ interface WgpuAvatarProps {
     accessories?: TalkingHeadAccessory[];
     onReady?: () => void;
     onError?: (message: string) => void;
+    onAvatarState?: (state: string) => void;
     /** Called once the R3F scene and camera are available (for editor raycasting). */
     onSceneReady?: (scene: THREE.Scene, camera: THREE.Camera) => void;
 }