@tresjs/core 1.6.0 → 1.6.1

package/dist/core/useCamera/index.d.ts

@@ -4,8 +4,8 @@ export declare enum CameraType {
     Perspective = "Perspective",
     Orthographic = "Orthographic"
 }
-export declare type Camera = PerspectiveCamera | OrthographicCamera;
-export declare type CameraState = {
+export type Camera = PerspectiveCamera | OrthographicCamera;
+export type CameraState = {
     cameras: Array<Camera>;
 };
 export interface PerspectiveCameraOptions {

package/dist/core/useLoader/index.d.ts

@@ -2,12 +2,12 @@ import { Object3D } from 'three';
 export interface TresLoader<T> extends THREE.Loader {
     load(url: string, onLoad?: (result: T) => void, onProgress?: (event: ProgressEvent) => void, onError?: (event: ErrorEvent) => void): unknown;
 }
-export declare type LoaderProto<T> = new (...args: any) => TresLoader<T extends unknown ? any : T>;
-export declare type LoaderReturnType<T, L extends LoaderProto<T>> = T extends unknown ? Awaited<ReturnType<InstanceType<L>['loadAsync']>> : T;
+export type LoaderProto<T> = new (...args: any) => TresLoader<T extends unknown ? any : T>;
+export type LoaderReturnType<T, L extends LoaderProto<T>> = T extends unknown ? Awaited<ReturnType<InstanceType<L>['loadAsync']>> : T;
 export declare function trasverseObjects(object: Object3D): {
     [key: string]: any;
 };
-export declare type Extensions<T extends {
+export type Extensions<T extends {
     prototype: LoaderProto<any>;
 }> = (loader: T['prototype']) => void;
 export declare function useLoader<T extends LoaderProto<T>, U extends string | string[]>(Loader: T, url: U, extensions?: Extensions<T>, onProgress?: (event: ProgressEvent<EventTarget>) => void, cb?: (proto: TresLoader<T>) => void): Promise<U extends any[] ? LoaderReturnType<T, T>[] : LoaderReturnType<T, T>>;

package/dist/core/useRenderer/index.d.ts

@@ -83,4 +83,4 @@ export declare function useRenderer(canvas: MaybeElementRef, container: MaybeEle
     dispose: () => void;
     aspectRatio: import("vue").ComputedRef<number>;
 };
-export declare type UseRendererReturn = ReturnType<typeof useRenderer>;
+export type UseRendererReturn = ReturnType<typeof useRenderer>;

package/dist/tres.js

@@ -1,6 +1,6 @@
 /**
  * name: @tresjs/core
- * version: v1.6.0
+ * version: v1.6.1
  * (c) 2023
  * description: Declarative ThreeJS using Vue Components
  * author: Alvaro Saburido <hola@alvarosaburido.dev> (https://github.com/alvarosabu/)
@@ -99,7 +99,10 @@ function Ge(e) {
 }
 const He = ["rotation", "scale", "position"];
 function ve(e) {
-  const { logError: n } = G();
+  const {
+    /* logMessage, */
+    logError: n
+  } = G();
   function r(t, i) {
     O(t) && O(i) && Object.entries(t).forEach(([u, a]) => {
       const c = u.replace(/(-\w)/g, (l) => l[1].toUpperCase());
@@ -431,7 +434,7 @@ const nt = X({
         return n.default();
     };
   }
-}), ut = Symbol("UseTresState"), rt = "1.6.0", lt = {
+}), ut = Symbol("UseTresState"), rt = "1.6.1", lt = {
   install(e, n) {
     const r = (n == null ? void 0 : n.prefix) || "Tres";
     e.component(`${r}Canvas`, Ze), e.component(`${r}Scene`, nt);

package/dist/tres.umd.cjs

@@ -1,8 +1,8 @@
 /**
  * name: @tresjs/core
- * version: v1.6.0
+ * version: v1.6.1
  * (c) 2023
  * description: Declarative ThreeJS using Vue Components
  * author: Alvaro Saburido <hola@alvarosaburido.dev> (https://github.com/alvarosabu/)
  */
-(function(h,o){typeof exports=="object"&&typeof module<"u"?o(exports,require("vue"),require("@vueuse/core"),require("three")):typeof define=="function"&&define.amd?define(["exports","vue","@vueuse/core","three"],o):(h=typeof globalThis<"u"?globalThis:h||self,o(h.tres={},h.Vue,h.VueUseCore,h.Three))})(this,function(h,o,f,m){"use strict";function ue(e){const n=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const r in e)if(r!=="default"){const a=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(n,r,a.get?a:{enumerable:!0,get:()=>e[r]})}}return n.default=e,Object.freeze(n)}const Z=ue(m);var E=(e=>(e.Perspective="Perspective",e.Orthographic="Orthographic",e))(E||{});const j={cameras:[]},fe=45;let O;function G(){const e=o.inject("aspect-ratio"),{setState:n}=N();function r(d="Perspective",t){if(d==="Perspective"){const{near:s,far:u,fov:i}=t||{near:.1,far:1e3,fov:fe};O=new m.PerspectiveCamera(i,(e==null?void 0:e.value)||1,s,u),j.cameras.push(O)}else{const{left:s,right:u,top:i,bottom:l,near:p,far:U}=t||{left:-100,right:100,top:100,bottom:-100,near:.1,far:1e3};O=new m.OrthographicCamera(s,u,i,l,p,U),j.cameras.push(O)}return j.cameras.push(O),O}const a=o.computed(()=>j.cameras[0]);function c(){a.value instanceof m.PerspectiveCamera&&e&&(a.value.aspect=e.value),a.value.updateProjectionMatrix()}function g(d){const t=o.inject("camera");d&&t&&(t.value=d,n("camera",t.value)),j.cameras.push(d),d instanceof m.PerspectiveCamera&&e&&(d.aspect=e.value),d.updateProjectionMatrix()}return e&&o.watch(e,c),{activeCamera:a,createCamera:r,updateCamera:c,pushCamera:g}}const H="[TresJS ▲ ■ ●] ";function D(){function e(a,c){console.error(`${H} ${a}`,c||"")}function n(a){console.warn(`${H} ${a}`)}function r(a,c){}return{logError:e,logWarning:n,logMessage:r}}const $=o.ref({...Z,uuid:Z.MathUtils.generateUUID()});delete $.value.Scene;let _;function K(e,n="Tres"){const{logError:r}=D();!_&&e&&(_=e);const{createComponentInstances:a}=J(n);return{extend:g=>{if(!g){r("No objects provided to extend catalogue");return}$.value=Object.assign($.value,g);const d=a(o.ref(g));_&&d.forEach(([t,s])=>{_._context.components[t]||_.component(t,s)})},catalogue:$}}const A=e=>typeof e<"u",pe=e=>typeof e=="function",k=e=>!!e&&e.constructor===Array;function de(e){return typeof e=="number"?[e,e,e]:e instanceof m.Vector3?[e.x,e.y,e.z]:e}function me(e){return e instanceof m.Color?e:Array.isArray(e)?new m.Color(...e):new m.Color(e)}const ge=["rotation","scale","position"];function J(e){const{logError:n}=D();function r(t,s){A(t)&&A(s)&&Object.entries(t).forEach(([u,i])=>{const l=u.replace(/(-\w)/g,p=>p[1].toUpperCase());s.setAttribute(l,new m.BufferAttribute(...i))})}function a(t,s){A(t)&&A(s)&&Object.entries(t).forEach(([u,i])=>{const l=u.replace(/(-\w)/g,p=>p[1].toUpperCase());if(!(l==="args"||i===void 0)){ge.includes(l)&&i&&(i=de(i)),t.ref&&(t.ref=s);try{if(s[l]&&A(s[l].set))s[l].set(...k(i)?i:[i]);else{if(i===""&&(i=!0),pe(s[l])){if(u==="center"&&!i)return;s[l](...k(i)?i:[i]);return}s[l]=i}}catch(p){n(`There was an error setting ${l} property`,p)}}})}function c(t){var i,l;const s=/^Symbol\(Fragment\)$/g,u=/^Symbol\(Text\)$/g;if(s.test(t.type.toString()))return t.children.map(p=>c(p));if(u.test(t.type.toString()))return;{const p=t.type.name.replace(e,""),{catalogue:U}=K(),v=o.inject("catalogue")||U;let y;if(v)if((i=t.children)!=null&&i.default){const x=t.children.default().map(I=>c(I));y=new v.value[p](...x.flat().filter(Boolean))}else(l=t==null?void 0:t.props)!=null&&l.args?v!=null&&v.value[p]?y=new v.value[p](...t.props.args):n(`There is no ${p} in the catalogue`,v==null?void 0:v.value.uuid):y=new v.value[p];return t!=null&&t.props&&(p==="BufferGeometry"?r(t.props,y):a(t.props,y)),y}}function g(t,s,u){if(u.default&&(u!=null&&u.default())){const i=u.default().map(l=>c(l));if(t.name==="Group"){const l=new t;return i.forEach(p=>{l.add(p)}),l}else return new t(...i.flat().filter(Boolean))}else return s.args?new t(...s.args):new t}function d(t){return Object.entries(t.value).filter(([s,u])=>{var i,l;return(l=(i=u==null?void 0:u.prototype)==null?void 0:i.constructor)==null?void 0:l.toString().includes("class")}).map(([s,u])=>{const i=`${e}${s}`,l=o.defineComponent({name:i,setup(p,{slots:U,attrs:v,...y}){const{scene:x}=Y(),{onLoop:I}=T(),M=o.inject("local-scene")||x,L=o.inject("raycaster"),{pushCamera:b}=G();let C=g(u,v,U);a(v,C),(C instanceof m.PerspectiveCamera||C instanceof m.OrthographicCamera)&&b(C),C.isObject3D&&(M==null||M.value.add(C));let P=null,S=null;if(C.isMesh){I(()=>{if(C&&(L!=null&&L.value)){const q=L==null?void 0:L.value.intersectObjects(M.value.children);q.length>0?(S=q[0],(P===null||P.object.uuid!==(S==null?void 0:S.object.uuid))&&y.emit("pointer-enter",S),y.emit("pointer-move",S)):(S=null,P!==null&&y.emit("pointer-leave",P)),P=S}});const W=f.useEventListener(window,"click",()=>{y.emit("click",P)});o.onUnmounted(()=>{W()})}return M!=null&&M.value&&C.isFog&&(M.value.fog=C),y.expose(C),()=>{}}});return[i,l]})}return{createComponentInstances:d,processProps:a,createInstanceFromVNode:c}}const ee=f.createEventHook(),te=f.createEventHook(),X=f.createEventHook(),B=new m.Clock;let F=0,z=0;const{pause:he,resume:we,isActive:ve}=f.useRafFn(()=>{ee.trigger({delta:F,elapsed:z,clock:B}),te.trigger({delta:F,elapsed:z,clock:B}),X.trigger({delta:F,elapsed:z,clock:B})},{immediate:!1});X.on(()=>{F=B.getDelta(),z=B.getElapsedTime()});function T(){return{onBeforeLoop:ee.on,onLoop:te.on,onAfterLoop:X.on,pause:he,resume:we,isActive:ve}}const ye=o.shallowRef(new m.Scene);function Y(){return{scene:ye}}function ne(e){const n={nodes:{},materials:{}};return e&&e.traverse(r=>{r.name&&(n.nodes[r.name]=r),r.material&&!n.materials[r.material.name]&&(n.materials[r.material.name]=r.material)}),n}async function Ce(e,n,r,a,c){const{logError:g}=D(),d=new e;c&&c(d),r&&r(d);const s=(Array.isArray(n)?n:[n]).map(u=>new Promise((i,l)=>{d.load(u,p=>{p.scene&&Object.assign(p,ne(p.scene)),i(p)},a,p=>l(g("[useLoader] - Failed to load resource",p)))}));return k(n)?await Promise.all(s):await s[0]}async function Se(e){const n=new m.LoadingManager,r=new m.TextureLoader(n),a=c=>new Promise((g,d)=>{r.load(c,t=>g(t),()=>null,()=>{d(new Error("[useTextures] - Failed to load texture"))})});if(k(e)){const c=await Promise.all(e.map(g=>a(g)));return e.length>1?c:c[0]}else{const{map:c,displacementMap:g,normalMap:d,roughnessMap:t,metalnessMap:s,aoMap:u}=e;return{map:c?await a(c):null,displacementMap:g?await a(g):null,normalMap:d?await a(d):null,roughnessMap:t?await a(t):null,metalnessMap:s?await a(s):null,aoMap:u?await a(u):null}}}const V=o.shallowReactive({});function N(){function e(r){return V[r]}function n(r,a){V[r]=a}return{state:V,...o.toRefs(V),getState:e,setState:n}}const w=o.shallowRef(),Q=o.ref(!1);function re(e,n,r){const{alpha:a=!0,antialias:c=!0,depth:g,logarithmicDepthBuffer:d,failIfMajorPerformanceCaveat:t,precision:s,premultipliedAlpha:u,stencil:i,shadows:l=!1,shadowMapType:p=m.PCFShadowMap,physicallyCorrectLights:U=!1,outputEncoding:v=m.LinearEncoding,toneMapping:y=m.NoToneMapping,toneMappingExposure:x=1,context:I=void 0,powerPreference:M="default",preserveDrawingBuffer:L=!1,clearColor:b,windowSize:C=!1}=o.toRefs(r),{width:P,height:S}=f.resolveUnref(C)?f.useWindowSize():f.useElementSize(n),{pixelRatio:W}=f.useDevicePixelRatio(),{pause:q,resume:je}=T(),ae=o.computed(()=>P.value/S.value),ie=()=>{w.value&&(w.value.setSize(P.value,S.value),w.value.setPixelRatio(Math.min(W.value,2)))},se=()=>{w.value&&(w.value.shadowMap.enabled=f.resolveUnref(l),w.value.shadowMap.type=f.resolveUnref(p),w.value.toneMapping=f.resolveUnref(y)||m.NoToneMapping,w.value.toneMappingExposure=f.resolveUnref(x),w.value.outputEncoding=f.resolveUnref(v)||m.LinearEncoding,b!=null&&b.value&&w.value.setClearColor(me(f.resolveUnref(b))),w.value.physicallyCorrectLights=f.resolveUnref(U))},_e=()=>{const ce=f.unrefElement(e);if(w.value||!ce)return;w.value=new m.WebGLRenderer({canvas:ce,alpha:f.resolveUnref(a),antialias:f.resolveUnref(c),context:f.resolveUnref(I),depth:f.resolveUnref(g),failIfMajorPerformanceCaveat:f.resolveUnref(t),logarithmicDepthBuffer:f.resolveUnref(d),powerPreference:f.resolveUnref(M),precision:f.resolveUnref(s),stencil:f.resolveUnref(i),preserveDrawingBuffer:f.resolveUnref(L),premultipliedAlpha:f.resolveUnref(u)});const{setState:le}=N();le("renderer",w.value),le("clock",new m.Clock),se(),ie(),je(),Q.value=!0},Ae=()=>{w.value&&(w.value.dispose(),w.value=void 0,Q.value=!1,q())};return o.watch([ae,W],ie),o.watch([l,p,v,U,y,x,b],se),o.watch(()=>[e,n],()=>{f.unrefElement(e)&&f.unrefElement(n)&&_e()},{immediate:!0,deep:!0}),{renderer:w,isReady:Q,dispose:Ae,aspectRatio:ae}}const Me=o.defineComponent({name:"TresCanvas",props:{shadows:Boolean,shadowMapType:Object,physicallyCorrectLights:Boolean,outputEncoding:Object,toneMapping:Object,toneMappingExposure:Number,context:Object,powerPreference:Object,preserveDrawingBuffer:Boolean,clearColor:String,windowSize:{type:Boolean,default:!1}},setup(e,{slots:n,attrs:r}){const{logError:a}=D(),c=o.ref(),g=o.ref(),{renderer:d,dispose:t,aspectRatio:s}=re(c,g,e);o.provide("aspect-ratio",s),o.provide("renderer",d);const u=o.shallowRef();return o.provide("camera",u),n.default&&!n.default().some(i=>i.type.name==="Scene")&&a("TresCanvas must contain a Scene component."),n.default&&!n.default().some(i=>{var l;return(l=i.type.name)==null?void 0:l.includes("Camera")})&&a("Scene must contain a Camera component."),o.onBeforeUnmount(()=>t()),()=>{if(n.default)return o.h("div",{ref:g,style:{position:"relative",width:"100%",height:"100vh",...r.style}},[o.h("canvas",{ref:c,style:{width:"100%",height:"100%",position:e.windowSize?"fixed":"absolute",top:0,left:0}}),n.default()])}}}),oe=o.shallowRef(new m.Raycaster),R=o.ref(new m.Vector2),Pe=o.ref(null);function Ue(){o.provide("raycaster",oe),o.provide("pointer",R),o.provide("currentInstance",Pe);function e(n){R.value.x=n.clientX/window.innerWidth*2-1,R.value.y=-(n.clientY/window.innerHeight)*2+1}return window.addEventListener("pointermove",e),o.onUnmounted(()=>{window.removeEventListener("pointermove",e)}),{raycaster:oe,pointer:R}}const Le=o.defineComponent({name:"Scene",setup(e,{slots:n}){const{scene:r}=Y(),a=o.inject("renderer"),{activeCamera:c}=G(),{raycaster:g,pointer:d}=Ue(),{onLoop:t}=T();return o.provide("local-scene",r),t(()=>{g.value.setFromCamera(d.value,c.value),a!=null&&a.value&&(c!=null&&c.value)&&(r!=null&&r.value)&&a.value.render(r==null?void 0:r.value,c.value)}),()=>{if(n.default)return n.default()}}}),be=Symbol("UseTresState"),Oe="1.6.0",xe={install(e,n){const r=(n==null?void 0:n.prefix)||"Tres";e.component(`${r}Canvas`,Me),e.component(`${r}Scene`,Le);const{catalogue:a,extend:c}=K(e,r);e.provide("catalogue",a),e.provide("extend",c),e.provide("useTres",N());const{createComponentInstances:g}=J(r);g(a).forEach(([t,s])=>{e.component(t,s)}),window.__TRES__={app:e,version:Oe}}};h.CameraType=E,h.UseTresStateSymbol=be,h.default=xe,h.trasverseObjects=ne,h.useCamera=G,h.useCatalogue=K,h.useInstanceCreator=J,h.useLoader=Ce,h.useRenderLoop=T,h.useRenderer=re,h.useScene=Y,h.useTexture=Se,h.useTres=N,Object.defineProperties(h,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});
+(function(h,o){typeof exports=="object"&&typeof module<"u"?o(exports,require("vue"),require("@vueuse/core"),require("three")):typeof define=="function"&&define.amd?define(["exports","vue","@vueuse/core","three"],o):(h=typeof globalThis<"u"?globalThis:h||self,o(h.tres={},h.Vue,h.VueUseCore,h.Three))})(this,function(h,o,f,m){"use strict";function ue(e){const n=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const r in e)if(r!=="default"){const a=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(n,r,a.get?a:{enumerable:!0,get:()=>e[r]})}}return n.default=e,Object.freeze(n)}const Z=ue(m);var E=(e=>(e.Perspective="Perspective",e.Orthographic="Orthographic",e))(E||{});const j={cameras:[]},fe=45;let O;function G(){const e=o.inject("aspect-ratio"),{setState:n}=N();function r(d="Perspective",t){if(d==="Perspective"){const{near:s,far:u,fov:i}=t||{near:.1,far:1e3,fov:fe};O=new m.PerspectiveCamera(i,(e==null?void 0:e.value)||1,s,u),j.cameras.push(O)}else{const{left:s,right:u,top:i,bottom:l,near:p,far:U}=t||{left:-100,right:100,top:100,bottom:-100,near:.1,far:1e3};O=new m.OrthographicCamera(s,u,i,l,p,U),j.cameras.push(O)}return j.cameras.push(O),O}const a=o.computed(()=>j.cameras[0]);function c(){a.value instanceof m.PerspectiveCamera&&e&&(a.value.aspect=e.value),a.value.updateProjectionMatrix()}function g(d){const t=o.inject("camera");d&&t&&(t.value=d,n("camera",t.value)),j.cameras.push(d),d instanceof m.PerspectiveCamera&&e&&(d.aspect=e.value),d.updateProjectionMatrix()}return e&&o.watch(e,c),{activeCamera:a,createCamera:r,updateCamera:c,pushCamera:g}}const H="[TresJS ▲ ■ ●] ";function D(){function e(a,c){console.error(`${H} ${a}`,c||"")}function n(a){console.warn(`${H} ${a}`)}function r(a,c){}return{logError:e,logWarning:n,logMessage:r}}const $=o.ref({...Z,uuid:Z.MathUtils.generateUUID()});delete $.value.Scene;let _;function K(e,n="Tres"){const{logError:r}=D();!_&&e&&(_=e);const{createComponentInstances:a}=J(n);return{extend:g=>{if(!g){r("No objects provided to extend catalogue");return}$.value=Object.assign($.value,g);const d=a(o.ref(g));_&&d.forEach(([t,s])=>{_._context.components[t]||_.component(t,s)})},catalogue:$}}const A=e=>typeof e<"u",pe=e=>typeof e=="function",k=e=>!!e&&e.constructor===Array;function de(e){return typeof e=="number"?[e,e,e]:e instanceof m.Vector3?[e.x,e.y,e.z]:e}function me(e){return e instanceof m.Color?e:Array.isArray(e)?new m.Color(...e):new m.Color(e)}const ge=["rotation","scale","position"];function J(e){const{logError:n}=D();function r(t,s){A(t)&&A(s)&&Object.entries(t).forEach(([u,i])=>{const l=u.replace(/(-\w)/g,p=>p[1].toUpperCase());s.setAttribute(l,new m.BufferAttribute(...i))})}function a(t,s){A(t)&&A(s)&&Object.entries(t).forEach(([u,i])=>{const l=u.replace(/(-\w)/g,p=>p[1].toUpperCase());if(!(l==="args"||i===void 0)){ge.includes(l)&&i&&(i=de(i)),t.ref&&(t.ref=s);try{if(s[l]&&A(s[l].set))s[l].set(...k(i)?i:[i]);else{if(i===""&&(i=!0),pe(s[l])){if(u==="center"&&!i)return;s[l](...k(i)?i:[i]);return}s[l]=i}}catch(p){n(`There was an error setting ${l} property`,p)}}})}function c(t){var i,l;const s=/^Symbol\(Fragment\)$/g,u=/^Symbol\(Text\)$/g;if(s.test(t.type.toString()))return t.children.map(p=>c(p));if(u.test(t.type.toString()))return;{const p=t.type.name.replace(e,""),{catalogue:U}=K(),v=o.inject("catalogue")||U;let y;if(v)if((i=t.children)!=null&&i.default){const x=t.children.default().map(I=>c(I));y=new v.value[p](...x.flat().filter(Boolean))}else(l=t==null?void 0:t.props)!=null&&l.args?v!=null&&v.value[p]?y=new v.value[p](...t.props.args):n(`There is no ${p} in the catalogue`,v==null?void 0:v.value.uuid):y=new v.value[p];return t!=null&&t.props&&(p==="BufferGeometry"?r(t.props,y):a(t.props,y)),y}}function g(t,s,u){if(u.default&&(u!=null&&u.default())){const i=u.default().map(l=>c(l));if(t.name==="Group"){const l=new t;return i.forEach(p=>{l.add(p)}),l}else return new t(...i.flat().filter(Boolean))}else return s.args?new t(...s.args):new t}function d(t){return Object.entries(t.value).filter(([s,u])=>{var i,l;return(l=(i=u==null?void 0:u.prototype)==null?void 0:i.constructor)==null?void 0:l.toString().includes("class")}).map(([s,u])=>{const i=`${e}${s}`,l=o.defineComponent({name:i,setup(p,{slots:U,attrs:v,...y}){const{scene:x}=Y(),{onLoop:I}=T(),M=o.inject("local-scene")||x,L=o.inject("raycaster"),{pushCamera:b}=G();let C=g(u,v,U);a(v,C),(C instanceof m.PerspectiveCamera||C instanceof m.OrthographicCamera)&&b(C),C.isObject3D&&(M==null||M.value.add(C));let P=null,S=null;if(C.isMesh){I(()=>{if(C&&(L!=null&&L.value)){const q=L==null?void 0:L.value.intersectObjects(M.value.children);q.length>0?(S=q[0],(P===null||P.object.uuid!==(S==null?void 0:S.object.uuid))&&y.emit("pointer-enter",S),y.emit("pointer-move",S)):(S=null,P!==null&&y.emit("pointer-leave",P)),P=S}});const W=f.useEventListener(window,"click",()=>{y.emit("click",P)});o.onUnmounted(()=>{W()})}return M!=null&&M.value&&C.isFog&&(M.value.fog=C),y.expose(C),()=>{}}});return[i,l]})}return{createComponentInstances:d,processProps:a,createInstanceFromVNode:c}}const ee=f.createEventHook(),te=f.createEventHook(),X=f.createEventHook(),B=new m.Clock;let F=0,z=0;const{pause:he,resume:we,isActive:ve}=f.useRafFn(()=>{ee.trigger({delta:F,elapsed:z,clock:B}),te.trigger({delta:F,elapsed:z,clock:B}),X.trigger({delta:F,elapsed:z,clock:B})},{immediate:!1});X.on(()=>{F=B.getDelta(),z=B.getElapsedTime()});function T(){return{onBeforeLoop:ee.on,onLoop:te.on,onAfterLoop:X.on,pause:he,resume:we,isActive:ve}}const ye=o.shallowRef(new m.Scene);function Y(){return{scene:ye}}function ne(e){const n={nodes:{},materials:{}};return e&&e.traverse(r=>{r.name&&(n.nodes[r.name]=r),r.material&&!n.materials[r.material.name]&&(n.materials[r.material.name]=r.material)}),n}async function Ce(e,n,r,a,c){const{logError:g}=D(),d=new e;c&&c(d),r&&r(d);const s=(Array.isArray(n)?n:[n]).map(u=>new Promise((i,l)=>{d.load(u,p=>{p.scene&&Object.assign(p,ne(p.scene)),i(p)},a,p=>l(g("[useLoader] - Failed to load resource",p)))}));return k(n)?await Promise.all(s):await s[0]}async function Se(e){const n=new m.LoadingManager,r=new m.TextureLoader(n),a=c=>new Promise((g,d)=>{r.load(c,t=>g(t),()=>null,()=>{d(new Error("[useTextures] - Failed to load texture"))})});if(k(e)){const c=await Promise.all(e.map(g=>a(g)));return e.length>1?c:c[0]}else{const{map:c,displacementMap:g,normalMap:d,roughnessMap:t,metalnessMap:s,aoMap:u}=e;return{map:c?await a(c):null,displacementMap:g?await a(g):null,normalMap:d?await a(d):null,roughnessMap:t?await a(t):null,metalnessMap:s?await a(s):null,aoMap:u?await a(u):null}}}const V=o.shallowReactive({});function N(){function e(r){return V[r]}function n(r,a){V[r]=a}return{state:V,...o.toRefs(V),getState:e,setState:n}}const w=o.shallowRef(),Q=o.ref(!1);function re(e,n,r){const{alpha:a=!0,antialias:c=!0,depth:g,logarithmicDepthBuffer:d,failIfMajorPerformanceCaveat:t,precision:s,premultipliedAlpha:u,stencil:i,shadows:l=!1,shadowMapType:p=m.PCFShadowMap,physicallyCorrectLights:U=!1,outputEncoding:v=m.LinearEncoding,toneMapping:y=m.NoToneMapping,toneMappingExposure:x=1,context:I=void 0,powerPreference:M="default",preserveDrawingBuffer:L=!1,clearColor:b,windowSize:C=!1}=o.toRefs(r),{width:P,height:S}=f.resolveUnref(C)?f.useWindowSize():f.useElementSize(n),{pixelRatio:W}=f.useDevicePixelRatio(),{pause:q,resume:je}=T(),ae=o.computed(()=>P.value/S.value),ie=()=>{w.value&&(w.value.setSize(P.value,S.value),w.value.setPixelRatio(Math.min(W.value,2)))},se=()=>{w.value&&(w.value.shadowMap.enabled=f.resolveUnref(l),w.value.shadowMap.type=f.resolveUnref(p),w.value.toneMapping=f.resolveUnref(y)||m.NoToneMapping,w.value.toneMappingExposure=f.resolveUnref(x),w.value.outputEncoding=f.resolveUnref(v)||m.LinearEncoding,b!=null&&b.value&&w.value.setClearColor(me(f.resolveUnref(b))),w.value.physicallyCorrectLights=f.resolveUnref(U))},_e=()=>{const ce=f.unrefElement(e);if(w.value||!ce)return;w.value=new m.WebGLRenderer({canvas:ce,alpha:f.resolveUnref(a),antialias:f.resolveUnref(c),context:f.resolveUnref(I),depth:f.resolveUnref(g),failIfMajorPerformanceCaveat:f.resolveUnref(t),logarithmicDepthBuffer:f.resolveUnref(d),powerPreference:f.resolveUnref(M),precision:f.resolveUnref(s),stencil:f.resolveUnref(i),preserveDrawingBuffer:f.resolveUnref(L),premultipliedAlpha:f.resolveUnref(u)});const{setState:le}=N();le("renderer",w.value),le("clock",new m.Clock),se(),ie(),je(),Q.value=!0},Ae=()=>{w.value&&(w.value.dispose(),w.value=void 0,Q.value=!1,q())};return o.watch([ae,W],ie),o.watch([l,p,v,U,y,x,b],se),o.watch(()=>[e,n],()=>{f.unrefElement(e)&&f.unrefElement(n)&&_e()},{immediate:!0,deep:!0}),{renderer:w,isReady:Q,dispose:Ae,aspectRatio:ae}}const Me=o.defineComponent({name:"TresCanvas",props:{shadows:Boolean,shadowMapType:Object,physicallyCorrectLights:Boolean,outputEncoding:Object,toneMapping:Object,toneMappingExposure:Number,context:Object,powerPreference:Object,preserveDrawingBuffer:Boolean,clearColor:String,windowSize:{type:Boolean,default:!1}},setup(e,{slots:n,attrs:r}){const{logError:a}=D(),c=o.ref(),g=o.ref(),{renderer:d,dispose:t,aspectRatio:s}=re(c,g,e);o.provide("aspect-ratio",s),o.provide("renderer",d);const u=o.shallowRef();return o.provide("camera",u),n.default&&!n.default().some(i=>i.type.name==="Scene")&&a("TresCanvas must contain a Scene component."),n.default&&!n.default().some(i=>{var l;return(l=i.type.name)==null?void 0:l.includes("Camera")})&&a("Scene must contain a Camera component."),o.onBeforeUnmount(()=>t()),()=>{if(n.default)return o.h("div",{ref:g,style:{position:"relative",width:"100%",height:"100vh",...r.style}},[o.h("canvas",{ref:c,style:{width:"100%",height:"100%",position:e.windowSize?"fixed":"absolute",top:0,left:0}}),n.default()])}}}),oe=o.shallowRef(new m.Raycaster),R=o.ref(new m.Vector2),Pe=o.ref(null);function Ue(){o.provide("raycaster",oe),o.provide("pointer",R),o.provide("currentInstance",Pe);function e(n){R.value.x=n.clientX/window.innerWidth*2-1,R.value.y=-(n.clientY/window.innerHeight)*2+1}return window.addEventListener("pointermove",e),o.onUnmounted(()=>{window.removeEventListener("pointermove",e)}),{raycaster:oe,pointer:R}}const Le=o.defineComponent({name:"Scene",setup(e,{slots:n}){const{scene:r}=Y(),a=o.inject("renderer"),{activeCamera:c}=G(),{raycaster:g,pointer:d}=Ue(),{onLoop:t}=T();return o.provide("local-scene",r),t(()=>{g.value.setFromCamera(d.value,c.value),a!=null&&a.value&&(c!=null&&c.value)&&(r!=null&&r.value)&&a.value.render(r==null?void 0:r.value,c.value)}),()=>{if(n.default)return n.default()}}}),be=Symbol("UseTresState"),Oe="1.6.1",xe={install(e,n){const r=(n==null?void 0:n.prefix)||"Tres";e.component(`${r}Canvas`,Me),e.component(`${r}Scene`,Le);const{catalogue:a,extend:c}=K(e,r);e.provide("catalogue",a),e.provide("extend",c),e.provide("useTres",N());const{createComponentInstances:g}=J(r);g(a).forEach(([t,s])=>{e.component(t,s)}),window.__TRES__={app:e,version:Oe}}};h.CameraType=E,h.UseTresStateSymbol=be,h.default=xe,h.trasverseObjects=ne,h.useCamera=G,h.useCatalogue=K,h.useInstanceCreator=J,h.useLoader=Ce,h.useRenderLoop=T,h.useRenderer=re,h.useScene=Y,h.useTexture=Se,h.useTres=N,Object.defineProperties(h,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});

package/dist/utils/normalize.d.ts

@@ -1,5 +1,5 @@
 import { Vector3, Color } from 'three';
-export declare type SizeFlexibleParams = number[] | {
+export type SizeFlexibleParams = number[] | {
     width: number;
     height: number;
 };
@@ -12,6 +12,6 @@ export interface Vector2PropInterface {
 export interface Vector3PropInterface extends Vector2PropInterface {
     z?: number;
 }
-export declare type VectorFlexibleParams = Vector3 | number[] | Vector3PropInterface | number;
+export type VectorFlexibleParams = Vector3 | number[] | Vector3PropInterface | number;
 export declare function normalizeVectorFlexibleParam(value: VectorFlexibleParams): Array<number>;
 export declare function normalizeColor(value: Color | Array<number> | string | number): Color;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@tresjs/core",
   "description": "Declarative ThreeJS using Vue Components",
-  "version": "1.6.0",
+  "version": "1.6.1",
   "type": "module",
   "author": "Alvaro Saburido <hola@alvarosaburido.dev> (https://github.com/alvarosabu/)",
   "files": [
@@ -30,34 +30,35 @@
     "threejs-vue"
   ],
   "dependencies": {
-    "three": "^0.148.0",
-    "vue": "^3.2.45"
+    "three": "latest",
+    "vue": "^3.2.47"
   },
   "peerDependencies": {
-    "three": "latest"
+    "three": "latest",
+    "@vueuse/core": "^9.12.0"
   },
   "devDependencies": {
     "@alvarosabu/utils": "^2.2.0",
     "@tresjs/cientos": "^1.6.0",
-    "@types/three": "^0.148.0",
+    "@types/three": "latest",
     "@vitejs/plugin-vue": "^4.0.0",
-    "@vitest/coverage-c8": "^0.25.8",
-    "@vitest/ui": "^0.25.8",
-    "@vueuse/core": "^9.11.0",
-    "gl": "6.0.1",
-    "happy-dom": "^8.1.0",
-    "kolorist": "^1.6.0",
-    "pathe": "^1.0.0",
-    "release-it": "^15.5.1",
+    "@vitest/coverage-c8": "^0.28.4",
+    "@vitest/ui": "^0.28.4",
+    "@vueuse/core": "^9.12.0",
+    "gl": "6.0.2",
+    "happy-dom": "^8.2.6",
+    "kolorist": "^1.7.0",
+    "pathe": "^1.1.0",
+    "release-it": "^15.6.0",
     "rollup-plugin-analyzer": "^4.0.0",
-    "rollup-plugin-visualizer": "^5.8.3",
-    "unplugin-vue-components": "^0.22.12",
-    "vite": "^4.0.4",
+    "rollup-plugin-visualizer": "^5.9.0",
+    "unplugin-vue-components": "^0.23.0",
+    "vite": "^4.1.1",
     "vite-plugin-banner": "^0.7.0",
-    "vite-plugin-dts": "^1.7.1",
-    "vite-plugin-glsl": "^1.1.0",
-    "vite-plugin-require-transform": "^1.0.4",
-    "vitest": "^0.25.8",
+    "vite-plugin-dts": "^1.7.2",
+    "vite-plugin-glsl": "^1.1.2",
+    "vite-plugin-require-transform": "^1.0.9",
+    "vitest": "^0.28.4",
     "vue-demi": "^0.13.11"
   },
   "scripts": {