@react-three/drei 9.0.0-beta.3 → 9.0.0

package/materials/ConvolutionMaterial.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("three");class n extends e.ShaderMaterial{constructor(n=new e.Vector2){super({uniforms:{inputBuffer:new e.Uniform(null),depthBuffer:new e.Uniform(null),resolution:new e.Uniform(new e.Vector2),texelSize:new e.Uniform(new e.Vector2),halfTexelSize:new e.Uniform(new e.Vector2),kernel:new e.Uniform(0),scale:new e.Uniform(1),cameraNear:new e.Uniform(0),cameraFar:new e.Uniform(1),minDepthThreshold:new e.Uniform(0),maxDepthThreshold:new e.Uniform(1),depthScale:new e.Uniform(0),depthToBlurRatioBias:new e.Uniform(.25)},fragmentShader:"#include <common>\n        #include <dithering_pars_fragment>      \n        uniform sampler2D inputBuffer;\n        uniform sampler2D depthBuffer;\n        uniform float cameraNear;\n        uniform float cameraFar;\n        uniform float minDepthThreshold;\n        uniform float maxDepthThreshold;\n        uniform float depthScale;\n        uniform float depthToBlurRatioBias;\n        varying vec2 vUv;\n        varying vec2 vUv0;\n        varying vec2 vUv1;\n        varying vec2 vUv2;\n        varying vec2 vUv3;\n\n        void main() {\n          float depthFactor = 0.0;\n          \n          #ifdef USE_DEPTH\n            vec4 depth = texture2D(depthBuffer, vUv);\n            depthFactor = smoothstep(minDepthThreshold, maxDepthThreshold, 1.0-(depth.r * depth.a));\n            depthFactor *= depthScale;\n            depthFactor = max(0.0, min(1.0, depthFactor + 0.25));\n          #endif\n          \n          vec4 sum = texture2D(inputBuffer, mix(vUv0, vUv, depthFactor));\n          sum += texture2D(inputBuffer, mix(vUv1, vUv, depthFactor));\n          sum += texture2D(inputBuffer, mix(vUv2, vUv, depthFactor));\n          sum += texture2D(inputBuffer, mix(vUv3, vUv, depthFactor));\n          gl_FragColor = sum * 0.25 ;\n\n          #include <dithering_fragment>\n        }",vertexShader:"uniform vec2 texelSize;\n        uniform vec2 halfTexelSize;\n        uniform float kernel;\n        uniform float scale;\n        varying vec2 vUv;\n        varying vec2 vUv0;\n        varying vec2 vUv1;\n        varying vec2 vUv2;\n        varying vec2 vUv3;\n\n        void main() {\n          vec2 uv = position.xy * 0.5 + 0.5;\n          vUv = uv;\n\n          vec2 dUv = (texelSize * vec2(kernel) + halfTexelSize) * scale;\n          vUv0 = vec2(uv.x - dUv.x, uv.y + dUv.y);\n          vUv1 = vec2(uv.x + dUv.x, uv.y + dUv.y);\n          vUv2 = vec2(uv.x + dUv.x, uv.y - dUv.y);\n          vUv3 = vec2(uv.x - dUv.x, uv.y - dUv.y);\n\n          gl_Position = vec4(position.xy, 1.0, 1.0);\n        }",blending:e.NoBlending,depthWrite:!1,depthTest:!1}),this.toneMapped=!1,this.setTexelSize(n.x,n.y),this.kernel=new Float32Array([0,1,2,2,3])}setTexelSize(e,n){this.uniforms.texelSize.value.set(e,n),this.uniforms.halfTexelSize.value.set(e,n).multiplyScalar(.5)}setResolution(e){this.uniforms.resolution.value.copy(e)}}exports.ConvolutionMaterial=n;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("three");class n extends e.ShaderMaterial{constructor(n=new e.Vector2){super({uniforms:{inputBuffer:new e.Uniform(null),depthBuffer:new e.Uniform(null),resolution:new e.Uniform(new e.Vector2),texelSize:new e.Uniform(new e.Vector2),halfTexelSize:new e.Uniform(new e.Vector2),kernel:new e.Uniform(0),scale:new e.Uniform(1),cameraNear:new e.Uniform(0),cameraFar:new e.Uniform(1),minDepthThreshold:new e.Uniform(0),maxDepthThreshold:new e.Uniform(1),depthScale:new e.Uniform(0),depthToBlurRatioBias:new e.Uniform(.25)},fragmentShader:"#include <common>\n        #include <dithering_pars_fragment>      \n        uniform sampler2D inputBuffer;\n        uniform sampler2D depthBuffer;\n        uniform float cameraNear;\n        uniform float cameraFar;\n        uniform float minDepthThreshold;\n        uniform float maxDepthThreshold;\n        uniform float depthScale;\n        uniform float depthToBlurRatioBias;\n        varying vec2 vUv;\n        varying vec2 vUv0;\n        varying vec2 vUv1;\n        varying vec2 vUv2;\n        varying vec2 vUv3;\n\n        void main() {\n          float depthFactor = 0.0;\n          \n          #ifdef USE_DEPTH\n            vec4 depth = texture2D(depthBuffer, vUv);\n            depthFactor = smoothstep(minDepthThreshold, maxDepthThreshold, 1.0-(depth.r * depth.a));\n            depthFactor *= depthScale;\n            depthFactor = max(0.0, min(1.0, depthFactor + 0.25));\n          #endif\n          \n          vec4 sum = texture2D(inputBuffer, mix(vUv0, vUv, depthFactor));\n          sum += texture2D(inputBuffer, mix(vUv1, vUv, depthFactor));\n          sum += texture2D(inputBuffer, mix(vUv2, vUv, depthFactor));\n          sum += texture2D(inputBuffer, mix(vUv3, vUv, depthFactor));\n          gl_FragColor = sum * 0.25 ;\n\n          #include <dithering_fragment>\n          #include <tonemapping_fragment>\n          #include <encodings_fragment>\n        }",vertexShader:"uniform vec2 texelSize;\n        uniform vec2 halfTexelSize;\n        uniform float kernel;\n        uniform float scale;\n        varying vec2 vUv;\n        varying vec2 vUv0;\n        varying vec2 vUv1;\n        varying vec2 vUv2;\n        varying vec2 vUv3;\n\n        void main() {\n          vec2 uv = position.xy * 0.5 + 0.5;\n          vUv = uv;\n\n          vec2 dUv = (texelSize * vec2(kernel) + halfTexelSize) * scale;\n          vUv0 = vec2(uv.x - dUv.x, uv.y + dUv.y);\n          vUv1 = vec2(uv.x + dUv.x, uv.y + dUv.y);\n          vUv2 = vec2(uv.x + dUv.x, uv.y - dUv.y);\n          vUv3 = vec2(uv.x - dUv.x, uv.y - dUv.y);\n\n          gl_Position = vec4(position.xy, 1.0, 1.0);\n        }",blending:e.NoBlending,depthWrite:!1,depthTest:!1}),this.toneMapped=!1,this.setTexelSize(n.x,n.y),this.kernel=new Float32Array([0,1,2,2,3])}setTexelSize(e,n){this.uniforms.texelSize.value.set(e,n),this.uniforms.halfTexelSize.value.set(e,n).multiplyScalar(.5)}setResolution(e){this.uniforms.resolution.value.copy(e)}}exports.ConvolutionMaterial=n;

package/materials/ConvolutionMaterial.js

@@ -51,6 +51,8 @@ class ConvolutionMaterial extends ShaderMaterial {
           gl_FragColor = sum * 0.25 ;
 
           #include <dithering_fragment>
+          #include <tonemapping_fragment>
+          #include <encodings_fragment>
         }`,
       vertexShader: `uniform vec2 texelSize;
         uniform vec2 halfTexelSize;

