@react-three/drei 9.0.0-beta.1 → 9.0.0-beta.4

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.
Files changed (149) hide show
  1. package/README.md +461 -48
  2. package/core/ArcballControls.cjs.js +1 -1
  3. package/core/ArcballControls.d.ts +8 -8
  4. package/core/ArcballControls.js +19 -30
  5. package/core/Bounds.cjs.js +1 -1
  6. package/core/Bounds.d.ts +2 -1
  7. package/core/Bounds.js +25 -14
  8. package/core/Clone.cjs.js +1 -0
  9. package/core/Clone.d.ts +11 -0
  10. package/core/Clone.js +92 -0
  11. package/core/Cloud.cjs.js +1 -1
  12. package/core/Cloud.d.ts +4 -1
  13. package/core/Cloud.js +7 -3
  14. package/core/ComputedAttribute.cjs.js +1 -0
  15. package/core/ComputedAttribute.d.ts +9 -0
  16. package/core/ComputedAttribute.js +34 -0
  17. package/core/ContactShadows.cjs.js +1 -1
  18. package/core/ContactShadows.d.ts +4 -1
  19. package/core/ContactShadows.js +33 -13
  20. package/core/CubeCamera.cjs.js +1 -1
  21. package/core/CubeCamera.js +6 -7
  22. package/core/CurveModifier.cjs.js +1 -1
  23. package/core/CurveModifier.js +18 -22
  24. package/core/Detailed.d.ts +1 -1
  25. package/core/DeviceOrientationControls.cjs.js +1 -1
  26. package/core/DeviceOrientationControls.js +2 -6
  27. package/core/Effects.cjs.js +1 -1
  28. package/core/Effects.d.ts +3 -2
  29. package/core/Effects.js +2 -2
  30. package/core/Environment.cjs.js +1 -1
  31. package/core/Environment.d.ts +13 -3
  32. package/core/Environment.js +100 -56
  33. package/core/FirstPersonControls.cjs.js +1 -1
  34. package/core/FirstPersonControls.d.ts +1 -1
  35. package/core/FirstPersonControls.js +2 -6
  36. package/core/Float.cjs.js +1 -1
  37. package/core/Float.d.ts +1 -1
  38. package/core/Float.js +5 -4
  39. package/core/GizmoHelper.cjs.js +1 -1
  40. package/core/GizmoHelper.d.ts +2 -1
  41. package/core/GizmoHelper.js +31 -41
  42. package/core/GizmoViewcube.cjs.js +1 -1
  43. package/core/GizmoViewcube.js +1 -1
  44. package/core/GradientTexture.cjs.js +1 -1
  45. package/core/GradientTexture.js +5 -2
  46. package/core/Image.cjs.js +1 -1
  47. package/core/Image.d.ts +6 -4
  48. package/core/Image.js +6 -1
  49. package/core/Instances.cjs.js +1 -1
  50. package/core/Instances.d.ts +2 -2
  51. package/core/Instances.js +5 -11
  52. package/core/Lightformer.cjs.js +1 -0
  53. package/core/Lightformer.d.ts +41 -0
  54. package/core/Lightformer.js +51 -0
  55. package/core/Line.d.ts +1 -1
  56. package/core/MapControls.d.ts +1 -1
  57. package/core/MeshDistortMaterial.d.ts +2 -4
  58. package/core/MeshReflectorMaterial.cjs.js +1 -1
  59. package/core/MeshReflectorMaterial.d.ts +2 -2
  60. package/core/MeshReflectorMaterial.js +7 -7
  61. package/core/MeshWobbleMaterial.d.ts +2 -4
  62. package/core/OrbitControls.cjs.js +1 -1
  63. package/core/OrbitControls.d.ts +10 -10
  64. package/core/OrbitControls.js +14 -26
  65. package/core/OrthographicCamera.d.ts +1 -1
  66. package/core/PerspectiveCamera.d.ts +1 -1
  67. package/core/PointMaterial.cjs.js +1 -1
  68. package/core/PointMaterial.d.ts +5 -8
  69. package/core/PointMaterial.js +16 -34
  70. package/core/PointerLockControls.cjs.js +1 -1
  71. package/core/PointerLockControls.d.ts +3 -1
  72. package/core/PointerLockControls.js +36 -22
  73. package/core/Points.cjs.js +1 -1
  74. package/core/Points.d.ts +3 -3
  75. package/core/Points.js +11 -30
  76. package/core/PositionalAudio.d.ts +1 -1
  77. package/core/Reflector.cjs.js +1 -1
  78. package/core/Reflector.d.ts +1 -1
  79. package/core/Reflector.js +1 -2
  80. package/core/RoundedBox.cjs.js +1 -1
  81. package/core/RoundedBox.d.ts +2 -1
  82. package/core/RoundedBox.js +2 -1
  83. package/core/Sampler.cjs.js +1 -0
  84. package/core/Sampler.d.ts +21 -0
  85. package/core/Sampler.js +65 -0
  86. package/core/Shadow.d.ts +1 -1
  87. package/core/SpotLight.d.ts +20 -4
  88. package/core/Stage.cjs.js +1 -1
  89. package/core/Stage.d.ts +1 -1
  90. package/core/Stage.js +1 -2
  91. package/core/Stars.cjs.js +1 -1
  92. package/core/Stars.js +3 -0
  93. package/core/Stats.cjs.js +1 -1
  94. package/core/Stats.js +2 -2
  95. package/core/Text.cjs.js +1 -1
  96. package/core/Text.d.ts +3 -2
  97. package/core/Text.js +9 -1
  98. package/core/TrackballControls.cjs.js +1 -1
  99. package/core/TrackballControls.js +7 -5
  100. package/core/Trail.cjs.js +1 -0
  101. package/core/Trail.d.ts +21 -0
  102. package/core/Trail.js +160 -0
  103. package/core/TransformControls.cjs.js +1 -1
  104. package/core/TransformControls.d.ts +1 -1
  105. package/core/TransformControls.js +13 -11
  106. package/core/index.cjs.js +1 -1
  107. package/core/index.d.ts +6 -0
  108. package/core/index.js +11 -4
  109. package/core/shaderMaterial.d.ts +1 -1
  110. package/core/useBoxProjectedEnv.cjs.js +1 -0
  111. package/core/useBoxProjectedEnv.d.ts +8 -0
  112. package/core/useBoxProjectedEnv.js +98 -0
  113. package/core/useDetectGPU.cjs.js +1 -1
  114. package/core/useDetectGPU.js +2 -2
  115. package/core/useFBO.cjs.js +1 -1
  116. package/core/useFBO.d.ts +1 -1
  117. package/core/useFBO.js +22 -24
  118. package/core/useHelper.cjs.js +1 -1
  119. package/core/useHelper.d.ts +4 -1
  120. package/core/useHelper.js +16 -6
  121. package/core/useMatcapTexture.cjs.js +1 -1
  122. package/core/useMatcapTexture.js +2 -5
  123. package/core/useNormalTexture.cjs.js +1 -1
  124. package/core/useNormalTexture.js +2 -5
  125. package/helpers/Position.cjs.js +1 -1
  126. package/helpers/Position.js +3 -2
  127. package/helpers/environment-assets.cjs.js +1 -1
  128. package/helpers/environment-assets.js +10 -10
  129. package/index.cjs.js +1 -1
  130. package/index.js +7 -1
  131. package/materials/ConvolutionMaterial.cjs.js +1 -1
  132. package/materials/ConvolutionMaterial.js +2 -0
  133. package/materials/MeshReflectorMaterial.cjs.js +1 -1
  134. package/materials/MeshReflectorMaterial.d.ts +0 -3
  135. package/materials/MeshReflectorMaterial.js +8 -35
  136. package/materials/SpotLightMaterial.cjs.js +1 -1
  137. package/materials/SpotLightMaterial.js +3 -0
  138. package/native/index.cjs.js +1 -1
  139. package/native/index.js +11 -4
  140. package/package.json +8 -7
  141. package/web/Html.cjs.js +1 -1
  142. package/web/Html.js +4 -5
  143. package/web/ScrollControls.cjs.js +1 -1
  144. package/web/ScrollControls.js +6 -5
  145. package/web/Select.cjs.js +1 -1
  146. package/web/Select.d.ts +2 -1
  147. package/web/Select.js +3 -2
  148. package/web/index.cjs.js +1 -1
  149. package/web/index.js +12 -5
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("./Line.cjs.js"),o=require("./PositionalAudio.cjs.js"),i=require("./Text.cjs.js"),u=require("./Effects.cjs.js"),a=require("./GradientTexture.cjs.js"),j=require("./Image.cjs.js"),c=require("./Edges.cjs.js"),n=require("./OrthographicCamera.cjs.js"),p=require("./PerspectiveCamera.cjs.js"),l=require("./CubeCamera.cjs.js"),x=require("./DeviceOrientationControls.cjs.js"),q=require("./FlyControls.cjs.js"),d=require("./MapControls.cjs.js"),C=require("./OrbitControls.cjs.js"),h=require("./TrackballControls.cjs.js"),m=require("./ArcballControls.cjs.js"),B=require("./TransformControls.cjs.js"),b=require("./PointerLockControls.cjs.js"),M=require("./FirstPersonControls.cjs.js"),P=require("./GizmoHelper.cjs.js"),S=require("./GizmoViewcube.cjs.js"),f=require("./GizmoViewport.cjs.js"),T=require("./useCubeTexture.cjs.js"),g=require("./useFBX.cjs.js"),v=require("./useGLTF.cjs.js"),L=require("./useProgress.cjs.js"),A=require("./useTexture.cjs.js"),G=require("./useKTX2.cjs.js"),k=require("./Stats.cjs.js"),D=require("./useDepthBuffer.cjs.js"),F=require("./useAspect.cjs.js"),w=require("./useCamera.cjs.js"),z=require("./useDetectGPU.cjs.js"),I=require("./useHelper.cjs.js"),O=require("./useBVH.cjs.js"),E=require("./useContextBridge.cjs.js"),R=require("./useAnimations.cjs.js"),y=require("./useFBO.cjs.js"),H=require("./useIntersect.cjs.js"),V=require("./CurveModifier.cjs.js"),Q=require("./MeshDistortMaterial.cjs.js"),X=require("./MeshWobbleMaterial.cjs.js"),K=require("./MeshReflectorMaterial.cjs.js"),W=require("./PointMaterial.cjs.js"),N=require("./shaderMaterial.cjs.js"),U=require("./softShadows.cjs.js"),_=require("./shapes.cjs.js"),J=require("./RoundedBox.cjs.js"),Y=require("./ScreenQuad.cjs.js"),Z=require("./Center.cjs.js"),$=require("./Bounds.cjs.js"),ee=require("./CameraShake.cjs.js"),re=require("./Float.cjs.js"),se=require("./Stage.cjs.js"),te=require("./Backdrop.cjs.js"),oe=require("./Shadow.cjs.js"),ie=require("./ContactShadows.cjs.js"),ue=require("./Reflector.cjs.js"),ae=require("./SpotLight.cjs.js"),je=require("./Environment.cjs.js"),ce=require("./Sky.cjs.js"),ne=require("./Stars.cjs.js"),pe=require("./Cloud.cjs.js"),le=require("./useMatcapTexture.cjs.js"),xe=require("./useNormalTexture.cjs.js"),qe=require("./Points.cjs.js"),de=require("./Instances.cjs.js"),Ce=require("./Segments.cjs.js"),he=require("./Detailed.cjs.js"),me=require("./Preload.cjs.js"),Be=require("./BakeShadows.cjs.js"),be=require("./meshBounds.cjs.js"),Me=require("./AdaptiveDpr.cjs.js"),Pe=require("./AdaptiveEvents.cjs.js");require("@babel/runtime/helpers/extends"),require("react"),require("@react-three/fiber"),require("react-merge-refs"),require("three"),require("three-stdlib"),require("troika-three-text"),require("lodash.omit"),require("lodash.pick"),require("zustand"),require("three/examples/js/libs/stats.min"),require("../helpers/useEffectfulState.cjs.js"),require("detect-gpu"),require("use-asset"),require("three-mesh-bvh"),require("../materials/BlurPass.cjs.js"),require("../materials/ConvolutionMaterial.cjs.js"),require("../materials/MeshReflectorMaterial.cjs.js"),require("../helpers/environment-assets.cjs.js"),require("../materials/SpotLightMaterial.cjs.js"),require("../helpers/Position.cjs.js"),require("react-composer"),exports.Billboard=e.Billboard,exports.QuadraticBezierLine=r.QuadraticBezierLine,exports.CubicBezierLine=s.CubicBezierLine,exports.Line=t.Line,exports.PositionalAudio=o.PositionalAudio,exports.Text=i.Text,exports.Effects=u.Effects,exports.isWebGL2Available=u.isWebGL2Available,exports.GradientTexture=a.GradientTexture,exports.Image=j.Image,exports.Edges=c.Edges,exports.OrthographicCamera=n.OrthographicCamera,exports.PerspectiveCamera=p.PerspectiveCamera,exports.CubeCamera=l.CubeCamera,exports.DeviceOrientationControls=x.DeviceOrientationControls,exports.FlyControls=q.FlyControls,exports.MapControls=d.MapControls,exports.OrbitControls=C.OrbitControls,exports.TrackballControls=h.TrackballControls,exports.ArcballControls=m.ArcballControls,exports.TransformControls=B.TransformControls,exports.PointerLockControls=b.PointerLockControls,exports.FirstPersonControls=M.FirstPersonControls,exports.GizmoHelper=P.GizmoHelper,exports.useGizmoContext=P.useGizmoContext,exports.GizmoViewcube=S.GizmoViewcube,exports.GizmoViewport=f.GizmoViewport,exports.useCubeTexture=T.useCubeTexture,exports.useFBX=g.useFBX,exports.useGLTF=v.useGLTF,exports.useProgress=L.useProgress,exports.IsObject=A.IsObject,exports.useTexture=A.useTexture,exports.useKTX2=G.useKTX2,exports.Stats=k.Stats,exports.useDepthBuffer=D.useDepthBuffer,exports.useAspect=F.useAspect,exports.useCamera=w.useCamera,exports.useDetectGPU=z.useDetectGPU,exports.useHelper=I.useHelper,exports.useBVH=O.useBVH,exports.useContextBridge=E.useContextBridge,exports.useAnimations=R.useAnimations,exports.useFBO=y.useFBO,exports.useIntersect=H.useIntersect,exports.CurveModifier=V.CurveModifier,exports.MeshDistortMaterial=Q.MeshDistortMaterial,exports.MeshWobbleMaterial=X.MeshWobbleMaterial,exports.MeshReflectorMaterial=K.MeshReflectorMaterial,exports.PointMaterial=W.PointMaterial,exports.PointMaterialImpl=W.PointMaterialImpl,exports.shaderMaterial=N.shaderMaterial,exports.softShadows=U.softShadows,exports.Box=_.Box,exports.Circle=_.Circle,exports.Cone=_.Cone,exports.Cylinder=_.Cylinder,exports.Dodecahedron=_.Dodecahedron,exports.Extrude=_.Extrude,exports.Icosahedron=_.Icosahedron,exports.Lathe=_.Lathe,exports.Octahedron=_.Octahedron,exports.Plane=_.Plane,exports.Polyhedron=_.Polyhedron,exports.Ring=_.Ring,exports.Sphere=_.Sphere,exports.Tetrahedron=_.Tetrahedron,exports.Torus=_.Torus,exports.TorusKnot=_.TorusKnot,exports.Tube=_.Tube,exports.RoundedBox=J.RoundedBox,exports.ScreenQuad=Y.ScreenQuad,exports.Center=Z.Center,exports.Bounds=$.Bounds,exports.useBounds=$.useBounds,exports.CameraShake=ee.CameraShake,exports.Float=re.Float,exports.Stage=se.Stage,exports.Backdrop=te.Backdrop,exports.Shadow=oe.Shadow,exports.ContactShadows=ie.ContactShadows,exports.Reflector=ue.Reflector,exports.SpotLight=ae.SpotLight,exports.Environment=je.Environment,exports.Sky=ce.Sky,exports.calcPosFromAngles=ce.calcPosFromAngles,exports.Stars=ne.Stars,exports.Cloud=pe.Cloud,exports.useMatcapTexture=le.useMatcapTexture,exports.useNormalTexture=xe.useNormalTexture,exports.Point=qe.Point,exports.Points=qe.Points,exports.PointsBuffer=qe.PointsBuffer,exports.Instance=de.Instance,exports.Instances=de.Instances,exports.Merged=de.Merged,exports.Segment=Ce.Segment,exports.Segments=Ce.Segments,exports.Detailed=he.Detailed,exports.Preload=me.Preload,exports.BakeShadows=Be.BakeShadows,exports.meshBounds=be.meshBounds,exports.AdaptiveDpr=Me.AdaptiveDpr,exports.AdaptiveEvents=Pe.AdaptiveEvents;
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("./Line.cjs.js"),o=require("./PositionalAudio.cjs.js"),i=require("./Text.cjs.js"),u=require("./Effects.cjs.js"),a=require("./GradientTexture.cjs.js"),n=require("./Image.cjs.js"),j=require("./Edges.cjs.js"),c=require("./Trail.cjs.js"),p=require("./Sampler.cjs.js"),l=require("./ComputedAttribute.cjs.js"),x=require("./Clone.cjs.js"),q=require("./OrthographicCamera.cjs.js"),d=require("./PerspectiveCamera.cjs.js"),C=require("./CubeCamera.cjs.js"),m=require("./DeviceOrientationControls.cjs.js"),h=require("./FlyControls.cjs.js"),b=require("./MapControls.cjs.js"),B=require("./OrbitControls.cjs.js"),P=require("./TrackballControls.cjs.js"),S=require("./ArcballControls.cjs.js"),M=require("./TransformControls.cjs.js"),T=require("./PointerLockControls.cjs.js"),f=require("./FirstPersonControls.cjs.js"),g=require("./GizmoHelper.cjs.js"),v=require("./GizmoViewcube.cjs.js"),L=require("./GizmoViewport.cjs.js"),A=require("./useCubeTexture.cjs.js"),E=require("./useFBX.cjs.js"),G=require("./useGLTF.cjs.js"),k=require("./useProgress.cjs.js"),D=require("./useTexture.cjs.js"),F=require("./useKTX2.cjs.js"),w=require("./Stats.cjs.js"),z=require("./useDepthBuffer.cjs.js"),I=require("./useAspect.cjs.js"),O=require("./useCamera.cjs.js"),R=require("./useDetectGPU.cjs.js"),y=require("./useHelper.cjs.js"),H=require("./useBVH.cjs.js"),V=require("./useContextBridge.cjs.js"),Q=require("./useAnimations.cjs.js"),X=require("./useFBO.cjs.js"),K=require("./useIntersect.cjs.js"),W=require("./useBoxProjectedEnv.cjs.js"),N=require("./CurveModifier.cjs.js"),U=require("./MeshDistortMaterial.cjs.js"),_=require("./MeshWobbleMaterial.cjs.js"),J=require("./MeshReflectorMaterial.cjs.js"),Y=require("./PointMaterial.cjs.js"),Z=require("./shaderMaterial.cjs.js"),$=require("./softShadows.cjs.js"),ee=require("./shapes.cjs.js"),re=require("./RoundedBox.cjs.js"),se=require("./ScreenQuad.cjs.js"),te=require("./Center.cjs.js"),oe=require("./Bounds.cjs.js"),ie=require("./CameraShake.cjs.js"),ue=require("./Float.cjs.js"),ae=require("./Stage.cjs.js"),ne=require("./Backdrop.cjs.js"),je=require("./Shadow.cjs.js"),ce=require("./ContactShadows.cjs.js"),pe=require("./Reflector.cjs.js"),le=require("./SpotLight.cjs.js"),xe=require("./Environment.cjs.js"),qe=require("./Lightformer.cjs.js"),de=require("./Sky.cjs.js"),Ce=require("./Stars.cjs.js"),me=require("./Cloud.cjs.js"),he=require("./useMatcapTexture.cjs.js"),be=require("./useNormalTexture.cjs.js"),Be=require("./Points.cjs.js"),Pe=require("./Instances.cjs.js"),Se=require("./Segments.cjs.js"),Me=require("./Detailed.cjs.js"),Te=require("./Preload.cjs.js"),fe=require("./BakeShadows.cjs.js"),ge=require("./meshBounds.cjs.js"),ve=require("./AdaptiveDpr.cjs.js"),Le=require("./AdaptiveEvents.cjs.js");require("@babel/runtime/helpers/extends"),require("react"),require("@react-three/fiber"),require("react-merge-refs"),require("three"),require("three-stdlib"),require("troika-three-text"),require("suspend-react"),require("meshline"),require("lodash.pick"),require("lodash.omit"),require("zustand"),require("stats.js"),require("../helpers/useEffectfulState.cjs.js"),require("detect-gpu"),require("three-mesh-bvh"),require("../materials/BlurPass.cjs.js"),require("../materials/ConvolutionMaterial.cjs.js"),require("../materials/MeshReflectorMaterial.cjs.js"),require("../helpers/environment-assets.cjs.js"),require("../materials/SpotLightMaterial.cjs.js"),require("../helpers/Position.cjs.js"),require("react-composer"),exports.Billboard=e.Billboard,exports.QuadraticBezierLine=r.QuadraticBezierLine,exports.CubicBezierLine=s.CubicBezierLine,exports.Line=t.Line,exports.PositionalAudio=o.PositionalAudio,exports.Text=i.Text,exports.Effects=u.Effects,exports.isWebGL2Available=u.isWebGL2Available,exports.GradientTexture=a.GradientTexture,exports.Image=n.Image,exports.Edges=j.Edges,exports.Trail=c.Trail,exports.useTrail=c.useTrail,exports.Sampler=p.Sampler,exports.ComputedAttribute=l.ComputedAttribute,exports.Clone=x.Clone,exports.OrthographicCamera=q.OrthographicCamera,exports.PerspectiveCamera=d.PerspectiveCamera,exports.CubeCamera=C.CubeCamera,exports.DeviceOrientationControls=m.DeviceOrientationControls,exports.FlyControls=h.FlyControls,exports.MapControls=b.MapControls,exports.OrbitControls=B.OrbitControls,exports.TrackballControls=P.TrackballControls,exports.ArcballControls=S.ArcballControls,exports.TransformControls=M.TransformControls,exports.PointerLockControls=T.PointerLockControls,exports.FirstPersonControls=f.FirstPersonControls,exports.GizmoHelper=g.GizmoHelper,exports.useGizmoContext=g.useGizmoContext,exports.GizmoViewcube=v.GizmoViewcube,exports.GizmoViewport=L.GizmoViewport,exports.useCubeTexture=A.useCubeTexture,exports.useFBX=E.useFBX,exports.useGLTF=G.useGLTF,exports.useProgress=k.useProgress,exports.IsObject=D.IsObject,exports.useTexture=D.useTexture,exports.useKTX2=F.useKTX2,exports.Stats=w.Stats,exports.useDepthBuffer=z.useDepthBuffer,exports.useAspect=I.useAspect,exports.useCamera=O.useCamera,exports.useDetectGPU=R.useDetectGPU,exports.useHelper=y.useHelper,exports.useBVH=H.useBVH,exports.useContextBridge=V.useContextBridge,exports.useAnimations=Q.useAnimations,exports.useFBO=X.useFBO,exports.useIntersect=K.useIntersect,exports.useBoxProjectedEnv=W.useBoxProjectedEnv,exports.CurveModifier=N.CurveModifier,exports.MeshDistortMaterial=U.MeshDistortMaterial,exports.MeshWobbleMaterial=_.MeshWobbleMaterial,exports.MeshReflectorMaterial=J.MeshReflectorMaterial,exports.PointMaterial=Y.PointMaterial,exports.PointMaterialImpl=Y.PointMaterialImpl,exports.shaderMaterial=Z.shaderMaterial,exports.softShadows=$.softShadows,exports.Box=ee.Box,exports.Circle=ee.Circle,exports.Cone=ee.Cone,exports.Cylinder=ee.Cylinder,exports.Dodecahedron=ee.Dodecahedron,exports.Extrude=ee.Extrude,exports.Icosahedron=ee.Icosahedron,exports.Lathe=ee.Lathe,exports.Octahedron=ee.Octahedron,exports.Plane=ee.Plane,exports.Polyhedron=ee.Polyhedron,exports.Ring=ee.Ring,exports.Sphere=ee.Sphere,exports.Tetrahedron=ee.Tetrahedron,exports.Torus=ee.Torus,exports.TorusKnot=ee.TorusKnot,exports.Tube=ee.Tube,exports.RoundedBox=re.RoundedBox,exports.ScreenQuad=se.ScreenQuad,exports.Center=te.Center,exports.Bounds=oe.Bounds,exports.useBounds=oe.useBounds,exports.CameraShake=ie.CameraShake,exports.Float=ue.Float,exports.Stage=ae.Stage,exports.Backdrop=ne.Backdrop,exports.Shadow=je.Shadow,exports.ContactShadows=ce.ContactShadows,exports.Reflector=pe.Reflector,exports.SpotLight=le.SpotLight,exports.Environment=xe.Environment,exports.EnvironmentCube=xe.EnvironmentCube,exports.EnvironmentMap=xe.EnvironmentMap,exports.EnvironmentPortal=xe.EnvironmentPortal,exports.Lightformer=qe.Lightformer,exports.Sky=de.Sky,exports.calcPosFromAngles=de.calcPosFromAngles,exports.Stars=Ce.Stars,exports.Cloud=me.Cloud,exports.useMatcapTexture=he.useMatcapTexture,exports.useNormalTexture=be.useNormalTexture,exports.Point=Be.Point,exports.Points=Be.Points,exports.PointsBuffer=Be.PointsBuffer,exports.Instance=Pe.Instance,exports.Instances=Pe.Instances,exports.Merged=Pe.Merged,exports.Segment=Se.Segment,exports.Segments=Se.Segments,exports.Detailed=Me.Detailed,exports.Preload=Te.Preload,exports.BakeShadows=fe.BakeShadows,exports.meshBounds=ge.meshBounds,exports.AdaptiveDpr=ve.AdaptiveDpr,exports.AdaptiveEvents=Le.AdaptiveEvents;
package/core/index.d.ts CHANGED
@@ -8,6 +8,10 @@ export * from './Effects';
8
8
  export * from './GradientTexture';
