@tresjs/core 1.3.3 → 1.4.0

package/dist/tres.js

@@ -1,31 +1,31 @@
 /**
  * name: @tresjs/core
- * version: v1.3.3
+ * version: v1.4.0
  * (c) 2022
  * description: Declarative ThreeJS using Vue Components
  * author: Alvaro Saburido <hola@alvarosaburido.dev> (https://github.com/alvarosabu/)
  */
-import { computed as V, watch as O, inject as P, ref as T, defineComponent as N, shallowRef as k, reactive as Ce, toRefs as te, provide as b, onBeforeUnmount as Se, h as q } from "vue";
-import { useWindowSize as ne, createEventHook as W, useRafFn as Me, resolveUnref as m, useElementSize as xe, useDevicePixelRatio as Ee, unrefElement as F } from "@vueuse/core";
-import * as Q from "three";
-import { PerspectiveCamera as A, OrthographicCamera as re, Vector3 as Pe, Color as z, Clock as Te, Scene as Re, LoadingManager as Le, TextureLoader as Oe, PCFShadowMap as be, LinearEncoding as X, NoToneMapping as Y, WebGLRenderer as Ae } from "three";
+import { computed as N, watch as O, inject as L, ref as b, defineComponent as k, shallowRef as W, reactive as Ce, toRefs as ne, provide as B, onBeforeUnmount as Se, h as Q } from "vue";
+import { useWindowSize as re, createEventHook as G, useRafFn as Me, resolveUnref as p, useElementSize as xe, useDevicePixelRatio as Ee, unrefElement as U } from "@vueuse/core";
+import * as X from "three";
+import { PerspectiveCamera as $, OrthographicCamera as ae, Vector3 as Pe, Color as j, BufferAttribute as Te, Clock as Re, Scene as Le, LoadingManager as be, TextureLoader as Ae, PCFShadowMap as Oe, LinearEncoding as Y, NoToneMapping as Z, WebGLRenderer as Be } from "three";
 var $e = /* @__PURE__ */ ((e) => (e.Perspective = "Perspective", e.Orthographic = "Orthographic", e))($e || {});
