@react-three/drei 9.121.6-rc.1 → 9.122.0

package/core/Sparkles.d.ts

@@ -1,6 +1,15 @@
 import * as THREE from 'three';
-import { ThreeElement, ThreeElements } from '@react-three/fiber';
+import { PointsProps, MaterialNode } from '@react-three/fiber';
 import { ForwardRefComponent } from '../helpers/ts-utils';
+interface Props {
+    count?: number;
+    speed?: number | Float32Array;
+    opacity?: number | Float32Array;
+    color?: THREE.ColorRepresentation | Float32Array;
+    size?: number | Float32Array;
+    scale?: number | [number, number, number] | THREE.Vector3;
+    noise?: number | [number, number, number] | THREE.Vector3 | Float32Array;
+}
 declare class SparklesImplMaterial extends THREE.ShaderMaterial {
     constructor();
     get time(): number;
@@ -8,19 +17,12 @@ declare class SparklesImplMaterial extends THREE.ShaderMaterial {
     get pixelRatio(): number;
     set pixelRatio(value: number);
 }
-declare module '@react-three/fiber' {
-    interface ThreeElements {
-        sparklesImplMaterial: ThreeElement<typeof SparklesImplMaterial>;
+declare global {
+    namespace JSX {
+        interface IntrinsicElements {
+            sparklesImplMaterial: MaterialNode<SparklesImplMaterial, typeof SparklesImplMaterial>;
+        }
     }
 }
-export type SparklesProps = Omit<ThreeElements['points'], 'ref'> & {
-    count?: number;
-    speed?: number | Float32Array;
-    opacity?: number | Float32Array;
-    color?: THREE.ColorRepresentation | Float32Array;
-    size?: number | Float32Array;
-    scale?: number | [number, number, number] | THREE.Vector3;
-    noise?: number | [number, number, number] | THREE.Vector3 | Float32Array;
-};
-export declare const Sparkles: ForwardRefComponent<SparklesProps, THREE.Points>;
+export declare const Sparkles: ForwardRefComponent<Props & PointsProps, THREE.Points>;
 export {};

package/core/Splat.d.ts

@@ -1,6 +1,5 @@
 import * as THREE from 'three';
 import * as React from 'react';
-import { ThreeElements } from '@react-three/fiber';
 export type SplatMaterialType = {
     alphaTest?: number;
     alphaHash?: boolean;
@@ -41,16 +40,19 @@ export type SharedState = {
     update(target: TargetMesh, camera: THREE.Camera, hashed: boolean): void;
     onProgress?: (event: ProgressEvent) => void;
 };
-declare module '@react-three/fiber' {
-    interface ThreeElements {
-        splatMaterial: SplatMaterialType & ThreeElements['shaderMaterial'];
+declare global {
+    namespace JSX {
+        interface IntrinsicElements {
+            splatMaterial: SplatMaterialType & JSX.IntrinsicElements['shaderMaterial'];
+        }
     }
 }
-export type SplatProps = {
+type SplatProps = {
     src: string;
     toneMapped?: boolean;
     alphaTest?: number;
     alphaHash?: boolean;
     chunkSize?: number;
-} & Omit<ThreeElements['mesh'], 'ref'>;
+} & JSX.IntrinsicElements['mesh'];
 export declare function Splat({ src, toneMapped, alphaTest, alphaHash, chunkSize, ...props }: SplatProps): React.JSX.Element;
+export {};

package/core/SpotLight.d.ts

@@ -1,8 +1,7 @@
 import * as React from 'react';
 import { DepthTexture, SpotLight as SpotLightImpl, Texture } from 'three';
-import { ThreeElements } from '@react-three/fiber';
 import { ForwardRefComponent } from '../helpers/ts-utils';
-export type SpotLightProps = Omit<ThreeElements['spotLight'], 'ref'> & {
+type SpotLightProps = JSX.IntrinsicElements['spotLight'] & {
     depthBuffer?: DepthTexture;
     attenuation?: number;
     anglePower?: number;

package/core/SpriteAnimator.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@babel/runtime/helpers/extends"),r=require("react"),t=require("@react-three/fiber"),n=require("three"),u=require("./Instances.cjs.js"),a=require("./Billboard.cjs.js"),c=require("./useSpriteLoader.cjs.js");function l(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function s(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("../helpers/deprecated.cjs.js");var o=l(e),i=s(r),m=s(n);const f=i.createContext(null);const p=new m.PlaneGeometry(1,1),d=i.forwardRef((({startFrame:e=0,endFrame:r,fps:n=30,frameName:l="",textureDataURL:s,textureImageURL:d,loop:h=!1,numberOfFrames:v=1,autoPlay:y=!0,animationNames:w,onStart:E,onEnd:F,onLoopEnd:b,onFrame:g,play:x,pause:S=!1,flipX:j=!1,alphaTest:R=0,children:A,asSprite:M=!1,offset:N,playBackwards:O=!1,resetOnEnd:z=!1,maxItems:q=1,instanceItems:D=[[0,0,0]],spriteDataset:L,canvasRenderingContext2DSettings:P,roundFramePosition:T=!1,meshProps:I={},...k},B)=>{const C=i.useRef(new m.Group),V=i.useRef(null),_=i.useRef(null),U=i.useRef(null),G=i.useRef(window.performance.now()),H=i.useRef(e),J=i.useRef(l),W=n>0?1e3/n:0,[X,K]=i.useState(new m.Texture),Q=i.useRef(0),[Y,Z]=i.useState(new m.Vector3(1,1,1)),$=j?-1:1,ee=i.useRef(S),re=i.useRef(N),te=i.useRef(!1),{spriteObj:ne,loadJsonAndTexture:ue}=c.useSpriteLoader(null,null,w,v,void 0,P),ae=i.useRef(l),ce=i.useCallback(((e,r)=>{if(null===r)v&&(Q.current=v,O&&(H.current=v-1),V.current=r);else{var t,n;V.current=r,V.current&&Array.isArray(V.current.frames)?Q.current=V.current.frames.length:V.current&&"object"==typeof V.current&&ae.current?Q.current=V.current.frames[ae.current].length:Q.current=0,O&&(H.current=Q.current-1);const{w:u,h:a}=c.getFirstFrame(null!==(t=null==(n=V.current)?void 0:n.frames)&&void 0!==t?t:[],ae.current).sourceSize,l=oe(u,a);Z(l),_.current&&(_.current.map=e)}K(e)}),[v,O]),le=i.useCallback((()=>{if(!V.current)return;const{meta:{size:e},frames:r}=V.current,{w:t,h:n}=Array.isArray(r)?r[0].sourceSize:l&&r[l]?r[l][0].sourceSize:{w:0,h:0};_.current&&_.current.map&&(_.current.map.wrapS=_.current.map.wrapT=m.RepeatWrapping,_.current.map.center.set(0,0),_.current.map.repeat.set(1*$/(e.w/t),1/(e.h/n)));const u=1/((e.h-1)/n);_.current&&_.current.map&&(_.current.map.offset.x=0,_.current.map.offset.y=1-u),E&&E({currentFrameName:null!=l?l:"",currentFrame:H.current})}),[$,l,E]),se=i.useMemo((()=>({current:re.current,offset:re.current,imageUrl:d,hasEnded:!1,ref:B})),[d,B]);i.useImperativeHandle(B,(()=>C.current),[]),i.useLayoutEffect((()=>{re.current=N}),[N]);const oe=(e,r)=>{var t;const n=new m.Vector3,u=r/e;return n.set(1,u,1),null==(t=U.current)||t.scale.copy(n),n};i.useEffect((()=>{var e;L?ce(null==L||null==(e=L.spriteTexture)?void 0:e.clone(),L.spriteData):d&&s&&ue(d,s)}),[ue,L,s,d,ce]),i.useEffect((()=>{var e;ne&&ce(null==ne||null==(e=ne.spriteTexture)?void 0:e.clone(),null==ne?void 0:ne.spriteData)}),[ne,ce]),i.useEffect((()=>{var e;(se.hasEnded=!1,V.current&&!0===O)?H.current=(null!==(e=V.current.frames.length)&&void 0!==e?e:0)-1:H.current=0}),[O,se]),i.useLayoutEffect((()=>{le()}),[X,j,le]),i.useEffect((()=>{y&&(ee.current=!1)}),[y]),i.useLayoutEffect((()=>{if(J.current!==l&&l&&(H.current=0,J.current=l,se.hasEnded=!1,W<=0&&(H.current=r||e||0),V.current)){const{w:e,h:r}=c.getFirstFrame(V.current.frames,l).sourceSize,t=oe(e,r);Z(t)}}),[l,W,se,r,e]);const ie=(e,r,t,n)=>{var u=void 0===N?se.current:N;const a=H.current;let c=0,l=0;oe(e,r);const s=T?Math.round((t.w-1)/e):(t.w-1)/e,o=T?Math.round((t.h-1)/r):(t.h-1)/r;if(!n[a])return;const{frame:{x:i,y:m},sourceSize:{w:f,h:p}}=n[a],d=1/s,h=1/o;if(_.current&&_.current.map&&(c=$>0?d*(i/f):d*(i/f)-_.current.map.repeat.x,l=Math.abs(1-h)-h*(m/p),_.current.map.offset.x=c,_.current.map.offset.y=l),null!=u){let e=Math.floor(u*n.length);e=Math.max(0,Math.min(e,n.length-1)),isNaN(e)&&(e=0),H.current=e}else O?H.current-=1:H.current+=1};return t.useFrame(((t,n)=>{var u,a;null!=(u=V.current)&&u.frames&&null!=(a=_.current)&&a.map&&(ee.current||se.hasEnded||!y&&!x||((()=>{if(null===(t=V.current)||!("meta"in t)||!("frames"in t))return;var t;const{meta:{size:n},frames:u}=V.current,{w:a,h:s}=c.getFirstFrame(u,l).sourceSize,o=Array.isArray(u)?u:l?u[l]:[],i=r||o.length-1;var m=void 0===N?se.current:N;if(W<=0)return H.current=r||e||0,void ie(a,s,n,o);const f=window.performance.now(),p=f-G.current;if(!(p<=W)){var d=O?H.current<0:H.current>i,v=O?H.current===i:0===H.current,y=O?H.current<0:H.current>=i;if(d){if(H.current=h&&null!=e?e:0,O&&(H.current=i),h?null==b||b({currentFrameName:null!=l?l:"",currentFrame:H.current}):(null==F||F({currentFrameName:null!=l?l:"",currentFrame:H.current}),se.hasEnded=!z,z&&(ee.current=!0)),!h)return}else v&&(null==E||E({currentFrameName:null!=l?l:"",currentFrame:H.current}));void 0!==m&&y?!1===te.current&&(null==F||F({currentFrameName:null!=l?l:"",currentFrame:H.current}),te.current=!0):te.current=!1,p<=W||(G.current=f-p%W,ie(a,s,n,o))}})(),null==g||g({currentFrameName:J.current,currentFrame:H.current})))})),i.createElement("group",o.default({},k,{ref:C,scale:function(e=new m.Vector3(1,1,1),r=1){return"number"==typeof r?e.multiplyScalar(r):Array.isArray(r)?e.multiply(new m.Vector3(...r)):r instanceof m.Vector3?e.multiply(r):void 0}(Y,k.scale)}),i.createElement(f.Provider,{value:se},M&&i.createElement(a.Billboard,null,i.createElement("mesh",o.default({ref:U,scale:1,geometry:p},I),i.createElement("meshBasicMaterial",{premultipliedAlpha:!1,toneMapped:!1,side:m.DoubleSide,ref:_,map:X,transparent:!0,alphaTest:null!=R?R:0}))),!M&&i.createElement(u.Instances,o.default({geometry:p,limit:null!=q?q:1},I),i.createElement("meshBasicMaterial",{premultipliedAlpha:!1,toneMapped:!1,side:m.DoubleSide,ref:_,map:X,transparent:!0,alphaTest:null!=R?R:0}),(null!=D?D:[0]).map(((e,r)=>i.createElement(u.Instance,o.default({key:r,ref:1===(null==D?void 0:D.length)?U:null,position:e,scale:1},I))))),A))}));exports.SpriteAnimator=d,exports.useSpriteAnimator=function(){return i.useContext(f)};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@babel/runtime/helpers/extends"),r=require("react"),t=require("@react-three/fiber"),n=require("three"),u=require("./Instances.cjs.js"),a=require("./Billboard.cjs.js"),c=require("./useSpriteLoader.cjs.js");function l(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function s(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("react-composer"),require("../helpers/deprecated.cjs.js");var o=l(e),i=s(r),m=s(n);const f=i.createContext(null);const p=new m.PlaneGeometry(1,1),d=i.forwardRef((({startFrame:e=0,endFrame:r,fps:n=30,frameName:l="",textureDataURL:s,textureImageURL:d,loop:h=!1,numberOfFrames:v=1,autoPlay:y=!0,animationNames:w,onStart:E,onEnd:F,onLoopEnd:b,onFrame:g,play:x,pause:S=!1,flipX:j=!1,alphaTest:R=0,children:A,asSprite:M=!1,offset:N,playBackwards:O=!1,resetOnEnd:q=!1,maxItems:z=1,instanceItems:D=[[0,0,0]],spriteDataset:L,canvasRenderingContext2DSettings:P,roundFramePosition:T=!1,meshProps:I={},...k},B)=>{const C=i.useRef(new m.Group),V=i.useRef(null),_=i.useRef(null),U=i.useRef(null),G=i.useRef(window.performance.now()),H=i.useRef(e),J=i.useRef(l),W=n>0?1e3/n:0,[X,K]=i.useState(new m.Texture),Q=i.useRef(0),[Y,Z]=i.useState(new m.Vector3(1,1,1)),$=j?-1:1,ee=i.useRef(S),re=i.useRef(N),te=i.useRef(!1),{spriteObj:ne,loadJsonAndTexture:ue}=c.useSpriteLoader(null,null,w,v,void 0,P),ae=i.useRef(l),ce=i.useCallback(((e,r)=>{if(null===r)v&&(Q.current=v,O&&(H.current=v-1),V.current=r);else{var t,n;V.current=r,V.current&&Array.isArray(V.current.frames)?Q.current=V.current.frames.length:V.current&&"object"==typeof V.current&&ae.current?Q.current=V.current.frames[ae.current].length:Q.current=0,O&&(H.current=Q.current-1);const{w:u,h:a}=c.getFirstFrame(null!==(t=null==(n=V.current)?void 0:n.frames)&&void 0!==t?t:[],ae.current).sourceSize,l=oe(u,a);Z(l),_.current&&(_.current.map=e)}K(e)}),[v,O]),le=i.useCallback((()=>{if(!V.current)return;const{meta:{size:e},frames:r}=V.current,{w:t,h:n}=Array.isArray(r)?r[0].sourceSize:l&&r[l]?r[l][0].sourceSize:{w:0,h:0};_.current&&_.current.map&&(_.current.map.wrapS=_.current.map.wrapT=m.RepeatWrapping,_.current.map.center.set(0,0),_.current.map.repeat.set(1*$/(e.w/t),1/(e.h/n)));const u=1/((e.h-1)/n);_.current&&_.current.map&&(_.current.map.offset.x=0,_.current.map.offset.y=1-u),E&&E({currentFrameName:null!=l?l:"",currentFrame:H.current})}),[$,l,E]),se=i.useMemo((()=>({current:re.current,offset:re.current,imageUrl:d,hasEnded:!1,ref:B})),[d,B]);i.useImperativeHandle(B,(()=>C.current),[]),i.useLayoutEffect((()=>{re.current=N}),[N]);const oe=(e,r)=>{var t;const n=new m.Vector3,u=r/e;return n.set(1,u,1),null==(t=U.current)||t.scale.copy(n),n};i.useEffect((()=>{var e;L?ce(null==L||null==(e=L.spriteTexture)?void 0:e.clone(),L.spriteData):d&&s&&ue(d,s)}),[ue,L,s,d,ce]),i.useEffect((()=>{var e;ne&&ce(null==ne||null==(e=ne.spriteTexture)?void 0:e.clone(),null==ne?void 0:ne.spriteData)}),[ne,ce]),i.useEffect((()=>{var e;(se.hasEnded=!1,V.current&&!0===O)?H.current=(null!==(e=V.current.frames.length)&&void 0!==e?e:0)-1:H.current=0}),[O,se]),i.useLayoutEffect((()=>{le()}),[X,j,le]),i.useEffect((()=>{y&&(ee.current=!1)}),[y]),i.useLayoutEffect((()=>{if(J.current!==l&&l&&(H.current=0,J.current=l,se.hasEnded=!1,W<=0&&(H.current=r||e||0),V.current)){const{w:e,h:r}=c.getFirstFrame(V.current.frames,l).sourceSize,t=oe(e,r);Z(t)}}),[l,W,se,r,e]);const ie=(e,r,t,n)=>{var u=void 0===N?se.current:N;const a=H.current;let c=0,l=0;oe(e,r);const s=T?Math.round((t.w-1)/e):(t.w-1)/e,o=T?Math.round((t.h-1)/r):(t.h-1)/r;if(!n[a])return;const{frame:{x:i,y:m},sourceSize:{w:f,h:p}}=n[a],d=1/s,h=1/o;if(_.current&&_.current.map&&(c=$>0?d*(i/f):d*(i/f)-_.current.map.repeat.x,l=Math.abs(1-h)-h*(m/p),_.current.map.offset.x=c,_.current.map.offset.y=l),null!=u){let e=Math.floor(u*n.length);e=Math.max(0,Math.min(e,n.length-1)),isNaN(e)&&(e=0),H.current=e}else O?H.current-=1:H.current+=1};return t.useFrame(((t,n)=>{var u,a;null!=(u=V.current)&&u.frames&&null!=(a=_.current)&&a.map&&(ee.current||se.hasEnded||!y&&!x||((()=>{if(null===(t=V.current)||!("meta"in t)||!("frames"in t))return;var t;const{meta:{size:n},frames:u}=V.current,{w:a,h:s}=c.getFirstFrame(u,l).sourceSize,o=Array.isArray(u)?u:l?u[l]:[],i=r||o.length-1;var m=void 0===N?se.current:N;if(W<=0)return H.current=r||e||0,void ie(a,s,n,o);const f=window.performance.now(),p=f-G.current;if(!(p<=W)){var d=O?H.current<0:H.current>i,v=O?H.current===i:0===H.current,y=O?H.current<0:H.current>=i;if(d){if(H.current=h&&null!=e?e:0,O&&(H.current=i),h?null==b||b({currentFrameName:null!=l?l:"",currentFrame:H.current}):(null==F||F({currentFrameName:null!=l?l:"",currentFrame:H.current}),se.hasEnded=!q,q&&(ee.current=!0)),!h)return}else v&&(null==E||E({currentFrameName:null!=l?l:"",currentFrame:H.current}));void 0!==m&&y?!1===te.current&&(null==F||F({currentFrameName:null!=l?l:"",currentFrame:H.current}),te.current=!0):te.current=!1,p<=W||(G.current=f-p%W,ie(a,s,n,o))}})(),null==g||g({currentFrameName:J.current,currentFrame:H.current})))})),i.createElement("group",o.default({},k,{ref:C,scale:function(e=new m.Vector3(1,1,1),r=1){return"number"==typeof r?e.multiplyScalar(r):Array.isArray(r)?e.multiply(new m.Vector3(...r)):r instanceof m.Vector3?e.multiply(r):void 0}(Y,k.scale)}),i.createElement(f.Provider,{value:se},M&&i.createElement(a.Billboard,null,i.createElement("mesh",o.default({ref:U,scale:1,geometry:p},I),i.createElement("meshBasicMaterial",{premultipliedAlpha:!1,toneMapped:!1,side:m.DoubleSide,ref:_,map:X,transparent:!0,alphaTest:null!=R?R:0}))),!M&&i.createElement(u.Instances,o.default({geometry:p,limit:null!=z?z:1},I),i.createElement("meshBasicMaterial",{premultipliedAlpha:!1,toneMapped:!1,side:m.DoubleSide,ref:_,map:X,transparent:!0,alphaTest:null!=R?R:0}),(null!=D?D:[0]).map(((e,r)=>i.createElement(u.Instance,o.default({key:r,ref:1===(null==D?void 0:D.length)?U:null,position:e,scale:1},I))))),A))}));exports.SpriteAnimator=d,exports.useSpriteAnimator=function(){return i.useContext(f)};

package/core/SpriteAnimator.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { ThreeElements, Vector3 } from '@react-three/fiber';
+import { Vector3 } from '@react-three/fiber';
 import * as THREE from 'three';
 import { Instances, Instance } from './Instances';
 import { SpriteData } from './useSpriteLoader';
@@ -42,7 +42,7 @@ export type SpriteAnimatorProps = {
     canvasRenderingContext2DSettings?: CanvasRenderingContext2DSettings;
     roundFramePosition?: boolean;
     meshProps?: CommonMeshProps;
-} & Omit<ThreeElements['group'], 'ref'>;
+} & JSX.IntrinsicElements['group'];
 type SpriteAnimatorState = {
     current?: number;
     offset?: number;
@@ -51,38 +51,5 @@ type SpriteAnimatorState = {
     ref: React.Ref<THREE.Group>;
 };
 export declare function useSpriteAnimator(): SpriteAnimatorState | null;
-export declare const SpriteAnimator: React.ForwardRefExoticComponent<{
-    startFrame?: number;
-    endFrame?: number;
-    fps?: number;
-    frameName?: string;
-    textureDataURL?: string;
-    textureImageURL?: string;
-    loop?: boolean;
-    numberOfFrames?: number;
-    autoPlay?: boolean;
-    animationNames?: Array<string>;
-    onStart?: (data: AnimationEventData) => void;
-    onEnd?: (data: AnimationEventData) => void;
-    onLoopEnd?: (data: AnimationEventData) => void;
-    onFrame?: (data: AnimationEventData) => void;
-    play?: boolean;
-    pause?: boolean;
-    flipX?: boolean;
-    alphaTest?: number;
-    asSprite?: boolean;
-    offset?: number;
-    playBackwards?: boolean;
-    resetOnEnd?: boolean;
-    instanceItems?: Vector3[];
-    maxItems?: number;
-    spriteDataset?: {
-        spriteTexture: THREE.Texture;
-        spriteData: SpriteData | null;
-        aspect: Vector3;
-    } | null;
-    canvasRenderingContext2DSettings?: CanvasRenderingContext2DSettings;
-    roundFramePosition?: boolean;
-    meshProps?: CommonMeshProps;
-} & Omit<import("@react-three/fiber/dist/declarations/src/core/utils").Mutable<import("@react-three/fiber/dist/declarations/src/core/utils").Overwrite<Partial<import("@react-three/fiber/dist/declarations/src/core/utils").Overwrite<THREE.Group<THREE.Object3DEventMap>, import("@react-three/fiber").MathProps<THREE.Group<THREE.Object3DEventMap>> & import("@react-three/fiber").ReactProps<THREE.Group<THREE.Object3DEventMap>> & Partial<import("@react-three/fiber").EventHandlers>>>, Omit<import("@react-three/fiber").InstanceProps<THREE.Group<THREE.Object3DEventMap>, typeof THREE.Group>, "object">>>, "ref"> & React.RefAttributes<THREE.Group<THREE.Object3DEventMap>>>;
+export declare const SpriteAnimator: React.ForwardRefExoticComponent<Omit<SpriteAnimatorProps, "ref"> & React.RefAttributes<THREE.Group>>;
 export {};

package/core/Stage.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@babel/runtime/helpers/extends"),t=require("react"),i=require("./Environment.cjs.js"),n=require("./ContactShadows.cjs.js"),r=require("./Center.cjs.js"),a=require("./AccumulativeShadows.cjs.js"),s=require("./Bounds.cjs.js");function l(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(i){if("default"!==i){var n=Object.getOwnPropertyDescriptor(e,i);Object.defineProperty(t,i,n.get?n:{enumerable:!0,get:function(){return e[i]}})}})),t.default=e,Object.freeze(t)}require("@react-three/fiber"),require("three"),require("three-stdlib"),require("./useEnvironment.cjs.js"),require("@monogrid/gainmap-js"),require("../helpers/environment-assets.cjs.js"),require("./shaderMaterial.cjs.js"),require("../materials/DiscardMaterial.cjs.js"),require("../helpers/constants.cjs.js");var o=l(e),c=u(t);const d={rembrandt:{main:[1,2,1],fill:[-2,-.5,-2]},portrait:{main:[-1,2,.5],fill:[-1,.5,-1.5]},upfront:{main:[0,2,1],fill:[-1,.5,-1.5]},soft:{main:[-2,4,4],fill:[-1,.5,-1.5]}};function m({radius:e,adjustCamera:t}){const i=s.useBounds();return c.useEffect((()=>{t&&i.refresh().clip().fit()}),[e,t]),null}exports.Stage=function({children:e,center:t,adjustCamera:l=!0,intensity:u=.5,shadows:f="contact",environment:p="city",preset:h="rembrandt",...j}){var v,b,g,y,E,q,w,C;const S="string"==typeof h?d[h]:h,[{radius:O,height:z},B]=c.useState({radius:0,width:0,height:0,depth:0}),M=null!==(v=null==f?void 0:f.bias)&&void 0!==v?v:-1e-4,L=null!==(b=null==f?void 0:f.normalBias)&&void 0!==b?b:0,_=null!==(g=null==f?void 0:f.size)&&void 0!==g?g:1024,x=null!==(y=null==f?void 0:f.offset)&&void 0!==y?y:0,P="contact"===f||"contact"===(null==f?void 0:f.type),k="accumulative"===f||"accumulative"===(null==f?void 0:f.type),A={..."object"==typeof f?f:{}},D=p?"string"==typeof p?{preset:p}:p:null,F=c.useCallback((e=>{const{width:i,height:n,depth:r,boundingSphere:a}=e;B({radius:a.radius,width:i,height:n,depth:r}),null!=t&&t.onCentered&&t.onCentered(e)}),[]);return c.createElement(c.Fragment,null,c.createElement("ambientLight",{intensity:u/3}),c.createElement("spotLight",{penumbra:1,position:[S.main[0]*O,S.main[1]*O,S.main[2]*O],intensity:2*u,castShadow:!!f,"shadow-bias":M,"shadow-normalBias":L,"shadow-mapSize":_}),c.createElement("pointLight",{position:[S.fill[0]*O,S.fill[1]*O,S.fill[2]*O],intensity:u}),c.createElement(s.Bounds,o.default({fit:!!l,clip:!!l,margin:Number(l),observe:!0},j),c.createElement(m,{radius:O,adjustCamera:l}),c.createElement(r.Center,o.default({},t,{position:[0,x/2,0],onCentered:F}),e)),c.createElement("group",{position:[0,-z/2-x/2,0]},P&&c.createElement(n.ContactShadows,o.default({scale:4*O,far:O,blur:2},A)),k&&c.createElement(a.AccumulativeShadows,o.default({temporal:!0,frames:100,alphaTest:.9,toneMapped:!0,scale:4*O},A),c.createElement(a.RandomizedLight,{amount:null!==(E=A.amount)&&void 0!==E?E:8,radius:null!==(q=A.radius)&&void 0!==q?q:O,ambient:null!==(w=A.ambient)&&void 0!==w?w:.5,intensity:null!==(C=A.intensity)&&void 0!==C?C:1,position:[S.main[0]*O,S.main[1]*O,S.main[2]*O],size:4*O,bias:-M,mapSize:_}))),p&&c.createElement(i.Environment,D))};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@babel/runtime/helpers/extends"),t=require("react"),i=require("./Environment.cjs.js"),r=require("./ContactShadows.cjs.js"),n=require("./Center.cjs.js"),a=require("./AccumulativeShadows.cjs.js"),s=require("./Bounds.cjs.js");function l(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(i){if("default"!==i){var r=Object.getOwnPropertyDescriptor(e,i);Object.defineProperty(t,i,r.get?r:{enumerable:!0,get:function(){return e[i]}})}})),t.default=e,Object.freeze(t)}require("@react-three/fiber"),require("three"),require("three-stdlib"),require("./useEnvironment.cjs.js"),require("@monogrid/gainmap-js"),require("../helpers/environment-assets.cjs.js"),require("../helpers/deprecated.cjs.js"),require("./shaderMaterial.cjs.js"),require("../materials/DiscardMaterial.cjs.js"),require("../helpers/constants.cjs.js");var o=l(e),c=u(t);const d={rembrandt:{main:[1,2,1],fill:[-2,-.5,-2]},portrait:{main:[-1,2,.5],fill:[-1,.5,-1.5]},upfront:{main:[0,2,1],fill:[-1,.5,-1.5]},soft:{main:[-2,4,4],fill:[-1,.5,-1.5]}};function m({radius:e,adjustCamera:t}){const i=s.useBounds();return c.useEffect((()=>{t&&i.refresh().clip().fit()}),[e,t]),null}exports.Stage=function({children:e,center:t,adjustCamera:l=!0,intensity:u=.5,shadows:f="contact",environment:p="city",preset:h="rembrandt",...j}){var v,b,g,q,y,E,w,C;const S="string"==typeof h?d[h]:h,[{radius:O,height:z},B]=c.useState({radius:0,width:0,height:0,depth:0}),M=null!==(v=null==f?void 0:f.bias)&&void 0!==v?v:-1e-4,L=null!==(b=null==f?void 0:f.normalBias)&&void 0!==b?b:0,_=null!==(g=null==f?void 0:f.size)&&void 0!==g?g:1024,x=null!==(q=null==f?void 0:f.offset)&&void 0!==q?q:0,P="contact"===f||"contact"===(null==f?void 0:f.type),k="accumulative"===f||"accumulative"===(null==f?void 0:f.type),A={..."object"==typeof f?f:{}},D=p?"string"==typeof p?{preset:p}:p:null,F=c.useCallback((e=>{const{width:i,height:r,depth:n,boundingSphere:a}=e;B({radius:a.radius,width:i,height:r,depth:n}),null!=t&&t.onCentered&&t.onCentered(e)}),[]);return c.createElement(c.Fragment,null,c.createElement("ambientLight",{intensity:u/3}),c.createElement("spotLight",{penumbra:1,position:[S.main[0]*O,S.main[1]*O,S.main[2]*O],intensity:2*u,castShadow:!!f,"shadow-bias":M,"shadow-normalBias":L,"shadow-mapSize":_}),c.createElement("pointLight",{position:[S.fill[0]*O,S.fill[1]*O,S.fill[2]*O],intensity:u}),c.createElement(s.Bounds,o.default({fit:!!l,clip:!!l,margin:Number(l),observe:!0},j),c.createElement(m,{radius:O,adjustCamera:l}),c.createElement(n.Center,o.default({},t,{position:[0,x/2,0],onCentered:F}),e)),c.createElement("group",{position:[0,-z/2-x/2,0]},P&&c.createElement(r.ContactShadows,o.default({scale:4*O,far:O,blur:2},A)),k&&c.createElement(a.AccumulativeShadows,o.default({temporal:!0,frames:100,alphaTest:.9,toneMapped:!0,scale:4*O},A),c.createElement(a.RandomizedLight,{amount:null!==(y=A.amount)&&void 0!==y?y:8,radius:null!==(E=A.radius)&&void 0!==E?E:O,ambient:null!==(w=A.ambient)&&void 0!==w?w:.5,intensity:null!==(C=A.intensity)&&void 0!==C?C:1,position:[S.main[0]*O,S.main[1]*O,S.main[2]*O],size:4*O,bias:-M,mapSize:_}))),p&&c.createElement(i.Environment,D))};

package/core/Stage.d.ts

@@ -4,7 +4,6 @@ import { ContactShadowsProps } from './ContactShadows';
 import { CenterProps } from './Center';
 import { AccumulativeShadowsProps, RandomizedLightProps } from './AccumulativeShadows';
 import { PresetsType } from '../helpers/environment-assets';
-import { ThreeElements } from '@react-three/fiber';
 type StageShadows = Partial<AccumulativeShadowsProps> & Partial<RandomizedLightProps> & Partial<ContactShadowsProps> & {
     type: 'contact' | 'accumulative';
     offset?: number;
@@ -12,7 +11,7 @@ type StageShadows = Partial<AccumulativeShadowsProps> & Partial<RandomizedLightP
     normalBias?: number;
     size?: number;
 };
-export type StageProps = Omit<ThreeElements['group'], 'ref'> & {
+type StageProps = {
     preset?: 'rembrandt' | 'portrait' | 'upfront' | 'soft' | {
         main: [x: number, y: number, z: number];
         fill: [x: number, y: number, z: number];
@@ -23,5 +22,5 @@ export type StageProps = Omit<ThreeElements['group'], 'ref'> & {
     intensity?: number;
     center?: Partial<CenterProps>;
 };
-export declare function Stage({ children, center, adjustCamera, intensity, shadows, environment, preset, ...props }: StageProps): React.JSX.Element;
+export declare function Stage({ children, center, adjustCamera, intensity, shadows, environment, preset, ...props }: JSX.IntrinsicElements['group'] & StageProps): React.JSX.Element;
 export {};

package/core/Stars.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),t=require("@react-three/fiber"),r=require("three"),n=require("../helpers/constants.cjs.js");function a(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 o=a(e);class i extends r.ShaderMaterial{constructor(){super({uniforms:{time:{value:0},fade:{value:1}},vertexShader:"\n      uniform float time;\n      attribute float size;\n      varying vec3 vColor;\n      void main() {\n        vColor = color;\n        vec4 mvPosition = modelViewMatrix * vec4(position, 0.5);\n        gl_PointSize = size * (30.0 / -mvPosition.z) * (3.0 + sin(time + 100.0));\n        gl_Position = projectionMatrix * mvPosition;\n      }",fragmentShader:`\n      uniform sampler2D pointTexture;\n      uniform float fade;\n      varying vec3 vColor;\n      void main() {\n        float opacity = 1.0;\n        if (fade == 1.0) {\n          float d = distance(gl_PointCoord, vec2(0.5, 0.5));\n          opacity = 1.0 / (1.0 + exp(16.0 * (d - 0.25)));\n        }\n        gl_FragColor = vec4(vColor, opacity);\n\n        #include <tonemapping_fragment>\n\t      #include <${n.version>=154?"colorspace_fragment":"encodings_fragment"}>\n      }`})}}const c=e=>(new r.Vector3).setFromSpherical(new r.Spherical(e,Math.acos(1-2*Math.random()),2*Math.random()*Math.PI)),s=o.forwardRef((({radius:e=100,depth:n=50,count:a=5e3,saturation:s=0,factor:l=4,fade:u=!1,speed:f=1},m)=>{const d=o.useRef(null),[p,v,h]=o.useMemo((()=>{const t=[],o=[],i=Array.from({length:a},(()=>(.5+.5*Math.random())*l)),u=new r.Color;let f=e+n;const m=n/a;for(let e=0;e<a;e++)f-=m*Math.random(),t.push(...c(f).toArray()),u.setHSL(e/a,s,.9),o.push(u.r,u.g,u.b);return[new Float32Array(t),new Float32Array(o),new Float32Array(i)]}),[a,n,l,e,s]);t.useFrame((e=>d.current&&(d.current.uniforms.time.value=e.clock.elapsedTime*f)));const[g]=o.useState((()=>new i));return o.createElement("points",{ref:m},o.createElement("bufferGeometry",null,o.createElement("bufferAttribute",{attach:"attributes-position",args:[p,3]}),o.createElement("bufferAttribute",{attach:"attributes-color",args:[v,3]}),o.createElement("bufferAttribute",{attach:"attributes-size",args:[h,1]})),o.createElement("primitive",{ref:d,object:g,attach:"material",blending:r.AdditiveBlending,"uniforms-fade-value":u,depthWrite:!1,transparent:!0,vertexColors:!0}))}));exports.Stars=s;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),t=require("@react-three/fiber"),r=require("three"),n=require("../helpers/constants.cjs.js");function a(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 o=a(e);class i extends r.ShaderMaterial{constructor(){super({uniforms:{time:{value:0},fade:{value:1}},vertexShader:"\n      uniform float time;\n      attribute float size;\n      varying vec3 vColor;\n      void main() {\n        vColor = color;\n        vec4 mvPosition = modelViewMatrix * vec4(position, 0.5);\n        gl_PointSize = size * (30.0 / -mvPosition.z) * (3.0 + sin(time + 100.0));\n        gl_Position = projectionMatrix * mvPosition;\n      }",fragmentShader:`\n      uniform sampler2D pointTexture;\n      uniform float fade;\n      varying vec3 vColor;\n      void main() {\n        float opacity = 1.0;\n        if (fade == 1.0) {\n          float d = distance(gl_PointCoord, vec2(0.5, 0.5));\n          opacity = 1.0 / (1.0 + exp(16.0 * (d - 0.25)));\n        }\n        gl_FragColor = vec4(vColor, opacity);\n\n        #include <tonemapping_fragment>\n\t      #include <${n.version>=154?"colorspace_fragment":"encodings_fragment"}>\n      }`})}}const c=e=>(new r.Vector3).setFromSpherical(new r.Spherical(e,Math.acos(1-2*Math.random()),2*Math.random()*Math.PI)),s=o.forwardRef((({radius:e=100,depth:n=50,count:a=5e3,saturation:s=0,factor:l=4,fade:u=!1,speed:f=1},m)=>{const d=o.useRef(),[p,v,h]=o.useMemo((()=>{const t=[],o=[],i=Array.from({length:a},(()=>(.5+.5*Math.random())*l)),u=new r.Color;let f=e+n;const m=n/a;for(let e=0;e<a;e++)f-=m*Math.random(),t.push(...c(f).toArray()),u.setHSL(e/a,s,.9),o.push(u.r,u.g,u.b);return[new Float32Array(t),new Float32Array(o),new Float32Array(i)]}),[a,n,l,e,s]);t.useFrame((e=>d.current&&(d.current.uniforms.time.value=e.clock.elapsedTime*f)));const[g]=o.useState((()=>new i));return o.createElement("points",{ref:m},o.createElement("bufferGeometry",null,o.createElement("bufferAttribute",{attach:"attributes-position",args:[p,3]}),o.createElement("bufferAttribute",{attach:"attributes-color",args:[v,3]}),o.createElement("bufferAttribute",{attach:"attributes-size",args:[h,1]})),o.createElement("primitive",{ref:d,object:g,attach:"material",blending:r.AdditiveBlending,"uniforms-fade-value":u,depthWrite:!1,transparent:!0,vertexColors:!0}))}));exports.Stars=s;

package/core/Stars.d.ts

@@ -1,7 +1,7 @@
-import { ThreeElement } from '@react-three/fiber';
+import { ReactThreeFiber } from '@react-three/fiber';
 import { Points, ShaderMaterial } from 'three';
 import { ForwardRefComponent } from '../helpers/ts-utils';
-export type StarsProps = {
+type Props = {
     radius?: number;
     depth?: number;
     count?: number;
@@ -13,10 +13,12 @@ export type StarsProps = {
 declare class StarfieldMaterial extends ShaderMaterial {
     constructor();
 }
-declare module '@react-three/fiber' {
-    interface ThreeElements {
-        starfieldMaterial: ThreeElement<typeof StarfieldMaterial>;
+declare global {
+    namespace JSX {
+        interface IntrinsicElements {
+            starfieldMaterial: ReactThreeFiber.MaterialNode<StarfieldMaterial, []>;
+        }
     }
 }
-export declare const Stars: ForwardRefComponent<StarsProps, Points>;
+export declare const Stars: ForwardRefComponent<Props, Points>;
 export {};

package/core/Stars.js

@@ -54,7 +54,7 @@ const Stars = /* @__PURE__ */React.forwardRef(({
   fade = false,
   speed = 1
 }, ref) => {
-  const material = React.useRef(null);
+  const material = React.useRef();
   const [position, color, size] = React.useMemo(() => {
     const positions = [];
     const colors = [];

package/core/Stats.d.ts

@@ -1,7 +1,8 @@
 import * as React from 'react';
-export type StatsProps = {
+type Props = {
     showPanel?: number;
     className?: string;
     parent?: React.RefObject<HTMLElement>;
 };
-export declare function Stats({ showPanel, className, parent }: StatsProps): null;
+export declare function Stats({ showPanel, className, parent }: Props): null;
+export {};

package/core/StatsGl.d.ts

@@ -2,7 +2,7 @@ import { ForwardRefComponent } from '../helpers/ts-utils';
 import * as React from 'react';
 import Stats from 'stats-gl';
 type StatsOptions = ConstructorParameters<typeof Stats>[0];
-export type StatsGlProps = Partial<StatsOptions> & {
+type Props = Partial<StatsOptions> & {
     id?: string;
     clearStatsGlStyle?: boolean;
     showPanel?: number;
@@ -10,5 +10,5 @@ export type StatsGlProps = Partial<StatsOptions> & {
     parent?: React.RefObject<HTMLElement>;
     ref?: React.RefObject<HTMLElement>;
 };
-export declare const StatsGl: ForwardRefComponent<StatsGlProps, HTMLDivElement>;
+export declare const StatsGl: ForwardRefComponent<Props, HTMLDivElement>;
 export {};

package/core/Svg.d.ts

@@ -1,13 +1,13 @@
-import { ThreeElements } from '@react-three/fiber';
+import { MeshBasicMaterialProps, MeshProps, Object3DProps } from '@react-three/fiber';
 import { Object3D } from 'three';
 import { ForwardRefComponent } from '../helpers/ts-utils';
-export interface SvgProps extends Omit<ThreeElements['object3D'], 'ref'> {
+export interface SvgProps extends Omit<Object3DProps, 'ref'> {
     src: string;
     skipFill?: boolean;
     skipStrokes?: boolean;
-    fillMaterial?: ThreeElements['meshBasicMaterial'];
-    strokeMaterial?: ThreeElements['meshBasicMaterial'];
-    fillMeshProps?: ThreeElements['mesh'];
-    strokeMeshProps?: ThreeElements['mesh'];
+    fillMaterial?: MeshBasicMaterialProps;
+    strokeMaterial?: MeshBasicMaterialProps;
+    fillMeshProps?: MeshProps;
+    strokeMeshProps?: MeshProps;
 }
 export declare const Svg: ForwardRefComponent<SvgProps, Object3D>;

package/core/Text.d.ts

@@ -1,7 +1,7 @@
 import * as React from 'react';
-import { ReactThreeFiber, ThreeElements } from '@react-three/fiber';
+import { ReactThreeFiber } from '@react-three/fiber';
 import { ForwardRefComponent } from '../helpers/ts-utils';
-export type TextProps = Omit<ThreeElements['mesh'], 'ref'> & {
+type Props = JSX.IntrinsicElements['mesh'] & {
     children: React.ReactNode;
     characters?: string;
     color?: ReactThreeFiber.Color;
@@ -35,4 +35,5 @@ export type TextProps = Omit<ThreeElements['mesh'], 'ref'> & {
     glyphGeometryDetail?: number;
     onSync?: (troika: any) => void;
 };
-export declare const Text: ForwardRefComponent<TextProps, any>;
+export declare const Text: ForwardRefComponent<Props, any>;
+export {};

package/core/Text3D.d.ts

@@ -1,20 +1,23 @@
 import * as React from 'react';
 import * as THREE from 'three';
-import { ThreeElement, ThreeElements } from '@react-three/fiber';
-import { TextGeometry, TextGeometryParameters } from 'three-stdlib';
+import { MeshProps, Node } from '@react-three/fiber';
+import { TextGeometryParameters } from 'three-stdlib';
 import { FontData } from './useFont';
 import { ForwardRefComponent } from '../helpers/ts-utils';
-declare module '@react-three/fiber' {
-    interface ThreeElements {
-        renamedTextGeometry: ThreeElement<typeof TextGeometry>;
+declare global {
+    namespace JSX {
+        interface IntrinsicElements {
+            renamedTextGeometry: Node<any, any>;
+        }
     }
 }
-export type Text3DProps = Omit<ThreeElements['mesh'], 'ref'> & {
+type Text3DProps = {
     font: FontData | string;
     bevelSegments?: number;
     smooth?: number;
-} & Omit<TextGeometryParameters, 'font'>;
+} & Omit<TextGeometryParameters, 'font'> & MeshProps;
 export declare const Text3D: ForwardRefComponent<React.PropsWithChildren<Text3DProps & {
     letterSpacing?: number;
     lineHeight?: number;
 }>, THREE.Mesh>;
+export {};

package/core/Texture.d.ts

@@ -9,7 +9,7 @@ type SingleTexture<T> = T extends string ? _Texture : never;
 export type MappedTextureType<T extends string[] | string | Record<string, string>> = TextureArray<T> | TextureRecord<T> | SingleTexture<T>;
 export declare function useTexture<Url extends string[] | string | Record<string, string>>(input: Url, onLoad?: (texture: MappedTextureType<Url>) => void): MappedTextureType<Url>;
 export declare namespace useTexture {
-    var preload: (url: string | string[]) => void;
+    var preload: (url: string | string[]) => undefined;
     var clear: (input: string | string[]) => void;
 }
 export declare const Texture: ({ children, input, onLoad, }: {

package/core/TrackballControls.d.ts

@@ -1,8 +1,8 @@
-import { ReactThreeFiber, ThreeElement } from '@react-three/fiber';
+import { ReactThreeFiber } from '@react-three/fiber';
 import * as THREE from 'three';
 import { TrackballControls as TrackballControlsImpl } from 'three-stdlib';
-import { ForwardRefComponent, Overwrite } from '../helpers/ts-utils';
-export type TrackballControlsProps = Omit<Overwrite<ThreeElement<typeof TrackballControlsImpl>, {
+import { ForwardRefComponent } from '../helpers/ts-utils';
+export type TrackballControlsProps = ReactThreeFiber.Overwrite<ReactThreeFiber.Object3DNode<TrackballControlsImpl, typeof TrackballControlsImpl>, {
     target?: ReactThreeFiber.Vector3;
     camera?: THREE.Camera;
     domElement?: HTMLElement;
@@ -11,5 +11,5 @@ export type TrackballControlsProps = Omit<Overwrite<ThreeElement<typeof Trackbal
     onChange?: (e?: THREE.Event) => void;
     onStart?: (e?: THREE.Event) => void;
     onEnd?: (e?: THREE.Event) => void;
-}>, 'ref' | 'args'>;
+}>;
 export declare const TrackballControls: ForwardRefComponent<TrackballControlsProps, TrackballControlsImpl>;

package/core/Trail.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@react-three/fiber"),t=require("react"),r=require("three"),n=require("meshline");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 i=o(t);const u={width:.2,length:1,decay:1,local:!1,stride:0,interval:1},s=(e,t=1)=>(e.set(e.subarray(t)),e.fill(-1/0,-t),e);function c(t,n){const{length:o,local:c,decay:l,interval:a,stride:f}={...u,...n},d=i.useRef(null),[h]=i.useState((()=>new r.Vector3));i.useLayoutEffect((()=>{t&&(d.current=Float32Array.from({length:10*o*3},((e,r)=>t.position.getComponent(r%3))))}),[o,t]);const p=i.useRef(new r.Vector3),y=i.useRef(0);return e.useFrame((()=>{if(t&&d.current){if(0===y.current){let e;c?e=t.position:(t.getWorldPosition(h),e=h);const r=1*l;for(let t=0;t<r;t++)e.distanceTo(p.current)<f||(s(d.current,3),d.current.set(e.toArray(),d.current.length-3));p.current.copy(e)}y.current++,y.current=y.current%a}})),d}const l=i.forwardRef(((t,o)=>{const{children:s}=t,{width:l,length:a,decay:f,local:d,stride:h,interval:p}={...u,...t},{color:y="hotpink",attenuation:g,target:m}=t,v=e.useThree((e=>e.size)),b=e.useThree((e=>e.scene)),w=i.useRef(null),[M,j]=i.useState(null),O=c(M,{length:a,decay:f,local:d,stride:h,interval:p});i.useEffect((()=>{const e=(null==m?void 0:m.current)||w.current.children.find((e=>e instanceof r.Object3D));e&&j(e)}),[O,m]);const E=i.useMemo((()=>new n.MeshLineGeometry),[]),P=i.useMemo((()=>{var e,t;const o=new n.MeshLineMaterial({lineWidth:.1*l,color:y,sizeAttenuation:1,resolution:new r.Vector2(v.width,v.height)});let i;if(s)if(Array.isArray(s))i=s.find((e=>{const t=e;return"string"==typeof t.type&&"meshLineMaterial"===t.type}));else{const e=s;"string"==typeof e.type&&"meshLineMaterial"===e.type&&(i=e)}return"object"==typeof(null==(e=i)?void 0:e.props)&&null!==(null==(t=i)?void 0:t.props)&&o.setValues(i.props),o}),[l,y,v,s]);return i.useEffect((()=>{P.uniforms.resolution.value.set(v.width,v.height)}),[v]),e.useFrame((()=>{O.current&&E.setPoints(O.current,g)})),i.createElement("group",null,e.createPortal(i.createElement("mesh",{ref:o,geometry:E,material:P}),b),i.createElement("group",{ref:w},s))}));exports.Trail=l,exports.useTrail=c;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@react-three/fiber"),t=require("react"),r=require("three"),n=require("meshline");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 i=o(t);const s={width:.2,length:1,decay:1,local:!1,stride:0,interval:1},c=(e,t=1)=>(e.set(e.subarray(t)),e.fill(-1/0,-t),e);function u(t,n){const{length:o,local:u,decay:l,interval:a,stride:f}={...s,...n},h=i.useRef(),[d]=i.useState((()=>new r.Vector3));i.useLayoutEffect((()=>{t&&(h.current=Float32Array.from({length:10*o*3},((e,r)=>t.position.getComponent(r%3))))}),[o,t]);const p=i.useRef(new r.Vector3),y=i.useRef(0);return e.useFrame((()=>{if(t&&h.current){if(0===y.current){let e;u?e=t.position:(t.getWorldPosition(d),e=d);const r=1*l;for(let t=0;t<r;t++)e.distanceTo(p.current)<f||(c(h.current,3),h.current.set(e.toArray(),h.current.length-3));p.current.copy(e)}y.current++,y.current=y.current%a}})),h}const l=i.forwardRef(((t,o)=>{const{children:c}=t,{width:l,length:a,decay:f,local:h,stride:d,interval:p}={...s,...t},{color:y="hotpink",attenuation:g,target:m}=t,v=e.useThree((e=>e.size)),b=e.useThree((e=>e.scene)),w=i.useRef(null),[M,j]=i.useState(null),O=u(M,{length:a,decay:f,local:h,stride:d,interval:p});i.useEffect((()=>{const e=(null==m?void 0:m.current)||w.current.children.find((e=>e instanceof r.Object3D));e&&j(e)}),[O,m]);const E=i.useMemo((()=>new n.MeshLineGeometry),[]),P=i.useMemo((()=>{var e;const t=new n.MeshLineMaterial({lineWidth:.1*l,color:y,sizeAttenuation:1,resolution:new r.Vector2(v.width,v.height)});let o;if(c)if(Array.isArray(c))o=c.find((e=>{const t=e;return"string"==typeof t.type&&"meshLineMaterial"===t.type}));else{const e=c;"string"==typeof e.type&&"meshLineMaterial"===e.type&&(o=e)}return"object"==typeof(null==(e=o)?void 0:e.props)&&t.setValues(o.props),t}),[l,y,v,c]);return i.useEffect((()=>{P.uniforms.resolution.value.set(v.width,v.height)}),[v]),e.useFrame((()=>{O.current&&E.setPoints(O.current,g)})),i.createElement("group",null,e.createPortal(i.createElement("mesh",{ref:o,geometry:E,material:P}),b),i.createElement("group",{ref:w},c))}));exports.Trail=l,exports.useTrail=u;

package/core/Trail.d.ts

@@ -10,12 +10,12 @@ type Settings = {
     stride: number;
     interval: number;
 };
-export type TrailProps = {
+type TrailProps = {
     color?: ColorRepresentation;
     attenuation?: (width: number) => number;
-    target?: React.RefObject<Object3D>;
+    target?: React.MutableRefObject<Object3D>;
 } & Partial<Settings>;
-export declare function useTrail(target: Object3D, settings: Partial<Settings>): React.RefObject<Float32Array | null>;
+export declare function useTrail(target: Object3D, settings: Partial<Settings>): React.MutableRefObject<Float32Array | undefined>;
 export type MeshLineGeometry = Mesh & MeshLineGeometryImpl;
 export declare const Trail: ForwardRefComponent<React.PropsWithChildren<TrailProps>, MeshLineGeometry>;
 export {};

package/core/Trail.js

@@ -27,7 +27,7 @@ function useTrail(target, settings) {
     ...defaults,
     ...settings
   };
-  const points = React.useRef(null);
+  const points = React.useRef();
   const [worldPosition] = React.useState(() => new Vector3());
   React.useLayoutEffect(() => {
     if (target) {
@@ -103,7 +103,7 @@ const Trail = /* @__PURE__ */React.forwardRef((props, forwardRef) => {
   }, [points, target]);
   const geo = React.useMemo(() => new MeshLineGeometry(), []);
   const mat = React.useMemo(() => {
-    var _matOverride, _matOverride2;
+    var _matOverride;
     const m = new MeshLineMaterial({
       lineWidth: 0.1 * width,
       color: color,
@@ -126,7 +126,7 @@ const Trail = /* @__PURE__ */React.forwardRef((props, forwardRef) => {
         }
       }
     }
-    if (typeof ((_matOverride = matOverride) == null ? void 0 : _matOverride.props) === 'object' && ((_matOverride2 = matOverride) == null ? void 0 : _matOverride2.props) !== null) {
+    if (typeof ((_matOverride = matOverride) == null ? void 0 : _matOverride.props) === 'object') {
       m.setValues(matOverride.props);
     }
     return m;

package/core/TrailTexture.d.ts

@@ -12,8 +12,7 @@ type TrailConfig = {
     ease?: (t: number) => number;
 };
 export declare function useTrailTexture(config?: Partial<TrailConfig>): [Texture, (ThreeEvent: any) => void];
-export type TrailTextureProps = {
+export declare const TrailTexture: ({ children, ...config }: {
     children?: (texture: ReturnType<typeof useTrailTexture>) => React.ReactNode;
-} & TrailConfig;
-export declare const TrailTexture: ({ children, ...config }: TrailTextureProps) => React.JSX.Element;
+} & TrailConfig) => React.JSX.Element;
 export {};

package/core/TransformControls.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"),o=require("three-stdlib");function u(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=u(e),c=s(r),i=s(n);const f=c.forwardRef((({children:e,domElement:r,onChange:n,onMouseDown:u,onMouseUp:s,onObjectChange:f,object:l,makeDefault:d,camera:v,enabled:h,axis:m,mode:E,translationSnap:b,rotationSnap:g,scaleSnap:p,space:L,size:j,showX:w,showY:y,showZ:O,...T},D)=>{const C=t.useThree((e=>e.controls)),R=t.useThree((e=>e.gl)),S=t.useThree((e=>e.events)),q=t.useThree((e=>e.camera)),x=t.useThree((e=>e.invalidate)),M=t.useThree((e=>e.get)),_=t.useThree((e=>e.set)),z=v||q,P=r||S.connected||R.domElement,U=c.useMemo((()=>new o.TransformControls(z,P)),[z,P]),k=c.useRef(null);c.useLayoutEffect((()=>(l?U.attach(l instanceof i.Object3D?l:l.current):k.current instanceof i.Object3D&&U.attach(k.current),()=>{U.detach()})),[l,e,U]),c.useEffect((()=>{if(C){const e=e=>C.enabled=!e.value;return U.addEventListener("dragging-changed",e),()=>U.removeEventListener("dragging-changed",e)}}),[U,C]);const X=c.useRef(void 0),Y=c.useRef(void 0),Z=c.useRef(void 0),F=c.useRef(void 0);return c.useLayoutEffect((()=>{X.current=n}),[n]),c.useLayoutEffect((()=>{Y.current=u}),[u]),c.useLayoutEffect((()=>{Z.current=s}),[s]),c.useLayoutEffect((()=>{F.current=f}),[f]),c.useEffect((()=>{const e=e=>{x(),null==X.current||X.current(e)},t=e=>null==Y.current?void 0:Y.current(e),r=e=>null==Z.current?void 0:Z.current(e),n=e=>null==F.current?void 0:F.current(e);return U.addEventListener("change",e),U.addEventListener("mouseDown",t),U.addEventListener("mouseUp",r),U.addEventListener("objectChange",n),()=>{U.removeEventListener("change",e),U.removeEventListener("mouseDown",t),U.removeEventListener("mouseUp",r),U.removeEventListener("objectChange",n)}}),[x,U]),c.useEffect((()=>{if(d){const e=M().controls;return _({controls:U}),()=>_({controls:e})}}),[d,U]),c.createElement(c.Fragment,null,c.createElement("primitive",{ref:D,object:U,enabled:h,axis:m,mode:E,translationSnap:b,rotationSnap:g,scaleSnap:p,space:L,size:j,showX:w,showY:y,showZ:O}),c.createElement("group",a.default({ref:k},T),e))}));exports.TransformControls=f;
+"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"),o=require("three-stdlib");function u(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=u(e),c=s(r),i=s(n);const f=c.forwardRef((({children:e,domElement:r,onChange:n,onMouseDown:u,onMouseUp:s,onObjectChange:f,object:l,makeDefault:d,camera:h,enabled:m,axis:v,mode:E,translationSnap:b,rotationSnap:g,scaleSnap:p,space:L,size:j,showX:w,showY:y,showZ:O,...T},D)=>{const C=t.useThree((e=>e.controls)),R=t.useThree((e=>e.gl)),S=t.useThree((e=>e.events)),q=t.useThree((e=>e.camera)),x=t.useThree((e=>e.invalidate)),M=t.useThree((e=>e.get)),_=t.useThree((e=>e.set)),z=h||q,P=r||S.connected||R.domElement,U=c.useMemo((()=>new o.TransformControls(z,P)),[z,P]),k=c.useRef(null);c.useLayoutEffect((()=>(l?U.attach(l instanceof i.Object3D?l:l.current):k.current instanceof i.Object3D&&U.attach(k.current),()=>{U.detach()})),[l,e,U]),c.useEffect((()=>{if(C){const e=e=>C.enabled=!e.value;return U.addEventListener("dragging-changed",e),()=>U.removeEventListener("dragging-changed",e)}}),[U,C]);const X=c.useRef(),Y=c.useRef(),Z=c.useRef(),F=c.useRef();return c.useLayoutEffect((()=>{X.current=n}),[n]),c.useLayoutEffect((()=>{Y.current=u}),[u]),c.useLayoutEffect((()=>{Z.current=s}),[s]),c.useLayoutEffect((()=>{F.current=f}),[f]),c.useEffect((()=>{const e=e=>{x(),null==X.current||X.current(e)},t=e=>null==Y.current?void 0:Y.current(e),r=e=>null==Z.current?void 0:Z.current(e),n=e=>null==F.current?void 0:F.current(e);return U.addEventListener("change",e),U.addEventListener("mouseDown",t),U.addEventListener("mouseUp",r),U.addEventListener("objectChange",n),()=>{U.removeEventListener("change",e),U.removeEventListener("mouseDown",t),U.removeEventListener("mouseUp",r),U.removeEventListener("objectChange",n)}}),[x,U]),c.useEffect((()=>{if(d){const e=M().controls;return _({controls:U}),()=>_({controls:e})}}),[d,U]),c.createElement(c.Fragment,null,c.createElement("primitive",{ref:D,object:U,enabled:m,axis:v,mode:E,translationSnap:b,rotationSnap:g,scaleSnap:p,space:L,size:j,showX:w,showY:y,showZ:O}),c.createElement("group",a.default({ref:k},T),e))}));exports.TransformControls=f;

package/core/TransformControls.d.ts

@@ -1,10 +1,10 @@
-import { ThreeElement, ThreeElements } from '@react-three/fiber';
+import { ReactThreeFiber } from '@react-three/fiber';
 import * as React from 'react';
 import * as THREE from 'three';
 import { TransformControls as TransformControlsImpl } from 'three-stdlib';
 import { ForwardRefComponent } from '../helpers/ts-utils';
-export type TransformControlsProps = Omit<ThreeElement<typeof TransformControlsImpl>, 'ref' | 'args'> & Omit<ThreeElements['group'], 'ref'> & {
-    object?: THREE.Object3D | React.RefObject<THREE.Object3D>;
+export type TransformControlsProps = ReactThreeFiber.Object3DNode<TransformControlsImpl, typeof TransformControlsImpl> & JSX.IntrinsicElements['group'] & {
+    object?: THREE.Object3D | React.MutableRefObject<THREE.Object3D>;
     enabled?: boolean;
     axis?: string | null;
     domElement?: HTMLElement;

package/core/TransformControls.js

@@ -28,6 +28,7 @@ const TransformControls = /* @__PURE__ */React.forwardRef(({
   showZ,
   ...props
 }, ref) => {
+  // @ts-expect-error new in @react-three/fiber@7.0.5
   const defaultControls = useThree(state => state.controls);
   const gl = useThree(state => state.gl);
   const events = useThree(state => state.events);
@@ -54,10 +55,10 @@ const TransformControls = /* @__PURE__ */React.forwardRef(({
       return () => controls.removeEventListener('dragging-changed', callback);
     }
   }, [controls, defaultControls]);
-  const onChangeRef = React.useRef(undefined);
-  const onMouseDownRef = React.useRef(undefined);
-  const onMouseUpRef = React.useRef(undefined);
-  const onObjectChangeRef = React.useRef(undefined);
+  const onChangeRef = React.useRef();
+  const onMouseDownRef = React.useRef();
+  const onMouseUpRef = React.useRef();
+  const onObjectChangeRef = React.useRef();
   React.useLayoutEffect(() => void (onChangeRef.current = onChange), [onChange]);
   React.useLayoutEffect(() => void (onMouseDownRef.current = onMouseDown), [onMouseDown]);
   React.useLayoutEffect(() => void (onMouseUpRef.current = onMouseUp), [onMouseUp]);

package/core/VideoTexture.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),r=require("three"),t=require("@react-three/fiber"),n=require("suspend-react"),o=require("hls.js");function u(e){if(e&&e.__esModule)return e;var r=Object.create(null);return e&&Object.keys(e).forEach((function(t){if("default"!==t){var n=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(r,t,n.get?n:{enumerable:!0,get:function(){return e[t]}})}})),r.default=e,Object.freeze(r)}var s=u(e),a=u(r);const c=((e,r)=>"undefined"!=typeof window&&"function"==typeof(null==(e=window.document)?void 0:e.createElement)&&"string"==typeof(null==(r=window.navigator)?void 0:r.userAgent))();let i=null;function l(r,{unsuspend:s="loadedmetadata",start:l=!0,hls:d={},crossOrigin:p="anonymous",muted:m=!0,loop:v=!0,playsInline:y=!0,onVideoFrame:b,...g}={}){const w=t.useThree((e=>e.gl)),h=e.useRef(null),E=n.suspend((()=>new Promise((async e=>{let t,n;"string"==typeof r?t=r:n=r;const l=Object.assign(document.createElement("video"),{src:t,srcObject:n,crossOrigin:p,loop:v,muted:m,playsInline:y,...g});if(t&&c&&t.endsWith(".m3u8")){const e=h.current=await async function(...e){var r;null!==(r=i)&&void 0!==r||(i=await Promise.resolve().then((function(){return u(require("hls.js"))})));const t=i.default;return t.isSupported()?new t(...e):null}(d);e&&(e.on(o.Events.MEDIA_ATTACHED,(()=>{e.loadSource(t)})),e.attachMedia(l))}const f=new a.VideoTexture(l);f.colorSpace=w.outputColorSpace,l.addEventListener(s,(()=>e(f)))}))),[r]),O=E.source.data;return f(O,b),e.useEffect((()=>(l&&E.image.play(),()=>{h.current&&(h.current.destroy(),h.current=null)})),[E,l]),E}const d=e.forwardRef((({children:r,src:t,...n},o)=>{const u=l(t,n);return e.useEffect((()=>()=>{u.dispose()}),[u]),e.useImperativeHandle(o,(()=>u),[u]),s.createElement(s.Fragment,null,null==r?void 0:r(u))})),f=(r,t)=>{e.useEffect((()=>{if(!t)return;if(!r.requestVideoFrameCallback)return;let e;const n=(...o)=>{t(...o),e=r.requestVideoFrameCallback(n)};return r.requestVideoFrameCallback(n),()=>r.cancelVideoFrameCallback(e)}),[r,t])};exports.VideoTexture=d,exports.useVideoTexture=l;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),t=require("three"),r=require("@react-three/fiber"),n=require("suspend-react"),o=require("hls.js");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 s=u(e),c=u(t);const a=((e,t)=>"undefined"!=typeof window&&"function"==typeof(null==(e=window.document)?void 0:e.createElement)&&"string"==typeof(null==(t=window.navigator)?void 0:t.userAgent))();let i=null;function l(t,{unsuspend:s="loadedmetadata",start:l=!0,hls:d={},crossOrigin:p="anonymous",muted:m=!0,loop:v=!0,playsInline:g=!0,onVideoFrame:y,...b}={}){const w=r.useThree((e=>e.gl)),E=e.useRef(null),h=n.suspend((()=>new Promise((async e=>{let r,n;"string"==typeof t?r=t:n=t;const l=Object.assign(document.createElement("video"),{src:r,srcObject:n,crossOrigin:p,loop:v,muted:m,playsInline:g,...b});if(r&&a&&r.endsWith(".m3u8")){const e=E.current=await async function(...e){var t;null!==(t=i)&&void 0!==t||(i=await Promise.resolve().then((function(){return u(require("hls.js"))})));const r=i.default;return r.isSupported()?new r(...e):null}(d);e&&(e.on(o.Events.MEDIA_ATTACHED,(()=>{e.loadSource(r)})),e.attachMedia(l))}const f=new c.VideoTexture(l);"colorSpace"in f?f.colorSpace=w.outputColorSpace:f.encoding=w.outputEncoding,l.addEventListener(s,(()=>e(f)))}))),[t]),O=h.source.data;return f(O,y),e.useEffect((()=>(l&&h.image.play(),()=>{E.current&&(E.current.destroy(),E.current=null)})),[h,l]),h}const d=e.forwardRef((({children:t,src:r,...n},o)=>{const u=l(r,n);return e.useEffect((()=>()=>{u.dispose()}),[u]),e.useImperativeHandle(o,(()=>u),[u]),s.createElement(s.Fragment,null,null==t?void 0:t(u))})),f=(t,r)=>{e.useEffect((()=>{if(!r)return;if(!t.requestVideoFrameCallback)return;let e;const n=(...o)=>{r(...o),e=t.requestVideoFrameCallback(n)};return t.requestVideoFrameCallback(n),()=>t.cancelVideoFrameCallback(e)}),[t,r])};exports.VideoTexture=d,exports.useVideoTexture=l;

package/core/VideoTexture.js

@@ -57,7 +57,7 @@ function useVideoTexture(srcOrSrcObject, {
       }
     }
     const texture = new THREE.VideoTexture(video);
-    texture.colorSpace = gl.outputColorSpace;
+    if ('colorSpace' in texture) texture.colorSpace = gl.outputColorSpace;else texture.encoding = gl.outputEncoding;
     video.addEventListener(unsuspend, () => res(texture));
   }), [srcOrSrcObject]);
   const video = texture.source.data;

package/core/Wireframe.d.ts

@@ -1,10 +1,12 @@
 import * as React from 'react';
 import * as THREE from 'three';
-import { ThreeElement } from '@react-three/fiber';
-import { WireframeMaterial, WireframeMaterialProps } from '../materials/WireframeMaterial';
-declare module '@react-three/fiber' {
-    interface ThreeElements {
-        meshWireframeMaterial: ThreeElement<typeof WireframeMaterial>;
+import { MaterialNode } from '@react-three/fiber';
+import { WireframeMaterialProps } from '../materials/WireframeMaterial';
+declare global {
+    namespace JSX {
+        interface IntrinsicElements {
+            meshWireframeMaterial: MaterialNode<THREE.ShaderMaterial, WireframeMaterialProps>;
+        }
     }
 }
 interface WireframeProps {