package/materials/MeshReflectorMaterial.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("three");class t extends e.MeshStandardMaterial{constructor(e={}){super(e),this._debug={value:0},this._tDepth={value:null},this._distortionMap={value:null},this._tDiffuse={value:null},this._tDiffuseBlur={value:null},this._textureMatrix={value:null},this._hasBlur={value:!1},this._mirror={value:0},this._mixBlur={value:0},this._blurStrength={value:.5},this._minDepthThreshold={value:.9},this._maxDepthThreshold={value:1},this._depthScale={value:0},this._depthToBlurRatioBias={value:.25},this._distortion={value:1},this._mixContrast={value:1},this.setValues(e)}onBeforeCompile(e){var t;null!=(t=e.defines)&&t.USE_UV||(e.defines.USE_UV=""),e.uniforms.debug=this._debug,e.uniforms.hasBlur=this._hasBlur,e.uniforms.tDiffuse=this._tDiffuse,e.uniforms.tDepth=this._tDepth,e.uniforms.distortionMap=this._distortionMap,e.uniforms.tDiffuseBlur=this._tDiffuseBlur,e.uniforms.textureMatrix=this._textureMatrix,e.uniforms.mirror=this._mirror,e.uniforms.mixBlur=this._mixBlur,e.uniforms.mixStrength=this._blurStrength,e.uniforms.minDepthThreshold=this._minDepthThreshold,e.uniforms.maxDepthThreshold=this._maxDepthThreshold,e.uniforms.depthScale=this._depthScale,e.uniforms.depthToBlurRatioBias=this._depthToBlurRatioBias,e.uniforms.distortion=this._distortion,e.uniforms.mixContrast=this._mixContrast,e.vertexShader=`\n        uniform mat4 textureMatrix;\n        varying vec4 my_vUv;     \n      ${e.vertexShader}`,e.vertexShader=e.vertexShader.replace("#include <project_vertex>","#include <project_vertex>\n        my_vUv = textureMatrix * vec4( position, 1.0 );\n        gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );"),e.fragmentShader=`\n        uniform int debug;\n        uniform sampler2D tDiffuse;\n        uniform sampler2D tDiffuseBlur;\n        uniform sampler2D tDepth;\n        uniform sampler2D distortionMap;\n        uniform float distortion;\n        uniform float cameraNear;\n\t\t\t  uniform float cameraFar;\n        uniform bool hasBlur;\n        uniform float mixBlur;\n        uniform float mirror;\n        uniform float mixStrength;\n        uniform float minDepthThreshold;\n        uniform float maxDepthThreshold;\n        uniform float mixContrast;\n        uniform float depthScale;\n        uniform float depthToBlurRatioBias;\n        varying vec4 my_vUv;        \n        ${e.fragmentShader}`,e.fragmentShader=e.fragmentShader.replace("#include <emissivemap_fragment>","#include <emissivemap_fragment>\n    \n      float distortionFactor = 0.0;\n      #ifdef USE_DISTORTION\n        distortionFactor = texture2D(distortionMap, vUv).r * distortion;\n      #endif\n\n      vec4 new_vUv = my_vUv;\n      new_vUv.x += distortionFactor;\n      new_vUv.y += distortionFactor;\n\n      vec4 base = texture2DProj(tDiffuse, new_vUv);\n      vec4 blur = texture2DProj(tDiffuseBlur, new_vUv);\n      \n      vec4 merge = base;\n      \n      #ifdef USE_NORMALMAP\n        vec2 normal_uv = vec2(0.0);\n        vec4 normalColor = texture2D(normalMap, vUv * normalScale);\n        vec3 my_normal = normalize( vec3( normalColor.r * 2.0 - 1.0, normalColor.b,  normalColor.g * 2.0 - 1.0 ) );\n        vec3 coord = new_vUv.xyz / new_vUv.w;\n        normal_uv = coord.xy + coord.z * my_normal.xz * 0.05;\n        vec4 base_normal = texture2D(tDiffuse, normal_uv);\n        vec4 blur_normal = texture2D(tDiffuseBlur, normal_uv);\n        merge = base_normal;\n        blur = blur_normal;\n      #endif\n\n      float depthFactor = 0.0001;\n      float blurFactor = 0.0;\n\n      #ifdef USE_DEPTH\n        vec4 depth = texture2DProj(tDepth, new_vUv);\n        depthFactor = smoothstep(minDepthThreshold, maxDepthThreshold, 1.0-(depth.r * depth.a));\n        depthFactor *= depthScale;\n        depthFactor = max(0.0001, min(1.0, depthFactor));\n\n        #ifdef USE_BLUR\n          blur = blur * min(1.0, depthFactor + depthToBlurRatioBias);\n          merge = merge * min(1.0, depthFactor + 0.5);\n        #else\n          merge = merge * depthFactor;\n        #endif\n  \n      #endif\n\n      float reflectorRoughnessFactor = roughness;\n      #ifdef USE_ROUGHNESSMAP\n        vec4 reflectorTexelRoughness = texture2D( roughnessMap, vUv );\n        reflectorRoughnessFactor *= reflectorTexelRoughness.g;\n      #endif\n      \n      #ifdef USE_BLUR\n        blurFactor = min(1.0, mixBlur * reflectorRoughnessFactor);\n        merge = mix(merge, blur, blurFactor);\n      #endif\n\n      vec4 newMerge = vec4(0.0, 0.0, 0.0, 1.0);\n      newMerge.r = (merge.r - 0.5) * mixContrast + 0.5;\n      newMerge.g = (merge.g - 0.5) * mixContrast + 0.5;\n      newMerge.b = (merge.b - 0.5) * mixContrast + 0.5;\n\n      diffuseColor.rgb = diffuseColor.rgb * ((1.0 - min(1.0, mirror)) + newMerge.rgb * mixStrength);           \n      \n      if (debug == 1) {\n        diffuseColor = vec4(vec3(depthFactor), 1.0);\n      }\n      if (debug == 2) {\n        diffuseColor = vec4(vec3(blurFactor), 1.0);\n      }\n      if (debug == 3) {\n        diffuseColor = texture2DProj(tDiffuse, new_vUv);\n      }\n      if (debug == 4) {\n        diffuseColor = texture2DProj(tDiffuseBlur, new_vUv);\n      }\n      ")}get tDiffuse(){return this._tDiffuse.value}set tDiffuse(e){this._tDiffuse.value=e}get tDepth(){return this._tDepth.value}set tDepth(e){this._tDepth.value=e}get distortionMap(){return this._distortionMap.value}set distortionMap(e){this._distortionMap.value=e}get tDiffuseBlur(){return this._tDiffuseBlur.value}set tDiffuseBlur(e){this._tDiffuseBlur.value=e}get textureMatrix(){return this._textureMatrix.value}set textureMatrix(e){this._textureMatrix.value=e}get hasBlur(){return this._hasBlur.value}set hasBlur(e){this._hasBlur.value=e}get mirror(){return this._mirror.value}set mirror(e){this._mirror.value=e}get mixBlur(){return this._mixBlur.value}set mixBlur(e){this._mixBlur.value=e}get mixStrength(){return this._blurStrength.value}set mixStrength(e){this._blurStrength.value=e}get minDepthThreshold(){return this._minDepthThreshold.value}set minDepthThreshold(e){this._minDepthThreshold.value=e}get maxDepthThreshold(){return this._maxDepthThreshold.value}set maxDepthThreshold(e){this._maxDepthThreshold.value=e}get depthScale(){return this._depthScale.value}set depthScale(e){this._depthScale.value=e}get debug(){return this._debug.value}set debug(e){this._debug.value=e}get depthToBlurRatioBias(){return this._depthToBlurRatioBias.value}set depthToBlurRatioBias(e){this._depthToBlurRatioBias.value=e}get distortion(){return this._distortion.value}set distortion(e){this._distortion.value=e}get mixContrast(){return this._mixContrast.value}set mixContrast(e){this._mixContrast.value=e}}exports.MeshReflectorMaterial=t;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("three");class t extends e.MeshStandardMaterial{constructor(e={}){super(e),this._tDepth={value:null},this._distortionMap={value:null},this._tDiffuse={value:null},this._tDiffuseBlur={value:null},this._textureMatrix={value:null},this._hasBlur={value:!1},this._mirror={value:0},this._mixBlur={value:0},this._blurStrength={value:.5},this._minDepthThreshold={value:.9},this._maxDepthThreshold={value:1},this._depthScale={value:0},this._depthToBlurRatioBias={value:.25},this._distortion={value:1},this._mixContrast={value:1},this.setValues(e)}onBeforeCompile(e){var t;null!=(t=e.defines)&&t.USE_UV||(e.defines.USE_UV=""),e.uniforms.hasBlur=this._hasBlur,e.uniforms.tDiffuse=this._tDiffuse,e.uniforms.tDepth=this._tDepth,e.uniforms.distortionMap=this._distortionMap,e.uniforms.tDiffuseBlur=this._tDiffuseBlur,e.uniforms.textureMatrix=this._textureMatrix,e.uniforms.mirror=this._mirror,e.uniforms.mixBlur=this._mixBlur,e.uniforms.mixStrength=this._blurStrength,e.uniforms.minDepthThreshold=this._minDepthThreshold,e.uniforms.maxDepthThreshold=this._maxDepthThreshold,e.uniforms.depthScale=this._depthScale,e.uniforms.depthToBlurRatioBias=this._depthToBlurRatioBias,e.uniforms.distortion=this._distortion,e.uniforms.mixContrast=this._mixContrast,e.vertexShader=`\n        uniform mat4 textureMatrix;\n        varying vec4 my_vUv;\n      ${e.vertexShader}`,e.vertexShader=e.vertexShader.replace("#include <project_vertex>","#include <project_vertex>\n        my_vUv = textureMatrix * vec4( position, 1.0 );\n        gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );"),e.fragmentShader=`\n        uniform sampler2D tDiffuse;\n        uniform sampler2D tDiffuseBlur;\n        uniform sampler2D tDepth;\n        uniform sampler2D distortionMap;\n        uniform float distortion;\n        uniform float cameraNear;\n\t\t\t  uniform float cameraFar;\n        uniform bool hasBlur;\n        uniform float mixBlur;\n        uniform float mirror;\n        uniform float mixStrength;\n        uniform float minDepthThreshold;\n        uniform float maxDepthThreshold;\n        uniform float mixContrast;\n        uniform float depthScale;\n        uniform float depthToBlurRatioBias;\n        varying vec4 my_vUv;\n        ${e.fragmentShader}`,e.fragmentShader=e.fragmentShader.replace("#include <emissivemap_fragment>","#include <emissivemap_fragment>\n\n      float distortionFactor = 0.0;\n      #ifdef USE_DISTORTION\n        distortionFactor = texture2D(distortionMap, vUv).r * distortion;\n      #endif\n\n      vec4 new_vUv = my_vUv;\n      new_vUv.x += distortionFactor;\n      new_vUv.y += distortionFactor;\n\n      vec4 base = texture2DProj(tDiffuse, new_vUv);\n      vec4 blur = texture2DProj(tDiffuseBlur, new_vUv);\n\n      vec4 merge = base;\n\n      #ifdef USE_NORMALMAP\n        vec2 normal_uv = vec2(0.0);\n        vec4 normalColor = texture2D(normalMap, vUv * normalScale);\n        vec3 my_normal = normalize( vec3( normalColor.r * 2.0 - 1.0, normalColor.b,  normalColor.g * 2.0 - 1.0 ) );\n        vec3 coord = new_vUv.xyz / new_vUv.w;\n        normal_uv = coord.xy + coord.z * my_normal.xz * 0.05;\n        vec4 base_normal = texture2D(tDiffuse, normal_uv);\n        vec4 blur_normal = texture2D(tDiffuseBlur, normal_uv);\n        merge = base_normal;\n        blur = blur_normal;\n      #endif\n\n      float depthFactor = 0.0001;\n      float blurFactor = 0.0;\n\n      #ifdef USE_DEPTH\n        vec4 depth = texture2DProj(tDepth, new_vUv);\n        depthFactor = smoothstep(minDepthThreshold, maxDepthThreshold, 1.0-(depth.r * depth.a));\n        depthFactor *= depthScale;\n        depthFactor = max(0.0001, min(1.0, depthFactor));\n\n        #ifdef USE_BLUR\n          blur = blur * min(1.0, depthFactor + depthToBlurRatioBias);\n          merge = merge * min(1.0, depthFactor + 0.5);\n        #else\n          merge = merge * depthFactor;\n        #endif\n\n      #endif\n\n      float reflectorRoughnessFactor = roughness;\n      #ifdef USE_ROUGHNESSMAP\n        vec4 reflectorTexelRoughness = texture2D( roughnessMap, vUv );\n        reflectorRoughnessFactor *= reflectorTexelRoughness.g;\n      #endif\n\n      #ifdef USE_BLUR\n        blurFactor = min(1.0, mixBlur * reflectorRoughnessFactor);\n        merge = mix(merge, blur, blurFactor);\n      #endif\n\n      vec4 newMerge = vec4(0.0, 0.0, 0.0, 1.0);\n      newMerge.r = (merge.r - 0.5) * mixContrast + 0.5;\n      newMerge.g = (merge.g - 0.5) * mixContrast + 0.5;\n      newMerge.b = (merge.b - 0.5) * mixContrast + 0.5;\n\n      diffuseColor.rgb = diffuseColor.rgb * ((1.0 - min(1.0, mirror)) + newMerge.rgb * mixStrength);\n      ")}get tDiffuse(){return this._tDiffuse.value}set tDiffuse(e){this._tDiffuse.value=e}get tDepth(){return this._tDepth.value}set tDepth(e){this._tDepth.value=e}get distortionMap(){return this._distortionMap.value}set distortionMap(e){this._distortionMap.value=e}get tDiffuseBlur(){return this._tDiffuseBlur.value}set tDiffuseBlur(e){this._tDiffuseBlur.value=e}get textureMatrix(){return this._textureMatrix.value}set textureMatrix(e){this._textureMatrix.value=e}get hasBlur(){return this._hasBlur.value}set hasBlur(e){this._hasBlur.value=e}get mirror(){return this._mirror.value}set mirror(e){this._mirror.value=e}get mixBlur(){return this._mixBlur.value}set mixBlur(e){this._mixBlur.value=e}get mixStrength(){return this._blurStrength.value}set mixStrength(e){this._blurStrength.value=e}get minDepthThreshold(){return this._minDepthThreshold.value}set minDepthThreshold(e){this._minDepthThreshold.value=e}get maxDepthThreshold(){return this._maxDepthThreshold.value}set maxDepthThreshold(e){this._maxDepthThreshold.value=e}get depthScale(){return this._depthScale.value}set depthScale(e){this._depthScale.value=e}get depthToBlurRatioBias(){return this._depthToBlurRatioBias.value}set depthToBlurRatioBias(e){this._depthToBlurRatioBias.value=e}get distortion(){return this._distortion.value}set distortion(e){this._distortion.value=e}get mixContrast(){return this._mixContrast.value}set mixContrast(e){this._mixContrast.value=e}}exports.MeshReflectorMaterial=t;

