@react-three/drei 9.55.0 → 9.56.0

package/core/CameraControls.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@babel/runtime/helpers/extends"),r=require("three"),t=require("react"),n=require("@react-three/fiber"),u=require("camera-controls");function a(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function c(e){if(e&&e.__esModule)return e;var r=Object.create(null);return e&&Object.keys(e).forEach((function(t){if("default"!==t){var n=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(r,t,n.get?n:{enumerable:!0,get:function(){return e[t]}})}})),r.default=e,Object.freeze(r)}var o=a(e),l=c(r),s=c(t),f=a(u);const i=t.forwardRef(((e,r)=>{t.useMemo((()=>{f.default.install({THREE:l}),n.extend({CameraControlsImpl:f.default})}),[]);const{camera:u,domElement:a,...c}=e,i=n.useThree((e=>e.camera)),d=n.useThree((e=>e.gl)),m=n.useThree((e=>e.invalidate)),b=n.useThree((e=>e.events)),p=u||i,h=a||b.connected||d.domElement,j=t.useMemo((()=>new f.default(p)),[p]);return n.useFrame(((e,r)=>{j.enabled&&j.update(r)}),-1),t.useEffect((()=>(j.connect(h),()=>{j.disconnect()})),[h,j,m]),s.createElement("primitive",o.default({ref:r,object:j},c))}));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 a(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function s(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 u=a(e),c=s(t),l=s(r),d=a(o);const i=r.forwardRef(((e,t)=>{r.useMemo((()=>{d.default.install({THREE:c}),n.extend({CameraControlsImpl:d.default})}),[]);const{camera:o,domElement:a,onStart:s,onEnd:i,onChange:f,events:m,regress:v,...b}=e,E=n.useThree((e=>e.camera)),p=n.useThree((e=>e.gl)),h=n.useThree((e=>e.invalidate)),j=n.useThree((e=>e.events)),g=n.useThree((e=>e.setEvents)),O=n.useThree((e=>e.performance)),T=o||E,L=a||j.connected||p.domElement,q=r.useMemo((()=>new d.default(T)),[T]);return n.useFrame(((e,t)=>{q.enabled&&q.update(t)}),-1),r.useEffect((()=>(q.connect(L),()=>{q.disconnect()})),[L,q]),l.useEffect((()=>{m&&g({enabled:!0});const e=e=>{h(),v&&O.regress(),f&&f(e)},t=e=>{s&&s(e),m||g({enabled:!1})},r=e=>{i&&i(e),m||g({enabled:!0})};return q.addEventListener("control",e),q.addEventListener("controlstart",t),q.addEventListener("controlend",r),()=>{q.removeEventListener("control",e),q.removeEventListener("controlstart",t),q.removeEventListener("controlend",r)}}),[q,m,s,i,h,g,v,f]),l.createElement("primitive",u.default({ref:t,object:q},b))}));exports.CameraControls=i;

package/core/CameraControls.d.ts

@@ -5,6 +5,17 @@ import CameraControlsImpl from 'camera-controls';
 export declare type CameraControlsProps = Omit<ReactThreeFiber.Overwrite<ReactThreeFiber.Node<CameraControlsImpl, typeof CameraControlsImpl>, {
     camera?: PerspectiveCamera | OrthographicCamera;
     domElement?: HTMLElement;
+    onStart?: (e?: {
+        type: 'controlstart';
+    }) => void;
+    onEnd?: (e?: {
+        type: 'controlend';
+    }) => void;
+    onChange?: (e?: {
+        type: 'control';
+    }) => void;
+    events?: boolean;
+    regress?: boolean;
 }>, 'ref'>;
 export declare const CameraControls: React.ForwardRefExoticComponent<CameraControlsProps & React.RefAttributes<CameraControlsImpl>>;
 export declare type CameraControls = CameraControlsImpl;

package/core/CameraControls.js

