@react-three/drei 9.121.4 → 10.0.0-rc.1

package/index.js

@@ -100,7 +100,6 @@ export { Shadow } from './core/Shadow.js';
 export { Caustics } from './core/Caustics.js';
 export { ContactShadows } from './core/ContactShadows.js';
 export { AccumulativeShadows, RandomizedLight, accumulativeContext } from './core/AccumulativeShadows.js';
-export { Reflector } from './core/Reflector.js';
 export { SpotLight, SpotLightShadow } from './core/SpotLight.js';
 export { Environment, EnvironmentCube, EnvironmentMap, EnvironmentPortal } from './core/Environment.js';
 export { Lightformer } from './core/Lightformer.js';

package/materials/BlurPass.js

@@ -25,7 +25,6 @@ class BlurPass {
     this.convolutionMaterial.setTexelSize(1.0 / width, 1.0 / height);
     this.convolutionMaterial.setResolution(new Vector2(width, height));
     this.scene = new Scene();
-    // @ts-expect-error fixed in r154
     this.camera = new Camera();
     this.convolutionMaterial.uniforms.minDepthThreshold.value = minDepthThreshold;
     this.convolutionMaterial.uniforms.maxDepthThreshold.value = maxDepthThreshold;

package/materials/MeshReflectorMaterial.d.ts

@@ -48,19 +48,3 @@ export declare class MeshReflectorMaterial extends MeshStandardMaterial {
     get mixContrast(): number;
     set mixContrast(v: number);
 }
-export type MeshReflectorMaterialProps = {
-    mixBlur: number;
-    mixStrength: number;
-    mirror: number;
-    textureMatrix: Matrix4;
-    tDiffuse: Texture;
-    distortionMap?: Texture;
-    tDiffuseBlur: Texture;
-    hasBlur: boolean;
-    minDepthThreshold: number;
-    maxDepthThreshold: number;
-    depthScale: number;
-    depthToBlurRatioBias: number;
-    distortion: number;
-    mixContrast: number;
-} & JSX.IntrinsicElements['meshStandardMaterial'];

package/native/index.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../core/Billboard.cjs.js"),r=require("../core/ScreenSpace.cjs.js"),s=require("../core/ScreenSizer.cjs.js"),o=require("../core/QuadraticBezierLine.cjs.js"),t=require("../core/CubicBezierLine.cjs.js"),i=require("../core/CatmullRomLine.cjs.js"),c=require("../core/Line.cjs.js"),a=require("../core/PositionalAudio.cjs.js"),u=require("../core/Text.cjs.js"),n=require("../core/Text3D.cjs.js"),p=require("../core/Effects.cjs.js"),j=require("../core/GradientTexture.cjs.js"),x=require("../core/Image.cjs.js"),l=require("../core/Edges.cjs.js"),d=require("../core/Outlines.cjs.js"),q=require("../core/Trail.cjs.js"),m=require("../core/Sampler.cjs.js"),h=require("../core/ComputedAttribute.cjs.js"),C=require("../core/Clone.cjs.js"),M=require("../core/MarchingCubes.cjs.js"),S=require("../core/Decal.cjs.js"),T=require("../core/Svg.cjs.js"),b=require("../core/Gltf.cjs.js"),P=require("../core/AsciiRenderer.cjs.js"),f=require("../core/Splat.cjs.js"),g=require("../core/OrthographicCamera.cjs.js"),B=require("../core/PerspectiveCamera.cjs.js"),v=require("../core/CubeCamera.cjs.js"),A=require("../core/DeviceOrientationControls.cjs.js"),F=require("../core/FlyControls.cjs.js"),L=require("../core/MapControls.cjs.js"),G=require("../core/OrbitControls.cjs.js"),R=require("../core/TrackballControls.cjs.js"),D=require("../core/ArcballControls.cjs.js"),E=require("../core/TransformControls.cjs.js"),k=require("../core/PointerLockControls.cjs.js"),I=require("../core/FirstPersonControls.cjs.js"),w=require("../core/CameraControls.cjs.js"),z=require("../core/MotionPathControls.cjs.js"),O=require("../core/GizmoHelper.cjs.js"),y=require("../core/GizmoViewcube.cjs.js"),H=require("../core/GizmoViewport.cjs.js"),V=require("../core/Grid.cjs.js"),W=require("../core/CubeTexture.cjs.js"),K=require("../core/Fbx.cjs.js"),Q=require("../core/Ktx2.cjs.js"),N=require("../core/Progress.cjs.js"),U=require("../core/Texture.cjs.js"),X=require("../core/VideoTexture.cjs.js"),_=require("../core/useFont.cjs.js"),J=require("../core/useSpriteLoader.cjs.js"),Y=require("../core/Helper.cjs.js"),Z=require("../core/Stats.cjs.js"),$=require("../core/StatsGl.cjs.js"),ee=require("../core/useDepthBuffer.cjs.js"),re=require("../core/useAspect.cjs.js"),se=require("../core/useCamera.cjs.js"),oe=require("../core/DetectGPU.cjs.js"),te=require("../core/Bvh.cjs.js"),ie=require("../core/useContextBridge.cjs.js"),ce=require("../core/useAnimations.cjs.js"),ae=require("../core/Fbo.cjs.js"),ue=require("../core/useIntersect.cjs.js"),ne=require("../core/useBoxProjectedEnv.cjs.js"),pe=require("../core/BBAnchor.cjs.js"),je=require("../core/TrailTexture.cjs.js"),xe=require("../core/Example.cjs.js"),le=require("../core/SpriteAnimator.cjs.js"),de=require("../core/CurveModifier.cjs.js"),qe=require("../core/MeshDistortMaterial.cjs.js"),me=require("../core/MeshWobbleMaterial.cjs.js"),he=require("../core/MeshReflectorMaterial.cjs.js"),Ce=require("../core/MeshRefractionMaterial.cjs.js"),Me=require("../core/MeshTransmissionMaterial.cjs.js"),Se=require("../core/MeshDiscardMaterial.cjs.js"),Te=require("../core/MultiMaterial.cjs.js"),be=require("../core/PointMaterial.cjs.js"),Pe=require("../core/shaderMaterial.cjs.js"),fe=require("../core/softShadows.cjs.js"),ge=require("../core/shapes.cjs.js"),Be=require("../core/RoundedBox.cjs.js"),ve=require("../core/ScreenQuad.cjs.js"),Ae=require("../core/Center.cjs.js"),Fe=require("../core/Resize.cjs.js"),Le=require("../core/Bounds.cjs.js"),Ge=require("../core/CameraShake.cjs.js"),Re=require("../core/Float.cjs.js"),De=require("../core/Stage.cjs.js"),Ee=require("../core/Backdrop.cjs.js"),ke=require("../core/Shadow.cjs.js"),Ie=require("../core/Caustics.cjs.js"),we=require("../core/ContactShadows.cjs.js"),ze=require("../core/AccumulativeShadows.cjs.js"),Oe=require("../core/Reflector.cjs.js"),ye=require("../core/SpotLight.cjs.js"),He=require("../core/Environment.cjs.js"),Ve=require("../core/Lightformer.cjs.js"),We=require("../core/Sky.cjs.js"),Ke=require("../core/Stars.cjs.js"),Qe=require("../core/Cloud.cjs.js"),Ne=require("../core/Sparkles.cjs.js"),Ue=require("../core/useEnvironment.cjs.js"),Xe=require("../core/MatcapTexture.cjs.js"),_e=require("../core/NormalTexture.cjs.js"),Je=require("../core/Wireframe.cjs.js"),Ye=require("../core/ShadowAlpha.cjs.js"),Ze=require("../core/Points.cjs.js"),$e=require("../core/Instances.cjs.js"),er=require("../core/Segments.cjs.js"),rr=require("../core/Detailed.cjs.js"),sr=require("../core/Preload.cjs.js"),or=require("../core/BakeShadows.cjs.js"),tr=require("../core/meshBounds.cjs.js"),ir=require("../core/AdaptiveDpr.cjs.js"),cr=require("../core/AdaptiveEvents.cjs.js"),ar=require("../core/PerformanceMonitor.cjs.js"),ur=require("../core/RenderTexture.cjs.js"),nr=require("../core/RenderCubeTexture.cjs.js"),pr=require("../core/Mask.cjs.js"),jr=require("../core/Hud.cjs.js"),xr=require("../core/Fisheye.cjs.js"),lr=require("../core/MeshPortalMaterial.cjs.js"),dr=require("../core/calculateScaleFactor.cjs.js");require("@babel/runtime/helpers/extends"),require("@react-three/fiber"),require("react"),require("three"),require("three-stdlib"),require("troika-three-text"),require("suspend-react"),require("../helpers/constants.cjs.js"),require("meshline"),require("camera-controls"),require("maath"),require("zustand"),require("hls.js"),require("stats.js"),require("../helpers/useEffectfulState.cjs.js"),require("stats-gl"),require("detect-gpu"),require("three-mesh-bvh"),require("react-composer"),require("../helpers/deprecated.cjs.js"),require("../materials/BlurPass.cjs.js"),require("../materials/ConvolutionMaterial.cjs.js"),require("../materials/MeshReflectorMaterial.cjs.js"),require("../materials/MeshRefractionMaterial.cjs.js"),require("../materials/DiscardMaterial.cjs.js"),require("@monogrid/gainmap-js"),require("../helpers/environment-assets.cjs.js"),require("../materials/SpotLightMaterial.cjs.js"),require("../materials/WireframeMaterial.cjs.js"),exports.Billboard=e.Billboard,exports.ScreenSpace=r.ScreenSpace,exports.ScreenSizer=s.ScreenSizer,exports.QuadraticBezierLine=o.QuadraticBezierLine,exports.CubicBezierLine=t.CubicBezierLine,exports.CatmullRomLine=i.CatmullRomLine,exports.Line=c.Line,exports.PositionalAudio=a.PositionalAudio,exports.Text=u.Text,exports.Text3D=n.Text3D,exports.Effects=p.Effects,exports.isWebGL2Available=p.isWebGL2Available,exports.GradientTexture=j.GradientTexture,exports.GradientType=j.GradientType,exports.Image=x.Image,exports.Edges=l.Edges,exports.Outlines=d.Outlines,exports.Trail=q.Trail,exports.useTrail=q.useTrail,exports.Sampler=m.Sampler,exports.useSurfaceSampler=m.useSurfaceSampler,exports.ComputedAttribute=h.ComputedAttribute,exports.Clone=C.Clone,exports.MarchingCube=M.MarchingCube,exports.MarchingCubes=M.MarchingCubes,exports.MarchingPlane=M.MarchingPlane,exports.Decal=S.Decal,exports.Svg=T.Svg,exports.Gltf=b.Gltf,exports.useGLTF=b.useGLTF,exports.AsciiRenderer=P.AsciiRenderer,exports.Splat=f.Splat,exports.OrthographicCamera=g.OrthographicCamera,exports.PerspectiveCamera=B.PerspectiveCamera,exports.CubeCamera=v.CubeCamera,exports.useCubeCamera=v.useCubeCamera,exports.DeviceOrientationControls=A.DeviceOrientationControls,exports.FlyControls=F.FlyControls,exports.MapControls=L.MapControls,exports.OrbitControls=G.OrbitControls,exports.TrackballControls=R.TrackballControls,exports.ArcballControls=D.ArcballControls,exports.TransformControls=E.TransformControls,exports.PointerLockControls=k.PointerLockControls,exports.FirstPersonControls=I.FirstPersonControls,exports.CameraControls=w.CameraControls,exports.MotionPathControls=z.MotionPathControls,exports.useMotion=z.useMotion,exports.GizmoHelper=O.GizmoHelper,exports.useGizmoContext=O.useGizmoContext,exports.GizmoViewcube=y.GizmoViewcube,exports.GizmoViewport=H.GizmoViewport,exports.Grid=V.Grid,exports.CubeTexture=W.CubeTexture,exports.useCubeTexture=W.useCubeTexture,exports.Fbx=K.Fbx,exports.useFBX=K.useFBX,exports.Ktx2=Q.Ktx2,exports.useKTX2=Q.useKTX2,exports.Progress=N.Progress,exports.useProgress=N.useProgress,exports.IsObject=U.IsObject,exports.Texture=U.Texture,exports.useTexture=U.useTexture,exports.VideoTexture=X.VideoTexture,exports.useVideoTexture=X.useVideoTexture,exports.useFont=_.useFont,exports.checkIfFrameIsEmpty=J.checkIfFrameIsEmpty,exports.getFirstFrame=J.getFirstFrame,exports.useSpriteLoader=J.useSpriteLoader,exports.Helper=Y.Helper,exports.useHelper=Y.useHelper,exports.Stats=Z.Stats,exports.StatsGl=$.StatsGl,exports.useDepthBuffer=ee.useDepthBuffer,exports.useAspect=re.useAspect,exports.useCamera=se.useCamera,exports.DetectGPU=oe.DetectGPU,exports.useDetectGPU=oe.useDetectGPU,exports.Bvh=te.Bvh,exports.useBVH=te.useBVH,exports.useContextBridge=ie.useContextBridge,exports.useAnimations=ce.useAnimations,exports.Fbo=ae.Fbo,exports.useFBO=ae.useFBO,exports.useIntersect=ue.useIntersect,exports.useBoxProjectedEnv=ne.useBoxProjectedEnv,exports.BBAnchor=pe.BBAnchor,exports.TrailTexture=je.TrailTexture,exports.useTrailTexture=je.useTrailTexture,exports.Example=xe.Example,exports.SpriteAnimator=le.SpriteAnimator,exports.useSpriteAnimator=le.useSpriteAnimator,exports.CurveModifier=de.CurveModifier,exports.MeshDistortMaterial=qe.MeshDistortMaterial,exports.MeshWobbleMaterial=me.MeshWobbleMaterial,exports.MeshReflectorMaterial=he.MeshReflectorMaterial,exports.MeshRefractionMaterial=Ce.MeshRefractionMaterial,exports.MeshTransmissionMaterial=Me.MeshTransmissionMaterial,exports.MeshDiscardMaterial=Se.MeshDiscardMaterial,exports.MultiMaterial=Te.MultiMaterial,exports.PointMaterial=be.PointMaterial,exports.PointMaterialImpl=be.PointMaterialImpl,exports.shaderMaterial=Pe.shaderMaterial,exports.SoftShadows=fe.SoftShadows,exports.Box=ge.Box,exports.Capsule=ge.Capsule,exports.Circle=ge.Circle,exports.Cone=ge.Cone,exports.Cylinder=ge.Cylinder,exports.Dodecahedron=ge.Dodecahedron,exports.Extrude=ge.Extrude,exports.Icosahedron=ge.Icosahedron,exports.Lathe=ge.Lathe,exports.Octahedron=ge.Octahedron,exports.Plane=ge.Plane,exports.Polyhedron=ge.Polyhedron,exports.Ring=ge.Ring,exports.Shape=ge.Shape,exports.Sphere=ge.Sphere,exports.Tetrahedron=ge.Tetrahedron,exports.Torus=ge.Torus,exports.TorusKnot=ge.TorusKnot,exports.Tube=ge.Tube,exports.RoundedBox=Be.RoundedBox,exports.ScreenQuad=ve.ScreenQuad,exports.Center=Ae.Center,exports.Resize=Fe.Resize,exports.Bounds=Le.Bounds,exports.useBounds=Le.useBounds,exports.CameraShake=Ge.CameraShake,exports.Float=Re.Float,exports.Stage=De.Stage,exports.Backdrop=Ee.Backdrop,exports.Shadow=ke.Shadow,exports.Caustics=Ie.Caustics,exports.ContactShadows=we.ContactShadows,exports.AccumulativeShadows=ze.AccumulativeShadows,exports.RandomizedLight=ze.RandomizedLight,exports.accumulativeContext=ze.accumulativeContext,exports.Reflector=Oe.Reflector,exports.SpotLight=ye.SpotLight,exports.SpotLightShadow=ye.SpotLightShadow,exports.Environment=He.Environment,exports.EnvironmentCube=He.EnvironmentCube,exports.EnvironmentMap=He.EnvironmentMap,exports.EnvironmentPortal=He.EnvironmentPortal,exports.Lightformer=Ve.Lightformer,exports.Sky=We.Sky,exports.calcPosFromAngles=We.calcPosFromAngles,exports.Stars=Ke.Stars,exports.Cloud=Qe.Cloud,exports.CloudInstance=Qe.CloudInstance,exports.Clouds=Qe.Clouds,exports.Sparkles=Ne.Sparkles,exports.useEnvironment=Ue.useEnvironment,exports.MatcapTexture=Xe.MatcapTexture,exports.useMatcapTexture=Xe.useMatcapTexture,exports.NormalTexture=_e.NormalTexture,exports.useNormalTexture=_e.useNormalTexture,exports.Wireframe=Je.Wireframe,exports.ShadowAlpha=Ye.ShadowAlpha,exports.Point=Ze.Point,exports.Points=Ze.Points,exports.PointsBuffer=Ze.PointsBuffer,exports.PositionPoint=Ze.PositionPoint,exports.Instance=$e.Instance,exports.InstancedAttribute=$e.InstancedAttribute,exports.Instances=$e.Instances,exports.Merged=$e.Merged,exports.PositionMesh=$e.PositionMesh,exports.createInstances=$e.createInstances,exports.Segment=er.Segment,exports.SegmentObject=er.SegmentObject,exports.Segments=er.Segments,exports.Detailed=rr.Detailed,exports.Preload=sr.Preload,exports.BakeShadows=or.BakeShadows,exports.meshBounds=tr.meshBounds,exports.AdaptiveDpr=ir.AdaptiveDpr,exports.AdaptiveEvents=cr.AdaptiveEvents,exports.PerformanceMonitor=ar.PerformanceMonitor,exports.usePerformanceMonitor=ar.usePerformanceMonitor,exports.RenderTexture=ur.RenderTexture,exports.RenderCubeTexture=nr.RenderCubeTexture,exports.Mask=pr.Mask,exports.useMask=pr.useMask,exports.Hud=jr.Hud,exports.Fisheye=xr.Fisheye,exports.MeshPortalMaterial=lr.MeshPortalMaterial,exports.calculateScaleFactor=dr.calculateScaleFactor;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../core/Billboard.cjs.js"),r=require("../core/ScreenSpace.cjs.js"),s=require("../core/ScreenSizer.cjs.js"),o=require("../core/QuadraticBezierLine.cjs.js"),t=require("../core/CubicBezierLine.cjs.js"),i=require("../core/CatmullRomLine.cjs.js"),a=require("../core/Line.cjs.js"),c=require("../core/PositionalAudio.cjs.js"),u=require("../core/Text.cjs.js"),n=require("../core/Text3D.cjs.js"),p=require("../core/Effects.cjs.js"),j=require("../core/GradientTexture.cjs.js"),x=require("../core/Image.cjs.js"),l=require("../core/Edges.cjs.js"),d=require("../core/Outlines.cjs.js"),q=require("../core/Trail.cjs.js"),m=require("../core/Sampler.cjs.js"),h=require("../core/ComputedAttribute.cjs.js"),C=require("../core/Clone.cjs.js"),M=require("../core/MarchingCubes.cjs.js"),S=require("../core/Decal.cjs.js"),T=require("../core/Svg.cjs.js"),b=require("../core/Gltf.cjs.js"),P=require("../core/AsciiRenderer.cjs.js"),g=require("../core/Splat.cjs.js"),f=require("../core/OrthographicCamera.cjs.js"),B=require("../core/PerspectiveCamera.cjs.js"),v=require("../core/CubeCamera.cjs.js"),A=require("../core/DeviceOrientationControls.cjs.js"),F=require("../core/FlyControls.cjs.js"),L=require("../core/MapControls.cjs.js"),G=require("../core/OrbitControls.cjs.js"),D=require("../core/TrackballControls.cjs.js"),E=require("../core/ArcballControls.cjs.js"),R=require("../core/TransformControls.cjs.js"),k=require("../core/PointerLockControls.cjs.js"),I=require("../core/FirstPersonControls.cjs.js"),w=require("../core/CameraControls.cjs.js"),z=require("../core/MotionPathControls.cjs.js"),O=require("../core/GizmoHelper.cjs.js"),y=require("../core/GizmoViewcube.cjs.js"),H=require("../core/GizmoViewport.cjs.js"),V=require("../core/Grid.cjs.js"),W=require("../core/CubeTexture.cjs.js"),K=require("../core/Fbx.cjs.js"),Q=require("../core/Ktx2.cjs.js"),N=require("../core/Progress.cjs.js"),U=require("../core/Texture.cjs.js"),X=require("../core/VideoTexture.cjs.js"),_=require("../core/useFont.cjs.js"),J=require("../core/useSpriteLoader.cjs.js"),Y=require("../core/Helper.cjs.js"),Z=require("../core/Stats.cjs.js"),$=require("../core/StatsGl.cjs.js"),ee=require("../core/useDepthBuffer.cjs.js"),re=require("../core/useAspect.cjs.js"),se=require("../core/useCamera.cjs.js"),oe=require("../core/DetectGPU.cjs.js"),te=require("../core/Bvh.cjs.js"),ie=require("../core/useContextBridge.cjs.js"),ae=require("../core/useAnimations.cjs.js"),ce=require("../core/Fbo.cjs.js"),ue=require("../core/useIntersect.cjs.js"),ne=require("../core/useBoxProjectedEnv.cjs.js"),pe=require("../core/BBAnchor.cjs.js"),je=require("../core/TrailTexture.cjs.js"),xe=require("../core/Example.cjs.js"),le=require("../core/SpriteAnimator.cjs.js"),de=require("../core/CurveModifier.cjs.js"),qe=require("../core/MeshDistortMaterial.cjs.js"),me=require("../core/MeshWobbleMaterial.cjs.js"),he=require("../core/MeshReflectorMaterial.cjs.js"),Ce=require("../core/MeshRefractionMaterial.cjs.js"),Me=require("../core/MeshTransmissionMaterial.cjs.js"),Se=require("../core/MeshDiscardMaterial.cjs.js"),Te=require("../core/MultiMaterial.cjs.js"),be=require("../core/PointMaterial.cjs.js"),Pe=require("../core/shaderMaterial.cjs.js"),ge=require("../core/softShadows.cjs.js"),fe=require("../core/shapes.cjs.js"),Be=require("../core/RoundedBox.cjs.js"),ve=require("../core/ScreenQuad.cjs.js"),Ae=require("../core/Center.cjs.js"),Fe=require("../core/Resize.cjs.js"),Le=require("../core/Bounds.cjs.js"),Ge=require("../core/CameraShake.cjs.js"),De=require("../core/Float.cjs.js"),Ee=require("../core/Stage.cjs.js"),Re=require("../core/Backdrop.cjs.js"),ke=require("../core/Shadow.cjs.js"),Ie=require("../core/Caustics.cjs.js"),we=require("../core/ContactShadows.cjs.js"),ze=require("../core/AccumulativeShadows.cjs.js"),Oe=require("../core/SpotLight.cjs.js"),ye=require("../core/Environment.cjs.js"),He=require("../core/Lightformer.cjs.js"),Ve=require("../core/Sky.cjs.js"),We=require("../core/Stars.cjs.js"),Ke=require("../core/Cloud.cjs.js"),Qe=require("../core/Sparkles.cjs.js"),Ne=require("../core/useEnvironment.cjs.js"),Ue=require("../core/MatcapTexture.cjs.js"),Xe=require("../core/NormalTexture.cjs.js"),_e=require("../core/Wireframe.cjs.js"),Je=require("../core/ShadowAlpha.cjs.js"),Ye=require("../core/Points.cjs.js"),Ze=require("../core/Instances.cjs.js"),$e=require("../core/Segments.cjs.js"),er=require("../core/Detailed.cjs.js"),rr=require("../core/Preload.cjs.js"),sr=require("../core/BakeShadows.cjs.js"),or=require("../core/meshBounds.cjs.js"),tr=require("../core/AdaptiveDpr.cjs.js"),ir=require("../core/AdaptiveEvents.cjs.js"),ar=require("../core/PerformanceMonitor.cjs.js"),cr=require("../core/RenderTexture.cjs.js"),ur=require("../core/RenderCubeTexture.cjs.js"),nr=require("../core/Mask.cjs.js"),pr=require("../core/Hud.cjs.js"),jr=require("../core/Fisheye.cjs.js"),xr=require("../core/MeshPortalMaterial.cjs.js"),lr=require("../core/calculateScaleFactor.cjs.js");require("@babel/runtime/helpers/extends"),require("react"),require("three"),require("@react-three/fiber"),require("three-stdlib"),require("troika-three-text"),require("suspend-react"),require("../helpers/constants.cjs.js"),require("meshline"),require("camera-controls"),require("maath"),require("zustand"),require("hls.js"),require("stats.js"),require("../helpers/useEffectfulState.cjs.js"),require("stats-gl"),require("detect-gpu"),require("three-mesh-bvh"),require("../helpers/deprecated.cjs.js"),require("../materials/BlurPass.cjs.js"),require("../materials/ConvolutionMaterial.cjs.js"),require("../materials/MeshReflectorMaterial.cjs.js"),require("../materials/MeshRefractionMaterial.cjs.js"),require("../materials/DiscardMaterial.cjs.js"),require("@monogrid/gainmap-js"),require("../helpers/environment-assets.cjs.js"),require("../materials/SpotLightMaterial.cjs.js"),require("../materials/WireframeMaterial.cjs.js"),exports.Billboard=e.Billboard,exports.ScreenSpace=r.ScreenSpace,exports.ScreenSizer=s.ScreenSizer,exports.QuadraticBezierLine=o.QuadraticBezierLine,exports.CubicBezierLine=t.CubicBezierLine,exports.CatmullRomLine=i.CatmullRomLine,exports.Line=a.Line,exports.PositionalAudio=c.PositionalAudio,exports.Text=u.Text,exports.Text3D=n.Text3D,exports.Effects=p.Effects,exports.isWebGL2Available=p.isWebGL2Available,exports.GradientTexture=j.GradientTexture,exports.GradientType=j.GradientType,exports.Image=x.Image,exports.Edges=l.Edges,exports.Outlines=d.Outlines,exports.Trail=q.Trail,exports.useTrail=q.useTrail,exports.Sampler=m.Sampler,exports.useSurfaceSampler=m.useSurfaceSampler,exports.ComputedAttribute=h.ComputedAttribute,exports.Clone=C.Clone,exports.MarchingCube=M.MarchingCube,exports.MarchingCubes=M.MarchingCubes,exports.MarchingPlane=M.MarchingPlane,exports.Decal=S.Decal,exports.Svg=T.Svg,exports.Gltf=b.Gltf,exports.useGLTF=b.useGLTF,exports.AsciiRenderer=P.AsciiRenderer,exports.Splat=g.Splat,exports.OrthographicCamera=f.OrthographicCamera,exports.PerspectiveCamera=B.PerspectiveCamera,exports.CubeCamera=v.CubeCamera,exports.useCubeCamera=v.useCubeCamera,exports.DeviceOrientationControls=A.DeviceOrientationControls,exports.FlyControls=F.FlyControls,exports.MapControls=L.MapControls,exports.OrbitControls=G.OrbitControls,exports.TrackballControls=D.TrackballControls,exports.ArcballControls=E.ArcballControls,exports.TransformControls=R.TransformControls,exports.PointerLockControls=k.PointerLockControls,exports.FirstPersonControls=I.FirstPersonControls,exports.CameraControls=w.CameraControls,exports.MotionPathControls=z.MotionPathControls,exports.useMotion=z.useMotion,exports.GizmoHelper=O.GizmoHelper,exports.useGizmoContext=O.useGizmoContext,exports.GizmoViewcube=y.GizmoViewcube,exports.GizmoViewport=H.GizmoViewport,exports.Grid=V.Grid,exports.CubeTexture=W.CubeTexture,exports.useCubeTexture=W.useCubeTexture,exports.Fbx=K.Fbx,exports.useFBX=K.useFBX,exports.Ktx2=Q.Ktx2,exports.useKTX2=Q.useKTX2,exports.Progress=N.Progress,exports.useProgress=N.useProgress,exports.IsObject=U.IsObject,exports.Texture=U.Texture,exports.useTexture=U.useTexture,exports.VideoTexture=X.VideoTexture,exports.useVideoTexture=X.useVideoTexture,exports.useFont=_.useFont,exports.checkIfFrameIsEmpty=J.checkIfFrameIsEmpty,exports.getFirstFrame=J.getFirstFrame,exports.useSpriteLoader=J.useSpriteLoader,exports.Helper=Y.Helper,exports.useHelper=Y.useHelper,exports.Stats=Z.Stats,exports.StatsGl=$.StatsGl,exports.useDepthBuffer=ee.useDepthBuffer,exports.useAspect=re.useAspect,exports.useCamera=se.useCamera,exports.DetectGPU=oe.DetectGPU,exports.useDetectGPU=oe.useDetectGPU,exports.Bvh=te.Bvh,exports.useBVH=te.useBVH,exports.useContextBridge=ie.useContextBridge,exports.useAnimations=ae.useAnimations,exports.Fbo=ce.Fbo,exports.useFBO=ce.useFBO,exports.useIntersect=ue.useIntersect,exports.useBoxProjectedEnv=ne.useBoxProjectedEnv,exports.BBAnchor=pe.BBAnchor,exports.TrailTexture=je.TrailTexture,exports.useTrailTexture=je.useTrailTexture,exports.Example=xe.Example,exports.SpriteAnimator=le.SpriteAnimator,exports.useSpriteAnimator=le.useSpriteAnimator,exports.CurveModifier=de.CurveModifier,exports.MeshDistortMaterial=qe.MeshDistortMaterial,exports.MeshWobbleMaterial=me.MeshWobbleMaterial,exports.MeshReflectorMaterial=he.MeshReflectorMaterial,exports.MeshRefractionMaterial=Ce.MeshRefractionMaterial,exports.MeshTransmissionMaterial=Me.MeshTransmissionMaterial,exports.MeshDiscardMaterial=Se.MeshDiscardMaterial,exports.MultiMaterial=Te.MultiMaterial,exports.PointMaterial=be.PointMaterial,exports.PointMaterialImpl=be.PointMaterialImpl,exports.shaderMaterial=Pe.shaderMaterial,exports.SoftShadows=ge.SoftShadows,exports.Box=fe.Box,exports.Capsule=fe.Capsule,exports.Circle=fe.Circle,exports.Cone=fe.Cone,exports.Cylinder=fe.Cylinder,exports.Dodecahedron=fe.Dodecahedron,exports.Extrude=fe.Extrude,exports.Icosahedron=fe.Icosahedron,exports.Lathe=fe.Lathe,exports.Octahedron=fe.Octahedron,exports.Plane=fe.Plane,exports.Polyhedron=fe.Polyhedron,exports.Ring=fe.Ring,exports.Shape=fe.Shape,exports.Sphere=fe.Sphere,exports.Tetrahedron=fe.Tetrahedron,exports.Torus=fe.Torus,exports.TorusKnot=fe.TorusKnot,exports.Tube=fe.Tube,exports.RoundedBox=Be.RoundedBox,exports.ScreenQuad=ve.ScreenQuad,exports.Center=Ae.Center,exports.Resize=Fe.Resize,exports.Bounds=Le.Bounds,exports.useBounds=Le.useBounds,exports.CameraShake=Ge.CameraShake,exports.Float=De.Float,exports.Stage=Ee.Stage,exports.Backdrop=Re.Backdrop,exports.Shadow=ke.Shadow,exports.Caustics=Ie.Caustics,exports.ContactShadows=we.ContactShadows,exports.AccumulativeShadows=ze.AccumulativeShadows,exports.RandomizedLight=ze.RandomizedLight,exports.accumulativeContext=ze.accumulativeContext,exports.SpotLight=Oe.SpotLight,exports.SpotLightShadow=Oe.SpotLightShadow,exports.Environment=ye.Environment,exports.EnvironmentCube=ye.EnvironmentCube,exports.EnvironmentMap=ye.EnvironmentMap,exports.EnvironmentPortal=ye.EnvironmentPortal,exports.Lightformer=He.Lightformer,exports.Sky=Ve.Sky,exports.calcPosFromAngles=Ve.calcPosFromAngles,exports.Stars=We.Stars,exports.Cloud=Ke.Cloud,exports.CloudInstance=Ke.CloudInstance,exports.Clouds=Ke.Clouds,exports.Sparkles=Qe.Sparkles,exports.useEnvironment=Ne.useEnvironment,exports.MatcapTexture=Ue.MatcapTexture,exports.useMatcapTexture=Ue.useMatcapTexture,exports.NormalTexture=Xe.NormalTexture,exports.useNormalTexture=Xe.useNormalTexture,exports.Wireframe=_e.Wireframe,exports.ShadowAlpha=Je.ShadowAlpha,exports.Point=Ye.Point,exports.Points=Ye.Points,exports.PointsBuffer=Ye.PointsBuffer,exports.PositionPoint=Ye.PositionPoint,exports.Instance=Ze.Instance,exports.InstancedAttribute=Ze.InstancedAttribute,exports.Instances=Ze.Instances,exports.Merged=Ze.Merged,exports.PositionMesh=Ze.PositionMesh,exports.createInstances=Ze.createInstances,exports.Segment=$e.Segment,exports.SegmentObject=$e.SegmentObject,exports.Segments=$e.Segments,exports.Detailed=er.Detailed,exports.Preload=rr.Preload,exports.BakeShadows=sr.BakeShadows,exports.meshBounds=or.meshBounds,exports.AdaptiveDpr=tr.AdaptiveDpr,exports.AdaptiveEvents=ir.AdaptiveEvents,exports.PerformanceMonitor=ar.PerformanceMonitor,exports.usePerformanceMonitor=ar.usePerformanceMonitor,exports.RenderTexture=cr.RenderTexture,exports.RenderCubeTexture=ur.RenderCubeTexture,exports.Mask=nr.Mask,exports.useMask=nr.useMask,exports.Hud=pr.Hud,exports.Fisheye=jr.Fisheye,exports.MeshPortalMaterial=xr.MeshPortalMaterial,exports.calculateScaleFactor=lr.calculateScaleFactor;

