react-three-game 0.0.60 → 0.0.61

package/package.json

@@ -1,14 +1,20 @@
 {
   "name": "react-three-game",
-  "version": "0.0.60",
+  "version": "0.0.61",
   "description": "high performance 3D game engine for React",
   "main": "dist/index.js",
   "module": "dist/index.js",
   "types": "dist/index.d.ts",
+  "files": [
+    "dist",
+    "README.md",
+    "LICENSE"
+  ],
   "scripts": {
-    "watch": "tsc --watch",
+    "clean": "rm -rf dist",
+    "watch": "npm run clean && tsc --watch",
     "dev": "concurrently \"npm run watch\" \"cd docs && npm run dev\"",
-    "build": "tsc",
+    "build": "npm run clean && tsc",
     "release": "npm run build && npm publish --access public"
   },
   "keywords": [],

package/.gitattributes

@@ -1,2 +0,0 @@
-# Auto detect text files and perform LF normalization
-* text=auto

package/.github/copilot-instructions.md

@@ -1,83 +0,0 @@
-# react-three-game - AI Coding Agent Instructions
-
-## Project Overview
-AI-native 3D game engine where **scenes are JSON prefabs**. Unity-like GameObject+Component architecture built on React Three Fiber + WebGPU.
-
-## Monorepo Structure
-- **`/src`** → Library source, builds to `/dist`, published as `react-three-game`
-- **`/docs`** → Next.js 16 site, imports library via `"react-three-game": "file:.."`
-- **`npm run dev`** → Runs `tsc --watch` + Next.js concurrently (hot reload works)
-
-## Prefab JSON Schema
-```typescript
-// See docs/app/samples/*.json for examples
-interface Prefab { id?: string; name?: string; root: GameObject; }
-interface GameObject {
-  id: string;                    // Use crypto.randomUUID() for new nodes
-  disabled?: boolean;
-  components?: Record<string, { type: string; properties: any }>;
-  children?: GameObject[];
-}
-```
-**Transforms are LOCAL** (parent-relative). Rotations in radians. Colors as CSS strings.
-
-## Component System (`src/tools/prefabeditor/components/`)
-Every component has `Editor` (inspector UI) + optional `View` (Three.js render):
-```typescript
-const MyComponent: Component = {
-  name: 'MyComponent',  // TitleCase for registry, lowercase key in JSON
-  Editor: ({ component, onUpdate }) => <input onChange={e => onUpdate({ value: e.target.value })} />,
-  View: ({ properties, children }) => <group>{children}</group>,  // Wrapper components accept children
-  defaultProperties: { value: 0 }
-};
-```
-**To add a component:** Create file → export from `components/index.ts` → auto-registered in `PrefabRoot.tsx`.
-
-## Key Files
-| File | Purpose |
-|------|---------|
-| `src/index.ts` | All public exports - add new features here |
-| `src/tools/prefabeditor/PrefabRoot.tsx` | Pure renderer - renders prefab as Three.js objects for R3F integration |
-| `src/tools/prefabeditor/PrefabEditor.tsx` | Managed scene with editor UI and play/pause controls for physics |
-| `src/tools/prefabeditor/utils.ts` | Tree helpers: `findNode`, `updateNode`, `deleteNode`, `cloneNode` |
-| `src/shared/GameCanvas.tsx` | WebGPU renderer setup (use `MeshStandardNodeMaterial`) |
-
-## Usage Modes
-
-**PrefabRoot**: Pure renderer for embedding prefab data in standard R3F applications. Render it inside a regular `@react-three/fiber` `Canvas`. `GameCanvas` provides the WebGPU canvas setup. Add a `Physics` wrapper to enable physics. Use this to integrate prefabs into larger R3F scenes.
-
-**PrefabEditor**: Managed scene with editor UI and play/pause controls for physics. Full authoring tool for level design and prototyping. Includes canvas, physics, transform gizmos, and inspector. Physics only runs in play mode. Can pass R3F components as children.
-
-## Critical Patterns
-
-### Tree Manipulation (Immutable)
-```typescript
-import { updateNode, findNode, deleteNode } from 'react-three-game';
-const newRoot = updateNode(root, nodeId, node => ({ ...node, components: { ...node.components, physics: {...} } }));
-```
-
-### WebGPU Materials
-Use node materials only: `MeshStandardNodeMaterial`, `MeshBasicNodeMaterial` (not `MeshStandardMaterial`).
-
-### Physics Wrapping
-`PhysicsComponent.View` wraps children in `<RigidBody>` only when `editMode=false`. Edit mode pauses physics.
-
-### Model Instancing
-Set `model.properties.instanced = true` → uses `InstanceProvider.tsx` for batched rendering with physics.
-
-## Built-in Components
-`Transform`, `Geometry` (box/sphere/plane/cylinder), `Material` (color/texture), `Physics` (dynamic/fixed), `Model` (GLB/FBX), `SpotLight`, `DirectionalLight`, `AmbientLight`, `Text`
-
-## Custom Components (User-space)
-See `docs/app/demo/editor/RotatorComponent.tsx` for runtime behavior example using `useFrame`. Register with `registerComponent()` before rendering `<PrefabEditor>`.
-
-## Development Workflow
-1. **Edit library**: Modify `/src`, auto-rebuilds via `tsc --watch`
-2. **Test in docs**: Changes reflect at `http://localhost:3000`
-3. **Add sample prefabs**: `docs/app/samples/*.json`
-4. **Release**: `npm run release` (builds + publishes)
-
-## Conventions
-- Component keys: lowercase in JSON (`"transform"`), TitleCase in registry (`"Transform"`)
-- Asset paths: Relative to `/public` (e.g., `models/cars/taxi/model.glb`)
-- All Three.js renders must be inside `<GameCanvas>` (WebGPU init required)

package/.github/workflows/nextjs.yml

@@ -1,99 +0,0 @@
-# Sample workflow for building and deploying a Next.js site to GitHub Pages
-#
-# To get started with Next.js see: https://nextjs.org/docs/getting-started
-#
-name: Deploy Next.js site to Pages
-
-on:
-  # Runs on pushes targeting the default branch
-  push:
-    branches: ["main"]
-
-  # Allows you to run this workflow manually from the Actions tab
-  workflow_dispatch:
-
-# Sets permissions of the GITHUB_TOKEN to allow deployment to GitHub Pages
-permissions:
-  contents: read
-  pages: write
-  id-token: write
-
-# Allow only one concurrent deployment, skipping runs queued between the run in-progress and latest queued.
-# However, do NOT cancel in-progress runs as we want to allow these production deployments to complete.
-concurrency:
-  group: "pages"
-  cancel-in-progress: false
-
-jobs:
-  # Build job
-  build:
-    runs-on: ubuntu-latest
-    steps:
-      - name: Checkout
-        uses: actions/checkout@v4
-      - name: Detect package manager
-        id: detect-package-manager
-        run: |
-          if [ -f "${{ github.workspace }}/yarn.lock" ]; then
-            echo "manager=yarn" >> $GITHUB_OUTPUT
-            echo "command=install" >> $GITHUB_OUTPUT
-            echo "runner=yarn" >> $GITHUB_OUTPUT
-            exit 0
-          elif [ -f "${{ github.workspace }}/package.json" ]; then
-            echo "manager=npm" >> $GITHUB_OUTPUT
-            echo "command=install" >> $GITHUB_OUTPUT
-            echo "runner=npx --no-install" >> $GITHUB_OUTPUT
-            exit 0
-          else
-            echo "Unable to determine package manager"
-            exit 1
-          fi
-      - name: Setup Node
-        uses: actions/setup-node@v4
-        with:
-          node-version: "20"
-          cache: ${{ steps.detect-package-manager.outputs.manager }}
-      - name: Setup Pages
-        uses: actions/configure-pages@v5
-        with:
-          # Automatically inject basePath in your Next.js configuration file and disable
-          # server side image optimization (https://nextjs.org/docs/api-reference/next/image#unoptimized).
-          #
-          # You may remove this line if you want to manage the configuration yourself.
-          static_site_generator: next
-      - name: Restore cache
-        uses: actions/cache@v4
-        with:
-          path: |
-            docs/.next/cache
-          # Generate a new cache whenever packages or source files change.
-          key: ${{ runner.os }}-nextjs-${{ hashFiles('**/package-lock.json', '**/yarn.lock') }}-${{ hashFiles('**.[jt]s', '**.[jt]sx') }}
-          # If source files changed but packages didn't, rebuild from a prior cache.
-          restore-keys: |
-            ${{ runner.os }}-nextjs-${{ hashFiles('**/package-lock.json', '**/yarn.lock') }}-
-      - name: Install root dependencies
-        run: ${{ steps.detect-package-manager.outputs.manager }} ${{ steps.detect-package-manager.outputs.command }}
-      - name: Build library
-        run: npm run build
-      - name: Install docs dependencies
-        working-directory: ./docs
-        run: ${{ steps.detect-package-manager.outputs.manager }} ${{ steps.detect-package-manager.outputs.command }}
-      - name: Build Next.js docs
-        working-directory: ./docs
-        run: ${{ steps.detect-package-manager.outputs.runner }} next build
-      - name: Upload artifact
-        uses: actions/upload-pages-artifact@v3
-        with:
-          path: ./docs/out
-
-  # Deployment job
-  deploy:
-    environment:
-      name: github-pages
-      url: ${{ steps.deployment.outputs.page_url }}
-    runs-on: ubuntu-latest
-    needs: build
-    steps:
-      - name: Deploy to GitHub Pages
-        id: deployment
-        uses: actions/deploy-pages@v4

package/.gitmodules

@@ -1,3 +0,0 @@
-[submodule "react-three-game-skill"]
-	path = react-three-game-skill
-	url = https://github.com/prnthh/react-three-game-skill

package/dist/tools/dragdrop/page.d.ts

@@ -1 +0,0 @@
-export default function Home(): import("react/jsx-runtime").JSX.Element;

package/dist/tools/dragdrop/page.js

@@ -1,11 +0,0 @@
-"use client";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Physics, RigidBody } from "@react-three/rapier";
-import { OrbitControls } from "@react-three/drei";
-import { useState } from "react";
-import { DragDropLoader } from "./index";
-import GameCanvas from "../../shared/GameCanvas";
-export default function Home() {
-    const [models, setModels] = useState([]);
-    return (_jsx(DragDropLoader, { onModelLoaded: model => setModels(prev => [...prev, model]), className: "w-full items-center justify-items-center min-h-screen", style: { height: "100vh" }, children: _jsx("div", { className: "w-full items-center justify-items-center min-h-screen", style: { height: "100vh" }, children: _jsx(GameCanvas, { children: _jsxs(Physics, { children: [_jsx(RigidBody, { children: _jsxs("mesh", { castShadow: true, children: [_jsx("boxGeometry", { args: [1, 1, 1] }), _jsx("meshStandardMaterial", { color: "orange" })] }) }), _jsx(RigidBody, { type: "fixed", children: _jsxs("mesh", { position: [0, -2, 0], scale: [10, 0.1, 10], receiveShadow: true, children: [_jsx("boxGeometry", {}), _jsx("meshStandardMaterial", { color: "gray" })] }) }), models.map((model, idx) => (_jsx("primitive", { object: model, position: [0, 0, 0] }, idx))), _jsx("ambientLight", { intensity: 0.5 }), _jsx("pointLight", { position: [10, 10, 10], castShadow: true, intensity: 1000 }), _jsx(OrbitControls, {})] }) }) }) }));
-}

