@ohos-ports/react-three-drei 10.7.7-beta.0

package/core/BBAnchor.js

@@ -0,0 +1,37 @@
+import _extends from '@babel/runtime/helpers/esm/extends';
+import * as React from 'react';
+import * as THREE from 'three';
+import { useFrame } from '@react-three/fiber';
+
+const boundingBox = /* @__PURE__ */new THREE.Box3();
+const boundingBoxSize = /* @__PURE__ */new THREE.Vector3();
+const BBAnchor = ({
+  anchor,
+  ...props
+}) => {
+  const ref = React.useRef(null);
+  const parentRef = React.useRef(null);
+
+  // Reattach group created by this component to the parent's parent,
+  // so it becomes a sibling of its initial parent.
+  // We do that so the children have no impact on a bounding box of a parent.
+  React.useEffect(() => {
+    var _ref$current;
+    if ((_ref$current = ref.current) != null && (_ref$current = _ref$current.parent) != null && _ref$current.parent) {
+      parentRef.current = ref.current.parent;
+      ref.current.parent.parent.add(ref.current);
+    }
+  }, []);
+  useFrame(() => {
+    if (parentRef.current) {
+      boundingBox.setFromObject(parentRef.current);
+      boundingBox.getSize(boundingBoxSize);
+      ref.current.position.set(parentRef.current.position.x + boundingBoxSize.x * (Array.isArray(anchor) ? anchor[0] : anchor.x) / 2, parentRef.current.position.y + boundingBoxSize.y * (Array.isArray(anchor) ? anchor[1] : anchor.y) / 2, parentRef.current.position.z + boundingBoxSize.z * (Array.isArray(anchor) ? anchor[2] : anchor.z) / 2);
+    }
+  });
+  return /*#__PURE__*/React.createElement("group", _extends({
+    ref: ref
+  }, props));
+};
+
+export { BBAnchor };

package/core/Backdrop.cjs.js

@@ -0,0 +1 @@
+"use strict";function e(e){if(e&&e.__esModule)return e;var t=Object.create(null);return e&&Object.keys(e).forEach((function(r){if("default"!==r){var o=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(t,r,o.get?o:{enumerable:!0,get:function(){return e[r]}})}})),t.default=e,Object.freeze(t)}Object.defineProperty(exports,"__esModule",{value:!0});var t=e(require("react"));const r=e=>0===e?0:Math.pow(2,10*e-10);exports.Backdrop=function({children:e,floor:o=.25,segments:n=20,receiveShadow:c,...a}){const u=t.useRef(null);return t.useLayoutEffect((()=>{let e=0;const t=n/n/2,c=u.current.attributes.position;for(let a=0;a<n+1;a++)for(let u=0;u<n+1;u++)c.setXYZ(e++,a/n-t+(0===a?-o:0),u/n-t,r(a/n));c.needsUpdate=!0,u.current.computeVertexNormals()}),[n,o]),t.createElement("group",a,t.createElement("mesh",{receiveShadow:c,rotation:[-Math.PI/2,0,Math.PI/2]},t.createElement("planeGeometry",{ref:u,args:[1,1,n,n]}),e))};

package/core/Backdrop.d.ts

@@ -0,0 +1,15 @@
+import { ThreeElements } from '@react-three/fiber';
+import * as React from 'react';
+export type BackdropProps = ThreeElements['group'] & {
+    floor?: number;
+    segments?: number;
+    receiveShadow?: boolean;
+    children?: React.ReactNode;
+};
+export declare function Backdrop({ children, floor, segments, receiveShadow, ...props }: {
+    [x: string]: any;
+    children: any;
+    floor?: number | undefined;
+    segments?: number | undefined;
+    receiveShadow: any;
+}): React.JSX.Element;

package/core/Backdrop.js

@@ -0,0 +1,33 @@
+import * as React from 'react';
+
+const easeInExpo = x => x === 0 ? 0 : Math.pow(2, 10 * x - 10);
+function Backdrop({
+  children,
+  floor = 0.25,
+  segments = 20,
+  receiveShadow,
+  ...props
+}) {
+  const ref = React.useRef(null);
+  React.useLayoutEffect(() => {
+    let i = 0;
+    const offset = segments / segments / 2;
+    const position = ref.current.attributes.position;
+    for (let x = 0; x < segments + 1; x++) {
+      for (let y = 0; y < segments + 1; y++) {
+        position.setXYZ(i++, x / segments - offset + (x === 0 ? -floor : 0), y / segments - offset, easeInExpo(x / segments));
+      }
+    }
+    position.needsUpdate = true;
+    ref.current.computeVertexNormals();
+  }, [segments, floor]);
+  return /*#__PURE__*/React.createElement("group", props, /*#__PURE__*/React.createElement("mesh", {
+    receiveShadow: receiveShadow,
+    rotation: [-Math.PI / 2, 0, Math.PI / 2]
+  }, /*#__PURE__*/React.createElement("planeGeometry", {
+    ref: ref,
+    args: [1, 1, segments, segments]
+  }), children));
+}
+
+export { Backdrop };

