@react-three/drei 10.2.0 → 10.3.0

package/core/CameraControls.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@babel/runtime/helpers/extends"),t=require("three"),r=require("react"),n=require("@react-three/fiber"),o=require("camera-controls");function a(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function l(e){if(e&&e.__esModule)return e;var t=Object.create(null);return e&&Object.keys(e).forEach((function(r){if("default"!==r){var n=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(t,r,n.get?n:{enumerable:!0,get:function(){return e[r]}})}})),t.default=e,Object.freeze(t)}var s=a(e),u=l(r),c=a(o);const i=r.forwardRef(((e,o)=>{r.useMemo((()=>{const e={Box3:t.Box3,MathUtils:{clamp:t.MathUtils.clamp},Matrix4:t.Matrix4,Quaternion:t.Quaternion,Raycaster:t.Raycaster,Sphere:t.Sphere,Spherical:t.Spherical,Vector2:t.Vector2,Vector3:t.Vector3,Vector4:t.Vector4};c.default.install({THREE:e}),n.extend({CameraControlsImpl:c.default})}),[]);const{camera:a,domElement:l,makeDefault:i,onControlStart:d,onControl:f,onControlEnd:v,onTransitionStart:m,onUpdate:E,onWake:p,onRest:h,onSleep:L,onStart:b,onEnd:C,onChange:T,regress:g,...j}=e,x=n.useThree((e=>e.camera)),y=n.useThree((e=>e.gl)),M=n.useThree((e=>e.invalidate)),O=n.useThree((e=>e.events)),S=n.useThree((e=>e.setEvents)),V=n.useThree((e=>e.set)),k=n.useThree((e=>e.get)),q=n.useThree((e=>e.performance)),w=a||x,R=l||O.connected||y.domElement,P=r.useMemo((()=>new c.default(w)),[w]);return n.useFrame(((e,t)=>{P.update(t)}),-1),r.useEffect((()=>(P.connect(R),()=>{P.disconnect()})),[R,P]),r.useEffect((()=>{function e(){M(),g&&q.regress()}const t=t=>{e(),null==d||d(t),null==b||b(t)},r=t=>{e(),null==f||f(t),null==T||T(t)},n=e=>{null==v||v(e),null==C||C(e)},o=t=>{e(),null==m||m(t),null==T||T(t)},a=t=>{e(),null==E||E(t),null==T||T(t)},l=t=>{e(),null==p||p(t),null==T||T(t)},s=e=>{null==h||h(e)},u=e=>{null==L||L(e)};return P.addEventListener("controlstart",t),P.addEventListener("control",r),P.addEventListener("controlend",n),P.addEventListener("transitionstart",o),P.addEventListener("update",a),P.addEventListener("wake",l),P.addEventListener("rest",s),P.addEventListener("sleep",u),()=>{P.removeEventListener("controlstart",t),P.removeEventListener("control",r),P.removeEventListener("controlend",n),P.removeEventListener("transitionstart",o),P.removeEventListener("update",a),P.removeEventListener("wake",l),P.removeEventListener("rest",s),P.removeEventListener("sleep",u)}}),[P,M,S,g,q,d,f,v,m,E,p,h,L,T,b,C]),r.useEffect((()=>{if(i){const e=k().controls;return V({controls:P}),()=>V({controls:e})}}),[i,P]),u.createElement("primitive",s.default({ref:o,object:P},j))}));Object.defineProperty(exports,"CameraControlsImpl",{enumerable:!0,get:function(){return c.default}}),exports.CameraControls=i;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@babel/runtime/helpers/extends"),t=require("three"),r=require("react"),n=require("@react-three/fiber"),o=require("camera-controls");function l(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function a(e){if(e&&e.__esModule)return e;var t=Object.create(null);return e&&Object.keys(e).forEach((function(r){if("default"!==r){var n=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(t,r,n.get?n:{enumerable:!0,get:function(){return e[r]}})}})),t.default=e,Object.freeze(t)}var s=l(e),u=a(r),c=l(o);const i=r.forwardRef(((e,o)=>{const{impl:l,camera:a,domElement:i,makeDefault:d,onControlStart:f,onControl:m,onControlEnd:v,onTransitionStart:p,onUpdate:E,onWake:h,onRest:L,onSleep:b,onStart:C,onEnd:T,onChange:g,regress:j,...x}=e,y=null!=l?l:c.default;r.useMemo((()=>{const e={Box3:t.Box3,MathUtils:{clamp:t.MathUtils.clamp},Matrix4:t.Matrix4,Quaternion:t.Quaternion,Raycaster:t.Raycaster,Sphere:t.Sphere,Spherical:t.Spherical,Vector2:t.Vector2,Vector3:t.Vector3,Vector4:t.Vector4};y.install({THREE:e}),n.extend({CameraControlsImpl:y})}),[y]);const M=n.useThree((e=>e.camera)),O=n.useThree((e=>e.gl)),S=n.useThree((e=>e.invalidate)),V=n.useThree((e=>e.events)),k=n.useThree((e=>e.setEvents)),q=n.useThree((e=>e.set)),w=n.useThree((e=>e.get)),R=n.useThree((e=>e.performance)),P=a||M,_=i||V.connected||O.domElement,U=r.useMemo((()=>new y(P)),[y,P]);return n.useFrame(((e,t)=>{U.update(t)}),-1),r.useEffect((()=>(U.connect(_),()=>{U.disconnect()})),[_,U]),r.useEffect((()=>{function e(){S(),j&&R.regress()}const t=t=>{e(),null==f||f(t),null==C||C(t)},r=t=>{e(),null==m||m(t),null==g||g(t)},n=e=>{null==v||v(e),null==T||T(e)},o=t=>{e(),null==p||p(t),null==g||g(t)},l=t=>{e(),null==E||E(t),null==g||g(t)},a=t=>{e(),null==h||h(t),null==g||g(t)},s=e=>{null==L||L(e)},u=e=>{null==b||b(e)};return U.addEventListener("controlstart",t),U.addEventListener("control",r),U.addEventListener("controlend",n),U.addEventListener("transitionstart",o),U.addEventListener("update",l),U.addEventListener("wake",a),U.addEventListener("rest",s),U.addEventListener("sleep",u),()=>{U.removeEventListener("controlstart",t),U.removeEventListener("control",r),U.removeEventListener("controlend",n),U.removeEventListener("transitionstart",o),U.removeEventListener("update",l),U.removeEventListener("wake",a),U.removeEventListener("rest",s),U.removeEventListener("sleep",u)}}),[U,S,k,j,R,f,m,v,p,E,h,L,b,g,C,T]),r.useEffect((()=>{if(d){const e=w().controls;return q({controls:U}),()=>q({controls:e})}}),[d,U]),u.createElement("primitive",s.default({ref:o,object:U},x))}));Object.defineProperty(exports,"CameraControlsImpl",{enumerable:!0,get:function(){return c.default}}),exports.CameraControls=i;

package/core/CameraControls.d.ts

@@ -3,6 +3,7 @@ import { ThreeElement } from '@react-three/fiber';
 import CameraControlsImpl from 'camera-controls';
 import { ForwardRefComponent, Overwrite } from '../helpers/ts-utils';
 export type CameraControlsProps = Omit<Overwrite<ThreeElement<typeof CameraControlsImpl>, {
+    impl?: typeof CameraControlsImpl;
     camera?: PerspectiveCamera | OrthographicCamera;
     domElement?: HTMLElement;
     makeDefault?: boolean;

package/core/CameraControls.js

@@ -7,6 +7,27 @@ import CameraControlsImpl from 'camera-controls';
 export { default as CameraControlsImpl } from 'camera-controls';
 
 const CameraControls = /* @__PURE__ */forwardRef((props, ref) => {
+  const {
+    impl: SubclassImpl,
+    camera,
+    domElement,
+    makeDefault,
+    onControlStart,
+    onControl,
+    onControlEnd,
+    onTransitionStart,
+    onUpdate,
+    onWake,
+    onRest,
+    onSleep,
+    onStart,
+    onEnd,
+    onChange,
+    regress,
+    ...restProps
+  } = props;
+  const Impl = SubclassImpl !== null && SubclassImpl !== void 0 ? SubclassImpl : CameraControlsImpl;
+
   // useMemo is used here instead of useEffect, otherwise the useMemo below runs first and throws
   useMemo(() => {
     // to allow for tree shaking, we only import the subset of THREE that is used by camera-controls
@@ -25,31 +46,13 @@ const CameraControls = /* @__PURE__ */forwardRef((props, ref) => {
       Vector3,
       Vector4
     };
-    CameraControlsImpl.install({
+    Impl.install({
       THREE: subsetOfTHREE
     });
     extend({
-      CameraControlsImpl
+      CameraControlsImpl: Impl
     });
-  }, []);
-  const {
-    camera,
-    domElement,
-    makeDefault,
-    onControlStart,
-    onControl,
-    onControlEnd,
-    onTransitionStart,
-    onUpdate,
-    onWake,
-    onRest,
-    onSleep,
-    onStart,
-    onEnd,
-    onChange,
-    regress,
-    ...restProps
-  } = props;
+  }, [Impl]);
   const defaultCamera = useThree(state => state.camera);
   const gl = useThree(state => state.gl);
   const invalidate = useThree(state => state.invalidate);
@@ -60,7 +63,7 @@ const CameraControls = /* @__PURE__ */forwardRef((props, ref) => {
   const performance = useThree(state => state.performance);
   const explCamera = camera || defaultCamera;
   const explDomElement = domElement || events.connected || gl.domElement;
-  const controls = useMemo(() => new CameraControlsImpl(explCamera), [explCamera]);
+  const controls = useMemo(() => new Impl(explCamera), [Impl, explCamera]);
   useFrame((state, delta) => {
     controls.update(delta);
   }, -1);