@react-three/rapier 0.6.8 → 0.6.9

package/dist/declarations/src/AnyCollider.d.ts

@@ -4,13 +4,22 @@ declare type UseColliderOptionsRequiredArgs<T> = Omit<UseColliderOptions<T>, "ar
     args: T;
     children?: ReactNode;
 };
-export declare const CuboidCollider: (props: UseColliderOptionsRequiredArgs<CuboidArgs>) => JSX.Element;
-export declare const RoundCuboidCollider: (props: UseColliderOptionsRequiredArgs<RoundCuboidArgs>) => JSX.Element;
-export declare const BallCollider: (props: UseColliderOptionsRequiredArgs<BallArgs>) => JSX.Element;
-export declare const CapsuleCollider: (props: UseColliderOptionsRequiredArgs<CapsuleArgs>) => JSX.Element;
-export declare const HeightfieldCollider: (props: UseColliderOptionsRequiredArgs<HeightfieldArgs>) => JSX.Element;
-export declare const TrimeshCollider: (props: UseColliderOptionsRequiredArgs<TrimeshArgs>) => JSX.Element;
-export declare const ConeCollider: (props: UseColliderOptionsRequiredArgs<ConeArgs>) => JSX.Element;
-export declare const CylinderCollider: (props: UseColliderOptionsRequiredArgs<CylinderArgs>) => JSX.Element;
-export declare const ConvexHullCollider: (props: UseColliderOptionsRequiredArgs<ConvexHullArgs>) => JSX.Element;
+export declare type CuboidColliderProps = UseColliderOptionsRequiredArgs<CuboidArgs>;
+export declare type RoundCuboidColliderProps = UseColliderOptionsRequiredArgs<RoundCuboidArgs>;
+export declare type BallColliderProps = UseColliderOptionsRequiredArgs<BallArgs>;
+export declare type CapsuleColliderProps = UseColliderOptionsRequiredArgs<CapsuleArgs>;
+export declare type HeightfieldColliderProps = UseColliderOptionsRequiredArgs<HeightfieldArgs>;
+export declare type TrimeshColliderProps = UseColliderOptionsRequiredArgs<TrimeshArgs>;
+export declare type ConeColliderProps = UseColliderOptionsRequiredArgs<ConeArgs>;
+export declare type CylinderColliderProps = UseColliderOptionsRequiredArgs<CylinderArgs>;
+export declare type ConvexHullColliderProps = UseColliderOptionsRequiredArgs<ConvexHullArgs>;
+export declare const CuboidCollider: (props: CuboidColliderProps) => JSX.Element;
+export declare const RoundCuboidCollider: (props: RoundCuboidColliderProps) => JSX.Element;
+export declare const BallCollider: (props: BallColliderProps) => JSX.Element;
+export declare const CapsuleCollider: (props: CapsuleColliderProps) => JSX.Element;
+export declare const HeightfieldCollider: (props: HeightfieldColliderProps) => JSX.Element;
+export declare const TrimeshCollider: (props: TrimeshColliderProps) => JSX.Element;
+export declare const ConeCollider: (props: ConeColliderProps) => JSX.Element;
+export declare const CylinderCollider: (props: CylinderColliderProps) => JSX.Element;
+export declare const ConvexHullCollider: (props: ConvexHullColliderProps) => JSX.Element;
 export {};

package/dist/declarations/src/InstancedRigidBodies.d.ts

@@ -7,4 +7,4 @@ export interface InstancedRigidBodiesProps extends Omit<RigidBodyProps, "positio
     rotations?: Vector3Array[];
     scales?: Vector3Array[];
 }
-export declare const InstancedRigidBodies: React.ForwardRefExoticComponent<Pick<InstancedRigidBodiesProps, "type" | "canSleep" | "linearDamping" | "angularDamping" | "linearVelocity" | "angularVelocity" | "gravityScale" | "ccd" | "colliders" | "friction" | "restitution" | "onSleep" | "onWake" | "lockRotations" | "lockTranslations" | "enabledRotations" | "enabledTranslations" | "children" | "quaternion" | "attach" | "args" | "key" | "onUpdate" | "up" | "scale" | "matrix" | "layers" | "dispose" | "id" | "uuid" | "name" | "parent" | "modelViewMatrix" | "normalMatrix" | "matrixWorld" | "matrixAutoUpdate" | "matrixWorldNeedsUpdate" | "visible" | "castShadow" | "receiveShadow" | "frustumCulled" | "renderOrder" | "animations" | "userData" | "customDepthMaterial" | "customDistanceMaterial" | "isObject3D" | "onBeforeRender" | "onAfterRender" | "applyMatrix4" | "applyQuaternion" | "setRotationFromAxisAngle" | "setRotationFromEuler" | "setRotationFromMatrix" | "setRotationFromQuaternion" | "rotateOnAxis" | "rotateOnWorldAxis" | "rotateX" | "rotateY" | "rotateZ" | "translateOnAxis" | "translateX" | "translateY" | "translateZ" | "localToWorld" | "worldToLocal" | "lookAt" | "add" | "remove" | "removeFromParent" | "clear" | "getObjectById" | "getObjectByName" | "getObjectByProperty" | "getWorldPosition" | "getWorldQuaternion" | "getWorldScale" | "getWorldDirection" | "raycast" | "traverse" | "traverseVisible" | "traverseAncestors" | "updateMatrix" | "updateMatrixWorld" | "updateWorldMatrix" | "toJSON" | "clone" | "copy" | "addEventListener" | "hasEventListener" | "removeEventListener" | "dispatchEvent" | "onClick" | "onContextMenu" | "onDoubleClick" | "onPointerUp" | "onPointerDown" | "onPointerOver" | "onPointerOut" | "onPointerEnter" | "onPointerLeave" | "onPointerMove" | "onPointerMissed" | "onPointerCancel" | "onWheel" | "positions" | "rotations" | "scales"> & React.RefAttributes<InstancedRigidBodyApi>>;
+export declare const InstancedRigidBodies: React.ForwardRefExoticComponent<InstancedRigidBodiesProps & React.RefAttributes<InstancedRigidBodyApi>>;

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

@@ -1,7 +1,7 @@
 import React, { FC, ReactNode } from "react";
 import type Rapier from "@dimforge/rapier3d-compat";
