@tresjs/core 2.4.0-next.2 → 2.4.0-next.3

package/dist/composables/useCamera/index.d.ts

@@ -1,8 +1,7 @@
 import { ComputedRef } from "vue";
 export declare function useCamera(sizes: any): {
-    cameras: import("vue").ShallowRef<TresCamera[]>;
+    cameras: import("vue").ShallowReactive<TresCamera[]>;
     camera: ComputedRef<any>;
     addCamera: (camera: TresCamera, active?: boolean) => void;
     setCameraToActive: (cameraId: string) => void;
-    clearCameras: () => void;
 };

package/dist/tres.js

@@ -1,55 +1,52 @@
 /**
  * name: @tresjs/core
- * version: v2.4.0-next.2
+ * version: v2.4.0-next.3
  * (c) 2023
  * description: Declarative ThreeJS using Vue Components
  * author: Alvaro Saburido <hola@alvarosaburido.dev> (https://github.com/alvarosabu/)
  */
-import { shallowRef as A, computed as R, watchEffect as $, ref as U, toRefs as ne, watch as W, shallowReactive as ae, provide as oe, inject as re, onUnmounted as ie, reactive as Ce, readonly as z, createRenderer as Te, defineComponent as Pe, useSlots as _e, onMounted as xe, openBlock as he, createElementBlock as Ae, normalizeStyle as Re } from "vue";
+import { shallowReactive as $, computed as A, watchEffect as U, shallowRef as j, ref as Y, toRefs as oe, watch as W, provide as ae, inject as re, onUnmounted as ie, reactive as Te, readonly as z, createRenderer as Ce, defineComponent as Pe, useSlots as _e, onMounted as xe, openBlock as he, createElementBlock as Ae, normalizeStyle as Re } from "vue";
 import * as Se from "three";
