@react-three/drei 9.115.0 → 9.116.1

package/README.md

@@ -1,11 +1,11 @@
-[![logo](docs/logo.jpg)](https://codesandbox.io/s/bfplr)
-
 [![Storybook](https://img.shields.io/static/v1?message=Storybook&style=flat&colorA=000000&colorB=000000&label=&logo=storybook&logoColor=ffffff)](https://drei.pmnd.rs/)
 [![Version](https://img.shields.io/npm/v/@react-three/drei?style=flat&colorA=000000&colorB=000000)](https://www.npmjs.com/package/@react-three/drei)
 [![Downloads](https://img.shields.io/npm/dt/@react-three/drei.svg?style=flat&colorA=000000&colorB=000000)](https://www.npmjs.com/package/@react-three/drei)
 [![Discord Shield](https://img.shields.io/discord/740090768164651008?style=flat&colorA=000000&colorB=000000&label=discord&logo=discord&logoColor=ffffff)](https://discord.com/channels/740090768164651008/741751532592038022)
 [![Open in GitHub Codespaces](https://img.shields.io/static/v1?&message=Open%20in%20%20Codespaces&style=flat&colorA=000000&colorB=000000&label=GitHub&logo=github&logoColor=ffffff)](https://github.com/codespaces/new?template_repository=pmndrs%2Fdrei)
 
+[![logo](docs/logo.jpg)](https://codesandbox.io/s/bfplr)
+
 A growing collection of useful helpers and fully functional, ready-made abstractions for [@react-three/fiber](https://github.com/pmndrs/react-three-fiber).
 
 If you make a component that is generic enough to be useful to others, think about [CONTRIBUTING](CONTRIBUTING.md)!

package/core/Bounds.js

@@ -2,7 +2,6 @@ import * as React from 'react';
 import * as THREE from 'three';
 import { useThree, useFrame } from '@react-three/fiber';
 
-// eslint-disable-next-line no-shadow
 var AnimationState = /*#__PURE__*/function (AnimationState) {
   AnimationState[AnimationState["NONE"] = 0] = "NONE";
   AnimationState[AnimationState["START"] = 1] = "START";

package/core/Clone.js

@@ -22,7 +22,7 @@ function createSpread(child, {
     if (typeof inject === 'function') spread = {
       ...spread,
       children: inject(child)
-    };else if ( /*#__PURE__*/React.isValidElement(inject)) spread = {
+    };else if (/*#__PURE__*/React.isValidElement(inject)) spread = {
       ...spread,
       children: inject
     };else spread = {

package/core/Effects.js

@@ -66,18 +66,18 @@ const Effects = /* @__PURE__ */React.forwardRef(({
     if (!disableRender) (_composer$current3 = composer.current) == null || _composer$current3.render();
   }, renderIndex);
   const passes = [];
-  if (!disableRenderPass) passes.push( /*#__PURE__*/React.createElement("renderPass", {
+  if (!disableRenderPass) passes.push(/*#__PURE__*/React.createElement("renderPass", {
     key: "renderpass",
     attach: `passes-${passes.length}`,
     args: [scene, camera]
   }));
-  if (!disableGamma) passes.push( /*#__PURE__*/React.createElement("shaderPass", {
+  if (!disableGamma) passes.push(/*#__PURE__*/React.createElement("shaderPass", {
     attach: `passes-${passes.length}`,
     key: "gammapass",
     args: [GammaCorrectionShader]
   }));
   React.Children.forEach(children, el => {
-    el && passes.push( /*#__PURE__*/React.cloneElement(el, {
+    el && passes.push(/*#__PURE__*/React.cloneElement(el, {
       key: passes.length,
       attach: `passes-${passes.length}`
     }));

package/core/Environment.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@babel/runtime/helpers/extends"),n=require("react"),t=require("@react-three/fiber"),r=require("three"),o=require("three-stdlib"),u=require("./useEnvironment.cjs.js");function a(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function i(e){if(e&&e.__esModule)return e;var n=Object.create(null);return e&&Object.keys(e).forEach((function(t){if("default"!==t){var r=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(n,t,r.get?r:{enumerable:!0,get:function(){return e[t]}})}})),n.default=e,Object.freeze(n)}require("@monogrid/gainmap-js"),require("../helpers/environment-assets.cjs.js"),require("../helpers/deprecated.cjs.js");var c=a(e),s=i(n);const l=e=>{return(n=e).current&&n.current.isScene?e.current:e;var n};function d(e,n,r,o,u={}){var a,i,c,s,d;u={backgroundBlurriness:null!==(a=u.blur)&&void 0!==a?a:0,backgroundIntensity:1,backgroundRotation:[0,0,0],environmentIntensity:1,environmentRotation:[0,0,0],...u};const m=l(n||r),b=m.background,g=m.environment,v={backgroundBlurriness:m.backgroundBlurriness,backgroundIntensity:m.backgroundIntensity,backgroundRotation:null!==(i=null==(c=m.backgroundRotation)||null==c.clone?void 0:c.clone())&&void 0!==i?i:[0,0,0],environmentIntensity:m.environmentIntensity,environmentRotation:null!==(s=null==(d=m.environmentRotation)||null==d.clone?void 0:d.clone())&&void 0!==s?s:[0,0,0]};return"only"!==e&&(m.environment=o),e&&(m.background=o),t.applyProps(m,u),()=>{"only"!==e&&(m.environment=g),e&&(m.background=b),t.applyProps(m,v)}}function m({scene:e,background:n=!1,map:r,...o}){const u=t.useThree((e=>e.scene));return s.useLayoutEffect((()=>{if(r)return d(n,e,u,r,o)})),null}function b({background:e=!1,scene:n,blur:r,backgroundBlurriness:o,backgroundIntensity:a,backgroundRotation:i,environmentIntensity:c,environmentRotation:l,...m}){const b=u.useEnvironment(m),g=t.useThree((e=>e.scene));return s.useLayoutEffect((()=>d(e,n,g,b,{blur:r,backgroundBlurriness:o,backgroundIntensity:a,backgroundRotation:i,environmentIntensity:c,environmentRotation:l}))),null}function g({children:e,near:n=1,far:o=1e3,resolution:u=256,frames:a=1,map:i,background:c=!1,blur:l,backgroundBlurriness:g,backgroundIntensity:v,backgroundRotation:p,environmentIntensity:f,environmentRotation:k,scene:y,files:E,path:h,preset:j,extensions:I}){const R=t.useThree((e=>e.gl)),x=t.useThree((e=>e.scene)),P=s.useRef(null),[q]=s.useState((()=>new r.Scene)),B=s.useMemo((()=>{const e=new r.WebGLCubeRenderTarget(u);return e.texture.type=r.HalfFloatType,e}),[u]);s.useLayoutEffect((()=>(1===a&&P.current.update(R,q),d(c,y,x,B.texture,{blur:l,backgroundBlurriness:g,backgroundIntensity:v,backgroundRotation:p,environmentIntensity:f,environmentRotation:k}))),[e,q,B.texture,y,x,c,a,R]);let O=1;return t.useFrame((()=>{(a===1/0||O<a)&&(P.current.update(R,q),O++)})),s.createElement(s.Fragment,null,t.createPortal(s.createElement(s.Fragment,null,e,s.createElement("cubeCamera",{ref:P,args:[n,o,B]}),E||j?s.createElement(b,{background:!0,files:E,preset:j,path:h,extensions:I}):i?s.createElement(m,{background:!0,map:i,extensions:I}):null),q))}function v(e){var n,r,a,i;const l=u.useEnvironment(e),d=e.map||l;s.useMemo((()=>t.extend({GroundProjectedEnvImpl:o.GroundProjectedEnv})),[]);const b=s.useMemo((()=>[d]),[d]),g=null==(n=e.ground)?void 0:n.height,v=null==(r=e.ground)?void 0:r.radius,p=null!==(a=null==(i=e.ground)?void 0:i.scale)&&void 0!==a?a:1e3;return s.createElement(s.Fragment,null,s.createElement(m,c.default({},e,{map:d})),s.createElement("groundProjectedEnvImpl",{args:b,scale:p,height:g,radius:v}))}exports.Environment=function(e){return e.ground?s.createElement(v,e):e.map?s.createElement(m,e):e.children?s.createElement(g,e):s.createElement(b,e)},exports.EnvironmentCube=b,exports.EnvironmentMap=m,exports.EnvironmentPortal=g;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@babel/runtime/helpers/extends"),n=require("react"),r=require("@react-three/fiber"),t=require("three"),o=require("three-stdlib"),u=require("./useEnvironment.cjs.js");function a(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function i(e){if(e&&e.__esModule)return e;var n=Object.create(null);return e&&Object.keys(e).forEach((function(r){if("default"!==r){var t=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(n,r,t.get?t:{enumerable:!0,get:function(){return e[r]}})}})),n.default=e,Object.freeze(n)}require("@monogrid/gainmap-js"),require("../helpers/environment-assets.cjs.js"),require("../helpers/deprecated.cjs.js");var c=a(e),s=i(n);function l(e,n,t,o,u={}){var a,i,c,s,l;u={backgroundBlurriness:null!==(a=u.blur)&&void 0!==a?a:0,backgroundIntensity:1,backgroundRotation:[0,0,0],environmentIntensity:1,environmentRotation:[0,0,0],...u};const d=(e=>{return(n=e).current&&n.current.isScene?e.current:e;var n})(n||t),m=d.background,b=d.environment,g={backgroundBlurriness:d.backgroundBlurriness,backgroundIntensity:d.backgroundIntensity,backgroundRotation:null!==(i=null==(c=d.backgroundRotation)||null==c.clone?void 0:c.clone())&&void 0!==i?i:[0,0,0],environmentIntensity:d.environmentIntensity,environmentRotation:null!==(s=null==(l=d.environmentRotation)||null==l.clone?void 0:l.clone())&&void 0!==s?s:[0,0,0]};return"only"!==e&&(d.environment=o),e&&(d.background=o),r.applyProps(d,u),()=>{"only"!==e&&(d.environment=b),e&&(d.background=m),r.applyProps(d,g)}}function d({scene:e,background:n=!1,map:t,...o}){const u=r.useThree((e=>e.scene));return s.useLayoutEffect((()=>{if(t)return l(n,e,u,t,o)})),null}function m({background:e=!1,scene:n,blur:t,backgroundBlurriness:o,backgroundIntensity:a,backgroundRotation:i,environmentIntensity:c,environmentRotation:d,...m}){const b=u.useEnvironment(m),g=r.useThree((e=>e.scene));return s.useLayoutEffect((()=>l(e,n,g,b,{blur:t,backgroundBlurriness:o,backgroundIntensity:a,backgroundRotation:i,environmentIntensity:c,environmentRotation:d}))),null}function b({children:e,near:n=1,far:o=1e3,resolution:u=256,frames:a=1,map:i,background:c=!1,blur:b,backgroundBlurriness:g,backgroundIntensity:v,backgroundRotation:p,environmentIntensity:f,environmentRotation:k,scene:y,files:E,path:h,preset:j,extensions:I}){const R=r.useThree((e=>e.gl)),x=r.useThree((e=>e.scene)),P=s.useRef(null),[q]=s.useState((()=>new t.Scene)),B=s.useMemo((()=>{const e=new t.WebGLCubeRenderTarget(u);return e.texture.type=t.HalfFloatType,e}),[u]);s.useLayoutEffect((()=>(1===a&&P.current.update(R,q),l(c,y,x,B.texture,{blur:b,backgroundBlurriness:g,backgroundIntensity:v,backgroundRotation:p,environmentIntensity:f,environmentRotation:k}))),[e,q,B.texture,y,x,c,a,R]);let O=1;return r.useFrame((()=>{(a===1/0||O<a)&&(P.current.update(R,q),O++)})),s.createElement(s.Fragment,null,r.createPortal(s.createElement(s.Fragment,null,e,s.createElement("cubeCamera",{ref:P,args:[n,o,B]}),E||j?s.createElement(m,{background:!0,files:E,preset:j,path:h,extensions:I}):i?s.createElement(d,{background:!0,map:i,extensions:I}):null),q))}function g(e){var n,t,a,i;const l=u.useEnvironment(e),m=e.map||l;s.useMemo((()=>r.extend({GroundProjectedEnvImpl:o.GroundProjectedEnv})),[]);const b=s.useMemo((()=>[m]),[m]),g=null==(n=e.ground)?void 0:n.height,v=null==(t=e.ground)?void 0:t.radius,p=null!==(a=null==(i=e.ground)?void 0:i.scale)&&void 0!==a?a:1e3;return s.createElement(s.Fragment,null,s.createElement(d,c.default({},e,{map:m})),s.createElement("groundProjectedEnvImpl",{args:b,scale:p,height:g,radius:v}))}exports.Environment=function(e){return e.ground?s.createElement(g,e):e.map?s.createElement(d,e):e.children?s.createElement(b,e):s.createElement(m,e)},exports.EnvironmentCube=m,exports.EnvironmentMap=d,exports.EnvironmentPortal=b;

package/core/Environment.js

@@ -126,7 +126,7 @@ function EnvironmentPortal({
       count++;
     }
   });
-  return /*#__PURE__*/React.createElement(React.Fragment, null, createPortal( /*#__PURE__*/React.createElement(React.Fragment, null, children, /*#__PURE__*/React.createElement("cubeCamera", {
+  return /*#__PURE__*/React.createElement(React.Fragment, null, createPortal(/*#__PURE__*/React.createElement(React.Fragment, null, children, /*#__PURE__*/React.createElement("cubeCamera", {
     ref: camera,
     args: [near, far, fbo]
   }), files || preset ? /*#__PURE__*/React.createElement(EnvironmentCube, {

package/core/Fbo.js

@@ -6,7 +6,7 @@ import { useThree } from '@react-three/fiber';
 
 // 👇 uncomment when TS version supports function overloads
 // export function useFBO(settings?: FBOSettings)
-function useFBO( /** Width in pixels, or settings (will render fullscreen by default) */
+function useFBO(/** Width in pixels, or settings (will render fullscreen by default) */
 width, /** Height in pixels */
 height, /**Settings */
 settings) {

package/core/Hud.js

@@ -41,7 +41,7 @@ function Hud({
     camera: defaultCamera
   } = useThree();
   const [hudScene] = React.useState(() => new THREE.Scene());
-  return /*#__PURE__*/React.createElement(React.Fragment, null, createPortal( /*#__PURE__*/React.createElement(React.Fragment, null, children, /*#__PURE__*/React.createElement(RenderHud, {
+  return /*#__PURE__*/React.createElement(React.Fragment, null, createPortal(/*#__PURE__*/React.createElement(React.Fragment, null, children, /*#__PURE__*/React.createElement(RenderHud, {
     defaultScene: defaultScene,
     defaultCamera: defaultCamera,
     renderPriority: renderPriority

package/core/Instances.d.ts

@@ -48,25 +48,25 @@ export interface MergedProps extends InstancesProps {
 }
 export declare const Merged: ForwardRefComponent<any, THREE.Group>;
 export declare function createInstances<T = InstanceProps>(): readonly [React.ForwardRefExoticComponent<Omit<InstancesProps, "ref"> & React.RefAttributes<THREE.InstancedMesh<THREE.BufferGeometry, THREE.Material | THREE.Material[]>>>, React.ForwardRefExoticComponent<React.PropsWithoutRef<T & Omit<ReactThreeFiber.ExtendedColors<ReactThreeFiber.Overwrite<Partial<PositionMesh>, ReactThreeFiber.NodeProps<PositionMesh, typeof PositionMesh>>>, 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;
+    up?: ReactThreeFiber.Vector3;
+    scale?: ReactThreeFiber.Vector3;
+    rotation?: ReactThreeFiber.Euler;
+    matrix?: ReactThreeFiber.Matrix4;
+    quaternion?: ReactThreeFiber.Quaternion;
+    layers?: ReactThreeFiber.Layers;
+    dispose?: (() => void) | null;
 }>> & {
-    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;
+    up?: ReactThreeFiber.Vector3;
+    scale?: ReactThreeFiber.Vector3;
+    rotation?: ReactThreeFiber.Euler;
+    matrix?: ReactThreeFiber.Matrix4;
+    quaternion?: ReactThreeFiber.Quaternion;
+    layers?: ReactThreeFiber.Layers;
+    dispose?: (() => void) | null;
 } & import("@react-three/fiber/dist/declarations/src/core/events").EventHandlers & {
-    context?: React.Context<Api> | undefined;
+    context?: React.Context<Api>;
 }> & React.RefAttributes<PositionMesh & T>>];
 export declare const InstancedAttribute: React.ForwardRefExoticComponent<Omit<InstancedAttributeProps, "ref"> & React.RefAttributes<unknown>>;
 export {};

package/core/Ktx2.d.ts

@@ -4,7 +4,7 @@ export declare function useKTX2<Url extends string[] | string | Record<string, s
     [key in keyof Url]: Texture;
 } : Texture;
 export declare namespace useKTX2 {
-    var preload: (url: string, basisPath?: string) => undefined;
+    var preload: (url: string extends any[] ? string[] : string, basisPath?: string) => undefined;
     var clear: (input: string | string[]) => void;
 }
 export declare const Ktx2: ({ children, input, basisPath, }: {

package/core/PerformanceMonitor.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),n=require("@react-three/fiber");function r(e){if(e&&e.__esModule)return e;var n=Object.create(null);return e&&Object.keys(e).forEach((function(r){if("default"!==r){var t=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(n,r,t.get?t:{enumerable:!0,get:function(){return e[r]}})}})),n.default=e,Object.freeze(n)}var t=r(e);const o=e.createContext(null);exports.PerformanceMonitor=function({iterations:r=10,ms:a=250,threshold:c=.75,step:s=.1,factor:l=.5,flipflops:i=1/0,bounds:f=(e=>e>100?[60,100]:[40,60]),onIncline:u,onDecline:p,onChange:b,onFallback:h,children:d}){const g=Math.pow(10,0),[m,k]=e.useState((()=>({fps:0,index:0,factor:l,flipped:0,refreshrate:0,fallback:!1,frames:[],averages:[],subscriptions:new Map,subscribe:e=>{const n=Symbol();return m.subscriptions.set(n,e.current),()=>{m.subscriptions.delete(n)}}})));let v=0;return n.useFrame((()=>{const{frames:e,averages:n}=m;if(!m.fallback&&n.length<r){e.push(performance.now());const t=e[e.length-1]-e[0];if(t>=a){if(m.fps=Math.round(e.length/t*1e3*g)/g,m.refreshrate=Math.max(m.refreshrate,m.fps),n[m.index++%r]=m.fps,n.length===r){const[e,t]=f(m.refreshrate),o=n.filter((e=>e>=t)),a=n.filter((n=>n<e));o.length>r*c&&(m.factor=Math.min(1,m.factor+s),m.flipped++,u&&u(m),m.subscriptions.forEach((e=>e.onIncline&&e.onIncline(m)))),a.length>r*c&&(m.factor=Math.max(0,m.factor-s),m.flipped++,p&&p(m),m.subscriptions.forEach((e=>e.onDecline&&e.onDecline(m)))),v!==m.factor&&(v=m.factor,b&&b(m),m.subscriptions.forEach((e=>e.onChange&&e.onChange(m)))),m.flipped>i&&!m.fallback&&(m.fallback=!0,h&&h(m),m.subscriptions.forEach((e=>e.onFallback&&e.onFallback(m)))),m.averages=[]}m.frames=[]}}})),t.createElement(o.Provider,{value:m},d)},exports.usePerformanceMonitor=function({onIncline:n,onDecline:r,onChange:t,onFallback:a}){const c=e.useContext(o),s=e.useRef({onIncline:n,onDecline:r,onChange:t,onFallback:a});e.useLayoutEffect((()=>{s.current.onIncline=n,s.current.onDecline=r,s.current.onChange=t,s.current.onFallback=a}),[n,r,t,a]),e.useLayoutEffect((()=>c.subscribe(s)),[c])};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),n=require("@react-three/fiber");function r(e){if(e&&e.__esModule)return e;var n=Object.create(null);return e&&Object.keys(e).forEach((function(r){if("default"!==r){var t=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(n,r,t.get?t:{enumerable:!0,get:function(){return e[r]}})}})),n.default=e,Object.freeze(n)}var t=r(e);const o=e.createContext(null);exports.PerformanceMonitor=function({iterations:r=10,ms:a=250,threshold:c=.75,step:s=.1,factor:l=.5,flipflops:i=1/0,bounds:f=e=>e>100?[60,100]:[40,60],onIncline:u,onDecline:p,onChange:b,onFallback:h,children:d}){const g=Math.pow(10,0),[m,k]=e.useState((()=>({fps:0,index:0,factor:l,flipped:0,refreshrate:0,fallback:!1,frames:[],averages:[],subscriptions:new Map,subscribe:e=>{const n=Symbol();return m.subscriptions.set(n,e.current),()=>{m.subscriptions.delete(n)}}})));let v=0;return n.useFrame((()=>{const{frames:e,averages:n}=m;if(!m.fallback&&n.length<r){e.push(performance.now());const t=e[e.length-1]-e[0];if(t>=a){if(m.fps=Math.round(e.length/t*1e3*g)/g,m.refreshrate=Math.max(m.refreshrate,m.fps),n[m.index++%r]=m.fps,n.length===r){const[e,t]=f(m.refreshrate),o=n.filter((e=>e>=t)),a=n.filter((n=>n<e));o.length>r*c&&(m.factor=Math.min(1,m.factor+s),m.flipped++,u&&u(m),m.subscriptions.forEach((e=>e.onIncline&&e.onIncline(m)))),a.length>r*c&&(m.factor=Math.max(0,m.factor-s),m.flipped++,p&&p(m),m.subscriptions.forEach((e=>e.onDecline&&e.onDecline(m)))),v!==m.factor&&(v=m.factor,b&&b(m),m.subscriptions.forEach((e=>e.onChange&&e.onChange(m)))),m.flipped>i&&!m.fallback&&(m.fallback=!0,h&&h(m),m.subscriptions.forEach((e=>e.onFallback&&e.onFallback(m)))),m.averages=[]}m.frames=[]}}})),t.createElement(o.Provider,{value:m},d)},exports.usePerformanceMonitor=function({onIncline:n,onDecline:r,onChange:t,onFallback:a}){const c=e.useContext(o),s=e.useRef({onIncline:n,onDecline:r,onChange:t,onFallback:a});e.useLayoutEffect((()=>{s.current.onIncline=n,s.current.onDecline=r,s.current.onChange=t,s.current.onFallback=a}),[n,r,t,a]),e.useLayoutEffect((()=>c.subscribe(s)),[c])};

package/core/PerformanceMonitor.js

@@ -83,7 +83,6 @@ function PerformanceMonitor({
           // Resetting the refreshrate creates more problems than it solves atm
           // api.refreshrate = 0
         }
-
         api.frames = [];
       }
     }

package/core/RenderCubeTexture.js

@@ -49,7 +49,7 @@ const RenderCubeTexture = /* @__PURE__ */React.forwardRef(({
     fbo,
     camera: camera.current
   }), [fbo]);
-  return /*#__PURE__*/React.createElement(React.Fragment, null, createPortal( /*#__PURE__*/React.createElement(Container, {
+  return /*#__PURE__*/React.createElement(React.Fragment, null, createPortal(/*#__PURE__*/React.createElement(Container, {
     renderPriority: renderPriority,
     frames: frames,
     camera: camera

package/core/RenderTexture.js

@@ -50,7 +50,7 @@ const RenderTexture = /* @__PURE__ */React.forwardRef(({
     state.raycaster.setFromCamera(state.pointer.set(uv.x * 2 - 1, uv.y * 2 - 1), state.camera);
   }, []);
   React.useImperativeHandle(forwardRef, () => fbo.texture, [fbo]);
-  return /*#__PURE__*/React.createElement(React.Fragment, null, createPortal( /*#__PURE__*/React.createElement(Container, {
+  return /*#__PURE__*/React.createElement(React.Fragment, null, createPortal(/*#__PURE__*/React.createElement(Container, {
     renderPriority: renderPriority,
     frames: frames,
     fbo: fbo

package/core/SpotLight.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("three-stdlib"),o=require("../materials/SpotLightMaterial.cjs.js");function i(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 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("../helpers/constants.cjs.js");var l=i(e),s=u(t),c="#define GLSLIFY 1\nvarying vec2 vUv;uniform sampler2D uShadowMap;uniform float uTime;void main(){vec3 color=texture2D(uShadowMap,vUv).xyz;gl_FragColor=vec4(color,1.);}";const p=e=>null==e?void 0:e.isSpotLight;function d({opacity:e=1,radiusTop:t,radiusBottom:n,depthBuffer:i,color:u="white",distance:l=5,angle:c=.15,attenuation:p=5,anglePower:d=5}){const m=s.useRef(null),h=a.useThree((e=>e.size)),f=a.useThree((e=>e.camera)),g=a.useThree((e=>e.viewport.dpr)),[v]=s.useState((()=>new o.SpotLightMaterial)),[w]=s.useState((()=>new r.Vector3));t=void 0===t?.1:t,n=void 0===n?7*c:n,a.useFrame((()=>{v.uniforms.spotPosition.value.copy(m.current.getWorldPosition(w)),m.current.lookAt(m.current.parent.target.getWorldPosition(w))}));const S=s.useMemo((()=>{const e=new r.CylinderGeometry(t,n,l,128,64,!0);return e.applyMatrix4((new r.Matrix4).makeTranslation(0,-l/2,0)),e.applyMatrix4((new r.Matrix4).makeRotationX(-Math.PI/2)),e}),[l,t,n]);return s.createElement(s.Fragment,null,s.createElement("mesh",{ref:m,geometry:S,raycast:()=>null},s.createElement("primitive",{object:v,attach:"material","uniforms-opacity-value":e,"uniforms-lightColor-value":u,"uniforms-attenuation-value":p,"uniforms-anglePower-value":d,"uniforms-depth-value":i,"uniforms-cameraNear-value":f.near,"uniforms-cameraFar-value":f.far,"uniforms-resolution-value":i?[h.width*g,h.height*g]:[0,0]})))}function m(e,t,n,o,i){const[[u,l]]=s.useState((()=>[new r.Vector3,new r.Vector3]));s.useLayoutEffect((()=>{if(!p(e.current))throw new Error("SpotlightShadow must be a child of a SpotLight");e.current.shadow.mapSize.set(n,o),e.current.shadow.needsUpdate=!0}),[e,n,o]),a.useFrame((()=>{if(!e.current)return;const r=e.current.position,a=e.current.target.position;l.copy(a).sub(r);var n=l.length();l.normalize().multiplyScalar(n*i),u.copy(r).add(l),t.current.position.copy(u),t.current.lookAt(e.current.target.position)}))}function h({distance:e=.4,alphaTest:t=.5,map:o,shader:i=c,width:u=512,height:l=512,scale:p=1,children:d,...h}){const f=s.useRef(null),g=h.spotlightRef,v=h.debug;m(g,f,u,l,e);const w=s.useMemo((()=>new r.WebGLRenderTarget(u,l,{format:r.RGBAFormat,stencilBuffer:!1})),[u,l]),S=s.useRef({uShadowMap:{value:o},uTime:{value:0}});s.useEffect((()=>{S.current.uShadowMap.value=o}),[o]);const y=s.useMemo((()=>new n.FullScreenQuad(new r.ShaderMaterial({uniforms:S.current,vertexShader:"\n          varying vec2 vUv;\n\n          void main() {\n            vUv = uv;\n            gl_Position = projectionMatrix * modelViewMatrix * vec4(position, 1.0);\n          }\n          ",fragmentShader:i}))),[i]);return s.useEffect((()=>()=>{y.material.dispose(),y.dispose()}),[y]),s.useEffect((()=>()=>w.dispose()),[w]),a.useFrame((({gl:e},t)=>{S.current.uTime.value+=t,e.setRenderTarget(w),y.render(e),e.setRenderTarget(null)})),s.createElement(s.Fragment,null,s.createElement("mesh",{ref:f,scale:p,castShadow:!0},s.createElement("planeGeometry",null),s.createElement("meshBasicMaterial",{transparent:!0,side:r.DoubleSide,alphaTest:t,alphaMap:w.texture,"alphaMap-wrapS":r.RepeatWrapping,"alphaMap-wrapT":r.RepeatWrapping,opacity:v?1:0},d)))}function f({distance:e=.4,alphaTest:t=.5,map:a,width:n=512,height:o=512,scale:i,children:u,...l}){const c=s.useRef(null),p=l.spotlightRef,d=l.debug;return m(p,c,n,o,e),s.createElement(s.Fragment,null,s.createElement("mesh",{ref:c,scale:i,castShadow:!0},s.createElement("planeGeometry",null),s.createElement("meshBasicMaterial",{transparent:!0,side:r.DoubleSide,alphaTest:t,alphaMap:a,"alphaMap-wrapS":r.RepeatWrapping,"alphaMap-wrapT":r.RepeatWrapping,opacity:d?1:0},u)))}const g=s.forwardRef((({opacity:e=1,radiusTop:t,radiusBottom:r,depthBuffer:a,color:n="white",distance:o=5,angle:i=.15,attenuation:u=5,anglePower:c=5,volumetric:p=!0,debug:m=!1,children:h,...f},g)=>{const v=s.useRef(null);return s.useImperativeHandle(g,(()=>v.current),[]),s.createElement("group",null,m&&v.current&&s.createElement("spotLightHelper",{args:[v.current]}),s.createElement("spotLight",l.default({ref:v,angle:i,color:n,distance:o,castShadow:!0},f),p&&s.createElement(d,{debug:m,opacity:e,radiusTop:t,radiusBottom:r,depthBuffer:a,color:n,distance:o,angle:i,attenuation:u,anglePower:c})),h&&s.cloneElement(h,{spotlightRef:v,debug:m}))}));exports.SpotLight=g,exports.SpotLightShadow=function(e){return e.shader?s.createElement(h,e):s.createElement(f,e)};
+"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("three-stdlib"),o=require("../materials/SpotLightMaterial.cjs.js");function i(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 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("../helpers/constants.cjs.js");var l=i(e),s=u(t);function c({opacity:e=1,radiusTop:t,radiusBottom:n,depthBuffer:i,color:u="white",distance:l=5,angle:c=.15,attenuation:p=5,anglePower:d=5}){const m=s.useRef(null),h=a.useThree((e=>e.size)),f=a.useThree((e=>e.camera)),g=a.useThree((e=>e.viewport.dpr)),[v]=s.useState((()=>new o.SpotLightMaterial)),[w]=s.useState((()=>new r.Vector3));t=void 0===t?.1:t,n=void 0===n?7*c:n,a.useFrame((()=>{v.uniforms.spotPosition.value.copy(m.current.getWorldPosition(w)),m.current.lookAt(m.current.parent.target.getWorldPosition(w))}));const S=s.useMemo((()=>{const e=new r.CylinderGeometry(t,n,l,128,64,!0);return e.applyMatrix4((new r.Matrix4).makeTranslation(0,-l/2,0)),e.applyMatrix4((new r.Matrix4).makeRotationX(-Math.PI/2)),e}),[l,t,n]);return s.createElement(s.Fragment,null,s.createElement("mesh",{ref:m,geometry:S,raycast:()=>null},s.createElement("primitive",{object:v,attach:"material","uniforms-opacity-value":e,"uniforms-lightColor-value":u,"uniforms-attenuation-value":p,"uniforms-anglePower-value":d,"uniforms-depth-value":i,"uniforms-cameraNear-value":f.near,"uniforms-cameraFar-value":f.far,"uniforms-resolution-value":i?[h.width*g,h.height*g]:[0,0]})))}function p(e,t,n,o,i){const[[u,l]]=s.useState((()=>[new r.Vector3,new r.Vector3]));s.useLayoutEffect((()=>{if(!(null==(t=e.current)?void 0:t.isSpotLight))throw new Error("SpotlightShadow must be a child of a SpotLight");var t;e.current.shadow.mapSize.set(n,o),e.current.shadow.needsUpdate=!0}),[e,n,o]),a.useFrame((()=>{if(!e.current)return;const r=e.current.position,a=e.current.target.position;l.copy(a).sub(r);var n=l.length();l.normalize().multiplyScalar(n*i),u.copy(r).add(l),t.current.position.copy(u),t.current.lookAt(e.current.target.position)}))}function d({distance:e=.4,alphaTest:t=.5,map:o,shader:i="#define GLSLIFY 1\nvarying vec2 vUv;uniform sampler2D uShadowMap;uniform float uTime;void main(){vec3 color=texture2D(uShadowMap,vUv).xyz;gl_FragColor=vec4(color,1.);}",width:u=512,height:l=512,scale:c=1,children:d,...m}){const h=s.useRef(null),f=m.spotlightRef,g=m.debug;p(f,h,u,l,e);const v=s.useMemo((()=>new r.WebGLRenderTarget(u,l,{format:r.RGBAFormat,stencilBuffer:!1})),[u,l]),w=s.useRef({uShadowMap:{value:o},uTime:{value:0}});s.useEffect((()=>{w.current.uShadowMap.value=o}),[o]);const S=s.useMemo((()=>new n.FullScreenQuad(new r.ShaderMaterial({uniforms:w.current,vertexShader:"\n          varying vec2 vUv;\n\n          void main() {\n            vUv = uv;\n            gl_Position = projectionMatrix * modelViewMatrix * vec4(position, 1.0);\n          }\n          ",fragmentShader:i}))),[i]);return s.useEffect((()=>()=>{S.material.dispose(),S.dispose()}),[S]),s.useEffect((()=>()=>v.dispose()),[v]),a.useFrame((({gl:e},t)=>{w.current.uTime.value+=t,e.setRenderTarget(v),S.render(e),e.setRenderTarget(null)})),s.createElement(s.Fragment,null,s.createElement("mesh",{ref:h,scale:c,castShadow:!0},s.createElement("planeGeometry",null),s.createElement("meshBasicMaterial",{transparent:!0,side:r.DoubleSide,alphaTest:t,alphaMap:v.texture,"alphaMap-wrapS":r.RepeatWrapping,"alphaMap-wrapT":r.RepeatWrapping,opacity:g?1:0},d)))}function m({distance:e=.4,alphaTest:t=.5,map:a,width:n=512,height:o=512,scale:i,children:u,...l}){const c=s.useRef(null),d=l.spotlightRef,m=l.debug;return p(d,c,n,o,e),s.createElement(s.Fragment,null,s.createElement("mesh",{ref:c,scale:i,castShadow:!0},s.createElement("planeGeometry",null),s.createElement("meshBasicMaterial",{transparent:!0,side:r.DoubleSide,alphaTest:t,alphaMap:a,"alphaMap-wrapS":r.RepeatWrapping,"alphaMap-wrapT":r.RepeatWrapping,opacity:m?1:0},u)))}const h=s.forwardRef((({opacity:e=1,radiusTop:t,radiusBottom:r,depthBuffer:a,color:n="white",distance:o=5,angle:i=.15,attenuation:u=5,anglePower:p=5,volumetric:d=!0,debug:m=!1,children:h,...f},g)=>{const v=s.useRef(null);return s.useImperativeHandle(g,(()=>v.current),[]),s.createElement("group",null,m&&v.current&&s.createElement("spotLightHelper",{args:[v.current]}),s.createElement("spotLight",l.default({ref:v,angle:i,color:n,distance:o,castShadow:!0},f),d&&s.createElement(c,{debug:m,opacity:e,radiusTop:t,radiusBottom:r,depthBuffer:a,color:n,distance:o,angle:i,attenuation:u,anglePower:p})),h&&s.cloneElement(h,{spotlightRef:v,debug:m}))}));exports.SpotLight=h,exports.SpotLightShadow=function(e){return e.shader?s.createElement(d,e):s.createElement(m,e)};

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

package/core/SpriteAnimator.d.ts

@@ -1,4 +1,11 @@
 import * as React from 'react';
+type CommonMeshProps = {
+    frustumCulled?: boolean;
+    renderOrder?: number;
+    visible?: boolean;
+    userData?: any;
+    matrixAutoUpdate?: boolean;
+};
 export type SpriteAnimatorProps = {
     startFrame?: number;
     endFrame?: number;
@@ -27,6 +34,8 @@ export type SpriteAnimatorProps = {
     instanceItems?: any[];
     spriteDataset?: any;
     canvasRenderingContext2DSettings?: CanvasRenderingContext2DSettings;
+    roundFramePosition?: boolean;
+    meshProps?: CommonMeshProps;
 } & JSX.IntrinsicElements['group'];
 type SpriteAnimatorState = {
     current: number | undefined;

package/core/SpriteAnimator.js

@@ -9,6 +9,7 @@ const context = /*#__PURE__*/React.createContext(null);
 function useSpriteAnimator() {
   return React.useContext(context);
 }
+const geometry = new THREE.PlaneGeometry(1, 1);
 const SpriteAnimator = /* @__PURE__ */React.forwardRef(({
   startFrame,
   endFrame,
@@ -37,6 +38,8 @@ const SpriteAnimator = /* @__PURE__ */React.forwardRef(({
   instanceItems,
   spriteDataset,
   canvasRenderingContext2DSettings,
+  roundFramePosition = false,
+  meshProps = {},
   ...props
 }, fref) => {
   var _props$scale;
@@ -47,7 +50,7 @@ const SpriteAnimator = /* @__PURE__ */React.forwardRef(({
   const timerOffset = React.useRef(window.performance.now());
   const currentFrame = React.useRef(startFrame || 0);
   const currentFrameName = React.useRef(frameName || '');
-  const fpsInterval = 1000 / (fps || 30);
+  const fpsInterval = (fps !== null && fps !== void 0 ? fps : 30) > 0 ? 1000 / (fps || 30) : 0;
   const [spriteTexture, setSpriteTexture] = React.useState(new THREE.Texture());
   const totalFrames = React.useRef(0);
   const [aspect, setAspect] = React.useState([1, 1, 1]);
@@ -90,7 +93,9 @@ const SpriteAnimator = /* @__PURE__ */React.forwardRef(({
       var _spriteDataset$sprite;
       parseSpriteDataLite(spriteDataset == null || (_spriteDataset$sprite = spriteDataset.spriteTexture) == null ? void 0 : _spriteDataset$sprite.clone(), spriteDataset.spriteData);
     } else {
-      loadJsonAndTexture(textureImageURL, textureDataURL);
+      if (textureImageURL && textureDataURL) {
+        loadJsonAndTexture(textureImageURL, textureDataURL);
+      }
     }
   }, [spriteDataset]);
   React.useEffect(() => {
@@ -125,6 +130,9 @@ const SpriteAnimator = /* @__PURE__ */React.forwardRef(({
       currentFrame.current = 0;
       currentFrameName.current = frameName;
       state.hasEnded = false;
+      if (fpsInterval <= 0) {
+        currentFrame.current = endFrame || startFrame || 0;
+      }
       // modifySpritePosition()
       if (spriteData.current) {
         const {
@@ -135,7 +143,7 @@ const SpriteAnimator = /* @__PURE__ */React.forwardRef(({
         setAspect(_aspect);
       }
     }
-  }, [frameName]);
+  }, [frameName, fpsInterval]);
 
   // lite version for pre-loaded assets
   const parseSpriteDataLite = (textureData, frameData = null) => {
@@ -237,8 +245,6 @@ const SpriteAnimator = /* @__PURE__ */React.forwardRef(({
   const runAnimation = () => {
     //if (!frameName) return
 
-    const now = window.performance.now();
-    const diff = now - timerOffset.current;
     const {
       meta: {
         size: metaInfo
@@ -252,6 +258,14 @@ const SpriteAnimator = /* @__PURE__ */React.forwardRef(({
     const spriteFrames = Array.isArray(frames) ? frames : frameName ? frames[frameName] : [];
     const _endFrame = endFrame || spriteFrames.length - 1;
     var _offset = offset === undefined ? state.current : offset;
+    if (fpsInterval <= 0) {
+      currentFrame.current = endFrame || startFrame || 0;
+      calculateFinalPosition(frameW, frameH, metaInfo, spriteFrames);
+      return;
+    }
+    const now = window.performance.now();
+    const diff = now - timerOffset.current;
+    if (diff <= fpsInterval) return;
 
     // conditionals to support backwards play
     var endCondition = playBackwards ? currentFrame.current < 0 : currentFrame.current > _endFrame;
@@ -278,7 +292,6 @@ const SpriteAnimator = /* @__PURE__ */React.forwardRef(({
           //calculateFinalPosition(frameW, frameH, metaInfo, spriteFrames)
         }
       }
-
       if (!loop) return;
     } else if (onStartCondition) {
       onStart == null || onStart({
@@ -313,8 +326,8 @@ const SpriteAnimator = /* @__PURE__ */React.forwardRef(({
     let finalValX = 0;
     let finalValY = 0;
     calculateAspectRatio(frameW, frameH);
-    const framesH = Math.round((metaInfo.w - 1) / frameW);
-    const framesV = Math.round((metaInfo.h - 1) / frameH);
+    const framesH = roundFramePosition ? Math.round((metaInfo.w - 1) / frameW) : (metaInfo.w - 1) / frameW;
+    const framesV = roundFramePosition ? Math.round((metaInfo.h - 1) / frameH) : (metaInfo.h - 1) / frameH;
     if (!spriteFrames[targetFrame]) {
       return;
     }
@@ -345,7 +358,6 @@ const SpriteAnimator = /* @__PURE__ */React.forwardRef(({
       if (isNaN(frameIndex)) {
         frameIndex = 0; //fallback
       }
-
       currentFrame.current = frameIndex;
     } else {
       // auto update
@@ -414,21 +426,21 @@ const SpriteAnimator = /* @__PURE__ */React.forwardRef(({
     value: state
   }, /*#__PURE__*/React.createElement(React.Suspense, {
     fallback: null
-  }, displayAsSprite && /*#__PURE__*/React.createElement("sprite", {
+  }, displayAsSprite && /*#__PURE__*/React.createElement("sprite", _extends({
     ref: spriteRef,
-    scale: 1.0
-  }, /*#__PURE__*/React.createElement("spriteMaterial", {
+    scale: 1.0,
+    geometry: geometry
+  }, meshProps), /*#__PURE__*/React.createElement("spriteMaterial", {
     premultipliedAlpha: false,
     toneMapped: false,
     ref: matRef,
     map: spriteTexture,
     transparent: true,
     alphaTest: alphaTest !== null && alphaTest !== void 0 ? alphaTest : 0.0
-  })), !displayAsSprite && /*#__PURE__*/React.createElement(Instances, {
-    limit: maxItems !== null && maxItems !== void 0 ? maxItems : 1 // Optional: max amount of items (for calculating buffer size)
-  }, /*#__PURE__*/React.createElement("planeGeometry", {
-    args: [1, 1]
-  }), /*#__PURE__*/React.createElement("meshBasicMaterial", {
+  })), !displayAsSprite && /*#__PURE__*/React.createElement(Instances, _extends({
+    geometry: geometry,
+    limit: maxItems !== null && maxItems !== void 0 ? maxItems : 1
+  }, meshProps), /*#__PURE__*/React.createElement("meshBasicMaterial", {
     premultipliedAlpha: false,
     toneMapped: false,
     side: THREE.DoubleSide,
@@ -436,14 +448,12 @@ const SpriteAnimator = /* @__PURE__ */React.forwardRef(({
     map: spriteTexture,
     transparent: true,
     alphaTest: alphaTest !== null && alphaTest !== void 0 ? alphaTest : 0.0
-  }), (instanceItems !== null && instanceItems !== void 0 ? instanceItems : [0]).map((item, index) => {
-    return /*#__PURE__*/React.createElement(Instance, {
-      key: index,
-      ref: (instanceItems == null ? void 0 : instanceItems.length) === 1 ? spriteRef : null,
-      position: item,
-      scale: 1.0
-    });
-  }))), children));
+  }), (instanceItems !== null && instanceItems !== void 0 ? instanceItems : [0]).map((item, index) => /*#__PURE__*/React.createElement(Instance, _extends({
+    key: index,
+    ref: (instanceItems == null ? void 0 : instanceItems.length) === 1 ? spriteRef : null,
+    position: item,
+    scale: 1.0
+  }, meshProps))))), children));
 });
 
 export { SpriteAnimator, useSpriteAnimator };

package/core/Text.js

@@ -4,7 +4,6 @@ import { Text as Text$1, preloadFont } from 'troika-three-text';
 import { useThree } from '@react-three/fiber';
 import { suspend } from 'suspend-react';
 
-// eslint-disable-next-line prettier/prettier
 const Text = /* @__PURE__ */React.forwardRef(({
   sdfGlyphSize = 64,
   anchorX = 'center',

package/core/Trail.js

@@ -138,7 +138,7 @@ const Trail = /* @__PURE__ */React.forwardRef((props, forwardRef) => {
     if (!points.current) return;
     geo.setPoints(points.current, attenuation);
   });
-  return /*#__PURE__*/React.createElement("group", null, createPortal( /*#__PURE__*/React.createElement("mesh", {
+  return /*#__PURE__*/React.createElement("group", null, createPortal(/*#__PURE__*/React.createElement("mesh", {
     ref: forwardRef,
     geometry: geo,
     material: mat

package/core/useAnimations.js

@@ -7,7 +7,6 @@ function useAnimations(clips, root) {
   const [actualRef] = React.useState(() => root ? root instanceof Object3D ? {
     current: root
   } : root : ref);
-  // eslint-disable-next-line prettier/prettier
   const [mixer] = React.useState(() => new AnimationMixer(undefined));
   React.useLayoutEffect(() => {
     if (root) actualRef.current = root instanceof Object3D ? root : root.current;

package/core/useBoxProjectedEnv.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("three"),r=require("react"),n=require("@react-three/fiber");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 i=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(r,n,i.get?i:{enumerable:!0,get:function(){return e[n]}})}})),r.default=e,Object.freeze(r)}var o=i(e),t=i(r);const a="\n#if defined( USE_ENVMAP ) || defined( DISTANCE ) || defined ( USE_SHADOWMAP )\n  vec4 worldPosition = modelMatrix * vec4( transformed, 1.0 );\n  #ifdef BOX_PROJECTED_ENV_MAP\n    vWorldPosition = worldPosition.xyz;\n  #endif\n#endif\n",c="\n#ifdef BOX_PROJECTED_ENV_MAP\n  uniform vec3 envMapSize;\n  uniform vec3 envMapPosition;\n  varying vec3 vWorldPosition;\n    \n  vec3 parallaxCorrectNormal( vec3 v, vec3 cubeSize, vec3 cubePos ) {\n    vec3 nDir = normalize( v );\n    vec3 rbmax = ( .5 * cubeSize + cubePos - vWorldPosition ) / nDir;\n    vec3 rbmin = ( -.5 * cubeSize + cubePos - vWorldPosition ) / nDir;\n    vec3 rbminmax;\n    rbminmax.x = ( nDir.x > 0. ) ? rbmax.x : rbmin.x;\n    rbminmax.y = ( nDir.y > 0. ) ? rbmax.y : rbmin.y;\n    rbminmax.z = ( nDir.z > 0. ) ? rbmax.z : rbmin.z;\n    float correction = min( min( rbminmax.x, rbminmax.y ), rbminmax.z );\n    vec3 boxIntersection = vWorldPosition + nDir * correction;    \n    return boxIntersection - cubePos;\n  }\n#endif\n",s="\n#ifdef BOX_PROJECTED_ENV_MAP\n  worldNormal = parallaxCorrectNormal( worldNormal, envMapSize, envMapPosition );\n#endif\n",f="\n#ifdef BOX_PROJECTED_ENV_MAP\n  reflectVec = parallaxCorrectNormal( reflectVec, envMapSize, envMapPosition );\n#endif\n";exports.useBoxProjectedEnv=function(e=new o.Vector3,r=new o.Vector3){const[i]=t.useState((()=>({position:new o.Vector3,size:new o.Vector3})));n.applyProps(i,{position:e,size:r});const l=t.useRef(null),v=t.useMemo((()=>({ref:l,onBeforeCompile:e=>function(e,r,n){e.defines.BOX_PROJECTED_ENV_MAP=!0,e.uniforms.envMapPosition={value:r},e.uniforms.envMapSize={value:n},e.vertexShader=`\n  varying vec3 vWorldPosition;\n  ${e.vertexShader.replace("#include <worldpos_vertex>",a)}`,e.fragmentShader=`\n    ${c}\n    ${e.fragmentShader.replace("#include <envmap_physical_pars_fragment>",o.ShaderChunk.envmap_physical_pars_fragment).replace("vec3 worldNormal = inverseTransformDirection( normal, viewMatrix );",`vec3 worldNormal = inverseTransformDirection( normal, viewMatrix );\n         ${s}\n         `).replace("reflectVec = inverseTransformDirection( reflectVec, viewMatrix );",`reflectVec = inverseTransformDirection( reflectVec, viewMatrix );\n         ${f}\n        `)}`}(e,i.position,i.size),customProgramCacheKey:()=>JSON.stringify(i.position.toArray())+JSON.stringify(i.size.toArray())})),[...i.position.toArray(),...i.size.toArray()]);return t.useLayoutEffect((()=>{l.current.needsUpdate=!0}),[i]),v};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("three"),r=require("react"),n=require("@react-three/fiber");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 i=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(r,n,i.get?i:{enumerable:!0,get:function(){return e[n]}})}})),r.default=e,Object.freeze(r)}var o=i(e),t=i(r);exports.useBoxProjectedEnv=function(e=new o.Vector3,r=new o.Vector3){const[i]=t.useState((()=>({position:new o.Vector3,size:new o.Vector3})));n.applyProps(i,{position:e,size:r});const a=t.useRef(null),c=t.useMemo((()=>({ref:a,onBeforeCompile:e=>function(e,r,n){e.defines.BOX_PROJECTED_ENV_MAP=!0,e.uniforms.envMapPosition={value:r},e.uniforms.envMapSize={value:n},e.vertexShader=`\n  varying vec3 vWorldPosition;\n  ${e.vertexShader.replace("#include <worldpos_vertex>","\n#if defined( USE_ENVMAP ) || defined( DISTANCE ) || defined ( USE_SHADOWMAP )\n  vec4 worldPosition = modelMatrix * vec4( transformed, 1.0 );\n  #ifdef BOX_PROJECTED_ENV_MAP\n    vWorldPosition = worldPosition.xyz;\n  #endif\n#endif\n")}`,e.fragmentShader=`\n    \n#ifdef BOX_PROJECTED_ENV_MAP\n  uniform vec3 envMapSize;\n  uniform vec3 envMapPosition;\n  varying vec3 vWorldPosition;\n    \n  vec3 parallaxCorrectNormal( vec3 v, vec3 cubeSize, vec3 cubePos ) {\n    vec3 nDir = normalize( v );\n    vec3 rbmax = ( .5 * cubeSize + cubePos - vWorldPosition ) / nDir;\n    vec3 rbmin = ( -.5 * cubeSize + cubePos - vWorldPosition ) / nDir;\n    vec3 rbminmax;\n    rbminmax.x = ( nDir.x > 0. ) ? rbmax.x : rbmin.x;\n    rbminmax.y = ( nDir.y > 0. ) ? rbmax.y : rbmin.y;\n    rbminmax.z = ( nDir.z > 0. ) ? rbmax.z : rbmin.z;\n    float correction = min( min( rbminmax.x, rbminmax.y ), rbminmax.z );\n    vec3 boxIntersection = vWorldPosition + nDir * correction;    \n    return boxIntersection - cubePos;\n  }\n#endif\n\n    ${e.fragmentShader.replace("#include <envmap_physical_pars_fragment>",o.ShaderChunk.envmap_physical_pars_fragment).replace("vec3 worldNormal = inverseTransformDirection( normal, viewMatrix );","vec3 worldNormal = inverseTransformDirection( normal, viewMatrix );\n         \n#ifdef BOX_PROJECTED_ENV_MAP\n  worldNormal = parallaxCorrectNormal( worldNormal, envMapSize, envMapPosition );\n#endif\n\n         ").replace("reflectVec = inverseTransformDirection( reflectVec, viewMatrix );","reflectVec = inverseTransformDirection( reflectVec, viewMatrix );\n         \n#ifdef BOX_PROJECTED_ENV_MAP\n  reflectVec = parallaxCorrectNormal( reflectVec, envMapSize, envMapPosition );\n#endif\n\n        ")}`}(e,i.position,i.size),customProgramCacheKey:()=>JSON.stringify(i.position.toArray())+JSON.stringify(i.size.toArray())})),[...i.position.toArray(),...i.size.toArray()]);return t.useLayoutEffect((()=>{a.current.needsUpdate=!0}),[i]),c};

package/core/useEnvironment.d.ts

@@ -10,8 +10,8 @@ export type EnvironmentLoaderProps = {
 };
 export declare function useEnvironment({ files, path, preset, encoding, extensions, }?: Partial<EnvironmentLoaderProps>): Texture;
 export declare namespace useEnvironment {
-    var preload: (preloadOptions?: EnvironmentLoaderPreloadOptions | undefined) => void;
-    var clear: (clearOptions?: EnvironmentLoaderClearOptions | undefined) => void;
+    var preload: (preloadOptions?: EnvironmentLoaderPreloadOptions) => void;
+    var clear: (clearOptions?: EnvironmentLoaderClearOptions) => void;
 }
 type EnvironmentLoaderPreloadOptions = Omit<EnvironmentLoaderProps, 'encoding'>;
 type EnvironmentLoaderClearOptions = Pick<EnvironmentLoaderProps, 'files' | 'preset'>;