@tresjs/core 1.8.1 → 2.0.0-alpha.1

package/dist/tres.umd.cjs

@@ -1,8 +1,8 @@
 /**
  * name: @tresjs/core
- * version: v1.8.1
+ * version: v2.0.0-alpha.1
  * (c) 2023
  * description: Declarative ThreeJS using Vue Components
  * author: Alvaro Saburido <hola@alvarosaburido.dev> (https://github.com/alvarosabu/)
  */
-(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 n=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const o in e)if(o!=="default"){const a=Object.getOwnPropertyDescriptor(e,o);Object.defineProperty(n,o,a.get?a:{enumerable:!0,get:()=>e[o]})}}return n.default=e,Object.freeze(n)}const Q=he(p);var E=(e=>(e.Perspective="Perspective",e.Orthographic="Orthographic",e))(E||{});const we=45;let $;function G(){const{state:e,setState:n}=x(),o=i.inject("aspect-ratio");function a(t="Perspective",r){var f,c,s;if(t==="Perspective"){const{near:d,far:w,fov:g}=r||{near:.1,far:1e3,fov:we};$=new p.PerspectiveCamera(g,((f=e.aspectRatio)==null?void 0:f.value)||window.innerWidth/window.innerHeight,d,w),(c=e.cameras)==null||c.push($)}else{const{left:d,right:w,top:g,bottom:h,near:y,far:U}=r||{left:-100,right:100,top:100,bottom:-100,near:.1,far:1e3};$=new p.OrthographicCamera(d,w,g,h,y,U),(s=e.cameras)==null||s.push($)}return e.camera=$,n("camera",e.camera),$}function l(){var t;e.camera instanceof p.PerspectiveCamera&&e.aspectRatio&&(e.camera.aspect=e.aspectRatio.value),(t=e.camera)==null||t.updateProjectionMatrix()}function m(t){var r;(r=e.cameras)==null||r.push(t),t instanceof p.PerspectiveCamera&&e.aspectRatio&&(t.aspect=e.aspectRatio.value),t.updateProjectionMatrix(),n("camera",t)}function v(){e.cameras=[]}return o&&i.watch(o,l),{activeCamera:i.toRef(e,"camera"),createCamera:a,updateCamera:l,pushCamera:m,clearCameras:v}}const H="[TresJS ▲ ■ ●] ";function B(){function e(a,l){console.error(`${H} ${a}`,l||"")}function n(a){console.warn(`${H} ${a}`)}function o(a,l){}return{logError:e,logWarning:n,logMessage:o}}const k=i.ref({...Q,uuid:Q.MathUtils.generateUUID()});delete k.value.Scene;let I;function ee(e,n="Tres"){const{logError:o}=B();!I&&e&&(I=e);const{createComponentInstances:a}=K(n);return{extend:m=>{if(!m){o("No objects provided to extend catalogue");return}k.value=Object.assign(k.value,m);const v=a(i.ref(m));I&&v.forEach(([t,r])=>{I._context.components[t]||I.component(t,r)})},catalogue:k}}const O=e=>typeof e<"u",ye=e=>typeof e=="function",D=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 te=["rotation","scale","position"],Se=["X","Y","Z"],Me=["color"],Le=["r","g","b"];function K(e){const{logError:n}=B();function o(t,r){O(t)&&O(r)&&Object.entries(t).forEach(([f,c])=>{const s=f.replace(/(-\w)/g,d=>d[1].toUpperCase());r.setAttribute(s,new p.BufferAttribute(...c))})}function a(t,r){O(t)&&O(r)&&Object.entries(t).forEach(([f,c])=>{const s=f.replace(/(-\w)/g,y=>y[1].toUpperCase());let d,w,g,h;if(!(s==="args"||c===void 0)){te.includes(s)&&c?c=Ce(c):te.forEach(y=>{s.startsWith(y)&&s.length===y.length+1&&(d=y,w=s.substring(y.length),Se.includes(w)||n(`There was an error setting ${f} property, ${w} is not a valid axis for ${d}`))}),Me.forEach(y=>{s.startsWith(y)&&s.length===y.length+1&&(g=y,h=s.substring(y.length).toLowerCase(),Le.includes(h)||n(`There was an error setting ${f} property , ${h} is not a valid axis for ${g}`))}),t.ref&&(t.ref=r);try{if(r[s]&&O(r[s].set))r[s].set(...D(c)?c:[c]);else if(d&&r[d])O(r[d][`set${w}`])?r[d][`set${w}`](c):O(r[`rotate${w}`])&&r[`rotate${w}`](c);else if(g&&h&&r[g]&&r[g][h])r[g][h]=c;else{if(c===""&&(c=!0),ye(r[s])){if(f==="center"&&!c)return;r[s](...D(c)?c:[c]);return}r[s]=c}}catch(y){n(`There was an error setting ${s} property`,y)}}})}function l(t){var s,d;const r=/^Symbol\(Fragment\)$/g,f=/^Symbol\(Text\)$/g,c=/^Symbol\(Comment\)$/g;if(r.test(t.type.toString()))return t.children.map(w=>l(w));if(f.test(t.type.toString())||c.test(t.type.toString()))return;{const w=t.type.name.replace(e,""),g=i.inject("catalogue");let h;if(g)if((s=t.children)!=null&&s.default){const y=t.children.default().map(U=>l(U));h=new g.value[w](...y.flat().filter(Boolean))}else(d=t==null?void 0:t.props)!=null&&d.args?g!=null&&g.value[w]?h=new g.value[w](...t.props.args):n(`There is no ${w} in the catalogue`,g==null?void 0:g.value.uuid):h=new g.value[w];return t!=null&&t.props&&(w==="BufferGeometry"?o(t.props,h):a(t.props,h)),h}}function m(t,r,f){if(f.default&&(f!=null&&f.default())){const c=f.default().map(s=>l(s));if(t.name==="Group"){const s=new t;return c.forEach(d=>{s.add(d)}),s}else return new t(...c.flat().filter(Boolean))}else return r.args?new t(...r.args):new t}function v(t){return Object.entries(t.value).filter(([r,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(([r,f])=>{const c=`${e}${r}`,s=i.defineComponent({name:c,setup(d,{slots:w,attrs:g,...h}){const{state:y}=x(),{onLoop:U}=V(),M=y.scene,T=y.raycaster;let L=m(f,g,w);if(a(g,L),L instanceof p.PerspectiveCamera||L instanceof p.OrthographicCamera){const{pushCamera:F}=G();F(L)}L.isObject3D&&(M==null||M.add(L));let b=null,P=null;if(L instanceof p.Mesh){U(()=>{if(L&&T&&(M!=null&&M.children)){const j=T.intersectObjects(M==null?void 0:M.children);j.length>0?(P=j[0],(b===null||b.object.uuid!==(P==null?void 0:P.object.uuid))&&h.emit("pointer-enter",P),h.emit("pointer-move",P)):(P=null,b!==null&&h.emit("pointer-leave",b)),b=P}});const F=u.useEventListener(window,"click",()=>{h.emit("click",b)});i.onUnmounted(()=>{F()})}return M&&L instanceof p.Fog&&(M.fog=L),h.expose(L),()=>{}}});return[c,s]})}return{createComponentInstances:v,processProps:a,createInstanceFromVNode:l}}const ne=u.createEventHook(),re=u.createEventHook(),q=u.createEventHook(),_=new p.Clock;let z=0,N=0;const{pause:be,resume:Pe,isActive:Ue}=u.useRafFn(()=>{ne.trigger({delta:z,elapsed:N,clock:_}),re.trigger({delta:z,elapsed:N,clock:_}),q.trigger({delta:z,elapsed:N,clock:_})},{immediate:!1});q.on(()=>{z=_.getDelta(),N=_.getElapsedTime()});function V(){return{onBeforeLoop:ne.on,onLoop:re.on,onAfterLoop:q.on,pause:be,resume:Pe,isActive:Ue}}const Oe=i.shallowRef(new p.Scene);function oe(){return{scene:Oe}}function ae(e){const n={nodes:{},materials:{}};return e&&e.traverse(o=>{o.name&&(n.nodes[o.name]=o),o.material&&!n.materials[o.material.name]&&(n.materials[o.material.name]=o.material)}),n}async function xe(e,n,o,a,l){const{logError:m}=B(),v=new e;l&&l(v),o&&o(v);const r=(Array.isArray(n)?n:[n]).map(f=>new Promise((c,s)=>{v.load(f,d=>{d.scene&&Object.assign(d,ae(d.scene)),c(d)},a,d=>s(m("[useLoader] - Failed to load resource",d)))}));return D(n)?await Promise.all(r):await r[0]}async function $e(e){const n=new p.LoadingManager,o=new p.TextureLoader(n),a=l=>new Promise((m,v)=>{o.load(l,t=>m(t),()=>null,()=>{v(new Error("[useTextures] - Failed to load texture"))})});if(D(e)){const l=await Promise.all(e.map(m=>a(m)));return e.length>1?l:l[0]}else{const{map:l,displacementMap:m,normalMap:v,roughnessMap:t,metalnessMap:r,aoMap:f}=e;return{map:l?await a(l):null,displacementMap:m?await a(m):null,normalMap:v?await a(v):null,roughnessMap:t?await a(t):null,metalnessMap:r?await a(r):null,aoMap:f?await a(f):null}}}const W=i.shallowReactive({camera:void 0,cameras:[],aspectRatio:i.computed(()=>window.innerWidth/window.innerHeight)});function x(){function e(o){return W[o]}function n(o,a){W[o]=a}return{state:W,...i.toRefs(W),getState:e,setState:n}}const X=i.shallowRef(new p.Raycaster),R=i.ref(new p.Vector2),ie=i.ref(null);function se(){const{setState:e}=x();e("raycaster",X.value),e("pointer",R),e("currentInstance",ie),i.provide("raycaster",X),i.provide("pointer",R),i.provide("currentInstance",ie);function n(o){R.value.x=o.clientX/window.innerWidth*2-1,R.value.y=-(o.clientY/window.innerHeight)*2+1}return window.addEventListener("pointermove",n),i.onUnmounted(()=>{window.removeEventListener("pointermove",n)}),{raycaster:X,pointer:R}}const Y={realistic:{outputEncoding:p.sRGBEncoding,toneMapping:p.ACESFilmicToneMapping,toneMappingExposure:3,shadowMap:{enabled:!0,type:p.PCFSoftShadowMap}}},ce=(e,n)=>{for(const o of Object.keys(n))n[o]instanceof Object&&Object.assign(n[o],ce(e[o],n[o]));return Object.assign(e||{},n),e},S=i.shallowRef(),J=i.ref(!1);function le(e,n,o){const{alpha:a=!0,antialias:l=!0,depth:m,logarithmicDepthBuffer:v,failIfMajorPerformanceCaveat:t,precision:r,premultipliedAlpha:f,stencil:c,shadows:s=!1,shadowMapType:d=p.PCFShadowMap,physicallyCorrectLights:w=!1,useLegacyLights:g=!1,outputEncoding:h=p.LinearEncoding,toneMapping:y=p.NoToneMapping,toneMappingExposure:U=1,context:M=void 0,powerPreference:T="default",preserveDrawingBuffer:L=!1,clearColor:b,windowSize:P=!1,preset:F=void 0}=i.toRefs(o),{setState:j}=x(),{width:ue,height:pe}=u.resolveUnref(P)?u.useWindowSize():u.useElementSize(n),{logError:Re}=B(),{pixelRatio:de}=u.useDevicePixelRatio(),{pause:Fe,resume:ke}=V(),Z=i.computed(()=>ue.value/pe.value),me=()=>{S.value&&(S.value.setSize(ue.value,pe.value),S.value.setPixelRatio(Math.min(de.value,2)))},ge=()=>{if(!S.value)return;const A=u.resolveUnref(F);if(A){A in Y||Re("Renderer Preset must be one of these: "+Object.keys(Y).join(", ")),ce(S.value,Y[A]);return}S.value.shadowMap.enabled=u.resolveUnref(s),S.value.shadowMap.type=u.resolveUnref(d),S.value.toneMapping=u.resolveUnref(y)||p.NoToneMapping,S.value.toneMappingExposure=u.resolveUnref(U),S.value.outputEncoding=u.resolveUnref(h)||p.LinearEncoding,b!=null&&b.value&&S.value.setClearColor(ve(u.resolveUnref(b))),S.value.useLegacyLights=u.resolveUnref(g)},De=()=>{const A=u.unrefElement(e);S.value||!A||(S.value=new p.WebGLRenderer({canvas:A,alpha:u.resolveUnref(a),antialias:u.resolveUnref(l),context:u.resolveUnref(M),depth:u.resolveUnref(m),failIfMajorPerformanceCaveat:u.resolveUnref(t),logarithmicDepthBuffer:u.resolveUnref(v),powerPreference:u.resolveUnref(T),precision:u.resolveUnref(r),stencil:u.resolveUnref(c),preserveDrawingBuffer:u.resolveUnref(L),premultipliedAlpha:u.resolveUnref(f)}),j("renderer",S.value),j("clock",new p.Clock),j("aspectRatio",Z),ge(),me(),ke(),J.value=!0)},ze=()=>{S.value&&(S.value.dispose(),S.value=void 0,J.value=!1,Fe())};return i.watch([Z,de],me),i.watch([s,d,h,g,y,U,b],ge),i.watch(()=>[e,n],()=>{u.unrefElement(e)&&u.unrefElement(n)&&De()},{immediate:!0,deep:!0}),{renderer:S,isReady:J,dispose:ze,aspectRatio:Z}}const{logError:fe,logWarning:je}=B(),Ae=i.defineComponent({name:"TresCanvas",props:{shadows:Boolean,shadowMapType:Number,physicallyCorrectLights:{type:Boolean,default:!1,validator:e=>(e&&je("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:n,attrs:o}){const a=i.ref(),l=i.ref(),{renderer:m,dispose:v,aspectRatio:t}=le(a,l,e);return i.provide("aspect-ratio",t),i.provide("renderer",m),n.default&&!n.default().some(r=>r.type.name==="Scene")&&fe("TresCanvas must contain a Scene component."),n.default&&!n.default().some(r=>{var f;return(f=r.type.name)==null?void 0:f.includes("Camera")})&&fe("Scene must contain a Camera component."),i.onBeforeUnmount(()=>v()),()=>{if(n.default)return i.h("div",{ref:l,style:{position:"relative",width:"100%",height:"100%",overflow:"hidden",pointerEvents:"auto",touchAction:"none",...o.style}},[i.h("div",{style:{width:"100%",height:"100%"}},[i.h("canvas",{ref:a,style:{display:"block",width:"100%",height:"100%",position:e.windowSize?"fixed":"absolute",top:0,left:0}}),n.default()])])}}}),Be=i.defineComponent({name:"Scene",setup(e,{slots:n}){const{setState:o}=x(),{scene:a}=oe(),l=i.inject("renderer"),{activeCamera:m}=G(),{raycaster:v,pointer:t}=se(),{onLoop:r}=V();return i.provide("local-scene",a),o("scene",a.value),r(()=>{m.value&&(v.value.setFromCamera(t.value,m.value),l!=null&&l.value&&m&&(a!=null&&a.value)&&l.value.render(a==null?void 0:a.value,m.value))}),()=>{if(n.default)return n.default()}}}),Ie=Symbol("UseTresState"),_e={install(e,n){const o=(n==null?void 0:n.prefix)||"Tres";e.component(`${o}Canvas`,Ae),e.component(`${o}Scene`,Be);const{catalogue:a,extend:l}=ee(e,o);e.provide("catalogue",a),e.provide("extend",l),e.provide("useTres",x());const{createComponentInstances:m}=K(o);m(a).forEach(([t,r])=>{e.component(t,r)})}};C.CameraType=E,C.UseTresStateSymbol=Ie,C.default=_e,C.trasverseObjects=ae,C.useCamera=G,C.useCatalogue=ee,C.useInstanceCreator=K,C.useLoader=xe,C.useRaycaster=se,C.useRenderLoop=V,C.useRenderer=le,C.useScene=oe,C.useTexture=$e,C.useTres=x,Object.defineProperties(C,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});
+(function(f,l){typeof exports=="object"&&typeof module<"u"?l(exports,require("vue"),require("three"),require("@vueuse/core")):typeof define=="function"&&define.amd?define(["exports","vue","three","@vueuse/core"],l):(f=typeof globalThis<"u"?globalThis:f||self,l(f.tres={},f.Vue,f.Three,f.VueUseCore))})(this,function(f,l,c,i){"use strict";function ie(e){const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const a in e)if(a!=="default"){const o=Object.getOwnPropertyDescriptor(e,a);Object.defineProperty(t,a,o.get?o:{enumerable:!0,get:()=>e[a]})}}return t.default=e,Object.freeze(t)}const $=ie(c),U=l.ref({uuid:c.MathUtils.generateUUID()}),z=e=>void Object.assign(U.value,e);var J=(e=>(e.Perspective="Perspective",e.Orthographic="Orthographic",e))(J||{});const ue=45;let C;function R(){const{state:e,setState:t,aspectRatio:a}=M();function o(r="Perspective",u){var m,v,g;if(r==="Perspective"){const{near:w,far:b,fov:h}=u||{near:.1,far:1e3,fov:ue};C=new c.PerspectiveCamera(h,((m=e.aspectRatio)==null?void 0:m.value)||window.innerWidth/window.innerHeight,w,b),(v=e.cameras)==null||v.push(C)}else{const{left:w,right:b,top:h,bottom:y,near:D,far:F}=u||{left:-100,right:100,top:100,bottom:-100,near:.1,far:1e3};C=new c.OrthographicCamera(w,b,h,y,D,F),(g=e.cameras)==null||g.push(C)}return e.camera=C,t("camera",e.camera),C}function n(){var r;e.camera instanceof c.PerspectiveCamera&&e.aspectRatio&&(e.camera.aspect=e.aspectRatio.value),(r=e.camera)==null||r.updateProjectionMatrix()}function s(r){var u;(u=e.cameras)==null||u.push(r),r instanceof c.PerspectiveCamera&&e.aspectRatio&&(r.aspect=e.aspectRatio.value),r.updateProjectionMatrix(),t("camera",r)}function p(){e.cameras=[]}return l.watchEffect(()=>{a!=null&&a.value&&n()}),{activeCamera:l.toRef(e,"camera"),createCamera:o,updateCamera:n,pushCamera:s,clearCameras:p}}const K=i.createEventHook(),X=i.createEventHook(),W=i.createEventHook(),P=new c.Clock;let k=0,j=0;const{pause:le,resume:ce,isActive:fe}=i.useRafFn(()=>{K.trigger({delta:k,elapsed:j,clock:P}),X.trigger({delta:k,elapsed:j,clock:P}),W.trigger({delta:k,elapsed:j,clock:P})},{immediate:!1});W.on(()=>{k=P.getDelta(),j=P.getElapsedTime()});function x(){return{onBeforeLoop:K.on,onLoop:X.on,onAfterLoop:W.on,pause:le,resume:ce,isActive:fe}}function pe(e){return e instanceof c.Color?e:Array.isArray(e)?new c.Color(...e):new c.Color(e)}const B={realistic:{outputEncoding:c.sRGBEncoding,toneMapping:c.ACESFilmicToneMapping,toneMappingExposure:3,shadowMap:{enabled:!0,type:c.PCFSoftShadowMap}}},Y=(e,t)=>{for(const a of Object.keys(t))t[a]instanceof Object&&Object.assign(t[a],Y(e[a],t[a]));return Object.assign(e||{},t),e},de=me("html,body,base,head,link,meta,style,title,address,article,aside,footer,header,hgroup,h1,h2,h3,h4,h5,h6,nav,section,div,dd,dl,dt,figcaption,figure,picture,hr,img,li,main,ol,p,pre,ul,a,b,abbr,bdi,bdo,br,cite,code,data,dfn,em,i,kbd,mark,q,rp,rt,ruby,s,samp,small,span,strong,sub,sup,time,u,var,wbr,area,audio,map,track,video,embed,object,param,source,canvas,script,noscript,del,ins,caption,col,colgroup,table,thead,tbody,td,th,tr,button,datalist,fieldset,form,input,label,legend,meter,optgroup,option,output,progress,select,textarea,details,dialog,menu,summary,template,blockquote,iframe,tfoot");function I(e){return e.replace(/-([a-z])/g,(t,a)=>a.toUpperCase())}function me(e,t){const a=Object.create(null),o=e.split(",");for(let n=0;n<o.length;n++)a[o[n]]=!0;return t?n=>!!a[n.toLowerCase()]:n=>!!a[n]}const d=l.shallowRef(),V=l.ref(!1);function Q(e,t,a){const{alpha:o=!0,antialias:n=!0,depth:s,logarithmicDepthBuffer:p,failIfMajorPerformanceCaveat:r,precision:u,premultipliedAlpha:m,stencil:v,shadows:g=!1,shadowMapType:w=c.PCFShadowMap,physicallyCorrectLights:b=!1,useLegacyLights:h=!1,outputEncoding:y=c.LinearEncoding,toneMapping:D=c.NoToneMapping,toneMappingExposure:F=1,context:Oe=void 0,powerPreference:Ue="default",preserveDrawingBuffer:ke=!1,clearColor:O,windowSize:je=!1,preset:xe=void 0}=l.toRefs(a),{setState:G}=M(),{width:ne,height:ae}=i.resolveUnref(je)?i.useWindowSize():i.useElementSize(t),{logError:Ae}=S(),{pixelRatio:re}=i.useDevicePixelRatio(),{pause:_e,resume:Te}=x(),N=l.computed(()=>ne.value/ae.value),oe=()=>{d.value&&(d.value.setSize(ne.value,ae.value),d.value.setPixelRatio(Math.min(re.value,2)))},se=()=>{if(!d.value)return;const L=i.resolveUnref(xe);if(L){L in B||Ae("Renderer Preset must be one of these: "+Object.keys(B).join(", ")),Y(d.value,B[L]);return}d.value.shadowMap.enabled=i.resolveUnref(g),d.value.shadowMap.type=i.resolveUnref(w),d.value.toneMapping=i.resolveUnref(D)||c.NoToneMapping,d.value.toneMappingExposure=i.resolveUnref(F),d.value.outputEncoding=i.resolveUnref(y)||c.LinearEncoding,O!=null&&O.value&&d.value.setClearColor(pe(i.resolveUnref(O))),d.value.useLegacyLights=i.resolveUnref(h)},De=()=>{const L=i.unrefElement(e);L&&(d.value=new c.WebGLRenderer({canvas:L,alpha:i.resolveUnref(o),antialias:i.resolveUnref(n),context:i.resolveUnref(Oe),depth:i.resolveUnref(s),failIfMajorPerformanceCaveat:i.resolveUnref(r),logarithmicDepthBuffer:i.resolveUnref(p),powerPreference:i.resolveUnref(Ue),precision:i.resolveUnref(u),stencil:i.resolveUnref(v),preserveDrawingBuffer:i.resolveUnref(ke),premultipliedAlpha:i.resolveUnref(m)}),G("renderer",d.value),G("clock",new c.Clock),G("aspectRatio",N),se(),oe(),Te(),V.value=!0)},Fe=()=>{d.value&&(d.value.dispose(),d.value=void 0,V.value=!1,_e())};return l.watch([N,re],oe),l.watch([g,w,y,h,D,F,O],se),l.watch(()=>[e,t],()=>{i.unrefElement(e)&&i.unrefElement(t)&&De()},{immediate:!0,deep:!0}),{renderer:d,isReady:V,dispose:Fe,aspectRatio:N}}const Z=e=>!!e&&e.constructor===Array;function E(e){const t={nodes:{},materials:{}};return e&&e.traverse(a=>{a.name&&(t.nodes[a.name]=a),a.material&&!t.materials[a.material.name]&&(t.materials[a.material.name]=a.material)}),t}async function ve(e,t,a,o,n){const{logError:s}=S(),p=new e;n&&n(p),a&&a(p);const u=(Array.isArray(t)?t:[t]).map(m=>new Promise((v,g)=>{p.load(m,w=>{w.scene&&Object.assign(w,E(w.scene)),v(w)},o,w=>g(s("[useLoader] - Failed to load resource",w)))}));return Z(t)?await Promise.all(u):await u[0]}async function ge(e){const t=new c.LoadingManager,a=new c.TextureLoader(t),o=n=>new Promise((s,p)=>{a.load(n,r=>s(r),()=>null,()=>{p(new Error("[useTextures] - Failed to load texture"))})});if(Z(e)){const n=await Promise.all(e.map(s=>o(s)));return e.length>1?n:n[0]}else{const{map:n,displacementMap:s,normalMap:p,roughnessMap:r,metalnessMap:u,aoMap:m}=e;return{map:n?await o(n):null,displacementMap:s?await o(s):null,normalMap:p?await o(p):null,roughnessMap:r?await o(r):null,metalnessMap:u?await o(u):null,aoMap:m?await o(m):null}}}const A=l.shallowReactive({camera:void 0,cameras:[],aspectRatio:l.computed(()=>window.innerWidth/window.innerHeight)});function M(){function e(a){return A[a]}function t(a,o){A[a]=o}return{state:A,...l.toRefs(A),getState:e,setState:t}}const H=l.shallowRef(new c.Raycaster),_=l.ref(new c.Vector2),we=l.ref(null);function q(){const{setState:e}=M();e("raycaster",H.value),e("pointer",_),e("currentInstance",we);function t(a){_.value.x=a.clientX/window.innerWidth*2-1,_.value.y=-(a.clientY/window.innerHeight)*2+1}return window.addEventListener("pointermove",t),{raycaster:H,pointer:_}}const he=!0,ee="[TresJS ▲ ■ ●] ";function S(){function e(o,n){console.error(`${ee} ${o}`,n||"")}function t(o){console.warn(`${ee} ${o}`)}function a(o,n){}return{logError:e,logWarning:t,logMessage:a}}const{logWarning:ye}=S();function Ce(e){for(const t in e)if(t.indexOf("on")===0)return!0;return!1}function Re(e){}let T=null;const Me={createElement(e,t,a,o){if(e==="template"||de(e))return null;let n;if(o===null&&(o={}),o!=null&&o.args?n=new U.value[e.replace("Tres","")](...o.args):n=new U.value[e.replace("Tres","")],n.isCamera){(!(o!=null&&o.position)||o!=null&&o.position.every(p=>p==0))&&ye("Camera is positioned at the center of the scene [0,0,0], if this is not intentional try setting a position if your scene seems empty 🤗");const{pushCamera:s}=R();s(n)}return(o==null?void 0:o.attach)===void 0&&(n.isMaterial?n.attach="material":n.isBufferGeometry&&(n.attach="geometry")),n},insert(e,t,a){if(T===null&&t.isScene&&(T=t),t===null&&(t=T),t!=null&&t.isObject3D&&(e!=null&&e.isObject3D)){const r=a?t.children.indexOf(a):0;e.parent=t,t.children.splice(r,0,e),e.dispatchEvent({type:"added"})}else typeof(e==null?void 0:e.attach)=="string"&&(e.__previousAttach=e[t==null?void 0:t.attach],t&&(t[e.attach]=e));const{onLoop:o}=x();let n=null,s=null;const{raycaster:p}=q();e&&e instanceof c.Mesh&&Ce(e)&&(o(()=>{var r,u,m;if(t!=null&&t.children&&e&&p){const v=p.value.intersectObjects(t.children);v.length>0&&v[0].object.uuid===e.uuid?(s=v[0],(n===null||n.object.uuid!==(s==null?void 0:s.object.uuid))&&((r=e.onPointerEnter)==null||r.call(e,s)),(u=e.onPointerMove)==null||u.call(e,s)):(s=null,n!==null&&((m=e.onPointerLeave)==null||m.call(e,n))),n=s}}),i.useEventListener(window,"click",()=>{var r;s!==null&&((r=e.onClick)==null||r.call(e,s))}))},remove(e){if(!e)return;const t=e.parentNode;t&&t.removeChild(e)},patchProp(e,t,a,o){if(e){let n=e,s=t;const p=I(s);let r=n==null?void 0:n[p];if(e.parent||(e.parent=T),s.includes("-")&&r===void 0){const m=s.split("-");r=m.reduce((v,g)=>v[I(g)],n),s=m.pop(),r!=null&&r.set||(n=m.reduce((v,g)=>v[I(g)],n))}let u=o;if(u===""&&(u=!0),i.isFunction(r))return;!(r!=null&&r.set)&&!i.isFunction(r)?n[p]=u:r.constructor===u.constructor&&(r!=null&&r.copy)?r==null||r.copy(u):Array.isArray(u)?r.set(...u):!r.isColor&&r.setScalar?r.setScalar(u):r.set(u)}},parentNode(e){return(e==null?void 0:e.parent)||null},createText:()=>void 0,createComment:()=>void 0,setText:()=>void 0,setElementText:()=>void 0,nextSibling:()=>void 0,querySelector:()=>void 0,setScopeId:()=>void 0,cloneNode:()=>void 0,insertStaticContent:()=>void 0},{createApp:be}=l.createRenderer(Me),Le=e=>{const t=be(a);function a(){return e&&e.default?e.default():[]}return t};z($);const{logWarning:Pe}=S(),te=l.defineComponent({name:"TresCanvas",props:["shadows","shadowMapType","physicallyCorrectLights","useLegacyLights","outputEncoding","toneMapping","toneMappingExposure","context","powerPreference","preserveDrawingBuffer","clearColor","windowSize","preset"],setup(e,{slots:t,expose:a}){e.physicallyCorrectLights===!0&&Pe("physicallyCorrectLights is deprecated, useLegacyLights is now false by default");const o=l.ref(),n=l.ref(),s=new $.Scene,{setState:p}=M();p("scene",s);function r(){const{renderer:v}=Q(n,o,e),{activeCamera:g}=R(),{onLoop:w}=x(),{raycaster:b,pointer:h}=q();w(()=>{var y;g.value&&(b.value.setFromCamera(h.value,g.value),(y=v.value)==null||y.render(s,g.value))})}l.watch(n,r);let u;function m(){u=Le(t),u.provide("useTres",M()),u.provide("extend",z),u.mount(s)}return m(),a({scene:s}),()=>l.h(l.h("div",{ref:o,style:{position:"relative",width:"100%",height:"100%",pointerEvents:"auto",touchAction:"none"}},[l.h("div",{style:{width:"100%",height:"100%"}},[l.h("canvas",{ref:n,style:{display:"block",width:"100%",height:"100%",position:e.windowSize?"fixed":"absolute",top:0,left:0}})])]))}}),Se={install(e){e.component("TresCanvas",te)}};f.CameraType=J,f.TresCanvas=te,f.catalogue=U,f.default=Se,f.extend=z,f.isProd=he,f.trasverseObjects=E,f.useCamera=R,f.useLoader=ve,f.useLogger=S,f.useRaycaster=q,f.useRenderLoop=x,f.useRenderer=Q,f.useTexture=ge,f.useTres=M,Object.defineProperties(f,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});

package/dist/types/index.d.ts

@@ -1,8 +1,42 @@
+import './tres-components';
 import { Color, Intersection, Object3D, Vector2, Vector3, Event } from 'three';
 import { VNode, VNodeTypes } from 'vue';
 export type TresInstance = Object3D<Event> & {
     [key: string]: any;
 };
+export type TresObject = {
+    /**
+     * A Vector3 | Array | scalar representing the object's local position. Default is (0, 0, 0).
+     *
+     * @type {TresVectorProp}
+     */
+    position?: TresVectorProp;
+    /**
+     * A Vector3 | Array | scalar representing the object's local rotation. Default is (0, 0, 0).
+     *
+     * @type {TresVectorProp}
+     */
+    rotation?: TresVectorProp;
+    /**
+     * A Vector3 | Array | scalar representing the object's local scale. Default is (0, 0, 0).
+     *
+     * @type {TresVectorProp}
+     */
+    scale?: TresVectorProp;
+    /**
+     * Color of the material, by default set to white (0xffffff).
+     *
+     * @type {TresColor}
+     */
+    color?: TresColor;
+    opacity?: number;
+    visible?: boolean;
+    attach: string;
+    parent: TresObject | null;
+    dispose?: () => void;
+    __previousAttach?: string;
+    [key: string]: any;
+};
 export type TresCatalogue = Record<string, any>;
 export type TresVNodeType = VNodeTypes & {
     name?: string | Array<string>;
@@ -18,6 +52,7 @@ export type TresVNode = VNode & {
 export type TresAttributes = Record<string, any> & {
     args?: number[];
 };
+export type TresVectorProp = Vector2 | Vector3 | number[] | number;
 export type TresColor = string | number | Color | number[];
 export interface TresEvent extends Intersection<Object3D<Event>> {
     object: Object3D;

package/dist/types/tres-components.d.ts

@@ -0,0 +1,270 @@
+
+      import type { DefineComponent } from 'vue'
+      import type { Vector2, Vector3, Color } from 'three'
+      export type TresVectorProp = Vector2 | Vector3 | number[] | number
+      export type TresColor = string | number | Color | number[]
+      import type {
+        Mesh,
+        AmbientLight,
+ArrayCamera,
+ArrowHelper,
+AxesHelper,
+Box3Helper,
+BoxBufferGeometry,
+BoxGeometry,
+BoxHelper,
+BufferGeometry,
+Camera,
+CameraHelper,
+CapsuleBufferGeometry,
+CapsuleGeometry,
+CircleBufferGeometry,
+CircleGeometry,
+ConeBufferGeometry,
+ConeGeometry,
+CubeCamera,
+CylinderBufferGeometry,
+CylinderGeometry,
+DirectionalLight,
+DirectionalLightHelper,
+DodecahedronBufferGeometry,
+DodecahedronGeometry,
+EdgesGeometry,
+ExtrudeBufferGeometry,
+ExtrudeGeometry,
+GridHelper,
+HemisphereLight,
+HemisphereLightHelper,
+IcosahedronBufferGeometry,
+IcosahedronGeometry,
+InstancedBufferGeometry,
+LatheBufferGeometry,
+LatheGeometry,
+Light,
+LineBasicMaterial,
+LineDashedMaterial,
+Material,
+MeshBasicMaterial,
+MeshDepthMaterial,
+MeshDistanceMaterial,
+MeshLambertMaterial,
+MeshMatcapMaterial,
+MeshNormalMaterial,
+MeshPhongMaterial,
+MeshPhysicalMaterial,
+MeshStandardMaterial,
+MeshToonMaterial,
+OctahedronBufferGeometry,
+OctahedronGeometry,
+OrthographicCamera,
+PerspectiveCamera,
+PlaneBufferGeometry,
+PlaneGeometry,
+PlaneHelper,
+PointLight,
+PointLightHelper,
+PointsMaterial,
+PolarGridHelper,
+PolyhedronBufferGeometry,
+PolyhedronGeometry,
+RawShaderMaterial,
+RectAreaLight,
+RingBufferGeometry,
+RingGeometry,
+ShaderMaterial,
+ShadowMaterial,
+ShapeBufferGeometry,
+ShapeGeometry,
+SkeletonHelper,
+SphereBufferGeometry,
+SphereGeometry,
+SpotLight,
+SpotLightHelper,
+SpriteMaterial,
+StereoCamera,
+TetrahedronBufferGeometry,
+TetrahedronGeometry,
+TorusBufferGeometry,
+TorusGeometry,
+TorusKnotBufferGeometry,
+TorusKnotGeometry,
+TubeBufferGeometry,
+TubeGeometry,
+WireframeGeometry
+      } from 'three';
+
+      type OverwrittenProps = 'position' | 'rotation' | 'scale' | 'color'
+
+      type TresModifiedObject = {
+        /**
+         * A Vector3 | Array | scalar representing the object's local position. Default is (0, 0, 0).
+         *
+         * @type {TresVectorProp}
+         */
+        position: TresVectorProp
+        /**
+         * A Vector3 | Array | scalar representing the object's local rotation. Default is (0, 0, 0).
+         *
+         * @type {TresVectorProp}
+         */
+        rotation: TresVectorProp
+        /**
+         * A Vector3 | Array | scalar representing the object's local scale. Default is (0, 0, 0).
+         *
+         * @type {TresVectorProp}
+         */
+        scale: TresVectorProp
+        /**
+         * Color of the material, by default set to white (0xffffff).
+         *
+         * @type {TresColor}
+         */
+        color: TresColor,
+        /**
+         * Arguments of the THREE instance, by default set to empty array.
+         *
+         * @type {any[]}
+         * 
+         * @example
+         * 
+         * ```html
+         * <TresBoxGeometry args="[1, 3, 4]" /> // BoxGeometry(1, 3, 4)
+         * ```
+         */
+        args?: any[],
+      }
+      
+      declare module 'vue' {
+        export interface GlobalComponents {
+          TresMesh: DefineComponent<Partial<Omit<Mesh, OverwrittenProps> & TresModifiedObject>>
+      TresBoxBufferGeometry: DefineComponent<Partial<Omit<BoxBufferGeometry['parameters'], OverwrittenProps> & TresModifiedObject>>
+TresBoxGeometry: DefineComponent<Partial<Omit<BoxGeometry['parameters'], OverwrittenProps> & TresModifiedObject>>
+TresBufferGeometry: DefineComponent<Partial<Omit<BufferGeometry['parameters'], OverwrittenProps> & TresModifiedObject>>
+TresCapsuleBufferGeometry: DefineComponent<Partial<Omit<CapsuleBufferGeometry['parameters'], OverwrittenProps> & TresModifiedObject>>
+TresCapsuleGeometry: DefineComponent<Partial<Omit<CapsuleGeometry['parameters'], OverwrittenProps> & TresModifiedObject>>
+TresCircleBufferGeometry: DefineComponent<Partial<Omit<CircleBufferGeometry['parameters'], OverwrittenProps> & TresModifiedObject>>
+TresCircleGeometry: DefineComponent<Partial<Omit<CircleGeometry['parameters'], OverwrittenProps> & TresModifiedObject>>
+TresConeBufferGeometry: DefineComponent<Partial<Omit<ConeBufferGeometry['parameters'], OverwrittenProps> & TresModifiedObject>>
+TresConeGeometry: DefineComponent<Partial<Omit<ConeGeometry['parameters'], OverwrittenProps> & TresModifiedObject>>
+TresCylinderBufferGeometry: DefineComponent<Partial<Omit<CylinderBufferGeometry['parameters'], OverwrittenProps> & TresModifiedObject>>
+TresCylinderGeometry: DefineComponent<Partial<Omit<CylinderGeometry['parameters'], OverwrittenProps> & TresModifiedObject>>
+TresDodecahedronBufferGeometry: DefineComponent<Partial<Omit<DodecahedronBufferGeometry['parameters'], OverwrittenProps> & TresModifiedObject>>
+TresDodecahedronGeometry: DefineComponent<Partial<Omit<DodecahedronGeometry['parameters'], OverwrittenProps> & TresModifiedObject>>
+TresEdgesGeometry: DefineComponent<Partial<Omit<EdgesGeometry['parameters'], OverwrittenProps> & TresModifiedObject>>
+TresExtrudeBufferGeometry: DefineComponent<Partial<Omit<ExtrudeBufferGeometry['parameters'], OverwrittenProps> & TresModifiedObject>>
+TresExtrudeGeometry: DefineComponent<Partial<Omit<ExtrudeGeometry['parameters'], OverwrittenProps> & TresModifiedObject>>
+TresIcosahedronBufferGeometry: DefineComponent<Partial<Omit<IcosahedronBufferGeometry['parameters'], OverwrittenProps> & TresModifiedObject>>
+TresIcosahedronGeometry: DefineComponent<Partial<Omit<IcosahedronGeometry['parameters'], OverwrittenProps> & TresModifiedObject>>
+TresInstancedBufferGeometry: DefineComponent<Partial<Omit<InstancedBufferGeometry['parameters'], OverwrittenProps> & TresModifiedObject>>
+TresLatheBufferGeometry: DefineComponent<Partial<Omit<LatheBufferGeometry['parameters'], OverwrittenProps> & TresModifiedObject>>
+TresLatheGeometry: DefineComponent<Partial<Omit<LatheGeometry['parameters'], OverwrittenProps> & TresModifiedObject>>
+TresOctahedronBufferGeometry: DefineComponent<Partial<Omit<OctahedronBufferGeometry['parameters'], OverwrittenProps> & TresModifiedObject>>
+TresOctahedronGeometry: DefineComponent<Partial<Omit<OctahedronGeometry['parameters'], OverwrittenProps> & TresModifiedObject>>
+TresPlaneBufferGeometry: DefineComponent<Partial<Omit<PlaneBufferGeometry['parameters'], OverwrittenProps> & TresModifiedObject>>
+TresPlaneGeometry: DefineComponent<Partial<Omit<PlaneGeometry['parameters'], OverwrittenProps> & TresModifiedObject>>
+TresPolyhedronBufferGeometry: DefineComponent<Partial<Omit<PolyhedronBufferGeometry['parameters'], OverwrittenProps> & TresModifiedObject>>
+TresPolyhedronGeometry: DefineComponent<Partial<Omit<PolyhedronGeometry['parameters'], OverwrittenProps> & TresModifiedObject>>
+TresRingBufferGeometry: DefineComponent<Partial<Omit<RingBufferGeometry['parameters'], OverwrittenProps> & TresModifiedObject>>
+TresRingGeometry: DefineComponent<Partial<Omit<RingGeometry['parameters'], OverwrittenProps> & TresModifiedObject>>
+TresShapeBufferGeometry: DefineComponent<Partial<Omit<ShapeBufferGeometry['parameters'], OverwrittenProps> & TresModifiedObject>>
+TresShapeGeometry: DefineComponent<Partial<Omit<ShapeGeometry['parameters'], OverwrittenProps> & TresModifiedObject>>
+TresSphereBufferGeometry: DefineComponent<Partial<Omit<SphereBufferGeometry['parameters'], OverwrittenProps> & TresModifiedObject>>
+TresSphereGeometry: DefineComponent<Partial<Omit<SphereGeometry['parameters'], OverwrittenProps> & TresModifiedObject>>
+TresTetrahedronBufferGeometry: DefineComponent<Partial<Omit<TetrahedronBufferGeometry['parameters'], OverwrittenProps> & TresModifiedObject>>
+TresTetrahedronGeometry: DefineComponent<Partial<Omit<TetrahedronGeometry['parameters'], OverwrittenProps> & TresModifiedObject>>
+TresTorusBufferGeometry: DefineComponent<Partial<Omit<TorusBufferGeometry['parameters'], OverwrittenProps> & TresModifiedObject>>
+TresTorusGeometry: DefineComponent<Partial<Omit<TorusGeometry['parameters'], OverwrittenProps> & TresModifiedObject>>
+TresTorusKnotBufferGeometry: DefineComponent<Partial<Omit<TorusKnotBufferGeometry['parameters'], OverwrittenProps> & TresModifiedObject>>
+TresTorusKnotGeometry: DefineComponent<Partial<Omit<TorusKnotGeometry['parameters'], OverwrittenProps> & TresModifiedObject>>
+TresTubeBufferGeometry: DefineComponent<Partial<Omit<TubeBufferGeometry['parameters'], OverwrittenProps> & TresModifiedObject>>
+TresTubeGeometry: DefineComponent<Partial<Omit<TubeGeometry['parameters'], OverwrittenProps> & TresModifiedObject>>
+TresWireframeGeometry: DefineComponent<Partial<Omit<WireframeGeometry['parameters'], OverwrittenProps> & TresModifiedObject>>
+        TresAmbientLight: DefineComponent<Partial<Omit<AmbientLight, OverwrittenProps > & TresModifiedObject>>
+TresArrayCamera: DefineComponent<Partial<Omit<ArrayCamera, OverwrittenProps > & TresModifiedObject>>
+TresArrowHelper: DefineComponent<Partial<Omit<ArrowHelper, OverwrittenProps > & TresModifiedObject>>
+TresAxesHelper: DefineComponent<Partial<Omit<AxesHelper, OverwrittenProps > & TresModifiedObject>>
+TresBox3Helper: DefineComponent<Partial<Omit<Box3Helper, OverwrittenProps > & TresModifiedObject>>
+TresBoxBufferGeometry: DefineComponent<Partial<Omit<BoxBufferGeometry, OverwrittenProps > & TresModifiedObject>>
+TresBoxGeometry: DefineComponent<Partial<Omit<BoxGeometry, OverwrittenProps > & TresModifiedObject>>
+TresBoxHelper: DefineComponent<Partial<Omit<BoxHelper, OverwrittenProps > & TresModifiedObject>>
+TresBufferGeometry: DefineComponent<Partial<Omit<BufferGeometry, OverwrittenProps > & TresModifiedObject>>
+TresCamera: DefineComponent<Partial<Omit<Camera, OverwrittenProps > & TresModifiedObject>>
+TresCameraHelper: DefineComponent<Partial<Omit<CameraHelper, OverwrittenProps > & TresModifiedObject>>
+TresCapsuleBufferGeometry: DefineComponent<Partial<Omit<CapsuleBufferGeometry, OverwrittenProps > & TresModifiedObject>>
+TresCapsuleGeometry: DefineComponent<Partial<Omit<CapsuleGeometry, OverwrittenProps > & TresModifiedObject>>
+TresCircleBufferGeometry: DefineComponent<Partial<Omit<CircleBufferGeometry, OverwrittenProps > & TresModifiedObject>>
+TresCircleGeometry: DefineComponent<Partial<Omit<CircleGeometry, OverwrittenProps > & TresModifiedObject>>
+TresConeBufferGeometry: DefineComponent<Partial<Omit<ConeBufferGeometry, OverwrittenProps > & TresModifiedObject>>
+TresConeGeometry: DefineComponent<Partial<Omit<ConeGeometry, OverwrittenProps > & TresModifiedObject>>
+TresCubeCamera: DefineComponent<Partial<Omit<CubeCamera, OverwrittenProps > & TresModifiedObject>>
+TresCylinderBufferGeometry: DefineComponent<Partial<Omit<CylinderBufferGeometry, OverwrittenProps > & TresModifiedObject>>
+TresCylinderGeometry: DefineComponent<Partial<Omit<CylinderGeometry, OverwrittenProps > & TresModifiedObject>>
+TresDirectionalLight: DefineComponent<Partial<Omit<DirectionalLight, OverwrittenProps > & TresModifiedObject>>
+TresDirectionalLightHelper: DefineComponent<Partial<Omit<DirectionalLightHelper, OverwrittenProps > & TresModifiedObject>>
+TresDodecahedronBufferGeometry: DefineComponent<Partial<Omit<DodecahedronBufferGeometry, OverwrittenProps > & TresModifiedObject>>
+TresDodecahedronGeometry: DefineComponent<Partial<Omit<DodecahedronGeometry, OverwrittenProps > & TresModifiedObject>>
+TresEdgesGeometry: DefineComponent<Partial<Omit<EdgesGeometry, OverwrittenProps > & TresModifiedObject>>
+TresExtrudeBufferGeometry: DefineComponent<Partial<Omit<ExtrudeBufferGeometry, OverwrittenProps > & TresModifiedObject>>
+TresExtrudeGeometry: DefineComponent<Partial<Omit<ExtrudeGeometry, OverwrittenProps > & TresModifiedObject>>
+TresGridHelper: DefineComponent<Partial<Omit<GridHelper, OverwrittenProps > & TresModifiedObject>>
+TresHemisphereLight: DefineComponent<Partial<Omit<HemisphereLight, OverwrittenProps > & TresModifiedObject>>
+TresHemisphereLightHelper: DefineComponent<Partial<Omit<HemisphereLightHelper, OverwrittenProps > & TresModifiedObject>>
+TresIcosahedronBufferGeometry: DefineComponent<Partial<Omit<IcosahedronBufferGeometry, OverwrittenProps > & TresModifiedObject>>
+TresIcosahedronGeometry: DefineComponent<Partial<Omit<IcosahedronGeometry, OverwrittenProps > & TresModifiedObject>>
+TresInstancedBufferGeometry: DefineComponent<Partial<Omit<InstancedBufferGeometry, OverwrittenProps > & TresModifiedObject>>
+TresLatheBufferGeometry: DefineComponent<Partial<Omit<LatheBufferGeometry, OverwrittenProps > & TresModifiedObject>>
+TresLatheGeometry: DefineComponent<Partial<Omit<LatheGeometry, OverwrittenProps > & TresModifiedObject>>
+TresLight: DefineComponent<Partial<Omit<Light, OverwrittenProps > & TresModifiedObject>>
+TresLineBasicMaterial: DefineComponent<Partial<Omit<LineBasicMaterial, OverwrittenProps > & TresModifiedObject>>
+TresLineDashedMaterial: DefineComponent<Partial<Omit<LineDashedMaterial, OverwrittenProps > & TresModifiedObject>>
+TresMaterial: DefineComponent<Partial<Omit<Material, OverwrittenProps > & TresModifiedObject>>
+TresMeshBasicMaterial: DefineComponent<Partial<Omit<MeshBasicMaterial, OverwrittenProps > & TresModifiedObject>>
+TresMeshDepthMaterial: DefineComponent<Partial<Omit<MeshDepthMaterial, OverwrittenProps > & TresModifiedObject>>
+TresMeshDistanceMaterial: DefineComponent<Partial<Omit<MeshDistanceMaterial, OverwrittenProps > & TresModifiedObject>>
+TresMeshLambertMaterial: DefineComponent<Partial<Omit<MeshLambertMaterial, OverwrittenProps > & TresModifiedObject>>
+TresMeshMatcapMaterial: DefineComponent<Partial<Omit<MeshMatcapMaterial, OverwrittenProps > & TresModifiedObject>>
+TresMeshNormalMaterial: DefineComponent<Partial<Omit<MeshNormalMaterial, OverwrittenProps > & TresModifiedObject>>
+TresMeshPhongMaterial: DefineComponent<Partial<Omit<MeshPhongMaterial, OverwrittenProps > & TresModifiedObject>>
+TresMeshPhysicalMaterial: DefineComponent<Partial<Omit<MeshPhysicalMaterial, OverwrittenProps > & TresModifiedObject>>
+TresMeshStandardMaterial: DefineComponent<Partial<Omit<MeshStandardMaterial, OverwrittenProps > & TresModifiedObject>>
+TresMeshToonMaterial: DefineComponent<Partial<Omit<MeshToonMaterial, OverwrittenProps > & TresModifiedObject>>
+TresOctahedronBufferGeometry: DefineComponent<Partial<Omit<OctahedronBufferGeometry, OverwrittenProps > & TresModifiedObject>>
+TresOctahedronGeometry: DefineComponent<Partial<Omit<OctahedronGeometry, OverwrittenProps > & TresModifiedObject>>
+TresOrthographicCamera: DefineComponent<Partial<Omit<OrthographicCamera, OverwrittenProps > & TresModifiedObject>>
+TresPerspectiveCamera: DefineComponent<Partial<Omit<PerspectiveCamera, OverwrittenProps > & TresModifiedObject>>
+TresPlaneBufferGeometry: DefineComponent<Partial<Omit<PlaneBufferGeometry, OverwrittenProps > & TresModifiedObject>>
+TresPlaneGeometry: DefineComponent<Partial<Omit<PlaneGeometry, OverwrittenProps > & TresModifiedObject>>
+TresPlaneHelper: DefineComponent<Partial<Omit<PlaneHelper, OverwrittenProps > & TresModifiedObject>>
+TresPointLight: DefineComponent<Partial<Omit<PointLight, OverwrittenProps > & TresModifiedObject>>
+TresPointLightHelper: DefineComponent<Partial<Omit<PointLightHelper, OverwrittenProps > & TresModifiedObject>>
+TresPointsMaterial: DefineComponent<Partial<Omit<PointsMaterial, OverwrittenProps > & TresModifiedObject>>
+TresPolarGridHelper: DefineComponent<Partial<Omit<PolarGridHelper, OverwrittenProps > & TresModifiedObject>>
+TresPolyhedronBufferGeometry: DefineComponent<Partial<Omit<PolyhedronBufferGeometry, OverwrittenProps > & TresModifiedObject>>
+TresPolyhedronGeometry: DefineComponent<Partial<Omit<PolyhedronGeometry, OverwrittenProps > & TresModifiedObject>>
+TresRawShaderMaterial: DefineComponent<Partial<Omit<RawShaderMaterial, OverwrittenProps > & TresModifiedObject>>
+TresRectAreaLight: DefineComponent<Partial<Omit<RectAreaLight, OverwrittenProps > & TresModifiedObject>>
+TresRingBufferGeometry: DefineComponent<Partial<Omit<RingBufferGeometry, OverwrittenProps > & TresModifiedObject>>
+TresRingGeometry: DefineComponent<Partial<Omit<RingGeometry, OverwrittenProps > & TresModifiedObject>>
+TresShaderMaterial: DefineComponent<Partial<Omit<ShaderMaterial, OverwrittenProps > & TresModifiedObject>>
+TresShadowMaterial: DefineComponent<Partial<Omit<ShadowMaterial, OverwrittenProps > & TresModifiedObject>>
+TresShapeBufferGeometry: DefineComponent<Partial<Omit<ShapeBufferGeometry, OverwrittenProps > & TresModifiedObject>>
+TresShapeGeometry: DefineComponent<Partial<Omit<ShapeGeometry, OverwrittenProps > & TresModifiedObject>>
+TresSkeletonHelper: DefineComponent<Partial<Omit<SkeletonHelper, OverwrittenProps > & TresModifiedObject>>
+TresSphereBufferGeometry: DefineComponent<Partial<Omit<SphereBufferGeometry, OverwrittenProps > & TresModifiedObject>>
+TresSphereGeometry: DefineComponent<Partial<Omit<SphereGeometry, OverwrittenProps > & TresModifiedObject>>
+TresSpotLight: DefineComponent<Partial<Omit<SpotLight, OverwrittenProps > & TresModifiedObject>>
+TresSpotLightHelper: DefineComponent<Partial<Omit<SpotLightHelper, OverwrittenProps > & TresModifiedObject>>
+TresSpriteMaterial: DefineComponent<Partial<Omit<SpriteMaterial, OverwrittenProps > & TresModifiedObject>>
+TresStereoCamera: DefineComponent<Partial<Omit<StereoCamera, OverwrittenProps > & TresModifiedObject>>
+TresTetrahedronBufferGeometry: DefineComponent<Partial<Omit<TetrahedronBufferGeometry, OverwrittenProps > & TresModifiedObject>>
+TresTetrahedronGeometry: DefineComponent<Partial<Omit<TetrahedronGeometry, OverwrittenProps > & TresModifiedObject>>
+TresTorusBufferGeometry: DefineComponent<Partial<Omit<TorusBufferGeometry, OverwrittenProps > & TresModifiedObject>>
+TresTorusGeometry: DefineComponent<Partial<Omit<TorusGeometry, OverwrittenProps > & TresModifiedObject>>
+TresTorusKnotBufferGeometry: DefineComponent<Partial<Omit<TorusKnotBufferGeometry, OverwrittenProps > & TresModifiedObject>>
+TresTorusKnotGeometry: DefineComponent<Partial<Omit<TorusKnotGeometry, OverwrittenProps > & TresModifiedObject>>
+TresTubeBufferGeometry: DefineComponent<Partial<Omit<TubeBufferGeometry, OverwrittenProps > & TresModifiedObject>>
+TresTubeGeometry: DefineComponent<Partial<Omit<TubeGeometry, OverwrittenProps > & TresModifiedObject>>
+TresWireframeGeometry: DefineComponent<Partial<Omit<WireframeGeometry, OverwrittenProps > & TresModifiedObject>>
+        }
+      }
+      

package/dist/utils/index.d.ts

@@ -1,2 +1,5 @@
 export declare function toSetMethodName(key: string): string;
 export declare const merge: (target: any, source: any) => any;
+export declare const isHTMLTag: (key: string) => boolean;
+export declare function kebabToCamel(str: string): string;
+export declare function makeMap(str: string, expectsLowerCase?: boolean): (key: string) => boolean;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@tresjs/core",
   "description": "Declarative ThreeJS using Vue Components",
-  "version": "1.8.1",
+  "version": "2.0.0-alpha.1",
   "type": "module",
   "author": "Alvaro Saburido <hola@alvarosaburido.dev> (https://github.com/alvarosabu/)",
   "files": [
@@ -20,6 +20,9 @@
       "require": "./dist/index.d.ts",
       "import": "./dist/index.d.ts"
     },
+    "./components": {
+      "types": "./dist/types/tres-components.d.ts"
+    },
     "./styles": "./dist/style.css",
     "./*": "./dist/tres.js"
   },
@@ -33,6 +36,20 @@
     "three",
     "threejs-vue"
   ],
+  "scripts": {
+    "dev": "vite",
+    "build": "vite build",
+    "preview": "vite preview",
+    "test": "vitest",
+    "test:ci": "vitest run",
+    "test:ui": "vitest --ui",
+    "release": "release-it",
+    "coverage": "vitest run --coverage",
+    "lint": "eslint . --ext .js,.jsx,.ts,.tsx,.vue",
+    "docs:dev": "vitepress dev docs",
+    "docs:build": "vitepress build docs",
+    "docs:serve": "vitepress serve docs"
+  },
   "peerDependencies": {
     "three": "latest",
     "vue": "^3.2.47"
@@ -42,37 +59,42 @@
     "@vueuse/core": "^9.13.0"
   },
   "devDependencies": {
+    "@alvarosabu/prettier-config": "^1.2.0",
+    "@release-it/conventional-changelog": "^5.1.1",
+    "@stackblitz/sdk": "^1.8.1",
     "@tresjs/cientos": "^1.8.0",
     "@types/three": "latest",
+    "@typescript-eslint/eslint-plugin": "^5.42.0",
+    "@typescript-eslint/parser": "^5.42.0",
     "@vitejs/plugin-vue": "^4.0.0",
-    "@vitest/coverage-c8": "^0.28.5",
-    "@vitest/ui": "^0.28.5",
-    "@vue/test-utils": "^2.3.0",
+    "@vitest/coverage-c8": "^0.29.2",
+    "@vitest/ui": "^0.29.2",
+    "@vue/test-utils": "^2.3.1",
+    "eslint": "^8.26.0",
+    "eslint-config-prettier": "^8.5.0",
+    "eslint-plugin-vue": "^9.7.0",
+    "gsap": "^3.11.4",
     "happy-dom": "^8.7.1",
     "jsdom": "^21.1.0",
     "kolorist": "^1.7.0",
     "pathe": "^1.1.0",
+    "prettier": "^2.8.6",
+    "release-it": "^15.9.1",
     "rollup-plugin-analyzer": "^4.0.0",
+    "rollup-plugin-copy": "^3.4.0",
     "rollup-plugin-visualizer": "^5.9.0",
     "three": "latest",
+    "unocss": "^0.48.0",
+    "unplugin": "^1.3.1",
     "vite": "^4.1.4",
     "vite-plugin-banner": "^0.7.0",
-    "vite-plugin-dts": "2.0.0-beta.1",
+    "vite-plugin-dts": "2.1.0",
     "vite-plugin-glsl": "^1.1.2",
-    "vite-plugin-inspect": "^0.7.15",
+    "vite-plugin-inspect": "^0.7.16",
     "vite-plugin-require-transform": "^1.0.9",
-    "vitest": "^0.28.5",
+    "vite-svg-loader": "^4.0.0",
+    "vitepress": "1.0.0-alpha.38",
+    "vitest": "^0.29.2",
     "vue-demi": "^0.13.11"
-  },
-  "scripts": {
-    "dev": "vite",
-    "build": "vite build",
-    "preview": "vite preview",
-    "test": "vitest",
-    "test:ci": "vitest run",
-    "test:ui": "vitest --ui",
-    "coverage": "vitest run --coverage",
-    "lint": "eslint . --ext .js,.jsx,.ts,.tsx,.vue",
-    "changelog": "conventional-changelog -p angular -i CHANGELOG.md -s"
   }
-}
+}

package/dist/core/index.d.ts

@@ -1,10 +0,0 @@
-export * from './useCamera';
-export * from './useCatalogue';
-export * from './useInstanceCreator';
-export * from './useRenderLoop/';
-export * from './useRenderer/';
-export * from './useScene/';
-export * from './useLoader';
-export * from './useTexture';
-export * from './useTres';
-export * from './useRaycaster';

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

@@ -1,20 +0,0 @@
-import { App, Ref } from 'vue';
-import { TresCatalogue } from '../../types';
-/**
- * State for the catalogue of THREE objects
- *
- * ```ts
- * const { catalogue } = useCatalogue()
- *
- * console.log(catalogue.value.Mesh) // Mesh
- * ```
- *
- * @export
- * @param {App} [app]
- * @param {string} [prefix='Tres']
- * @return {*}
- */
-export declare function useCatalogue(app?: App, prefix?: string): {
-    extend: (objects: any) => void;
-    catalogue: Ref<TresCatalogue>;
-};

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

@@ -1,14 +0,0 @@
-import { Ref } from 'vue';
-import { TresCatalogue, TresInstance, TresVNode } from '../../types';
-/**
- * Composable responsible for creating instances out of Three.js objects.
- *
- * @export
- * @param {string} prefix
- * @return {*}
- */
-export declare function useInstanceCreator(prefix: string): {
-    createComponentInstances: (catalogue: Ref<TresCatalogue>) => (string | import("vue").DefineComponent<{}, () => void, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}>)[][];
-    processProps: (props: Record<string, any>, instance: TresInstance) => void;
-    createInstanceFromVNode: (vnode: TresVNode) => TresInstance | TresInstance[] | undefined;
-};

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

@@ -1,53 +0,0 @@
-import { ShadowMapType, TextureEncoding, ToneMapping } from 'three';
-import { PropType } from 'vue';
-export declare const TresCanvas: import("vue").DefineComponent<{
-    shadows: BooleanConstructor;
-    shadowMapType: PropType<ShadowMapType>;
-    physicallyCorrectLights: {
-        type: BooleanConstructor;
-        default: boolean;
-        validator: (value: boolean) => boolean;
-    };
-    useLegacyLights: BooleanConstructor;
-    outputEncoding: PropType<TextureEncoding>;
-    toneMapping: PropType<ToneMapping>;
-    toneMappingExposure: NumberConstructor;
-    context: PropType<WebGLRenderingContext>;
-    powerPreference: PropType<"high-performance" | "low-power" | "default">;
-    preserveDrawingBuffer: BooleanConstructor;
-    clearColor: StringConstructor;
-    windowSize: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-    preset: PropType<"realistic">;
-}, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
-    [key: string]: any;
-}> | undefined, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
-    shadows: BooleanConstructor;
-    shadowMapType: PropType<ShadowMapType>;
-    physicallyCorrectLights: {
-        type: BooleanConstructor;
-        default: boolean;
-        validator: (value: boolean) => boolean;
-    };
-    useLegacyLights: BooleanConstructor;
-    outputEncoding: PropType<TextureEncoding>;
-    toneMapping: PropType<ToneMapping>;
-    toneMappingExposure: NumberConstructor;
-    context: PropType<WebGLRenderingContext>;
-    powerPreference: PropType<"high-performance" | "low-power" | "default">;
-    preserveDrawingBuffer: BooleanConstructor;
-    clearColor: StringConstructor;
-    windowSize: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-    preset: PropType<"realistic">;
-}>>, {
-    shadows: boolean;
-    physicallyCorrectLights: boolean;
-    useLegacyLights: boolean;
-    preserveDrawingBuffer: boolean;
-    windowSize: boolean;
-}>;

package/dist/core/useScene/component.d.ts

@@ -1,6 +0,0 @@
-/**
- * Vue component for rendering a Tres component.
- */
-export declare const Scene: import("vue").DefineComponent<{}, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
-    [key: string]: any;
-}>[] | undefined, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}>;

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

@@ -1,10 +0,0 @@
-import { Scene } from 'three';
-/**
- * Composable for accessing the scene.
- *
- * @export
- * @return {*} {ShallowRef<Scene>}
- */
-export declare function useScene(): {
-    scene: import("vue").ShallowRef<Scene>;
-};

package/dist/env.d.ts

@@ -1,11 +0,0 @@
-/// <reference types="vite/client" />
-
-declare module '*.vue' {
-  import type { DefineComponent } from 'vue'
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/ban-types
-  const component: DefineComponent<{}, {}, any>
-  export default component
-}
-
-declare module '*.glsl' {}
-declare module '*.json' {}

package/dist/keys.d.ts

@@ -1 +0,0 @@
-export declare const UseTresStateSymbol: unique symbol;