package/native/index.js

@@ -91,7 +91,6 @@ export { Shadow } from '../core/Shadow.js';
 export { Caustics } from '../core/Caustics.js';
 export { ContactShadows } from '../core/ContactShadows.js';
 export { AccumulativeShadows, RandomizedLight, accumulativeContext } from '../core/AccumulativeShadows.js';
-export { Reflector } from '../core/Reflector.js';
 export { SpotLight, SpotLightShadow } from '../core/SpotLight.js';
 export { Environment, EnvironmentCube, EnvironmentMap, EnvironmentPortal } from '../core/Environment.js';
 export { Lightformer } from '../core/Lightformer.js';
@@ -122,9 +121,9 @@ export { Fisheye } from '../core/Fisheye.js';
 export { MeshPortalMaterial } from '../core/MeshPortalMaterial.js';
 export { calculateScaleFactor } from '../core/calculateScaleFactor.js';
 import '@babel/runtime/helpers/esm/extends';
-import '@react-three/fiber';
 import 'react';
 import 'three';
+import '@react-three/fiber';
 import 'three-stdlib';
 import 'troika-three-text';
 import 'suspend-react';
@@ -139,7 +138,6 @@ import '../helpers/useEffectfulState.js';
 import 'stats-gl';
 import 'detect-gpu';
 import 'three-mesh-bvh';