9
9
  export * from './Image';
10
10
  export * from './Edges';
11
+ export * from './Trail';
12
+ export * from './Sampler';
13
+ export * from './ComputedAttribute';
14
+ export * from './Clone';
11
15
  export * from './OrthographicCamera';
12
16
  export * from './PerspectiveCamera';
13
17
  export * from './CubeCamera';
@@ -40,6 +44,7 @@ export * from './useContextBridge';
40
44
  export * from './useAnimations';
41
45
  export * from './useFBO';
42
46
  export * from './useIntersect';
47
+ export * from './useBoxProjectedEnv';
43
48
  export * from './CurveModifier';
44
49
  export * from './MeshDistortMaterial';
45
50
  export * from './MeshWobbleMaterial';
@@ -61,6 +66,7 @@ export * from './ContactShadows';
61
66
  export * from './Reflector';
62
67
  export * from './SpotLight';
63
68
  export * from './Environment';
69
+ export * from './Lightformer';
64
70
  export * from './Sky';
65
71
  export * from './Stars';
66
72
  export * from './Cloud';
package/core/index.js CHANGED
@@ -8,6 +8,10 @@ export { Effects, isWebGL2Available } from './Effects.js';
8
8
  export { GradientTexture } from './GradientTexture.js';
9
9
  export { Image } from './Image.js';
