@react-three/drei 9.56.27 → 9.57.0

package/README.md

@@ -415,7 +415,7 @@ Scroll controls create a HTML scroll container in front of the canvas. Everythin
 You can listen and react to scroll with the `useScroll` hook which gives you useful data like the current scroll `offset`, `delta` and functions for range finding: `range`, `curve` and `visible`. The latter functions are especially useful if you want to react to the scroll offset, for instance if you wanted to fade things in and out if they are in or out of view.
 
 ```jsx
-<ScrollControls pages={3} damping={0.1}>
+;<ScrollControls pages={3} damping={0.1}>
   {/* Canvas contents in here will *not* scroll, but receive useScroll! */}
   <SomeModel />
   <Scroll>
@@ -1653,13 +1653,25 @@ Antialiased round dots. It takes the same props as regular [THREE.PointsMaterial
 #### SoftShadows
 
 <p>
+  <a href="https://codesandbox.io/s/ykfpwf"><img width="20%" src="https://codesandbox.io/api/v1/sandboxes/ykfpwf/screenshot.png" alt="Demo"/></a>
   <a href="https://codesandbox.io/s/dh2jc"><img width="20%" src="https://codesandbox.io/api/v1/sandboxes/dh2jc/screenshot.png" alt="Demo"/></a>
 </p>
 
-Injects [percent closer soft shadows (pcss)](https://threejs.org/examples/#webgl_shadowmap_pcss) into threes shader chunk. Mounting and unmounting this component will lead to all shaders being be re-compiled, although it will only cause overhead if SoftShadows is mounted after the scene has already rendered, if it mounts with everything else in your scene shaders will compile naturally.
+```tsx
+type SoftShadowsProps = {
+  /** Size of the light source (the larger the softer the light), default: 25 */
+  size?: number
+  /** Number of samples (more samples less noise but more expensive), default: 10 */
+  samples?: number
+  /** Depth focus, use it to shift the focal point (where the shadow is the sharpest), default: 0 (the beginning) */
+  focus?: number
+}
+```
+
+Injects percent closer soft shadows (pcss) into threes shader chunk. Mounting and unmounting this component will lead to all shaders being be re-compiled, although it will only cause overhead if SoftShadows is mounted after the scene has already rendered, if it mounts with everything else in your scene shaders will compile naturally.
 
 ```jsx
