@tresjs/core 2.0.0-beta.0 → 2.0.0-beta.1

package/dist/tres.js

@@ -1,20 +1,20 @@
 /**
  * name: @tresjs/core
- * version: v2.0.0-beta.0
+ * version: v2.0.0-beta.1
  * (c) 2023
  * description: Declarative ThreeJS using Vue Components
  * author: Alvaro Saburido <hola@alvarosaburido.dev> (https://github.com/alvarosabu/)
  */
-import { ref as M, watchEffect as oe, toRef as Re, shallowRef as ie, toRefs as se, computed as ce, watch as z, shallowReactive as ke, provide as Ae, inject as Oe, createRenderer as je, defineComponent as ue, onMounted as _e, onUnmounted as Be, h as E } from "vue";
-import * as fe from "three";
-import { MathUtils as De, PerspectiveCamera as O, OrthographicCamera as ze, Clock as le, Color as W, sRGBEncoding as We, ACESFilmicToneMapping as Fe, PCFSoftShadowMap as Ie, PCFShadowMap as He, LinearEncoding as ee, NoToneMapping as te, WebGLRenderer as Ue, LoadingManager as $e, TextureLoader as Ge, Raycaster as Ne, Vector2 as Ve, Mesh as qe, BufferAttribute as Ye } from "three";
+import { ref as M, watchEffect as oe, toRef as ke, shallowRef as ie, toRefs as se, computed as ce, watch as z, shallowReactive as ue, provide as Ae, inject as Oe, createRenderer as je, defineComponent as fe, onMounted as _e, onUnmounted as Be, h as L } from "vue";
+import * as le from "three";
+import { MathUtils as De, PerspectiveCamera as O, OrthographicCamera as ze, Clock as de, Color as W, sRGBEncoding as We, ACESFilmicToneMapping as Fe, PCFSoftShadowMap as Ie, PCFShadowMap as He, LinearEncoding as ee, NoToneMapping as te, WebGLRenderer as Ue, LoadingManager as $e, TextureLoader as Ge, Raycaster as Ne, Vector2 as Ve, Mesh as qe, BufferAttribute as Ye } from "three";
 import { createEventHook as $, useRafFn as Ke, resolveUnref as f, useWindowSize as Xe, useElementSize as Je, useDevicePixelRatio as Qe, unrefElement as F, useEventListener as Ze, isFunction as ne } from "@vueuse/core";
