@tresjs/core 1.3.3 → 1.5.0

package/dist/core/useRenderer/component.d.ts

@@ -14,7 +14,10 @@ export declare const TresCanvas: import("vue").DefineComponent<{
     powerPreference: PropType<"high-performance" | "low-power" | "default">;
     preserveDrawingBuffer: BooleanConstructor;
     clearColor: StringConstructor;
-    windowSize: BooleanConstructor;
+    windowSize: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
 }, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
     [key: string]: any;
 }> | undefined, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
@@ -28,7 +31,10 @@ export declare const TresCanvas: import("vue").DefineComponent<{
     powerPreference: PropType<"high-performance" | "low-power" | "default">;
     preserveDrawingBuffer: BooleanConstructor;
     clearColor: StringConstructor;
-    windowSize: BooleanConstructor;
+    windowSize: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
 }>>, {
     shadows: boolean;
     physicallyCorrectLights: boolean;

package/dist/tres.js

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