10
10
  export { Edges } from './Edges.js';
11
+ export { Trail, useTrail } from './Trail.js';
12
+ export { Sampler } from './Sampler.js';
13
+ export { ComputedAttribute } from './ComputedAttribute.js';
14
+ export { Clone } from './Clone.js';
11
15
  export { OrthographicCamera } from './OrthographicCamera.js';
12
16
  export { PerspectiveCamera } from './PerspectiveCamera.js';
13
17
  export { CubeCamera } from './CubeCamera.js';
@@ -40,6 +44,7 @@ export { useContextBridge } from './useContextBridge.js';
40
44
  export { useAnimations } from './useAnimations.js';
41
45
  export { useFBO } from './useFBO.js';
42
46
  export { useIntersect } from './useIntersect.js';
47
+ export { useBoxProjectedEnv } from './useBoxProjectedEnv.js';
43
48
  export { CurveModifier } from './CurveModifier.js';
44
49
  export { MeshDistortMaterial } from './MeshDistortMaterial.js';
45
50
  export { MeshWobbleMaterial } from './MeshWobbleMaterial.js';
@@ -60,7 +65,8 @@ export { Shadow } from './Shadow.js';
60
65
  export { ContactShadows } from './ContactShadows.js';
61
66
  export { Reflector } from './Reflector.js';