-const H = M({ uuid: De.generateUUID() }), de = (e) => void Object.assign(H.value, e);
+const H = M({ uuid: De.generateUUID() }), pe = (e) => void Object.assign(H.value, e);
 var et = /* @__PURE__ */ ((e) => (e.Perspective = "Perspective", e.Orthographic = "Orthographic", e))(et || {});
 const tt = 45;
 let x;
 function U() {
-  const { state: e, setState: t, aspectRatio: r } = T();
+  const { state: e, setState: t, aspectRatio: r } = S();
   function a(o = "Perspective", c) {
     var u, l, p;
     if (o === "Perspective") {
@@ -51,28 +51,28 @@ function U() {
   return oe(() => {
     r != null && r.value && n();
   }), {
-    activeCamera: Re(e, "camera"),
+    activeCamera: ke(e, "camera"),
     createCamera: a,
     updateCamera: n,
     pushCamera: i,
     clearCameras: s
   };
 }
-const pe = $(), me = $(), G = $(), S = new le();
+const me = $(), ve = $(), G = $(), E = new de();
 let j = 0, _ = 0;
 const { pause: nt, resume: at, isActive: rt } = Ke(
   () => {
-    pe.trigger({ delta: j, elapsed: _, clock: S }), me.trigger({ delta: j, elapsed: _, clock: S }), G.trigger({ delta: j, elapsed: _, clock: S });
+    me.trigger({ delta: j, elapsed: _, clock: E }), ve.trigger({ delta: j, elapsed: _, clock: E }), G.trigger({ delta: j, elapsed: _, clock: E });
   },
   { immediate: !1 }
 );
 G.on(() => {
-  j = S.getDelta(), _ = S.getElapsedTime();
+  j = E.getDelta(), _ = E.getElapsedTime();
 });
 function N() {
   return {
-    onBeforeLoop: pe.on,
-    onLoop: me.on,
+    onBeforeLoop: me.on,
+    onLoop: ve.on,
     onAfterLoop: G.on,
     pause: nt,
     resume: at,
@@ -92,9 +92,9 @@ const I = {
       type: Ie
     }
   }
-}, ve = (e, t) => {
+}, ge = (e, t) => {
   for (const r of Object.keys(t))
-    t[r] instanceof Object && Object.assign(t[r], ve(e[r], t[r]));
+    t[r] instanceof Object && Object.assign(t[r], ge(e[r], t[r]));
   return Object.assign(e || {}, t), e;
 }, it = "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", st = /* @__PURE__ */ ct(it);
 function R(e) {
@@ -124,62 +124,62 @@ function ut(e) {
     outputEncoding: b = ee,
     toneMapping: g = te,
     toneMappingExposure: P = 1,
-    context: be = void 0,
-    powerPreference: ye = "default",
-    preserveDrawingBuffer: xe = !1,
-    clearColor: L,
+    context: ye = void 0,
+    powerPreference: xe = "default",
+    preserveDrawingBuffer: Me = !1,
+    clearColor: C,
     windowSize: V = !1,
-    preset: Me = void 0
-  } = se(e), { state: h, setState: B } = T(), { width: q, height: Y } = f(V) ? Xe() : Je(h.container), { logError: Ce, logWarning: Le } = C(), { pixelRatio: K } = Qe(), { pause: Ee, resume: Se } = N(), D = ce(() => q.value / Y.value);
-  !f(V) && ((Z = (Q = h.container) == null ? void 0 : Q.value) == null ? void 0 : Z.offsetHeight) === 0 && Le(`Oops... Seems like your canvas height is currently 0px, by default it takes the height of it's parent, so make sure it has some height with CSS.
+    preset: Ce = void 0
+  } = se(e), { state: h, setState: B } = S(), { width: q, height: Y } = f(V) ? Xe() : Je(h.container), { logError: Le, logWarning: Ee } = T(), { pixelRatio: K } = Qe(), { pause: Se, resume: Te } = N(), D = ce(() => q.value / Y.value);
+  !f(V) && ((Z = (Q = h.container) == null ? void 0 : Q.value) == null ? void 0 : Z.offsetHeight) === 0 && Ee(`Oops... Seems like your canvas height is currently 0px, by default it takes the height of it's parent, so make sure it has some height with CSS.
 You could set windowSize=true to force the canvas to be the size of the window.`);
   const X = () => {
     t.value && (t.value.setSize(q.value, Y.value), t.value.setPixelRatio(Math.min(K.value, 2)));
   }, J = () => {
     if (!t.value)
       return;
-    const y = f(Me);
+    const y = f(Ce);
     if (y) {
-      y in I || Ce("Renderer Preset must be one of these: " + Object.keys(I).join(", ")), ve(t.value, I[y]);
+      y in I || Le("Renderer Preset must be one of these: " + Object.keys(I).join(", ")), ge(t.value, I[y]);
       return;
     }
-    t.value.shadowMap.enabled = f(p), t.value.shadowMap.type = f(d), t.value.toneMapping = f(g) || te, t.value.toneMappingExposure = f(P), t.value.outputEncoding = f(b) || ee, L != null && L.value && t.value.setClearColor(ot(f(L))), t.value.useLegacyLights = f(v);
-  }, Te = () => {
+    t.value.shadowMap.enabled = f(p), t.value.shadowMap.type = f(d), t.value.toneMapping = f(g) || te, t.value.toneMappingExposure = f(P), t.value.outputEncoding = f(b) || ee, C != null && C.value && t.value.setClearColor(ot(f(C))), t.value.useLegacyLights = f(v);
+  }, Pe = () => {
     const y = F(h.canvas);
     y && (t.value = new Ue({
       canvas: y,
       alpha: f(a),
       antialias: f(n),
-      context: f(be),
+      context: f(ye),
       depth: f(i),
       failIfMajorPerformanceCaveat: f(o),
       logarithmicDepthBuffer: f(s),
-      powerPreference: f(ye),
+      powerPreference: f(xe),
       precision: f(c),
       stencil: f(l),
-      preserveDrawingBuffer: f(xe),
+      preserveDrawingBuffer: f(Me),
       premultipliedAlpha: f(u)
-    }), B("renderer", t.value), B("clock", new le()), B("aspectRatio", D), J(), X(), Se(), r.value = !0);
-  }, Pe = () => {
-    t.value && (t.value.dispose(), t.value = void 0, r.value = !1, Ee());
+    }), B("renderer", t.value), B("clock", new de()), B("aspectRatio", D), J(), X(), Te(), r.value = !0);
+  }, Re = () => {
+    t.value && (t.value.dispose(), t.value = void 0, r.value = !1, Se());
   };
   return z([D, K], X), z(
-    [p, d, b, v, g, P, L],
+    [p, d, b, v, g, P, C],
     J
   ), z(
     () => [h.canvas, h.container],
     () => {
-      F(h.canvas) && F(h.container) && Te();
+      F(h.canvas) && F(h.container) && Pe();
     },
     { immediate: !0, deep: !0 }
   ), {
     renderer: t,
     isReady: r,
-    dispose: Pe,
+    dispose: Re,
     aspectRatio: D
   };
 }
-const ge = (e) => !!e && e.constructor === Array;
+const he = (e) => !!e && e.constructor === Array;
 function ft(e) {
   const t = { nodes: {}, materials: {} };
   return e && e.traverse((r) => {
@@ -187,7 +187,7 @@ function ft(e) {
   }), t;
 }
 async function Et(e, t, r, a, n) {
-  const { logError: i } = C(), s = new e();
+  const { logError: i } = T(), s = new e();
   n && n(s), r && r(s);
   const c = (Array.isArray(t) ? t : [t]).map(
     (u) => new Promise((l, p) => {
@@ -201,7 +201,7 @@ async function Et(e, t, r, a, n) {
       );
     })
   );
-  return ge(t) ? await Promise.all(c) : await c[0];
+  return he(t) ? await Promise.all(c) : await c[0];
 }
 async function St(e) {
   const t = new $e(), r = new Ge(t), a = (n) => new Promise((i, s) => {
@@ -214,7 +214,7 @@ async function St(e) {
       }
     );
   });
-  if (ge(e)) {
+  if (he(e)) {
     const n = await Promise.all(e.map((i) => a(i)));
     return e.length > 1 ? n : n[0];
   } else {
@@ -245,9 +245,9 @@ function lt() {
   const e = Math.random() * 4294967295 | 0, t = Math.random() * 4294967295 | 0, r = Math.random() * 4294967295 | 0, a = Math.random() * 4294967295 | 0;
   return (m[e & 255] + m[e >> 8 & 255] + m[e >> 16 & 255] + m[e >> 24 & 255] + "-" + m[t & 255] + m[t >> 8 & 255] + "-" + m[t >> 16 & 15 | 64] + m[t >> 24 & 255] + "-" + m[r & 63 | 128] + m[r >> 8 & 255] + "-" + m[r >> 16 & 255] + m[r >> 24 & 255] + m[a & 255] + m[a >> 8 & 255] + m[a >> 16 & 255] + m[a >> 24 & 255]).toLowerCase();
 }
-const he = Symbol();
+const we = Symbol();
 function dt() {
-  const e = ke({
+  const e = ue({
     uuid: lt(),
     camera: void 0,
     cameras: [],
@@ -267,14 +267,18 @@ function dt() {
     getState: t,
     setState: r
   };
-  return Ae(he, a), a;
+  return Ae(we, a), a;
 }
-const T = () => {
-  const e = Oe(he), { logError: t } = C();
-  return e || t("useTres must be used together with useTresProvider"), e;
-}, ae = ie(new Ne()), k = M(new Ve()), pt = M(null);
-function we() {
-  const { setState: e } = T();
+const S = () => Oe(we, {
+  state: ue({
+    camera: void 0,
+    cameras: [],
+    scene: void 0,
+    renderer: void 0
+  })
+}), ae = ie(new Ne()), k = M(new Ve()), pt = M(null);
+function be() {
+  const { setState: e } = S();
   e("raycaster", ae.value), e("pointer", k), e("currentInstance", pt);
   function t(r) {
     k.value.x = r.clientX / window.innerWidth * 2 - 1, k.value.y = -(r.clientY / window.innerHeight) * 2 + 1;
@@ -285,7 +289,7 @@ function we() {
   };
 }
 const Tt = !0, re = "[TresJS ▲ ■ ●] ";
-function C() {
+function T() {
   function e(a, n) {
     console.error(`${re} ${a}`, n || "");
   }
@@ -301,7 +305,7 @@ function C() {
   };
 }
 function Pt() {
-  const { logWarning: e } = C();
+  const { logWarning: e } = T();
   function t(a, n, i) {
     let s = null;
     return a.traverse((o) => {
@@ -316,7 +320,7 @@ function Pt() {
     seekByName: r
   };
 }
-const { logWarning: mt } = C();
+const { logWarning: mt } = T();
 function vt(e) {
   for (const t in e)
     if (t.indexOf("on") === 0)
@@ -348,7 +352,7 @@ const gt = {
     const { onLoop: a } = N();
     let n = null, i = null;
     if (e && e instanceof qe && vt(e)) {
-      const { raycaster: s } = we();
+      const { raycaster: s } = be();
       a(() => {
         var o, c, u;
         if (t != null && t.children && e && s) {
@@ -410,8 +414,8 @@ const gt = {
   }
   return t;
 };
-de(fe);
-const { logWarning: bt } = C(), yt = ue({
+pe(le);
+const { logWarning: bt } = T(), yt = fe({
   name: "TresScene",
   props: [
     "shadows",
@@ -430,7 +434,7 @@ const { logWarning: bt } = C(), yt = ue({
   ],
   setup(e, { slots: t, expose: r }) {
     e.physicallyCorrectLights === !0 && bt("physicallyCorrectLights is deprecated, useLegacyLights is now false by default");
-    const a = M(), n = M(), i = new fe.Scene(), { setState: s } = T();
+    const a = M(), n = M(), i = new le.Scene(), { setState: s } = S();
     s("scene", i), s("canvas", n), s("container", a);
     const { pushCamera: o } = U();
     o(new O()), _e(() => {
@@ -439,7 +443,7 @@ const { logWarning: bt } = C(), yt = ue({
       s("renderer", null);
     });
     function c() {
-      const { renderer: p } = ut(e), { activeCamera: d } = U(), { onLoop: w } = N(), { raycaster: v, pointer: b } = we();
+      const { renderer: p } = ut(e), { activeCamera: d } = U(), { onLoop: w } = N(), { raycaster: v, pointer: b } = be();
       oe(() => {
         d.value && v.value.setFromCamera(b.value, d.value);
       }), w(() => {
@@ -449,12 +453,12 @@ const { logWarning: bt } = C(), yt = ue({
     }
     let u;
     function l() {
-      u = wt(t), u.provide("useTres", T()), u.provide("extend", de), u.mount(i);
+      u = wt(t), u.provide("useTres", S()), u.provide("extend", pe), u.mount(i);
     }
     return l(), r({
       scene: i
-    }), () => E(
-      E(
+    }), () => L(
+      L(
         "div",
         {
           ref: a,
@@ -469,7 +473,7 @@ const { logWarning: bt } = C(), yt = ue({
           }
         },
         [
-          E(
+          L(
             "div",
             {
               style: {
@@ -478,7 +482,7 @@ const { logWarning: bt } = C(), yt = ue({
               }
             },
             [
-              E("canvas", {
+              L("canvas", {
                 ref: n,
                 "data-scene": i.uuid,
                 style: {
@@ -496,7 +500,7 @@ const { logWarning: bt } = C(), yt = ue({
       )
     );
   }
-}), xt = ue({
+}), xt = fe({
   name: "TresCanvas",
   props: [
     "shadows",
@@ -513,8 +517,9 @@ const { logWarning: bt } = C(), yt = ue({
     "windowSize",
     "preset"
   ],
-  setup(e, { slots: t }) {
-    return dt(), () => E(yt, e, t);
+  setup(e, { slots: t, expose: r }) {
+    const a = dt();
+    return r(a), () => L(yt, e, t);
   }
 }), Rt = {
   install(e) {
@@ -526,17 +531,17 @@ export {
   xt as TresCanvas,
   H as catalogue,
   Rt as default,
-  de as extend,
+  pe as extend,
   Tt as isProd,
   ft as trasverseObjects,
   U as useCamera,
   Et as useLoader,
-  C as useLogger,
-  we as useRaycaster,
+  T as useLogger,
+  be as useRaycaster,
   N as useRenderLoop,
   ut as useRenderer,
   Pt as useSeek,
   St as useTexture,
-  T as useTres,
+  S as useTres,
   dt as useTresProvider
 };

package/dist/tres.umd.cjs

@@ -1,9 +1,9 @@
 /**
  * name: @tresjs/core
- * version: v2.0.0-beta.0
+ * version: v2.0.0-beta.1
  * (c) 2023
  * description: Declarative ThreeJS using Vue Components
  * author: Alvaro Saburido <hola@alvarosaburido.dev> (https://github.com/alvarosabu/)
  */
-(function(d,i){typeof exports=="object"&&typeof module<"u"?i(exports,require("vue"),require("three"),require("@vueuse/core")):typeof define=="function"&&define.amd?define(["exports","vue","three","@vueuse/core"],i):(d=typeof globalThis<"u"?globalThis:d||self,i(d.tres={},d.Vue,d.Three,d.VueUseCore))})(this,function(d,i,l,c){"use strict";function le(e){const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const r in e)if(r!=="default"){const a=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(t,r,a.get?a:{enumerable:!0,get:()=>e[r]})}}return t.default=e,Object.freeze(t)}const q=le(l),U=i.ref({uuid:l.MathUtils.generateUUID()}),W=e=>void Object.assign(U.value,e);var V=(e=>(e.Perspective="Perspective",e.Orthographic="Orthographic",e))(V||{});const de=45;let M;function A(){const{state:e,setState:t,aspectRatio:r}=L();function a(o="Perspective",u){var p,m,h;if(o==="Perspective"){const{near:g,far:x,fov:w}=u||{near:.1,far:1e3,fov:de};M=new l.PerspectiveCamera(w,((p=e.aspectRatio)==null?void 0:p.value)||window.innerWidth/window.innerHeight,g,x),(m=e.cameras)==null||m.push(M)}else{const{left:g,right:x,top:w,bottom:S,near:y,far:F}=u||{left:-100,right:100,top:100,bottom:-100,near:.1,far:1e3};M=new l.OrthographicCamera(g,x,w,S,y,F),(h=e.cameras)==null||h.push(M)}return e.camera=M,t("camera",e.camera),M}function n(){var o;e.camera instanceof l.PerspectiveCamera&&e.aspectRatio&&(e.camera.aspect=e.aspectRatio.value),(o=e.camera)==null||o.updateProjectionMatrix()}function s(o){var u;(u=e.cameras)==null||u.push(o),o instanceof l.PerspectiveCamera&&e.aspectRatio&&(o.aspect=e.aspectRatio.value),o.updateProjectionMatrix(),t("camera",o)}function f(){e.cameras=[]}return i.watchEffect(()=>{r!=null&&r.value&&n()}),{activeCamera:i.toRef(e,"camera"),createCamera:a,updateCamera:n,pushCamera:s,clearCameras:f}}const Y=c.createEventHook(),K=c.createEventHook(),I=c.createEventHook(),k=new l.Clock;let T=0,j=0;const{pause:pe,resume:me,isActive:ge}=c.useRafFn(()=>{Y.trigger({delta:T,elapsed:j,clock:k}),K.trigger({delta:T,elapsed:j,clock:k}),I.trigger({delta:T,elapsed:j,clock:k})},{immediate:!1});I.on(()=>{T=k.getDelta(),j=k.getElapsedTime()});function _(){return{onBeforeLoop:Y.on,onLoop:K.on,onAfterLoop:I.on,pause:pe,resume:me,isActive:ge}}function ve(e){return e instanceof l.Color?e:Array.isArray(e)?new l.Color(...e):new l.Color(e)}const R={realistic:{outputEncoding:l.sRGBEncoding,toneMapping:l.ACESFilmicToneMapping,toneMappingExposure:3,shadowMap:{enabled:!0,type:l.PCFSoftShadowMap}}},X=(e,t)=>{for(const r of Object.keys(t))t[r]instanceof Object&&Object.assign(t[r],X(e[r],t[r]));return Object.assign(e||{},t),e},he=we("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 D(e){return e.replace(/-([a-z])/g,(t,r)=>r.toUpperCase())}function we(e,t){const r=Object.create(null),a=e.split(",");for(let n=0;n<a.length;n++)r[a[n]]=!0;return t?n=>!!r[n.toLowerCase()]:n=>!!r[n]}function J(e){var fe,ue;const t=i.shallowRef(),r=i.ref(!1),{alpha:a=!0,antialias:n=!0,depth:s,logarithmicDepthBuffer:f,failIfMajorPerformanceCaveat:o,precision:u,premultipliedAlpha:p,stencil:m,shadows:h=!1,shadowMapType:g=l.PCFShadowMap,physicallyCorrectLights:x=!1,useLegacyLights:w=!1,outputEncoding:S=l.LinearEncoding,toneMapping:y=l.NoToneMapping,toneMappingExposure:F=1,context:_e=void 0,powerPreference:De="default",preserveDrawingBuffer:ze=!1,clearColor:O,windowSize:ae=!1,preset:Be=void 0}=i.toRefs(e),{state:C,setState:G}=L(),{width:re,height:oe}=c.resolveUnref(ae)?c.useWindowSize():c.useElementSize(C.container),{logError:Fe,logWarning:We}=b(),{pixelRatio:se}=c.useDevicePixelRatio(),{pause:Ie,resume:Re}=_(),$=i.computed(()=>re.value/oe.value);!c.resolveUnref(ae)&&((ue=(fe=C.container)==null?void 0:fe.value)==null?void 0:ue.offsetHeight)===0&&We(`Oops... Seems like your canvas height is currently 0px, by default it takes the height of it's parent, so make sure it has some height with CSS.
-You could set windowSize=true to force the canvas to be the size of the window.`);const ie=()=>{t.value&&(t.value.setSize(re.value,oe.value),t.value.setPixelRatio(Math.min(se.value,2)))},ce=()=>{if(!t.value)return;const P=c.resolveUnref(Be);if(P){P in R||Fe("Renderer Preset must be one of these: "+Object.keys(R).join(", ")),X(t.value,R[P]);return}t.value.shadowMap.enabled=c.resolveUnref(h),t.value.shadowMap.type=c.resolveUnref(g),t.value.toneMapping=c.resolveUnref(y)||l.NoToneMapping,t.value.toneMappingExposure=c.resolveUnref(F),t.value.outputEncoding=c.resolveUnref(S)||l.LinearEncoding,O!=null&&O.value&&t.value.setClearColor(ve(c.resolveUnref(O))),t.value.useLegacyLights=c.resolveUnref(w)},Ne=()=>{const P=c.unrefElement(C.canvas);P&&(t.value=new l.WebGLRenderer({canvas:P,alpha:c.resolveUnref(a),antialias:c.resolveUnref(n),context:c.resolveUnref(_e),depth:c.resolveUnref(s),failIfMajorPerformanceCaveat:c.resolveUnref(o),logarithmicDepthBuffer:c.resolveUnref(f),powerPreference:c.resolveUnref(De),precision:c.resolveUnref(u),stencil:c.resolveUnref(m),preserveDrawingBuffer:c.resolveUnref(ze),premultipliedAlpha:c.resolveUnref(p)}),G("renderer",t.value),G("clock",new l.Clock),G("aspectRatio",$),ce(),ie(),Re(),r.value=!0)},Ge=()=>{t.value&&(t.value.dispose(),t.value=void 0,r.value=!1,Ie())};return i.watch([$,se],ie),i.watch([h,g,S,w,y,F,O],ce),i.watch(()=>[C.canvas,C.container],()=>{c.unrefElement(C.canvas)&&c.unrefElement(C.container)&&Ne()},{immediate:!0,deep:!0}),{renderer:t,isReady:r,dispose:Ge,aspectRatio:$}}const Q=e=>!!e&&e.constructor===Array;function Z(e){const t={nodes:{},materials:{}};return e&&e.traverse(r=>{r.name&&(t.nodes[r.name]=r),r.material&&!t.materials[r.material.name]&&(t.materials[r.material.name]=r.material)}),t}async function be(e,t,r,a,n){const{logError:s}=b(),f=new e;n&&n(f),r&&r(f);const u=(Array.isArray(t)?t:[t]).map(p=>new Promise((m,h)=>{f.load(p,g=>{g.scene&&Object.assign(g,Z(g.scene)),m(g)},a,g=>h(s("[useLoader] - Failed to load resource",g)))}));return Q(t)?await Promise.all(u):await u[0]}async function ye(e){const t=new l.LoadingManager,r=new l.TextureLoader(t),a=n=>new Promise((s,f)=>{r.load(n,o=>s(o),()=>null,()=>{f(new Error("[useTextures] - Failed to load texture"))})});if(Q(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:f,roughnessMap:o,metalnessMap:u,aoMap:p,alphaMap:m,matcap:h}=e;return{map:n?await a(n):null,displacementMap:s?await a(s):null,normalMap:f?await a(f):null,roughnessMap:o?await a(o):null,metalnessMap:u?await a(u):null,aoMap:p?await a(p):null,alphaMap:m?await a(m):null,matcap:h?await a(h):null}}}const v=["00","01","02","03","04","05","06","07","08","09","0a","0b","0c","0d","0e","0f","10","11","12","13","14","15","16","17","18","19","1a","1b","1c","1d","1e","1f","20","21","22","23","24","25","26","27","28","29","2a","2b","2c","2d","2e","2f","30","31","32","33","34","35","36","37","38","39","3a","3b","3c","3d","3e","3f","40","41","42","43","44","45","46","47","48","49","4a","4b","4c","4d","4e","4f","50","51","52","53","54","55","56","57","58","59","5a","5b","5c","5d","5e","5f","60","61","62","63","64","65","66","67","68","69","6a","6b","6c","6d","6e","6f","70","71","72","73","74","75","76","77","78","79","7a","7b","7c","7d","7e","7f","80","81","82","83","84","85","86","87","88","89","8a","8b","8c","8d","8e","8f","90","91","92","93","94","95","96","97","98","99","9a","9b","9c","9d","9e","9f","a0","a1","a2","a3","a4","a5","a6","a7","a8","a9","aa","ab","ac","ad","ae","af","b0","b1","b2","b3","b4","b5","b6","b7","b8","b9","ba","bb","bc","bd","be","bf","c0","c1","c2","c3","c4","c5","c6","c7","c8","c9","ca","cb","cc","cd","ce","cf","d0","d1","d2","d3","d4","d5","d6","d7","d8","d9","da","db","dc","dd","de","df","e0","e1","e2","e3","e4","e5","e6","e7","e8","e9","ea","eb","ec","ed","ee","ef","f0","f1","f2","f3","f4","f5","f6","f7","f8","f9","fa","fb","fc","fd","fe","ff"];function Ce(){const e=Math.random()*4294967295|0,t=Math.random()*4294967295|0,r=Math.random()*4294967295|0,a=Math.random()*4294967295|0;return(v[e&255]+v[e>>8&255]+v[e>>16&255]+v[e>>24&255]+"-"+v[t&255]+v[t>>8&255]+"-"+v[t>>16&15|64]+v[t>>24&255]+"-"+v[r&63|128]+v[r>>8&255]+"-"+v[r>>16&255]+v[r>>24&255]+v[a&255]+v[a>>8&255]+v[a>>16&255]+v[a>>24&255]).toLowerCase()}const E=Symbol();function H(){const e=i.shallowReactive({uuid:Ce(),camera:void 0,cameras:[],scene:void 0,renderer:void 0,aspectRatio:i.computed(()=>window.innerWidth/window.innerHeight)});function t(n){return e[n]}function r(n,s){e[n]=s}const a={state:e,...i.toRefs(e),getState:t,setState:r};return i.provide(E,a),a}const L=()=>{const e=i.inject(E),{logError:t}=b();return e||t("useTres must be used together with useTresProvider"),e},ee=i.shallowRef(new l.Raycaster),z=i.ref(new l.Vector2),Me=i.ref(null);function N(){const{setState:e}=L();e("raycaster",ee.value),e("pointer",z),e("currentInstance",Me);function t(r){z.value.x=r.clientX/window.innerWidth*2-1,z.value.y=-(r.clientY/window.innerHeight)*2+1}return window.addEventListener("pointermove",t),{raycaster:ee,pointer:z}}const Le=!0,te="[TresJS ▲ ■ ●] ";function b(){function e(a,n){console.error(`${te} ${a}`,n||"")}function t(a){console.warn(`${te} ${a}`)}function r(a,n){}return{logError:e,logWarning:t,logMessage:r}}function xe(){const{logWarning:e}=b();function t(a,n,s){let f=null;return a.traverse(o=>{o[n]===s&&(f=o)}),f||e(`Child with ${n} '${s}' not found.`),f}function r(a,n){return t(a,"name",n)}return{seek:t,seekByName:r}}const{logWarning:Se}=b();function Pe(e){for(const t in e)if(t.indexOf("on")===0)return!0;return!1}function qe(e){}let B=null;const ke={createElement(e,t,r,a){if(e==="template"||he(e))return null;let n;if(a===null&&(a={}),a!=null&&a.args?n=new U.value[e.replace("Tres","")](...a.args):n=new U.value[e.replace("Tres","")],n.isCamera){(!(a!=null&&a.position)||a!=null&&a.position.every(f=>f==0))&&Se("Camera is positioned at the center of the scene [0,0,0], if this is not intentional try setting a position if your scene seems empty 🤗");const{pushCamera:s}=A();s(n)}return(a==null?void 0:a.attach)===void 0&&(n.isMaterial?n.attach="material":n.isBufferGeometry&&(n.attach="geometry")),n},insert(e,t,r){if(B===null&&t.isScene&&(B=t),t===null&&(t=B),t!=null&&t.isObject3D&&(e!=null&&e.isObject3D)){const f=r?t.children.indexOf(r):0;e.parent=t,t.children.splice(f,0,e),e.dispatchEvent({type:"added"})}else typeof(e==null?void 0:e.attach)=="string"&&(e.__previousAttach=e[t==null?void 0:t.attach],t&&(t[e.attach]=e));const{onLoop:a}=_();let n=null,s=null;if(e&&e instanceof l.Mesh&&Pe(e)){const{raycaster:f}=N();a(()=>{var o,u,p;if(t!=null&&t.children&&e&&f){const m=f.value.intersectObjects(t.children);m.length>0&&m[0].object.uuid===e.uuid?(s=m[0],(n===null||n.object.uuid!==(s==null?void 0:s.object.uuid))&&((o=e.onPointerEnter)==null||o.call(e,s)),(u=e.onPointerMove)==null||u.call(e,s)):(s=null,n!==null&&((p=e.onPointerLeave)==null||p.call(e,n))),n=s}}),c.useEventListener(window,"click",()=>{var o;s!==null&&((o=e.onClick)==null||o.call(e,s))})}},remove(e){if(!e)return;const t=e.parentNode;t&&t.removeChild(e)},patchProp(e,t,r,a){if(e){let n=e,s=t;const f=D(s);let o=n==null?void 0:n[f];if(e.parent||(e.parent=B),n.type==="BufferGeometry"){n.setAttribute(D(s),new l.BufferAttribute(...a));return}if(s.includes("-")&&o===void 0){const p=s.split("-");o=p.reduce((m,h)=>m[D(h)],n),s=p.pop(),o!=null&&o.set||(n=p.reduce((m,h)=>m[D(h)],n))}let u=a;if(u===""&&(u=!0),c.isFunction(o)){Array.isArray(u)?e[f](...u):e[f](u);return}!(o!=null&&o.set)&&!c.isFunction(o)?n[f]=u:o.constructor===u.constructor&&(o!=null&&o.copy)?o==null||o.copy(u):Array.isArray(u)?o.set(...u):!o.isColor&&o.setScalar?o.setScalar(u):o.set(u)}},parentNode(e){return(e==null?void 0:e.parent)||null},createText:()=>void 0,createComment:()=>void 0,setText:()=>void 0,setElementText:()=>void 0,nextSibling:()=>void 0,querySelector:()=>void 0,setScopeId:()=>void 0,cloneNode:()=>void 0,insertStaticContent:()=>void 0},{createApp:Oe}=i.createRenderer(ke),Ue=e=>{const t=Oe(r);function r(){return e&&e.default?e.default():[]}return t};W(q);const{logWarning:Ae}=b(),Te=i.defineComponent({name:"TresScene",props:["shadows","shadowMapType","physicallyCorrectLights","useLegacyLights","outputEncoding","toneMapping","toneMappingExposure","context","powerPreference","preserveDrawingBuffer","clearColor","windowSize","preset"],setup(e,{slots:t,expose:r}){e.physicallyCorrectLights===!0&&Ae("physicallyCorrectLights is deprecated, useLegacyLights is now false by default");const a=i.ref(),n=i.ref(),s=new q.Scene,{setState:f}=L();f("scene",s),f("canvas",n),f("container",a);const{pushCamera:o}=A();o(new l.PerspectiveCamera),i.onMounted(()=>{u()}),i.onUnmounted(()=>{f("renderer",null)});function u(){const{renderer:h}=J(e),{activeCamera:g}=A(),{onLoop:x}=_(),{raycaster:w,pointer:S}=N();i.watchEffect(()=>{g.value&&w.value.setFromCamera(S.value,g.value)}),x(()=>{var y;g.value&&((y=h.value)==null||y.render(s,g.value))})}let p;function m(){p=Ue(t),p.provide("useTres",L()),p.provide("extend",W),p.mount(s)}return m(),r({scene:s}),()=>i.h(i.h("div",{ref:a,"data-scene":s.uuid,key:s.uuid,style:{position:"relative",width:"100%",height:"100%",pointerEvents:"auto",touchAction:"none"}},[i.h("div",{style:{width:"100%",height:"100%"}},[i.h("canvas",{ref:n,"data-scene":s.uuid,style:{display:"block",width:"100%",height:"100%",position:e.windowSize?"fixed":"absolute",top:0,left:0}})])]))}}),ne=i.defineComponent({name:"TresCanvas",props:["shadows","shadowMapType","physicallyCorrectLights","useLegacyLights","outputEncoding","toneMapping","toneMappingExposure","context","powerPreference","preserveDrawingBuffer","clearColor","windowSize","preset"],setup(e,{slots:t}){return H(),()=>i.h(Te,e,t)}}),je={install(e){e.component("TresCanvas",ne)}};d.CameraType=V,d.TresCanvas=ne,d.catalogue=U,d.default=je,d.extend=W,d.isProd=Le,d.trasverseObjects=Z,d.useCamera=A,d.useLoader=be,d.useLogger=b,d.useRaycaster=N,d.useRenderLoop=_,d.useRenderer=J,d.useSeek=xe,d.useTexture=ye,d.useTres=L,d.useTresProvider=H,Object.defineProperties(d,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});
+(function(d,i){typeof exports=="object"&&typeof module<"u"?i(exports,require("vue"),require("three"),require("@vueuse/core")):typeof define=="function"&&define.amd?define(["exports","vue","three","@vueuse/core"],i):(d=typeof globalThis<"u"?globalThis:d||self,i(d.tres={},d.Vue,d.Three,d.VueUseCore))})(this,function(d,i,l,c){"use strict";function le(e){const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const r in e)if(r!=="default"){const a=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(t,r,a.get?a:{enumerable:!0,get:()=>e[r]})}}return t.default=e,Object.freeze(t)}const q=le(l),U=i.ref({uuid:l.MathUtils.generateUUID()}),W=e=>void Object.assign(U.value,e);var V=(e=>(e.Perspective="Perspective",e.Orthographic="Orthographic",e))(V||{});const de=45;let C;function A(){const{state:e,setState:t,aspectRatio:r}=M();function a(o="Perspective",u){var p,m,h;if(o==="Perspective"){const{near:v,far:x,fov:w}=u||{near:.1,far:1e3,fov:de};C=new l.PerspectiveCamera(w,((p=e.aspectRatio)==null?void 0:p.value)||window.innerWidth/window.innerHeight,v,x),(m=e.cameras)==null||m.push(C)}else{const{left:v,right:x,top:w,bottom:S,near:b,far:F}=u||{left:-100,right:100,top:100,bottom:-100,near:.1,far:1e3};C=new l.OrthographicCamera(v,x,w,S,b,F),(h=e.cameras)==null||h.push(C)}return e.camera=C,t("camera",e.camera),C}function n(){var o;e.camera instanceof l.PerspectiveCamera&&e.aspectRatio&&(e.camera.aspect=e.aspectRatio.value),(o=e.camera)==null||o.updateProjectionMatrix()}function s(o){var u;(u=e.cameras)==null||u.push(o),o instanceof l.PerspectiveCamera&&e.aspectRatio&&(o.aspect=e.aspectRatio.value),o.updateProjectionMatrix(),t("camera",o)}function f(){e.cameras=[]}return i.watchEffect(()=>{r!=null&&r.value&&n()}),{activeCamera:i.toRef(e,"camera"),createCamera:a,updateCamera:n,pushCamera:s,clearCameras:f}}const Y=c.createEventHook(),K=c.createEventHook(),I=c.createEventHook(),k=new l.Clock;let j=0,T=0;const{pause:pe,resume:me,isActive:ve}=c.useRafFn(()=>{Y.trigger({delta:j,elapsed:T,clock:k}),K.trigger({delta:j,elapsed:T,clock:k}),I.trigger({delta:j,elapsed:T,clock:k})},{immediate:!1});I.on(()=>{j=k.getDelta(),T=k.getElapsedTime()});function _(){return{onBeforeLoop:Y.on,onLoop:K.on,onAfterLoop:I.on,pause:pe,resume:me,isActive:ve}}function ge(e){return e instanceof l.Color?e:Array.isArray(e)?new l.Color(...e):new l.Color(e)}const R={realistic:{outputEncoding:l.sRGBEncoding,toneMapping:l.ACESFilmicToneMapping,toneMappingExposure:3,shadowMap:{enabled:!0,type:l.PCFSoftShadowMap}}},X=(e,t)=>{for(const r of Object.keys(t))t[r]instanceof Object&&Object.assign(t[r],X(e[r],t[r]));return Object.assign(e||{},t),e},he=we("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 D(e){return e.replace(/-([a-z])/g,(t,r)=>r.toUpperCase())}function we(e,t){const r=Object.create(null),a=e.split(",");for(let n=0;n<a.length;n++)r[a[n]]=!0;return t?n=>!!r[n.toLowerCase()]:n=>!!r[n]}function J(e){var fe,ue;const t=i.shallowRef(),r=i.ref(!1),{alpha:a=!0,antialias:n=!0,depth:s,logarithmicDepthBuffer:f,failIfMajorPerformanceCaveat:o,precision:u,premultipliedAlpha:p,stencil:m,shadows:h=!1,shadowMapType:v=l.PCFShadowMap,physicallyCorrectLights:x=!1,useLegacyLights:w=!1,outputEncoding:S=l.LinearEncoding,toneMapping:b=l.NoToneMapping,toneMappingExposure:F=1,context:_e=void 0,powerPreference:De="default",preserveDrawingBuffer:ze=!1,clearColor:O,windowSize:ae=!1,preset:Be=void 0}=i.toRefs(e),{state:y,setState:G}=M(),{width:re,height:oe}=c.resolveUnref(ae)?c.useWindowSize():c.useElementSize(y.container),{logError:Fe,logWarning:We}=L(),{pixelRatio:se}=c.useDevicePixelRatio(),{pause:Ie,resume:Re}=_(),$=i.computed(()=>re.value/oe.value);!c.resolveUnref(ae)&&((ue=(fe=y.container)==null?void 0:fe.value)==null?void 0:ue.offsetHeight)===0&&We(`Oops... Seems like your canvas height is currently 0px, by default it takes the height of it's parent, so make sure it has some height with CSS.
+You could set windowSize=true to force the canvas to be the size of the window.`);const ie=()=>{t.value&&(t.value.setSize(re.value,oe.value),t.value.setPixelRatio(Math.min(se.value,2)))},ce=()=>{if(!t.value)return;const P=c.resolveUnref(Be);if(P){P in R||Fe("Renderer Preset must be one of these: "+Object.keys(R).join(", ")),X(t.value,R[P]);return}t.value.shadowMap.enabled=c.resolveUnref(h),t.value.shadowMap.type=c.resolveUnref(v),t.value.toneMapping=c.resolveUnref(b)||l.NoToneMapping,t.value.toneMappingExposure=c.resolveUnref(F),t.value.outputEncoding=c.resolveUnref(S)||l.LinearEncoding,O!=null&&O.value&&t.value.setClearColor(ge(c.resolveUnref(O))),t.value.useLegacyLights=c.resolveUnref(w)},Ne=()=>{const P=c.unrefElement(y.canvas);P&&(t.value=new l.WebGLRenderer({canvas:P,alpha:c.resolveUnref(a),antialias:c.resolveUnref(n),context:c.resolveUnref(_e),depth:c.resolveUnref(s),failIfMajorPerformanceCaveat:c.resolveUnref(o),logarithmicDepthBuffer:c.resolveUnref(f),powerPreference:c.resolveUnref(De),precision:c.resolveUnref(u),stencil:c.resolveUnref(m),preserveDrawingBuffer:c.resolveUnref(ze),premultipliedAlpha:c.resolveUnref(p)}),G("renderer",t.value),G("clock",new l.Clock),G("aspectRatio",$),ce(),ie(),Re(),r.value=!0)},Ge=()=>{t.value&&(t.value.dispose(),t.value=void 0,r.value=!1,Ie())};return i.watch([$,se],ie),i.watch([h,v,S,w,b,F,O],ce),i.watch(()=>[y.canvas,y.container],()=>{c.unrefElement(y.canvas)&&c.unrefElement(y.container)&&Ne()},{immediate:!0,deep:!0}),{renderer:t,isReady:r,dispose:Ge,aspectRatio:$}}const Q=e=>!!e&&e.constructor===Array;function Z(e){const t={nodes:{},materials:{}};return e&&e.traverse(r=>{r.name&&(t.nodes[r.name]=r),r.material&&!t.materials[r.material.name]&&(t.materials[r.material.name]=r.material)}),t}async function be(e,t,r,a,n){const{logError:s}=L(),f=new e;n&&n(f),r&&r(f);const u=(Array.isArray(t)?t:[t]).map(p=>new Promise((m,h)=>{f.load(p,v=>{v.scene&&Object.assign(v,Z(v.scene)),m(v)},a,v=>h(s("[useLoader] - Failed to load resource",v)))}));return Q(t)?await Promise.all(u):await u[0]}async function ye(e){const t=new l.LoadingManager,r=new l.TextureLoader(t),a=n=>new Promise((s,f)=>{r.load(n,o=>s(o),()=>null,()=>{f(new Error("[useTextures] - Failed to load texture"))})});if(Q(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:f,roughnessMap:o,metalnessMap:u,aoMap:p,alphaMap:m,matcap:h}=e;return{map:n?await a(n):null,displacementMap:s?await a(s):null,normalMap:f?await a(f):null,roughnessMap:o?await a(o):null,metalnessMap:u?await a(u):null,aoMap:p?await a(p):null,alphaMap:m?await a(m):null,matcap:h?await a(h):null}}}const g=["00","01","02","03","04","05","06","07","08","09","0a","0b","0c","0d","0e","0f","10","11","12","13","14","15","16","17","18","19","1a","1b","1c","1d","1e","1f","20","21","22","23","24","25","26","27","28","29","2a","2b","2c","2d","2e","2f","30","31","32","33","34","35","36","37","38","39","3a","3b","3c","3d","3e","3f","40","41","42","43","44","45","46","47","48","49","4a","4b","4c","4d","4e","4f","50","51","52","53","54","55","56","57","58","59","5a","5b","5c","5d","5e","5f","60","61","62","63","64","65","66","67","68","69","6a","6b","6c","6d","6e","6f","70","71","72","73","74","75","76","77","78","79","7a","7b","7c","7d","7e","7f","80","81","82","83","84","85","86","87","88","89","8a","8b","8c","8d","8e","8f","90","91","92","93","94","95","96","97","98","99","9a","9b","9c","9d","9e","9f","a0","a1","a2","a3","a4","a5","a6","a7","a8","a9","aa","ab","ac","ad","ae","af","b0","b1","b2","b3","b4","b5","b6","b7","b8","b9","ba","bb","bc","bd","be","bf","c0","c1","c2","c3","c4","c5","c6","c7","c8","c9","ca","cb","cc","cd","ce","cf","d0","d1","d2","d3","d4","d5","d6","d7","d8","d9","da","db","dc","dd","de","df","e0","e1","e2","e3","e4","e5","e6","e7","e8","e9","ea","eb","ec","ed","ee","ef","f0","f1","f2","f3","f4","f5","f6","f7","f8","f9","fa","fb","fc","fd","fe","ff"];function Ce(){const e=Math.random()*4294967295|0,t=Math.random()*4294967295|0,r=Math.random()*4294967295|0,a=Math.random()*4294967295|0;return(g[e&255]+g[e>>8&255]+g[e>>16&255]+g[e>>24&255]+"-"+g[t&255]+g[t>>8&255]+"-"+g[t>>16&15|64]+g[t>>24&255]+"-"+g[r&63|128]+g[r>>8&255]+"-"+g[r>>16&255]+g[r>>24&255]+g[a&255]+g[a>>8&255]+g[a>>16&255]+g[a>>24&255]).toLowerCase()}const E=Symbol();function H(){const e=i.shallowReactive({uuid:Ce(),camera:void 0,cameras:[],scene:void 0,renderer:void 0,aspectRatio:i.computed(()=>window.innerWidth/window.innerHeight)});function t(n){return e[n]}function r(n,s){e[n]=s}const a={state:e,...i.toRefs(e),getState:t,setState:r};return i.provide(E,a),a}const M=()=>i.inject(E,{state:i.shallowReactive({camera:void 0,cameras:[],scene:void 0,renderer:void 0})}),ee=i.shallowRef(new l.Raycaster),z=i.ref(new l.Vector2),Me=i.ref(null);function N(){const{setState:e}=M();e("raycaster",ee.value),e("pointer",z),e("currentInstance",Me);function t(r){z.value.x=r.clientX/window.innerWidth*2-1,z.value.y=-(r.clientY/window.innerHeight)*2+1}return window.addEventListener("pointermove",t),{raycaster:ee,pointer:z}}const Le=!0,te="[TresJS ▲ ■ ●] ";function L(){function e(a,n){console.error(`${te} ${a}`,n||"")}function t(a){console.warn(`${te} ${a}`)}function r(a,n){}return{logError:e,logWarning:t,logMessage:r}}function xe(){const{logWarning:e}=L();function t(a,n,s){let f=null;return a.traverse(o=>{o[n]===s&&(f=o)}),f||e(`Child with ${n} '${s}' not found.`),f}function r(a,n){return t(a,"name",n)}return{seek:t,seekByName:r}}const{logWarning:Se}=L();function Pe(e){for(const t in e)if(t.indexOf("on")===0)return!0;return!1}function qe(e){}let B=null;const ke={createElement(e,t,r,a){if(e==="template"||he(e))return null;let n;if(a===null&&(a={}),a!=null&&a.args?n=new U.value[e.replace("Tres","")](...a.args):n=new U.value[e.replace("Tres","")],n.isCamera){(!(a!=null&&a.position)||a!=null&&a.position.every(f=>f==0))&&Se("Camera is positioned at the center of the scene [0,0,0], if this is not intentional try setting a position if your scene seems empty 🤗");const{pushCamera:s}=A();s(n)}return(a==null?void 0:a.attach)===void 0&&(n.isMaterial?n.attach="material":n.isBufferGeometry&&(n.attach="geometry")),n},insert(e,t,r){if(B===null&&t.isScene&&(B=t),t===null&&(t=B),t!=null&&t.isObject3D&&(e!=null&&e.isObject3D)){const f=r?t.children.indexOf(r):0;e.parent=t,t.children.splice(f,0,e),e.dispatchEvent({type:"added"})}else typeof(e==null?void 0:e.attach)=="string"&&(e.__previousAttach=e[t==null?void 0:t.attach],t&&(t[e.attach]=e));const{onLoop:a}=_();let n=null,s=null;if(e&&e instanceof l.Mesh&&Pe(e)){const{raycaster:f}=N();a(()=>{var o,u,p;if(t!=null&&t.children&&e&&f){const m=f.value.intersectObjects(t.children);m.length>0&&m[0].object.uuid===e.uuid?(s=m[0],(n===null||n.object.uuid!==(s==null?void 0:s.object.uuid))&&((o=e.onPointerEnter)==null||o.call(e,s)),(u=e.onPointerMove)==null||u.call(e,s)):(s=null,n!==null&&((p=e.onPointerLeave)==null||p.call(e,n))),n=s}}),c.useEventListener(window,"click",()=>{var o;s!==null&&((o=e.onClick)==null||o.call(e,s))})}},remove(e){if(!e)return;const t=e.parentNode;t&&t.removeChild(e)},patchProp(e,t,r,a){if(e){let n=e,s=t;const f=D(s);let o=n==null?void 0:n[f];if(e.parent||(e.parent=B),n.type==="BufferGeometry"){n.setAttribute(D(s),new l.BufferAttribute(...a));return}if(s.includes("-")&&o===void 0){const p=s.split("-");o=p.reduce((m,h)=>m[D(h)],n),s=p.pop(),o!=null&&o.set||(n=p.reduce((m,h)=>m[D(h)],n))}let u=a;if(u===""&&(u=!0),c.isFunction(o)){Array.isArray(u)?e[f](...u):e[f](u);return}!(o!=null&&o.set)&&!c.isFunction(o)?n[f]=u:o.constructor===u.constructor&&(o!=null&&o.copy)?o==null||o.copy(u):Array.isArray(u)?o.set(...u):!o.isColor&&o.setScalar?o.setScalar(u):o.set(u)}},parentNode(e){return(e==null?void 0:e.parent)||null},createText:()=>void 0,createComment:()=>void 0,setText:()=>void 0,setElementText:()=>void 0,nextSibling:()=>void 0,querySelector:()=>void 0,setScopeId:()=>void 0,cloneNode:()=>void 0,insertStaticContent:()=>void 0},{createApp:Oe}=i.createRenderer(ke),Ue=e=>{const t=Oe(r);function r(){return e&&e.default?e.default():[]}return t};W(q);const{logWarning:Ae}=L(),je=i.defineComponent({name:"TresScene",props:["shadows","shadowMapType","physicallyCorrectLights","useLegacyLights","outputEncoding","toneMapping","toneMappingExposure","context","powerPreference","preserveDrawingBuffer","clearColor","windowSize","preset"],setup(e,{slots:t,expose:r}){e.physicallyCorrectLights===!0&&Ae("physicallyCorrectLights is deprecated, useLegacyLights is now false by default");const a=i.ref(),n=i.ref(),s=new q.Scene,{setState:f}=M();f("scene",s),f("canvas",n),f("container",a);const{pushCamera:o}=A();o(new l.PerspectiveCamera),i.onMounted(()=>{u()}),i.onUnmounted(()=>{f("renderer",null)});function u(){const{renderer:h}=J(e),{activeCamera:v}=A(),{onLoop:x}=_(),{raycaster:w,pointer:S}=N();i.watchEffect(()=>{v.value&&w.value.setFromCamera(S.value,v.value)}),x(()=>{var b;v.value&&((b=h.value)==null||b.render(s,v.value))})}let p;function m(){p=Ue(t),p.provide("useTres",M()),p.provide("extend",W),p.mount(s)}return m(),r({scene:s}),()=>i.h(i.h("div",{ref:a,"data-scene":s.uuid,key:s.uuid,style:{position:"relative",width:"100%",height:"100%",pointerEvents:"auto",touchAction:"none"}},[i.h("div",{style:{width:"100%",height:"100%"}},[i.h("canvas",{ref:n,"data-scene":s.uuid,style:{display:"block",width:"100%",height:"100%",position:e.windowSize?"fixed":"absolute",top:0,left:0}})])]))}}),ne=i.defineComponent({name:"TresCanvas",props:["shadows","shadowMapType","physicallyCorrectLights","useLegacyLights","outputEncoding","toneMapping","toneMappingExposure","context","powerPreference","preserveDrawingBuffer","clearColor","windowSize","preset"],setup(e,{slots:t,expose:r}){const a=H();return r(a),()=>i.h(je,e,t)}}),Te={install(e){e.component("TresCanvas",ne)}};d.CameraType=V,d.TresCanvas=ne,d.catalogue=U,d.default=Te,d.extend=W,d.isProd=Le,d.trasverseObjects=Z,d.useCamera=A,d.useLoader=be,d.useLogger=L,d.useRaycaster=N,d.useRenderLoop=_,d.useRenderer=J,d.useSeek=xe,d.useTexture=ye,d.useTres=M,d.useTresProvider=H,Object.defineProperties(d,{__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.0.0-beta.0",
+  "version": "2.0.0-beta.1",
   "type": "module",
   "author": "Alvaro Saburido <hola@alvarosaburido.dev> (https://github.com/alvarosabu/)",
   "files": [
@@ -67,37 +67,37 @@
     "@stackblitz/sdk": "^1.8.1",
     "@tresjs/cientos": "2.0.0-alpha.5",
     "@types/three": "latest",
-    "@typescript-eslint/eslint-plugin": "^5.42.0",
-    "@typescript-eslint/parser": "^5.42.0",
-    "@vitejs/plugin-vue": "^4.0.0",
-    "@vitest/coverage-c8": "^0.29.2",
+    "@typescript-eslint/eslint-plugin": "^5.57.1",
+    "@typescript-eslint/parser": "^5.57.1",
+    "@vitejs/plugin-vue": "^4.1.0",
+    "@vitest/coverage-c8": "^0.29.8",
     "@vitest/ui": "^0.29.2",
-    "@vue/test-utils": "^2.3.1",
-    "eslint": "^8.26.0",
+    "@vue/test-utils": "^2.3.2",
+    "eslint": "^8.37.0",
     "eslint-config-prettier": "^8.5.0",
-    "eslint-plugin-vue": "^9.7.0",
+    "eslint-plugin-vue": "^9.10.0",
     "gsap": "^3.11.4",
     "happy-dom": "^8.7.1",
     "jsdom": "^21.1.0",
     "kolorist": "^1.7.0",
     "pathe": "^1.1.0",
-    "prettier": "^2.8.6",
-    "release-it": "^15.9.1",
+    "prettier": "^2.8.7",
+    "release-it": "^15.10.1",
     "rollup-plugin-analyzer": "^4.0.0",
     "rollup-plugin-copy": "^3.4.0",
     "rollup-plugin-visualizer": "^5.9.0",
     "three": "latest",
-    "unocss": "^0.48.0",
+    "unocss": "^0.50.6",
     "unplugin": "^1.3.1",
     "unplugin-vue-components": "^0.24.1",
-    "vite": "^4.1.4",
+    "vite": "^4.2.1",
     "vite-plugin-banner": "^0.7.0",
-    "vite-plugin-dts": "2.1.0",
-    "vite-plugin-inspect": "^0.7.16",
-    "vite-plugin-require-transform": "^1.0.9",
+    "vite-plugin-dts": "2.2.0",
+    "vite-plugin-inspect": "^0.7.18",
+    "vite-plugin-require-transform": "^1.0.12",
     "vite-svg-loader": "^4.0.0",
-    "vitepress": "1.0.0-alpha.38",
-    "vitest": "^0.29.2",
+    "vitepress": "1.0.0-alpha.65",
+    "vitest": "^0.29.8",
     "vue-demi": "^0.13.11"
   }
 }