@nayan-ui/engine 0.0.0-stage → 1.0.0-beta.4

package/lib/web/types/src/world/types.d.ts

@@ -0,0 +1,237 @@
+import type { Font, TextAlign } from '../assets/font';
+import type { Model } from '../assets/model';
+import type { Texture } from '../assets/texture';
+import type { Sound } from '../media/audio';
+import type { Vec3 } from '../types';
+import type { ColorInput } from './color';
+/** Opaque entity handle. Handles of despawned entities are safely ignored. */
+export type Entity = number & {
+    readonly __entity: unique symbol;
+};
+export type Color = readonly [number, number, number] | readonly [number, number, number, number];
+export type Quat = readonly [number, number, number, number];
+/** Playback for one entity using a skeletal animation embedded in a loaded model. */
+export interface ClipOptions {
+    /** Repeat the clip. Default true. */
+    loop?: boolean;
+    /** Playback rate; zero holds a pose. Default 1. */
+    speed?: number;
+    /** Crossfade from the current pose, in seconds. Default 0.15. */
+    fade?: number;
+    /** Seek to this time in seconds. Omit to retain playback when reselecting a clip. */
+    time?: number;
+}
+/** Plane used by screenToWorld; defaults to the ground through the origin. */
+export interface ScreenPlane {
+    point?: Vec3;
+    normal?: Vec3;
+}
+/**
+ * - `dynamic`: moved by physics (gravity, collisions, impulses).
+ * - `kinematic`: moved by you; pushes dynamic bodies out of the way.
+ * - `fixed`: never moves (floors, walls).
+ */
+export type BodyType = 'dynamic' | 'kinematic' | 'fixed';
+export type PhysicsOptions = {
+    type: BodyType;
+    /** Default: matches the mesh (spheres get a ball, cylinders a cylinder, ...; anything else a box). */
+    shape?: 'ball' | 'box' | 'cylinder' | 'capsule' | 'cone';
+    /** Ball, cylinder, capsule or cone radius. Default: from the entity's size. */
+    radius?: number;
+    /** Cylinder, capsule or cone height (total). Default: from the entity's size. */
+    height?: number;
+    /** Box size (full width, height, depth). Default: the entity's size. */
+    size?: Vec3;
+    /** Layer bits this collider is on. Default 1. */
+    layer?: number;
+    /** Layers it interacts with. Either side's mask is enough. Default: all. */
+    mask?: number;
+    /** Reports touches but doesn't push: pickups, trigger zones. */
+    sensor?: boolean;
+    /** How grippy, default 0.5. */
+    friction?: number;
+    /** Bounciness 0..1, default 0. */
+    bounce?: number;
+    /** Mass per volume, default 1. */
+    density?: number;
+    /** Slows movement over time (air resistance), default 0. */
+    drag?: number;
+    /** Slows spinning over time, default 0.05. */
+    angularDrag?: number;
+    /** Multiplier on world gravity, default 1. */
+    gravityScale?: number;
+    /** Stays upright: never tumbles. */
+    upright?: boolean;
+    /** Stops fast, small bodies passing through walls. */
+    ccd?: boolean;
+    /** 2D games: stays in its XY plane (moves in x/y, spins only around z). Keep the camera looking down -z. */
+    planar?: boolean;
+};
+/** Sound/haptic the core plays by itself when the entity hits something solid. */
+export type ImpactFeedback = {
+    /** A loaded sound, e.g. `sfx.get("bump")`. Omit for haptics only. */
+    sound?: Sound;
+    /** Slower impacts are silent. Default 1. */
+    minSpeed?: number;
+    /** Full volume and strength at this speed. Default 10. */
+    maxSpeed?: number;
+    /** Volume at full strength, 0..2. Default 1. */
+    volume?: number;
+    /** Vibration at full strength, 0..1. Default 0 (none). */
+    haptic?: number;
+};
+/**
+ * Everything about an entity. `spawn` and `set` take the same options; in `set`, only what you
+ * pass changes, and `null` removes something (physics, parent, follow, bob, lifetime, impact).
+ */
+export type EntityOptions = {
+    /** A built-in shape or a model from `loadModel`. Default "cube". */
+    mesh?: Shape | Model;
+    /** An image from `loadTexture`, drawn on the mesh (`null` = none). In `set`, pass `mesh` with it. */
+    texture?: Texture | null;
+    /** Part of the texture to show, [u0, v0, u1, v1] from 0..1 (sprite sheets, card atlases). */
+    textureRegion?: readonly [number, number, number, number];
+    /** 3D text instead of a mesh (needs `font`). Letters are 1 unit tall at scale 1. */
+    text?: string;
+    /** A font from `loadFont`, for `text`. */
+    font?: Font;
+    /** Text alignment around `position`. Default "center". */
+    align?: TextAlign;
+    /** Extra space between letters, in ems. Default 0. */
+    letterSpacing?: number;
+    /** Digits all as wide as the widest, so changing scores and timers don't shift. Default false. */
+    tabular?: boolean;
+    /** Relative to the parent when attached. */
+    position?: Vec3;
+    rotation?: Quat;
+    /** A number scales uniformly. Children scale with their parent. Visual only after the body exists. */
+    scale?: Vec3 | number;
+    /**
+     * A CSS color (`'#FF4757'`, `'rgba(…)'`) or a 0..1 tuple. Alpha below 1 makes it see-through. Tuple
+     * channels above 1 glow: at 2 it's self-lit, ignoring light and shadow (fire, lamps).
+     */
+    color?: ColorInput;
+    /** Units per second. */
+    velocity?: Vec3;
+    /** Sets horizontal speed [x, z] and keeps the vertical one: steer a body and it still falls. */
+    groundVelocity?: readonly [number, number];
+    /** Units per second², for entities without a dynamic body (falling debris, thrown items). */
+    acceleration?: Vec3;
+    /** Radians per second around each axis. */
+    spin?: Vec3;
+    /** Visual bob: the drawn position moves by amplitude * sin(phase), phase advancing at `speed`. */
+    bob?: {
+        amplitude: Vec3;
+        speed: number;
+        phase?: number;
+    } | null;
+    /** Chase `target` along the ground at `speed`. */
+    follow?: {
+        target: Entity;
+        speed: number;
+    } | null;
+    /** Seconds until it shrinks away and is despawned. */
+    lifetime?: number | null;
+    /** Attach to another entity: it moves, turns and scales with the parent and is despawned with it. Visual only. */
+    parent?: Entity | null;
+    physics?: BodyType | PhysicsOptions | null;
+    impact?: ImpactFeedback | null;
+    /** Whether `pick` can hit it. Default true. */
+    pickable?: boolean;
+};
+export type Easing = 'linear' | 'easeIn' | 'easeOut' | 'easeInOut' | 'back' | 'bounce' | 'elastic';
+/** What `animate` changes. Anything left out stays as it is (and keeps any animation it already has). */
+export type AnimateTarget = {
+    position?: Vec3;
+    rotation?: Quat;
+    scale?: Vec3 | number;
+    /** A CSS color or a 0..1 tuple. */
+    color?: ColorInput;
+    /** Move by this offset from where the animation starts (instead of to a `position`). */
+    moveBy?: Vec3;
+    /** Turn by these angles (radians around x, y, z) from the starting rotation. 2π spins once; more spins more. */
+    turn?: Vec3;
+    /** Shake by up to this distance, fading out. Only the drawn position shakes (hits, wrong moves). */
+    shake?: number;
+};
+/** A step of a keyframed animation: values to pass through, and when (0..1 of the duration; default evenly spaced). */
+export type Keyframe = AnimateTarget & {
+    at?: number;
+};
+export type SpringOptions = {
+    /** How strongly it pulls toward the target. Default 170. */
+    stiffness?: number;
+    /** How quickly it calms down. Lower bounces more. Default 26 (no overshoot). */
+    damping?: number;
+    /** Heavier moves slower and swings further. Default 1. */
+    mass?: number;
+};
+export type AnimateOptions = {
+    /** Seconds (ignored by springs). Default 0.3. */
+    duration?: number;
+    /** Seconds before it starts. Default 0. */
+    delay?: number;
+    /** Default "easeOut". "back" overshoots, "bounce" bounces, "elastic" springs. */
+    easing?: Easing;
+    /** Extra runs after the first, or "forever". Default 0. */
+    repeat?: number | 'forever';
+    /** Every other run plays backwards (pulses, ping-pong). */
+    yoyo?: boolean;
+    /** With several entities: extra delay for each next one, in seconds (waves, board reveals). */
+    stagger?: number;
+    /** "smooth" moves along a curve through the keyframes (arcs, hops) instead of straight lines. */
+    path?: 'linear' | 'smooth';
+    /**
+     * Physically simulated motion instead of a fixed duration: true (smooth), "bouncy", or your own
+     * settings. Interrupting a spring with another keeps its speed, so it never jerks.
+     */
+    spring?: boolean | 'bouncy' | SpringOptions;
+};
+export type BurstOptions = {
+    position: Vec3;
+    /** How many particles. Default 16. */
+    count?: number;
+    /** Main direction. Default up. */
+    direction?: Vec3;
+    /** Half-angle of the cone around `direction`, in radians. Default π (every direction). */
+    spread?: number;
+    /** Default "cube". */
+    mesh?: Shape | Model;
+    /** Particle size. Default 0.15. */
+    size?: number;
+    /** Top speed. Default 5. */
+    speed?: number;
+    /** Seconds. Default 0.8. */
+    lifetime?: number;
+    /** Vertical acceleration. Default -9.81 (falls); 0 floats. */
+    gravity?: number;
+    /** One color (CSS string or tuple), or up to 4 to pick from at random. Default white. */
+    color?: ColorInput | readonly ColorInput[];
+    /** Size at the end of each particle's life, as a multiple of its start size: above 1 grows (smoke), below shrinks (embers). Default 1. */
+    endSize?: number;
+    /** Color every particle shifts to over its life, e.g. flame to dark red; an alpha below 1 fades it out. Default: keeps its color. */
+    endColor?: ColorInput;
+};
+export type CollisionInfo = {
+    /** True when the touch started; false when it ended. */
+    started: boolean;
+    /** A sensor was involved. */
+    sensor: boolean;
+    /** Impact speed (0 when a touch ends). */
+    speed: number;
+};
+export type RaycastHit = {
+    entity: Entity;
+    distance: number;
+    normal: [number, number, number];
+    point: [number, number, number];
+};
+export type PickHit = {
+    entity: Entity;
+    /** Where the tap ray hit the entity's bounding box, in world space. */
+    point: [number, number, number];
+    distance: number;
+};
+export type Bounds = readonly [minX: number, minZ: number, maxX: number, maxZ: number];
+import type { Shape } from '../types';
+export type { Shape };

