@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<WorldStepCallback>;
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(callback);
508
+ beforeStepCallbacks.add(ref);
499
509
  return () => {
500
- beforeStepCallbacks.delete(callback);
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(callback);
525
+ afterStepCallbacks.add(ref);
515
526
  return () => {
516
- afterStepCallbacks.delete(callback);
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(callback);
508
+ beforeStepCallbacks.add(ref);
499
509
  return () => {
500
- beforeStepCallbacks.delete(callback);
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(callback);
525
+ afterStepCallbacks.add(ref);
515
526
  return () => {
516
- afterStepCallbacks.delete(callback);
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(callback);
483
+ beforeStepCallbacks.add(ref);
474
484
  return () => {
475
- beforeStepCallbacks.delete(callback);
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(callback);
500
+ afterStepCallbacks.add(ref);
490
501
  return () => {
491
- afterStepCallbacks.delete(callback);
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
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@react-three/rapier",
3
- "version": "0.13.0",
3
+ "version": "0.13.1",
4
4
  "source": "src/index.ts",
5
5
  "main": "dist/react-three-rapier.cjs.js",
6
6
  "module": "dist/react-three-rapier.esm.js",
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/>">🧩 API Docs</a>
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 hook instance.
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