@react-three/rapier 1.1.1 → 1.2.0

package/dist/declarations/src/components/Physics.d.ts

@@ -77,6 +77,10 @@ export interface RapierContext {
      * The Rapier physics world
      */
     world: World;
+    /**
+     * overwriting the Rapier physics world with a restored snapshot
+     */
+    setWorld: (world: World) => void;
     /**
      * If the physics simulation is paused
      */

package/dist/declarations/src/utils/singleton-proxy.d.ts

@@ -7,4 +7,5 @@
 export declare const createSingletonProxy: <SingletonClass extends object, CreationFn extends () => SingletonClass = () => SingletonClass>(createInstance: CreationFn) => {
     proxy: SingletonClass;
     reset: () => void;
+    set: (newInstance: SingletonClass) => void;
 };

package/dist/react-three-rapier.cjs.dev.js

@@ -571,7 +571,9 @@ const useMutableCallback = fn => {
 
 
 const useRapier = () => {
-  return React.useContext(rapierContext);
+  const rapier = React.useContext(rapierContext);
+  if (!rapier) throw new Error("react-three-rapier: useRapier must be used within <Physics />!");
+  return rapier;
 };
 /**
  * Registers a callback to be called before the physics step
@@ -680,6 +682,10 @@ const createSingletonProxy = createInstance => {
   const reset = () => {
     instance = undefined;
   };
+
+  const set = newInstance => {
+    instance = newInstance;
+  };
   /**
    * Return the proxy and a reset function
    */
@@ -687,7 +693,8 @@ const createSingletonProxy = createInstance => {
 
   return {
     proxy,
-    reset
+    reset,
+    set
   };
 };
 
@@ -762,7 +769,8 @@ const Physics = props => {
 
   const {
     proxy: worldProxy,
-    reset: resetWorldProxy
+    reset: resetWorldProxy,
+    set: setWorldProxy
   } = useConst(() => createSingletonProxy(() => new rapier.World(vectorArrayToVector3(gravity))));
   React.useEffect(() => {
     return () => {
@@ -1018,6 +1026,9 @@ const Physics = props => {
   const context = React.useMemo(() => ({
     rapier,
     world: worldProxy,
+    setWorld: world => {
+      setWorldProxy(world);
+    },
     physicsOptions: {
       colliders,
       gravity

package/dist/react-three-rapier.cjs.prod.js

@@ -571,7 +571,9 @@ const useMutableCallback = fn => {
 
 
 const useRapier = () => {
-  return React.useContext(rapierContext);
+  const rapier = React.useContext(rapierContext);
+  if (!rapier) throw new Error("react-three-rapier: useRapier must be used within <Physics />!");
+  return rapier;
 };
 /**
  * Registers a callback to be called before the physics step
@@ -680,6 +682,10 @@ const createSingletonProxy = createInstance => {
   const reset = () => {
     instance = undefined;
   };
+
+  const set = newInstance => {
+    instance = newInstance;
+  };
   /**
    * Return the proxy and a reset function
    */
@@ -687,7 +693,8 @@ const createSingletonProxy = createInstance => {
 
   return {
     proxy,
-    reset
+    reset,
+    set
   };
 };
 
@@ -762,7 +769,8 @@ const Physics = props => {
 
   const {
     proxy: worldProxy,
-    reset: resetWorldProxy
+    reset: resetWorldProxy,
+    set: setWorldProxy
   } = useConst(() => createSingletonProxy(() => new rapier.World(vectorArrayToVector3(gravity))));
   React.useEffect(() => {
     return () => {
@@ -1018,6 +1026,9 @@ const Physics = props => {
   const context = React.useMemo(() => ({
     rapier,
     world: worldProxy,
+    setWorld: world => {
+      setWorldProxy(world);
+    },
     physicsOptions: {
       colliders,
       gravity

package/dist/react-three-rapier.esm.js

@@ -546,7 +546,9 @@ const useMutableCallback = fn => {
 
 
 const useRapier = () => {
-  return useContext(rapierContext);
+  const rapier = useContext(rapierContext);
+  if (!rapier) throw new Error("react-three-rapier: useRapier must be used within <Physics />!");
+  return rapier;
 };
 /**
  * Registers a callback to be called before the physics step
@@ -655,6 +657,10 @@ const createSingletonProxy = createInstance => {
   const reset = () => {
     instance = undefined;
   };
+
+  const set = newInstance => {
+    instance = newInstance;
+  };
   /**
    * Return the proxy and a reset function
    */
@@ -662,7 +668,8 @@ const createSingletonProxy = createInstance => {
 
   return {
     proxy,
-    reset
+    reset,
+    set
   };
 };
 
@@ -737,7 +744,8 @@ const Physics = props => {
 
   const {
     proxy: worldProxy,
-    reset: resetWorldProxy
+    reset: resetWorldProxy,
+    set: setWorldProxy
   } = useConst(() => createSingletonProxy(() => new rapier.World(vectorArrayToVector3(gravity))));
   useEffect(() => {
     return () => {
@@ -993,6 +1001,9 @@ const Physics = props => {
   const context = useMemo(() => ({
     rapier,
     world: worldProxy,
+    setWorld: world => {
+      setWorldProxy(world);
+    },
     physicsOptions: {
       colliders,
       gravity

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@react-three/rapier",
-  "version": "1.1.1",
+  "version": "1.2.0",
   "source": "src/index.ts",
   "main": "dist/react-three-rapier.cjs.js",
   "module": "dist/react-three-rapier.esm.js",
@@ -12,10 +12,10 @@
   "devDependencies": {
     "@react-three/drei": "9.74.14",
     "@react-three/fiber": "8.9.1",
-    "@react-three/test-renderer": "8.0.17",
+    "@react-three/test-renderer": "8.1.5",
     "@types/react-dom": "18.0.2",
     "@types/three": "^0.152.1",
-    "@vitejs/plugin-react": "^2.1.0",
+    "@vitejs/plugin-react": "^4.0.3",
     "@vitest/ui": "0.32.0",
     "happy-dom": "9.19.2",
     "react": "18.2.0",

package/readme.md

@@ -413,7 +413,7 @@ const Scene = () => {
       // While Rapier's return types need conversion, setting values can be done directly with Three.js types
       rigidBody.current.setTranslation(position, true);
       rigidBody.current.setRotation(quaternion, true);
-      rigidBody.current.setAngVel({ x: 0, y: 2, z: 0 }, true);
+      rigidBody.current.setAngvel({ x: 0, y: 2, z: 0 }, true);
     }
   }, []);
 
@@ -812,3 +812,39 @@ Setting `<Physics updateLoop="independent" />` will make the physics simulation
   <Physics updateLoop="independent">...</Physics>
 </Canvas>
 ```
+
+### Snapshots
+The `world` can be serialized as a `Uint8Array` using `world.takeSnapshot()`, see Rapier's docs on [Serialization](https://rapier.rs/docs/user_guides/javascript/serialization/) for more info.
+
+The snapshot can be used to construct a new world. In `r3/rapier`, you need to replace the world with this snapshot.
+
+> [!NOTE]
+> This only works if the snapshotted world is identical to the restored one. If objects, or the order of creation of objects vary, expect RigidBodies to scramble.
+
+```tsx
+import { useRapier } from '@react-three/rapier';
+
+const SnapshottingComponent = () => {
+  const { world, setWorld, rapier } = useRapier();
+  const worldSnapshot = useRef<Uint8Array>();
+
+  // Store the snapshot
+  const takeSnapshot = () => {
+    const snapshot = world.takeSnapshot()
+    worldSnapshot.current = snapshot
+  }
+
+  // Create a new World from the snapshot, and replace the current one
+  const restoreSnapshot = () => {
+    setWorld(rapier.World.restoreSnapshot(worldSnapshot.current))
+  }
+
+  return <>
+    <Rigidbody>...</RigidBody>
+    <Rigidbody>...</RigidBody>
+    <Rigidbody>...</RigidBody>
+    <Rigidbody>...</RigidBody>
+    <Rigidbody>...</RigidBody>
+  </>
+}
+```