package/dist/tools/prefabeditor/EntityEvents.d.ts

@@ -1,54 +0,0 @@
-import type { RapierRigidBody } from '@react-three/rapier';
-export type EntityEventType = 'sensor:enter' | 'sensor:exit' | 'collision:enter' | 'collision:exit';
-export interface EntityEventPayload {
-    sourceEntityId: string;
-    targetEntityId: string | null;
-    targetRigidBody: RapierRigidBody | null | undefined;
-}
-type EventHandler = (payload: EntityEventPayload) => void;
-/**
- * Entity event system for physics interactions.
- *
- * Events:
- * - sensor:enter - Fired when something enters a sensor collider
- * - sensor:exit - Fired when something exits a sensor collider
- * - collision:enter - Fired when a collision starts
- * - collision:exit - Fired when a collision ends
- */
-export declare const entityEvents: {
-    /**
-     * Emit an event to all subscribers
-     */
-    emit(type: EntityEventType, payload: EntityEventPayload): void;
-    /**
-     * Subscribe to an event type
-     * @returns Unsubscribe function
-     */
-    on(type: EntityEventType, handler: EventHandler): () => void;
-    /**
-     * Unsubscribe from an event type
-     */
-    off(type: EntityEventType, handler: EventHandler): void;
-    /**
-     * Remove all subscribers (useful for cleanup)
-     */
-    clear(): void;
-};
-/**
- * React hook to subscribe to entity events.
- * Automatically cleans up on unmount.
- *
- * @example
- * useEntityEvent('sensor:enter', (payload) => {
- *   if (payload.sourceEntityId === 'trigger-zone') {
- *     console.log('Player entered trigger zone!');
- *   }
- * });
- */
-export declare function useEntityEvent(type: EntityEventType, handler: EventHandler, deps?: any[]): void;
-/**
- * Helper to extract entity ID from Rapier collision data.
- * Entity IDs are stored in RigidBody userData.
- */
-export declare function getEntityIdFromRigidBody(rigidBody: RapierRigidBody | null | undefined): string | null;
-export {};

