@tresjs/core 3.1.0-next.1 → 3.1.0

package/dist/tres.umd.cjs

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

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@tresjs/core",
   "description": "Declarative ThreeJS using Vue Components",
-  "version": "3.1.0-next.1",
+  "version": "3.1.0",
   "type": "module",
   "packageManager": "pnpm@8.3.1",
   "author": "Alvaro Saburido <hola@alvarosaburido.dev> (https://github.com/alvarosabu/)",
@@ -71,25 +71,25 @@
     "@huntersofbook/plausible-vue": "^1.0.0",
     "@release-it/conventional-changelog": "^7.0.0",
     "@stackblitz/sdk": "^1.9.0",
-    "@tresjs/cientos": "3.0.1",
-    "@types/three": "^0.154.0",
-    "@typescript-eslint/eslint-plugin": "^6.2.0",
-    "@typescript-eslint/parser": "^6.2.0",
-    "@vitejs/plugin-vue": "^4.2.3",
+    "@tresjs/cientos": "3.1.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",
     "@vitest/coverage-c8": "^0.33.0",
-    "@vitest/ui": "^0.33.0",
+    "@vitest/ui": "^0.34.2",
     "@vue/test-utils": "^2.4.1",
-    "eslint": "^8.46.0",
-    "eslint-config-prettier": "^8.9.0",
-    "eslint-plugin-vue": "^9.16.1",
+    "eslint": "^8.47.0",
+    "eslint-config-prettier": "^9.0.0",
+    "eslint-plugin-vue": "^9.17.0",
     "esno": "^0.17.0",
     "gsap": "^3.12.2",
     "jsdom": "^22.1.0",
     "kolorist": "^1.8.0",
     "ohmyfetch": "^0.4.21",
     "pathe": "^1.1.1",
-    "prettier": "^3.0.0",
-    "release-it": "^16.1.3",
+    "prettier": "^3.0.2",
+    "release-it": "^16.1.5",
     "rollup-plugin-analyzer": "^4.0.0",
     "rollup-plugin-copy": "^3.4.0",
     "rollup-plugin-visualizer": "^5.9.2",
@@ -97,14 +97,14 @@
     "unocss": "^0.54.0",
     "unplugin": "^1.4.0",
     "unplugin-vue-components": "^0.25.1",
-    "vite": "^4.4.7",
+    "vite": "^4.4.9",
     "vite-plugin-banner": "^0.7.0",
-    "vite-plugin-dts": "3.4.0",
-    "vite-plugin-inspect": "^0.7.33",
+    "vite-plugin-dts": "3.5.2",
+    "vite-plugin-inspect": "^0.7.38",
     "vite-plugin-require-transform": "^1.0.21",
     "vite-svg-loader": "^4.0.0",
-    "vitepress": "1.0.0-beta.7",
-    "vitest": "^0.33.0",
+    "vitepress": "1.0.0-rc.4",
+    "vitest": "^0.34.2",
     "vue": "^3.3.4",
     "vue-demi": "^0.14.5"
   }