package/native/android/CMakeLists.txt

@@ -0,0 +1,34 @@
+# Android build of the engine's native module. React Native's autolinking adds this directory to the
+# app's native build (see react-native.config.js); there is no Gradle project, so this is a "pure C++"
+# dependency and the codegen header ships in native/cpp/generated (regenerate with `bun run codegen`).
+cmake_minimum_required(VERSION 3.13)
+project(NayanEngine CXX)
+
+get_filename_component(NATIVE_ROOT "${CMAKE_CURRENT_LIST_DIR}/.." ABSOLUTE)
+
+# Rust core, prebuilt per ABI by native/core/scripts/build-android.sh.
+add_library(engine_core STATIC IMPORTED)
+set_target_properties(engine_core PROPERTIES
+  IMPORTED_LOCATION "${NATIVE_ROOT}/core/build/android/${ANDROID_ABI}/libengine_core.a")
+
+# The codegen target autolinking expects (react_codegen_<codegenConfig.name>). It must be a real
+# library: autolinking links `common_flags` into it with a plain target_link_libraries call.
+add_library(react_codegen_NayanEngineSpec STATIC "${NATIVE_ROOT}/cpp/generated/NayanEngineSpecJSI.cpp")
+# android/ holds NayanEngineSpec.h, the (empty) Java module provider autolinking includes.
+target_include_directories(react_codegen_NayanEngineSpec PUBLIC "${NATIVE_ROOT}/cpp/generated" "${CMAKE_CURRENT_LIST_DIR}")
+target_compile_features(react_codegen_NayanEngineSpec PUBLIC cxx_std_20)
+target_link_libraries(react_codegen_NayanEngineSpec jsi reactnative)
+
+# The TurboModule (shared with iOS) and the Rust core it calls.
+add_library(NayanEngine STATIC "${NATIVE_ROOT}/cpp/NayanEngineModule.cpp")
+target_include_directories(NayanEngine PUBLIC "${NATIVE_ROOT}/cpp" "${NATIVE_ROOT}/core/include")
+target_compile_features(NayanEngine PUBLIC cxx_std_20)
+target_link_libraries(NayanEngine
+  react_codegen_NayanEngineSpec
+  engine_core
+  fbjni
+  jsi
+  reactnative
+  aaudio   # audio output (cpal's AAudio backend)
+  android
+  log)

