incanto 0.1.0

package/dist/physics-3d-Dl67vOLT.js

@@ -0,0 +1,434 @@
+import { t as __exportAll } from "./rolldown-runtime-D7D4PA-g.js";
+import { t as IncantoError } from "./errors-BpWbnbb_.js";
+import { n as registerDebugSource } from "./debug-draw-CZmOYjL2.js";
+import { C as Area3D, E as RigidBody3D, O as Node3D, T as PhysicsBody3D, k as validateCollider3D, w as CharacterBody3D, y as Terrain3D } from "./register-CNlYAS1_.js";
+import { Euler, Quaternion } from "three";
+//#region src/3d/physics/physics-3d.ts
+var physics_3d_exports = /* @__PURE__ */ __exportAll({
+	Physics3D: () => Physics3D,
+	enablePhysics3D: () => enablePhysics3D
+});
+const DEG = Math.PI / 180;
+/**
+* Enable 3D physics for an engine. Dynamically imports Rapier (compat build)
+* so games without physics never pay its bundle cost. 1 unit = 1 meter, y-up —
+* three's native space, no conversion.
+*/
+async function enablePhysics3D(engine, opts) {
+	const R = await import("@dimforge/rapier3d-compat");
+	await R.init();
+	return new Physics3D(R, engine, opts);
+}
+/** Per-engine 3D physics world. Same contract as Physics2D. */
+var Physics3D = class {
+	R;
+	engine;
+	/** Render collider outlines in the GAME view (renderers pick this up). */
+	debugDraw = false;
+	dimension = "3d";
+	unregisterDebug;
+	warnedNoCollider = /* @__PURE__ */ new WeakSet();
+	entries = /* @__PURE__ */ new Map();
+	byColliderHandle = /* @__PURE__ */ new Map();
+	world;
+	events;
+	kcc;
+	disconnect;
+	lastDt = 1 / 60;
+	optsGravity;
+	lastScene = null;
+	constructor(R, engine, opts) {
+		this.R = R;
+		this.engine = engine;
+		this.optsGravity = opts?.gravity;
+		this.lastScene = engine.scene;
+		const declared = engine.scene?.physics?.gravity;
+		const g = opts?.gravity ?? declared ?? [
+			0,
+			-9.81,
+			0
+		];
+		this.world = new R.World({
+			x: g[0] ?? 0,
+			y: g[1] ?? 0,
+			z: g[2] ?? 0
+		});
+		this.kcc = this.world.createCharacterController(.01);
+		this.events = new R.EventQueue(true);
+		this.unregisterDebug = registerDebugSource(this);
+		this.disconnect = engine.fixedUpdated.connect((dt) => this.step(dt));
+		this.syncBodies();
+	}
+	/** @internal Driven by engine.fixedUpdated. */
+	step(dt) {
+		this.lastDt = dt;
+		if (this.engine.scene !== this.lastScene) {
+			this.lastScene = this.engine.scene;
+			if (!this.optsGravity) {
+				const g = this.engine.scene?.physics?.gravity ?? [
+					0,
+					-9.81,
+					0
+				];
+				this.world.gravity = {
+					x: g[0] ?? 0,
+					y: g[1] ?? 0,
+					z: g[2] ?? 0
+				};
+			}
+		}
+		this.syncBodies();
+		this.world.timestep = dt;
+		this.world.step(this.events);
+		for (const [node, e] of this.entries) {
+			const t = e.body.translation();
+			if (!e.body.isFixed()) {
+				const [ox, oy, oz] = parentWorldOffset3D(node);
+				const next = [
+					t.x - ox,
+					t.y - oy,
+					t.z - oz
+				];
+				node._interpPrev = node._interpCurr ?? next;
+				node._interpCurr = next;
+				node.position = [
+					next[0],
+					next[1],
+					next[2]
+				];
+			}
+			if (node instanceof RigidBody3D) {
+				if (!node.fixedRotation) {
+					const q = e.body.rotation();
+					eulerScratch.setFromQuaternion(quatScratch.set(q.x, q.y, q.z, q.w), "XYZ");
+					node.rotation = [
+						eulerScratch.x / DEG,
+						eulerScratch.y / DEG,
+						eulerScratch.z / DEG
+					];
+				}
+				const lv = e.body.linvel();
+				node.linearVelocity = [
+					lv.x,
+					lv.y,
+					lv.z
+				];
+				e.lastV = [
+					lv.x,
+					lv.y,
+					lv.z
+				];
+			}
+			e.last = worldPosition3D(node);
+		}
+		this.events.drainCollisionEvents((h1, h2, started) => {
+			const a = this.byColliderHandle.get(h1);
+			const b = this.byColliderHandle.get(h2);
+			if (!a || !b) return;
+			const sig = started ? "triggerEnter" : "triggerExit";
+			a.emit(sig, b);
+			b.emit(sig, a);
+		});
+	}
+	/** @internal Called by CharacterBody3D.moveAndSlide (during tree fixedUpdate). */
+	moveAndSlide(node) {
+		const e = this.ensureEntry(node);
+		const vy = node.velocity[1] ?? 0;
+		if (node.snapToGround && vy <= 0) this.kcc.enableSnapToGround(.1);
+		else this.kcc.disableSnapToGround();
+		this.kcc.setMaxSlopeClimbAngle(node.slopeLimitDeg * DEG);
+		const desired = {
+			x: (node.velocity[0] ?? 0) * this.lastDt,
+			y: vy * this.lastDt,
+			z: (node.velocity[2] ?? 0) * this.lastDt
+		};
+		this.kcc.computeColliderMovement(e.collider, desired, this.R.QueryFilterFlags.EXCLUDE_SENSORS);
+		const c = this.kcc.computedMovement();
+		const t = e.body.translation();
+		e.body.setNextKinematicTranslation({
+			x: t.x + c.x,
+			y: t.y + c.y,
+			z: t.z + c.z
+		});
+		node._grounded = this.kcc.computedGrounded();
+	}
+	/** Rapier debug segments (meters). Null while debugDraw is off. */
+	debugLines() {
+		if (!this.debugDraw) return null;
+		return this.world.debugRender().vertices;
+	}
+	dispose() {
+		this.disconnect();
+		this.unregisterDebug();
+		this.world.free();
+	}
+	syncBodies() {
+		const scene = this.engine.scene;
+		if (!scene) return;
+		const seen = /* @__PURE__ */ new Set();
+		collectBodies(scene.root, seen);
+		for (const node of seen) {
+			if (node.collider.shape === void 0) {
+				const stale = this.entries.get(node);
+				if (stale) {
+					this.byColliderHandle.delete(stale.collider.handle);
+					this.world.removeRigidBody(stale.body);
+					this.entries.delete(node);
+					node._physics = null;
+					node._interpPrev = node._interpCurr = null;
+				}
+				if (!this.warnedNoCollider.has(node)) {
+					this.warnedNoCollider.add(node);
+					console.warn(`[incanto] '${node.name}' has no collider — physics skips it.`);
+				}
+				continue;
+			}
+			const existing = this.entries.get(node);
+			if (existing && existing.colliderKey !== JSON.stringify(node.collider)) {
+				this.byColliderHandle.delete(existing.collider.handle);
+				this.world.removeRigidBody(existing.body);
+				this.entries.delete(node);
+				node._physics = null;
+				node._interpPrev = node._interpCurr = null;
+			}
+			this.ensureEntry(node);
+		}
+		for (const [node, e] of this.entries) if (!seen.has(node)) {
+			this.byColliderHandle.delete(e.collider.handle);
+			this.world.removeRigidBody(e.body);
+			this.entries.delete(node);
+			node._physics = null;
+			node._interpPrev = node._interpCurr = null;
+		}
+	}
+	ensureEntry(node) {
+		let e = this.entries.get(node);
+		const R = this.R;
+		if (!e) {
+			let desc;
+			if (node instanceof RigidBody3D) desc = R.RigidBodyDesc.dynamic();
+			else if (node instanceof CharacterBody3D || node instanceof Area3D) desc = R.RigidBodyDesc.kinematicPositionBased();
+			else desc = R.RigidBodyDesc.fixed();
+			const [wx, wy, wz] = worldPosition3D(node);
+			desc.setTranslation(wx, wy, wz);
+			quatScratch.setFromEuler(eulerScratch.set((node.rotation[0] ?? 0) * DEG, (node.rotation[1] ?? 0) * DEG, (node.rotation[2] ?? 0) * DEG, "XYZ"));
+			desc.setRotation({
+				x: quatScratch.x,
+				y: quatScratch.y,
+				z: quatScratch.z,
+				w: quatScratch.w
+			});
+			if (node instanceof RigidBody3D) {
+				desc.setGravityScale(node.gravityScale);
+				desc.setLinvel(node.linearVelocity[0] ?? 0, node.linearVelocity[1] ?? 0, node.linearVelocity[2] ?? 0);
+				if (node.fixedRotation) desc.lockRotations();
+			}
+			const body = this.world.createRigidBody(desc);
+			const colDesc = parseCollider3D(R, node);
+			colDesc.setActiveEvents(R.ActiveEvents.COLLISION_EVENTS);
+			colDesc.setActiveCollisionTypes(R.ActiveCollisionTypes.ALL);
+			if (node instanceof Area3D) colDesc.setSensor(true);
+			if (node instanceof RigidBody3D) colDesc.setMass(node.mass).setFriction(node.friction).setRestitution(node.restitution);
+			const collider = this.world.createCollider(colDesc, body);
+			e = {
+				colliderKey: JSON.stringify(node.collider),
+				body,
+				collider,
+				last: [
+					wx,
+					wy,
+					wz
+				],
+				lastV: [
+					0,
+					0,
+					0
+				]
+			};
+			this.entries.set(node, e);
+			this.byColliderHandle.set(collider.handle, node);
+			node._physics = this;
+			if (node instanceof RigidBody3D) node._physics3d = this;
+			return e;
+		}
+		const p = worldPosition3D(node);
+		if (p[0] !== e.last[0] || p[1] !== e.last[1] || p[2] !== e.last[2]) {
+			e.body.setTranslation({
+				x: p[0],
+				y: p[1],
+				z: p[2]
+			}, true);
+			e.last = p;
+			node._interpPrev = node._interpCurr = null;
+		}
+		if (node instanceof RigidBody3D) {
+			const v = [
+				node.linearVelocity[0] ?? 0,
+				node.linearVelocity[1] ?? 0,
+				node.linearVelocity[2] ?? 0
+			];
+			if (v[0] !== e.lastV[0] || v[1] !== e.lastV[1] || v[2] !== e.lastV[2]) {
+				e.body.setLinvel({
+					x: v[0],
+					y: v[1],
+					z: v[2]
+				}, true);
+				e.lastV = v;
+			}
+			if (node.gravityScale !== e.body.gravityScale()) e.body.setGravityScale(node.gravityScale, true);
+		}
+		return e;
+	}
+	/** Apply a world-space impulse to a dynamic body (character controllers). */
+	applyImpulse(node, impulse) {
+		this.entries.get(node)?.body.applyImpulse({
+			x: impulse[0],
+			y: impulse[1],
+			z: impulse[2]
+		}, true);
+	}
+	/** Mass the solver actually uses (collider-derived unless overridden). */
+	massOf(node) {
+		return this.entries.get(node)?.body.mass() ?? 1;
+	}
+	/** Current solver velocity (fresher than the node prop mid-step). */
+	velocityOf(node) {
+		const v = this.entries.get(node)?.body.linvel();
+		return v ? [
+			v.x,
+			v.y,
+			v.z
+		] : [
+			0,
+			0,
+			0
+		];
+	}
+	/**
+	* World-space raycast (meters). `exclude` skips that body's collider —
+	* ground probes from inside a capsule need it. `opts.staticOnly` hits ONLY the
+	* fixed/static world (excludes both dynamic AND kinematic bodies): the camera
+	* spring arm uses it so neither a dynamic projectile nor a KINEMATIC enemy
+	* (CharacterBody3D) passing behind the player yanks the camera in.
+	*/
+	castRay(origin, dir, maxLen, exclude, opts) {
+		const ray = new this.R.Ray({
+			x: origin[0],
+			y: origin[1],
+			z: origin[2]
+		}, {
+			x: dir[0],
+			y: dir[1],
+			z: dir[2]
+		});
+		const excludeCollider = exclude ? this.entries.get(exclude)?.collider : void 0;
+		const flags = opts?.staticOnly ? this.R.QueryFilterFlags.EXCLUDE_DYNAMIC | this.R.QueryFilterFlags.EXCLUDE_KINEMATIC : void 0;
+		const hit = this.world.castRayAndGetNormal(ray, maxLen, true, flags, void 0, excludeCollider, void 0, (collider) => !collider.isSensor());
+		if (!hit) return null;
+		return {
+			distance: hit.timeOfImpact,
+			normal: [
+				hit.normal.x,
+				hit.normal.y,
+				hit.normal.z
+			],
+			node: this.byColliderHandle.get(hit.collider.handle) ?? null
+		};
+	}
+};
+const quatScratch = new Quaternion();
+const eulerScratch = new Euler();
+function collectBodies(node, out) {
+	if (node instanceof PhysicsBody3D) out.add(node);
+	for (const c of node.children) collectBodies(c, out);
+}
+/**
+* Composed world position (translation only — ancestor rotation/scale are NOT
+* supported for physics bodies; keep body ancestors untransformed or offset-only).
+*/
+function worldPosition3D(node) {
+	let x = 0;
+	let y = 0;
+	let z = 0;
+	for (let n = node; n; n = n.parent) if (n instanceof Node3D) {
+		x += n.position[0] ?? 0;
+		y += n.position[1] ?? 0;
+		z += n.position[2] ?? 0;
+	}
+	return [
+		x,
+		y,
+		z
+	];
+}
+function parentWorldOffset3D(node) {
+	let x = 0;
+	let y = 0;
+	let z = 0;
+	for (let n = node.parent; n; n = n.parent) if (n instanceof Node3D) {
+		x += n.position[0] ?? 0;
+		y += n.position[1] ?? 0;
+		z += n.position[2] ?? 0;
+	}
+	return [
+		x,
+		y,
+		z
+	];
+}
+function parseCollider3D(R, node) {
+	const collider = node.collider;
+	validateCollider3D(collider, node.name);
+	if (collider.shape === "heightfield") return buildHeightfieldDesc3D(R, node);
+	const desc = buildColliderDesc3D(R, collider, node.name);
+	const offset = collider.offset;
+	if (Array.isArray(offset)) desc.setTranslation(offset[0] ?? 0, offset[1] ?? 0, offset[2] ?? 0);
+	return desc;
+}
+/**
+* `{shape:'heightfield'}` pulls its height grid from a Terrain3D CHILD of the
+* body — no duplicated data in the collider prop, terrain and collider can
+* never drift apart.
+*/
+function buildHeightfieldDesc3D(R, node) {
+	const terrain = node.children.find((c) => c instanceof Terrain3D);
+	if (!terrain) throw new IncantoError("BAD_FORMAT", `Collider on '${node.name}': heightfield needs a Terrain3D CHILD of this body — add { "type": "Terrain3D" } under the StaticBody3D; the collider reads its height grid.`, { prop: "collider" });
+	const hm = terrain._heightmap();
+	const nrows = hm.segsZ;
+	const ncols = hm.segsX;
+	const heights = new Float32Array((nrows + 1) * (ncols + 1));
+	for (let ix = 0; ix <= ncols; ix++) for (let iz = 0; iz <= nrows; iz++) heights[ix * (nrows + 1) + iz] = hm.heights[iz * (ncols + 1) + ix];
+	const desc = R.ColliderDesc.heightfield(nrows, ncols, heights, {
+		x: hm.width,
+		y: 1,
+		z: hm.depth
+	});
+	const offset = Array.isArray(node.collider.offset) ? node.collider.offset : [];
+	desc.setTranslation((terrain.position[0] ?? 0) + (offset[0] ?? 0), (terrain.position[1] ?? 0) + (offset[1] ?? 0), (terrain.position[2] ?? 0) + (offset[2] ?? 0));
+	return desc;
+}
+function buildColliderDesc3D(R, collider, nodeName) {
+	const shape = collider.shape;
+	if (shape === "box") {
+		const size = collider.size;
+		if (!Array.isArray(size) || size.length !== 3 || size.some((v) => typeof v !== "number")) throw new IncantoError("BAD_FORMAT", `Collider on '${nodeName}': box needs "size": [x, y, z].`);
+		return R.ColliderDesc.cuboid(size[0] / 2, size[1] / 2, size[2] / 2);
+	}
+	if (shape === "sphere") {
+		if (typeof collider.radius !== "number") throw new IncantoError("BAD_FORMAT", `Collider on '${nodeName}': sphere needs "radius".`);
+		return R.ColliderDesc.ball(collider.radius);
+	}
+	if (shape === "capsule") {
+		if (typeof collider.radius !== "number" || typeof collider.height !== "number") throw new IncantoError("BAD_FORMAT", `Collider on '${nodeName}': capsule needs "radius" and "height".`);
+		return R.ColliderDesc.capsule(collider.height / 2, collider.radius);
+	}
+	if (shape === "trimesh") {
+		const vertices = collider.vertices;
+		const indices = collider.indices;
+		if (!Array.isArray(vertices) || !Array.isArray(indices)) throw new IncantoError("BAD_FORMAT", `Collider on '${nodeName}': trimesh needs "vertices" (flat xyz) and "indices" (triangles).`);
+		return R.ColliderDesc.trimesh(new Float32Array(vertices), new Uint32Array(indices));
+	}
+	throw new IncantoError("BAD_FORMAT", `Collider on '${nodeName}': "shape" must be 'box', 'sphere', 'capsule', 'trimesh', or 'heightfield', got ${JSON.stringify(shape)}.`);
+}
+//#endregion
+export { enablePhysics3D as n, physics_3d_exports as r, Physics3D as t };

