@tresjs/core 2.4.0-next.8 → 2.4.0-next.9

package/dist/components/TresCanvas.vue.d.ts

@@ -72,6 +72,7 @@ declare const _sfc_main: import("vue").DefineComponent<{
         type: __PropType<boolean | undefined>;
         required: false;
         skipCheck: boolean;
+        default: boolean;
     };
     premultipliedAlpha: {
         type: __PropType<boolean | undefined>;
@@ -82,16 +83,19 @@ declare const _sfc_main: import("vue").DefineComponent<{
         type: __PropType<boolean | undefined>;
         required: false;
         skipCheck: boolean;
+        default: boolean;
     };
     stencil: {
         type: __PropType<boolean | undefined>;
         required: false;
         skipCheck: boolean;
+        default: boolean;
     };
     preserveDrawingBuffer: {
         type: __PropType<boolean | undefined>;
         required: false;
         skipCheck: boolean;
+        default: boolean;
     };
     powerPreference: {
         type: __PropType<string | undefined>;
@@ -101,6 +105,7 @@ declare const _sfc_main: import("vue").DefineComponent<{
         type: __PropType<boolean | undefined>;
         required: false;
         skipCheck: boolean;
+        default: boolean;
     };
     logarithmicDepthBuffer: {
         type: __PropType<boolean | undefined>;
@@ -169,6 +174,7 @@ declare const _sfc_main: import("vue").DefineComponent<{
         type: __PropType<boolean | undefined>;
         required: false;
         skipCheck: boolean;
+        default: boolean;
     };
     premultipliedAlpha: {
         type: __PropType<boolean | undefined>;
@@ -179,16 +185,19 @@ declare const _sfc_main: import("vue").DefineComponent<{
         type: __PropType<boolean | undefined>;
         required: false;
         skipCheck: boolean;
+        default: boolean;
     };
     stencil: {
         type: __PropType<boolean | undefined>;
         required: false;
         skipCheck: boolean;
+        default: boolean;
     };
     preserveDrawingBuffer: {
         type: __PropType<boolean | undefined>;
         required: false;
         skipCheck: boolean;
+        default: boolean;
     };
     powerPreference: {
         type: __PropType<string | undefined>;
@@ -198,6 +207,7 @@ declare const _sfc_main: import("vue").DefineComponent<{
         type: __PropType<boolean | undefined>;
         required: false;
         skipCheck: boolean;
+        default: boolean;
     };
     logarithmicDepthBuffer: {
         type: __PropType<boolean | undefined>;
@@ -209,5 +219,11 @@ declare const _sfc_main: import("vue").DefineComponent<{
         required: false;
         skipCheck: boolean;
     };
-}>>, {}, {}>;
+}>>, {
+    alpha: boolean | undefined;
+    antialias: boolean | undefined;
+    stencil: boolean | undefined;
+    preserveDrawingBuffer: boolean | undefined;
+    depth: boolean | undefined;
+}, {}>;
 export default _sfc_main;

package/dist/tres.js

@@ -1,6 +1,6 @@
 /**
  * name: @tresjs/core
- * version: v2.4.0-next.8
+ * version: v2.4.0-next.9
  * (c) 2023
  * description: Declarative ThreeJS using Vue Components
  * author: Alvaro Saburido <hola@alvarosaburido.dev> (https://github.com/alvarosabu/)
@@ -511,13 +511,13 @@ const Qe = ["data-scene"], Ze = /* @__PURE__ */ ie({
     camera: {},
     context: {},
     precision: {},
-    alpha: { type: Boolean },
+    alpha: { type: Boolean, default: !1 },
     premultipliedAlpha: { type: Boolean },
-    antialias: { type: Boolean },
-    stencil: { type: Boolean },
-    preserveDrawingBuffer: { type: Boolean },
+    antialias: { type: Boolean, default: !0 },
+    stencil: { type: Boolean, default: !0 },
+    preserveDrawingBuffer: { type: Boolean, default: !1 },
     powerPreference: {},
-    depth: { type: Boolean },
+    depth: { type: Boolean, default: !0 },
     logarithmicDepthBuffer: { type: Boolean },
     failIfMajorPerformanceCaveat: { type: Boolean }
   },

package/dist/tres.umd.cjs

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

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@tresjs/core",
   "description": "Declarative ThreeJS using Vue Components",
-  "version": "2.4.0-next.8",
+  "version": "2.4.0-next.9",
   "type": "module",
   "packageManager": "pnpm@8.3.1",
   "author": "Alvaro Saburido <hola@alvarosaburido.dev> (https://github.com/alvarosabu/)",