@react-three/rapier 0.1.1 → 0.3.0

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

@@ -1,9 +1,9 @@
-import React, { useRef, useMemo, createContext, useContext, useEffect, useLayoutEffect, forwardRef, useImperativeHandle, useState, memo } from 'react';
+import React, { useRef, useState, useLayoutEffect, useMemo, createContext, useContext, useEffect, forwardRef, useImperativeHandle, memo } from 'react';
 import { useAsset } from 'use-asset';
 import { useFrame } from '@react-three/fiber';
-import { ColliderDesc, CoefficientCombineRule, ShapeType } from '@dimforge/rapier3d-compat';
+import { ColliderDesc, CoefficientCombineRule, ActiveEvents, EventQueue, ShapeType } from '@dimforge/rapier3d-compat';
 export { CoefficientCombineRule, Collider as RapierCollider, RigidBody as RapierRigidBody } from '@dimforge/rapier3d-compat';
-import { Quaternion, Vector3, Object3D, Euler, CylinderBufferGeometry, BufferGeometry, BufferAttribute, SphereBufferGeometry, BoxBufferGeometry } from 'three';
+import { Vector3, Quaternion, Object3D, Euler, CylinderBufferGeometry, BufferGeometry, BufferAttribute, SphereBufferGeometry, BoxBufferGeometry } from 'three';
 
 const vectorArrayToObject = arr => {
   const [x, y, z] = arr;
@@ -38,11 +38,11 @@ const scaleColliderArgs = (shape, args, scale) => {
   const scaleArray = [scale.x, scale.y, scale.z];
   return newArgs.map((arg, index) => scaleArray[index] * arg);
 };
-const createColliderFromOptions = (options, world, body, scale = {
+const createColliderFromOptions = (options, world, rigidBodyHandle, scale = {
   x: 1,
   y: 1,
   z: 1
-}) => {
+}, hasCollisionEvents = false) => {
   var _options$shape, _options$args, _options$restitution, _options$restitutionC, _options$friction, _options$frictionComb;
 
   const mass = (options === null || options === void 0 ? void 0 : options.mass) || 1;
@@ -60,7 +60,12 @@ const createColliderFromOptions = (options, world, body, scale = {
     y: ry,
     z: rz,
     w: 1
-  }).setRestitution((_options$restitution = options === null || options === void 0 ? void 0 : options.restitution) !== null && _options$restitution !== void 0 ? _options$restitution : 0).setRestitutionCombineRule((_options$restitutionC = options === null || options === void 0 ? void 0 : options.restitutionCombineRule) !== null && _options$restitutionC !== void 0 ? _options$restitutionC : CoefficientCombineRule.Average).setFriction((_options$friction = options === null || options === void 0 ? void 0 : options.friction) !== null && _options$friction !== void 0 ? _options$friction : 0.7).setFrictionCombineRule((_options$frictionComb = options === null || options === void 0 ? void 0 : options.frictionCombineRule) !== null && _options$frictionComb !== void 0 ? _options$frictionComb : CoefficientCombineRule.Average); // If any of the mass properties are specified, add mass properties
+  }).setRestitution((_options$restitution = options === null || options === void 0 ? void 0 : options.restitution) !== null && _options$restitution !== void 0 ? _options$restitution : 0).setRestitutionCombineRule((_options$restitutionC = options === null || options === void 0 ? void 0 : options.restitutionCombineRule) !== null && _options$restitutionC !== void 0 ? _options$restitutionC : CoefficientCombineRule.Average).setFriction((_options$friction = options === null || options === void 0 ? void 0 : options.friction) !== null && _options$friction !== void 0 ? _options$friction : 0.7).setFrictionCombineRule((_options$frictionComb = options === null || options === void 0 ? void 0 : options.frictionCombineRule) !== null && _options$frictionComb !== void 0 ? _options$frictionComb : CoefficientCombineRule.Average);
+
+  if (hasCollisionEvents) {
+    colliderDesc = colliderDesc.setActiveEvents(ActiveEvents.COLLISION_EVENTS);
+  } // If any of the mass properties are specified, add mass properties
+
 
   if (options !== null && options !== void 0 && options.mass || options !== null && options !== void 0 && options.centerOfMass || options !== null && options !== void 0 && options.principalAngularInertia) {
     colliderDesc.setDensity(0);
@@ -80,12 +85,13 @@ const createColliderFromOptions = (options, world, body, scale = {
     });
   }
 
-  const collider = world.createCollider(colliderDesc, body.handle);
+  const collider = world.createCollider(colliderDesc, rigidBodyHandle);
   return collider;
 };
