@react-three/rapier 0.13.0 → 0.13.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -20,7 +20,9 @@ export interface RigidBodyState {
|
|
20
20
|
}
|
21
21
|
export declare type RigidBodyStateMap = Map<RigidBody["handle"], RigidBodyState>;
|
22
22
|
export declare type WorldStepCallback = (worldApi: WorldApi) => void;
|
23
|
-
export declare type WorldStepCallbackSet = Set<
|
23
|
+
export declare type WorldStepCallbackSet = Set<{
|
24
|
+
current: WorldStepCallback;
|
25
|
+
}>;
|
24
26
|
export interface ColliderState {
|
25
27
|
collider: Collider;
|
26
28
|
object: Object3D;
|
@@ -477,11 +477,20 @@ const useColliderEvents = (getCollider, props, events) => {
|
|
477
477
|
}, [onCollisionEnter, onCollisionExit, onIntersectionEnter, onIntersectionExit, onContactForce]);
|
478
478
|
};
|
479
479
|
|
480
|
+
const useMutableCallback = fn => {
|
481
|
+
const ref = React.useRef(fn);
|
482
|
+
React.useEffect(() => {
|
483
|
+
ref.current = fn;
|
484
|
+
}, [fn]);
|
485
|
+
return ref;
|
486
|
+
}; // External hooks
|
487
|
+
|
480
488
|
/**
|
481
489
|
* Exposes the Rapier context, and world
|
482
490
|
* @category Hooks
|
483
491
|
*/
|
484
492
|
|
493
|
+
|
485
494
|
const useRapier = () => {
|
486
495
|
return React.useContext(rapierContext);
|
487
496
|
};
|
@@ -494,10 +503,11 @@ const useBeforePhysicsStep = callback => {
|
|
494
503
|
const {
|
495
504
|
beforeStepCallbacks
|
496
505
|
} = useRapier();
|
506
|
+
const ref = useMutableCallback(callback);
|
497
507
|
React.useEffect(() => {
|
498
|
-
beforeStepCallbacks.add(
|
508
|
+
beforeStepCallbacks.add(ref);
|
499
509
|
return () => {
|
500
|
-
beforeStepCallbacks.delete(
|
510
|
+
beforeStepCallbacks.delete(ref);
|
501
511
|
};
|
502
512
|
}, []);
|
503
513
|
};
|
@@ -510,10 +520,11 @@ const useAfterPhysicsStep = callback => {
|
|
510
520
|
const {
|
511
521
|
afterStepCallbacks
|
512
522
|
} = useRapier();
|
523
|
+
const ref = useMutableCallback(callback);
|
513
524
|
React.useEffect(() => {
|
514
|
-
afterStepCallbacks.add(
|
525
|
+
afterStepCallbacks.add(ref);
|
515
526
|
return () => {
|
516
|
-
afterStepCallbacks.delete(
|
527
|
+
afterStepCallbacks.delete(ref);
|
517
528
|
};
|
518
529
|
}, []);
|
519
530
|
}; // Internal hooks
|
@@ -759,12 +770,12 @@ const Physics = ({
|
|
759
770
|
}); // Trigger beforeStep callbacks
|
760
771
|
|
761
772
|
beforeStepCallbacks.forEach(callback => {
|
762
|
-
callback(api);
|
773
|
+
callback.current(api);
|
763
774
|
});
|
764
775
|
world.step(eventQueue); // Trigger afterStep callbacks
|
765
776
|
|
766
777
|
afterStepCallbacks.forEach(callback => {
|
767
|
-
callback(api);
|
778
|
+
callback.current(api);
|
768
779
|
});
|
769
780
|
};
|
770
781
|
|
@@ -477,11 +477,20 @@ const useColliderEvents = (getCollider, props, events) => {
|
|
477
477
|
}, [onCollisionEnter, onCollisionExit, onIntersectionEnter, onIntersectionExit, onContactForce]);
|
478
478
|
};
|
479
479
|
|
480
|
+
const useMutableCallback = fn => {
|
481
|
+
const ref = React.useRef(fn);
|
482
|
+
React.useEffect(() => {
|
483
|
+
ref.current = fn;
|
484
|
+
}, [fn]);
|
485
|
+
return ref;
|
486
|
+
}; // External hooks
|
487
|
+
|
480
488
|
/**
|
481
489
|
* Exposes the Rapier context, and world
|
482
490
|
* @category Hooks
|
483
491
|
*/
|
484
492
|
|
493
|
+
|
485
494
|
const useRapier = () => {
|
486
495
|
return React.useContext(rapierContext);
|
487
496
|
};
|
@@ -494,10 +503,11 @@ const useBeforePhysicsStep = callback => {
|
|
494
503
|
const {
|
495
504
|
beforeStepCallbacks
|
496
505
|
} = useRapier();
|
506
|
+
const ref = useMutableCallback(callback);
|
497
507
|
React.useEffect(() => {
|
498
|
-
beforeStepCallbacks.add(
|
508
|
+
beforeStepCallbacks.add(ref);
|
499
509
|
return () => {
|
500
|
-
beforeStepCallbacks.delete(
|
510
|
+
beforeStepCallbacks.delete(ref);
|
501
511
|
};
|
502
512
|
}, []);
|
503
513
|
};
|
@@ -510,10 +520,11 @@ const useAfterPhysicsStep = callback => {
|
|
510
520
|
const {
|
511
521
|
afterStepCallbacks
|
512
522
|
} = useRapier();
|
523
|
+
const ref = useMutableCallback(callback);
|
513
524
|
React.useEffect(() => {
|
514
|
-
afterStepCallbacks.add(
|
525
|
+
afterStepCallbacks.add(ref);
|
515
526
|
return () => {
|
516
|
-
afterStepCallbacks.delete(
|
527
|
+
afterStepCallbacks.delete(ref);
|
517
528
|
};
|
518
529
|
}, []);
|
519
530
|
}; // Internal hooks
|
@@ -759,12 +770,12 @@ const Physics = ({
|
|
759
770
|
}); // Trigger beforeStep callbacks
|
760
771
|
|
761
772
|
beforeStepCallbacks.forEach(callback => {
|
762
|
-
callback(api);
|
773
|
+
callback.current(api);
|
763
774
|
});
|
764
775
|
world.step(eventQueue); // Trigger afterStep callbacks
|
765
776
|
|
766
777
|
afterStepCallbacks.forEach(callback => {
|
767
|
-
callback(api);
|
778
|
+
callback.current(api);
|
768
779
|
});
|
769
780
|
};
|
770
781
|
|
@@ -452,11 +452,20 @@ const useColliderEvents = (getCollider, props, events) => {
|
|
452
452
|
}, [onCollisionEnter, onCollisionExit, onIntersectionEnter, onIntersectionExit, onContactForce]);
|
453
453
|
};
|
454
454
|
|
455
|
+
const useMutableCallback = fn => {
|
456
|
+
const ref = useRef(fn);
|
457
|
+
useEffect(() => {
|
458
|
+
ref.current = fn;
|
459
|
+
}, [fn]);
|
460
|
+
return ref;
|
461
|
+
}; // External hooks
|
462
|
+
|
455
463
|
/**
|
456
464
|
* Exposes the Rapier context, and world
|
457
465
|
* @category Hooks
|
458
466
|
*/
|
459
467
|
|
468
|
+
|
460
469
|
const useRapier = () => {
|
461
470
|
return useContext(rapierContext);
|
462
471
|
};
|
@@ -469,10 +478,11 @@ const useBeforePhysicsStep = callback => {
|
|
469
478
|
const {
|
470
479
|
beforeStepCallbacks
|
471
480
|
} = useRapier();
|
481
|
+
const ref = useMutableCallback(callback);
|
472
482
|
useEffect(() => {
|
473
|
-
beforeStepCallbacks.add(
|
483
|
+
beforeStepCallbacks.add(ref);
|
474
484
|
return () => {
|
475
|
-
beforeStepCallbacks.delete(
|
485
|
+
beforeStepCallbacks.delete(ref);
|
476
486
|
};
|
477
487
|
}, []);
|
478
488
|
};
|
@@ -485,10 +495,11 @@ const useAfterPhysicsStep = callback => {
|
|
485
495
|
const {
|
486
496
|
afterStepCallbacks
|
487
497
|
} = useRapier();
|
498
|
+
const ref = useMutableCallback(callback);
|
488
499
|
useEffect(() => {
|
489
|
-
afterStepCallbacks.add(
|
500
|
+
afterStepCallbacks.add(ref);
|
490
501
|
return () => {
|
491
|
-
afterStepCallbacks.delete(
|
502
|
+
afterStepCallbacks.delete(ref);
|
492
503
|
};
|
493
504
|
}, []);
|
494
505
|
}; // Internal hooks
|
@@ -734,12 +745,12 @@ const Physics = ({
|
|
734
745
|
}); // Trigger beforeStep callbacks
|
735
746
|
|
736
747
|
beforeStepCallbacks.forEach(callback => {
|
737
|
-
callback(api);
|
748
|
+
callback.current(api);
|
738
749
|
});
|
739
750
|
world.step(eventQueue); // Trigger afterStep callbacks
|
740
751
|
|
741
752
|
afterStepCallbacks.forEach(callback => {
|
742
|
-
callback(api);
|
753
|
+
callback.current(api);
|
743
754
|
});
|
744
755
|
};
|
745
756
|
|
package/package.json
CHANGED
package/readme.md
CHANGED
@@ -12,7 +12,7 @@
|
|
12
12
|
<br />
|
13
13
|
For contributions, please read the <a href="https://github.com/pmndrs/react-three-rapier/blob/main/packages/react-three-rapier/CONTRIBUTING.md">🪧 Contribution Guide</a>.
|
14
14
|
<br/>
|
15
|
-
For available APIs, see <a href="https://pmndrs.github.io/react-three-rapier
|
15
|
+
For available APIs, see <a href="https://pmndrs.github.io/react-three-rapier/">🧩 API Docs</a>
|
16
16
|
</p>
|
17
17
|
|
18
18
|
---
|
@@ -80,7 +80,6 @@ For full API outline and documentation, see 🧩 [API Docs](https://pmndrs.githu
|
|
80
80
|
- [Spherical Joint](#spherical-joint)
|
81
81
|
- [Revolute Joint](#revolute-joint)
|
82
82
|
- [Prismatic Joint](#prismatic-joint)
|
83
|
-
- [Joint APIs](#joint-apis)
|
84
83
|
- [🖼 Joints Example](#-joints-example)
|
85
84
|
- [Advanced hooks usage](#advanced-hooks-usage)
|
86
85
|
- [Manual stepping](#manual-stepping)
|
@@ -674,7 +673,7 @@ There are 4 different joint types available:
|
|
674
673
|
- Revolute (two bodies are connected by a hinge, for things like doors or wheels)
|
675
674
|
- Prismatic (two bodies are connected by a sliding joint, for things like pistons or sliders)
|
676
675
|
|
677
|
-
Each joint hook returns a RefObject containing the raw reference to the
|
676
|
+
Each joint hook returns a RefObject containing the raw reference to the joint instance.
|
678
677
|
```tsx
|
679
678
|
const WheelJoint = ({bodyA, bodyB}) => {
|
680
679
|
const joint = useRevoluteJoint(bodyA, bodyB, [[0,0,0],[0,0,0],[0,0,0]])
|
@@ -815,27 +814,6 @@ const JointedThing = () => {
|
|
815
814
|
}
|
816
815
|
```
|
817
816
|
|
818
|
-
### Joint APIs
|
819
|
-
Joints can be controlled imperatively similarily to how `RigidBody` components can be controlled.
|
820
|
-
|
821
|
-
🧩 See [Joint API docs](https://pmndrs.github.io/react-three-rapier/interfaces/JointApi.html) for more information.
|
822
|
-
|
823
|
-
```tsx
|
824
|
-
const JointedThing = () => {
|
825
|
-
const joint = useSphericalJoint(...)
|
826
|
-
|
827
|
-
useEffect(() => {
|
828
|
-
joint.configureMotorVelocity(1, 0)
|
829
|
-
|
830
|
-
// Disable contacts between the two joint bodies
|
831
|
-
joint.setContactsEnabled(false)
|
832
|
-
}, [])
|
833
|
-
|
834
|
-
return ...
|
835
|
-
}
|
836
|
-
```
|
837
|
-
|
838
|
-
|
839
817
|
### 🖼 Joints Example
|
840
818
|
<a href="https://codesandbox.io/s/react-three-rapier-joints-mhhbd4"><img src="https://raw.githubusercontent.com/pmndrs/react-three-rapier/HEAD/packages/react-three-rapier/misc/example-joints.jpg" width="240" /></a>
|
841
819
|
|