package/dist/react.d.ts

@@ -0,0 +1,65 @@
+import { c as JsonValue } from "./schema-CcoWb32N.js";
+import { n as BehaviorCtor, v as Engine, w as Scene } from "./behavior-BAQq7HGM.js";
+import { CSSProperties, ReactNode } from "react";
+
+//#region src/react/index.d.ts
+/** The common surface of Game2D/Game3D the React layer relies on. */
+interface GameHandle {
+  engine: Engine;
+  scene: Scene;
+  renderer: {
+    dispose(): void; /** Both renderers provide it (3D takes a z too) — world → canvas px. */
+    screenFromWorld?(wx: number, wy: number, wz?: number): {
+      x: number;
+      y: number;
+    };
+  };
+  dispose(): void;
+}
+/** The running game (null while booting). Must be used under <IncantoCanvas>. */
+declare function useGame(): GameHandle | null;
+/** The running engine (null while booting). */
+declare function useEngine(): Engine | null;
+/**
+* Subscribe to a node prop by path — re-renders ONLY when the value changes
+* (compared per frame via engine.updated). The React-HUD bread and butter:
+* `const text = useNodeProp<string>('UI/Score', 'text')`.
+*/
+declare function useNodeProp<T extends JsonValue>(path: string, prop: string): T | undefined;
+/**
+* Subscribe to a node signal — auto-disconnects on unmount and re-wires on
+* scene swaps. The handler may change between renders without re-wiring.
+*/
+declare function useSignal(path: string, signal: string, handler: (...args: unknown[]) => void): void;
+interface IncantoCanvasProps {
+  /** Scene JSON (cloned internally). Pass a stable reference — a new object re-boots. */
+  scene: unknown;
+  /** '2d' | '3d' (default: the scene's dimension, falling back to '2d'). */
+  render?: "2d" | "3d";
+  behaviors?: Record<string, BehaviorCtor>;
+  physics?: "auto" | boolean;
+  touch?: "auto" | boolean;
+  debug?: boolean;
+  seed?: number;
+  fixedHz?: number;
+  pixelRatio?: number;
+  antialias?: boolean;
+  /** 3D: pointer-look on the canvas. */
+  pointer?: boolean | {
+    lockOnClick?: boolean;
+  };
+  /** 'window' (default) | 'canvas' (tabIndex + focus scoped) | false. */
+  keyboard?: "window" | "canvas" | false;
+  className?: string;
+  style?: CSSProperties;
+  /** Shown in the overlay until the game is ready. */
+  fallback?: ReactNode;
+  onReady?: (game: GameHandle) => void;
+  /** DOM HUD overlay — absolutely positioned over the canvas, game context inside. */
+  children?: ReactNode;
+  /** @internal Test seam — replaces the createGame call. */
+  _gameFactory?: (opts: Record<string, unknown>) => Promise<GameHandle>;
+}
+declare function IncantoCanvas(props: IncantoCanvasProps): ReactNode;
+//#endregion
+export { GameHandle, IncantoCanvas, IncantoCanvasProps, useEngine, useGame, useNodeProp, useSignal };