-<SoftShadows frustum={3.75} size={0.005} near={9.5} samples={17} rings={11} />
+<SoftShadows />
 ```
 
 #### shaderMaterial

package/core/Caustics.js

@@ -298,8 +298,7 @@ const Caustics = /*#__PURE__*/React.forwardRef(({
       causticsMaterial.cameraProjectionMatrixInv = camera.current.projectionMatrixInverse;
       causticsMaterial.lightDir = lightDirInv;
       causticsMaterial.lightPlaneNormal = dirLightNearPlane.normal;
-      causticsMaterial.lightPlaneConstant = dirLightNearPlane.constant; //console.log(causticsMaterial.lightDir)
-
+      causticsMaterial.lightPlaneConstant = dirLightNearPlane.constant;
       causticsMaterial.near = camera.current.near;
       causticsMaterial.far = camera.current.far;
       causticsMaterial.resolution = resolution;

package/core/Sparkles.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@babel/runtime/helpers/extends"),t=require("react"),r=require("three"),o=require("@react-three/fiber"),i=require("./shaderMaterial.cjs.js");function n(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function a(e){if(e&&e.__esModule)return e;var t=Object.create(null);return e&&Object.keys(e).forEach((function(r){if("default"!==r){var 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 l=n(e),s=a(t),c=a(r);const u=i.shaderMaterial({time:0,pixelRatio:1}," uniform float pixelRatio;\n    uniform float time;\n    attribute float size;  \n    attribute float speed;  \n    attribute float opacity;\n    attribute vec3 noise;\n    attribute vec3 color;\n    varying vec3 vColor;\n    varying float vOpacity;\n    void main() {\n      vec4 modelPosition = modelMatrix * vec4(position, 1.0);\n      modelPosition.y += sin(time * speed + modelPosition.x * noise.x * 100.0) * 0.2;\n      modelPosition.z += cos(time * speed + modelPosition.x * noise.y * 100.0) * 0.2;\n      modelPosition.x += cos(time * speed + modelPosition.x * noise.z * 100.0) * 0.2;\n      vec4 viewPosition = viewMatrix * modelPosition;\n      vec4 projectionPostion = projectionMatrix * viewPosition;\n      gl_Position = projectionPostion;\n      gl_PointSize = size * 25. * pixelRatio;\n      gl_PointSize *= (1.0 / - viewPosition.z);\n      vColor = color;\n      vOpacity = opacity;\n    }"," varying vec3 vColor;\n    varying float vOpacity;\n    void main() {\n      float distanceToCenter = distance(gl_PointCoord, vec2(0.5));\n      float strength = 0.05 / distanceToCenter - 0.1;\n      gl_FragColor = vec4(vColor, strength * vOpacity);\n      #include <tonemapping_fragment>\n      #include <encodings_fragment>\n    }"),f=e=>e&&e.constructor===Float32Array,m=e=>e instanceof c.Vector2||e instanceof c.Vector3||e instanceof c.Vector4,d=e=>Array.isArray(e)?e:m(e)?e.toArray():[e,e,e];function p(e,t,r){return s.useMemo((()=>{if(void 0!==t){if(f(t))return t;if(t instanceof c.Color){const r=Array.from({length:3*e},(()=>{return[(e=t).r,e.g,e.b];var e})).flat();return Float32Array.from(r)}if(m(t)||Array.isArray(t)){const r=Array.from({length:3*e},(()=>d(t))).flat();return Float32Array.from(r)}return Float32Array.from({length:e},(()=>t))}return Float32Array.from({length:e},r)}),[t])}const v=s.forwardRef((({noise:e=1,count:t=100,speed:r=1,opacity:i=1,scale:n=1,size:a,color:m,children:v,...b},y)=>{s.useMemo((()=>o.extend({SparklesImplMaterial:u})),[]);const g=s.useRef(null),h=o.useThree((e=>e.viewport.dpr)),A=s.useMemo((()=>Float32Array.from(Array.from({length:t},(()=>d(n).map(c.MathUtils.randFloatSpread))).flat())),[t,n]),P=p(t,a,Math.random),x=p(t,i),M=p(t,r),j=p(3*t,e),O=p(void 0===m?3*t:t,f(m)?m:new c.Color(m),(()=>1));return console.log(O),o.useFrame((e=>{g.current&&g.current.material&&(g.current.material.time=e.clock.elapsedTime)})),s.useImperativeHandle(y,(()=>g.current),[]),s.createElement("points",l.default({key:`particle-${t}-${JSON.stringify(n)}`},b,{ref:g}),s.createElement("bufferGeometry",null,s.createElement("bufferAttribute",{attach:"attributes-position",args:[A,3]}),s.createElement("bufferAttribute",{attach:"attributes-size",args:[P,1]}),s.createElement("bufferAttribute",{attach:"attributes-opacity",args:[x,1]}),s.createElement("bufferAttribute",{attach:"attributes-speed",args:[M,1]}),s.createElement("bufferAttribute",{attach:"attributes-color",args:[O,3]}),s.createElement("bufferAttribute",{attach:"attributes-noise",args:[j,3]})),v||s.createElement("sparklesImplMaterial",{transparent:!0,pixelRatio:h,depthWrite:!1}))}));exports.Sparkles=v;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@babel/runtime/helpers/extends"),t=require("react"),r=require("three"),o=require("@react-three/fiber"),i=require("./shaderMaterial.cjs.js");function n(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function a(e){if(e&&e.__esModule)return e;var t=Object.create(null);return e&&Object.keys(e).forEach((function(r){if("default"!==r){var 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 l=n(e),s=a(t),c=a(r);const u=i.shaderMaterial({time:0,pixelRatio:1}," uniform float pixelRatio;\n    uniform float time;\n    attribute float size;  \n    attribute float speed;  \n    attribute float opacity;\n    attribute vec3 noise;\n    attribute vec3 color;\n    varying vec3 vColor;\n    varying float vOpacity;\n    void main() {\n      vec4 modelPosition = modelMatrix * vec4(position, 1.0);\n      modelPosition.y += sin(time * speed + modelPosition.x * noise.x * 100.0) * 0.2;\n      modelPosition.z += cos(time * speed + modelPosition.x * noise.y * 100.0) * 0.2;\n      modelPosition.x += cos(time * speed + modelPosition.x * noise.z * 100.0) * 0.2;\n      vec4 viewPosition = viewMatrix * modelPosition;\n      vec4 projectionPostion = projectionMatrix * viewPosition;\n      gl_Position = projectionPostion;\n      gl_PointSize = size * 25. * pixelRatio;\n      gl_PointSize *= (1.0 / - viewPosition.z);\n      vColor = color;\n      vOpacity = opacity;\n    }"," varying vec3 vColor;\n    varying float vOpacity;\n    void main() {\n      float distanceToCenter = distance(gl_PointCoord, vec2(0.5));\n      float strength = 0.05 / distanceToCenter - 0.1;\n      gl_FragColor = vec4(vColor, strength * vOpacity);\n      #include <tonemapping_fragment>\n      #include <encodings_fragment>\n    }"),f=e=>e&&e.constructor===Float32Array,m=e=>e instanceof c.Vector2||e instanceof c.Vector3||e instanceof c.Vector4,d=e=>Array.isArray(e)?e:m(e)?e.toArray():[e,e,e];function p(e,t,r){return s.useMemo((()=>{if(void 0!==t){if(f(t))return t;if(t instanceof c.Color){const r=Array.from({length:3*e},(()=>{return[(e=t).r,e.g,e.b];var e})).flat();return Float32Array.from(r)}if(m(t)||Array.isArray(t)){const r=Array.from({length:3*e},(()=>d(t))).flat();return Float32Array.from(r)}return Float32Array.from({length:e},(()=>t))}return Float32Array.from({length:e},r)}),[t])}const v=s.forwardRef((({noise:e=1,count:t=100,speed:r=1,opacity:i=1,scale:n=1,size:a,color:m,children:v,...b},y)=>{s.useMemo((()=>o.extend({SparklesImplMaterial:u})),[]);const g=s.useRef(null),h=o.useThree((e=>e.viewport.dpr)),A=s.useMemo((()=>Float32Array.from(Array.from({length:t},(()=>d(n).map(c.MathUtils.randFloatSpread))).flat())),[t,n]),P=p(t,a,Math.random),x=p(t,i),M=p(t,r),j=p(3*t,e),O=p(void 0===m?3*t:t,f(m)?m:new c.Color(m),(()=>1));return o.useFrame((e=>{g.current&&g.current.material&&(g.current.material.time=e.clock.elapsedTime)})),s.useImperativeHandle(y,(()=>g.current),[]),s.createElement("points",l.default({key:`particle-${t}-${JSON.stringify(n)}`},b,{ref:g}),s.createElement("bufferGeometry",null,s.createElement("bufferAttribute",{attach:"attributes-position",args:[A,3]}),s.createElement("bufferAttribute",{attach:"attributes-size",args:[P,1]}),s.createElement("bufferAttribute",{attach:"attributes-opacity",args:[x,1]}),s.createElement("bufferAttribute",{attach:"attributes-speed",args:[M,1]}),s.createElement("bufferAttribute",{attach:"attributes-color",args:[O,3]}),s.createElement("bufferAttribute",{attach:"attributes-noise",args:[j,3]})),v||s.createElement("sparklesImplMaterial",{transparent:!0,pixelRatio:h,depthWrite:!1}))}));exports.Sparkles=v;

package/core/Sparkles.js

@@ -103,7 +103,6 @@ const Sparkles = /*#__PURE__*/React.forwardRef(({
   const speeds = usePropAsIsOrAsAttribute(count, speed);
   const noises = usePropAsIsOrAsAttribute(count * 3, noise);
   const colors = usePropAsIsOrAsAttribute(color === undefined ? count * 3 : count, !isFloat32Array(color) ? new THREE.Color(color) : color, () => 1);
-  console.log(colors);
   useFrame(state => {
     if (ref.current && ref.current.material) ref.current.material.time = state.clock.elapsedTime;
   });

package/core/SpotLight.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@babel/runtime/helpers/extends"),t=require("react"),r=require("three"),a=require("@react-three/fiber"),n=require("three-stdlib"),o=require("react-merge-refs"),i=require("../materials/SpotLightMaterial.cjs.js");function u(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function l(e){if(e&&e.__esModule)return e;var t=Object.create(null);return e&&Object.keys(e).forEach((function(r){if("default"!==r){var a=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(t,r,a.get?a:{enumerable:!0,get:function(){return e[r]}})}})),t.default=e,Object.freeze(t)}var c=u(e),s=l(t),p=u(o);function d({opacity:e=1,radiusTop:t,radiusBottom:n,depthBuffer:o,color:u="white",distance:l=5,angle:c=.15,attenuation:p=5,anglePower:d=5}){const m=s.useRef(null),h=a.useThree((e=>e.size)),f=a.useThree((e=>e.camera)),g=a.useThree((e=>e.viewport.dpr)),[v]=s.useState((()=>new i.SpotLightMaterial)),[w]=s.useState((()=>new r.Vector3));t=void 0===t?.1:t,n=void 0===n?7*c:n,a.useFrame((()=>{v.uniforms.spotPosition.value.copy(m.current.getWorldPosition(w)),m.current.lookAt(m.current.parent.target.getWorldPosition(w))}));const S=s.useMemo((()=>{const e=new r.CylinderGeometry(t,n,l,128,64,!0);return e.applyMatrix4((new r.Matrix4).makeTranslation(0,-l/2,0)),e.applyMatrix4((new r.Matrix4).makeRotationX(-Math.PI/2)),e}),[l,t,n]);return s.createElement(s.Fragment,null,s.createElement("mesh",{ref:m,geometry:S,raycast:()=>null},s.createElement("primitive",{object:v,attach:"material","uniforms-opacity-value":e,"uniforms-lightColor-value":u,"uniforms-attenuation-value":p,"uniforms-anglePower-value":d,"uniforms-depth-value":o,"uniforms-cameraNear-value":f.near,"uniforms-cameraFar-value":f.far,"uniforms-resolution-value":o?[h.width*g,h.height*g]:[0,0]})))}function m(e,t,n,o,i){const[[u,l]]=s.useState((()=>[new r.Vector3,new r.Vector3]));s.useLayoutEffect((()=>{if(!(null==(t=e.current)?void 0:t.isSpotLight))throw new Error("SpotlightShadow must be a child of a SpotLight");var t;console.log(e.current),e.current.shadow.mapSize.set(n,o),e.current.shadow.needsUpdate=!0}),[e,n,o]),a.useFrame((()=>{if(!e.current)return;const r=e.current.position,a=e.current.target.position;l.copy(a).sub(r);var n=l.length();l.normalize().multiplyScalar(n*i),u.copy(r).add(l),t.current.position.copy(u),t.current.lookAt(e.current.target.position)}))}function h({distance:e=.4,alphaTest:t=.5,map:o,shader:i="#define GLSLIFY 1\nvarying vec2 vUv;uniform sampler2D uShadowMap;uniform float uTime;void main(){vec3 color=texture2D(uShadowMap,vUv).xyz;gl_FragColor=vec4(color,1.);}",width:u=512,height:l=512,scale:c=1,children:p,...d}){const h=s.useRef(null),f=d.spotlightRef,g=d.debug;m(f,h,u,l,e);const v=s.useMemo((()=>new r.WebGLRenderTarget(u,l,{format:r.RGBAFormat,encoding:r.LinearEncoding,stencilBuffer:!1})),[u,l]),w=s.useRef({uShadowMap:{value:o},uTime:{value:0}});s.useEffect((()=>{w.current.uShadowMap.value=o}),[o]);const S=s.useMemo((()=>new n.FullScreenQuad(new r.ShaderMaterial({uniforms:w.current,vertexShader:"\n          varying vec2 vUv;\n\n          void main() {\n            vUv = uv;\n            gl_Position = projectionMatrix * modelViewMatrix * vec4(position, 1.0);\n          }\n          ",fragmentShader:i}))),[i]);return s.useEffect((()=>()=>{S.material.dispose(),S.dispose()}),[S]),s.useEffect((()=>()=>v.dispose()),[v]),a.useFrame((({gl:e},t)=>{w.current.uTime.value+=t,e.setRenderTarget(v),S.render(e),e.setRenderTarget(null)})),s.createElement(s.Fragment,null,s.createElement("mesh",{ref:h,scale:c,castShadow:!0},s.createElement("planeGeometry",null),s.createElement("meshBasicMaterial",{transparent:!0,side:r.DoubleSide,alphaTest:t,alphaMap:v.texture,"alphaMap-wrapS":r.RepeatWrapping,"alphaMap-wrapT":r.RepeatWrapping,opacity:g?1:0},p)))}function f({distance:e=.4,alphaTest:t=.5,map:a,width:n=512,height:o=512,scale:i,children:u,...l}){const c=s.useRef(null),p=l.spotlightRef,d=l.debug;return m(p,c,n,o,e),s.createElement(s.Fragment,null,s.createElement("mesh",{ref:c,scale:i,castShadow:!0},s.createElement("planeGeometry",null),s.createElement("meshBasicMaterial",{transparent:!0,side:r.DoubleSide,alphaTest:t,alphaMap:a,"alphaMap-wrapS":r.RepeatWrapping,"alphaMap-wrapT":r.RepeatWrapping,opacity:d?1:0},u)))}const g=s.forwardRef((({opacity:e=1,radiusTop:t,radiusBottom:r,depthBuffer:a,color:n="white",distance:o=5,angle:i=.15,attenuation:u=5,anglePower:l=5,volumetric:m=!0,debug:h=!1,children:f,...g},v)=>{const w=s.useRef(null);return s.createElement("group",null,h&&w.current&&s.createElement("spotLightHelper",{args:[w.current]}),s.createElement("spotLight",c.default({ref:p.default([v,w]),angle:i,color:n,distance:o,castShadow:!0},g),m&&s.createElement(d,{debug:h,opacity:e,radiusTop:t,radiusBottom:r,depthBuffer:a,color:n,distance:o,angle:i,attenuation:u,anglePower:l})),f&&s.cloneElement(f,{spotlightRef:w,debug:h}))}));exports.SpotLight=g,exports.SpotLightShadow=function(e){return e.shader?s.createElement(h,e):s.createElement(f,e)};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@babel/runtime/helpers/extends"),t=require("react"),r=require("three"),a=require("@react-three/fiber"),n=require("three-stdlib"),o=require("react-merge-refs"),i=require("../materials/SpotLightMaterial.cjs.js");function u(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function l(e){if(e&&e.__esModule)return e;var t=Object.create(null);return e&&Object.keys(e).forEach((function(r){if("default"!==r){var a=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(t,r,a.get?a:{enumerable:!0,get:function(){return e[r]}})}})),t.default=e,Object.freeze(t)}var s=u(e),c=l(t),p=u(o);function d({opacity:e=1,radiusTop:t,radiusBottom:n,depthBuffer:o,color:u="white",distance:l=5,angle:s=.15,attenuation:p=5,anglePower:d=5}){const m=c.useRef(null),h=a.useThree((e=>e.size)),f=a.useThree((e=>e.camera)),g=a.useThree((e=>e.viewport.dpr)),[v]=c.useState((()=>new i.SpotLightMaterial)),[w]=c.useState((()=>new r.Vector3));t=void 0===t?.1:t,n=void 0===n?7*s:n,a.useFrame((()=>{v.uniforms.spotPosition.value.copy(m.current.getWorldPosition(w)),m.current.lookAt(m.current.parent.target.getWorldPosition(w))}));const S=c.useMemo((()=>{const e=new r.CylinderGeometry(t,n,l,128,64,!0);return e.applyMatrix4((new r.Matrix4).makeTranslation(0,-l/2,0)),e.applyMatrix4((new r.Matrix4).makeRotationX(-Math.PI/2)),e}),[l,t,n]);return c.createElement(c.Fragment,null,c.createElement("mesh",{ref:m,geometry:S,raycast:()=>null},c.createElement("primitive",{object:v,attach:"material","uniforms-opacity-value":e,"uniforms-lightColor-value":u,"uniforms-attenuation-value":p,"uniforms-anglePower-value":d,"uniforms-depth-value":o,"uniforms-cameraNear-value":f.near,"uniforms-cameraFar-value":f.far,"uniforms-resolution-value":o?[h.width*g,h.height*g]:[0,0]})))}function m(e,t,n,o,i){const[[u,l]]=c.useState((()=>[new r.Vector3,new r.Vector3]));c.useLayoutEffect((()=>{if(!(null==(t=e.current)?void 0:t.isSpotLight))throw new Error("SpotlightShadow must be a child of a SpotLight");var t;e.current.shadow.mapSize.set(n,o),e.current.shadow.needsUpdate=!0}),[e,n,o]),a.useFrame((()=>{if(!e.current)return;const r=e.current.position,a=e.current.target.position;l.copy(a).sub(r);var n=l.length();l.normalize().multiplyScalar(n*i),u.copy(r).add(l),t.current.position.copy(u),t.current.lookAt(e.current.target.position)}))}function h({distance:e=.4,alphaTest:t=.5,map:o,shader:i="#define GLSLIFY 1\nvarying vec2 vUv;uniform sampler2D uShadowMap;uniform float uTime;void main(){vec3 color=texture2D(uShadowMap,vUv).xyz;gl_FragColor=vec4(color,1.);}",width:u=512,height:l=512,scale:s=1,children:p,...d}){const h=c.useRef(null),f=d.spotlightRef,g=d.debug;m(f,h,u,l,e);const v=c.useMemo((()=>new r.WebGLRenderTarget(u,l,{format:r.RGBAFormat,encoding:r.LinearEncoding,stencilBuffer:!1})),[u,l]),w=c.useRef({uShadowMap:{value:o},uTime:{value:0}});c.useEffect((()=>{w.current.uShadowMap.value=o}),[o]);const S=c.useMemo((()=>new n.FullScreenQuad(new r.ShaderMaterial({uniforms:w.current,vertexShader:"\n          varying vec2 vUv;\n\n          void main() {\n            vUv = uv;\n            gl_Position = projectionMatrix * modelViewMatrix * vec4(position, 1.0);\n          }\n          ",fragmentShader:i}))),[i]);return c.useEffect((()=>()=>{S.material.dispose(),S.dispose()}),[S]),c.useEffect((()=>()=>v.dispose()),[v]),a.useFrame((({gl:e},t)=>{w.current.uTime.value+=t,e.setRenderTarget(v),S.render(e),e.setRenderTarget(null)})),c.createElement(c.Fragment,null,c.createElement("mesh",{ref:h,scale:s,castShadow:!0},c.createElement("planeGeometry",null),c.createElement("meshBasicMaterial",{transparent:!0,side:r.DoubleSide,alphaTest:t,alphaMap:v.texture,"alphaMap-wrapS":r.RepeatWrapping,"alphaMap-wrapT":r.RepeatWrapping,opacity:g?1:0},p)))}function f({distance:e=.4,alphaTest:t=.5,map:a,width:n=512,height:o=512,scale:i,children:u,...l}){const s=c.useRef(null),p=l.spotlightRef,d=l.debug;return m(p,s,n,o,e),c.createElement(c.Fragment,null,c.createElement("mesh",{ref:s,scale:i,castShadow:!0},c.createElement("planeGeometry",null),c.createElement("meshBasicMaterial",{transparent:!0,side:r.DoubleSide,alphaTest:t,alphaMap:a,"alphaMap-wrapS":r.RepeatWrapping,"alphaMap-wrapT":r.RepeatWrapping,opacity:d?1:0},u)))}const g=c.forwardRef((({opacity:e=1,radiusTop:t,radiusBottom:r,depthBuffer:a,color:n="white",distance:o=5,angle:i=.15,attenuation:u=5,anglePower:l=5,volumetric:m=!0,debug:h=!1,children:f,...g},v)=>{const w=c.useRef(null);return c.createElement("group",null,h&&w.current&&c.createElement("spotLightHelper",{args:[w.current]}),c.createElement("spotLight",s.default({ref:p.default([v,w]),angle:i,color:n,distance:o,castShadow:!0},g),m&&c.createElement(d,{debug:h,opacity:e,radiusTop:t,radiusBottom:r,depthBuffer:a,color:n,distance:o,angle:i,attenuation:u,anglePower:l})),f&&c.cloneElement(f,{spotlightRef:w,debug:h}))}));exports.SpotLight=g,exports.SpotLightShadow=function(e){return e.shader?c.createElement(h,e):c.createElement(f,e)};

package/core/SpotLight.js

@@ -62,7 +62,6 @@ function useCommon(spotlight, mesh, width, height, distance) {
   const [[pos, dir]] = React.useState(() => [new Vector3(), new Vector3()]);
   React.useLayoutEffect(() => {
     if (isSpotLight(spotlight.current)) {
-      console.log(spotlight.current);
       spotlight.current.shadow.mapSize.set(width, height);
       spotlight.current.shadow.needsUpdate = true;
     } else {

package/core/index.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("./Billboard.cjs.js"),r=require("./ScreenSpace.cjs.js"),s=require("./QuadraticBezierLine.cjs.js"),t=require("./CubicBezierLine.cjs.js"),o=require("./CatmullRomLine.cjs.js"),i=require("./Line.cjs.js"),a=require("./PositionalAudio.cjs.js"),u=require("./Text.cjs.js"),c=require("./Text3D.cjs.js"),n=require("./Effects.cjs.js"),j=require("./GradientTexture.cjs.js"),p=require("./Image.cjs.js"),x=require("./Edges.cjs.js"),l=require("./Trail.cjs.js"),d=require("./Sampler.cjs.js"),q=require("./ComputedAttribute.cjs.js"),m=require("./Clone.cjs.js"),h=require("./MarchingCubes.cjs.js"),C=require("./Decal.cjs.js"),M=require("./Svg.cjs.js"),S=require("./Gltf.cjs.js"),T=require("./AsciiRenderer.cjs.js"),f=require("./OrthographicCamera.cjs.js"),B=require("./PerspectiveCamera.cjs.js"),P=require("./CubeCamera.cjs.js"),b=require("./DeviceOrientationControls.cjs.js"),g=require("./FlyControls.cjs.js"),v=require("./MapControls.cjs.js"),A=require("./OrbitControls.cjs.js"),L=require("./TrackballControls.cjs.js"),k=require("./ArcballControls.cjs.js"),G=require("./TransformControls.cjs.js"),D=require("./PointerLockControls.cjs.js"),R=require("./FirstPersonControls.cjs.js"),E=require("./CameraControls.cjs.js"),w=require("./GizmoHelper.cjs.js"),z=require("./GizmoViewcube.cjs.js"),F=require("./GizmoViewport.cjs.js"),O=require("./Grid.cjs.js"),I=require("./useCubeTexture.cjs.js"),H=require("./useFBX.cjs.js"),V=require("./useGLTF.cjs.js"),y=require("./useKTX2.cjs.js"),Q=require("./useProgress.cjs.js"),X=require("./useTexture.cjs.js"),K=require("./useVideoTexture.cjs.js"),W=require("./Stats.cjs.js"),N=require("./useDepthBuffer.cjs.js"),U=require("./useAspect.cjs.js"),_=require("./useCamera.cjs.js"),J=require("./useDetectGPU.cjs.js"),Y=require("./useHelper.cjs.js"),Z=require("./useBVH.cjs.js"),$=require("./useContextBridge.cjs.js"),ee=require("./useAnimations.cjs.js"),re=require("./useFBO.cjs.js"),se=require("./useIntersect.cjs.js"),te=require("./useBoxProjectedEnv.cjs.js"),oe=require("./BBAnchor.cjs.js"),ie=require("./useTrailTexture.cjs.js"),ae=require("./CurveModifier.cjs.js"),ue=require("./MeshDistortMaterial.cjs.js"),ce=require("./MeshWobbleMaterial.cjs.js"),ne=require("./MeshReflectorMaterial.cjs.js"),je=require("./MeshRefractionMaterial.cjs.js"),pe=require("./MeshTransmissionMaterial.cjs.js"),xe=require("./PointMaterial.cjs.js"),le=require("./shaderMaterial.cjs.js"),de=require("./softShadows.cjs.js"),qe=require("./shapes.cjs.js"),me=require("./RoundedBox.cjs.js"),he=require("./ScreenQuad.cjs.js"),Ce=require("./Center.cjs.js"),Me=require("./Bounds.cjs.js"),Se=require("./CameraShake.cjs.js"),Te=require("./Float.cjs.js"),fe=require("./Stage.cjs.js"),Be=require("./Backdrop.cjs.js"),Pe=require("./Shadow.cjs.js"),be=require("./Caustics.cjs.js"),ge=require("./ContactShadows.cjs.js"),ve=require("./AccumulativeShadows.cjs.js"),Ae=require("./Reflector.cjs.js"),Le=require("./SpotLight.cjs.js"),ke=require("./Environment.cjs.js"),Ge=require("./Lightformer.cjs.js"),De=require("./Sky.cjs.js"),Re=require("./Stars.cjs.js"),Ee=require("./Cloud.cjs.js"),we=require("./Sparkles.cjs.js"),ze=require("./useMatcapTexture.cjs.js"),Fe=require("./useNormalTexture.cjs.js"),Oe=require("./Points.cjs.js"),Ie=require("./Instances.cjs.js"),He=require("./Segments.cjs.js"),Ve=require("./Detailed.cjs.js"),ye=require("./Preload.cjs.js"),Qe=require("./BakeShadows.cjs.js"),Xe=require("./meshBounds.cjs.js"),Ke=require("./AdaptiveDpr.cjs.js"),We=require("./AdaptiveEvents.cjs.js"),Ne=require("./PerformanceMonitor.cjs.js"),Ue=require("./RenderTexture.cjs.js"),_e=require("./Mask.cjs.js"),Je=require("./Hud.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("camera-controls"),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("../materials/MeshRefractionMaterial.cjs.js"),require("../materials/DiscardMaterial.cjs.js"),require("../helpers/environment-assets.cjs.js"),require("../materials/SpotLightMaterial.cjs.js"),require("react-composer"),exports.Billboard=e.Billboard,exports.ScreenSpace=r.ScreenSpace,exports.QuadraticBezierLine=s.QuadraticBezierLine,exports.CubicBezierLine=t.CubicBezierLine,exports.CatmullRomLine=o.CatmullRomLine,exports.Line=i.Line,exports.PositionalAudio=a.PositionalAudio,exports.Text=u.Text,exports.Text3D=c.Text3D,exports.Effects=n.Effects,exports.isWebGL2Available=n.isWebGL2Available,exports.GradientTexture=j.GradientTexture,exports.Image=p.Image,exports.Edges=x.Edges,exports.Trail=l.Trail,exports.useTrail=l.useTrail,exports.Sampler=d.Sampler,exports.useSurfaceSampler=d.useSurfaceSampler,exports.ComputedAttribute=q.ComputedAttribute,exports.Clone=m.Clone,exports.MarchingCube=h.MarchingCube,exports.MarchingCubes=h.MarchingCubes,exports.MarchingPlane=h.MarchingPlane,exports.Decal=C.Decal,exports.Svg=M.Svg,exports.Gltf=S.Gltf,exports.AsciiRenderer=T.AsciiRenderer,exports.OrthographicCamera=f.OrthographicCamera,exports.PerspectiveCamera=B.PerspectiveCamera,exports.CubeCamera=P.CubeCamera,exports.DeviceOrientationControls=b.DeviceOrientationControls,exports.FlyControls=g.FlyControls,exports.MapControls=v.MapControls,exports.OrbitControls=A.OrbitControls,exports.TrackballControls=L.TrackballControls,exports.ArcballControls=k.ArcballControls,exports.TransformControls=G.TransformControls,exports.PointerLockControls=D.PointerLockControls,exports.FirstPersonControls=R.FirstPersonControls,exports.CameraControls=E.CameraControls,exports.GizmoHelper=w.GizmoHelper,exports.useGizmoContext=w.useGizmoContext,exports.GizmoViewcube=z.GizmoViewcube,exports.GizmoViewport=F.GizmoViewport,exports.Grid=O.Grid,exports.useCubeTexture=I.useCubeTexture,exports.useFBX=H.useFBX,exports.useGLTF=V.useGLTF,exports.useKTX2=y.useKTX2,exports.useProgress=Q.useProgress,exports.IsObject=X.IsObject,exports.useTexture=X.useTexture,exports.useVideoTexture=K.useVideoTexture,exports.Stats=W.Stats,exports.useDepthBuffer=N.useDepthBuffer,exports.useAspect=U.useAspect,exports.useCamera=_.useCamera,exports.useDetectGPU=J.useDetectGPU,exports.useHelper=Y.useHelper,exports.Bvh=Z.Bvh,exports.useBVH=Z.useBVH,exports.useContextBridge=$.useContextBridge,exports.useAnimations=ee.useAnimations,exports.useFBO=re.useFBO,exports.useIntersect=se.useIntersect,exports.useBoxProjectedEnv=te.useBoxProjectedEnv,exports.BBAnchor=oe.BBAnchor,exports.useTrailTexture=ie.useTrailTexture,exports.CurveModifier=ae.CurveModifier,exports.MeshDistortMaterial=ue.MeshDistortMaterial,exports.MeshWobbleMaterial=ce.MeshWobbleMaterial,exports.MeshReflectorMaterial=ne.MeshReflectorMaterial,exports.MeshRefractionMaterial=je.MeshRefractionMaterial,exports.MeshTransmissionMaterial=pe.MeshTransmissionMaterial,exports.PointMaterial=xe.PointMaterial,exports.PointMaterialImpl=xe.PointMaterialImpl,exports.shaderMaterial=le.shaderMaterial,exports.SoftShadows=de.SoftShadows,exports.softShadows=de.softShadows,exports.Box=qe.Box,exports.Capsule=qe.Capsule,exports.Circle=qe.Circle,exports.Cone=qe.Cone,exports.Cylinder=qe.Cylinder,exports.Dodecahedron=qe.Dodecahedron,exports.Extrude=qe.Extrude,exports.Icosahedron=qe.Icosahedron,exports.Lathe=qe.Lathe,exports.Octahedron=qe.Octahedron,exports.Plane=qe.Plane,exports.Polyhedron=qe.Polyhedron,exports.Ring=qe.Ring,exports.Sphere=qe.Sphere,exports.Tetrahedron=qe.Tetrahedron,exports.Torus=qe.Torus,exports.TorusKnot=qe.TorusKnot,exports.Tube=qe.Tube,exports.RoundedBox=me.RoundedBox,exports.ScreenQuad=he.ScreenQuad,exports.Center=Ce.Center,exports.Bounds=Me.Bounds,exports.useBounds=Me.useBounds,exports.CameraShake=Se.CameraShake,exports.Float=Te.Float,exports.Stage=fe.Stage,exports.Backdrop=Be.Backdrop,exports.Shadow=Pe.Shadow,exports.Caustics=be.Caustics,exports.ContactShadows=ge.ContactShadows,exports.AccumulativeShadows=ve.AccumulativeShadows,exports.RandomizedLight=ve.RandomizedLight,exports.accumulativeContext=ve.accumulativeContext,exports.Reflector=Ae.Reflector,exports.SpotLight=Le.SpotLight,exports.SpotLightShadow=Le.SpotLightShadow,exports.Environment=ke.Environment,exports.EnvironmentCube=ke.EnvironmentCube,exports.EnvironmentMap=ke.EnvironmentMap,exports.EnvironmentPortal=ke.EnvironmentPortal,exports.useEnvironment=ke.useEnvironment,exports.Lightformer=Ge.Lightformer,exports.Sky=De.Sky,exports.calcPosFromAngles=De.calcPosFromAngles,exports.Stars=Re.Stars,exports.Cloud=Ee.Cloud,exports.Sparkles=we.Sparkles,exports.useMatcapTexture=ze.useMatcapTexture,exports.useNormalTexture=Fe.useNormalTexture,exports.Point=Oe.Point,exports.Points=Oe.Points,exports.PointsBuffer=Oe.PointsBuffer,exports.PositionPoint=Oe.PositionPoint,exports.Instance=Ie.Instance,exports.Instances=Ie.Instances,exports.Merged=Ie.Merged,exports.Segment=He.Segment,exports.SegmentObject=He.SegmentObject,exports.Segments=He.Segments,exports.Detailed=Ve.Detailed,exports.Preload=ye.Preload,exports.BakeShadows=Qe.BakeShadows,exports.meshBounds=Xe.meshBounds,exports.AdaptiveDpr=Ke.AdaptiveDpr,exports.AdaptiveEvents=We.AdaptiveEvents,exports.PerformanceMonitor=Ne.PerformanceMonitor,exports.usePerformanceMonitor=Ne.usePerformanceMonitor,exports.RenderTexture=Ue.RenderTexture,exports.Mask=_e.Mask,exports.useMask=_e.useMask,exports.Hud=Je.Hud;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("./Billboard.cjs.js"),r=require("./ScreenSpace.cjs.js"),s=require("./QuadraticBezierLine.cjs.js"),t=require("./CubicBezierLine.cjs.js"),o=require("./CatmullRomLine.cjs.js"),i=require("./Line.cjs.js"),u=require("./PositionalAudio.cjs.js"),a=require("./Text.cjs.js"),c=require("./Text3D.cjs.js"),n=require("./Effects.cjs.js"),j=require("./GradientTexture.cjs.js"),p=require("./Image.cjs.js"),x=require("./Edges.cjs.js"),l=require("./Trail.cjs.js"),q=require("./Sampler.cjs.js"),d=require("./ComputedAttribute.cjs.js"),m=require("./Clone.cjs.js"),C=require("./MarchingCubes.cjs.js"),h=require("./Decal.cjs.js"),M=require("./Svg.cjs.js"),S=require("./Gltf.cjs.js"),T=require("./AsciiRenderer.cjs.js"),B=require("./OrthographicCamera.cjs.js"),P=require("./PerspectiveCamera.cjs.js"),b=require("./CubeCamera.cjs.js"),f=require("./DeviceOrientationControls.cjs.js"),g=require("./FlyControls.cjs.js"),v=require("./MapControls.cjs.js"),A=require("./OrbitControls.cjs.js"),L=require("./TrackballControls.cjs.js"),k=require("./ArcballControls.cjs.js"),G=require("./TransformControls.cjs.js"),D=require("./PointerLockControls.cjs.js"),R=require("./FirstPersonControls.cjs.js"),E=require("./CameraControls.cjs.js"),w=require("./GizmoHelper.cjs.js"),z=require("./GizmoViewcube.cjs.js"),F=require("./GizmoViewport.cjs.js"),O=require("./Grid.cjs.js"),I=require("./useCubeTexture.cjs.js"),H=require("./useFBX.cjs.js"),V=require("./useGLTF.cjs.js"),y=require("./useKTX2.cjs.js"),Q=require("./useProgress.cjs.js"),X=require("./useTexture.cjs.js"),K=require("./useVideoTexture.cjs.js"),W=require("./Stats.cjs.js"),N=require("./useDepthBuffer.cjs.js"),U=require("./useAspect.cjs.js"),_=require("./useCamera.cjs.js"),J=require("./useDetectGPU.cjs.js"),Y=require("./useHelper.cjs.js"),Z=require("./useBVH.cjs.js"),$=require("./useContextBridge.cjs.js"),ee=require("./useAnimations.cjs.js"),re=require("./useFBO.cjs.js"),se=require("./useIntersect.cjs.js"),te=require("./useBoxProjectedEnv.cjs.js"),oe=require("./BBAnchor.cjs.js"),ie=require("./useTrailTexture.cjs.js"),ue=require("./CurveModifier.cjs.js"),ae=require("./MeshDistortMaterial.cjs.js"),ce=require("./MeshWobbleMaterial.cjs.js"),ne=require("./MeshReflectorMaterial.cjs.js"),je=require("./MeshRefractionMaterial.cjs.js"),pe=require("./MeshTransmissionMaterial.cjs.js"),xe=require("./PointMaterial.cjs.js"),le=require("./shaderMaterial.cjs.js"),qe=require("./softShadows.cjs.js"),de=require("./shapes.cjs.js"),me=require("./RoundedBox.cjs.js"),Ce=require("./ScreenQuad.cjs.js"),he=require("./Center.cjs.js"),Me=require("./Bounds.cjs.js"),Se=require("./CameraShake.cjs.js"),Te=require("./Float.cjs.js"),Be=require("./Stage.cjs.js"),Pe=require("./Backdrop.cjs.js"),be=require("./Shadow.cjs.js"),fe=require("./Caustics.cjs.js"),ge=require("./ContactShadows.cjs.js"),ve=require("./AccumulativeShadows.cjs.js"),Ae=require("./Reflector.cjs.js"),Le=require("./SpotLight.cjs.js"),ke=require("./Environment.cjs.js"),Ge=require("./Lightformer.cjs.js"),De=require("./Sky.cjs.js"),Re=require("./Stars.cjs.js"),Ee=require("./Cloud.cjs.js"),we=require("./Sparkles.cjs.js"),ze=require("./useMatcapTexture.cjs.js"),Fe=require("./useNormalTexture.cjs.js"),Oe=require("./Points.cjs.js"),Ie=require("./Instances.cjs.js"),He=require("./Segments.cjs.js"),Ve=require("./Detailed.cjs.js"),ye=require("./Preload.cjs.js"),Qe=require("./BakeShadows.cjs.js"),Xe=require("./meshBounds.cjs.js"),Ke=require("./AdaptiveDpr.cjs.js"),We=require("./AdaptiveEvents.cjs.js"),Ne=require("./PerformanceMonitor.cjs.js"),Ue=require("./RenderTexture.cjs.js"),_e=require("./Mask.cjs.js"),Je=require("./Hud.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("camera-controls"),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("../materials/MeshRefractionMaterial.cjs.js"),require("../materials/DiscardMaterial.cjs.js"),require("../helpers/environment-assets.cjs.js"),require("../materials/SpotLightMaterial.cjs.js"),require("react-composer"),exports.Billboard=e.Billboard,exports.ScreenSpace=r.ScreenSpace,exports.QuadraticBezierLine=s.QuadraticBezierLine,exports.CubicBezierLine=t.CubicBezierLine,exports.CatmullRomLine=o.CatmullRomLine,exports.Line=i.Line,exports.PositionalAudio=u.PositionalAudio,exports.Text=a.Text,exports.Text3D=c.Text3D,exports.Effects=n.Effects,exports.isWebGL2Available=n.isWebGL2Available,exports.GradientTexture=j.GradientTexture,exports.Image=p.Image,exports.Edges=x.Edges,exports.Trail=l.Trail,exports.useTrail=l.useTrail,exports.Sampler=q.Sampler,exports.useSurfaceSampler=q.useSurfaceSampler,exports.ComputedAttribute=d.ComputedAttribute,exports.Clone=m.Clone,exports.MarchingCube=C.MarchingCube,exports.MarchingCubes=C.MarchingCubes,exports.MarchingPlane=C.MarchingPlane,exports.Decal=h.Decal,exports.Svg=M.Svg,exports.Gltf=S.Gltf,exports.AsciiRenderer=T.AsciiRenderer,exports.OrthographicCamera=B.OrthographicCamera,exports.PerspectiveCamera=P.PerspectiveCamera,exports.CubeCamera=b.CubeCamera,exports.DeviceOrientationControls=f.DeviceOrientationControls,exports.FlyControls=g.FlyControls,exports.MapControls=v.MapControls,exports.OrbitControls=A.OrbitControls,exports.TrackballControls=L.TrackballControls,exports.ArcballControls=k.ArcballControls,exports.TransformControls=G.TransformControls,exports.PointerLockControls=D.PointerLockControls,exports.FirstPersonControls=R.FirstPersonControls,exports.CameraControls=E.CameraControls,exports.GizmoHelper=w.GizmoHelper,exports.useGizmoContext=w.useGizmoContext,exports.GizmoViewcube=z.GizmoViewcube,exports.GizmoViewport=F.GizmoViewport,exports.Grid=O.Grid,exports.useCubeTexture=I.useCubeTexture,exports.useFBX=H.useFBX,exports.useGLTF=V.useGLTF,exports.useKTX2=y.useKTX2,exports.useProgress=Q.useProgress,exports.IsObject=X.IsObject,exports.useTexture=X.useTexture,exports.useVideoTexture=K.useVideoTexture,exports.Stats=W.Stats,exports.useDepthBuffer=N.useDepthBuffer,exports.useAspect=U.useAspect,exports.useCamera=_.useCamera,exports.useDetectGPU=J.useDetectGPU,exports.useHelper=Y.useHelper,exports.Bvh=Z.Bvh,exports.useBVH=Z.useBVH,exports.useContextBridge=$.useContextBridge,exports.useAnimations=ee.useAnimations,exports.useFBO=re.useFBO,exports.useIntersect=se.useIntersect,exports.useBoxProjectedEnv=te.useBoxProjectedEnv,exports.BBAnchor=oe.BBAnchor,exports.useTrailTexture=ie.useTrailTexture,exports.CurveModifier=ue.CurveModifier,exports.MeshDistortMaterial=ae.MeshDistortMaterial,exports.MeshWobbleMaterial=ce.MeshWobbleMaterial,exports.MeshReflectorMaterial=ne.MeshReflectorMaterial,exports.MeshRefractionMaterial=je.MeshRefractionMaterial,exports.MeshTransmissionMaterial=pe.MeshTransmissionMaterial,exports.PointMaterial=xe.PointMaterial,exports.PointMaterialImpl=xe.PointMaterialImpl,exports.shaderMaterial=le.shaderMaterial,exports.SoftShadows=qe.SoftShadows,exports.Box=de.Box,exports.Capsule=de.Capsule,exports.Circle=de.Circle,exports.Cone=de.Cone,exports.Cylinder=de.Cylinder,exports.Dodecahedron=de.Dodecahedron,exports.Extrude=de.Extrude,exports.Icosahedron=de.Icosahedron,exports.Lathe=de.Lathe,exports.Octahedron=de.Octahedron,exports.Plane=de.Plane,exports.Polyhedron=de.Polyhedron,exports.Ring=de.Ring,exports.Sphere=de.Sphere,exports.Tetrahedron=de.Tetrahedron,exports.Torus=de.Torus,exports.TorusKnot=de.TorusKnot,exports.Tube=de.Tube,exports.RoundedBox=me.RoundedBox,exports.ScreenQuad=Ce.ScreenQuad,exports.Center=he.Center,exports.Bounds=Me.Bounds,exports.useBounds=Me.useBounds,exports.CameraShake=Se.CameraShake,exports.Float=Te.Float,exports.Stage=Be.Stage,exports.Backdrop=Pe.Backdrop,exports.Shadow=be.Shadow,exports.Caustics=fe.Caustics,exports.ContactShadows=ge.ContactShadows,exports.AccumulativeShadows=ve.AccumulativeShadows,exports.RandomizedLight=ve.RandomizedLight,exports.accumulativeContext=ve.accumulativeContext,exports.Reflector=Ae.Reflector,exports.SpotLight=Le.SpotLight,exports.SpotLightShadow=Le.SpotLightShadow,exports.Environment=ke.Environment,exports.EnvironmentCube=ke.EnvironmentCube,exports.EnvironmentMap=ke.EnvironmentMap,exports.EnvironmentPortal=ke.EnvironmentPortal,exports.useEnvironment=ke.useEnvironment,exports.Lightformer=Ge.Lightformer,exports.Sky=De.Sky,exports.calcPosFromAngles=De.calcPosFromAngles,exports.Stars=Re.Stars,exports.Cloud=Ee.Cloud,exports.Sparkles=we.Sparkles,exports.useMatcapTexture=ze.useMatcapTexture,exports.useNormalTexture=Fe.useNormalTexture,exports.Point=Oe.Point,exports.Points=Oe.Points,exports.PointsBuffer=Oe.PointsBuffer,exports.PositionPoint=Oe.PositionPoint,exports.Instance=Ie.Instance,exports.Instances=Ie.Instances,exports.Merged=Ie.Merged,exports.Segment=He.Segment,exports.SegmentObject=He.SegmentObject,exports.Segments=He.Segments,exports.Detailed=Ve.Detailed,exports.Preload=ye.Preload,exports.BakeShadows=Qe.BakeShadows,exports.meshBounds=Xe.meshBounds,exports.AdaptiveDpr=Ke.AdaptiveDpr,exports.AdaptiveEvents=We.AdaptiveEvents,exports.PerformanceMonitor=Ne.PerformanceMonitor,exports.usePerformanceMonitor=Ne.usePerformanceMonitor,exports.RenderTexture=Ue.RenderTexture,exports.Mask=_e.Mask,exports.useMask=_e.useMask,exports.Hud=Je.Hud;

package/core/index.js

@@ -66,7 +66,7 @@ export { MeshRefractionMaterial } from './MeshRefractionMaterial.js';
 export { MeshTransmissionMaterial } from './MeshTransmissionMaterial.js';
 export { PointMaterial, PointMaterialImpl } from './PointMaterial.js';
 export { shaderMaterial } from './shaderMaterial.js';
-export { SoftShadows, softShadows } from './softShadows.js';
+export { SoftShadows } from './softShadows.js';
 export { Box, Capsule, Circle, Cone, Cylinder, Dodecahedron, Extrude, Icosahedron, Lathe, Octahedron, Plane, Polyhedron, Ring, Sphere, Tetrahedron, Torus, TorusKnot, Tube } from './shapes.js';
 export { RoundedBox } from './RoundedBox.js';
 export { ScreenQuad } from './ScreenQuad.js';

package/core/softShadows.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),n=require("three"),a=require("@react-three/fiber");function r(e){if(e&&e.__esModule)return e;var n=Object.create(null);return e&&Object.keys(e).forEach((function(a){if("default"!==a){var r=Object.getOwnPropertyDescriptor(e,a);Object.defineProperty(n,a,r.get?r:{enumerable:!0,get:function(){return e[a]}})}})),n.default=e,Object.freeze(n)}var o=r(e),t=r(n);const s=({frustum:e=3.75,size:n=.005,near:a=9.5,samples:r=10,rings:o=11}={})=>`#define LIGHT_WORLD_SIZE ${n}\n#define LIGHT_FRUSTUM_WIDTH ${e}\n#define LIGHT_SIZE_UV (LIGHT_WORLD_SIZE / LIGHT_FRUSTUM_WIDTH)\n#define NEAR_PLANE ${a}\n\n#define NUM_SAMPLES ${r}\n#define NUM_RINGS ${o}\n#define BLOCKER_SEARCH_NUM_SAMPLES NUM_SAMPLES\n\nvec2 poissonDisk[NUM_SAMPLES];\n\nvoid initPoissonSamples( const in vec2 randomSeed ) {\n  float ANGLE_STEP = PI2 * float( NUM_RINGS ) / float( NUM_SAMPLES );\n  float INV_NUM_SAMPLES = 1.0 / float( NUM_SAMPLES );\n\n  // jsfiddle that shows sample pattern: https://jsfiddle.net/a16ff1p7/\n  float angle = rand( randomSeed ) * PI2;\n  float radius = INV_NUM_SAMPLES;\n  float radiusStep = radius;\n\n  #pragma unroll_loop_start\n  for( int i = 0; i < ${r}; i ++ ) {\n    poissonDisk[i] = vec2( cos( angle ), sin( angle ) ) * pow( radius, 0.75 );\n    radius += radiusStep;\n    angle += ANGLE_STEP;\n  }\n  #pragma unroll_loop_end\n}\n\nfloat penumbraSize( const in float zReceiver, const in float zBlocker ) { // Parallel plane estimation\n  return (zReceiver - zBlocker) / zBlocker;\n}\n\nfloat findBlocker( sampler2D shadowMap, const in vec2 uv, const in float zReceiver ) {\n  // This uses similar triangles to compute what\n  // area of the shadow map we should search\n  float searchRadius = LIGHT_SIZE_UV * ( zReceiver - NEAR_PLANE ) / zReceiver;\n  float blockerDepthSum = 0.0;\n  float shadowMapDepth = 0.0;\n  int numBlockers = 0;  \n  #pragma unroll_loop_start\n  for( int i = 0; i < ${r}; i++ ) {\n    shadowMapDepth = unpackRGBAToDepth(texture2D(shadowMap, uv + poissonDisk[i] * searchRadius));\n    if ( shadowMapDepth < zReceiver ) {\n      blockerDepthSum += shadowMapDepth;\n      numBlockers ++;\n    }\n  }\n  #pragma unroll_loop_end\n\n  if( numBlockers == 0 ) return -1.0;\n  return blockerDepthSum / float( numBlockers );\n}\n\nfloat PCF_Filter(sampler2D shadowMap, vec2 uv, float zReceiver, float filterRadius ) {\n  float sum = 0.0;\n  float depth;\n  #pragma unroll_loop_start\n  for( int i = 0; i < ${r}; i ++ ) {\n    depth = unpackRGBAToDepth( texture2D( shadowMap, uv + poissonDisk[ i ] * filterRadius ) );\n    if( zReceiver <= depth ) sum += 1.0;\n  }\n  #pragma unroll_loop_end\n  #pragma unroll_loop_start\n  for( int i = 0; i < ${r}; i ++ ) {\n    depth = unpackRGBAToDepth( texture2D( shadowMap, uv + -poissonDisk[ i ].yx * filterRadius ) );\n    if( zReceiver <= depth ) sum += 1.0;\n  }\n  #pragma unroll_loop_end\n  return sum / ( 2.0 * float( ${r} ) );\n}\n\nfloat PCSS ( sampler2D shadowMap, vec4 coords ) {\n  vec2 uv = coords.xy;\n  float zReceiver = coords.z; // Assumed to be eye-space z in this code\n\n  initPoissonSamples( uv );\n  // STEP 1: blocker search\n  float avgBlockerDepth = findBlocker( shadowMap, uv, zReceiver );\n\n  //There are no occluders so early out (this saves filtering)\n  if( avgBlockerDepth == -1.0 ) return 1.0;\n\n  // STEP 2: penumbra size\n  float penumbraRatio = penumbraSize( zReceiver, avgBlockerDepth );\n  float filterRadius = penumbraRatio * LIGHT_SIZE_UV * NEAR_PLANE / zReceiver;\n\n  // STEP 3: filtering\n  //return avgBlockerDepth;\n  return PCF_Filter( shadowMap, uv, zReceiver, filterRadius );\n}`;let i=!1;function l(e,n,a){n.traverse((n=>{n.material&&(e.properties.remove(n.material),n.material.dispose())})),e.info.programs.length=0,e.compile(n,a)}exports.SoftShadows=function({frustum:e=3.75,size:n=.005,near:r=9.5,samples:i=10,rings:p=11}){const d=a.useThree((e=>e.gl)),u=a.useThree((e=>e.scene)),f=a.useThree((e=>e.camera));return o.useEffect((()=>{const a=t.ShaderChunk.shadowmap_pars_fragment;let o=t.ShaderChunk.shadowmap_pars_fragment;return o=o.replace("#ifdef USE_SHADOWMAP","#ifdef USE_SHADOWMAP\n"+s({frustum:e,size:n,near:r,samples:i,rings:p})),o=o.replace("#if defined( SHADOWMAP_TYPE_PCF )","\nreturn PCSS(shadowMap, shadowCoord);\n#if defined( SHADOWMAP_TYPE_PCF )"),t.ShaderChunk.shadowmap_pars_fragment=o,l(d,u,f),()=>{t.ShaderChunk.shadowmap_pars_fragment=a,l(d,u,f)}}),[e,n,r,i,p]),null},exports.softShadows=e=>{if(!i){console.warn("drei/softShadows() is deprecated, use <SoftShadows> instead"),i=!0;let n=t.ShaderChunk.shadowmap_pars_fragment;n=n.replace("#ifdef USE_SHADOWMAP","#ifdef USE_SHADOWMAP\n"+s({...e})),n=n.replace("#if defined( SHADOWMAP_TYPE_PCF )","\nreturn PCSS(shadowMap, shadowCoord);\n#if defined( SHADOWMAP_TYPE_PCF )"),t.ShaderChunk.shadowmap_pars_fragment=n}};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),n=require("three"),a=require("@react-three/fiber");function t(e){if(e&&e.__esModule)return e;var n=Object.create(null);return e&&Object.keys(e).forEach((function(a){if("default"!==a){var t=Object.getOwnPropertyDescriptor(e,a);Object.defineProperty(n,a,t.get?t:{enumerable:!0,get:function(){return e[a]}})}})),n.default=e,Object.freeze(n)}var r=t(e),o=t(n);function l(e,n,a){n.traverse((n=>{n.material&&(e.properties.remove(n.material),n.material.dispose())})),e.info.programs.length=0,e.compile(n,a)}exports.SoftShadows=function({focus:e=0,samples:n=10,size:t=25}){const s=a.useThree((e=>e.gl)),i=a.useThree((e=>e.scene)),u=a.useThree((e=>e.camera));return r.useEffect((()=>{const a=o.ShaderChunk.shadowmap_pars_fragment;return o.ShaderChunk.shadowmap_pars_fragment=o.ShaderChunk.shadowmap_pars_fragment.replace("#ifdef USE_SHADOWMAP","#ifdef USE_SHADOWMAP\n"+(({focus:e=0,size:n=25,samples:a=10}={})=>`\n#define PENUMBRA_FILTER_SIZE float(${n})\n#define RGB_NOISE_FUNCTION(uv) (randRGB(uv))\nvec3 randRGB(vec2 uv) {\n  return vec3(\n    fract(sin(dot(uv, vec2(12.75613, 38.12123))) * 13234.76575),\n    fract(sin(dot(uv, vec2(19.45531, 58.46547))) * 43678.23431),\n    fract(sin(dot(uv, vec2(23.67817, 78.23121))) * 93567.23423)\n  );\n}\n\nvec3 lowPassRandRGB(vec2 uv) {\n  // 3x3 convolution (average)\n  // can be implemented as separable with an extra buffer for a total of 6 samples instead of 9\n  vec3 result = vec3(0);\n  result += RGB_NOISE_FUNCTION(uv + vec2(-1.0, -1.0));\n  result += RGB_NOISE_FUNCTION(uv + vec2(-1.0,  0.0));\n  result += RGB_NOISE_FUNCTION(uv + vec2(-1.0, +1.0));\n  result += RGB_NOISE_FUNCTION(uv + vec2( 0.0, -1.0));\n  result += RGB_NOISE_FUNCTION(uv + vec2( 0.0,  0.0));\n  result += RGB_NOISE_FUNCTION(uv + vec2( 0.0, +1.0));\n  result += RGB_NOISE_FUNCTION(uv + vec2(+1.0, -1.0));\n  result += RGB_NOISE_FUNCTION(uv + vec2(+1.0,  0.0));\n  result += RGB_NOISE_FUNCTION(uv + vec2(+1.0, +1.0));\n  result *= 0.111111111; // 1.0 / 9.0\n  return result;\n}\nvec3 highPassRandRGB(vec2 uv) {\n  // by subtracting the low-pass signal from the original signal, we're being left with the high-pass signal\n  // hp(x) = x - lp(x)\n  return RGB_NOISE_FUNCTION(uv) - lowPassRandRGB(uv) + 0.5;\n}\n\n\nvec2 vogelDiskSample(int sampleIndex, int sampleCount, float angle) {\n  const float goldenAngle = 2.399963f; // radians\n  float r = sqrt(float(sampleIndex) + 0.5f) / sqrt(float(sampleCount));\n  float theta = float(sampleIndex) * goldenAngle + angle;\n  float sine = sin(theta);\n  float cosine = cos(theta);\n  return vec2(cosine, sine) * r;\n}\nfloat penumbraSize( const in float zReceiver, const in float zBlocker ) { // Parallel plane estimation\n  return (zReceiver - zBlocker) / zBlocker;\n}\nfloat findBlocker(sampler2D shadowMap, vec2 uv, float compare, float angle) {\n  float texelSize = 1.0 / float(textureSize(shadowMap, 0).x);\n  float blockerDepthSum = float(${e});\n  float blockers = 0.0;\n\n  int j = 0;\n  vec2 offset = vec2(0.);\n  float depth = 0.;\n\n  #pragma unroll_loop_start\n  for(int i = 0; i < ${a}; i ++) {\n    offset = (vogelDiskSample(j, ${a}, angle) * texelSize) * 2.0 * PENUMBRA_FILTER_SIZE;\n    depth = unpackRGBAToDepth( texture2D( shadowMap, uv + offset));\n    if (depth < compare) {\n      blockerDepthSum += depth;\n      blockers++;\n    }\n    j++;\n  }\n  #pragma unroll_loop_end\n\n  if (blockers > 0.0) {\n    return blockerDepthSum / blockers;\n  }\n  return -1.0;\n}\n\n        \nfloat vogelFilter(sampler2D shadowMap, vec2 uv, float zReceiver, float filterRadius, float angle) {\n  float texelSize = 1.0 / float(textureSize(shadowMap, 0).x);\n  float shadow = 0.0f;\n  int j = 0;\n  vec2 vogelSample = vec2(0.0);\n  vec2 offset = vec2(0.0);\n  #pragma unroll_loop_start\n  for (int i = 0; i < ${a}; i++) {\n    vogelSample = vogelDiskSample(j, ${a}, angle) * texelSize;\n    offset = vogelSample * (1.0 + filterRadius * float(${n}));\n    shadow += step( zReceiver, unpackRGBAToDepth( texture2D( shadowMap, uv + offset ) ) );\n    j++;\n  }\n  #pragma unroll_loop_end\n  return shadow * 1.0 / ${a}.0;\n}\n\nfloat PCSS (sampler2D shadowMap, vec4 coords) {\n  vec2 uv = coords.xy;\n  float zReceiver = coords.z; // Assumed to be eye-space z in this code\n  float angle = highPassRandRGB(gl_FragCoord.xy).r * PI2;\n  float avgBlockerDepth = findBlocker(shadowMap, uv, zReceiver, angle);\n  if (avgBlockerDepth == -1.0) {\n    return 1.0;\n  }\n  float penumbraRatio = penumbraSize(zReceiver, avgBlockerDepth);\n  return vogelFilter(shadowMap, uv, zReceiver, 1.25 * penumbraRatio, angle);\n}`)({size:t,samples:n,focus:e})).replace("#if defined( SHADOWMAP_TYPE_PCF )","\nreturn PCSS(shadowMap, shadowCoord);\n#if defined( SHADOWMAP_TYPE_PCF )"),l(s,i,u),()=>{o.ShaderChunk.shadowmap_pars_fragment=a,l(s,i,u)}}),[e,t,n]),null};

