@threlte/rapier 3.0.0-next.3 → 3.0.0-next.5

package/dist/components/Colliders/AutoColliders.svelte

@@ -10,7 +10,7 @@ import { useParentRigidbodyObject } from '../../lib/rigidBodyObjectContext';
 import { applyColliderActiveEvents } from '../../lib/applyColliderActiveEvents';
 import { createCollidersFromChildren } from '../../lib/createCollidersFromChildren';
 import { eulerToQuaternion } from '../../lib/eulerToQuaternion';
-let { shape = 'convexHull', restitution, restitutionCombineRule, friction, frictionCombineRule, sensor, contactForceEventThreshold, density, mass, centerOfMass, principalAngularInertia, angularInertiaLocalFrame, refresh = $bindable(() => create()), colliders = $bindable(), oncreate, oncollisionenter, oncollisionexit, oncontact, onsensorenter, onsensorexit, children, } = $props();
+let { shape = 'convexHull', restitution, restitutionCombineRule, friction, frictionCombineRule, sensor, contactForceEventThreshold, density, mass, centerOfMass, principalAngularInertia, angularInertiaLocalFrame, refresh = $bindable(() => create()), colliders = $bindable(), oncreate, oncollisionenter, oncollisionexit, oncontact, onsensorenter, onsensorexit, children } = $props();
 const group = new Group();
 const { updateRef } = useCreateEvent(oncreate);
 const rigidBody = useRigidBody();

package/dist/components/Colliders/Collider.svelte

@@ -16,7 +16,7 @@ let { shape, args, type, restitution, restitutionCombineRule, friction, friction
         return;
     collider.setTranslation(getWorldPosition(object));
     collider.setRotation(getWorldQuaternion(object));
-}), oncreate, oncollisionenter, oncollisionexit, oncontact, onsensorenter, onsensorexit, children, } = $props();
+}), oncreate, oncollisionenter, oncollisionexit, oncontact, onsensorenter, onsensorexit, children } = $props();
 const object = new Object3D();
 const { updateRef } = useCreateEvent(oncreate);
 const rigidBody = useRigidBody();

package/dist/components/Colliders/Collider.svelte.d.ts