package/materials/MeshReflectorMaterial.d.ts

@@ -1,6 +1,5 @@
 import { Matrix4, MeshStandardMaterial, Texture } from 'three';
 export declare class MeshReflectorMaterial extends MeshStandardMaterial {
-    private _debug;
     private _tDepth;
     private _distortionMap;
     private _tDiffuse;
@@ -42,8 +41,6 @@ export declare class MeshReflectorMaterial extends MeshStandardMaterial {
     set maxDepthThreshold(v: number);
     get depthScale(): number;
     set depthScale(v: number);
-    get debug(): number;
-    set debug(v: number);
     get depthToBlurRatioBias(): number;
     set depthToBlurRatioBias(v: number);
     get distortion(): number;

package/materials/MeshReflectorMaterial.js

@@ -3,9 +3,6 @@ import { MeshStandardMaterial } from 'three';
 class MeshReflectorMaterial extends MeshStandardMaterial {
   constructor(parameters = {}) {
     super(parameters);
-    this._debug = {
-      value: 0
-    };
     this._tDepth = {
       value: null
     };
@@ -61,7 +58,6 @@ class MeshReflectorMaterial extends MeshStandardMaterial {
       shader.defines.USE_UV = '';
     }
 
-    shader.uniforms.debug = this._debug;
     shader.uniforms.hasBlur = this._hasBlur;
     shader.uniforms.tDiffuse = this._tDiffuse;
     shader.uniforms.tDepth = this._tDepth;
@@ -79,13 +75,12 @@ class MeshReflectorMaterial extends MeshStandardMaterial {
     shader.uniforms.mixContrast = this._mixContrast;
     shader.vertexShader = `
         uniform mat4 textureMatrix;
-        varying vec4 my_vUv;     
+        varying vec4 my_vUv;
       ${shader.vertexShader}`;
     shader.vertexShader = shader.vertexShader.replace('#include <project_vertex>', `#include <project_vertex>
         my_vUv = textureMatrix * vec4( position, 1.0 );
         gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );`);
     shader.fragmentShader = `
-        uniform int debug;
         uniform sampler2D tDiffuse;
         uniform sampler2D tDiffuseBlur;
         uniform sampler2D tDepth;
@@ -102,10 +97,10 @@ class MeshReflectorMaterial extends MeshStandardMaterial {
         uniform float mixContrast;
         uniform float depthScale;
         uniform float depthToBlurRatioBias;
-        varying vec4 my_vUv;        
+        varying vec4 my_vUv;
         ${shader.fragmentShader}`;
     shader.fragmentShader = shader.fragmentShader.replace('#include <emissivemap_fragment>', `#include <emissivemap_fragment>
-    
+
       float distortionFactor = 0.0;
       #ifdef USE_DISTORTION
         distortionFactor = texture2D(distortionMap, vUv).r * distortion;
@@ -117,9 +112,9 @@ class MeshReflectorMaterial extends MeshStandardMaterial {
 
       vec4 base = texture2DProj(tDiffuse, new_vUv);
       vec4 blur = texture2DProj(tDiffuseBlur, new_vUv);
-      
+
       vec4 merge = base;
-      
+
       #ifdef USE_NORMALMAP
         vec2 normal_uv = vec2(0.0);
         vec4 normalColor = texture2D(normalMap, vUv * normalScale);
@@ -147,7 +142,7 @@ class MeshReflectorMaterial extends MeshStandardMaterial {
         #else
           merge = merge * depthFactor;
         #endif
-  
+
       #endif
 
       float reflectorRoughnessFactor = roughness;
@@ -155,7 +150,7 @@ class MeshReflectorMaterial extends MeshStandardMaterial {
         vec4 reflectorTexelRoughness = texture2D( roughnessMap, vUv );
         reflectorRoughnessFactor *= reflectorTexelRoughness.g;
       #endif
-      
+
       #ifdef USE_BLUR
         blurFactor = min(1.0, mixBlur * reflectorRoughnessFactor);
         merge = mix(merge, blur, blurFactor);
@@ -166,20 +161,7 @@ class MeshReflectorMaterial extends MeshStandardMaterial {
       newMerge.g = (merge.g - 0.5) * mixContrast + 0.5;
       newMerge.b = (merge.b - 0.5) * mixContrast + 0.5;
 
-      diffuseColor.rgb = diffuseColor.rgb * ((1.0 - min(1.0, mirror)) + newMerge.rgb * mixStrength);           
-      
-      if (debug == 1) {
-        diffuseColor = vec4(vec3(depthFactor), 1.0);
-      }
-      if (debug == 2) {
-        diffuseColor = vec4(vec3(blurFactor), 1.0);
-      }
-      if (debug == 3) {
-        diffuseColor = texture2DProj(tDiffuse, new_vUv);
-      }
-      if (debug == 4) {
-        diffuseColor = texture2DProj(tDiffuseBlur, new_vUv);
-      }
+      diffuseColor.rgb = diffuseColor.rgb * ((1.0 - min(1.0, mirror)) + newMerge.rgb * mixStrength);
       `);
   }
 
@@ -279,14 +261,6 @@ class MeshReflectorMaterial extends MeshStandardMaterial {
     this._depthScale.value = v;
   }
 
-  get debug() {
-    return this._debug.value;
-  }
-
-  set debug(v) {
-    this._debug.value = v;
-  }
-
   get depthToBlurRatioBias() {
     return this._depthToBlurRatioBias.value;
   }

package/materials/SpotLightMaterial.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var n=require("three");class t extends n.ShaderMaterial{constructor(){super({uniforms:{depth:{value:null},opacity:{value:1},attenuation:{value:2.5},anglePower:{value:12},spotPosition:{value:new n.Vector3(0,0,0)},lightColor:{value:new n.Color("white")},cameraNear:{value:0},cameraFar:{value:1},resolution:{value:new n.Vector2(0,0)}},transparent:!0,depthWrite:!1,vertexShader:"\n      varying vec3 vNormal;\n      varying vec3 vWorldPosition;\n      varying float vViewZ;\n      varying float vIntensity;\n      uniform vec3 spotPosition;\n      uniform float attenuation;      \n\n      void main() {\n        // compute intensity\n        vNormal = normalize( normalMatrix * normal );\n        vec4 worldPosition\t= modelMatrix * vec4( position, 1.0 );\n        vWorldPosition = worldPosition.xyz;\n        vec4 viewPosition = viewMatrix * worldPosition;\n        vViewZ = viewPosition.z;\n        float intensity\t= distance(worldPosition.xyz, spotPosition) / attenuation;\n        intensity\t= 1.0 - clamp(intensity, 0.0, 1.0);\n        vIntensity = intensity;        \n        // set gl_Position\n        gl_Position\t= projectionMatrix * viewPosition;\n\n      }",fragmentShader:"\n      #include <packing>\n\n      varying vec3 vNormal;\n      varying vec3 vWorldPosition;\n      uniform vec3 lightColor;\n      uniform vec3 spotPosition;\n      uniform float attenuation;\n      uniform float anglePower;\n      uniform sampler2D depth;\n      uniform vec2 resolution;\n      uniform float cameraNear;\n      uniform float cameraFar;\n      varying float vViewZ;\n      varying float vIntensity;\n      uniform float opacity;\n\n      float readDepth( sampler2D depthSampler, vec2 coord ) {\n        float fragCoordZ = texture2D( depthSampler, coord ).x;\n        float viewZ = perspectiveDepthToViewZ(fragCoordZ, cameraNear, cameraFar);\n        return viewZ;\n      }\n\n      void main() {\n        float d = 1.0;\n        bool isSoft = resolution[0] > 0.0 && resolution[1] > 0.0;\n        if (isSoft) {\n          vec2 sUv = gl_FragCoord.xy / resolution;\n          d = readDepth(depth, sUv);\n        }\n        float intensity = vIntensity;\n        vec3 normal\t= vec3(vNormal.x, vNormal.y, abs(vNormal.z));\n        float angleIntensity\t= pow( dot(normal, vec3(0.0, 0.0, 1.0)), anglePower );\n        intensity\t*= angleIntensity;\n        // fades when z is close to sampled depth, meaning the cone is intersecting existing geometry\n        if (isSoft) {\n          intensity\t*= smoothstep(0., 1., vViewZ - d);\n        }\n        gl_FragColor = vec4(lightColor, intensity * opacity);\n      }"})}}exports.SpotLightMaterial=t;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var n=require("three");class e extends n.ShaderMaterial{constructor(){super({uniforms:{depth:{value:null},opacity:{value:1},attenuation:{value:2.5},anglePower:{value:12},spotPosition:{value:new n.Vector3(0,0,0)},lightColor:{value:new n.Color("white")},cameraNear:{value:0},cameraFar:{value:1},resolution:{value:new n.Vector2(0,0)}},transparent:!0,depthWrite:!1,vertexShader:"\n      varying vec3 vNormal;\n      varying vec3 vWorldPosition;\n      varying float vViewZ;\n      varying float vIntensity;\n      uniform vec3 spotPosition;\n      uniform float attenuation;      \n\n      void main() {\n        // compute intensity\n        vNormal = normalize( normalMatrix * normal );\n        vec4 worldPosition\t= modelMatrix * vec4( position, 1.0 );\n        vWorldPosition = worldPosition.xyz;\n        vec4 viewPosition = viewMatrix * worldPosition;\n        vViewZ = viewPosition.z;\n        float intensity\t= distance(worldPosition.xyz, spotPosition) / attenuation;\n        intensity\t= 1.0 - clamp(intensity, 0.0, 1.0);\n        vIntensity = intensity;        \n        // set gl_Position\n        gl_Position\t= projectionMatrix * viewPosition;\n\n      }",fragmentShader:"\n      #include <packing>\n\n      varying vec3 vNormal;\n      varying vec3 vWorldPosition;\n      uniform vec3 lightColor;\n      uniform vec3 spotPosition;\n      uniform float attenuation;\n      uniform float anglePower;\n      uniform sampler2D depth;\n      uniform vec2 resolution;\n      uniform float cameraNear;\n      uniform float cameraFar;\n      varying float vViewZ;\n      varying float vIntensity;\n      uniform float opacity;\n\n      float readDepth( sampler2D depthSampler, vec2 coord ) {\n        float fragCoordZ = texture2D( depthSampler, coord ).x;\n        float viewZ = perspectiveDepthToViewZ(fragCoordZ, cameraNear, cameraFar);\n        return viewZ;\n      }\n\n      void main() {\n        float d = 1.0;\n        bool isSoft = resolution[0] > 0.0 && resolution[1] > 0.0;\n        if (isSoft) {\n          vec2 sUv = gl_FragCoord.xy / resolution;\n          d = readDepth(depth, sUv);\n        }\n        float intensity = vIntensity;\n        vec3 normal\t= vec3(vNormal.x, vNormal.y, abs(vNormal.z));\n        float angleIntensity\t= pow( dot(normal, vec3(0.0, 0.0, 1.0)), anglePower );\n        intensity\t*= angleIntensity;\n        // fades when z is close to sampled depth, meaning the cone is intersecting existing geometry\n        if (isSoft) {\n          intensity\t*= smoothstep(0., 1., vViewZ - d);\n        }\n        gl_FragColor = vec4(lightColor, intensity * opacity);\n\n        #include <tonemapping_fragment>\n\t      #include <encodings_fragment>\n      }"})}}exports.SpotLightMaterial=e;

package/materials/SpotLightMaterial.js

@@ -99,6 +99,9 @@ class SpotLightMaterial extends ShaderMaterial {
           intensity	*= smoothstep(0., 1., vViewZ - d);
         }
         gl_FragColor = vec4(lightColor, intensity * opacity);
+
+        #include <tonemapping_fragment>
+	      #include <encodings_fragment>
       }`
     });
   }

package/native/index.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../core/Billboard.cjs.js"),r=require("../core/QuadraticBezierLine.cjs.js"),s=require("../core/CubicBezierLine.cjs.js"),o=require("../core/Line.cjs.js"),t=require("../core/PositionalAudio.cjs.js"),i=require("../core/Text.cjs.js"),c=require("../core/Effects.cjs.js"),u=require("../core/GradientTexture.cjs.js"),a=require("../core/Image.cjs.js"),j=require("../core/Edges.cjs.js"),n=require("../core/OrthographicCamera.cjs.js"),p=require("../core/PerspectiveCamera.cjs.js"),l=require("../core/CubeCamera.cjs.js"),x=require("../core/DeviceOrientationControls.cjs.js"),q=require("../core/FlyControls.cjs.js"),d=require("../core/MapControls.cjs.js"),C=require("../core/OrbitControls.cjs.js"),h=require("../core/TrackballControls.cjs.js"),m=require("../core/ArcballControls.cjs.js"),B=require("../core/TransformControls.cjs.js"),b=require("../core/PointerLockControls.cjs.js"),M=require("../core/FirstPersonControls.cjs.js"),P=require("../core/GizmoHelper.cjs.js"),S=require("../core/GizmoViewcube.cjs.js"),f=require("../core/GizmoViewport.cjs.js"),T=require("../core/useCubeTexture.cjs.js"),g=require("../core/useFBX.cjs.js"),v=require("../core/useGLTF.cjs.js"),L=require("../core/useProgress.cjs.js"),A=require("../core/useTexture.cjs.js"),G=require("../core/useKTX2.cjs.js"),k=require("../core/Stats.cjs.js"),D=require("../core/useDepthBuffer.cjs.js"),F=require("../core/useAspect.cjs.js"),w=require("../core/useCamera.cjs.js"),z=require("../core/useDetectGPU.cjs.js"),I=require("../core/useHelper.cjs.js"),O=require("../core/useBVH.cjs.js"),E=require("../core/useContextBridge.cjs.js"),R=require("../core/useAnimations.cjs.js"),y=require("../core/useFBO.cjs.js"),H=require("../core/useIntersect.cjs.js"),V=require("../core/CurveModifier.cjs.js"),Q=require("../core/MeshDistortMaterial.cjs.js"),X=require("../core/MeshWobbleMaterial.cjs.js"),K=require("../core/MeshReflectorMaterial.cjs.js"),W=require("../core/PointMaterial.cjs.js"),N=require("../core/shaderMaterial.cjs.js"),U=require("../core/softShadows.cjs.js"),_=require("../core/shapes.cjs.js"),J=require("../core/RoundedBox.cjs.js"),Y=require("../core/ScreenQuad.cjs.js"),Z=require("../core/Center.cjs.js"),$=require("../core/Bounds.cjs.js"),ee=require("../core/CameraShake.cjs.js"),re=require("../core/Float.cjs.js"),se=require("../core/Stage.cjs.js"),oe=require("../core/Backdrop.cjs.js"),te=require("../core/Shadow.cjs.js"),ie=require("../core/ContactShadows.cjs.js"),ce=require("../core/Reflector.cjs.js"),ue=require("../core/SpotLight.cjs.js"),ae=require("../core/Environment.cjs.js"),je=require("../core/Sky.cjs.js"),ne=require("../core/Stars.cjs.js"),pe=require("../core/Cloud.cjs.js"),le=require("../core/useMatcapTexture.cjs.js"),xe=require("../core/useNormalTexture.cjs.js"),qe=require("../core/Points.cjs.js"),de=require("../core/Instances.cjs.js"),Ce=require("../core/Segments.cjs.js"),he=require("../core/Detailed.cjs.js"),me=require("../core/Preload.cjs.js"),Be=require("../core/BakeShadows.cjs.js"),be=require("../core/meshBounds.cjs.js"),Me=require("../core/AdaptiveDpr.cjs.js"),Pe=require("../core/AdaptiveEvents.cjs.js");require("@babel/runtime/helpers/extends"),require("react"),require("@react-three/fiber"),require("react-merge-refs"),require("three"),require("three-stdlib"),require("troika-three-text"),require("suspend-react"),require("lodash.omit"),require("lodash.pick"),require("zustand"),require("stats.js"),require("../helpers/useEffectfulState.cjs.js"),require("detect-gpu"),require("three-mesh-bvh"),require("../materials/BlurPass.cjs.js"),require("../materials/ConvolutionMaterial.cjs.js"),require("../materials/MeshReflectorMaterial.cjs.js"),require("../helpers/environment-assets.cjs.js"),require("../materials/SpotLightMaterial.cjs.js"),require("../helpers/Position.cjs.js"),require("react-composer"),exports.Billboard=e.Billboard,exports.QuadraticBezierLine=r.QuadraticBezierLine,exports.CubicBezierLine=s.CubicBezierLine,exports.Line=o.Line,exports.PositionalAudio=t.PositionalAudio,exports.Text=i.Text,exports.Effects=c.Effects,exports.isWebGL2Available=c.isWebGL2Available,exports.GradientTexture=u.GradientTexture,exports.Image=a.Image,exports.Edges=j.Edges,exports.OrthographicCamera=n.OrthographicCamera,exports.PerspectiveCamera=p.PerspectiveCamera,exports.CubeCamera=l.CubeCamera,exports.DeviceOrientationControls=x.DeviceOrientationControls,exports.FlyControls=q.FlyControls,exports.MapControls=d.MapControls,exports.OrbitControls=C.OrbitControls,exports.TrackballControls=h.TrackballControls,exports.ArcballControls=m.ArcballControls,exports.TransformControls=B.TransformControls,exports.PointerLockControls=b.PointerLockControls,exports.FirstPersonControls=M.FirstPersonControls,exports.GizmoHelper=P.GizmoHelper,exports.useGizmoContext=P.useGizmoContext,exports.GizmoViewcube=S.GizmoViewcube,exports.GizmoViewport=f.GizmoViewport,exports.useCubeTexture=T.useCubeTexture,exports.useFBX=g.useFBX,exports.useGLTF=v.useGLTF,exports.useProgress=L.useProgress,exports.IsObject=A.IsObject,exports.useTexture=A.useTexture,exports.useKTX2=G.useKTX2,exports.Stats=k.Stats,exports.useDepthBuffer=D.useDepthBuffer,exports.useAspect=F.useAspect,exports.useCamera=w.useCamera,exports.useDetectGPU=z.useDetectGPU,exports.useHelper=I.useHelper,exports.useBVH=O.useBVH,exports.useContextBridge=E.useContextBridge,exports.useAnimations=R.useAnimations,exports.useFBO=y.useFBO,exports.useIntersect=H.useIntersect,exports.CurveModifier=V.CurveModifier,exports.MeshDistortMaterial=Q.MeshDistortMaterial,exports.MeshWobbleMaterial=X.MeshWobbleMaterial,exports.MeshReflectorMaterial=K.MeshReflectorMaterial,exports.PointMaterial=W.PointMaterial,exports.PointMaterialImpl=W.PointMaterialImpl,exports.shaderMaterial=N.shaderMaterial,exports.softShadows=U.softShadows,exports.Box=_.Box,exports.Circle=_.Circle,exports.Cone=_.Cone,exports.Cylinder=_.Cylinder,exports.Dodecahedron=_.Dodecahedron,exports.Extrude=_.Extrude,exports.Icosahedron=_.Icosahedron,exports.Lathe=_.Lathe,exports.Octahedron=_.Octahedron,exports.Plane=_.Plane,exports.Polyhedron=_.Polyhedron,exports.Ring=_.Ring,exports.Sphere=_.Sphere,exports.Tetrahedron=_.Tetrahedron,exports.Torus=_.Torus,exports.TorusKnot=_.TorusKnot,exports.Tube=_.Tube,exports.RoundedBox=J.RoundedBox,exports.ScreenQuad=Y.ScreenQuad,exports.Center=Z.Center,exports.Bounds=$.Bounds,exports.useBounds=$.useBounds,exports.CameraShake=ee.CameraShake,exports.Float=re.Float,exports.Stage=se.Stage,exports.Backdrop=oe.Backdrop,exports.Shadow=te.Shadow,exports.ContactShadows=ie.ContactShadows,exports.Reflector=ce.Reflector,exports.SpotLight=ue.SpotLight,exports.Environment=ae.Environment,exports.Sky=je.Sky,exports.calcPosFromAngles=je.calcPosFromAngles,exports.Stars=ne.Stars,exports.Cloud=pe.Cloud,exports.useMatcapTexture=le.useMatcapTexture,exports.useNormalTexture=xe.useNormalTexture,exports.Point=qe.Point,exports.Points=qe.Points,exports.PointsBuffer=qe.PointsBuffer,exports.Instance=de.Instance,exports.Instances=de.Instances,exports.Merged=de.Merged,exports.Segment=Ce.Segment,exports.Segments=Ce.Segments,exports.Detailed=he.Detailed,exports.Preload=me.Preload,exports.BakeShadows=Be.BakeShadows,exports.meshBounds=be.meshBounds,exports.AdaptiveDpr=Me.AdaptiveDpr,exports.AdaptiveEvents=Pe.AdaptiveEvents;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../core/Billboard.cjs.js"),r=require("../core/QuadraticBezierLine.cjs.js"),s=require("../core/CubicBezierLine.cjs.js"),o=require("../core/Line.cjs.js"),t=require("../core/PositionalAudio.cjs.js"),i=require("../core/Text.cjs.js"),c=require("../core/Effects.cjs.js"),u=require("../core/GradientTexture.cjs.js"),a=require("../core/Image.cjs.js"),n=require("../core/Edges.cjs.js"),j=require("../core/Trail.cjs.js"),p=require("../core/Sampler.cjs.js"),l=require("../core/ComputedAttribute.cjs.js"),x=require("../core/Clone.cjs.js"),q=require("../core/OrthographicCamera.cjs.js"),d=require("../core/PerspectiveCamera.cjs.js"),C=require("../core/CubeCamera.cjs.js"),m=require("../core/DeviceOrientationControls.cjs.js"),h=require("../core/FlyControls.cjs.js"),b=require("../core/MapControls.cjs.js"),B=require("../core/OrbitControls.cjs.js"),P=require("../core/TrackballControls.cjs.js"),S=require("../core/ArcballControls.cjs.js"),M=require("../core/TransformControls.cjs.js"),T=require("../core/PointerLockControls.cjs.js"),f=require("../core/FirstPersonControls.cjs.js"),g=require("../core/GizmoHelper.cjs.js"),v=require("../core/GizmoViewcube.cjs.js"),L=require("../core/GizmoViewport.cjs.js"),A=require("../core/useCubeTexture.cjs.js"),E=require("../core/useFBX.cjs.js"),G=require("../core/useGLTF.cjs.js"),k=require("../core/useProgress.cjs.js"),D=require("../core/useTexture.cjs.js"),F=require("../core/useKTX2.cjs.js"),w=require("../core/Stats.cjs.js"),z=require("../core/useDepthBuffer.cjs.js"),I=require("../core/useAspect.cjs.js"),O=require("../core/useCamera.cjs.js"),R=require("../core/useDetectGPU.cjs.js"),y=require("../core/useHelper.cjs.js"),H=require("../core/useBVH.cjs.js"),V=require("../core/useContextBridge.cjs.js"),Q=require("../core/useAnimations.cjs.js"),X=require("../core/useFBO.cjs.js"),K=require("../core/useIntersect.cjs.js"),W=require("../core/useBoxProjectedEnv.cjs.js"),N=require("../core/CurveModifier.cjs.js"),U=require("../core/MeshDistortMaterial.cjs.js"),_=require("../core/MeshWobbleMaterial.cjs.js"),J=require("../core/MeshReflectorMaterial.cjs.js"),Y=require("../core/PointMaterial.cjs.js"),Z=require("../core/shaderMaterial.cjs.js"),$=require("../core/softShadows.cjs.js"),ee=require("../core/shapes.cjs.js"),re=require("../core/RoundedBox.cjs.js"),se=require("../core/ScreenQuad.cjs.js"),oe=require("../core/Center.cjs.js"),te=require("../core/Bounds.cjs.js"),ie=require("../core/CameraShake.cjs.js"),ce=require("../core/Float.cjs.js"),ue=require("../core/Stage.cjs.js"),ae=require("../core/Backdrop.cjs.js"),ne=require("../core/Shadow.cjs.js"),je=require("../core/ContactShadows.cjs.js"),pe=require("../core/Reflector.cjs.js"),le=require("../core/SpotLight.cjs.js"),xe=require("../core/Environment.cjs.js"),qe=require("../core/Lightformer.cjs.js"),de=require("../core/Sky.cjs.js"),Ce=require("../core/Stars.cjs.js"),me=require("../core/Cloud.cjs.js"),he=require("../core/useMatcapTexture.cjs.js"),be=require("../core/useNormalTexture.cjs.js"),Be=require("../core/Points.cjs.js"),Pe=require("../core/Instances.cjs.js"),Se=require("../core/Segments.cjs.js"),Me=require("../core/Detailed.cjs.js"),Te=require("../core/Preload.cjs.js"),fe=require("../core/BakeShadows.cjs.js"),ge=require("../core/meshBounds.cjs.js"),ve=require("../core/AdaptiveDpr.cjs.js"),Le=require("../core/AdaptiveEvents.cjs.js");require("@babel/runtime/helpers/extends"),require("react"),require("@react-three/fiber"),require("react-merge-refs"),require("three"),require("three-stdlib"),require("troika-three-text"),require("suspend-react"),require("meshline"),require("lodash.pick"),require("lodash.omit"),require("zustand"),require("stats.js"),require("../helpers/useEffectfulState.cjs.js"),require("detect-gpu"),require("three-mesh-bvh"),require("../materials/BlurPass.cjs.js"),require("../materials/ConvolutionMaterial.cjs.js"),require("../materials/MeshReflectorMaterial.cjs.js"),require("../helpers/environment-assets.cjs.js"),require("../materials/SpotLightMaterial.cjs.js"),require("../helpers/Position.cjs.js"),require("react-composer"),exports.Billboard=e.Billboard,exports.QuadraticBezierLine=r.QuadraticBezierLine,exports.CubicBezierLine=s.CubicBezierLine,exports.Line=o.Line,exports.PositionalAudio=t.PositionalAudio,exports.Text=i.Text,exports.Effects=c.Effects,exports.isWebGL2Available=c.isWebGL2Available,exports.GradientTexture=u.GradientTexture,exports.Image=a.Image,exports.Edges=n.Edges,exports.Trail=j.Trail,exports.useTrail=j.useTrail,exports.Sampler=p.Sampler,exports.ComputedAttribute=l.ComputedAttribute,exports.Clone=x.Clone,exports.OrthographicCamera=q.OrthographicCamera,exports.PerspectiveCamera=d.PerspectiveCamera,exports.CubeCamera=C.CubeCamera,exports.DeviceOrientationControls=m.DeviceOrientationControls,exports.FlyControls=h.FlyControls,exports.MapControls=b.MapControls,exports.OrbitControls=B.OrbitControls,exports.TrackballControls=P.TrackballControls,exports.ArcballControls=S.ArcballControls,exports.TransformControls=M.TransformControls,exports.PointerLockControls=T.PointerLockControls,exports.FirstPersonControls=f.FirstPersonControls,exports.GizmoHelper=g.GizmoHelper,exports.useGizmoContext=g.useGizmoContext,exports.GizmoViewcube=v.GizmoViewcube,exports.GizmoViewport=L.GizmoViewport,exports.useCubeTexture=A.useCubeTexture,exports.useFBX=E.useFBX,exports.useGLTF=G.useGLTF,exports.useProgress=k.useProgress,exports.IsObject=D.IsObject,exports.useTexture=D.useTexture,exports.useKTX2=F.useKTX2,exports.Stats=w.Stats,exports.useDepthBuffer=z.useDepthBuffer,exports.useAspect=I.useAspect,exports.useCamera=O.useCamera,exports.useDetectGPU=R.useDetectGPU,exports.useHelper=y.useHelper,exports.useBVH=H.useBVH,exports.useContextBridge=V.useContextBridge,exports.useAnimations=Q.useAnimations,exports.useFBO=X.useFBO,exports.useIntersect=K.useIntersect,exports.useBoxProjectedEnv=W.useBoxProjectedEnv,exports.CurveModifier=N.CurveModifier,exports.MeshDistortMaterial=U.MeshDistortMaterial,exports.MeshWobbleMaterial=_.MeshWobbleMaterial,exports.MeshReflectorMaterial=J.MeshReflectorMaterial,exports.PointMaterial=Y.PointMaterial,exports.PointMaterialImpl=Y.PointMaterialImpl,exports.shaderMaterial=Z.shaderMaterial,exports.softShadows=$.softShadows,exports.Box=ee.Box,exports.Circle=ee.Circle,exports.Cone=ee.Cone,exports.Cylinder=ee.Cylinder,exports.Dodecahedron=ee.Dodecahedron,exports.Extrude=ee.Extrude,exports.Icosahedron=ee.Icosahedron,exports.Lathe=ee.Lathe,exports.Octahedron=ee.Octahedron,exports.Plane=ee.Plane,exports.Polyhedron=ee.Polyhedron,exports.Ring=ee.Ring,exports.Sphere=ee.Sphere,exports.Tetrahedron=ee.Tetrahedron,exports.Torus=ee.Torus,exports.TorusKnot=ee.TorusKnot,exports.Tube=ee.Tube,exports.RoundedBox=re.RoundedBox,exports.ScreenQuad=se.ScreenQuad,exports.Center=oe.Center,exports.Bounds=te.Bounds,exports.useBounds=te.useBounds,exports.CameraShake=ie.CameraShake,exports.Float=ce.Float,exports.Stage=ue.Stage,exports.Backdrop=ae.Backdrop,exports.Shadow=ne.Shadow,exports.ContactShadows=je.ContactShadows,exports.Reflector=pe.Reflector,exports.SpotLight=le.SpotLight,exports.Environment=xe.Environment,exports.EnvironmentCube=xe.EnvironmentCube,exports.EnvironmentMap=xe.EnvironmentMap,exports.EnvironmentPortal=xe.EnvironmentPortal,exports.Lightformer=qe.Lightformer,exports.Sky=de.Sky,exports.calcPosFromAngles=de.calcPosFromAngles,exports.Stars=Ce.Stars,exports.Cloud=me.Cloud,exports.useMatcapTexture=he.useMatcapTexture,exports.useNormalTexture=be.useNormalTexture,exports.Point=Be.Point,exports.Points=Be.Points,exports.PointsBuffer=Be.PointsBuffer,exports.Instance=Pe.Instance,exports.Instances=Pe.Instances,exports.Merged=Pe.Merged,exports.Segment=Se.Segment,exports.Segments=Se.Segments,exports.Detailed=Me.Detailed,exports.Preload=Te.Preload,exports.BakeShadows=fe.BakeShadows,exports.meshBounds=ge.meshBounds,exports.AdaptiveDpr=ve.AdaptiveDpr,exports.AdaptiveEvents=Le.AdaptiveEvents;

package/native/index.js

@@ -8,6 +8,10 @@ export { Effects, isWebGL2Available } from '../core/Effects.js';
 export { GradientTexture } from '../core/GradientTexture.js';
 export { Image } from '../core/Image.js';
 export { Edges } from '../core/Edges.js';
+export { Trail, useTrail } from '../core/Trail.js';
+export { Sampler } from '../core/Sampler.js';
+export { ComputedAttribute } from '../core/ComputedAttribute.js';
+export { Clone } from '../core/Clone.js';
 export { OrthographicCamera } from '../core/OrthographicCamera.js';
 export { PerspectiveCamera } from '../core/PerspectiveCamera.js';
 export { CubeCamera } from '../core/CubeCamera.js';
@@ -40,6 +44,7 @@ export { useContextBridge } from '../core/useContextBridge.js';
 export { useAnimations } from '../core/useAnimations.js';
 export { useFBO } from '../core/useFBO.js';
 export { useIntersect } from '../core/useIntersect.js';
+export { useBoxProjectedEnv } from '../core/useBoxProjectedEnv.js';
 export { CurveModifier } from '../core/CurveModifier.js';
 export { MeshDistortMaterial } from '../core/MeshDistortMaterial.js';
 export { MeshWobbleMaterial } from '../core/MeshWobbleMaterial.js';
@@ -60,7 +65,8 @@ export { Shadow } from '../core/Shadow.js';
 export { ContactShadows } from '../core/ContactShadows.js';
 export { Reflector } from '../core/Reflector.js';
 export { SpotLight } from '../core/SpotLight.js';
-export { Environment } from '../core/Environment.js';
+export { Environment, EnvironmentCube, EnvironmentMap, EnvironmentPortal } from '../core/Environment.js';
+export { Lightformer } from '../core/Lightformer.js';
 export { Sky, calcPosFromAngles } from '../core/Sky.js';
 export { Stars } from '../core/Stars.js';
 export { Cloud } from '../core/Cloud.js';
@@ -83,8 +89,9 @@ import 'three';
 import 'three-stdlib';
 import 'troika-three-text';
 import 'suspend-react';
-import 'lodash.omit';
+import 'meshline';
 import 'lodash.pick';
+import 'lodash.omit';
 import 'zustand';
 import 'stats.js';
 import '../helpers/useEffectfulState.js';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@react-three/drei",
-  "version": "9.0.0-beta.3",
+  "version": "9.0.0",
   "private": false,
   "description": "useful add-ons for react-three-fiber",
   "keywords": [
@@ -42,17 +42,18 @@
     "@babel/runtime": "^7.11.2",
     "@react-spring/three": "^9.3.1",
     "@use-gesture/react": "^10.2.0",
-    "detect-gpu": "^3.1.28",
+    "detect-gpu": "^4.0.14",
     "glsl-noise": "^0.0.0",
     "lodash.omit": "^4.5.0",
     "lodash.pick": "^4.4.0",
+    "meshline": "^2.0.4",
     "react-composer": "^5.0.2",
     "react-merge-refs": "^1.1.0",
     "stats.js": "^0.17.0",
     "suspend-react": "^0.0.8",
-    "three-mesh-bvh": "^0.5.4",
-    "three-stdlib": "^2.8.6",
-    "troika-three-text": "^0.45.0",
+    "three-mesh-bvh": "^0.5.7",
+    "three-stdlib": "^2.8.9",
+    "troika-three-text": "^0.46.3",
     "utility-types": "^3.10.0",
     "zustand": "^3.5.13"
   },

package/web/CycleRaycast.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),t=require("@react-three/fiber");function r(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 n=r(e);exports.CycleRaycast=function({onChanged:e,portal:r,preventDefault:o=!0,scroll:l=!0,keyCode:u=9}){const c=n.useRef(0),a=t.useThree((e=>e.raycaster)),d=t.useThree((e=>e.get)),i=t.useThree((e=>e.gl));return n.useEffect((()=>{var t;let n,s=[];const v=a.filter,f=null!==(t=null==r?void 0:r.current)&&void 0!==t?t:i.domElement.parentNode,h=()=>f&&e&&e(s,Math.round(c.current)%s.length);a.filter=(e,t)=>{let r=[...e];r.length===s.length&&s.every((e=>r.map((e=>e.object.uuid)).includes(e.object.uuid)))||(c.current=0,s=r,h()),v&&(r=v(r,t));for(let e=0;e<Math.round(c.current)%r.length;e++){const e=r.shift();r=[...r,e]}return r};const m=e=>{var t,r;c.current=e(c.current),null==(t=d().events.handlers)||t.onPointerCancel(void 0),null==(r=d().events.handlers)||r.onPointerMove(n),h()},p=e=>{(e.keyCode||e.which===u)&&(o&&e.preventDefault(),s.length>1&&m((e=>e+1)))},g=e=>{o&&e.preventDefault();let t=0;e||(e=window.event),e.wheelDelta?t=e.wheelDelta/120:e.detail&&(t=-e.detail/3),s.length>1&&m((e=>Math.abs(e-t)))},y=e=>n=e;return document.addEventListener("pointermove",y,{passive:!0}),l&&document.addEventListener("wheel",g),void 0!==u&&document.addEventListener("keydown",p),()=>{a.filter=v,void 0!==u&&document.removeEventListener("keydown",p),l&&document.removeEventListener("wheel",g),document.removeEventListener("pointermove",y)}}),[i,d,a,o,l,u]),null};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),t=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(n){if("default"!==n){var r=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(t,n,r.get?r:{enumerable:!0,get:function(){return e[n]}})}})),t.default=e,Object.freeze(t)}var r=n(e);exports.CycleRaycast=function({onChanged:e,portal:n,preventDefault:o=!0,scroll:l=!0,keyCode:u=9}){const c=r.useRef(0),d=t.useThree((e=>e.setEvents)),i=t.useThree((e=>e.get)),a=t.useThree((e=>e.gl));return r.useEffect((()=>{var t;let r,s=[];const v=i().events.filter,f=null!==(t=null==n?void 0:n.current)&&void 0!==t?t:a.domElement.parentNode,h=()=>f&&e&&e(s,Math.round(c.current)%s.length);d({filter:(e,t)=>{let n=[...e];n.length===s.length&&s.every((e=>n.map((e=>e.object.uuid)).includes(e.object.uuid)))||(c.current=0,s=n,h()),v&&(n=v(n,t));for(let e=0;e<Math.round(c.current)%n.length;e++){const e=n.shift();n=[...n,e]}return n}});const m=e=>{var t,n;c.current=e(c.current),null==(t=i().events.handlers)||t.onPointerCancel(void 0),null==(n=i().events.handlers)||n.onPointerMove(r),h()},p=e=>{(e.keyCode||e.which===u)&&(o&&e.preventDefault(),s.length>1&&m((e=>e+1)))},g=e=>{o&&e.preventDefault();let t=0;e||(e=window.event),e.wheelDelta?t=e.wheelDelta/120:e.detail&&(t=-e.detail/3),s.length>1&&m((e=>Math.abs(e-t)))},b=e=>r=e;return document.addEventListener("pointermove",b,{passive:!0}),l&&document.addEventListener("wheel",g),void 0!==u&&document.addEventListener("keydown",p),()=>{d({filter:v}),void 0!==u&&document.removeEventListener("keydown",p),l&&document.removeEventListener("wheel",g),document.removeEventListener("pointermove",b)}}),[a,i,d,o,l,u]),null};

package/web/CycleRaycast.js

@@ -9,7 +9,7 @@ function CycleRaycast({
   keyCode = 9
 }) {
   const cycle = React.useRef(0);
-  const raycaster = useThree(state => state.raycaster);
+  const setEvents = useThree(state => state.setEvents);
   const get = useThree(state => state.get);
   const gl = useThree(state => state.gl);
   React.useEffect(() => {
@@ -17,33 +17,34 @@ function CycleRaycast({
 
     let hits = [];
     let lastEvent = undefined;
-    const prev = raycaster.filter;
+    const prev = get().events.filter;
     const target = (_portal$current = portal == null ? void 0 : portal.current) !== null && _portal$current !== void 0 ? _portal$current : gl.domElement.parentNode; // Render custom status
 
     const renderStatus = () => target && onChanged && onChanged(hits, Math.round(cycle.current) % hits.length); // Overwrite the raycasters custom filter (this only exists in r3f)
 
 
-    raycaster.filter = (intersections, state) => {
-      // Reset cycle when the intersections change
-      let clone = [...intersections];
+    setEvents({
+      filter: (intersections, state) => {
+        // Reset cycle when the intersections change
+        let clone = [...intersections];
 
-      if (clone.length !== hits.length || !hits.every(hit => clone.map(e => e.object.uuid).includes(hit.object.uuid))) {
-        cycle.current = 0;
-        hits = clone;
-        renderStatus();
-      } // Run custom filter if there is one
+        if (clone.length !== hits.length || !hits.every(hit => clone.map(e => e.object.uuid).includes(hit.object.uuid))) {
+          cycle.current = 0;
+          hits = clone;
+          renderStatus();
+        } // Run custom filter if there is one
 
 
-      if (prev) clone = prev(clone, state); // Cycle through the actual raycast intersects
+        if (prev) clone = prev(clone, state); // Cycle through the actual raycast intersects
 
-      for (let i = 0; i < Math.round(cycle.current) % clone.length; i++) {
-        const first = clone.shift();
-        clone = [...clone, first];
-      }
-
-      return clone;
-    }; // Cycle, refresh events and render status
+        for (let i = 0; i < Math.round(cycle.current) % clone.length; i++) {
+          const first = clone.shift();
+          clone = [...clone, first];
+        }
 
+        return clone;
+      }
+    }); // Cycle, refresh events and render status
 
     const refresh = fn => {
       var _get$events$handlers, _get$events$handlers2;
@@ -82,12 +83,14 @@ function CycleRaycast({
     if (keyCode !== undefined) document.addEventListener('keydown', tabEvent);
     return () => {
       // Clean up
-      raycaster.filter = prev;
+      setEvents({
+        filter: prev
+      });
       if (keyCode !== undefined) document.removeEventListener('keydown', tabEvent);
       if (scroll) document.removeEventListener('wheel', wheelEvent);
       document.removeEventListener('pointermove', moveEvent);
     };
-  }, [gl, get, raycaster, preventDefault, scroll, keyCode]);
+  }, [gl, get, setEvents, preventDefault, scroll, keyCode]);
   return null;
 }
 

package/web/ScrollControls.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"),o=require("react-dom/client"),s=require("@react-three/fiber"),n=require("react-merge-refs");function l(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function i(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)}var f=l(e),c=i(t),a=i(r),u=i(o),d=l(n);const p=a.createContext(null);function h(){return a.useContext(p)}const m=a.forwardRef((({children:e},t)=>{const r=a.useRef(null),o=h(),{width:n,height:l}=s.useThree((e=>e.viewport));return s.useFrame((()=>{r.current.position.x=o.horizontal?-n*(o.pages-1)*o.offset:0,r.current.position.y=o.horizontal?0:l*(o.pages-1)*o.offset})),a.createElement("group",{ref:d.default([t,r])},e)})),v=a.forwardRef((({children:e,style:t,...r},o)=>{const n=h(),l=a.useRef(null),{width:i,height:c}=s.useThree((e=>e.size)),m=a.useContext(s.context),v=a.useMemo((()=>u.createRoot(n.fixed)),[n.fixed]);return s.useFrame((()=>{n.delta>n.eps&&(l.current.style.transform=`translate3d(${n.horizontal?-i*(n.pages-1)*n.offset:0}px,${n.horizontal?0:c*(n.pages-1)*-n.offset}px,0)`)})),v.render(a.createElement("div",f.default({ref:d.default([o,l]),style:{...t,position:"absolute",top:0,left:0,willChange:"transform"}},r),a.createElement(p.Provider,{value:n},a.createElement(s.context.Provider,{value:m},e)))),null})),y=a.forwardRef((({html:e,...t},r)=>{const o=e?v:m;return a.createElement(o,f.default({ref:r},t))}));exports.Scroll=y,exports.ScrollControls=function({eps:e=1e-5,enabled:t=!0,infinite:r,horizontal:o,pages:n=1,distance:l=1,damping:i=4,style:f={},children:u}){const{gl:d,size:h,invalidate:m,events:v,raycaster:y}=s.useThree(),[g]=a.useState((()=>document.createElement("div"))),[x]=a.useState((()=>document.createElement("div"))),[w]=a.useState((()=>document.createElement("div"))),E=d.domElement.parentNode,b=a.useRef(0),L=a.useMemo((()=>({el:g,eps:e,fill:x,fixed:w,horizontal:o,damping:i,offset:0,delta:0,scroll:b,pages:n,range(e,t,r=0){const o=e-r,s=o+t+2*r;return this.offset<o?0:this.offset>s?1:(this.offset-o)/(s-o)},curve(e,t,r=0){return Math.sin(this.range(e,t,r)*Math.PI)},visible(e,t,r=0){const o=e-r,s=o+t+2*r;return this.offset>=o&&this.offset<=s}})),[e,i,o,n]);a.useEffect((()=>{g.style.position="absolute",g.style.width="100%",g.style.height="100%",g.style[o?"overflowX":"overflowY"]="auto",g.style[o?"overflowY":"overflowX"]="hidden",g.style.top="0px",g.style.left="0px";for(const e in f)g.style[e]=f[e];w.style.position="sticky",w.style.top="0px",w.style.left="0px",w.style.width="100%",w.style.height="100%",w.style.overflow="hidden",g.appendChild(w),x.style.height=o?"100%":n*l*100+"%",x.style.width=o?n*l*100+"%":"100%",x.style.pointerEvents="none",g.appendChild(x),E.appendChild(g),g[o?"scrollLeft":"scrollTop"]=1;const e="boolean"!=typeof v.connected?v.connected:d.domElement;requestAnimationFrame((()=>null==v.connect?void 0:v.connect(g)));const t=y.computeOffsets;return y.computeOffsets=({clientX:e,clientY:t})=>({offsetX:e-E.offsetLeft,offsetY:t-E.offsetTop}),()=>{E.removeChild(g),y.computeOffsets=t,null==v.connect||v.connect(e)}}),[n,l,o,g,x,w,E]),a.useEffect((()=>{const e=h[o?"width":"height"],s=g[o?"scrollWidth":"scrollHeight"],n=s-e;let l=0,i=!0,f=!0;const c=()=>{if(t&&!f&&(m(),l=g[o?"scrollLeft":"scrollTop"],b.current=l/n,r)){if(!i)if(l>=n){const e=1-L.offset;g[o?"scrollLeft":"scrollTop"]=1,b.current=L.offset=-e,i=!0}else if(l<=0){const e=1+L.offset;g[o?"scrollLeft":"scrollTop"]=s,b.current=L.offset=e,i=!0}i&&setTimeout((()=>i=!1),40)}};g.addEventListener("scroll",c,{passive:!0}),requestAnimationFrame((()=>f=!1));const a=e=>g.scrollLeft+=e.deltaY/2;return o&&g.addEventListener("wheel",a,{passive:!0}),()=>{g.removeEventListener("scroll",c),o&&g.removeEventListener("wheel",a)}}),[g,h,r,L,m,o]);let O=0;return s.useFrame(((t,r)=>{L.offset=c.MathUtils.damp(O=L.offset,b.current,i,r),L.delta=c.MathUtils.damp(L.delta,Math.abs(O-L.offset),i,r),L.delta>e&&m()})),a.createElement(p.Provider,{value:L},u)},exports.useScroll=h;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@babel/runtime/helpers/extends"),t=require("three"),r=require("react"),o=require("react-dom/client"),s=require("@react-three/fiber"),n=require("react-merge-refs");function l(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function i(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)}var a=l(e),c=i(t),f=i(r),u=i(o),d=l(n);const h=f.createContext(null);function p(){return f.useContext(h)}const m=f.forwardRef((({children:e},t)=>{const r=f.useRef(null),o=p(),{width:n,height:l}=s.useThree((e=>e.viewport));return s.useFrame((()=>{r.current.position.x=o.horizontal?-n*(o.pages-1)*o.offset:0,r.current.position.y=o.horizontal?0:l*(o.pages-1)*o.offset})),f.createElement("group",{ref:d.default([t,r])},e)})),v=f.forwardRef((({children:e,style:t,...r},o)=>{const n=p(),l=f.useRef(null),{width:i,height:c}=s.useThree((e=>e.size)),m=f.useContext(s.context),v=f.useMemo((()=>u.createRoot(n.fixed)),[n.fixed]);return s.useFrame((()=>{n.delta>n.eps&&(l.current.style.transform=`translate3d(${n.horizontal?-i*(n.pages-1)*n.offset:0}px,${n.horizontal?0:c*(n.pages-1)*-n.offset}px,0)`)})),v.render(f.createElement("div",a.default({ref:d.default([o,l]),style:{...t,position:"absolute",top:0,left:0,willChange:"transform"}},r),f.createElement(h.Provider,{value:n},f.createElement(s.context.Provider,{value:m},e)))),null})),y=f.forwardRef((({html:e,...t},r)=>{const o=e?v:m;return f.createElement(o,a.default({ref:r},t))}));exports.Scroll=y,exports.ScrollControls=function({eps:e=1e-5,enabled:t=!0,infinite:r,horizontal:o,pages:n=1,distance:l=1,damping:i=4,style:a={},children:u}){const{get:d,setEvents:p,gl:m,size:v,invalidate:y,events:g,raycaster:w}=s.useThree(),[x]=f.useState((()=>document.createElement("div"))),[E]=f.useState((()=>document.createElement("div"))),[b]=f.useState((()=>document.createElement("div"))),z=m.domElement.parentNode,L=f.useRef(0),C=f.useMemo((()=>{const t={el:x,eps:e,fill:E,fixed:b,horizontal:o,damping:i,offset:0,delta:0,scroll:L,pages:n,range(e,t,r=0){const o=e-r,s=o+t+2*r;return this.offset<o?0:this.offset>s?1:(this.offset-o)/(s-o)},curve(e,t,r=0){return Math.sin(this.range(e,t,r)*Math.PI)},visible(e,t,r=0){const o=e-r,s=o+t+2*r;return this.offset>=o&&this.offset<=s}};return t}),[e,i,o,n]);f.useEffect((()=>{x.style.position="absolute",x.style.width="100%",x.style.height="100%",x.style[o?"overflowX":"overflowY"]="auto",x.style[o?"overflowY":"overflowX"]="hidden",x.style.top="0px",x.style.left="0px";for(const e in a)x.style[e]=a[e];b.style.position="sticky",b.style.top="0px",b.style.left="0px",b.style.width="100%",b.style.height="100%",b.style.overflow="hidden",x.appendChild(b),E.style.height=o?"100%":n*l*100+"%",E.style.width=o?n*l*100+"%":"100%",E.style.pointerEvents="none",x.appendChild(E),z.appendChild(x),x[o?"scrollLeft":"scrollTop"]=1;const e=g.connected||m.domElement;requestAnimationFrame((()=>null==g.connect?void 0:g.connect(x)));const t=d().events.compute;return p({compute(e,t){const r=e.clientX-e.target.offsetLeft,o=e.clientX-e.target.offsetLeft;t.pointer.set(r/t.size.width*2-1,-o/t.size.height*2+1),t.raycaster.setFromCamera(t.pointer,t.camera)}}),()=>{z.removeChild(x),p({compute:t}),null==g.connect||g.connect(e)}}),[n,l,o,x,E,b,z]),f.useEffect((()=>{const e=v[o?"width":"height"],s=x[o?"scrollWidth":"scrollHeight"],n=s-e;let l=0,i=!0,a=!0;const c=()=>{if(t&&!a&&(y(),l=x[o?"scrollLeft":"scrollTop"],L.current=l/n,r)){if(!i)if(l>=n){const e=1-C.offset;x[o?"scrollLeft":"scrollTop"]=1,L.current=C.offset=-e,i=!0}else if(l<=0){const e=1+C.offset;x[o?"scrollLeft":"scrollTop"]=s,L.current=C.offset=e,i=!0}i&&setTimeout((()=>i=!1),40)}};x.addEventListener("scroll",c,{passive:!0}),requestAnimationFrame((()=>a=!1));const f=e=>x.scrollLeft+=e.deltaY/2;return o&&x.addEventListener("wheel",f,{passive:!0}),()=>{x.removeEventListener("scroll",c),o&&x.removeEventListener("wheel",f)}}),[x,v,r,C,y,o,t]);let M=0;return s.useFrame(((t,r)=>{C.offset=c.MathUtils.damp(M=C.offset,L.current,i,r),C.delta=c.MathUtils.damp(C.delta,Math.abs(M-C.offset),i,r),C.delta>e&&y()})),f.createElement(h.Provider,{value:C},u)},exports.useScroll=p;

package/web/ScrollControls.js

@@ -21,6 +21,8 @@ function ScrollControls({
   children
 }) {
   const {
+    get,
+    setEvents,
     gl,
     size,
     invalidate,
@@ -94,21 +96,23 @@ function ScrollControls({
     target.appendChild(el); // Init scroll one pixel in to allow upward/leftward scroll
 
     el[horizontal ? 'scrollLeft' : 'scrollTop'] = 1;
-    const oldTarget = typeof events.connected !== 'boolean' ? events.connected : gl.domElement;
+    const oldTarget = events.connected || gl.domElement;
     requestAnimationFrame(() => events.connect == null ? void 0 : events.connect(el));
-    const oldCompute = raycaster.computeOffsets;
-
-    raycaster.computeOffsets = ({
-      clientX,
-      clientY
-    }) => ({
-      offsetX: clientX - target.offsetLeft,
-      offsetY: clientY - target.offsetTop
-    });
+    const oldCompute = get().events.compute;
+    setEvents({
+      compute(event, state) {
+        const offsetX = event.clientX - event.target.offsetLeft;
+        const offsetY = event.clientX - event.target.offsetLeft;
+        state.pointer.set(offsetX / state.size.width * 2 - 1, -(offsetY / state.size.height) * 2 + 1);
+        state.raycaster.setFromCamera(state.pointer, state.camera);
+      }
 
+    });
     return () => {
       target.removeChild(el);
-      raycaster.computeOffsets = oldCompute;
+      setEvents({
+        compute: oldCompute
+      });
       events.connect == null ? void 0 : events.connect(oldTarget);
     };
   }, [pages, distance, horizontal, el, fill, fixed, target]);
@@ -160,7 +164,7 @@ function ScrollControls({
       el.removeEventListener('scroll', onScroll);
       if (horizontal) el.removeEventListener('wheel', onWheel);
     };
-  }, [el, size, infinite, state, invalidate, horizontal]);
+  }, [el, size, infinite, state, invalidate, horizontal, enabled]);
   let last = 0;
   useFrame((_, delta) => {
     state.offset = THREE.MathUtils.damp(last = state.offset, scroll.current, damping, delta);

package/web/Select.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@babel/runtime/helpers/extends"),t=require("react"),n=require("three"),r=require("three-stdlib"),o=require("@react-three/fiber"),i=require("zustand/shallow");function l(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(n){if("default"!==n){var r=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(t,n,r.get?r:{enumerable:!0,get:function(){return e[n]}})}})),t.default=e,Object.freeze(t)}var u=l(e),c=s(t),a=s(n),d=l(i);const f=c.createContext([]);exports.Select=function({box:e,multiple:t,children:n,onChange:i,border:l="1px solid #55aaff",backgroundColor:s="rgba(75, 160, 255, 0.1)",filter:p=(e=>e),...v}){const{camera:b,raycaster:m,gl:y,controls:h,size:x,get:E}=o.useThree(),[g,j]=c.useState(!1),[w,O]=c.useReducer(((e,{object:t,shift:n})=>void 0===t?[]:Array.isArray(t)?t:n?e.includes(t)?e.filter((e=>e!==t)):[t,...e]:e[0]===t?[]:[t]),[]);c.useEffect((()=>{null==i||i(w)}),[w]);const C=c.useCallback((e=>{e.stopPropagation(),O({object:p([e.object])[0],shift:t&&e.shiftKey})}),[]),P=c.useCallback((e=>!g&&O({})),[g]),M=c.useRef(null);return c.useEffect((()=>{if(!e||!t)return;const n=new r.SelectionBox(b,M.current),o=document.createElement("div");o.style.pointerEvents="none",o.style.border=l,o.style.backgroundColor=s,o.style.position="fixed";const i=new a.Vector2,u=new a.Vector2,c=new a.Vector2,f=m.enabled,v=null==h?void 0:h.enabled;let g=!1;function j(e,t){var n;const{offsetX:r,offsetY:o}=null!==(n=null==m.computeOffsets?void 0:m.computeOffsets(e,E()))&&void 0!==n?n:e,{width:i,height:l}=x;t.set(r/i*2-1,-o/l*2+1)}function w(e){e.shiftKey&&(!function(e){var t;h&&(h.enabled=!1),m.enabled=!1,g=!0,null==(t=y.domElement.parentElement)||t.appendChild(o),o.style.left=`${e.clientX}px`,o.style.top=`${e.clientY}px`,o.style.width="0px",o.style.height="0px",i.x=e.clientX,i.y=e.clientY}(e),j(e,n.startPoint))}let C=[];function P(e){if(g){!function(e){c.x=Math.max(i.x,e.clientX),c.y=Math.max(i.y,e.clientY),u.x=Math.min(i.x,e.clientX),u.y=Math.min(i.y,e.clientY),o.style.left=`${u.x}px`,o.style.top=`${u.y}px`,o.style.width=c.x-u.x+"px",o.style.height=c.y-u.y+"px"}(e),j(e,n.endPoint);const t=n.select().sort((e=>e.uuid)).filter((e=>e.isMesh));d.default(t,C)||(C=t,O({object:p(t)}))}}function k(e){var t;g&&g&&(h&&(h.enabled=v),m.enabled=f,g=!1,null==(t=o.parentElement)||t.removeChild(o))}return document.addEventListener("pointerdown",w,{passive:!0}),document.addEventListener("pointermove",P,{passive:!0,capture:!0}),document.addEventListener("pointerup",k,{passive:!0}),()=>{document.removeEventListener("pointerdown",w),document.removeEventListener("pointermove",P),document.removeEventListener("pointerup",k)}}),[x,m,b,h,y]),c.createElement("group",u.default({ref:M,onClick:C,onPointerOver:()=>j(!0),onPointerOut:()=>j(!1),onPointerMissed:P},v),c.createElement(f.Provider,{value:w},n))},exports.useSelect=function(){return c.useContext(f)};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@babel/runtime/helpers/extends"),t=require("react"),n=require("three"),r=require("three-stdlib"),o=require("@react-three/fiber"),i=require("zustand/shallow");function l(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(n){if("default"!==n){var r=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(t,n,r.get?r:{enumerable:!0,get:function(){return e[n]}})}})),t.default=e,Object.freeze(t)}var c=l(e),u=s(t),a=s(n),d=l(i);const f=u.createContext([]);exports.Select=function({box:e,multiple:t,children:n,onChange:i,border:l="1px solid #55aaff",backgroundColor:s="rgba(75, 160, 255, 0.1)",filter:p=(e=>e),...v}){const{setEvents:b,camera:y,raycaster:h,gl:m,controls:x,size:E,get:g}=o.useThree(),[j,w]=u.useState(!1),[C,P]=u.useReducer(((e,{object:t,shift:n})=>void 0===t?[]:Array.isArray(t)?t:n?e.includes(t)?e.filter((e=>e!==t)):[t,...e]:e[0]===t?[]:[t]),[]);u.useEffect((()=>{null==i||i(C)}),[C]);const O=u.useCallback((e=>{e.stopPropagation(),P({object:p([e.object])[0],shift:t&&e.shiftKey})}),[]),M=u.useCallback((e=>!j&&P({})),[j]),k=u.useRef(null);return u.useEffect((()=>{if(!e||!t)return;const n=new r.SelectionBox(y,k.current),o=document.createElement("div");o.style.pointerEvents="none",o.style.border=l,o.style.backgroundColor=s,o.style.position="fixed";const i=new a.Vector2,c=new a.Vector2,u=new a.Vector2,f=g().events.enabled,v=null==x?void 0:x.enabled;let h=!1;function j(e,t){const{offsetX:n,offsetY:r}=e,{width:o,height:i}=E;t.set(n/o*2-1,-r/i*2+1)}function w(e){e.shiftKey&&(!function(e){var t;x&&(x.enabled=!1),b({enabled:!1}),h=!0,null==(t=m.domElement.parentElement)||t.appendChild(o),o.style.left=`${e.clientX}px`,o.style.top=`${e.clientY}px`,o.style.width="0px",o.style.height="0px",i.x=e.clientX,i.y=e.clientY}(e),j(e,n.startPoint))}let C=[];function O(e){if(h){!function(e){u.x=Math.max(i.x,e.clientX),u.y=Math.max(i.y,e.clientY),c.x=Math.min(i.x,e.clientX),c.y=Math.min(i.y,e.clientY),o.style.left=`${c.x}px`,o.style.top=`${c.y}px`,o.style.width=u.x-c.x+"px",o.style.height=u.y-c.y+"px"}(e),j(e,n.endPoint);const t=n.select().sort((e=>e.uuid)).filter((e=>e.isMesh));d.default(t,C)||(C=t,P({object:p(t)}))}}function M(e){var t;h&&h&&(x&&(x.enabled=v),b({enabled:f}),h=!1,null==(t=o.parentElement)||t.removeChild(o))}return document.addEventListener("pointerdown",w,{passive:!0}),document.addEventListener("pointermove",O,{passive:!0,capture:!0}),document.addEventListener("pointerup",M,{passive:!0}),()=>{document.removeEventListener("pointerdown",w),document.removeEventListener("pointermove",O),document.removeEventListener("pointerup",M)}}),[E,h,y,x,m]),u.createElement("group",c.default({ref:k,onClick:O,onPointerOver:()=>w(!0),onPointerOut:()=>w(!1),onPointerMissed:M},v),u.createElement(f.Provider,{value:C},n))},exports.useSelect=function(){return u.useContext(f)};

package/web/Select.js

@@ -17,6 +17,7 @@ function Select({
   ...props
 }) {
   const {
+    setEvents,
     camera,
     raycaster,
     gl,
@@ -52,19 +53,15 @@ function Select({
     const startPoint = new THREE.Vector2();
     const pointTopLeft = new THREE.Vector2();
     const pointBottomRight = new THREE.Vector2();
-    const oldRaycasterEnabled = raycaster.enabled;
+    const oldRaycasterEnabled = get().events.enabled;
     const oldControlsEnabled = controls == null ? void 0 : controls.enabled;
     let isDown = false;
 
     function prepareRay(event, vec) {
-      var _raycaster$computeOff;
-
-      // https://github.com/pmndrs/react-three-fiber/pull/782
-      // Events trigger outside of canvas when moved
       const {
         offsetX,
         offsetY
-      } = (_raycaster$computeOff = raycaster.computeOffsets == null ? void 0 : raycaster.computeOffsets(event, get())) !== null && _raycaster$computeOff !== void 0 ? _raycaster$computeOff : event;
+      } = event;
       const {
         width,
         height
@@ -76,7 +73,9 @@ function Select({
       var _gl$domElement$parent;
 
       if (controls) controls.enabled = false;
-      raycaster.enabled = false;
+      setEvents({
+        enabled: false
+      });
       isDown = true;
       (_gl$domElement$parent = gl.domElement.parentElement) == null ? void 0 : _gl$domElement$parent.appendChild(element);
       element.style.left = `${event.clientX}px`;
@@ -103,7 +102,9 @@ function Select({
         var _element$parentElemen;
 
         if (controls) controls.enabled = oldControlsEnabled;
-        raycaster.enabled = oldRaycasterEnabled;
+        setEvents({
+          enabled: oldRaycasterEnabled
+        });
         isDown = false;
         (_element$parentElemen = element.parentElement) == null ? void 0 : _element$parentElemen.removeChild(element);
       }