angular-three-rapier 2.12.0 → 2.13.0

package/fesm2022/angular-three-rapier.mjs

@@ -1,7 +1,7 @@
 import * as i0 from '@angular/core';
-import { input, viewChild, Component, CUSTOM_ELEMENTS_SCHEMA, ChangeDetectionStrategy, effect, Directive, contentChild, TemplateRef, inject, DestroyRef, signal, computed, untracked, model, output, ElementRef, viewChildren } from '@angular/core';
+import { input, viewChild, Component, CUSTOM_ELEMENTS_SCHEMA, ChangeDetectionStrategy, effect, Directive, contentChild, TemplateRef, signal, computed, untracked, inject, DestroyRef, model, output, ElementRef, viewChildren } from '@angular/core';
 import { Vector3 as Vector3$1, Quaternion as Quaternion$1, EventQueue, ColliderDesc, ActiveEvents, RigidBodyDesc } from '@dimforge/rapier3d-compat';
-import { extend, injectBeforeRender, injectStore, pick, vector3, getLocalState, getEmitter, hasListener, resolveRef } from 'angular-three';
+import { extend, injectBeforeRender, injectStore, pick, vector3, applyProps, getLocalState, getEmitter, hasListener, resolveRef } from 'angular-three';
 import { mergeInputs } from 'ngxtension/inject-inputs';
 import { Group, LineSegments, LineBasicMaterial, BufferAttribute, Quaternion, Euler, Vector3, Object3D, Matrix4, MathUtils, DynamicDrawUsage } from 'three';
 import { NgTemplateOutlet } from '@angular/common';