package/core/BakeShadows.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),a=require("@react-three/fiber");exports.BakeShadows=function(){const t=a.useThree((e=>e.gl));return e.useEffect((()=>(t.shadowMap.autoUpdate=!1,t.shadowMap.needsUpdate=!0,()=>{t.shadowMap.autoUpdate=t.shadowMap.needsUpdate=!0})),[t.shadowMap]),null};

package/core/BakeShadows.d.ts

@@ -0,0 +1 @@
+export declare function BakeShadows(): null;

package/core/BakeShadows.js

@@ -0,0 +1,16 @@
+import { useEffect } from 'react';
+import { useThree } from '@react-three/fiber';
+
+function BakeShadows() {
+  const gl = useThree(state => state.gl);
+  useEffect(() => {
+    gl.shadowMap.autoUpdate = false;
+    gl.shadowMap.needsUpdate = true;
+    return () => {
+      gl.shadowMap.autoUpdate = gl.shadowMap.needsUpdate = true;
+    };
+  }, [gl.shadowMap]);
+  return null;
+}
+
+export { BakeShadows };

package/core/Billboard.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@babel/runtime/helpers/extends"),r=require("react"),t=require("three"),n=require("@react-three/fiber");function u(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function o(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 c=u(e),a=o(r);const i=a.forwardRef((function({children:e,follow:r=!0,lockX:u=!1,lockY:o=!1,lockZ:i=!1,...l},f){const d=a.useRef(null),s=a.useRef(null),p=new t.Quaternion;return n.useFrame((({camera:e})=>{if(!r||!s.current)return;const t=d.current.rotation.clone();s.current.updateMatrix(),s.current.updateWorldMatrix(!1,!1),s.current.getWorldQuaternion(p),e.getWorldQuaternion(d.current.quaternion).premultiply(p.invert()),u&&(d.current.rotation.x=t.x),o&&(d.current.rotation.y=t.y),i&&(d.current.rotation.z=t.z)})),a.useImperativeHandle(f,(()=>s.current),[]),a.createElement("group",c.default({ref:s},l),a.createElement("group",{ref:d},e))}));exports.Billboard=i;

package/core/Billboard.d.ts

@@ -0,0 +1,10 @@
+import { Group } from 'three';
+import { ThreeElements } from '@react-three/fiber';
+import { ForwardRefComponent } from '../helpers/ts-utils';
+export type BillboardProps = Omit<ThreeElements['group'], 'ref'> & {
+    follow?: boolean;
+    lockX?: boolean;
+    lockY?: boolean;
+    lockZ?: boolean;
+};
+export declare const Billboard: ForwardRefComponent<BillboardProps, Group>;

package/core/Billboard.js

@@ -0,0 +1,53 @@
+import _extends from '@babel/runtime/helpers/esm/extends';
+import * as React from 'react';
+import { Quaternion } from 'three';
+import { useFrame } from '@react-three/fiber';
+
+/**
+ * Wraps children in a billboarded group. Sample usage:
+ *
+ * ```js
+ * <Billboard>
+ *   <Text>hi</Text>
+ * </Billboard>
+ * ```
+ */
+const Billboard = /* @__PURE__ */React.forwardRef(function Billboard({
+  children,
+  follow = true,
+  lockX = false,
+  lockY = false,
+  lockZ = false,
+  ...props
+}, fref) {
+  const inner = React.useRef(null);
+  const localRef = React.useRef(null);
+  const q = new Quaternion();
+  useFrame(({
+    camera
+  }) => {
+    if (!follow || !localRef.current) return;
+
+    // save previous rotation in case we're locking an axis
+    const prevRotation = inner.current.rotation.clone();
+
+    // always face the camera
+    localRef.current.updateMatrix();
+    localRef.current.updateWorldMatrix(false, false);
+    localRef.current.getWorldQuaternion(q);
+    camera.getWorldQuaternion(inner.current.quaternion).premultiply(q.invert());
+
+    // readjust any axis that is locked
+    if (lockX) inner.current.rotation.x = prevRotation.x;
+    if (lockY) inner.current.rotation.y = prevRotation.y;
+    if (lockZ) inner.current.rotation.z = prevRotation.z;
+  });
+  React.useImperativeHandle(fref, () => localRef.current, []);
+  return /*#__PURE__*/React.createElement("group", _extends({
+    ref: localRef
+  }, props), /*#__PURE__*/React.createElement("group", {
+    ref: inner
+  }, children));
+});
+
+export { Billboard };