62
67
  export { SpotLight } from './SpotLight.js';
63
- export { Environment } from './Environment.js';
68
+ export { Environment, EnvironmentCube, EnvironmentMap, EnvironmentPortal } from './Environment.js';
69
+ export { Lightformer } from './Lightformer.js';
64
70
  export { Sky, calcPosFromAngles } from './Sky.js';
65
71
  export { Stars } from './Stars.js';
66
72
  export { Cloud } from './Cloud.js';
@@ -82,13 +88,14 @@ import 'react-merge-refs';
82
88
  import 'three';
83
89
  import 'three-stdlib';
84
90
  import 'troika-three-text';
85
- import 'lodash.omit';
91
+ import 'suspend-react';
92
+ import 'meshline';
86
93
  import 'lodash.pick';
94
+ import 'lodash.omit';
87
95
  import 'zustand';
88
- import 'three/examples/js/libs/stats.min';
96
+ import 'stats.js';
89
97
  import '../helpers/useEffectfulState.js';
90
98
  import 'detect-gpu';
91
- import 'use-asset';
92
99
  import 'three-mesh-bvh';
93
100
  import '../materials/BlurPass.js';
94
101
  import '../materials/ConvolutionMaterial.js';
@@ -34,6 +34,7 @@ export declare function shaderMaterial(uniforms: {
34
34
  toJSON(meta: any): any;
35
35
  alphaTest: number;
36
36
  alphaToCoverage: boolean;
37
+ alphaWrite: boolean;
37
38
  blendDst: THREE.BlendingDstFactor;
38
39
  blendDstAlpha: number | null;
39
40
  blendEquation: THREE.BlendingEquation;
@@ -48,7 +49,6 @@ export declare function shaderMaterial(uniforms: {
48
49
  depthFunc: THREE.DepthModes;
49
50
  depthTest: boolean;
50
51
  depthWrite: boolean;
51
- format: THREE.PixelFormat;
52
52
  id: number;
53
53
  stencilWrite: boolean;
54
54
  stencilFunc: THREE.StencilFunc;
@@ -0,0 +1 @@
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("three"),r=require("react"),n=require("@react-three/fiber");function i(e){if(e&&e.__esModule)return e;var r=Object.create(null);return e&&Object.keys(e).forEach((function(n){if("default"!==n){var i=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(r,n,i.get?i:{enumerable:!0,get:function(){return e[n]}})}})),r.default=e,Object.freeze(r)}var o=i(e),t=i(r);exports.useBoxProjectedEnv=function(e=new o.Vector3,r=new o.Vector3){const[i]=t.useState((()=>({position:new o.Vector3,size:new o.Vector3})));n.applyProps(i,{position:e,size:r});const a=t.useRef(null),c=t.useMemo((()=>({ref:a,onBeforeCompile:e=>function(e,r,n){e.defines.BOX_PROJECTED_ENV_MAP=!0,e.uniforms.envMapPosition={value:r},e.uniforms.envMapSize={value:n},e.vertexShader=`\n varying vec3 vWorldPosition;\n ${e.vertexShader.replace("#include <worldpos_vertex>","\n#if defined( USE_ENVMAP ) || defined( DISTANCE ) || defined ( USE_SHADOWMAP )\n vec4 worldPosition = modelMatrix * vec4( transformed, 1.0 );\n #ifdef BOX_PROJECTED_ENV_MAP\n vWorldPosition = worldPosition.xyz;\n #endif\n#endif\n")}`,e.fragmentShader=`\n \n#ifdef BOX_PROJECTED_ENV_MAP\n uniform vec3 envMapSize;\n uniform vec3 envMapPosition;\n varying vec3 vWorldPosition;\n \n vec3 parallaxCorrectNormal( vec3 v, vec3 cubeSize, vec3 cubePos ) {\n vec3 nDir = normalize( v );\n vec3 rbmax = ( .5 * cubeSize + cubePos - vWorldPosition ) / nDir;\n vec3 rbmin = ( -.5 * cubeSize + cubePos - vWorldPosition ) / nDir;\n vec3 rbminmax;\n rbminmax.x = ( nDir.x > 0. ) ? rbmax.x : rbmin.x;\n rbminmax.y = ( nDir.y > 0. ) ? rbmax.y : rbmin.y;\n rbminmax.z = ( nDir.z > 0. ) ? rbmax.z : rbmin.z;\n float correction = min( min( rbminmax.x, rbminmax.y ), rbminmax.z );\n vec3 boxIntersection = vWorldPosition + nDir * correction; \n return boxIntersection - cubePos;\n }\n#endif\n\n ${e.fragmentShader.replace("#include <envmap_physical_pars_fragment>",o.ShaderChunk.envmap_physical_pars_fragment).replace("vec3 worldNormal = inverseTransformDirection( normal, viewMatrix );","vec3 worldNormal = inverseTransformDirection( normal, viewMatrix );\n \n#ifdef BOX_PROJECTED_ENV_MAP\n worldNormal = parallaxCorrectNormal( worldNormal, envMapSize, envMapPosition );\n#endif\n\n ").replace("reflectVec = inverseTransformDirection( reflectVec, viewMatrix );","reflectVec = inverseTransformDirection( reflectVec, viewMatrix );\n \n#ifdef BOX_PROJECTED_ENV_MAP\n reflectVec = parallaxCorrectNormal( reflectVec, envMapSize, envMapPosition );\n#endif\n\n ")}`}(e,i.position,i.size),customProgramCacheKey:()=>JSON.stringify(i.position.toArray())+JSON.stringify(i.size.toArray())})),[...i.position.toArray(),...i.size.toArray()]);return t.useLayoutEffect((()=>{a.current.needsUpdate=!0}),[i]),c};
@@ -0,0 +1,8 @@
1
+ import * as THREE from 'three';
2
+ import * as React from 'react';
3
+ import { ReactThreeFiber } from '@react-three/fiber';
4
+ export declare function useBoxProjectedEnv(position?: ReactThreeFiber.Vector3, size?: ReactThreeFiber.Vector3): {
5
+ ref: React.MutableRefObject<THREE.Material>;
6
+ onBeforeCompile: (shader: THREE.Shader) => void;
7
+ customProgramCacheKey: () => string;
8
+ };
@@ -0,0 +1,98 @@
1
+ import * as THREE from 'three';
2
+ import * as React from 'react';
3
+ import { applyProps } from '@react-three/fiber';
4
+
5
+ // and @0beqz https://gist.github.com/0beqz/8d51b4ae16d68021a09fb504af708fca
6
+
7
+ const worldposReplace =
8
+ /* glsl */
9
+ `
10
+ #if defined( USE_ENVMAP ) || defined( DISTANCE ) || defined ( USE_SHADOWMAP )
11
+ vec4 worldPosition = modelMatrix * vec4( transformed, 1.0 );
12
+ #ifdef BOX_PROJECTED_ENV_MAP
13
+ vWorldPosition = worldPosition.xyz;
14
+ #endif
15
+ #endif
16
+ `;
17
+ const boxProjectDefinitions =
18
+ /*glsl */
19
+ `
20
+ #ifdef BOX_PROJECTED_ENV_MAP
21
+ uniform vec3 envMapSize;
22
+ uniform vec3 envMapPosition;
23
+ varying vec3 vWorldPosition;
24
+
25
+ vec3 parallaxCorrectNormal( vec3 v, vec3 cubeSize, vec3 cubePos ) {
26
+ vec3 nDir = normalize( v );
27
+ vec3 rbmax = ( .5 * cubeSize + cubePos - vWorldPosition ) / nDir;
28
+ vec3 rbmin = ( -.5 * cubeSize + cubePos - vWorldPosition ) / nDir;
29
+ vec3 rbminmax;
30
+ rbminmax.x = ( nDir.x > 0. ) ? rbmax.x : rbmin.x;
31
+ rbminmax.y = ( nDir.y > 0. ) ? rbmax.y : rbmin.y;
32
+ rbminmax.z = ( nDir.z > 0. ) ? rbmax.z : rbmin.z;
33
+ float correction = min( min( rbminmax.x, rbminmax.y ), rbminmax.z );
34
+ vec3 boxIntersection = vWorldPosition + nDir * correction;
35
+ return boxIntersection - cubePos;
36
+ }
37
+ #endif
38
+ `; // will be inserted after "vec3 worldNormal = inverseTransformDirection( normal, viewMatrix );"
39
+
40
+ const getIBLIrradiance_patch =
41
+ /* glsl */
42
+ `
43
+ #ifdef BOX_PROJECTED_ENV_MAP
44
+ worldNormal = parallaxCorrectNormal( worldNormal, envMapSize, envMapPosition );
45
+ #endif
46
+ `; // will be inserted after "reflectVec = inverseTransformDirection( reflectVec, viewMatrix );"
47
+
48
+ const getIBLRadiance_patch =
49
+ /* glsl */
50
+ `
51
+ #ifdef BOX_PROJECTED_ENV_MAP
52
+ reflectVec = parallaxCorrectNormal( reflectVec, envMapSize, envMapPosition );
53
+ #endif
54
+ `;
55
+
56
+ function boxProjectedEnvMap(shader, envMapPosition, envMapSize) {
57
+ shader.defines.BOX_PROJECTED_ENV_MAP = true; // uniforms
58
+
59
+ shader.uniforms.envMapPosition = {
60
+ value: envMapPosition
61
+ };
62
+ shader.uniforms.envMapSize = {
63
+ value: envMapSize
64
+ }; // vertex shader
65
+
66
+ shader.vertexShader = `
67
+ varying vec3 vWorldPosition;
68
+ ${shader.vertexShader.replace('#include <worldpos_vertex>', worldposReplace)}`; // fragment shader
69
+
70
+ shader.fragmentShader = `
71
+ ${boxProjectDefinitions}
72
+ ${shader.fragmentShader.replace('#include <envmap_physical_pars_fragment>', THREE.ShaderChunk.envmap_physical_pars_fragment).replace('vec3 worldNormal = inverseTransformDirection( normal, viewMatrix );', `vec3 worldNormal = inverseTransformDirection( normal, viewMatrix );
73
+ ${getIBLIrradiance_patch}
74
+ `).replace('reflectVec = inverseTransformDirection( reflectVec, viewMatrix );', `reflectVec = inverseTransformDirection( reflectVec, viewMatrix );
75
+ ${getIBLRadiance_patch}
76
+ `)}`;
77
+ }
78
+
79
+ function useBoxProjectedEnv(position = new THREE.Vector3(), size = new THREE.Vector3()) {
80
+ const [config] = React.useState(() => ({
81
+ position: new THREE.Vector3(),
82
+ size: new THREE.Vector3()
83
+ }));
84
+ applyProps(config, {
85
+ position,
86
+ size
87
+ });
88
+ const ref = React.useRef(null);
89
+ const spread = React.useMemo(() => ({
90
+ ref,
91
+ onBeforeCompile: shader => boxProjectedEnvMap(shader, config.position, config.size),
92
+ customProgramCacheKey: () => JSON.stringify(config.position.toArray()) + JSON.stringify(config.size.toArray())
93
+ }), [...config.position.toArray(), ...config.size.toArray()]);
94
+ React.useLayoutEffect(() => void (ref.current.needsUpdate = true), [config]);
95
+ return spread;
96
+ }
97
+
98
+ export { useBoxProjectedEnv };
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("detect-gpu"),t=require("use-asset");exports.useDetectGPU=s=>t.useAsset((()=>e.getGPUTier(s)),"useDetectGPU");
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("detect-gpu"),t=require("suspend-react");exports.useDetectGPU=r=>t.suspend((()=>e.getGPUTier(r)),["useDetectGPU"]);
@@ -1,6 +1,6 @@
1
1
  import { getGPUTier } from 'detect-gpu';
2
- import { useAsset } from 'use-asset';
2
+ import { suspend } from 'suspend-react';
3
3
 
4
- const useDetectGPU = props => useAsset(() => getGPUTier(props), 'useDetectGPU');
4
+ const useDetectGPU = props => suspend(() => getGPUTier(props), ['useDetectGPU']);
5
5
 
6
6
  export { useDetectGPU };
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),t=require("three"),r=require("@react-three/fiber");function u(e){if(e&&e.__esModule)return e;var t=Object.create(null);return e&&Object.keys(e).forEach((function(r){if("default"!==r){var u=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(t,r,u.get?u:{enumerable:!0,get:function(){return e[r]}})}})),t.default=e,Object.freeze(t)}var s=u(t);exports.useFBO=function(t,u,i){const n=r.useThree((({gl:e})=>e)),o=r.useThree((({size:e})=>e)),a=e.useMemo((()=>n.getPixelRatio()),[n]),c="number"==typeof t?t:o.width*a,f="number"==typeof u?u:o.height*a,l=("number"==typeof t?i:t)||{},b=e.useMemo((()=>{const{multisample:e,samples:t,...r}=l;let u;return e&&n.capabilities.isWebGL2?(u=new s.WebGLMultisampleRenderTarget(c,f,r),t&&(u.samples=t)):u=new s.WebGLRenderTarget(c,f,r),u}),[]);return e.useEffect((()=>{b.setSize(c,f)}),[b,c,f]),e.useEffect((()=>()=>b.dispose()),[]),b};
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),t=require("three"),r=require("@react-three/fiber");function u(e){if(e&&e.__esModule)return e;var t=Object.create(null);return e&&Object.keys(e).forEach((function(r){if("default"!==r){var u=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(t,r,u.get?u:{enumerable:!0,get:function(){return e[r]}})}})),t.default=e,Object.freeze(t)}var n=u(e),i=u(t);exports.useFBO=function(e,t,u){const{gl:o,size:s}=r.useThree(),a=n.useMemo((()=>o.getPixelRatio()),[o]),c="number"==typeof e?e:s.width*a,f="number"==typeof t?t:s.height*a,l=("number"==typeof e?u:e)||{},{samples:p,...b}=l,d=n.useMemo((()=>{let e;return e=new i.WebGLRenderTarget(c,f,{minFilter:i.LinearFilter,magFilter:i.LinearFilter,encoding:o.outputEncoding,type:i.HalfFloatType,...b}),e.samples=p,e}),[]);return n.useLayoutEffect((()=>{d.setSize(c,f),p&&(d.samples=p)}),[p,d,c,f]),n.useEffect((()=>()=>d.dispose()),[]),d};
package/core/useFBO.d.ts CHANGED
@@ -3,5 +3,5 @@ declare type FBOSettings<T extends boolean = false> = {
3
3
  multisample?: T;
4
4
  samples?: number;
5
5
  } & THREE.WebGLRenderTargetOptions;
6
- export declare function useFBO<T extends boolean = false>(width?: number | FBOSettings<T>, height?: number, settings?: FBOSettings<T>): T extends true ? THREE.WebGLRenderTarget | THREE.WebGLMultisampleRenderTarget : THREE.WebGLRenderTarget;
6
+ export declare function useFBO<T extends boolean = false>(width?: number | FBOSettings<T>, height?: number, settings?: FBOSettings<T>): THREE.WebGLRenderTarget;
7
7
  export {};
package/core/useFBO.js CHANGED
@@ -1,17 +1,15 @@
1
- import { useMemo, useEffect } from 'react';
1
+ import * as React from 'react';
2
2
  import * as THREE from 'three';
3
3
  import { useThree } from '@react-three/fiber';
4
4
 
5
5
  // 👇 uncomment when TS version supports function overloads
6
6
  // export function useFBO(settings?: FBOSettings)
7
7
  function useFBO(width, height, settings) {
8
- const gl = useThree(({
9
- gl
10
- }) => gl);
11
- const size = useThree(({
8
+ const {
9
+ gl,
12
10
  size
13
- }) => size);
14
- const dpr = useMemo(() => gl.getPixelRatio(), [gl]);
11
+ } = useThree();
12
+ const dpr = React.useMemo(() => gl.getPixelRatio(), [gl]);
15
13
 
16
14
  const _width = typeof width === 'number' ? width : size.width * dpr;
17
15
 
@@ -19,27 +17,27 @@ function useFBO(width, height, settings) {
19
17
 
20
18
  const _settings = (typeof width === 'number' ? settings : width) || {};
21
19
 
22
- const target = useMemo(() => {
23
- const {
24
- multisample,
25
- samples,
26
- ...targetSettings
27
- } = _settings;
20
+ const {
21
+ samples,
22
+ ...targetSettings
23
+ } = _settings;
24
+ const target = React.useMemo(() => {
28
25
  let target;
29
-
30
- if (multisample && gl.capabilities.isWebGL2) {
31
- target = new THREE.WebGLMultisampleRenderTarget(_width, _height, targetSettings);
32
- if (samples) target.samples = samples;
33
- } else {
34
- target = new THREE.WebGLRenderTarget(_width, _height, targetSettings);
35
- }
36
-
26
+ target = new THREE.WebGLRenderTarget(_width, _height, {
27
+ minFilter: THREE.LinearFilter,
28
+ magFilter: THREE.LinearFilter,
29
+ encoding: gl.outputEncoding,
30
+ type: THREE.HalfFloatType,
31
+ ...targetSettings
32
+ });
33
+ target.samples = samples;
37
34
  return target;
38
35
  }, []);
39
- useEffect(() => {
36
+ React.useLayoutEffect(() => {
40
37
  target.setSize(_width, _height);
41
- }, [target, _width, _height]);
42
- useEffect(() => {
38
+ if (samples) target.samples = samples;
39
+ }, [samples, target, _width, _height]);
40
+ React.useEffect(() => {
43
41
  return () => target.dispose();
44
42
  }, []);
45
43
  return target;
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),r=require("@react-three/fiber");function t(e){if(e&&e.__esModule)return e;var r=Object.create(null);return e&&Object.keys(e).forEach((function(t){if("default"!==t){var u=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(r,t,u.get?u:{enumerable:!0,get:function(){return e[t]}})}})),r.default=e,Object.freeze(r)}var u=t(e);exports.useHelper=function(e,t,...n){const c=u.useRef(),a=r.useThree((e=>e.scene));return u.useEffect((()=>(t&&e.current&&(c.current=new t(e.current,...n),c.current&&a.add(c.current)),()=>{c.current&&a.remove(c.current)})),[a,t,e,n]),r.useFrame((()=>{var e;null!=(e=c.current)&&e.update&&c.current.update()})),c};
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),r=require("@react-three/fiber");function t(e){if(e&&e.__esModule)return e;var r=Object.create(null);return e&&Object.keys(e).forEach((function(t){if("default"!==t){var u=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(r,t,u.get?u:{enumerable:!0,get:function(){return e[t]}})}})),r.default=e,Object.freeze(r)}var u=t(e);exports.useHelper=function(e,t,...n){const c=u.useRef(),a=r.useThree((e=>e.scene));return u.useEffect((()=>(e&&t&&null!=e&&e.current&&(c.current=new t(e.current,...n),c.current&&a.add(c.current)),!e&&c.current&&a.remove(c.current),()=>{c.current&&a.remove(c.current)})),[a,t,e,n]),r.useFrame((()=>{var e;null!=(e=c.current)&&e.update&&c.current.update()})),c};
@@ -1,7 +1,10 @@
1
1
  import * as React from 'react';
2
2
  import { Object3D } from 'three';
3
+ import { Falsey } from 'utility-types';
3
4
  declare type Helper = Object3D & {
4
5
  update: () => void;
5
6
  };
6
- export declare function useHelper<T>(object3D: React.MutableRefObject<Object3D | undefined>, proto: T, ...args: any[]): React.MutableRefObject<Helper | undefined>;
7
+ declare type Constructor = new (...args: any[]) => any;
8
+ declare type Rest<T> = T extends [infer _, ...infer R] ? R : never;
9
+ export declare function useHelper<T extends Constructor>(object3D: React.MutableRefObject<Object3D | undefined> | Falsey | undefined, helperConstructor: T, ...args: Rest<ConstructorParameters<T>>): React.MutableRefObject<Helper | undefined>;
7
10
  export {};
package/core/useHelper.js CHANGED
@@ -1,24 +1,34 @@
1
1
  import * as React from 'react';
2
2
  import { useThree, useFrame } from '@react-three/fiber';
3
3
 
4
- function useHelper(object3D, proto, ...args) {
4
+ function useHelper(object3D, helperConstructor, ...args) {
5
5
  const helper = React.useRef();
6
6
  const scene = useThree(state => state.scene);
7
7
  React.useEffect(() => {
8
- if (proto && object3D.current) {
9
- helper.current = new proto(object3D.current, ...args);
8
+ if (object3D) {
9
+ if (helperConstructor && object3D != null && object3D.current) {
10
+ helper.current = new helperConstructor(object3D.current, ...args);
10
11
 
11
- if (helper.current) {
12
- scene.add(helper.current);
12
+ if (helper.current) {
13
+ scene.add(helper.current);
14
+ }
13
15
  }
14
16
  }
17
+ /**
18
+ * Dispose of the helper if no object 3D is passed
19
+ */
20
+
21
+
22
+ if (!object3D && helper.current) {
23
+ scene.remove(helper.current);
24
+ }
15
25
 
16
26
  return () => {
17
27
  if (helper.current) {
18
28
  scene.remove(helper.current);
19
29
  }
20
30
  };
21
- }, [scene, proto, object3D, args]);
31
+ }, [scene, helperConstructor, object3D, args]);
22
32
  useFrame(() => {
23
33
  var _helper$current;
24
34
 
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),t=require("./useTexture.cjs.js"),r=require("use-asset");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 s=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(t,r,s.get?s:{enumerable:!0,get:function(){return e[r]}})}})),t.default=e,Object.freeze(t)}require("three"),require("@react-three/fiber");var u=s(e);exports.useMatcapTexture=function(e=0,s=1024){const a=r.useAsset((()=>new Promise((async e=>{e(await fetch("https://cdn.jsdelivr.net/gh/pmndrs/drei-assets@master/matcaps.json").then((e=>e.json())))}))),"matcapList"),n=a[0],c=u.useMemo((()=>Object.keys(a).length),[]),i=`https://rawcdn.githack.com/emmelleppi/matcaps/9b36ccaaf0a24881a39062d05566c9e92be4aa0d/${s}/${`${u.useMemo((()=>"string"==typeof e?e:"number"==typeof e?a[e]:null),[e])||n}${function(e){switch(e){case 64:return"-64px";case 128:return"-128px";case 256:return"-256px";case 512:return"-512px";default:return""}}(s)}.png`}`;return[t.useTexture(i),i,c]};
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),t=require("./useTexture.cjs.js"),r=require("suspend-react");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 s=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(t,r,s.get?s:{enumerable:!0,get:function(){return e[r]}})}})),t.default=e,Object.freeze(t)}require("three"),require("@react-three/fiber");var u=s(e);exports.useMatcapTexture=function(e=0,s=1024){const n=r.suspend((()=>fetch("https://cdn.jsdelivr.net/gh/pmndrs/drei-assets@master/matcaps.json").then((e=>e.json()))),["matcapList"]),c=n[0],a=u.useMemo((()=>Object.keys(n).length),[]),i=`https://rawcdn.githack.com/emmelleppi/matcaps/9b36ccaaf0a24881a39062d05566c9e92be4aa0d/${s}/${`${u.useMemo((()=>"string"==typeof e?e:"number"==typeof e?n[e]:null),[e])||c}${function(e){switch(e){case 64:return"-64px";case 128:return"-128px";case 256:return"-256px";case 512:return"-512px";default:return""}}(s)}.png`}`;return[t.useTexture(i),i,a]};
@@ -1,6 +1,6 @@
1
1
  import * as React from 'react';
