@react-three/drei 9.46.6 → 9.47.0

package/README.md

@@ -56,6 +56,7 @@ The `native` route of the library **does not** export `Html` or `Loader`. The de
           <li><a href="#gizmohelper">GizmoHelper</a></li>
           <li><a href="#pivotcontrols">PivotControls</a></li>
           <li><a href="#transformcontrols">TransformControls</a></li>
+          <li><a href="#grid">Grid</a></li>
           <li><a href="#usehelper">useHelper</a></li>
         </ul>
         <li><a href="#abstractions">Abstractions</a></li>
@@ -647,6 +648,50 @@ If you are using other controls (Orbit, Trackball, etc), you will notice how the
 <OrbitControls makeDefault />
 ```
 
+#### Grid
+
+[![](https://img.shields.io/badge/-storybook-%23ff69b4)](https://drei.vercel.app/?path=/story/gizmos-grid--use-grid-scene-st)
+
+<p>
+  <a href="https://codesandbox.io/s/imreeu"><img width="20%" src="https://codesandbox.io/api/v1/sandboxes/imreeu/screenshot.png" alt="Demo"/></a>
+</p>
+
+A y-up oriented, shader-based grid implementation.
+
+```tsx
+export type GridMaterialType = {
+  /** Cell size, default: 0.5 */
+  cellSize?: number
+  /** Cell thickness, default: 0.5 */
+  cellThickness?: number
+  /** Cell color, default: black */
+  cellColor?: THREE.ColorRepresentation
+  /** Section size, default: 1 */
+  sectionSize?: number
+  /** Section thickness, default: 1 */
+  sectionThickness?: number
+  /** Section color, default: #2080ff */
+  sectionColor?: THREE.ColorRepresentation
+  /** Follow camera, default: false */
+  followCamera?: boolean
+  /** Display the grid infinitely, default: false */
+  infiniteGrid?: boolean
+  /** Fade distance, default: 100 */
+  fadeDistance?: number
+  /** Fade strength, default: 1 */
+  fadeStrength?: number
+}
+
+export type GridProps = GridMaterialType & {
+  /** Default plane-geometry arguments */
+  args?: ConstructorParameters<typeof THREE.PlaneGeometry>
+}
+```
+
+```jsx
+<Grid />
+```
+
 #### useHelper
 
 [![](https://img.shields.io/badge/-storybook-%23ff69b4)](https://drei.vercel.app/?path=/story/misc-usehelper--default-story)

package/core/Grid.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@babel/runtime/helpers/extends"),n=require("react"),i=require("three"),o=require("@react-three/fiber"),r=require("./shaderMaterial.cjs.js");function t(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function l(e){if(e&&e.__esModule)return e;var n=Object.create(null);return e&&Object.keys(e).forEach((function(i){if("default"!==i){var o=Object.getOwnPropertyDescriptor(e,i);Object.defineProperty(n,i,o.get?o:{enumerable:!0,get:function(){return e[i]}})}})),n.default=e,Object.freeze(n)}var a=t(e),c=l(n),s=l(i);const f=r.shaderMaterial({cellSize:.5,sectionSize:1,fadeDistance:100,fadeStrength:1,cellThickness:.5,sectionThickness:1,cellColor:new s.Color,sectionColor:new s.Color,infiniteGrid:0,followCamera:0},"varying vec3 worldPosition;\n   uniform float fadeDistance;\n   uniform float infiniteGrid;\n   uniform float followCamera;\n   void main() {\n     vec3 pos = position.xzy * (1. + fadeDistance * infiniteGrid);\n     pos.xz += (cameraPosition.xz * followCamera);\n     worldPosition = pos;\n     gl_Position = projectionMatrix * modelViewMatrix * vec4(pos, 1.0);\n   }","varying vec3 worldPosition;\n   uniform float cellSize;\n   uniform float sectionSize;\n   uniform vec3 cellColor;\n   uniform vec3 sectionColor;\n   uniform float fadeDistance;\n   uniform float fadeStrength;\n   uniform float cellThickness;\n   uniform float sectionThickness;\n   uniform float infiniteGrid;\n   float getGrid(float size, float thickness) {\n     vec2 r = worldPosition.xz / size;\n     vec2 grid = abs(fract(r - 0.5) - 0.5) / fwidth(r);\n     float line = min(grid.x, grid.y) + 1. - thickness;\n     return 1.0 - min(line, 1.);\n   }\n   void main() {\n     float g1 = getGrid(cellSize, cellThickness);\n     float g2 = getGrid(sectionSize, sectionThickness);\n     float d = 1.0 - min(distance(cameraPosition.xz, worldPosition.xz) / fadeDistance, 1.);\n     vec3 color = mix(cellColor, sectionColor, min(1.,sectionThickness * g2));\n     gl_FragColor = vec4(color, (g1 + g2) * pow(d,fadeStrength));\n     gl_FragColor.a = mix(0.75 * gl_FragColor.a, gl_FragColor.a, g2);\n     if (gl_FragColor.a <= 0.0) discard;\n     #include <tonemapping_fragment>\n     #include <encodings_fragment>\n   }"),d=c.forwardRef((({args:e,cellColor:n="#000000",sectionColor:i="#2080ff",cellSize:r=.5,sectionSize:t=1,followCamera:l=!1,infiniteGrid:s=!1,fadeDistance:d=100,fadeStrength:u=1,cellThickness:g=.5,sectionThickness:m=1,...h},C)=>{o.extend({GridMaterial:f});const v={cellSize:r,sectionSize:t,cellColor:n,sectionColor:i,cellThickness:g,sectionThickness:m},p={fadeDistance:d,fadeStrength:u,infiniteGrid:s,followCamera:l};return c.createElement("mesh",a.default({ref:C,"rotation-x":Math.PI,frustumCulled:!1},h),c.createElement("gridMaterial",a.default({transparent:!0,"extensions-derivatives":!0},v,p)),c.createElement("planeGeometry",{args:e}))}));exports.Grid=d;

package/core/Grid.d.ts

@@ -0,0 +1,27 @@
+import * as React from 'react';
+import * as THREE from 'three';
+export declare type GridMaterialType = {
+    cellSize?: number;
+    cellThickness?: number;
+    cellColor?: THREE.ColorRepresentation;
+    sectionSize?: number;
+    sectionThickness?: number;
+    sectionColor?: THREE.ColorRepresentation;
+    followCamera?: boolean;
+    infiniteGrid?: boolean;
+    fadeDistance?: number;
+    fadeStrength?: number;
+};
+export declare type GridProps = GridMaterialType & {
+    args?: ConstructorParameters<typeof THREE.PlaneGeometry>;
+};
+declare global {
+    namespace JSX {
+        interface IntrinsicElements {
+            gridMaterial: JSX.IntrinsicElements['shaderMaterial'] & GridMaterialType;
+        }
+    }
+}
+export declare const Grid: React.ForwardRefExoticComponent<Pick<Omit<import("@react-three/fiber").MeshProps, "args"> & GridMaterialType & {
+    args?: [width?: number | undefined, height?: number | undefined, widthSegments?: number | undefined, heightSegments?: number | undefined] | undefined;
+}, "visible" | "attach" | "args" | "children" | "key" | "onUpdate" | "position" | "up" | "scale" | "rotation" | "matrix" | "quaternion" | "layers" | "dispose" | "type" | "id" | "uuid" | "name" | "parent" | "modelViewMatrix" | "normalMatrix" | "matrixWorld" | "matrixAutoUpdate" | "matrixWorldNeedsUpdate" | "castShadow" | "receiveShadow" | "frustumCulled" | "renderOrder" | "animations" | "userData" | "customDepthMaterial" | "customDistanceMaterial" | "isObject3D" | "onBeforeRender" | "onAfterRender" | "applyMatrix4" | "applyQuaternion" | "setRotationFromAxisAngle" | "setRotationFromEuler" | "setRotationFromMatrix" | "setRotationFromQuaternion" | "rotateOnAxis" | "rotateOnWorldAxis" | "rotateX" | "rotateY" | "rotateZ" | "translateOnAxis" | "translateX" | "translateY" | "translateZ" | "localToWorld" | "worldToLocal" | "lookAt" | "add" | "remove" | "removeFromParent" | "clear" | "getObjectById" | "getObjectByName" | "getObjectByProperty" | "getWorldPosition" | "getWorldQuaternion" | "getWorldScale" | "getWorldDirection" | "raycast" | "traverse" | "traverseVisible" | "traverseAncestors" | "updateMatrix" | "updateMatrixWorld" | "updateWorldMatrix" | "toJSON" | "clone" | "copy" | "addEventListener" | "hasEventListener" | "removeEventListener" | "dispatchEvent" | keyof import("@react-three/fiber/dist/declarations/src/core/events").EventHandlers | "material" | "geometry" | "morphTargetInfluences" | "morphTargetDictionary" | "isMesh" | "updateMorphTargets" | keyof GridMaterialType> & React.RefAttributes<THREE.Mesh<THREE.BufferGeometry, THREE.Material | THREE.Material[]>>>;

package/core/Grid.js

@@ -0,0 +1,97 @@
+import _extends from '@babel/runtime/helpers/esm/extends';
+import * as React from 'react';
+import * as THREE from 'three';
+import { extend } from '@react-three/fiber';
+import { shaderMaterial } from './shaderMaterial.js';
+
+const GridMaterial = shaderMaterial({
+  cellSize: 0.5,
+  sectionSize: 1,
+  fadeDistance: 100,
+  fadeStrength: 1,
+  cellThickness: 0.5,
+  sectionThickness: 1,
+  cellColor: new THREE.Color(),
+  sectionColor: new THREE.Color(),
+  infiniteGrid: 0,
+  followCamera: 0
+}, `varying vec3 worldPosition;
+   uniform float fadeDistance;
+   uniform float infiniteGrid;
+   uniform float followCamera;
+   void main() {
+     vec3 pos = position.xzy * (1. + fadeDistance * infiniteGrid);
+     pos.xz += (cameraPosition.xz * followCamera);
+     worldPosition = pos;
+     gl_Position = projectionMatrix * modelViewMatrix * vec4(pos, 1.0);
+   }`, `varying vec3 worldPosition;
+   uniform float cellSize;
+   uniform float sectionSize;
+   uniform vec3 cellColor;
+   uniform vec3 sectionColor;
+   uniform float fadeDistance;
+   uniform float fadeStrength;
+   uniform float cellThickness;
+   uniform float sectionThickness;
+   uniform float infiniteGrid;
+   float getGrid(float size, float thickness) {
+     vec2 r = worldPosition.xz / size;
+     vec2 grid = abs(fract(r - 0.5) - 0.5) / fwidth(r);
+     float line = min(grid.x, grid.y) + 1. - thickness;
+     return 1.0 - min(line, 1.);
+   }
+   void main() {
+     float g1 = getGrid(cellSize, cellThickness);
+     float g2 = getGrid(sectionSize, sectionThickness);
+     float d = 1.0 - min(distance(cameraPosition.xz, worldPosition.xz) / fadeDistance, 1.);
+     vec3 color = mix(cellColor, sectionColor, min(1.,sectionThickness * g2));
+     gl_FragColor = vec4(color, (g1 + g2) * pow(d,fadeStrength));
+     gl_FragColor.a = mix(0.75 * gl_FragColor.a, gl_FragColor.a, g2);
+     if (gl_FragColor.a <= 0.0) discard;
+     #include <tonemapping_fragment>
+     #include <encodings_fragment>
+   }`);
+const Grid = /*#__PURE__*/React.forwardRef(({
+  args,
+  cellColor = '#000000',
+  sectionColor = '#2080ff',
+  cellSize = 0.5,
+  sectionSize = 1,
+  followCamera = false,
+  infiniteGrid = false,
+  fadeDistance = 100,
+  fadeStrength = 1,
+  cellThickness = 0.5,
+  sectionThickness = 1,
+  ...props
+}, fRef) => {
+  extend({
+    GridMaterial
+  });
+  const uniforms1 = {
+    cellSize,
+    sectionSize,
+    cellColor,
+    sectionColor,
+    cellThickness,
+    sectionThickness
+  };
+  const uniforms2 = {
+    fadeDistance,
+    fadeStrength,
+    infiniteGrid,
+    followCamera
+  };
+  return /*#__PURE__*/React.createElement("mesh", _extends({
+    ref: fRef,
+    "rotation-x": Math.PI,
+    frustumCulled: false
+  }, props), /*#__PURE__*/React.createElement("gridMaterial", _extends({
+    transparent: true,
+    "extensions-derivatives": true
+  }, uniforms1, uniforms2)), /*#__PURE__*/React.createElement("planeGeometry", {
+    args: args
+  }));
+});
+
+export { Grid };

package/core/index.cjs.js

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

package/core/index.d.ts

@@ -34,6 +34,7 @@ export * from './FirstPersonControls';
 export * from './GizmoHelper';
 export * from './GizmoViewcube';
 export * from './GizmoViewport';
+export * from './Grid';
 export * from './useCubeTexture';
 export * from './useFBX';
 export * from './useGLTF';

package/core/index.js

@@ -34,6 +34,7 @@ export { FirstPersonControls } from './FirstPersonControls.js';
 export { GizmoHelper, useGizmoContext } from './GizmoHelper.js';
 export { GizmoViewcube } from './GizmoViewcube.js';
 export { GizmoViewport } from './GizmoViewport.js';
+export { Grid } from './Grid.js';
 export { useCubeTexture } from './useCubeTexture.js';
 export { useFBX } from './useFBX.js';
 export { useGLTF } from './useGLTF.js';

package/core/useAnimations.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),r=require("three"),t=require("@react-three/fiber");function n(e){if(e&&e.__esModule)return e;var r=Object.create(null);return e&&Object.keys(e).forEach((function(t){if("default"!==t){var n=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(r,t,n.get?n:{enumerable:!0,get:function(){return e[t]}})}})),r.default=e,Object.freeze(r)}var c=n(e);exports.useAnimations=function(e,n){const u=c.useRef(),[a]=c.useState((()=>n?n instanceof r.Object3D?{current:n}:n:u)),[i]=c.useState((()=>new r.AnimationMixer(void 0))),o=c.useRef({}),[s]=c.useState((()=>{const r={};return e.forEach((e=>Object.defineProperty(r,e.name,{enumerable:!0,get(){if(a.current)return o.current[e.name]||(o.current[e.name]=i.clipAction(e,a.current))}}))),{ref:a,clips:e,actions:r,names:e.map((e=>e.name)),mixer:i}}));return t.useFrame(((e,r)=>i.update(r))),c.useEffect((()=>{const e=a.current;return()=>{o.current={},Object.values(s.actions).forEach((r=>{e&&i.uncacheAction(r,e)}))}}),[e]),s};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),t=require("three"),r=require("@react-three/fiber");function n(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 c=n(e);exports.useAnimations=function(e,n){const u=c.useRef(),[a]=c.useState((()=>n?n instanceof t.Object3D?{current:n}:n:u)),[i]=c.useState((()=>new t.AnimationMixer(void 0))),o=c.useRef({}),[s]=c.useState((()=>{const t={};return e.forEach((e=>Object.defineProperty(t,e.name,{enumerable:!0,get(){if(a.current)return o.current[e.name]||(o.current[e.name]=i.clipAction(e,a.current))}}))),{ref:a,clips:e,actions:t,names:e.map((e=>e.name)),mixer:i}}));return r.useFrame(((e,t)=>i.update(t))),c.useEffect((()=>{const e=a.current;return()=>{o.current={},Object.values(s.actions).forEach((t=>{e&&i.uncacheAction(t,e)}))}}),[e]),c.useEffect((()=>()=>{i.stopAllAction()}),[i]),s};

package/core/useAnimations.js

@@ -43,6 +43,11 @@ function useAnimations(clips, root) {
       });
     };
   }, [clips]);
+  React.useEffect(() => {
+    return () => {
+      mixer.stopAllAction();
+    };
+  }, [mixer]);
   return api;
 }