package/native/android/NayanEngineSpec.h

@@ -0,0 +1,15 @@
+// Autolinking includes <NayanEngineSpec.h> and calls this provider for every library with a codegen
+// config. The engine has no Java module (it is registered through the C++ provider in
+// NayanEngineModule.h), so this always declines.
+#pragma once
+
+#include <ReactCommon/JavaTurboModule.h>
+
+namespace facebook::react {
+
+inline std::shared_ptr<TurboModule> NayanEngineSpec_ModuleProvider(
+    const std::string&, const JavaTurboModule::InitParams&) {
+  return nullptr;
+}
+
+} // namespace facebook::react

package/native/android/build.gradle

@@ -0,0 +1,26 @@
+// Java side of the engine: the EngineSurface view the renderer draws into. The native module itself is
+// pure C++ (CMakeLists.txt, built into the app by autolinking).
+apply plugin: "com.android.library"
+
+def safeExtGet(prop, fallback) {
+  rootProject.ext.has(prop) ? rootProject.ext.get(prop) : fallback
+}
+
+android {
+  namespace "com.nayanui.engine"
+  compileSdkVersion safeExtGet("compileSdkVersion", 35)
+
+  defaultConfig {
+    minSdkVersion safeExtGet("minSdkVersion", 24)
+    consumerProguardFiles "proguard-rules.pro"
+  }
+}
+
+repositories {
+  google()
+  mavenCentral()
+}
+
+dependencies {
+  implementation "com.facebook.react:react-android"
+}