-import 'react-composer';
 import '../helpers/deprecated.js';
 import '../materials/BlurPass.js';
 import '../materials/ConvolutionMaterial.js';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@react-three/drei",
-  "version": "9.121.4",
+  "version": "10.0.0-rc.1",
   "private": false,
   "description": "useful add-ons for react-three-fiber",
   "keywords": [
@@ -33,7 +33,6 @@
     "@babel/runtime": "^7.26.0",
     "@mediapipe/tasks-vision": "0.10.17",
     "@monogrid/gainmap-js": "^3.0.6",
-    "@react-spring/three": "~9.7.5",
     "@use-gesture/react": "^10.3.1",
     "camera-controls": "^2.9.0",
     "cross-env": "^7.0.3",
@@ -42,22 +41,22 @@
     "hls.js": "^1.5.17",
     "maath": "^0.10.8",
     "meshline": "^3.3.1",
-    "react-composer": "^5.0.3",
     "stats-gl": "^2.2.8",
     "stats.js": "^0.17.0",
     "suspend-react": "^0.1.3",
-    "three-mesh-bvh": "^0.7.8",
+    "three-mesh-bvh": "^0.8.3",
     "three-stdlib": "^2.35.6",
     "troika-three-text": "^0.52.0",
     "tunnel-rat": "^0.1.2",
+    "use-sync-external-store": "^1.4.0",
     "utility-types": "^3.11.0",
     "zustand": "^5.0.1"
   },
   "peerDependencies": {
-    "@react-three/fiber": "^8",
-    "react": "^18",
-    "react-dom": "^18",
-    "three": ">=0.137"
+    "@react-three/fiber": "9.0.0-rc.5",
+    "react": "^19",
+    "react-dom": "^19",
+    "three": ">=0.159"
   },
   "peerDependenciesMeta": {
     "react-dom": {

package/web/CycleRaycast.d.ts

@@ -5,6 +5,6 @@ export type CycleRaycastProps = {
     preventDefault?: boolean;
     scroll?: boolean;
     keyCode?: number;
-    portal?: React.MutableRefObject<HTMLElement>;
+    portal?: React.RefObject<HTMLElement>;
 };
 export declare function CycleRaycast({ onChanged, portal, preventDefault, scroll, keyCode, }: CycleRaycastProps): null;

package/web/FaceControls.js

@@ -24,14 +24,14 @@ function localToLocal(objSrc, v, objDst) {
 
 const FaceControlsContext = /* @__PURE__ */createContext({});
 
-/**
- * The camera follows your face.
- *
- * Pre-requisite: wrap into a `FaceLandmarker` provider:
- *
- * ```jsx
- * <FaceLandmarker>...</FaceLandmarker>
- * ```
+/**
+ * The camera follows your face.
+ *
+ * Pre-requisite: wrap into a `FaceLandmarker` provider:
+ *
+ * ```jsx
+ * <FaceLandmarker>...</FaceLandmarker>
+ * ```
  */
 
 const FaceControls = /* @__PURE__ */forwardRef(({

package/web/FaceLandmarker.d.ts

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { ReactNode } from 'react';
 import type { FaceLandmarker as FaceLandmarkerImpl, FaceLandmarkerOptions } from '@mediapipe/tasks-vision';
-type FaceLandmarkerProps = {
+export type FaceLandmarkerProps = {
     basePath?: string;
     options?: FaceLandmarkerOptions;
     children?: ReactNode;
@@ -12,4 +12,3 @@ export declare const FaceLandmarkerDefaults: {
 };
 export declare const FaceLandmarker: React.ForwardRefExoticComponent<FaceLandmarkerProps & React.RefAttributes<FaceLandmarkerImpl>>;
 export declare function useFaceLandmarker(): FaceLandmarkerImpl | undefined;
-export {};

package/web/Facemesh.d.ts

@@ -1,5 +1,6 @@
 import * as React from 'react';
 import * as THREE from 'three';
+import { ThreeElements } from '@react-three/fiber';
 export type MediaPipeFaceMesh = typeof FacemeshDatas.SAMPLE_FACE;
 export type MediaPipePoints = typeof FacemeshDatas.SAMPLE_FACE.keypoints | (typeof FacemeshDatas.SAMPLE_FACELANDMARKER_RESULT.faceLandmarks)[0];
 export type FacemeshProps = {
@@ -17,7 +18,7 @@ export type FacemeshProps = {
     eyes?: boolean;
     eyesAsOrigin?: boolean;
     debug?: boolean;
-} & Omit<JSX.IntrinsicElements['group'], 'ref'>;
+} & Omit<ThreeElements['group'], 'ref'>;
 export type FacemeshApi = {
     meshRef: React.RefObject<THREE.Mesh>;
     outerRef: React.RefObject<THREE.Group>;
@@ -39,7 +40,7 @@ export declare const Facemesh: React.ForwardRefExoticComponent<{
     eyes?: boolean;
     eyesAsOrigin?: boolean;
     debug?: boolean;
-} & Omit<import("@react-three/fiber").GroupProps, "ref"> & React.RefAttributes<FacemeshApi>>;
+} & Omit<import("@react-three/fiber/dist/declarations/src/core/utils").Mutable<import("@react-three/fiber/dist/declarations/src/core/utils").Overwrite<Partial<import("@react-three/fiber/dist/declarations/src/core/utils").Overwrite<THREE.Group<THREE.Object3DEventMap>, import("@react-three/fiber").MathProps<THREE.Group<THREE.Object3DEventMap>> & import("@react-three/fiber").ReactProps<THREE.Group<THREE.Object3DEventMap>> & Partial<import("@react-three/fiber").EventHandlers>>>, Omit<import("@react-three/fiber").InstanceProps<THREE.Group<THREE.Object3DEventMap>, typeof THREE.Group>, "object">>>, "ref"> & React.RefAttributes<FacemeshApi>>;
 export type FacemeshEyeProps = {
     side: 'left' | 'right';
     debug?: boolean;

package/web/Html.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@babel/runtime/helpers/extends"),t=require("react"),r=require("react-dom/client"),n=require("three"),o=require("@react-three/fiber");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 a=i(e),c=s(t),l=s(r);const u=new n.Vector3,d=new n.Vector3,m=new n.Vector3,f=new n.Vector2;function h(e,t,r){const n=u.setFromMatrixPosition(e.matrixWorld);n.project(t);const o=r.width/2,i=r.height/2;return[n.x*o+o,-n.y*i+i]}const p=e=>Math.abs(e)<1e-10?0:e;function x(e,t,r=""){let n="matrix3d(";for(let r=0;16!==r;r++)n+=p(t[r]*e.elements[r])+(15!==r?",":")");return r+n}const v=(y=[1,-1,1,1,1,-1,1,1,1,-1,1,1,1,-1,1,1],e=>x(e,y));var y;const g=(e,t)=>{return x(e,[1/(r=t),1/r,1/r,1,-1/r,-1/r,-1/r,-1,1/r,1/r,1/r,1,1,1,1,1],"translate(-50%,-50%)");var r};const M=c.forwardRef((({children:e,eps:t=.001,style:r,className:i,prepend:s,center:x,fullscreen:y,portal:M,distanceFactor:b,sprite:P=!1,transform:w=!1,occlude:E,onOcclude:W,castShadow:S,receiveShadow:$,material:j,geometry:z,zIndexRange:O=[16777271,0],calculatePosition:R=h,as:F="div",wrapperClass:C,pointerEvents:T="auto",...I},A)=>{const{gl:k,camera:H,scene:N,size:V,raycaster:_,events:q,viewport:L}=o.useThree(),[D]=c.useState((()=>document.createElement(F))),G=c.useRef(),Z=c.useRef(null),B=c.useRef(0),J=c.useRef([0,0]),K=c.useRef(null),Q=c.useRef(null),U=(null==M?void 0:M.current)||q.connected||k.domElement.parentNode,X=c.useRef(null),Y=c.useRef(!1),ee=c.useMemo((()=>E&&"blending"!==E||Array.isArray(E)&&E.length&&function(e){return e&&"object"==typeof e&&"current"in e}(E[0])),[E]);c.useLayoutEffect((()=>{const e=k.domElement;E&&"blending"===E?(e.style.zIndex=`${Math.floor(O[0]/2)}`,e.style.position="absolute",e.style.pointerEvents="none"):(e.style.zIndex=null,e.style.position=null,e.style.pointerEvents=null)}),[E]),c.useLayoutEffect((()=>{if(Z.current){const e=G.current=l.createRoot(D);if(N.updateMatrixWorld(),w)D.style.cssText="position:absolute;top:0;left:0;pointer-events:none;overflow:hidden;";else{const e=R(Z.current,H,V);D.style.cssText=`position:absolute;top:0;left:0;transform:translate3d(${e[0]}px,${e[1]}px,0);transform-origin:0 0;`}return U&&(s?U.prepend(D):U.appendChild(D)),()=>{U&&U.removeChild(D),e.unmount()}}}),[U,w]),c.useLayoutEffect((()=>{C&&(D.className=C)}),[C]);const te=c.useMemo((()=>w?{position:"absolute",top:0,left:0,width:V.width,height:V.height,transformStyle:"preserve-3d",pointerEvents:"none"}:{position:"absolute",transform:x?"translate3d(-50%,-50%,0)":"none",...y&&{top:-V.height/2,left:-V.width/2,width:V.width,height:V.height},...r}),[r,x,y,V,w]),re=c.useMemo((()=>({position:"absolute",pointerEvents:T})),[T]);c.useLayoutEffect((()=>{var t,n;(Y.current=!1,w)?null==(t=G.current)||t.render(c.createElement("div",{ref:K,style:te},c.createElement("div",{ref:Q,style:re},c.createElement("div",{ref:A,className:i,style:r,children:e})))):null==(n=G.current)||n.render(c.createElement("div",{ref:A,style:te,className:i,children:e}))}));const ne=c.useRef(!0);o.useFrame((e=>{if(Z.current){H.updateMatrixWorld(),Z.current.updateWorldMatrix(!0,!1);const e=w?J.current:R(Z.current,H,V);if(w||Math.abs(B.current-H.zoom)>t||Math.abs(J.current[0]-e[0])>t||Math.abs(J.current[1]-e[1])>t){const t=function(e,t){const r=u.setFromMatrixPosition(e.matrixWorld),n=d.setFromMatrixPosition(t.matrixWorld),o=r.sub(n),i=t.getWorldDirection(m);return o.angleTo(i)>Math.PI/2}(Z.current,H);let r=!1;ee&&(Array.isArray(E)?r=E.map((e=>e.current)):"blending"!==E&&(r=[N]));const o=ne.current;if(r){const e=function(e,t,r,n){const o=u.setFromMatrixPosition(e.matrixWorld),i=o.clone();i.project(t),f.set(i.x,i.y),r.setFromCamera(f,t);const s=r.intersectObjects(n,!0);if(s.length){const e=s[0].distance;return o.distanceTo(r.ray.origin)<e}return!0}(Z.current,H,_,r);ne.current=e&&!t}else ne.current=!t;o!==ne.current&&(W?W(!ne.current):D.style.display=ne.current?"block":"none");const i=Math.floor(O[0]/2),s=E?ee?[O[0],i]:[i-1,0]:O;if(D.style.zIndex=`${function(e,t,r){if(t instanceof n.PerspectiveCamera||t instanceof n.OrthographicCamera){const n=u.setFromMatrixPosition(e.matrixWorld),o=d.setFromMatrixPosition(t.matrixWorld),i=n.distanceTo(o),s=(r[1]-r[0])/(t.far-t.near),a=r[1]-s*t.far;return Math.round(s*i+a)}}(Z.current,H,s)}`,w){const[e,t]=[V.width/2,V.height/2],r=H.projectionMatrix.elements[5]*t,{isOrthographicCamera:n,top:o,left:i,bottom:s,right:a}=H,c=v(H.matrixWorldInverse),l=n?`scale(${r})translate(${p(-(a+i)/2)}px,${p((o+s)/2)}px)`:`translateZ(${r}px)`;let u=Z.current.matrixWorld;P&&(u=H.matrixWorldInverse.clone().transpose().copyPosition(u).scale(Z.current.scale),u.elements[3]=u.elements[7]=u.elements[11]=0,u.elements[15]=1),D.style.width=V.width+"px",D.style.height=V.height+"px",D.style.perspective=n?"":`${r}px`,K.current&&Q.current&&(K.current.style.transform=`${l}${c}translate(${e}px,${t}px)`,Q.current.style.transform=g(u,1/((b||10)/400)))}else{const t=void 0===b?1:function(e,t){if(t instanceof n.OrthographicCamera)return t.zoom;if(t instanceof n.PerspectiveCamera){const r=u.setFromMatrixPosition(e.matrixWorld),n=d.setFromMatrixPosition(t.matrixWorld),o=t.fov*Math.PI/180,i=r.distanceTo(n);return 1/(2*Math.tan(o/2)*i)}return 1}(Z.current,H)*b;D.style.transform=`translate3d(${e[0]}px,${e[1]}px,0) scale(${t})`}J.current=e,B.current=H.zoom}}if(!ee&&X.current&&!Y.current)if(w){if(K.current){const e=K.current.children[0];if(null!=e&&e.clientWidth&&null!=e&&e.clientHeight){const{isOrthographicCamera:t}=H;if(t||z)I.scale&&(Array.isArray(I.scale)?I.scale instanceof n.Vector3?X.current.scale.copy(I.scale.clone().divideScalar(1)):X.current.scale.set(1/I.scale[0],1/I.scale[1],1/I.scale[2]):X.current.scale.setScalar(1/I.scale));else{const t=(b||10)/400,r=e.clientWidth*t,n=e.clientHeight*t;X.current.scale.set(r,n,1)}Y.current=!0}}}else{const t=D.children[0];if(null!=t&&t.clientWidth&&null!=t&&t.clientHeight){const e=1/L.factor,r=t.clientWidth*e,n=t.clientHeight*e;X.current.scale.set(r,n,1),Y.current=!0}X.current.lookAt(e.camera.position)}}));const oe=c.useMemo((()=>({vertexShader:w?void 0:'\n          /*\n            This shader is from the THREE\'s SpriteMaterial.\n            We need to turn the backing plane into a Sprite\n            (make it always face the camera) if "transfrom"\n            is false.\n          */\n          #include <common>\n\n          void main() {\n            vec2 center = vec2(0., 1.);\n            float rotation = 0.0;\n\n            // This is somewhat arbitrary, but it seems to work well\n            // Need to figure out how to derive this dynamically if it even matters\n            float size = 0.03;\n\n            vec4 mvPosition = modelViewMatrix * vec4( 0.0, 0.0, 0.0, 1.0 );\n            vec2 scale;\n            scale.x = length( vec3( modelMatrix[ 0 ].x, modelMatrix[ 0 ].y, modelMatrix[ 0 ].z ) );\n            scale.y = length( vec3( modelMatrix[ 1 ].x, modelMatrix[ 1 ].y, modelMatrix[ 1 ].z ) );\n\n            bool isPerspective = isPerspectiveMatrix( projectionMatrix );\n            if ( isPerspective ) scale *= - mvPosition.z;\n\n            vec2 alignedPosition = ( position.xy - ( center - vec2( 0.5 ) ) ) * scale * size;\n            vec2 rotatedPosition;\n            rotatedPosition.x = cos( rotation ) * alignedPosition.x - sin( rotation ) * alignedPosition.y;\n            rotatedPosition.y = sin( rotation ) * alignedPosition.x + cos( rotation ) * alignedPosition.y;\n            mvPosition.xy += rotatedPosition;\n\n            gl_Position = projectionMatrix * mvPosition;\n          }\n      ',fragmentShader:"\n        void main() {\n          gl_FragColor = vec4(0.0, 0.0, 0.0, 0.0);\n        }\n      "})),[w]);return c.createElement("group",a.default({},I,{ref:Z}),E&&!ee&&c.createElement("mesh",{castShadow:S,receiveShadow:$,ref:X},z||c.createElement("planeGeometry",null),j||c.createElement("shaderMaterial",{side:n.DoubleSide,vertexShader:oe.vertexShader,fragmentShader:oe.fragmentShader})))}));exports.Html=M;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@babel/runtime/helpers/extends"),t=require("react"),r=require("react-dom/client"),n=require("three"),o=require("@react-three/fiber");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 a=i(e),c=s(t),l=s(r);const u=new n.Vector3,d=new n.Vector3,m=new n.Vector3,f=new n.Vector2;function h(e,t,r){const n=u.setFromMatrixPosition(e.matrixWorld);n.project(t);const o=r.width/2,i=r.height/2;return[n.x*o+o,-n.y*i+i]}const p=e=>Math.abs(e)<1e-10?0:e;function x(e,t,r=""){let n="matrix3d(";for(let r=0;16!==r;r++)n+=p(t[r]*e.elements[r])+(15!==r?",":")");return r+n}const v=(y=[1,-1,1,1,1,-1,1,1,1,-1,1,1,1,-1,1,1],e=>x(e,y));var y;const g=(e,t)=>{return x(e,[1/(r=t),1/r,1/r,1,-1/r,-1/r,-1/r,-1,1/r,1/r,1/r,1,1,1,1,1],"translate(-50%,-50%)");var r};const M=c.forwardRef((({children:e,eps:t=.001,style:r,className:i,prepend:s,center:x,fullscreen:y,portal:M,distanceFactor:b,sprite:P=!1,transform:w=!1,occlude:E,onOcclude:W,castShadow:S,receiveShadow:$,material:j,geometry:z,zIndexRange:O=[16777271,0],calculatePosition:R=h,as:F="div",wrapperClass:C,pointerEvents:T="auto",...I},A)=>{const{gl:k,camera:H,scene:N,size:V,raycaster:_,events:q,viewport:L}=o.useThree(),[D]=c.useState((()=>document.createElement(F))),G=c.useRef(null),Z=c.useRef(null),B=c.useRef(0),J=c.useRef([0,0]),K=c.useRef(null),Q=c.useRef(null),U=(null==M?void 0:M.current)||q.connected||k.domElement.parentNode,X=c.useRef(null),Y=c.useRef(!1),ee=c.useMemo((()=>E&&"blending"!==E||Array.isArray(E)&&E.length&&function(e){return e&&"object"==typeof e&&"current"in e}(E[0])),[E]);c.useLayoutEffect((()=>{const e=k.domElement;E&&"blending"===E?(e.style.zIndex=`${Math.floor(O[0]/2)}`,e.style.position="absolute",e.style.pointerEvents="none"):(e.style.zIndex=null,e.style.position=null,e.style.pointerEvents=null)}),[E]),c.useLayoutEffect((()=>{if(Z.current){const e=G.current=l.createRoot(D);if(N.updateMatrixWorld(),w)D.style.cssText="position:absolute;top:0;left:0;pointer-events:none;overflow:hidden;";else{const e=R(Z.current,H,V);D.style.cssText=`position:absolute;top:0;left:0;transform:translate3d(${e[0]}px,${e[1]}px,0);transform-origin:0 0;`}return U&&(s?U.prepend(D):U.appendChild(D)),()=>{U&&U.removeChild(D),e.unmount()}}}),[U,w]),c.useLayoutEffect((()=>{C&&(D.className=C)}),[C]);const te=c.useMemo((()=>w?{position:"absolute",top:0,left:0,width:V.width,height:V.height,transformStyle:"preserve-3d",pointerEvents:"none"}:{position:"absolute",transform:x?"translate3d(-50%,-50%,0)":"none",...y&&{top:-V.height/2,left:-V.width/2,width:V.width,height:V.height},...r}),[r,x,y,V,w]),re=c.useMemo((()=>({position:"absolute",pointerEvents:T})),[T]);c.useLayoutEffect((()=>{var t,n;(Y.current=!1,w)?null==(t=G.current)||t.render(c.createElement("div",{ref:K,style:te},c.createElement("div",{ref:Q,style:re},c.createElement("div",{ref:A,className:i,style:r,children:e})))):null==(n=G.current)||n.render(c.createElement("div",{ref:A,style:te,className:i,children:e}))}));const ne=c.useRef(!0);o.useFrame((e=>{if(Z.current){H.updateMatrixWorld(),Z.current.updateWorldMatrix(!0,!1);const e=w?J.current:R(Z.current,H,V);if(w||Math.abs(B.current-H.zoom)>t||Math.abs(J.current[0]-e[0])>t||Math.abs(J.current[1]-e[1])>t){const t=function(e,t){const r=u.setFromMatrixPosition(e.matrixWorld),n=d.setFromMatrixPosition(t.matrixWorld),o=r.sub(n),i=t.getWorldDirection(m);return o.angleTo(i)>Math.PI/2}(Z.current,H);let r=!1;ee&&(Array.isArray(E)?r=E.map((e=>e.current)):"blending"!==E&&(r=[N]));const o=ne.current;if(r){const e=function(e,t,r,n){const o=u.setFromMatrixPosition(e.matrixWorld),i=o.clone();i.project(t),f.set(i.x,i.y),r.setFromCamera(f,t);const s=r.intersectObjects(n,!0);if(s.length){const e=s[0].distance;return o.distanceTo(r.ray.origin)<e}return!0}(Z.current,H,_,r);ne.current=e&&!t}else ne.current=!t;o!==ne.current&&(W?W(!ne.current):D.style.display=ne.current?"block":"none");const i=Math.floor(O[0]/2),s=E?ee?[O[0],i]:[i-1,0]:O;if(D.style.zIndex=`${function(e,t,r){if(t instanceof n.PerspectiveCamera||t instanceof n.OrthographicCamera){const n=u.setFromMatrixPosition(e.matrixWorld),o=d.setFromMatrixPosition(t.matrixWorld),i=n.distanceTo(o),s=(r[1]-r[0])/(t.far-t.near),a=r[1]-s*t.far;return Math.round(s*i+a)}}(Z.current,H,s)}`,w){const[e,t]=[V.width/2,V.height/2],r=H.projectionMatrix.elements[5]*t,{isOrthographicCamera:n,top:o,left:i,bottom:s,right:a}=H,c=v(H.matrixWorldInverse),l=n?`scale(${r})translate(${p(-(a+i)/2)}px,${p((o+s)/2)}px)`:`translateZ(${r}px)`;let u=Z.current.matrixWorld;P&&(u=H.matrixWorldInverse.clone().transpose().copyPosition(u).scale(Z.current.scale),u.elements[3]=u.elements[7]=u.elements[11]=0,u.elements[15]=1),D.style.width=V.width+"px",D.style.height=V.height+"px",D.style.perspective=n?"":`${r}px`,K.current&&Q.current&&(K.current.style.transform=`${l}${c}translate(${e}px,${t}px)`,Q.current.style.transform=g(u,1/((b||10)/400)))}else{const t=void 0===b?1:function(e,t){if(t instanceof n.OrthographicCamera)return t.zoom;if(t instanceof n.PerspectiveCamera){const r=u.setFromMatrixPosition(e.matrixWorld),n=d.setFromMatrixPosition(t.matrixWorld),o=t.fov*Math.PI/180,i=r.distanceTo(n);return 1/(2*Math.tan(o/2)*i)}return 1}(Z.current,H)*b;D.style.transform=`translate3d(${e[0]}px,${e[1]}px,0) scale(${t})`}J.current=e,B.current=H.zoom}}if(!ee&&X.current&&!Y.current)if(w){if(K.current){const e=K.current.children[0];if(null!=e&&e.clientWidth&&null!=e&&e.clientHeight){const{isOrthographicCamera:t}=H;if(t||z)I.scale&&(Array.isArray(I.scale)?I.scale instanceof n.Vector3?X.current.scale.copy(I.scale.clone().divideScalar(1)):X.current.scale.set(1/I.scale[0],1/I.scale[1],1/I.scale[2]):X.current.scale.setScalar(1/I.scale));else{const t=(b||10)/400,r=e.clientWidth*t,n=e.clientHeight*t;X.current.scale.set(r,n,1)}Y.current=!0}}}else{const t=D.children[0];if(null!=t&&t.clientWidth&&null!=t&&t.clientHeight){const e=1/L.factor,r=t.clientWidth*e,n=t.clientHeight*e;X.current.scale.set(r,n,1),Y.current=!0}X.current.lookAt(e.camera.position)}}));const oe=c.useMemo((()=>({vertexShader:w?void 0:'\n          /*\n            This shader is from the THREE\'s SpriteMaterial.\n            We need to turn the backing plane into a Sprite\n            (make it always face the camera) if "transfrom"\n            is false.\n          */\n          #include <common>\n\n          void main() {\n            vec2 center = vec2(0., 1.);\n            float rotation = 0.0;\n\n            // This is somewhat arbitrary, but it seems to work well\n            // Need to figure out how to derive this dynamically if it even matters\n            float size = 0.03;\n\n            vec4 mvPosition = modelViewMatrix * vec4( 0.0, 0.0, 0.0, 1.0 );\n            vec2 scale;\n            scale.x = length( vec3( modelMatrix[ 0 ].x, modelMatrix[ 0 ].y, modelMatrix[ 0 ].z ) );\n            scale.y = length( vec3( modelMatrix[ 1 ].x, modelMatrix[ 1 ].y, modelMatrix[ 1 ].z ) );\n\n            bool isPerspective = isPerspectiveMatrix( projectionMatrix );\n            if ( isPerspective ) scale *= - mvPosition.z;\n\n            vec2 alignedPosition = ( position.xy - ( center - vec2( 0.5 ) ) ) * scale * size;\n            vec2 rotatedPosition;\n            rotatedPosition.x = cos( rotation ) * alignedPosition.x - sin( rotation ) * alignedPosition.y;\n            rotatedPosition.y = sin( rotation ) * alignedPosition.x + cos( rotation ) * alignedPosition.y;\n            mvPosition.xy += rotatedPosition;\n\n            gl_Position = projectionMatrix * mvPosition;\n          }\n      ',fragmentShader:"\n        void main() {\n          gl_FragColor = vec4(0.0, 0.0, 0.0, 0.0);\n        }\n      "})),[w]);return c.createElement("group",a.default({},I,{ref:Z}),E&&!ee&&c.createElement("mesh",{castShadow:S,receiveShadow:$,ref:X},z||c.createElement("planeGeometry",null),j||c.createElement("shaderMaterial",{side:n.DoubleSide,vertexShader:oe.vertexShader,fragmentShader:oe.fragmentShader})))}));exports.Html=M;

package/web/Html.d.ts

@@ -1,7 +1,7 @@
 import * as React from 'react';
-import { Group, Object3D, Camera } from 'three';
+import { Object3D, Camera } from 'three';
 import { Assign } from 'utility-types';
-import { ReactThreeFiber } from '@react-three/fiber';
+import { ThreeElements } from '@react-three/fiber';
 import { ForwardRefComponent } from '../helpers/ts-utils';
 declare function defaultCalculatePosition(el: Object3D, camera: Camera, size: {
     width: number;
@@ -9,12 +9,12 @@ declare function defaultCalculatePosition(el: Object3D, camera: Camera, size: {
 }): number[];
 export type CalculatePosition = typeof defaultCalculatePosition;
 type PointerEventsProperties = 'auto' | 'none' | 'visiblePainted' | 'visibleFill' | 'visibleStroke' | 'visible' | 'painted' | 'fill' | 'stroke' | 'all' | 'inherit';
-export interface HtmlProps extends Omit<Assign<React.HTMLAttributes<HTMLDivElement>, ReactThreeFiber.Object3DNode<Group, typeof Group>>, 'ref'> {
+export interface HtmlProps extends Omit<Assign<React.HTMLAttributes<HTMLDivElement>, ThreeElements['group']>, 'ref'> {
     prepend?: boolean;
     center?: boolean;
     fullscreen?: boolean;
     eps?: number;
-    portal?: React.MutableRefObject<HTMLElement>;
+    portal?: React.RefObject<HTMLElement>;
     distanceFactor?: number;
     sprite?: boolean;
     transform?: boolean;

package/web/Html.js

@@ -113,7 +113,7 @@ const Html = /* @__PURE__ */React.forwardRef(({
     viewport
   } = useThree();
   const [el] = React.useState(() => document.createElement(as));
-  const root = React.useRef();
+  const root = React.useRef(null);
   const group = React.useRef(null);
   const oldZoom = React.useRef(0);
   const oldPosition = React.useRef([0, 0]);

package/web/KeyboardControls.d.ts

@@ -21,7 +21,7 @@ export type KeyboardControlsEntry<T extends string = string> = {
     keys: string[];
     up?: boolean;
 };
-type KeyboardControlsProps = {
+export type KeyboardControlsProps = {
     map: KeyboardControlsEntry[];
     children: React.ReactNode;
     onChange?: (name: string, pressed: boolean, state: KeyboardControlsState) => void;

package/web/PresentationControls.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@babel/runtime/helpers/extends"),t=require("react"),r=require("three"),o=require("@react-three/fiber"),n=require("@react-spring/three"),a=require("@use-gesture/react");function s(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}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 o=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(t,r,o.get?o:{enumerable:!0,get:function(){return e[r]}})}})),t.default=e,Object.freeze(t)}var i=s(e),c=u(t);exports.PresentationControls=function({enabled:e=!0,snap:t,global:s,domElement:u,cursor:l=!0,children:f,speed:d=1,rotation:m=[0,0,0],zoom:g=1,polar:h=[0,Math.PI/2],azimuth:b=[-1/0,1/0],config:p={mass:1,tension:170,friction:26}}){const y=o.useThree((e=>e.events)),M=o.useThree((e=>e.gl)),v=u||y.connected||M.domElement,{size:E}=o.useThree(),j=c.useMemo((()=>[m[0]+h[0],m[0]+h[1]]),[m[0],h[0],h[1]]),O=c.useMemo((()=>[m[1]+b[0],m[1]+b[1]]),[m[1],b[0],b[1]]),P=c.useMemo((()=>[r.MathUtils.clamp(m[0],...j),r.MathUtils.clamp(m[1],...O),m[2]]),[m[0],m[1],m[2],j,O]),[q,z]=n.useSpring((()=>({scale:1,rotation:P,config:p})));c.useEffect((()=>{z.start({scale:1,rotation:P,config:p})}),[P]),c.useEffect((()=>{if(s&&l&&e)return v.style.cursor="grab",M.domElement.style.cursor="",()=>{v.style.cursor="default",M.domElement.style.cursor="default"}}),[s,l,v,e]);const U=a.useGesture({onHover:({last:t})=>{l&&!s&&e&&(v.style.cursor=t?"auto":"grab")},onDrag:({down:o,delta:[n,a],memo:[s,u]=q.rotation.animation.to||P})=>{if(!e)return[a,n];l&&(v.style.cursor=o?"grabbing":"grab"),n=r.MathUtils.clamp(u+n/E.width*Math.PI*d,...O),a=r.MathUtils.clamp(s+a/E.height*Math.PI*d,...j);const i=t&&!o&&"boolean"!=typeof t?t:p;return z.start({scale:o&&a>j[1]/2?g:1,rotation:t&&!o?P:[a,n,0],config:e=>"scale"===e?{...i,friction:3*i.friction}:i}),[a,n]}},{target:s?v:void 0});return c.createElement(n.a.group,i.default({},null==U?void 0:U(),q),f)};
+"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("@use-gesture/react"),n=require("maath");function u(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 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 l=u(e),i=s(t);exports.PresentationControls=function({enabled:e=!0,snap:t,global:u,domElement:s,cursor:c=!0,children:d,speed:m=1,rotation:f=[0,0,0],zoom:p=1,polar:g=[0,Math.PI/2],azimuth:h=[-1/0,1/0],damping:b=.25}){const y=a.useThree((e=>e.events)),M=a.useThree((e=>e.gl)),v=s||y.connected||M.domElement,{size:E}=a.useThree(),j=i.useMemo((()=>[f[0]+g[0],f[0]+g[1]]),[f[0],g[0],g[1]]),O=i.useMemo((()=>[f[1]+h[0],f[1]+h[1]]),[f[1],h[0],h[1]]),P=i.useMemo((()=>[r.MathUtils.clamp(f[0],...j),r.MathUtils.clamp(f[1],...O),f[2]]),[f[0],f[1],f[2],j,O]);i.useEffect((()=>{if(u&&c&&e)return v.style.cursor="grab",M.domElement.style.cursor="",()=>{v.style.cursor="default",M.domElement.style.cursor="default"}}),[u,c,v,e]);const[q]=i.useState({scale:1,rotation:P,damping:b}),z=i.useRef(null);a.useFrame(((e,t)=>{n.easing.damp3(z.current.scale,q.scale,q.damping,t),n.easing.dampE(z.current.rotation,q.rotation,q.damping,t)}));const U=o.useGesture({onHover:({last:t})=>{c&&!u&&e&&(v.style.cursor=t?"auto":"grab")},onDrag:({down:a,delta:[o,n],memo:[u,s]=q.rotation||P})=>e?(c&&(v.style.cursor=a?"grabbing":"grab"),o=r.MathUtils.clamp(s+o/E.width*Math.PI*m,...O),n=r.MathUtils.clamp(u+n/E.height*Math.PI*m,...j),q.scale=a&&n>j[1]/2?p:1,q.rotation=t&&!a?P:[n,o,0],q.damping=t&&!a&&"boolean"!=typeof t?t:b,[n,o]):[n,o]},{target:u?v:void 0});return i.createElement("group",l.default({ref:z},null==U?void 0:U()),d)};

package/web/PresentationControls.d.ts

@@ -1,7 +1,6 @@
 import * as React from 'react';
-import { SpringConfig } from '@react-spring/three';
 export type PresentationControlProps = {
-    snap?: Boolean | SpringConfig;
+    snap?: Boolean | number;
     global?: boolean;
     cursor?: boolean;
     speed?: number;
@@ -9,9 +8,9 @@ export type PresentationControlProps = {
     rotation?: [number, number, number];
     polar?: [number, number];
     azimuth?: [number, number];
-    config?: any;
+    damping?: number;
     enabled?: boolean;
     children?: React.ReactNode;
     domElement?: HTMLElement;
 };
-export declare function PresentationControls({ enabled, snap, global, domElement, cursor, children, speed, rotation, zoom, polar, azimuth, config, }: PresentationControlProps): React.JSX.Element;
+export declare function PresentationControls({ enabled, snap, global, domElement, cursor, children, speed, rotation, zoom, polar, azimuth, damping, }: PresentationControlProps): React.JSX.Element;

package/web/PresentationControls.js

@@ -1,9 +1,9 @@
 import _extends from '@babel/runtime/helpers/esm/extends';
 import * as React from 'react';
 import { MathUtils } from 'three';
-import { useThree } from '@react-three/fiber';
-import { useSpring, a } from '@react-spring/three';
+import { useThree, useFrame } from '@react-three/fiber';
 import { useGesture } from '@use-gesture/react';
+import { easing } from 'maath';
 
 function PresentationControls({
   enabled = true,
@@ -17,11 +17,7 @@ function PresentationControls({
   zoom = 1,
   polar = [0, Math.PI / 2],
   azimuth = [-Infinity, Infinity],
-  config = {
-    mass: 1,
-    tension: 170,
-    friction: 26
-  }
+  damping = 0.25
 }) {
   const events = useThree(state => state.events);
   const gl = useThree(state => state.gl);
@@ -32,16 +28,6 @@ function PresentationControls({
   const rPolar = React.useMemo(() => [rotation[0] + polar[0], rotation[0] + polar[1]], [rotation[0], polar[0], polar[1]]);
   const rAzimuth = React.useMemo(() => [rotation[1] + azimuth[0], rotation[1] + azimuth[1]], [rotation[1], azimuth[0], azimuth[1]]);
   const rInitial = React.useMemo(() => [MathUtils.clamp(rotation[0], ...rPolar), MathUtils.clamp(rotation[1], ...rAzimuth), rotation[2]], [rotation[0], rotation[1], rotation[2], rPolar, rAzimuth]);
-  const [spring, api] = useSpring(() => ({
-    scale: 1,
-    rotation: rInitial,
-    config
-  }));
-  React.useEffect(() => void api.start({
-    scale: 1,
-    rotation: rInitial,
-    config
-  }), [rInitial]);
   React.useEffect(() => {
     if (global && cursor && enabled) {
       explDomElement.style.cursor = 'grab';
@@ -52,6 +38,16 @@ function PresentationControls({
       };
     }
   }, [global, cursor, explDomElement, enabled]);
+  const [animation] = React.useState({
+    scale: 1,
+    rotation: rInitial,
+    damping
+  });
+  const ref = React.useRef(null);
+  useFrame((state, delta) => {
+    easing.damp3(ref.current.scale, animation.scale, animation.damping, delta);
+    easing.dampE(ref.current.rotation, animation.rotation, animation.damping, delta);
+  });
   const bind = useGesture({
     onHover: ({
       last
@@ -61,27 +57,23 @@ function PresentationControls({
     onDrag: ({
       down,
       delta: [x, y],
-      memo: [oldY, oldX] = spring.rotation.animation.to || rInitial
+      memo: [oldY, oldX] = animation.rotation || rInitial
     }) => {
       if (!enabled) return [y, x];
       if (cursor) explDomElement.style.cursor = down ? 'grabbing' : 'grab';
       x = MathUtils.clamp(oldX + x / size.width * Math.PI * speed, ...rAzimuth);
       y = MathUtils.clamp(oldY + y / size.height * Math.PI * speed, ...rPolar);
-      const sConfig = snap && !down && typeof snap !== 'boolean' ? snap : config;
-      api.start({
-        scale: down && y > rPolar[1] / 2 ? zoom : 1,
-        rotation: snap && !down ? rInitial : [y, x, 0],
-        config: n => n === 'scale' ? {
-          ...sConfig,
-          friction: sConfig.friction * 3
-        } : sConfig
-      });
+      animation.scale = down && y > rPolar[1] / 2 ? zoom : 1;
+      animation.rotation = snap && !down ? rInitial : [y, x, 0];
+      animation.damping = snap && !down && typeof snap !== 'boolean' ? snap : damping;
       return [y, x];
     }
   }, {
     target: global ? explDomElement : undefined
   });
-  return /*#__PURE__*/React.createElement(a.group, _extends({}, bind == null ? void 0 : bind(), spring), children);
+  return /*#__PURE__*/React.createElement("group", _extends({
+    ref: ref
+  }, bind == null ? void 0 : bind()), children);
 }
 
 export { PresentationControls };

package/web/ScreenVideoTexture.js

@@ -4,8 +4,8 @@ import { forwardRef, useEffect } from 'react';
 import { suspend, clear } from 'suspend-react';
 import { VideoTexture } from '../core/VideoTexture.js';
 
-/**
- * Create a video texture from [`getDisplayMedia`](https://developer.mozilla.org/en-US/docs/Web/API/MediaDevices/getDisplayMedia)
+/**
+ * Create a video texture from [`getDisplayMedia`](https://developer.mozilla.org/en-US/docs/Web/API/MediaDevices/getDisplayMedia)
  */
 const ScreenVideoTexture = /* @__PURE__ */forwardRef(({
   options = {

package/web/ScrollControls.d.ts

@@ -40,6 +40,6 @@ interface ScrollPropsWithTrueHtml {
     html: true;
     style?: React.CSSProperties;
 }
-type ScrollProps = ScrollPropsWithFalseHtml | ScrollPropsWithTrueHtml;
+export type ScrollProps = ScrollPropsWithFalseHtml | ScrollPropsWithTrueHtml;
 export declare const Scroll: ForwardRefComponent<ScrollProps, THREE.Group & HTMLDivElement>;
 export {};

package/web/Select.d.ts

@@ -1,6 +1,7 @@
 import * as React from 'react';
 import * as THREE from 'three';
-type Props = JSX.IntrinsicElements['group'] & {
+import { ThreeElements } from '@react-three/fiber';
+export type SelectProps = Omit<ThreeElements['group'], 'ref'> & {
     multiple?: boolean;
     box?: boolean;
     border?: string;
@@ -9,6 +10,5 @@ type Props = JSX.IntrinsicElements['group'] & {
     onChangePointerUp?: (selected: THREE.Object3D[]) => void;
     filter?: (selected: THREE.Object3D[]) => THREE.Object3D[];
 };
-export declare function Select({ box, multiple, children, onChange, onChangePointerUp, border, backgroundColor, filter: customFilter, ...props }: Props): React.JSX.Element;
+export declare function Select({ box, multiple, children, onChange, onChangePointerUp, border, backgroundColor, filter: customFilter, ...props }: SelectProps): React.JSX.Element;
 export declare function useSelect(): THREE.Object3D[];
-export {};

package/web/Select.js

@@ -28,11 +28,15 @@ function Select({
     get
   } = useThree();
   const [hovered, hover] = React.useState(false);
-  const [active, dispatch] = React.useReducer((state, {
+  const [active, dispatch] = React.useReducer(
+  // @ts-expect-error
+  (state, {
     object,
     shift
   }) => {
-    if (object === undefined) return [];else if (Array.isArray(object)) return object;else if (!shift) return state[0] === object ? [] : [object];else if (state.includes(object)) return state.filter(o => o !== object);else return [object, ...state];
+    if (object === undefined) return [];else if (Array.isArray(object)) return object;else if (!shift) return state[0] === object ? [] : [object];
+    // @ts-expect-error
+    else if (state.includes(object)) return state.filter(o => o !== object);else return [object, ...state];
   }, []);
   React.useEffect(() => {
     if (downed) onChange == null || onChange(active);else onChangePointerUp == null || onChangePointerUp(active);

package/web/View.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@babel/runtime/helpers/extends"),t=require("react"),r=require("three"),n=require("@react-three/fiber"),c=require("tunnel-rat");function a(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function i(e){if(e&&e.__esModule)return e;var t=Object.create(null);return e&&Object.keys(e).forEach((function(r){if("default"!==r){var 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=a(e),s=i(t),l=i(r),u=a(c);const f=new l.Color,d=u.default();function m(e){return"top"in e}function h(e,t){const{right:r,top:n,left:c,bottom:a,width:i,height:o}=t,s=t.bottom<0||n>e.height||r<0||t.left>e.width;if(m(e)){const t=e.top+e.height-a;return{position:{width:i,height:o,left:c-e.left,top:n,bottom:t,right:r},isOffscreen:s}}return{position:{width:i,height:o,top:n,left:c,bottom:e.height-a,right:r},isOffscreen:s}}function g(e,{left:t,bottom:r,width:n,height:c}){let a;const i=n/c;var o;return(o=e.camera)&&o.isOrthographicCamera?e.camera.manual?e.camera.updateProjectionMatrix():e.camera.left===n/-2&&e.camera.right===n/2&&e.camera.top===c/2&&e.camera.bottom===c/-2||(Object.assign(e.camera,{left:n/-2,right:n/2,top:c/2,bottom:c/-2}),e.camera.updateProjectionMatrix()):e.camera.aspect!==i&&(e.camera.aspect=i,e.camera.updateProjectionMatrix()),a=e.gl.autoClear,e.gl.autoClear=!1,e.gl.setViewport(t,r,n,c),e.gl.setScissor(t,r,n,c),e.gl.setScissorTest(!0),a}function p(e,t){e.gl.setScissorTest(!1),e.gl.autoClear=t}function v(e){e.gl.getClearColor(f),e.gl.setClearColor(f,e.gl.getClearAlpha()),e.gl.clear(!0,!0)}function b({visible:e=!0,canvasSize:t,scene:r,index:c,children:a,frames:i,rect:o,track:l}){const u=n.useThree(),[f,d]=s.useState(!1);let b=0;return n.useFrame((n=>{var c;(i===1/0||b<=i)&&(l&&(o.current=null==(c=l.current)?void 0:c.getBoundingClientRect()),b++);if(o.current){const{position:c,isOffscreen:i}=h(t,o.current);if(f!==i&&d(i),e&&!f&&o.current){const e=g(n,c);n.gl.render(a?n.scene:r,n.camera),p(n,e)}}}),c),s.useLayoutEffect((()=>{const r=o.current;if(r&&(!e||!f)){const{position:e}=h(t,r),n=g(u,e);v(u),p(u,n)}}),[e,f]),s.useEffect((()=>{if(!l)return;const e=o.current,r=u.get().events.connected;return u.setEvents({connected:l.current}),()=>{if(e){const{position:r}=h(t,e),n=g(u,r);v(u),p(u,n)}u.setEvents({connected:r})}}),[l]),s.useEffect((()=>{m(t)||console.warn("Detected @react-three/fiber canvas size does not include position information. <View /> may not work as expected. Upgrade to @react-three/fiber ^8.1.0 for support.\n See https://github.com/pmndrs/drei/issues/944")}),[]),s.createElement(s.Fragment,null,a,s.createElement("group",{onPointerOver:()=>null}))}const w=s.forwardRef((({track:e,visible:t=!0,index:r=1,id:c,style:a,className:i,frames:u=1/0,children:f,...d},m)=>{var h,g,p,v;const w=s.useRef(null),{size:E,scene:C}=n.useThree(),[x]=s.useState((()=>new l.Scene)),[O,y]=s.useReducer((()=>!0),!1),j=s.useCallback(((t,r)=>{if(w.current&&e&&e.current&&t.target===e.current){const{width:e,height:n,left:c,top:a}=w.current,i=t.clientX-c,o=t.clientY-a;r.pointer.set(i/e*2-1,-o/n*2+1),r.raycaster.setFromCamera(r.pointer,r.camera)}}),[w,e]);return s.useEffect((()=>{var t;e&&(w.current=null==(t=e.current)?void 0:t.getBoundingClientRect()),y()}),[e]),s.createElement("group",o.default({ref:m},d),O&&n.createPortal(s.createElement(b,{visible:t,canvasSize:E,frames:u,scene:C,track:e,rect:w,index:r},f),x,{events:{compute:j,priority:r},size:{width:null==(h=w.current)?void 0:h.width,height:null==(g=w.current)?void 0:g.height,top:null==(p=w.current)?void 0:p.top,left:null==(v=w.current)?void 0:v.left}}))})),E=s.forwardRef((({as:e="div",id:t,visible:r,className:n,style:c,index:a=1,track:i,frames:l=1/0,children:u,...f},m)=>{const h=s.useId(),g=s.useRef(null);return s.useImperativeHandle(m,(()=>g.current)),s.createElement(s.Fragment,null,s.createElement(e,o.default({ref:g,id:t,className:n,style:c},f)),s.createElement(d.In,null,s.createElement(w,{visible:r,key:h,track:g,frames:l,index:a},u)))})),C=(()=>{const e=s.forwardRef(((e,t)=>s.useContext(n.context)?s.createElement(w,o.default({ref:t},e)):s.createElement(E,o.default({ref:t},e))));return e.Port=()=>s.createElement(d.Out,null),e})();exports.View=C;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@babel/runtime/helpers/extends"),t=require("react"),r=require("three"),n=require("@react-three/fiber"),c=require("tunnel-rat");function a(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function i(e){if(e&&e.__esModule)return e;var t=Object.create(null);return e&&Object.keys(e).forEach((function(r){if("default"!==r){var 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 l=a(e),o=i(t),u=i(r),s=a(c);const f=new u.Color,d=s.default();function m(e,t){const{right:r,top:n,left:c,bottom:a,width:i,height:l}=t,o=t.bottom<0||n>e.height||r<0||t.left>e.width,u=e.top+e.height-a;return{position:{width:i,height:l,left:c-e.left,top:n,bottom:u,right:r},isOffscreen:o}}function g(e,{left:t,bottom:r,width:n,height:c}){let a;const i=n/c;var l;return(l=e.camera)&&l.isOrthographicCamera?e.camera.manual?e.camera.updateProjectionMatrix():e.camera.left===n/-2&&e.camera.right===n/2&&e.camera.top===c/2&&e.camera.bottom===c/-2||(Object.assign(e.camera,{left:n/-2,right:n/2,top:c/2,bottom:c/-2}),e.camera.updateProjectionMatrix()):e.camera.aspect!==i&&(e.camera.aspect=i,e.camera.updateProjectionMatrix()),a=e.gl.autoClear,e.gl.autoClear=!1,e.gl.setViewport(t,r,n,c),e.gl.setScissor(t,r,n,c),e.gl.setScissorTest(!0),a}function h(e,t){e.gl.setScissorTest(!1),e.gl.autoClear=t}function p(e){e.gl.getClearColor(f),e.gl.setClearColor(f,e.gl.getClearAlpha()),e.gl.clear(!0,!0)}function v({visible:e=!0,canvasSize:t,scene:r,index:c,children:a,frames:i,rect:l,track:u}){const s=n.useThree(),[f,d]=o.useState(!1);let v=0;return n.useFrame((n=>{var c;(i===1/0||v<=i)&&(u&&(l.current=null==(c=u.current)?void 0:c.getBoundingClientRect()),v++);if(l.current){const{position:c,isOffscreen:i}=m(t,l.current);if(f!==i&&d(i),e&&!f&&l.current){const e=g(n,c);n.gl.render(a?n.scene:r,n.camera),h(n,e)}}}),c),o.useLayoutEffect((()=>{const r=l.current;if(r&&(!e||!f)){const{position:e}=m(t,r),n=g(s,e);p(s),h(s,n)}}),[e,f]),o.useEffect((()=>{if(!u)return;const e=l.current,r=s.get().events.connected;return s.setEvents({connected:u.current}),()=>{if(e){const{position:r}=m(t,e),n=g(s,r);p(s),h(s,n)}s.setEvents({connected:r})}}),[u]),o.createElement(o.Fragment,null,a,o.createElement("group",{onPointerOver:()=>null}))}const b=o.forwardRef((({track:e,visible:t=!0,index:r=1,id:c,style:a,className:i,frames:s=1/0,children:f,...d},m)=>{var g,h,p,b;const E=o.useRef(null),{size:w,scene:C}=n.useThree(),[x]=o.useState((()=>new u.Scene)),[O,y]=o.useReducer((()=>!0),!1),j=o.useCallback(((t,r)=>{if(E.current&&e&&e.current&&t.target===e.current){const{width:e,height:n,left:c,top:a}=E.current,i=t.clientX-c,l=t.clientY-a;r.pointer.set(i/e*2-1,-l/n*2+1),r.raycaster.setFromCamera(r.pointer,r.camera)}}),[E,e]);return o.useEffect((()=>{var t;e&&(E.current=null==(t=e.current)?void 0:t.getBoundingClientRect()),y()}),[e]),o.createElement("group",l.default({ref:m},d),O&&n.createPortal(o.createElement(v,{visible:t,canvasSize:w,frames:s,scene:C,track:e,rect:E,index:r},f),x,{events:{compute:j,priority:r},size:{width:null==(g=E.current)?void 0:g.width,height:null==(h=E.current)?void 0:h.height,top:null==(p=E.current)?void 0:p.top,left:null==(b=E.current)?void 0:b.left}}))})),E=o.forwardRef((({as:e="div",id:t,visible:r,className:n,style:c,index:a=1,track:i,frames:u=1/0,children:s,...f},m)=>{const g=o.useId(),h=o.useRef(null);return o.useImperativeHandle(m,(()=>h.current)),o.createElement(o.Fragment,null,o.createElement(e,l.default({ref:h,id:t,className:n,style:c},f)),o.createElement(d.In,null,o.createElement(b,{visible:r,key:g,track:h,frames:u,index:a},s)))})),w=(()=>{const e=o.forwardRef(((e,t)=>o.useContext(n.context)?o.createElement(b,l.default({ref:t},e)):o.createElement(E,l.default({ref:t},e))));return e.Port=()=>o.createElement(d.Out,null),e})();exports.View=w;

package/web/View.d.ts

@@ -1,12 +1,10 @@
 import * as React from 'react';
 import * as THREE from 'three';
-type LegacyCanvasSize = {
-    height: number;
-    width: number;
-};
-type CanvasSize = LegacyCanvasSize & {
+type CanvasSize = {
     top: number;
     left: number;
+    height: number;
+    width: number;
 };
 export type ContainerProps = {
     visible: boolean;
@@ -14,9 +12,9 @@ export type ContainerProps = {
     index: number;
     children?: React.ReactNode;
     frames: number;
-    rect: React.MutableRefObject<DOMRect>;
-    track?: React.MutableRefObject<HTMLElement>;
-    canvasSize: LegacyCanvasSize | CanvasSize;
+    rect: React.RefObject<DOMRect>;
+    track?: React.RefObject<HTMLElement>;
+    canvasSize: CanvasSize;
 };
 export type ViewProps = {
     as?: string;
@@ -27,10 +25,10 @@ export type ViewProps = {
     index?: number;
     frames?: number;
     children?: React.ReactNode;
-    track?: React.MutableRefObject<HTMLElement>;
+    track?: React.RefObject<HTMLElement>;
 };
 export type ViewportProps = {
-    Port: () => JSX.Element;
+    Port: () => React.JSX.Element;
 } & React.ForwardRefExoticComponent<ViewProps & React.RefAttributes<HTMLElement | THREE.Group>>;
 export declare const View: ViewportProps;
 export {};