@react-three/drei 9.0.0-beta.1 → 9.0.0-beta.4

package/core/GizmoViewcube.js

@@ -49,7 +49,7 @@ const FaceMaterial = ({
   return /*#__PURE__*/React.createElement("meshLambertMaterial", {
     map: texture,
     "map-anisotropy": gl.capabilities.getMaxAnisotropy() || 1,
-    attach: "material",
+    attach: `material-${index}`,
     color: hover ? hoverColor : 'white',
     transparent: true,
     opacity: opacity

package/core/GradientTexture.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");function n(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function o(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),u=o(t),a=o(r);exports.GradientTexture=function({stops:e,colors:t,size:r=2048,...n}){const o=a.useMemo((()=>{const n=document.createElement("canvas"),o=n.getContext("2d");n.width=16,n.height=r;const c=o.createLinearGradient(0,0,0,r);let a=e.length;for(;a--;)c.addColorStop(e[a],t[a]);o.fillStyle=c,o.fillRect(0,0,16,r);const i=new u.Texture(n);return i.needsUpdate=!0,i}),[e]);return a.useEffect((()=>()=>{o.dispose()}),[o]),a.createElement("primitive",c.default({object:o,attach:"map"},n))};
+"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");function o(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 c=o(e),i=u(t),a=u(r);exports.GradientTexture=function({stops:e,colors:t,size:r=1024,...o}){const u=n.useThree((e=>e.gl)),l=a.useMemo((()=>{const n=document.createElement("canvas"),o=n.getContext("2d");n.width=16,n.height=r;const u=o.createLinearGradient(0,0,0,r);let c=e.length;for(;c--;)u.addColorStop(e[c],t[c]);o.fillStyle=u,o.fillRect(0,0,16,r);const a=new i.Texture(n);return a.needsUpdate=!0,a}),[e]);return a.useEffect((()=>()=>{l.dispose()}),[l]),a.createElement("primitive",c.default({object:l,attach:"map",encoding:u.outputEncoding},o))};

package/core/GradientTexture.js

@@ -1,13 +1,15 @@
 import _extends from '@babel/runtime/helpers/esm/extends';
 import * as THREE from 'three';
 import * as React from 'react';
+import { useThree } from '@react-three/fiber';
 
 function GradientTexture({
   stops,
   colors,
-  size = 2048,
+  size = 1024,
   ...props
 }) {
+  const gl = useThree(state => state.gl);
   const texture = React.useMemo(() => {
     const canvas = document.createElement('canvas');
     const context = canvas.getContext('2d');
@@ -29,7 +31,8 @@ function GradientTexture({
   React.useEffect(() => () => void texture.dispose(), [texture]);
   return /*#__PURE__*/React.createElement("primitive", _extends({
     object: texture,
-    attach: "map"
+    attach: "map",
+    encoding: gl.outputEncoding
   }, props));
 }
 

package/core/Image.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@babel/runtime/helpers/extends"),r=require("react"),n=require("three"),t=require("@react-three/fiber"),a=require("./shaderMaterial.cjs.js"),o=require("./useTexture.cjs.js");function c(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function i(e){if(e&&e.__esModule)return e;var r=Object.create(null);return e&&Object.keys(e).forEach((function(n){if("default"!==n){var t=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(r,n,t.get?t:{enumerable:!0,get:function(){return e[n]}})}})),r.default=e,Object.freeze(r)}var s=c(e),l=i(r),u=i(n);const v=a.shaderMaterial({color:new u.Color("white"),scale:[1,1],imageBounds:[1,1],map:null,zoom:1,grayscale:0},"\n  varying vec2 vUv;\n  void main() {\n    gl_Position = projectionMatrix * viewMatrix * modelMatrix * vec4(position, 1.);\n    vUv = uv;\n  }\n","\n  // mostly from https://gist.github.com/statico/df64c5d167362ecf7b34fca0b1459a44\n  varying vec2 vUv;\n  uniform vec2 scale;\n  uniform vec2 imageBounds;\n  uniform vec3 color;\n  uniform sampler2D map;\n  uniform float zoom;\n  uniform float grayscale;\n  const vec3 luma = vec3(.299, 0.587, 0.114);\n  vec4 toGrayscale(vec4 color, float intensity) {\n    return vec4(mix(color.rgb, vec3(dot(color.rgb, luma)), intensity), color.a);\n  }\n  vec2 aspect(vec2 size) {\n    return size / min(size.x, size.y);\n  }\n  void main() {\n    vec2 s = aspect(scale);\n    vec2 i = aspect(imageBounds);\n    float rs = s.x / s.y;\n    float ri = i.x / i.y;\n    vec2 new = rs < ri ? vec2(i.x * s.y / i.y, s.y) : vec2(s.x, i.y * s.x / i.x);\n    vec2 offset = (rs < ri ? vec2((new.x - s.x) / 2.0, 0.0) : vec2(0.0, (new.y - s.y) / 2.0)) / new;\n    vec2 uv = vUv * s / new + offset;\n    vec2 zUv = (uv - vec2(0.5, 0.5)) / zoom + vec2(0.5, 0.5);\n    gl_FragColor = toGrayscale(texture2D(map, zUv) * vec4(color, 1.0), grayscale);\n  }\n"),m=l.forwardRef((({children:e,color:r,segments:n=1,scale:a=1,zoom:c=1,grayscale:i=0,url:u,...m},f)=>{t.extend({ImageMaterial:v});const g=o.useTexture(u),y=Array.isArray(a)?[a[0],a[1]]:[a,a],d=[g.image.width,g.image.height];return l.createElement("mesh",s.default({ref:f,scale:a},m),l.createElement("planeGeometry",{args:[1,1,n,n]}),l.createElement("imageMaterial",{color:r,map:g,zoom:c,grayscale:i,scale:y,imageBounds:d}),e)}));exports.Image=m;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@babel/runtime/helpers/extends"),r=require("react"),n=require("three"),t=require("@react-three/fiber"),a=require("./shaderMaterial.cjs.js"),o=require("./useTexture.cjs.js");function c(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function i(e){if(e&&e.__esModule)return e;var r=Object.create(null);return e&&Object.keys(e).forEach((function(n){if("default"!==n){var t=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(r,n,t.get?t:{enumerable:!0,get:function(){return e[n]}})}})),r.default=e,Object.freeze(r)}var s=c(e),l=i(r),u=i(n);const v=a.shaderMaterial({color:new u.Color("white"),scale:[1,1],imageBounds:[1,1],map:null,zoom:1,grayscale:0},"\n  varying vec2 vUv;\n  void main() {\n    gl_Position = projectionMatrix * viewMatrix * modelMatrix * vec4(position, 1.);\n    vUv = uv;\n  }\n","\n  // mostly from https://gist.github.com/statico/df64c5d167362ecf7b34fca0b1459a44\n  varying vec2 vUv;\n  uniform vec2 scale;\n  uniform vec2 imageBounds;\n  uniform vec3 color;\n  uniform sampler2D map;\n  uniform float zoom;\n  uniform float grayscale;\n  const vec3 luma = vec3(.299, 0.587, 0.114);\n  vec4 toGrayscale(vec4 color, float intensity) {\n    return vec4(mix(color.rgb, vec3(dot(color.rgb, luma)), intensity), color.a);\n  }\n  vec2 aspect(vec2 size) {\n    return size / min(size.x, size.y);\n  }\n  void main() {\n    vec2 s = aspect(scale);\n    vec2 i = aspect(imageBounds);\n    float rs = s.x / s.y;\n    float ri = i.x / i.y;\n    vec2 new = rs < ri ? vec2(i.x * s.y / i.y, s.y) : vec2(s.x, i.y * s.x / i.x);\n    vec2 offset = (rs < ri ? vec2((new.x - s.x) / 2.0, 0.0) : vec2(0.0, (new.y - s.y) / 2.0)) / new;\n    vec2 uv = vUv * s / new + offset;\n    vec2 zUv = (uv - vec2(0.5, 0.5)) / zoom + vec2(0.5, 0.5);\n    gl_FragColor = toGrayscale(texture2D(map, zUv) * vec4(color, 1.0), grayscale);\n    \n    #include <tonemapping_fragment>\n    #include <encodings_fragment>\n  }\n"),m=l.forwardRef((({children:e,color:r,segments:n=1,scale:a=1,zoom:c=1,grayscale:i=0,url:u,toneMapped:m,...f},g)=>{t.extend({ImageMaterial:v});const d=o.useTexture(u),y=Array.isArray(a)?[a[0],a[1]]:[a,a],p=[d.image.width,d.image.height];return l.createElement("mesh",s.default({ref:g,scale:a},f),l.createElement("planeGeometry",{args:[1,1,n,n]}),l.createElement("imageMaterial",{color:r,map:d,zoom:c,grayscale:i,scale:y,imageBounds:p,toneMapped:m}),e)}));exports.Image=m;

package/core/Image.d.ts

@@ -3,10 +3,11 @@ import * as THREE from 'three';
 import { Color } from '@react-three/fiber';
 export declare type ImageProps = JSX.IntrinsicElements['mesh'] & {
     segments?: number;
-    scale?: number;
+    scale?: number | [number, number];
     color?: Color;
     zoom?: number;
     grayscale?: number;
+    toneMapped?: boolean;
     url: string;
 };
 declare type ImageMaterialType = JSX.IntrinsicElements['shaderMaterial'] & {
@@ -24,7 +25,7 @@ declare global {
         }
     }
 }
-export declare const Image: React.ForwardRefExoticComponent<Pick<Omit<import("@react-three/fiber").Node<THREE.Mesh<THREE.BufferGeometry, THREE.Material | THREE.Material[]>, typeof THREE.Mesh>, import("@react-three/fiber").NonFunctionKeys<{
+export declare const Image: React.ForwardRefExoticComponent<Pick<Omit<import("@react-three/fiber").ExtendedColors<import("@react-three/fiber").Overwrite<Partial<THREE.Mesh<THREE.BufferGeometry, THREE.Material | THREE.Material[]>>, import("@react-three/fiber").NodeProps<THREE.Mesh<THREE.BufferGeometry, THREE.Material | THREE.Material[]>, typeof THREE.Mesh>>>, 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;
@@ -44,10 +45,11 @@ export declare const Image: React.ForwardRefExoticComponent<Pick<Omit<import("@r
     dispose?: (() => void) | null | undefined;
 } & import("@react-three/fiber/dist/declarations/src/core/events").EventHandlers & {
     segments?: number | undefined;
-    scale?: number | undefined;
+    scale?: number | [number, number] | undefined;
     color?: Color | undefined;
     zoom?: number | undefined;
     grayscale?: number | undefined;
+    toneMapped?: boolean | undefined;
     url: string;
-}, "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" | "color" | keyof import("@react-three/fiber/dist/declarations/src/core/events").EventHandlers | "zoom" | "material" | "url" | "geometry" | "morphTargetInfluences" | "morphTargetDictionary" | "isMesh" | "updateMorphTargets" | "segments" | "grayscale"> & React.RefAttributes<THREE.Mesh<THREE.BufferGeometry, THREE.Material | THREE.Material[]>>>;
+}, "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" | "color" | keyof import("@react-three/fiber/dist/declarations/src/core/events").EventHandlers | "zoom" | "material" | "url" | "toneMapped" | "geometry" | "morphTargetInfluences" | "morphTargetDictionary" | "isMesh" | "updateMorphTargets" | "segments" | "grayscale"> & React.RefAttributes<THREE.Mesh<THREE.BufferGeometry, THREE.Material | THREE.Material[]>>>;
 export {};

package/core/Image.js

@@ -48,6 +48,9 @@ const ImageMaterialImpl = shaderMaterial({
     vec2 uv = vUv * s / new + offset;
     vec2 zUv = (uv - vec2(0.5, 0.5)) / zoom + vec2(0.5, 0.5);
     gl_FragColor = toGrayscale(texture2D(map, zUv) * vec4(color, 1.0), grayscale);
+    
+    #include <tonemapping_fragment>
+    #include <encodings_fragment>
   }
 `);
 const Image = /*#__PURE__*/React.forwardRef(({
@@ -58,6 +61,7 @@ const Image = /*#__PURE__*/React.forwardRef(({
   zoom = 1,
   grayscale = 0,
   url,
+  toneMapped,
   ...props
 }, ref) => {
   extend({
@@ -77,7 +81,8 @@ const Image = /*#__PURE__*/React.forwardRef(({
     zoom: zoom,
     grayscale: grayscale,
     scale: planeBounds,
-    imageBounds: imageBounds
+    imageBounds: imageBounds,
+    toneMapped: toneMapped
   }), children);
 });
 

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-merge-refs"),c=require("react-composer"),u=require("../helpers/Position.cjs.js");function o(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 s=o(e),l=i(t),f=i(r),d=o(a),m=o(c);let y,p;const x=f.createContext(null),g=new l.Matrix4,b=new l.Matrix4,h=new l.Matrix4,M=new l.Color,w=new l.Vector3,A=new l.Quaternion,E=new l.Vector3,j=f.forwardRef((({context:e,children:t,...r},a)=>{f.useMemo((()=>n.extend({Position:u.Position})),[]);const c=f.useRef(),{subscribe:o,getParent:i}=f.useContext(e||x);return f.useLayoutEffect((()=>o(c)),[]),f.createElement("position",s.default({instance:i(),instanceKey:c,ref:d.default([a,c])},r),t)})),v=f.forwardRef((({children:e,range:t,limit:r=1e3,frames:a=1/0,...c},u)=>{const[{context:o,instance:i}]=f.useState((()=>{const e=f.createContext(null);return{context:e,instance:f.forwardRef(((t,r)=>f.createElement(j,s.default({context:e},t,{ref:r}))))}})),m=f.useRef(null),[v,O]=f.useState([]),[[P,q]]=f.useState((()=>{const e=new Float32Array(16*r);for(y=0;y<r;y++)h.identity().toArray(e,16*y);return[e,new Float32Array([...new Array(3*r)].map((()=>1)))]}));f.useLayoutEffect((()=>{m.current.count=m.current.instanceMatrix.updateRange.count=m.current.instanceColor.updateRange.count=Math.min(r,void 0!==t?t:r,v.length)}),[v,t]),f.useEffect((()=>{m.current.instanceMatrix.needsUpdate=!0}));let C=0;n.useFrame((()=>{if(a===1/0||C<a){for(m.current.updateMatrix(),m.current.updateMatrixWorld(),g.copy(m.current.matrixWorld).invert(),y=0;y<v.length;y++)p=v[y].current,p.matrixWorld.decompose(w,A,E),b.compose(w,A,E).premultiply(g),b.equals(h.fromArray(P,16*y))||(b.toArray(P,16*y),m.current.instanceMatrix.needsUpdate=!0),p.color.equals(M.fromArray(q,3*y))||(p.color.toArray(q,3*y),m.current.instanceColor.needsUpdate=!0);C++}}));const R=f.useMemo((()=>({getParent:()=>m,subscribe:e=>(O((t=>[...t,e])),()=>O((t=>t.filter((t=>t.current!==e.current)))))})),[]);return f.createElement("instancedMesh",s.default({userData:{instances:v},matrixAutoUpdate:!1,ref:d.default([u,m]),args:[null,null,0],raycast:()=>null},c),f.createElement("instancedBufferAttribute",{attach:"instanceMatrix",count:P.length/16,array:P,itemSize:16,usage:l.DynamicDrawUsage}),f.createElement("instancedBufferAttribute",{attach:"instanceColor",count:q.length/3,array:q,itemSize:3,usage:l.DynamicDrawUsage}),"function"==typeof e?f.createElement(o.Provider,{value:R},e(i)):f.createElement(x.Provider,{value:R},e))}));exports.Instance=j,exports.Instances=v,exports.Merged=function({meshes:e,children:t,...r}){const n=Array.isArray(e);if(!n)for(const t of Object.keys(e))e[t].isMesh||delete e[t];return f.createElement(m.default,{components:(n?e:Object.values(e)).map((({geometry:e,material:t})=>f.createElement(v,s.default({key:e.uuid,geometry:e,material:t},r))))},(r=>n?t(...r):t(Object.keys(e).filter((t=>e[t].isMesh)).reduce(((e,t,n)=>({...e,[t]:r[n]})),{}))))};
+"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-merge-refs"),c=require("react-composer"),u=require("../helpers/Position.cjs.js");function o(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 s=o(e),l=i(t),f=i(r),d=o(a),m=o(c);let p,y;const x=f.createContext(null),g=new l.Matrix4,b=new l.Matrix4,h=new l.Matrix4;new l.Color;const M=new l.Vector3,w=new l.Quaternion,E=new l.Vector3,j=f.forwardRef((({context:e,children:t,...r},a)=>{f.useMemo((()=>n.extend({Position:u.Position})),[]);const c=f.useRef(),{subscribe:o,getParent:i}=f.useContext(e||x);return f.useLayoutEffect((()=>o(c)),[]),f.createElement("position",s.default({instance:i(),instanceKey:c,ref:d.default([a,c])},r),t)})),v=f.forwardRef((({children:e,range:t,limit:r=1e3,frames:a=1/0,...c},u)=>{const[{context:o,instance:i}]=f.useState((()=>{const e=f.createContext(null);return{context:e,instance:f.forwardRef(((t,r)=>f.createElement(j,s.default({context:e},t,{ref:r}))))}})),m=f.useRef(null),[v,A]=f.useState([]),[[O,P]]=f.useState((()=>{const e=new Float32Array(16*r);for(p=0;p<r;p++)h.identity().toArray(e,16*p);return[e,new Float32Array([...new Array(3*r)].map((()=>1)))]}));f.useLayoutEffect((()=>{m.current.count=m.current.instanceMatrix.updateRange.count=m.current.instanceColor.updateRange.count=Math.min(r,void 0!==t?t:r,v.length)}),[v,t]),f.useEffect((()=>{m.current.instanceMatrix.needsUpdate=!0}));let q=0;n.useFrame((()=>{if(a===1/0||q<a){for(m.current.updateMatrix(),m.current.updateMatrixWorld(),g.copy(m.current.matrixWorld).invert(),p=0;p<v.length;p++)y=v[p].current,y.matrixWorld.decompose(M,w,E),b.compose(M,w,E).premultiply(g),b.toArray(O,16*p),m.current.instanceMatrix.needsUpdate=!0,y.color.toArray(P,3*p),m.current.instanceColor.needsUpdate=!0;q++}}));const C=f.useMemo((()=>({getParent:()=>m,subscribe:e=>(A((t=>[...t,e])),()=>A((t=>t.filter((t=>t.current!==e.current)))))})),[]);return f.createElement("instancedMesh",s.default({userData:{instances:v},matrixAutoUpdate:!1,ref:d.default([u,m]),args:[null,null,0],raycast:()=>null},c),f.createElement("instancedBufferAttribute",{attach:"instanceMatrix",count:O.length/16,array:O,itemSize:16,usage:l.DynamicDrawUsage}),f.createElement("instancedBufferAttribute",{attach:"instanceColor",count:P.length/3,array:P,itemSize:3,usage:l.DynamicDrawUsage}),"function"==typeof e?f.createElement(o.Provider,{value:C},e(i)):f.createElement(x.Provider,{value:C},e))}));exports.Instance=j,exports.Instances=v,exports.Merged=function({meshes:e,children:t,...r}){const n=Array.isArray(e);if(!n)for(const t of Object.keys(e))e[t].isMesh||delete e[t];return f.createElement(m.default,{components:(n?e:Object.values(e)).map((({geometry:e,material:t})=>f.createElement(v,s.default({key:e.uuid,geometry:e,material:t},r))))},(r=>n?t(...r):t(Object.keys(e).filter((t=>e[t].isMesh)).reduce(((e,t,n)=>({...e,[t]:r[n]})),{}))))};

package/core/Instances.d.ts

@@ -14,7 +14,7 @@ declare type InstancedMesh = Omit<THREE.InstancedMesh, 'instanceMatrix' | 'insta
     instanceMatrix: THREE.InstancedBufferAttribute;
     instanceColor: THREE.InstancedBufferAttribute;
 };
-declare const Instance: React.ForwardRefExoticComponent<Pick<Omit<import("@react-three/fiber").Node<Position, typeof Position>, import("@react-three/fiber").NonFunctionKeys<{
+declare const Instance: React.ForwardRefExoticComponent<Pick<Omit<import("@react-three/fiber").ExtendedColors<import("@react-three/fiber").Overwrite<Partial<Position>, import("@react-three/fiber").NodeProps<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;
@@ -35,7 +35,7 @@ declare const Instance: React.ForwardRefExoticComponent<Pick<Omit<import("@react
 } & import("@react-three/fiber/dist/declarations/src/core/events").EventHandlers & {
     context?: React.Context<Api> | undefined;
 }, "visible" | "attach" | "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" | "removeFromParent" | "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 | "geometry" | "context" | "instance" | "instanceKey"> & React.RefAttributes<unknown>>;
-declare const Instances: React.ForwardRefExoticComponent<Pick<InstancesProps, "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 | "range" | "material" | "geometry" | "morphTargetInfluences" | "morphTargetDictionary" | "isMesh" | "updateMorphTargets" | "instanceMatrix" | "frames" | "count" | "instanceColor" | "isInstancedMesh" | "getColorAt" | "getMatrixAt" | "setColorAt" | "setMatrixAt" | "limit"> & React.RefAttributes<InstancedMesh>>;
+declare const Instances: React.ForwardRefExoticComponent<Pick<InstancesProps, "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 | "range" | "material" | "geometry" | "morphTargetInfluences" | "morphTargetDictionary" | "isMesh" | "updateMorphTargets" | "instanceMatrix" | "count" | "frames" | "instanceColor" | "isInstancedMesh" | "getColorAt" | "getMatrixAt" | "setColorAt" | "setMatrixAt" | "limit"> & React.RefAttributes<InstancedMesh>>;
 declare function Merged({ meshes, children, ...props }: {
     [x: string]: any;
     meshes: any;

package/core/Instances.js

@@ -11,7 +11,7 @@ const globalContext = /*#__PURE__*/React.createContext(null);
 const parentMatrix = new THREE.Matrix4();
 const instanceMatrix = new THREE.Matrix4();
 const tempMatrix = new THREE.Matrix4();
-const color = new THREE.Color();
+new THREE.Color();
 const translation = new THREE.Vector3();
 const rotation = new THREE.Quaternion();
 const scale = new THREE.Vector3();
@@ -85,16 +85,10 @@ const Instances = /*#__PURE__*/React.forwardRef(({
 
         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 (!instanceRef.color.equals(color.fromArray(colors, i * 3))) {
-          instanceRef.color.toArray(colors, i * 3);
-          parentRef.current.instanceColor.needsUpdate = true;
-        }
+        instanceMatrix.toArray(matrices, i * 16);
+        parentRef.current.instanceMatrix.needsUpdate = true;
+        instanceRef.color.toArray(colors, i * 3);
+        parentRef.current.instanceColor.needsUpdate = true;
       }
 
       count++;

package/core/Lightformer.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@babel/runtime/helpers/extends"),r=require("@react-three/fiber"),t=require("react"),a=require("three"),l=require("react-merge-refs");function n(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 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 u=n(e),i=c(t),o=c(a),s=n(l);const f=i.forwardRef((({args:e,map:t,toneMapped:a=!1,color:l="white",form:n="rect",intensity:c=1,scale:f=1,target:m,children:p,...d},y)=>{const g=i.useRef(null);return i.useLayoutEffect((()=>{p||d.material||(r.applyProps(g.current.material,{color:l}),g.current.material.color.multiplyScalar(c))}),[l,c,p,d.material]),i.useLayoutEffect((()=>{m&&g.current.lookAt(Array.isArray(m)?new o.Vector3(...m):m)}),[m]),f=Array.isArray(f)&&2===f.length?[f[0],f[1],1]:f,i.createElement("mesh",u.default({ref:s.default([g,y]),scale:f},d),"circle"===n?i.createElement("ringGeometry",{args:[0,1,64]}):"ring"===n?i.createElement("ringGeometry",{args:[.5,1,64]}):"rect"===n?i.createElement("planeGeometry",null):i.createElement(n,{args:e}),p||(d.material?null:i.createElement("meshBasicMaterial",{toneMapped:a,map:t,side:o.DoubleSide})))}));exports.Lightformer=f;

package/core/Lightformer.d.ts

@@ -0,0 +1,41 @@
+import { ReactThreeFiber } from '@react-three/fiber';
+import * as React from 'react';
+import * as THREE from 'three';
+export declare type LightProps = JSX.IntrinsicElements['mesh'] & {
+    args?: any[];
+    map?: THREE.Texture;
+    toneMapped?: boolean;
+    color?: ReactThreeFiber.Color;
+    form?: 'circle' | 'ring' | 'rect' | any;
+    scale?: number | [number, number, number] | [number, number];
+    intensity?: number;
+    target?: [number, number, number] | THREE.Vector3;
+};
+export declare const Lightformer: React.ForwardRefExoticComponent<Pick<Omit<ReactThreeFiber.ExtendedColors<ReactThreeFiber.Overwrite<Partial<THREE.Mesh<THREE.BufferGeometry, THREE.Material | THREE.Material[]>>, ReactThreeFiber.NodeProps<THREE.Mesh<THREE.BufferGeometry, THREE.Material | THREE.Material[]>, typeof THREE.Mesh>>>, ReactThreeFiber.NonFunctionKeys<{
+    position?: ReactThreeFiber.Vector3 | undefined;
+    up?: ReactThreeFiber.Vector3 | undefined;
+    scale?: ReactThreeFiber.Vector3 | undefined;
+    rotation?: ReactThreeFiber.Euler | undefined;
+    matrix?: ReactThreeFiber.Matrix4 | undefined;
+    quaternion?: ReactThreeFiber.Quaternion | undefined;
+    layers?: ReactThreeFiber.Layers | undefined;
+    dispose?: (() => void) | null | undefined;
+}>> & {
+    position?: ReactThreeFiber.Vector3 | undefined;
+    up?: ReactThreeFiber.Vector3 | undefined;
+    scale?: ReactThreeFiber.Vector3 | undefined;
+    rotation?: ReactThreeFiber.Euler | undefined;
+    matrix?: ReactThreeFiber.Matrix4 | undefined;
+    quaternion?: ReactThreeFiber.Quaternion | undefined;
+    layers?: ReactThreeFiber.Layers | undefined;
+    dispose?: (() => void) | null | undefined;
+} & import("@react-three/fiber/dist/declarations/src/core/events").EventHandlers & {
+    args?: any[] | undefined;
+    map?: THREE.Texture | undefined;
+    toneMapped?: boolean | undefined;
+    color?: ReactThreeFiber.Color | undefined;
+    form?: 'circle' | 'ring' | 'rect' | any;
+    scale?: number | [number, number] | [number, number, number] | undefined;
+    intensity?: number | undefined;
+    target?: THREE.Vector3 | [number, number, number] | 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" | "color" | keyof import("@react-three/fiber/dist/declarations/src/core/events").EventHandlers | "form" | "map" | "material" | "target" | "toneMapped" | "geometry" | "morphTargetInfluences" | "morphTargetDictionary" | "isMesh" | "updateMorphTargets" | "intensity"> & React.RefAttributes<unknown>>;

package/core/Lightformer.js

@@ -0,0 +1,51 @@
+import _extends from '@babel/runtime/helpers/esm/extends';
+import { applyProps } from '@react-three/fiber';
+import * as React from 'react';
+import * as THREE from 'three';
+import mergeRefs from 'react-merge-refs';
+
+const Lightformer = /*#__PURE__*/React.forwardRef(({
+  args,
+  map,
+  toneMapped = false,
+  color = 'white',
+  form: Form = 'rect',
+  intensity = 1,
+  scale = 1,
+  target,
+  children,
+  ...props
+}, forwardRef) => {
+  // Apply emissive power
+  const ref = React.useRef(null);
+  React.useLayoutEffect(() => {
+    if (!children && !props.material) {
+      applyProps(ref.current.material, {
+        color
+      });
+      ref.current.material.color.multiplyScalar(intensity);
+    }
+  }, [color, intensity, children, props.material]); // Target light
+
+  React.useLayoutEffect(() => {
+    if (target) ref.current.lookAt(Array.isArray(target) ? new THREE.Vector3(...target) : target);
+  }, [target]); // Fix 2-dimensional scale
+
+  scale = Array.isArray(scale) && scale.length === 2 ? [scale[0], scale[1], 1] : scale;
+  return /*#__PURE__*/React.createElement("mesh", _extends({
+    ref: mergeRefs([ref, forwardRef]),
+    scale: scale
+  }, props), Form === 'circle' ? /*#__PURE__*/React.createElement("ringGeometry", {
+    args: [0, 1, 64]
+  }) : Form === 'ring' ? /*#__PURE__*/React.createElement("ringGeometry", {
+    args: [0.5, 1, 64]
+  }) : Form === 'rect' ? /*#__PURE__*/React.createElement("planeGeometry", null) : /*#__PURE__*/React.createElement(Form, {
+    args: args
+  }), children ? children : !props.material ? /*#__PURE__*/React.createElement("meshBasicMaterial", {
+    toneMapped: toneMapped,
+    map: map,
+    side: THREE.DoubleSide
+  }) : null);
+});
+
+export { Lightformer };

package/core/Line.d.ts

@@ -6,4 +6,4 @@ export declare type LineProps = {
     points: Array<Vector3 | [number, number, number]>;
     vertexColors?: Array<Color | [number, number, number]>;
 } & LineMaterialParameters & Omit<ReactThreeFiber.Object3DNode<Line2, typeof Line2>, 'args'> & Omit<ReactThreeFiber.Object3DNode<LineMaterial, [LineMaterialParameters]>, 'color' | 'vertexColors' | 'resolution' | 'args'>;
-export declare const Line: React.ForwardRefExoticComponent<Pick<LineProps, "attach" | "children" | "key" | "onUpdate" | "position" | "up" | "scale" | "rotation" | "matrix" | "quaternion" | "layers" | "dispose" | "type" | "id" | "uuid" | "parent" | "modelViewMatrix" | "normalMatrix" | "matrixWorld" | "matrixAutoUpdate" | "matrixWorldNeedsUpdate" | "castShadow" | "receiveShadow" | "frustumCulled" | "renderOrder" | "animations" | "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" | "color" | keyof import("@react-three/fiber/dist/declarations/src/core/events").EventHandlers | "dashed" | "points" | "material" | "isMaterial" | "needsUpdate" | "version" | "onBeforeCompile" | "customProgramCacheKey" | "setValues" | "isLine2" | "computeLineDistances" | "geometry" | "morphTargetInfluences" | "morphTargetDictionary" | "isMesh" | "updateMorphTargets" | "lineWidth" | "dashScale" | "dashOffset" | "dashSize" | "resolution" | "derivatives" | "defaultAttributeValues" | "index0AttributeName" | "uniformsNeedUpdate" | "isShaderMaterial" | "gapSize" | keyof import("three").ShaderMaterialParameters> & React.RefAttributes<Line2>>;
+export declare const Line: React.ForwardRefExoticComponent<Pick<LineProps, "attach" | "children" | "key" | "onUpdate" | "position" | "up" | "scale" | "rotation" | "matrix" | "quaternion" | "layers" | "dispose" | "type" | "id" | "uuid" | "parent" | "modelViewMatrix" | "normalMatrix" | "matrixWorld" | "matrixAutoUpdate" | "matrixWorldNeedsUpdate" | "castShadow" | "receiveShadow" | "frustumCulled" | "renderOrder" | "animations" | "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" | "color" | keyof import("@react-three/fiber/dist/declarations/src/core/events").EventHandlers | "dashed" | "points" | "material" | "alphaWrite" | "isMaterial" | "needsUpdate" | "version" | "onBeforeCompile" | "customProgramCacheKey" | "setValues" | "isLine2" | "computeLineDistances" | "geometry" | "morphTargetInfluences" | "morphTargetDictionary" | "isMesh" | "updateMorphTargets" | "lineWidth" | "dashScale" | "dashOffset" | "dashSize" | "resolution" | "derivatives" | "defaultAttributeValues" | "index0AttributeName" | "uniformsNeedUpdate" | "isShaderMaterial" | "gapSize" | keyof import("three").ShaderMaterialParameters> & React.RefAttributes<Line2>>;

package/core/MapControls.d.ts

@@ -9,4 +9,4 @@ export declare type MapControlsProps = ReactThreeFiber.Overwrite<ReactThreeFiber
     onStart?: (e?: THREE.Event) => void;
     onEnd?: (e?: THREE.Event) => void;
 }>;
-export declare const MapControls: React.ForwardRefExoticComponent<Pick<MapControlsProps, "object" | "attach" | "args" | "children" | "key" | "onUpdate" | "position" | "up" | "scale" | "rotation" | "matrix" | "quaternion" | "layers" | "dispose" | "addEventListener" | "hasEventListener" | "removeEventListener" | "dispatchEvent" | "onChange" | keyof import("@react-three/fiber/dist/declarations/src/core/events").EventHandlers | "camera" | "reset" | "enabled" | "update" | "onStart" | "keys" | "target" | "touches" | "connect" | "domElement" | "minDistance" | "maxDistance" | "minZoom" | "maxZoom" | "minPolarAngle" | "maxPolarAngle" | "minAzimuthAngle" | "maxAzimuthAngle" | "enableDamping" | "dampingFactor" | "enableZoom" | "zoomSpeed" | "enableRotate" | "rotateSpeed" | "enablePan" | "panSpeed" | "screenSpacePanning" | "keyPanSpeed" | "autoRotate" | "autoRotateSpeed" | "mouseButtons" | "target0" | "position0" | "zoom0" | "_domElementKeyEvents" | "getPolarAngle" | "getAzimuthalAngle" | "setPolarAngle" | "setAzimuthalAngle" | "getDistance" | "listenToKeyEvents" | "saveState" | "onEnd"> & React.RefAttributes<MapControlsImpl>>;
+export declare const MapControls: React.ForwardRefExoticComponent<Pick<MapControlsProps, "object" | "attach" | "args" | "children" | "key" | "onUpdate" | "position" | "up" | "scale" | "rotation" | "matrix" | "quaternion" | "layers" | "dispose" | "addEventListener" | "hasEventListener" | "removeEventListener" | "dispatchEvent" | "onChange" | keyof import("@react-three/fiber/dist/declarations/src/core/events").EventHandlers | "camera" | "reset" | "enabled" | "update" | "onStart" | "keys" | "target" | "touches" | "connect" | "domElement" | "minDistance" | "maxDistance" | "minZoom" | "maxZoom" | "minPolarAngle" | "maxPolarAngle" | "minAzimuthAngle" | "maxAzimuthAngle" | "enableDamping" | "dampingFactor" | "enableZoom" | "zoomSpeed" | "enableRotate" | "rotateSpeed" | "enablePan" | "panSpeed" | "screenSpacePanning" | "keyPanSpeed" | "autoRotate" | "autoRotateSpeed" | "reverseOrbit" | "mouseButtons" | "target0" | "position0" | "zoom0" | "_domElementKeyEvents" | "getPolarAngle" | "getAzimuthalAngle" | "setPolarAngle" | "setAzimuthalAngle" | "getDistance" | "listenToKeyEvents" | "saveState" | "onEnd"> & React.RefAttributes<MapControlsImpl>>;

package/core/MeshDistortMaterial.d.ts

@@ -12,14 +12,12 @@ declare global {
         }
     }
 }
-export declare const MeshDistortMaterial: React.ForwardRefExoticComponent<Pick<Omit<import("@react-three/fiber").Node<MeshPhysicalMaterial, [MeshPhysicalMaterialParameters]>, "color" | undefined> & {
-    color?: import("@react-three/fiber").Color | undefined;
-} & {
+export declare const MeshDistortMaterial: React.ForwardRefExoticComponent<Pick<import("@react-three/fiber").ExtendedColors<import("@react-three/fiber").Overwrite<Partial<MeshPhysicalMaterial>, import("@react-three/fiber").NodeProps<MeshPhysicalMaterial, [MeshPhysicalMaterialParameters]>>> & {
     time?: number | undefined;
     distort?: number | undefined;
     radius?: number | undefined;
 } & {
     speed?: number | undefined;
     factor?: number | undefined;
-}, "visible" | "attach" | "args" | "children" | "key" | "onUpdate" | "dispose" | "type" | "id" | "uuid" | "name" | "userData" | "toJSON" | "clone" | "copy" | "addEventListener" | "hasEventListener" | "removeEventListener" | "dispatchEvent" | "color" | "map" | "time" | "transparent" | "fog" | "opacity" | "speed" | "precision" | "alphaTest" | "alphaToCoverage" | "blendDst" | "blendDstAlpha" | "blendEquation" | "blendEquationAlpha" | "blending" | "blendSrc" | "blendSrcAlpha" | "clipIntersection" | "clippingPlanes" | "clipShadows" | "colorWrite" | "defines" | "depthFunc" | "depthTest" | "depthWrite" | "format" | "stencilWrite" | "stencilFunc" | "stencilRef" | "stencilWriteMask" | "stencilFuncMask" | "stencilFail" | "stencilZFail" | "stencilZPass" | "isMaterial" | "needsUpdate" | "polygonOffset" | "polygonOffsetFactor" | "polygonOffsetUnits" | "premultipliedAlpha" | "dithering" | "side" | "shadowSide" | "toneMapped" | "vertexColors" | "version" | "onBeforeCompile" | "customProgramCacheKey" | "setValues" | "wireframe" | "wireframeLinewidth" | "emissive" | "emissiveIntensity" | "emissiveMap" | "lightMap" | "lightMapIntensity" | "aoMap" | "aoMapIntensity" | "alphaMap" | "envMap" | "reflectivity" | "refractionRatio" | "wireframeLinecap" | "wireframeLinejoin" | "clearcoat" | "clearcoatMap" | "clearcoatRoughness" | "clearcoatRoughnessMap" | "clearcoatNormalScale" | "clearcoatNormalMap" | "ior" | "sheen" | "sheenColor" | "sheenColorMap" | "sheenRoughness" | "sheenRoughnessMap" | "transmission" | "transmissionMap" | "thickness" | "thicknessMap" | "attenuationDistance" | "attenuationColor" | "specularIntensity" | "specularColor" | "specularIntensityMap" | "specularColorMap" | "roughness" | "metalness" | "bumpMap" | "bumpScale" | "normalMap" | "normalMapType" | "normalScale" | "displacementMap" | "displacementScale" | "displacementBias" | "roughnessMap" | "metalnessMap" | "envMapIntensity" | "flatShading" | "isMeshStandardMaterial" | "radius" | "distort" | "factor"> & React.RefAttributes<unknown>>;
+}, "attach" | "args" | "children" | "key" | "onUpdate" | "time" | "speed" | keyof MeshPhysicalMaterial | "radius" | "distort" | "factor"> & React.RefAttributes<unknown>>;
 export {};

package/core/MeshReflectorMaterial.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@babel/runtime/helpers/extends"),t=require("react"),r=require("three"),a=require("@react-three/fiber"),n=require("react-merge-refs"),i=require("../materials/BlurPass.cjs.js"),o=require("../materials/MeshReflectorMaterial.cjs.js");function s(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function l(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)}require("../materials/ConvolutionMaterial.cjs.js");var u=s(e),d=l(t),c=s(n);a.extend({MeshReflectorMaterialImpl:o.MeshReflectorMaterial});const p=d.forwardRef((({mixBlur:e=0,mixStrength:t=1,resolution:n=256,blur:o=[0,0],minDepthThreshold:s=.9,maxDepthThreshold:l=1,depthScale:p=0,depthToBlurRatioBias:m=.25,mirror:h=0,debug:f=0,distortion:x=1,mixContrast:M=1,distortionMap:T,...S},b)=>{const y=a.useThree((({gl:e})=>e)),w=a.useThree((({camera:e})=>e)),g=a.useThree((({scene:e})=>e)),R=(o=Array.isArray(o)?o:[o,o])[0]+o[1]>0,v=d.useRef(null),[j]=d.useState((()=>new r.Plane)),[B]=d.useState((()=>new r.Vector3)),[D]=d.useState((()=>new r.Vector3)),[_]=d.useState((()=>new r.Vector3)),[P]=d.useState((()=>new r.Matrix4)),[U]=d.useState((()=>new r.Vector3(0,0,-1))),[E]=d.useState((()=>new r.Vector4)),[O]=d.useState((()=>new r.Vector3)),[F]=d.useState((()=>new r.Vector3)),[V]=d.useState((()=>new r.Vector4)),[W]=d.useState((()=>new r.Matrix4)),[q]=d.useState((()=>new r.PerspectiveCamera)),I=d.useCallback((()=>{var e;const t=v.current.parent||(null==(e=v.current)?void 0:e.__r3f.parent);if(!t)return;if(D.setFromMatrixPosition(t.matrixWorld),_.setFromMatrixPosition(w.matrixWorld),P.extractRotation(t.matrixWorld),B.set(0,0,1),B.applyMatrix4(P),O.subVectors(D,_),O.dot(B)>0)return;O.reflect(B).negate(),O.add(D),P.extractRotation(w.matrixWorld),U.set(0,0,-1),U.applyMatrix4(P),U.add(_),F.subVectors(D,U),F.reflect(B).negate(),F.add(D),q.position.copy(O),q.up.set(0,1,0),q.up.applyMatrix4(P),q.up.reflect(B),q.lookAt(F),q.far=w.far,q.updateMatrixWorld(),q.projectionMatrix.copy(w.projectionMatrix),W.set(.5,0,0,.5,0,.5,0,.5,0,0,.5,.5,0,0,0,1),W.multiply(q.projectionMatrix),W.multiply(q.matrixWorldInverse),W.multiply(t.matrixWorld),j.setFromNormalAndCoplanarPoint(B,D),j.applyMatrix4(q.matrixWorldInverse),E.set(j.normal.x,j.normal.y,j.normal.z,j.constant);const r=q.projectionMatrix;V.x=(Math.sign(E.x)+r.elements[8])/r.elements[0],V.y=(Math.sign(E.y)+r.elements[9])/r.elements[5],V.z=-1,V.w=(1+r.elements[10])/r.elements[14],E.multiplyScalar(2/E.dot(V)),r.elements[2]=E.x,r.elements[6]=E.y,r.elements[10]=E.z+1,r.elements[14]=E.w}),[w]),[C,k,L,z]=d.useMemo((()=>{const a={minFilter:r.LinearFilter,magFilter:r.LinearFilter,format:r.RGBFormat,encoding:y.outputEncoding},u=new r.WebGLRenderTarget(n,n,a);u.depthBuffer=!0,u.depthTexture=new r.DepthTexture(n,n),u.depthTexture.format=r.DepthFormat,u.depthTexture.type=r.UnsignedShortType;const d=new r.WebGLRenderTarget(n,n,a);return[u,d,new i.BlurPass({gl:y,resolution:n,width:o[0],height:o[1],minDepthThreshold:s,maxDepthThreshold:l,depthScale:p,depthToBlurRatioBias:m}),{mirror:h,textureMatrix:W,mixBlur:e,tDiffuse:u.texture,tDepth:u.depthTexture,tDiffuseBlur:d.texture,hasBlur:R,mixStrength:t,minDepthThreshold:s,maxDepthThreshold:l,depthScale:p,depthToBlurRatioBias:m,transparent:!0,debug:f,distortion:x,distortionMap:T,mixContrast:M,"defines-USE_BLUR":R?"":void 0,"defines-USE_DEPTH":p>0?"":void 0,"defines-USE_DISTORTION":T?"":void 0}]}),[y,o,W,n,h,R,e,t,s,l,p,m,f,x,T,M]);return a.useFrame((()=>{var e;const t=v.current.parent||(null==(e=v.current)?void 0:e.__r3f.parent);if(!t)return;t.visible=!1;const r=y.xr.enabled,a=y.shadowMap.autoUpdate;I(),y.xr.enabled=!1,y.shadowMap.autoUpdate=!1,y.setRenderTarget(C),y.state.buffers.depth.setMask(!0),y.autoClear||y.clear(),y.render(g,q),R&&L.render(y,C,k),y.xr.enabled=r,y.shadowMap.autoUpdate=a,t.visible=!0,y.setRenderTarget(null)})),d.createElement("meshReflectorMaterialImpl",u.default({attach:"material",key:"key"+z["defines-USE_BLUR"]+z["defines-USE_DEPTH"]+z["defines-USE_DISTORTION"],ref:c.default([v,b])},z,S))}));exports.MeshReflectorMaterial=p;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@babel/runtime/helpers/extends"),t=require("react"),r=require("three"),a=require("@react-three/fiber"),n=require("react-merge-refs"),o=require("../materials/BlurPass.cjs.js"),i=require("../materials/MeshReflectorMaterial.cjs.js");function s(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function l(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)}require("../materials/ConvolutionMaterial.cjs.js");var u=s(e),d=l(t),c=s(n);a.extend({MeshReflectorMaterialImpl:i.MeshReflectorMaterial});const p=d.forwardRef((({mixBlur:e=0,mixStrength:t=1,resolution:n=256,blur:i=[0,0],minDepthThreshold:s=.9,maxDepthThreshold:l=1,depthScale:p=0,depthToBlurRatioBias:m=.25,mirror:h=0,distortion:f=1,mixContrast:x=1,distortionMap:M,reflectorOffset:T=0,...S},y)=>{const w=a.useThree((({gl:e})=>e)),b=a.useThree((({camera:e})=>e)),g=a.useThree((({scene:e})=>e)),R=(i=Array.isArray(i)?i:[i,i])[0]+i[1]>0,v=d.useRef(null),[j]=d.useState((()=>new r.Plane)),[D]=d.useState((()=>new r.Vector3)),[B]=d.useState((()=>new r.Vector3)),[_]=d.useState((()=>new r.Vector3)),[O]=d.useState((()=>new r.Matrix4)),[P]=d.useState((()=>new r.Vector3(0,0,-1))),[U]=d.useState((()=>new r.Vector4)),[E]=d.useState((()=>new r.Vector3)),[V]=d.useState((()=>new r.Vector3)),[F]=d.useState((()=>new r.Vector4)),[W]=d.useState((()=>new r.Matrix4)),[q]=d.useState((()=>new r.PerspectiveCamera)),I=d.useCallback((()=>{var e;const t=v.current.parent||(null==(e=v.current)?void 0:e.__r3f.parent);if(!t)return;if(B.setFromMatrixPosition(t.matrixWorld),_.setFromMatrixPosition(b.matrixWorld),O.extractRotation(t.matrixWorld),D.set(0,0,1),D.applyMatrix4(O),B.addScaledVector(D,T),E.subVectors(B,_),E.dot(D)>0)return;E.reflect(D).negate(),E.add(B),O.extractRotation(b.matrixWorld),P.set(0,0,-1),P.applyMatrix4(O),P.add(_),V.subVectors(B,P),V.reflect(D).negate(),V.add(B),q.position.copy(E),q.up.set(0,1,0),q.up.applyMatrix4(O),q.up.reflect(D),q.lookAt(V),q.far=b.far,q.updateMatrixWorld(),q.projectionMatrix.copy(b.projectionMatrix),W.set(.5,0,0,.5,0,.5,0,.5,0,0,.5,.5,0,0,0,1),W.multiply(q.projectionMatrix),W.multiply(q.matrixWorldInverse),W.multiply(t.matrixWorld),j.setFromNormalAndCoplanarPoint(D,B),j.applyMatrix4(q.matrixWorldInverse),U.set(j.normal.x,j.normal.y,j.normal.z,j.constant);const r=q.projectionMatrix;F.x=(Math.sign(U.x)+r.elements[8])/r.elements[0],F.y=(Math.sign(U.y)+r.elements[9])/r.elements[5],F.z=-1,F.w=(1+r.elements[10])/r.elements[14],U.multiplyScalar(2/U.dot(F)),r.elements[2]=U.x,r.elements[6]=U.y,r.elements[10]=U.z+1,r.elements[14]=U.w}),[b,T]),[C,k,L,z]=d.useMemo((()=>{const a={minFilter:r.LinearFilter,magFilter:r.LinearFilter,encoding:w.outputEncoding,type:r.HalfFloatType},u=new r.WebGLRenderTarget(n,n,a);u.depthBuffer=!0,u.depthTexture=new r.DepthTexture(n,n),u.depthTexture.format=r.DepthFormat,u.depthTexture.type=r.UnsignedShortType;const d=new r.WebGLRenderTarget(n,n,a);return[u,d,new o.BlurPass({gl:w,resolution:n,width:i[0],height:i[1],minDepthThreshold:s,maxDepthThreshold:l,depthScale:p,depthToBlurRatioBias:m}),{mirror:h,textureMatrix:W,mixBlur:e,tDiffuse:u.texture,tDepth:u.depthTexture,tDiffuseBlur:d.texture,hasBlur:R,mixStrength:t,minDepthThreshold:s,maxDepthThreshold:l,depthScale:p,depthToBlurRatioBias:m,transparent:!0,distortion:f,distortionMap:M,mixContrast:x,"defines-USE_BLUR":R?"":void 0,"defines-USE_DEPTH":p>0?"":void 0,"defines-USE_DISTORTION":M?"":void 0}]}),[w,i,W,n,h,R,e,t,s,l,p,m,f,M,x]);return a.useFrame((()=>{var e;const t=v.current.parent||(null==(e=v.current)?void 0:e.__r3f.parent);if(!t)return;t.visible=!1;const r=w.xr.enabled,a=w.shadowMap.autoUpdate;I(),w.xr.enabled=!1,w.shadowMap.autoUpdate=!1,w.setRenderTarget(C),w.state.buffers.depth.setMask(!0),w.autoClear||w.clear(),w.render(g,q),R&&L.render(w,C,k),w.xr.enabled=r,w.shadowMap.autoUpdate=a,t.visible=!0,w.setRenderTarget(null)})),d.createElement("meshReflectorMaterialImpl",u.default({attach:"material",key:"key"+z["defines-USE_BLUR"]+z["defines-USE_DEPTH"]+z["defines-USE_DISTORTION"],ref:c.default([v,y])},z,S))}));exports.MeshReflectorMaterial=p;

package/core/MeshReflectorMaterial.d.ts

@@ -11,10 +11,10 @@ export declare type Props = JSX.IntrinsicElements['meshStandardMaterial'] & {
     maxDepthThreshold?: number;
     depthScale?: number;
     depthToBlurRatioBias?: number;
-    debug?: number;
     distortionMap?: Texture;
     distortion?: number;
     mixContrast?: number;
+    reflectorOffset?: number;
 };
 declare global {
     namespace JSX {
@@ -23,4 +23,4 @@ declare global {
         }
     }
 }
-export declare const MeshReflectorMaterial: React.ForwardRefExoticComponent<Pick<Props, "visible" | "attach" | "args" | "children" | "key" | "onUpdate" | "dispose" | "type" | "id" | "uuid" | "name" | "userData" | "toJSON" | "clone" | "copy" | "addEventListener" | "hasEventListener" | "removeEventListener" | "dispatchEvent" | "color" | "map" | "transparent" | "fog" | "blur" | "opacity" | "precision" | "alphaTest" | "alphaToCoverage" | "blendDst" | "blendDstAlpha" | "blendEquation" | "blendEquationAlpha" | "blending" | "blendSrc" | "blendSrcAlpha" | "clipIntersection" | "clippingPlanes" | "clipShadows" | "colorWrite" | "defines" | "depthFunc" | "depthTest" | "depthWrite" | "format" | "stencilWrite" | "stencilFunc" | "stencilRef" | "stencilWriteMask" | "stencilFuncMask" | "stencilFail" | "stencilZFail" | "stencilZPass" | "isMaterial" | "needsUpdate" | "polygonOffset" | "polygonOffsetFactor" | "polygonOffsetUnits" | "premultipliedAlpha" | "dithering" | "side" | "shadowSide" | "toneMapped" | "vertexColors" | "version" | "onBeforeCompile" | "customProgramCacheKey" | "setValues" | "resolution" | "wireframe" | "wireframeLinewidth" | "emissive" | "emissiveIntensity" | "emissiveMap" | "lightMap" | "lightMapIntensity" | "aoMap" | "aoMapIntensity" | "alphaMap" | "envMap" | "refractionRatio" | "wireframeLinecap" | "wireframeLinejoin" | "roughness" | "metalness" | "bumpMap" | "bumpScale" | "normalMap" | "normalMapType" | "normalScale" | "displacementMap" | "displacementScale" | "displacementBias" | "roughnessMap" | "metalnessMap" | "envMapIntensity" | "flatShading" | "isMeshStandardMaterial" | "minDepthThreshold" | "maxDepthThreshold" | "depthScale" | "depthToBlurRatioBias" | "mixBlur" | "mixStrength" | "mirror" | "debug" | "distortion" | "mixContrast" | "distortionMap"> & React.RefAttributes<MeshReflectorMaterialImpl>>;
+export declare const MeshReflectorMaterial: React.ForwardRefExoticComponent<Pick<Props, "attach" | "args" | "children" | "key" | "onUpdate" | "blur" | "resolution" | keyof import("three").MeshStandardMaterial | "minDepthThreshold" | "maxDepthThreshold" | "depthScale" | "depthToBlurRatioBias" | "mixBlur" | "mixStrength" | "mirror" | "distortion" | "mixContrast" | "distortionMap" | "reflectorOffset"> & React.RefAttributes<MeshReflectorMaterialImpl>>;

package/core/MeshReflectorMaterial.js

@@ -1,6 +1,6 @@
 import _extends from '@babel/runtime/helpers/esm/extends';
 import * as React from 'react';
-import { Plane, Vector3, Matrix4, Vector4, PerspectiveCamera, LinearFilter, RGBFormat, WebGLRenderTarget, DepthTexture, DepthFormat, UnsignedShortType } from 'three';
+import { Plane, Vector3, Matrix4, Vector4, PerspectiveCamera, LinearFilter, HalfFloatType, WebGLRenderTarget, DepthTexture, DepthFormat, UnsignedShortType } from 'three';
 import { extend, useThree, useFrame } from '@react-three/fiber';
 import mergeRefs from 'react-merge-refs';
 import { BlurPass } from '../materials/BlurPass.js';
@@ -19,10 +19,10 @@ const MeshReflectorMaterial = /*#__PURE__*/React.forwardRef(({
   depthScale = 0,
   depthToBlurRatioBias = 0.25,
   mirror = 0,
-  debug = 0,
   distortion = 1,
   mixContrast = 1,
   distortionMap,
+  reflectorOffset = 0,
   ...props
 }, ref) => {
   const gl = useThree(({
@@ -60,6 +60,7 @@ const MeshReflectorMaterial = /*#__PURE__*/React.forwardRef(({
     rotationMatrix.extractRotation(parent.matrixWorld);
     normal.set(0, 0, 1);
     normal.applyMatrix4(rotationMatrix);
+    reflectorWorldPosition.addScaledVector(normal, reflectorOffset);
     view.subVectors(reflectorWorldPosition, cameraWorldPosition); // Avoid rendering when reflector is facing away
 
     if (view.dot(normal) > 0) return;
@@ -103,13 +104,13 @@ const MeshReflectorMaterial = /*#__PURE__*/React.forwardRef(({
     projectionMatrix.elements[6] = clipPlane.y;
     projectionMatrix.elements[10] = clipPlane.z + 1.0;
     projectionMatrix.elements[14] = clipPlane.w;
-  }, [camera]);
+  }, [camera, reflectorOffset]);
   const [fbo1, fbo2, blurpass, reflectorProps] = React.useMemo(() => {
     const parameters = {
       minFilter: LinearFilter,
       magFilter: LinearFilter,
-      format: RGBFormat,
-      encoding: gl.outputEncoding
+      encoding: gl.outputEncoding,
+      type: HalfFloatType
     };
     const fbo1 = new WebGLRenderTarget(resolution, resolution, parameters);
     fbo1.depthBuffer = true;
@@ -141,7 +142,6 @@ const MeshReflectorMaterial = /*#__PURE__*/React.forwardRef(({
       depthScale,
       depthToBlurRatioBias,
       transparent: true,
-      debug,
       distortion,
       distortionMap,
       mixContrast,
@@ -150,7 +150,7 @@ const MeshReflectorMaterial = /*#__PURE__*/React.forwardRef(({
       'defines-USE_DISTORTION': distortionMap ? '' : undefined
     };
     return [fbo1, fbo2, blurpass, reflectorProps];
-  }, [gl, blur, textureMatrix, resolution, mirror, hasBlur, mixBlur, mixStrength, minDepthThreshold, maxDepthThreshold, depthScale, depthToBlurRatioBias, debug, distortion, distortionMap, mixContrast]);
+  }, [gl, blur, textureMatrix, resolution, mirror, hasBlur, mixBlur, mixStrength, minDepthThreshold, maxDepthThreshold, depthScale, depthToBlurRatioBias, distortion, distortionMap, mixContrast]);
   useFrame(() => {
     var _materialRef$current2;
 

package/core/MeshWobbleMaterial.d.ts

@@ -12,14 +12,12 @@ declare global {
         }
     }
 }
-export declare const MeshWobbleMaterial: React.ForwardRefExoticComponent<Pick<Omit<import("@react-three/fiber").Node<MeshStandardMaterial, [MeshStandardMaterialParameters]>, "color" | undefined> & {
-    color?: import("@react-three/fiber").Color | undefined;
-} & {
+export declare const MeshWobbleMaterial: React.ForwardRefExoticComponent<Pick<import("@react-three/fiber").ExtendedColors<import("@react-three/fiber").Overwrite<Partial<MeshStandardMaterial>, import("@react-three/fiber").NodeProps<MeshStandardMaterial, [MeshStandardMaterialParameters]>>> & {
     time?: number | undefined;
     factor?: number | undefined;
     speed?: number | undefined;
 } & {
     speed?: number | undefined;
     factor?: number | undefined;
-}, "visible" | "attach" | "args" | "children" | "key" | "onUpdate" | "dispose" | "type" | "id" | "uuid" | "name" | "userData" | "toJSON" | "clone" | "copy" | "addEventListener" | "hasEventListener" | "removeEventListener" | "dispatchEvent" | "color" | "map" | "time" | "transparent" | "fog" | "opacity" | "speed" | "precision" | "alphaTest" | "alphaToCoverage" | "blendDst" | "blendDstAlpha" | "blendEquation" | "blendEquationAlpha" | "blending" | "blendSrc" | "blendSrcAlpha" | "clipIntersection" | "clippingPlanes" | "clipShadows" | "colorWrite" | "defines" | "depthFunc" | "depthTest" | "depthWrite" | "format" | "stencilWrite" | "stencilFunc" | "stencilRef" | "stencilWriteMask" | "stencilFuncMask" | "stencilFail" | "stencilZFail" | "stencilZPass" | "isMaterial" | "needsUpdate" | "polygonOffset" | "polygonOffsetFactor" | "polygonOffsetUnits" | "premultipliedAlpha" | "dithering" | "side" | "shadowSide" | "toneMapped" | "vertexColors" | "version" | "onBeforeCompile" | "customProgramCacheKey" | "setValues" | "wireframe" | "wireframeLinewidth" | "emissive" | "emissiveIntensity" | "emissiveMap" | "lightMap" | "lightMapIntensity" | "aoMap" | "aoMapIntensity" | "alphaMap" | "envMap" | "refractionRatio" | "wireframeLinecap" | "wireframeLinejoin" | "roughness" | "metalness" | "bumpMap" | "bumpScale" | "normalMap" | "normalMapType" | "normalScale" | "displacementMap" | "displacementScale" | "displacementBias" | "roughnessMap" | "metalnessMap" | "envMapIntensity" | "flatShading" | "isMeshStandardMaterial" | "factor"> & React.RefAttributes<unknown>>;
+}, "attach" | "args" | "children" | "key" | "onUpdate" | "time" | "speed" | "factor" | keyof MeshStandardMaterial> & React.RefAttributes<unknown>>;
 export {};

package/core/OrbitControls.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@babel/runtime/helpers/extends"),t=require("@react-three/fiber"),r=require("react"),n=require("three-stdlib");function o(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function s(e){if(e&&e.__esModule)return e;var t=Object.create(null);return e&&Object.keys(e).forEach((function(r){if("default"!==r){var n=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(t,r,n.get?n:{enumerable:!0,get:function(){return e[r]}})}})),t.default=e,Object.freeze(t)}var a=o(e),u=s(r);const c=u.forwardRef((({makeDefault:e,camera:r,regress:o,domElement:s,enableDamping:c=!0,onChange:i,onStart:d,onEnd:l,...f},b)=>{const m=t.useThree((({invalidate:e})=>e)),v=t.useThree((({camera:e})=>e)),p=t.useThree((({gl:e})=>e)),h=t.useThree((({events:e})=>e)),E=t.useThree((({set:e})=>e)),g=t.useThree((({get:e})=>e)),O=t.useThree((({performance:e})=>e)),j=r||v,T=s||("boolean"!=typeof h.connected?h.connected:p.domElement),y=u.useMemo((()=>new n.OrbitControls(j)),[j]);return t.useFrame((()=>{y.enabled&&y.update()})),u.useEffect((()=>{const e=e=>{m(),o&&O.regress(),i&&i(e)};return y.connect(T),y.addEventListener("change",e),d&&y.addEventListener("start",d),l&&y.addEventListener("end",l),()=>{y.removeEventListener("change",e),d&&y.removeEventListener("start",d),l&&y.removeEventListener("end",l),y.dispose()}}),[T,i,d,l,o,y,m]),u.useEffect((()=>{if(e){const e=g().controls;return E({controls:y}),()=>E({controls:e})}}),[e,y]),u.createElement("primitive",a.default({ref:b,object:y,enableDamping:c},f))}));exports.OrbitControls=c;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@babel/runtime/helpers/extends"),t=require("@react-three/fiber"),r=require("react"),n=require("three-stdlib");function s(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function o(e){if(e&&e.__esModule)return e;var t=Object.create(null);return e&&Object.keys(e).forEach((function(r){if("default"!==r){var n=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(t,r,n.get?n:{enumerable:!0,get:function(){return e[r]}})}})),t.default=e,Object.freeze(t)}var a=s(e),u=o(r);const c=u.forwardRef((({makeDefault:e,camera:r,regress:s,domElement:o,enableDamping:c=!0,onChange:i,onStart:f,onEnd:d,...l},m)=>{const b=t.useThree((e=>e.invalidate)),v=t.useThree((e=>e.camera)),h=t.useThree((e=>e.gl)),p=t.useThree((e=>e.events)),E=t.useThree((e=>e.set)),g=t.useThree((e=>e.get)),O=t.useThree((e=>e.performance)),j=r||v,T=o||p.connected||h.domElement,L=u.useMemo((()=>new n.OrbitControls(j)),[j]);return t.useFrame((()=>{L.enabled&&L.update()})),u.useEffect((()=>(L.connect(T),()=>{L.dispose()})),[T,s,L,b]),u.useEffect((()=>{const e=e=>{b(),s&&O.regress(),i&&i(e)};return L.addEventListener("change",e),f&&L.addEventListener("start",f),d&&L.addEventListener("end",d),()=>{f&&L.removeEventListener("start",f),d&&L.removeEventListener("end",d),L.removeEventListener("change",e)}}),[i,f,d]),u.useEffect((()=>{if(e){const e=g().controls;return E({controls:L}),()=>E({controls:e})}}),[e,L]),u.createElement("primitive",a.default({ref:m,object:L,enableDamping:c},l))}));exports.OrbitControls=c;

package/core/OrbitControls.d.ts

@@ -1,16 +1,16 @@
 import { ReactThreeFiber } from '@react-three/fiber';
 import * as React from 'react';
-import * as THREE from 'three';
+import type { Camera, Event } from 'three';
 import { OrbitControls as OrbitControlsImpl } from 'three-stdlib';
-export declare type OrbitControlsProps = ReactThreeFiber.Overwrite<ReactThreeFiber.Object3DNode<OrbitControlsImpl, typeof OrbitControlsImpl>, {
-    target?: ReactThreeFiber.Vector3;
-    camera?: THREE.Camera;
+export declare type OrbitControlsProps = Omit<ReactThreeFiber.Overwrite<ReactThreeFiber.Object3DNode<OrbitControlsImpl, typeof OrbitControlsImpl>, {
+    camera?: Camera;
     domElement?: HTMLElement;
-    regress?: boolean;
     enableDamping?: boolean;
     makeDefault?: boolean;
-    onChange?: (e?: THREE.Event) => void;
-    onStart?: (e?: THREE.Event) => void;
-    onEnd?: (e?: THREE.Event) => void;
-}>;
-export declare const OrbitControls: React.ForwardRefExoticComponent<Pick<OrbitControlsProps, "object" | "attach" | "args" | "children" | "key" | "onUpdate" | "position" | "up" | "scale" | "rotation" | "matrix" | "quaternion" | "layers" | "dispose" | "addEventListener" | "hasEventListener" | "removeEventListener" | "dispatchEvent" | "onChange" | keyof import("@react-three/fiber/dist/declarations/src/core/events").EventHandlers | "camera" | "reset" | "enabled" | "update" | "onStart" | "keys" | "target" | "touches" | "connect" | "makeDefault" | "domElement" | "minDistance" | "maxDistance" | "minZoom" | "maxZoom" | "minPolarAngle" | "maxPolarAngle" | "minAzimuthAngle" | "maxAzimuthAngle" | "enableDamping" | "dampingFactor" | "enableZoom" | "zoomSpeed" | "enableRotate" | "rotateSpeed" | "enablePan" | "panSpeed" | "screenSpacePanning" | "keyPanSpeed" | "autoRotate" | "autoRotateSpeed" | "mouseButtons" | "target0" | "position0" | "zoom0" | "_domElementKeyEvents" | "getPolarAngle" | "getAzimuthalAngle" | "setPolarAngle" | "setAzimuthalAngle" | "getDistance" | "listenToKeyEvents" | "saveState" | "onEnd" | "regress"> & React.RefAttributes<OrbitControlsImpl>>;
+    onChange?: (e?: Event) => void;
+    onEnd?: (e?: Event) => void;
+    onStart?: (e?: Event) => void;
+    regress?: boolean;
+    target?: ReactThreeFiber.Vector3;
+}>, 'ref'>;
+export declare const OrbitControls: React.ForwardRefExoticComponent<OrbitControlsProps & React.RefAttributes<OrbitControlsImpl>>;