@tresjs/core 1.6.3 → 1.8.0

package/dist/tres.umd.cjs

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

package/dist/types/index.d.ts

@@ -1,35 +1,28 @@
-import { Object3D } from 'three'
-import { VNode, VNodeTypes } from 'vue'
-
-export type TresInstance = Object3D<Event> & { [key: string]: any }
-
-export type TresCatalogue = Record<string, any>
+import { Color, Intersection, Object3D, Vector2, Vector3, Event } from 'three';
+import { VNode, VNodeTypes } from 'vue';
+export type TresInstance = Object3D<Event> & {
+    [key: string]: any;
+};
+export type TresCatalogue = Record<string, any>;
 export type TresVNodeType = VNodeTypes & {
-  name?: string | Array<string>
-  __name?: string
-  setup?: (props: Readonly<any>) => void
-}
-export type TresVNode = VNode & { children?: Array<VNode | { default: any }>; type: TresVNodeType }
-export type TresAttributes = Record<string, any> & { args?: number[] }
-
-export type TresColor = string | number | Color | number[]
-
+    name?: string | Array<string>;
+    __name?: string;
+    setup?: (props: Readonly<any>) => void;
+};
+export type TresVNode = VNode & {
+    children?: Array<VNode | {
+        default: any;
+    }>;
+    type: TresVNodeType;
+};
+export type TresAttributes = Record<string, any> & {
+    args?: number[];
+};
+export type TresColor = string | number | Color | number[];
 export interface TresEvent extends Intersection<Object3D<Event>> {
-  object: Object3D
-  distance: number
-  face?: Face3
-  faceIndex?: number | undefined
-  point: Vector3
-  uv?: Vector2
-}
-
-declare global {
-  // Define the window interface, with type annotations for the properties and methods of the window object
-  interface Window {
-    // Define the location property, with a type of Location
-    __TRES__: {
-      app: App
-      version: string
-    }
-  }
+    object: Object3D;
+    distance: number;
+    faceIndex?: number | undefined;
+    point: Vector3;
+    uv?: Vector2;
 }

package/dist/utils/index.d.ts

@@ -0,0 +1,2 @@
+export declare function toSetMethodName(key: string): string;
+export declare const merge: (target: any, source: any) => any;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@tresjs/core",
   "description": "Declarative ThreeJS using Vue Components",
-  "version": "1.6.3",
+  "version": "1.8.0",
   "type": "module",
   "author": "Alvaro Saburido <hola@alvarosaburido.dev> (https://github.com/alvarosabu/)",
   "files": [
@@ -16,6 +16,10 @@
       "import": "./dist/tres.js",
       "require": "./dist/tres.umd.cjs"
     },
+    "./types": {
+      "require": "./dist/index.d.ts",
+      "import": "./dist/index.d.ts"
+    },
     "./styles": "./dist/style.css",
     "./*": "./dist/tres.js"
   },
@@ -30,33 +34,34 @@
     "threejs-vue"
   ],
   "peerDependencies": {
-    "vue": "^3.2.47",
-    "three": "latest"
+    "three": "latest",
+    "vue": "^3.2.47"
   },
   "dependencies": {
-    "@vueuse/core": "^9.12.0",
-    "@alvarosabu/utils": "^2.2.0"
+    "@alvarosabu/utils": "^2.3.0",
+    "@vueuse/core": "^9.13.0"
   },
   "devDependencies": {
-    "@tresjs/cientos": "^1.6.0",
+    "@tresjs/cientos": "^1.8.0",
     "@types/three": "latest",
     "@vitejs/plugin-vue": "^4.0.0",
-    "@vitest/coverage-c8": "^0.28.4",
-    "@vitest/ui": "^0.28.4",
-    "gl": "6.0.2",
-    "happy-dom": "^8.2.6",
+    "@vitest/coverage-c8": "^0.28.5",
+    "@vitest/ui": "^0.28.5",
+    "@vue/test-utils": "^2.3.0",
+    "happy-dom": "^8.7.1",
+    "jsdom": "^21.1.0",
     "kolorist": "^1.7.0",
     "pathe": "^1.1.0",
-    "release-it": "^15.6.0",
     "rollup-plugin-analyzer": "^4.0.0",
     "rollup-plugin-visualizer": "^5.9.0",
-    "unplugin-vue-components": "^0.23.0",
-    "vite": "^4.1.1",
+    "three": "latest",
+    "vite": "^4.1.4",
     "vite-plugin-banner": "^0.7.0",
-    "vite-plugin-dts": "^1.7.2",
+    "vite-plugin-dts": "2.0.0-beta.1",
     "vite-plugin-glsl": "^1.1.2",
+    "vite-plugin-inspect": "^0.7.15",
     "vite-plugin-require-transform": "^1.0.9",
-    "vitest": "^0.28.4",
+    "vitest": "^0.28.5",
     "vue-demi": "^0.13.11"
   },
   "scripts": {