@react-three/drei 7.8.5 → 7.10.1

package/core/BakeShadows.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),t=require("@react-three/fiber");function r(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 a=r(e);exports.BakeShadows=function(){var e=t.useThree((function(e){return e.gl}));return a.useEffect((function(){return e.shadowMap.autoUpdate=!1,e.shadowMap.needsUpdate=!0,function(){e.shadowMap.autoUpdate=e.shadowMap.needsUpdate=!0}}),[]),null};

package/core/BakeShadows.d.ts

@@ -0,0 +1 @@
+export declare function BakeShadows(): null;

package/core/BakeShadows.js

@@ -0,0 +1,16 @@
+import * as React from 'react';
+import { useThree } from '@react-three/fiber';
+
+function BakeShadows() {
+  const gl = useThree(state => state.gl);
+  React.useEffect(() => {
+    gl.shadowMap.autoUpdate = false;
+    gl.shadowMap.needsUpdate = true;
+    return () => {
+      gl.shadowMap.autoUpdate = gl.shadowMap.needsUpdate = true;
+    };
+  }, []);
+  return null;
+}
+
+export { BakeShadows };

package/core/ContactShadows.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@babel/runtime/helpers/extends"),r=require("@babel/runtime/helpers/objectWithoutPropertiesLoose"),t=require("react"),a=require("three"),n=require("@react-three/fiber"),u=require("three-stdlib");function i(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function o(e){if(e&&e.__esModule)return e;var r=Object.create(null);return e&&Object.keys(e).forEach((function(t){if("default"!==t){var a=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(r,t,a.get?a:{enumerable:!0,get:function(){return e[t]}})}})),r.default=e,Object.freeze(r)}var l=i(e),d=i(r),f=o(t),c=o(a),s=f.forwardRef((function(e,r){var t=e.opacity,a=void 0===t?1:t,i=e.width,o=void 0===i?1:i,s=e.height,h=void 0===s?1:s,p=e.blur,m=void 0===p?1:p,g=e.far,v=void 0===g?10:g,b=e.resolution,M=void 0===b?256:b,w=d.default(e,["opacity","width","height","blur","far","resolution"]),y=n.useThree((function(e){return e.scene})),T=n.useThree((function(e){return e.gl})),j=f.useRef(),x=f.useMemo((function(){var e=new c.WebGLRenderTarget(M,M),r=new c.WebGLRenderTarget(M,M);r.texture.generateMipmaps=e.texture.generateMipmaps=!1;var t=new c.PlaneBufferGeometry(o,h).rotateX(Math.PI/2),a=new c.Mesh(t),n=new c.MeshDepthMaterial;n.depthTest=n.depthWrite=!1,n.onBeforeCompile=function(e){return e.fragmentShader=e.fragmentShader.replace("1.0 - fragCoordZ ), opacity );","0.0 ), ( 1.0 - fragCoordZ ) * 1.0 );")};var i=new c.ShaderMaterial(u.HorizontalBlurShader),l=new c.ShaderMaterial(u.VerticalBlurShader);return l.depthTest=i.depthTest=!1,[e,t,n,a,i,l,r]}),[M,o,h]),R=x[0],O=x[1],P=x[2],S=x[3],q=x[4],B=x[5],C=x[6];return n.useFrame((function(){if(j.current){var e=y.background;y.background=null,y.overrideMaterial=P,T.setRenderTarget(R),T.render(y,j.current),y.overrideMaterial=null,S.material=q,S.material.uniforms.tDiffuse.value=R.texture,q.uniforms.h.value=m/256,T.setRenderTarget(C),T.render(S,j.current),S.material=B,S.material.uniforms.tDiffuse.value=C.texture,B.uniforms.v.value=m/256,T.setRenderTarget(R),T.render(S,j.current),T.setRenderTarget(null),y.background=e}})),f.createElement("group",l.default({},w,{ref:r}),f.createElement("mesh",{geometry:O,scale:[1,-1,1],rotation:[-Math.PI/2,0,0]},f.createElement("meshBasicMaterial",{map:R.texture,transparent:!0,opacity:a})),f.createElement("orthographicCamera",{ref:j,args:[-o/2,o/2,h/2,-h/2,0,v]}))}));exports.ContactShadows=s;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@babel/runtime/helpers/extends"),r=require("@babel/runtime/helpers/objectWithoutPropertiesLoose"),t=require("react"),a=require("three"),n=require("@react-three/fiber"),u=require("three-stdlib");function i(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function o(e){if(e&&e.__esModule)return e;var r=Object.create(null);return e&&Object.keys(e).forEach((function(t){if("default"!==t){var a=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(r,t,a.get?a:{enumerable:!0,get:function(){return e[t]}})}})),r.default=e,Object.freeze(r)}var l=i(e),d=i(r),f=o(t),s=o(a),c=f.forwardRef((function(e,r){var t=e.frames,a=void 0===t?1/0:t,i=e.opacity,o=void 0===i?1:i,c=e.width,h=void 0===c?1:c,m=e.height,p=void 0===m?1:m,g=e.blur,v=void 0===g?1:g,b=e.far,M=void 0===b?10:b,w=e.resolution,y=void 0===w?256:w,T=d.default(e,["frames","opacity","width","height","blur","far","resolution"]),j=n.useThree((function(e){return e.scene})),x=n.useThree((function(e){return e.gl})),R=f.useRef(),O=f.useMemo((function(){var e=new s.WebGLRenderTarget(y,y),r=new s.WebGLRenderTarget(y,y);r.texture.generateMipmaps=e.texture.generateMipmaps=!1;var t=new s.PlaneBufferGeometry(h,p).rotateX(Math.PI/2),a=new s.Mesh(t),n=new s.MeshDepthMaterial;n.depthTest=n.depthWrite=!1,n.onBeforeCompile=function(e){return e.fragmentShader=e.fragmentShader.replace("1.0 - fragCoordZ ), opacity );","0.0 ), ( 1.0 - fragCoordZ ) * 1.0 );")};var i=new s.ShaderMaterial(u.HorizontalBlurShader),o=new s.ShaderMaterial(u.VerticalBlurShader);return o.depthTest=i.depthTest=!1,[e,t,n,a,i,o,r]}),[y,h,p]),P=O[0],S=O[1],q=O[2],B=O[3],C=O[4],E=O[5],k=O[6],D=0;return n.useFrame((function(){if(R.current&&(a===1/0||D<a)){var e=j.background;j.background=null,j.overrideMaterial=q,x.setRenderTarget(P),x.render(j,R.current),j.overrideMaterial=null,B.material=C,B.material.uniforms.tDiffuse.value=P.texture,C.uniforms.h.value=v/256,x.setRenderTarget(k),x.render(B,R.current),B.material=E,B.material.uniforms.tDiffuse.value=k.texture,E.uniforms.v.value=v/256,x.setRenderTarget(P),x.render(B,R.current),x.setRenderTarget(null),j.background=e,D++}})),f.createElement("group",l.default({},T,{ref:r}),f.createElement("mesh",{geometry:S,scale:[1,-1,1],rotation:[-Math.PI/2,0,0]},f.createElement("meshBasicMaterial",{map:P.texture,transparent:!0,opacity:o})),f.createElement("orthographicCamera",{ref:R,args:[-h/2,h/2,p/2,-p/2,0,M]}))}));exports.ContactShadows=c;

package/core/ContactShadows.d.ts

@@ -25,4 +25,5 @@ export declare const ContactShadows: React.ForwardRefExoticComponent<Pick<Omit<i
     blur?: number | undefined;
     far?: number | undefined;
     resolution?: number | undefined;
-}, "visible" | "attach" | "attachArray" | "attachObject" | "args" | "children" | "key" | "onUpdate" | "position" | "up" | "scale" | "rotation" | "matrix" | "quaternion" | "layers" | "dispose" | "type" | "isGroup" | "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" | "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 | "opacity" | "width" | "resolution" | "far" | "height" | "blur"> & React.RefAttributes<unknown>>;
+    frames?: number | undefined;
+}, "visible" | "attach" | "attachArray" | "attachObject" | "args" | "children" | "key" | "onUpdate" | "position" | "up" | "scale" | "rotation" | "matrix" | "quaternion" | "layers" | "dispose" | "type" | "isGroup" | "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" | "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 | "opacity" | "width" | "resolution" | "far" | "frames" | "height" | "blur"> & React.RefAttributes<unknown>>;