package/core/Bounds.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),t=require("three"),r=require("@react-three/fiber");function n(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=n(e),c=n(t),a=function(e){return e[e.NONE=0]="NONE",e[e.START=1]="START",e[e.ACTIVE=2]="ACTIVE",e}(a||{});const u=e=>e&&e.isOrthographicCamera,i=e=>1-Math.exp(-5*e)+.007*e,s=o.createContext(null);exports.Bounds=function({children:e,maxDuration:t=1,margin:n=1.2,observe:m,fit:p,clip:l,interpolateFunc:x=i,onFit:d}){const f=o.useRef(null),{camera:y,size:h,invalidate:g}=r.useThree(),v=r.useThree((e=>e.controls)),R=o.useRef(d);R.current=d;const M=o.useRef({camPos:new c.Vector3,camRot:new c.Quaternion,camZoom:1}),P=o.useRef({camPos:void 0,camRot:void 0,camZoom:void 0,camUp:void 0,target:void 0}),w=o.useRef(a.NONE),T=o.useRef(0),[V]=o.useState((()=>new c.Box3)),A=o.useMemo((()=>{function e(){const e=V.getSize(new c.Vector3),t=V.getCenter(new c.Vector3),r=Math.max(e.x,e.y,e.z),o=u(y)?4*r:r/(2*Math.atan(Math.PI*y.fov/360)),a=u(y)?4*r:o/y.aspect,i=n*Math.max(o,a);return{box:V,size:e,center:t,distance:i}}return{getSize:e,refresh(e){if((t=e)&&t.isBox3)V.copy(e);else{const t=e||f.current;if(!t)return this;t.updateWorldMatrix(!0,!0),V.setFromObject(t)}var t;if(V.isEmpty()){const e=y.position.length()||10;V.setFromCenterAndSize(new c.Vector3,new c.Vector3(e,e,e))}return M.current.camPos.copy(y.position),M.current.camRot.copy(y.quaternion),u(y)&&(M.current.camZoom=y.zoom),P.current.camPos=void 0,P.current.camRot=void 0,P.current.camZoom=void 0,P.current.camUp=void 0,P.current.target=void 0,this},reset(){const{center:t,distance:r}=e(),n=y.position.clone().sub(t).normalize();P.current.camPos=t.clone().addScaledVector(n,r),P.current.target=t.clone();const o=(new c.Matrix4).lookAt(P.current.camPos,P.current.target,y.up);return P.current.camRot=(new c.Quaternion).setFromRotationMatrix(o),w.current=a.START,T.current=0,this},moveTo(e){return P.current.camPos=Array.isArray(e)?new c.Vector3(...e):e.clone(),w.current=a.START,T.current=0,this},lookAt({target:e,up:t}){P.current.target=Array.isArray(e)?new c.Vector3(...e):e.clone(),P.current.camUp=t?Array.isArray(t)?new c.Vector3(...t):t.clone():y.up.clone();const r=(new c.Matrix4).lookAt(P.current.camPos||y.position,P.current.target,P.current.camUp);return P.current.camRot=(new c.Quaternion).setFromRotationMatrix(r),w.current=a.START,T.current=0,this},to({position:e,target:t}){return this.moveTo(e).lookAt({target:t})},fit(){if(!u(y))return this.reset();let e=0,t=0;const r=[new c.Vector3(V.min.x,V.min.y,V.min.z),new c.Vector3(V.min.x,V.max.y,V.min.z),new c.Vector3(V.min.x,V.min.y,V.max.z),new c.Vector3(V.min.x,V.max.y,V.max.z),new c.Vector3(V.max.x,V.max.y,V.max.z),new c.Vector3(V.max.x,V.max.y,V.min.z),new c.Vector3(V.max.x,V.min.y,V.max.z),new c.Vector3(V.max.x,V.min.y,V.min.z)],o=P.current.camPos||y.position,i=P.current.target||(null==v?void 0:v.target),s=P.current.camUp||y.up,m=i?(new c.Matrix4).lookAt(o,i,s).setPosition(o).invert():y.matrixWorldInverse;for(const n of r)n.applyMatrix4(m),e=Math.max(e,Math.abs(n.y)),t=Math.max(t,Math.abs(n.x));e*=2,t*=2;const p=(y.top-y.bottom)/e,l=(y.right-y.left)/t;return P.current.camZoom=Math.min(p,l)/n,w.current=a.START,T.current=0,R.current&&R.current(this.getSize()),this},clip(){const{distance:t}=e();return y.near=t/100,y.far=100*t,y.updateProjectionMatrix(),v&&(v.maxDistance=10*t,v.update()),g(),this}}}),[V,y,v,n,g]);o.useLayoutEffect((()=>{if(v){const e=()=>{if(v&&P.current.target&&w.current!==a.NONE){const e=(new c.Vector3).setFromMatrixColumn(y.matrix,2),t=M.current.camPos.distanceTo(v.target),r=(P.current.camPos||M.current.camPos).distanceTo(P.current.target),n=(1-T.current)*t+T.current*r;v.target.copy(y.position).addScaledVector(e,-n),v.update()}w.current=a.NONE};return v.addEventListener("start",e),()=>v.removeEventListener("start",e)}}),[v]);const z=o.useRef(0);return o.useLayoutEffect((()=>{(m||0==z.current++)&&(A.refresh(),p&&A.reset().fit(),l&&A.clip())}),[h,l,p,m,y,v]),r.useFrame(((e,r)=>{if(w.current===a.START)w.current=a.ACTIVE,g();else if(w.current===a.ACTIVE){if(T.current+=r/t,T.current>=1)P.current.camPos&&y.position.copy(P.current.camPos),P.current.camRot&&y.quaternion.copy(P.current.camRot),P.current.camUp&&y.up.copy(P.current.camUp),P.current.camZoom&&u(y)&&(y.zoom=P.current.camZoom),y.updateMatrixWorld(),y.updateProjectionMatrix(),v&&P.current.target&&(v.target.copy(P.current.target),v.update()),w.current=a.NONE;else{const e=x(T.current);P.current.camPos&&y.position.lerpVectors(M.current.camPos,P.current.camPos,e),P.current.camRot&&y.quaternion.slerpQuaternions(M.current.camRot,P.current.camRot,e),P.current.camUp&&y.up.set(0,1,0).applyQuaternion(y.quaternion),P.current.camZoom&&u(y)&&(y.zoom=(1-e)*M.current.camZoom+e*P.current.camZoom),y.updateMatrixWorld(),y.updateProjectionMatrix()}g()}})),o.createElement("group",{ref:f},o.createElement(s.Provider,{value:A},e))},exports.useBounds=function(){return o.useContext(s)};

package/core/Bounds.d.ts

@@ -0,0 +1,36 @@
+import * as React from 'react';
+import * as THREE from 'three';
+import { ThreeElements } from '@react-three/fiber';
+export type SizeProps = {
+    box: THREE.Box3;
+    size: THREE.Vector3;
+    center: THREE.Vector3;
+    distance: number;
+};
+export type BoundsApi = {
+    getSize: () => SizeProps;
+    refresh(object?: THREE.Object3D | THREE.Box3): BoundsApi;
+    reset(): BoundsApi;
+    moveTo(position: THREE.Vector3 | [number, number, number]): BoundsApi;
+    lookAt({ target, up, }: {
+        target?: THREE.Vector3 | [number, number, number];
+        up?: THREE.Vector3 | [number, number, number];
+    }): BoundsApi;
+    to({ position, target }: {
+        position: [number, number, number];
+        target: [number, number, number];
+    }): BoundsApi;
+    fit(): BoundsApi;
+    clip(): BoundsApi;
+};
+export type BoundsProps = Omit<ThreeElements['group'], 'ref'> & {
+    maxDuration?: number;
+    margin?: number;
+    observe?: boolean;
+    fit?: boolean;
+    clip?: boolean;
+    interpolateFunc?: (t: number) => number;
+    onFit?: (data: SizeProps) => void;
+};
+export declare function Bounds({ children, maxDuration, margin, observe, fit, clip, interpolateFunc, onFit, }: BoundsProps): React.JSX.Element;
+export declare function useBounds(): BoundsApi;

package/core/Bounds.js

@@ -0,0 +1,254 @@
+import * as React from 'react';
+import * as THREE from 'three';
+import { useThree, useFrame } from '@react-three/fiber';
+
+var AnimationState = /*#__PURE__*/function (AnimationState) {
+  AnimationState[AnimationState["NONE"] = 0] = "NONE";
+  AnimationState[AnimationState["START"] = 1] = "START";
+  AnimationState[AnimationState["ACTIVE"] = 2] = "ACTIVE";
+  return AnimationState;
+}(AnimationState || {});
+const isOrthographic = def => def && def.isOrthographicCamera;
+const isBox3 = def => def && def.isBox3;
+const interpolateFuncDefault = t => {
+  // Imitates the previously used THREE.MathUtils.damp
+  return 1 - Math.exp(-5 * t) + 0.007 * t;
+};
+const context = /*#__PURE__*/React.createContext(null);
+function Bounds({
+  children,
+  maxDuration = 1.0,
+  margin = 1.2,
+  observe,
+  fit,
+  clip,
+  interpolateFunc = interpolateFuncDefault,
+  onFit
+}) {
+  const ref = React.useRef(null);
+  const {
+    camera,
+    size,
+    invalidate
+  } = useThree();
+  const controls = useThree(state => state.controls);
+  const onFitRef = React.useRef(onFit);
+  onFitRef.current = onFit;
+  const origin = React.useRef({
+    camPos: new THREE.Vector3(),
+    camRot: new THREE.Quaternion(),
+    camZoom: 1
+  });
+  const goal = React.useRef({
+    camPos: undefined,
+    camRot: undefined,
+    camZoom: undefined,
+    camUp: undefined,
+    target: undefined
+  });
+  const animationState = React.useRef(AnimationState.NONE);
+  const t = React.useRef(0); // represent animation state from 0 to 1
+
+  const [box] = React.useState(() => new THREE.Box3());
+  const api = React.useMemo(() => {
+    function getSize() {
+      const boxSize = box.getSize(new THREE.Vector3());
+      const center = box.getCenter(new THREE.Vector3());
+      const maxSize = Math.max(boxSize.x, boxSize.y, boxSize.z);
+      const fitHeightDistance = isOrthographic(camera) ? maxSize * 4 : maxSize / (2 * Math.atan(Math.PI * camera.fov / 360));
+      const fitWidthDistance = isOrthographic(camera) ? maxSize * 4 : fitHeightDistance / camera.aspect;
+      const distance = margin * Math.max(fitHeightDistance, fitWidthDistance);
+      return {
+        box,
+        size: boxSize,
+        center,
+        distance
+      };
+    }
+    return {
+      getSize,
+      refresh(object) {
+        if (isBox3(object)) box.copy(object);else {
+          const target = object || ref.current;
+          if (!target) return this;
+          target.updateWorldMatrix(true, true);
+          box.setFromObject(target);
+        }
+        if (box.isEmpty()) {
+          const max = camera.position.length() || 10;
+          box.setFromCenterAndSize(new THREE.Vector3(), new THREE.Vector3(max, max, max));
+        }
+        origin.current.camPos.copy(camera.position);
+        origin.current.camRot.copy(camera.quaternion);
+        isOrthographic(camera) && (origin.current.camZoom = camera.zoom);
+        goal.current.camPos = undefined;
+        goal.current.camRot = undefined;
+        goal.current.camZoom = undefined;
+        goal.current.camUp = undefined;
+        goal.current.target = undefined;
+        return this;
+      },
+      reset() {
+        const {
+          center,
+          distance
+        } = getSize();
+        const direction = camera.position.clone().sub(center).normalize();
+        goal.current.camPos = center.clone().addScaledVector(direction, distance);
+        goal.current.target = center.clone();
+        const mCamRot = new THREE.Matrix4().lookAt(goal.current.camPos, goal.current.target, camera.up);
+        goal.current.camRot = new THREE.Quaternion().setFromRotationMatrix(mCamRot);
+        animationState.current = AnimationState.START;
+        t.current = 0;
+        return this;
+      },
+      moveTo(position) {
+        goal.current.camPos = Array.isArray(position) ? new THREE.Vector3(...position) : position.clone();
+        animationState.current = AnimationState.START;
+        t.current = 0;
+        return this;
+      },
+      lookAt({
+        target,
+        up
+      }) {
+        goal.current.target = Array.isArray(target) ? new THREE.Vector3(...target) : target.clone();
+        if (up) {
+          goal.current.camUp = Array.isArray(up) ? new THREE.Vector3(...up) : up.clone();
+        } else {
+          goal.current.camUp = camera.up.clone();
+        }
+        const mCamRot = new THREE.Matrix4().lookAt(goal.current.camPos || camera.position, goal.current.target, goal.current.camUp);
+        goal.current.camRot = new THREE.Quaternion().setFromRotationMatrix(mCamRot);
+        animationState.current = AnimationState.START;
+        t.current = 0;
+        return this;
+      },
+      /**
+       * @deprecated Use moveTo and lookAt instead
+       */
+      to({
+        position,
+        target
+      }) {
+        return this.moveTo(position).lookAt({
+          target
+        });
+      },
+      fit() {
+        if (!isOrthographic(camera)) {
+          // For non-orthographic cameras, fit should behave exactly like reset
+          return this.reset();
+        }
+
+        // For orthographic cameras, fit should only modify the zoom value
+        let maxHeight = 0,
+          maxWidth = 0;
+        const vertices = [new THREE.Vector3(box.min.x, box.min.y, box.min.z), new THREE.Vector3(box.min.x, box.max.y, box.min.z), new THREE.Vector3(box.min.x, box.min.y, box.max.z), new THREE.Vector3(box.min.x, box.max.y, box.max.z), new THREE.Vector3(box.max.x, box.max.y, box.max.z), new THREE.Vector3(box.max.x, box.max.y, box.min.z), new THREE.Vector3(box.max.x, box.min.y, box.max.z), new THREE.Vector3(box.max.x, box.min.y, box.min.z)];
+
+        // Transform the center and each corner to camera space
+        const pos = goal.current.camPos || camera.position;
+        const target = goal.current.target || (controls == null ? void 0 : controls.target);
+        const up = goal.current.camUp || camera.up;
+        const mCamWInv = target ? new THREE.Matrix4().lookAt(pos, target, up).setPosition(pos).invert() : camera.matrixWorldInverse;
+        for (const v of vertices) {
+          v.applyMatrix4(mCamWInv);
+          maxHeight = Math.max(maxHeight, Math.abs(v.y));
+          maxWidth = Math.max(maxWidth, Math.abs(v.x));
+        }
+        maxHeight *= 2;
+        maxWidth *= 2;
+        const zoomForHeight = (camera.top - camera.bottom) / maxHeight;
+        const zoomForWidth = (camera.right - camera.left) / maxWidth;
+        goal.current.camZoom = Math.min(zoomForHeight, zoomForWidth) / margin;
+        animationState.current = AnimationState.START;
+        t.current = 0;
+        onFitRef.current && onFitRef.current(this.getSize());
+        return this;
+      },
+      clip() {
+        const {
+          distance
+        } = getSize();
+        camera.near = distance / 100;
+        camera.far = distance * 100;
+        camera.updateProjectionMatrix();
+        if (controls) {
+          controls.maxDistance = distance * 10;
+          controls.update();
+        }
+        invalidate();
+        return this;
+      }
+    };
+  }, [box, camera, controls, margin, invalidate]);
+  React.useLayoutEffect(() => {
+    if (controls) {
+      // Try to prevent drag hijacking
+      const callback = () => {
+        if (controls && goal.current.target && animationState.current !== AnimationState.NONE) {
+          const front = new THREE.Vector3().setFromMatrixColumn(camera.matrix, 2);
+          const d0 = origin.current.camPos.distanceTo(controls.target);
+          const d1 = (goal.current.camPos || origin.current.camPos).distanceTo(goal.current.target);
+          const d = (1 - t.current) * d0 + t.current * d1;
+          controls.target.copy(camera.position).addScaledVector(front, -d);
+          controls.update();
+        }
+        animationState.current = AnimationState.NONE;
+      };
+      controls.addEventListener('start', callback);
+      return () => controls.removeEventListener('start', callback);
+    }
+  }, [controls]);
+
+  // Scale pointer on window resize
+  const count = React.useRef(0);
+  React.useLayoutEffect(() => {
+    if (observe || count.current++ === 0) {
+      api.refresh();
+      if (fit) api.reset().fit();
+      if (clip) api.clip();
+    }
+  }, [size, clip, fit, observe, camera, controls]);
+  useFrame((state, delta) => {
+    // This [additional animation step START] is needed to guarantee that delta used in animation isn't absurdly high (2-3 seconds) which is actually possible if rendering happens on demand...
+    if (animationState.current === AnimationState.START) {
+      animationState.current = AnimationState.ACTIVE;
+      invalidate();
+    } else if (animationState.current === AnimationState.ACTIVE) {
+      t.current += delta / maxDuration;
+      if (t.current >= 1) {
+        goal.current.camPos && camera.position.copy(goal.current.camPos);
+        goal.current.camRot && camera.quaternion.copy(goal.current.camRot);
+        goal.current.camUp && camera.up.copy(goal.current.camUp);
+        goal.current.camZoom && isOrthographic(camera) && (camera.zoom = goal.current.camZoom);
+        camera.updateMatrixWorld();
+        camera.updateProjectionMatrix();
+        if (controls && goal.current.target) {
+          controls.target.copy(goal.current.target);
+          controls.update();
+        }
+        animationState.current = AnimationState.NONE;
+      } else {
+        const k = interpolateFunc(t.current);
+        goal.current.camPos && camera.position.lerpVectors(origin.current.camPos, goal.current.camPos, k);
+        goal.current.camRot && camera.quaternion.slerpQuaternions(origin.current.camRot, goal.current.camRot, k);
+        goal.current.camUp && camera.up.set(0, 1, 0).applyQuaternion(camera.quaternion);
+        goal.current.camZoom && isOrthographic(camera) && (camera.zoom = (1 - k) * origin.current.camZoom + k * goal.current.camZoom);
+        camera.updateMatrixWorld();
+        camera.updateProjectionMatrix();
+      }
+      invalidate();
+    }
+  });
+  return /*#__PURE__*/React.createElement("group", {
+    ref: ref
+  }, /*#__PURE__*/React.createElement(context.Provider, {
+    value: api
+  }, children));
+}
+function useBounds() {
+  return React.useContext(context);
+}
+
+export { Bounds, useBounds };

package/core/Bvh.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@babel/runtime/helpers/extends"),r=require("@react-three/fiber"),t=require("react"),s=require("three"),o=require("three-mesh-bvh");function n(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function u(e){if(e&&e.__esModule)return e;var r=Object.create(null);return e&&Object.keys(e).forEach((function(t){if("default"!==t){var s=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(r,t,s.get?s:{enumerable:!0,get:function(){return e[t]}})}})),r.default=e,Object.freeze(r)}var a=n(e),c=u(t);const i=e=>e.isMesh;const d=c.forwardRef((({enabled:e=!0,firstHitOnly:t=!1,children:n,strategy:u=o.SAH,verbose:d=!1,setBoundingBox:f=!0,maxDepth:p=40,maxLeafTris:y=10,indirect:l=!1,...m},B)=>{const b=c.useRef(null),T=r.useThree((e=>e.raycaster));return c.useImperativeHandle(B,(()=>b.current),[]),c.useEffect((()=>{if(e){const e={strategy:u,verbose:d,setBoundingBox:f,maxDepth:p,maxLeafTris:y,indirect:l},r=b.current;return T.firstHitOnly=t,r.traverse((r=>{i(r)&&!r.geometry.boundsTree&&r.raycast===s.Mesh.prototype.raycast&&(r.raycast=o.acceleratedRaycast,r.geometry.computeBoundsTree=o.computeBoundsTree,r.geometry.disposeBoundsTree=o.disposeBoundsTree,r.geometry.computeBoundsTree(e))})),()=>{delete T.firstHitOnly,r.traverse((e=>{i(e)&&e.geometry.boundsTree&&(e.geometry.disposeBoundsTree(),e.raycast=s.Mesh.prototype.raycast)}))}}}),[]),c.createElement("group",a.default({ref:b},m),n)}));exports.Bvh=d,exports.useBVH=function(e,r){r={strategy:o.SAH,verbose:!1,setBoundingBox:!0,maxDepth:40,maxLeafTris:10,indirect:!1,...r},c.useEffect((()=>{if(e.current){e.current.raycast=o.acceleratedRaycast;const t=e.current.geometry;return t.computeBoundsTree=o.computeBoundsTree,t.disposeBoundsTree=o.disposeBoundsTree,t.computeBoundsTree(r),()=>{t.boundsTree&&t.disposeBoundsTree()}}}),[e,JSON.stringify(r)])};

package/core/Bvh.d.ts

@@ -0,0 +1,19 @@
+import { ThreeElements } from '@react-three/fiber';
+import * as React from 'react';
+import { Mesh, Group } from 'three';
+import { SplitStrategy } from 'three-mesh-bvh';
+import { ForwardRefComponent } from '../helpers/ts-utils';
+export interface BVHOptions {
+    strategy?: SplitStrategy;
+    verbose?: boolean;
+    setBoundingBox?: boolean;
+    maxDepth?: number;
+    maxLeafTris?: number;
+    indirect?: boolean;
+}
+export type BvhProps = BVHOptions & ThreeElements['group'] & {
+    enabled?: boolean;
+    firstHitOnly?: boolean;
+};
+export declare function useBVH(mesh: React.RefObject<Mesh | undefined>, options?: BVHOptions): void;
+export declare const Bvh: ForwardRefComponent<BvhProps, Group>;

package/core/Bvh.js

@@ -0,0 +1,92 @@
+import _extends from '@babel/runtime/helpers/esm/extends';
+import { useThree } from '@react-three/fiber';
+import * as React from 'react';
+import { Mesh } from 'three';
+import { SAH, acceleratedRaycast, computeBoundsTree, disposeBoundsTree } from 'three-mesh-bvh';
+
+const isMesh = child => child.isMesh;
+
+/**
+ * @deprecated Use the Bvh component instead
+ */
+function useBVH(mesh, options) {
+  options = {
+    strategy: SAH,
+    verbose: false,
+    setBoundingBox: true,
+    maxDepth: 40,
+    maxLeafTris: 10,
+    indirect: false,
+    ...options
+  };
+  React.useEffect(() => {
+    if (mesh.current) {
+      mesh.current.raycast = acceleratedRaycast;
+      const geometry = mesh.current.geometry;
+      geometry.computeBoundsTree = computeBoundsTree;
+      geometry.disposeBoundsTree = disposeBoundsTree;
+      geometry.computeBoundsTree(options);
+      return () => {
+        if (geometry.boundsTree) {
+          geometry.disposeBoundsTree();
+        }
+      };
+    }
+  }, [mesh, JSON.stringify(options)]);
+}
+const Bvh = /* @__PURE__ */React.forwardRef(({
+  enabled = true,
+  firstHitOnly = false,
+  children,
+  strategy = SAH,
+  verbose = false,
+  setBoundingBox = true,
+  maxDepth = 40,
+  maxLeafTris = 10,
+  indirect = false,
+  ...props
+}, fref) => {
+  const ref = React.useRef(null);
+  const raycaster = useThree(state => state.raycaster);
+  React.useImperativeHandle(fref, () => ref.current, []);
+  React.useEffect(() => {
+    if (enabled) {
+      const options = {
+        strategy,
+        verbose,
+        setBoundingBox,
+        maxDepth,
+        maxLeafTris,
+        indirect
+      };
+      const group = ref.current;
+      // This can only safely work if the component is used once, but there is no alternative.
+      // Hijacking the raycast method to do it for individual meshes is not an option as it would
+      // cost too much memory ...
+      raycaster.firstHitOnly = firstHitOnly;
+      group.traverse(child => {
+        // Only include meshes that do not yet have a boundsTree and whose raycast is standard issue
+        if (isMesh(child) && !child.geometry.boundsTree && child.raycast === Mesh.prototype.raycast) {
+          child.raycast = acceleratedRaycast;
+          child.geometry.computeBoundsTree = computeBoundsTree;
+          child.geometry.disposeBoundsTree = disposeBoundsTree;
+          child.geometry.computeBoundsTree(options);
+        }
+      });
+      return () => {
+        delete raycaster.firstHitOnly;
+        group.traverse(child => {
+          if (isMesh(child) && child.geometry.boundsTree) {
+            child.geometry.disposeBoundsTree();
+            child.raycast = Mesh.prototype.raycast;
+          }
+        });
+      };
+    }
+  }, []);
+  return /*#__PURE__*/React.createElement("group", _extends({
+    ref: ref
+  }, props), children);
+});
+
+export { Bvh, useBVH };

package/core/CameraControls.cjs.js

@@ -0,0 +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 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

@@ -0,0 +1,48 @@
+import { EventDispatcher, OrthographicCamera, PerspectiveCamera } from 'three';
+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;
+    onControlStart?: (e?: {
+        type: 'controlstart';
+    }) => void;
+    onControl?: (e?: {
+        type: 'control';
+    }) => void;
+    onControlEnd?: (e?: {
+        type: 'controlend';
+    }) => void;
+    onTransitionStart?: (e?: {
+        type: 'transitionstart';
+    }) => void;
+    onUpdate?: (e?: {
+        type: 'update';
+    }) => void;
+    onWake?: (e?: {
+        type: 'wake';
+    }) => void;
+    onRest?: (e?: {
+        type: 'rest';
+    }) => void;
+    onSleep?: (e?: {
+        type: 'sleep';
+    }) => void;
+    onStart?: (e?: {
+        type: 'controlstart';
+    }) => void;
+    onEnd?: (e?: {
+        type: 'controlend';
+    }) => void;
+    onChange?: (e?: {
+        type: string;
+    }) => void;
+    events?: boolean;
+    regress?: boolean;
+}>, 'ref' | 'args' | keyof EventDispatcher>;
+export declare const CameraControls: ForwardRefComponent<CameraControlsProps, CameraControlsImpl>;
+export type CameraControls = CameraControlsImpl;
+export { CameraControlsImpl };