package/core/softShadows.d.ts

@@ -1,10 +1,7 @@
 declare type SoftShadowsProps = {
-    frustum?: number;
     size?: number;
-    near?: number;
     samples?: number;
-    rings?: number;
+    focus?: number;
 };
-export declare const softShadows: (props?: SoftShadowsProps) => void;
-export declare function SoftShadows({ frustum, size, near, samples, rings }: SoftShadowsProps): null;
+export declare function SoftShadows({ focus, samples, size }: SoftShadowsProps): null;
 export {};

package/core/softShadows.js

@@ -2,119 +2,113 @@ import * as React from 'react';
 import * as THREE from 'three';
 import { useThree } from '@react-three/fiber';
 
-// From: https://github.com/mrdoob/three.js/blob/dev/examples/webgl_shadowmap_pcss.html
+// Inspired by: https://github.com/mrdoob/three.js/blob/dev/examples/webgl_shadowmap_pcss.html
 
 const pcss = ({
-  frustum = 3.75,
-  size = 0.005,
-  near = 9.5,
-  samples = 10,
-  rings = 11
-} = {}) => `#define LIGHT_WORLD_SIZE ${size}
-#define LIGHT_FRUSTUM_WIDTH ${frustum}
-#define LIGHT_SIZE_UV (LIGHT_WORLD_SIZE / LIGHT_FRUSTUM_WIDTH)
-#define NEAR_PLANE ${near}
-
-#define NUM_SAMPLES ${samples}
-#define NUM_RINGS ${rings}
-#define BLOCKER_SEARCH_NUM_SAMPLES NUM_SAMPLES
-
-vec2 poissonDisk[NUM_SAMPLES];
+  focus = 0,
+  size = 25,
+  samples = 10
+} = {}) => `
+#define PENUMBRA_FILTER_SIZE float(${size})
+#define RGB_NOISE_FUNCTION(uv) (randRGB(uv))
+vec3 randRGB(vec2 uv) {
+  return vec3(
+    fract(sin(dot(uv, vec2(12.75613, 38.12123))) * 13234.76575),
+    fract(sin(dot(uv, vec2(19.45531, 58.46547))) * 43678.23431),
+    fract(sin(dot(uv, vec2(23.67817, 78.23121))) * 93567.23423)
+  );
+}
 
