@tresjs/core 1.8.0 → 2.0.0-alpha.0

package/dist/tres.umd.cjs

@@ -1,8 +1,8 @@
 /**
  * name: @tresjs/core
- * version: v1.8.0
+ * version: v2.0.0-alpha.0
  * (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 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"}})});
+(function(f,u){typeof exports=="object"&&typeof module<"u"?u(exports,require("vue"),require("three"),require("@vueuse/core")):typeof define=="function"&&define.amd?define(["exports","vue","three","@vueuse/core"],u):(f=typeof globalThis<"u"?globalThis:f||self,u(f.tres={},f.Vue,f.Three,f.VueUseCore))})(this,function(f,u,c,s){"use strict";function se(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 $=se(c),O=u.ref({uuid:c.MathUtils.generateUUID()}),z=e=>void Object.assign(O.value,e);var J=(e=>(e.Perspective="Perspective",e.Orthographic="Orthographic",e))(J||{});const ue=45;let y;function R(){const{state:e,setState:t,aspectRatio:r}=L();function o(a="Perspective",l){var m,v,w;if(a==="Perspective"){const{near:g,far:C,fov:h}=l||{near:.1,far:1e3,fov:ue};y=new c.PerspectiveCamera(h,((m=e.aspectRatio)==null?void 0:m.value)||window.innerWidth/window.innerHeight,g,C),(v=e.cameras)==null||v.push(y)}else{const{left:g,right:C,top:h,bottom:T,near:D,far:F}=l||{left:-100,right:100,top:100,bottom:-100,near:.1,far:1e3};y=new c.OrthographicCamera(g,C,h,T,D,F),(w=e.cameras)==null||w.push(y)}return e.camera=y,t("camera",e.camera),y}function n(){var a;e.camera instanceof c.PerspectiveCamera&&e.aspectRatio&&(e.camera.aspect=e.aspectRatio.value),(a=e.camera)==null||a.updateProjectionMatrix()}function i(a){var l;(l=e.cameras)==null||l.push(a),a instanceof c.PerspectiveCamera&&e.aspectRatio&&(a.aspect=e.aspectRatio.value),a.updateProjectionMatrix(),t("camera",a)}function p(){e.cameras=[]}return u.watchEffect(()=>{r!=null&&r.value&&n()}),{activeCamera:u.toRef(e,"camera"),createCamera:o,updateCamera:n,pushCamera:i,clearCameras:p}}const K=s.createEventHook(),X=s.createEventHook(),W=s.createEventHook(),b=new c.Clock;let U=0,k=0;const{pause:le,resume:ce,isActive:fe}=s.useRafFn(()=>{K.trigger({delta:U,elapsed:k,clock:b}),X.trigger({delta:U,elapsed:k,clock:b}),W.trigger({delta:U,elapsed:k,clock:b})},{immediate:!1});W.on(()=>{U=b.getDelta(),k=b.getElapsedTime()});function j(){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 r of Object.keys(t))t[r]instanceof Object&&Object.assign(t[r],Y(e[r],t[r]));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,r)=>r.toUpperCase())}function me(e,t){const r=Object.create(null),o=e.split(",");for(let n=0;n<o.length;n++)r[o[n]]=!0;return t?n=>!!r[n.toLowerCase()]:n=>!!r[n]}const d=u.shallowRef(),V=u.ref(!1);function Q(e,t,r){const{alpha:o=!0,antialias:n=!0,depth:i,logarithmicDepthBuffer:p,failIfMajorPerformanceCaveat:a,precision:l,premultipliedAlpha:m,stencil:v,shadows:w=!1,shadowMapType:g=c.PCFShadowMap,physicallyCorrectLights:C=!1,useLegacyLights:h=!1,outputEncoding:T=c.LinearEncoding,toneMapping:D=c.NoToneMapping,toneMappingExposure:F=1,context:Oe=void 0,powerPreference:Ue="default",preserveDrawingBuffer:ke=!1,clearColor:S,windowSize:je=!1,preset:xe=void 0}=u.toRefs(r),{setState:G}=L(),{width:ne,height:ae}=s.resolveUnref(je)?s.useWindowSize():s.useElementSize(t),{logError:Ae}=P(),{pixelRatio:re}=s.useDevicePixelRatio(),{pause:_e,resume:Te}=j(),N=u.computed(()=>ne.value/ae.value),oe=()=>{d.value&&(d.value.setSize(ne.value,ae.value),d.value.setPixelRatio(Math.min(re.value,2)))},ie=()=>{if(!d.value)return;const M=s.resolveUnref(xe);if(M){M in B||Ae("Renderer Preset must be one of these: "+Object.keys(B).join(", ")),Y(d.value,B[M]);return}d.value.shadowMap.enabled=s.resolveUnref(w),d.value.shadowMap.type=s.resolveUnref(g),d.value.toneMapping=s.resolveUnref(D)||c.NoToneMapping,d.value.toneMappingExposure=s.resolveUnref(F),d.value.outputEncoding=s.resolveUnref(T)||c.LinearEncoding,S!=null&&S.value&&d.value.setClearColor(pe(s.resolveUnref(S))),d.value.useLegacyLights=s.resolveUnref(h)},De=()=>{const M=s.unrefElement(e);M&&(d.value=new c.WebGLRenderer({canvas:M,alpha:s.resolveUnref(o),antialias:s.resolveUnref(n),context:s.resolveUnref(Oe),depth:s.resolveUnref(i),failIfMajorPerformanceCaveat:s.resolveUnref(a),logarithmicDepthBuffer:s.resolveUnref(p),powerPreference:s.resolveUnref(Ue),precision:s.resolveUnref(l),stencil:s.resolveUnref(v),preserveDrawingBuffer:s.resolveUnref(ke),premultipliedAlpha:s.resolveUnref(m)}),G("renderer",d.value),G("clock",new c.Clock),G("aspectRatio",N),ie(),oe(),Te(),V.value=!0)},Fe=()=>{d.value&&(d.value.dispose(),d.value=void 0,V.value=!1,_e())};return u.watch([N,re],oe),u.watch([w,g,T,h,D,F,S],ie),u.watch(()=>[e,t],()=>{s.unrefElement(e)&&s.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(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 ve(e,t,r,o,n){const{logError:i}=P(),p=new e;n&&n(p),r&&r(p);const l=(Array.isArray(t)?t:[t]).map(m=>new Promise((v,w)=>{p.load(m,g=>{g.scene&&Object.assign(g,E(g.scene)),v(g)},o,g=>w(i("[useLoader] - Failed to load resource",g)))}));return Z(t)?await Promise.all(l):await l[0]}async function ge(e){const t=new c.LoadingManager,r=new c.TextureLoader(t),o=n=>new Promise((i,p)=>{r.load(n,a=>i(a),()=>null,()=>{p(new Error("[useTextures] - Failed to load texture"))})});if(Z(e)){const n=await Promise.all(e.map(i=>o(i)));return e.length>1?n:n[0]}else{const{map:n,displacementMap:i,normalMap:p,roughnessMap:a,metalnessMap:l,aoMap:m}=e;return{map:n?await o(n):null,displacementMap:i?await o(i):null,normalMap:p?await o(p):null,roughnessMap:a?await o(a):null,metalnessMap:l?await o(l):null,aoMap:m?await o(m):null}}}const x=u.shallowReactive({camera:void 0,cameras:[],aspectRatio:u.computed(()=>window.innerWidth/window.innerHeight)});function L(){function e(r){return x[r]}function t(r,o){x[r]=o}return{state:x,...u.toRefs(x),getState:e,setState:t}}const H=u.shallowRef(new c.Raycaster),A=u.ref(new c.Vector2),we=u.ref(null);function q(){const{setState:e}=L();e("raycaster",H.value),e("pointer",A),e("currentInstance",we);function t(r){A.value.x=r.clientX/window.innerWidth*2-1,A.value.y=-(r.clientY/window.innerHeight)*2+1}return window.addEventListener("pointermove",t),{raycaster:H,pointer:A}}const he=!0,ee="[TresJS ▲ ■ ●] ";function P(){function e(o,n){console.error(`${ee} ${o}`,n||"")}function t(o){console.warn(`${ee} ${o}`)}function r(o,n){}return{logError:e,logWarning:t,logMessage:r}}const{logWarning:ye}=P();function Ce(e){for(const t in e)if(t.indexOf("on")===0)return!0;return!1}function Re(e){}let _=null;const Me={createElement(e,t,r,o){if(e==="template"||de(e))return null;let n;if(o===null&&(o={}),o!=null&&o.args?n=new O.value[e.replace("Tres","")](...o.args):n=new O.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:i}=R();i(n)}return(o==null?void 0:o.attach)===void 0&&(n.isMaterial?n.attach="material":n.isBufferGeometry&&(n.attach="geometry")),n},insert(e,t,r){if(_===null&&t.isScene&&(_=t),t===null&&(t=_),t!=null&&t.isObject3D&&(e!=null&&e.isObject3D)){const a=r?t.children.indexOf(r):0;e.parent=t,t.children.splice(a,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}=j();let n=null,i=null;const{raycaster:p}=q();e&&e instanceof c.Mesh&&Ce(e)&&(o(()=>{var a,l,m;if(t!=null&&t.children&&e&&p){const v=p.value.intersectObjects(t.children);v.length>0&&v[0].object.uuid===e.uuid?(i=v[0],(n===null||n.object.uuid!==(i==null?void 0:i.object.uuid))&&((a=e.onPointerEnter)==null||a.call(e,i)),(l=e.onPointerMove)==null||l.call(e,i)):(i=null,n!==null&&((m=e.onPointerLeave)==null||m.call(e,n))),n=i}}),s.useEventListener(window,"click",()=>{var a;i!==null&&((a=e.onClick)==null||a.call(e,i))}))},remove(e){if(!e)return;const t=e.parentNode;t&&t.removeChild(e)},patchProp(e,t,r,o){if(e){let n=e,i=t;const p=I(i);let a=n==null?void 0:n[p];if(e.parent||(e.parent=_),i.includes("-")&&a===void 0){const m=i.split("-");a=m.reduce((v,w)=>v[I(w)],n),i=m.pop(),a!=null&&a.set||(n=m.reduce((v,w)=>v[I(w)],n))}let l=o;if(l===""&&(l=!0),s.isFunction(a))return;!(a!=null&&a.set)&&!s.isFunction(a)?n[p]=l:a.constructor===l.constructor&&(a!=null&&a.copy)?a==null||a.copy(l):Array.isArray(l)?a.set(...l):!a.isColor&&a.setScalar?a.setScalar(l):a.set(l)}},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}=u.createRenderer(Me),Le=e=>{const t=be(r);function r(){return e&&e.default?e.default():[]}return t};z($);const{logWarning:Pe}=P(),te=u.defineComponent({name:"TresCanvas",props:["shadows","shadowMapType","physicallyCorrectLights","useLegacyLights","outputEncoding","toneMapping","toneMappingExposure","context","powerPreference","preserveDrawingBuffer","clearColor","windowSize","preset"],setup(e,{slots:t,expose:r}){e.physicallyCorrectLights===!0&&Pe("physicallyCorrectLights is deprecated, useLegacyLights is now false by default");const o=u.ref(),n=u.ref(),i=new $.Scene;function p(){const{renderer:m}=Q(n,o,e),{activeCamera:v}=R(),{onLoop:w}=j(),{raycaster:g,pointer:C}=q();w(()=>{var h;v.value&&(g.value.setFromCamera(C.value,v.value),(h=m.value)==null||h.render(i,v.value))})}u.watch(n,p);let a;function l(){a=Le(t),a.provide("useTres",L()),a.provide("extend",z),a.mount(i)}return l(),r({scene:i}),()=>u.h(u.h("div",{ref:o,style:{position:"relative",width:"100%",height:"100%",pointerEvents:"auto",touchAction:"none"}},[u.h("div",{style:{width:"100%",height:"100%"}},[u.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=O,f.default=Se,f.extend=z,f.isProd=he,f.trasverseObjects=E,f.useCamera=R,f.useLoader=ve,f.useLogger=P,f.useRaycaster=q,f.useRenderLoop=j,f.useRenderer=Q,f.useTexture=ge,f.useTres=L,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.0",
+  "version": "2.0.0-alpha.0",
   "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;