@tresjs/core 3.4.1 → 3.5.1

package/dist/tres.umd.cjs

@@ -1,8 +1,8 @@
 /**
  * name: @tresjs/core
- * version: v3.4.1
+ * version: v3.5.1
  * (c) 2023
  * description: Declarative ThreeJS using Vue Components
  * author: Alvaro Saburido <hola@alvarosaburido.dev> (https://github.com/alvarosabu/)
  */
-(function(w,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):(w=typeof globalThis<"u"?globalThis:w||self,u(w.tres={},w.Vue,w.Three,w.VueUseCore))})(this,function(w,u,P,C){"use strict";function ae(e){const a=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const t in e)if(t!=="default"){const r=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(a,t,r.get?r:{enumerable:!0,get:()=>e[t]})}}return a.default=e,Object.freeze(a)}const oe=ae(P),R=({sizes:e,scene:a})=>{const t=u.ref([]),r=u.computed(()=>t.value[0]),n=(s,d=!1)=>{t.value.some(({uuid:l})=>l===s.uuid)||(d?f(s):t.value.push(s))},o=s=>{t.value=t.value.filter(({uuid:d})=>d!==s.uuid)},f=s=>{const d=s instanceof P.Camera?s:t.value.find(p=>p.uuid===s);if(!d)return;const l=t.value.filter(({uuid:p})=>p!==d.uuid);t.value=[d,...l]};return u.watchEffect(()=>{e.aspectRatio.value&&t.value.forEach(s=>{s instanceof P.PerspectiveCamera&&(s.aspect=e.aspectRatio.value),(s instanceof P.PerspectiveCamera||s instanceof P.OrthographicCamera)&&s.updateProjectionMatrix()})}),a.userData.tres__registerCamera=n,a.userData.tres__deregisterCamera=o,u.onUnmounted(()=>{t.value=[]}),{camera:r,cameras:t,registerCamera:n,deregisterCamera:o,setCameraActive:f}},$=C.createEventHook(),I=C.createEventHook(),F=C.createEventHook(),S=new P.Clock;let B=0,x=0;const{pause:se,resume:ie,isActive:le}=C.useRafFn(()=>{$.trigger({delta:B,elapsed:x,clock:S}),I.trigger({delta:B,elapsed:x,clock:S}),F.trigger({delta:B,elapsed:x,clock:S})},{immediate:!1});F.on(()=>{B=S.getDelta(),x=S.getElapsedTime()});const G=()=>({onBeforeLoop:$.on,onLoop:I.on,onAfterLoop:F.on,pause:se,resume:ie,isActive:le}),ue=!0,W="[TresJS ▲ ■ ●] ";function L(){function e(r,n){console.error(`${W} ${r}`,n||"")}function a(r){console.warn(`${W} ${r}`)}function t(r,n){}return{logError:e,logWarning:a,logMessage:t}}function ce(e){return typeof e=="number"?[e,e,e]:e instanceof P.Vector3?[e.x,e.y,e.z]:e}function N(e){return e instanceof P.Color?e:Array.isArray(e)?new P.Color(...e):new P.Color(e)}const q=(e,a)=>{for(const t of Object.keys(a))a[t]instanceof Object&&Object.assign(a[t],q(e[t],a[t]));return Object.assign(e||{},a),e},fe=de("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 U(e){return e&&e.nodeType===1}function E(e){return e.replace(/-([a-z])/g,(a,t)=>t.toUpperCase())}function de(e,a){const t=Object.create(null),r=e.split(",");for(let n=0;n<r.length;n++)t[r[n]]=!0;return a?n=>!!t[n.toLowerCase()]:n=>!!t[n]}const me=(e,a)=>{const t=new Set,r=[];for(const n of e){const o=a(n);t.has(o)||(t.add(o),r.push(n))}return r},H=(e,a)=>{if(!a)return;const t=Array.isArray(a)?a:a.match(/([^[.\]])+/g);return t==null?void 0:t.reduce((r,n)=>r&&r[n],e)},pe=(e,a,t)=>{const r=Array.isArray(a)?a:a.match(/([^[.\]])+/g);r&&r.reduce((n,o,f)=>(n[o]===void 0&&(n[o]={}),f===r.length-1&&(n[o]=t),n[o]),e)};function J(e,a){if(U(e)&&U(a)){const n=e.attributes,o=a.attributes;return n.length!==o.length?!1:Array.from(n).every(({name:f,value:s})=>a.getAttribute(f)===s)}if(e===a)return!0;if(e===null||typeof e!="object"||a===null||typeof a!="object")return!1;const t=Object.keys(e),r=Object.keys(a);if(t.length!==r.length)return!1;for(const n of t)if(!r.includes(n)||!J(e[n],a[n]))return!1;return!0}function ge(e,a){if(!Array.isArray(e)||!Array.isArray(a)||e.length!==a.length)return!1;for(let t=0;t<e.length;t++)if(!J(e[t],a[t]))return!1;return!0}const ve=Array.isArray,ye=Number.parseInt(P.REVISION.replace("dev","")),V={realistic:{shadows:!0,physicallyCorrectLights:!0,outputColorSpace:P.SRGBColorSpace,toneMapping:P.ACESFilmicToneMapping,toneMappingExposure:3,shadowMap:{enabled:!0,type:P.PCFSoftShadowMap}}};function K({scene:e,canvas:a,options:t,disableRender:r,contextParts:{sizes:n,camera:o}}){const f=u.computed(()=>({alpha:C.toValue(t.alpha),depth:C.toValue(t.depth),canvas:C.unrefElement(a),context:C.toValue(t.context),stencil:C.toValue(t.stencil),antialias:C.toValue(t.antialias)===void 0?!0:C.toValue(t.antialias),precision:C.toValue(t.precision),powerPreference:C.toValue(t.powerPreference),premultipliedAlpha:C.toValue(t.premultipliedAlpha),preserveDrawingBuffer:C.toValue(t.preserveDrawingBuffer),logarithmicDepthBuffer:C.toValue(t.logarithmicDepthBuffer),failIfMajorPerformanceCaveat:C.toValue(t.failIfMajorPerformanceCaveat)})),s=u.shallowRef(new P.WebGLRenderer(f.value));u.watch(f,()=>{s.value.dispose(),s.value=new P.WebGLRenderer(f.value)}),u.watchEffect(()=>{s.value.setSize(n.width.value,n.height.value)});const{pixelRatio:d}=C.useDevicePixelRatio();u.watchEffect(()=>{s.value.setPixelRatio(d.value)});const{logError:l}=L(),c=(()=>{const v=new P.WebGLRenderer,_={shadowMap:{enabled:v.shadowMap.enabled,type:v.shadowMap.type},toneMapping:v.toneMapping,toneMappingExposure:v.toneMappingExposure,outputColorSpace:v.outputColorSpace};return v.dispose(),_})();u.watchEffect(()=>{const v=C.toValue(t.preset);v&&(v in V||l(`Renderer Preset must be one of these: ${Object.keys(V).join(", ")}`),q(s.value,V[v]));const _=(A,M)=>{const O=C.toValue(A),z=()=>{if(v)return H(V[v],M)};if(O!==void 0)return O;const h=z();return h!==void 0?h:H(c,M)},k=(A,M)=>pe(s.value,M,_(A,M));k(t.shadows,"shadowMap.enabled"),k(t.toneMapping,"toneMapping"),k(t.shadowMapType,"shadowMap.type"),ye<150&&k(!t.useLegacyLights,"physicallyCorrectLights"),k(t.outputColorSpace,"outputColorSpace"),k(t.toneMappingExposure,"toneMappingExposure");const D=_(t.clearColor,"clearColor");D&&s.value.setClearColor(D?N(D):new P.Color(0))});const{pause:i,resume:m,onLoop:g}=G();return g(()=>{o.value&&!C.toValue(r)&&s.value.render(e,o.value)}),m(),u.onUnmounted(()=>{i(),s.value.dispose(),s.value.forceContextLoss()}),{renderer:s}}const X=e=>typeof e=="function",we=e=>!!e&&e.constructor===Array;function Y(e){const a={nodes:{},materials:{}};return e&&e.traverse(t=>{t.name&&(a.nodes[t.name]=t),t.material&&!a.materials[t.material.name]&&(a.materials[t.material.name]=t.material)}),a}async function Ce(e,a,t,r,n){const{logError:o}=L(),f=new e;n&&n(f),t&&t(f);const d=(Array.isArray(a)?a:[a]).map(l=>new Promise((p,c)=>{f.load(l,i=>{i.scene&&Object.assign(i,Y(i.scene)),p(i)},r,i=>c(o("[useLoader] - Failed to load resource",i)))}));return we(a)?await Promise.all(d):await d[0]}async function he(e){const a=new P.LoadingManager,t=new P.TextureLoader(a),r=n=>new Promise((o,f)=>{t.load(n,s=>o(s),()=>null,()=>{f(new Error("[useTextures] - Failed to load texture"))})});if(ve(e)){const n=await Promise.all(e.map(o=>r(o)));return e.length>1?n:n[0]}else{const{map:n,displacementMap:o,normalMap:f,roughnessMap:s,metalnessMap:d,aoMap:l,alphaMap:p,matcap:c}=e;return{map:n?await r(n):null,displacementMap:o?await r(o):null,normalMap:f?await r(f):null,roughnessMap:s?await r(s):null,metalnessMap:d?await r(d):null,aoMap:l?await r(l):null,alphaMap:p?await r(p):null,matcap:c?await r(c):null}}}const Q=(e,{renderer:a,camera:t,raycaster:r})=>{const n=u.computed(()=>a.value.domElement),{x:o,y:f}=C.usePointer({target:n}),{width:s,height:d,top:l,left:p}=C.useElementBounding(n),c=({x:h,y:b})=>{if(n.value)return{x:(h-p.value)/s.value*2-1,y:-((b-l.value)/d.value)*2+1}},i=({x:h,y:b})=>{if(t.value)return r.value.setFromCamera(new P.Vector2(h,b),t.value),r.value.intersectObjects(e.value,!1)},m=h=>{const b=c({x:(h==null?void 0:h.clientX)??o.value,y:(h==null?void 0:h.clientY)??f.value});return b?i(b)||[]:[]},g=u.computed(()=>m()),v=C.createEventHook(),_=C.createEventHook(),k=(h,b)=>{h.trigger({event:b,intersects:m(b)})},D=h=>{k(_,h)};let A;const M=h=>{var b;A=(b=m(h)[0])==null?void 0:b.object},O=h=>{var b;h instanceof PointerEvent&&A===((b=m(h)[0])==null?void 0:b.object)&&k(v,h)},z=h=>_.trigger({event:h,intersects:[]});return n.value.addEventListener("pointerup",O),n.value.addEventListener("pointerdown",M),n.value.addEventListener("pointermove",D),n.value.addEventListener("pointerleave",z),u.onUnmounted(()=>{n!=null&&n.value&&(n.value.removeEventListener("pointerup",O),n.value.removeEventListener("pointerdown",M),n.value.removeEventListener("pointermove",D),n.value.removeEventListener("pointerleave",z))}),{intersects:g,onClick:h=>v.on(h).off,onPointerMove:h=>_.on(h).off}};function Pe(){const{logWarning:e}=L();function a(r,n,o){let f=null;return r.traverse(s=>{s[n]===o&&(f=s)}),f||e(`Child with ${n} '${o}' not found.`),f}function t(r,n){return a(r,"name",n)}return{seek:a,seekByName:t}}const Z=({scene:e,contextParts:a})=>{const t=u.reactive({click:new Map,pointerMove:new Map,pointerEnter:new Map,pointerLeave:new Map}),r=u.ref(new Set),n=i=>{r.value.add(i)},o=i=>{r.value.delete(i)},f=i=>{Object.values(t).forEach(m=>m.delete(i)),o(i)},s=i=>{const{onClick:m,onPointerMove:g,onPointerEnter:v,onPointerLeave:_}=i;m&&t.click.set(i,m),g&&t.pointerMove.set(i,g),v&&t.pointerEnter.set(i,v),_&&t.pointerLeave.set(i,_)};e.userData.tres__registerAtPointerEventHandler=s,e.userData.tres__deregisterAtPointerEventHandler=f,e.userData.tres__registerBlockingObjectAtPointerEventHandler=n,e.userData.tres__deregisterBlockingObjectAtPointerEventHandler=o;const d=u.computed(()=>me([...Array.from(r.value),...Object.values(t).map(i=>Array.from(i.keys())).flat()],({uuid:i})=>i)),{onClick:l,onPointerMove:p}=Q(d,a);l(({intersects:i,event:m})=>{var g;i.length&&((g=t.click.get(i[0].object))==null||g(i[0],m))});let c;return p(({intersects:i,event:m})=>{var D,A,M,O;const g=(D=i==null?void 0:i[0])==null?void 0:D.object,{pointerLeave:v,pointerEnter:_,pointerMove:k}=t;c&&c!==g&&((A=v.get(c))==null||A(c,m)),g&&(c!==g&&((M=_.get(g))==null||M(i[0],m)),(O=k.get(g))==null||O(i[0],m)),c=g||null}),{registerObject:s,deregisterObject:f}},T=u.ref({}),j=e=>Object.assign(T.value,e);function ee({scene:e,canvas:a,windowSize:t,disableRender:r,rendererOptions:n}){const o=u.computed(()=>C.toValue(t)?C.useWindowSize():C.useElementSize(C.toValue(a).parentElement)),f=u.computed(()=>o.value.width.value),s=u.computed(()=>o.value.height.value),d=u.computed(()=>f.value/s.value),l={height:s,width:f,aspectRatio:d},p=u.shallowRef(e),{camera:c,cameras:i,registerCamera:m,deregisterCamera:g,setCameraActive:v}=R({sizes:l,scene:e}),{renderer:_}=K({scene:e,canvas:a,options:n,contextParts:{sizes:l,camera:c},disableRender:r}),k={sizes:l,scene:p,camera:c,cameras:u.readonly(i),renderer:_,raycaster:u.shallowRef(new P.Raycaster),controls:u.ref(null),extend:j,registerCamera:m,setCameraActive:v,deregisterCamera:g};return u.provide("useTres",k),k}function te(){const e=u.inject("useTres");if(!e)throw new Error("useTresContext must be used together with useTresContextProvider");return e}const _e=te;function Se(e){}let y=null;const{logError:re}=L(),Me={createElement(e,a,t,r){var f,s;if(r||(r={}),r.args||(r.args=[]),e==="template"||fe(e))return null;let n=e.replace("Tres",""),o;if(e==="primitive"){(r==null?void 0:r.object)===void 0&&re("Tres primitives need a prop 'object'");const d=r.object;n=d.type,o=Object.assign(d,{type:n,attach:r.attach,primitive:!0})}else{const d=T.value[n];d||re(`${n} is not defined on the THREE namespace. Use extend to add it to the catalog.`),o=new d(...r.args)}return o.isCamera&&(r!=null&&r.position||o.position.set(3,3,3),r!=null&&r.lookAt||o.lookAt(0,0,0)),(r==null?void 0:r.attach)===void 0&&(o.isMaterial?o.attach="material":o.isBufferGeometry&&(o.attach="geometry")),o.isObject3D&&((f=r==null?void 0:r.material)!=null&&f.isMaterial&&(o.userData.tres__materialViaProp=!0),(s=r==null?void 0:r.geometry)!=null&&s.isBufferGeometry&&(o.userData.tres__geometryViaProp=!0)),o.userData={...o.userData,tres__name:n},o},insert(e,a){var r,n,o,f;a&&a.isScene&&(y=a);const t=a||y;if(e!=null&&e.isObject3D){if(e!=null&&e.isCamera){if(!(y!=null&&y.userData.tres__registerCamera))throw"could not find tres__registerCamera on scene's userData";(n=y==null?void 0:(r=y.userData).tres__registerCamera)==null||n.call(r,e)}if(e!=null&&e.onClick||e!=null&&e.onPointerMove||e!=null&&e.onPointerEnter||e!=null&&e.onPointerLeave){if(!(y!=null&&y.userData.tres__registerAtPointerEventHandler))throw"could not find tres__registerAtPointerEventHandler on scene's userData";(f=y==null?void 0:(o=y.userData).tres__registerAtPointerEventHandler)==null||f.call(o,e)}}e!=null&&e.isObject3D&&(t!=null&&t.isObject3D)?(t.add(e),e.dispatchEvent({type:"added"})):e!=null&&e.isFog?t.fog=e:typeof(e==null?void 0:e.attach)=="string"&&(e.__previousAttach=e[t==null?void 0:t.attach],t&&(t[e.attach]=e))},remove(e){var a,t;if(e){if(e.isObject3D){const r=e,n=l=>{var c,i;const p=l;l.userData.tres__materialViaProp||(c=p.material)==null||c.dispose(),l.userData.tres__geometryViaProp||(i=p.geometry)==null||i.dispose()},o=y==null?void 0:y.userData.tres__deregisterAtPointerEventHandler,f=y==null?void 0:y.userData.tres__deregisterBlockingObjectAtPointerEventHandler,s=l=>{var p,c;if(!f)throw"could not find tres__deregisterBlockingObjectAtPointerEventHandler on scene's userData";if((c=y==null?void 0:(p=y.userData).tres__deregisterBlockingObjectAtPointerEventHandler)==null||c.call(p,l),!o)throw"could not find tres__deregisterAtPointerEventHandler on scene's userData";(l!=null&&l.onClick||l!=null&&l.onPointerMove||l!=null&&l.onPointerEnter||l!=null&&l.onPointerLeave)&&(o==null||o(l))},d=l=>{const p=y==null?void 0:y.userData.tres__deregisterCamera;if(!p)throw"could not find tres__deregisterCamera on scene's userData";l.isCamera&&(p==null||p(l))};r.traverse(l=>{n(l),d(l),s==null||s(l)}),n(r),d(r),s==null||s(r)}(a=e.removeFromParent)==null||a.call(e),(t=e.dispose)==null||t.call(e)}},patchProp(e,a,t,r){var n,o,f,s;if(e){let d=e,l=a;if(e.isObject3D&&l==="blocks-pointer-events"){r||r===""?(o=y==null?void 0:(n=y.userData).tres__registerBlockingObjectAtPointerEventHandler)==null||o.call(n,e):(s=y==null?void 0:(f=y.userData).tres__deregisterBlockingObjectAtPointerEventHandler)==null||s.call(f,e);return}let p=E(l),c=d==null?void 0:d[p];if(l==="args"){const m=e,g=t??[],v=r??[],_=e.userData.tres__name||e.type;_&&g.length&&!ge(g,v)&&(d=Object.assign(m,new T.value[_](...r)));return}if(d.type==="BufferGeometry"){if(l==="args")return;d.setAttribute(E(l),new P.BufferAttribute(...r));return}if(l.includes("-")&&c===void 0){const m=l.split("-");c=m.reduce((g,v)=>g[E(v)],d),l=m.pop(),p=l.toLowerCase(),c!=null&&c.set||(d=m.reduce((g,v)=>g[E(v)],d))}let i=r;if(i===""&&(i=!0),X(c)){Array.isArray(i)?e[p](...i):e[p](i);return}!(c!=null&&c.set)&&!X(c)?d[p]=i:c.constructor===i.constructor&&(c!=null&&c.copy)?c==null||c.copy(i):Array.isArray(i)?c.set(...i):!c.isColor&&c.setScalar?c.setScalar(i):c.set(i)}},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},{render:Ae}=u.createRenderer(Me);j(oe);const ke=["data-scene"],ne=u.defineComponent({__name:"TresCanvas",props:{shadows:{type:Boolean,default:void 0},clearColor:{},toneMapping:{},shadowMapType:{},useLegacyLights:{type:Boolean,default:void 0},outputColorSpace:{},toneMappingExposure:{},camera:{},preset:{},windowSize:{type:Boolean,default:void 0},disableRender:{type:Boolean,default:void 0},context:{},precision:{},alpha:{type:Boolean,default:void 0},premultipliedAlpha:{type:Boolean},antialias:{type:Boolean,default:void 0},stencil:{type:Boolean,default:void 0},preserveDrawingBuffer:{type:Boolean,default:void 0},powerPreference:{},depth:{type:Boolean,default:void 0},logarithmicDepthBuffer:{type:Boolean,default:void 0},failIfMajorPerformanceCaveat:{type:Boolean,default:void 0}},setup(e,{expose:a}){var i;const t=e,{logWarning:r}=L(),n=u.ref(),o=u.shallowRef(new P.Scene);G();const f=u.useSlots(),s=(i=u.getCurrentInstance())==null?void 0:i.appContext.app,d=m=>u.defineComponent({setup(){var v;const g=(v=u.getCurrentInstance())==null?void 0:v.appContext;return g&&(g.app=s),u.provide("useTres",m),u.provide("extend",j),()=>u.h(u.Fragment,null,f!=null&&f.default?f.default():[])}}),l=m=>{const g=d(m);Ae(u.h(g),o.value)},p=u.computed(()=>t.disableRender),c=u.shallowRef(null);return a({context:c}),u.onMounted(()=>{const m=n;c.value=ee({scene:o.value,canvas:m,windowSize:t.windowSize,disableRender:p,rendererOptions:t}),Z({scene:o.value,contextParts:c.value});const{registerCamera:g,camera:v,cameras:_,deregisterCamera:k}=c.value;l(c.value);const D=()=>{const A=new P.PerspectiveCamera(45,window.innerWidth/window.innerHeight,.1,1e3);A.position.set(3,3,3),A.lookAt(0,0,0),g(A);const M=u.watchEffect(()=>{_.value.length>=2&&(A.removeFromParent(),k(A),M==null||M())})};u.watch(()=>t.camera,(A,M)=>{A&&g(A),M&&(M.removeFromParent(),k(M))},{immediate:!0}),v.value||(r("No camera found. Creating a default perspective camera. To have full control over a camera, please add one to the scene."),D())}),(m,g)=>(u.openBlock(),u.createElementBlock("canvas",{ref_key:"canvas",ref:n,"data-scene":o.value.uuid,class:u.normalizeClass(m.$attrs.class),style:u.normalizeStyle({display:"block",width:"100%",height:"100%",position:m.windowSize?"fixed":"relative",top:0,left:0,pointerEvents:"auto",touchAction:"none",...m.$attrs.style})},null,14,ke))}}),be=["TresCanvas","TresLeches","TresScene"],De={template:{compilerOptions:{isCustomElement:e=>e.startsWith("Tres")&&!be.includes(e)||e==="primitive"}}},Oe={install(e){e.component("TresCanvas",ne)}};w.TresCanvas=ne,w.catalogue=T,w.default=Oe,w.extend=j,w.isProd=ue,w.normalizeColor=N,w.normalizeVectorFlexibleParam=ce,w.templateCompilerOptions=De,w.trasverseObjects=Y,w.useCamera=R,w.useLoader=Ce,w.useLogger=L,w.usePointerEventHandler=Z,w.useRaycaster=Q,w.useRenderLoop=G,w.useRenderer=K,w.useSeek=Pe,w.useTexture=he,w.useTres=_e,w.useTresContext=te,w.useTresContextProvider=ee,Object.defineProperties(w,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});
+(function(w,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):(w=typeof globalThis<"u"?globalThis:w||self,u(w.tres={},w.Vue,w.Three,w.VueUseCore))})(this,function(w,u,P,C){"use strict";function ae(e){const a=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const t in e)if(t!=="default"){const r=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(a,t,r.get?r:{enumerable:!0,get:()=>e[t]})}}return a.default=e,Object.freeze(a)}const oe=ae(P),G=({sizes:e,scene:a})=>{const t=u.ref([]),r=u.computed(()=>t.value[0]),n=(s,d=!1)=>{t.value.some(({uuid:i})=>i===s.uuid)||(d?c(s):t.value.push(s))},o=s=>{t.value=t.value.filter(({uuid:d})=>d!==s.uuid)},c=s=>{const d=s instanceof P.Camera?s:t.value.find(p=>p.uuid===s);if(!d)return;const i=t.value.filter(({uuid:p})=>p!==d.uuid);t.value=[d,...i]};return u.watchEffect(()=>{e.aspectRatio.value&&t.value.forEach(s=>{s instanceof P.PerspectiveCamera&&(s.aspect=e.aspectRatio.value),(s instanceof P.PerspectiveCamera||s instanceof P.OrthographicCamera)&&s.updateProjectionMatrix()})}),a.userData.tres__registerCamera=n,a.userData.tres__deregisterCamera=o,u.onUnmounted(()=>{t.value=[]}),{camera:r,cameras:t,registerCamera:n,deregisterCamera:o,setCameraActive:c}},R=C.createEventHook(),I=C.createEventHook(),F=C.createEventHook(),B=new P.Clock;let S=0,x=0;const{pause:se,resume:ie,isActive:le}=C.useRafFn(()=>{R.trigger({delta:S,elapsed:x,clock:B}),I.trigger({delta:S,elapsed:x,clock:B}),F.trigger({delta:S,elapsed:x,clock:B})},{immediate:!1});F.on(()=>{S=B.getDelta(),x=B.getElapsedTime()});const $=()=>({onBeforeLoop:R.on,onLoop:I.on,onAfterLoop:F.on,pause:se,resume:ie,isActive:le}),ue=!0,W="[TresJS ▲ ■ ●] ";function L(){function e(r,n){console.error(`${W} ${r}`,n||"")}function a(r){console.warn(`${W} ${r}`)}function t(r,n){}return{logError:e,logWarning:a,logMessage:t}}function ce(e){return typeof e=="number"?[e,e,e]:e instanceof P.Vector3?[e.x,e.y,e.z]:e}function N(e){return e instanceof P.Color?e:Array.isArray(e)?new P.Color(...e):new P.Color(e)}const q=(e,a)=>{for(const t of Object.keys(a))a[t]instanceof Object&&Object.assign(a[t],q(e[t],a[t]));return Object.assign(e||{},a),e},fe=de("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 U(e){return e&&e.nodeType===1}function E(e){return e.replace(/-([a-z])/g,(a,t)=>t.toUpperCase())}function de(e,a){const t=Object.create(null),r=e.split(",");for(let n=0;n<r.length;n++)t[r[n]]=!0;return a?n=>!!t[n.toLowerCase()]:n=>!!t[n]}const me=(e,a)=>{const t=new Set,r=[];for(const n of e){const o=a(n);t.has(o)||(t.add(o),r.push(n))}return r},H=(e,a)=>{if(!a)return;const t=Array.isArray(a)?a:a.match(/([^[.\]])+/g);return t==null?void 0:t.reduce((r,n)=>r&&r[n],e)},pe=(e,a,t)=>{const r=Array.isArray(a)?a:a.match(/([^[.\]])+/g);r&&r.reduce((n,o,c)=>(n[o]===void 0&&(n[o]={}),c===r.length-1&&(n[o]=t),n[o]),e)};function J(e,a){if(U(e)&&U(a)){const n=e.attributes,o=a.attributes;return n.length!==o.length?!1:Array.from(n).every(({name:c,value:s})=>a.getAttribute(c)===s)}if(e===a)return!0;if(e===null||typeof e!="object"||a===null||typeof a!="object")return!1;const t=Object.keys(e),r=Object.keys(a);if(t.length!==r.length)return!1;for(const n of t)if(!r.includes(n)||!J(e[n],a[n]))return!1;return!0}function ge(e,a){if(!Array.isArray(e)||!Array.isArray(a)||e.length!==a.length)return!1;for(let t=0;t<e.length;t++)if(!J(e[t],a[t]))return!1;return!0}const ve=Array.isArray,ye=Number.parseInt(P.REVISION.replace("dev","")),V={realistic:{shadows:!0,physicallyCorrectLights:!0,outputColorSpace:P.SRGBColorSpace,toneMapping:P.ACESFilmicToneMapping,toneMappingExposure:3,shadowMap:{enabled:!0,type:P.PCFSoftShadowMap}}};function K({scene:e,canvas:a,options:t,disableRender:r,contextParts:{sizes:n,camera:o}}){const c=u.computed(()=>({alpha:C.toValue(t.alpha),depth:C.toValue(t.depth),canvas:C.unrefElement(a),context:C.toValue(t.context),stencil:C.toValue(t.stencil),antialias:C.toValue(t.antialias)===void 0?!0:C.toValue(t.antialias),precision:C.toValue(t.precision),powerPreference:C.toValue(t.powerPreference),premultipliedAlpha:C.toValue(t.premultipliedAlpha),preserveDrawingBuffer:C.toValue(t.preserveDrawingBuffer),logarithmicDepthBuffer:C.toValue(t.logarithmicDepthBuffer),failIfMajorPerformanceCaveat:C.toValue(t.failIfMajorPerformanceCaveat)})),s=u.shallowRef(new P.WebGLRenderer(c.value));u.watch(c,()=>{s.value.dispose(),s.value=new P.WebGLRenderer(c.value)}),u.watchEffect(()=>{s.value.setSize(n.width.value,n.height.value)});const{pixelRatio:d}=C.useDevicePixelRatio();u.watchEffect(()=>{s.value.setPixelRatio(d.value)});const{logError:i}=L(),f=(()=>{const v=new P.WebGLRenderer,_={shadowMap:{enabled:v.shadowMap.enabled,type:v.shadowMap.type},toneMapping:v.toneMapping,toneMappingExposure:v.toneMappingExposure,outputColorSpace:v.outputColorSpace};return v.dispose(),_})();u.watchEffect(()=>{const v=C.toValue(t.preset);v&&(v in V||i(`Renderer Preset must be one of these: ${Object.keys(V).join(", ")}`),q(s.value,V[v]));const _=(A,M)=>{const O=C.toValue(A),z=()=>{if(v)return H(V[v],M)};if(O!==void 0)return O;const h=z();return h!==void 0?h:H(f,M)},k=(A,M)=>pe(s.value,M,_(A,M));k(t.shadows,"shadowMap.enabled"),k(t.toneMapping,"toneMapping"),k(t.shadowMapType,"shadowMap.type"),ye<150&&k(!t.useLegacyLights,"physicallyCorrectLights"),k(t.outputColorSpace,"outputColorSpace"),k(t.toneMappingExposure,"toneMappingExposure");const D=_(t.clearColor,"clearColor");D&&s.value.setClearColor(D?N(D):new P.Color(0))});const{pause:l,resume:m,onLoop:g}=$();return g(()=>{o.value&&!C.toValue(r)&&s.value.render(e,o.value)}),m(),u.onUnmounted(()=>{l(),s.value.dispose(),s.value.forceContextLoss()}),{renderer:s}}const X=e=>typeof e=="function",we=e=>!!e&&e.constructor===Array;function Y(e){const a={nodes:{},materials:{}};return e&&e.traverse(t=>{t.name&&(a.nodes[t.name]=t),t.material&&!a.materials[t.material.name]&&(a.materials[t.material.name]=t.material)}),a}async function Ce(e,a,t,r,n){const{logError:o}=L(),c=new e;n&&n(c),t&&t(c);const d=(Array.isArray(a)?a:[a]).map(i=>new Promise((p,f)=>{c.load(i,l=>{l.scene&&Object.assign(l,Y(l.scene)),p(l)},r,l=>f(o("[useLoader] - Failed to load resource",l)))}));return we(a)?await Promise.all(d):await d[0]}async function he(e){const a=new P.LoadingManager,t=new P.TextureLoader(a),r=n=>new Promise((o,c)=>{t.load(n,s=>o(s),()=>null,()=>{c(new Error("[useTextures] - Failed to load texture"))})});if(ve(e)){const n=await Promise.all(e.map(o=>r(o)));return e.length>1?n:n[0]}else{const{map:n,displacementMap:o,normalMap:c,roughnessMap:s,metalnessMap:d,aoMap:i,alphaMap:p,matcap:f}=e;return{map:n?await r(n):null,displacementMap:o?await r(o):null,normalMap:c?await r(c):null,roughnessMap:s?await r(s):null,metalnessMap:d?await r(d):null,aoMap:i?await r(i):null,alphaMap:p?await r(p):null,matcap:f?await r(f):null}}}const Q=(e,{renderer:a,camera:t,raycaster:r})=>{const n=u.computed(()=>a.value.domElement),{x:o,y:c}=C.usePointer({target:n}),{width:s,height:d,top:i,left:p}=C.useElementBounding(n),f=({x:h,y:b})=>{if(n.value)return{x:(h-p.value)/s.value*2-1,y:-((b-i.value)/d.value)*2+1}},l=({x:h,y:b})=>{if(t.value)return r.value.setFromCamera(new P.Vector2(h,b),t.value),r.value.intersectObjects(e.value,!1)},m=h=>{const b=f({x:(h==null?void 0:h.clientX)??o.value,y:(h==null?void 0:h.clientY)??c.value});return b?l(b)||[]:[]},g=u.computed(()=>m()),v=C.createEventHook(),_=C.createEventHook(),k=(h,b)=>{h.trigger({event:b,intersects:m(b)})},D=h=>{k(_,h)};let A;const M=h=>{var b;A=(b=m(h)[0])==null?void 0:b.object},O=h=>{var b;h instanceof PointerEvent&&A===((b=m(h)[0])==null?void 0:b.object)&&k(v,h)},z=h=>_.trigger({event:h,intersects:[]});return n.value.addEventListener("pointerup",O),n.value.addEventListener("pointerdown",M),n.value.addEventListener("pointermove",D),n.value.addEventListener("pointerleave",z),u.onUnmounted(()=>{n!=null&&n.value&&(n.value.removeEventListener("pointerup",O),n.value.removeEventListener("pointerdown",M),n.value.removeEventListener("pointermove",D),n.value.removeEventListener("pointerleave",z))}),{intersects:g,onClick:h=>v.on(h).off,onPointerMove:h=>_.on(h).off}};function Pe(){const{logWarning:e}=L();function a(o,c,s){let d=null;return o.traverse(i=>{i[c]===s&&(d=i)}),d||e(`Child with ${c} '${s}' not found.`),d}function t(o,c,s){const d=[];return o.traverse(i=>{i[c].includes(s)&&d.push(i)}),d.length||e(`Children with ${c} '${s}' not found.`),d}function r(o,c){return a(o,"name",c)}function n(o,c){return t(o,"name",c)}return{seek:a,seekByName:r,seekAll:t,seekAllByName:n}}const Z=({scene:e,contextParts:a})=>{const t=u.reactive({click:new Map,pointerMove:new Map,pointerEnter:new Map,pointerLeave:new Map}),r=u.ref(new Set),n=l=>{r.value.add(l)},o=l=>{r.value.delete(l)},c=l=>{Object.values(t).forEach(m=>m.delete(l)),o(l)},s=l=>{const{onClick:m,onPointerMove:g,onPointerEnter:v,onPointerLeave:_}=l;m&&t.click.set(l,m),g&&t.pointerMove.set(l,g),v&&t.pointerEnter.set(l,v),_&&t.pointerLeave.set(l,_)};e.userData.tres__registerAtPointerEventHandler=s,e.userData.tres__deregisterAtPointerEventHandler=c,e.userData.tres__registerBlockingObjectAtPointerEventHandler=n,e.userData.tres__deregisterBlockingObjectAtPointerEventHandler=o;const d=u.computed(()=>me([...Array.from(r.value),...Object.values(t).map(l=>Array.from(l.keys())).flat()],({uuid:l})=>l)),{onClick:i,onPointerMove:p}=Q(d,a);i(({intersects:l,event:m})=>{var g;l.length&&((g=t.click.get(l[0].object))==null||g(l[0],m))});let f;return p(({intersects:l,event:m})=>{var D,A,M,O;const g=(D=l==null?void 0:l[0])==null?void 0:D.object,{pointerLeave:v,pointerEnter:_,pointerMove:k}=t;f&&f!==g&&((A=v.get(f))==null||A(f,m)),g&&(f!==g&&((M=_.get(g))==null||M(l[0],m)),(O=k.get(g))==null||O(l[0],m)),f=g||null}),{registerObject:s,deregisterObject:c}},T=u.ref({}),j=e=>Object.assign(T.value,e);function ee({scene:e,canvas:a,windowSize:t,disableRender:r,rendererOptions:n}){const o=u.computed(()=>C.toValue(t)?C.useWindowSize():C.useElementSize(C.toValue(a).parentElement)),c=u.computed(()=>o.value.width.value),s=u.computed(()=>o.value.height.value),d=u.computed(()=>c.value/s.value),i={height:s,width:c,aspectRatio:d},p=u.shallowRef(e),{camera:f,cameras:l,registerCamera:m,deregisterCamera:g,setCameraActive:v}=G({sizes:i,scene:e}),{renderer:_}=K({scene:e,canvas:a,options:n,contextParts:{sizes:i,camera:f},disableRender:r}),k={sizes:i,scene:p,camera:f,cameras:u.readonly(l),renderer:_,raycaster:u.shallowRef(new P.Raycaster),controls:u.ref(null),extend:j,registerCamera:m,setCameraActive:v,deregisterCamera:g};return u.provide("useTres",k),k}function te(){const e=u.inject("useTres");if(!e)throw new Error("useTresContext must be used together with useTresContextProvider");return e}const _e=te;function Be(e){}let y=null;const{logError:re}=L(),Me={createElement(e,a,t,r){var c,s;if(r||(r={}),r.args||(r.args=[]),e==="template"||fe(e))return null;let n=e.replace("Tres",""),o;if(e==="primitive"){(r==null?void 0:r.object)===void 0&&re("Tres primitives need a prop 'object'");const d=r.object;n=d.type,o=Object.assign(d,{type:n,attach:r.attach,primitive:!0})}else{const d=T.value[n];d||re(`${n} is not defined on the THREE namespace. Use extend to add it to the catalog.`),o=new d(...r.args)}return o.isCamera&&(r!=null&&r.position||o.position.set(3,3,3),r!=null&&r.lookAt||o.lookAt(0,0,0)),(r==null?void 0:r.attach)===void 0&&(o.isMaterial?o.attach="material":o.isBufferGeometry&&(o.attach="geometry")),o.isObject3D&&((c=r==null?void 0:r.material)!=null&&c.isMaterial&&(o.userData.tres__materialViaProp=!0),(s=r==null?void 0:r.geometry)!=null&&s.isBufferGeometry&&(o.userData.tres__geometryViaProp=!0)),o.userData={...o.userData,tres__name:n},o},insert(e,a){var r,n,o,c;a&&a.isScene&&(y=a);const t=a||y;if(e!=null&&e.isObject3D){if(e!=null&&e.isCamera){if(!(y!=null&&y.userData.tres__registerCamera))throw"could not find tres__registerCamera on scene's userData";(n=y==null?void 0:(r=y.userData).tres__registerCamera)==null||n.call(r,e)}if(e!=null&&e.onClick||e!=null&&e.onPointerMove||e!=null&&e.onPointerEnter||e!=null&&e.onPointerLeave){if(!(y!=null&&y.userData.tres__registerAtPointerEventHandler))throw"could not find tres__registerAtPointerEventHandler on scene's userData";(c=y==null?void 0:(o=y.userData).tres__registerAtPointerEventHandler)==null||c.call(o,e)}}e!=null&&e.isObject3D&&(t!=null&&t.isObject3D)?(t.add(e),e.dispatchEvent({type:"added"})):e!=null&&e.isFog?t.fog=e:typeof(e==null?void 0:e.attach)=="string"&&(e.__previousAttach=e[t==null?void 0:t.attach],t&&(t[e.attach]=e))},remove(e){var a,t;if(e){if(e.isObject3D){const r=e,n=i=>{var f,l;const p=i;i.userData.tres__materialViaProp||(f=p.material)==null||f.dispose(),i.userData.tres__geometryViaProp||(l=p.geometry)==null||l.dispose()},o=y==null?void 0:y.userData.tres__deregisterAtPointerEventHandler,c=y==null?void 0:y.userData.tres__deregisterBlockingObjectAtPointerEventHandler,s=i=>{var p,f;if(!c)throw"could not find tres__deregisterBlockingObjectAtPointerEventHandler on scene's userData";if((f=y==null?void 0:(p=y.userData).tres__deregisterBlockingObjectAtPointerEventHandler)==null||f.call(p,i),!o)throw"could not find tres__deregisterAtPointerEventHandler on scene's userData";(i!=null&&i.onClick||i!=null&&i.onPointerMove||i!=null&&i.onPointerEnter||i!=null&&i.onPointerLeave)&&(o==null||o(i))},d=i=>{const p=y==null?void 0:y.userData.tres__deregisterCamera;if(!p)throw"could not find tres__deregisterCamera on scene's userData";i.isCamera&&(p==null||p(i))};r.traverse(i=>{n(i),d(i),s==null||s(i)}),n(r),d(r),s==null||s(r)}(a=e.removeFromParent)==null||a.call(e),(t=e.dispose)==null||t.call(e)}},patchProp(e,a,t,r){var n,o,c,s;if(e){let d=e,i=a;if(e.isObject3D&&i==="blocks-pointer-events"){r||r===""?(o=y==null?void 0:(n=y.userData).tres__registerBlockingObjectAtPointerEventHandler)==null||o.call(n,e):(s=y==null?void 0:(c=y.userData).tres__deregisterBlockingObjectAtPointerEventHandler)==null||s.call(c,e);return}let p=E(i),f=d==null?void 0:d[p];if(i==="args"){const m=e,g=t??[],v=r??[],_=e.userData.tres__name||e.type;_&&g.length&&!ge(g,v)&&(d=Object.assign(m,new T.value[_](...r)));return}if(d.type==="BufferGeometry"){if(i==="args")return;d.setAttribute(E(i),new P.BufferAttribute(...r));return}if(i.includes("-")&&f===void 0){const m=i.split("-");f=m.reduce((g,v)=>g[E(v)],d),i=m.pop(),p=i.toLowerCase(),f!=null&&f.set||(d=m.reduce((g,v)=>g[E(v)],d))}let l=r;if(l===""&&(l=!0),X(f)){Array.isArray(l)?e[p](...l):e[p](l);return}!(f!=null&&f.set)&&!X(f)?d[p]=l:f.constructor===l.constructor&&(f!=null&&f.copy)?f==null||f.copy(l):Array.isArray(l)?f.set(...l):!f.isColor&&f.setScalar?f.setScalar(l):f.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},{render:Ae}=u.createRenderer(Me);j(oe);const ke=["data-scene"],ne=u.defineComponent({__name:"TresCanvas",props:{shadows:{type:Boolean,default:void 0},clearColor:{},toneMapping:{},shadowMapType:{},useLegacyLights:{type:Boolean,default:void 0},outputColorSpace:{},toneMappingExposure:{},camera:{},preset:{},windowSize:{type:Boolean,default:void 0},disableRender:{type:Boolean,default:void 0},context:{},precision:{},alpha:{type:Boolean,default:void 0},premultipliedAlpha:{type:Boolean},antialias:{type:Boolean,default:void 0},stencil:{type:Boolean,default:void 0},preserveDrawingBuffer:{type:Boolean,default:void 0},powerPreference:{},depth:{type:Boolean,default:void 0},logarithmicDepthBuffer:{type:Boolean,default:void 0},failIfMajorPerformanceCaveat:{type:Boolean,default:void 0}},setup(e,{expose:a}){var l;const t=e,{logWarning:r}=L(),n=u.ref(),o=u.shallowRef(new P.Scene);$();const c=u.useSlots(),s=(l=u.getCurrentInstance())==null?void 0:l.appContext.app,d=m=>u.defineComponent({setup(){var v;const g=(v=u.getCurrentInstance())==null?void 0:v.appContext;return g&&(g.app=s),u.provide("useTres",m),u.provide("extend",j),()=>u.h(u.Fragment,null,c!=null&&c.default?c.default():[])}}),i=m=>{const g=d(m);Ae(u.h(g),o.value)},p=u.computed(()=>t.disableRender),f=u.shallowRef(null);return a({context:f}),u.onMounted(()=>{const m=n;f.value=ee({scene:o.value,canvas:m,windowSize:t.windowSize,disableRender:p,rendererOptions:t}),Z({scene:o.value,contextParts:f.value});const{registerCamera:g,camera:v,cameras:_,deregisterCamera:k}=f.value;i(f.value);const D=()=>{const A=new P.PerspectiveCamera(45,window.innerWidth/window.innerHeight,.1,1e3);A.position.set(3,3,3),A.lookAt(0,0,0),g(A);const M=u.watchEffect(()=>{_.value.length>=2&&(A.removeFromParent(),k(A),M==null||M())})};u.watch(()=>t.camera,(A,M)=>{A&&g(A),M&&(M.removeFromParent(),k(M))},{immediate:!0}),v.value||(r("No camera found. Creating a default perspective camera. To have full control over a camera, please add one to the scene."),D())}),(m,g)=>(u.openBlock(),u.createElementBlock("canvas",{ref_key:"canvas",ref:n,"data-scene":o.value.uuid,class:u.normalizeClass(m.$attrs.class),style:u.normalizeStyle({display:"block",width:"100%",height:"100%",position:m.windowSize?"fixed":"relative",top:0,left:0,pointerEvents:"auto",touchAction:"none",...m.$attrs.style})},null,14,ke))}}),be=["TresCanvas","TresLeches","TresScene"],De={template:{compilerOptions:{isCustomElement:e=>e.startsWith("Tres")&&!be.includes(e)||e==="primitive"}}},Oe={install(e){e.component("TresCanvas",ne)}};w.TresCanvas=ne,w.catalogue=T,w.default=Oe,w.extend=j,w.isProd=ue,w.normalizeColor=N,w.normalizeVectorFlexibleParam=ce,w.templateCompilerOptions=De,w.trasverseObjects=Y,w.useCamera=G,w.useLoader=Ce,w.useLogger=L,w.usePointerEventHandler=Z,w.useRaycaster=Q,w.useRenderLoop=$,w.useRenderer=K,w.useSeek=Pe,w.useTexture=he,w.useTres=_e,w.useTresContext=te,w.useTresContextProvider=ee,Object.defineProperties(w,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});

package/dist/types/index.d.ts

@@ -1,4 +1,4 @@
-import type { DefineComponent, Ref, VNode } from 'vue';
+import type { DefineComponent, VNode, VNodeRef } from 'vue';
 import type * as THREE from 'three';
 import type { EventProps as PointerEventHandlerEventProps } from '../composables/usePointerEventHandler';
 export type AttachFnType<O = any> = (parent: any, self: O) => () => void;
@@ -134,8 +134,8 @@ interface RaycastableRepresentation {
 type EventProps<P> = P extends RaycastableRepresentation ? Partial<EventHandlers> : unknown;
 export interface VueProps<P> {
     children?: VNode[];
-    ref?: string | null | Ref<P>;
-    key?: string;
+    ref?: VNodeRef;
+    key?: string | number | symbol;
 }
 type ElementProps<T extends ConstructorRepresentation, P = InstanceType<T>> = Partial<Overwrite<WithMathProps<P>, VueProps<P> & EventProps<P>>>;
 export type ThreeElement<T extends ConstructorRepresentation> = Mutable<Overwrite<ElementProps<T>, Omit<InstanceProps<InstanceType<T>, T>, 'object'>>>;

package/package.json

@@ -1,8 +1,8 @@
 {
   "name": "@tresjs/core",
   "type": "module",
-  "version": "3.4.1",
-  "packageManager": "pnpm@8.3.1",
+  "version": "3.5.1",
+  "packageManager": "pnpm@8.10.2",
   "description": "Declarative ThreeJS using Vue Components",
   "author": "Alvaro Saburido <hola@alvarosaburido.dev> (https://github.com/alvarosabu/)",
   "license": "MIT",
@@ -17,8 +17,8 @@
   "exports": {
     ".": {
       "types": "./dist/index.d.ts",
-      "import": "./dist/tres.js",
-      "require": "./dist/tres.umd.cjs"
+      "require": "./dist/tres.umd.cjs",
+      "import": "./dist/tres.js"
     },
     "./components": {
       "types": "./dist/components/index.d.ts"
@@ -45,6 +45,7 @@
     "access": "public"
   },
   "scripts": {
+    "dev": "cd playground && npm run dev",
     "build": "vite build",
     "playground": "cd playground && npm run dev",
     "test": "vitest",
@@ -65,49 +66,45 @@
   },
   "dependencies": {
     "@alvarosabu/utils": "^3.1.1",
-    "@vueuse/core": "^10.3.0"
+    "@vueuse/core": "^10.5.0"
   },
   "devDependencies": {
-    "@alvarosabu/prettier-config": "^1.3.0",
-    "@huntersofbook/plausible-vue": "^1.0.0",
-    "@release-it/conventional-changelog": "^7.0.0",
+    "@release-it/conventional-changelog": "^8.0.1",
     "@stackblitz/sdk": "^1.9.0",
-    "@tresjs/cientos": "3.1.0",
-    "@tresjs/eslint-config-vue": "^0.2.0",
-    "@types/three": "^0.155.1",
-    "@typescript-eslint/eslint-plugin": "^6.4.1",
-    "@typescript-eslint/parser": "^6.4.1",
-    "@vitejs/plugin-vue": "^4.3.3",
+    "@tresjs/cientos": "3.6.0",
+    "@tresjs/eslint-config-vue": "^0.2.1",
+    "@types/three": "^0.158.3",
+    "@typescript-eslint/eslint-plugin": "^6.13.0",
+    "@typescript-eslint/parser": "^6.13.0",
+    "@vitejs/plugin-vue": "^4.5.0",
     "@vitest/coverage-c8": "^0.33.0",
-    "@vitest/ui": "^0.34.2",
-    "@vue/test-utils": "^2.4.1",
-    "eslint": "^8.47.0",
-    "eslint-config-prettier": "^9.0.0",
-    "eslint-plugin-vue": "^9.17.0",
-    "esno": "^0.17.0",
+    "@vitest/ui": "^0.34.6",
+    "@vue/test-utils": "^2.4.2",
+    "eslint": "^8.54.0",
+    "eslint-plugin-vue": "^9.18.1",
+    "esno": "^4.0.0",
     "gsap": "^3.12.2",
-    "jsdom": "^22.1.0",
+    "jsdom": "^23.0.0",
     "kolorist": "^1.8.0",
     "ohmyfetch": "^0.4.21",
     "pathe": "^1.1.1",
-    "prettier": "^3.0.2",
-    "release-it": "^16.1.5",
+    "release-it": "^17.0.0",
     "rollup-plugin-analyzer": "^4.0.0",
-    "rollup-plugin-copy": "^3.4.0",
-    "rollup-plugin-visualizer": "^5.9.2",
-    "three": "^0.155.0",
-    "unocss": "^0.54.0",
-    "unplugin": "^1.4.0",
-    "unplugin-vue-components": "^0.25.1",
-    "vite": "^4.4.9",
-    "vite-plugin-banner": "^0.7.0",
-    "vite-plugin-dts": "3.5.2",
-    "vite-plugin-inspect": "^0.7.38",
+    "rollup-plugin-copy": "^3.5.0",
+    "rollup-plugin-visualizer": "^5.9.3",
+    "three": "^0.158.0",
+    "unocss": "^0.57.7",
+    "unplugin": "^1.5.1",
+    "unplugin-vue-components": "^0.25.2",
+    "vite": "^5.0.2",
+    "vite-plugin-banner": "^0.7.1",
+    "vite-plugin-dts": "3.6.3",
+    "vite-plugin-inspect": "^0.8.0",
     "vite-plugin-require-transform": "^1.0.21",
-    "vite-svg-loader": "^4.0.0",
-    "vitepress": "1.0.0-rc.4",
-    "vitest": "^0.34.2",
-    "vue": "^3.3.4",
-    "vue-demi": "^0.14.5"
+    "vite-svg-loader": "^5.1.0",
+    "vitepress": "1.0.0-rc.31",
+    "vitest": "^0.34.6",
+    "vue": "^3.3.9",
+    "vue-demi": "^0.14.6"
   }
 }