-void initPoissonSamples( const in vec2 randomSeed ) {
-  float ANGLE_STEP = PI2 * float( NUM_RINGS ) / float( NUM_SAMPLES );
-  float INV_NUM_SAMPLES = 1.0 / float( NUM_SAMPLES );
+vec3 lowPassRandRGB(vec2 uv) {
+  // 3x3 convolution (average)
+  // can be implemented as separable with an extra buffer for a total of 6 samples instead of 9
+  vec3 result = vec3(0);
+  result += RGB_NOISE_FUNCTION(uv + vec2(-1.0, -1.0));
+  result += RGB_NOISE_FUNCTION(uv + vec2(-1.0,  0.0));
+  result += RGB_NOISE_FUNCTION(uv + vec2(-1.0, +1.0));
+  result += RGB_NOISE_FUNCTION(uv + vec2( 0.0, -1.0));
+  result += RGB_NOISE_FUNCTION(uv + vec2( 0.0,  0.0));
+  result += RGB_NOISE_FUNCTION(uv + vec2( 0.0, +1.0));
+  result += RGB_NOISE_FUNCTION(uv + vec2(+1.0, -1.0));
+  result += RGB_NOISE_FUNCTION(uv + vec2(+1.0,  0.0));
+  result += RGB_NOISE_FUNCTION(uv + vec2(+1.0, +1.0));
+  result *= 0.111111111; // 1.0 / 9.0
+  return result;
+}
+vec3 highPassRandRGB(vec2 uv) {
+  // by subtracting the low-pass signal from the original signal, we're being left with the high-pass signal
+  // hp(x) = x - lp(x)
+  return RGB_NOISE_FUNCTION(uv) - lowPassRandRGB(uv) + 0.5;
+}
 
-  // jsfiddle that shows sample pattern: https://jsfiddle.net/a16ff1p7/
-  float angle = rand( randomSeed ) * PI2;
-  float radius = INV_NUM_SAMPLES;
-  float radiusStep = radius;
 
-  #pragma unroll_loop_start
-  for( int i = 0; i < ${samples}; i ++ ) {
-    poissonDisk[i] = vec2( cos( angle ), sin( angle ) ) * pow( radius, 0.75 );
-    radius += radiusStep;
-    angle += ANGLE_STEP;
-  }
-  #pragma unroll_loop_end
+vec2 vogelDiskSample(int sampleIndex, int sampleCount, float angle) {
+  const float goldenAngle = 2.399963f; // radians
+  float r = sqrt(float(sampleIndex) + 0.5f) / sqrt(float(sampleCount));
+  float theta = float(sampleIndex) * goldenAngle + angle;
+  float sine = sin(theta);
+  float cosine = cos(theta);
+  return vec2(cosine, sine) * r;
 }
-
 float penumbraSize( const in float zReceiver, const in float zBlocker ) { // Parallel plane estimation
   return (zReceiver - zBlocker) / zBlocker;
 }
+float findBlocker(sampler2D shadowMap, vec2 uv, float compare, float angle) {
+  float texelSize = 1.0 / float(textureSize(shadowMap, 0).x);
+  float blockerDepthSum = float(${focus});
+  float blockers = 0.0;
+
+  int j = 0;
+  vec2 offset = vec2(0.);
+  float depth = 0.;
 
-float findBlocker( sampler2D shadowMap, const in vec2 uv, const in float zReceiver ) {
-  // This uses similar triangles to compute what
-  // area of the shadow map we should search
-  float searchRadius = LIGHT_SIZE_UV * ( zReceiver - NEAR_PLANE ) / zReceiver;
-  float blockerDepthSum = 0.0;
-  float shadowMapDepth = 0.0;
-  int numBlockers = 0;  
   #pragma unroll_loop_start
-  for( int i = 0; i < ${samples}; i++ ) {
-    shadowMapDepth = unpackRGBAToDepth(texture2D(shadowMap, uv + poissonDisk[i] * searchRadius));
-    if ( shadowMapDepth < zReceiver ) {
-      blockerDepthSum += shadowMapDepth;
-      numBlockers ++;
+  for(int i = 0; i < ${samples}; i ++) {
+    offset = (vogelDiskSample(j, ${samples}, angle) * texelSize) * 2.0 * PENUMBRA_FILTER_SIZE;
+    depth = unpackRGBAToDepth( texture2D( shadowMap, uv + offset));
+    if (depth < compare) {
+      blockerDepthSum += depth;
+      blockers++;
     }
+    j++;
   }
   #pragma unroll_loop_end
 
-  if( numBlockers == 0 ) return -1.0;
-  return blockerDepthSum / float( numBlockers );
+  if (blockers > 0.0) {
+    return blockerDepthSum / blockers;
+  }
+  return -1.0;
 }
 
-float PCF_Filter(sampler2D shadowMap, vec2 uv, float zReceiver, float filterRadius ) {
-  float sum = 0.0;
-  float depth;
-  #pragma unroll_loop_start
-  for( int i = 0; i < ${samples}; i ++ ) {
-    depth = unpackRGBAToDepth( texture2D( shadowMap, uv + poissonDisk[ i ] * filterRadius ) );
-    if( zReceiver <= depth ) sum += 1.0;
-  }
-  #pragma unroll_loop_end
+        
+float vogelFilter(sampler2D shadowMap, vec2 uv, float zReceiver, float filterRadius, float angle) {
+  float texelSize = 1.0 / float(textureSize(shadowMap, 0).x);
+  float shadow = 0.0f;
+  int j = 0;
+  vec2 vogelSample = vec2(0.0);
+  vec2 offset = vec2(0.0);
   #pragma unroll_loop_start
-  for( int i = 0; i < ${samples}; i ++ ) {
-    depth = unpackRGBAToDepth( texture2D( shadowMap, uv + -poissonDisk[ i ].yx * filterRadius ) );
-    if( zReceiver <= depth ) sum += 1.0;
+  for (int i = 0; i < ${samples}; i++) {
+    vogelSample = vogelDiskSample(j, ${samples}, angle) * texelSize;
+    offset = vogelSample * (1.0 + filterRadius * float(${size}));
+    shadow += step( zReceiver, unpackRGBAToDepth( texture2D( shadowMap, uv + offset ) ) );
+    j++;
   }
   #pragma unroll_loop_end
-  return sum / ( 2.0 * float( ${samples} ) );
+  return shadow * 1.0 / ${samples}.0;
 }
 
-float PCSS ( sampler2D shadowMap, vec4 coords ) {
+float PCSS (sampler2D shadowMap, vec4 coords) {
   vec2 uv = coords.xy;
   float zReceiver = coords.z; // Assumed to be eye-space z in this code
-
-  initPoissonSamples( uv );
-  // STEP 1: blocker search
-  float avgBlockerDepth = findBlocker( shadowMap, uv, zReceiver );
-
-  //There are no occluders so early out (this saves filtering)
-  if( avgBlockerDepth == -1.0 ) return 1.0;
-
-  // STEP 2: penumbra size
-  float penumbraRatio = penumbraSize( zReceiver, avgBlockerDepth );
-  float filterRadius = penumbraRatio * LIGHT_SIZE_UV * NEAR_PLANE / zReceiver;
-
-  // STEP 3: filtering
-  //return avgBlockerDepth;
-  return PCF_Filter( shadowMap, uv, zReceiver, filterRadius );
-}`;
-
-let deployed = false;
-const softShadows = props => {
-  // Avoid adding the effect twice, which may happen in HMR scenarios
-  if (!deployed) {
-    console.warn('drei/softShadows() is deprecated, use <SoftShadows> instead');
-    deployed = true;
-    let shader = THREE.ShaderChunk.shadowmap_pars_fragment;
-    shader = shader.replace('#ifdef USE_SHADOWMAP', '#ifdef USE_SHADOWMAP\n' + pcss({ ...props
-    }));
-    shader = shader.replace('#if defined( SHADOWMAP_TYPE_PCF )', '\nreturn PCSS(shadowMap, shadowCoord);\n#if defined( SHADOWMAP_TYPE_PCF )');
-    THREE.ShaderChunk.shadowmap_pars_fragment = shader;
+  float angle = highPassRandRGB(gl_FragCoord.xy).r * PI2;
+  float avgBlockerDepth = findBlocker(shadowMap, uv, zReceiver, angle);
+  if (avgBlockerDepth == -1.0) {
+    return 1.0;
   }
-};
+  float penumbraRatio = penumbraSize(zReceiver, avgBlockerDepth);
+  return vogelFilter(shadowMap, uv, zReceiver, 1.25 * penumbraRatio, angle);
+}`;
 
 function reset(gl, scene, camera) {
   scene.traverse(object => {
@@ -128,34 +122,27 @@ function reset(gl, scene, camera) {
 }
 
 function SoftShadows({
-  frustum = 3.75,
-  size = 0.005,
-  near = 9.5,
+  focus = 0,
   samples = 10,
-  rings = 11
+  size = 25
 }) {
   const gl = useThree(state => state.gl);
   const scene = useThree(state => state.scene);
   const camera = useThree(state => state.camera);
   React.useEffect(() => {
     const original = THREE.ShaderChunk.shadowmap_pars_fragment;
-    let shader = THREE.ShaderChunk.shadowmap_pars_fragment;
-    shader = shader.replace('#ifdef USE_SHADOWMAP', '#ifdef USE_SHADOWMAP\n' + pcss({
-      frustum,
+    THREE.ShaderChunk.shadowmap_pars_fragment = THREE.ShaderChunk.shadowmap_pars_fragment.replace('#ifdef USE_SHADOWMAP', '#ifdef USE_SHADOWMAP\n' + pcss({
       size,
-      near,
       samples,
-      rings
-    }));
-    shader = shader.replace('#if defined( SHADOWMAP_TYPE_PCF )', '\nreturn PCSS(shadowMap, shadowCoord);\n#if defined( SHADOWMAP_TYPE_PCF )');
-    THREE.ShaderChunk.shadowmap_pars_fragment = shader;
+      focus
+    })).replace('#if defined( SHADOWMAP_TYPE_PCF )', '\nreturn PCSS(shadowMap, shadowCoord);\n#if defined( SHADOWMAP_TYPE_PCF )');
     reset(gl, scene, camera);
     return () => {
       THREE.ShaderChunk.shadowmap_pars_fragment = original;
       reset(gl, scene, camera);
     };
-  }, [frustum, size, near, samples, rings]);
+  }, [focus, size, samples]);
   return null;
 }
 
-export { SoftShadows, softShadows };
+export { SoftShadows };