@react-three/drei 9.40.5 → 9.41.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +37 -4
- package/core/Instances.cjs.js +1 -1
- package/core/Instances.js +3 -1
- package/core/SpotLight.cjs.js +1 -1
- package/core/SpotLight.d.ts +23 -28
- package/core/SpotLight.js +186 -14
- package/core/Trail.cjs.js +1 -1
- package/core/Trail.js +4 -3
- package/core/index.cjs.js +1 -1
- package/core/index.js +1 -1
- package/helpers/glsl/DefaultSpotlightShadowShadows.glsl.js +3 -0
- package/index.cjs.js +1 -1
- package/index.js +1 -1
- package/native/index.cjs.js +1 -1
- package/native/index.js +1 -1
- package/package.json +1 -1
- package/web/index.cjs.js +1 -1
- package/web/index.js +1 -1
- package/web/pivotControls/index.cjs.js +1 -1
- package/web/pivotControls/index.js +4 -2
package/README.md
CHANGED
|
@@ -475,7 +475,7 @@ enum Controls {
|
|
|
475
475
|
jump = 'jump',
|
|
476
476
|
}
|
|
477
477
|
function App() {
|
|
478
|
-
const map = useMemo<KeyboardControlsEntry<Controls
|
|
478
|
+
const map = useMemo<KeyboardControlsEntry<Controls>[]>(()=>[
|
|
479
479
|
{ name: Controls.forward, keys: ['ArrowUp', 'w', 'W'] },
|
|
480
480
|
{ name: Controls.back, keys: ['ArrowDown', 's', 'S'] },
|
|
481
481
|
{ name: Controls.left, keys: ['ArrowLeft', 'a', 'A'] },
|
|
@@ -1027,7 +1027,7 @@ You can either pass a Mesh and InstancedMesh as children:
|
|
|
1027
1027
|
```tsx
|
|
1028
1028
|
// This simple example scatters 1000 spheres on the surface of the sphere mesh.
|
|
1029
1029
|
<Sampler
|
|
1030
|
-
weight={
|
|
1030
|
+
weight={'normal'} // the name of the attribute to be used as sampling weight
|
|
1031
1031
|
transform={transformPoint} // a function that transforms each instance given a sample. See the examples for more.
|
|
1032
1032
|
count={16} // Number of samples
|
|
1033
1033
|
>
|
|
@@ -1036,7 +1036,7 @@ You can either pass a Mesh and InstancedMesh as children:
|
|
|
1036
1036
|
</mesh>
|
|
1037
1037
|
|
|
1038
1038
|
<instancedMesh args={[null, null, 1_000]}>
|
|
1039
|
-
<sphereGeometry args={[0.1]}/>
|
|
1039
|
+
<sphereGeometry args={[0.1]} />
|
|
1040
1040
|
</instancedMesh>
|
|
1041
1041
|
</Sampler>
|
|
1042
1042
|
```
|
|
@@ -1950,7 +1950,7 @@ A convenience hook that returns a `THREE.VideoTexture` and integrates loading in
|
|
|
1950
1950
|
|
|
1951
1951
|
```tsx
|
|
1952
1952
|
type VideoTextureProps = {
|
|
1953
|
-
unsuspend?: 'canplay' | 'canplaythrough'
|
|
1953
|
+
unsuspend?: 'canplay' | 'canplaythrough' | 'loadedmetadata'
|
|
1954
1954
|
muted?: boolean
|
|
1955
1955
|
loop?: boolean
|
|
1956
1956
|
start?: boolean
|
|
@@ -2828,6 +2828,39 @@ function Foo() {
|
|
|
2828
2828
|
return <SpotLight depthBuffer={depthBuffer} />
|
|
2829
2829
|
```
|
|
2830
2830
|
|
|
2831
|
+
#### SpotLightShadows
|
|
2832
|
+
|
|
2833
|
+
A shadow caster that can help cast shadows of different patterns (textures) onto the scene.
|
|
2834
|
+
|
|
2835
|
+
```jsx
|
|
2836
|
+
<SpotLight>
|
|
2837
|
+
<SpotLightShadows
|
|
2838
|
+
distance={0.4} // Distance between the shadow caster and light
|
|
2839
|
+
alphaTest={0.5} // Sets the alpha value to be used when running an alpha test. See Material.alphaTest
|
|
2840
|
+
scale={1} // Scale of the shadow caster plane
|
|
2841
|
+
map={undefined} // Texture - Pattern of the shadow
|
|
2842
|
+
shader={undefined} // Optional shader to run. Lets you add effects to the shadow map. See bellow
|
|
2843
|
+
width={512} // Width of the shadow map. The higher the more expnsive
|
|
2844
|
+
height={512} // Height of the shadow map. The higher the more expnsive
|
|
2845
|
+
/>
|
|
2846
|
+
</SpotLight>
|
|
2847
|
+
```
|
|
2848
|
+
|
|
2849
|
+
An optinal `shader` prop lets you run a custom shader to modify/add effects to your shadow texture. The shader privides the following uniforms and varyings.
|
|
2850
|
+
|
|
2851
|
+
| Type | Name | Notes |
|
|
2852
|
+
| ------------------- | ------------ | -------------------------------------- |
|
|
2853
|
+
| `varying vec2` | `vUv` | UVs of the shadow casting plane |
|
|
2854
|
+
| `uniform sampler2D` | `uShadowMap` | The texture provided to the `map` prop |
|
|
2855
|
+
| `uniform float` | `uTime` | Current time |
|
|
2856
|
+
|
|
2857
|
+
Treat the output of the shader like an alpha map where `1` is opaque and `0` is transparent.
|
|
2858
|
+
|
|
2859
|
+
```glsl
|
|
2860
|
+
gl_FragColor = vec4(vec3(1.), 1.); // Opaque
|
|
2861
|
+
gl_FragColor = vec4(vec3(0.), 1.); // Transparnet
|
|
2862
|
+
```
|
|
2863
|
+
|
|
2831
2864
|
#### Environment
|
|
2832
2865
|
|
|
2833
2866
|
[](https://drei.pmnd.rs/?path=/story/staging-environment--environment-story)
|
package/core/Instances.cjs.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@babel/runtime/helpers/extends"),t=require("three"),r=require("react"),n=require("@react-three/fiber"),a=require("react-merge-refs"),c=require("react-composer");function i(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function s(e){if(e&&e.__esModule)return e;var t=Object.create(null);return e&&Object.keys(e).forEach((function(r){if("default"!==r){var n=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(t,r,n.get?n:{enumerable:!0,get:function(){return e[r]}})}})),t.default=e,Object.freeze(t)}var o=i(e),u=s(t),l=s(r),f=i(a),d=i(c);const m=new u.Matrix4,y=new u.Matrix4,p=[],h=new u.Mesh;class x extends u.Group{constructor(){super(),this.color=new u.Color("white"),this.instance={current:void 0},this.instanceKey={current:void 0}}get geometry(){var e;return null==(e=this.instance.current)?void 0:e.geometry}raycast(e,t){const r=this.instance.current;if(!r)return;if(!r.geometry||!r.material)return;h.geometry=r.geometry;const n=r.matrixWorld,a=r.userData.instances.indexOf(this.instanceKey);if(!(-1===a||a>r.count)){r.getMatrixAt(a,m),y.multiplyMatrices(n,m),h.matrixWorld=y,h.raycast(e,p);for(let e=0,r=p.length;e<r;e++){const r=p[e];r.instanceId=a,r.object=this,t.push(r)}p.length=0}}}const g=l.createContext(null),M=new u.Matrix4,b=new u.Matrix4,w=new u.Matrix4,v=new u.Vector3,E=new u.Quaternion,A=new u.Vector3,j=l.forwardRef((({context:e,children:t,...r},a)=>{l.useMemo((()=>n.extend({PositionMesh:x})),[]);const c=l.useRef(),{subscribe:i,getParent:s}=l.useContext(e||g);return l.useLayoutEffect((()=>i(c)),[]),l.createElement("positionMesh",o.default({instance:s(),instanceKey:c,ref:f.default([a,c])},r),t)})),O=l.forwardRef((({children:e,range:t,limit:r=1e3,frames:a=1/0,...c},i)=>{const[{context:s,instance:d}]=l.useState((()=>{const e=l.createContext(null);return{context:e,instance:l.forwardRef(((t,r)=>l.createElement(j,o.default({context:e},t,{ref:r}))))}})),m=l.useRef(null),[y,p]=l.useState([]),[[h,x]]=l.useState((()=>{const e=new Float32Array(16*r);for(let t=0;t<r;t++)w.identity().toArray(e,16*t);return[e,new Float32Array([...new Array(3*r)].map((()=>1)))]}));l.useEffect((()=>{m.current.instanceMatrix.needsUpdate=!0}));let O=0,P=0;n.useFrame((()=>{if(a===1/0||O<a){m.current.updateMatrix(),m.current.updateMatrixWorld(),M.copy(m.current.matrixWorld).invert(),P=Math.min(r,void 0!==t?t:r,y.length),m.current.count=P,m.current.instanceMatrix.updateRange.count=16*P,m.current.instanceColor.updateRange.count=3*P;for(let e=0;e<y.length;e++){const t=y[e].current;t.matrixWorld.decompose(v,E,A),b.compose(v,E,A).premultiply(M),b.toArray(h,16*e),m.current.instanceMatrix.needsUpdate=!0,t.color.toArray(x,3*e),m.current.instanceColor.needsUpdate=!0}O++}}));const R=l.useMemo((()=>({getParent:()=>m,subscribe:e=>(p((t=>[...t,e])),()=>p((t=>t.filter((t=>t.current!==e.current)))))})),[]);return l.createElement("instancedMesh",o.default({userData:{instances:y},matrixAutoUpdate:!1,ref:f.default([i,m]),args:[null,null,0],raycast:()=>null},c),l.createElement("instancedBufferAttribute",{attach:"instanceMatrix",count:h.length/16,array:h,itemSize:16,usage:u.DynamicDrawUsage}),l.createElement("instancedBufferAttribute",{attach:"instanceColor",count:x.length/3,array:x,itemSize:3,usage:u.DynamicDrawUsage}),"function"==typeof e?l.createElement(s.Provider,{value:R},e(d)):l.createElement(g.Provider,{value:R},e))})),P=l.forwardRef((function({meshes:e,children:t,...r},n){const a=Array.isArray(e);if(!a)for(const t of Object.keys(e))e[t].isMesh||delete e[t];return l.createElement("group",{ref:n},l.createElement(d.default,{components:(a?e:Object.values(e)).map((({geometry:e,material:t})=>l.createElement(O,o.default({key:e.uuid,geometry:e,material:t},r))))},(r=>a?t(...r):t(Object.keys(e).filter((t=>e[t].isMesh)).reduce(((e,t,n)=>({...e,[t]:r[n]})),{})))))}));exports.Instance=j,exports.Instances=O,exports.Merged=P;
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@babel/runtime/helpers/extends"),t=require("three"),r=require("react"),n=require("@react-three/fiber"),a=require("react-merge-refs"),c=require("react-composer");function i(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function s(e){if(e&&e.__esModule)return e;var t=Object.create(null);return e&&Object.keys(e).forEach((function(r){if("default"!==r){var n=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(t,r,n.get?n:{enumerable:!0,get:function(){return e[r]}})}})),t.default=e,Object.freeze(t)}var o=i(e),u=s(t),l=s(r),f=i(a),d=i(c);const m=new u.Matrix4,y=new u.Matrix4,p=[],h=new u.Mesh;class x extends u.Group{constructor(){super(),this.color=new u.Color("white"),this.instance={current:void 0},this.instanceKey={current:void 0}}get geometry(){var e;return null==(e=this.instance.current)?void 0:e.geometry}raycast(e,t){const r=this.instance.current;if(!r)return;if(!r.geometry||!r.material)return;h.geometry=r.geometry;const n=r.matrixWorld,a=r.userData.instances.indexOf(this.instanceKey);if(!(-1===a||a>r.count)){r.getMatrixAt(a,m),y.multiplyMatrices(n,m),h.matrixWorld=y,r.material instanceof u.Material?h.material.side=r.material.side:h.material.side=r.material[0].side,h.raycast(e,p);for(let e=0,r=p.length;e<r;e++){const r=p[e];r.instanceId=a,r.object=this,t.push(r)}p.length=0}}}const g=l.createContext(null),M=new u.Matrix4,b=new u.Matrix4,w=new u.Matrix4,v=new u.Vector3,E=new u.Quaternion,A=new u.Vector3,j=l.forwardRef((({context:e,children:t,...r},a)=>{l.useMemo((()=>n.extend({PositionMesh:x})),[]);const c=l.useRef(),{subscribe:i,getParent:s}=l.useContext(e||g);return l.useLayoutEffect((()=>i(c)),[]),l.createElement("positionMesh",o.default({instance:s(),instanceKey:c,ref:f.default([a,c])},r),t)})),O=l.forwardRef((({children:e,range:t,limit:r=1e3,frames:a=1/0,...c},i)=>{const[{context:s,instance:d}]=l.useState((()=>{const e=l.createContext(null);return{context:e,instance:l.forwardRef(((t,r)=>l.createElement(j,o.default({context:e},t,{ref:r}))))}})),m=l.useRef(null),[y,p]=l.useState([]),[[h,x]]=l.useState((()=>{const e=new Float32Array(16*r);for(let t=0;t<r;t++)w.identity().toArray(e,16*t);return[e,new Float32Array([...new Array(3*r)].map((()=>1)))]}));l.useEffect((()=>{m.current.instanceMatrix.needsUpdate=!0}));let O=0,P=0;n.useFrame((()=>{if(a===1/0||O<a){m.current.updateMatrix(),m.current.updateMatrixWorld(),M.copy(m.current.matrixWorld).invert(),P=Math.min(r,void 0!==t?t:r,y.length),m.current.count=P,m.current.instanceMatrix.updateRange.count=16*P,m.current.instanceColor.updateRange.count=3*P;for(let e=0;e<y.length;e++){const t=y[e].current;t.matrixWorld.decompose(v,E,A),b.compose(v,E,A).premultiply(M),b.toArray(h,16*e),m.current.instanceMatrix.needsUpdate=!0,t.color.toArray(x,3*e),m.current.instanceColor.needsUpdate=!0}O++}}));const R=l.useMemo((()=>({getParent:()=>m,subscribe:e=>(p((t=>[...t,e])),()=>p((t=>t.filter((t=>t.current!==e.current)))))})),[]);return l.createElement("instancedMesh",o.default({userData:{instances:y},matrixAutoUpdate:!1,ref:f.default([i,m]),args:[null,null,0],raycast:()=>null},c),l.createElement("instancedBufferAttribute",{attach:"instanceMatrix",count:h.length/16,array:h,itemSize:16,usage:u.DynamicDrawUsage}),l.createElement("instancedBufferAttribute",{attach:"instanceColor",count:x.length/3,array:x,itemSize:3,usage:u.DynamicDrawUsage}),"function"==typeof e?l.createElement(s.Provider,{value:R},e(d)):l.createElement(g.Provider,{value:R},e))})),P=l.forwardRef((function({meshes:e,children:t,...r},n){const a=Array.isArray(e);if(!a)for(const t of Object.keys(e))e[t].isMesh||delete e[t];return l.createElement("group",{ref:n},l.createElement(d.default,{components:(a?e:Object.values(e)).map((({geometry:e,material:t})=>l.createElement(O,o.default({key:e.uuid,geometry:e,material:t},r))))},(r=>a?t(...r):t(Object.keys(e).filter((t=>e[t].isMesh)).reduce(((e,t,n)=>({...e,[t]:r[n]})),{})))))}));exports.Instance=j,exports.Instances=O,exports.Merged=P;
|
package/core/Instances.js
CHANGED
|
@@ -48,7 +48,9 @@ class PositionMesh extends THREE.Group {
|
|
|
48
48
|
_instanceWorldMatrix.multiplyMatrices(matrixWorld, _instanceLocalMatrix); // the mesh represents this single instance
|
|
49
49
|
|
|
50
50
|
|
|
51
|
-
_mesh.matrixWorld = _instanceWorldMatrix;
|
|
51
|
+
_mesh.matrixWorld = _instanceWorldMatrix; // raycast side according to instance material
|
|
52
|
+
|
|
53
|
+
if (parent.material instanceof THREE.Material) _mesh.material.side = parent.material.side;else _mesh.material.side = parent.material[0].side;
|
|
52
54
|
|
|
53
55
|
_mesh.raycast(raycaster, _instanceIntersects); // process the result of raycast
|
|
54
56
|
|
package/core/SpotLight.cjs.js
CHANGED
|
@@ -1 +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"),o=require("../materials/SpotLightMaterial.cjs.js");function
|
|
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)};
|
package/core/SpotLight.d.ts
CHANGED
|
@@ -1,30 +1,25 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
|
-
import { DepthTexture, SpotLight as SpotLightImpl } from 'three';
|
|
3
|
-
declare
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
radiusTop?: number | undefined;
|
|
26
|
-
radiusBottom?: number | undefined;
|
|
27
|
-
opacity?: number | undefined;
|
|
28
|
-
color?: string | number | undefined;
|
|
29
|
-
}, "visible" | "attach" | "args" | "children" | "key" | "onUpdate" | "position" | "up" | "scale" | "rotation" | "matrix" | "quaternion" | "layers" | "dispose" | "type" | "id" | "uuid" | "name" | "parent" | "modelViewMatrix" | "normalMatrix" | "matrixWorld" | "matrixAutoUpdate" | "matrixWorldNeedsUpdate" | "castShadow" | "receiveShadow" | "frustumCulled" | "renderOrder" | "animations" | "userData" | "customDepthMaterial" | "customDistanceMaterial" | "isObject3D" | "onBeforeRender" | "onAfterRender" | "applyMatrix4" | "applyQuaternion" | "setRotationFromAxisAngle" | "setRotationFromEuler" | "setRotationFromMatrix" | "setRotationFromQuaternion" | "rotateOnAxis" | "rotateOnWorldAxis" | "rotateX" | "rotateY" | "rotateZ" | "translateOnAxis" | "translateX" | "translateY" | "translateZ" | "localToWorld" | "worldToLocal" | "lookAt" | "add" | "remove" | "removeFromParent" | "clear" | "getObjectById" | "getObjectByName" | "getObjectByProperty" | "getWorldPosition" | "getWorldQuaternion" | "getWorldScale" | "getWorldDirection" | "raycast" | "traverse" | "traverseVisible" | "traverseAncestors" | "updateMatrix" | "updateMatrixWorld" | "updateWorldMatrix" | "toJSON" | "clone" | "copy" | "addEventListener" | "hasEventListener" | "removeEventListener" | "dispatchEvent" | "color" | keyof import("@react-three/fiber/dist/declarations/src/core/events").EventHandlers | "intensity" | "isLight" | "shadow" | "shadowCameraFov" | "shadowCameraLeft" | "shadowCameraRight" | "shadowCameraTop" | "shadowCameraBottom" | "shadowCameraNear" | "shadowCameraFar" | "shadowBias" | "shadowMapWidth" | "shadowMapHeight" | "opacity" | "target" | "distance" | "angle" | "decay" | "power" | "penumbra" | "isSpotLight" | "depthBuffer" | "attenuation" | "anglePower" | "radiusTop" | "radiusBottom"> & React.RefAttributes<SpotLightImpl>>;
|
|
2
|
+
import { DepthTexture, SpotLight as SpotLightImpl, Texture } from 'three';
|
|
3
|
+
declare type SpotLightProps = JSX.IntrinsicElements['spotLight'] & {
|
|
4
|
+
depthBuffer?: DepthTexture;
|
|
5
|
+
attenuation?: number;
|
|
6
|
+
anglePower?: number;
|
|
7
|
+
radiusTop?: number;
|
|
8
|
+
radiusBottom?: number;
|
|
9
|
+
opacity?: number;
|
|
10
|
+
color?: string | number;
|
|
11
|
+
volumetric?: boolean;
|
|
12
|
+
debug?: boolean;
|
|
13
|
+
};
|
|
14
|
+
interface ShadowMeshProps {
|
|
15
|
+
distance?: number;
|
|
16
|
+
alphaTest?: number;
|
|
17
|
+
scale?: number;
|
|
18
|
+
map?: Texture;
|
|
19
|
+
shader?: string;
|
|
20
|
+
width?: number;
|
|
21
|
+
height?: number;
|
|
22
|
+
}
|
|
23
|
+
export declare function SpotLightShadow(props: React.PropsWithChildren<ShadowMeshProps>): JSX.Element;
|
|
24
|
+
declare const SpotLight: React.ForwardRefExoticComponent<Pick<SpotLightProps, "visible" | "attach" | "args" | "children" | "key" | "onUpdate" | "position" | "up" | "scale" | "rotation" | "matrix" | "quaternion" | "layers" | "dispose" | "type" | "id" | "uuid" | "name" | "parent" | "modelViewMatrix" | "normalMatrix" | "matrixWorld" | "matrixAutoUpdate" | "matrixWorldNeedsUpdate" | "castShadow" | "receiveShadow" | "frustumCulled" | "renderOrder" | "animations" | "userData" | "customDepthMaterial" | "customDistanceMaterial" | "isObject3D" | "onBeforeRender" | "onAfterRender" | "applyMatrix4" | "applyQuaternion" | "setRotationFromAxisAngle" | "setRotationFromEuler" | "setRotationFromMatrix" | "setRotationFromQuaternion" | "rotateOnAxis" | "rotateOnWorldAxis" | "rotateX" | "rotateY" | "rotateZ" | "translateOnAxis" | "translateX" | "translateY" | "translateZ" | "localToWorld" | "worldToLocal" | "lookAt" | "add" | "remove" | "removeFromParent" | "clear" | "getObjectById" | "getObjectByName" | "getObjectByProperty" | "getWorldPosition" | "getWorldQuaternion" | "getWorldScale" | "getWorldDirection" | "raycast" | "traverse" | "traverseVisible" | "traverseAncestors" | "updateMatrix" | "updateMatrixWorld" | "updateWorldMatrix" | "toJSON" | "clone" | "copy" | "addEventListener" | "hasEventListener" | "removeEventListener" | "dispatchEvent" | "color" | keyof import("@react-three/fiber/dist/declarations/src/core/events").EventHandlers | "intensity" | "isLight" | "shadow" | "shadowCameraFov" | "shadowCameraLeft" | "shadowCameraRight" | "shadowCameraTop" | "shadowCameraBottom" | "shadowCameraNear" | "shadowCameraFar" | "shadowBias" | "shadowMapWidth" | "shadowMapHeight" | "opacity" | "target" | "distance" | "angle" | "decay" | "power" | "penumbra" | "isSpotLight" | "depthBuffer" | "attenuation" | "debug" | "anglePower" | "volumetric" | "radiusTop" | "radiusBottom"> & React.RefAttributes<SpotLightImpl>>;
|
|
30
25
|
export { SpotLight };
|
package/core/SpotLight.js
CHANGED
|
@@ -1,11 +1,17 @@
|
|
|
1
1
|
import _extends from '@babel/runtime/helpers/esm/extends';
|
|
2
2
|
import * as React from 'react';
|
|
3
|
-
import { Vector3, CylinderGeometry, Matrix4 } from 'three';
|
|
3
|
+
import { Vector3, CylinderGeometry, Matrix4, WebGLRenderTarget, RGBAFormat, LinearEncoding, ShaderMaterial, DoubleSide, RepeatWrapping } from 'three';
|
|
4
4
|
import { useThree, useFrame } from '@react-three/fiber';
|
|
5
|
+
import { FullScreenQuad } from 'three-stdlib';
|
|
6
|
+
import mergeRefs from 'react-merge-refs';
|
|
5
7
|
import { SpotLightMaterial } from '../materials/SpotLightMaterial.js';
|
|
8
|
+
import SpotlightShadowShader from '../helpers/glsl/DefaultSpotlightShadowShadows.glsl.js';
|
|
6
9
|
|
|
7
|
-
const
|
|
8
|
-
|
|
10
|
+
const isSpotLight = child => {
|
|
11
|
+
return child == null ? void 0 : child.isSpotLight;
|
|
12
|
+
};
|
|
13
|
+
|
|
14
|
+
function VolumetricMesh({
|
|
9
15
|
opacity = 1,
|
|
10
16
|
radiusTop,
|
|
11
17
|
radiusBottom,
|
|
@@ -14,14 +20,14 @@ const SpotLight = /*#__PURE__*/React.forwardRef(({
|
|
|
14
20
|
distance = 5,
|
|
15
21
|
angle = 0.15,
|
|
16
22
|
attenuation = 5,
|
|
17
|
-
anglePower = 5
|
|
18
|
-
|
|
19
|
-
}, ref) => {
|
|
23
|
+
anglePower = 5
|
|
24
|
+
}) {
|
|
20
25
|
const mesh = React.useRef(null);
|
|
21
26
|
const size = useThree(state => state.size);
|
|
22
27
|
const camera = useThree(state => state.camera);
|
|
23
28
|
const dpr = useThree(state => state.viewport.dpr);
|
|
24
29
|
const [material] = React.useState(() => new SpotLightMaterial());
|
|
30
|
+
const [vec] = React.useState(() => new Vector3());
|
|
25
31
|
radiusTop = radiusTop === undefined ? 0.1 : radiusTop;
|
|
26
32
|
radiusBottom = radiusBottom === undefined ? angle * 7 : radiusBottom;
|
|
27
33
|
useFrame(() => {
|
|
@@ -33,13 +39,8 @@ const SpotLight = /*#__PURE__*/React.forwardRef(({
|
|
|
33
39
|
geometry.applyMatrix4(new Matrix4().makeTranslation(0, -distance / 2, 0));
|
|
34
40
|
geometry.applyMatrix4(new Matrix4().makeRotationX(-Math.PI / 2));
|
|
35
41
|
return geometry;
|
|
36
|
-
}, [
|
|
37
|
-
return /*#__PURE__*/React.createElement("
|
|
38
|
-
ref: ref,
|
|
39
|
-
angle: angle,
|
|
40
|
-
color: color,
|
|
41
|
-
distance: distance
|
|
42
|
-
}, props), /*#__PURE__*/React.createElement("mesh", {
|
|
42
|
+
}, [distance, radiusTop, radiusBottom]);
|
|
43
|
+
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("mesh", {
|
|
43
44
|
ref: mesh,
|
|
44
45
|
geometry: geom,
|
|
45
46
|
raycast: () => null
|
|
@@ -55,6 +56,177 @@ const SpotLight = /*#__PURE__*/React.forwardRef(({
|
|
|
55
56
|
"uniforms-cameraFar-value": camera.far,
|
|
56
57
|
"uniforms-resolution-value": depthBuffer ? [size.width * dpr, size.height * dpr] : [0, 0]
|
|
57
58
|
})));
|
|
59
|
+
}
|
|
60
|
+
|
|
61
|
+
function useCommon(spotlight, mesh, width, height, distance) {
|
|
62
|
+
const [[pos, dir]] = React.useState(() => [new Vector3(), new Vector3()]);
|
|
63
|
+
React.useLayoutEffect(() => {
|
|
64
|
+
if (isSpotLight(spotlight.current)) {
|
|
65
|
+
console.log(spotlight.current);
|
|
66
|
+
spotlight.current.shadow.mapSize.set(width, height);
|
|
67
|
+
spotlight.current.shadow.needsUpdate = true;
|
|
68
|
+
} else {
|
|
69
|
+
throw new Error('SpotlightShadow must be a child of a SpotLight');
|
|
70
|
+
}
|
|
71
|
+
}, [spotlight, width, height]);
|
|
72
|
+
useFrame(() => {
|
|
73
|
+
if (!spotlight.current) return;
|
|
74
|
+
const A = spotlight.current.position;
|
|
75
|
+
const B = spotlight.current.target.position;
|
|
76
|
+
dir.copy(B).sub(A);
|
|
77
|
+
var len = dir.length();
|
|
78
|
+
dir.normalize().multiplyScalar(len * distance);
|
|
79
|
+
pos.copy(A).add(dir);
|
|
80
|
+
mesh.current.position.copy(pos);
|
|
81
|
+
mesh.current.lookAt(spotlight.current.target.position);
|
|
82
|
+
});
|
|
83
|
+
}
|
|
84
|
+
|
|
85
|
+
function SpotlightShadowWithShader({
|
|
86
|
+
distance = 0.4,
|
|
87
|
+
alphaTest = 0.5,
|
|
88
|
+
map,
|
|
89
|
+
shader = SpotlightShadowShader,
|
|
90
|
+
width = 512,
|
|
91
|
+
height = 512,
|
|
92
|
+
scale = 1,
|
|
93
|
+
children,
|
|
94
|
+
...rest
|
|
95
|
+
}) {
|
|
96
|
+
const mesh = React.useRef(null);
|
|
97
|
+
const spotlight = rest.spotlightRef;
|
|
98
|
+
const debug = rest.debug;
|
|
99
|
+
useCommon(spotlight, mesh, width, height, distance);
|
|
100
|
+
const renderTarget = React.useMemo(() => new WebGLRenderTarget(width, height, {
|
|
101
|
+
format: RGBAFormat,
|
|
102
|
+
encoding: LinearEncoding,
|
|
103
|
+
stencilBuffer: false // depthTexture: null!
|
|
104
|
+
|
|
105
|
+
}), [width, height]);
|
|
106
|
+
const uniforms = React.useRef({
|
|
107
|
+
uShadowMap: {
|
|
108
|
+
value: map
|
|
109
|
+
},
|
|
110
|
+
uTime: {
|
|
111
|
+
value: 0
|
|
112
|
+
}
|
|
113
|
+
});
|
|
114
|
+
React.useEffect(() => void (uniforms.current.uShadowMap.value = map), [map]);
|
|
115
|
+
const fsQuad = React.useMemo(() => new FullScreenQuad(new ShaderMaterial({
|
|
116
|
+
uniforms: uniforms.current,
|
|
117
|
+
vertexShader:
|
|
118
|
+
/* glsl */
|
|
119
|
+
`
|
|
120
|
+
varying vec2 vUv;
|
|
121
|
+
|
|
122
|
+
void main() {
|
|
123
|
+
vUv = uv;
|
|
124
|
+
gl_Position = projectionMatrix * modelViewMatrix * vec4(position, 1.0);
|
|
125
|
+
}
|
|
126
|
+
`,
|
|
127
|
+
fragmentShader: shader
|
|
128
|
+
})), [shader]);
|
|
129
|
+
React.useEffect(() => () => {
|
|
130
|
+
fsQuad.material.dispose();
|
|
131
|
+
fsQuad.dispose();
|
|
132
|
+
}, [fsQuad]);
|
|
133
|
+
React.useEffect(() => () => renderTarget.dispose(), [renderTarget]);
|
|
134
|
+
useFrame(({
|
|
135
|
+
gl
|
|
136
|
+
}, dt) => {
|
|
137
|
+
uniforms.current.uTime.value += dt;
|
|
138
|
+
gl.setRenderTarget(renderTarget);
|
|
139
|
+
fsQuad.render(gl);
|
|
140
|
+
gl.setRenderTarget(null);
|
|
141
|
+
});
|
|
142
|
+
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("mesh", {
|
|
143
|
+
ref: mesh,
|
|
144
|
+
scale: scale,
|
|
145
|
+
castShadow: true
|
|
146
|
+
}, /*#__PURE__*/React.createElement("planeGeometry", null), /*#__PURE__*/React.createElement("meshBasicMaterial", {
|
|
147
|
+
transparent: true,
|
|
148
|
+
side: DoubleSide,
|
|
149
|
+
alphaTest: alphaTest,
|
|
150
|
+
alphaMap: renderTarget.texture,
|
|
151
|
+
"alphaMap-wrapS": RepeatWrapping,
|
|
152
|
+
"alphaMap-wrapT": RepeatWrapping,
|
|
153
|
+
opacity: debug ? 1 : 0
|
|
154
|
+
}, children)));
|
|
155
|
+
}
|
|
156
|
+
|
|
157
|
+
function SpotlightShadowWithoutShader({
|
|
158
|
+
distance = 0.4,
|
|
159
|
+
alphaTest = 0.5,
|
|
160
|
+
map,
|
|
161
|
+
width = 512,
|
|
162
|
+
height = 512,
|
|
163
|
+
scale,
|
|
164
|
+
children,
|
|
165
|
+
...rest
|
|
166
|
+
}) {
|
|
167
|
+
const mesh = React.useRef(null);
|
|
168
|
+
const spotlight = rest.spotlightRef;
|
|
169
|
+
const debug = rest.debug;
|
|
170
|
+
useCommon(spotlight, mesh, width, height, distance);
|
|
171
|
+
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("mesh", {
|
|
172
|
+
ref: mesh,
|
|
173
|
+
scale: scale,
|
|
174
|
+
castShadow: true
|
|
175
|
+
}, /*#__PURE__*/React.createElement("planeGeometry", null), /*#__PURE__*/React.createElement("meshBasicMaterial", {
|
|
176
|
+
transparent: true,
|
|
177
|
+
side: DoubleSide,
|
|
178
|
+
alphaTest: alphaTest,
|
|
179
|
+
alphaMap: map,
|
|
180
|
+
"alphaMap-wrapS": RepeatWrapping,
|
|
181
|
+
"alphaMap-wrapT": RepeatWrapping,
|
|
182
|
+
opacity: debug ? 1 : 0
|
|
183
|
+
}, children)));
|
|
184
|
+
}
|
|
185
|
+
|
|
186
|
+
function SpotLightShadow(props) {
|
|
187
|
+
if (props.shader) return /*#__PURE__*/React.createElement(SpotlightShadowWithShader, props);
|
|
188
|
+
return /*#__PURE__*/React.createElement(SpotlightShadowWithoutShader, props);
|
|
189
|
+
}
|
|
190
|
+
const SpotLight = /*#__PURE__*/React.forwardRef(({
|
|
191
|
+
// Volumetric
|
|
192
|
+
opacity = 1,
|
|
193
|
+
radiusTop,
|
|
194
|
+
radiusBottom,
|
|
195
|
+
depthBuffer,
|
|
196
|
+
color = 'white',
|
|
197
|
+
distance = 5,
|
|
198
|
+
angle = 0.15,
|
|
199
|
+
attenuation = 5,
|
|
200
|
+
anglePower = 5,
|
|
201
|
+
volumetric = true,
|
|
202
|
+
debug = false,
|
|
203
|
+
children,
|
|
204
|
+
...props
|
|
205
|
+
}, ref) => {
|
|
206
|
+
const spotlight = React.useRef(null);
|
|
207
|
+
return /*#__PURE__*/React.createElement("group", null, debug && spotlight.current && /*#__PURE__*/React.createElement("spotLightHelper", {
|
|
208
|
+
args: [spotlight.current]
|
|
209
|
+
}), /*#__PURE__*/React.createElement("spotLight", _extends({
|
|
210
|
+
ref: mergeRefs([ref, spotlight]),
|
|
211
|
+
angle: angle,
|
|
212
|
+
color: color,
|
|
213
|
+
distance: distance,
|
|
214
|
+
castShadow: true
|
|
215
|
+
}, props), volumetric && /*#__PURE__*/React.createElement(VolumetricMesh, {
|
|
216
|
+
debug: debug,
|
|
217
|
+
opacity: opacity,
|
|
218
|
+
radiusTop: radiusTop,
|
|
219
|
+
radiusBottom: radiusBottom,
|
|
220
|
+
depthBuffer: depthBuffer,
|
|
221
|
+
color: color,
|
|
222
|
+
distance: distance,
|
|
223
|
+
angle: angle,
|
|
224
|
+
attenuation: attenuation,
|
|
225
|
+
anglePower: anglePower
|
|
226
|
+
})), children && /*#__PURE__*/React.cloneElement(children, {
|
|
227
|
+
spotlightRef: spotlight,
|
|
228
|
+
debug: debug
|
|
229
|
+
}));
|
|
58
230
|
});
|
|
59
231
|
|
|
60
|
-
export { SpotLight };
|
|
232
|
+
export { SpotLight, SpotLightShadow };
|
package/core/Trail.cjs.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@react-three/fiber"),t=require("react"),r=require("three"),n=require("meshline");function o(e){if(e&&e.__esModule)return e;var t=Object.create(null);return e&&Object.keys(e).forEach((function(r){if("default"!==r){var n=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(t,r,n.get?n:{enumerable:!0,get:function(){return e[r]}})}})),t.default=e,Object.freeze(t)}var i=o(t);const s={width:.2,length:1,decay:1,local:!1,stride:0,interval:1},
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@react-three/fiber"),t=require("react"),r=require("three"),n=require("meshline");function o(e){if(e&&e.__esModule)return e;var t=Object.create(null);return e&&Object.keys(e).forEach((function(r){if("default"!==r){var n=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(t,r,n.get?n:{enumerable:!0,get:function(){return e[r]}})}})),t.default=e,Object.freeze(t)}var i=o(t);const s={width:.2,length:1,decay:1,local:!1,stride:0,interval:1},c=(e,t=1)=>(e.set(e.subarray(t)),e.fill(-1/0,-t),e);function u(t,n){const{length:o,local:u,decay:l,interval:a,stride:f}={...s,...n},h=i.useRef(),[d]=i.useState((()=>new r.Vector3));i.useLayoutEffect((()=>{t&&(h.current=Float32Array.from({length:10*o*3},((e,r)=>t.position.getComponent(r%3))))}),[o,t]);const p=i.useRef(new r.Vector3),y=i.useRef(0);return e.useFrame((()=>{if(t&&h.current){if(0===y.current){let e;u?e=t.position:(t.getWorldPosition(d),e=d);const r=1*l;for(let t=0;t<r;t++)e.distanceTo(p.current)<f||(c(h.current,3),h.current.set(e.toArray(),h.current.length-3));p.current.copy(e)}y.current++,y.current=y.current%a}})),h}const l=i.forwardRef(((t,o)=>{const{children:c}=t,{width:l,length:a,decay:f,local:h,stride:d,interval:p}={...s,...t},{color:y="hotpink",attenuation:g,target:m}=t,v=e.useThree((e=>e.size)),b=e.useThree((e=>e.scene)),w=i.useRef(null),[M,j]=i.useState(null),O=u(M,{length:a,decay:f,local:h,stride:d,interval:p});i.useEffect((()=>{const e=(null==m?void 0:m.current)||w.current.children.find((e=>e instanceof r.Object3D));e&&j(e)}),[O,m]);const E=i.useMemo((()=>new n.MeshLine),[]),P=i.useMemo((()=>{var e;const t=new n.MeshLineMaterial({lineWidth:.1*l,color:y,sizeAttenuation:1,resolution:new r.Vector2(v.width,v.height)});let o;if(c)if(Array.isArray(c))o=c.find((e=>{const t=e;return"string"==typeof t.type&&"meshLineMaterial"===t.type}));else{const e=c;"string"==typeof e.type&&"meshLineMaterial"===e.type&&(o=e)}return"object"==typeof(null==(e=o)?void 0:e.props)&&t.setValues(o.props),t}),[l,y,v,c]);return i.useEffect((()=>{P.uniforms.resolution.value.set(v.width,v.height)}),[v]),e.useFrame((()=>{O.current&&E.setPoints(O.current,g)})),i.createElement("group",null,e.createPortal(i.createElement("mesh",{ref:o,geometry:E,material:P}),b),i.createElement("group",{ref:w},c))}));exports.Trail=l,exports.useTrail=u;
|
package/core/Trail.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { useFrame, useThree } from '@react-three/fiber';
|
|
1
|
+
import { useFrame, useThree, createPortal } from '@react-three/fiber';
|
|
2
2
|
import * as React from 'react';
|
|
3
3
|
import { Vector3, Object3D, Vector2 } from 'three';
|
|
4
4
|
import { MeshLine, MeshLineMaterial } from 'meshline';
|
|
@@ -89,6 +89,7 @@ const Trail = /*#__PURE__*/React.forwardRef((props, forwardRef) => {
|
|
|
89
89
|
target
|
|
90
90
|
} = props;
|
|
91
91
|
const size = useThree(s => s.size);
|
|
92
|
+
const scene = useThree(s => s.scene);
|
|
92
93
|
const ref = React.useRef(null);
|
|
93
94
|
const [anchor, setAnchor] = React.useState(null);
|
|
94
95
|
const points = useTrail(anchor, {
|
|
@@ -148,11 +149,11 @@ const Trail = /*#__PURE__*/React.forwardRef((props, forwardRef) => {
|
|
|
148
149
|
if (!points.current) return;
|
|
149
150
|
geo.setPoints(points.current, attenuation);
|
|
150
151
|
});
|
|
151
|
-
return /*#__PURE__*/React.createElement("group", null, /*#__PURE__*/React.createElement("mesh", {
|
|
152
|
+
return /*#__PURE__*/React.createElement("group", null, createPortal( /*#__PURE__*/React.createElement("mesh", {
|
|
152
153
|
ref: forwardRef,
|
|
153
154
|
geometry: geo,
|
|
154
155
|
material: mat
|
|
155
|
-
}), /*#__PURE__*/React.createElement("group", {
|
|
156
|
+
}), scene), /*#__PURE__*/React.createElement("group", {
|
|
156
157
|
ref: ref
|
|
157
158
|
}, children));
|
|
158
159
|
});
|
package/core/index.cjs.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("./Billboard.cjs.js"),r=require("./QuadraticBezierLine.cjs.js"),s=require("./CubicBezierLine.cjs.js"),t=require("./CatmullRomLine.cjs.js"),o=require("./Line.cjs.js"),i=require("./PositionalAudio.cjs.js"),u=require("./Text.cjs.js"),a=require("./Text3D.cjs.js"),n=require("./Effects.cjs.js"),c=require("./GradientTexture.cjs.js"),j=require("./Image.cjs.js"),p=require("./Edges.cjs.js"),x=require("./Trail.cjs.js"),l=require("./Sampler.cjs.js"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("./Billboard.cjs.js"),r=require("./QuadraticBezierLine.cjs.js"),s=require("./CubicBezierLine.cjs.js"),t=require("./CatmullRomLine.cjs.js"),o=require("./Line.cjs.js"),i=require("./PositionalAudio.cjs.js"),u=require("./Text.cjs.js"),a=require("./Text3D.cjs.js"),n=require("./Effects.cjs.js"),c=require("./GradientTexture.cjs.js"),j=require("./Image.cjs.js"),p=require("./Edges.cjs.js"),x=require("./Trail.cjs.js"),l=require("./Sampler.cjs.js"),d=require("./ComputedAttribute.cjs.js"),q=require("./Clone.cjs.js"),m=require("./MarchingCubes.cjs.js"),h=require("./Decal.cjs.js"),C=require("./Svg.cjs.js"),M=require("./OrthographicCamera.cjs.js"),S=require("./PerspectiveCamera.cjs.js"),P=require("./CubeCamera.cjs.js"),b=require("./DeviceOrientationControls.cjs.js"),B=require("./FlyControls.cjs.js"),g=require("./MapControls.cjs.js"),f=require("./OrbitControls.cjs.js"),T=require("./TrackballControls.cjs.js"),v=require("./ArcballControls.cjs.js"),L=require("./TransformControls.cjs.js"),A=require("./PointerLockControls.cjs.js"),k=require("./FirstPersonControls.cjs.js"),D=require("./GizmoHelper.cjs.js"),E=require("./GizmoViewcube.cjs.js"),R=require("./GizmoViewport.cjs.js"),w=require("./useCubeTexture.cjs.js"),G=require("./useFBX.cjs.js"),z=require("./useGLTF.cjs.js"),F=require("./useKTX2.cjs.js"),O=require("./useProgress.cjs.js"),I=require("./useTexture.cjs.js"),V=require("./useVideoTexture.cjs.js"),y=require("./Stats.cjs.js"),H=require("./useDepthBuffer.cjs.js"),Q=require("./useAspect.cjs.js"),X=require("./useCamera.cjs.js"),K=require("./useDetectGPU.cjs.js"),W=require("./useHelper.cjs.js"),N=require("./useBVH.cjs.js"),U=require("./useContextBridge.cjs.js"),_=require("./useAnimations.cjs.js"),J=require("./useFBO.cjs.js"),Y=require("./useIntersect.cjs.js"),Z=require("./useBoxProjectedEnv.cjs.js"),$=require("./BBAnchor.cjs.js"),ee=require("./CurveModifier.cjs.js"),re=require("./MeshDistortMaterial.cjs.js"),se=require("./MeshWobbleMaterial.cjs.js"),te=require("./MeshReflectorMaterial.cjs.js"),oe=require("./MeshRefractionMaterial.cjs.js"),ie=require("./PointMaterial.cjs.js"),ue=require("./shaderMaterial.cjs.js"),ae=require("./softShadows.cjs.js"),ne=require("./shapes.cjs.js"),ce=require("./RoundedBox.cjs.js"),je=require("./ScreenQuad.cjs.js"),pe=require("./Center.cjs.js"),xe=require("./Bounds.cjs.js"),le=require("./CameraShake.cjs.js"),de=require("./Float.cjs.js"),qe=require("./Stage.cjs.js"),me=require("./Backdrop.cjs.js"),he=require("./Shadow.cjs.js"),Ce=require("./ContactShadows.cjs.js"),Me=require("./AccumulativeShadows.cjs.js"),Se=require("./Reflector.cjs.js"),Pe=require("./SpotLight.cjs.js"),be=require("./Environment.cjs.js"),Be=require("./Lightformer.cjs.js"),ge=require("./Sky.cjs.js"),fe=require("./Stars.cjs.js"),Te=require("./Cloud.cjs.js"),ve=require("./Sparkles.cjs.js"),Le=require("./useMatcapTexture.cjs.js"),Ae=require("./useNormalTexture.cjs.js"),ke=require("./Points.cjs.js"),De=require("./Instances.cjs.js"),Ee=require("./Segments.cjs.js"),Re=require("./Detailed.cjs.js"),we=require("./Preload.cjs.js"),Ge=require("./BakeShadows.cjs.js"),ze=require("./meshBounds.cjs.js"),Fe=require("./AdaptiveDpr.cjs.js"),Oe=require("./AdaptiveEvents.cjs.js"),Ie=require("./PerformanceMonitor.cjs.js"),Ve=require("./RenderTexture.cjs.js"),ye=require("./Mask.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("../materials/MeshRefractionMaterial.cjs.js"),require("../helpers/environment-assets.cjs.js"),require("../materials/SpotLightMaterial.cjs.js"),require("react-composer"),exports.Billboard=e.Billboard,exports.QuadraticBezierLine=r.QuadraticBezierLine,exports.CubicBezierLine=s.CubicBezierLine,exports.CatmullRomLine=t.CatmullRomLine,exports.Line=o.Line,exports.PositionalAudio=i.PositionalAudio,exports.Text=u.Text,exports.Text3D=a.Text3D,exports.Effects=n.Effects,exports.isWebGL2Available=n.isWebGL2Available,exports.GradientTexture=c.GradientTexture,exports.Image=j.Image,exports.Edges=p.Edges,exports.Trail=x.Trail,exports.useTrail=x.useTrail,exports.Sampler=l.Sampler,exports.useSurfaceSampler=l.useSurfaceSampler,exports.ComputedAttribute=d.ComputedAttribute,exports.Clone=q.Clone,exports.MarchingCube=m.MarchingCube,exports.MarchingCubes=m.MarchingCubes,exports.MarchingPlane=m.MarchingPlane,exports.Decal=h.Decal,exports.Svg=C.Svg,exports.OrthographicCamera=M.OrthographicCamera,exports.PerspectiveCamera=S.PerspectiveCamera,exports.CubeCamera=P.CubeCamera,exports.DeviceOrientationControls=b.DeviceOrientationControls,exports.FlyControls=B.FlyControls,exports.MapControls=g.MapControls,exports.OrbitControls=f.OrbitControls,exports.TrackballControls=T.TrackballControls,exports.ArcballControls=v.ArcballControls,exports.TransformControls=L.TransformControls,exports.PointerLockControls=A.PointerLockControls,exports.FirstPersonControls=k.FirstPersonControls,exports.GizmoHelper=D.GizmoHelper,exports.useGizmoContext=D.useGizmoContext,exports.GizmoViewcube=E.GizmoViewcube,exports.GizmoViewport=R.GizmoViewport,exports.useCubeTexture=w.useCubeTexture,exports.useFBX=G.useFBX,exports.useGLTF=z.useGLTF,exports.useKTX2=F.useKTX2,exports.useProgress=O.useProgress,exports.IsObject=I.IsObject,exports.useTexture=I.useTexture,exports.useVideoTexture=V.useVideoTexture,exports.Stats=y.Stats,exports.useDepthBuffer=H.useDepthBuffer,exports.useAspect=Q.useAspect,exports.useCamera=X.useCamera,exports.useDetectGPU=K.useDetectGPU,exports.useHelper=W.useHelper,exports.useBVH=N.useBVH,exports.useContextBridge=U.useContextBridge,exports.useAnimations=_.useAnimations,exports.useFBO=J.useFBO,exports.useIntersect=Y.useIntersect,exports.useBoxProjectedEnv=Z.useBoxProjectedEnv,exports.BBAnchor=$.BBAnchor,exports.CurveModifier=ee.CurveModifier,exports.MeshDistortMaterial=re.MeshDistortMaterial,exports.MeshWobbleMaterial=se.MeshWobbleMaterial,exports.MeshReflectorMaterial=te.MeshReflectorMaterial,exports.MeshRefractionMaterial=oe.MeshRefractionMaterial,exports.PointMaterial=ie.PointMaterial,exports.PointMaterialImpl=ie.PointMaterialImpl,exports.shaderMaterial=ue.shaderMaterial,exports.softShadows=ae.softShadows,exports.Box=ne.Box,exports.Capsule=ne.Capsule,exports.Circle=ne.Circle,exports.Cone=ne.Cone,exports.Cylinder=ne.Cylinder,exports.Dodecahedron=ne.Dodecahedron,exports.Extrude=ne.Extrude,exports.Icosahedron=ne.Icosahedron,exports.Lathe=ne.Lathe,exports.Octahedron=ne.Octahedron,exports.Plane=ne.Plane,exports.Polyhedron=ne.Polyhedron,exports.Ring=ne.Ring,exports.Sphere=ne.Sphere,exports.Tetrahedron=ne.Tetrahedron,exports.Torus=ne.Torus,exports.TorusKnot=ne.TorusKnot,exports.Tube=ne.Tube,exports.RoundedBox=ce.RoundedBox,exports.ScreenQuad=je.ScreenQuad,exports.Center=pe.Center,exports.Bounds=xe.Bounds,exports.useBounds=xe.useBounds,exports.CameraShake=le.CameraShake,exports.Float=de.Float,exports.Stage=qe.Stage,exports.Backdrop=me.Backdrop,exports.Shadow=he.Shadow,exports.ContactShadows=Ce.ContactShadows,exports.AccumulativeShadows=Me.AccumulativeShadows,exports.RandomizedLight=Me.RandomizedLight,exports.accumulativeContext=Me.accumulativeContext,exports.Reflector=Se.Reflector,exports.SpotLight=Pe.SpotLight,exports.SpotLightShadow=Pe.SpotLightShadow,exports.Environment=be.Environment,exports.EnvironmentCube=be.EnvironmentCube,exports.EnvironmentMap=be.EnvironmentMap,exports.EnvironmentPortal=be.EnvironmentPortal,exports.useEnvironment=be.useEnvironment,exports.Lightformer=Be.Lightformer,exports.Sky=ge.Sky,exports.calcPosFromAngles=ge.calcPosFromAngles,exports.Stars=fe.Stars,exports.Cloud=Te.Cloud,exports.Sparkles=ve.Sparkles,exports.useMatcapTexture=Le.useMatcapTexture,exports.useNormalTexture=Ae.useNormalTexture,exports.Point=ke.Point,exports.Points=ke.Points,exports.PointsBuffer=ke.PointsBuffer,exports.PositionPoint=ke.PositionPoint,exports.Instance=De.Instance,exports.Instances=De.Instances,exports.Merged=De.Merged,exports.Segment=Ee.Segment,exports.SegmentObject=Ee.SegmentObject,exports.Segments=Ee.Segments,exports.Detailed=Re.Detailed,exports.Preload=we.Preload,exports.BakeShadows=Ge.BakeShadows,exports.meshBounds=ze.meshBounds,exports.AdaptiveDpr=Fe.AdaptiveDpr,exports.AdaptiveEvents=Oe.AdaptiveEvents,exports.PerformanceMonitor=Ie.PerformanceMonitor,exports.usePerformanceMonitor=Ie.usePerformanceMonitor,exports.RenderTexture=Ve.RenderTexture,exports.Mask=ye.Mask,exports.useMask=ye.useMask;
|
package/core/index.js
CHANGED
|
@@ -73,7 +73,7 @@ export { Shadow } from './Shadow.js';
|
|
|
73
73
|
export { ContactShadows } from './ContactShadows.js';
|
|
74
74
|
export { AccumulativeShadows, RandomizedLight, accumulativeContext } from './AccumulativeShadows.js';
|
|
75
75
|
export { Reflector } from './Reflector.js';
|
|
76
|
-
export { SpotLight } from './SpotLight.js';
|
|
76
|
+
export { SpotLight, SpotLightShadow } from './SpotLight.js';
|
|
77
77
|
export { Environment, EnvironmentCube, EnvironmentMap, EnvironmentPortal, useEnvironment } from './Environment.js';
|
|
78
78
|
export { Lightformer } from './Lightformer.js';
|
|
79
79
|
export { Sky, calcPosFromAngles } from './Sky.js';
|