package/core/ContactShadows.js

@@ -5,6 +5,7 @@ import { useThree, useFrame } from '@react-three/fiber';
 import { HorizontalBlurShader, VerticalBlurShader } from 'three-stdlib';
 
 const ContactShadows = /*#__PURE__*/React.forwardRef(({
+  frames = Infinity,
   opacity = 1,
   width = 1,
   height = 1,
@@ -36,8 +37,9 @@ const ContactShadows = /*#__PURE__*/React.forwardRef(({
     verticalBlurMaterial.depthTest = horizontalBlurMaterial.depthTest = false;
     return [renderTarget, planeGeometry, depthMaterial, blurPlane, horizontalBlurMaterial, verticalBlurMaterial, renderTargetBlur];
   }, [resolution, width, height]);
+  let count = 0;
   useFrame(() => {
-    if (shadowCamera.current) {
+    if (shadowCamera.current && (frames === Infinity || count < frames)) {
       const initialBackground = scene.background;
       scene.background = null;
       scene.overrideMaterial = depthMaterial;
@@ -56,6 +58,7 @@ const ContactShadows = /*#__PURE__*/React.forwardRef(({
       gl.render(blurPlane, shadowCamera.current);
       gl.setRenderTarget(null);
       scene.background = initialBackground;
+      count++;
     }
   });
   return /*#__PURE__*/React.createElement("group", _extends({}, props, {

package/core/GizmoHelper.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),r=require("@react-three/fiber"),t=require("three"),n=require("./OrthographicCamera.cjs.js"),u=require("./useCamera.cjs.js");function o(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)}require("@babel/runtime/helpers/extends"),require("@babel/runtime/helpers/objectWithoutPropertiesLoose"),require("react-merge-refs");var a=o(e),i=a.createContext({}),c=2*Math.PI,s=new t.Object3D,l=new t.Matrix4,f=new t.Quaternion,p=new t.Quaternion,d=new t.Vector3,h=new t.Vector3;exports.GizmoHelper=function(e){var o=e.alignment,m=void 0===o?"bottom-right":o,g=e.margin,b=void 0===g?[80,80]:g,v=e.onUpdate,y=e.onTarget,w=e.children,j=r.useThree((function(e){return e.size})),q=r.useThree((function(e){return e.camera})),x=r.useThree((function(e){return e.controls})),O=r.useThree((function(e){return e.gl})),T=r.useThree((function(e){return e.scene})),C=r.useThree((function(e){return e.invalidate})),k=a.useRef(),P=a.useRef(),R=a.useRef(null),z=a.useState((function(){return new t.Scene}))[0],E=a.useRef(!1),M=a.useRef(0),D=a.useRef(new t.Vector3(0,0,0));a.useEffect((function(){return T.background&&(k.current=T.background,T.background=null,z.background=k.current),function(){k.current&&(T.background=k.current)}}),[]);r.useFrame((function(e,r){var t;R.current&&P.current&&(!function(e){if(E.current)if(f.angleTo(p)<.01)E.current=!1;else{var r=e*c;f.rotateTowards(p,r),q.position.set(0,0,1).applyQuaternion(f).multiplyScalar(M.current).add(D.current),q.up.set(0,1,0).applyQuaternion(f).normalize(),q.quaternion.copy(f),v?v():x&&x.update(),C()}}(r),l.copy(q.matrix).invert(),null==(t=P.current)||t.quaternion.setFromRotationMatrix(l),O.autoClear=!1,O.clearDepth(),O.render(z,R.current))}));var Q={tweenCamera:function(e){E.current=!0,(x||y)&&(D.current=(null==x?void 0:x.target)||(null==y?void 0:y())),M.current=q.position.distanceTo(d),f.copy(q.quaternion),h.copy(e).multiplyScalar(M.current).add(d),s.lookAt(h),p.copy(s.quaternion),C()},raycast:u.useCamera(R)},S=b[0],_=b[1],V=m.endsWith("-left")?-j.width/2+S:j.width/2-S,W=m.startsWith("top-")?j.height/2-_:-j.height/2+_;return r.createPortal(a.createElement(i.Provider,{value:Q},a.createElement(n.OrthographicCamera,{ref:R,makeDefault:!1,position:[0,0,200]}),a.createElement("group",{ref:P,position:[V,W,0]},w)),z)},exports.useGizmoContext=function(){return a.useContext(i)};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),r=require("@react-three/fiber"),t=require("three"),n=require("./OrthographicCamera.cjs.js"),u=require("./useCamera.cjs.js");function o(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)}require("@babel/runtime/helpers/extends"),require("@babel/runtime/helpers/objectWithoutPropertiesLoose"),require("react-merge-refs");var a=o(e),i=a.createContext({}),c=2*Math.PI,s=new t.Object3D,l=new t.Matrix4,f=new t.Quaternion,p=new t.Quaternion,d=new t.Vector3,h=new t.Vector3;exports.GizmoHelper=function(e){var o=e.alignment,m=void 0===o?"bottom-right":o,g=e.margin,b=void 0===g?[80,80]:g,v=e.renderPriority,y=void 0===v?1:v,w=e.onUpdate,j=e.onTarget,q=e.children,x=r.useThree((function(e){return e.size})),O=r.useThree((function(e){return e.camera})),T=r.useThree((function(e){return e.controls})),C=r.useThree((function(e){return e.gl})),k=r.useThree((function(e){return e.scene})),P=r.useThree((function(e){return e.invalidate})),R=a.useRef(),z=a.useRef(),E=a.useRef(null),M=a.useState((function(){return new t.Scene}))[0],D=a.useRef(!1),Q=a.useRef(0),S=a.useRef(new t.Vector3(0,0,0));a.useEffect((function(){return k.background&&(R.current=k.background,k.background=null,M.background=R.current),function(){R.current&&(k.background=R.current)}}),[]);r.useFrame((function(e,r){var t;E.current&&z.current&&(!function(e){if(D.current)if(f.angleTo(p)<.01)D.current=!1;else{var r=e*c;f.rotateTowards(p,r),O.position.set(0,0,1).applyQuaternion(f).multiplyScalar(Q.current).add(S.current),O.up.set(0,1,0).applyQuaternion(f).normalize(),O.quaternion.copy(f),w?w():T&&T.update(),P()}}(r),l.copy(O.matrix).invert(),null==(t=z.current)||t.quaternion.setFromRotationMatrix(l),C.autoClear=!1,C.clearDepth(),C.render(M,E.current))}),y);var _={tweenCamera:function(e){D.current=!0,(T||j)&&(S.current=(null==T?void 0:T.target)||(null==j?void 0:j())),Q.current=O.position.distanceTo(d),f.copy(O.quaternion),h.copy(e).multiplyScalar(Q.current).add(d),s.lookAt(h),p.copy(s.quaternion),P()},raycast:u.useCamera(E)},V=b[0],W=b[1],F=m.endsWith("-left")?-x.width/2+V:x.width/2-V,G=m.startsWith("top-")?x.height/2-W:-x.height/2+W;return r.createPortal(a.createElement(i.Provider,{value:_},a.createElement(n.OrthographicCamera,{ref:E,makeDefault:!1,position:[0,0,200]}),a.createElement("group",{ref:z,position:[F,G,0]},q)),M)},exports.useGizmoContext=function(){return a.useContext(i)};

package/core/GizmoHelper.d.ts

@@ -7,8 +7,9 @@ export declare const useGizmoContext: () => GizmoHelperContext;
 export declare type GizmoHelperProps = JSX.IntrinsicElements['group'] & {
     alignment?: 'top-left' | 'top-right' | 'bottom-right' | 'bottom-left';
     margin?: [number, number];
+    renderPriority?: number;
     onUpdate?: () => void;
     onTarget?: () => Vector3;
 };
-export declare const GizmoHelper: ({ alignment, margin, onUpdate, onTarget, children: GizmoHelperComponent, }: GizmoHelperProps) => any;
+export declare const GizmoHelper: ({ alignment, margin, renderPriority, onUpdate, onTarget, children: GizmoHelperComponent, }: GizmoHelperProps) => any;
 export {};

package/core/GizmoHelper.js

@@ -18,6 +18,7 @@ const targetPosition = new Vector3();
 const GizmoHelper = ({
   alignment = 'bottom-right',
   margin = [80, 80],
+  renderPriority = 1,
   onUpdate,
   onTarget,
   children: GizmoHelperComponent
@@ -113,7 +114,7 @@ const GizmoHelper = ({
       gl.clearDepth();
       gl.render(virtualScene, virtualCam.current);
     }
-  });
+  }, renderPriority);
   const gizmoHelperContext = {
     tweenCamera,
     raycast: useCamera(virtualCam)

package/core/Instances.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@babel/runtime/helpers/extends"),r=require("@babel/runtime/helpers/objectWithoutPropertiesLoose"),t=require("three"),n=require("react"),u=require("@react-three/fiber"),a=require("react-merge-refs"),i=require("../helpers/Position.cjs.js");function o(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function c(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)}require("@babel/runtime/helpers/inheritsLoose");var l,s,f=o(e),d=o(r),m=c(t),p=c(n),b=o(a),h=p.createContext(null),v=new m.Matrix4,y=new m.Matrix4,x=new m.Matrix4,M=new m.Color,g=new m.Vector3,w=new m.Quaternion,j=new m.Vector3,A=p.forwardRef((function(e,r){var t=e.children,n=e.range,a=e.limit,i=void 0===a?1e3:a,o=d.default(e,["children","range","limit"]),c=p.useRef(null),m=p.useState([]),A=m[0],q=m[1],E=p.useState((function(){var e=new Float32Array(16*i);for(l=0;l<i;l++)x.identity().toArray(e,16*l);return[e,new Float32Array([].concat(new Array(3*i)).map((function(){return 1})))]}))[0],O=E[0],P=E[1];p.useLayoutEffect((function(){c.current.count=c.current.instanceMatrix.updateRange.count=c.current.instanceColor.updateRange.count=Math.min(i,void 0!==n?n:i,A.length)}),[A,n]),p.useEffect((function(){c.current.instanceMatrix.needsUpdate=!0})),u.useFrame((function(e){for(c.current.updateMatrix(),c.current.updateMatrixWorld(),v.copy(c.current.matrixWorld).invert(),l=0;l<A.length;l++)(s=A[l].current).matrixWorld.decompose(g,w,j),y.compose(g,w,j).premultiply(v),y.equals(x.fromArray(O,16*l))||(y.toArray(O,16*l),c.current.instanceMatrix.needsUpdate=!0),s.color.equals(M.fromArray(P,3*l))||(s.color.toArray(P,3*l),c.current.instanceColor.needsUpdate=!0)}));var _=p.useMemo((function(){var e={};for(l=0;l<A.length;l++){var r;Object.assign(e,null==(r=A[l].current)?void 0:r.__r3f.handlers)}return Object.keys(e).reduce((function(e,r){var t;return f.default({},e,((t={})[r]=function(e){var t,n,u;return null==(t=A[e.instanceId].current)||null==(n=t.__r3f)||null==(u=n.handlers)?void 0:u[r](e)},t))}),{})}),[A]),C=p.useMemo((function(){return{subscribe:function(e){return q((function(r){return[].concat(r,[e])})),function(){return q((function(r){return r.filter((function(r){return r.current!==e.current}))}))}}}}),[]);return p.createElement("instancedMesh",f.default({matrixAutoUpdate:!1,ref:b.default([r,c]),args:[null,null,0]},_,o),p.createElement("instancedBufferAttribute",{attach:"instanceMatrix",count:O.length/16,array:O,itemSize:16}),p.createElement("instancedBufferAttribute",{attach:"instanceColor",count:P.length/3,array:P,itemSize:3}),p.createElement(h.Provider,{value:C},t))})),q=p.forwardRef((function(e,r){var t=e.children,n=d.default(e,["children"]);p.useMemo((function(){return u.extend({Position:i.Position})}),[]);var a=p.useRef(),o=p.useContext(h).subscribe;return p.useLayoutEffect((function(){return o(a)}),[]),p.createElement("position",f.default({ref:b.default([r,a])},n),t)}));exports.Instance=q,exports.Instances=A;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@babel/runtime/helpers/extends"),r=require("@babel/runtime/helpers/objectWithoutPropertiesLoose"),t=require("three"),n=require("react"),u=require("@react-three/fiber"),a=require("react-merge-refs"),c=require("react-composer"),o=require("../helpers/Position.cjs.js");function i(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function l(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)}require("@babel/runtime/helpers/inheritsLoose");var s,f,d=i(e),m=i(r),p=l(t),v=l(n),y=i(a),h=i(c),b=v.createContext(null),x=new p.Matrix4,g=new p.Matrix4,M=new p.Matrix4,w=new p.Color,j=new p.Vector3,A=new p.Quaternion,E=new p.Vector3,q=v.forwardRef((function(e,r){var t=e.context,n=e.children,a=m.default(e,["context","children"]);v.useMemo((function(){return u.extend({Position:o.Position})}),[]);var c=v.useRef(),i=v.useContext(t||b).subscribe;return v.useLayoutEffect((function(){return i(c)}),[]),v.createElement("position",d.default({ref:y.default([r,c])},a),n)})),O=v.forwardRef((function(e,r){var t=e.children,n=e.range,a=e.limit,c=void 0===a?1e3:a,o=e.frames,i=void 0===o?1/0:o,l=m.default(e,["children","range","limit","frames"]),h=v.useState((function(){var e=v.createContext(null);return[e,function(r){return v.createElement(q,d.default({context:e},r))}]}))[0],O=h[0],P=h[1],_=v.useRef(null),C=v.useState([]),R=C[0],U=C[1],D=v.useState((function(){var e=new Float32Array(16*c);for(s=0;s<c;s++)M.identity().toArray(e,16*s);return[e,new Float32Array([].concat(new Array(3*c)).map((function(){return 1})))]}))[0],S=D[0],L=D[1];v.useLayoutEffect((function(){_.current.count=_.current.instanceMatrix.updateRange.count=_.current.instanceColor.updateRange.count=Math.min(c,void 0!==n?n:c,R.length)}),[R,n]),v.useEffect((function(){_.current.instanceMatrix.needsUpdate=!0}));var W=0;u.useFrame((function(e){if(i===1/0||W<i){for(_.current.updateMatrix(),_.current.updateMatrixWorld(),x.copy(_.current.matrixWorld).invert(),s=0;s<R.length;s++)(f=R[s].current).matrixWorld.decompose(j,A,E),g.compose(j,A,E).premultiply(x),g.equals(M.fromArray(S,16*s))||(g.toArray(S,16*s),_.current.instanceMatrix.needsUpdate=!0),f.color.equals(w.fromArray(L,3*s))||(f.color.toArray(L,3*s),_.current.instanceColor.needsUpdate=!0);W++}}));var k=v.useMemo((function(){var e={};for(s=0;s<R.length;s++){var r;Object.assign(e,null==(r=R[s].current)?void 0:r.__r3f.handlers)}return Object.keys(e).reduce((function(e,r){var t;return d.default({},e,((t={})[r]=function(e){var t,n,u;return null==(t=R[e.instanceId].current)||null==(n=t.__r3f)||null==(u=n.handlers)?void 0:u[r](e)},t))}),{})}),[R]),z=v.useMemo((function(){return{subscribe:function(e){return U((function(r){return[].concat(r,[e])})),function(){return U((function(r){return r.filter((function(r){return r.current!==e.current}))}))}}}}),[]);return v.createElement("instancedMesh",d.default({matrixAutoUpdate:!1,ref:y.default([r,_]),args:[null,null,0]},k,l),v.createElement("instancedBufferAttribute",{attach:"instanceMatrix",count:S.length/16,array:S,itemSize:16,usage:p.DynamicDrawUsage}),v.createElement("instancedBufferAttribute",{attach:"instanceColor",count:L.length/3,array:L,itemSize:3,usage:p.DynamicDrawUsage}),"function"==typeof t?v.createElement(O.Provider,{value:z},t(P)):v.createElement(b.Provider,{value:z},t))}));exports.Instance=q,exports.Instances=O,exports.Merged=function(e){var r=e.meshes,t=e.children,n=m.default(e,["meshes","children"]),u=Array.isArray(r);return v.createElement(h.default,{components:(u?r:Object.values(r)).map((function(e){var r=e.geometry,t=e.material;return v.createElement(O,d.default({geometry:r,material:t},n))}))},(function(e){return u?t.apply(void 0,e):t(Object.keys(r).reduce((function(r,t,n){var u;return d.default({},r,((u={})[t]=e[n],u))}),{}))}))};

package/core/Instances.d.ts

@@ -1,5 +1,30 @@
 import * as THREE from 'three';
 import * as React from 'react';
+import { Position } from '../helpers/Position';
+declare type Api = {
+    subscribe: (ref: any) => void;
+};
+declare const Instance: React.ForwardRefExoticComponent<Pick<Omit<import("@react-three/fiber").Node<Position, typeof Position>, import("@react-three/fiber").NonFunctionKeys<{
+    position?: import("@react-three/fiber").Vector3 | undefined;
+    up?: import("@react-three/fiber").Vector3 | undefined;
+    scale?: import("@react-three/fiber").Vector3 | undefined;
+    rotation?: import("@react-three/fiber").Euler | undefined;
+    matrix?: import("@react-three/fiber").Matrix4 | undefined;
+    quaternion?: import("@react-three/fiber").Quaternion | undefined;
+    layers?: import("@react-three/fiber").Layers | undefined;
+    dispose?: (() => void) | null | undefined;
+}>> & {
+    position?: import("@react-three/fiber").Vector3 | undefined;
+    up?: import("@react-three/fiber").Vector3 | undefined;
+    scale?: import("@react-three/fiber").Vector3 | undefined;
+    rotation?: import("@react-three/fiber").Euler | undefined;
+    matrix?: import("@react-three/fiber").Matrix4 | undefined;
+    quaternion?: import("@react-three/fiber").Quaternion | undefined;
+    layers?: import("@react-three/fiber").Layers | undefined;
+    dispose?: (() => void) | null | undefined;
+} & import("@react-three/fiber/dist/declarations/src/core/events").EventHandlers & {
+    context?: React.Context<Api> | undefined;
+}, "visible" | "attach" | "attachArray" | "attachObject" | "args" | "children" | "key" | "onUpdate" | "position" | "up" | "scale" | "rotation" | "matrix" | "quaternion" | "layers" | "dispose" | "type" | "isGroup" | "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" | "clear" | "getObjectById" | "getObjectByName" | "getObjectByProperty" | "getWorldPosition" | "getWorldQuaternion" | "getWorldScale" | "getWorldDirection" | "raycast" | "traverse" | "traverseVisible" | "traverseAncestors" | "updateMatrix" | "updateMatrixWorld" | "updateWorldMatrix" | "toJSON" | "clone" | "copy" | "addEventListener" | "hasEventListener" | "removeEventListener" | "dispatchEvent" | "color" | keyof import("@react-three/fiber/dist/declarations/src/core/events").EventHandlers | "context"> & React.RefAttributes<unknown>>;
 declare const Instances: React.ForwardRefExoticComponent<Pick<Omit<import("@react-three/fiber").Node<THREE.InstancedMesh<THREE.BufferGeometry, THREE.Material | THREE.Material[]>, typeof THREE.InstancedMesh>, import("@react-three/fiber").NonFunctionKeys<{
     position?: import("@react-three/fiber").Vector3 | undefined;
     up?: import("@react-three/fiber").Vector3 | undefined;
@@ -21,6 +46,11 @@ declare const Instances: React.ForwardRefExoticComponent<Pick<Omit<import("@reac
 } & import("@react-three/fiber/dist/declarations/src/core/events").EventHandlers & {
     range?: number | undefined;
     limit?: number | undefined;
-}, "visible" | "attach" | "attachArray" | "attachObject" | "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" | "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 | "range" | "material" | "geometry" | "morphTargetInfluences" | "morphTargetDictionary" | "isMesh" | "updateMorphTargets" | "count" | "instanceColor" | "instanceMatrix" | "isInstancedMesh" | "getColorAt" | "getMatrixAt" | "setColorAt" | "setMatrixAt" | "limit"> & React.RefAttributes<THREE.InstancedMesh<THREE.BufferGeometry, THREE.Material | THREE.Material[]>>>;
-declare const Instance: React.ForwardRefExoticComponent<React.RefAttributes<unknown>>;
-export { Instances, Instance };
+    frames?: number | undefined;
+}, "visible" | "attach" | "attachArray" | "attachObject" | "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" | "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 | "range" | "material" | "geometry" | "morphTargetInfluences" | "morphTargetDictionary" | "isMesh" | "updateMorphTargets" | "frames" | "count" | "instanceColor" | "instanceMatrix" | "isInstancedMesh" | "getColorAt" | "getMatrixAt" | "setColorAt" | "setMatrixAt" | "limit"> & React.RefAttributes<THREE.InstancedMesh<THREE.BufferGeometry, THREE.Material | THREE.Material[]>>>;
+declare function Merged({ meshes, children, ...props }: {
+    [x: string]: any;
+    meshes: any;
+    children: any;
+}): JSX.Element;
+export { Instances, Instance, Merged };

package/core/Instances.js

@@ -1,12 +1,13 @@
 import _extends from '@babel/runtime/helpers/esm/extends';
 import * as THREE from 'three';
 import * as React from 'react';
-import { useFrame, extend } from '@react-three/fiber';
+import { extend, useFrame } from '@react-three/fiber';
 import mergeRefs from 'react-merge-refs';
+import Composer from 'react-composer';
 import { Position } from '../helpers/Position.js';
 
 let i, instanceRef;
-const context = /*#__PURE__*/React.createContext(null);
+const globalContext = /*#__PURE__*/React.createContext(null);
 const parentMatrix = new THREE.Matrix4();
 const instanceMatrix = new THREE.Matrix4();
 const tempMatrix = new THREE.Matrix4();
@@ -14,12 +15,39 @@ const color = new THREE.Color();
 const translation = new THREE.Vector3();
 const rotation = new THREE.Quaternion();
 const scale = new THREE.Vector3();
+const Instance = /*#__PURE__*/React.forwardRef(({
+  context,
+  children,
+  ...props
+}, ref) => {
+  React.useMemo(() => extend({
+    Position
+  }), []);
+  const group = React.useRef();
+  const {
+    subscribe
+  } = React.useContext(context || globalContext);
+  React.useLayoutEffect(() => subscribe(group), []);
+  return /*#__PURE__*/React.createElement("position", _extends({
+    ref: mergeRefs([ref, group])
+  }, props), children);
+});
 const Instances = /*#__PURE__*/React.forwardRef(({
   children,
   range,
   limit = 1000,
+  frames = Infinity,
   ...props
 }, ref) => {
+  const [[context, instance]] = React.useState(() => {
+    const c = /*#__PURE__*/React.createContext(null);
+
+    const i = props => /*#__PURE__*/React.createElement(Instance, _extends({
+      context: c
+    }, props));
+
+    return [c, i];
+  });
   const parentRef = React.useRef(null);
   const [instances, setInstances] = React.useState([]);
   const [[matrices, colors]] = React.useState(() => {
@@ -36,27 +64,32 @@ const Instances = /*#__PURE__*/React.forwardRef(({
     // We might be a frame too late? 🤷‍♂️
     parentRef.current.instanceMatrix.needsUpdate = true;
   });
+  let count = 0;
   useFrame(state => {
-    parentRef.current.updateMatrix();
-    parentRef.current.updateMatrixWorld();
-    parentMatrix.copy(parentRef.current.matrixWorld).invert();
+    if (frames === Infinity || count < frames) {
+      parentRef.current.updateMatrix();
+      parentRef.current.updateMatrixWorld();
+      parentMatrix.copy(parentRef.current.matrixWorld).invert();
 
-    for (i = 0; i < instances.length; i++) {
-      instanceRef = instances[i].current; // Multiply the inverse of the InstancedMesh world matrix or else
-      // Instances will be double-transformed if <Instances> isn't at identity
+      for (i = 0; i < instances.length; i++) {
+        instanceRef = instances[i].current; // Multiply the inverse of the InstancedMesh world matrix or else
+        // Instances will be double-transformed if <Instances> isn't at identity
 
-      instanceRef.matrixWorld.decompose(translation, rotation, scale);
-      instanceMatrix.compose(translation, rotation, scale).premultiply(parentMatrix);
+        instanceRef.matrixWorld.decompose(translation, rotation, scale);
+        instanceMatrix.compose(translation, rotation, scale).premultiply(parentMatrix);
 
-      if (!instanceMatrix.equals(tempMatrix.fromArray(matrices, i * 16))) {
-        instanceMatrix.toArray(matrices, i * 16);
-        parentRef.current.instanceMatrix.needsUpdate = true;
-      }
+        if (!instanceMatrix.equals(tempMatrix.fromArray(matrices, i * 16))) {
+          instanceMatrix.toArray(matrices, i * 16);
+          parentRef.current.instanceMatrix.needsUpdate = true;
+        }
 
-      if (!instanceRef.color.equals(color.fromArray(colors, i * 3))) {
-        instanceRef.color.toArray(colors, i * 3);
-        parentRef.current.instanceColor.needsUpdate = true;
+        if (!instanceRef.color.equals(color.fromArray(colors, i * 3))) {
+          instanceRef.color.toArray(colors, i * 3);
+          parentRef.current.instanceColor.needsUpdate = true;
+        }
       }
+
+      count++;
     }
   });
   const events = React.useMemo(() => {
@@ -90,31 +123,38 @@ const Instances = /*#__PURE__*/React.forwardRef(({
     attach: "instanceMatrix",
     count: matrices.length / 16,
     array: matrices,
-    itemSize: 16
+    itemSize: 16,
+    usage: THREE.DynamicDrawUsage
   }), /*#__PURE__*/React.createElement("instancedBufferAttribute", {
     attach: "instanceColor",
     count: colors.length / 3,
     array: colors,
-    itemSize: 3
-  }), /*#__PURE__*/React.createElement(context.Provider, {
+    itemSize: 3,
+    usage: THREE.DynamicDrawUsage
+  }), typeof children === 'function' ? /*#__PURE__*/React.createElement(context.Provider, {
+    value: api
+  }, children(instance)) : /*#__PURE__*/React.createElement(globalContext.Provider, {
     value: api
   }, children));
 });
-const Instance = /*#__PURE__*/React.forwardRef(({
+
+function Merged({
+  meshes,
   children,
   ...props
-}, ref) => {
-  React.useMemo(() => extend({
-    Position
-  }), []);
-  const group = React.useRef();
-  const {
-    subscribe
-  } = React.useContext(context);
-  React.useLayoutEffect(() => subscribe(group), []);
-  return /*#__PURE__*/React.createElement("position", _extends({
-    ref: mergeRefs([ref, group])
-  }, props), children);
-});
+}) {
+  const isArray = Array.isArray(meshes);
+  return /*#__PURE__*/React.createElement(Composer, {
+    components: (isArray ? meshes : Object.values(meshes)).map(({
+      geometry,
+      material
+    }) => /*#__PURE__*/React.createElement(Instances, _extends({
+      geometry: geometry,
+      material: material
+    }, props)))
+  }, args => isArray ? children(...args) : children(Object.keys(meshes).reduce((acc, key, i) => ({ ...acc,
+    [key]: args[i]
+  }), {})));
+}
 
-export { Instance, Instances };
+export { Instance, Instances, Merged };

package/core/Points.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@babel/runtime/helpers/extends"),t=require("@babel/runtime/helpers/objectWithoutPropertiesLoose"),r=require("three"),n=require("react"),u=require("@react-three/fiber"),o=require("react-merge-refs"),i=require("../helpers/Position.cjs.js");function a(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function c(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)}require("@babel/runtime/helpers/inheritsLoose");var l,f,s=a(e),d=a(t),b=c(r),m=c(n),p=a(o),y=m.createContext(null),h=new b.Matrix4,v=new b.Vector3,g=new b.Color,x=m.forwardRef((function(e,t){var r=e.children,n=e.range,o=e.limit,i=void 0===o?1e3:o,a=d.default(e,["children","range","limit"]),c=m.useRef(null),b=m.useState([]),x=b[0],j=b[1],O=m.useState((function(){return[new Float32Array(3*i),new Float32Array([].concat(new Array(3*i)).map((function(){return 1})))]}))[0],P=O[0],w=O[1];m.useLayoutEffect((function(){c.current.geometry.drawRange.count=Math.min(i,void 0!==n?n:i,x.length)}),[x,n]),m.useEffect((function(){c.current.geometry.attributes.position.needsUpdate=!0})),u.useFrame((function(){for(c.current.updateMatrix(),c.current.updateMatrixWorld(),h.copy(c.current.matrixWorld).invert(),l=0;l<x.length;l++)(f=x[l].current).getWorldPosition(v).applyMatrix4(h),v.x===P[3*l]&&v.y===P[3*l+1]&&v.z===P[3*l+2]||(v.toArray(P,3*l),c.current.geometry.attributes.position.needsUpdate=!0,f.matrixWorldNeedsUpdate=!0),f.color.equals(g.fromArray(w,3*l))||(f.color.toArray(w,3*l),c.current.geometry.attributes.color.needsUpdate=!0)}));var E=m.useMemo((function(){var e={};for(l=0;l<x.length;l++){var t;Object.assign(e,null==(t=x[l].current)?void 0:t.__r3f.handlers)}return Object.keys(e).reduce((function(e,t){var r;return s.default({},e,((r={})[t]=function(e){var r,n,u;return null==(r=x[e.index].current)||null==(n=r.__r3f)||null==(u=n.handlers)?void 0:u[t](e)},r))}),{})}),[x]),M=m.useMemo((function(){return{subscribe:function(e){return j((function(t){return[].concat(t,[e])})),function(){return j((function(t){return t.filter((function(t){return t.current!==e.current}))}))}}}}),[]);return m.createElement("points",s.default({matrixAutoUpdate:!1,ref:p.default([t,c])},E,a),m.createElement("bufferGeometry",null,m.createElement("bufferAttribute",{attachObject:["attributes","position"],count:P.length/3,array:P,itemSize:3}),m.createElement("bufferAttribute",{attachObject:["attributes","color"],count:w.length/3,array:w,itemSize:3})),m.createElement(y.Provider,{value:M},r))})),j=m.forwardRef((function(e,t){var r=e.children,n=d.default(e,["children"]);m.useMemo((function(){return u.extend({Position:i.Position})}),[]);var o=m.useRef(),a=m.useContext(y).subscribe;return m.useLayoutEffect((function(){return a(o)}),[]),m.createElement("position",s.default({ref:p.default([t,o])},n),r)}));exports.Point=j,exports.Points=x;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@babel/runtime/helpers/extends"),r=require("@babel/runtime/helpers/objectWithoutPropertiesLoose"),t=require("three"),n=require("react"),u=require("@react-three/fiber"),o=require("react-merge-refs"),a=require("../helpers/Position.cjs.js");function i(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function c(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)}require("@babel/runtime/helpers/inheritsLoose");var l,f,s=i(e),d=i(r),b=c(t),m=c(n),p=i(o),y=m.createContext(null),h=new b.Matrix4,g=new b.Vector3,v=new b.Color,x=m.forwardRef((function(e,r){var t=e.children,n=e.range,o=e.limit,a=void 0===o?1e3:o,i=d.default(e,["children","range","limit"]),c=m.useRef(null),x=m.useState([]),j=x[0],w=x[1],O=m.useState((function(){return[new Float32Array(3*a),new Float32Array([].concat(new Array(3*a)).map((function(){return 1})))]}))[0],P=O[0],E=O[1];m.useLayoutEffect((function(){c.current.geometry.drawRange.count=Math.min(a,void 0!==n?n:a,j.length)}),[j,n]),m.useEffect((function(){c.current.geometry.attributes.position.needsUpdate=!0})),u.useFrame((function(){for(c.current.updateMatrix(),c.current.updateMatrixWorld(),h.copy(c.current.matrixWorld).invert(),l=0;l<j.length;l++)(f=j[l].current).getWorldPosition(g).applyMatrix4(h),g.x===P[3*l]&&g.y===P[3*l+1]&&g.z===P[3*l+2]||(g.toArray(P,3*l),c.current.geometry.attributes.position.needsUpdate=!0,f.matrixWorldNeedsUpdate=!0),f.color.equals(v.fromArray(E,3*l))||(f.color.toArray(E,3*l),c.current.geometry.attributes.color.needsUpdate=!0)}));var M=m.useMemo((function(){var e={};for(l=0;l<j.length;l++){var r;Object.assign(e,null==(r=j[l].current)?void 0:r.__r3f.handlers)}return Object.keys(e).reduce((function(e,r){var t;return s.default({},e,((t={})[r]=function(e){var t,n,u;return null==(t=j[e.index].current)||null==(n=t.__r3f)||null==(u=n.handlers)?void 0:u[r](e)},t))}),{})}),[j]),q=m.useMemo((function(){return{subscribe:function(e){return w((function(r){return[].concat(r,[e])})),function(){return w((function(r){return r.filter((function(r){return r.current!==e.current}))}))}}}}),[]);return m.createElement("points",s.default({matrixAutoUpdate:!1,ref:p.default([r,c])},M,i),m.createElement("bufferGeometry",null,m.createElement("bufferAttribute",{attachObject:["attributes","position"],count:P.length/3,array:P,itemSize:3,usage:b.DynamicDrawUsage}),m.createElement("bufferAttribute",{attachObject:["attributes","color"],count:E.length/3,array:E,itemSize:3,usage:b.DynamicDrawUsage})),m.createElement(y.Provider,{value:q},t))})),j=m.forwardRef((function(e,r){var t=e.children,n=d.default(e,["children"]);m.useMemo((function(){return u.extend({Position:a.Position})}),[]);var o=m.useRef(),i=m.useContext(y).subscribe;return m.useLayoutEffect((function(){return i(o)}),[]),m.createElement("position",s.default({ref:p.default([r,o])},n),t)}));exports.Point=j,exports.Points=x;

package/core/Points.js

@@ -77,12 +77,14 @@ const Points = /*#__PURE__*/React.forwardRef(({
     attachObject: ['attributes', 'position'],
     count: positions.length / 3,
     array: positions,
-    itemSize: 3
+    itemSize: 3,
+    usage: THREE.DynamicDrawUsage
   }), /*#__PURE__*/React.createElement("bufferAttribute", {
     attachObject: ['attributes', 'color'],
     count: colors.length / 3,
     array: colors,
-    itemSize: 3
+    itemSize: 3,
+    usage: THREE.DynamicDrawUsage
   })), /*#__PURE__*/React.createElement(context.Provider, {
     value: api
   }, children));

package/core/index.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("./Billboard.cjs.js"),r=require("./Cloud.cjs.js"),s=require("./QuadraticBezierLine.cjs.js"),t=require("./CubicBezierLine.cjs.js"),o=require("./Line.cjs.js"),i=require("./PositionalAudio.cjs.js"),u=require("./Text.cjs.js"),a=require("./Environment.cjs.js"),p=require("./Effects.cjs.js"),c=require("./GradientTexture.cjs.js"),j=require("./OrthographicCamera.cjs.js"),n=require("./PerspectiveCamera.cjs.js"),l=require("./CameraShake.cjs.js"),x=require("./CubeCamera.cjs.js"),q=require("./DeviceOrientationControls.cjs.js"),d=require("./FlyControls.cjs.js"),h=require("./MapControls.cjs.js"),C=require("./OrbitControls.cjs.js"),m=require("./TrackballControls.cjs.js"),b=require("./TransformControls.cjs.js"),P=require("./PointerLockControls.cjs.js"),S=require("./FirstPersonControls.cjs.js"),T=require("./GizmoHelper.cjs.js"),f=require("./GizmoViewcube.cjs.js"),M=require("./GizmoViewport.cjs.js"),B=require("./useCubeTexture.cjs.js"),v=require("./useFBX.cjs.js"),g=require("./useGLTF.cjs.js"),L=require("./useProgress.cjs.js"),G=require("./useTexture.cjs.js"),D=require("./Reflector.cjs.js"),z=require("./Shadow.cjs.js"),A=require("./Stats.cjs.js"),F=require("./Center.cjs.js"),O=require("./DepthBuffer.cjs.js"),w=require("./useAspect.cjs.js"),E=require("./useCamera.cjs.js"),k=require("./useDetectGPU.cjs.js"),y=require("./useHelper.cjs.js"),I=require("./useBVH.cjs.js"),H=require("./useContextBridge.cjs.js"),R=require("./useAnimations.cjs.js"),V=require("./useFBO.cjs.js"),Q=require("./useSimplification.cjs.js"),W=require("./useTessellation.cjs.js"),N=require("./useEdgeSplit.cjs.js"),U=require("./CurveModifier.cjs.js"),X=require("./MeshDistortMaterial.cjs.js"),K=require("./MeshWobbleMaterial.cjs.js"),_=require("./PointMaterial.cjs.js"),J=require("./shaderMaterial.cjs.js"),Y=require("./Sky.cjs.js"),Z=require("./softShadows.cjs.js"),$=require("./Stars.cjs.js"),ee=require("./ContactShadows.cjs.js"),re=require("./SpotLight.cjs.js"),se=require("./shapes.cjs.js"),te=require("./RoundedBox.cjs.js"),oe=require("./ScreenQuad.cjs.js"),ie=require("./useMatcapTexture.cjs.js"),ue=require("./useNormalTexture.cjs.js"),ae=require("./Stage.cjs.js"),pe=require("./Points.cjs.js"),ce=require("./Instances.cjs.js"),je=require("./Detailed.cjs.js"),ne=require("./Preload.cjs.js"),le=require("./meshBounds.cjs.js"),xe=require("./AdaptiveDpr.cjs.js"),qe=require("./AdaptiveEvents.cjs.js");require("@babel/runtime/helpers/extends"),require("@babel/runtime/helpers/objectWithoutPropertiesLoose"),require("react"),require("@react-three/fiber"),require("react-merge-refs"),require("../assets/cloud.base64.cjs.js"),require("../helpers/base64.cjs.js"),require("blob-polyfill"),require("three"),require("@babel/runtime/helpers/construct"),require("three-stdlib"),require("troika-three-text"),require("use-asset"),require("../helpers/environment-assets.cjs.js"),require("lodash.omit"),require("lodash.pick"),require("zustand"),require("../materials/MeshReflectorMaterial.cjs.js"),require("@babel/runtime/helpers/createClass"),require("@babel/runtime/helpers/inheritsLoose"),require("three/examples/js/libs/stats.min"),require("../helpers/useEffectfulState.cjs.js"),require("detect-gpu"),require("three-mesh-bvh"),require("@babel/runtime/helpers/assertThisInitialized"),require("../materials/SpotLightMaterial.cjs.js"),require("../helpers/matcap-assets.cjs.js"),require("../helpers/normal-assets.cjs.js"),require("../helpers/Position.cjs.js"),exports.Billboard=e.Billboard,exports.Cloud=r.Cloud,exports.QuadraticBezierLine=s.QuadraticBezierLine,exports.CubicBezierLine=t.CubicBezierLine,exports.Line=o.Line,exports.PositionalAudio=i.PositionalAudio,exports.Text=u.Text,exports.Environment=a.Environment,exports.Effects=p.Effects,exports.isWebGL2Available=p.isWebGL2Available,exports.GradientTexture=c.GradientTexture,exports.OrthographicCamera=j.OrthographicCamera,exports.PerspectiveCamera=n.PerspectiveCamera,exports.CameraShake=l.CameraShake,exports.CubeCamera=x.CubeCamera,exports.DeviceOrientationControls=q.DeviceOrientationControls,exports.FlyControls=d.FlyControls,exports.MapControls=h.MapControls,exports.OrbitControls=C.OrbitControls,exports.TrackballControls=m.TrackballControls,exports.TransformControls=b.TransformControls,exports.PointerLockControls=P.PointerLockControls,exports.FirstPersonControls=S.FirstPersonControls,exports.GizmoHelper=T.GizmoHelper,exports.useGizmoContext=T.useGizmoContext,exports.GizmoViewcube=f.GizmoViewcube,exports.GizmoViewport=M.GizmoViewport,exports.useCubeTexture=B.useCubeTexture,exports.useFBX=v.useFBX,exports.useGLTF=g.useGLTF,exports.useProgress=L.useProgress,exports.IsObject=G.IsObject,exports.useTexture=G.useTexture,exports.Reflector=D.Reflector,exports.Shadow=z.Shadow,exports.Stats=A.Stats,exports.Center=F.Center,exports.DepthBuffer=O.DepthBuffer,exports.useAspect=w.useAspect,exports.useCamera=E.useCamera,exports.useDetectGPU=k.useDetectGPU,exports.useHelper=y.useHelper,exports.useBVH=I.useBVH,exports.useContextBridge=H.useContextBridge,exports.useAnimations=R.useAnimations,exports.useFBO=V.useFBO,exports.useSimplification=Q.useSimplification,exports.useTessellation=W.useTessellation,exports.useEdgeSplit=N.useEdgeSplit,exports.CurveModifier=U.CurveModifier,exports.MeshDistortMaterial=X.MeshDistortMaterial,exports.MeshWobbleMaterial=K.MeshWobbleMaterial,exports.PointMaterial=_.PointMaterial,exports.PointMaterialImpl=_.PointMaterialImpl,exports.shaderMaterial=J.shaderMaterial,exports.Sky=Y.Sky,exports.calcPosFromAngles=Y.calcPosFromAngles,exports.softShadows=Z.softShadows,exports.Stars=$.Stars,exports.ContactShadows=ee.ContactShadows,exports.SpotLight=re.SpotLight,exports.Box=se.Box,exports.Circle=se.Circle,exports.Cone=se.Cone,exports.Cylinder=se.Cylinder,exports.Dodecahedron=se.Dodecahedron,exports.Extrude=se.Extrude,exports.Icosahedron=se.Icosahedron,exports.Lathe=se.Lathe,exports.Octahedron=se.Octahedron,exports.Parametric=se.Parametric,exports.Plane=se.Plane,exports.Polyhedron=se.Polyhedron,exports.Ring=se.Ring,exports.Sphere=se.Sphere,exports.Tetrahedron=se.Tetrahedron,exports.Torus=se.Torus,exports.TorusKnot=se.TorusKnot,exports.Tube=se.Tube,exports.RoundedBox=te.RoundedBox,exports.ScreenQuad=oe.ScreenQuad,exports.useMatcapTexture=ie.useMatcapTexture,exports.useNormalTexture=ue.useNormalTexture,exports.Stage=ae.Stage,exports.Point=pe.Point,exports.Points=pe.Points,exports.Instance=ce.Instance,exports.Instances=ce.Instances,exports.Detailed=je.Detailed,exports.Preload=ne.Preload,exports.meshBounds=le.meshBounds,exports.AdaptiveDpr=xe.AdaptiveDpr,exports.AdaptiveEvents=qe.AdaptiveEvents;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("./Billboard.cjs.js"),r=require("./Cloud.cjs.js"),s=require("./QuadraticBezierLine.cjs.js"),t=require("./CubicBezierLine.cjs.js"),o=require("./Line.cjs.js"),i=require("./PositionalAudio.cjs.js"),u=require("./Text.cjs.js"),a=require("./Environment.cjs.js"),p=require("./Effects.cjs.js"),c=require("./GradientTexture.cjs.js"),j=require("./OrthographicCamera.cjs.js"),n=require("./PerspectiveCamera.cjs.js"),l=require("./CameraShake.cjs.js"),x=require("./CubeCamera.cjs.js"),q=require("./DeviceOrientationControls.cjs.js"),d=require("./FlyControls.cjs.js"),h=require("./MapControls.cjs.js"),C=require("./OrbitControls.cjs.js"),m=require("./TrackballControls.cjs.js"),b=require("./TransformControls.cjs.js"),S=require("./PointerLockControls.cjs.js"),P=require("./FirstPersonControls.cjs.js"),T=require("./GizmoHelper.cjs.js"),f=require("./GizmoViewcube.cjs.js"),B=require("./GizmoViewport.cjs.js"),M=require("./useCubeTexture.cjs.js"),g=require("./useFBX.cjs.js"),v=require("./useGLTF.cjs.js"),L=require("./useProgress.cjs.js"),G=require("./useTexture.cjs.js"),D=require("./Reflector.cjs.js"),z=require("./Shadow.cjs.js"),A=require("./Stats.cjs.js"),w=require("./Center.cjs.js"),k=require("./DepthBuffer.cjs.js"),F=require("./useAspect.cjs.js"),O=require("./useCamera.cjs.js"),E=require("./useDetectGPU.cjs.js"),y=require("./useHelper.cjs.js"),I=require("./useBVH.cjs.js"),H=require("./useContextBridge.cjs.js"),R=require("./useAnimations.cjs.js"),V=require("./useFBO.cjs.js"),Q=require("./useSimplification.cjs.js"),W=require("./useTessellation.cjs.js"),N=require("./useEdgeSplit.cjs.js"),U=require("./CurveModifier.cjs.js"),X=require("./MeshDistortMaterial.cjs.js"),K=require("./MeshWobbleMaterial.cjs.js"),_=require("./PointMaterial.cjs.js"),J=require("./shaderMaterial.cjs.js"),Y=require("./Sky.cjs.js"),Z=require("./softShadows.cjs.js"),$=require("./Stars.cjs.js"),ee=require("./ContactShadows.cjs.js"),re=require("./SpotLight.cjs.js"),se=require("./shapes.cjs.js"),te=require("./RoundedBox.cjs.js"),oe=require("./ScreenQuad.cjs.js"),ie=require("./useMatcapTexture.cjs.js"),ue=require("./useNormalTexture.cjs.js"),ae=require("./Stage.cjs.js"),pe=require("./Points.cjs.js"),ce=require("./Instances.cjs.js"),je=require("./Detailed.cjs.js"),ne=require("./Preload.cjs.js"),le=require("./BakeShadows.cjs.js"),xe=require("./meshBounds.cjs.js"),qe=require("./AdaptiveDpr.cjs.js"),de=require("./AdaptiveEvents.cjs.js");require("@babel/runtime/helpers/extends"),require("@babel/runtime/helpers/objectWithoutPropertiesLoose"),require("react"),require("@react-three/fiber"),require("react-merge-refs"),require("../assets/cloud.base64.cjs.js"),require("../helpers/base64.cjs.js"),require("blob-polyfill"),require("three"),require("@babel/runtime/helpers/construct"),require("three-stdlib"),require("troika-three-text"),require("use-asset"),require("../helpers/environment-assets.cjs.js"),require("lodash.omit"),require("lodash.pick"),require("zustand"),require("../materials/MeshReflectorMaterial.cjs.js"),require("@babel/runtime/helpers/createClass"),require("@babel/runtime/helpers/inheritsLoose"),require("three/examples/js/libs/stats.min"),require("../helpers/useEffectfulState.cjs.js"),require("detect-gpu"),require("three-mesh-bvh"),require("@babel/runtime/helpers/assertThisInitialized"),require("../materials/SpotLightMaterial.cjs.js"),require("../helpers/matcap-assets.cjs.js"),require("../helpers/normal-assets.cjs.js"),require("../helpers/Position.cjs.js"),require("react-composer"),exports.Billboard=e.Billboard,exports.Cloud=r.Cloud,exports.QuadraticBezierLine=s.QuadraticBezierLine,exports.CubicBezierLine=t.CubicBezierLine,exports.Line=o.Line,exports.PositionalAudio=i.PositionalAudio,exports.Text=u.Text,exports.Environment=a.Environment,exports.Effects=p.Effects,exports.isWebGL2Available=p.isWebGL2Available,exports.GradientTexture=c.GradientTexture,exports.OrthographicCamera=j.OrthographicCamera,exports.PerspectiveCamera=n.PerspectiveCamera,exports.CameraShake=l.CameraShake,exports.CubeCamera=x.CubeCamera,exports.DeviceOrientationControls=q.DeviceOrientationControls,exports.FlyControls=d.FlyControls,exports.MapControls=h.MapControls,exports.OrbitControls=C.OrbitControls,exports.TrackballControls=m.TrackballControls,exports.TransformControls=b.TransformControls,exports.PointerLockControls=S.PointerLockControls,exports.FirstPersonControls=P.FirstPersonControls,exports.GizmoHelper=T.GizmoHelper,exports.useGizmoContext=T.useGizmoContext,exports.GizmoViewcube=f.GizmoViewcube,exports.GizmoViewport=B.GizmoViewport,exports.useCubeTexture=M.useCubeTexture,exports.useFBX=g.useFBX,exports.useGLTF=v.useGLTF,exports.useProgress=L.useProgress,exports.IsObject=G.IsObject,exports.useTexture=G.useTexture,exports.Reflector=D.Reflector,exports.Shadow=z.Shadow,exports.Stats=A.Stats,exports.Center=w.Center,exports.DepthBuffer=k.DepthBuffer,exports.useAspect=F.useAspect,exports.useCamera=O.useCamera,exports.useDetectGPU=E.useDetectGPU,exports.useHelper=y.useHelper,exports.useBVH=I.useBVH,exports.useContextBridge=H.useContextBridge,exports.useAnimations=R.useAnimations,exports.useFBO=V.useFBO,exports.useSimplification=Q.useSimplification,exports.useTessellation=W.useTessellation,exports.useEdgeSplit=N.useEdgeSplit,exports.CurveModifier=U.CurveModifier,exports.MeshDistortMaterial=X.MeshDistortMaterial,exports.MeshWobbleMaterial=K.MeshWobbleMaterial,exports.PointMaterial=_.PointMaterial,exports.PointMaterialImpl=_.PointMaterialImpl,exports.shaderMaterial=J.shaderMaterial,exports.Sky=Y.Sky,exports.calcPosFromAngles=Y.calcPosFromAngles,exports.softShadows=Z.softShadows,exports.Stars=$.Stars,exports.ContactShadows=ee.ContactShadows,exports.SpotLight=re.SpotLight,exports.Box=se.Box,exports.Circle=se.Circle,exports.Cone=se.Cone,exports.Cylinder=se.Cylinder,exports.Dodecahedron=se.Dodecahedron,exports.Extrude=se.Extrude,exports.Icosahedron=se.Icosahedron,exports.Lathe=se.Lathe,exports.Octahedron=se.Octahedron,exports.Parametric=se.Parametric,exports.Plane=se.Plane,exports.Polyhedron=se.Polyhedron,exports.Ring=se.Ring,exports.Sphere=se.Sphere,exports.Tetrahedron=se.Tetrahedron,exports.Torus=se.Torus,exports.TorusKnot=se.TorusKnot,exports.Tube=se.Tube,exports.RoundedBox=te.RoundedBox,exports.ScreenQuad=oe.ScreenQuad,exports.useMatcapTexture=ie.useMatcapTexture,exports.useNormalTexture=ue.useNormalTexture,exports.Stage=ae.Stage,exports.Point=pe.Point,exports.Points=pe.Points,exports.Instance=ce.Instance,exports.Instances=ce.Instances,exports.Merged=ce.Merged,exports.Detailed=je.Detailed,exports.Preload=ne.Preload,exports.BakeShadows=le.BakeShadows,exports.meshBounds=xe.meshBounds,exports.AdaptiveDpr=qe.AdaptiveDpr,exports.AdaptiveEvents=de.AdaptiveEvents;

package/core/index.d.ts

@@ -64,6 +64,7 @@ export * from './Points';
 export * from './Instances';
 export * from './Detailed';
 export * from './Preload';
+export * from './BakeShadows';
 export * from './meshBounds';
 export * from './AdaptiveDpr';
 export * from './AdaptiveEvents';

package/core/index.js

@@ -61,9 +61,10 @@ export { useMatcapTexture } from './useMatcapTexture.js';
 export { useNormalTexture } from './useNormalTexture.js';
 export { Stage } from './Stage.js';
 export { Point, Points } from './Points.js';
-export { Instance, Instances } from './Instances.js';
+export { Instance, Instances, Merged } from './Instances.js';
 export { Detailed } from './Detailed.js';
 export { Preload } from './Preload.js';
+export { BakeShadows } from './BakeShadows.js';
 export { meshBounds } from './meshBounds.js';
 export { AdaptiveDpr } from './AdaptiveDpr.js';
 export { AdaptiveEvents } from './AdaptiveEvents.js';
@@ -91,3 +92,4 @@ import '../materials/SpotLightMaterial.js';
 import '../helpers/matcap-assets.js';
 import '../helpers/normal-assets.js';
 import '../helpers/Position.js';
+import 'react-composer';