@react-three/drei 9.121.3-canary-test01.1 → 10.0.0-rc.0

package/README.md

@@ -1,854 +1,852 @@
-canary-test01
-
-[![Storybook](https://img.shields.io/static/v1?message=Storybook&style=flat&colorA=000000&colorB=000000&label=&logo=storybook&logoColor=ffffff)](https://drei.pmnd.rs/)
-[![Version](https://img.shields.io/npm/v/@react-three/drei?style=flat&colorA=000000&colorB=000000)](https://www.npmjs.com/package/@react-three/drei)
-[![Downloads](https://img.shields.io/npm/dt/@react-three/drei.svg?style=flat&colorA=000000&colorB=000000)](https://www.npmjs.com/package/@react-three/drei)
-[![Discord Shield](https://img.shields.io/discord/740090768164651008?style=flat&colorA=000000&colorB=000000&label=discord&logo=discord&logoColor=ffffff)](https://discord.com/channels/740090768164651008/741751532592038022)
-[![Open in GitHub Codespaces](https://img.shields.io/static/v1?&message=Open%20in%20%20Codespaces&style=flat&colorA=000000&colorB=000000&label=GitHub&logo=github&logoColor=ffffff)](https://github.com/codespaces/new?template_repository=pmndrs%2Fdrei)
-
-[![logo](docs/logo.jpg)](https://codesandbox.io/s/bfplr)
-
-A growing collection of useful helpers and fully functional, ready-made abstractions for [@react-three/fiber](https://github.com/pmndrs/react-three-fiber).
-
-If you make a component that is generic enough to be useful to others, think about [CONTRIBUTING](CONTRIBUTING.md)!
-
-```bash
-npm install @react-three/drei
-```
-
-> [!IMPORTANT]
-> this package is using the stand-alone [`three-stdlib`](https://github.com/pmndrs/three-stdlib) instead of [`three/examples/jsm`](https://github.com/mrdoob/three.js/tree/master/examples/jsm).
-
-## Basic usage
-
-```jsx
-import { PerspectiveCamera, PositionalAudio, ... } from '@react-three/drei'
-```
-
-## React-native
-
-```jsx
-import { PerspectiveCamera, PositionalAudio, ... } from '@react-three/drei/native'
-```
-
-The `native` route of the library **does not** export `Html` or `Loader`. The default export of the library is `web` which **does** export `Html` and `Loader`.
-
-## Documentation
-
-https://pmndrs.github.io/drei
-
-<details>
-  <summary>Old doc</summary>
-
-> [!WARNING]
-> Below is an archive of the anchors links with their new respective locations to the documentation website.
-> Do not update the links below, they are for reference only.
-
-<!-- <table>
-  <tr>
-    <td valign="top">
-      <ul>
-        <li><a href="#cameras">Cameras</a></li>
-        <ul>
-          <li><a href="#perspectivecamera">PerspectiveCamera</a></li>
-          <li><a href="#orthographiccamera">OrthographicCamera</a></li>
-          <li><a href="#cubecamera">CubeCamera</a></li>
-        </ul>
-        <li><a href="#controls">Controls</a></li>
-        <ul>
-          <li><a href="#cameracontrols">CameraControls</a></li>
-          <li><a href="#controls">FlyControls</a></li>
-          <li><a href="#controls">MapControls</a></li>
-          <li><a href="#controls">DeviceOrientationControls</a></li>
-          <li><a href="#controls">TrackballControls</a></li>
-          <li><a href="#controls">ArcballControls</a></li>
-          <li><a href="#controls">PointerLockControls</a></li>
-          <li><a href="#controls">FirstPersonControls</a></li>
-          <li><a href="#scrollcontrols">ScrollControls</a></li>
-          <li><a href="#presentationcontrols">PresentationControls</a></li>
-          <li><a href="#keyboardcontrols">KeyboardControls</a></li>
-          <li><a href="#FaceControls">FaceControls</a></li>
-          <li><a href="#motionpathcontrols">MotionPathControls</a></li>
-        </ul>
-        <li><a href="#gizmos">Gizmos</a></li>
-        <ul>
-          <li><a href="#gizmohelper">GizmoHelper</a></li>
-          <li><a href="#pivotcontrols">PivotControls</a></li>
-          <li><a href="#dragcontrols">DragControls</a></li>
-          <li><a href="#transformcontrols">TransformControls</a></li>
-          <li><a href="#grid">Grid</a></li>
-          <li><a href="#helper--usehelper">Helper / useHelper</a></li>
-          <li><a href="#helper">Helper</a></li>
-        </ul>
-        <li><a href="#abstractions">Abstractions</a></li>
-        <ul>
-          <li><a href="#image">Image</a></li>
-          <li><a href="#text">Text</a></li>
-          <li><a href="#text3d">Text3D</a></li>
-          <li><a href="#positionalaudio">PositionalAudio</a></li>
-          <li><a href="#billboard">Billboard</a></li>
-          <li><a href="#screenspace">ScreenSpace</a></li>
-          <li><a href="#screensizer">ScreenSizer</a></li>
-          <li><a href="#effects">Effects</a></li>
-          <li><a href="#gradienttexture">GradientTexture</a></li>
-          <li><a href="#edges">Edges</a></li>
-          <li><a href="#outlines">Outlines</a></li>
-          <li><a href="#trail">Trail</a></li>
-          <li><a href="#sampler">Sampler</a></li>
-          <li><a href="#computedattribute">ComputedAttribute</a></li>
-          <li><a href="#clone">Clone</a></li>
-          <li><a href="#useanimations">useAnimations</a></li>
-          <li><a href="#marchingcubes">MarchingCubes</a></li>
-          <li><a href="#decal">Decal</a></li>
-          <li><a href="#svg">Svg</a></li>
-          <li><a href="#gltf">Gltf</a></li>
-          <li><a href="#asciirenderer">AsciiRenderer</a></li>
-          <li><a href="#splat">Splat</a></li>
-        </ul>
-        <li><a href="#shaders">Shaders</a></li>
-        <ul>
-          <li><a href="#meshreflectormaterial">MeshReflectorMaterial</a></li>
-          <li><a href="#meshwobblematerial">MeshWobbleMaterial</a></li>
-          <li><a href="#meshdistortmaterial">MeshDistortMaterial</a></li>
-          <li><a href="#meshrefractionmaterial">MeshRefractionMaterial</a></li>
-          <li><a href="#meshtransmissionmaterial">MeshTransmissionMaterial</a></li>
-          <li><a href="#meshdiscardmaterial">MeshDiscardMaterial</a></li>
-          <li><a href="#pointmaterial">PointMaterial</a></li>
-          <li><a href="#softshadows">SoftShadows</a></li>
-          <li><a href="#shadermaterial">shaderMaterial</a></li>
-        </ul>
-      </ul>
-    </td>
-    <td valign="top">
-      <ul>
-        <li><a href="#misc">Misc</a></li>
-        <ul>
-          <li><a href="#example">Example</a></li>
-          <li><a href="#html">Html</a></li>
-          <li><a href="#cycleraycast">CycleRaycast</a></li>
-          <li><a href="#select">Select</a></li>
-          <li><a href="#sprite-animator">Sprite Animator</a></li>
-          <li><a href="#stats">Stats</a></li>
-          <li><a href="#stats-gl">StatsGl</a></li>
-          <li><a href="#wireframe">Wireframe</a></li>
-          <li><a href="#usedepthbuffer">useDepthBuffer</a></li>
-          <li><a href="#usecontextbridge">useContextBridge</a></li>
-          <li><a href="#fbo--usefbo">Fbo / useFBO</a></li>
-          <li><a href="#usecamera">useCamera</a></li>
-          <li><a href="#cubecamera--usecubecamera">CubeCamera / useCubeCamera</a></li>
-          <li><a href="#detectgpu--usedetectgpu">DetectGPU / useDetectGPU</a></li>
-          <li><a href="#useaspect">useAspect</a></li>
-          <li><a href="#usecursor">useCursor</a></li>
-          <li><a href="#useintersect">useIntersect</a></li>
-          <li><a href="#useboxprojectedenv">useBoxProjectedEnv</a></li>
-          <li><a href="#trail--useTrail">Trail / useTrail</a></li>
-          <li><a href="#useSurfaceSampler">useSurfaceSampler</a></li>
-          <li><a href="#facelandmarker">FaceLandmarker</a></li>
-        </ul>
-        <li><a href="#loading">Loaders</a></li>
-        <ul>
-          <li><a href="#loader">Loader</a></li>
-          <li><a href="#progress--useprogress">Progress / useProgress</a></li>
-          <li><a href="#gltf--usegltf">Gltf / useGLTF</a></li>
-          <li><a href="#fbx--usefbx">FBX / useFBX</a></li>
-          <li><a href="#texture--usetexture">Texture / useTexture</a></li>
-          <li><a href="#ktx2--usektx2">Ktx2 / useKTX2</a></li>
-          <li><a href="#cubetexture--usecubetexture">CubeTexture / useCubeTexture</a></li>
-          <li><a href="#videotexture--usevideotexture">VideoTexture / useVideoTexture</a></li>
-          <li><a href="#trailtexture--usetrailtexture">TrailTexture / useTrailTexture</a></li>
-          <li><a href="#usefont">useFont</a></li>
-          <li><a href="#usespriteloader">useSpriteLoader</a></li>
-        </ul>
-        <li><a href="#performance">Performance</a></li>
-        <ul>
-          <li><a href="#instances">Instances</a></li>
-          <li><a href="#merged">Merged</a></li>
-          <li><a href="#points">Points</a></li>
-          <li><a href="#segments">Segments</a></li>
-          <li><a href="#detailed">Detailed</a></li>
-          <li><a href="#preload">Preload</a></li>
-          <li><a href="#bakeshadows">BakeShadows</a></li>
-          <li><a href="#meshbounds">meshBounds</a></li>
-          <li><a href="#adaptivedpr">AdaptiveDpr</a></li>
-          <li><a href="#adaptiveevents">AdaptiveEvents</a></li>
-          <li><a href="#bvh">Bvh</a></li>
-          <li><a href="#performancemonitor">PerformanceMonitor</a></li>
-        </ul>
-        <li><a href="#portals">Portals</a></li>
-        <ul>
-          <li><a href="#hud">Hud</a></li>
-          <li><a href="#view">View</a></li>
-          <li><a href="#rendertexture">RenderTexture</a></li>
-          <li><a href="#rendercubetexture">RenderCubeTexture</a></li>
-          <li><a href="#fisheye">Fisheye</a></li>
-          <li><a href="#mask">Mask</a></li>
-          <li><a href="#meshportalmaterial">MeshPortalMaterial</a></li>
-        </ul>
-        <li><a href="#modifiers">Modifiers</a></li>
-        <ul>
-          <li><a href="#curvemodifier">CurveModifier</a></li>
-        </ul>
-      </ul>
-    </td>
-    <td valign="top">
-      <ul>
-        <li><a href="#shapes">Shapes</a></li>
-        <ul>
-          <li><a href="#shapes">Plane</a></li>
-          <li><a href="#shapes">Box</a></li>
-          <li><a href="#shapes">Sphere</a></li>
-          <li><a href="#shapes">Circle</a></li>
-          <li><a href="#shapes">Cone</a></li>
-          <li><a href="#shapes">Cylinder</a></li>
-          <li><a href="#shapes">Tube</a></li>
-          <li><a href="#shapes">Torus</a></li>
-          <li><a href="#shapes">TorusKnot</a></li>
-          <li><a href="#shapes">Ring</a></li>
-          <li><a href="#shapes">Tetrahedron</a></li>
-          <li><a href="#shapes">Polyhedron</a></li>
-          <li><a href="#shapes">Icosahedron</a></li>
-          <li><a href="#shapes">Octahedron</a></li>
-          <li><a href="#shapes">Dodecahedron</a></li>
-          <li><a href="#shapes">Extrude</a></li>
-          <li><a href="#shapes">Lathe</a></li>
-          <li><a href="#shapes">Shape</a></li>
-          <li><a href="#roundedbox">RoundedBox</a></li>
-          <li><a href="#screenquad">Screenquad</a></li>
-          <li><a href="#line">Line</a></li>
-          <li><a href="#quadraticbezierline">QuadraticBezierLine</a></li>
-          <li><a href="#cubicbezierline">CubicBezierLine</a></li>
-          <li><a href="#catmullromline">CatmullRomLine</a></li>
-          <li><a href="#facemesh">Facemesh</a></li>
-        </ul>
-        <li><a href="#staging">Staging</a></li>
-        <ul>
-          <li><a href="#center">Center</a></li>
-          <li><a href="#resize">Resize</a></li>
-          <li><a href="#BBAnchor">BBAnchor</a></li>
-          <li><a href="#bounds">Bounds</a></li>
-          <li><a href="#camerashake">CameraShake</a></li>
-          <li><a href="#float">Float</a></li>
-          <li><a href="#stage">Stage</a></li>
-          <li><a href="#backdrop">Backdrop</a></li>
-          <li><a href="#environment">Environment</a></li>
-          <li><a href="#lightformer">Lightformer</a></li>
-          <li><a href="#spotlight">SpotLight</a></li>
-          <li><a href="#spotlightshadow">SpotLightShadow</a></li>
-          <li><a href="#shadow">Shadow</a></li>
-          <li><a href="#caustics">Caustics</a></li>
-          <li><a href="#contactshadows">ContactShadows</a></li>
-          <li><a href="#randomizedlight">RandomizedLight</a></li>
-          <li><a href="#accumulativeshadows">AccumulativeShadows</a></li>
-          <li><a href="#sky">Sky</a></li>
-          <li><a href="#stars">Stars</a></li>
-          <li><a href="#sparkles">Sparkles</a></li>
-          <li><a href="#cloud">Cloud</a></li>
-          <li><a href="#useenvironment">useEnvironment</a></li>
-          <li><a href="#matcaptexture--usematcaptexture">MatcapTexture / useMatcapTexture</a></li>
-          <li><a href="#normaltexture--usenormaltexture">NormalTexture / useNormalTexture</a></li>
-          <li><a href="#shadowalpha">ShadowAlpha</a></li>
-        </ul>
-      </ul>
-    </td>
-  </tr>
-</table> -->
-
-### Cameras
-
-#### PerspectiveCamera
-
-[Documentation has moved here](https://pmndrs.github.io/drei/cameras/perspective-camera)
-
-#### OrthographicCamera
-
-[Documentation has moved here](https://pmndrs.github.io/drei/cameras/orthographic-camera)
-
-#### CubeCamera
-
-[Documentation has moved here](https://pmndrs.github.io/drei/cameras/cube-camera)
-
-### Controls
-
-#### CameraControls
-
-[Documentation has moved here](https://pmndrs.github.io/drei/controls/camera-controls)
-
-#### ScrollControls
-
-[Documentation has moved here](https://pmndrs.github.io/drei/controls/scroll-controls)
-
-#### PresentationControls
-
-[Documentation has moved here](https://pmndrs.github.io/drei/controls/presentation-controls)
-
-#### KeyboardControls
-
-[Documentation has moved here](https://pmndrs.github.io/drei/controls/keyboard-controls)
-
-#### FaceControls
-
-[Documentation has moved here](https://pmndrs.github.io/drei/controls/face-controls)
-
-#### MotionPathControls
-
-[Documentation has moved here](https://pmndrs.github.io/drei/controls/motion-path-controls)
-
-### Gizmos
-
-#### GizmoHelper
-
-[Documentation has moved here](https://pmndrs.github.io/drei/gizmos/gizmo-helper)
-
-#### PivotControls
-
-[Documentation has moved here](https://pmndrs.github.io/drei/gizmos/pivot-controls)
-
-#### DragControls
-
-[Documentation has moved here](https://pmndrs.github.io/drei/gizmos/drag-controls)
-
-#### TransformControls
-
-[Documentation has moved here](https://pmndrs.github.io/drei/gizmos/transform-controls)
-
-#### Grid
-
-[Documentation has moved here](https://pmndrs.github.io/drei/gizmos/grid)
-
-#### Helper / useHelper
-
-[Documentation has moved here](https://pmndrs.github.io/drei/gizmos/helper-use-helper)
-
-### Shapes
-
-#### Plane, Box, Sphere, Circle, Cone, Cylinder, Tube, Torus, TorusKnot, Ring, Tetrahedron, Polyhedron, Icosahedron, Octahedron, Dodecahedron, Extrude, Lathe, Shape
-
-[Documentation has moved here](https://pmndrs.github.io/drei/shapes/mesh)
-
-#### RoundedBox
-
-[Documentation has moved here](https://pmndrs.github.io/drei/shapes/rounded-box)
-
-#### ScreenQuad
-
-[Documentation has moved here](https://pmndrs.github.io/drei/shapes/screen-quad)
-
-#### Line
-
-[Documentation has moved here](https://pmndrs.github.io/drei/shapes/line)
-
-#### QuadraticBezierLine
-
-[Documentation has moved here](https://pmndrs.github.io/drei/shapes/quadratic-bezier-line)
-
-#### CubicBezierLine
-
-[Documentation has moved here](https://pmndrs.github.io/drei/shapes/cubic-bezier-line)
-
-#### CatmullRomLine
-
-[Documentation has moved here](https://pmndrs.github.io/drei/shapes/catmull-rom-line)
-
-#### Facemesh
-
-[Documentation has moved here](https://pmndrs.github.io/drei/shapes/facemesh)
-
-### Abstractions
-
-#### Image
-
-[Documentation has moved here](https://pmndrs.github.io/drei/abstractions/image)
-
-#### Text
-
-[Documentation has moved here](https://pmndrs.github.io/drei/abstractions/text)
-
-#### Text3D
-
-[Documentation has moved here](https://pmndrs.github.io/drei/abstractions/text3d)
-
-#### Effects
-
-[Documentation has moved here](https://pmndrs.github.io/drei/abstractions/effects)
-
-#### PositionalAudio
-
-[Documentation has moved here](https://pmndrs.github.io/drei/abstractions/positional-audio)
-
-#### Billboard
-
-[Documentation has moved here](https://pmndrs.github.io/drei/abstractions/billboard)
-
-#### ScreenSpace
-
-[Documentation has moved here](https://pmndrs.github.io/drei/abstractions/screen-space)
-
-#### ScreenSizer
-
-[Documentation has moved here](https://pmndrs.github.io/drei/abstractions/screen-sizer)
-
-#### GradientTexture
-
-[Documentation has moved here](https://pmndrs.github.io/drei/abstractions/gradient-texture)
-
-#### Edges
-
-[Documentation has moved here](https://pmndrs.github.io/drei/abstractions/edges)
-
-#### Outlines
-
-[Documentation has moved here](https://pmndrs.github.io/drei/abstractions/outlines)
-
-#### Trail
-
-[Documentation has moved here](https://pmndrs.github.io/drei/abstractions/trail)
-
-#### Sampler
-
-[Documentation has moved here](https://pmndrs.github.io/drei/abstractions/sampler)
-
-#### ComputedAttribute
-
-[Documentation has moved here](https://pmndrs.github.io/drei/abstractions/computed-attribute)
-
-#### Clone
-
-[Documentation has moved here](https://pmndrs.github.io/drei/abstractions/clone)
-
-#### useAnimations
-
-[Documentation has moved here](https://pmndrs.github.io/drei/abstractions/use-animations)
-
-#### MarchingCubes
-
-[Documentation has moved here](https://pmndrs.github.io/drei/abstractions/marching-cubes)
-
-#### Decal
-
-[Documentation has moved here](https://pmndrs.github.io/drei/abstractions/decal)
-
-#### Svg
-
-[Documentation has moved here](https://pmndrs.github.io/drei/abstractions/svg)
-
-#### AsciiRenderer
-
-[Documentation has moved here](https://pmndrs.github.io/drei/abstractions/ascii-renderer)
-
-#### Splat
-
-[Documentation has moved here](https://pmndrs.github.io/drei/abstractions/splat)
-
-### Shaders
-
-#### MeshReflectorMaterial
-
-[Documentation has moved here](https://pmndrs.github.io/drei/shaders/mesh-reflector-material)
-
-#### MeshWobbleMaterial
-
-[Documentation has moved here](https://pmndrs.github.io/drei/shaders/mesh-wobble-material)
-
-#### MeshDistortMaterial
-
-[Documentation has moved here](https://pmndrs.github.io/drei/shaders/mesh-distort-material)
-
-#### MeshRefractionMaterial
-
-[Documentation has moved here](https://pmndrs.github.io/drei/shaders/mesh-refraction-material)
-
-#### MeshTransmissionMaterial
-
-[Documentation has moved here](https://pmndrs.github.io/drei/shaders/mesh-transmission-material)
-
-#### MeshDiscardMaterial
-
-[Documentation has moved here](https://pmndrs.github.io/drei/shaders/mesh-discard-material)
-
-#### PointMaterial
-
-[Documentation has moved here](https://pmndrs.github.io/drei/shaders/point-material)
-
-#### SoftShadows
-
-[Documentation has moved here](https://pmndrs.github.io/drei/shaders/soft-shadows)
-
-#### shaderMaterial
-
-[Documentation has moved here](https://pmndrs.github.io/drei/shaders/shader-material)
-
-### Modifiers
-
-#### CurveModifier
-
-[Documentation has moved here](https://pmndrs.github.io/drei/modifiers/curve-modifier)
-
-### Misc
-
-#### useContextBridge
-
-[Documentation has moved here](https://pmndrs.github.io/drei/misc/use-context-bridge)
-
-#### Example
-
-[Documentation has moved here](https://pmndrs.github.io/drei/misc/example)
-
-#### Html
-
-[Documentation has moved here](https://pmndrs.github.io/drei/misc/html)
-
-#### CycleRaycast
-
-[Documentation has moved here](https://pmndrs.github.io/drei/misc/cycle-raycast)
-
-#### Select
-
-[Documentation has moved here](https://pmndrs.github.io/drei/misc/select)
-
-#### Sprite Animator
-
-[Documentation has moved here](https://pmndrs.github.io/drei/misc/sprite-animator)
-
-#### Stats
-
-[Documentation has moved here](https://pmndrs.github.io/drei/misc/stats)
-
-#### StatsGl
-
-[Documentation has moved here](https://pmndrs.github.io/drei/misc/stats-gl)
-
-#### Wireframe
-
-[Documentation has moved here](https://pmndrs.github.io/drei/misc/wireframe)
-
-#### useDepthBuffer
-
-[Documentation has moved here](https://pmndrs.github.io/drei/misc/use-depth-buffer)
-
-#### Fbo / useFBO
-
-[Documentation has moved here](https://pmndrs.github.io/drei/misc/fbo-use-fbo)
-
-#### useCamera
-
-[Documentation has moved here](https://pmndrs.github.io/drei/misc/use-camera)
-
-#### CubeCamera / useCubeCamera
-
-[Documentation has moved here](https://pmndrs.github.io/drei/misc/cube-camera-use-cube-camera)
-
-#### DetectGPU / useDetectGPU
-
-[Documentation has moved here](https://pmndrs.github.io/drei/misc/detect-gpu-use-detect-gpu)
-
-#### useAspect
-
-[Documentation has moved here](https://pmndrs.github.io/drei/misc/use-aspect)
-
-#### useCursor
-
-[Documentation has moved here](https://pmndrs.github.io/drei/misc/use-cursor)
-
-#### useIntersect
-
-[Documentation has moved here](https://pmndrs.github.io/drei/misc/use-intersect)
-
-#### useBoxProjectedEnv
-
-[Documentation has moved here](https://pmndrs.github.io/drei/misc/use-box-projected-env)
-
-#### Trail / useTrail
-
-[Documentation has moved here](https://pmndrs.github.io/drei/misc/trail-use-trail)
-
-#### useSurfaceSampler
-
-[Documentation has moved here](https://pmndrs.github.io/drei/misc/use-surface-sampler)
-
-#### FaceLandmarker
-
-[Documentation has moved here](https://pmndrs.github.io/drei/misc/face-landmarker)
-
-### Loading
-
-#### Loader
-
-[Documentation has moved here](https://pmndrs.github.io/drei/loaders/loader)
-
-#### Progress / useProgress
-
-[Documentation has moved here](https://pmndrs.github.io/drei/loaders/progress-use-progress)
-
-#### Gltf / useGLTF
-
-[Documentation has moved here](https://pmndrs.github.io/drei/loaders/gltf-use-gltf)
-
-#### Fbx / useFBX
-
-[Documentation has moved here](https://pmndrs.github.io/drei/loaders/fbx-use-fbx)
-
-#### Texture / useTexture
-
-[Documentation has moved here](https://pmndrs.github.io/drei/loaders/texture-use-texture)
-
-#### Ktx2 / useKTX2
-
-[Documentation has moved here](https://pmndrs.github.io/drei/loaders/ktx2-use-ktx2)
-
-#### CubeTexture / useCubeTexture
-
-[Documentation has moved here](https://pmndrs.github.io/drei/loaders/cube-texture-use-cube-texture)
-
-#### VideoTexture / useVideoTexture
-
-[Documentation has moved here](https://pmndrs.github.io/drei/loaders/video-texture-use-video-texture)
-
-#### TrailTexture / useTrailTexture
-
-[Documentation has moved here](https://pmndrs.github.io/drei/loaders/trail-texture-use-trail-texture)
-
-#### useFont
-
-[Documentation has moved here](https://pmndrs.github.io/drei/loaders/use-font)
-
-#### useSpriteLoader
-
-[Documentation has moved here](https://pmndrs.github.io/drei/loaders/use-sprite-loader)
-
-### Performance
-
-#### Instances
-
-[Documentation has moved here](https://pmndrs.github.io/drei/performances/instances)
-
-#### Merged
-
-[Documentation has moved here](https://pmndrs.github.io/drei/performances/merged)
-
-#### Points
-
-[Documentation has moved here](https://pmndrs.github.io/drei/performances/points)
-
-#### Segments
-
-[Documentation has moved here](https://pmndrs.github.io/drei/performances/segments)
-
-#### Detailed
-
-[Documentation has moved here](https://pmndrs.github.io/drei/performances/detailed)
-
-#### Preload
-
-[Documentation has moved here](https://pmndrs.github.io/drei/performances/preload)
-
-#### BakeShadows
-
-[Documentation has moved here](https://pmndrs.github.io/drei/performances/bake-shadows)
-
-#### meshBounds
-
-[Documentation has moved here](https://pmndrs.github.io/drei/performances/mesh-bounds)
-
-#### AdaptiveDpr
-
-[Documentation has moved here](https://pmndrs.github.io/drei/performances/adaptive-dpr)
-
-#### AdaptiveEvents
-
-[Documentation has moved here](https://pmndrs.github.io/drei/performances/adaptive-events)
-
-#### Bvh
-
-[Documentation has moved here](https://pmndrs.github.io/drei/performances/bvh)
-
-#### PerformanceMonitor
-
-[Documentation has moved here](https://pmndrs.github.io/drei/performances/performance-monitor)
-
-### Portals
-
-#### Hud
-
-[Documentation has moved here](https://pmndrs.github.io/drei/portals/hud)
-
-#### View
-
-[Documentation has moved here](https://pmndrs.github.io/drei/portals/view)
-
-#### RenderTexture
-
-[Documentation has moved here](https://pmndrs.github.io/drei/portals/render-texture)
-
-#### RenderCubeTexture
-
-[Documentation has moved here](https://pmndrs.github.io/drei/portals/render-cube-texture)
-
-#### Fisheye
-
-[Documentation has moved here](https://pmndrs.github.io/drei/portals/fisheye)
-
-#### Mask
-
-[Documentation has moved here](https://pmndrs.github.io/drei/portals/mask)
-
-#### MeshPortalMaterial
-
-[Documentation has moved here](https://pmndrs.github.io/drei/portals/mesh-portal-material)
-
-### Staging
-
-#### Center
-
-[Documentation has moved here](https://pmndrs.github.io/drei/staging/center)
-
-#### Resize
-
-[Documentation has moved here](https://pmndrs.github.io/drei/staging/resize)
-
-#### BBAnchor
-
-[Documentation has moved here](https://pmndrs.github.io/drei/staging/bb-anchor)
-
-#### Bounds
-
-[Documentation has moved here](https://pmndrs.github.io/drei/staging/bounds)
-
-#### CameraShake
-
-[Documentation has moved here](https://pmndrs.github.io/drei/staging/camera-shake)
-
-#### Float
-
-[Documentation has moved here](https://pmndrs.github.io/drei/staging/float)
-
-#### Stage
-
-[Documentation has moved here](https://pmndrs.github.io/drei/staging/stage)
-
-#### Backdrop
-
-[Documentation has moved here](https://pmndrs.github.io/drei/staging/backdrop)
-
-#### Shadow
-
-[Documentation has moved here](https://pmndrs.github.io/drei/staging/shadow)
-
-#### Caustics
-
-[Documentation has moved here](https://pmndrs.github.io/drei/staging/caustics)
-
-#### ContactShadows
-
-[Documentation has moved here](https://pmndrs.github.io/drei/staging/contact-shadows)
-
-#### RandomizedLight
-
-[Documentation has moved here](https://pmndrs.github.io/drei/staging/randomized-light)
-
-#### AccumulativeShadows
-
-[Documentation has moved here](https://pmndrs.github.io/drei/staging/accumulative-shadows)
-
-#### SpotLight
-
-[Documentation has moved here](https://pmndrs.github.io/drei/staging/spot-light)
-
-#### SpotLightShadow
-
-[Documentation has moved here](https://pmndrs.github.io/drei/staging/spot-light-shadow)
-
-#### Environment
-
-[Documentation has moved here](https://pmndrs.github.io/drei/staging/environment)
-
-#### Lightformer
-
-[Documentation has moved here](https://pmndrs.github.io/drei/staging/lightformer)
-
-#### Sky
-
-[Documentation has moved here](https://pmndrs.github.io/drei/staging/sky)
-
-#### Stars
-
-[Documentation has moved here](https://pmndrs.github.io/drei/staging/stars)
-
-#### Sparkles
-
-[Documentation has moved here](https://pmndrs.github.io/drei/staging/sparkles)
-
-#### Cloud
-
-[Documentation has moved here](https://pmndrs.github.io/drei/staging/cloud)
-
-#### useEnvironment
-
-[Documentation has moved here](https://pmndrs.github.io/drei/staging/use-environment)
-
-#### MatcapTexture / useMatcapTexture
-
-[Documentation has moved here](https://pmndrs.github.io/drei/staging/matcap-texture-use-matcap-texture)
-
-#### NormalTexture / useNormalTexture
-
-[Documentation has moved here](https://pmndrs.github.io/drei/staging/normal-texture-use-normal-texture)
-
-#### ShadowAlpha
-
-[Documentation has moved here](https://pmndrs.github.io/drei/staging/shadow-alpha)
-
-</details>
-
-## Dev
-
-### INSTALL
-
-```sh
-$ corepack enable
-$ yarn install
-```
-
-### Test
-
-#### Local
-
-Pre-requisites:
-
-- ```sh
-  $ npx playwright install
-  ```
-
-To run visual tests locally:
-
-```sh
-$ yarn build
-$ yarn test
-```
-
-To update a snapshot:
-
-```sh
-$ PLAYWRIGHT_UPDATE_SNAPSHOTS=1 yarn test
-```
-
-#### Docker
-
-> [!IMPORTANT]
-> Snapshots are system-dependent, so to run playwright in the same environment as the CI:
-
-```sh
-$ docker run --init --rm \
-    -v $(pwd):/app -w /app \
-    ghcr.io/pmndrs/playwright:drei \
-      sh -c "corepack enable && yarn install && yarn build && yarn test"
-```
-
-To update a snapshot:
-
-```sh
-$ docker run --init --rm \
-    -v $(pwd):/app -w /app \
-    -e PLAYWRIGHT_UPDATE_SNAPSHOTS=1 \
-    ghcr.io/pmndrs/playwright:drei \
-      sh -c "corepack enable && yarn install && yarn build && yarn test"
-```
+[![Storybook](https://img.shields.io/static/v1?message=Storybook&style=flat&colorA=000000&colorB=000000&label=&logo=storybook&logoColor=ffffff)](https://drei.pmnd.rs/)
+[![Version](https://img.shields.io/npm/v/@react-three/drei?style=flat&colorA=000000&colorB=000000)](https://www.npmjs.com/package/@react-three/drei)
+[![Downloads](https://img.shields.io/npm/dt/@react-three/drei.svg?style=flat&colorA=000000&colorB=000000)](https://www.npmjs.com/package/@react-three/drei)
+[![Discord Shield](https://img.shields.io/discord/740090768164651008?style=flat&colorA=000000&colorB=000000&label=discord&logo=discord&logoColor=ffffff)](https://discord.com/channels/740090768164651008/741751532592038022)
+[![Open in GitHub Codespaces](https://img.shields.io/static/v1?&message=Open%20in%20%20Codespaces&style=flat&colorA=000000&colorB=000000&label=GitHub&logo=github&logoColor=ffffff)](https://github.com/codespaces/new?template_repository=pmndrs%2Fdrei)
+
+[![logo](docs/logo.jpg)](https://codesandbox.io/s/bfplr)
+
+A growing collection of useful helpers and fully functional, ready-made abstractions for [@react-three/fiber](https://github.com/pmndrs/react-three-fiber).
+
+If you make a component that is generic enough to be useful to others, think about [CONTRIBUTING](CONTRIBUTING.md)!
+
+```bash
+npm install @react-three/drei
+```
+
+> [!IMPORTANT]
+> this package is using the stand-alone [`three-stdlib`](https://github.com/pmndrs/three-stdlib) instead of [`three/examples/jsm`](https://github.com/mrdoob/three.js/tree/master/examples/jsm).
+
+## Basic usage
+
+```jsx
+import { PerspectiveCamera, PositionalAudio, ... } from '@react-three/drei'
+```
+
+## React-native
+
+```jsx
+import { PerspectiveCamera, PositionalAudio, ... } from '@react-three/drei/native'
+```
+
+The `native` route of the library **does not** export `Html` or `Loader`. The default export of the library is `web` which **does** export `Html` and `Loader`.
+
+## Documentation
+
+https://pmndrs.github.io/drei
+
+<details>
+  <summary>Old doc</summary>
+
+> [!WARNING]
+> Below is an archive of the anchors links with their new respective locations to the documentation website.
+> Do not update the links below, they are for reference only.
+
+<!-- <table>
+  <tr>
+    <td valign="top">
+      <ul>
+        <li><a href="#cameras">Cameras</a></li>
+        <ul>
+          <li><a href="#perspectivecamera">PerspectiveCamera</a></li>
+          <li><a href="#orthographiccamera">OrthographicCamera</a></li>
+          <li><a href="#cubecamera">CubeCamera</a></li>
+        </ul>
+        <li><a href="#controls">Controls</a></li>
+        <ul>
+          <li><a href="#cameracontrols">CameraControls</a></li>
+          <li><a href="#controls">FlyControls</a></li>
+          <li><a href="#controls">MapControls</a></li>
+          <li><a href="#controls">DeviceOrientationControls</a></li>
+          <li><a href="#controls">TrackballControls</a></li>
+          <li><a href="#controls">ArcballControls</a></li>
+          <li><a href="#controls">PointerLockControls</a></li>
+          <li><a href="#controls">FirstPersonControls</a></li>
+          <li><a href="#scrollcontrols">ScrollControls</a></li>
+          <li><a href="#presentationcontrols">PresentationControls</a></li>
+          <li><a href="#keyboardcontrols">KeyboardControls</a></li>
+          <li><a href="#FaceControls">FaceControls</a></li>
+          <li><a href="#motionpathcontrols">MotionPathControls</a></li>
+        </ul>
+        <li><a href="#gizmos">Gizmos</a></li>
+        <ul>
+          <li><a href="#gizmohelper">GizmoHelper</a></li>
+          <li><a href="#pivotcontrols">PivotControls</a></li>
+          <li><a href="#dragcontrols">DragControls</a></li>
+          <li><a href="#transformcontrols">TransformControls</a></li>
+          <li><a href="#grid">Grid</a></li>
+          <li><a href="#helper--usehelper">Helper / useHelper</a></li>
+          <li><a href="#helper">Helper</a></li>
+        </ul>
+        <li><a href="#abstractions">Abstractions</a></li>
+        <ul>
+          <li><a href="#image">Image</a></li>
+          <li><a href="#text">Text</a></li>
+          <li><a href="#text3d">Text3D</a></li>
+          <li><a href="#positionalaudio">PositionalAudio</a></li>
+          <li><a href="#billboard">Billboard</a></li>
+          <li><a href="#screenspace">ScreenSpace</a></li>
+          <li><a href="#screensizer">ScreenSizer</a></li>
+          <li><a href="#effects">Effects</a></li>
+          <li><a href="#gradienttexture">GradientTexture</a></li>
+          <li><a href="#edges">Edges</a></li>
+          <li><a href="#outlines">Outlines</a></li>
+          <li><a href="#trail">Trail</a></li>
+          <li><a href="#sampler">Sampler</a></li>
+          <li><a href="#computedattribute">ComputedAttribute</a></li>
+          <li><a href="#clone">Clone</a></li>
+          <li><a href="#useanimations">useAnimations</a></li>
+          <li><a href="#marchingcubes">MarchingCubes</a></li>
+          <li><a href="#decal">Decal</a></li>
+          <li><a href="#svg">Svg</a></li>
+          <li><a href="#gltf">Gltf</a></li>
+          <li><a href="#asciirenderer">AsciiRenderer</a></li>
+          <li><a href="#splat">Splat</a></li>
+        </ul>
+        <li><a href="#shaders">Shaders</a></li>
+        <ul>
+          <li><a href="#meshreflectormaterial">MeshReflectorMaterial</a></li>
+          <li><a href="#meshwobblematerial">MeshWobbleMaterial</a></li>
+          <li><a href="#meshdistortmaterial">MeshDistortMaterial</a></li>
+          <li><a href="#meshrefractionmaterial">MeshRefractionMaterial</a></li>
+          <li><a href="#meshtransmissionmaterial">MeshTransmissionMaterial</a></li>
+          <li><a href="#meshdiscardmaterial">MeshDiscardMaterial</a></li>
+          <li><a href="#pointmaterial">PointMaterial</a></li>
+          <li><a href="#softshadows">SoftShadows</a></li>
+          <li><a href="#shadermaterial">shaderMaterial</a></li>
+        </ul>
+      </ul>
+    </td>
+    <td valign="top">
+      <ul>
+        <li><a href="#misc">Misc</a></li>
+        <ul>
+          <li><a href="#example">Example</a></li>
+          <li><a href="#html">Html</a></li>
+          <li><a href="#cycleraycast">CycleRaycast</a></li>
+          <li><a href="#select">Select</a></li>
+          <li><a href="#sprite-animator">Sprite Animator</a></li>
+          <li><a href="#stats">Stats</a></li>
+          <li><a href="#stats-gl">StatsGl</a></li>
+          <li><a href="#wireframe">Wireframe</a></li>
+          <li><a href="#usedepthbuffer">useDepthBuffer</a></li>
+          <li><a href="#usecontextbridge">useContextBridge</a></li>
+          <li><a href="#fbo--usefbo">Fbo / useFBO</a></li>
+          <li><a href="#usecamera">useCamera</a></li>
+          <li><a href="#cubecamera--usecubecamera">CubeCamera / useCubeCamera</a></li>
+          <li><a href="#detectgpu--usedetectgpu">DetectGPU / useDetectGPU</a></li>
+          <li><a href="#useaspect">useAspect</a></li>
+          <li><a href="#usecursor">useCursor</a></li>
+          <li><a href="#useintersect">useIntersect</a></li>
+          <li><a href="#useboxprojectedenv">useBoxProjectedEnv</a></li>
+          <li><a href="#trail--useTrail">Trail / useTrail</a></li>
+          <li><a href="#useSurfaceSampler">useSurfaceSampler</a></li>
+          <li><a href="#facelandmarker">FaceLandmarker</a></li>
+        </ul>
+        <li><a href="#loading">Loaders</a></li>
+        <ul>
+          <li><a href="#loader">Loader</a></li>
+          <li><a href="#progress--useprogress">Progress / useProgress</a></li>
+          <li><a href="#gltf--usegltf">Gltf / useGLTF</a></li>
+          <li><a href="#fbx--usefbx">FBX / useFBX</a></li>
+          <li><a href="#texture--usetexture">Texture / useTexture</a></li>
+          <li><a href="#ktx2--usektx2">Ktx2 / useKTX2</a></li>
+          <li><a href="#cubetexture--usecubetexture">CubeTexture / useCubeTexture</a></li>
+          <li><a href="#videotexture--usevideotexture">VideoTexture / useVideoTexture</a></li>
+          <li><a href="#trailtexture--usetrailtexture">TrailTexture / useTrailTexture</a></li>
+          <li><a href="#usefont">useFont</a></li>
+          <li><a href="#usespriteloader">useSpriteLoader</a></li>
+        </ul>
+        <li><a href="#performance">Performance</a></li>
+        <ul>
+          <li><a href="#instances">Instances</a></li>
+          <li><a href="#merged">Merged</a></li>
+          <li><a href="#points">Points</a></li>
+          <li><a href="#segments">Segments</a></li>
+          <li><a href="#detailed">Detailed</a></li>
+          <li><a href="#preload">Preload</a></li>
+          <li><a href="#bakeshadows">BakeShadows</a></li>
+          <li><a href="#meshbounds">meshBounds</a></li>
+          <li><a href="#adaptivedpr">AdaptiveDpr</a></li>
+          <li><a href="#adaptiveevents">AdaptiveEvents</a></li>
+          <li><a href="#bvh">Bvh</a></li>
+          <li><a href="#performancemonitor">PerformanceMonitor</a></li>
+        </ul>
+        <li><a href="#portals">Portals</a></li>
+        <ul>
+          <li><a href="#hud">Hud</a></li>
+          <li><a href="#view">View</a></li>
+          <li><a href="#rendertexture">RenderTexture</a></li>
+          <li><a href="#rendercubetexture">RenderCubeTexture</a></li>
+          <li><a href="#fisheye">Fisheye</a></li>
+          <li><a href="#mask">Mask</a></li>
+          <li><a href="#meshportalmaterial">MeshPortalMaterial</a></li>
+        </ul>
+        <li><a href="#modifiers">Modifiers</a></li>
+        <ul>
+          <li><a href="#curvemodifier">CurveModifier</a></li>
+        </ul>
+      </ul>
+    </td>
+    <td valign="top">
+      <ul>
+        <li><a href="#shapes">Shapes</a></li>
+        <ul>
+          <li><a href="#shapes">Plane</a></li>
+          <li><a href="#shapes">Box</a></li>
+          <li><a href="#shapes">Sphere</a></li>
+          <li><a href="#shapes">Circle</a></li>
+          <li><a href="#shapes">Cone</a></li>
+          <li><a href="#shapes">Cylinder</a></li>
+          <li><a href="#shapes">Tube</a></li>
+          <li><a href="#shapes">Torus</a></li>
+          <li><a href="#shapes">TorusKnot</a></li>
+          <li><a href="#shapes">Ring</a></li>
+          <li><a href="#shapes">Tetrahedron</a></li>
+          <li><a href="#shapes">Polyhedron</a></li>
+          <li><a href="#shapes">Icosahedron</a></li>
+          <li><a href="#shapes">Octahedron</a></li>
+          <li><a href="#shapes">Dodecahedron</a></li>
+          <li><a href="#shapes">Extrude</a></li>
+          <li><a href="#shapes">Lathe</a></li>
+          <li><a href="#shapes">Shape</a></li>
+          <li><a href="#roundedbox">RoundedBox</a></li>
+          <li><a href="#screenquad">Screenquad</a></li>
+          <li><a href="#line">Line</a></li>
+          <li><a href="#quadraticbezierline">QuadraticBezierLine</a></li>
+          <li><a href="#cubicbezierline">CubicBezierLine</a></li>
+          <li><a href="#catmullromline">CatmullRomLine</a></li>
+          <li><a href="#facemesh">Facemesh</a></li>
+        </ul>
+        <li><a href="#staging">Staging</a></li>
+        <ul>
+          <li><a href="#center">Center</a></li>
+          <li><a href="#resize">Resize</a></li>
+          <li><a href="#BBAnchor">BBAnchor</a></li>
+          <li><a href="#bounds">Bounds</a></li>
+          <li><a href="#camerashake">CameraShake</a></li>
+          <li><a href="#float">Float</a></li>
+          <li><a href="#stage">Stage</a></li>
+          <li><a href="#backdrop">Backdrop</a></li>
+          <li><a href="#environment">Environment</a></li>
+          <li><a href="#lightformer">Lightformer</a></li>
+          <li><a href="#spotlight">SpotLight</a></li>
+          <li><a href="#spotlightshadow">SpotLightShadow</a></li>
+          <li><a href="#shadow">Shadow</a></li>
+          <li><a href="#caustics">Caustics</a></li>
+          <li><a href="#contactshadows">ContactShadows</a></li>
+          <li><a href="#randomizedlight">RandomizedLight</a></li>
+          <li><a href="#accumulativeshadows">AccumulativeShadows</a></li>
+          <li><a href="#sky">Sky</a></li>
+          <li><a href="#stars">Stars</a></li>
+          <li><a href="#sparkles">Sparkles</a></li>
+          <li><a href="#cloud">Cloud</a></li>
+          <li><a href="#useenvironment">useEnvironment</a></li>
+          <li><a href="#matcaptexture--usematcaptexture">MatcapTexture / useMatcapTexture</a></li>
+          <li><a href="#normaltexture--usenormaltexture">NormalTexture / useNormalTexture</a></li>
+          <li><a href="#shadowalpha">ShadowAlpha</a></li>
+        </ul>
+      </ul>
+    </td>
+  </tr>
+</table> -->
+
+### Cameras
+
+#### PerspectiveCamera
+
+[Documentation has moved here](https://pmndrs.github.io/drei/cameras/perspective-camera)
+
+#### OrthographicCamera
+
+[Documentation has moved here](https://pmndrs.github.io/drei/cameras/orthographic-camera)
+
+#### CubeCamera
+
+[Documentation has moved here](https://pmndrs.github.io/drei/cameras/cube-camera)
+
+### Controls
+
+#### CameraControls
+
+[Documentation has moved here](https://pmndrs.github.io/drei/controls/camera-controls)
+
+#### ScrollControls
+
+[Documentation has moved here](https://pmndrs.github.io/drei/controls/scroll-controls)
+
+#### PresentationControls
+
+[Documentation has moved here](https://pmndrs.github.io/drei/controls/presentation-controls)
+
+#### KeyboardControls
+
+[Documentation has moved here](https://pmndrs.github.io/drei/controls/keyboard-controls)
+
+#### FaceControls
+
+[Documentation has moved here](https://pmndrs.github.io/drei/controls/face-controls)
+
+#### MotionPathControls
+
+[Documentation has moved here](https://pmndrs.github.io/drei/controls/motion-path-controls)
+
+### Gizmos
+
+#### GizmoHelper
+
+[Documentation has moved here](https://pmndrs.github.io/drei/gizmos/gizmo-helper)
+
+#### PivotControls
+
+[Documentation has moved here](https://pmndrs.github.io/drei/gizmos/pivot-controls)
+
+#### DragControls
+
+[Documentation has moved here](https://pmndrs.github.io/drei/gizmos/drag-controls)
+
+#### TransformControls
+
+[Documentation has moved here](https://pmndrs.github.io/drei/gizmos/transform-controls)
+
+#### Grid
+
+[Documentation has moved here](https://pmndrs.github.io/drei/gizmos/grid)
+
+#### Helper / useHelper
+
+[Documentation has moved here](https://pmndrs.github.io/drei/gizmos/helper-use-helper)
+
+### Shapes
+
+#### Plane, Box, Sphere, Circle, Cone, Cylinder, Tube, Torus, TorusKnot, Ring, Tetrahedron, Polyhedron, Icosahedron, Octahedron, Dodecahedron, Extrude, Lathe, Shape
+
+[Documentation has moved here](https://pmndrs.github.io/drei/shapes/mesh)
+
+#### RoundedBox
+
+[Documentation has moved here](https://pmndrs.github.io/drei/shapes/rounded-box)
+
+#### ScreenQuad
+
+[Documentation has moved here](https://pmndrs.github.io/drei/shapes/screen-quad)
+
+#### Line
+
+[Documentation has moved here](https://pmndrs.github.io/drei/shapes/line)
+
+#### QuadraticBezierLine
+
+[Documentation has moved here](https://pmndrs.github.io/drei/shapes/quadratic-bezier-line)
+
+#### CubicBezierLine
+
+[Documentation has moved here](https://pmndrs.github.io/drei/shapes/cubic-bezier-line)
+
+#### CatmullRomLine
+
+[Documentation has moved here](https://pmndrs.github.io/drei/shapes/catmull-rom-line)
+
+#### Facemesh
+
+[Documentation has moved here](https://pmndrs.github.io/drei/shapes/facemesh)
+
+### Abstractions
+
+#### Image
+
+[Documentation has moved here](https://pmndrs.github.io/drei/abstractions/image)
+
+#### Text
+
+[Documentation has moved here](https://pmndrs.github.io/drei/abstractions/text)
+
+#### Text3D
+
+[Documentation has moved here](https://pmndrs.github.io/drei/abstractions/text3d)
+
+#### Effects
+
+[Documentation has moved here](https://pmndrs.github.io/drei/abstractions/effects)
+
+#### PositionalAudio
+
+[Documentation has moved here](https://pmndrs.github.io/drei/abstractions/positional-audio)
+
+#### Billboard
+
+[Documentation has moved here](https://pmndrs.github.io/drei/abstractions/billboard)
+
+#### ScreenSpace
+
+[Documentation has moved here](https://pmndrs.github.io/drei/abstractions/screen-space)
+
+#### ScreenSizer
+
+[Documentation has moved here](https://pmndrs.github.io/drei/abstractions/screen-sizer)
+
+#### GradientTexture
+
+[Documentation has moved here](https://pmndrs.github.io/drei/abstractions/gradient-texture)
+
+#### Edges
+
+[Documentation has moved here](https://pmndrs.github.io/drei/abstractions/edges)
+
+#### Outlines
+
+[Documentation has moved here](https://pmndrs.github.io/drei/abstractions/outlines)
+
+#### Trail
+
+[Documentation has moved here](https://pmndrs.github.io/drei/abstractions/trail)
+
+#### Sampler
+
+[Documentation has moved here](https://pmndrs.github.io/drei/abstractions/sampler)
+
+#### ComputedAttribute
+
+[Documentation has moved here](https://pmndrs.github.io/drei/abstractions/computed-attribute)
+
+#### Clone
+
+[Documentation has moved here](https://pmndrs.github.io/drei/abstractions/clone)
+
+#### useAnimations
+
+[Documentation has moved here](https://pmndrs.github.io/drei/abstractions/use-animations)
+
+#### MarchingCubes
+
+[Documentation has moved here](https://pmndrs.github.io/drei/abstractions/marching-cubes)
+
+#### Decal
+
+[Documentation has moved here](https://pmndrs.github.io/drei/abstractions/decal)
+
+#### Svg
+
+[Documentation has moved here](https://pmndrs.github.io/drei/abstractions/svg)
+
+#### AsciiRenderer
+
+[Documentation has moved here](https://pmndrs.github.io/drei/abstractions/ascii-renderer)
+
+#### Splat
+
+[Documentation has moved here](https://pmndrs.github.io/drei/abstractions/splat)
+
+### Shaders
+
+#### MeshReflectorMaterial
+
+[Documentation has moved here](https://pmndrs.github.io/drei/shaders/mesh-reflector-material)
+
+#### MeshWobbleMaterial
+
+[Documentation has moved here](https://pmndrs.github.io/drei/shaders/mesh-wobble-material)
+
+#### MeshDistortMaterial
+
+[Documentation has moved here](https://pmndrs.github.io/drei/shaders/mesh-distort-material)
+
+#### MeshRefractionMaterial
+
+[Documentation has moved here](https://pmndrs.github.io/drei/shaders/mesh-refraction-material)
+
+#### MeshTransmissionMaterial
+
+[Documentation has moved here](https://pmndrs.github.io/drei/shaders/mesh-transmission-material)
+
+#### MeshDiscardMaterial
+
+[Documentation has moved here](https://pmndrs.github.io/drei/shaders/mesh-discard-material)
+
+#### PointMaterial
+
+[Documentation has moved here](https://pmndrs.github.io/drei/shaders/point-material)
+
+#### SoftShadows
+
+[Documentation has moved here](https://pmndrs.github.io/drei/shaders/soft-shadows)
+
+#### shaderMaterial
+
+[Documentation has moved here](https://pmndrs.github.io/drei/shaders/shader-material)
+
+### Modifiers
+
+#### CurveModifier
+
+[Documentation has moved here](https://pmndrs.github.io/drei/modifiers/curve-modifier)
+
+### Misc
+
+#### useContextBridge
+
+[Documentation has moved here](https://pmndrs.github.io/drei/misc/use-context-bridge)
+
+#### Example
+
+[Documentation has moved here](https://pmndrs.github.io/drei/misc/example)
+
+#### Html
+
+[Documentation has moved here](https://pmndrs.github.io/drei/misc/html)
+
+#### CycleRaycast
+
+[Documentation has moved here](https://pmndrs.github.io/drei/misc/cycle-raycast)
+
+#### Select
+
+[Documentation has moved here](https://pmndrs.github.io/drei/misc/select)
+
+#### Sprite Animator
+
+[Documentation has moved here](https://pmndrs.github.io/drei/misc/sprite-animator)
+
+#### Stats
+
+[Documentation has moved here](https://pmndrs.github.io/drei/misc/stats)
+
+#### StatsGl
+
+[Documentation has moved here](https://pmndrs.github.io/drei/misc/stats-gl)
+
+#### Wireframe
+
+[Documentation has moved here](https://pmndrs.github.io/drei/misc/wireframe)
+
+#### useDepthBuffer
+
+[Documentation has moved here](https://pmndrs.github.io/drei/misc/use-depth-buffer)
+
+#### Fbo / useFBO
+
+[Documentation has moved here](https://pmndrs.github.io/drei/misc/fbo-use-fbo)
+
+#### useCamera
+
+[Documentation has moved here](https://pmndrs.github.io/drei/misc/use-camera)
+
+#### CubeCamera / useCubeCamera
+
+[Documentation has moved here](https://pmndrs.github.io/drei/misc/cube-camera-use-cube-camera)
+
+#### DetectGPU / useDetectGPU
+
+[Documentation has moved here](https://pmndrs.github.io/drei/misc/detect-gpu-use-detect-gpu)
+
+#### useAspect
+
+[Documentation has moved here](https://pmndrs.github.io/drei/misc/use-aspect)
+
+#### useCursor
+
+[Documentation has moved here](https://pmndrs.github.io/drei/misc/use-cursor)
+
+#### useIntersect
+
+[Documentation has moved here](https://pmndrs.github.io/drei/misc/use-intersect)
+
+#### useBoxProjectedEnv
+
+[Documentation has moved here](https://pmndrs.github.io/drei/misc/use-box-projected-env)
+
+#### Trail / useTrail
+
+[Documentation has moved here](https://pmndrs.github.io/drei/misc/trail-use-trail)
+
+#### useSurfaceSampler
+
+[Documentation has moved here](https://pmndrs.github.io/drei/misc/use-surface-sampler)
+
+#### FaceLandmarker
+
+[Documentation has moved here](https://pmndrs.github.io/drei/misc/face-landmarker)
+
+### Loading
+
+#### Loader
+
+[Documentation has moved here](https://pmndrs.github.io/drei/loaders/loader)
+
+#### Progress / useProgress
+
+[Documentation has moved here](https://pmndrs.github.io/drei/loaders/progress-use-progress)
+
+#### Gltf / useGLTF
+
+[Documentation has moved here](https://pmndrs.github.io/drei/loaders/gltf-use-gltf)
+
+#### Fbx / useFBX
+
+[Documentation has moved here](https://pmndrs.github.io/drei/loaders/fbx-use-fbx)
+
+#### Texture / useTexture
+
+[Documentation has moved here](https://pmndrs.github.io/drei/loaders/texture-use-texture)
+
+#### Ktx2 / useKTX2
+
+[Documentation has moved here](https://pmndrs.github.io/drei/loaders/ktx2-use-ktx2)
+
+#### CubeTexture / useCubeTexture
+
+[Documentation has moved here](https://pmndrs.github.io/drei/loaders/cube-texture-use-cube-texture)
+
+#### VideoTexture / useVideoTexture
+
+[Documentation has moved here](https://pmndrs.github.io/drei/loaders/video-texture-use-video-texture)
+
+#### TrailTexture / useTrailTexture
+
+[Documentation has moved here](https://pmndrs.github.io/drei/loaders/trail-texture-use-trail-texture)
+
+#### useFont
+
+[Documentation has moved here](https://pmndrs.github.io/drei/loaders/use-font)
+
+#### useSpriteLoader
+
+[Documentation has moved here](https://pmndrs.github.io/drei/loaders/use-sprite-loader)
+
+### Performance
+
+#### Instances
+
+[Documentation has moved here](https://pmndrs.github.io/drei/performances/instances)
+
+#### Merged
+
+[Documentation has moved here](https://pmndrs.github.io/drei/performances/merged)
+
+#### Points
+
+[Documentation has moved here](https://pmndrs.github.io/drei/performances/points)
+
+#### Segments
+
+[Documentation has moved here](https://pmndrs.github.io/drei/performances/segments)
+
+#### Detailed
+
+[Documentation has moved here](https://pmndrs.github.io/drei/performances/detailed)
+
+#### Preload
+
+[Documentation has moved here](https://pmndrs.github.io/drei/performances/preload)
+
+#### BakeShadows
+
+[Documentation has moved here](https://pmndrs.github.io/drei/performances/bake-shadows)
+
+#### meshBounds
+
+[Documentation has moved here](https://pmndrs.github.io/drei/performances/mesh-bounds)
+
+#### AdaptiveDpr
+
+[Documentation has moved here](https://pmndrs.github.io/drei/performances/adaptive-dpr)
+
+#### AdaptiveEvents
+
+[Documentation has moved here](https://pmndrs.github.io/drei/performances/adaptive-events)
+
+#### Bvh
+
+[Documentation has moved here](https://pmndrs.github.io/drei/performances/bvh)
+
+#### PerformanceMonitor
+
+[Documentation has moved here](https://pmndrs.github.io/drei/performances/performance-monitor)
+
+### Portals
+
+#### Hud
+
+[Documentation has moved here](https://pmndrs.github.io/drei/portals/hud)
+
+#### View
+
+[Documentation has moved here](https://pmndrs.github.io/drei/portals/view)
+
+#### RenderTexture
+
+[Documentation has moved here](https://pmndrs.github.io/drei/portals/render-texture)
+
+#### RenderCubeTexture
+
+[Documentation has moved here](https://pmndrs.github.io/drei/portals/render-cube-texture)
+
+#### Fisheye
+
+[Documentation has moved here](https://pmndrs.github.io/drei/portals/fisheye)
+
+#### Mask
+
+[Documentation has moved here](https://pmndrs.github.io/drei/portals/mask)
+
+#### MeshPortalMaterial
+
+[Documentation has moved here](https://pmndrs.github.io/drei/portals/mesh-portal-material)
+
+### Staging
+
+#### Center
+
+[Documentation has moved here](https://pmndrs.github.io/drei/staging/center)
+
+#### Resize
+
+[Documentation has moved here](https://pmndrs.github.io/drei/staging/resize)
+
+#### BBAnchor
+
+[Documentation has moved here](https://pmndrs.github.io/drei/staging/bb-anchor)
+
+#### Bounds
+
+[Documentation has moved here](https://pmndrs.github.io/drei/staging/bounds)
+
+#### CameraShake
+
+[Documentation has moved here](https://pmndrs.github.io/drei/staging/camera-shake)
+
+#### Float
+
+[Documentation has moved here](https://pmndrs.github.io/drei/staging/float)
+
+#### Stage
+
+[Documentation has moved here](https://pmndrs.github.io/drei/staging/stage)
+
+#### Backdrop
+
+[Documentation has moved here](https://pmndrs.github.io/drei/staging/backdrop)
+
+#### Shadow
+
+[Documentation has moved here](https://pmndrs.github.io/drei/staging/shadow)
+
+#### Caustics
+
+[Documentation has moved here](https://pmndrs.github.io/drei/staging/caustics)
+
+#### ContactShadows
+
+[Documentation has moved here](https://pmndrs.github.io/drei/staging/contact-shadows)
+
+#### RandomizedLight
+
+[Documentation has moved here](https://pmndrs.github.io/drei/staging/randomized-light)
+
+#### AccumulativeShadows
+
+[Documentation has moved here](https://pmndrs.github.io/drei/staging/accumulative-shadows)
+
+#### SpotLight
+
+[Documentation has moved here](https://pmndrs.github.io/drei/staging/spot-light)
+
+#### SpotLightShadow
+
+[Documentation has moved here](https://pmndrs.github.io/drei/staging/spot-light-shadow)
+
+#### Environment
+
+[Documentation has moved here](https://pmndrs.github.io/drei/staging/environment)
+
+#### Lightformer
+
+[Documentation has moved here](https://pmndrs.github.io/drei/staging/lightformer)
+
+#### Sky
+
+[Documentation has moved here](https://pmndrs.github.io/drei/staging/sky)
+
+#### Stars
+
+[Documentation has moved here](https://pmndrs.github.io/drei/staging/stars)
+
+#### Sparkles
+
+[Documentation has moved here](https://pmndrs.github.io/drei/staging/sparkles)
+
+#### Cloud
+
+[Documentation has moved here](https://pmndrs.github.io/drei/staging/cloud)
+
+#### useEnvironment
+
+[Documentation has moved here](https://pmndrs.github.io/drei/staging/use-environment)
+
+#### MatcapTexture / useMatcapTexture
+
+[Documentation has moved here](https://pmndrs.github.io/drei/staging/matcap-texture-use-matcap-texture)
+
+#### NormalTexture / useNormalTexture
+
+[Documentation has moved here](https://pmndrs.github.io/drei/staging/normal-texture-use-normal-texture)
+
+#### ShadowAlpha
+
+[Documentation has moved here](https://pmndrs.github.io/drei/staging/shadow-alpha)
+
+</details>
+
+## Dev
+
+### INSTALL
+
+```sh
+$ corepack enable
+$ yarn install
+```
+
+### Test
+
+#### Local
+
+Pre-requisites:
+
+- ```sh
+  $ npx playwright install
+  ```
+
+To run visual tests locally:
+
+```sh
+$ yarn build
+$ yarn test
+```
+
+To update a snapshot:
+
+```sh
+$ PLAYWRIGHT_UPDATE_SNAPSHOTS=1 yarn test
+```
+
+#### Docker
+
+> [!IMPORTANT]
+> Snapshots are system-dependent, so to run playwright in the same environment as the CI:
+
+```sh
+$ docker run --init --rm \
+    -v $(pwd):/app -w /app \
+    ghcr.io/pmndrs/playwright:drei \
+      sh -c "corepack enable && yarn install && yarn build && yarn test"
+```
+
+To update a snapshot:
+
+```sh
+$ docker run --init --rm \
+    -v $(pwd):/app -w /app \
+    -e PLAYWRIGHT_UPDATE_SNAPSHOTS=1 \
+    ghcr.io/pmndrs/playwright:drei \
+      sh -c "corepack enable && yarn install && yarn build && yarn test"
+```