package/dist/tools/prefabeditor/EntityEvents.js

@@ -1,85 +0,0 @@
-import { useEffect, useCallback } from 'react';
-// Internal subscriber storage
-const subscribers = new Map();
-/**
- * Entity event system for physics interactions.
- *
- * Events:
- * - sensor:enter - Fired when something enters a sensor collider
- * - sensor:exit - Fired when something exits a sensor collider
- * - collision:enter - Fired when a collision starts
- * - collision:exit - Fired when a collision ends
- */
-export const entityEvents = {
-    /**
-     * Emit an event to all subscribers
-     */
-    emit(type, payload) {
-        const handlers = subscribers.get(type);
-        if (handlers) {
-            handlers.forEach(handler => {
-                try {
-                    handler(payload);
-                }
-                catch (e) {
-                    console.error(`Error in entityEvents handler for ${type}:`, e);
-                }
-            });
-        }
-    },
-    /**
-     * Subscribe to an event type
-     * @returns Unsubscribe function
-     */
-    on(type, handler) {
-        if (!subscribers.has(type)) {
-            subscribers.set(type, new Set());
-        }
-        subscribers.get(type).add(handler);
-        return () => {
-            var _a;
-            (_a = subscribers.get(type)) === null || _a === void 0 ? void 0 : _a.delete(handler);
-        };
-    },
-    /**
-     * Unsubscribe from an event type
-     */
-    off(type, handler) {
-        var _a;
-        (_a = subscribers.get(type)) === null || _a === void 0 ? void 0 : _a.delete(handler);
-    },
-    /**
-     * Remove all subscribers (useful for cleanup)
-     */
-    clear() {
-        subscribers.clear();
-    }
-};
-/**
- * React hook to subscribe to entity events.
- * Automatically cleans up on unmount.
- *
- * @example
- * useEntityEvent('sensor:enter', (payload) => {
- *   if (payload.sourceEntityId === 'trigger-zone') {
- *     console.log('Player entered trigger zone!');
- *   }
- * });
- */
-export function useEntityEvent(type, handler, deps = []) {
-    const stableHandler = useCallback(handler, deps);
-    useEffect(() => {
-        return entityEvents.on(type, stableHandler);
-    }, [type, stableHandler]);
-}
-/**
- * Helper to extract entity ID from Rapier collision data.
- * Entity IDs are stored in RigidBody userData.
- */
-export function getEntityIdFromRigidBody(rigidBody) {
-    var _a;
-    if (!rigidBody)
-        return null;
-    const userData = rigidBody.userData;
-    return (_a = userData === null || userData === void 0 ? void 0 : userData.entityId) !== null && _a !== void 0 ? _a : null;
-}

package/dist/tools/prefabeditor/page.d.ts

@@ -1 +0,0 @@
-export default function PrefabEditorPage(): import("react/jsx-runtime").JSX.Element;

package/dist/tools/prefabeditor/page.js

@@ -1,5 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import PrefabEditor from "./PrefabEditor";
-export default function PrefabEditorPage() {
-    return _jsx("div", { style: { width: '100%', height: '100%' }, children: _jsx(PrefabEditor, { children: _jsx("directionalLight", { position: [5, 10, 7.5], intensity: 1, castShadow: true }) }) });
-}

package/react-three-game-skill/.gitattributes

@@ -1,2 +0,0 @@
-# Auto detect text files and perform LF normalization
-* text=auto

package/react-three-game-skill/README.md

@@ -1,7 +0,0 @@
-Agent skill for [react-three-game](https://github.com/prnthh/react-three-game)
-
-Gives your agent the ability to make 3D scenes, physics simulations and games.
-
-```
-npx skills add https://github.com/prnthh/react-three-game-skill
-```