package/dist/react.js

@@ -0,0 +1,209 @@
+import { n as jsonEquals, t as jsonClone } from "./json-BLk7H2Qa.js";
+import { createContext, useContext, useEffect, useRef, useState } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/react/index.tsx
+/**
+* incanto/react — embed an Incanto game in a React app like any component.
+*
+* ```tsx
+* import { IncantoCanvas, useNodeProp } from 'incanto/react';
+* import sceneJson from './game.scene.json';
+* import { PlayerControl } from './behaviors';
+*
+* <IncantoCanvas scene={sceneJson} behaviors={{ PlayerControl }}>
+*   <Hud />   // children = DOM HUD overlay, with useGame()/useNodeProp() access
+* </IncantoCanvas>
+* ```
+*
+* StrictMode-safe (every booted game is disposed), SSR-safe (boot happens in
+* an effect), and bundle-lean (the 2D or 3D stack lazy-loads by scene
+* dimension — a 2D game never pulls the 3D renderer). React is an optional
+* peer dependency: nothing here loads unless you import 'incanto/react'.
+*/
+const GameContext = createContext(null);
+/** The running game (null while booting). Must be used under <IncantoCanvas>. */
+function useGame() {
+	return useContext(GameContext);
+}
+/** The running engine (null while booting). */
+function useEngine() {
+	return useGame()?.engine ?? null;
+}
+/**
+* Subscribe to a node prop by path — re-renders ONLY when the value changes
+* (compared per frame via engine.updated). The React-HUD bread and butter:
+* `const text = useNodeProp<string>('UI/Score', 'text')`.
+*/
+function useNodeProp(path, prop) {
+	const game = useGame();
+	const [value, setValue] = useState(void 0);
+	useEffect(() => {
+		if (!game) return;
+		const read = () => {
+			let next;
+			try {
+				const node = game.engine.scene?.root.getNodeOrNull(path);
+				next = node ? node[prop] : void 0;
+			} catch {
+				next = void 0;
+			}
+			setValue((prev) => {
+				if (jsonEquals(prev ?? null, next ?? null)) return prev;
+				return next === void 0 ? void 0 : jsonClone(next);
+			});
+		};
+		read();
+		const offUpdated = game.engine.updated.connect(read);
+		const offScene = game.engine.sceneChanged.connect(read);
+		return () => {
+			offUpdated();
+			offScene();
+		};
+	}, [
+		game,
+		path,
+		prop
+	]);
+	return value;
+}
+/**
+* Subscribe to a node signal — auto-disconnects on unmount and re-wires on
+* scene swaps. The handler may change between renders without re-wiring.
+*/
+function useSignal(path, signal, handler) {
+	const game = useGame();
+	const handlerRef = useRef(handler);
+	handlerRef.current = handler;
+	useEffect(() => {
+		if (!game) return;
+		const wire = () => {
+			try {
+				const node = game.engine.scene?.root.getNodeOrNull(path);
+				return node ? node.on(signal, (...args) => handlerRef.current(...args)) : null;
+			} catch {
+				return null;
+			}
+		};
+		let off = wire();
+		const offScene = game.engine.sceneChanged.connect(() => {
+			off?.();
+			off = wire();
+		});
+		return () => {
+			off?.();
+			offScene();
+		};
+	}, [
+		game,
+		path,
+		signal
+	]);
+}
+function shallowEqual(a, b) {
+	if (a === b) return true;
+	if (!a || !b) return false;
+	const keysA = Object.keys(a);
+	return keysA.length === Object.keys(b).length && keysA.every((k) => a[k] === b[k]);
+}
+/**
+* Inline `behaviors={{ PlayerControl }}` creates a new object every render —
+* keep the previous reference while the contents are shallow-equal so the
+* boot effect never sees a phantom change (no re-boot loops).
+*/
+function useStableShallow(value) {
+	const ref = useRef(value);
+	if (!shallowEqual(value, ref.current)) ref.current = value;
+	return ref.current;
+}
+function resolveKeyboard(keyboard, canvas) {
+	if (keyboard === "canvas") {
+		canvas.tabIndex = 0;
+		canvas.focus?.();
+		return canvas;
+	}
+	if (keyboard === false) return false;
+}
+function IncantoCanvas(props) {
+	const canvasRef = useRef(null);
+	const containerRef = useRef(null);
+	const [game, setGame] = useState(null);
+	const propsRef = useRef(props);
+	propsRef.current = props;
+	const mode = props.render ?? props.scene.dimension ?? "2d";
+	const { scene, _gameFactory } = props;
+	const behaviors = useStableShallow(props.behaviors);
+	useEffect(() => {
+		const canvas = canvasRef.current;
+		const container = containerRef.current;
+		if (!canvas || !container) return;
+		let disposed = false;
+		let booted = null;
+		(async () => {
+			const latest = propsRef.current;
+			const keyboard = resolveKeyboard(latest.keyboard, canvas);
+			const opts = {
+				canvas,
+				scene,
+				behaviors,
+				physics: latest.physics,
+				touch: latest.touch,
+				touchContainer: container,
+				debug: latest.debug,
+				seed: latest.seed,
+				fixedHz: latest.fixedHz,
+				pixelRatio: latest.pixelRatio,
+				antialias: latest.antialias,
+				pointer: latest.pointer,
+				...keyboard !== void 0 ? { keyboard } : {}
+			};
+			const next = await (_gameFactory ?? (mode === "3d" ? async (o) => (await import("./create-game-BdjpTHrW.js").then((n) => n.n)).createGame3D(o) : async (o) => (await import("./create-game-CZHROKcT.js").then((n) => n.n)).createGame2D(o)))(opts);
+			if (disposed) {
+				next.dispose();
+				return;
+			}
+			booted = next;
+			setGame(next);
+			propsRef.current.onReady?.(next);
+		})();
+		return () => {
+			disposed = true;
+			booted?.dispose();
+			setGame(null);
+		};
+	}, [
+		scene,
+		mode,
+		behaviors,
+		_gameFactory
+	]);
+	return /* @__PURE__ */ jsxs("div", {
+		ref: containerRef,
+		className: props.className,
+		style: {
+			position: "relative",
+			width: "100%",
+			height: "100%",
+			...props.style
+		},
+		children: [/* @__PURE__ */ jsx("canvas", {
+			ref: canvasRef,
+			style: {
+				width: "100%",
+				height: "100%",
+				display: "block"
+			}
+		}), /* @__PURE__ */ jsx("div", {
+			style: {
+				position: "absolute",
+				inset: 0,
+				pointerEvents: "none"
+			},
+			children: /* @__PURE__ */ jsx(GameContext.Provider, {
+				value: game,
+				children: game ? props.children : props.fallback ?? null
+			})
+		})]
+	});
+}
+//#endregion
+export { IncantoCanvas, useEngine, useGame, useNodeProp, useSignal };