-const createCollidersFromChildren = (object, rigidBody, type, world) => {
+const createCollidersFromChildren = (object, rigidBody, type, world, hasCollisionEvents = false) => {
   const colliders = [];
   let desc;
+  let offset = new Vector3();
   object.traverse(child => {
     if ("isMesh" in child) {
       const {
@@ -112,6 +118,7 @@ const createCollidersFromChildren = (object, rigidBody, type, world) => {
               boundingBox
             } = geometry;
             const size = boundingBox.getSize(new Vector3());
+            boundingBox.getCenter(offset);
             desc = ColliderDesc.cuboid(size.x / 2 * scale.x, size.y / 2 * scale.y, size.z / 2 * scale.z);
           }
           break;
@@ -123,6 +130,7 @@ const createCollidersFromChildren = (object, rigidBody, type, world) => {
               boundingSphere
             } = geometry;
             const radius = boundingSphere.radius * scale.x;
+            offset.copy(boundingSphere.center);
             desc = ColliderDesc.ball(radius);
           }
           break;
@@ -147,12 +155,17 @@ const createCollidersFromChildren = (object, rigidBody, type, world) => {
 
 
       const parentWorldScale = child.parent.getWorldScale(new Vector3());
-      desc.setTranslation(x * parentWorldScale.x, y * parentWorldScale.y, z * parentWorldScale.z).setRotation({
+      desc.setTranslation((x + offset.x) * parentWorldScale.x, (y + offset.y) * parentWorldScale.y, (z + offset.z) * parentWorldScale.z).setRotation({
         x: rx,
         y: ry,
         z: rz,
         w: rw
       });
+
+      if (hasCollisionEvents) {
+        desc.setActiveEvents(ActiveEvents.COLLISION_EVENTS);
+      }
+
       const collider = world.createCollider(desc, rigidBody.handle);
       colliders.push(collider);
     }
@@ -171,6 +184,99 @@ const scaleVertices = (vertices, scale) => {
   return scaledVerts;
 };
 
+// TODO: Flesh this out
+const createRigidBodyApi = ref => {
+  return {
+    raw: () => ref.current(),
+
+    get handle() {
+      return ref.current().handle;
+    },
+
+    applyImpulse({
+      x,
+      y,
+      z
+    }) {
+      ref.current().applyImpulse({
+        x,
+        y,
+        z
+      }, true);
+    },
+
+    applyTorqueImpulse({
+      x,
+      y,
+      z
+    }) {
+      ref.current().applyTorqueImpulse({
+        x,
+        y,
+        z
+      }, true);
+    },
+
+    translation() {
+      const {
+        x,
+        y,
+        z
+      } = ref.current().translation();
+      return new Vector3(x, y, z);
+    },
+
+    rotation() {
+      const {
+        x,
+        y,
+        z,
+        w
+      } = ref.current().rotation();
+      return new Quaternion(x, y, z, w);
+    }
+
+  };
+}; // TODO: Flesh this out
+
+const createColliderApi = ref => {
+  return {
+    raw: () => ref.current(),
+
+    get handle() {
+      return ref.current().handle;
+    }
+
+  };
+};
+const createWorldApi = ref => {
+  return {
+    raw: () => ref.current(),
+    getCollider: handle => ref.current().getCollider(handle),
+    getRigidBody: handle => ref.current().getRigidBody(handle),
+    createRigidBody: desc => ref.current().createRigidBody(desc),
+    createCollider: (desc, rigidBodyHandle) => ref.current().createCollider(desc, rigidBodyHandle),
+    removeRigidBody: rigidBody => ref.current().removeRigidBody(rigidBody),
+    removeCollider: collider => ref.current().removeCollider(collider, true),
+    createImpulseJoint: (params, rigidBodyA, rigidBodyB) => ref.current().createImpulseJoint(params, rigidBodyA, rigidBodyB),
+    removeImpulseJoint: joint => ref.current().removeImpulseJoint(joint, true),
+    forEachCollider: callback => ref.current().forEachCollider(callback)
+  };
+}; // TODO: Broken currently, waiting for Rapier3D to fix
+
+const createJointApi = ref => {
+  return {
+    raw: () => ref.current(),
+
+    get handle() {
+      return ref.current().handle;
+    },
+
+    configureMotorPosition: (targetPos, stiffness, damping) => ref.current().configureMotorPosition(targetPos, stiffness, damping),
+    configureMotorVelocity: (targetVel, damping) => ref.current().configureMotorVelocity(targetVel, damping)
+  };
+};
+
 const RapierContext = /*#__PURE__*/createContext(undefined);
 
 const importRapier = async () => {
@@ -185,30 +291,143 @@ const Physics = ({
   children
 }) => {
   const rapier = useAsset(importRapier);
-  const stepFuncs = useRef([]);
-  const world = useMemo(() => {
-    if (!rapier.World) return null;
-    let world = new rapier.World(vectorArrayToObject(_gravity));
-    return world;
-  }, [rapier]);
+  const worldRef = useRef();
+  const getWorldRef = useRef(() => {
+    if (!worldRef.current) {
+      const world = new rapier.World(vectorArrayToObject(_gravity));
+      worldRef.current = world;
+    }
+
+    return worldRef.current;
+  });
+  const [colliderMeshes] = useState(() => new Map());
+  const [rigidBodyMeshes] = useState(() => new Map());
+  const [rigidBodyEvents] = useState(() => new Map());
+  const [eventQueue] = useState(() => new EventQueue(false)); // Init world
+
+  useLayoutEffect(() => {
+    const world = getWorldRef.current();
+    return () => {
+      if (world) {
+        world.free();
+        worldRef.current = undefined;
+      }
+    };
+  }, []);
   const time = useRef(performance.now());
   useFrame(context => {
-    // Set timestep to current delta, to allow for variable frame rates
+    const world = worldRef.current;
+    if (!world) return; // Set timestep to current delta, to allow for variable frame rates
     // We cap the delta at 100, so that the physics simulation doesn't get wild
+
     const now = performance.now();
     const delta = Math.min(100, now - time.current);
     world.timestep = delta / 1000;
-    world.step(); // Run all step funcs
+    world.step(eventQueue); // Update meshes
+
+    rigidBodyMeshes.forEach((mesh, handle) => {
+      const rigidBody = world.getRigidBody(handle);
+      const events = rigidBodyEvents.get(handle);
+
+      if (events !== null && events !== void 0 && events.onSleep || events !== null && events !== void 0 && events.onWake) {
+        if (rigidBody.isSleeping() && !mesh.userData.isSleeping) {
+          var _events$onSleep;
+
+          events === null || events === void 0 ? void 0 : (_events$onSleep = events.onSleep) === null || _events$onSleep === void 0 ? void 0 : _events$onSleep.call(events);
+        }
 
-    stepFuncs.current.forEach(func => func());
+        if (!rigidBody.isSleeping() && mesh.userData.isSleeping) {
+          var _events$onWake;
+
+          events === null || events === void 0 ? void 0 : (_events$onWake = events.onWake) === null || _events$onWake === void 0 ? void 0 : _events$onWake.call(events);
+        }
+
+        mesh.userData.isSleeping = rigidBody.isSleeping();
+      }
+
+      if (!rigidBody || rigidBody.isSleeping() || rigidBody.isFixed() || !mesh.parent) {
+        return;
+      }
+
+      const {
+        x,
+        y,
+        z
+      } = rigidBody.translation();
+      const {
+        x: rx,
+        y: ry,
+        z: rz,
+        w: rw
+      } = rigidBody.rotation();
+      const scale = mesh.getWorldScale(new Vector3()); // haha matrixes I have no idea what I'm doing :)
+
+      const o = new Object3D();
+      o.position.set(x, y, z);
+      o.rotation.setFromQuaternion(new Quaternion(rx, ry, rz, rw));
+      o.scale.set(scale.x, scale.y, scale.z);
+      o.updateMatrix();
+      o.applyMatrix4(mesh.parent.matrixWorld.clone().invert());
+      o.updateMatrix();
+      mesh.position.setFromMatrixPosition(o.matrix);
+      mesh.rotation.setFromRotationMatrix(o.matrix);
+    }); // Collision events
+
+    eventQueue.drainCollisionEvents((handle1, handle2, started) => {
+      const collider1 = world.getCollider(handle1);
+      const collider2 = world.getCollider(handle2);
+      const rigidBodyHandle1 = collider1.parent();
+      const rigidBodyHandle2 = collider2.parent();
+
+      if (!collider1 || !collider2 || !rigidBodyHandle1 || !rigidBodyHandle2) {
+        return;
+      }
+
+      const rigidBody1 = world.getRigidBody(rigidBodyHandle1);
+      const rigidBody2 = world.getRigidBody(rigidBodyHandle2);
+      const events1 = rigidBodyEvents.get(rigidBodyHandle1);
+      const events2 = rigidBodyEvents.get(rigidBodyHandle2);
+
+      if (started) {
+        world.contactPair(handle1, handle2, (manifold, flipped) => {
+          var _events1$onCollisionE, _events2$onCollisionE;
+
+          events1 === null || events1 === void 0 ? void 0 : (_events1$onCollisionE = events1.onCollisionEnter) === null || _events1$onCollisionE === void 0 ? void 0 : _events1$onCollisionE.call(events1, {
+            target: rigidBody2,
+            manifold,
+            flipped
+          });
+          events2 === null || events2 === void 0 ? void 0 : (_events2$onCollisionE = events2.onCollisionEnter) === null || _events2$onCollisionE === void 0 ? void 0 : _events2$onCollisionE.call(events2, {
+            target: rigidBody1,
+            manifold,
+            flipped
+          });
+        });
+      } else {
+        var _events1$onCollisionE2, _events2$onCollisionE2;
+
+        events1 === null || events1 === void 0 ? void 0 : (_events1$onCollisionE2 = events1.onCollisionExit) === null || _events1$onCollisionE2 === void 0 ? void 0 : _events1$onCollisionE2.call(events1, {
+          target: rigidBody2
+        });
+        events2 === null || events2 === void 0 ? void 0 : (_events2$onCollisionE2 = events2.onCollisionExit) === null || _events2$onCollisionE2 === void 0 ? void 0 : _events2$onCollisionE2.call(events2, {
+          target: rigidBody1
+        });
+      }
+    });
     time.current = now;
   });
+  const api = useMemo(() => createWorldApi(getWorldRef), []);
   const context = useMemo(() => ({
-    RAPIER: rapier,
-    world,
-    colliders: _colliders,
-    stepFuncs: stepFuncs.current
-  }), [rapier]);
+    rapier,
+    world: api,
+    physicsOptions: {
+      colliders: _colliders,
+      gravity: _gravity
+    },
+    colliderMeshes,
+    rigidBodyMeshes,
+    rigidBodyEvents
+  }), []);
   return /*#__PURE__*/React.createElement(RapierContext.Provider, {
     value: context
   }, children);
@@ -257,69 +476,52 @@ function _objectSpread2(target) {
 
 const useRapier = () => {
   return useContext(RapierContext);
-}; // Private hook for updating the simulations on objects
-
-const useRapierStep = callback => {
-  const {
-    stepFuncs
-  } = useRapier();
-  useEffect(() => {
-    stepFuncs.push(callback);
-    return () => {
-      const index = stepFuncs.indexOf(callback);
-      stepFuncs.splice(index, 1);
-    };
-  }, [callback]);
-};
-const useCollider = (body, options = {}) => {
-  const {
-    RAPIER,
-    world
-  } = useRapier();
-  const collider = useMemo(() => {
-    return createColliderFromOptions(options, world, body);
-  }, []);
-  useEffect(() => {
-    return () => {
-      world.removeCollider(collider, false);
-    };
-  }, []);
-  return [collider];
 };
-const useRigidBody = options => {
+const useRigidBody = (options = {}) => {
   const {
-    RAPIER,
-    world
+    rapier,
+    world,
+    rigidBodyMeshes,
+    physicsOptions,
+    rigidBodyEvents
   } = useRapier();
   const ref = useRef(); // Create rigidbody
 
-  const rigidBody = useMemo(() => {
-    var _options$linearVeloci, _options$angularVeloc, _options$gravityScale, _options$canSleep, _options$ccd;
-
-    const [lvx, lvy, lvz] = (_options$linearVeloci = options === null || options === void 0 ? void 0 : options.linearVelocity) !== null && _options$linearVeloci !== void 0 ? _options$linearVeloci : [0, 0, 0];
-    const [avx, avy, avz] = (_options$angularVeloc = options === null || options === void 0 ? void 0 : options.angularVelocity) !== null && _options$angularVeloc !== void 0 ? _options$angularVeloc : [0, 0, 0];
-    const gravityScale = (_options$gravityScale = options === null || options === void 0 ? void 0 : options.gravityScale) !== null && _options$gravityScale !== void 0 ? _options$gravityScale : 1;
-    const canSleep = (_options$canSleep = options === null || options === void 0 ? void 0 : options.canSleep) !== null && _options$canSleep !== void 0 ? _options$canSleep : true;
-    const ccdEnabled = (_options$ccd = options === null || options === void 0 ? void 0 : options.ccd) !== null && _options$ccd !== void 0 ? _options$ccd : false;
-    const type = rigidBodyTypeFromString((options === null || options === void 0 ? void 0 : options.type) || "dynamic");
-    (options === null || options === void 0 ? void 0 : options.position) || [0, 0, 0];
-    (options === null || options === void 0 ? void 0 : options.rotation) || [0, 0, 0];
-    const rigidBodyDesc = new RAPIER.RigidBodyDesc(type).setLinvel(lvx, lvy, lvz).setAngvel({
-      x: avx,
-      y: avy,
-      z: avz
-    }).setGravityScale(gravityScale).setCanSleep(canSleep).setCcdEnabled(ccdEnabled).setTranslation(0, 0, 0);
-    const body = world.createRigidBody(rigidBodyDesc);
-    return body;
-  }, []); // Setup
+  const rigidBodyRef = useRef();
+  const getRigidBodyRef = useRef(() => {
+    if (!rigidBodyRef.current) {
+      var _options$linearVeloci, _options$angularVeloc, _options$gravityScale, _options$canSleep, _options$ccd;
+
+      const type = rigidBodyTypeFromString((options === null || options === void 0 ? void 0 : options.type) || "dynamic");
+      const [lvx, lvy, lvz] = (_options$linearVeloci = options === null || options === void 0 ? void 0 : options.linearVelocity) !== null && _options$linearVeloci !== void 0 ? _options$linearVeloci : [0, 0, 0];
+      const [avx, avy, avz] = (_options$angularVeloc = options === null || options === void 0 ? void 0 : options.angularVelocity) !== null && _options$angularVeloc !== void 0 ? _options$angularVeloc : [0, 0, 0];
+      const gravityScale = (_options$gravityScale = options === null || options === void 0 ? void 0 : options.gravityScale) !== null && _options$gravityScale !== void 0 ? _options$gravityScale : 1;
+      const canSleep = (_options$canSleep = options === null || options === void 0 ? void 0 : options.canSleep) !== null && _options$canSleep !== void 0 ? _options$canSleep : true;
+      const ccdEnabled = (_options$ccd = options === null || options === void 0 ? void 0 : options.ccd) !== null && _options$ccd !== void 0 ? _options$ccd : false;
+      const desc = new rapier.RigidBodyDesc(type).setLinvel(lvx, lvy, lvz).setAngvel({
+        x: avx,
+        y: avy,
+        z: avz
+      }).setGravityScale(gravityScale).setCanSleep(canSleep).setCcdEnabled(ccdEnabled);
+      const rigidBody = world.createRigidBody(desc);
+      rigidBodyRef.current = rigidBody;
+    }
+
+    return rigidBodyRef.current;
+  }); // Setup
 
   useEffect(() => {
-    var _ref$current$parent, _options$colliders;
+    var _ref$current$parent, _ref, _options$colliders;
+
+    const rigidBody = getRigidBodyRef.current();
+    rigidBodyRef.current = rigidBody;
 
     if (!ref.current) {
       ref.current = new Object3D();
-    } // Get intitial world transforms
+    } // isSleeping used for onSleep and onWake events
+
 
+    ref.current.userData.isSleeping = false; // Get intitial world transforms
 
     const worldPosition = ref.current.getWorldPosition(new Vector3());
     const worldRotation = ref.current.getWorldQuaternion(new Quaternion());
@@ -347,43 +549,56 @@ const useRigidBody = options => {
     }, false);
     rigidBody.resetForces(false);
     rigidBody.resetTorques(false);
-    const colliderSetting = (_options$colliders = options === null || options === void 0 ? void 0 : options.colliders) !== null && _options$colliders !== void 0 ? _options$colliders : false;
-    const autoColliders = colliderSetting !== false ? createCollidersFromChildren(ref.current, rigidBody, colliderSetting, world) : [];
+    const colliderSetting = (_ref = (_options$colliders = options === null || options === void 0 ? void 0 : options.colliders) !== null && _options$colliders !== void 0 ? _options$colliders : physicsOptions.colliders) !== null && _ref !== void 0 ? _ref : false;
+    const hasCollisionEvents = !!(options.onCollisionEnter || options.onCollisionExit);
+    const autoColliders = colliderSetting !== false ? createCollidersFromChildren(ref.current, rigidBody, colliderSetting, world, hasCollisionEvents) : [];
+    rigidBody.wakeUp();
+    rigidBodyMeshes.set(rigidBody.handle, ref.current);
     return () => {
+      autoColliders.forEach(collider => world.removeCollider(collider));
       world.removeRigidBody(rigidBody);
-      autoColliders.forEach(collider => world.removeCollider(collider, false));
+      rigidBodyRef.current = undefined;
+      rigidBodyMeshes.delete(rigidBody.handle);
     };
-  }, []);
-  useRapierStep(() => {
-    if (rigidBody && ref.current) {
-      const {
-        x,
-        y,
-        z
-      } = rigidBody.translation();
-      const {
-        x: rx,
-        y: ry,
-        z: rz,
-        w: rw
-      } = rigidBody.rotation();
-      const scale = ref.current.getWorldScale(new Vector3());
-
-      if (ref.current.parent) {
-        // haha matrixes I have no idea what I'm doing :)
-        const o = new Object3D();
-        o.position.set(x, y, z);
-        o.rotation.setFromQuaternion(new Quaternion(rx, ry, rz, rw));
-        o.scale.set(scale.x, scale.y, scale.z);
-        o.updateMatrix();
-        o.applyMatrix4(ref.current.parent.matrixWorld.clone().invert());
-        o.updateMatrix();
-        ref.current.position.setFromMatrixPosition(o.matrix);
-        ref.current.rotation.setFromRotationMatrix(o.matrix);
-      }
+  }, []); // Events
+
+  useEffect(() => {
+    const rigidBody = getRigidBodyRef.current();
+    rigidBodyEvents.set(rigidBody.handle, {
+      onCollisionEnter: options === null || options === void 0 ? void 0 : options.onCollisionEnter,
+      onCollisionExit: options === null || options === void 0 ? void 0 : options.onCollisionExit,
+      onSleep: options === null || options === void 0 ? void 0 : options.onSleep,
+      onWake: options === null || options === void 0 ? void 0 : options.onWake
+    });
+    return () => {
+      rigidBodyEvents.delete(rigidBody.handle);
+    };
+  }, [options.onCollisionEnter, options.onCollisionExit]);
+  const api = useMemo(() => createRigidBodyApi(getRigidBodyRef), []);
+  return [ref, api];
+};
+const useCollider = (body, options = {}) => {
+  const {
+    world
+  } = useRapier();
+  const colliderRef = useRef();
+  const objectRef = useRef();
+  const getColliderRef = useRef(() => {
+    if (!colliderRef.current) {
+      colliderRef.current = createColliderFromOptions(options, world, body.handle);
     }
+
+    return colliderRef.current;
   });
-  return [ref, rigidBody];
+  useEffect(() => {
+    const collider = getColliderRef.current();
+    return () => {
+      if (collider) world.removeCollider(collider);
+      colliderRef.current = undefined;
+    };
+  }, []);
+  const api = useMemo(() => createColliderApi(getColliderRef), []);
+  return [objectRef, api];
 };
 const useRigidBodyWithCollider = (rigidBodyOptions, colliderOptions) => {
   const {
@@ -396,9 +611,9 @@ const useRigidBodyWithCollider = (rigidBodyOptions, colliderOptions) => {
     }
 
     const scale = ref.current.getWorldScale(new Vector3());
-    const collider = createColliderFromOptions(colliderOptions, world, rigidBody, scale);
+    const collider = createColliderFromOptions(colliderOptions, world, rigidBody.handle, scale);
     return () => {
-      world.removeCollider(collider, false);
+      world.removeCollider(collider);
     };
   }, []);
   return [ref, rigidBody];
@@ -524,20 +739,42 @@ const useRoundConvexMesh = (rigidBodyOptions = {}, colliderOptions = {}) => {
 
 const useImpulseJoint = (body1, body2, params) => {
   const {
-    world,
-    RAPIER
+    world
   } = useRapier();
-  useLayoutEffect(() => {
-    let joint;
+  const jointRef = useRef();
+  const getJointRef = useRef(() => {
+    if (!jointRef.current) {
+      let rb1;
+      let rb2;
+
+      if ('handle' in body1 && 'handle' in body2) {
+        rb1 = world.getRigidBody(body1.handle);
+        rb2 = world.getRigidBody(body2.handle);
+        jointRef.current = world.createImpulseJoint(params, rb1, rb2);
+      }
 
-    if (body1 && body2 && params) {
-      joint = world.createImpulseJoint(params, body1.current, body2.current);
+      if ('current' in body1 && body1.current && 'current' in body2 && body2.current) {
+        rb1 = world.getRigidBody(body1.current.handle);
+        rb2 = world.getRigidBody(body2.current.handle);
+        const newJoint = world.createImpulseJoint(params, rb1, rb2);
+        jointRef.current = newJoint;
+      }
     }
 
+    return jointRef.current;
+  });
+  useEffect(() => {
+    const joint = getJointRef.current();
     return () => {
-      if (joint) world.removeImpulseJoint(joint, true);
+      if (joint) {
+        console.log('remove joint', joint);
+        world.removeImpulseJoint(joint);
+        jointRef.current = undefined;
+      }
     };
-  }, [body1, body2]);
+  }, []);
+  const api = useMemo(() => createJointApi(getJointRef), []);
+  return api;
 };
 /**
  *
@@ -548,9 +785,9 @@ const useImpulseJoint = (body1, body2, params) => {
 
 const useFixedJoint = (body1, body2, [body1Anchor, body1LocalFrame, body2Anchor, body2LocalFrame]) => {
   const {
-    RAPIER
+    rapier
   } = useRapier();
-  return useImpulseJoint(body1, body2, RAPIER.JointData.fixed(vectorArrayToObject(body1Anchor), _objectSpread2(_objectSpread2({}, vectorArrayToObject(body1LocalFrame)), {}, {
+  return useImpulseJoint(body1, body2, rapier.JointData.fixed(vectorArrayToObject(body1Anchor), _objectSpread2(_objectSpread2({}, vectorArrayToObject(body1LocalFrame)), {}, {
     w: 1
   }), vectorArrayToObject(body2Anchor), _objectSpread2(_objectSpread2({}, vectorArrayToObject(body2LocalFrame)), {}, {
     w: 1
@@ -565,9 +802,9 @@ const useFixedJoint = (body1, body2, [body1Anchor, body1LocalFrame, body2Anchor,
 
 const useSphericalJoint = (body1, body2, [body1Anchor, body2Anchor]) => {
   const {
-    RAPIER
+    rapier
   } = useRapier();
-  return useImpulseJoint(body1, body2, RAPIER.JointData.spherical(vectorArrayToObject(body1Anchor), vectorArrayToObject(body2Anchor)));
+  return useImpulseJoint(body1, body2, rapier.JointData.spherical(vectorArrayToObject(body1Anchor), vectorArrayToObject(body2Anchor)));
 };
 /**
  * The revolute joint prevents any relative movement between two rigid-bodies, except for relative
@@ -577,9 +814,9 @@ const useSphericalJoint = (body1, body2, [body1Anchor, body2Anchor]) => {
 
 const useRevoluteJoint = (body1, body2, [body1Anchor, body2Anchor, axis]) => {
   const {
-    RAPIER
+    rapier
   } = useRapier();
-  return useImpulseJoint(body1, body2, RAPIER.JointData.revolute(vectorArrayToObject(body1Anchor), vectorArrayToObject(body2Anchor), vectorArrayToObject(axis)));
+  return useImpulseJoint(body1, body2, rapier.JointData.revolute(vectorArrayToObject(body1Anchor), vectorArrayToObject(body2Anchor), vectorArrayToObject(axis)));
 };
 /**
  * The prismatic joint prevents any relative movement between two rigid-bodies, except for relative translations along one axis.
@@ -589,9 +826,9 @@ const useRevoluteJoint = (body1, body2, [body1Anchor, body2Anchor, axis]) => {
 
 const usePrismaticJoint = (body1, body2, [body1Anchor, body2Anchor, axis]) => {
   const {
-    RAPIER
+    rapier
   } = useRapier();
-  return useImpulseJoint(body1, body2, RAPIER.JointData.prismatic(vectorArrayToObject(body1Anchor), vectorArrayToObject(body2Anchor), vectorArrayToObject(axis)));
+  return useImpulseJoint(body1, body2, rapier.JointData.prismatic(vectorArrayToObject(body1Anchor), vectorArrayToObject(body2Anchor), vectorArrayToObject(axis)));
 };
 
 function _extends() {
@@ -646,10 +883,11 @@ function _objectWithoutProperties(source, excluded) {
   return target;
 }
 
-const _excluded = ["children"];
+const _excluded = ["children"],
+      _excluded2 = ["children"];
 const RigidBodyContext = /*#__PURE__*/createContext(undefined);
 
-const useParentRigidBody = () => useContext(RigidBodyContext); // RigidBody
+const useRigidBodyContext = () => useContext(RigidBodyContext); // RigidBody
 
 
 const RigidBody = /*#__PURE__*/forwardRef((_ref, ref) => {
@@ -658,28 +896,36 @@ const RigidBody = /*#__PURE__*/forwardRef((_ref, ref) => {
   } = _ref,
       props = _objectWithoutProperties(_ref, _excluded);
 
-  const [group, rigidBody] = useRigidBody(props);
+  const [object, rigidBody] = useRigidBody(props);
   useImperativeHandle(ref, () => rigidBody);
   return /*#__PURE__*/React.createElement(RigidBodyContext.Provider, {
-    value: [group, rigidBody]
-  }, /*#__PURE__*/React.createElement("group", {
-    ref: group
+    value: [object, rigidBody, !!(props.onCollisionEnter || props.onCollisionExit)]
+  }, /*#__PURE__*/React.createElement("object3D", {
+    ref: object
   }, children));
 }); // Colliders
 
-const AnyCollider = props => {
+const AnyCollider = _ref2 => {
+  let {
+    children
+  } = _ref2,
+      props = _objectWithoutProperties(_ref2, _excluded2);
+
   const {
     world
   } = useRapier();
-  const [object, rigidBody] = useParentRigidBody();
+  const [, rigidBody, hasCollisionEvents] = useRigidBodyContext();
+  const ref = useRef(null);
   useEffect(() => {
-    const scale = object.current.getWorldScale(new Vector3());
-    const collider = createColliderFromOptions(props, world, rigidBody, scale);
+    const scale = ref.current.getWorldScale(new Vector3());
+    const collider = createColliderFromOptions(props, world, rigidBody.handle, scale, hasCollisionEvents);
     return () => {
-      world.removeCollider(collider, false);
+      world.removeCollider(collider);
     };
   }, []);
-  return null;
+  return /*#__PURE__*/React.createElement("object3D", {
+    ref: ref
+  }, children);
 };
 
 const CuboidCollider = props => {
@@ -828,7 +1074,7 @@ const Debug = () => {
 
   useFrame(() => {
     const newColliders = [];
-    world.colliders.forEachCollider(collider => {
+    world.forEachCollider(collider => {
       newColliders.push(collider.handle);
     });
     setColliders(newColliders);