@@ -1,4 +1,3 @@
-import type { ColliderEvents } from '../../types/types'
 import type {
   CoefficientCombineRule,
   Collider as RapierCollider,
@@ -6,6 +5,7 @@ import type {
 } from '@dimforge/rapier3d-compat'
 import { SvelteComponent, type Snippet } from 'svelte'
 import type { Euler, Vector3 } from 'three'
+import type { ColliderEvents } from '../../types/types'
 
 // ------------------ BASE ------------------
 

package/dist/components/RigidBody/RigidBody.svelte

@@ -1,20 +1,23 @@
 <script lang="ts">import { SceneGraphObject } from '@threlte/core';
 import { onDestroy, setContext, tick } from 'svelte';
 import { Object3D, Vector3 } from 'three';
+import { initializeRigidBodyUserData, setInitialRigidBodyState } from '../../lib/createPhysicsTasks';
 import { useRapier } from '../../hooks/useRapier';
 import { getWorldPosition, getWorldQuaternion, getWorldScale } from '../../lib/getWorldTransforms';
 import { parseRigidBodyType } from '../../lib/parseRigidBodyType';
 import { setParentRigidbodyObject } from '../../lib/rigidBodyObjectContext';
 import { useCreateEvent } from '../../lib/useCreateEvent';
+import { overrideTeleportMethods } from './overrideTeleportMethods';
 const { world, rapier, addRigidBodyToContext, removeRigidBodyFromContext } = useRapier();
-let { linearVelocity, angularVelocity, type = 'dynamic', canSleep = true, gravityScale = 1, ccd = false, angularDamping = 0, linearDamping = 0, lockRotations = false, lockTranslations = false, enabledRotations = [true, true, true], enabledTranslations = [true, true, true], dominance = 0, enabled = true, userData = {}, rigidBody = $bindable(), oncreate, oncollisionenter, oncollisionexit, oncontact, onsensorenter, onsensorexit, onsleep, onwake } = $props();
+let { linearVelocity, angularVelocity, type = 'dynamic', canSleep = true, gravityScale = 1, ccd = false, angularDamping = 0, linearDamping = 0, lockRotations = false, lockTranslations = false, enabledRotations = [true, true, true], enabledTranslations = [true, true, true], dominance = 0, enabled = true, userData = {}, rigidBody = $bindable(), oncreate, oncollisionenter, oncollisionexit, oncontact, onsensorenter, onsensorexit, onsleep, onwake, children } = $props();
 /**
  * Every RigidBody receives and forwards collision-related events
  */
 const { updateRef } = useCreateEvent(oncreate);
 const object = new Object3D();
+initializeRigidBodyUserData(object);
 /**
- * isSleeping used for events "sleep" and "wake" in `useFrameHandler`
+ * isSleeping used for events "sleep" and "wake" in `createPhysicsTasks`
  */
 object.userData.isSleeping = false;
 /**
@@ -25,6 +28,7 @@ const desc = new rapier.RigidBodyDesc(parseRigidBodyType(type)).setCanSleep(canS
  * Temporary RigidBody init
  */
 let rigidBodyInternal = world.createRigidBody(desc);
+overrideTeleportMethods(rigidBodyInternal, object);
 rigidBody = rigidBodyInternal;
 /**
  * Apply transforms after the parent component added "object" to itself
@@ -36,6 +40,7 @@ const initPosition = async () => {
     const parentWorldScale = object.parent ? getWorldScale(object.parent) : new Vector3(1, 1, 1);
     const worldPosition = getWorldPosition(object).multiply(parentWorldScale);
     const worldQuaternion = getWorldQuaternion(object);
+    setInitialRigidBodyState(object, worldPosition, worldQuaternion);
     rigidBodyInternal.setTranslation(worldPosition, true);
     rigidBodyInternal.setRotation(worldQuaternion, true);
     updateRef(rigidBodyInternal);
@@ -114,5 +119,5 @@ onDestroy(() => {
 </script>
 
 <SceneGraphObject {object}>
-  <slot rigidBody={rigidBodyInternal} />
+  {@render children?.({ rigidBody: rigidBodyInternal })}
 </SceneGraphObject>

package/dist/components/RigidBody/RigidBody.svelte.d.ts

@@ -7,7 +7,7 @@ import type { RigidBodyEvents } from '../../types/types'
 export type Boolean3Array = [x: boolean, y: boolean, z: boolean]
 
 export type RigidBodyProps = {
-  rigidBody?: RapierRigidBody
+  rigidBody?: RapierRigidBody | undefined
 
   /**
    * Specify the type of this rigid body

package/dist/components/RigidBody/overrideTeleportMethods.d.ts

@@ -0,0 +1,14 @@
+import type { RigidBody } from '@dimforge/rapier3d-compat';
+import type { Object3D } from 'three';
+export type ExtractMethods<ObjectType> = Pick<ObjectType, {
+    [Method in keyof ObjectType]: ObjectType[Method] extends (...args: any[]) => any ? Method : never;
+}[keyof ObjectType]>;
+/**
+ * When using a fixed framerate, Threlte is interpolating the position and
+ * rotation of RigidBody objects. Sometimes, this is not desirable, especially
+ * when using methods on the rigidbody that teleport the object, e.g. should
+ * lead to a sudden change in translation/rotation such as `rb.setTranslation`.
+ * These methods are overridden to reset the physics simulation position and
+ * rotation to the current object position and rotation.
+ */
+export declare const overrideTeleportMethods: (rb: RigidBody, object: Object3D) => void;

package/dist/components/RigidBody/overrideTeleportMethods.js

@@ -0,0 +1,31 @@
+const overrideMethods = {
+    position: ['setTranslation', 'setNextKinematicTranslation'],
+    rotation: ['setRotation', 'setNextKinematicRotation']
+};
+/**
+ * When using a fixed framerate, Threlte is interpolating the position and
+ * rotation of RigidBody objects. Sometimes, this is not desirable, especially
+ * when using methods on the rigidbody that teleport the object, e.g. should
+ * lead to a sudden change in translation/rotation such as `rb.setTranslation`.
+ * These methods are overridden to reset the physics simulation position and
+ * rotation to the current object position and rotation.
+ */
+export const overrideTeleportMethods = (rb, object) => {
+    const originalMethods = {};
+    overrideMethods.position.forEach((method) => {
+        originalMethods[method] = rb[method].bind(rb);
+        const proxy = (...args) => {
+            object.userData.physics.resetPosition = true;
+            return originalMethods[method](...args);
+        };
+        rb[method] = proxy;
+    });
+    overrideMethods.rotation.forEach((method) => {
+        originalMethods[method] = rb[method].bind(rb);
+        const proxy = (...args) => {
+            object.userData.physics.resetRotation = true;
+            return originalMethods[method](...args);
+        };
+        rb[method] = proxy;
+    });
+};

package/dist/components/World/InnerWorld.svelte

@@ -1,19 +1,41 @@
 <script lang="ts">import { onDestroy, setContext, tick } from 'svelte';
-import { useFrameHandler } from '../../hooks/useFrameHandler';
 import { createRapierContext } from '../../lib/createRapierContext';
-let { gravity = [0, -9.81, 0], rawIntegrationParameters, rawIslands, rawBroadPhase, rawNarrowPhase, rawBodies, rawColliders, rawImpulseJoints, rawMultibodyJoints, rawCCDSolver, rawQueryPipeline, rawPhysicsPipeline, rawSerializationPipeline, rawDebugRenderPipeline, stage } = $props();
-const rapierContext = createRapierContext({ x: gravity[0], y: gravity[1], z: gravity[2] }, rawIntegrationParameters, rawIslands, rawBroadPhase, rawNarrowPhase, rawBodies, rawColliders, rawImpulseJoints, rawMultibodyJoints, rawCCDSolver, rawQueryPipeline, rawPhysicsPipeline, rawSerializationPipeline, rawDebugRenderPipeline);
+let { gravity = [0, -9.81, 0], rawIntegrationParameters, rawIslands, rawBroadPhase, rawNarrowPhase, rawBodies, rawColliders, rawImpulseJoints, rawMultibodyJoints, rawCCDSolver, rawQueryPipeline, rawPhysicsPipeline, rawSerializationPipeline, rawDebugRenderPipeline, framerate, autoStart = true, simulationStageOptions, synchronizationStageOptions, children } = $props();
+const rapierContext = createRapierContext([
+    { x: gravity[0], y: gravity[1], z: gravity[2] },
+    rawIntegrationParameters,
+    rawIslands,
+    rawBroadPhase,
+    rawNarrowPhase,
+    rawBodies,
+    rawColliders,
+    rawImpulseJoints,
+    rawMultibodyJoints,
+    rawCCDSolver,
+    rawQueryPipeline,
+    rawPhysicsPipeline,
+    rawSerializationPipeline,
+    rawDebugRenderPipeline
+], {
+    framerate,
+    autoStart,
+    simulationStageOptions,
+    synchronizationStageOptions
+});
 setContext('threlte-rapier-context', rapierContext);
 $effect.pre(() => {
     if (gravity !== undefined) {
         rapierContext.world.gravity = { x: gravity[0], y: gravity[1], z: gravity[2] };
     }
 });
-useFrameHandler(rapierContext, stage);
+$effect.pre(() => {
+    if (framerate !== undefined)
+        rapierContext.framerate.set(framerate);
+});
 onDestroy(async () => {
     await tick();
     rapierContext.world.free();
 });
 </script>
 
-<slot />
+{@render children?.()}

package/dist/components/World/InnerWorld.svelte.d.ts

@@ -1,17 +1,11 @@
 import { SvelteComponent } from "svelte";
 import type { WorldProps } from './World.svelte';
 declare const __propDef: {
-    props: WorldProps & {
-        children?: ((this: void) => typeof import("svelte").SnippetReturn & {
-            _: "functions passed to {@render ...} tags must use the `Snippet` type imported from \"svelte\"";
-        }) | undefined;
-    };
+    props: WorldProps;
     events: {
         [evt: string]: CustomEvent<any>;
     };
-    slots: {
-        default: {};
-    };
+    slots: {};
 };
 export type InnerWorldProps = typeof __propDef.props;
 export type InnerWorldEvents = typeof __propDef.events;

package/dist/components/World/World.svelte

@@ -1,60 +1,12 @@
-<script
-  context="module"
-  lang="ts"
->import RAPIER from '@dimforge/rapier3d-compat';
-import { onMount } from 'svelte';
-import { writable } from 'svelte/store';
-/**
- * RAPIER.init() should only be called once
- */
-const initialized = writable(false);
+<script lang="ts">import { initRapier } from '../../lib/initRapier.svelte';
+import InnerWorld from './InnerWorld.svelte';
+let { fallback, children, ...rest } = $props();
 </script>
 
-<script lang="ts">import InnerWorld from './InnerWorld.svelte';
-let { gravity, rawIntegrationParameters, rawIslands, rawBroadPhase, rawNarrowPhase, rawBodies, rawColliders, rawImpulseJoints, rawMultibodyJoints, rawCCDSolver, rawQueryPipeline, rawPhysicsPipeline, rawSerializationPipeline, rawDebugRenderPipeline, 
-/**
- * This is passed to the useTask handler.
- * Use this to control when the rapier physics engine is updating the scene.
- * @default undefined
- */
-stage, fallback, children } = $props();
-let error = $state(false);
-const init = async () => {
-    if ($initialized)
-        return;
-    try {
-        await RAPIER.init();
-        $initialized = true;
-    }
-    catch (e) {
-        error = true;
-    }
-};
-onMount(init);
-</script>
-
-{#if $initialized}
-  <InnerWorld
-    {gravity}
-    {rawIntegrationParameters}
-    {rawIslands}
-    {rawBroadPhase}
-    {rawNarrowPhase}
-    {rawBodies}
-    {rawColliders}
-    {rawImpulseJoints}
-    {rawMultibodyJoints}
-    {rawCCDSolver}
-    {rawQueryPipeline}
-    {rawPhysicsPipeline}
-    {rawSerializationPipeline}
-    {rawDebugRenderPipeline}
-    {stage}
-  >
+{#await initRapier() then _}
+  <InnerWorld {...rest}>
     {@render children?.()}
   </InnerWorld>
-{/if}
-
-{#if error}
-  {@render fallback?.()}
-{/if}
+{:catch error}
+  {@render fallback?.(error)}
+{/await}

package/dist/components/World/World.svelte.d.ts

@@ -18,6 +18,8 @@ import type { Vector3 } from 'three'
 import type { Key, Stage } from '@threlte/core'
 
 export type WorldProps = {
+  framerate?: number | 'varying'
+  autoStart?: boolean
   gravity?: Parameters<Vector3['set']>
   rawIntegrationParameters?: RawIntegrationParameters
   rawIslands?: RawIslandManager
@@ -32,10 +34,16 @@ export type WorldProps = {
   rawPhysicsPipeline?: RawPhysicsPipeline
   rawSerializationPipeline?: RawSerializationPipeline
   rawDebugRenderPipeline?: RawDebugRenderPipeline
-  stage?: Key | Stage
-
+  simulationStageOptions?: {
+    before?: (Key | Stage) | (Key | Stage)[]
+    after?: (Key | Stage) | (Key | Stage)[]
+  }
+  synchronizationStageOptions?: {
+    before?: (Key | Stage) | (Key | Stage)[]
+    after?: (Key | Stage) | (Key | Stage)[]
+  }
   children?: Snippet
-  fallback?: Snippet
+  fallback?: Snippet<[error: any]>
 }
 
 export default class World extends SvelteComponent<WorldProps> {}

package/dist/lib/applyColliderActiveEvents.d.ts

@@ -1,3 +1,3 @@
-import type { ColliderEvents, RigidBodyEvents } from '../types/types';
 import { type Collider } from '@dimforge/rapier3d-compat';
+import type { ColliderEvents, RigidBodyEvents } from '../types/types';
 export declare const applyColliderActiveEvents: (collider: Collider, colliderEvents?: ColliderEvents, rigidBodyEvents?: RigidBodyEvents) => void;

package/dist/lib/createPhysicsStages.d.ts

@@ -0,0 +1,15 @@
+import { type CurrentWritable, type Key, type Stage } from '@threlte/core';
+import type { Framerate } from '../types/types';
+export declare const createPhysicsStages: (framerate: CurrentWritable<Framerate>, simulationOffset: CurrentWritable<number>, updateRigidBodySimulationData: CurrentWritable<boolean>, options?: {
+    simulationStageOptions?: {
+        before?: (Key | Stage) | (Key | Stage)[];
+        after?: (Key | Stage) | (Key | Stage)[];
+    };
+    synchronizationStageOptions?: {
+        before?: (Key | Stage) | (Key | Stage)[];
+        after?: (Key | Stage) | (Key | Stage)[];
+    };
+}) => {
+    simulationStage: Stage;
+    synchronizationStage: Stage;
+};

package/dist/lib/createPhysicsStages.js

@@ -0,0 +1,43 @@
+import { useStage, useThrelte } from '@threlte/core';
+import { simulationKey, synchronizationKey } from './keys';
+export const createPhysicsStages = (framerate, simulationOffset, updateRigidBodySimulationData, options) => {
+    let fixedStepTimeAccumulator = 0;
+    let simulationTime = 0;
+    let lastSimulationTime = 0;
+    const { renderStage } = useThrelte();
+    const simulationStage = useStage(simulationKey, {
+        after: options?.simulationStageOptions?.after,
+        before: options?.simulationStageOptions?.before,
+        callback(delta, runTasks) {
+            if (framerate.current === 'varying') {
+                runTasks();
+            }
+            else {
+                const rate = 1 / framerate.current;
+                simulationTime += delta;
+                fixedStepTimeAccumulator += delta;
+                const iterations = Math.ceil(fixedStepTimeAccumulator / rate);
+                for (let iteration = 0; iteration < iterations; iteration++) {
+                    updateRigidBodySimulationData.set(iteration >= iterations - 2);
+                    runTasks(rate);
+                    fixedStepTimeAccumulator -= rate;
+                    lastSimulationTime += rate;
+                }
+                simulationOffset.set((simulationTime - lastSimulationTime) / rate + 1);
+            }
+        }
+    });
+    const synchronizationStage = useStage(synchronizationKey, {
+        after: options?.synchronizationStageOptions?.after
+            ? Array.isArray(options.synchronizationStageOptions.after)
+                ? [...options.synchronizationStageOptions.after, simulationKey]
+                : [options.synchronizationStageOptions.after, simulationKey]
+            : simulationKey,
+        before: options?.synchronizationStageOptions?.before
+            ? Array.isArray(options.synchronizationStageOptions.before)
+                ? [...options.synchronizationStageOptions.before, renderStage]
+                : [options.synchronizationStageOptions.before, renderStage]
+            : renderStage
+    });
+    return { simulationStage, synchronizationStage };
+};

package/dist/lib/createPhysicsTasks.d.ts

@@ -0,0 +1,19 @@
+import { type World } from '@dimforge/rapier3d-compat';
+import { type CurrentWritable, type Stage } from '@threlte/core';
+import { Object3D, Quaternion, Vector3 } from 'three';
+import type { ColliderEvents, Framerate, RigidBodyEvents } from '../types/types';
+type PhysicsUserData = {
+    currentPosition: Vector3;
+    currentQuaternion: Quaternion;
+    lastPosition: Vector3;
+    lastQuaternion: Quaternion;
+    resetPosition: boolean;
+    resetRotation: boolean;
+};
+export declare const initializeRigidBodyUserData: (obj: Object3D) => PhysicsUserData;
+export declare const setInitialRigidBodyState: (obj: Object3D, initialPosition: Vector3, initialQuaternion: Quaternion) => void;
+export declare const createPhysicsTasks: (world: World, framerate: CurrentWritable<Framerate>, simulationOffset: CurrentWritable<number>, rigidBodyObjects: Map<number, Object3D>, updateRigidBodySimulationData: CurrentWritable<boolean>, colliderEventDispatchers: Map<number, ColliderEvents>, rigidBodyEventDispatchers: Map<number, RigidBodyEvents>, simulationStage: Stage, synchronizationStage: Stage) => {
+    simulationTask: import("@threlte/core").Task;
+    synchronizationTask: import("@threlte/core").Task;
+};
+export {};

package/dist/{hooks/useFrameHandler.js → lib/createPhysicsTasks.js}

@@ -1,21 +1,17 @@
 import { EventQueue } from '@dimforge/rapier3d-compat';
 import { useTask } from '@threlte/core';
-import { derived } from 'svelte/store';
 import { Object3D, Quaternion, Vector3 } from 'three';
+import { simulationKey, synchronizationKey } from './keys';
 const tempObject = new Object3D();
 const tempVector3 = new Vector3();
 const tempQuaternion = new Quaternion();
-const getEventDispatchers = (ctx, collider1, collider2) => {
-    const collider1Events = ctx.colliderEventDispatchers.get(collider1.handle);
-    const collider2Events = ctx.colliderEventDispatchers.get(collider2.handle);
+const getEventDispatchers = (collider1, collider2, colliderEventDispatchers, rigidBodyEventDispatchers) => {
+    const collider1Events = colliderEventDispatchers.get(collider1.handle);
+    const collider2Events = colliderEventDispatchers.get(collider2.handle);
     const rigidBody1 = collider1.parent();
     const rigidBody2 = collider2.parent();
-    const rigidBody1Events = rigidBody1
-        ? ctx.rigidBodyEventDispatchers.get(rigidBody1.handle)
-        : undefined;
-    const rigidBody2Events = rigidBody2
-        ? ctx.rigidBodyEventDispatchers.get(rigidBody2.handle)
-        : undefined;
+    const rigidBody1Events = rigidBody1 ? rigidBodyEventDispatchers.get(rigidBody1.handle) : undefined;
+    const rigidBody2Events = rigidBody2 ? rigidBodyEventDispatchers.get(rigidBody2.handle) : undefined;
     return {
         collider1Events,
         collider2Events,
@@ -23,21 +19,48 @@ const getEventDispatchers = (ctx, collider1, collider2) => {
         rigidBody2Events
     };
 };
-export const useFrameHandler = (ctx, stage) => {
+const objectHasPhysicsUserData = (obj) => {
+    return obj.userData.physics !== undefined;
+};
+export const initializeRigidBodyUserData = (obj) => {
+    const userData = {
+        currentPosition: new Vector3(),
+        currentQuaternion: new Quaternion(),
+        lastPosition: new Vector3(),
+        lastQuaternion: new Quaternion(),
+        resetPosition: false,
+        resetRotation: false
+    };
+    obj.userData.physics = userData;
+    return userData;
+};
+export const setInitialRigidBodyState = (obj, initialPosition, initialQuaternion) => {
+    if (!objectHasPhysicsUserData(obj)) {
+        initializeRigidBodyUserData(obj);
+    }
+    const userData = obj.userData.physics;
+    userData.currentPosition.copy(initialPosition);
+    userData.lastPosition.copy(initialPosition);
+    userData.currentQuaternion.copy(initialQuaternion);
+    userData.lastQuaternion.copy(initialQuaternion);
+};
+export const createPhysicsTasks = (world, framerate, simulationOffset, rigidBodyObjects, updateRigidBodySimulationData, colliderEventDispatchers, rigidBodyEventDispatchers, simulationStage, synchronizationStage) => {
     const eventQueue = new EventQueue(false);
-    const { start, started, stop } = useTask((delta) => {
-        // if (!eventQueue) return
-        const { world } = ctx;
+    const simulation = useTask(simulationKey, (delta) => {
         // 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
-        world.timestep = Math.min(0.1, delta);
+        if (framerate.current === 'varying') {
+            world.timestep = Math.min(delta, 0.1);
+        }
+        else {
+            world.timestep = delta;
+        }
         world.step(eventQueue);
-        // Update meshes
-        ctx.rigidBodyObjects.forEach((mesh, handle) => {
+        rigidBodyObjects.forEach((mesh, handle) => {
             const rigidBody = world.getRigidBody(handle);
             if (!rigidBody || !rigidBody.isValid())
                 return;
-            const events = ctx.rigidBodyEventDispatchers.get(handle);
+            const events = rigidBodyEventDispatchers.get(handle);
             if (events) {
                 if (rigidBody.isSleeping() && !mesh.userData.isSleeping) {
                     events.onsleep?.();
@@ -50,21 +73,35 @@ export const useFrameHandler = (ctx, stage) => {
             if (rigidBody.isSleeping() || rigidBody.isFixed() || !mesh.parent) {
                 return;
             }
-            // Position
-            const { x, y, z } = rigidBody.translation();
-            tempObject.position.set(x, y, z);
-            // Rotation
-            const rotation = rigidBody.rotation();
-            tempQuaternion.set(rotation.x, rotation.y, rotation.z, rotation.w);
-            tempObject.rotation.setFromQuaternion(tempQuaternion);
-            // Scale
-            mesh.getWorldScale(tempVector3);
-            tempObject.scale.copy(tempVector3);
-            tempObject.updateMatrix();
-            tempObject.applyMatrix4(mesh.parent.matrixWorld.clone().invert());
-            tempObject.updateMatrix();
-            mesh.position.setFromMatrixPosition(tempObject.matrix);
-            mesh.rotation.setFromRotationMatrix(tempObject.matrix);
+            if (updateRigidBodySimulationData.current) {
+                const translation = rigidBody.translation();
+                const rotation = rigidBody.rotation();
+                if (objectHasPhysicsUserData(mesh)) {
+                    const userData = mesh.userData.physics;
+                    if (userData.resetPosition) {
+                        userData.resetPosition = false;
+                        userData.lastPosition.set(translation.x, translation.y, translation.z);
+                        userData.currentPosition.set(translation.x, translation.y, translation.z);
+                    }
+                    else {
+                        userData.lastPosition.copy(userData.currentPosition);
+                        userData.currentPosition.set(translation.x, translation.y, translation.z);
+                    }
+                    if (userData.resetRotation) {
+                        userData.resetRotation = false;
+                        userData.lastQuaternion.set(rotation.x, rotation.y, rotation.z, rotation.w);
+                        userData.currentQuaternion.set(rotation.x, rotation.y, rotation.z, rotation.w);
+                    }
+                    else {
+                        userData.lastQuaternion.copy(userData.currentQuaternion);
+                        userData.currentQuaternion.set(rotation.x, rotation.y, rotation.z, rotation.w);
+                    }
+                }
+                else {
+                    initializeRigidBodyUserData(mesh);
+                    setInitialRigidBodyState(mesh, tempVector3.set(translation.x, translation.y, translation.z), tempQuaternion.set(rotation.x, rotation.y, rotation.z, rotation.w));
+                }
+            }
         });
         eventQueue.drainContactForceEvents((e) => {
             const collider1 = world.getCollider(e.collider1());
@@ -73,7 +110,7 @@ export const useFrameHandler = (ctx, stage) => {
             if (!collider1 || !collider2) {
                 return;
             }
-            const { collider1Events, collider2Events, rigidBody1Events, rigidBody2Events } = getEventDispatchers(ctx, collider1, collider2);
+            const { collider1Events, collider2Events, rigidBody1Events, rigidBody2Events } = getEventDispatchers(collider1, collider2, colliderEventDispatchers, rigidBodyEventDispatchers);
             const rigidBody1 = collider1.parent();
             const rigidBody2 = collider2.parent();
             // Collider events
@@ -119,7 +156,7 @@ export const useFrameHandler = (ctx, stage) => {
             if (!collider1 || !collider2) {
                 return;
             }
-            const { collider1Events, collider2Events, rigidBody1Events, rigidBody2Events } = getEventDispatchers(ctx, collider1, collider2);
+            const { collider1Events, collider2Events, rigidBody1Events, rigidBody2Events } = getEventDispatchers(collider1, collider2, colliderEventDispatchers, rigidBodyEventDispatchers);
             if (!collider1Events && !collider2Events && !rigidBody1Events && !rigidBody2Events) {
                 return;
             }
@@ -226,9 +263,41 @@ export const useFrameHandler = (ctx, stage) => {
                 });
             }
         });
-    }, { stage });
-    // replacing the original pause and resume functions as well as the paused property
-    ctx.pause = () => stop();
-    ctx.resume = () => start();
-    ctx.paused = derived(started, (started) => !started);
+    }, {
+        stage: simulationStage
+    });
+    const synchronization = useTask(synchronizationKey, () => {
+        rigidBodyObjects.forEach((mesh) => {
+            if (!objectHasPhysicsUserData(mesh))
+                return;
+            const userData = mesh.userData.physics;
+            if (framerate.current === 'varying') {
+                tempObject.position.copy(userData.currentPosition);
+                tempObject.quaternion.copy(userData.currentQuaternion);
+            }
+            else {
+                tempObject.position
+                    .copy(userData.lastPosition)
+                    .lerp(userData.currentPosition, simulationOffset.current);
+                tempObject.quaternion
+                    .copy(userData.lastQuaternion)
+                    .slerp(userData.currentQuaternion, simulationOffset.current);
+            }
+            // Rapier has no concept of scale, so we use the mesh's scale
+            mesh.getWorldScale(tempVector3);
+            tempObject.scale.copy(tempVector3);
+            tempObject.updateMatrix();
+            if (mesh.parent)
+                tempObject.applyMatrix4(mesh.parent.matrixWorld.clone().invert());
+            tempObject.updateMatrix();
+            mesh.position.setFromMatrixPosition(tempObject.matrix);
+            mesh.rotation.setFromRotationMatrix(tempObject.matrix);
+        });
+    }, {
+        stage: synchronizationStage
+    });
+    return {
+        simulationTask: simulation.task,
+        synchronizationTask: synchronization.task
+    };
 };

package/dist/lib/createRapierContext.d.ts

@@ -1,21 +1,15 @@
-/// <reference types="svelte" />
-import type { Collider, RigidBody } from '@dimforge/rapier3d-compat';
 import RAPIER from '@dimforge/rapier3d-compat';
-import type { Object3D } from 'three';
-import type { ColliderEvents, RigidBodyEvents } from '../types/types';
-export declare const createRapierContext: (gravity: RAPIER.Vector, rawIntegrationParameters?: import("@dimforge/rapier3d-compat/rapier_wasm3d").RawIntegrationParameters | undefined, rawIslands?: import("@dimforge/rapier3d-compat/rapier_wasm3d").RawIslandManager | undefined, rawBroadPhase?: import("@dimforge/rapier3d-compat/rapier_wasm3d").RawBroadPhase | undefined, rawNarrowPhase?: import("@dimforge/rapier3d-compat/rapier_wasm3d").RawNarrowPhase | undefined, rawBodies?: import("@dimforge/rapier3d-compat/rapier_wasm3d").RawRigidBodySet | undefined, rawColliders?: import("@dimforge/rapier3d-compat/rapier_wasm3d").RawColliderSet | undefined, rawImpulseJoints?: import("@dimforge/rapier3d-compat/rapier_wasm3d").RawImpulseJointSet | undefined, rawMultibodyJoints?: import("@dimforge/rapier3d-compat/rapier_wasm3d").RawMultibodyJointSet | undefined, rawCCDSolver?: import("@dimforge/rapier3d-compat/rapier_wasm3d").RawCCDSolver | undefined, rawQueryPipeline?: import("@dimforge/rapier3d-compat/rapier_wasm3d").RawQueryPipeline | undefined, rawPhysicsPipeline?: import("@dimforge/rapier3d-compat/rapier_wasm3d").RawPhysicsPipeline | undefined, rawSerializationPipeline?: import("@dimforge/rapier3d-compat/rapier_wasm3d").RawSerializationPipeline | undefined, rawDebugRenderPipeline?: import("@dimforge/rapier3d-compat/rapier_wasm3d").RawDebugRenderPipeline | undefined) => {
-    rapier: typeof RAPIER;
-    world: RAPIER.World;
-    colliderObjects: Map<number, Object3D<import("three").Object3DEventMap>>;
-    rigidBodyObjects: Map<number, Object3D<import("three").Object3DEventMap>>;
-    rigidBodyEventDispatchers: Map<number, RigidBodyEvents>;
-    colliderEventDispatchers: Map<number, ColliderEvents>;
-    addColliderToContext: (collider: Collider, object: Object3D, props: ColliderEvents) => void;
-    removeColliderFromContext: (collider: Collider) => void;
-    addRigidBodyToContext: (rigidBody: RigidBody, object: Object3D, events: RigidBodyEvents) => void;
-    removeRigidBodyFromContext: (rigidBody: RigidBody) => void;
-    debug: import("svelte/store").Writable<boolean>;
-    pause: () => void;
-    resume: () => void;
-    paused: import("svelte/store").Readable<boolean>;
-};
+import { type Key, type Stage } from '@threlte/core';
+import type { Framerate, RapierContext } from '../types/types';
+export declare const createRapierContext: (worldArgs: [gravity: RAPIER.Vector, rawIntegrationParameters?: import("@dimforge/rapier3d-compat/rapier_wasm3d").RawIntegrationParameters | undefined, rawIslands?: import("@dimforge/rapier3d-compat/rapier_wasm3d").RawIslandManager | undefined, rawBroadPhase?: import("@dimforge/rapier3d-compat/rapier_wasm3d").RawBroadPhase | undefined, rawNarrowPhase?: import("@dimforge/rapier3d-compat/rapier_wasm3d").RawNarrowPhase | undefined, rawBodies?: import("@dimforge/rapier3d-compat/rapier_wasm3d").RawRigidBodySet | undefined, rawColliders?: import("@dimforge/rapier3d-compat/rapier_wasm3d").RawColliderSet | undefined, rawImpulseJoints?: import("@dimforge/rapier3d-compat/rapier_wasm3d").RawImpulseJointSet | undefined, rawMultibodyJoints?: import("@dimforge/rapier3d-compat/rapier_wasm3d").RawMultibodyJointSet | undefined, rawCCDSolver?: import("@dimforge/rapier3d-compat/rapier_wasm3d").RawCCDSolver | undefined, rawQueryPipeline?: import("@dimforge/rapier3d-compat/rapier_wasm3d").RawQueryPipeline | undefined, rawPhysicsPipeline?: import("@dimforge/rapier3d-compat/rapier_wasm3d").RawPhysicsPipeline | undefined, rawSerializationPipeline?: import("@dimforge/rapier3d-compat/rapier_wasm3d").RawSerializationPipeline | undefined, rawDebugRenderPipeline?: import("@dimforge/rapier3d-compat/rapier_wasm3d").RawDebugRenderPipeline | undefined], options: {
+    framerate?: Framerate;
+    autoStart?: boolean;
+    simulationStageOptions?: {
+        before?: (Key | Stage) | (Key | Stage)[];
+        after?: (Key | Stage) | (Key | Stage)[];
+    };
+    synchronizationStageOptions?: {
+        before?: (Key | Stage) | (Key | Stage)[];
+        after?: (Key | Stage) | (Key | Stage)[];
+    };
+}) => RapierContext;

package/dist/lib/createRapierContext.js

@@ -1,7 +1,10 @@
 import RAPIER from '@dimforge/rapier3d-compat';
-import { readable, writable } from 'svelte/store';
-export const createRapierContext = (...args) => {
-    const world = new RAPIER.World(...args);
+import { currentWritable } from '@threlte/core';
+import { derived, writable } from 'svelte/store';
+import { createPhysicsStages } from './createPhysicsStages';
+import { createPhysicsTasks } from './createPhysicsTasks';
+export const createRapierContext = (worldArgs, options) => {
+    const world = new RAPIER.World(...worldArgs);
     const colliderObjects = new Map();
     const rigidBodyObjects = new Map();
     const rigidBodyEventDispatchers = new Map();
@@ -42,11 +45,17 @@ export const createRapierContext = (...args) => {
         rigidBodyObjects.delete(rigidBody.handle);
         rigidBodyEventDispatchers.delete(rigidBody.handle);
     };
-    // Dummy functions, will be replaced by useFrameHandler fn
-    // eslint-disable-next-line @typescript-eslint/no-empty-function
-    const pause = () => { };
-    // eslint-disable-next-line @typescript-eslint/no-empty-function
-    const resume = () => { };
+    const framerate = currentWritable(options.framerate ?? 'varying');
+    const simulationOffset = currentWritable(1);
+    const updateRigidBodySimulationData = currentWritable(false);
+    const { simulationStage, synchronizationStage } = createPhysicsStages(framerate, simulationOffset, updateRigidBodySimulationData, options);
+    const autostart = options.autoStart ?? true;
+    const paused = writable(!autostart);
+    if (!autostart) {
+        simulationStage.stop();
+        synchronizationStage.stop();
+    }
+    const { simulationTask, synchronizationTask } = createPhysicsTasks(world, framerate, simulationOffset, rigidBodyObjects, updateRigidBodySimulationData, colliderEventDispatchers, rigidBodyEventDispatchers, simulationStage, synchronizationStage);
     return {
         rapier: RAPIER,
         world,
@@ -59,8 +68,23 @@ export const createRapierContext = (...args) => {
         addRigidBodyToContext,
         removeRigidBodyFromContext,
         debug: writable(false),
-        pause,
-        resume,
-        paused: readable(false)
+        pause: () => {
+            paused.set(true);
+            simulationStage.stop();
+            synchronizationStage.stop();
+        },
+        resume: () => {
+            paused.set(false);
+            simulationStage.start();
+            synchronizationStage.start();
+        },
+        paused: derived(paused, (a) => a),
+        framerate,
+        simulationOffset,
+        simulationStage,
+        synchronizationStage,
+        updateRigidBodySimulationData,
+        simulationTask,
+        synchronizationTask
     };
 };

package/dist/lib/initRapier.svelte.d.ts

@@ -0,0 +1 @@
+export declare const initRapier: () => true | Promise<void>;

package/dist/lib/initRapier.svelte.js

@@ -0,0 +1,16 @@
+import RAPIER from '@dimforge/rapier3d-compat';
+let initialized = false;
+let promise;
+export const initRapier = () => {
+    if (initialized)
+        return true;
+    if (!promise) {
+        promise = new Promise((resolve) => {
+            RAPIER.init().then(() => {
+                initialized = true;
+                resolve();
+            });
+        });
+    }
+    return promise;
+};

package/dist/lib/keys.d.ts

@@ -0,0 +1,2 @@
+export declare const simulationKey: unique symbol;
+export declare const synchronizationKey: unique symbol;

package/dist/lib/keys.js

@@ -0,0 +1,2 @@
+export const simulationKey = Symbol('simulation');
+export const synchronizationKey = Symbol('synchronization');

package/dist/types/types.d.ts

@@ -1,7 +1,9 @@
 /// <reference types="svelte" />
-import type { Collider, RigidBody, TempContactManifold, Vector } from '@dimforge/rapier3d-compat';
-import type { Writable } from 'svelte/store';
-import type { createRapierContext } from '../lib/createRapierContext';
+import { World, type Collider, type RigidBody, type TempContactManifold, type Vector } from '@dimforge/rapier3d-compat';
+import RAPIER from '@dimforge/rapier3d-compat';
+import type { CurrentWritable, Stage, Task } from '@threlte/core';
+import type { Readable, Writable } from 'svelte/store';
+import type { Object3D } from 'three';
 export type ColliderShapes = 'ball' | 'capsule' | 'segment' | 'triangle' | 'roundTriangle' | 'polyline' | 'trimesh' | 'cuboid' | 'roundCuboid' | 'heightfield' | 'cylinder' | 'roundCylinder' | 'cone' | 'roundCone' | 'convexHull' | 'convexMesh' | 'roundConvexHull' | 'roundConvexMesh';
 export type AutoCollidersShapes = 'cuboid' | 'ball' | 'trimesh' | 'convexHull' | 'capsule';
 export type ColliderEvents = {
@@ -45,7 +47,6 @@ export type RigidBodyEvents = ColliderEvents & {
     onsleep?: () => void;
     onwake?: () => void;
 };
-export type RapierContext = ReturnType<typeof createRapierContext>;
 export type CollisionGroupsContext = Writable<number> | undefined;
 export type RigidBodyUserData = {
     events?: RigidBodyEvents;
@@ -59,3 +60,31 @@ export type CollisionGroupsBitMask = (0 | 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10
  * Used in the <Attractor> component
  */
 export type GravityType = 'static' | 'linear' | 'newtonian';
+export type Framerate = number | 'varying';
+export type RapierContext = {
+    rapier: typeof RAPIER;
+    world: World;
+    colliderObjects: Map<number, Object3D>;
+    rigidBodyObjects: Map<number, Object3D>;
+    rigidBodyEventDispatchers: Map<number, RigidBodyEvents>;
+    colliderEventDispatchers: Map<number, ColliderEvents>;
+    addColliderToContext: (collider: Collider, object: Object3D, props: ColliderEvents) => void;
+    removeColliderFromContext: (collider: Collider) => void;
+    addRigidBodyToContext: (rigidBody: RigidBody, object: Object3D, events: RigidBodyEvents) => void;
+    removeRigidBodyFromContext: (rigidBody: RigidBody) => void;
+    debug: Writable<boolean>;
+    pause: () => void;
+    resume: () => void;
+    paused: Readable<boolean>;
+    framerate: CurrentWritable<Framerate>;
+    simulationStage: Stage;
+    simulationTask: Task;
+    synchronizationStage: Stage;
+    synchronizationTask: Task;
+    /**
+     * This number tells us how far we're off in the simulation stage as opposed
+     * to the render stage
+     */
+    simulationOffset: CurrentWritable<number>;
+    updateRigidBodySimulationData: CurrentWritable<boolean>;
+};

package/package.json

@@ -1,10 +1,11 @@
 {
   "name": "@threlte/rapier",
-  "version": "3.0.0-next.3",
+  "version": "3.0.0-next.5",
   "author": "Grischa Erbe <hello@legrisch.com> (https://legrisch.com)",
   "license": "MIT",
+  "description": "Components and hooks to use the Rapier physics engine in Threlte",
   "devDependencies": {
-    "@dimforge/rapier3d-compat": "^0.12.0",
+    "@dimforge/rapier3d-compat": "^0.13.1",
     "@sveltejs/adapter-auto": "^3.2.0",
     "@sveltejs/kit": "^2.5.5",
     "@sveltejs/package": "^2.3.1",
@@ -21,7 +22,7 @@
     "prettier-plugin-svelte": "^3.2.2",
     "publint": "^0.2.7",
     "rimraf": "^5.0.5",
-    "svelte": "5.0.0-next.107",
+    "svelte": "5.0.0-next.133",
     "svelte-check": "^3.6.9",
     "svelte-preprocess": "^5.1.3",
     "svelte2tsx": "^0.7.6",
@@ -30,7 +31,7 @@
     "type-fest": "^4.15.0",
     "typescript": "^5.4.5",
     "vite": "^5.2.8",
-    "@threlte/core": "8.0.0-next.7"
+    "@threlte/core": "8.0.0-next.9"
   },
   "peerDependencies": {
     "@dimforge/rapier3d-compat": ">=0.12",
@@ -38,6 +39,24 @@
     "three": ">=0.152"
   },
   "type": "module",
+  "keywords": [
+    "threlte",
+    "rapier",
+    "svelte",
+    "three",
+    "three.js",
+    "3d",
+    "physics"
+  ],
+  "homepage": "https://threlte.xyz",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/threlte/threlte.git",
+    "directory": "packages/rapier"
+  },
+  "bugs": {
+    "url": "https://github.com/threlte/threlte/issues"
+  },
   "exports": {
     ".": {
       "types": "./dist/index.d.ts",
@@ -54,8 +73,8 @@
     "package": "svelte-kit sync && svelte-package && node ./scripts/cleanupPackage.js && publint",
     "check": "svelte-check --tsconfig ./tsconfig.json",
     "check:watch": "svelte-check --tsconfig ./tsconfig.json --watch",
-    "lint": "prettier --check --plugin-search-dir=. . && eslint .",
-    "format": "prettier --write --plugin-search-dir=. .",
+    "lint": "prettier --check .",
+    "format": "prettier --write .",
     "cleanup": "rimraf node_modules .svelte-kit dist"
   }
 }

package/dist/hooks/useFrameHandler.d.ts

@@ -1,3 +0,0 @@
-import { type Stage, type Key } from '@threlte/core';
-import type { RapierContext } from '../types/types';
-export declare const useFrameHandler: (ctx: RapierContext, stage?: Stage | Key) => void;