@tresjs/core 3.1.0-next.0 → 3.1.0-next.1

package/dist/tres.js

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

package/dist/tres.umd.cjs

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

package/dist/utils/index.d.ts

@@ -1,6 +1,7 @@
 export declare function toSetMethodName(key: string): string;
 export declare const merge: (target: any, source: any) => any;
 export declare const isHTMLTag: (key: string) => boolean;
+export declare function isDOMElement(obj: any): obj is HTMLElement;
 export declare function kebabToCamel(str: string): string;
 export declare function makeMap(str: string, expectsLowerCase?: boolean): (key: string) => boolean;
 export declare const uniqueBy: <T, K>(array: T[], iteratee: (value: T) => K) => T[];

package/package.json

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