2
2
  import { useTexture } from './useTexture.js';
3
- import { useAsset } from 'use-asset';
3
+ import { suspend } from 'suspend-react';
4
4
 
5
5
  function getFormatString(format) {
6
6
  switch (format) {
@@ -24,10 +24,7 @@ function getFormatString(format) {
24
24
  const LIST_URL = 'https://cdn.jsdelivr.net/gh/pmndrs/drei-assets@master/matcaps.json';
25
25
  const MATCAP_ROOT = 'https://rawcdn.githack.com/emmelleppi/matcaps/9b36ccaaf0a24881a39062d05566c9e92be4aa0d';
26
26
  function useMatcapTexture(id = 0, format = 1024) {
27
- const matcapList = useAsset(() => new Promise(async resolve => {
28
- const matcapList = await fetch(LIST_URL).then(res => res.json());
29
- resolve(matcapList);
30
- }), 'matcapList');
27
+ const matcapList = suspend(() => fetch(LIST_URL).then(res => res.json()), ['matcapList']);
31
28
  const DEFAULT_MATCAP = matcapList[0];
32
29
  const numTot = React.useMemo(() => Object.keys(matcapList).length, []);
33
30
  const fileHash = React.useMemo(() => {
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),r=require("./useTexture.cjs.js"),t=require("three"),s=require("use-asset");function n(e){if(e&&e.__esModule)return e;var r=Object.create(null);return e&&Object.keys(e).forEach((function(t){if("default"!==t){var s=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(r,t,s.get?s:{enumerable:!0,get:function(){return e[t]}})}})),r.default=e,Object.freeze(r)}require("@react-three/fiber");var a=n(e);exports.useNormalTexture=function(e=0,n={}){const{repeat:o=[1,1],anisotropy:u=1,offset:c=[0,0]}=n,i=s.useAsset((()=>new Promise((async e=>{e(await fetch("https://cdn.jsdelivr.net/gh/pmndrs/drei-assets@master/normals/normals.json").then((e=>e.json())))}))),"normalsList"),f=a.useMemo((()=>Object.keys(i).length),[]),p=i[0],l=`https://rawcdn.githack.com/pmndrs/drei-assets/7a3104997e1576f83472829815b00880d88b32fb/normals/${i[e]||p}`,d=r.useTexture(l);return a.useLayoutEffect((()=>{d&&(d.wrapS=d.wrapT=t.RepeatWrapping,d.repeat=new t.Vector2(o[0],o[1]),d.offset=new t.Vector2(c[0],c[1]),d.anisotropy=u)}),[d,u,o,c]),[d,l,f]};
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),r=require("./useTexture.cjs.js"),t=require("three"),s=require("suspend-react");function n(e){if(e&&e.__esModule)return e;var r=Object.create(null);return e&&Object.keys(e).forEach((function(t){if("default"!==t){var s=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(r,t,s.get?s:{enumerable:!0,get:function(){return e[t]}})}})),r.default=e,Object.freeze(r)}require("@react-three/fiber");var a=n(e);exports.useNormalTexture=function(e=0,n={}){const{repeat:o=[1,1],anisotropy:u=1,offset:c=[0,0]}=n,i=s.suspend((()=>fetch("https://cdn.jsdelivr.net/gh/pmndrs/drei-assets@master/normals/normals.json").then((e=>e.json()))),["normalsList"]),f=a.useMemo((()=>Object.keys(i).length),[]),p=i[0],d=`https://rawcdn.githack.com/pmndrs/drei-assets/7a3104997e1576f83472829815b00880d88b32fb/normals/${i[e]||p}`,l=r.useTexture(d);return a.useLayoutEffect((()=>{l&&(l.wrapS=l.wrapT=t.RepeatWrapping,l.repeat=new t.Vector2(o[0],o[1]),l.offset=new t.Vector2(c[0],c[1]),l.anisotropy=u)}),[l,u,o,c]),[l,d,f]};
@@ -1,7 +1,7 @@
1
1
  import * as React from 'react';
2
2
  import { useTexture } from './useTexture.js';
3
3
  import { RepeatWrapping, Vector2 } from 'three';
4
- import { useAsset } from 'use-asset';
4
+ import { suspend } from 'suspend-react';
5
5
 
6
6
  const NORMAL_ROOT = 'https://rawcdn.githack.com/pmndrs/drei-assets/7a3104997e1576f83472829815b00880d88b32fb';
7
7
  const LIST_URL = 'https://cdn.jsdelivr.net/gh/pmndrs/drei-assets@master/normals/normals.json';
@@ -11,10 +11,7 @@ function useNormalTexture(id = 0, settings = {}) {
11
11
  anisotropy = 1,
12
12
  offset = [0, 0]
13
13
  } = settings;
14
- const normalsList = useAsset(() => new Promise(async resolve => {
15
- const normalsList = await fetch(LIST_URL).then(res => res.json());
16
- resolve(normalsList);
17
- }), 'normalsList');
14
+ const normalsList = suspend(() => fetch(LIST_URL).then(res => res.json()), ['normalsList']);
18
15
  const numTot = React.useMemo(() => Object.keys(normalsList).length, []);
19
16
  const DEFAULT_NORMAL = normalsList[0];
20
17
  const imageName = normalsList[id] || DEFAULT_NORMAL;
@@ -1 +1 @@
1
- "use strict";function e(e){if(e&&e.__esModule)return e;var t=Object.create(null);return e&&Object.keys(e).forEach((function(r){if("default"!==r){var 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)}Object.defineProperty(exports,"__esModule",{value:!0});var t=e(require("three"));const r=new t.Matrix4,n=new t.Matrix4,i=[],s=new t.Mesh;class o extends t.Group{constructor(){super(),this.color=new t.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 o=this.instance.current;if(!o)return;if(!o.geometry||!o.material)return;s.geometry=o.geometry;const c=o.matrixWorld;let a=o.userData.instances.indexOf(this.instanceKey);if(-1!==a){o.getMatrixAt(a,r),n.multiplyMatrices(c,r),s.matrixWorld=n,s.raycast(e,i);for(let e=0,r=i.length;e<r;e++){const r=i[e];r.instanceId=a,r.object=this,t.push(r)}i.length=0}}}exports.Position=o;
1
+ "use strict";function e(e){if(e&&e.__esModule)return e;var t=Object.create(null);return e&&Object.keys(e).forEach((function(r){if("default"!==r){var 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)}Object.defineProperty(exports,"__esModule",{value:!0});var t=e(require("three"));const r=new t.Matrix4,n=new t.Matrix4,i=[],s=new t.Mesh;class o extends t.Group{constructor(){super(),this.color=new t.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 o=this.instance.current;if(!o)return;if(!o.geometry||!o.material)return;s.geometry=o.geometry;const c=o.matrixWorld;let a=o.userData.instances.indexOf(this.instanceKey);if(!(-1===a||a>o.count)){o.getMatrixAt(a,r),n.multiplyMatrices(c,r),s.matrixWorld=n,s.raycast(e,i);for(let e=0,r=i.length;e<r;e++){const r=i[e];r.instanceId=a,r.object=this,t.push(r)}i.length=0}}}exports.Position=o;
@@ -34,8 +34,9 @@ class Position extends THREE.Group {
34
34
  if (!parent.geometry || !parent.material) return;
35
35
  _mesh.geometry = parent.geometry;
36
36
  const matrixWorld = parent.matrixWorld;
37
- let instanceId = parent.userData.instances.indexOf(this.instanceKey);
38
- if (instanceId === -1) return; // calculate the world matrix for each instance
37
+ let instanceId = parent.userData.instances.indexOf(this.instanceKey); // If the instance wasn't found or exceeds the parents draw range, bail out
38
+
39
+ if (instanceId === -1 || instanceId > parent.count) return; // calculate the world matrix for each instance
39
40
 
40
41
  parent.getMatrixAt(instanceId, _instanceLocalMatrix);
41
42
 
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});exports.presetsObj={sunset:"venice_sunset_1k.hdr",dawn:"kiara_1_dawn_1k.hdr",night:"dikhololo_night_1k.hdr",warehouse:"empty_warehouse_01_1k.hdr",forest:"forest_slope_1k.hdr",apartment:"lebombo_1k.hdr",studio:"studio_small_03_1k.hdr",city:"potsdamer_platz_1k.hdr",park:"rooitou_park_1k.hdr",lobby:"st_fagans_interior_1k.hdr"};
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});exports.presetsObj={sunset:"venice/venice_sunset_1k.hdr",dawn:"kiara/kiara_1_dawn_1k.hdr",night:"dikhololo/dikhololo_night_1k.hdr",warehouse:"empty-wharehouse/empty_warehouse_01_1k.hdr",forest:"forrest-slope/forest_slope_1k.hdr",apartment:"lebombo/lebombo_1k.hdr",studio:"studio-small-3/studio_small_03_1k.hdr",city:"potsdamer-platz/potsdamer_platz_1k.hdr",park:"rooitou/rooitou_park_1k.hdr",lobby:"st-fagans/st_fagans_interior_1k.hdr"};
@@ -1,14 +1,14 @@
1
1
  const presetsObj = {
2
- sunset: 'venice_sunset_1k.hdr',
3
- dawn: 'kiara_1_dawn_1k.hdr',
4
- night: 'dikhololo_night_1k.hdr',
5
- warehouse: 'empty_warehouse_01_1k.hdr',
6
- forest: 'forest_slope_1k.hdr',
7
- apartment: 'lebombo_1k.hdr',
8
- studio: 'studio_small_03_1k.hdr',
9
- city: 'potsdamer_platz_1k.hdr',
10
- park: 'rooitou_park_1k.hdr',
11
- lobby: 'st_fagans_interior_1k.hdr'
2
+ sunset: 'venice/venice_sunset_1k.hdr',
3
+ dawn: 'kiara/kiara_1_dawn_1k.hdr',
4
+ night: 'dikhololo/dikhololo_night_1k.hdr',
5
+ warehouse: 'empty-wharehouse/empty_warehouse_01_1k.hdr',
6
+ forest: 'forrest-slope/forest_slope_1k.hdr',
7
+ apartment: 'lebombo/lebombo_1k.hdr',
8
+ studio: 'studio-small-3/studio_small_03_1k.hdr',
9
+ city: 'potsdamer-platz/potsdamer_platz_1k.hdr',
10
+ park: 'rooitou/rooitou_park_1k.hdr',
11
+ lobby: 'st-fagans/st_fagans_interior_1k.hdr'
12
12
  };
13
13
 
14
14
  export { presetsObj };