package/native/android/codegen/CMakeLists.txt

@@ -0,0 +1,3 @@
+# Autolinking adds a codegen directory for every library with a Gradle project. The engine runs no
+# Gradle codegen: ../CMakeLists.txt defines react_codegen_NayanEngineSpec from native/cpp/generated.
+cmake_minimum_required(VERSION 3.13)

package/native/android/proguard-rules.pro

@@ -0,0 +1,2 @@
+# The native methods are looked up by name from C++ (JNI).
+-keep class com.nayanui.engine.** { *; }

package/native/android/src/main/java/com/nayanui/engine/EngineSurfaceView.java

@@ -0,0 +1,295 @@
+package com.nayanui.engine;
+
+import android.content.Context;
+import java.nio.charset.StandardCharsets;
+import com.facebook.react.bridge.Arguments;
+import com.facebook.react.bridge.ReactContext;
+import com.facebook.react.bridge.WritableMap;
+import com.facebook.react.uimanager.UIManagerHelper;
+import com.facebook.react.uimanager.events.Event;
+import com.facebook.react.uimanager.events.EventDispatcher;
+import android.graphics.PixelFormat;
+import android.os.Build;
+import android.view.Surface;
+import android.view.SurfaceHolder;
+import android.view.SurfaceView;
+import android.view.MotionEvent;
+import android.view.ScaleGestureDetector;
+import android.view.Choreographer;
+
+/**
+ * A surface the Rust renderer draws into (Vulkan, or OpenGL ES when Vulkan isn't usable). JS refers
+ * to it by `surfaceId`.
+ *
+ * A SurfaceView, not a TextureView: its frames go straight to the system compositor (often as a
+ * hardware overlay), instead of being copied into the app's own view tree by the UI thread's
+ * renderer every frame. With a TextureView each game frame also redraws the React Native window and
+ * makes the JS thread wait on the UI thread for a free buffer, which is what made heavy 3D scenes
+ * stutter and hang on Android. The surface keeps showing its last frame after the renderer detaches,
+ * until the view leaves the window, so navigation's exit animation still shows the game.
+ */
+public class EngineSurfaceView extends SurfaceView implements SurfaceHolder.Callback, Choreographer.FrameCallback {
+  private int surfaceId = -1;
+  private Surface surface;
+  private int width;
+  private int height;
+  private int drawingId = -1;
+  private int drawingMode;
+  private int drawingBackground = 0xffffff;
+  private boolean drawingTick;
+  private boolean clockRunning;
+
+  /**
+   * The game's display clock: once per refresh while the surface is attached and on screen, the
+   * engine is asked for its next frame on the JS thread (see `deliverFrame`). Unlike React Native's
+   * requestAnimationFrame, which can tick at half the display's rate, this follows every vsync; the
+   * frame itself is drawn on the engine's render thread.
+   */
+  private final Choreographer.FrameCallback clock = new Choreographer.FrameCallback() {
+    @Override public void doFrame(long frameTimeNanos) {
+      if (!clockRunning) return;
+      if (surfaceId >= 0 && surface != null) nativeVsync(surfaceId, frameTimeNanos);
+      Choreographer.getInstance().postFrameCallback(this);
+    }
+  };
+
+  private void startClock() {
+    if (!clockRunning && surfaceId >= 0 && surface != null && isShown()) {
+      clockRunning = true;
+      Choreographer.getInstance().postFrameCallback(clock);
+    }
+  }
+
+  private void stopClock() {
+    clockRunning = false;
+    Choreographer.getInstance().removeFrameCallback(clock);
+  }
+  private long lastDrawingEvent;
+  private int drawingPointer = -1;
+  private boolean pencil;
+  private float lastX, lastY;
+  private final float density;
+  private final ScaleGestureDetector scaleDetector;
+
+  public EngineSurfaceView(Context context) {
+    super(context);
+    getHolder().addCallback(this);
+    // Frames are opaque: the compositor can skip blending the layer.
+    getHolder().setFormat(PixelFormat.OPAQUE);
+    density = context.getResources().getDisplayMetrics().density;
+    scaleDetector = new ScaleGestureDetector(context, new ScaleGestureDetector.SimpleOnScaleGestureListener() {
+      @Override public boolean onScale(ScaleGestureDetector detector) {
+        nativeDrawingTransform(drawingId, 0, 0, detector.getScaleFactor());
+        return true;
+      }
+    });
+  }
+
+  public void setSurfaceId(int id) {
+    if (id == surfaceId) {
+      return;
+    }
+    if (surfaceId >= 0) {
+      nativeDetach(surfaceId);
+    }
+    surfaceId = id;
+    attach();
+  }
+
+  /**
+   * Stops the renderer, but leaves the surface (and its last frame) visible until navigation removes
+   * the view. Hiding it here would replace the game's last frame with an empty screen during the
+   * exit animation.
+   */
+  public void release() {
+    stopClock();
+    stopDrawing();
+    drawingId = -1;
+    if (surfaceId >= 0) {
+      nativeDetach(surfaceId);
+      surfaceId = -1;
+    }
+    releaseSurface();
+  }
+
+  /**
+   * Games ask for 60 frames a second. A SurfaceView's frames never invalidate the view tree, so on
+   * Android 15+ the system otherwise judges the app idle and drops its vsync (and with it React
+   * Native's frame callbacks) to 30 or 20 Hz, halving the frame rate and doubling load times.
+   */
+  private static final float GAME_FRAME_RATE = 60f;
+
+  private void requestFrameRate() {
+    if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.R && surface != null && surface.isValid()) {
+      try {
+        surface.setFrameRate(GAME_FRAME_RATE, Surface.FRAME_RATE_COMPATIBILITY_DEFAULT);
+      } catch (IllegalArgumentException | IllegalStateException ignored) {
+        // A surface being torn down; the next attach asks again.
+      }
+    }
+    if (Build.VERSION.SDK_INT >= 35) setRequestedFrameRate(REQUESTED_FRAME_RATE_CATEGORY_HIGH);
+  }
+
+  private void attach() {
+    if (surfaceId >= 0 && surface != null && surface.isValid() && width > 0 && height > 0) {
+      nativeAttach(surfaceId, surface, width, height);
+      requestFrameRate();
+      if (drawingId >= 0) nativeDrawingInvalidate(drawingId);
+      startDrawing();
+      startClock();
+    }
+  }
+
+  @Override
+  public void surfaceCreated(SurfaceHolder holder) {
+    surface = holder.getSurface();
+  }
+
+  @Override
+  public void surfaceChanged(SurfaceHolder holder, int format, int w, int h) {
+    surface = holder.getSurface();
+    width = w;
+    height = h;
+    attach();
+  }
+
+  @Override
+  public void surfaceDestroyed(SurfaceHolder holder) {
+    stopClock();
+    stopDrawing();
+    // Wait for the renderer before Android destroys the surface. Keep the id so a screen covered by
+    // another route can attach a new surface when it comes back from the back stack.
+    if (surfaceId >= 0) {
+      nativeDetach(surfaceId);
+    }
+    releaseSurface();
+  }
+
+  /** The holder owns the surface: only forget it (releasing it here would break the next attach). */
+  private void releaseSurface() {
+    surface = null;
+  }
+
+  public void setDrawingId(int id) {
+    stopDrawing();
+    drawingId = id;
+    if (id >= 0) nativeDrawingInvalidate(id);
+    startDrawing();
+  }
+  public void setDrawingMode(int mode) {
+    if (drawingPointer >= 0) nativeDrawingTouch(drawingId, 3, 0, 0, 1);
+    drawingPointer = -1;
+    drawingMode = mode;
+  }
+  public void setDrawingBackground(int color) {
+    drawingBackground = color;
+    if (drawingId >= 0) nativeDrawingInvalidate(drawingId);
+  }
+  private void startDrawing() {
+    if (!drawingTick && drawingId >= 0 && surface != null && isShown() && hasWindowFocus()) {
+      drawingTick = true;
+      Choreographer.getInstance().postFrameCallback(this);
+    }
+  }
+  private void stopDrawing() {
+    drawingTick = false;
+    Choreographer.getInstance().removeFrameCallback(this);
+    if (drawingPointer >= 0) nativeDrawingTouch(drawingId, 2, lastX, lastY, 1);
+    drawingPointer = -1;
+  }
+  @Override public void doFrame(long frameTimeNanos) {
+    if (!drawingTick || drawingId < 0 || surface == null) return;
+    nativeDrawingPresent(drawingId, surfaceId, width / density, height / density, drawingBackground);
+    if (frameTimeNanos - lastDrawingEvent >= 100_000_000L && getContext() instanceof ReactContext) {
+      lastDrawingEvent = frameTimeNanos;
+      byte[] data = nativeDrawingEvent(drawingId);
+      if (data != null) {
+        String state = new String(data, StandardCharsets.UTF_8);
+        ReactContext context = (ReactContext)getContext();
+        EventDispatcher dispatcher = UIManagerHelper.getEventDispatcherForReactTag(context, getId());
+        if (dispatcher != null) dispatcher.dispatchEvent(new DrawingChangeEvent(UIManagerHelper.getSurfaceId(context), getId(), drawingId, state));
+      }
+    }
+    Choreographer.getInstance().postFrameCallback(this);
+  }
+  private static final class DrawingChangeEvent extends Event<DrawingChangeEvent> {
+    private final String state;
+    private final int document;
+    DrawingChangeEvent(int surface, int view, int document, String state) { super(surface, view); this.document = document; this.state = state; }
+    @Override public String getEventName() { return "topDrawingChange"; }
+    @Override public boolean canCoalesce() { return true; }
+    @Override protected WritableMap getEventData() { WritableMap data = Arguments.createMap(); data.putString("state", state); data.putInt("documentId", document); return data; }
+  }
+  @Override public void onWindowFocusChanged(boolean focused) {
+    super.onWindowFocusChanged(focused);
+    if (focused) startDrawing(); else stopDrawing();
+  }
+  @Override protected void onDetachedFromWindow() {
+    stopClock();
+    stopDrawing();
+    super.onDetachedFromWindow();
+  }
+  @Override protected void onWindowVisibilityChanged(int visibility) {
+    super.onWindowVisibilityChanged(visibility);
+    if (visibility == VISIBLE) {
+      startDrawing();
+      startClock();
+    } else {
+      stopDrawing();
+      stopClock();
+    }
+  }
+  @Override public boolean onTouchEvent(MotionEvent event) {
+    if (drawingId < 0) return super.onTouchEvent(event);
+    getParent().requestDisallowInterceptTouchEvent(true);
+    int action = event.getActionMasked();
+    if (action == MotionEvent.ACTION_DOWN) {
+      drawingPointer = -1;
+      lastX = event.getX() / density;
+      lastY = event.getY() / density;
+      pencil = event.getToolType(0) == MotionEvent.TOOL_TYPE_STYLUS || event.getToolType(0) == MotionEvent.TOOL_TYPE_ERASER;
+      if (drawingMode == 0) {
+        drawingPointer = event.getPointerId(0);
+        nativeDrawingTouch(drawingId, event.getToolType(0) == MotionEvent.TOOL_TYPE_ERASER ? 4 : 0, lastX, lastY, pencil ? event.getPressure() : 1);
+      }
+    }
+    if (!pencil) scaleDetector.onTouchEvent(event);
+    if (action == MotionEvent.ACTION_POINTER_DOWN && !pencil) {
+      if (drawingPointer >= 0) nativeDrawingTouch(drawingId, 3, 0, 0, 1);
+      drawingPointer = -1;
+      lastX = event.getX() / density;
+      lastY = event.getY() / density;
+    }
+    if (action == MotionEvent.ACTION_MOVE) {
+      int index = drawingPointer < 0 ? -1 : event.findPointerIndex(drawingPointer);
+      if (index >= 0) {
+        for (int h = 0; h < event.getHistorySize(); h++) nativeDrawingTouch(drawingId, 1, event.getHistoricalX(index, h) / density, event.getHistoricalY(index, h) / density, pencil ? event.getHistoricalPressure(index, h) : 1);
+        lastX = event.getX(index) / density;
+        lastY = event.getY(index) / density;
+        nativeDrawingTouch(drawingId, 1, lastX, lastY, pencil ? event.getPressure(index) : 1);
+      } else if (drawingMode != 0 || event.getPointerCount() > 1) {
+        float x = event.getX() / density, y = event.getY() / density;
+        if (!scaleDetector.isInProgress()) nativeDrawingTransform(drawingId, x - lastX, y - lastY, 1);
+        lastX = x;
+        lastY = y;
+      }
+    }
+    if (action == MotionEvent.ACTION_UP || action == MotionEvent.ACTION_CANCEL || (action == MotionEvent.ACTION_POINTER_UP && event.getPointerId(event.getActionIndex()) == drawingPointer)) {
+      if (drawingPointer >= 0) nativeDrawingTouch(drawingId, action == MotionEvent.ACTION_CANCEL ? 3 : 2, lastX, lastY, 1);
+      drawingPointer = -1;
+      if (action == MotionEvent.ACTION_UP || action == MotionEvent.ACTION_CANCEL) { pencil = false; getParent().requestDisallowInterceptTouchEvent(false); }
+    }
+    return true;
+  }
+  private static native void nativeDrawingPresent(int drawing, int surface, float width, float height, int color);
+  private static native void nativeDrawingTouch(int drawing, int phase, float x, float y, float pressure);
+  private static native void nativeDrawingTransform(int drawing, float dx, float dy, float scale);
+  private static native byte[] nativeDrawingEvent(int drawing);
+  private static native void nativeDrawingInvalidate(int drawing);
+
+  private static native boolean nativeAttach(int surfaceId, Surface surface, int width, int height);
+
+  private static native void nativeDetach(int surfaceId);
+
+  private static native void nativeVsync(int surfaceId, long frameTimeNanos);
+}