@@ -17,12 +17,19 @@ const CameraControls = /*#__PURE__*/forwardRef((props, ref) => {
   const {
     camera,
     domElement,
+    onStart,
+    onEnd,
+    onChange,
+    events: enableEvents,
+    regress,
     ...restProps
   } = props;
   const defaultCamera = useThree(state => state.camera);
   const gl = useThree(state => state.gl);
   const invalidate = useThree(state => state.invalidate);
   const events = useThree(state => state.events);
+  const setEvents = useThree(state => state.setEvents);
+  const performance = useThree(state => state.performance);
   const explCamera = camera || defaultCamera;
   const explDomElement = domElement || events.connected || gl.domElement;
   const cameraControls = useMemo(() => new CameraControlsImpl(explCamera), [explCamera]);
@@ -32,7 +39,43 @@ const CameraControls = /*#__PURE__*/forwardRef((props, ref) => {
   useEffect(() => {
     cameraControls.connect(explDomElement);
     return () => void cameraControls.disconnect();
-  }, [explDomElement, cameraControls, invalidate]);
+  }, [explDomElement, cameraControls]);
+  React.useEffect(() => {
+    if (enableEvents) {
+      setEvents({
+        enabled: true
+      });
+    }
+
+    const callback = e => {
+      invalidate();
+      if (regress) performance.regress();
+      if (onChange) onChange(e);
+    };
+
+    const onStartCb = e => {
+      if (onStart) onStart(e);
+      if (!enableEvents) setEvents({
+        enabled: false
+      });
+    };
+
+    const onEndCb = e => {
+      if (onEnd) onEnd(e);
+      if (!enableEvents) setEvents({
+        enabled: true
+      });
+    };
+
+    cameraControls.addEventListener('control', callback);
+    cameraControls.addEventListener('controlstart', onStartCb);
+    cameraControls.addEventListener('controlend', onEndCb);
+    return () => {
+      cameraControls.removeEventListener('control', callback);
+      cameraControls.removeEventListener('controlstart', onStartCb);
+      cameraControls.removeEventListener('controlend', onEndCb);
+    };
+  }, [cameraControls, enableEvents, onStart, onEnd, invalidate, setEvents, regress, onChange]);
   return /*#__PURE__*/React.createElement("primitive", _extends({
     ref: ref,
     object: cameraControls

package/core/OrbitControls.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@babel/runtime/helpers/extends"),t=require("@react-three/fiber"),r=require("react"),n=require("three-stdlib");function s(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function o(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 a=s(e),u=o(r);const c=u.forwardRef((({makeDefault:e,camera:r,regress:s,domElement:o,enableDamping:c=!0,onChange:i,onStart:f,onEnd:d,...l},m)=>{const b=t.useThree((e=>e.invalidate)),v=t.useThree((e=>e.camera)),h=t.useThree((e=>e.gl)),p=t.useThree((e=>e.events)),E=t.useThree((e=>e.set)),g=t.useThree((e=>e.get)),O=t.useThree((e=>e.performance)),j=r||v,T=o||p.connected||h.domElement,L=u.useMemo((()=>new n.OrbitControls(j)),[j]);return t.useFrame((()=>{L.enabled&&L.update()}),-1),u.useEffect((()=>(L.connect(T),()=>{L.dispose()})),[T,s,L,b]),u.useEffect((()=>{const e=e=>{b(),s&&O.regress(),i&&i(e)};return L.addEventListener("change",e),f&&L.addEventListener("start",f),d&&L.addEventListener("end",d),()=>{f&&L.removeEventListener("start",f),d&&L.removeEventListener("end",d),L.removeEventListener("change",e)}}),[i,f,d,L,b]),u.useEffect((()=>{if(e){const e=g().controls;return E({controls:L}),()=>E({controls:e})}}),[e,L]),u.createElement("primitive",a.default({ref:m,object:L,enableDamping:c},l))}));exports.OrbitControls=c;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@babel/runtime/helpers/extends"),t=require("@react-three/fiber"),r=require("react"),n=require("three-stdlib");function s(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 o=s(e),u=a(r);const c=u.forwardRef((({makeDefault:e,events:r,camera:s,regress:a,domElement:c,enableDamping:i=!0,onChange:d,onStart:l,onEnd:f,...b},m)=>{const v=t.useThree((e=>e.invalidate)),h=t.useThree((e=>e.camera)),E=t.useThree((e=>e.gl)),p=t.useThree((e=>e.events)),g=t.useThree((e=>e.setEvents)),O=t.useThree((e=>e.set)),j=t.useThree((e=>e.get)),T=t.useThree((e=>e.performance)),L=s||h,y=c||p.connected||E.domElement,q=u.useMemo((()=>new n.OrbitControls(L)),[L]);return t.useFrame((()=>{q.enabled&&q.update()}),-1),u.useEffect((()=>(q.connect(y),()=>{q.dispose()})),[y,a,q,v]),u.useEffect((()=>{r&&g({enabled:!0});const e=e=>{v(),a&&T.regress(),d&&d(e)},t=e=>{l&&l(e),r||g({enabled:!1})},n=e=>{f&&f(e),r||g({enabled:!0})};return q.addEventListener("change",e),q.addEventListener("start",t),q.addEventListener("end",n),()=>{q.removeEventListener("start",t),q.removeEventListener("end",n),q.removeEventListener("change",e)}}),[d,l,f,q,v,r,g]),u.useEffect((()=>{if(e){const e=j().controls;return O({controls:q}),()=>O({controls:e})}}),[e,q]),u.createElement("primitive",o.default({ref:m,object:q,enableDamping:i},b))}));exports.OrbitControls=c;

package/core/OrbitControls.d.ts

@@ -17,5 +17,6 @@ export declare type OrbitControlsProps = Omit<ReactThreeFiber.Overwrite<ReactThr
     onStart?: (e?: Event) => void;
     regress?: boolean;
     target?: ReactThreeFiber.Vector3;
+    events?: boolean;
 }>, 'ref'>;
 export declare const OrbitControls: React.ForwardRefExoticComponent<OrbitControlsProps & React.RefAttributes<OrbitControlsImpl>>;

package/core/OrbitControls.js

@@ -5,6 +5,7 @@ import { OrbitControls as OrbitControls$1 } from 'three-stdlib';
 
 const OrbitControls = /*#__PURE__*/React.forwardRef(({
   makeDefault,
+  events: enableEvents,
   camera,
   regress,
   domElement,
@@ -18,6 +19,7 @@ const OrbitControls = /*#__PURE__*/React.forwardRef(({
   const defaultCamera = useThree(state => state.camera);
   const gl = useThree(state => state.gl);
   const events = useThree(state => state.events);
+  const setEvents = useThree(state => state.setEvents);
   const set = useThree(state => state.set);
   const get = useThree(state => state.get);
   const performance = useThree(state => state.performance);
@@ -32,21 +34,41 @@ const OrbitControls = /*#__PURE__*/React.forwardRef(({
     return () => void controls.dispose();
   }, [explDomElement, regress, controls, invalidate]);
   React.useEffect(() => {
+    if (enableEvents) {
+      setEvents({
+        enabled: true
+      });
+    }
+
     const callback = e => {
       invalidate();
       if (regress) performance.regress();
       if (onChange) onChange(e);
     };
 
+    const onStartCb = e => {
+      if (onStart) onStart(e);
+      if (!enableEvents) setEvents({
+        enabled: false
+      });
+    };
+
+    const onEndCb = e => {
+      if (onEnd) onEnd(e);
+      if (!enableEvents) setEvents({
+        enabled: true
+      });
+    };
+
     controls.addEventListener('change', callback);
-    if (onStart) controls.addEventListener('start', onStart);
-    if (onEnd) controls.addEventListener('end', onEnd);
+    controls.addEventListener('start', onStartCb);
+    controls.addEventListener('end', onEndCb);
     return () => {
-      if (onStart) controls.removeEventListener('start', onStart);
-      if (onEnd) controls.removeEventListener('end', onEnd);
+      controls.removeEventListener('start', onStartCb);
+      controls.removeEventListener('end', onEndCb);
       controls.removeEventListener('change', callback);
     };
-  }, [onChange, onStart, onEnd, controls, invalidate]);
+  }, [onChange, onStart, onEnd, controls, invalidate, enableEvents, setEvents]);
   React.useEffect(() => {
     if (makeDefault) {
       const old = get().controls;