@tresjs/core 2.0.0-alpha.0 → 2.0.0-alpha.2

package/dist/tres.js

@@ -1,31 +1,31 @@
 /**
  * name: @tresjs/core
- * version: v2.0.0-alpha.0
+ * version: v2.0.0-alpha.2
  * (c) 2023
  * description: Declarative ThreeJS using Vue Components
  * author: Alvaro Saburido <hola@alvarosaburido.dev> (https://github.com/alvarosabu/)
  */
-import { ref as y, watchEffect as Ee, toRef as xe, shallowRef as ne, toRefs as ae, computed as re, watch as T, shallowReactive as Pe, createRenderer as Re, defineComponent as Se, h as x } from "vue";
+import { ref as M, watchEffect as Ee, toRef as xe, shallowRef as ne, toRefs as ae, computed as re, watch as O, shallowReactive as Pe, createRenderer as Re, defineComponent as Se, h as P } from "vue";
 import * as oe from "three";
-import { MathUtils as Te, PerspectiveCamera as _, OrthographicCamera as Oe, Clock as ie, Color as W, sRGBEncoding as Ae, ACESFilmicToneMapping as ke, PCFSoftShadowMap as je, PCFShadowMap as De, LinearEncoding as Y, NoToneMapping as Q, WebGLRenderer as Fe, LoadingManager as _e, TextureLoader as We, Raycaster as ze, Vector2 as Be, Mesh as Ie } from "three";
-import { createEventHook as U, useRafFn as He, resolveUnref as u, useWindowSize as Ge, useElementSize as Ue, useDevicePixelRatio as Ve, unrefElement as z, useEventListener as $e, isFunction as Z } from "@vueuse/core";
-const G = y({ uuid: Te.generateUUID() }), se = (e) => void Object.assign(G.value, e);
-var Ne = /* @__PURE__ */ ((e) => (e.Perspective = "Perspective", e.Orthographic = "Orthographic", e))(Ne || {});
-const qe = 45;
-let h;
+import { MathUtils as Te, PerspectiveCamera as _, OrthographicCamera as Ae, Clock as ie, Color as W, sRGBEncoding as Oe, ACESFilmicToneMapping as ke, PCFSoftShadowMap as je, PCFShadowMap as Be, LinearEncoding as Y, NoToneMapping as Q, WebGLRenderer as De, LoadingManager as Fe, TextureLoader as _e, Raycaster as We, Vector2 as ze, Mesh as Ie, BufferAttribute as He } from "three";
+import { createEventHook as U, useRafFn as Ge, resolveUnref as u, useWindowSize as Ue, useElementSize as $e, useDevicePixelRatio as Ne, unrefElement as z, useEventListener as Ve, isFunction as Z } from "@vueuse/core";
+const G = M({ uuid: Te.generateUUID() }), se = (e) => void Object.assign(G.value, e);
+var qe = /* @__PURE__ */ ((e) => (e.Perspective = "Perspective", e.Orthographic = "Orthographic", e))(qe || {});
+const Je = 45;
+let y;
 function ce() {
-  const { state: e, setState: t, aspectRatio: r } = k();
+  const { state: e, setState: t, aspectRatio: r } = L();
   function o(a = "Perspective", s) {
-    var l, f, d;
+    var l, p, m;
     if (a === "Perspective") {
-      const { near: m, far: g, fov: v } = s || {
+      const { near: d, far: w, fov: v } = s || {
         near: 0.1,
         far: 1e3,
-        fov: qe
+        fov: Je
       };
-      h = new _(v, ((l = e.aspectRatio) == null ? void 0 : l.value) || window.innerWidth / window.innerHeight, m, g), (f = e.cameras) == null || f.push(h);
+      y = new _(v, ((l = e.aspectRatio) == null ? void 0 : l.value) || window.innerWidth / window.innerHeight, d, w), (p = e.cameras) == null || p.push(y);
     } else {
-      const { left: m, right: g, top: v, bottom: b, near: L, far: E } = s || {
+      const { left: d, right: w, top: v, bottom: g, near: E, far: x } = s || {
         left: -100,
         right: 100,
         top: 100,
@@ -33,9 +33,9 @@ function ce() {
         near: 0.1,
         far: 1e3
       };
-      h = new Oe(m, g, v, b, L, E), (d = e.cameras) == null || d.push(h);
+      y = new Ae(d, w, v, g, E, x), (m = e.cameras) == null || m.push(y);
     }
-    return e.camera = h, t("camera", e.camera), h;
+    return e.camera = y, t("camera", e.camera), y;
   }
   function n() {
     var a;
@@ -58,33 +58,33 @@ function ce() {
     clearCameras: c
   };
 }
-const ue = U(), le = U(), V = U(), C = new ie();
-let O = 0, A = 0;
-const { pause: Je, resume: Ke, isActive: Xe } = He(
+const ue = U(), le = U(), $ = U(), C = new ie();
+let k = 0, j = 0;
+const { pause: Ke, resume: Xe, isActive: Ye } = Ge(
   () => {
-    ue.trigger({ delta: O, elapsed: A, clock: C }), le.trigger({ delta: O, elapsed: A, clock: C }), V.trigger({ delta: O, elapsed: A, clock: C });
+    ue.trigger({ delta: k, elapsed: j, clock: C }), le.trigger({ delta: k, elapsed: j, clock: C }), $.trigger({ delta: k, elapsed: j, clock: C });
   },
   { immediate: !1 }
 );
-V.on(() => {
-  O = C.getDelta(), A = C.getElapsedTime();
+$.on(() => {
+  k = C.getDelta(), j = C.getElapsedTime();
 });
-function $() {
+function N() {
   return {
     onBeforeLoop: ue.on,
     onLoop: le.on,
-    onAfterLoop: V.on,
-    pause: Je,
-    resume: Ke,
-    isActive: Xe
+    onAfterLoop: $.on,
+    pause: Ke,
+    resume: Xe,
+    isActive: Ye
   };
 }
-function Ye(e) {
+function Qe(e) {
   return e instanceof W ? e : Array.isArray(e) ? new W(...e) : new W(e);
 }
-const B = {
+const I = {
   realistic: {
-    outputEncoding: Ae,
+    outputEncoding: Oe,
     toneMapping: ke,
     toneMappingExposure: 3,
     shadowMap: {
@@ -96,18 +96,18 @@ const B = {
   for (const r of Object.keys(t))
     t[r] instanceof Object && Object.assign(t[r], fe(e[r], t[r]));
   return Object.assign(e || {}, t), e;
-}, Qe = "html,body,base,head,link,meta,style,title,address,article,aside,footer,header,hgroup,h1,h2,h3,h4,h5,h6,nav,section,div,dd,dl,dt,figcaption,figure,picture,hr,img,li,main,ol,p,pre,ul,a,b,abbr,bdi,bdo,br,cite,code,data,dfn,em,i,kbd,mark,q,rp,rt,ruby,s,samp,small,span,strong,sub,sup,time,u,var,wbr,area,audio,map,track,video,embed,object,param,source,canvas,script,noscript,del,ins,caption,col,colgroup,table,thead,tbody,td,th,tr,button,datalist,fieldset,form,input,label,legend,meter,optgroup,option,output,progress,select,textarea,details,dialog,menu,summary,template,blockquote,iframe,tfoot", Ze = /* @__PURE__ */ et(Qe);
-function I(e) {
+}, Ze = "html,body,base,head,link,meta,style,title,address,article,aside,footer,header,hgroup,h1,h2,h3,h4,h5,h6,nav,section,div,dd,dl,dt,figcaption,figure,picture,hr,img,li,main,ol,p,pre,ul,a,b,abbr,bdi,bdo,br,cite,code,data,dfn,em,i,kbd,mark,q,rp,rt,ruby,s,samp,small,span,strong,sub,sup,time,u,var,wbr,area,audio,map,track,video,embed,object,param,source,canvas,script,noscript,del,ins,caption,col,colgroup,table,thead,tbody,td,th,tr,button,datalist,fieldset,form,input,label,legend,meter,optgroup,option,output,progress,select,textarea,details,dialog,menu,summary,template,blockquote,iframe,tfoot", et = /* @__PURE__ */ tt(Ze);
+function R(e) {
   return e.replace(/-([a-z])/g, (t, r) => r.toUpperCase());
 }
-function et(e, t) {
+function tt(e, t) {
   const r = /* @__PURE__ */ Object.create(null), o = e.split(",");
   for (let n = 0; n < o.length; n++)
     r[o[n]] = !0;
   return t ? (n) => !!r[n.toLowerCase()] : (n) => !!r[n];
 }
-const p = ne(), H = y(!1);
-function tt(e, t, r) {
+const f = ne(), H = M(!1);
+function nt(e, t, r) {
   const {
     alpha: o = !0,
     antialias: n = !0,
@@ -116,35 +116,35 @@ function tt(e, t, r) {
     failIfMajorPerformanceCaveat: a,
     precision: s,
     premultipliedAlpha: l,
-    stencil: f,
-    shadows: d = !1,
-    shadowMapType: m = De,
-    physicallyCorrectLights: g = !1,
+    stencil: p,
+    shadows: m = !1,
+    shadowMapType: d = Be,
+    physicallyCorrectLights: w = !1,
     useLegacyLights: v = !1,
-    outputEncoding: b = Y,
-    toneMapping: L = Q,
-    toneMappingExposure: E = 1,
+    outputEncoding: g = Y,
+    toneMapping: E = Q,
+    toneMappingExposure: x = 1,
     context: de = void 0,
     powerPreference: ve = "default",
     preserveDrawingBuffer: ge = !1,
-    clearColor: M,
+    clearColor: b,
     windowSize: we = !1,
     preset: he = void 0
-  } = ae(r), { setState: D } = k(), { width: N, height: q } = u(we) ? Ge() : Ue(t), { logError: ye } = j(), { pixelRatio: J } = Ve(), { pause: Me, resume: Ce } = $(), F = re(() => N.value / q.value), K = () => {
-    p.value && (p.value.setSize(N.value, q.value), p.value.setPixelRatio(Math.min(J.value, 2)));
+  } = ae(r), { setState: D } = L(), { width: V, height: q } = u(we) ? Ue() : $e(t), { logError: ye } = B(), { pixelRatio: J } = Ne(), { pause: Me, resume: be } = N(), F = re(() => V.value / q.value), K = () => {
+    f.value && (f.value.setSize(V.value, q.value), f.value.setPixelRatio(Math.min(J.value, 2)));
   }, X = () => {
-    if (!p.value)
+    if (!f.value)
       return;
-    const w = u(he);
-    if (w) {
-      w in B || ye("Renderer Preset must be one of these: " + Object.keys(B).join(", ")), fe(p.value, B[w]);
+    const h = u(he);
+    if (h) {
+      h in I || ye("Renderer Preset must be one of these: " + Object.keys(I).join(", ")), fe(f.value, I[h]);
       return;
     }
-    p.value.shadowMap.enabled = u(d), p.value.shadowMap.type = u(m), p.value.toneMapping = u(L) || Q, p.value.toneMappingExposure = u(E), p.value.outputEncoding = u(b) || Y, M != null && M.value && p.value.setClearColor(Ye(u(M))), p.value.useLegacyLights = u(v);
-  }, be = () => {
-    const w = z(e);
-    w && (p.value = new Fe({
-      canvas: w,
+    f.value.shadowMap.enabled = u(m), f.value.shadowMap.type = u(d), f.value.toneMapping = u(E) || Q, f.value.toneMappingExposure = u(x), f.value.outputEncoding = u(g) || Y, b != null && b.value && f.value.setClearColor(Qe(u(b))), f.value.useLegacyLights = u(v);
+  }, Ce = () => {
+    const h = z(e);
+    h && (f.value = new De({
+      canvas: h,
       alpha: u(o),
       antialias: u(n),
       context: u(de),
@@ -153,55 +153,55 @@ function tt(e, t, r) {
       logarithmicDepthBuffer: u(c),
       powerPreference: u(ve),
       precision: u(s),
-      stencil: u(f),
+      stencil: u(p),
       preserveDrawingBuffer: u(ge),
       premultipliedAlpha: u(l)
-    }), D("renderer", p.value), D("clock", new ie()), D("aspectRatio", F), X(), K(), Ce(), H.value = !0);
+    }), D("renderer", f.value), D("clock", new ie()), D("aspectRatio", F), X(), K(), be(), H.value = !0);
   }, Le = () => {
-    p.value && (p.value.dispose(), p.value = void 0, H.value = !1, Me());
+    f.value && (f.value.dispose(), f.value = void 0, H.value = !1, Me());
   };
-  return T([F, J], K), T(
-    [d, m, b, v, L, E, M],
+  return O([F, J], K), O(
+    [m, d, g, v, E, x, b],
     X
-  ), T(
+  ), O(
     () => [e, t],
     () => {
-      z(e) && z(t) && be();
+      z(e) && z(t) && Ce();
     },
     { immediate: !0, deep: !0 }
   ), {
-    renderer: p,
+    renderer: f,
     isReady: H,
     dispose: Le,
     aspectRatio: F
   };
 }
 const pe = (e) => !!e && e.constructor === Array;
-function nt(e) {
+function at(e) {
   const t = { nodes: {}, materials: {} };
   return e && e.traverse((r) => {
     r.name && (t.nodes[r.name] = r), r.material && !t.materials[r.material.name] && (t.materials[r.material.name] = r.material);
   }), t;
 }
-async function dt(e, t, r, o, n) {
-  const { logError: i } = j(), c = new e();
+async function vt(e, t, r, o, n) {
+  const { logError: i } = B(), c = new e();
   n && n(c), r && r(c);
   const s = (Array.isArray(t) ? t : [t]).map(
-    (l) => new Promise((f, d) => {
+    (l) => new Promise((p, m) => {
       c.load(
         l,
-        (m) => {
-          m.scene && Object.assign(m, nt(m.scene)), f(m);
+        (d) => {
+          d.scene && Object.assign(d, at(d.scene)), p(d);
         },
         o,
-        (m) => d(i("[useLoader] - Failed to load resource", m))
+        (d) => m(i("[useLoader] - Failed to load resource", d))
       );
     })
   );
   return pe(t) ? await Promise.all(s) : await s[0];
 }
-async function vt(e) {
-  const t = new _e(), r = new We(t), o = (n) => new Promise((i, c) => {
+async function gt(e) {
+  const t = new Fe(), r = new _e(t), o = (n) => new Promise((i, c) => {
     r.load(
       n,
       (a) => i(a),
@@ -226,39 +226,39 @@ async function vt(e) {
     };
   }
 }
-const P = Pe({
+const S = Pe({
   camera: void 0,
   cameras: [],
   aspectRatio: re(() => window.innerWidth / window.innerHeight)
 });
-function k() {
+function L() {
   function e(r) {
-    return P[r];
+    return S[r];
   }
   function t(r, o) {
-    P[r] = o;
+    S[r] = o;
   }
   return {
-    state: P,
-    ...ae(P),
+    state: S,
+    ...ae(S),
     getState: e,
     setState: t
   };
 }
-const ee = ne(new ze()), R = y(new Be()), at = y(null);
+const ee = ne(new We()), T = M(new ze()), rt = M(null);
 function me() {
-  const { setState: e } = k();
-  e("raycaster", ee.value), e("pointer", R), e("currentInstance", at);
+  const { setState: e } = L();
+  e("raycaster", ee.value), e("pointer", T), e("currentInstance", rt);
   function t(r) {
-    R.value.x = r.clientX / window.innerWidth * 2 - 1, R.value.y = -(r.clientY / window.innerHeight) * 2 + 1;
+    T.value.x = r.clientX / window.innerWidth * 2 - 1, T.value.y = -(r.clientY / window.innerHeight) * 2 + 1;
   }
   return window.addEventListener("pointermove", t), {
     raycaster: ee,
-    pointer: R
+    pointer: T
   };
 }
-const gt = !0, te = "[TresJS ▲ ■ ●] ";
-function j() {
+const wt = !0, te = "[TresJS ▲ ■ ●] ";
+function B() {
   function e(o, n) {
     console.error(`${te} ${o}`, n || "");
   }
@@ -273,21 +273,21 @@ function j() {
     logMessage: r
   };
 }
-const { logWarning: rt } = j();
-function ot(e) {
+const { logWarning: ot } = B();
+function it(e) {
   for (const t in e)
     if (t.indexOf("on") === 0)
       return !0;
   return !1;
 }
-let S = null;
-const it = {
+let A = null;
+const st = {
   createElement(e, t, r, o) {
-    if (e === "template" || Ze(e))
+    if (e === "template" || et(e))
       return null;
     let n;
     if (o === null && (o = {}), o != null && o.args ? n = new G.value[e.replace("Tres", "")](...o.args) : n = new G.value[e.replace("Tres", "")](), n.isCamera) {
-      (!(o != null && o.position) || o != null && o.position.every((c) => c == 0)) && rt(
+      (!(o != null && o.position) || o != null && o.position.every((c) => c == 0)) && ot(
         // eslint-disable-next-line max-len
         "Camera is positioned at the center of the scene [0,0,0], if this is not intentional try setting a position if your scene seems empty 🤗"
       );
@@ -297,21 +297,21 @@ const it = {
     return (o == null ? void 0 : o.attach) === void 0 && (n.isMaterial ? n.attach = "material" : n.isBufferGeometry && (n.attach = "geometry")), n;
   },
   insert(e, t, r) {
-    if (S === null && t.isScene && (S = t), t === null && (t = S), t != null && t.isObject3D && (e != null && e.isObject3D)) {
+    if (A === null && t.isScene && (A = t), t === null && (t = A), t != null && t.isObject3D && (e != null && e.isObject3D)) {
       const a = r ? t.children.indexOf(r) : 0;
       e.parent = t, t.children.splice(a, 0, e), e.dispatchEvent({ type: "added" });
     } else
       typeof (e == null ? void 0 : e.attach) == "string" && (e.__previousAttach = e[t == null ? void 0 : t.attach], t && (t[e.attach] = e));
-    const { onLoop: o } = $();
+    const { onLoop: o } = N();
     let n = null, i = null;
     const { raycaster: c } = me();
-    e && e instanceof Ie && ot(e) && (o(() => {
+    e && e instanceof Ie && it(e) && (o(() => {
       var a, s, l;
       if (t != null && t.children && e && c) {
-        const f = c.value.intersectObjects(t.children);
-        f.length > 0 && f[0].object.uuid === e.uuid ? (i = f[0], (n === null || n.object.uuid !== (i == null ? void 0 : i.object.uuid)) && ((a = e.onPointerEnter) == null || a.call(e, i)), (s = e.onPointerMove) == null || s.call(e, i)) : (i = null, n !== null && ((l = e.onPointerLeave) == null || l.call(e, n))), n = i;
+        const p = c.value.intersectObjects(t.children);
+        p.length > 0 && p[0].object.uuid === e.uuid ? (i = p[0], (n === null || n.object.uuid !== (i == null ? void 0 : i.object.uuid)) && ((a = e.onPointerEnter) == null || a.call(e, i)), (s = e.onPointerMove) == null || s.call(e, i)) : (i = null, n !== null && ((l = e.onPointerLeave) == null || l.call(e, n))), n = i;
       }
-    }), $e(window, "click", () => {
+    }), Ve(window, "click", () => {
       var a;
       i !== null && ((a = e.onClick) == null || a.call(e, i));
     }));
@@ -325,11 +325,14 @@ const it = {
   patchProp(e, t, r, o) {
     if (e) {
       let n = e, i = t;
-      const c = I(i);
+      const c = R(i);
       let a = n == null ? void 0 : n[c];
-      if (e.parent || (e.parent = S), i.includes("-") && a === void 0) {
+      if (e.parent || (e.parent = A), n.type === "BufferGeometry" && (i = i.split("-").pop(), n.setAttribute(
+        R(i),
+        new He(...o)
+      )), i.includes("-") && a === void 0) {
         const l = i.split("-");
-        a = l.reduce((f, d) => f[I(d)], n), i = l.pop(), a != null && a.set || (n = l.reduce((f, d) => f[I(d)], n));
+        a = l.reduce((p, m) => p[R(m)], n), i = l.pop(), a != null && a.set || (n = l.reduce((p, m) => p[R(m)], n));
       }
       let s = o;
       if (s === "" && (s = !0), Z(a))
@@ -349,15 +352,15 @@ const it = {
   setScopeId: () => void 0,
   cloneNode: () => void 0,
   insertStaticContent: () => void 0
-}, { createApp: st } = Re(it), ct = (e) => {
-  const t = st(r);
+}, { createApp: ct } = Re(st), ut = (e) => {
+  const t = ct(r);
   function r() {
     return e && e.default ? e.default() : [];
   }
   return t;
 };
 se(oe);
-const { logWarning: ut } = j(), lt = Se({
+const { logWarning: lt } = B(), ft = Se({
   name: "TresCanvas",
   props: [
     "shadows",
@@ -375,24 +378,25 @@ const { logWarning: ut } = j(), lt = Se({
     "preset"
   ],
   setup(e, { slots: t, expose: r }) {
-    e.physicallyCorrectLights === !0 && ut("physicallyCorrectLights is deprecated, useLegacyLights is now false by default");
-    const o = y(), n = y(), i = new oe.Scene();
-    function c() {
-      const { renderer: l } = tt(n, o, e), { activeCamera: f } = ce(), { onLoop: d } = $(), { raycaster: m, pointer: g } = me();
+    e.physicallyCorrectLights === !0 && lt("physicallyCorrectLights is deprecated, useLegacyLights is now false by default");
+    const o = M(), n = M(), i = new oe.Scene(), { setState: c } = L();
+    c("scene", i);
+    function a() {
+      const { renderer: p } = nt(n, o, e), { activeCamera: m } = ce(), { onLoop: d } = N(), { raycaster: w, pointer: v } = me();
       d(() => {
-        var v;
-        f.value && (m.value.setFromCamera(g.value, f.value), (v = l.value) == null || v.render(i, f.value));
+        var g;
+        m.value && (w.value.setFromCamera(v.value, m.value), (g = p.value) == null || g.render(i, m.value));
       });
     }
-    T(n, c);
-    let a;
-    function s() {
-      a = ct(t), a.provide("useTres", k()), a.provide("extend", se), a.mount(i);
+    O(n, a);
+    let s;
+    function l() {
+      s = ut(t), s.provide("useTres", L()), s.provide("extend", se), s.mount(i);
     }
-    return s(), r({
+    return l(), r({
       scene: i
-    }), () => x(
-      x(
+    }), () => P(
+      P(
         "div",
         {
           ref: o,
@@ -405,7 +409,7 @@ const { logWarning: ut } = j(), lt = Se({
           }
         },
         [
-          x(
+          P(
             "div",
             {
               style: {
@@ -414,7 +418,7 @@ const { logWarning: ut } = j(), lt = Se({
               }
             },
             [
-              x("canvas", {
+              P("canvas", {
                 ref: n,
                 style: {
                   display: "block",
@@ -431,25 +435,25 @@ const { logWarning: ut } = j(), lt = Se({
       )
     );
   }
-}), wt = {
+}), ht = {
   install(e) {
-    e.component("TresCanvas", lt);
+    e.component("TresCanvas", ft);
   }
 };
 export {
-  Ne as CameraType,
-  lt as TresCanvas,
+  qe as CameraType,
+  ft as TresCanvas,
   G as catalogue,
-  wt as default,
+  ht as default,
   se as extend,
-  gt as isProd,
-  nt as trasverseObjects,
+  wt as isProd,
+  at as trasverseObjects,
   ce as useCamera,
-  dt as useLoader,
-  j as useLogger,
+  vt as useLoader,
+  B as useLogger,
   me as useRaycaster,
-  $ as useRenderLoop,
-  tt as useRenderer,
-  vt as useTexture,
-  k as useTres
+  N as useRenderLoop,
+  nt as useRenderer,
+  gt as useTexture,
+  L as useTres
 };

package/dist/tres.umd.cjs

@@ -1,8 +1,8 @@
 /**
  * name: @tresjs/core
- * version: v2.0.0-alpha.0
+ * version: v2.0.0-alpha.2
  * (c) 2023
  * description: Declarative ThreeJS using Vue Components
  * author: Alvaro Saburido <hola@alvarosaburido.dev> (https://github.com/alvarosabu/)
  */
-(function(f,u){typeof exports=="object"&&typeof module<"u"?u(exports,require("vue"),require("three"),require("@vueuse/core")):typeof define=="function"&&define.amd?define(["exports","vue","three","@vueuse/core"],u):(f=typeof globalThis<"u"?globalThis:f||self,u(f.tres={},f.Vue,f.Three,f.VueUseCore))})(this,function(f,u,c,s){"use strict";function se(e){const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const r in e)if(r!=="default"){const o=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(t,r,o.get?o:{enumerable:!0,get:()=>e[r]})}}return t.default=e,Object.freeze(t)}const $=se(c),O=u.ref({uuid:c.MathUtils.generateUUID()}),z=e=>void Object.assign(O.value,e);var J=(e=>(e.Perspective="Perspective",e.Orthographic="Orthographic",e))(J||{});const ue=45;let y;function R(){const{state:e,setState:t,aspectRatio:r}=L();function o(a="Perspective",l){var m,v,w;if(a==="Perspective"){const{near:g,far:C,fov:h}=l||{near:.1,far:1e3,fov:ue};y=new c.PerspectiveCamera(h,((m=e.aspectRatio)==null?void 0:m.value)||window.innerWidth/window.innerHeight,g,C),(v=e.cameras)==null||v.push(y)}else{const{left:g,right:C,top:h,bottom:T,near:D,far:F}=l||{left:-100,right:100,top:100,bottom:-100,near:.1,far:1e3};y=new c.OrthographicCamera(g,C,h,T,D,F),(w=e.cameras)==null||w.push(y)}return e.camera=y,t("camera",e.camera),y}function n(){var a;e.camera instanceof c.PerspectiveCamera&&e.aspectRatio&&(e.camera.aspect=e.aspectRatio.value),(a=e.camera)==null||a.updateProjectionMatrix()}function i(a){var l;(l=e.cameras)==null||l.push(a),a instanceof c.PerspectiveCamera&&e.aspectRatio&&(a.aspect=e.aspectRatio.value),a.updateProjectionMatrix(),t("camera",a)}function p(){e.cameras=[]}return u.watchEffect(()=>{r!=null&&r.value&&n()}),{activeCamera:u.toRef(e,"camera"),createCamera:o,updateCamera:n,pushCamera:i,clearCameras:p}}const K=s.createEventHook(),X=s.createEventHook(),W=s.createEventHook(),b=new c.Clock;let U=0,k=0;const{pause:le,resume:ce,isActive:fe}=s.useRafFn(()=>{K.trigger({delta:U,elapsed:k,clock:b}),X.trigger({delta:U,elapsed:k,clock:b}),W.trigger({delta:U,elapsed:k,clock:b})},{immediate:!1});W.on(()=>{U=b.getDelta(),k=b.getElapsedTime()});function j(){return{onBeforeLoop:K.on,onLoop:X.on,onAfterLoop:W.on,pause:le,resume:ce,isActive:fe}}function pe(e){return e instanceof c.Color?e:Array.isArray(e)?new c.Color(...e):new c.Color(e)}const B={realistic:{outputEncoding:c.sRGBEncoding,toneMapping:c.ACESFilmicToneMapping,toneMappingExposure:3,shadowMap:{enabled:!0,type:c.PCFSoftShadowMap}}},Y=(e,t)=>{for(const r of Object.keys(t))t[r]instanceof Object&&Object.assign(t[r],Y(e[r],t[r]));return Object.assign(e||{},t),e},de=me("html,body,base,head,link,meta,style,title,address,article,aside,footer,header,hgroup,h1,h2,h3,h4,h5,h6,nav,section,div,dd,dl,dt,figcaption,figure,picture,hr,img,li,main,ol,p,pre,ul,a,b,abbr,bdi,bdo,br,cite,code,data,dfn,em,i,kbd,mark,q,rp,rt,ruby,s,samp,small,span,strong,sub,sup,time,u,var,wbr,area,audio,map,track,video,embed,object,param,source,canvas,script,noscript,del,ins,caption,col,colgroup,table,thead,tbody,td,th,tr,button,datalist,fieldset,form,input,label,legend,meter,optgroup,option,output,progress,select,textarea,details,dialog,menu,summary,template,blockquote,iframe,tfoot");function I(e){return e.replace(/-([a-z])/g,(t,r)=>r.toUpperCase())}function me(e,t){const r=Object.create(null),o=e.split(",");for(let n=0;n<o.length;n++)r[o[n]]=!0;return t?n=>!!r[n.toLowerCase()]:n=>!!r[n]}const d=u.shallowRef(),V=u.ref(!1);function Q(e,t,r){const{alpha:o=!0,antialias:n=!0,depth:i,logarithmicDepthBuffer:p,failIfMajorPerformanceCaveat:a,precision:l,premultipliedAlpha:m,stencil:v,shadows:w=!1,shadowMapType:g=c.PCFShadowMap,physicallyCorrectLights:C=!1,useLegacyLights:h=!1,outputEncoding:T=c.LinearEncoding,toneMapping:D=c.NoToneMapping,toneMappingExposure:F=1,context:Oe=void 0,powerPreference:Ue="default",preserveDrawingBuffer:ke=!1,clearColor:S,windowSize:je=!1,preset:xe=void 0}=u.toRefs(r),{setState:G}=L(),{width:ne,height:ae}=s.resolveUnref(je)?s.useWindowSize():s.useElementSize(t),{logError:Ae}=P(),{pixelRatio:re}=s.useDevicePixelRatio(),{pause:_e,resume:Te}=j(),N=u.computed(()=>ne.value/ae.value),oe=()=>{d.value&&(d.value.setSize(ne.value,ae.value),d.value.setPixelRatio(Math.min(re.value,2)))},ie=()=>{if(!d.value)return;const M=s.resolveUnref(xe);if(M){M in B||Ae("Renderer Preset must be one of these: "+Object.keys(B).join(", ")),Y(d.value,B[M]);return}d.value.shadowMap.enabled=s.resolveUnref(w),d.value.shadowMap.type=s.resolveUnref(g),d.value.toneMapping=s.resolveUnref(D)||c.NoToneMapping,d.value.toneMappingExposure=s.resolveUnref(F),d.value.outputEncoding=s.resolveUnref(T)||c.LinearEncoding,S!=null&&S.value&&d.value.setClearColor(pe(s.resolveUnref(S))),d.value.useLegacyLights=s.resolveUnref(h)},De=()=>{const M=s.unrefElement(e);M&&(d.value=new c.WebGLRenderer({canvas:M,alpha:s.resolveUnref(o),antialias:s.resolveUnref(n),context:s.resolveUnref(Oe),depth:s.resolveUnref(i),failIfMajorPerformanceCaveat:s.resolveUnref(a),logarithmicDepthBuffer:s.resolveUnref(p),powerPreference:s.resolveUnref(Ue),precision:s.resolveUnref(l),stencil:s.resolveUnref(v),preserveDrawingBuffer:s.resolveUnref(ke),premultipliedAlpha:s.resolveUnref(m)}),G("renderer",d.value),G("clock",new c.Clock),G("aspectRatio",N),ie(),oe(),Te(),V.value=!0)},Fe=()=>{d.value&&(d.value.dispose(),d.value=void 0,V.value=!1,_e())};return u.watch([N,re],oe),u.watch([w,g,T,h,D,F,S],ie),u.watch(()=>[e,t],()=>{s.unrefElement(e)&&s.unrefElement(t)&&De()},{immediate:!0,deep:!0}),{renderer:d,isReady:V,dispose:Fe,aspectRatio:N}}const Z=e=>!!e&&e.constructor===Array;function E(e){const t={nodes:{},materials:{}};return e&&e.traverse(r=>{r.name&&(t.nodes[r.name]=r),r.material&&!t.materials[r.material.name]&&(t.materials[r.material.name]=r.material)}),t}async function ve(e,t,r,o,n){const{logError:i}=P(),p=new e;n&&n(p),r&&r(p);const l=(Array.isArray(t)?t:[t]).map(m=>new Promise((v,w)=>{p.load(m,g=>{g.scene&&Object.assign(g,E(g.scene)),v(g)},o,g=>w(i("[useLoader] - Failed to load resource",g)))}));return Z(t)?await Promise.all(l):await l[0]}async function ge(e){const t=new c.LoadingManager,r=new c.TextureLoader(t),o=n=>new Promise((i,p)=>{r.load(n,a=>i(a),()=>null,()=>{p(new Error("[useTextures] - Failed to load texture"))})});if(Z(e)){const n=await Promise.all(e.map(i=>o(i)));return e.length>1?n:n[0]}else{const{map:n,displacementMap:i,normalMap:p,roughnessMap:a,metalnessMap:l,aoMap:m}=e;return{map:n?await o(n):null,displacementMap:i?await o(i):null,normalMap:p?await o(p):null,roughnessMap:a?await o(a):null,metalnessMap:l?await o(l):null,aoMap:m?await o(m):null}}}const x=u.shallowReactive({camera:void 0,cameras:[],aspectRatio:u.computed(()=>window.innerWidth/window.innerHeight)});function L(){function e(r){return x[r]}function t(r,o){x[r]=o}return{state:x,...u.toRefs(x),getState:e,setState:t}}const H=u.shallowRef(new c.Raycaster),A=u.ref(new c.Vector2),we=u.ref(null);function q(){const{setState:e}=L();e("raycaster",H.value),e("pointer",A),e("currentInstance",we);function t(r){A.value.x=r.clientX/window.innerWidth*2-1,A.value.y=-(r.clientY/window.innerHeight)*2+1}return window.addEventListener("pointermove",t),{raycaster:H,pointer:A}}const he=!0,ee="[TresJS ▲ ■ ●] ";function P(){function e(o,n){console.error(`${ee} ${o}`,n||"")}function t(o){console.warn(`${ee} ${o}`)}function r(o,n){}return{logError:e,logWarning:t,logMessage:r}}const{logWarning:ye}=P();function Ce(e){for(const t in e)if(t.indexOf("on")===0)return!0;return!1}function Re(e){}let _=null;const Me={createElement(e,t,r,o){if(e==="template"||de(e))return null;let n;if(o===null&&(o={}),o!=null&&o.args?n=new O.value[e.replace("Tres","")](...o.args):n=new O.value[e.replace("Tres","")],n.isCamera){(!(o!=null&&o.position)||o!=null&&o.position.every(p=>p==0))&&ye("Camera is positioned at the center of the scene [0,0,0], if this is not intentional try setting a position if your scene seems empty 🤗");const{pushCamera:i}=R();i(n)}return(o==null?void 0:o.attach)===void 0&&(n.isMaterial?n.attach="material":n.isBufferGeometry&&(n.attach="geometry")),n},insert(e,t,r){if(_===null&&t.isScene&&(_=t),t===null&&(t=_),t!=null&&t.isObject3D&&(e!=null&&e.isObject3D)){const a=r?t.children.indexOf(r):0;e.parent=t,t.children.splice(a,0,e),e.dispatchEvent({type:"added"})}else typeof(e==null?void 0:e.attach)=="string"&&(e.__previousAttach=e[t==null?void 0:t.attach],t&&(t[e.attach]=e));const{onLoop:o}=j();let n=null,i=null;const{raycaster:p}=q();e&&e instanceof c.Mesh&&Ce(e)&&(o(()=>{var a,l,m;if(t!=null&&t.children&&e&&p){const v=p.value.intersectObjects(t.children);v.length>0&&v[0].object.uuid===e.uuid?(i=v[0],(n===null||n.object.uuid!==(i==null?void 0:i.object.uuid))&&((a=e.onPointerEnter)==null||a.call(e,i)),(l=e.onPointerMove)==null||l.call(e,i)):(i=null,n!==null&&((m=e.onPointerLeave)==null||m.call(e,n))),n=i}}),s.useEventListener(window,"click",()=>{var a;i!==null&&((a=e.onClick)==null||a.call(e,i))}))},remove(e){if(!e)return;const t=e.parentNode;t&&t.removeChild(e)},patchProp(e,t,r,o){if(e){let n=e,i=t;const p=I(i);let a=n==null?void 0:n[p];if(e.parent||(e.parent=_),i.includes("-")&&a===void 0){const m=i.split("-");a=m.reduce((v,w)=>v[I(w)],n),i=m.pop(),a!=null&&a.set||(n=m.reduce((v,w)=>v[I(w)],n))}let l=o;if(l===""&&(l=!0),s.isFunction(a))return;!(a!=null&&a.set)&&!s.isFunction(a)?n[p]=l:a.constructor===l.constructor&&(a!=null&&a.copy)?a==null||a.copy(l):Array.isArray(l)?a.set(...l):!a.isColor&&a.setScalar?a.setScalar(l):a.set(l)}},parentNode(e){return(e==null?void 0:e.parent)||null},createText:()=>void 0,createComment:()=>void 0,setText:()=>void 0,setElementText:()=>void 0,nextSibling:()=>void 0,querySelector:()=>void 0,setScopeId:()=>void 0,cloneNode:()=>void 0,insertStaticContent:()=>void 0},{createApp:be}=u.createRenderer(Me),Le=e=>{const t=be(r);function r(){return e&&e.default?e.default():[]}return t};z($);const{logWarning:Pe}=P(),te=u.defineComponent({name:"TresCanvas",props:["shadows","shadowMapType","physicallyCorrectLights","useLegacyLights","outputEncoding","toneMapping","toneMappingExposure","context","powerPreference","preserveDrawingBuffer","clearColor","windowSize","preset"],setup(e,{slots:t,expose:r}){e.physicallyCorrectLights===!0&&Pe("physicallyCorrectLights is deprecated, useLegacyLights is now false by default");const o=u.ref(),n=u.ref(),i=new $.Scene;function p(){const{renderer:m}=Q(n,o,e),{activeCamera:v}=R(),{onLoop:w}=j(),{raycaster:g,pointer:C}=q();w(()=>{var h;v.value&&(g.value.setFromCamera(C.value,v.value),(h=m.value)==null||h.render(i,v.value))})}u.watch(n,p);let a;function l(){a=Le(t),a.provide("useTres",L()),a.provide("extend",z),a.mount(i)}return l(),r({scene:i}),()=>u.h(u.h("div",{ref:o,style:{position:"relative",width:"100%",height:"100%",pointerEvents:"auto",touchAction:"none"}},[u.h("div",{style:{width:"100%",height:"100%"}},[u.h("canvas",{ref:n,style:{display:"block",width:"100%",height:"100%",position:e.windowSize?"fixed":"absolute",top:0,left:0}})])]))}}),Se={install(e){e.component("TresCanvas",te)}};f.CameraType=J,f.TresCanvas=te,f.catalogue=O,f.default=Se,f.extend=z,f.isProd=he,f.trasverseObjects=E,f.useCamera=R,f.useLoader=ve,f.useLogger=P,f.useRaycaster=q,f.useRenderLoop=j,f.useRenderer=Q,f.useTexture=ge,f.useTres=L,Object.defineProperties(f,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});
+(function(f,l){typeof exports=="object"&&typeof module<"u"?l(exports,require("vue"),require("three"),require("@vueuse/core")):typeof define=="function"&&define.amd?define(["exports","vue","three","@vueuse/core"],l):(f=typeof globalThis<"u"?globalThis:f||self,l(f.tres={},f.Vue,f.Three,f.VueUseCore))})(this,function(f,l,c,s){"use strict";function se(e){const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const a in e)if(a!=="default"){const o=Object.getOwnPropertyDescriptor(e,a);Object.defineProperty(t,a,o.get?o:{enumerable:!0,get:()=>e[a]})}}return t.default=e,Object.freeze(t)}const $=se(c),U=l.ref({uuid:c.MathUtils.generateUUID()}),z=e=>void Object.assign(U.value,e);var J=(e=>(e.Perspective="Perspective",e.Orthographic="Orthographic",e))(J||{});const ue=45;let C;function W(){const{state:e,setState:t,aspectRatio:a}=M();function o(r="Perspective",u){var d,v,g;if(r==="Perspective"){const{near:w,far:b,fov:h}=u||{near:.1,far:1e3,fov:ue};C=new c.PerspectiveCamera(h,((d=e.aspectRatio)==null?void 0:d.value)||window.innerWidth/window.innerHeight,w,b),(v=e.cameras)==null||v.push(C)}else{const{left:w,right:b,top:h,bottom:y,near:F,far:B}=u||{left:-100,right:100,top:100,bottom:-100,near:.1,far:1e3};C=new c.OrthographicCamera(w,b,h,y,F,B),(g=e.cameras)==null||g.push(C)}return e.camera=C,t("camera",e.camera),C}function n(){var r;e.camera instanceof c.PerspectiveCamera&&e.aspectRatio&&(e.camera.aspect=e.aspectRatio.value),(r=e.camera)==null||r.updateProjectionMatrix()}function i(r){var u;(u=e.cameras)==null||u.push(r),r instanceof c.PerspectiveCamera&&e.aspectRatio&&(r.aspect=e.aspectRatio.value),r.updateProjectionMatrix(),t("camera",r)}function p(){e.cameras=[]}return l.watchEffect(()=>{a!=null&&a.value&&n()}),{activeCamera:l.toRef(e,"camera"),createCamera:o,updateCamera:n,pushCamera:i,clearCameras:p}}const K=s.createEventHook(),X=s.createEventHook(),I=s.createEventHook(),P=new c.Clock;let k=0,A=0;const{pause:le,resume:ce,isActive:fe}=s.useRafFn(()=>{K.trigger({delta:k,elapsed:A,clock:P}),X.trigger({delta:k,elapsed:A,clock:P}),I.trigger({delta:k,elapsed:A,clock:P})},{immediate:!1});I.on(()=>{k=P.getDelta(),A=P.getElapsedTime()});function j(){return{onBeforeLoop:K.on,onLoop:X.on,onAfterLoop:I.on,pause:le,resume:ce,isActive:fe}}function pe(e){return e instanceof c.Color?e:Array.isArray(e)?new c.Color(...e):new c.Color(e)}const R={realistic:{outputEncoding:c.sRGBEncoding,toneMapping:c.ACESFilmicToneMapping,toneMappingExposure:3,shadowMap:{enabled:!0,type:c.PCFSoftShadowMap}}},Y=(e,t)=>{for(const a of Object.keys(t))t[a]instanceof Object&&Object.assign(t[a],Y(e[a],t[a]));return Object.assign(e||{},t),e},de=me("html,body,base,head,link,meta,style,title,address,article,aside,footer,header,hgroup,h1,h2,h3,h4,h5,h6,nav,section,div,dd,dl,dt,figcaption,figure,picture,hr,img,li,main,ol,p,pre,ul,a,b,abbr,bdi,bdo,br,cite,code,data,dfn,em,i,kbd,mark,q,rp,rt,ruby,s,samp,small,span,strong,sub,sup,time,u,var,wbr,area,audio,map,track,video,embed,object,param,source,canvas,script,noscript,del,ins,caption,col,colgroup,table,thead,tbody,td,th,tr,button,datalist,fieldset,form,input,label,legend,meter,optgroup,option,output,progress,select,textarea,details,dialog,menu,summary,template,blockquote,iframe,tfoot");function x(e){return e.replace(/-([a-z])/g,(t,a)=>a.toUpperCase())}function me(e,t){const a=Object.create(null),o=e.split(",");for(let n=0;n<o.length;n++)a[o[n]]=!0;return t?n=>!!a[n.toLowerCase()]:n=>!!a[n]}const m=l.shallowRef(),G=l.ref(!1);function Q(e,t,a){const{alpha:o=!0,antialias:n=!0,depth:i,logarithmicDepthBuffer:p,failIfMajorPerformanceCaveat:r,precision:u,premultipliedAlpha:d,stencil:v,shadows:g=!1,shadowMapType:w=c.PCFShadowMap,physicallyCorrectLights:b=!1,useLegacyLights:h=!1,outputEncoding:y=c.LinearEncoding,toneMapping:F=c.NoToneMapping,toneMappingExposure:B=1,context:Oe=void 0,powerPreference:Ue="default",preserveDrawingBuffer:ke=!1,clearColor:O,windowSize:Ae=!1,preset:je=void 0}=l.toRefs(a),{setState:N}=M(),{width:ne,height:ae}=s.resolveUnref(Ae)?s.useWindowSize():s.useElementSize(t),{logError:xe}=S(),{pixelRatio:re}=s.useDevicePixelRatio(),{pause:_e,resume:Te}=j(),V=l.computed(()=>ne.value/ae.value),oe=()=>{m.value&&(m.value.setSize(ne.value,ae.value),m.value.setPixelRatio(Math.min(re.value,2)))},ie=()=>{if(!m.value)return;const L=s.resolveUnref(je);if(L){L in R||xe("Renderer Preset must be one of these: "+Object.keys(R).join(", ")),Y(m.value,R[L]);return}m.value.shadowMap.enabled=s.resolveUnref(g),m.value.shadowMap.type=s.resolveUnref(w),m.value.toneMapping=s.resolveUnref(F)||c.NoToneMapping,m.value.toneMappingExposure=s.resolveUnref(B),m.value.outputEncoding=s.resolveUnref(y)||c.LinearEncoding,O!=null&&O.value&&m.value.setClearColor(pe(s.resolveUnref(O))),m.value.useLegacyLights=s.resolveUnref(h)},De=()=>{const L=s.unrefElement(e);L&&(m.value=new c.WebGLRenderer({canvas:L,alpha:s.resolveUnref(o),antialias:s.resolveUnref(n),context:s.resolveUnref(Oe),depth:s.resolveUnref(i),failIfMajorPerformanceCaveat:s.resolveUnref(r),logarithmicDepthBuffer:s.resolveUnref(p),powerPreference:s.resolveUnref(Ue),precision:s.resolveUnref(u),stencil:s.resolveUnref(v),preserveDrawingBuffer:s.resolveUnref(ke),premultipliedAlpha:s.resolveUnref(d)}),N("renderer",m.value),N("clock",new c.Clock),N("aspectRatio",V),ie(),oe(),Te(),G.value=!0)},Fe=()=>{m.value&&(m.value.dispose(),m.value=void 0,G.value=!1,_e())};return l.watch([V,re],oe),l.watch([g,w,y,h,F,B,O],ie),l.watch(()=>[e,t],()=>{s.unrefElement(e)&&s.unrefElement(t)&&De()},{immediate:!0,deep:!0}),{renderer:m,isReady:G,dispose:Fe,aspectRatio:V}}const Z=e=>!!e&&e.constructor===Array;function E(e){const t={nodes:{},materials:{}};return e&&e.traverse(a=>{a.name&&(t.nodes[a.name]=a),a.material&&!t.materials[a.material.name]&&(t.materials[a.material.name]=a.material)}),t}async function ve(e,t,a,o,n){const{logError:i}=S(),p=new e;n&&n(p),a&&a(p);const u=(Array.isArray(t)?t:[t]).map(d=>new Promise((v,g)=>{p.load(d,w=>{w.scene&&Object.assign(w,E(w.scene)),v(w)},o,w=>g(i("[useLoader] - Failed to load resource",w)))}));return Z(t)?await Promise.all(u):await u[0]}async function ge(e){const t=new c.LoadingManager,a=new c.TextureLoader(t),o=n=>new Promise((i,p)=>{a.load(n,r=>i(r),()=>null,()=>{p(new Error("[useTextures] - Failed to load texture"))})});if(Z(e)){const n=await Promise.all(e.map(i=>o(i)));return e.length>1?n:n[0]}else{const{map:n,displacementMap:i,normalMap:p,roughnessMap:r,metalnessMap:u,aoMap:d}=e;return{map:n?await o(n):null,displacementMap:i?await o(i):null,normalMap:p?await o(p):null,roughnessMap:r?await o(r):null,metalnessMap:u?await o(u):null,aoMap:d?await o(d):null}}}const _=l.shallowReactive({camera:void 0,cameras:[],aspectRatio:l.computed(()=>window.innerWidth/window.innerHeight)});function M(){function e(a){return _[a]}function t(a,o){_[a]=o}return{state:_,...l.toRefs(_),getState:e,setState:t}}const H=l.shallowRef(new c.Raycaster),T=l.ref(new c.Vector2),we=l.ref(null);function q(){const{setState:e}=M();e("raycaster",H.value),e("pointer",T),e("currentInstance",we);function t(a){T.value.x=a.clientX/window.innerWidth*2-1,T.value.y=-(a.clientY/window.innerHeight)*2+1}return window.addEventListener("pointermove",t),{raycaster:H,pointer:T}}const he=!0,ee="[TresJS ▲ ■ ●] ";function S(){function e(o,n){console.error(`${ee} ${o}`,n||"")}function t(o){console.warn(`${ee} ${o}`)}function a(o,n){}return{logError:e,logWarning:t,logMessage:a}}const{logWarning:ye}=S();function Ce(e){for(const t in e)if(t.indexOf("on")===0)return!0;return!1}function ze(e){}let D=null;const Me={createElement(e,t,a,o){if(e==="template"||de(e))return null;let n;if(o===null&&(o={}),o!=null&&o.args?n=new U.value[e.replace("Tres","")](...o.args):n=new U.value[e.replace("Tres","")],n.isCamera){(!(o!=null&&o.position)||o!=null&&o.position.every(p=>p==0))&&ye("Camera is positioned at the center of the scene [0,0,0], if this is not intentional try setting a position if your scene seems empty 🤗");const{pushCamera:i}=W();i(n)}return(o==null?void 0:o.attach)===void 0&&(n.isMaterial?n.attach="material":n.isBufferGeometry&&(n.attach="geometry")),n},insert(e,t,a){if(D===null&&t.isScene&&(D=t),t===null&&(t=D),t!=null&&t.isObject3D&&(e!=null&&e.isObject3D)){const r=a?t.children.indexOf(a):0;e.parent=t,t.children.splice(r,0,e),e.dispatchEvent({type:"added"})}else typeof(e==null?void 0:e.attach)=="string"&&(e.__previousAttach=e[t==null?void 0:t.attach],t&&(t[e.attach]=e));const{onLoop:o}=j();let n=null,i=null;const{raycaster:p}=q();e&&e instanceof c.Mesh&&Ce(e)&&(o(()=>{var r,u,d;if(t!=null&&t.children&&e&&p){const v=p.value.intersectObjects(t.children);v.length>0&&v[0].object.uuid===e.uuid?(i=v[0],(n===null||n.object.uuid!==(i==null?void 0:i.object.uuid))&&((r=e.onPointerEnter)==null||r.call(e,i)),(u=e.onPointerMove)==null||u.call(e,i)):(i=null,n!==null&&((d=e.onPointerLeave)==null||d.call(e,n))),n=i}}),s.useEventListener(window,"click",()=>{var r;i!==null&&((r=e.onClick)==null||r.call(e,i))}))},remove(e){if(!e)return;const t=e.parentNode;t&&t.removeChild(e)},patchProp(e,t,a,o){if(e){let n=e,i=t;const p=x(i);let r=n==null?void 0:n[p];if(e.parent||(e.parent=D),n.type==="BufferGeometry"&&(i=i.split("-").pop(),n.setAttribute(x(i),new c.BufferAttribute(...o))),i.includes("-")&&r===void 0){const d=i.split("-");r=d.reduce((v,g)=>v[x(g)],n),i=d.pop(),r!=null&&r.set||(n=d.reduce((v,g)=>v[x(g)],n))}let u=o;if(u===""&&(u=!0),s.isFunction(r))return;!(r!=null&&r.set)&&!s.isFunction(r)?n[p]=u:r.constructor===u.constructor&&(r!=null&&r.copy)?r==null||r.copy(u):Array.isArray(u)?r.set(...u):!r.isColor&&r.setScalar?r.setScalar(u):r.set(u)}},parentNode(e){return(e==null?void 0:e.parent)||null},createText:()=>void 0,createComment:()=>void 0,setText:()=>void 0,setElementText:()=>void 0,nextSibling:()=>void 0,querySelector:()=>void 0,setScopeId:()=>void 0,cloneNode:()=>void 0,insertStaticContent:()=>void 0},{createApp:be}=l.createRenderer(Me),Le=e=>{const t=be(a);function a(){return e&&e.default?e.default():[]}return t};z($);const{logWarning:Pe}=S(),te=l.defineComponent({name:"TresCanvas",props:["shadows","shadowMapType","physicallyCorrectLights","useLegacyLights","outputEncoding","toneMapping","toneMappingExposure","context","powerPreference","preserveDrawingBuffer","clearColor","windowSize","preset"],setup(e,{slots:t,expose:a}){e.physicallyCorrectLights===!0&&Pe("physicallyCorrectLights is deprecated, useLegacyLights is now false by default");const o=l.ref(),n=l.ref(),i=new $.Scene,{setState:p}=M();p("scene",i);function r(){const{renderer:v}=Q(n,o,e),{activeCamera:g}=W(),{onLoop:w}=j(),{raycaster:b,pointer:h}=q();w(()=>{var y;g.value&&(b.value.setFromCamera(h.value,g.value),(y=v.value)==null||y.render(i,g.value))})}l.watch(n,r);let u;function d(){u=Le(t),u.provide("useTres",M()),u.provide("extend",z),u.mount(i)}return d(),a({scene:i}),()=>l.h(l.h("div",{ref:o,style:{position:"relative",width:"100%",height:"100%",pointerEvents:"auto",touchAction:"none"}},[l.h("div",{style:{width:"100%",height:"100%"}},[l.h("canvas",{ref:n,style:{display:"block",width:"100%",height:"100%",position:e.windowSize?"fixed":"absolute",top:0,left:0}})])]))}}),Se={install(e){e.component("TresCanvas",te)}};f.CameraType=J,f.TresCanvas=te,f.catalogue=U,f.default=Se,f.extend=z,f.isProd=he,f.trasverseObjects=E,f.useCamera=W,f.useLoader=ve,f.useLogger=S,f.useRaycaster=q,f.useRenderLoop=j,f.useRenderer=Q,f.useTexture=ge,f.useTres=M,Object.defineProperties(f,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@tresjs/core",
   "description": "Declarative ThreeJS using Vue Components",
-  "version": "2.0.0-alpha.0",
+  "version": "2.0.0-alpha.2",
   "type": "module",
   "author": "Alvaro Saburido <hola@alvarosaburido.dev> (https://github.com/alvarosabu/)",
   "files": [
@@ -40,6 +40,7 @@
     "dev": "vite",
     "build": "vite build",
     "preview": "vite preview",
+    "playground": "cd playground && nr dev",
     "test": "vitest",
     "test:ci": "vitest run",
     "test:ui": "vitest --ui",
@@ -62,7 +63,7 @@
     "@alvarosabu/prettier-config": "^1.2.0",
     "@release-it/conventional-changelog": "^5.1.1",
     "@stackblitz/sdk": "^1.8.1",
-    "@tresjs/cientos": "^1.8.0",
+    "@tresjs/cientos": "2.0.0-alpha.1",
     "@types/three": "latest",
     "@typescript-eslint/eslint-plugin": "^5.42.0",
     "@typescript-eslint/parser": "^5.42.0",