@@ -61,8 +61,9 @@ class NgtrFrameStepper {
             const ready = this.ready();
             if (!ready)
                 return;
-            const [type, updatePriority, stepFn] = [this.type(), this.updatePriority(), this.stepFn()];
+            const [type, stepFn] = [this.type(), this.stepFn()];
             if (type === 'follow') {
+                const updatePriority = this.updatePriority();
                 const cleanup = store.snapshot.internal.subscribe(({ delta }) => {
                     stepFn(delta);
                 }, updatePriority, store);
@@ -279,7 +280,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.11", ngImpo
 class NgtrPhysics {
     options = input(defaultOptions$1, { transform: mergeInputs(defaultOptions$1) });
     content = contentChild.required(TemplateRef);
-    fallbackContent = contentChild(NgtrPhysicsFallback);
+    fallbackContent = contentChild(NgtrPhysicsFallback, { read: TemplateRef });
     updatePriority = pick(this.options, 'updatePriority');
     updateLoop = pick(this.options, 'updateLoop');
     numSolverIterations = pick(this.options, 'numSolverIterations');
@@ -296,9 +297,8 @@ class NgtrPhysics {
     paused = pick(this.options, 'paused');
     debug = pick(this.options, 'debug');
     colliders = pick(this.options, 'colliders');
-    gravity = vector3(this.options, 'gravity');
+    vGravity = vector3(this.options, 'gravity');
     store = injectStore();
-    destroyRef = inject(DestroyRef);
     rapierConstruct = signal(null);
     rapierError = signal(null);
     rapier = this.rapierConstruct.asReadonly();
@@ -307,7 +307,7 @@ class NgtrPhysics {
         const rapier = this.rapier();
         if (!rapier)
             return null;
-        return createSingletonProxy(() => new rapier.World(untracked(this.gravity)));
+        return createSingletonProxy(() => new rapier.World(untracked(this.vGravity)));
     });
     rigidBodyStates = new Map();
     colliderStates = new Map();
@@ -333,7 +333,7 @@ class NgtrPhysics {
         effect(() => {
             this.updateWorldEffect();
         });
-        this.destroyRef.onDestroy(() => {
+        inject(DestroyRef).onDestroy(() => {
             const world = this.worldSingleton();
             if (world) {
                 world.proxy.free();
@@ -350,7 +350,7 @@ class NgtrPhysics {
         const world = this.worldSingleton();
         if (!world)
             return;
-        world.proxy.gravity = this.gravity();
+        world.proxy.gravity = this.vGravity();
         world.proxy.integrationParameters.numSolverIterations = this.numSolverIterations();
         world.proxy.integrationParameters.numAdditionalFrictionIterations = this.numAdditionalFrictionIterations();
         world.proxy.integrationParameters.numInternalPgsIterations = this.numInternalPgsIterations();
@@ -574,7 +574,10 @@ class NgtrPhysics {
         };
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.11", ngImport: i0, type: NgtrPhysics, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.11", type: NgtrPhysics, isStandalone: true, selector: "ngtr-physics", inputs: { options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null } }, queries: [{ propertyName: "content", first: true, predicate: TemplateRef, descendants: true, isSignal: true }, { propertyName: "fallbackContent", first: true, predicate: NgtrPhysicsFallback, descendants: true, isSignal: true }], ngImport: i0, template: `
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.11", type: NgtrPhysics, isStandalone: true, selector: "ngtr-physics", inputs: { options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null } }, queries: [{ propertyName: "content", first: true, predicate: TemplateRef, descendants: true, isSignal: true }, { propertyName: "fallbackContent", first: true, predicate: NgtrPhysicsFallback, descendants: true, read: TemplateRef, isSignal: true }], ngImport: i0, template: `
+		@let _rapierError = rapierError();
+		@let _fallbackContent = fallbackContent();
+
 		@if (rapierConstruct()) {
 			@if (debug()) {
 				<ngtr-debug [world]="worldSingleton()?.proxy" />
@@ -588,8 +591,8 @@ class NgtrPhysics {
 			/>
 
 			<ng-container [ngTemplateOutlet]="content()" />
-		} @else if (rapierError() && !!fallbackContent()) {
-			<ng-container [ngTemplateOutlet]="$any(fallbackContent())" [ngTemplateOutletContext]="{ error: rapierError() }" />
+		} @else if (_rapierError && _fallbackContent) {
+			<ng-container [ngTemplateOutlet]="_fallbackContent" [ngTemplateOutletContext]="{ error: _rapierError }" />
 		}
 	`, isInline: true, dependencies: [{ kind: "component", type: NgtrDebug, selector: "ngtr-debug", inputs: ["world"] }, { kind: "directive", type: NgtrFrameStepper, selector: "ngtr-frame-stepper", inputs: ["ready", "updatePriority", "stepFn", "type"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
@@ -599,6 +602,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.11", ngImpo
                     selector: 'ngtr-physics',
                     standalone: true,
                     template: `
+		@let _rapierError = rapierError();
+		@let _fallbackContent = fallbackContent();
+
 		@if (rapierConstruct()) {
 			@if (debug()) {
 				<ngtr-debug [world]="worldSingleton()?.proxy" />
@@ -612,8 +618,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.11", ngImpo
 			/>
 
 			<ng-container [ngTemplateOutlet]="content()" />
-		} @else if (rapierError() && !!fallbackContent()) {
-			<ng-container [ngTemplateOutlet]="$any(fallbackContent())" [ngTemplateOutletContext]="{ error: rapierError() }" />
+		} @else if (_rapierError && _fallbackContent) {
+			<ng-container [ngTemplateOutlet]="_fallbackContent" [ngTemplateOutletContext]="{ error: _rapierError }" />
 		}
 	`,
                     changeDetection: ChangeDetectionStrategy.OnPush,
@@ -632,6 +638,16 @@ class NgtrAnyCollider {
     userData = input({});
     name = input();
     options = input(colliderDefaultOptions, { transform: mergeInputs(rigidBodyDefaultOptions) });
+    object3DParameters = computed(() => {
+        return {
+            position: this.position(),
+            rotation: this.rotation(),
+            scale: this.scale(),
+            quaternion: this.quaternion(),
+            userData: this.userData(),
+            name: this.name(),
+        };
+    });
     // TODO: change this to input required when Angular allows setting hostDirective input
     shape = model(undefined, { alias: 'ngtrCollider' });
     args = model([]);
@@ -691,6 +707,10 @@ class NgtrAnyCollider {
     });
     constructor() {
         extend({ Object3D });
+        effect(() => {
+            const object3DParameters = this.object3DParameters();
+            applyProps(this.objectRef.nativeElement, object3DParameters);
+        });
         effect((onCleanup) => {
             const cleanup = this.createColliderStateEffect();
             onCleanup(() => cleanup?.());
@@ -871,22 +891,11 @@ class NgtrAnyCollider {
         return scaledVerts;
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.11", ngImport: i0, type: NgtrAnyCollider, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "18.2.11", type: NgtrAnyCollider, isStandalone: true, selector: "ngt-object3D[ngtrCollider]", inputs: { position: { classPropertyName: "position", publicName: "position", isSignal: true, isRequired: false, transformFunction: null }, rotation: { classPropertyName: "rotation", publicName: "rotation", isSignal: true, isRequired: false, transformFunction: null }, scale: { classPropertyName: "scale", publicName: "scale", isSignal: true, isRequired: false, transformFunction: null }, quaternion: { classPropertyName: "quaternion", publicName: "quaternion", isSignal: true, isRequired: false, transformFunction: null }, userData: { classPropertyName: "userData", publicName: "userData", isSignal: true, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, shape: { classPropertyName: "shape", publicName: "ngtrCollider", isSignal: true, isRequired: false, transformFunction: null }, args: { classPropertyName: "args", publicName: "args", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { shape: "ngtrColliderChange", args: "argsChange", collisionEnter: "collisionEnter", collisionExit: "collisionExit", intersectionEnter: "intersectionEnter", intersectionExit: "intersectionExit", contactForce: "contactForce" }, host: { properties: { "position": "position()", "rotation": "rotation()", "scale": "scale()", "quaternion": "quaternion()", "userData": "userData()", "name": "name()" } }, ngImport: i0 });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "18.2.11", type: NgtrAnyCollider, isStandalone: true, selector: "ngt-object3D[ngtrCollider]", inputs: { position: { classPropertyName: "position", publicName: "position", isSignal: true, isRequired: false, transformFunction: null }, rotation: { classPropertyName: "rotation", publicName: "rotation", isSignal: true, isRequired: false, transformFunction: null }, scale: { classPropertyName: "scale", publicName: "scale", isSignal: true, isRequired: false, transformFunction: null }, quaternion: { classPropertyName: "quaternion", publicName: "quaternion", isSignal: true, isRequired: false, transformFunction: null }, userData: { classPropertyName: "userData", publicName: "userData", isSignal: true, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, shape: { classPropertyName: "shape", publicName: "ngtrCollider", isSignal: true, isRequired: false, transformFunction: null }, args: { classPropertyName: "args", publicName: "args", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { shape: "ngtrColliderChange", args: "argsChange", collisionEnter: "collisionEnter", collisionExit: "collisionExit", intersectionEnter: "intersectionEnter", intersectionExit: "intersectionExit", contactForce: "contactForce" }, ngImport: i0 });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.11", ngImport: i0, type: NgtrAnyCollider, decorators: [{
             type: Directive,
-            args: [{
-                    selector: 'ngt-object3D[ngtrCollider]',
-                    standalone: true,
-                    host: {
-                        '[position]': 'position()',
-                        '[rotation]': 'rotation()',
-                        '[scale]': 'scale()',
-                        '[quaternion]': 'quaternion()',
-                        '[userData]': 'userData()',
-                        '[name]': 'name()',
-                    },
-                }]
+            args: [{ selector: 'ngt-object3D[ngtrCollider]', standalone: true }]
         }], ctorParameters: () => [] });
 const RIGID_BODY_TYPE_MAP = {
     fixed: 1,
@@ -919,6 +928,15 @@ class NgtrRigidBody {
     quaternion = input([0, 0, 0, 1]);
     userData = input({});
     options = input(rigidBodyDefaultOptions, { transform: mergeInputs(rigidBodyDefaultOptions) });
+    object3DParameters = computed(() => {
+        return {
+            position: this.position(),
+            rotation: this.rotation(),
+            scale: this.scale(),
+            quaternion: this.quaternion(),
+            userData: this.userData(),
+        };
+    });
     wake = output();
     sleep = output();
     collisionEnter = output();
@@ -979,6 +997,10 @@ class NgtrRigidBody {
     });
     constructor() {
         extend({ Object3D });
+        effect(() => {
+            const object3DParameters = this.object3DParameters();
+            applyProps(this.objectRef.nativeElement, object3DParameters);
+        });
         effect((onCleanup) => {
             const cleanup = this.createRigidBodyStateEffect();
             onCleanup(() => cleanup?.());
@@ -1116,7 +1138,7 @@ class NgtrRigidBody {
         };
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.11", ngImport: i0, type: NgtrRigidBody, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.11", type: NgtrRigidBody, isStandalone: true, selector: "ngt-object3D[ngtrRigidBody]", inputs: { type: { classPropertyName: "type", publicName: "ngtrRigidBody", isSignal: true, isRequired: false, transformFunction: null }, position: { classPropertyName: "position", publicName: "position", isSignal: true, isRequired: false, transformFunction: null }, rotation: { classPropertyName: "rotation", publicName: "rotation", isSignal: true, isRequired: false, transformFunction: null }, scale: { classPropertyName: "scale", publicName: "scale", isSignal: true, isRequired: false, transformFunction: null }, quaternion: { classPropertyName: "quaternion", publicName: "quaternion", isSignal: true, isRequired: false, transformFunction: null }, userData: { classPropertyName: "userData", publicName: "userData", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { wake: "wake", sleep: "sleep", collisionEnter: "collisionEnter", collisionExit: "collisionExit", intersectionEnter: "intersectionEnter", intersectionExit: "intersectionExit", contactForce: "contactForce" }, host: { properties: { "position": "position()", "rotation": "rotation()", "scale": "scale()", "quaternion": "quaternion()", "userData": "userData()" } }, exportAs: ["rigidBody"], ngImport: i0, template: `
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.11", type: NgtrRigidBody, isStandalone: true, selector: "ngt-object3D[ngtrRigidBody]", inputs: { type: { classPropertyName: "type", publicName: "ngtrRigidBody", isSignal: true, isRequired: false, transformFunction: null }, position: { classPropertyName: "position", publicName: "position", isSignal: true, isRequired: false, transformFunction: null }, rotation: { classPropertyName: "rotation", publicName: "rotation", isSignal: true, isRequired: false, transformFunction: null }, scale: { classPropertyName: "scale", publicName: "scale", isSignal: true, isRequired: false, transformFunction: null }, quaternion: { classPropertyName: "quaternion", publicName: "quaternion", isSignal: true, isRequired: false, transformFunction: null }, userData: { classPropertyName: "userData", publicName: "userData", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { wake: "wake", sleep: "sleep", collisionEnter: "collisionEnter", collisionExit: "collisionExit", intersectionEnter: "intersectionEnter", intersectionExit: "intersectionExit", contactForce: "contactForce" }, exportAs: ["rigidBody"], ngImport: i0, template: `
 		<ng-content />
 		@for (childColliderOption of childColliderOptions(); track $index) {
 			<ngt-object3D
@@ -1153,17 +1175,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.11", ngImpo
 	`,
                     schemas: [CUSTOM_ELEMENTS_SCHEMA],
                     changeDetection: ChangeDetectionStrategy.OnPush,
-                    host: {
-                        '[position]': 'position()',
-                        '[rotation]': 'rotation()',
-                        '[scale]': 'scale()',
-                        '[quaternion]': 'quaternion()',
-                        '[userData]': 'userData()',
-                    },
                     imports: [NgtrAnyCollider],
                 }]
         }], ctorParameters: () => [] });
 
+// NOTE: this is ok to use here since we're not exporting this short-cut
 const ANY_COLLIDER_HOST_DIRECTIVE = {
     directive: NgtrAnyCollider,
     inputs: ['options', 'name', 'scale', 'position', 'quaternion', 'rotation', 'userData'],
@@ -1531,6 +1547,15 @@ class NgtrInstancedRigidBodies {
         },
     });
     options = input(defaultOptions, { transform: mergeInputs(defaultOptions) });
+    object3DParameters = computed(() => {
+        return {
+            position: this.position(),
+            rotation: this.rotation(),
+            scale: this.scale(),
+            quaternion: this.quaternion(),
+            userData: this.userData(),
+        };
+    });
     instanceWrapperRef = viewChild.required('instanceWrapper');
     rigidBodyRefs = viewChildren(NgtrRigidBody);
     physics = inject(NgtrPhysics);
@@ -1601,6 +1626,10 @@ class NgtrInstancedRigidBodies {
     });
     constructor() {
         extend({ Object3D });
+        effect(() => {
+            const object3DParameters = this.object3DParameters();
+            applyProps(this.objectRef.nativeElement, object3DParameters);
+        });
         effect(() => {
             const instancedMesh = this.instancedMesh();
             if (!instancedMesh)
@@ -1609,7 +1638,7 @@ class NgtrInstancedRigidBodies {
         });
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.11", ngImport: i0, type: NgtrInstancedRigidBodies, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.11", type: NgtrInstancedRigidBodies, isStandalone: true, selector: "ngt-object3D[ngtrInstancedRigidBodies]", inputs: { position: { classPropertyName: "position", publicName: "position", isSignal: true, isRequired: false, transformFunction: null }, rotation: { classPropertyName: "rotation", publicName: "rotation", isSignal: true, isRequired: false, transformFunction: null }, scale: { classPropertyName: "scale", publicName: "scale", isSignal: true, isRequired: false, transformFunction: null }, quaternion: { classPropertyName: "quaternion", publicName: "quaternion", isSignal: true, isRequired: false, transformFunction: null }, userData: { classPropertyName: "userData", publicName: "userData", isSignal: true, isRequired: false, transformFunction: null }, instances: { classPropertyName: "instances", publicName: "ngtrInstancedRigidBodies", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "position": "position()", "rotation": "rotation()", "scale": "scale()", "quaternion": "quaternion()", "userData": "userData()" } }, viewQueries: [{ propertyName: "instanceWrapperRef", first: true, predicate: ["instanceWrapper"], descendants: true, isSignal: true }, { propertyName: "rigidBodyRefs", predicate: NgtrRigidBody, descendants: true, isSignal: true }], exportAs: ["instancedRigidBodies"], ngImport: i0, template: `
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.11", type: NgtrInstancedRigidBodies, isStandalone: true, selector: "ngt-object3D[ngtrInstancedRigidBodies]", inputs: { position: { classPropertyName: "position", publicName: "position", isSignal: true, isRequired: false, transformFunction: null }, rotation: { classPropertyName: "rotation", publicName: "rotation", isSignal: true, isRequired: false, transformFunction: null }, scale: { classPropertyName: "scale", publicName: "scale", isSignal: true, isRequired: false, transformFunction: null }, quaternion: { classPropertyName: "quaternion", publicName: "quaternion", isSignal: true, isRequired: false, transformFunction: null }, userData: { classPropertyName: "userData", publicName: "userData", isSignal: true, isRequired: false, transformFunction: null }, instances: { classPropertyName: "instances", publicName: "ngtrInstancedRigidBodies", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "instanceWrapperRef", first: true, predicate: ["instanceWrapper"], descendants: true, isSignal: true }, { propertyName: "rigidBodyRefs", predicate: NgtrRigidBody, descendants: true, isSignal: true }], exportAs: ["instancedRigidBodies"], ngImport: i0, template: `
 		<ngt-object3D #instanceWrapper>
 			<ng-content />
 		</ngt-object3D>
@@ -1682,13 +1711,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.11", ngImpo
 	`,
                     schemas: [CUSTOM_ELEMENTS_SCHEMA],
                     changeDetection: ChangeDetectionStrategy.OnPush,
-                    host: {
-                        '[position]': 'position()',
-                        '[rotation]': 'rotation()',
-                        '[scale]': 'scale()',
-                        '[quaternion]': 'quaternion()',
-                        '[userData]': 'userData()',
-                    },
                     imports: [NgtrRigidBody, NgtrAnyCollider],
                 }]
         }], ctorParameters: () => [] });
@@ -1803,7 +1825,6 @@ class NgtrMeshCollider {
     colliders = input.required({ alias: 'ngtrMeshCollider' });
     objectRef = inject(ElementRef);
     rigidBody = inject(NgtrRigidBody);
-    physics = inject(NgtrPhysics);
     childColliderOptions = computed(() => {
         const rigidBodyOptions = this.rigidBody.options();
         rigidBodyOptions.colliders = this.colliders();