@react-three/drei 9.83.8 → 9.84.0

package/core/Lightformer.js

@@ -25,12 +25,14 @@ const Lightformer = /*#__PURE__*/React.forwardRef(({
       });
       ref.current.material.color.multiplyScalar(intensity);
     }
-  }, [color, intensity, children, props.material]); // Target light
+  }, [color, intensity, children, props.material]);
 
+  // Target light
   React.useLayoutEffect(() => {
     if (target) ref.current.lookAt(Array.isArray(target) ? new THREE.Vector3(...target) : target);
-  }, [target]); // Fix 2-dimensional scale
+  }, [target]);
 
+  // Fix 2-dimensional scale
   scale = Array.isArray(scale) && scale.length === 2 ? [scale[0], scale[1], 1] : scale;
   return /*#__PURE__*/React.createElement("mesh", _extends({
     ref: mergeRefs([ref, forwardRef]),

package/core/Line.d.ts

@@ -2,7 +2,7 @@ import { Vector2, Vector3, Color, ColorRepresentation } from 'three';
 import { ReactThreeFiber } from '@react-three/fiber';
 import { LineMaterial, LineMaterialParameters, Line2, LineSegments2 } from 'three-stdlib';
 import { ForwardRefComponent } from '../helpers/ts-utils';
-export declare type LineProps = {
+export type LineProps = {
     points: Array<Vector3 | Vector2 | [number, number, number] | [number, number] | number>;
     vertexColors?: Array<Color | [number, number, number]>;
     lineWidth?: number;

package/core/Line.js

@@ -24,12 +24,10 @@ const Line = /*#__PURE__*/React.forwardRef(function Line({
       return p instanceof Vector3 ? [p.x, p.y, p.z] : p instanceof Vector2 ? [p.x, p.y, 0] : isArray && p.length === 3 ? [p[0], p[1], p[2]] : isArray && p.length === 2 ? [p[0], p[1], 0] : p;
     });
     geom.setPositions(pValues.flat());
-
     if (vertexColors) {
       const cValues = vertexColors.map(c => c instanceof Color ? c.toArray() : c);
       geom.setColors(cValues.flat());
     }
-
     return geom;
   }, [points, segments, vertexColors]);
   React.useLayoutEffect(() => {
@@ -42,7 +40,6 @@ const Line = /*#__PURE__*/React.forwardRef(function Line({
       // Setting lineMaterial.defines.USE_DASH to undefined is apparently not sufficient.
       delete lineMaterial.defines.USE_DASH;
     }
-
     lineMaterial.needsUpdate = true;
   }, [dashed, lineMaterial]);
   React.useEffect(() => {

package/core/MapControls.d.ts

@@ -2,7 +2,7 @@ import { ReactThreeFiber } from '@react-three/fiber';
 import * as THREE from 'three';
 import { MapControls as MapControlsImpl } from 'three-stdlib';
 import { ForwardRefComponent } from '../helpers/ts-utils';
-export declare type MapControlsProps = ReactThreeFiber.Overwrite<ReactThreeFiber.Object3DNode<MapControlsImpl, typeof MapControlsImpl>, {
+export type MapControlsProps = ReactThreeFiber.Overwrite<ReactThreeFiber.Object3DNode<MapControlsImpl, typeof MapControlsImpl>, {
     target?: ReactThreeFiber.Vector3;
     camera?: THREE.Camera;
     makeDefault?: boolean;

package/core/MapControls.js

@@ -26,12 +26,10 @@ const MapControls = /*#__PURE__*/React.forwardRef((props = {
   const controls = React.useMemo(() => new MapControls$1(explCamera), [explCamera]);
   React.useEffect(() => {
     controls.connect(explDomElement);
-
     const callback = e => {
       invalidate();
       if (onChange) onChange(e);
     };
-
     controls.addEventListener('change', callback);
     if (onStart) controls.addEventListener('start', onStart);
     if (onEnd) controls.addEventListener('end', onEnd);

package/core/MarchingCubes.d.ts

@@ -2,20 +2,20 @@ import * as THREE from 'three';
 import { Color } from 'three';
 import { MarchingCubes as MarchingCubesImpl } from 'three-stdlib';
 import { ForwardRefComponent } from '../helpers/ts-utils';
-export declare type MarchingCubesProps = {
+export type MarchingCubesProps = {
     resolution?: number;
     maxPolyCount?: number;
     enableUvs?: boolean;
     enableColors?: boolean;
 } & JSX.IntrinsicElements['group'];
 export declare const MarchingCubes: ForwardRefComponent<MarchingCubesProps, MarchingCubesImpl>;
-declare type MarchingCubeProps = {
+type MarchingCubeProps = {
     strength?: number;
     subtract?: number;
     color?: Color;
 } & JSX.IntrinsicElements['group'];
 export declare const MarchingCube: ForwardRefComponent<MarchingCubeProps, THREE.Group>;
-declare type MarchingPlaneProps = {
+type MarchingPlaneProps = {
     planeType?: 'x' | 'y' | 'z';
     strength?: number;
     subtract?: number;

package/core/Mask.d.ts

@@ -1,6 +1,6 @@
 import * as THREE from 'three';
 import { ForwardRefComponent } from '../helpers/ts-utils';
-declare type Props = Omit<JSX.IntrinsicElements['mesh'], 'id'> & {
+type Props = Omit<JSX.IntrinsicElements['mesh'], 'id'> & {
     id: number;
     colorWrite?: boolean;
     depthWrite?: boolean;

package/core/MeshDistortMaterial.d.ts

@@ -1,11 +1,11 @@
 import { MeshPhysicalMaterial, MeshPhysicalMaterialParameters, Shader } from 'three';
 import { ForwardRefComponent } from '../helpers/ts-utils';
-declare type DistortMaterialType = JSX.IntrinsicElements['meshPhysicalMaterial'] & {
+type DistortMaterialType = JSX.IntrinsicElements['meshPhysicalMaterial'] & {
     time?: number;
     distort?: number;
     radius?: number;
 };
-declare type Props = DistortMaterialType & {
+type Props = DistortMaterialType & {
     speed?: number;
     factor?: number;
 };

package/core/MeshDistortMaterial.js

@@ -18,7 +18,6 @@ class DistortMaterialImpl extends MeshPhysicalMaterial {
       value: 1
     };
   }
-
   onBeforeCompile(shader) {
     shader.uniforms.time = this._time;
     shader.uniforms.radius = this._radius;
@@ -36,33 +35,25 @@ class DistortMaterialImpl extends MeshPhysicalMaterial {
         vec3 transformed = vec3(position * (noise * pow(distort, 2.0) + radius));
         `);
   }
-
   get time() {
     return this._time.value;
   }
-
   set time(v) {
     this._time.value = v;
   }
-
   get distort() {
     return this._distort.value;
   }
-
   set distort(v) {
     this._distort.value = v;
   }
-
   get radius() {
     return this._radius.value;
   }
-
   set radius(v) {
     this._radius.value = v;
   }
-
 }
-
 const MeshDistortMaterial = /*#__PURE__*/React.forwardRef(({
   speed = 1,
   ...props

package/core/MeshPortalMaterial.d.ts

@@ -1,7 +1,7 @@
 import * as THREE from 'three';
 import * as React from 'react';
 import { ReactThreeFiber } from '@react-three/fiber';
-export declare type PortalMaterialType = {
+export type PortalMaterialType = {
     resolution: ReactThreeFiber.Vector2;
     blur: number;
     blend: number;
@@ -16,7 +16,7 @@ declare global {
         }
     }
 }
-export declare type PortalProps = JSX.IntrinsicElements['shaderMaterial'] & {
+export type PortalProps = JSX.IntrinsicElements['shaderMaterial'] & {
     blend?: number;
     blur?: number;
     resolution?: number;
@@ -25,7 +25,7 @@ export declare type PortalProps = JSX.IntrinsicElements['shaderMaterial'] & {
     renderPriority?: number;
     events?: boolean;
 };
-export declare const MeshPortalMaterial: React.ForwardRefExoticComponent<Pick<ReactThreeFiber.ExtendedColors<ReactThreeFiber.Overwrite<Partial<THREE.ShaderMaterial>, ReactThreeFiber.NodeProps<THREE.ShaderMaterial, [THREE.ShaderMaterialParameters]>>> & {
+export declare const MeshPortalMaterial: React.ForwardRefExoticComponent<Omit<ReactThreeFiber.ExtendedColors<ReactThreeFiber.Overwrite<Partial<THREE.ShaderMaterial>, ReactThreeFiber.NodeProps<THREE.ShaderMaterial, [THREE.ShaderMaterialParameters]>>> & {
     blend?: number | undefined;
     blur?: number | undefined;
     resolution?: number | undefined;
@@ -33,4 +33,4 @@ export declare const MeshPortalMaterial: React.ForwardRefExoticComponent<Pick<Re
     eventPriority?: number | undefined;
     renderPriority?: number | undefined;
     events?: boolean | undefined;
-}, "attach" | "args" | "children" | "key" | "onUpdate" | "events" | keyof THREE.ShaderMaterial | "blur" | "resolution" | "worldUnits" | "renderPriority" | "blend" | "eventPriority"> & React.RefAttributes<PortalMaterialType>>;
+}, "ref"> & React.RefAttributes<PortalMaterialType>>;

package/core/MeshPortalMaterial.js

@@ -70,19 +70,19 @@ const MeshPortalMaterial = /*#__PURE__*/React.forwardRef(({
       enabled: !events
     });
   }, [events]);
-  const [visible, setVisible] = React.useState(true); // See if the parent mesh is in the camera frustum
-
+  const [visible, setVisible] = React.useState(true);
+  // See if the parent mesh is in the camera frustum
   const parent = useIntersect(setVisible);
   React.useLayoutEffect(() => {
     var _ref$current;
-
     // Since the ref above is not tied to a mesh directly (we're inside a material),
     // it has to be tied to the parent mesh here
     parent.current = (_ref$current = ref.current) == null ? void 0 : _ref$current.__r3f.parent;
   }, []);
   React.useLayoutEffect(() => {
-    if (!parent.current) return; // Apply the SDF mask only once
+    if (!parent.current) return;
 
+    // Apply the SDF mask only once
     if (blur && ref.current.sdf === null) {
       const tempMesh = new THREE.Mesh(parent.current.geometry, new THREE.MeshBasicMaterial());
       const boundingBox = new THREE.Box3().setFromBufferAttribute(tempMesh.geometry.attributes.position);
@@ -94,14 +94,12 @@ const MeshPortalMaterial = /*#__PURE__*/React.forwardRef(({
       const sg = makeSDFGenerator(resolution, resolution, gl);
       const sdf = sg(maskRenderTarget.texture);
       const readSdf = new Float32Array(resolution * resolution);
-      gl.readRenderTargetPixels(sdf, 0, 0, resolution, resolution, readSdf); // Get smallest value in sdf
-
+      gl.readRenderTargetPixels(sdf, 0, 0, resolution, resolution, readSdf);
+      // Get smallest value in sdf
       let min = Infinity;
-
       for (let i = 0; i < readSdf.length; i++) {
         if (readSdf[i] < min) min = readSdf[i];
       }
-
       min = -min;
       ref.current.size = min;
       ref.current.sdf = sdf.texture;
@@ -111,15 +109,12 @@ const MeshPortalMaterial = /*#__PURE__*/React.forwardRef(({
   React.useImperativeHandle(fref, () => ref.current);
   const compute = React.useCallback((event, state, previous) => {
     var _ref$current2;
-
     if (!parent.current) return false;
     state.pointer.set(event.offsetX / state.size.width * 2 - 1, -(event.offsetY / state.size.height) * 2 + 1);
     state.raycaster.setFromCamera(state.pointer, state.camera);
-
     if (((_ref$current2 = ref.current) == null ? void 0 : _ref$current2.blend) === 0) {
       // We run a quick check against the parent, if it isn't hit there's no need to raycast at all
       const [intersection] = state.raycaster.intersectObject(parent.current);
-
       if (!intersection) {
         // Cancel out the raycast camera if the parent mesh isn't hit
         state.raycaster.camera = undefined;
@@ -148,7 +143,6 @@ const MeshPortalMaterial = /*#__PURE__*/React.forwardRef(({
     worldUnits: worldUnits
   })));
 });
-
 function ManagePortalScene({
   events = undefined,
   rootScene,
@@ -183,17 +177,13 @@ function ManagePortalScene({
         },
         blend
       },
-      vertexShader:
-      /*glsl*/
-      `
+      vertexShader: /*glsl*/`
           varying vec2 vUv;
           void main() {
             vUv = uv;
             gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );
           }`,
-      fragmentShader:
-      /*glsl*/
-      `
+      fragmentShader: /*glsl*/`
           uniform sampler2D a;
           uniform sampler2D b;
           uniform float blend;
@@ -210,24 +200,20 @@ function ManagePortalScene({
   }, []);
   useFrame(state => {
     var _material$current;
-
-    let parent = material == null ? void 0 : (_material$current = material.current) == null ? void 0 : _material$current.__r3f.parent;
-
+    let parent = material == null || (_material$current = material.current) == null ? void 0 : _material$current.__r3f.parent;
     if (parent) {
       // Move portal contents along with the parent if worldUnits is true
       if (!worldUnits) {
         var _material$current2;
-
         // If the portal renders exclusively the original scene needs to be updated
         if (priority && ((_material$current2 = material.current) == null ? void 0 : _material$current2.blend) === 1) parent.updateWorldMatrix(true, false);
         scene.matrixWorld.copy(parent.matrixWorld);
-      } else scene.matrixWorld.identity(); // This bit is only necessary if the portal is blended, now it has a render-priority
-      // and will take over the render loop
-
+      } else scene.matrixWorld.identity();
 
+      // This bit is only necessary if the portal is blended, now it has a render-priority
+      // and will take over the render loop
       if (priority) {
         var _material$current3, _material$current4, _material$current5;
-
         if (((_material$current3 = material.current) == null ? void 0 : _material$current3.blend) > 0 && ((_material$current4 = material.current) == null ? void 0 : _material$current4.blend) < 1) {
           // If blend is ongoing (> 0 and < 1) then we need to render both the root scene
           // and the portal scene, both will then be mixed in the quad from above
@@ -247,7 +233,6 @@ function ManagePortalScene({
   }, priority);
   return /*#__PURE__*/React.createElement(React.Fragment, null);
 }
-
 const makeSDFGenerator = (clientWidth, clientHeight, renderer) => {
   let finalTarget = new THREE.WebGLRenderTarget(clientWidth, clientHeight, {
     minFilter: THREE.LinearMipmapLinearFilter,
@@ -290,17 +275,13 @@ const makeSDFGenerator = (clientWidth, clientHeight, renderer) => {
         value: null
       }
     },
-    vertexShader:
-    /*glsl*/
-    `
+    vertexShader: /*glsl*/`
         varying vec2 vUv;
         void main() {
           vUv = uv;
           gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );
         }`,
-    fragmentShader:
-    /*glsl*/
-    `
+    fragmentShader: /*glsl*/`
         uniform sampler2D tex;
         varying vec2 vUv;
         #include <packing>
@@ -314,17 +295,13 @@ const makeSDFGenerator = (clientWidth, clientHeight, renderer) => {
         value: null
       }
     },
-    vertexShader:
-    /*glsl*/
-    `
+    vertexShader: /*glsl*/`
         varying vec2 vUv;
         void main() {
           vUv = uv;
           gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );
         }`,
-    fragmentShader:
-    /*glsl*/
-    `
+    fragmentShader: /*glsl*/`
         uniform sampler2D tex;
         varying vec2 vUv;
         #include <packing>
@@ -347,17 +324,13 @@ const makeSDFGenerator = (clientWidth, clientHeight, renderer) => {
         value: 0.0
       }
     },
-    vertexShader:
-    /*glsl*/
-    `
+    vertexShader: /*glsl*/`
         varying vec2 vUv;
         void main() {
           vUv = uv;
           gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );
         }`,
-    fragmentShader:
-    /*glsl*/
-    `
+    fragmentShader: /*glsl*/`
         varying vec2 vUv;
         uniform sampler2D tex;
         uniform float offset;
@@ -391,17 +364,13 @@ const makeSDFGenerator = (clientWidth, clientHeight, renderer) => {
         value: new THREE.Vector2(clientWidth, clientHeight)
       }
     },
-    vertexShader:
-    /*glsl*/
-    `
+    vertexShader: /*glsl*/`
         varying vec2 vUv;
         void main() {
           vUv = uv;
           gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );
         }`,
-    fragmentShader:
-    /*glsl*/
-    `
+    fragmentShader: /*glsl*/`
         varying vec2 vUv;
         uniform sampler2D tex;
         uniform vec2 size;
@@ -422,17 +391,13 @@ const makeSDFGenerator = (clientWidth, clientHeight, renderer) => {
         value: null
       }
     },
-    vertexShader:
-    /*glsl*/
-    `
+    vertexShader: /*glsl*/`
         varying vec2 vUv;
         void main() {
           vUv = uv;
           gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );
         }`,
-    fragmentShader:
-    /*glsl*/
-    `
+    fragmentShader: /*glsl*/`
         varying vec2 vUv;
         uniform sampler2D inside;
         uniform sampler2D outside;
@@ -458,7 +423,6 @@ const makeSDFGenerator = (clientWidth, clientHeight, renderer) => {
     const passes = Math.ceil(Math.log(Math.max(clientWidth, clientHeight)) / Math.log(2.0));
     let lastTarget = outsideRenderTarget;
     let target = null;
-
     for (let i = 0; i < passes; i++) {
       const offset = Math.pow(2, passes - i - 1);
       target = lastTarget === outsideRenderTarget ? outsideRenderTarget2 : outsideRenderTarget;
@@ -470,7 +434,6 @@ const makeSDFGenerator = (clientWidth, clientHeight, renderer) => {
       jumpFloodRender.render(renderer);
       lastTarget = target;
     }
-
     renderer.setRenderTarget(outsideRenderTargetFinal);
     distanceFieldRender.material.uniforms.tex.value = target.texture;
     distanceFieldRender.render(renderer);
@@ -478,7 +441,6 @@ const makeSDFGenerator = (clientWidth, clientHeight, renderer) => {
     renderer.setRenderTarget(insideRenderTarget);
     uvRenderInside.render(renderer);
     lastTarget = insideRenderTarget;
-
     for (let i = 0; i < passes; i++) {
       const offset = Math.pow(2, passes - i - 1);
       target = lastTarget === insideRenderTarget ? insideRenderTarget2 : insideRenderTarget;
@@ -490,7 +452,6 @@ const makeSDFGenerator = (clientWidth, clientHeight, renderer) => {
       jumpFloodRender.render(renderer);
       lastTarget = target;
     }
-
     renderer.setRenderTarget(insideRenderTargetFinal);
     distanceFieldRender.material.uniforms.tex.value = target.texture;
     distanceFieldRender.render(renderer);

package/core/MeshReflectorMaterial.d.ts

@@ -1,7 +1,7 @@
 import { Texture } from 'three';
 import { MeshReflectorMaterialProps, MeshReflectorMaterial as MeshReflectorMaterialImpl } from '../materials/MeshReflectorMaterial';
 import { ForwardRefComponent } from '../helpers/ts-utils';
-declare type Props = JSX.IntrinsicElements['meshStandardMaterial'] & {
+type Props = JSX.IntrinsicElements['meshStandardMaterial'] & {
     resolution?: number;
     mixBlur?: number;
     mixStrength?: number;

package/core/MeshReflectorMaterial.js

@@ -51,7 +51,6 @@ const MeshReflectorMaterial = /*#__PURE__*/React.forwardRef(({
   const [virtualCamera] = React.useState(() => new PerspectiveCamera());
   const beforeRender = React.useCallback(() => {
     var _materialRef$current;
-
     // TODO: As of R3f 7-8 this should be __r3f.parent
     const parent = materialRef.current.parent || ((_materialRef$current = materialRef.current) == null ? void 0 : _materialRef$current.__r3f.parent);
     if (!parent) return;
@@ -61,8 +60,8 @@ const MeshReflectorMaterial = /*#__PURE__*/React.forwardRef(({
     normal.set(0, 0, 1);
     normal.applyMatrix4(rotationMatrix);
     reflectorWorldPosition.addScaledVector(normal, reflectorOffset);
-    view.subVectors(reflectorWorldPosition, cameraWorldPosition); // Avoid rendering when reflector is facing away
-
+    view.subVectors(reflectorWorldPosition, cameraWorldPosition);
+    // Avoid rendering when reflector is facing away
     if (view.dot(normal) > 0) return;
     view.reflect(normal).negate();
     view.add(reflectorWorldPosition);
@@ -79,16 +78,15 @@ const MeshReflectorMaterial = /*#__PURE__*/React.forwardRef(({
     virtualCamera.up.reflect(normal);
     virtualCamera.lookAt(target);
     virtualCamera.far = camera.far; // Used in WebGLBackground
-
     virtualCamera.updateMatrixWorld();
-    virtualCamera.projectionMatrix.copy(camera.projectionMatrix); // Update the texture matrix
-
+    virtualCamera.projectionMatrix.copy(camera.projectionMatrix);
+    // Update the texture matrix
     textureMatrix.set(0.5, 0.0, 0.0, 0.5, 0.0, 0.5, 0.0, 0.5, 0.0, 0.0, 0.5, 0.5, 0.0, 0.0, 0.0, 1.0);
     textureMatrix.multiply(virtualCamera.projectionMatrix);
     textureMatrix.multiply(virtualCamera.matrixWorldInverse);
-    textureMatrix.multiply(parent.matrixWorld); // Now update projection matrix with new clip plane, implementing code from: http://www.terathon.com/code/oblique.html
+    textureMatrix.multiply(parent.matrixWorld);
+    // Now update projection matrix with new clip plane, implementing code from: http://www.terathon.com/code/oblique.html
     // Paper explaining this technique: http://www.terathon.com/lengyel/Lengyel-Oblique.pdf
-
     reflectorPlane.setFromNormalAndCoplanarPoint(normal, reflectorWorldPosition);
     reflectorPlane.applyMatrix4(virtualCamera.matrixWorldInverse);
     clipPlane.set(reflectorPlane.normal.x, reflectorPlane.normal.y, reflectorPlane.normal.z, reflectorPlane.constant);
@@ -96,10 +94,10 @@ const MeshReflectorMaterial = /*#__PURE__*/React.forwardRef(({
     q.x = (Math.sign(clipPlane.x) + projectionMatrix.elements[8]) / projectionMatrix.elements[0];
     q.y = (Math.sign(clipPlane.y) + projectionMatrix.elements[9]) / projectionMatrix.elements[5];
     q.z = -1.0;
-    q.w = (1.0 + projectionMatrix.elements[10]) / projectionMatrix.elements[14]; // Calculate the scaled plane vector
-
-    clipPlane.multiplyScalar(2.0 / clipPlane.dot(q)); // Replacing the third row of the projection matrix
-
+    q.w = (1.0 + projectionMatrix.elements[10]) / projectionMatrix.elements[14];
+    // Calculate the scaled plane vector
+    clipPlane.multiplyScalar(2.0 / clipPlane.dot(q));
+    // Replacing the third row of the projection matrix
     projectionMatrix.elements[2] = clipPlane.x;
     projectionMatrix.elements[6] = clipPlane.y;
     projectionMatrix.elements[10] = clipPlane.z + 1.0;
@@ -151,7 +149,6 @@ const MeshReflectorMaterial = /*#__PURE__*/React.forwardRef(({
   }, [gl, blur, textureMatrix, resolution, mirror, hasBlur, mixBlur, mixStrength, minDepthThreshold, maxDepthThreshold, depthScale, depthToBlurRatioBias, distortion, distortionMap, mixContrast]);
   useFrame(() => {
     var _materialRef$current2;
-
     // TODO: As of R3f 7-8 this should be __r3f.parent
     const parent = materialRef.current.parent || ((_materialRef$current2 = materialRef.current) == null ? void 0 : _materialRef$current2.__r3f.parent);
     if (!parent) return;
@@ -172,7 +169,8 @@ const MeshReflectorMaterial = /*#__PURE__*/React.forwardRef(({
     gl.setRenderTarget(null);
   });
   return /*#__PURE__*/React.createElement("meshReflectorMaterialImpl", _extends({
-    attach: "material" // Defines can't be updated dynamically, so we need to recreate the material
+    attach: "material"
+    // Defines can't be updated dynamically, so we need to recreate the material
     ,
     key: 'key' + reflectorProps['defines-USE_BLUR'] + reflectorProps['defines-USE_DEPTH'] + reflectorProps['defines-USE_DISTORTION'],
     ref: mergeRefs([materialRef, ref])

package/core/MeshRefractionMaterial.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@babel/runtime/helpers/extends"),r=require("react"),t=require("@react-three/fiber"),a=require("three-mesh-bvh"),n=require("../materials/MeshRefractionMaterial.cjs.js");function i(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 a=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(r,t,a.get?a:{enumerable:!0,get:function(){return e[t]}})}})),r.default=e,Object.freeze(r)}require("three"),require("./shaderMaterial.cjs.js");var u=i(e),s=o(r);exports.MeshRefractionMaterial=function({aberrationStrength:e=0,fastChroma:i=!0,envMap:o,...c}){t.extend({MeshRefractionMaterial:n.MeshRefractionMaterial});const l=r.useRef(),{size:f}=t.useThree(),h=r.useMemo((()=>{var r,t;const a={},n=(u=o)&&u.isCubeTexture;var u;const s=(null!==(r=n?null==(t=o.image[0])?void 0:t.width:o.image.width)&&void 0!==r?r:1024)/4,c=Math.floor(Math.log2(s)),l=Math.pow(2,c),f=3*Math.max(l,112),h=4*l;return n&&(a.ENVMAP_TYPE_CUBEM=""),a.CUBEUV_TEXEL_WIDTH=""+1/f,a.CUBEUV_TEXEL_HEIGHT=""+1/h,a.CUBEUV_MAX_MIP=`${c}.0`,e>0&&(a.CHROMATIC_ABERRATIONS=""),i&&(a.FAST_CHROMA=""),a}),[e,i]);return r.useLayoutEffect((()=>{var e,r,t;const n=null==(e=l.current)||null==(r=e.__r3f)||null==(t=r.parent)?void 0:t.geometry;n&&(l.current.bvh=new a.MeshBVHUniformStruct,l.current.bvh.updateFrom(new a.MeshBVH(n.clone().toNonIndexed(),{lazyGeneration:!1,strategy:a.SAH})))}),[]),t.useFrame((({camera:e})=>{l.current.viewMatrixInverse=e.matrixWorld,l.current.projectionMatrixInverse=e.projectionMatrixInverse})),s.createElement("meshRefractionMaterial",u.default({key:JSON.stringify(h),defines:h,ref:l,resolution:[f.width,f.height],aberrationStrength:e,envMap:o},c))};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@babel/runtime/helpers/extends"),r=require("react"),t=require("@react-three/fiber"),a=require("three-mesh-bvh"),n=require("../materials/MeshRefractionMaterial.cjs.js");function i(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 a=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(r,t,a.get?a:{enumerable:!0,get:function(){return e[t]}})}})),r.default=e,Object.freeze(r)}require("three"),require("./shaderMaterial.cjs.js");var u=i(e),s=o(r);exports.MeshRefractionMaterial=function({aberrationStrength:e=0,fastChroma:i=!0,envMap:o,...c}){t.extend({MeshRefractionMaterial:n.MeshRefractionMaterial});const l=r.useRef(),{size:f}=t.useThree(),h=r.useMemo((()=>{var r,t;const a={},n=(u=o)&&u.isCubeTexture;var u;const s=(null!==(r=n?null==(t=o.image[0])?void 0:t.width:o.image.width)&&void 0!==r?r:1024)/4,c=Math.floor(Math.log2(s)),l=Math.pow(2,c),f=3*Math.max(l,112),h=4*l;return n&&(a.ENVMAP_TYPE_CUBEM=""),a.CUBEUV_TEXEL_WIDTH=""+1/f,a.CUBEUV_TEXEL_HEIGHT=""+1/h,a.CUBEUV_MAX_MIP=`${c}.0`,e>0&&(a.CHROMATIC_ABERRATIONS=""),i&&(a.FAST_CHROMA=""),a}),[e,i]);return r.useLayoutEffect((()=>{var e;const r=null==(e=l.current)||null==(e=e.__r3f)||null==(e=e.parent)?void 0:e.geometry;r&&(l.current.bvh=new a.MeshBVHUniformStruct,l.current.bvh.updateFrom(new a.MeshBVH(r.clone().toNonIndexed(),{lazyGeneration:!1,strategy:a.SAH})))}),[]),t.useFrame((({camera:e})=>{l.current.viewMatrixInverse=e.matrixWorld,l.current.projectionMatrixInverse=e.projectionMatrixInverse})),s.createElement("meshRefractionMaterial",u.default({key:JSON.stringify(h),defines:h,ref:l,resolution:[f.width,f.height],aberrationStrength:e,envMap:o},c))};

package/core/MeshRefractionMaterial.d.ts

@@ -1,5 +1,5 @@
-/// <reference types="react" />
 import * as THREE from 'three';
+import * as React from 'react';
 import { ReactThreeFiber } from '@react-three/fiber';
 import { MeshRefractionMaterial as MeshRefractionMaterial_ } from '../materials/MeshRefractionMaterial';
 declare global {
@@ -9,7 +9,7 @@ declare global {
         }
     }
 }
-declare type MeshRefractionMaterialProps = JSX.IntrinsicElements['shaderMaterial'] & {
+type MeshRefractionMaterialProps = JSX.IntrinsicElements['shaderMaterial'] & {
     envMap: THREE.CubeTexture | THREE.Texture;
     bounces?: number;
     ior?: number;
@@ -18,5 +18,5 @@ declare type MeshRefractionMaterialProps = JSX.IntrinsicElements['shaderMaterial
     color?: ReactThreeFiber.Color;
     fastChroma?: boolean;
 };
-export declare function MeshRefractionMaterial({ aberrationStrength, fastChroma, envMap, ...props }: MeshRefractionMaterialProps): JSX.Element;
+export declare function MeshRefractionMaterial({ aberrationStrength, fastChroma, envMap, ...props }: MeshRefractionMaterialProps): React.JSX.Element;
 export {};

package/core/MeshRefractionMaterial.js

@@ -6,7 +6,6 @@ import { MeshBVHUniformStruct, MeshBVH, SAH } from 'three-mesh-bvh';
 import { MeshRefractionMaterial as MeshRefractionMaterial$1 } from '../materials/MeshRefractionMaterial.js';
 
 const isCubeTexture = def => def && def.isCubeTexture;
-
 function MeshRefractionMaterial({
   aberrationStrength = 0,
   fastChroma = true,
@@ -22,34 +21,29 @@ function MeshRefractionMaterial({
   } = useThree();
   const defines = useMemo(() => {
     var _ref, _envMap$image$;
-
-    const temp = {}; // Sampler2D and SamplerCube need different defines
-
+    const temp = {};
+    // Sampler2D and SamplerCube need different defines
     const isCubeMap = isCubeTexture(envMap);
     const w = (_ref = isCubeMap ? (_envMap$image$ = envMap.image[0]) == null ? void 0 : _envMap$image$.width : envMap.image.width) !== null && _ref !== void 0 ? _ref : 1024;
     const cubeSize = w / 4;
-
     const _lodMax = Math.floor(Math.log2(cubeSize));
-
     const _cubeSize = Math.pow(2, _lodMax);
-
     const width = 3 * Math.max(_cubeSize, 16 * 7);
     const height = 4 * _cubeSize;
     if (isCubeMap) temp.ENVMAP_TYPE_CUBEM = '';
     temp.CUBEUV_TEXEL_WIDTH = `${1.0 / width}`;
     temp.CUBEUV_TEXEL_HEIGHT = `${1.0 / height}`;
-    temp.CUBEUV_MAX_MIP = `${_lodMax}.0`; // Add defines from chromatic aberration
-
+    temp.CUBEUV_MAX_MIP = `${_lodMax}.0`;
+    // Add defines from chromatic aberration
     if (aberrationStrength > 0) temp.CHROMATIC_ABERRATIONS = '';
     if (fastChroma) temp.FAST_CHROMA = '';
     return temp;
   }, [aberrationStrength, fastChroma]);
   useLayoutEffect(() => {
-    var _material$current, _material$current$__r, _material$current$__r2;
-
+    var _material$current;
     // Get the geometry of this materials parent
-    const geometry = (_material$current = material.current) == null ? void 0 : (_material$current$__r = _material$current.__r3f) == null ? void 0 : (_material$current$__r2 = _material$current$__r.parent) == null ? void 0 : _material$current$__r2.geometry; // Update the BVH
-
+    const geometry = (_material$current = material.current) == null || (_material$current = _material$current.__r3f) == null || (_material$current = _material$current.parent) == null ? void 0 : _material$current.geometry;
+    // Update the BVH
     if (geometry) {
       material.current.bvh = new MeshBVHUniformStruct();
       material.current.bvh.updateFrom(new MeshBVH(geometry.clone().toNonIndexed(), {
@@ -66,7 +60,8 @@ function MeshRefractionMaterial({
   });
   return /*#__PURE__*/React.createElement("meshRefractionMaterial", _extends({
     // @ts-ignore
-    key: JSON.stringify(defines) // @ts-ignore
+    key: JSON.stringify(defines)
+    // @ts-ignore
     ,
     defines: defines,
     ref: material,

package/core/MeshTransmissionMaterial.d.ts

@@ -1,6 +1,6 @@
 import * as THREE from 'three';
 import { ForwardRefComponent } from '../helpers/ts-utils';
-declare type MeshTransmissionMaterialType = Omit<JSX.IntrinsicElements['meshPhysicalMaterial'], 'args' | 'roughness' | 'thickness' | 'transmission'> & {
+type MeshTransmissionMaterialType = Omit<JSX.IntrinsicElements['meshPhysicalMaterial'], 'args' | 'roughness' | 'thickness' | 'transmission'> & {
     transmission?: number;
     thickness?: number;
     roughness?: number;
@@ -14,7 +14,7 @@ declare type MeshTransmissionMaterialType = Omit<JSX.IntrinsicElements['meshPhys
     time?: number;
     args?: [samples: number, transmissionSampler: boolean];
 };
-declare type MeshTransmissionMaterialProps = Omit<MeshTransmissionMaterialType, 'args'> & {
+type MeshTransmissionMaterialProps = Omit<MeshTransmissionMaterialType, 'args'> & {
     transmissionSampler?: boolean;
     backside?: boolean;
     backsideThickness?: number;