-const M = {
+const E = {
   cameras: []
-}, Be = 45;
-let C;
-function ae() {
-  const { width: e, height: t } = ne(), { setState: n } = pe();
-  function s(r = "Perspective", u) {
-    if (r === "Perspective") {
-      const { near: o, far: c, fov: p } = u || {
+}, Ie = 45;
+let S;
+function oe() {
+  const { width: e, height: n } = re(), { setState: r } = me();
+  function c(t = "Perspective", s) {
+    if (t === "Perspective") {
+      const { near: u, far: a, fov: o } = s || {
         near: 0.1,
         far: 1e3,
-        fov: Be
+        fov: Ie
       };
-      C = new A(p, i.value, o, c), M.cameras.push(C);
+      S = new $(o, i.value, u, a), E.cameras.push(S);
     } else {
-      const { left: o, right: c, top: p, bottom: d, near: w, far: y } = u || {
+      const { left: u, right: a, top: o, bottom: h, near: m, far: w } = s || {
         left: -100,
         right: 100,
         top: 100,
@@ -33,300 +33,306 @@ function ae() {
         near: 0.1,
         far: 1e3
       };
-      C = new re(o, c, p, d, w, y), M.cameras.push(C);
+      S = new ae(u, a, o, h, m, w), E.cameras.push(S);
     }
-    return M.cameras.push(C), C;
+    return E.cameras.push(S), S;
   }
-  const i = V(() => e.value / t.value), l = V(() => M.cameras[0]);
+  const i = N(() => e.value / n.value), l = N(() => E.cameras[0]);
   function f() {
-    l.value instanceof A && (l.value.aspect = i.value), l.value.updateProjectionMatrix();
+    l.value instanceof $ && (l.value.aspect = i.value), l.value.updateProjectionMatrix();
   }
-  function a(r) {
-    const u = P("camera");
-    r && u && (u.value = r, n("camera", u.value)), M.cameras.push(r), r instanceof A && (r.aspect = i.value), r.updateProjectionMatrix();
+  function g(t) {
+    const s = L("camera");
+    t && s && (s.value = t, r("camera", s.value)), E.cameras.push(t), t instanceof $ && (t.aspect = i.value), t.updateProjectionMatrix();
   }
   return O(i, f), {
     activeCamera: l,
-    createCamera: s,
+    createCamera: c,
     updateCamera: f,
-    pushCamera: a
+    pushCamera: g
   };
 }
-const Z = "[TresJS ▲ ■ ●] ";
-function B() {
-  function e(s, i) {
-    console.error(`${Z} ${s}`, i || "");
+const ee = "[TresJS ▲ ■ ●] ";
+function _() {
+  function e(c, i) {
+    console.error(`${ee} ${c}`, i || "");
   }
-  function t(s) {
-    console.warn(`${Z} ${s}`);
+  function n(c) {
+    console.warn(`${ee} ${c}`);
   }
-  function n(s, i) {
+  function r(c, i) {
   }
   return {
     logError: e,
-    logWarning: t,
-    logMessage: n
+    logWarning: n,
+    logMessage: r
   };
 }
-const E = T({ ...Q, uuid: Q.MathUtils.generateUUID() });
-delete E.value.Scene;
-let x;
-function oe(e, t = "Tres") {
-  const { logMessage: n, logError: s } = B();
-  !x && e && (x = e);
-  const { createComponentInstances: i } = se(t);
+const R = b({ ...X, uuid: X.MathUtils.generateUUID() });
+delete R.value.Scene;
+let P;
+function se(e, n = "Tres") {
+  const { logMessage: r, logError: c } = _();
+  !P && e && (P = e);
+  const { createComponentInstances: i } = ie(n);
   return {
     extend: (f) => {
       if (!f) {
-        s("No objects provided to extend catalogue");
+        c("No objects provided to extend catalogue");
         return;
       }
-      E.value = Object.assign(E.value, f);
-      const a = i(T(f));
-      n("Adding objects to catalogue", { objects: f, catalogue: E.value.uuid }), x && a.forEach(([r, u]) => {
-        x._context.components[r] || x.component(r, u);
+      R.value = Object.assign(R.value, f);
+      const g = i(b(f));
+      r("Adding objects to catalogue", { objects: f, catalogue: R.value.uuid }), P && g.forEach(([t, s]) => {
+        P._context.components[t] || P.component(t, s);
       });
     },
-    catalogue: E
+    catalogue: R
   };
 }
-const U = (e) => typeof e < "u", Ie = (e) => typeof e == "function", $ = (e) => !!e && e.constructor === Array;
-function _e(e) {
+const T = (e) => typeof e < "u", _e = (e) => typeof e == "function", I = (e) => !!e && e.constructor === Array;
+function De(e) {
   return typeof e == "number" ? [e, e, e] : e instanceof Pe ? [e.x, e.y, e.z] : e;
 }
-function De(e) {
-  return e instanceof z ? e : Array.isArray(e) ? new z(...e) : new z(e);
+function Fe(e) {
+  return e instanceof j ? e : Array.isArray(e) ? new j(...e) : new j(e);
 }
-const Fe = ["rotation", "scale", "position"];
-function se(e) {
-  const { logMessage: t, logError: n } = B();
-  function s(a, r) {
-    U(a) && U(r) && Object.entries(a).forEach(([u, o]) => {
-      const c = u.replace(/(-\w)/g, (p) => p[1].toUpperCase());
-      if (!(c === "args" || o === void 0)) {
-        Fe.includes(c) && o && (o = _e(o)), a.ref && (a.ref = r);
+const ze = ["rotation", "scale", "position"];
+function ie(e) {
+  const { logMessage: n, logError: r } = _();
+  function c(t, s) {
+    T(t) && T(s) && Object.entries(t).forEach(([u, a]) => {
+      const o = u.replace(/(-\w)/g, (h) => h[1].toUpperCase());
+      s.setAttribute(o, new Te(...a));
+    });
+  }
+  function i(t, s) {
+    T(t) && T(s) && Object.entries(t).forEach(([u, a]) => {
+      const o = u.replace(/(-\w)/g, (h) => h[1].toUpperCase());
+      if (!(o === "args" || a === void 0)) {
+        ze.includes(o) && a && (a = De(a)), t.ref && (t.ref = s);
         try {
-          if (r[c] && U(r[c].set))
-            r[c].set(...$(o) ? o : [o]);
+          if (s[o] && T(s[o].set))
+            s[o].set(...I(a) ? a : [a]);
           else {
-            if (o === "" && (o = !0), Ie(r[c])) {
-              if (u === "center" && !o)
+            if (a === "" && (a = !0), _e(s[o])) {
+              if (u === "center" && !a)
                 return;
-              r[c](...$(o) ? o : [o]);
+              s[o](...I(a) ? a : [a]);
               return;
             }
-            r[c] = o;
+            s[o] = a;
           }
-        } catch (p) {
-          n(`There was an error setting ${c} property`, p);
+        } catch (h) {
+          r(`There was an error setting ${o} property`, h);
         }
       }
     });
   }
-  function i(a) {
-    var o;
-    const r = /^Symbol\(Fragment\)$/g, u = /^Symbol\(Text\)$/g;
-    if (r.test(a.type.toString()))
-      return a.children.map((c) => i(c));
-    if (u.test(a.type.toString()))
+  function l(t) {
+    var a;
+    const s = /^Symbol\(Fragment\)$/g, u = /^Symbol\(Text\)$/g;
+    if (s.test(t.type.toString()))
+      return t.children.map((o) => l(o));
+    if (u.test(t.type.toString()))
       return;
     {
-      const c = a.type.name.replace(e, ""), { catalogue: p } = oe(), d = P("catalogue") || p;
+      const o = t.type.name.replace(e, ""), { catalogue: h } = se(), m = L("catalogue") || h;
       let w;
-      return d && ((o = a == null ? void 0 : a.props) != null && o.args ? d != null && d.value[c] ? w = new d.value[c](...a.props.args) : n(`There is no ${c} in the catalogue`, d == null ? void 0 : d.value.uuid) : w = new d.value[c]()), a != null && a.props && s(a.props, w), w;
+      return m && ((a = t == null ? void 0 : t.props) != null && a.args ? m != null && m.value[o] ? w = new m.value[o](...t.props.args) : r(`There is no ${o} in the catalogue`, m == null ? void 0 : m.value.uuid) : w = new m.value[o]()), t != null && t.props && (o === "BufferGeometry" ? c(t.props, w) : i(t.props, w)), w;
     }
   }
-  function l(a, r, u) {
+  function f(t, s, u) {
     if (u.default && (u != null && u.default())) {
-      const o = u.default().map((c) => i(c));
-      return new a(...o.flat().filter(Boolean));
+      const a = u.default().map((o) => l(o));
+      return new t(...a.flat().filter(Boolean));
     } else
-      return r.args ? new a(...r.args) : new a();
+      return s.args ? new t(...s.args) : new t();
   }
-  function f(a) {
-    return Object.entries(a.value).filter(([r, u]) => {
-      var o, c;
-      return (c = (o = u == null ? void 0 : u.prototype) == null ? void 0 : o.constructor) == null ? void 0 : c.toString().includes("class");
-    }).map(([r, u]) => {
-      const o = `${e}${r}`, c = N({
-        name: o,
-        setup(p, { slots: d, attrs: w, ...y }) {
-          const { scene: R } = fe(), v = P("local-scene") || R, S = P("catalogue"), { pushCamera: I } = ae();
-          let h = l(u, w, d);
-          return s(w, h), (h instanceof A || h instanceof re) && I(h), h.isObject3D && (v == null || v.value.add(h)), v != null && v.value && h.isFog && (v.value.fog = h), y.expose(h), t(o, {
+  function g(t) {
+    return Object.entries(t.value).filter(([s, u]) => {
+      var a, o;
+      return (o = (a = u == null ? void 0 : u.prototype) == null ? void 0 : a.constructor) == null ? void 0 : o.toString().includes("class");
+    }).map(([s, u]) => {
+      const a = `${e}${s}`, o = k({
+        name: a,
+        setup(h, { slots: m, attrs: w, ...M }) {
+          const { scene: D } = pe(), v = L("local-scene") || D, x = L("catalogue"), { pushCamera: C } = oe();
+          let y = f(u, w, m);
+          return i(w, y), (y instanceof $ || y instanceof ae) && C(y), y.isObject3D && (v == null || v.value.add(y)), v != null && v.value && y.isFog && (v.value.fog = y), M.expose(y), n(a, {
             sceneuuid: v == null ? void 0 : v.value.uuid,
-            catalogue: S == null ? void 0 : S.value.uuid,
-            props: p,
-            slots: d.default ? d.default() : void 0,
+            catalogue: x == null ? void 0 : x.value.uuid,
+            props: h,
+            slots: m.default ? m.default() : void 0,
             attrs: w,
-            ctx: y,
+            ctx: M,
             scene: v
           }), () => {
           };
         }
       });
-      return [o, c];
+      return [a, o];
     });
   }
   return {
-    createComponentInstances: f,
-    processProps: s,
-    createInstanceFromVNode: i
+    createComponentInstances: g,
+    processProps: i,
+    createInstanceFromVNode: l
   };
 }
-const ie = W(), ce = W(), ue = W(), ee = new Te(), { pause: ze, resume: Ue, isActive: je } = Me(
+const ce = G(), ue = G(), le = G(), te = new Re(), { pause: Ue, resume: je, isActive: Ve } = Me(
   () => {
-    const e = ee.getElapsedTime(), t = ee.getDelta();
-    ie.trigger({ delta: t, elapsed: e }), ce.trigger({ delta: t, elapsed: e }), ue.trigger({ delta: t, elapsed: e });
+    const e = te.getElapsedTime(), n = te.getDelta();
+    ce.trigger({ delta: n, elapsed: e }), ue.trigger({ delta: n, elapsed: e }), le.trigger({ delta: n, elapsed: e });
   },
   { immediate: !1 }
 );
-function le() {
+function fe() {
   return {
-    onBeforeLoop: ie.on,
-    onLoop: ce.on,
-    onAfterLoop: ue.on,
-    pause: ze,
-    resume: Ue,
-    isActive: je
+    onBeforeLoop: ce.on,
+    onLoop: ue.on,
+    onAfterLoop: le.on,
+    pause: Ue,
+    resume: je,
+    isActive: Ve
   };
 }
-const Ve = k(new Re());
-function fe() {
+const Ne = W(new Le());
+function pe() {
   return {
-    scene: Ve
+    scene: Ne
   };
 }
-function Ne(e) {
-  const t = { nodes: {}, materials: {} };
-  return e && e.traverse((n) => {
-    n.name && (t.nodes[n.name] = n), n.material && !t.materials[n.material.name] && (t.materials[n.material.name] = n.material);
-  }), t;
+function ke(e) {
+  const n = { nodes: {}, materials: {} };
+  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 Qe(e, t, n, s, i) {
-  const { logError: l } = B(), f = new e();
-  i && i(f), n && n(f);
-  const r = (Array.isArray(t) ? t : [t]).map(
-    (u) => new Promise((o, c) => {
+async function Xe(e, n, r, c, i) {
+  const { logError: l } = _(), f = new e();
+  i && i(f), r && r(f);
+  const t = (Array.isArray(n) ? n : [n]).map(
+    (s) => new Promise((u, a) => {
       f.load(
-        u,
-        (p) => {
-          p.scene && Object.assign(p, Ne(p.scene)), o(p);
-        },
         s,
-        (p) => c(l("[useLoader] - Failed to load resource", p))
+        (o) => {
+          o.scene && Object.assign(o, ke(o.scene)), u(o);
+        },
+        c,
+        (o) => a(l("[useLoader] - Failed to load resource", o))
       );
     })
   );
-  return $(t) ? await Promise.all(r) : await r[0];
+  return I(n) ? await Promise.all(t) : await t[0];
 }
-async function Xe(e) {
-  const t = new Le(), n = new Oe(t), s = (i) => new Promise((l, f) => {
-    n.load(
+async function Ye(e) {
+  const n = new be(), r = new Ae(n), c = (i) => new Promise((l, f) => {
+    r.load(
       i,
-      (a) => l(a),
+      (g) => l(g),
       () => null,
       () => {
         f(new Error("[useTextures] - Failed to load texture"));
       }
     );
   });
-  if ($(e)) {
-    const i = await Promise.all(e.map((l) => s(l)));
+  if (I(e)) {
+    const i = await Promise.all(e.map((l) => c(l)));
     return e.length > 1 ? i : i[0];
   } else {
-    const { map: i, displacementMap: l, normalMap: f, roughnessMap: a, metalnessMap: r, aoMap: u } = e;
+    const { map: i, displacementMap: l, normalMap: f, roughnessMap: g, metalnessMap: t, aoMap: s } = e;
     return {
-      map: i ? await s(i) : null,
-      displacementMap: l ? await s(l) : null,
-      normalMap: f ? await s(f) : null,
-      roughnessMap: a ? await s(a) : null,
-      metalnessMap: r ? await s(r) : null,
-      aoMap: u ? await s(u) : null
+      map: i ? await c(i) : null,
+      displacementMap: l ? await c(l) : null,
+      normalMap: f ? await c(f) : null,
+      roughnessMap: g ? await c(g) : null,
+      metalnessMap: t ? await c(t) : null,
+      aoMap: s ? await c(s) : null
     };
   }
 }
-const L = Ce({});
-function pe() {
-  function e(n) {
-    return L[n];
+const A = Ce({});
+function me() {
+  function e(r) {
+    return A[r];
   }
-  function t(n, s) {
-    L[n] = s;
+  function n(r, c) {
+    A[r] = c;
   }
   return {
-    state: L,
-    ...te(L),
+    state: A,
+    ...ne(A),
     getState: e,
-    setState: t
+    setState: n
   };
 }
-const g = k(), j = T(!1);
-function ke(e, t, n) {
+const d = W(), V = b(!1);
+function We(e, n, r) {
   const {
-    alpha: s = !0,
+    alpha: c = !0,
     antialias: i = !0,
     depth: l,
     logarithmicDepthBuffer: f,
-    failIfMajorPerformanceCaveat: a,
-    precision: r,
-    premultipliedAlpha: u,
-    stencil: o,
-    shadows: c = !1,
-    shadowMapType: p = be,
-    physicallyCorrectLights: d = !1,
-    outputEncoding: w = X,
-    toneMapping: y = Y,
-    toneMappingExposure: R = 1,
-    context: v = void 0,
-    powerPreference: S = "default",
-    preserveDrawingBuffer: I = !1,
-    clearColor: h,
-    windowSize: me = !1
-  } = te(n), { width: _, height: D } = m(me) ? ne() : xe(t), { pixelRatio: H } = Ee(), { pause: de, resume: ge } = le(), he = V(() => _.value / D.value), G = () => {
-    g.value && (g.value.setSize(_.value, D.value), g.value.setPixelRatio(Math.min(H.value, 2)));
+    failIfMajorPerformanceCaveat: g,
+    precision: t,
+    premultipliedAlpha: s,
+    stencil: u,
+    shadows: a = !1,
+    shadowMapType: o = Oe,
+    physicallyCorrectLights: h = !1,
+    outputEncoding: m = Y,
+    toneMapping: w = Z,
+    toneMappingExposure: M = 1,
+    context: D = void 0,
+    powerPreference: v = "default",
+    preserveDrawingBuffer: x = !1,
+    clearColor: C,
+    windowSize: y = !1
+  } = ne(r), { width: F, height: z } = p(y) ? re() : xe(n), { pixelRatio: H } = Ee(), { pause: de, resume: ge } = fe(), he = N(() => F.value / z.value), K = () => {
+    d.value && (d.value.setSize(F.value, z.value), d.value.setPixelRatio(Math.min(H.value, 2)));
   }, J = () => {
-    g.value && (g.value.shadowMap.enabled = m(c), g.value.shadowMap.type = m(p), g.value.toneMapping = m(y) || Y, g.value.toneMappingExposure = m(R), g.value.outputEncoding = m(w) || X, h != null && h.value && g.value.setClearColor(De(m(h))), g.value.physicallyCorrectLights = m(d));
+    d.value && (d.value.shadowMap.enabled = p(a), d.value.shadowMap.type = p(o), d.value.toneMapping = p(w) || Z, d.value.toneMappingExposure = p(M), d.value.outputEncoding = p(m) || Y, C != null && C.value && d.value.setClearColor(Fe(p(C))), d.value.physicallyCorrectLights = p(h));
   }, we = () => {
-    const K = F(e);
-    if (g.value || !K)
+    const q = U(e);
+    if (d.value || !q)
       return;
-    g.value = new Ae({
-      canvas: K,
-      alpha: m(s),
-      antialias: m(i),
-      context: m(v),
-      depth: m(l),
-      failIfMajorPerformanceCaveat: m(a),
-      logarithmicDepthBuffer: m(f),
-      powerPreference: m(S),
-      precision: m(r),
-      stencil: m(o),
-      preserveDrawingBuffer: m(I),
-      premultipliedAlpha: m(u)
+    d.value = new Be({
+      canvas: q,
+      alpha: p(c),
+      antialias: p(i),
+      context: p(D),
+      depth: p(l),
+      failIfMajorPerformanceCaveat: p(g),
+      logarithmicDepthBuffer: p(f),
+      powerPreference: p(v),
+      precision: p(t),
+      stencil: p(u),
+      preserveDrawingBuffer: p(x),
+      premultipliedAlpha: p(s)
     });
-    const { setState: ye } = pe();
-    ye("renderer", g.value), J(), G(), ge(), j.value = !0;
+    const { setState: ye } = me();
+    ye("renderer", d.value), J(), K(), ge(), V.value = !0;
   }, ve = () => {
-    g.value && (g.value.dispose(), g.value = void 0, j.value = !1, de());
+    d.value && (d.value.dispose(), d.value = void 0, V.value = !1, de());
   };
-  return O([_, D, H], G), O(
-    [c, p, w, d, y, R, h],
+  return O([F, z, H], K), O(
+    [a, o, m, h, w, M, C],
     J
   ), O(
-    () => [e, t],
+    () => [e, n],
     () => {
-      F(e) && F(t) && we();
+      U(e) && U(n) && we();
     },
     { immediate: !0, deep: !0 }
   ), {
-    renderer: g,
-    isReady: j,
+    renderer: d,
+    isReady: V,
     dispose: ve,
     aspectRatio: he
   };
 }
-const We = N({
+const Ge = k({
   name: "TresCanvas",
   props: {
     shadows: Boolean,
@@ -341,14 +347,14 @@ const We = N({
     clearColor: String,
     windowSize: Boolean
   },
-  setup(e, { slots: t, attrs: n }) {
-    const { logError: s } = B(), i = T(), l = T(), { renderer: f, dispose: a, aspectRatio: r } = ke(i, l, e), u = k();
-    return b("camera", u), b("renderer", f), b("aspect-ratio", r), t.default && !t.default().some((o) => o.type.name === "Scene") && s("TresCanvas must contain a Scene component."), t.default && !t.default().some((o) => {
-      var c;
-      return (c = o.type.name) == null ? void 0 : c.includes("Camera");
-    }) && s("Scene must contain a Camera component."), Se(() => a()), () => {
-      if (t.default)
-        return q(
+  setup(e, { slots: n, attrs: r }) {
+    const { logError: c } = _(), i = b(), l = b(), { renderer: f, dispose: g, aspectRatio: t } = We(i, l, e), s = W();
+    return B("camera", s), B("renderer", f), B("aspect-ratio", t), n.default && !n.default().some((u) => u.type.name === "Scene") && c("TresCanvas must contain a Scene component."), n.default && !n.default().some((u) => {
+      var a;
+      return (a = u.type.name) == null ? void 0 : a.includes("Camera");
+    }) && c("Scene must contain a Camera component."), Se(() => g()), () => {
+      if (n.default)
+        return Q(
           "div",
           {
             ref: l,
@@ -356,57 +362,57 @@ const We = N({
               position: "relative",
               width: "100%",
               height: "100vh",
-              ...n.style
+              ...r.style
             }
           },
           [
-            q("canvas", {
+            Q("canvas", {
               ref: i,
               style: { width: "100%", height: "100%", position: "absolute", top: 0, left: 0 }
             }),
-            t.default()
+            n.default()
           ]
         );
     };
   }
-}), He = N({
+}), He = k({
   name: "Scene",
-  setup(e, { slots: t }) {
-    const { scene: n } = fe(), s = P("renderer"), { activeCamera: i } = ae(), { onLoop: l } = le();
-    return b("local-scene", n), l(() => {
-      s != null && s.value && (i != null && i.value) && (n != null && n.value) && s.value.render(n == null ? void 0 : n.value, i.value);
+  setup(e, { slots: n }) {
+    const { scene: r } = pe(), c = L("renderer"), { activeCamera: i } = oe(), { onLoop: l } = fe();
+    return B("local-scene", r), l(() => {
+      c != null && c.value && (i != null && i.value) && (r != null && r.value) && c.value.render(r == null ? void 0 : r.value, i.value);
     }), () => {
-      if (t.default)
-        return t.default();
+      if (n.default)
+        return n.default();
     };
   }
-}), Ye = Symbol("UseTresState"), Ge = "1.3.3", Ze = {
-  install(e, t) {
-    const n = (t == null ? void 0 : t.prefix) || "Tres";
-    e.component(`${n}Canvas`, We), e.component(`${n}Scene`, He);
-    const { catalogue: s, extend: i } = oe(e, n);
-    e.provide("catalogue", s), e.provide("extend", i);
-    const { createComponentInstances: l } = se(n);
-    l(s).forEach(([a, r]) => {
-      e.component(a, r);
+}), Ze = Symbol("UseTresState"), Ke = "1.4.0", et = {
+  install(e, n) {
+    const r = (n == null ? void 0 : n.prefix) || "Tres";
+    e.component(`${r}Canvas`, Ge), e.component(`${r}Scene`, He);
+    const { catalogue: c, extend: i } = se(e, r);
+    e.provide("catalogue", c), e.provide("extend", i);
+    const { createComponentInstances: l } = ie(r);
+    l(c).forEach(([g, t]) => {
+      e.component(g, t);
     }), window.__TRES__ = {
       app: e,
-      version: Ge
+      version: Ke
     };
   }
 };
 export {
   $e as CameraType,
-  Ye as UseTresStateSymbol,
-  Ze as default,
-  Ne as trasverseObjects,
-  ae as useCamera,
-  oe as useCatalogue,
-  se as useInstanceCreator,
-  Qe as useLoader,
-  le as useRenderLoop,
-  ke as useRenderer,
-  fe as useScene,
-  Xe as useTexture,
-  pe as useTres
+  Ze as UseTresStateSymbol,
+  et as default,
+  ke as trasverseObjects,
+  oe as useCamera,
+  se as useCatalogue,
+  ie as useInstanceCreator,
+  Xe as useLoader,
+  fe as useRenderLoop,
+  We as useRenderer,
+  pe as useScene,
+  Ye as useTexture,
+  me as useTres
 };

package/dist/tres.umd.cjs

@@ -1,8 +1,8 @@
 /**
  * name: @tresjs/core
- * version: v1.3.3
+ * version: v1.4.0
  * (c) 2022
  * description: Declarative ThreeJS using Vue Components
  * author: Alvaro Saburido <hola@alvarosaburido.dev> (https://github.com/alvarosabu/)
  */
-(function(m,i){typeof exports=="object"&&typeof module<"u"?i(exports,require("vue"),require("@vueuse/core"),require("three")):typeof define=="function"&&define.amd?define(["exports","vue","@vueuse/core","three"],i):(m=typeof globalThis<"u"?globalThis:m||self,i(m.tres={},m.Vue,m.VueUseCore,m.Three))})(this,function(m,i,f,g){"use strict";function ne(e){const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const n in e)if(n!=="default"){const r=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(t,n,r.get?r:{enumerable:!0,get:()=>e[n]})}}return t.default=e,Object.freeze(t)}const W=ne(g);var q=(e=>(e.Perspective="Perspective",e.Orthographic="Orthographic",e))(q||{});const U={cameras:[]},re=45;let P;function I(){const{width:e,height:t}=f.useWindowSize(),{setState:n}=F();function r(a="Perspective",l){if(a==="Perspective"){const{near:s,far:u,fov:h}=l||{near:.1,far:1e3,fov:re};P=new g.PerspectiveCamera(h,c.value,s,u),U.cameras.push(P)}else{const{left:s,right:u,top:h,bottom:v,near:y,far:M}=l||{left:-100,right:100,top:100,bottom:-100,near:.1,far:1e3};P=new g.OrthographicCamera(s,u,h,v,y,M),U.cameras.push(P)}return U.cameras.push(P),P}const c=i.computed(()=>e.value/t.value),p=i.computed(()=>U.cameras[0]);function d(){p.value instanceof g.PerspectiveCamera&&(p.value.aspect=c.value),p.value.updateProjectionMatrix()}function o(a){const l=i.inject("camera");a&&l&&(l.value=a,n("camera",l.value)),U.cameras.push(a),a instanceof g.PerspectiveCamera&&(a.aspect=c.value),a.updateProjectionMatrix()}return i.watch(c,d),{activeCamera:p,createCamera:r,updateCamera:d,pushCamera:o}}const G="[TresJS ▲ ■ ●] ";function x(){function e(r,c){console.error(`${G} ${r}`,c||"")}function t(r){console.warn(`${G} ${r}`)}function n(r,c){}return{logError:e,logWarning:t,logMessage:n}}const L=i.ref({...W,uuid:W.MathUtils.generateUUID()});delete L.value.Scene;let O;function T(e,t="Tres"){const{logMessage:n,logError:r}=x();!O&&e&&(O=e);const{createComponentInstances:c}=D(t);return{extend:d=>{if(!d){r("No objects provided to extend catalogue");return}L.value=Object.assign(L.value,d);const o=c(i.ref(d));n("Adding objects to catalogue",{objects:d,catalogue:L.value.uuid}),O&&o.forEach(([a,l])=>{O._context.components[a]||O.component(a,l)})},catalogue:L}}const B=e=>typeof e<"u",ae=e=>typeof e=="function",j=e=>!!e&&e.constructor===Array;function oe(e){return typeof e=="number"?[e,e,e]:e instanceof g.Vector3?[e.x,e.y,e.z]:e}function se(e){return e instanceof g.Color?e:Array.isArray(e)?new g.Color(...e):new g.Color(e)}const ie=["rotation","scale","position"];function D(e){const{logMessage:t,logError:n}=x();function r(o,a){B(o)&&B(a)&&Object.entries(o).forEach(([l,s])=>{const u=l.replace(/(-\w)/g,h=>h[1].toUpperCase());if(!(u==="args"||s===void 0)){ie.includes(u)&&s&&(s=oe(s)),o.ref&&(o.ref=a);try{if(a[u]&&B(a[u].set))a[u].set(...j(s)?s:[s]);else{if(s===""&&(s=!0),ae(a[u])){if(l==="center"&&!s)return;a[u](...j(s)?s:[s]);return}a[u]=s}}catch(h){n(`There was an error setting ${u} property`,h)}}})}function c(o){var s;const a=/^Symbol\(Fragment\)$/g,l=/^Symbol\(Text\)$/g;if(a.test(o.type.toString()))return o.children.map(u=>c(u));if(l.test(o.type.toString()))return;{const u=o.type.name.replace(e,""),{catalogue:h}=T(),v=i.inject("catalogue")||h;let y;return v&&((s=o==null?void 0:o.props)!=null&&s.args?v!=null&&v.value[u]?y=new v.value[u](...o.props.args):n(`There is no ${u} in the catalogue`,v==null?void 0:v.value.uuid):y=new v.value[u]),o!=null&&o.props&&r(o.props,y),y}}function p(o,a,l){if(l.default&&(l!=null&&l.default())){const s=l.default().map(u=>c(u));return new o(...s.flat().filter(Boolean))}else return a.args?new o(...a.args):new o}function d(o){return Object.entries(o.value).filter(([a,l])=>{var s,u;return(u=(s=l==null?void 0:l.prototype)==null?void 0:s.constructor)==null?void 0:u.toString().includes("class")}).map(([a,l])=>{const s=`${e}${a}`,u=i.defineComponent({name:s,setup(h,{slots:v,attrs:y,...M}){const{scene:A}=z(),S=i.inject("local-scene")||A,b=i.inject("catalogue"),{pushCamera:k}=I();let C=p(l,y,v);return r(y,C),(C instanceof g.PerspectiveCamera||C instanceof g.OrthographicCamera)&&k(C),C.isObject3D&&(S==null||S.value.add(C)),S!=null&&S.value&&C.isFog&&(S.value.fog=C),M.expose(C),t(s,{sceneuuid:S==null?void 0:S.value.uuid,catalogue:b==null?void 0:b.value.uuid,props:h,slots:v.default?v.default():void 0,attrs:y,ctx:M,scene:S}),()=>{}}});return[s,u]})}return{createComponentInstances:d,processProps:r,createInstanceFromVNode:c}}const J=f.createEventHook(),K=f.createEventHook(),Q=f.createEventHook(),X=new g.Clock,{pause:ce,resume:ue,isActive:le}=f.useRafFn(()=>{const e=X.getElapsedTime(),t=X.getDelta();J.trigger({delta:t,elapsed:e}),K.trigger({delta:t,elapsed:e}),Q.trigger({delta:t,elapsed:e})},{immediate:!1});function $(){return{onBeforeLoop:J.on,onLoop:K.on,onAfterLoop:Q.on,pause:ce,resume:ue,isActive:le}}const fe=i.shallowRef(new g.Scene);function z(){return{scene:fe}}function Y(e){const t={nodes:{},materials:{}};return e&&e.traverse(n=>{n.name&&(t.nodes[n.name]=n),n.material&&!t.materials[n.material.name]&&(t.materials[n.material.name]=n.material)}),t}async function pe(e,t,n,r,c){const{logError:p}=x(),d=new e;c&&c(d),n&&n(d);const a=(Array.isArray(t)?t:[t]).map(l=>new Promise((s,u)=>{d.load(l,h=>{h.scene&&Object.assign(h,Y(h.scene)),s(h)},r,h=>u(p("[useLoader] - Failed to load resource",h)))}));return j(t)?await Promise.all(a):await a[0]}async function de(e){const t=new g.LoadingManager,n=new g.TextureLoader(t),r=c=>new Promise((p,d)=>{n.load(c,o=>p(o),()=>null,()=>{d(new Error("[useTextures] - Failed to load texture"))})});if(j(e)){const c=await Promise.all(e.map(p=>r(p)));return e.length>1?c:c[0]}else{const{map:c,displacementMap:p,normalMap:d,roughnessMap:o,metalnessMap:a,aoMap:l}=e;return{map:c?await r(c):null,displacementMap:p?await r(p):null,normalMap:d?await r(d):null,roughnessMap:o?await r(o):null,metalnessMap:a?await r(a):null,aoMap:l?await r(l):null}}}const _=i.reactive({});function F(){function e(n){return _[n]}function t(n,r){_[n]=r}return{state:_,...i.toRefs(_),getState:e,setState:t}}const w=i.shallowRef(),V=i.ref(!1);function Z(e,t,n){const{alpha:r=!0,antialias:c=!0,depth:p,logarithmicDepthBuffer:d,failIfMajorPerformanceCaveat:o,precision:a,premultipliedAlpha:l,stencil:s,shadows:u=!1,shadowMapType:h=g.PCFShadowMap,physicallyCorrectLights:v=!1,outputEncoding:y=g.LinearEncoding,toneMapping:M=g.NoToneMapping,toneMappingExposure:A=1,context:S=void 0,powerPreference:b="default",preserveDrawingBuffer:k=!1,clearColor:C,windowSize:Ce=!1}=i.toRefs(n),{width:N,height:R}=f.resolveUnref(Ce)?f.useWindowSize():f.useElementSize(t),{pixelRatio:E}=f.useDevicePixelRatio(),{pause:ye,resume:Se}=$(),Me=i.computed(()=>N.value/R.value),H=()=>{w.value&&(w.value.setSize(N.value,R.value),w.value.setPixelRatio(Math.min(E.value,2)))},ee=()=>{w.value&&(w.value.shadowMap.enabled=f.resolveUnref(u),w.value.shadowMap.type=f.resolveUnref(h),w.value.toneMapping=f.resolveUnref(M)||g.NoToneMapping,w.value.toneMappingExposure=f.resolveUnref(A),w.value.outputEncoding=f.resolveUnref(y)||g.LinearEncoding,C!=null&&C.value&&w.value.setClearColor(se(f.resolveUnref(C))),w.value.physicallyCorrectLights=f.resolveUnref(v))},Pe=()=>{const te=f.unrefElement(e);if(w.value||!te)return;w.value=new g.WebGLRenderer({canvas:te,alpha:f.resolveUnref(r),antialias:f.resolveUnref(c),context:f.resolveUnref(S),depth:f.resolveUnref(p),failIfMajorPerformanceCaveat:f.resolveUnref(o),logarithmicDepthBuffer:f.resolveUnref(d),powerPreference:f.resolveUnref(b),precision:f.resolveUnref(a),stencil:f.resolveUnref(s),preserveDrawingBuffer:f.resolveUnref(k),premultipliedAlpha:f.resolveUnref(l)});const{setState:Le}=F();Le("renderer",w.value),ee(),H(),Se(),V.value=!0},Ue=()=>{w.value&&(w.value.dispose(),w.value=void 0,V.value=!1,ye())};return i.watch([N,R,E],H),i.watch([u,h,y,v,M,A,C],ee),i.watch(()=>[e,t],()=>{f.unrefElement(e)&&f.unrefElement(t)&&Pe()},{immediate:!0,deep:!0}),{renderer:w,isReady:V,dispose:Ue,aspectRatio:Me}}const me=i.defineComponent({name:"TresCanvas",props:{shadows:Boolean,shadowMapType:Object,physicallyCorrectLights:Boolean,outputEncoding:Object,toneMapping:Object,toneMappingExposure:Number,context:Object,powerPreference:Object,preserveDrawingBuffer:Boolean,clearColor:String,windowSize:Boolean},setup(e,{slots:t,attrs:n}){const{logError:r}=x(),c=i.ref(),p=i.ref(),{renderer:d,dispose:o,aspectRatio:a}=Z(c,p,e),l=i.shallowRef();return i.provide("camera",l),i.provide("renderer",d),i.provide("aspect-ratio",a),t.default&&!t.default().some(s=>s.type.name==="Scene")&&r("TresCanvas must contain a Scene component."),t.default&&!t.default().some(s=>{var u;return(u=s.type.name)==null?void 0:u.includes("Camera")})&&r("Scene must contain a Camera component."),i.onBeforeUnmount(()=>o()),()=>{if(t.default)return i.h("div",{ref:p,style:{position:"relative",width:"100%",height:"100vh",...n.style}},[i.h("canvas",{ref:c,style:{width:"100%",height:"100%",position:"absolute",top:0,left:0}}),t.default()])}}}),ge=i.defineComponent({name:"Scene",setup(e,{slots:t}){const{scene:n}=z(),r=i.inject("renderer"),{activeCamera:c}=I(),{onLoop:p}=$();return i.provide("local-scene",n),p(()=>{r!=null&&r.value&&(c!=null&&c.value)&&(n!=null&&n.value)&&r.value.render(n==null?void 0:n.value,c.value)}),()=>{if(t.default)return t.default()}}}),he=Symbol("UseTresState"),we="1.3.3",ve={install(e,t){const n=(t==null?void 0:t.prefix)||"Tres";e.component(`${n}Canvas`,me),e.component(`${n}Scene`,ge);const{catalogue:r,extend:c}=T(e,n);e.provide("catalogue",r),e.provide("extend",c);const{createComponentInstances:p}=D(n);p(r).forEach(([o,a])=>{e.component(o,a)}),window.__TRES__={app:e,version:we}}};m.CameraType=q,m.UseTresStateSymbol=he,m.default=ve,m.trasverseObjects=Y,m.useCamera=I,m.useCatalogue=T,m.useInstanceCreator=D,m.useLoader=pe,m.useRenderLoop=$,m.useRenderer=Z,m.useScene=z,m.useTexture=de,m.useTres=F,Object.defineProperties(m,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});
+(function(g,i){typeof exports=="object"&&typeof module<"u"?i(exports,require("vue"),require("@vueuse/core"),require("three")):typeof define=="function"&&define.amd?define(["exports","vue","@vueuse/core","three"],i):(g=typeof globalThis<"u"?globalThis:g||self,i(g.tres={},g.Vue,g.VueUseCore,g.Three))})(this,function(g,i,l,m){"use strict";function re(e){const n=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const r in e)if(r!=="default"){const s=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(n,r,s.get?s:{enumerable:!0,get:()=>e[r]})}}return n.default=e,Object.freeze(n)}const q=re(m);var G=(e=>(e.Perspective="Perspective",e.Orthographic="Orthographic",e))(G||{});const b={cameras:[]},ae=45;let U;function D(){const{width:e,height:n}=l.useWindowSize(),{setState:r}=V();function s(t="Perspective",c){if(t==="Perspective"){const{near:f,far:a,fov:o}=c||{near:.1,far:1e3,fov:ae};U=new m.PerspectiveCamera(o,u.value,f,a),b.cameras.push(U)}else{const{left:f,right:a,top:o,bottom:C,near:w,far:y}=c||{left:-100,right:100,top:100,bottom:-100,near:.1,far:1e3};U=new m.OrthographicCamera(f,a,o,C,w,y),b.cameras.push(U)}return b.cameras.push(U),U}const u=i.computed(()=>e.value/n.value),p=i.computed(()=>b.cameras[0]);function d(){p.value instanceof m.PerspectiveCamera&&(p.value.aspect=u.value),p.value.updateProjectionMatrix()}function v(t){const c=i.inject("camera");t&&c&&(c.value=t,r("camera",c.value)),b.cameras.push(t),t instanceof m.PerspectiveCamera&&(t.aspect=u.value),t.updateProjectionMatrix()}return i.watch(u,d),{activeCamera:p,createCamera:s,updateCamera:d,pushCamera:v}}const K="[TresJS ▲ ■ ●] ";function _(){function e(s,u){console.error(`${K} ${s}`,u||"")}function n(s){console.warn(`${K} ${s}`)}function r(s,u){}return{logError:e,logWarning:n,logMessage:r}}const O=i.ref({...q,uuid:q.MathUtils.generateUUID()});delete O.value.Scene;let L;function T(e,n="Tres"){const{logMessage:r,logError:s}=_();!L&&e&&(L=e);const{createComponentInstances:u}=$(n);return{extend:d=>{if(!d){s("No objects provided to extend catalogue");return}O.value=Object.assign(O.value,d);const v=u(i.ref(d));r("Adding objects to catalogue",{objects:d,catalogue:O.value.uuid}),L&&v.forEach(([t,c])=>{L._context.components[t]||L.component(t,c)})},catalogue:O}}const x=e=>typeof e<"u",oe=e=>typeof e=="function",B=e=>!!e&&e.constructor===Array;function se(e){return typeof e=="number"?[e,e,e]:e instanceof m.Vector3?[e.x,e.y,e.z]:e}function ie(e){return e instanceof m.Color?e:Array.isArray(e)?new m.Color(...e):new m.Color(e)}const ce=["rotation","scale","position"];function $(e){const{logMessage:n,logError:r}=_();function s(t,c){x(t)&&x(c)&&Object.entries(t).forEach(([f,a])=>{const o=f.replace(/(-\w)/g,C=>C[1].toUpperCase());c.setAttribute(o,new m.BufferAttribute(...a))})}function u(t,c){x(t)&&x(c)&&Object.entries(t).forEach(([f,a])=>{const o=f.replace(/(-\w)/g,C=>C[1].toUpperCase());if(!(o==="args"||a===void 0)){ce.includes(o)&&a&&(a=se(a)),t.ref&&(t.ref=c);try{if(c[o]&&x(c[o].set))c[o].set(...B(a)?a:[a]);else{if(a===""&&(a=!0),oe(c[o])){if(f==="center"&&!a)return;c[o](...B(a)?a:[a]);return}c[o]=a}}catch(C){r(`There was an error setting ${o} property`,C)}}})}function p(t){var a;const c=/^Symbol\(Fragment\)$/g,f=/^Symbol\(Text\)$/g;if(c.test(t.type.toString()))return t.children.map(o=>p(o));if(f.test(t.type.toString()))return;{const o=t.type.name.replace(e,""),{catalogue:C}=T(),w=i.inject("catalogue")||C;let y;return w&&((a=t==null?void 0:t.props)!=null&&a.args?w!=null&&w.value[o]?y=new w.value[o](...t.props.args):r(`There is no ${o} in the catalogue`,w==null?void 0:w.value.uuid):y=new w.value[o]),t!=null&&t.props&&(o==="BufferGeometry"?s(t.props,y):u(t.props,y)),y}}function d(t,c,f){if(f.default&&(f!=null&&f.default())){const a=f.default().map(o=>p(o));return new t(...a.flat().filter(Boolean))}else return c.args?new t(...c.args):new t}function v(t){return Object.entries(t.value).filter(([c,f])=>{var a,o;return(o=(a=f==null?void 0:f.prototype)==null?void 0:a.constructor)==null?void 0:o.toString().includes("class")}).map(([c,f])=>{const a=`${e}${c}`,o=i.defineComponent({name:a,setup(C,{slots:w,attrs:y,...j}){const{scene:N}=F(),S=i.inject("local-scene")||N,A=i.inject("catalogue"),{pushCamera:P}=D();let M=d(f,y,w);return u(y,M),(M instanceof m.PerspectiveCamera||M instanceof m.OrthographicCamera)&&P(M),M.isObject3D&&(S==null||S.value.add(M)),S!=null&&S.value&&M.isFog&&(S.value.fog=M),j.expose(M),n(a,{sceneuuid:S==null?void 0:S.value.uuid,catalogue:A==null?void 0:A.value.uuid,props:C,slots:w.default?w.default():void 0,attrs:y,ctx:j,scene:S}),()=>{}}});return[a,o]})}return{createComponentInstances:v,processProps:u,createInstanceFromVNode:p}}const J=l.createEventHook(),Q=l.createEventHook(),X=l.createEventHook(),Y=new m.Clock,{pause:ue,resume:le,isActive:fe}=l.useRafFn(()=>{const e=Y.getElapsedTime(),n=Y.getDelta();J.trigger({delta:n,elapsed:e}),Q.trigger({delta:n,elapsed:e}),X.trigger({delta:n,elapsed:e})},{immediate:!1});function z(){return{onBeforeLoop:J.on,onLoop:Q.on,onAfterLoop:X.on,pause:ue,resume:le,isActive:fe}}const pe=i.shallowRef(new m.Scene);function F(){return{scene:pe}}function Z(e){const n={nodes:{},materials:{}};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 de(e,n,r,s,u){const{logError:p}=_(),d=new e;u&&u(d),r&&r(d);const t=(Array.isArray(n)?n:[n]).map(c=>new Promise((f,a)=>{d.load(c,o=>{o.scene&&Object.assign(o,Z(o.scene)),f(o)},s,o=>a(p("[useLoader] - Failed to load resource",o)))}));return B(n)?await Promise.all(t):await t[0]}async function me(e){const n=new m.LoadingManager,r=new m.TextureLoader(n),s=u=>new Promise((p,d)=>{r.load(u,v=>p(v),()=>null,()=>{d(new Error("[useTextures] - Failed to load texture"))})});if(B(e)){const u=await Promise.all(e.map(p=>s(p)));return e.length>1?u:u[0]}else{const{map:u,displacementMap:p,normalMap:d,roughnessMap:v,metalnessMap:t,aoMap:c}=e;return{map:u?await s(u):null,displacementMap:p?await s(p):null,normalMap:d?await s(d):null,roughnessMap:v?await s(v):null,metalnessMap:t?await s(t):null,aoMap:c?await s(c):null}}}const I=i.reactive({});function V(){function e(r){return I[r]}function n(r,s){I[r]=s}return{state:I,...i.toRefs(I),getState:e,setState:n}}const h=i.shallowRef(),k=i.ref(!1);function E(e,n,r){const{alpha:s=!0,antialias:u=!0,depth:p,logarithmicDepthBuffer:d,failIfMajorPerformanceCaveat:v,precision:t,premultipliedAlpha:c,stencil:f,shadows:a=!1,shadowMapType:o=m.PCFShadowMap,physicallyCorrectLights:C=!1,outputEncoding:w=m.LinearEncoding,toneMapping:y=m.NoToneMapping,toneMappingExposure:j=1,context:N=void 0,powerPreference:S="default",preserveDrawingBuffer:A=!1,clearColor:P,windowSize:M=!1}=i.toRefs(r),{width:R,height:W}=l.resolveUnref(M)?l.useWindowSize():l.useElementSize(n),{pixelRatio:H}=l.useDevicePixelRatio(),{pause:ye,resume:Se}=z(),Me=i.computed(()=>R.value/W.value),ee=()=>{h.value&&(h.value.setSize(R.value,W.value),h.value.setPixelRatio(Math.min(H.value,2)))},te=()=>{h.value&&(h.value.shadowMap.enabled=l.resolveUnref(a),h.value.shadowMap.type=l.resolveUnref(o),h.value.toneMapping=l.resolveUnref(y)||m.NoToneMapping,h.value.toneMappingExposure=l.resolveUnref(j),h.value.outputEncoding=l.resolveUnref(w)||m.LinearEncoding,P!=null&&P.value&&h.value.setClearColor(ie(l.resolveUnref(P))),h.value.physicallyCorrectLights=l.resolveUnref(C))},Pe=()=>{const ne=l.unrefElement(e);if(h.value||!ne)return;h.value=new m.WebGLRenderer({canvas:ne,alpha:l.resolveUnref(s),antialias:l.resolveUnref(u),context:l.resolveUnref(N),depth:l.resolveUnref(p),failIfMajorPerformanceCaveat:l.resolveUnref(v),logarithmicDepthBuffer:l.resolveUnref(d),powerPreference:l.resolveUnref(S),precision:l.resolveUnref(t),stencil:l.resolveUnref(f),preserveDrawingBuffer:l.resolveUnref(A),premultipliedAlpha:l.resolveUnref(c)});const{setState:be}=V();be("renderer",h.value),te(),ee(),Se(),k.value=!0},Ue=()=>{h.value&&(h.value.dispose(),h.value=void 0,k.value=!1,ye())};return i.watch([R,W,H],ee),i.watch([a,o,w,C,y,j,P],te),i.watch(()=>[e,n],()=>{l.unrefElement(e)&&l.unrefElement(n)&&Pe()},{immediate:!0,deep:!0}),{renderer:h,isReady:k,dispose:Ue,aspectRatio:Me}}const ge=i.defineComponent({name:"TresCanvas",props:{shadows:Boolean,shadowMapType:Object,physicallyCorrectLights:Boolean,outputEncoding:Object,toneMapping:Object,toneMappingExposure:Number,context:Object,powerPreference:Object,preserveDrawingBuffer:Boolean,clearColor:String,windowSize:Boolean},setup(e,{slots:n,attrs:r}){const{logError:s}=_(),u=i.ref(),p=i.ref(),{renderer:d,dispose:v,aspectRatio:t}=E(u,p,e),c=i.shallowRef();return i.provide("camera",c),i.provide("renderer",d),i.provide("aspect-ratio",t),n.default&&!n.default().some(f=>f.type.name==="Scene")&&s("TresCanvas must contain a Scene component."),n.default&&!n.default().some(f=>{var a;return(a=f.type.name)==null?void 0:a.includes("Camera")})&&s("Scene must contain a Camera component."),i.onBeforeUnmount(()=>v()),()=>{if(n.default)return i.h("div",{ref:p,style:{position:"relative",width:"100%",height:"100vh",...r.style}},[i.h("canvas",{ref:u,style:{width:"100%",height:"100%",position:"absolute",top:0,left:0}}),n.default()])}}}),he=i.defineComponent({name:"Scene",setup(e,{slots:n}){const{scene:r}=F(),s=i.inject("renderer"),{activeCamera:u}=D(),{onLoop:p}=z();return i.provide("local-scene",r),p(()=>{s!=null&&s.value&&(u!=null&&u.value)&&(r!=null&&r.value)&&s.value.render(r==null?void 0:r.value,u.value)}),()=>{if(n.default)return n.default()}}}),we=Symbol("UseTresState"),ve="1.4.0",Ce={install(e,n){const r=(n==null?void 0:n.prefix)||"Tres";e.component(`${r}Canvas`,ge),e.component(`${r}Scene`,he);const{catalogue:s,extend:u}=T(e,r);e.provide("catalogue",s),e.provide("extend",u);const{createComponentInstances:p}=$(r);p(s).forEach(([v,t])=>{e.component(v,t)}),window.__TRES__={app:e,version:ve}}};g.CameraType=G,g.UseTresStateSymbol=we,g.default=Ce,g.trasverseObjects=Z,g.useCamera=D,g.useCatalogue=T,g.useInstanceCreator=$,g.useLoader=de,g.useRenderLoop=z,g.useRenderer=E,g.useScene=F,g.useTexture=me,g.useTres=V,Object.defineProperties(g,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@tresjs/core",
   "description": "Declarative ThreeJS using Vue Components",
-  "version": "1.3.3",
+  "version": "1.4.0",
   "type": "module",
   "author": "Alvaro Saburido <hola@alvarosaburido.dev> (https://github.com/alvarosabu/)",
   "files": [
@@ -30,7 +30,7 @@
     "threejs-vue"
   ],
   "dependencies": {
-    "three": "^0.147.0",
+    "three": "^0.148.0",
     "vue": "^3.2.45"
   },
   "peerDependencies": {
@@ -54,7 +54,7 @@
     "rollup-plugin-analyzer": "^4.0.0",
     "rollup-plugin-visualizer": "^5.8.3",
     "unplugin-vue-components": "^0.22.12",
-    "vite": "^4.0.2",
+    "vite": "^4.0.3",
     "vite-plugin-banner": "^0.7.0",
     "vite-plugin-dts": "^1.7.1",
     "vite-plugin-glsl": "^1.0.1",