@react-three/drei 9.111.2 → 9.111.3

package/core/Instances.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@babel/runtime/helpers/extends"),t=require("three"),r=require("react"),n=require("@react-three/fiber"),a=require("react-composer"),c=require("../helpers/deprecated.cjs.js");function s(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function u(e){if(e&&e.__esModule)return e;var t=Object.create(null);return e&&Object.keys(e).forEach((function(r){if("default"!==r){var 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 i=s(e),o=u(t),l=u(r),f=s(a);const d=new o.Matrix4,m=new o.Matrix4,y=[],p=new o.Mesh;class g extends o.Group{constructor(){super(),this.color=new o.Color("white"),this.instance={current:void 0},this.instanceKey={current:void 0}}get geometry(){var e;return null==(e=this.instance.current)?void 0:e.geometry}raycast(e,t){const r=this.instance.current;if(!r)return;if(!r.geometry||!r.material)return;p.geometry=r.geometry;const n=r.matrixWorld,a=r.userData.instances.indexOf(this.instanceKey);if(!(-1===a||a>r.count)){r.getMatrixAt(a,d),m.multiplyMatrices(n,d),p.matrixWorld=m,r.material instanceof o.Material?p.material.side=r.material.side:p.material.side=r.material[0].side,p.raycast(e,y);for(let e=0,r=y.length;e<r;e++){const r=y[e];r.instanceId=a,r.object=this,t.push(r)}y.length=0}}}const x=l.createContext(null),h=new o.Matrix4,b=new o.Matrix4,w=new o.Matrix4,M=new o.Vector3,A=new o.Quaternion,v=new o.Vector3,E=l.forwardRef((({context:e,children:t,...r},a)=>{l.useMemo((()=>n.extend({PositionMesh:g})),[]);const c=l.useRef();l.useImperativeHandle(a,(()=>c.current),[]);const{subscribe:s,getParent:u}=l.useContext(e||x);return l.useLayoutEffect((()=>s(c)),[]),l.createElement("positionMesh",i.default({instance:u(),instanceKey:c,ref:c},r),t)})),j=l.forwardRef((({context:e,children:t,range:r,limit:a=1e3,frames:s=1/0,...u},f)=>{const[{localContext:d,instance:m}]=l.useState((()=>{const e=l.createContext(null);return{localContext:e,instance:l.forwardRef(((t,r)=>l.createElement(E,i.default({context:e},t,{ref:r}))))}})),y=l.useRef(null);l.useImperativeHandle(f,(()=>y.current),[]);const[p,g]=l.useState([]),[[j,D]]=l.useState((()=>{const e=new Float32Array(16*a);for(let t=0;t<a;t++)w.identity().toArray(e,16*t);return[e,new Float32Array([...new Array(3*a)].map((()=>1)))]}));l.useEffect((()=>{y.current.instanceMatrix.needsUpdate=!0}));let R=0,O=0;const C=l.useRef([]);l.useLayoutEffect((()=>{C.current=Object.entries(y.current.geometry.attributes).filter((([e,t])=>t.isInstancedBufferAttribute))})),n.useFrame((()=>{if(s===1/0||R<s){y.current.updateMatrix(),y.current.updateMatrixWorld(),h.copy(y.current.matrixWorld).invert(),O=Math.min(a,void 0!==r?r:a,p.length),y.current.count=O,c.setUpdateRange(y.current.instanceMatrix,{offset:0,count:16*O}),c.setUpdateRange(y.current.instanceColor,{offset:0,count:3*O});for(let e=0;e<p.length;e++){const t=p[e].current;t.matrixWorld.decompose(M,A,v),b.compose(M,A,v).premultiply(h),b.toArray(j,16*e),y.current.instanceMatrix.needsUpdate=!0,t.color.toArray(D,3*e),y.current.instanceColor.needsUpdate=!0}R++}}));const U=l.useMemo((()=>({getParent:()=>y,subscribe:e=>(g((t=>[...t,e])),()=>g((t=>t.filter((t=>t.current!==e.current)))))})),[]);return l.createElement("instancedMesh",i.default({userData:{instances:p,limit:a,frames:s},matrixAutoUpdate:!1,ref:y,args:[null,null,0],raycast:()=>null},u),l.createElement("instancedBufferAttribute",{attach:"instanceMatrix",count:j.length/16,array:j,itemSize:16,usage:o.DynamicDrawUsage}),l.createElement("instancedBufferAttribute",{attach:"instanceColor",count:D.length/3,array:D,itemSize:3,usage:o.DynamicDrawUsage}),"function"==typeof t?l.createElement(d.Provider,{value:U},t(m)):e?l.createElement(e.Provider,{value:U},t):l.createElement(x.Provider,{value:U},t))})),D=l.forwardRef((function({meshes:e,children:t,...r},n){const a=Array.isArray(e);if(!a)for(const t of Object.keys(e))e[t].isMesh||delete e[t];return l.createElement("group",{ref:n},l.createElement(f.default,{components:(a?e:Object.values(e)).map((({geometry:e,material:t})=>l.createElement(j,i.default({key:e.uuid,geometry:e,material:t},r))))},(r=>a?t(...r):t(Object.keys(e).filter((t=>e[t].isMesh)).reduce(((e,t,n)=>({...e,[t]:r[n]})),{})))))}));const R=l.forwardRef((({name:e,defaultValue:t},r)=>{const a=l.useRef(null);l.useImperativeHandle(r,(()=>a.current),[]),l.useLayoutEffect((()=>{const r=a.current.__r3f.parent;r.geometry.attributes[e]=a.current;const n=Array.isArray(t)?t:[t],c=Array.from({length:r.userData.limit},(()=>n)).flat();return a.current.array=new Float32Array(c),a.current.itemSize=n.length,a.current.count=c.length/a.current.itemSize,()=>{delete r.geometry.attributes[e]}}),[e]);let c=0;return n.useFrame((()=>{const t=a.current.__r3f.parent;if(t.userData.frames===1/0||c<t.userData.frames){for(let r=0;r<t.userData.instances.length;r++){const n=t.userData.instances[r].current[e];void 0!==n&&(a.current.set(Array.isArray(n)?n:"function"==typeof n.toArray?n.toArray():[n],r*a.current.itemSize),a.current.needsUpdate=!0)}c++}})),l.createElement("instancedBufferAttribute",{ref:a,usage:o.DynamicDrawUsage})}));exports.Instance=E,exports.InstancedAttribute=R,exports.Instances=j,exports.Merged=D,exports.createInstances=function(){const e=l.createContext(null);return[l.forwardRef(((t,r)=>l.createElement(j,i.default({ref:r,context:e},t)))),l.forwardRef(((t,r)=>l.createElement(E,i.default({ref:r,context:e},t))))]};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@babel/runtime/helpers/extends"),t=require("three"),r=require("react"),n=require("@react-three/fiber"),a=require("react-composer"),c=require("../helpers/deprecated.cjs.js");function s(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function i(e){if(e&&e.__esModule)return e;var t=Object.create(null);return e&&Object.keys(e).forEach((function(r){if("default"!==r){var n=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(t,r,n.get?n:{enumerable:!0,get:function(){return e[r]}})}})),t.default=e,Object.freeze(t)}var u=s(e),o=i(t),l=i(r),f=s(a);const d=new o.Matrix4,m=new o.Matrix4,y=[],p=new o.Mesh;class g extends o.Group{constructor(){super(),this.color=new o.Color("white"),this.instance={current:void 0},this.instanceKey={current:void 0}}get geometry(){var e;return null==(e=this.instance.current)?void 0:e.geometry}raycast(e,t){const r=this.instance.current;if(!r)return;if(!r.geometry||!r.material)return;p.geometry=r.geometry;const n=r.matrixWorld,a=r.userData.instances.indexOf(this.instanceKey);if(!(-1===a||a>r.count)){r.getMatrixAt(a,d),m.multiplyMatrices(n,d),p.matrixWorld=m,r.material instanceof o.Material?p.material.side=r.material.side:p.material.side=r.material[0].side,p.raycast(e,y);for(let e=0,r=y.length;e<r;e++){const r=y[e];r.instanceId=a,r.object=this,t.push(r)}y.length=0}}}const x=l.createContext(null),h=new o.Matrix4,b=new o.Matrix4,w=new o.Matrix4,M=new o.Vector3,A=new o.Quaternion,v=new o.Vector3,E=l.forwardRef((({context:e,children:t,...r},a)=>{l.useMemo((()=>n.extend({PositionMesh:g})),[]);const c=l.useRef();l.useImperativeHandle(a,(()=>c.current),[]);const{subscribe:s,getParent:i}=l.useContext(e||x);return l.useLayoutEffect((()=>s(c)),[]),l.createElement("positionMesh",u.default({instance:i(),instanceKey:c,ref:c},r),t)})),j=l.forwardRef((({context:e,children:t,range:r,limit:a=1e3,frames:s=1/0,...i},f)=>{const[{localContext:d,instance:m}]=l.useState((()=>{const e=l.createContext(null);return{localContext:e,instance:l.forwardRef(((t,r)=>l.createElement(E,u.default({context:e},t,{ref:r}))))}})),y=l.useRef(null);l.useImperativeHandle(f,(()=>y.current),[]);const[p,g]=l.useState([]),[[j,D]]=l.useState((()=>{const e=new Float32Array(16*a);for(let t=0;t<a;t++)w.identity().toArray(e,16*t);return[e,new Float32Array([...new Array(3*a)].map((()=>1)))]}));l.useEffect((()=>{y.current.instanceMatrix.needsUpdate=!0}));let R=0,O=0;const C=l.useRef([]);l.useLayoutEffect((()=>{C.current=Object.entries(y.current.geometry.attributes).filter((([e,t])=>t.isInstancedBufferAttribute))})),n.useFrame((()=>{if(s===1/0||R<s){y.current.updateMatrix(),y.current.updateMatrixWorld(),h.copy(y.current.matrixWorld).invert(),O=Math.min(a,void 0!==r?r:a,p.length),y.current.count=O,c.setUpdateRange(y.current.instanceMatrix,{offset:0,count:16*O}),c.setUpdateRange(y.current.instanceColor,{offset:0,count:3*O});for(let e=0;e<p.length;e++){const t=p[e].current;t.matrixWorld.decompose(M,A,v),b.compose(M,A,v).premultiply(h),b.toArray(j,16*e),y.current.instanceMatrix.needsUpdate=!0,t.color.toArray(D,3*e),y.current.instanceColor.needsUpdate=!0}R++}}));const U=l.useMemo((()=>({getParent:()=>y,subscribe:e=>(g((t=>[...t,e])),()=>g((t=>t.filter((t=>t.current!==e.current)))))})),[]);return l.createElement("instancedMesh",u.default({userData:{instances:p,limit:a,frames:s},matrixAutoUpdate:!1,ref:y,args:[null,null,0],raycast:()=>null},i),l.createElement("instancedBufferAttribute",{attach:"instanceMatrix",count:j.length/16,array:j,itemSize:16,usage:o.DynamicDrawUsage}),l.createElement("instancedBufferAttribute",{attach:"instanceColor",count:D.length/3,array:D,itemSize:3,usage:o.DynamicDrawUsage}),"function"==typeof t?l.createElement(d.Provider,{value:U},t(m)):e?l.createElement(e.Provider,{value:U},t):l.createElement(x.Provider,{value:U},t))})),D=l.forwardRef((function({meshes:e,children:t,...r},n){const a=Array.isArray(e);if(!a)for(const t of Object.keys(e))e[t].isMesh||delete e[t];return l.createElement("group",{ref:n},l.createElement(f.default,{components:(a?e:Object.values(e)).map((({geometry:e,material:t})=>l.createElement(j,u.default({key:e.uuid,geometry:e,material:t},r))))},(r=>a?t(...r):t(Object.keys(e).filter((t=>e[t].isMesh)).reduce(((e,t,n)=>({...e,[t]:r[n]})),{})))))}));const R=l.forwardRef((({name:e,defaultValue:t,normalized:r,usage:a=o.DynamicDrawUsage},c)=>{const s=l.useRef(null);l.useImperativeHandle(c,(()=>s.current),[]),l.useLayoutEffect((()=>{const r=s.current.__r3f.parent;r.geometry.attributes[e]=s.current;const n=Array.isArray(t)?t:[t],a=Array.from({length:r.userData.limit},(()=>n)).flat();return s.current.array=new Float32Array(a),s.current.itemSize=n.length,s.current.count=a.length/s.current.itemSize,()=>{delete r.geometry.attributes[e]}}),[e]);let i=0;return n.useFrame((()=>{const t=s.current.__r3f.parent;if(t.userData.frames===1/0||i<t.userData.frames){for(let r=0;r<t.userData.instances.length;r++){const n=t.userData.instances[r].current[e];void 0!==n&&(s.current.set(Array.isArray(n)?n:"function"==typeof n.toArray?n.toArray():[n],r*s.current.itemSize),s.current.needsUpdate=!0)}i++}})),l.createElement("instancedBufferAttribute",{ref:s,usage:a,normalized:r})}));exports.Instance=E,exports.InstancedAttribute=R,exports.Instances=j,exports.Merged=D,exports.createInstances=function(){const e=l.createContext(null);return[l.forwardRef(((t,r)=>l.createElement(j,u.default({ref:r,context:e},t)))),l.forwardRef(((t,r)=>l.createElement(E,u.default({ref:r,context:e},t))))]};

package/core/Instances.d.ts

@@ -25,6 +25,8 @@ export type InstanceProps = JSX.IntrinsicElements['positionMesh'] & {
 export type InstancedAttributeProps = JSX.IntrinsicElements['instancedBufferAttribute'] & {
     name: string;
     defaultValue: any;
+    normalized?: boolean;
+    usage?: number;
 };
 type InstancedMesh = Omit<THREE.InstancedMesh, 'instanceMatrix' | 'instanceColor'> & {
     instanceMatrix: THREE.InstancedBufferAttribute;

package/core/Instances.js

@@ -217,6 +217,11 @@ const Merged = /* @__PURE__ */React.forwardRef(function Merged({
     [key]: args[i]
   }), {}))));
 });
+
+/** Idea and implementation for global instances and instanced attributes by
+/*  Matias Gonzalez Fernandez https://x.com/matiNotFound
+/*  and Paul Henschel https://x.com/0xca0a
+*/
 function createInstances() {
   const context = /*#__PURE__*/React.createContext(null);
   return [/*#__PURE__*/React.forwardRef((props, fref) => /*#__PURE__*/React.createElement(Instances, _extends({
@@ -229,7 +234,9 @@ function createInstances() {
 }
 const InstancedAttribute = /*#__PURE__*/React.forwardRef(({
   name,
-  defaultValue
+  defaultValue,
+  normalized,
+  usage = THREE.DynamicDrawUsage
 }, fref) => {
   const ref = React.useRef(null);
   React.useImperativeHandle(fref, () => ref.current, []);
@@ -264,7 +271,8 @@ const InstancedAttribute = /*#__PURE__*/React.forwardRef(({
   });
   return /*#__PURE__*/React.createElement("instancedBufferAttribute", {
     ref: ref,
-    usage: THREE.DynamicDrawUsage
+    usage: usage,
+    normalized: normalized
   });
 });