@react-three/drei 9.89.1 → 9.89.3

package/core/useTexture.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("three"),r=require("@react-three/fiber"),t=require("react");const u=e=>e===Object(e)&&!Array.isArray(e)&&"function"!=typeof e;function a(a,s){const o=r.useThree((e=>e.gl)),c=r.useLoader(e.TextureLoader,u(a)?Object.values(a):a);if(t.useLayoutEffect((()=>{null==s||s(c)}),[s]),t.useEffect((()=>{if("initTexture"in o){(Array.isArray(c)?c:[c]).forEach(o.initTexture)}}),[o,c]),u(a)){const e=Object.keys(a),r={};return e.forEach((t=>Object.assign(r,{[t]:c[e.indexOf(t)]}))),r}return c}a.preload=t=>r.useLoader.preload(e.TextureLoader,t),a.clear=t=>r.useLoader.clear(e.TextureLoader,t),exports.IsObject=u,exports.useTexture=a;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("three"),r=require("@react-three/fiber"),t=require("react");const u=e=>e===Object(e)&&!Array.isArray(e)&&"function"!=typeof e;function o(o,a){const s=r.useThree((e=>e.gl)),c=r.useLoader(e.TextureLoader,u(o)?Object.values(o):o);if(t.useLayoutEffect((()=>{null==a||a(c)}),[a]),t.useEffect((()=>{if("initTexture"in s){(Array.isArray(c)?c:[c]).forEach(s.initTexture)}}),[s,c]),u(o)){const e={};let r=0;for(const t in o)e[t]=c[r++];return e}return c}o.preload=t=>r.useLoader.preload(e.TextureLoader,t),o.clear=t=>r.useLoader.clear(e.TextureLoader,t),exports.IsObject=u,exports.useTexture=o;

package/core/useTexture.d.ts

@@ -1,8 +1,9 @@
 import { Texture } from 'three';
 export declare const IsObject: (url: any) => url is Record<string, string>;
-export declare function useTexture<Url extends string[] | string | Record<string, string>>(input: Url, onLoad?: (texture: Texture | Texture[]) => void): Url extends any[] ? Texture[] : Url extends object ? {
-    [key in keyof Url]: Texture;
+export type MappedTextureType<T extends string[] | string | Record<string, string>> = T extends any[] ? Texture[] : T extends Record<string, string> ? {
+    [key in keyof T]: Texture;
 } : Texture;
+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) => undefined;
     var clear: (input: string | string[]) => void;

package/core/useTexture.js

@@ -20,11 +20,9 @@ function useTexture(input, onLoad) {
     }
   }, [gl, textures]);
   if (IsObject(input)) {
-    const keys = Object.keys(input);
     const keyed = {};
-    keys.forEach(key => Object.assign(keyed, {
-      [key]: textures[keys.indexOf(key)]
-    }));
+    let i = 0;
+    for (const key in input) keyed[key] = textures[i++];
     return keyed;
   } else {
     return textures;

package/core/useVideoTexture.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("three"),r=require("react"),t=require("@react-three/fiber"),n=require("suspend-react");function o(e){if(e&&e.__esModule)return e;var r=Object.create(null);return e&&Object.keys(e).forEach((function(t){if("default"!==t){var n=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(r,t,n.get?n:{enumerable:!0,get:function(){return e[t]}})}})),r.default=e,Object.freeze(r)}var u=o(e);exports.useVideoTexture=function(e,o){const{unsuspend:s,start:c,crossOrigin:i,muted:a,loop:d,...p}={unsuspend:"loadedmetadata",crossOrigin:"Anonymous",muted:!0,loop:!0,start:!0,playsInline:!0,...o},l=t.useThree((e=>e.gl)),f=n.suspend((()=>new Promise(((r,t)=>{const n=Object.assign(document.createElement("video"),{src:"string"==typeof e&&e||void 0,srcObject:e instanceof MediaStream&&e||void 0,crossOrigin:i,loop:d,muted:a,...p}),o=new u.VideoTexture(n);"colorSpace"in o?o.colorSpace=l.outputColorSpace:o.encoding=l.outputEncoding,n.addEventListener(s,(()=>r(o)))}))),[e]);return r.useEffect((()=>{c&&f.image.play()}),[f,c]),f};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("three"),r=require("react"),t=require("@react-three/fiber"),n=require("suspend-react");function o(e){if(e&&e.__esModule)return e;var r=Object.create(null);return e&&Object.keys(e).forEach((function(t){if("default"!==t){var n=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(r,t,n.get?n:{enumerable:!0,get:function(){return e[t]}})}})),r.default=e,Object.freeze(r)}var u=o(e);exports.useVideoTexture=function(e,o){const{unsuspend:s,start:i,crossOrigin:c,muted:a,loop:d,...p}={unsuspend:"loadedmetadata",crossOrigin:"Anonymous",muted:!0,loop:!0,start:!0,playsInline:!0,...o},l=t.useThree((e=>e.gl)),f=n.suspend((()=>new Promise(((r,t)=>{const n=Object.assign(document.createElement("video"),{src:"string"==typeof e&&e||void 0,srcObject:e instanceof MediaStream&&e||void 0,crossOrigin:c,loop:d,muted:a,...p}),o=new u.VideoTexture(n);"colorSpace"in o?o.colorSpace=l.outputColorSpace:o.encoding=l.outputEncoding,n.addEventListener(s,(()=>r(o)))}))),[e]);return r.useEffect((()=>{if(i)return f.image.play(),()=>f.image.pause()}),[f,i]),f};

package/core/useVideoTexture.js

@@ -34,7 +34,12 @@ function useVideoTexture(src, props) {
     if ('colorSpace' in texture) texture.colorSpace = gl.outputColorSpace;else texture.encoding = gl.outputEncoding;
     video.addEventListener(unsuspend, () => res(texture));
   }), [src]);
-  useEffect(() => void (start && texture.image.play()), [texture, start]);
+  useEffect(() => {
+    if (start) {
+      texture.image.play();
+      return () => texture.image.pause();
+    }
+  }, [texture, start]);
   return texture;
 }