-import { PerspectiveCamera as se, Clock as Le, Vector3 as Oe, Color as G, SRGBColorSpace as ke, ACESFilmicToneMapping as Ie, PCFSoftShadowMap as Be, PCFShadowMap as De, LinearSRGBColorSpace as J, NoToneMapping as X, WebGLRenderer as je, LoadingManager as Ve, TextureLoader as ze, Raycaster as Ge, Vector2 as He, BufferAttribute as Fe, Scene as Ne } from "three";
-import { createEventHook as S, useRafFn as We, useDevicePixelRatio as $e, unrefElement as Q, toValue as m, usePointer as Ue, useElementBounding as Ye, useWindowSize as qe, useElementSize as Ke } from "@vueuse/core";
+import { PerspectiveCamera as se, Clock as Le, Vector3 as Oe, Color as G, SRGBColorSpace as ke, ACESFilmicToneMapping as Ie, PCFSoftShadowMap as Be, PCFShadowMap as De, LinearSRGBColorSpace as X, NoToneMapping as Q, WebGLRenderer as je, LoadingManager as Ve, TextureLoader as ze, Raycaster as Ge, Vector2 as He, BufferAttribute as Fe, Scene as Ne } from "three";
+import { createEventHook as R, useRafFn as We, useDevicePixelRatio as $e, unrefElement as Z, toValue as m, usePointer as Ue, useElementBounding as Ye, useWindowSize as qe, useElementSize as Ke } from "@vueuse/core";
 function Je(e) {
-  const n = A([]), o = R(() => n.value.find((c) => c.userData.IS_ACTIVE_CAMERA));
-  function t(c, a = !0) {
-    n.value.push(c), a && r(c.uuid);
+  const n = $([]), o = A(() => n.find((i) => i.userData.IS_ACTIVE_CAMERA));
+  function t(i, s = !0) {
+    n.push(i), s && r(i.uuid);
   }
-  function r(c) {
-    const a = n.value.find((s) => s.uuid === c);
-    a && (n.value.forEach((s) => s.userData.IS_ACTIVE_CAMERA = !1), a.userData.IS_ACTIVE_CAMERA = !0);
+  function r(i) {
+    const s = n.find((a) => a.uuid === i);
+    s && (n.forEach((a) => a.userData.IS_ACTIVE_CAMERA = !1), s.userData.IS_ACTIVE_CAMERA = !0);
   }
-  function i() {
-    n.value = [];
-  }
-  return $(() => {
-    var c;
-    (c = e.aspectRatio) != null && c.value && (console.log("camera watcher aspectRatio", e.aspectRatio.value), n.value.forEach((a) => {
-      a instanceof se && (a.aspect = e.aspectRatio.value), a.updateProjectionMatrix();
+  return U(() => {
+    var i;
+    (i = e.aspectRatio) != null && i.value && (console.log("camera watcher aspectRatio", e.aspectRatio.value), n.forEach((s) => {
+      s instanceof se && (s.aspect = e.aspectRatio.value), s.updateProjectionMatrix();
     }));
   }), {
     cameras: n,
     camera: o,
     addCamera: t,
-    setCameraToActive: r,
-    clearCameras: i
+    setCameraToActive: r
+    /*     clearCameras, */
   };
 }
-const ce = S(), ue = S(), Y = S(), h = new Le();
-let D = 0, j = 0;
+const ce = R(), ue = R(), q = R(), h = new Le();
+let B = 0, D = 0;
 const { pause: Xe, resume: Qe, isActive: Ze } = We(
   () => {
-    ce.trigger({ delta: D, elapsed: j, clock: h }), ue.trigger({ delta: D, elapsed: j, clock: h }), Y.trigger({ delta: D, elapsed: j, clock: h });
+    ce.trigger({ delta: B, elapsed: D, clock: h }), ue.trigger({ delta: B, elapsed: D, clock: h }), q.trigger({ delta: B, elapsed: D, clock: h });
   },
   { immediate: !1 }
 );
-Y.on(() => {
-  D = h.getDelta(), j = h.getElapsedTime();
+q.on(() => {
+  B = h.getDelta(), D = h.getElapsedTime();
 });
 function fe() {
   return {
     onBeforeLoop: ce.on,
     onLoop: ue.on,
-    onAfterLoop: Y.on,
+    onAfterLoop: q.on,
     pause: Xe,
     resume: Qe,
     isActive: Ze
@@ -75,30 +72,30 @@ const H = {
   for (const o of Object.keys(n))
     n[o] instanceof Object && Object.assign(n[o], le(e[o], n[o]));
   return Object.assign(e || {}, n), e;
-}, tt = "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", nt = /* @__PURE__ */ at(tt);
-function B(e) {
+}, tt = "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", nt = /* @__PURE__ */ ot(tt);
+function I(e) {
   return e.replace(/-([a-z])/g, (n, o) => o.toUpperCase());
 }
-function at(e, n) {
+function ot(e, n) {
   const o = /* @__PURE__ */ Object.create(null), t = e.split(",");
   for (let r = 0; r < t.length; r++)
     o[t[r]] = !0;
   return n ? (r) => !!o[r.toLowerCase()] : (r) => !!o[r];
 }
-const ot = (e, n) => {
+const at = (e, n) => {
   const o = /* @__PURE__ */ new Set(), t = [];
   for (const r of e) {
     const i = n(r);
     o.has(i) || (o.add(i), t.push(r));
   }
   return t;
-}, _t = !0, Z = "[TresJS ▲ ■ ●] ";
+}, _t = !0, ee = "[TresJS ▲ ■ ●] ";
 function P() {
   function e(t, r) {
-    console.error(`${Z} ${t}`, r || "");
+    console.error(`${ee} ${t}`, r || "");
   }
   function n(t) {
-    console.warn(`${Z} ${t}`);
+    console.warn(`${ee} ${t}`);
   }
   function o(t, r) {
   }
@@ -109,11 +106,11 @@ function P() {
   };
 }
 function rt(e, n, o) {
-  const t = A(), r = U(!1), {
+  const t = j(), r = Y(!1), {
     alpha: i = !0,
-    antialias: c = !0,
+    antialias: s = !0,
     depth: a,
-    logarithmicDepthBuffer: s,
+    logarithmicDepthBuffer: c,
     failIfMajorPerformanceCaveat: u,
     precision: l,
     premultipliedAlpha: p,
@@ -121,55 +118,55 @@ function rt(e, n, o) {
     shadows: M = !1,
     shadowMapType: E = De,
     useLegacyLights: b = !1,
-    outputColorSpace: g = J,
-    toneMapping: y = X,
+    outputColorSpace: g = X,
+    toneMapping: y = Q,
     toneMappingExposure: _ = 1,
-    context: L = void 0,
-    powerPreference: O = "default",
-    preserveDrawingBuffer: k = !1,
-    clearColor: T,
+    context: S = void 0,
+    powerPreference: L = "default",
+    preserveDrawingBuffer: O = !1,
+    clearColor: C,
     windowSize: f = !1,
     preset: v = void 0
-  } = ne(o), { cameras: Et, setRenderer: ge, sizes: V } = n, { logError: we, logWarning: yt } = P(), { pixelRatio: I } = $e(), { pause: be, resume: Ee } = fe(), q = () => {
-    t.value && (t.value.setSize(V.width.value, V.height.value), t.value.setPixelRatio(Math.min(I.value, 2)));
-  }, K = () => {
+  } = oe(o), { cameras: Et, setRenderer: ge, sizes: V } = n, { logError: we, logWarning: yt } = P(), { pixelRatio: k } = $e(), { pause: be, resume: Ee } = fe(), K = () => {
+    t.value && (t.value.setSize(V.width.value, V.height.value), t.value.setPixelRatio(Math.min(k.value, 2)));
+  }, J = () => {
     if (!t.value)
       return;
-    const C = m(v);
-    if (C) {
-      C in H || we("Renderer Preset must be one of these: " + Object.keys(H).join(", ")), le(t.value, H[C]);
+    const T = m(v);
+    if (T) {
+      T in H || we("Renderer Preset must be one of these: " + Object.keys(H).join(", ")), le(t.value, H[T]);
       return;
     }
-    t.value.shadowMap.enabled = m(M), t.value.shadowMap.type = m(E), t.value.toneMapping = m(y) || X, t.value.toneMappingExposure = m(_), t.value.outputColorSpace = m(g) || J, T != null && T.value && t.value.setClearColor(et(m(T))), t.value.useLegacyLights = m(b);
+    t.value.shadowMap.enabled = m(M), t.value.shadowMap.type = m(E), t.value.toneMapping = m(y) || Q, t.value.toneMappingExposure = m(_), t.value.outputColorSpace = m(g) || X, C != null && C.value && t.value.setClearColor(et(m(C))), t.value.useLegacyLights = m(b);
   }, ye = () => {
-    const C = Q(e);
-    console.count("init renderer"), C && (t.value = new je({
-      canvas: C,
+    const T = Z(e);
+    console.count("init renderer"), T && (t.value = new je({
+      canvas: T,
       alpha: m(i),
-      antialias: m(c),
-      context: m(L),
+      antialias: m(s),
+      context: m(S),
       depth: m(a),
       failIfMajorPerformanceCaveat: m(u),
-      logarithmicDepthBuffer: m(s),
-      powerPreference: m(O),
+      logarithmicDepthBuffer: m(c),
+      powerPreference: m(L),
       precision: m(l),
       stencil: m(d),
-      preserveDrawingBuffer: m(k),
+      preserveDrawingBuffer: m(O),
       premultipliedAlpha: m(p)
-    }), ge(t.value), K(), q(), Ee(), r.value = !0);
+    }), ge(t.value), J(), K(), Ee(), r.value = !0);
   }, Me = () => {
     t.value && (t.value.dispose(), t.value = void 0, r.value = !1, be());
   };
-  return $(() => {
-    var C;
-    ((C = V.aspectRatio) != null && C.value || I != null && I.value) && q();
+  return U(() => {
+    var T;
+    ((T = V.aspectRatio) != null && T.value || k != null && k.value) && K();
   }), W(
-    [M, E, g, b, y, _, T],
-    K
+    [M, E, g, b, y, _, C],
+    J
   ), W(
     e,
     () => {
-      Q(e) && ye();
+      Z(e) && ye();
     },
     { immediate: !0, deep: !0 }
   ), {
@@ -178,7 +175,7 @@ function rt(e, n, o) {
     dispose: Me
   };
 }
-const ee = (e) => typeof e == "function", de = (e) => !!e && e.constructor === Array;
+const te = (e) => typeof e == "function", de = (e) => !!e && e.constructor === Array;
 function it(e) {
   const n = { nodes: {}, materials: {} };
   return e && e.traverse((o) => {
@@ -186,11 +183,11 @@ function it(e) {
   }), n;
 }
 async function xt(e, n, o, t, r) {
-  const { logError: i } = P(), c = new e();
-  r && r(c), o && o(c);
-  const s = (Array.isArray(n) ? n : [n]).map(
+  const { logError: i } = P(), s = new e();
+  r && r(s), o && o(s);
+  const c = (Array.isArray(n) ? n : [n]).map(
     (u) => new Promise((l, p) => {
-      c.load(
+      s.load(
         u,
         (d) => {
           d.scene && Object.assign(d, it(d.scene)), l(d);
@@ -200,16 +197,16 @@ async function xt(e, n, o, t, r) {
       );
     })
   );
-  return de(n) ? await Promise.all(s) : await s[0];
+  return de(n) ? await Promise.all(c) : await c[0];
 }
 async function ht(e) {
-  const n = new Ve(), o = new ze(n), t = (r) => new Promise((i, c) => {
+  const n = new Ve(), o = new ze(n), t = (r) => new Promise((i, s) => {
     o.load(
       r,
       (a) => i(a),
       () => null,
       () => {
-        c(new Error("[useTextures] - Failed to load texture"));
+        s(new Error("[useTextures] - Failed to load texture"));
       }
     );
   });
@@ -220,9 +217,9 @@ async function ht(e) {
     const {
       map: r,
       displacementMap: i,
-      normalMap: c,
+      normalMap: s,
       roughnessMap: a,
-      metalnessMap: s,
+      metalnessMap: c,
       aoMap: u,
       alphaMap: l,
       matcap: p
@@ -230,9 +227,9 @@ async function ht(e) {
     return {
       map: r ? await t(r) : null,
       displacementMap: i ? await t(i) : null,
-      normalMap: c ? await t(c) : null,
+      normalMap: s ? await t(s) : null,
       roughnessMap: a ? await t(a) : null,
-      metalnessMap: s ? await t(s) : null,
+      metalnessMap: c ? await t(c) : null,
       aoMap: u ? await t(u) : null,
       alphaMap: l ? await t(l) : null,
       matcap: p ? await t(p) : null
@@ -246,7 +243,7 @@ function st() {
 }
 const me = Symbol();
 function At() {
-  const e = ae({
+  const e = $({
     uuid: st(),
     camera: void 0,
     cameras: [],
@@ -264,14 +261,14 @@ function At() {
   }
   const t = {
     state: e,
-    ...ne(e),
+    ...oe(e),
     getState: n,
     setState: o
   };
-  return oe(me, t), t;
+  return ae(me, t), t;
 }
 const ct = () => re(me, {
-  state: ae({
+  state: $({
     camera: void 0,
     cameras: [],
     canvas: void 0,
@@ -280,14 +277,14 @@ const ct = () => re(me, {
     pointerEventHandler: void 0
   })
 }), ut = (e) => {
-  const { state: n } = ct(), o = R(() => {
+  const { state: n } = ct(), o = A(() => {
     var f;
     return (f = n.canvas) == null ? void 0 : f.value;
-  }), { x: t, y: r } = Ue({ target: o }), { width: i, height: c, top: a, left: s } = Ye(o), u = new Ge(), l = ({ x: f, y: v }) => {
+  }), { x: t, y: r } = Ue({ target: o }), { width: i, height: s, top: a, left: c } = Ye(o), u = new Ge(), l = ({ x: f, y: v }) => {
     if (o.value)
       return {
-        x: (f - s.value) / i.value * 2 - 1,
-        y: -((v - a.value) / c.value) * 2 + 1
+        x: (f - c.value) / i.value * 2 - 1,
+        y: -((v - a.value) / s.value) * 2 + 1
       };
   }, p = ({ x: f, y: v }) => {
     if (n.camera)
@@ -298,23 +295,23 @@ const ct = () => re(me, {
       y: (f == null ? void 0 : f.clientY) ?? r.value
     });
     return v ? p(v) || [] : [];
-  }, M = R(() => d()), E = S(), b = S(), g = (f, v) => {
+  }, M = A(() => d()), E = R(), b = R(), g = (f, v) => {
     f.trigger({ event: v, intersects: d(v) });
   }, y = (f) => {
     g(b, f);
   };
   let _;
-  const L = (f) => {
+  const S = (f) => {
     var v;
     _ = (v = d(f)[0]) == null ? void 0 : v.object;
-  }, O = (f) => {
+  }, L = (f) => {
     var v;
     f instanceof PointerEvent && _ === ((v = d(f)[0]) == null ? void 0 : v.object) && g(E, f);
-  }, k = (f) => b.trigger({ event: f, intersects: [] }), T = $(() => {
-    o != null && o.value && (o.value.addEventListener("pointerup", O), o.value.addEventListener("pointerdown", L), o.value.addEventListener("pointermove", y), o.value.addEventListener("pointerleave", k), T());
+  }, O = (f) => b.trigger({ event: f, intersects: [] }), C = U(() => {
+    o != null && o.value && (o.value.addEventListener("pointerup", L), o.value.addEventListener("pointerdown", S), o.value.addEventListener("pointermove", y), o.value.addEventListener("pointerleave", O), C());
   });
   return ie(() => {
-    o != null && o.value && (o.value.removeEventListener("pointerup", O), o.value.removeEventListener("pointerdown", L), o.value.removeEventListener("pointermove", y), o.value.removeEventListener("pointerleave", k));
+    o != null && o.value && (o.value.removeEventListener("pointerup", L), o.value.removeEventListener("pointerdown", S), o.value.removeEventListener("pointermove", y), o.value.removeEventListener("pointerleave", O));
   }), {
     intersects: M,
     onClick: (f) => E.on(f).off,
@@ -324,10 +321,10 @@ const ct = () => re(me, {
 function Rt() {
   const { logWarning: e } = P();
   function n(t, r, i) {
-    let c = null;
+    let s = null;
     return t.traverse((a) => {
-      a[r] === i && (c = a);
-    }), c || e(`Child with ${r} '${i}' not found.`), c;
+      a[r] === i && (s = a);
+    }), s || e(`Child with ${r} '${i}' not found.`), s;
   }
   function o(t, r) {
     return n(t, "name", r);
@@ -338,35 +335,35 @@ function Rt() {
   };
 }
 const St = () => {
-  const e = Ce({
+  const e = Te({
     click: /* @__PURE__ */ new Map(),
     pointerMove: /* @__PURE__ */ new Map(),
     pointerEnter: /* @__PURE__ */ new Map(),
     pointerLeave: /* @__PURE__ */ new Map()
   }), n = (a) => {
-    Object.values(e).forEach((s) => s.delete(a));
+    Object.values(e).forEach((c) => c.delete(a));
   }, o = (a) => {
-    const { onClick: s, onPointerMove: u, onPointerEnter: l, onPointerLeave: p } = a;
-    s && e.click.set(a, s), u && e.pointerMove.set(a, u), l && e.pointerEnter.set(a, l), p && e.pointerLeave.set(a, p), a.addEventListener("removed", () => {
+    const { onClick: c, onPointerMove: u, onPointerEnter: l, onPointerLeave: p } = a;
+    c && e.click.set(a, c), u && e.pointerMove.set(a, u), l && e.pointerEnter.set(a, l), p && e.pointerLeave.set(a, p), a.addEventListener("removed", () => {
       a.traverse((d) => {
         n(d);
       }), n(a);
     });
-  }, t = R(
-    () => ot(
+  }, t = A(
+    () => at(
       Object.values(e).map((a) => Array.from(a.keys())).flat(),
       ({ uuid: a }) => a
     )
   ), { onClick: r, onPointerMove: i } = ut(t);
-  r(({ intersects: a, event: s }) => {
+  r(({ intersects: a, event: c }) => {
     var u;
-    a.length && ((u = e.click.get(a[0].object)) == null || u(a[0], s));
+    a.length && ((u = e.click.get(a[0].object)) == null || u(a[0], c));
   });
-  let c;
-  return i(({ intersects: a, event: s }) => {
+  let s;
+  return i(({ intersects: a, event: c }) => {
     var M, E, b, g;
     const u = (M = a == null ? void 0 : a[0]) == null ? void 0 : M.object, { pointerLeave: l, pointerEnter: p, pointerMove: d } = e;
-    c && c !== u && ((E = l.get(c)) == null || E(c, s)), u && (c !== u && ((b = p.get(u)) == null || b(a[0], s)), (g = d.get(u)) == null || g(a[0], s)), c = u || null;
+    s && s !== u && ((E = l.get(s)) == null || E(s, c)), u && (s !== u && ((b = p.get(u)) == null || b(a[0], c)), (g = d.get(u)) == null || g(a[0], c)), s = u || null;
   }), {
     registerObject: o,
     deregisterObject: n
@@ -375,25 +372,25 @@ const St = () => {
 function lt(e, n, o) {
   var b;
   e || ft("A scene most be provided to the TresProvider");
-  const { width: t, height: r } = m(o.windowSize) == !0 || m(o.windowSize) === "" || m(o.windowSize) === "true" || n.value === void 0 ? qe() : Ke((b = n.value) == null ? void 0 : b.parentElement), i = R(() => t.value / r.value), c = {
+  const { width: t, height: r } = m(o.windowSize) == !0 || m(o.windowSize) === "" || m(o.windowSize) === "true" || n.value === void 0 ? qe() : Ke((b = n.value) == null ? void 0 : b.parentElement), i = A(() => t.value / r.value), s = {
     height: r,
     width: t,
     aspectRatio: i
-  }, a = A(e), { camera: s, cameras: u, addCamera: l, setCameraToActive: p } = Je(c), d = A(null);
+  }, a = j(e), { camera: c, cameras: u, addCamera: l, setCameraToActive: p } = Je(s), d = j(null);
   function M(g) {
     d.value || (d.value = g);
   }
   const E = {
     scene: z(a),
     cameras: z(u),
-    camera: s,
+    camera: c,
     addCamera: l,
     setCameraToActive: p,
     renderer: z(d),
     setRenderer: M,
-    sizes: c
+    sizes: s
   };
-  return oe("useTres", E), E;
+  return ae("useTres", E), E;
 }
 function Lt() {
   const e = re("useTres");
@@ -401,47 +398,47 @@ function Lt() {
     throw new Error("useTresContext must be used within a TresProvider");
   return e;
 }
-const pe = U({}), ve = (e) => void Object.assign(pe.value, e), F = {
+const pe = Y({}), ve = (e) => void Object.assign(pe.value, e), F = {
   GEOMETRY_VIA_PROP: "tres__geometryViaProp",
   MATERIAL_VIA_PROP: "tres__materialViaProp",
   REGISTER_AT_POINTER_EVENT_HANDLER: "tres__registerAtPointerEventHandler"
 };
 let N = null, x = null;
-const { logError: te } = P(), dt = {
+const { logError: ne } = P(), dt = {
   createElement(e, n, o, t) {
-    var s, u;
+    var c, u;
     if (t || (t = {}), t.args || (t.args = []), e === "template" || nt(e))
       return null;
     let r = e.replace("Tres", ""), i;
     if (e === "primitive") {
-      (t == null ? void 0 : t.object) === void 0 && te("Tres primitives need a prop 'object'");
+      (t == null ? void 0 : t.object) === void 0 && ne("Tres primitives need a prop 'object'");
       const l = t.object;
       r = l.type, i = Object.assign(l, { type: r, attach: t.attach, primitive: !0 });
     } else {
       const l = pe.value[r];
-      l || te(`${r} is not defined on the THREE namespace. Use extend to add it to the catalog.`), i = new l(...t.args);
+      l || ne(`${r} is not defined on the THREE namespace. Use extend to add it to the catalog.`), i = new l(...t.args);
     }
     i.isCamera && (t != null && t.position || i.position.set(3, 3, 3), t != null && t.lookAt || i.lookAt(0, 0, 0)), (t == null ? void 0 : t.attach) === void 0 && (i.isMaterial ? i.attach = "material" : i.isBufferGeometry && (i.attach = "geometry"));
-    const { GEOMETRY_VIA_PROP: c, MATERIAL_VIA_PROP: a } = F;
-    return i.isObject3D && ((s = t == null ? void 0 : t.material) != null && s.isMaterial && (i.userData[a] = !0), (u = t == null ? void 0 : t.geometry) != null && u.isBufferGeometry && (i.userData[c] = !0)), i;
+    const { GEOMETRY_VIA_PROP: s, MATERIAL_VIA_PROP: a } = F;
+    return i.isObject3D && ((c = t == null ? void 0 : t.material) != null && c.isMaterial && (i.userData[a] = !0), (u = t == null ? void 0 : t.geometry) != null && u.isBufferGeometry && (i.userData[s] = !0)), i;
   },
   insert(e, n) {
-    var o, t, r, i, c, a, s;
+    var o, t, r, i, s, a, c;
     if (n && n.isScene && (x = n), (((o = e == null ? void 0 : e.__vnode) == null ? void 0 : o.type) === "TresGroup" || ((t = e == null ? void 0 : e.__vnode) == null ? void 0 : t.type) === "TresObject3D") && n === null && !((i = (r = e == null ? void 0 : e.__vnode) == null ? void 0 : r.ctx) != null && i.asyncResolved)) {
       N = e;
       return;
     } else
-      (c = e == null ? void 0 : e.__vnode) != null && c.type.includes("Controls") && n === null && (N = x);
-    n || (n = N), e != null && e.isObject3D && (n != null && n.isObject3D) ? (n.add(e), e.dispatchEvent({ type: "added" }), (s = (a = x == null ? void 0 : x.userData) == null ? void 0 : a[F.REGISTER_AT_POINTER_EVENT_HANDLER]) == null || s.call(a, e)) : e != null && e.isFog ? n.fog = e : typeof (e == null ? void 0 : e.attach) == "string" && (e.__previousAttach = e[n == null ? void 0 : n.attach], n && (n[e.attach] = e));
+      (s = e == null ? void 0 : e.__vnode) != null && s.type.includes("Controls") && n === null && (N = x);
+    n || (n = N), e != null && e.isObject3D && (n != null && n.isObject3D) ? (n.add(e), e.dispatchEvent({ type: "added" }), (c = (a = x == null ? void 0 : x.userData) == null ? void 0 : a[F.REGISTER_AT_POINTER_EVENT_HANDLER]) == null || c.call(a, e)) : e != null && e.isFog ? n.fog = e : typeof (e == null ? void 0 : e.attach) == "string" && (e.__previousAttach = e[n == null ? void 0 : n.attach], n && (n[e.attach] = e));
   },
   remove(e) {
     var n, o;
     if (e) {
       if (e.isObject3D) {
         const t = e, r = (i) => {
-          var s, u;
-          const { GEOMETRY_VIA_PROP: c, MATERIAL_VIA_PROP: a } = F;
-          i.userData[a] || (s = i.material) == null || s.dispose(), i.userData[c] || (u = i.geometry) == null || u.dispose();
+          var c, u;
+          const { GEOMETRY_VIA_PROP: s, MATERIAL_VIA_PROP: a } = F;
+          i.userData[a] || (c = i.material) == null || c.dispose(), i.userData[s] || (u = i.geometry) == null || u.dispose();
         };
         t.traverse((i) => {
           r(i);
@@ -452,26 +449,26 @@ const { logError: te } = P(), dt = {
   },
   patchProp(e, n, o, t) {
     if (e) {
-      let r = e, i = n, c = B(i), a = r == null ? void 0 : r[c];
+      let r = e, i = n, s = I(i), a = r == null ? void 0 : r[s];
       if (r.type === "BufferGeometry") {
         if (i === "args")
           return;
         r.setAttribute(
-          B(i),
+          I(i),
           new Fe(...t)
         );
         return;
       }
       if (i.includes("-") && a === void 0) {
         const u = i.split("-");
-        a = u.reduce((l, p) => l[B(p)], r), i = u.pop(), c = i.toLowerCase(), a != null && a.set || (r = u.reduce((l, p) => l[B(p)], r));
+        a = u.reduce((l, p) => l[I(p)], r), i = u.pop(), s = i.toLowerCase(), a != null && a.set || (r = u.reduce((l, p) => l[I(p)], r));
       }
-      let s = t;
-      if (s === "" && (s = !0), ee(a)) {
-        Array.isArray(s) ? e[c](...s) : e[c](s);
+      let c = t;
+      if (c === "" && (c = !0), te(a)) {
+        Array.isArray(c) ? e[s](...c) : e[s](c);
         return;
       }
-      !(a != null && a.set) && !ee(a) ? r[c] = s : a.constructor === s.constructor && (a != null && a.copy) ? a == null || a.copy(s) : Array.isArray(s) ? a.set(...s) : !a.isColor && a.setScalar ? a.setScalar(s) : a.set(s);
+      !(a != null && a.set) && !te(a) ? r[s] = c : a.constructor === c.constructor && (a != null && a.copy) ? a == null || a.copy(c) : Array.isArray(c) ? a.set(...c) : !a.isColor && a.setScalar ? a.setScalar(c) : a.set(c);
     }
   },
   parentNode(e) {
@@ -486,7 +483,7 @@ const { logError: te } = P(), dt = {
   setScopeId: () => void 0,
   cloneNode: () => void 0,
   insertStaticContent: () => void 0
-}, { createApp: mt } = Te(dt), pt = (e) => {
+}, { createApp: mt } = Ce(dt), pt = (e) => {
   const n = mt(o);
   function o() {
     return e && e.default ? e.default() : [];
@@ -513,15 +510,15 @@ const vt = ["data-scene"], gt = /* @__PURE__ */ Pe({
     camera: {}
   },
   setup(e) {
-    const n = e, { logWarning: o } = P(), t = U(), r = A(new Ne()), { onLoop: i } = fe(), c = _e();
+    const n = e, { logWarning: o } = P(), t = Y(), r = j(new Ne()), { onLoop: i } = fe(), s = _e();
     function a() {
-      const s = lt(r.value, t, n), { addCamera: u, camera: l, clearCameras: p } = s;
+      const c = lt(r.value, t, n), { addCamera: u, camera: l, clearCameras: p } = c;
       let d;
       function M() {
-        d = pt(c), d.provide("useTres", s), d.provide("extend", ve), d.mount(r.value), b();
+        d = pt(s), d.provide("useTres", c), d.provide("extend", ve), d.mount(r.value), b();
       }
       M();
-      const { renderer: E } = rt(t, s, n);
+      const { renderer: E } = rt(t, c, n);
       n.camera && u(n.camera), i(() => {
         var g;
         l.value && n.disableRender !== !0 && ((g = E.value) == null || g.render(r.value, l.value));
@@ -546,7 +543,7 @@ const vt = ["data-scene"], gt = /* @__PURE__ */ Pe({
     return xe(() => {
       a();
     }), ie(() => {
-    }), (s, u) => (he(), Ae("canvas", {
+    }), (c, u) => (he(), Ae("canvas", {
       ref_key: "canvas",
       ref: t,
       "data-scene": r.value.uuid,
@@ -554,7 +551,7 @@ const vt = ["data-scene"], gt = /* @__PURE__ */ Pe({
         display: "block",
         width: "100%",
         height: "100%",
-        position: s.windowSize ? "fixed" : "relative",
+        position: c.windowSize ? "fixed" : "relative",
         top: 0,
         left: 0,
         pointerEvents: "auto",

package/dist/tres.umd.cjs

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