-import { RigidBodyAutoCollider, Vector3Array, WorldApi } from "./types";
-import { ColliderHandle, RigidBody, RigidBodyHandle, TempContactManifold } from "@dimforge/rapier3d-compat";
+import { CollisionEnterHandler, CollisionExitHandler, RigidBodyAutoCollider, Vector3Array, WorldApi } from "./types";
+import { ColliderHandle, RigidBodyHandle } from "@dimforge/rapier3d-compat";
 import { Matrix4, Object3D, Vector3 } from "three";
 export interface RapierContext {
     rapier: typeof Rapier;
@@ -18,20 +18,15 @@ export interface RapierContext {
         colliders: RigidBodyAutoCollider;
     };
     rigidBodyEvents: EventMap;
+    colliderEvents: EventMap;
     isPaused: boolean;
 }
 export declare const RapierContext: React.Context<RapierContext | undefined>;
 declare type EventMap = Map<ColliderHandle | RigidBodyHandle, {
     onSleep?(): void;
     onWake?(): void;
-    onCollisionEnter?({ target, manifold, flipped, }: {
-        target: RigidBody;
-        manifold: TempContactManifold;
-        flipped: boolean;
-    }): void;
-    onCollisionExit?({ target }: {
-        target: RigidBody;
-    }): void;
+    onCollisionEnter?: CollisionEnterHandler;
+    onCollisionExit?: CollisionExitHandler;
 }>;
 interface RapierWorldProps {
     children: ReactNode;
@@ -66,6 +61,12 @@ interface RapierWorldProps {
      * @defaultValue false
      */
     paused?: boolean;
+    /**
+     * The update priority at which the physics simulation should run.
+     *
+     * @defaultValue undefined
+     */
+    updatePriority?: number;
 }
 export declare const Physics: FC<RapierWorldProps>;
 export {};

package/dist/declarations/src/RigidBody.d.ts

@@ -1,7 +1,6 @@
 import React, { MutableRefObject, RefObject } from "react";
 import { ReactNode } from "react";
 import { Object3D } from "three";
-import { Object3DProps } from "@react-three/fiber";
 import { InstancedRigidBodyApi } from "./api";
 import { InstancedRigidBodiesProps } from "./InstancedRigidBodies";
 import { RigidBodyApi, UseRigidBodyOptions } from "./types";
@@ -17,7 +16,7 @@ export declare const useRigidBodyContext: () => {
     hasCollisionEvents: boolean;
     options: UseRigidBodyOptions | InstancedRigidBodiesProps;
 };
-export interface RigidBodyProps extends UseRigidBodyOptions, Omit<Object3DProps, 'type' | 'position' | 'rotation'> {
+export interface RigidBodyProps extends UseRigidBodyOptions {
     children?: ReactNode;
 }
-export declare const RigidBody: React.ForwardRefExoticComponent<Pick<RigidBodyProps, "type" | "canSleep" | "linearDamping" | "angularDamping" | "linearVelocity" | "angularVelocity" | "gravityScale" | "ccd" | "position" | "rotation" | "colliders" | "friction" | "restitution" | "onCollisionEnter" | "onCollisionExit" | "onSleep" | "onWake" | "lockRotations" | "lockTranslations" | "enabledRotations" | "enabledTranslations" | "children" | "quaternion" | "attach" | "args" | "key" | "onUpdate" | "up" | "scale" | "matrix" | "layers" | "dispose" | "id" | "uuid" | "name" | "parent" | "modelViewMatrix" | "normalMatrix" | "matrixWorld" | "matrixAutoUpdate" | "matrixWorldNeedsUpdate" | "visible" | "castShadow" | "receiveShadow" | "frustumCulled" | "renderOrder" | "animations" | "userData" | "customDepthMaterial" | "customDistanceMaterial" | "isObject3D" | "onBeforeRender" | "onAfterRender" | "applyMatrix4" | "applyQuaternion" | "setRotationFromAxisAngle" | "setRotationFromEuler" | "setRotationFromMatrix" | "setRotationFromQuaternion" | "rotateOnAxis" | "rotateOnWorldAxis" | "rotateX" | "rotateY" | "rotateZ" | "translateOnAxis" | "translateX" | "translateY" | "translateZ" | "localToWorld" | "worldToLocal" | "lookAt" | "add" | "remove" | "removeFromParent" | "clear" | "getObjectById" | "getObjectByName" | "getObjectByProperty" | "getWorldPosition" | "getWorldQuaternion" | "getWorldScale" | "getWorldDirection" | "raycast" | "traverse" | "traverseVisible" | "traverseAncestors" | "updateMatrix" | "updateMatrixWorld" | "updateWorldMatrix" | "toJSON" | "clone" | "copy" | "addEventListener" | "hasEventListener" | "removeEventListener" | "dispatchEvent" | "onClick" | "onContextMenu" | "onDoubleClick" | "onPointerUp" | "onPointerDown" | "onPointerOver" | "onPointerOut" | "onPointerEnter" | "onPointerLeave" | "onPointerMove" | "onPointerMissed" | "onPointerCancel" | "onWheel"> & React.RefAttributes<import("./api").RigidBodyApi>>;
+export declare const RigidBody: React.ForwardRefExoticComponent<RigidBodyProps & React.RefAttributes<import("./api").RigidBodyApi>>;

package/dist/declarations/src/bitmasks.d.ts

@@ -0,0 +1,34 @@
+import { InteractionGroups } from "@dimforge/rapier3d-compat";
+/**
+ * Calculates an InteractionGroup bitmask for use in the `collisionGroups` or `solverGroups`
+ * properties of RigidBody or Collider components. The first argument represents a list of
+ * groups the entity is in (expressed as numbers from 0 to 15). The second argument is a list
+ * of groups that will be filtered against. When it is omitted, all groups are filtered against.
+ *
+ * @example
+ * A RigidBody that is member of group 0 and will collide with everything from groups 0 and 1:
+ *
+ * ```tsx
+ * <RigidBody collisionGroups={interactionGroups([0], [0, 1])} />
+ * ```
+ *
+ * A RigidBody that is member of groups 0 and 1 and will collide with everything else:
+ *
+ * ```tsx
+ * <RigidBody collisionGroups={interactionGroups([0, 1])} />
+ * ```
+ *
+ * A RigidBody that is member of groups 0 and 1 and will not collide with anything:
+ *
+ * ```tsx
+ * <RigidBody collisionGroups={interactionGroups([0, 1], [])} />
+ * ```
+ *
+ * Please note that Rapier needs interaction filters to evaluate to true between _both_ colliding
+ * entities for collision events to trigger.
+ *
+ * @param memberships Groups the collider is a member of. (Values can range from 0 to 15.)
+ * @param filters Groups the interaction group should filter against. (Values can range from 0 to 15.)
+ * @returns An InteractionGroup bitmask.
+ */
+export declare const interactionGroups: (memberships: number | number[], filters?: number | number[] | undefined) => InteractionGroups;

package/dist/declarations/src/index.d.ts

@@ -1,5 +1,8 @@
 export * from "./types";
 export type { RigidBodyApi, WorldApi, InstancedRigidBodyApi } from "./api";
+export type { RigidBodyProps } from './RigidBody';
+export type { InstancedRigidBodiesProps } from './InstancedRigidBodies';
+export type { CylinderColliderProps, BallColliderProps, CapsuleColliderProps, ConeColliderProps, ConvexHullColliderProps, CuboidColliderProps, HeightfieldColliderProps, RoundCuboidColliderProps, TrimeshColliderProps } from './AnyCollider';
 export { Physics } from "./Physics";
 export { RigidBody } from "./RigidBody";
 export { MeshCollider } from "./MeshCollider";
@@ -7,3 +10,4 @@ export { Debug } from "./Debug";
 export { InstancedRigidBodies } from "./InstancedRigidBodies";
 export * from "./AnyCollider";
 export * from "./hooks";
+export * from "./bitmasks";

package/dist/declarations/src/types.d.ts

@@ -1,5 +1,5 @@
 import { MutableRefObject } from "react";
-import { CoefficientCombineRule, Collider as RapierCollider, RigidBody as RapierRigidBody, TempContactManifold } from "@dimforge/rapier3d-compat";
+import { CoefficientCombineRule, Collider as RapierCollider, InteractionGroups, RigidBody as RapierRigidBody, TempContactManifold } from "@dimforge/rapier3d-compat";
 import { createColliderApi, createJointApi, createRigidBodyApi, createWorldApi } from "./api";
 export { CoefficientCombineRule as CoefficientCombineRule } from "@dimforge/rapier3d-compat";
 export { RapierRigidBody, RapierCollider };
@@ -120,7 +120,35 @@ export interface UseColliderOptions<ColliderArgs> {
      * The rotation of this collider relative to the rigid body
      */
     rotation?: Vector3Array;
+    /**
+     * Callback when this collider collides with another collider.
+     */
+    onCollisionEnter?: CollisionEnterHandler;
+    /**
+     * Callback when this collider stops colliding with another collider.
+     */
+    onCollisionExit?: CollisionExitHandler;
+    /**
+     * The bit mask configuring the groups and mask for collision handling.
+     */
+    collisionGroups?: InteractionGroups;
+    /**
+     * The bit mask configuring the groups and mask for solver handling.
+     */
+    solverGroups?: InteractionGroups;
 }
+export declare type CollisionEnterPayload = {
+    target: RapierRigidBody;
+    collider: RapierCollider;
+    manifold: TempContactManifold;
+    flipped: boolean;
+};
+export declare type CollisionExitPayload = {
+    target: RapierRigidBody;
+    collider: RapierCollider;
+};
+export declare type CollisionEnterHandler = (payload: CollisionEnterPayload) => void;
+export declare type CollisionExitHandler = (payload: CollisionExitPayload) => void;
 export interface UseRigidBodyOptions {
     /**
      * Specify the type of this rigid body
@@ -184,17 +212,21 @@ export interface UseRigidBodyOptions {
     /**
      * Callback when this rigidbody collides with another rigidbody
      */
-    onCollisionEnter?({}: {
-        target: RapierRigidBody;
-        manifold: TempContactManifold;
-        flipped: boolean;
-    }): void;
+    onCollisionEnter?: CollisionEnterHandler;
     /**
      * Callback when this rigidbody stops colliding with another rigidbody
      */
-    onCollisionExit?({}: {
-        target: RapierRigidBody;
-    }): void;
+    onCollisionExit?: CollisionExitHandler;
+    /**
+     * The default collision groups bitmask for all colliders in this rigid body.
+     * Can be customized per-collider.
+     */
+    collisionGroups?: InteractionGroups;
+    /**
+    * The default solver groups bitmask for all colliders in this rigid body.
+    * Can be customized per-collider.
+     */
+    solverGroups?: InteractionGroups;
     onSleep?(): void;
     onWake?(): void;
     /**

package/dist/declarations/src/utils.d.ts

@@ -4,7 +4,7 @@ import { RigidBodyApi, RigidBodyAutoCollider, RigidBodyShape, RigidBodyTypeStrin
 export declare const vectorArrayToVector3: (arr: Vector3Array) => Vector3;
 export declare const vector3ToQuaternion: (v: Vector3) => Quaternion;
 export declare const rapierVector3ToVector3: ({ x, y, z }: RapierVector3) => Vector3;
-export declare const rapierQuaternionToQuaternion: ({ x, y, z, w, }: RapierQuaternion) => Quaternion;
+export declare const rapierQuaternionToQuaternion: ({ x, y, z, w }: RapierQuaternion) => Quaternion;
 export declare const rigidBodyTypeFromString: (type: RigidBodyTypeString) => number;
 export declare const decomposeMatrix4: (m: Matrix4) => {
     position: Vector3;

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

@@ -8,6 +8,7 @@ var useAsset = require('use-asset');
 var fiber = require('@react-three/fiber');
 var three = require('three');
 var BufferGeometryUtils = require('three/examples/jsm/utils/BufferGeometryUtils');
+var MathUtils = require('three/src/math/MathUtils');
 var threeStdlib = require('three-stdlib');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
@@ -49,7 +50,7 @@ const rapierVector3ToVector3 = ({
   x,
   y,
   z
-}) => _vector3.set(x, y, z).clone();
+}) => _vector3.set(x, y, z);
 const rapierQuaternionToQuaternion = ({
   x,
   y,
@@ -95,6 +96,12 @@ const scaleColliderArgs = (shape, args, scale) => {
   const scaleArray = [scale.x, scale.y, scale.z, scale.x, scale.x];
   return newArgs.map((arg, index) => scaleArray[index] * arg);
 };
+
+const applyColliderOptions = (collider, options) => {
+  if (options.collisionGroups !== undefined) collider.setCollisionGroups(options.collisionGroups);
+  if (options.solverGroups !== undefined) collider.setSolverGroups(options.solverGroups);
+};
+
 const createColliderFromOptions = ({
   options,
   world,
@@ -148,6 +155,7 @@ const createColliderFromOptions = ({
   }
 
   const collider = world.createCollider(colliderDesc, rigidBody);
+  applyColliderOptions(collider, options);
   return collider;
 };
 
@@ -213,6 +221,7 @@ const createCollidersFromChildren = ({
       });
       const actualRigidBody = rigidBody ? world.getRigidBody(rigidBody.handle) : undefined;
       const collider = world.createCollider(desc, actualRigidBody);
+      applyColliderOptions(collider, options);
       colliders.push(collider);
     }
   });
@@ -450,7 +459,8 @@ const Physics = ({
   children,
   timeStep: _timeStep = 1 / 60,
   maxSubSteps: _maxSubSteps = 10,
-  paused: _paused = false
+  paused: _paused = false,
+  updatePriority
 }) => {
   const rapier = useAsset.useAsset(importRapier);
   const [isPaused, setIsPaused] = React.useState(_paused);
@@ -468,6 +478,7 @@ const Physics = ({
   });
   const [rigidBodyStates] = React.useState(() => new Map());
   const [rigidBodyEvents] = React.useState(() => new Map());
+  const [colliderEvents] = React.useState(() => new Map());
   const [eventQueue] = React.useState(() => new rapier3dCompat.EventQueue(false)); // Init world
 
   React.useEffect(() => {
@@ -497,12 +508,12 @@ const Physics = ({
     world.timestep = _timeStep;
     /**
      * Fixed timeStep simulation progression
-     * @see https://gafferongames.com/post/fix_your_timestep/ 
+     * @see https://gafferongames.com/post/fix_your_timestep/
     */
 
     let previousTranslations = {}; // don't step time forwards if paused
 
-    const nowTime = steppingState.time += _paused ? 0 : delta * 1000;
+    const nowTime = steppingState.time += _paused ? 0 : MathUtils.clamp(delta, 0, 1) * 1000;
     const timeStepMs = _timeStep * 1000;
     const timeSinceLast = nowTime - steppingState.lastTime;
     steppingState.lastTime = nowTime;
@@ -552,7 +563,7 @@ const Physics = ({
       }
 
       let oldState = previousTranslations[rigidBody.handle];
-      let newTranslation = rapierVector3ToVector3(rigidBody.translation());
+      let newTranslation = rigidBody.translation();
       let newRotation = rapierQuaternionToQuaternion(rigidBody.rotation());
       let interpolatedTranslation = oldState ? oldState.translation.lerp(newTranslation, 1) : newTranslation;
       let interpolatedRotation = oldState ? oldState.rotation.slerp(newRotation, interpolationAlpha) : newRotation;
@@ -577,36 +588,65 @@ const Physics = ({
 
       const rigidBody1 = world.getRigidBody(rigidBodyHandle1);
       const rigidBody2 = world.getRigidBody(rigidBodyHandle2);
-      const events1 = rigidBodyEvents.get(rigidBodyHandle1);
-      const events2 = rigidBodyEvents.get(rigidBodyHandle2);
+      const rigidBody1Events = rigidBodyEvents.get(rigidBodyHandle1);
+      const rigidBoyd2Events = rigidBodyEvents.get(rigidBodyHandle2);
+      const collider1Events = colliderEvents.get(collider1.handle);
+      const collider2Events = colliderEvents.get(collider2.handle);
 
       if (started) {
         world.contactPair(collider1, collider2, (manifold, flipped) => {
-          var _events1$onCollisionE, _events2$onCollisionE;
+          var _rigidBody1Events$onC, _rigidBoyd2Events$onC, _collider1Events$onCo, _collider2Events$onCo;
 
-          events1 === null || events1 === void 0 ? void 0 : (_events1$onCollisionE = events1.onCollisionEnter) === null || _events1$onCollisionE === void 0 ? void 0 : _events1$onCollisionE.call(events1, {
+          /* RigidBody events */
+          rigidBody1Events === null || rigidBody1Events === void 0 ? void 0 : (_rigidBody1Events$onC = rigidBody1Events.onCollisionEnter) === null || _rigidBody1Events$onC === void 0 ? void 0 : _rigidBody1Events$onC.call(rigidBody1Events, {
             target: rigidBody2,
+            collider: collider2,
             manifold,
             flipped
           });
-          events2 === null || events2 === void 0 ? void 0 : (_events2$onCollisionE = events2.onCollisionEnter) === null || _events2$onCollisionE === void 0 ? void 0 : _events2$onCollisionE.call(events2, {
+          rigidBoyd2Events === null || rigidBoyd2Events === void 0 ? void 0 : (_rigidBoyd2Events$onC = rigidBoyd2Events.onCollisionEnter) === null || _rigidBoyd2Events$onC === void 0 ? void 0 : _rigidBoyd2Events$onC.call(rigidBoyd2Events, {
             target: rigidBody1,
+            collider: collider1,
+            manifold,
+            flipped
+          });
+          /* Collider events */
+
+          collider1Events === null || collider1Events === void 0 ? void 0 : (_collider1Events$onCo = collider1Events.onCollisionEnter) === null || _collider1Events$onCo === void 0 ? void 0 : _collider1Events$onCo.call(collider1Events, {
+            target: rigidBody2,
+            collider: collider2,
+            manifold,
+            flipped
+          });
+          collider2Events === null || collider2Events === void 0 ? void 0 : (_collider2Events$onCo = collider2Events.onCollisionEnter) === null || _collider2Events$onCo === void 0 ? void 0 : _collider2Events$onCo.call(collider2Events, {
+            target: rigidBody1,
+            collider: collider1,
             manifold,
             flipped
           });
         });
       } else {
-        var _events1$onCollisionE2, _events2$onCollisionE2;
+        var _rigidBody1Events$onC2, _rigidBoyd2Events$onC2, _collider1Events$onCo2, _collider2Events$onCo2;
 
-        events1 === null || events1 === void 0 ? void 0 : (_events1$onCollisionE2 = events1.onCollisionExit) === null || _events1$onCollisionE2 === void 0 ? void 0 : _events1$onCollisionE2.call(events1, {
-          target: rigidBody2
+        rigidBody1Events === null || rigidBody1Events === void 0 ? void 0 : (_rigidBody1Events$onC2 = rigidBody1Events.onCollisionExit) === null || _rigidBody1Events$onC2 === void 0 ? void 0 : _rigidBody1Events$onC2.call(rigidBody1Events, {
+          target: rigidBody2,
+          collider: collider2
+        });
+        rigidBoyd2Events === null || rigidBoyd2Events === void 0 ? void 0 : (_rigidBoyd2Events$onC2 = rigidBoyd2Events.onCollisionExit) === null || _rigidBoyd2Events$onC2 === void 0 ? void 0 : _rigidBoyd2Events$onC2.call(rigidBoyd2Events, {
+          target: rigidBody1,
+          collider: collider1
         });
-        events2 === null || events2 === void 0 ? void 0 : (_events2$onCollisionE2 = events2.onCollisionExit) === null || _events2$onCollisionE2 === void 0 ? void 0 : _events2$onCollisionE2.call(events2, {
-          target: rigidBody1
+        collider1Events === null || collider1Events === void 0 ? void 0 : (_collider1Events$onCo2 = collider1Events.onCollisionExit) === null || _collider1Events$onCo2 === void 0 ? void 0 : _collider1Events$onCo2.call(collider1Events, {
+          target: rigidBody2,
+          collider: collider2
+        });
+        collider2Events === null || collider2Events === void 0 ? void 0 : (_collider2Events$onCo2 = collider2Events.onCollisionExit) === null || _collider2Events$onCo2 === void 0 ? void 0 : _collider2Events$onCo2.call(collider2Events, {
+          target: rigidBody1,
+          collider: collider1
         });
       }
     });
-  });
+  }, updatePriority);
   const api = React.useMemo(() => createWorldApi(getWorldRef), []);
   const context = React.useMemo(() => ({
     rapier,
@@ -617,6 +657,7 @@ const Physics = ({
     },
     rigidBodyStates,
     rigidBodyEvents,
+    colliderEvents,
     isPaused
   }), [isPaused]);
   return /*#__PURE__*/React__default["default"].createElement(RapierContext.Provider, {
@@ -1282,22 +1323,26 @@ const InstancedRigidBodies = /*#__PURE__*/React.forwardRef((props, ref) => {
   }, props.children));
 });
 
-const _excluded = ["children"];
+const _excluded = ["children", "onCollisionEnter", "onCollisionExit"];
 
 const AnyCollider = _ref => {
   let {
-    children
+    children,
+    onCollisionEnter,
+    onCollisionExit
   } = _ref,
       props = _objectWithoutProperties(_ref, _excluded);
 
   const {
-    world
+    world,
+    colliderEvents
   } = useRapier();
   const rigidBodyContext = useRigidBodyContext();
   const ref = React.useRef(null);
   React.useEffect(() => {
     const scale = ref.current.getWorldScale(new three.Vector3());
-    const colliders = []; // If this is an InstancedRigidBody api
+    const colliders = [];
+    const hasCollisionEvents = (rigidBodyContext === null || rigidBodyContext === void 0 ? void 0 : rigidBodyContext.hasCollisionEvents) || !!onCollisionEnter || !!onCollisionExit; // If this is an InstancedRigidBody api
 
     if (rigidBodyContext && "at" in rigidBodyContext.api) {
       rigidBodyContext.api.forEach((body, index) => {
@@ -1310,26 +1355,41 @@ const AnyCollider = _ref => {
         }
 
         colliders.push(createColliderFromOptions({
-          options: props,
+          options: _objectSpread2({
+            solverGroups: rigidBodyContext.options.solverGroups,
+            collisionGroups: rigidBodyContext.options.collisionGroups
+          }, props),
           world,
           rigidBody: body.raw(),
           scale: instanceScale,
-          hasCollisionEvents: rigidBodyContext === null || rigidBodyContext === void 0 ? void 0 : rigidBodyContext.hasCollisionEvents
+          hasCollisionEvents
         }));
       });
     } else {
       colliders.push(createColliderFromOptions({
-        options: props,
+        options: _objectSpread2({
+          solverGroups: (rigidBodyContext === null || rigidBodyContext === void 0 ? void 0 : rigidBodyContext.options.solverGroups) || props.solverGroups,
+          collisionGroups: (rigidBodyContext === null || rigidBodyContext === void 0 ? void 0 : rigidBodyContext.options.collisionGroups) || props.collisionGroups
+        }, props),
         world,
         // Initiate with a rigidbody, or undefined, because colliders can exist without a rigid body
         rigidBody: rigidBodyContext && "raw" in rigidBodyContext.api ? rigidBodyContext.api.raw() : undefined,
         scale,
-        hasCollisionEvents: rigidBodyContext === null || rigidBodyContext === void 0 ? void 0 : rigidBodyContext.hasCollisionEvents
+        hasCollisionEvents
       }));
     }
+    /* Register collision events. */
+
 
+    colliders.forEach(collider => colliderEvents.set(collider.handle, {
+      onCollisionEnter,
+      onCollisionExit
+    }));
     return () => {
-      colliders.forEach(collider => world.removeCollider(collider));
+      colliders.forEach(collider => {
+        colliderEvents.delete(collider.handle);
+        world.removeCollider(collider);
+      });
     };
   }, []);
   return /*#__PURE__*/React__default["default"].createElement("object3D", {
@@ -1383,6 +1443,42 @@ const ConvexHullCollider = props => {
   }));
 };
 
+/**
+ * Calculates an InteractionGroup bitmask for use in the `collisionGroups` or `solverGroups`
+ * properties of RigidBody or Collider components. The first argument represents a list of
+ * groups the entity is in (expressed as numbers from 0 to 15). The second argument is a list
+ * of groups that will be filtered against. When it is omitted, all groups are filtered against.
+ *
+ * @example
+ * A RigidBody that is member of group 0 and will collide with everything from groups 0 and 1:
+ *
+ * ```tsx
+ * <RigidBody collisionGroups={interactionGroups([0], [0, 1])} />
+ * ```
+ *
+ * A RigidBody that is member of groups 0 and 1 and will collide with everything else:
+ *
+ * ```tsx
+ * <RigidBody collisionGroups={interactionGroups([0, 1])} />
+ * ```
+ *
+ * A RigidBody that is member of groups 0 and 1 and will not collide with anything:
+ *
+ * ```tsx
+ * <RigidBody collisionGroups={interactionGroups([0, 1], [])} />
+ * ```
+ *
+ * Please note that Rapier needs interaction filters to evaluate to true between _both_ colliding
+ * entities for collision events to trigger.
+ *
+ * @param memberships Groups the collider is a member of. (Values can range from 0 to 15.)
+ * @param filters Groups the interaction group should filter against. (Values can range from 0 to 15.)
+ * @returns An InteractionGroup bitmask.
+ */
+const interactionGroups = (memberships, filters) => (bitmask(memberships) << 16) + (filters !== undefined ? bitmask(filters) : 0b1111111111111111);
+
+const bitmask = groups => [groups].flat().reduce((acc, layer) => acc | 1 << layer, 0);
+
 Object.defineProperty(exports, 'CoefficientCombineRule', {
   enumerable: true,
   get: function () { return rapier3dCompat.CoefficientCombineRule; }
@@ -1409,6 +1505,7 @@ exports.Physics = Physics;
 exports.RigidBody = RigidBody;
 exports.RoundCuboidCollider = RoundCuboidCollider;
 exports.TrimeshCollider = TrimeshCollider;
+exports.interactionGroups = interactionGroups;
 exports.useFixedJoint = useFixedJoint;
 exports.useImpulseJoint = useImpulseJoint;
 exports.usePrismaticJoint = usePrismaticJoint;

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

@@ -8,6 +8,7 @@ var useAsset = require('use-asset');
 var fiber = require('@react-three/fiber');
 var three = require('three');
 var BufferGeometryUtils = require('three/examples/jsm/utils/BufferGeometryUtils');
+var MathUtils = require('three/src/math/MathUtils');
 var threeStdlib = require('three-stdlib');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
@@ -49,7 +50,7 @@ const rapierVector3ToVector3 = ({
   x,
   y,
   z
-}) => _vector3.set(x, y, z).clone();
+}) => _vector3.set(x, y, z);
 const rapierQuaternionToQuaternion = ({
   x,
   y,
@@ -95,6 +96,12 @@ const scaleColliderArgs = (shape, args, scale) => {
   const scaleArray = [scale.x, scale.y, scale.z, scale.x, scale.x];
   return newArgs.map((arg, index) => scaleArray[index] * arg);
 };
+
+const applyColliderOptions = (collider, options) => {
+  if (options.collisionGroups !== undefined) collider.setCollisionGroups(options.collisionGroups);
+  if (options.solverGroups !== undefined) collider.setSolverGroups(options.solverGroups);
+};
+
 const createColliderFromOptions = ({
   options,
   world,
@@ -148,6 +155,7 @@ const createColliderFromOptions = ({
   }
 
   const collider = world.createCollider(colliderDesc, rigidBody);
+  applyColliderOptions(collider, options);
   return collider;
 };
 
@@ -213,6 +221,7 @@ const createCollidersFromChildren = ({
       });
       const actualRigidBody = rigidBody ? world.getRigidBody(rigidBody.handle) : undefined;
       const collider = world.createCollider(desc, actualRigidBody);
+      applyColliderOptions(collider, options);
       colliders.push(collider);
     }
   });
@@ -450,7 +459,8 @@ const Physics = ({
   children,
   timeStep: _timeStep = 1 / 60,
   maxSubSteps: _maxSubSteps = 10,
-  paused: _paused = false
+  paused: _paused = false,
+  updatePriority
 }) => {
   const rapier = useAsset.useAsset(importRapier);
   const [isPaused, setIsPaused] = React.useState(_paused);
@@ -468,6 +478,7 @@ const Physics = ({
   });
   const [rigidBodyStates] = React.useState(() => new Map());
   const [rigidBodyEvents] = React.useState(() => new Map());
+  const [colliderEvents] = React.useState(() => new Map());
   const [eventQueue] = React.useState(() => new rapier3dCompat.EventQueue(false)); // Init world
 
   React.useEffect(() => {
@@ -497,12 +508,12 @@ const Physics = ({
     world.timestep = _timeStep;
     /**
      * Fixed timeStep simulation progression
-     * @see https://gafferongames.com/post/fix_your_timestep/ 
+     * @see https://gafferongames.com/post/fix_your_timestep/
     */
 
     let previousTranslations = {}; // don't step time forwards if paused
 
-    const nowTime = steppingState.time += _paused ? 0 : delta * 1000;
+    const nowTime = steppingState.time += _paused ? 0 : MathUtils.clamp(delta, 0, 1) * 1000;
     const timeStepMs = _timeStep * 1000;
     const timeSinceLast = nowTime - steppingState.lastTime;
     steppingState.lastTime = nowTime;
@@ -552,7 +563,7 @@ const Physics = ({
       }
 
       let oldState = previousTranslations[rigidBody.handle];
-      let newTranslation = rapierVector3ToVector3(rigidBody.translation());
+      let newTranslation = rigidBody.translation();
       let newRotation = rapierQuaternionToQuaternion(rigidBody.rotation());
       let interpolatedTranslation = oldState ? oldState.translation.lerp(newTranslation, 1) : newTranslation;
       let interpolatedRotation = oldState ? oldState.rotation.slerp(newRotation, interpolationAlpha) : newRotation;
@@ -577,36 +588,65 @@ const Physics = ({
 
       const rigidBody1 = world.getRigidBody(rigidBodyHandle1);
       const rigidBody2 = world.getRigidBody(rigidBodyHandle2);
-      const events1 = rigidBodyEvents.get(rigidBodyHandle1);
-      const events2 = rigidBodyEvents.get(rigidBodyHandle2);
+      const rigidBody1Events = rigidBodyEvents.get(rigidBodyHandle1);
+      const rigidBoyd2Events = rigidBodyEvents.get(rigidBodyHandle2);
+      const collider1Events = colliderEvents.get(collider1.handle);
+      const collider2Events = colliderEvents.get(collider2.handle);
 
       if (started) {
         world.contactPair(collider1, collider2, (manifold, flipped) => {
-          var _events1$onCollisionE, _events2$onCollisionE;
+          var _rigidBody1Events$onC, _rigidBoyd2Events$onC, _collider1Events$onCo, _collider2Events$onCo;
 
-          events1 === null || events1 === void 0 ? void 0 : (_events1$onCollisionE = events1.onCollisionEnter) === null || _events1$onCollisionE === void 0 ? void 0 : _events1$onCollisionE.call(events1, {
+          /* RigidBody events */
+          rigidBody1Events === null || rigidBody1Events === void 0 ? void 0 : (_rigidBody1Events$onC = rigidBody1Events.onCollisionEnter) === null || _rigidBody1Events$onC === void 0 ? void 0 : _rigidBody1Events$onC.call(rigidBody1Events, {
             target: rigidBody2,
+            collider: collider2,
             manifold,
             flipped
           });
-          events2 === null || events2 === void 0 ? void 0 : (_events2$onCollisionE = events2.onCollisionEnter) === null || _events2$onCollisionE === void 0 ? void 0 : _events2$onCollisionE.call(events2, {
+          rigidBoyd2Events === null || rigidBoyd2Events === void 0 ? void 0 : (_rigidBoyd2Events$onC = rigidBoyd2Events.onCollisionEnter) === null || _rigidBoyd2Events$onC === void 0 ? void 0 : _rigidBoyd2Events$onC.call(rigidBoyd2Events, {
             target: rigidBody1,
+            collider: collider1,
+            manifold,
+            flipped
+          });
+          /* Collider events */
+
+          collider1Events === null || collider1Events === void 0 ? void 0 : (_collider1Events$onCo = collider1Events.onCollisionEnter) === null || _collider1Events$onCo === void 0 ? void 0 : _collider1Events$onCo.call(collider1Events, {
+            target: rigidBody2,
+            collider: collider2,
+            manifold,
+            flipped
+          });
+          collider2Events === null || collider2Events === void 0 ? void 0 : (_collider2Events$onCo = collider2Events.onCollisionEnter) === null || _collider2Events$onCo === void 0 ? void 0 : _collider2Events$onCo.call(collider2Events, {
+            target: rigidBody1,
+            collider: collider1,
             manifold,
             flipped
           });
         });
       } else {
-        var _events1$onCollisionE2, _events2$onCollisionE2;
+        var _rigidBody1Events$onC2, _rigidBoyd2Events$onC2, _collider1Events$onCo2, _collider2Events$onCo2;
 
-        events1 === null || events1 === void 0 ? void 0 : (_events1$onCollisionE2 = events1.onCollisionExit) === null || _events1$onCollisionE2 === void 0 ? void 0 : _events1$onCollisionE2.call(events1, {
-          target: rigidBody2
+        rigidBody1Events === null || rigidBody1Events === void 0 ? void 0 : (_rigidBody1Events$onC2 = rigidBody1Events.onCollisionExit) === null || _rigidBody1Events$onC2 === void 0 ? void 0 : _rigidBody1Events$onC2.call(rigidBody1Events, {
+          target: rigidBody2,
+          collider: collider2
+        });
+        rigidBoyd2Events === null || rigidBoyd2Events === void 0 ? void 0 : (_rigidBoyd2Events$onC2 = rigidBoyd2Events.onCollisionExit) === null || _rigidBoyd2Events$onC2 === void 0 ? void 0 : _rigidBoyd2Events$onC2.call(rigidBoyd2Events, {
+          target: rigidBody1,
+          collider: collider1
         });
-        events2 === null || events2 === void 0 ? void 0 : (_events2$onCollisionE2 = events2.onCollisionExit) === null || _events2$onCollisionE2 === void 0 ? void 0 : _events2$onCollisionE2.call(events2, {
-          target: rigidBody1
+        collider1Events === null || collider1Events === void 0 ? void 0 : (_collider1Events$onCo2 = collider1Events.onCollisionExit) === null || _collider1Events$onCo2 === void 0 ? void 0 : _collider1Events$onCo2.call(collider1Events, {
+          target: rigidBody2,
+          collider: collider2
+        });
+        collider2Events === null || collider2Events === void 0 ? void 0 : (_collider2Events$onCo2 = collider2Events.onCollisionExit) === null || _collider2Events$onCo2 === void 0 ? void 0 : _collider2Events$onCo2.call(collider2Events, {
+          target: rigidBody1,
+          collider: collider1
         });
       }
     });
-  });
+  }, updatePriority);
   const api = React.useMemo(() => createWorldApi(getWorldRef), []);
   const context = React.useMemo(() => ({
     rapier,
@@ -617,6 +657,7 @@ const Physics = ({
     },
     rigidBodyStates,
     rigidBodyEvents,
+    colliderEvents,
     isPaused
   }), [isPaused]);
   return /*#__PURE__*/React__default["default"].createElement(RapierContext.Provider, {
@@ -1282,22 +1323,26 @@ const InstancedRigidBodies = /*#__PURE__*/React.forwardRef((props, ref) => {
   }, props.children));
 });
 
-const _excluded = ["children"];
+const _excluded = ["children", "onCollisionEnter", "onCollisionExit"];
 
 const AnyCollider = _ref => {
   let {
-    children
+    children,
+    onCollisionEnter,
+    onCollisionExit
   } = _ref,
       props = _objectWithoutProperties(_ref, _excluded);
 
   const {
-    world
+    world,
+    colliderEvents
   } = useRapier();
   const rigidBodyContext = useRigidBodyContext();
   const ref = React.useRef(null);
   React.useEffect(() => {
     const scale = ref.current.getWorldScale(new three.Vector3());
-    const colliders = []; // If this is an InstancedRigidBody api
+    const colliders = [];
+    const hasCollisionEvents = (rigidBodyContext === null || rigidBodyContext === void 0 ? void 0 : rigidBodyContext.hasCollisionEvents) || !!onCollisionEnter || !!onCollisionExit; // If this is an InstancedRigidBody api
 
     if (rigidBodyContext && "at" in rigidBodyContext.api) {
       rigidBodyContext.api.forEach((body, index) => {
@@ -1310,26 +1355,41 @@ const AnyCollider = _ref => {
         }
 
         colliders.push(createColliderFromOptions({
-          options: props,
+          options: _objectSpread2({
+            solverGroups: rigidBodyContext.options.solverGroups,
+            collisionGroups: rigidBodyContext.options.collisionGroups
+          }, props),
           world,
           rigidBody: body.raw(),
           scale: instanceScale,
-          hasCollisionEvents: rigidBodyContext === null || rigidBodyContext === void 0 ? void 0 : rigidBodyContext.hasCollisionEvents
+          hasCollisionEvents
         }));
       });
     } else {
       colliders.push(createColliderFromOptions({
-        options: props,
+        options: _objectSpread2({
+          solverGroups: (rigidBodyContext === null || rigidBodyContext === void 0 ? void 0 : rigidBodyContext.options.solverGroups) || props.solverGroups,
+          collisionGroups: (rigidBodyContext === null || rigidBodyContext === void 0 ? void 0 : rigidBodyContext.options.collisionGroups) || props.collisionGroups
+        }, props),
         world,
         // Initiate with a rigidbody, or undefined, because colliders can exist without a rigid body
         rigidBody: rigidBodyContext && "raw" in rigidBodyContext.api ? rigidBodyContext.api.raw() : undefined,
         scale,
-        hasCollisionEvents: rigidBodyContext === null || rigidBodyContext === void 0 ? void 0 : rigidBodyContext.hasCollisionEvents
+        hasCollisionEvents
       }));
     }
+    /* Register collision events. */
+
 
+    colliders.forEach(collider => colliderEvents.set(collider.handle, {
+      onCollisionEnter,
+      onCollisionExit
+    }));
     return () => {
-      colliders.forEach(collider => world.removeCollider(collider));
+      colliders.forEach(collider => {
+        colliderEvents.delete(collider.handle);
+        world.removeCollider(collider);
+      });
     };
   }, []);
   return /*#__PURE__*/React__default["default"].createElement("object3D", {
@@ -1383,6 +1443,42 @@ const ConvexHullCollider = props => {
   }));
 };
 
+/**
+ * Calculates an InteractionGroup bitmask for use in the `collisionGroups` or `solverGroups`
+ * properties of RigidBody or Collider components. The first argument represents a list of
+ * groups the entity is in (expressed as numbers from 0 to 15). The second argument is a list
+ * of groups that will be filtered against. When it is omitted, all groups are filtered against.
+ *
+ * @example
+ * A RigidBody that is member of group 0 and will collide with everything from groups 0 and 1:
+ *
+ * ```tsx
+ * <RigidBody collisionGroups={interactionGroups([0], [0, 1])} />
+ * ```
+ *
+ * A RigidBody that is member of groups 0 and 1 and will collide with everything else:
+ *
+ * ```tsx
+ * <RigidBody collisionGroups={interactionGroups([0, 1])} />
+ * ```
+ *
+ * A RigidBody that is member of groups 0 and 1 and will not collide with anything:
+ *
+ * ```tsx
+ * <RigidBody collisionGroups={interactionGroups([0, 1], [])} />
+ * ```
+ *
+ * Please note that Rapier needs interaction filters to evaluate to true between _both_ colliding
+ * entities for collision events to trigger.
+ *
+ * @param memberships Groups the collider is a member of. (Values can range from 0 to 15.)
+ * @param filters Groups the interaction group should filter against. (Values can range from 0 to 15.)
+ * @returns An InteractionGroup bitmask.
+ */
+const interactionGroups = (memberships, filters) => (bitmask(memberships) << 16) + (filters !== undefined ? bitmask(filters) : 0b1111111111111111);
+
+const bitmask = groups => [groups].flat().reduce((acc, layer) => acc | 1 << layer, 0);
+
 Object.defineProperty(exports, 'CoefficientCombineRule', {
   enumerable: true,
   get: function () { return rapier3dCompat.CoefficientCombineRule; }
@@ -1409,6 +1505,7 @@ exports.Physics = Physics;
 exports.RigidBody = RigidBody;
 exports.RoundCuboidCollider = RoundCuboidCollider;
 exports.TrimeshCollider = TrimeshCollider;
+exports.interactionGroups = interactionGroups;
 exports.useFixedJoint = useFixedJoint;
 exports.useImpulseJoint = useImpulseJoint;
 exports.usePrismaticJoint = usePrismaticJoint;

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

@@ -5,6 +5,7 @@ import { useAsset } from 'use-asset';
 import { useFrame } from '@react-three/fiber';
 import { Quaternion, Euler, Vector3, Object3D, Matrix4, InstancedMesh, MeshBasicMaterial, Color, PlaneGeometry, ConeBufferGeometry, CapsuleBufferGeometry, CylinderBufferGeometry, BufferGeometry, BufferAttribute, SphereBufferGeometry, BoxBufferGeometry, DynamicDrawUsage } from 'three';
 import { mergeVertices } from 'three/examples/jsm/utils/BufferGeometryUtils';
+import { clamp } from 'three/src/math/MathUtils';
 import { RoundedBoxGeometry } from 'three-stdlib';
 
 const _quaternion = new Quaternion();
@@ -24,7 +25,7 @@ const rapierVector3ToVector3 = ({
   x,
   y,
   z
-}) => _vector3.set(x, y, z).clone();
+}) => _vector3.set(x, y, z);
 const rapierQuaternionToQuaternion = ({
   x,
   y,
@@ -70,6 +71,12 @@ const scaleColliderArgs = (shape, args, scale) => {
   const scaleArray = [scale.x, scale.y, scale.z, scale.x, scale.x];
   return newArgs.map((arg, index) => scaleArray[index] * arg);
 };
+
+const applyColliderOptions = (collider, options) => {
+  if (options.collisionGroups !== undefined) collider.setCollisionGroups(options.collisionGroups);
+  if (options.solverGroups !== undefined) collider.setSolverGroups(options.solverGroups);
+};
+
 const createColliderFromOptions = ({
   options,
   world,
@@ -123,6 +130,7 @@ const createColliderFromOptions = ({
   }
 
   const collider = world.createCollider(colliderDesc, rigidBody);
+  applyColliderOptions(collider, options);
   return collider;
 };
 
@@ -188,6 +196,7 @@ const createCollidersFromChildren = ({
       });
       const actualRigidBody = rigidBody ? world.getRigidBody(rigidBody.handle) : undefined;
       const collider = world.createCollider(desc, actualRigidBody);
+      applyColliderOptions(collider, options);
       colliders.push(collider);
     }
   });
@@ -425,7 +434,8 @@ const Physics = ({
   children,
   timeStep: _timeStep = 1 / 60,
   maxSubSteps: _maxSubSteps = 10,
-  paused: _paused = false
+  paused: _paused = false,
+  updatePriority
 }) => {
   const rapier = useAsset(importRapier);
   const [isPaused, setIsPaused] = useState(_paused);
@@ -443,6 +453,7 @@ const Physics = ({
   });
   const [rigidBodyStates] = useState(() => new Map());
   const [rigidBodyEvents] = useState(() => new Map());
+  const [colliderEvents] = useState(() => new Map());
   const [eventQueue] = useState(() => new EventQueue(false)); // Init world
 
   useEffect(() => {
@@ -472,12 +483,12 @@ const Physics = ({
     world.timestep = _timeStep;
     /**
      * Fixed timeStep simulation progression
-     * @see https://gafferongames.com/post/fix_your_timestep/ 
+     * @see https://gafferongames.com/post/fix_your_timestep/
     */
 
     let previousTranslations = {}; // don't step time forwards if paused
 
-    const nowTime = steppingState.time += _paused ? 0 : delta * 1000;
+    const nowTime = steppingState.time += _paused ? 0 : clamp(delta, 0, 1) * 1000;
     const timeStepMs = _timeStep * 1000;
     const timeSinceLast = nowTime - steppingState.lastTime;
     steppingState.lastTime = nowTime;
@@ -527,7 +538,7 @@ const Physics = ({
       }
 
       let oldState = previousTranslations[rigidBody.handle];
-      let newTranslation = rapierVector3ToVector3(rigidBody.translation());
+      let newTranslation = rigidBody.translation();
       let newRotation = rapierQuaternionToQuaternion(rigidBody.rotation());
       let interpolatedTranslation = oldState ? oldState.translation.lerp(newTranslation, 1) : newTranslation;
       let interpolatedRotation = oldState ? oldState.rotation.slerp(newRotation, interpolationAlpha) : newRotation;
@@ -552,36 +563,65 @@ const Physics = ({
 
       const rigidBody1 = world.getRigidBody(rigidBodyHandle1);
       const rigidBody2 = world.getRigidBody(rigidBodyHandle2);
-      const events1 = rigidBodyEvents.get(rigidBodyHandle1);
-      const events2 = rigidBodyEvents.get(rigidBodyHandle2);
+      const rigidBody1Events = rigidBodyEvents.get(rigidBodyHandle1);
+      const rigidBoyd2Events = rigidBodyEvents.get(rigidBodyHandle2);
+      const collider1Events = colliderEvents.get(collider1.handle);
+      const collider2Events = colliderEvents.get(collider2.handle);
 
       if (started) {
         world.contactPair(collider1, collider2, (manifold, flipped) => {
-          var _events1$onCollisionE, _events2$onCollisionE;
+          var _rigidBody1Events$onC, _rigidBoyd2Events$onC, _collider1Events$onCo, _collider2Events$onCo;
 
-          events1 === null || events1 === void 0 ? void 0 : (_events1$onCollisionE = events1.onCollisionEnter) === null || _events1$onCollisionE === void 0 ? void 0 : _events1$onCollisionE.call(events1, {
+          /* RigidBody events */
+          rigidBody1Events === null || rigidBody1Events === void 0 ? void 0 : (_rigidBody1Events$onC = rigidBody1Events.onCollisionEnter) === null || _rigidBody1Events$onC === void 0 ? void 0 : _rigidBody1Events$onC.call(rigidBody1Events, {
             target: rigidBody2,
+            collider: collider2,
             manifold,
             flipped
           });
-          events2 === null || events2 === void 0 ? void 0 : (_events2$onCollisionE = events2.onCollisionEnter) === null || _events2$onCollisionE === void 0 ? void 0 : _events2$onCollisionE.call(events2, {
+          rigidBoyd2Events === null || rigidBoyd2Events === void 0 ? void 0 : (_rigidBoyd2Events$onC = rigidBoyd2Events.onCollisionEnter) === null || _rigidBoyd2Events$onC === void 0 ? void 0 : _rigidBoyd2Events$onC.call(rigidBoyd2Events, {
             target: rigidBody1,
+            collider: collider1,
+            manifold,
+            flipped
+          });
+          /* Collider events */
+
+          collider1Events === null || collider1Events === void 0 ? void 0 : (_collider1Events$onCo = collider1Events.onCollisionEnter) === null || _collider1Events$onCo === void 0 ? void 0 : _collider1Events$onCo.call(collider1Events, {
+            target: rigidBody2,
+            collider: collider2,
+            manifold,
+            flipped
+          });
+          collider2Events === null || collider2Events === void 0 ? void 0 : (_collider2Events$onCo = collider2Events.onCollisionEnter) === null || _collider2Events$onCo === void 0 ? void 0 : _collider2Events$onCo.call(collider2Events, {
+            target: rigidBody1,
+            collider: collider1,
             manifold,
             flipped
           });
         });
       } else {
-        var _events1$onCollisionE2, _events2$onCollisionE2;
+        var _rigidBody1Events$onC2, _rigidBoyd2Events$onC2, _collider1Events$onCo2, _collider2Events$onCo2;
 
-        events1 === null || events1 === void 0 ? void 0 : (_events1$onCollisionE2 = events1.onCollisionExit) === null || _events1$onCollisionE2 === void 0 ? void 0 : _events1$onCollisionE2.call(events1, {
-          target: rigidBody2
+        rigidBody1Events === null || rigidBody1Events === void 0 ? void 0 : (_rigidBody1Events$onC2 = rigidBody1Events.onCollisionExit) === null || _rigidBody1Events$onC2 === void 0 ? void 0 : _rigidBody1Events$onC2.call(rigidBody1Events, {
+          target: rigidBody2,
+          collider: collider2
+        });
+        rigidBoyd2Events === null || rigidBoyd2Events === void 0 ? void 0 : (_rigidBoyd2Events$onC2 = rigidBoyd2Events.onCollisionExit) === null || _rigidBoyd2Events$onC2 === void 0 ? void 0 : _rigidBoyd2Events$onC2.call(rigidBoyd2Events, {
+          target: rigidBody1,
+          collider: collider1
         });
-        events2 === null || events2 === void 0 ? void 0 : (_events2$onCollisionE2 = events2.onCollisionExit) === null || _events2$onCollisionE2 === void 0 ? void 0 : _events2$onCollisionE2.call(events2, {
-          target: rigidBody1
+        collider1Events === null || collider1Events === void 0 ? void 0 : (_collider1Events$onCo2 = collider1Events.onCollisionExit) === null || _collider1Events$onCo2 === void 0 ? void 0 : _collider1Events$onCo2.call(collider1Events, {
+          target: rigidBody2,
+          collider: collider2
+        });
+        collider2Events === null || collider2Events === void 0 ? void 0 : (_collider2Events$onCo2 = collider2Events.onCollisionExit) === null || _collider2Events$onCo2 === void 0 ? void 0 : _collider2Events$onCo2.call(collider2Events, {
+          target: rigidBody1,
+          collider: collider1
         });
       }
     });
-  });
+  }, updatePriority);
   const api = useMemo(() => createWorldApi(getWorldRef), []);
   const context = useMemo(() => ({
     rapier,
@@ -592,6 +632,7 @@ const Physics = ({
     },
     rigidBodyStates,
     rigidBodyEvents,
+    colliderEvents,
     isPaused
   }), [isPaused]);
   return /*#__PURE__*/React.createElement(RapierContext.Provider, {
@@ -1257,22 +1298,26 @@ const InstancedRigidBodies = /*#__PURE__*/forwardRef((props, ref) => {
   }, props.children));
 });
 
-const _excluded = ["children"];
+const _excluded = ["children", "onCollisionEnter", "onCollisionExit"];
 
 const AnyCollider = _ref => {
   let {
-    children
+    children,
+    onCollisionEnter,
+    onCollisionExit
   } = _ref,
       props = _objectWithoutProperties(_ref, _excluded);
 
   const {
-    world
+    world,
+    colliderEvents
   } = useRapier();
   const rigidBodyContext = useRigidBodyContext();
   const ref = useRef(null);
   useEffect(() => {
     const scale = ref.current.getWorldScale(new Vector3());
-    const colliders = []; // If this is an InstancedRigidBody api
+    const colliders = [];
+    const hasCollisionEvents = (rigidBodyContext === null || rigidBodyContext === void 0 ? void 0 : rigidBodyContext.hasCollisionEvents) || !!onCollisionEnter || !!onCollisionExit; // If this is an InstancedRigidBody api
 
     if (rigidBodyContext && "at" in rigidBodyContext.api) {
       rigidBodyContext.api.forEach((body, index) => {
@@ -1285,26 +1330,41 @@ const AnyCollider = _ref => {
         }
 
         colliders.push(createColliderFromOptions({
-          options: props,
+          options: _objectSpread2({
+            solverGroups: rigidBodyContext.options.solverGroups,
+            collisionGroups: rigidBodyContext.options.collisionGroups
+          }, props),
           world,
           rigidBody: body.raw(),
           scale: instanceScale,
-          hasCollisionEvents: rigidBodyContext === null || rigidBodyContext === void 0 ? void 0 : rigidBodyContext.hasCollisionEvents
+          hasCollisionEvents
         }));
       });
     } else {
       colliders.push(createColliderFromOptions({
-        options: props,
+        options: _objectSpread2({
+          solverGroups: (rigidBodyContext === null || rigidBodyContext === void 0 ? void 0 : rigidBodyContext.options.solverGroups) || props.solverGroups,
+          collisionGroups: (rigidBodyContext === null || rigidBodyContext === void 0 ? void 0 : rigidBodyContext.options.collisionGroups) || props.collisionGroups
+        }, props),
         world,
         // Initiate with a rigidbody, or undefined, because colliders can exist without a rigid body
         rigidBody: rigidBodyContext && "raw" in rigidBodyContext.api ? rigidBodyContext.api.raw() : undefined,
         scale,
-        hasCollisionEvents: rigidBodyContext === null || rigidBodyContext === void 0 ? void 0 : rigidBodyContext.hasCollisionEvents
+        hasCollisionEvents
       }));
     }
+    /* Register collision events. */
+
 
+    colliders.forEach(collider => colliderEvents.set(collider.handle, {
+      onCollisionEnter,
+      onCollisionExit
+    }));
     return () => {
-      colliders.forEach(collider => world.removeCollider(collider));
+      colliders.forEach(collider => {
+        colliderEvents.delete(collider.handle);
+        world.removeCollider(collider);
+      });
     };
   }, []);
   return /*#__PURE__*/React.createElement("object3D", {
@@ -1358,4 +1418,40 @@ const ConvexHullCollider = props => {
   }));
 };
 
-export { BallCollider, CapsuleCollider, ConeCollider, ConvexHullCollider, CuboidCollider, CylinderCollider, Debug, HeightfieldCollider, InstancedRigidBodies, MeshCollider, Physics, RigidBody, RoundCuboidCollider, TrimeshCollider, useFixedJoint, useImpulseJoint, usePrismaticJoint, useRapier, useRevoluteJoint, useRigidBody, useSphericalJoint };
+/**
+ * Calculates an InteractionGroup bitmask for use in the `collisionGroups` or `solverGroups`
+ * properties of RigidBody or Collider components. The first argument represents a list of
+ * groups the entity is in (expressed as numbers from 0 to 15). The second argument is a list
+ * of groups that will be filtered against. When it is omitted, all groups are filtered against.
+ *
+ * @example
+ * A RigidBody that is member of group 0 and will collide with everything from groups 0 and 1:
+ *
+ * ```tsx
+ * <RigidBody collisionGroups={interactionGroups([0], [0, 1])} />
+ * ```
+ *
+ * A RigidBody that is member of groups 0 and 1 and will collide with everything else:
+ *
+ * ```tsx
+ * <RigidBody collisionGroups={interactionGroups([0, 1])} />
+ * ```
+ *
+ * A RigidBody that is member of groups 0 and 1 and will not collide with anything:
+ *
+ * ```tsx
+ * <RigidBody collisionGroups={interactionGroups([0, 1], [])} />
+ * ```
+ *
+ * Please note that Rapier needs interaction filters to evaluate to true between _both_ colliding
+ * entities for collision events to trigger.
+ *
+ * @param memberships Groups the collider is a member of. (Values can range from 0 to 15.)
+ * @param filters Groups the interaction group should filter against. (Values can range from 0 to 15.)
+ * @returns An InteractionGroup bitmask.
+ */
+const interactionGroups = (memberships, filters) => (bitmask(memberships) << 16) + (filters !== undefined ? bitmask(filters) : 0b1111111111111111);
+
+const bitmask = groups => [groups].flat().reduce((acc, layer) => acc | 1 << layer, 0);
+
+export { BallCollider, CapsuleCollider, ConeCollider, ConvexHullCollider, CuboidCollider, CylinderCollider, Debug, HeightfieldCollider, InstancedRigidBodies, MeshCollider, Physics, RigidBody, RoundCuboidCollider, TrimeshCollider, interactionGroups, useFixedJoint, useImpulseJoint, usePrismaticJoint, useRapier, useRevoluteJoint, useRigidBody, useSphericalJoint };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@react-three/rapier",
-  "version": "0.6.8",
+  "version": "0.6.9",
   "source": "src/index.ts",
   "main": "dist/react-three-rapier.cjs.js",
   "module": "dist/react-three-rapier.esm.js",
@@ -20,12 +20,12 @@
   "peerDependencies": {
     "@react-three/fiber": "^8.0.12",
     "react": "^18.0.0",
-    "three": "^0.139.2",
-    "three-stdlib": "^2.15.0"
+    "three": ">=0.139.2"
   },
   "dependencies": {
     "@dimforge/rapier3d-compat": "0.9.0",
-    "use-asset": "^1.0.4"
+    "use-asset": "^1.0.4",
+    "three-stdlib": "^2.15.0"
   },
   "repository": "https://github.com/pmndrs/react-three-rapier/tree/master/packages/react-three-rapier"
 }

package/readme.md

@@ -1,10 +1,10 @@
 <p align="center">
-  <img src="https://raw.githubusercontent.com/pmndrs/react-three-rapier/HEAD/packages/react-three-rapier/misc/hero.svg" alt="@react-three/rapier" />
+  <a href="#"><img src="https://raw.githubusercontent.com/pmndrs/react-three-rapier/HEAD/packages/react-three-rapier/misc/hero.svg" alt="@react-three/rapier" /></a>
 </p>
 
 <p align="center">
-  <img src="https://img.shields.io/npm/v/@react-three/rapier?style=for-the-badge&colorA=0099DA&colorB=ffffff" />
-  <img src="https://img.shields.io/discord/740090768164651008?style=for-the-badge&colorA=0099DA&colorB=ffffff&label=discord&logo=discord&logoColor=ffffff)](https://discord.gg/ZZjjNvJ" />
+  <a href="https://www.npmjs.com/package/@react-three/rapier"><img src="https://img.shields.io/npm/v/@react-three/rapier?style=for-the-badge&colorA=0099DA&colorB=ffffff" /></a>
+  <a href="https://discord.gg/ZZjjNvJ"><img src="https://img.shields.io/discord/740090768164651008?style=for-the-badge&colorA=0099DA&colorB=ffffff&label=discord&logo=discord&logoColor=ffffff" /></a>
 </p>
 
 <p align="center">⚠️ Under heavy development. All APIs are subject to change. ⚠️</p>
@@ -141,7 +141,7 @@ const Scene = () => {
     instancedApi.at(40).applyImpulse({ x: 0, y: 10, z: 0 });
 
     // Or update all instances as if they were in an array
-    instancedApi.forEach((api) => {
+    instancedApi.forEach(api => {
       api.applyImpulse({ x: 0, y: 10, z: 0 });
     });
   }, []);
@@ -153,13 +153,13 @@ const Scene = () => {
   const rotations = Array.from({ length: COUNT }, (_, index) => [
     Math.random(),
     Math.random(),
-    Math.random(),
+    Math.random()
   ]);
 
   const scales = Array.from({ length: COUNT }, (_, index) => [
     Math.random(),
     Math.random(),
-    Math.random(),
+    Math.random()
   ]);
 
   return (
@@ -212,7 +212,7 @@ const Scene = () => {
 
 ## Events
 
-You can subscribe collision and state events on the RigidBody.
+You can subscribe to collision and state events on the RigidBody:
 
 ```tsx
 const RigidBottle = () => {
@@ -235,6 +235,60 @@ return (
 }
 ```
 
+You may also subscribe to collision events on individual colliders:
+
+```tsx
+<CuboidCollider
+  onCollisionEnter={payload => {
+    /* ... */
+  }}
+  onCollisionExit={payload => {
+    /* ... */
+  }}
+/>
+```
+
+The `payload` object for all collision callbacks contains the following properties:
+
+- `target`  
+  The other rigidbody that was involved in the collision event.
+- `collider`  
+  The other collider that was involved in the collision event.
+- `manifold` (enter only)  
+  The [contact manifold](https://rapier.rs/javascript3d/classes/TempContactManifold.html) generated by the collision event.
+- `flipped` (enter only)  
+  `true` if the data in the `manifold` [is flipped](https://rapier.rs/javascript3d/classes/World.html#contactPair).
+
+### Configuring collision and solver groups
+
+Both `<RigidBody>` as well as all collider components allow you to configure `collisionsGroups` and `solverGroups` properties that configures which groups the colliders are in, and what other groups they should interact with in potential collision and solving events (you will find more details on this in the [Rapier documentation](https://rapier.rs/docs/user_guides/javascript/colliders/#collision-groups-and-solver-groups).)
+
+Since these are set as bitmasks and bitmasks can get a bit unwieldy to generate, this library provides a helper called `interactionGroups` that can be used to generate bitmasks from numbers and arrays of groups, where groups are identified using numbers from 0 to 15.
+
+The first argument is the group, or an array of groups, that the collider is a member of; the second argument is the group, or an array of groups, that the collider should interact with.
+
+Here the collider is in group 0, and interacts with colliders from groups 0, 1 and 2:
+
+```tsx
+<CapsuleCollider collisionGroups={interactionGroups(0, [0, 1, 2])} />
+```
+
+This collider is in multiple groups, but only interacts with colliders from a single group:
+
+```tsx
+<CapsuleCollider collisionGroups={interactionGroups([0, 5], 7)} />
+```
+
+When the second argument is omitted, the collider will interact with all groups:
+
+```tsx
+<CapsuleCollider collisionGroups={interactionGroups(12)} />
+```
+
+> **Note** Please remember that in Rapier, for a collision (or solving) event to occur, both colliders involved in the event must match the related interaction groups -- a one-way match will be ignored.
+
+> **Note** By default, colliders are members of all groups, and will interact with all other groups.
+
 ## Joints
 
 WIP
@@ -255,7 +309,7 @@ In order, but also not necessarily:
 - [x] Colliders outside RigidBodies
 - [x] InstancedMesh support
 - [x] Timestep improvements for determinism
-- [ ] Normalize and improve collision events (add events to single Colliders, InstancedRigidBodies, etc)
+- [x] Normalize and improve collision events (add events to single Colliders)
+- [ ] Add collision events to InstancedRigidBodies
 - [ ] Docs
 - [ ] CodeSandbox examples
-- [ ] Helpers, for things like Vehicle, Rope, Player, etc