package/native/android/src/main/java/com/nayanui/engine/EngineSurfaceViewManager.java

@@ -0,0 +1,45 @@
+package com.nayanui.engine;
+
+import androidx.annotation.NonNull;
+import java.util.Map;
+import com.facebook.react.common.MapBuilder;
+import com.facebook.react.uimanager.SimpleViewManager;
+import com.facebook.react.uimanager.ThemedReactContext;
+import com.facebook.react.uimanager.annotations.ReactProp;
+
+public class EngineSurfaceViewManager extends SimpleViewManager<EngineSurfaceView> {
+  @NonNull
+  @Override
+  public String getName() {
+    return "NayanEngineSurface";
+  }
+
+  @NonNull
+  @Override
+  protected EngineSurfaceView createViewInstance(@NonNull ThemedReactContext context) {
+    return new EngineSurfaceView(context);
+  }
+
+  // React unmounted the screen; stop rendering while its last texture finishes the exit animation.
+  @Override
+  public void onDropViewInstance(@NonNull EngineSurfaceView view) {
+    view.release();
+    super.onDropViewInstance(view);
+  }
+
+  @Override
+  public Map<String, Object> getExportedCustomDirectEventTypeConstants() {
+    return MapBuilder.of("topDrawingChange", MapBuilder.of("registrationName", "onDrawingChange"));
+  }
+
+  @ReactProp(name = "surfaceId", defaultInt = -1)
+  public void setSurfaceId(EngineSurfaceView view, int surfaceId) {
+    view.setSurfaceId(surfaceId);
+  }
+  @ReactProp(name = "drawingId", defaultInt = -1)
+  public void setDrawingId(EngineSurfaceView view, int id) { view.setDrawingId(id); }
+  @ReactProp(name = "drawingMode", defaultInt = 0)
+  public void setDrawingMode(EngineSurfaceView view, int mode) { view.setDrawingMode(mode); }
+  @ReactProp(name = "drawingBackground", defaultInt = 0xffffff)
+  public void setDrawingBackground(EngineSurfaceView view, int color) { view.setDrawingBackground(color); }
+}