@tresjs/core 3.3.0 → 3.4.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/tres.js CHANGED
@@ -1,15 +1,15 @@
1
1
  /**
2
2
  * name: @tresjs/core
3
- * version: v3.3.0
3
+ * version: v3.4.1
4
4
  * (c) 2023
5
5
  * description: Declarative ThreeJS using Vue Components
6
6
  * author: Alvaro Saburido <hola@alvarosaburido.dev> (https://github.com/alvarosabu/)
7
7
  */
8
- import { ref as B, computed as A, watchEffect as D, onUnmounted as W, shallowRef as x, watch as ee, reactive as se, readonly as ie, provide as I, inject as le, createRenderer as ue, defineComponent as q, useSlots as ce, getCurrentInstance as U, onMounted as fe, openBlock as pe, createElementBlock as me, normalizeStyle as de, h as J, Fragment as ve } from "vue";
9
- import * as ge from "three";
10
- import { PerspectiveCamera as $, OrthographicCamera as ye, Camera as we, Clock as Ce, Vector3 as Pe, Color as H, REVISION as _e, SRGBColorSpace as he, ACESFilmicToneMapping as Ee, PCFSoftShadowMap as Me, WebGLRenderer as z, LoadingManager as Ae, TextureLoader as ke, Vector2 as De, Raycaster as be, BufferAttribute as xe, Scene as Le } from "three";
11
- import { createEventHook as L, useRafFn as Be, toValue as h, unrefElement as Oe, useDevicePixelRatio as Te, usePointer as Se, useElementBounding as Re, useWindowSize as He, useElementSize as je } from "@vueuse/core";
12
- const Fe = ({ sizes: e, scene: a }) => {
8
+ import { ref as B, computed as A, watchEffect as D, onUnmounted as W, shallowRef as x, watch as ee, reactive as se, readonly as ie, provide as $, inject as le, createRenderer as ue, defineComponent as q, useSlots as ce, getCurrentInstance as U, onMounted as fe, openBlock as pe, createElementBlock as me, normalizeClass as de, normalizeStyle as ve, h as J, Fragment as ge } from "vue";
9
+ import * as ye from "three";
10
+ import { PerspectiveCamera as I, OrthographicCamera as we, Camera as Ce, Clock as Pe, Vector3 as he, Color as H, REVISION as Ee, SRGBColorSpace as _e, ACESFilmicToneMapping as Me, PCFSoftShadowMap as Ae, WebGLRenderer as z, LoadingManager as ke, TextureLoader as De, Vector2 as be, Raycaster as xe, BufferAttribute as Le, Scene as Be } from "three";
11
+ import { createEventHook as L, useRafFn as Oe, toValue as E, unrefElement as Te, useDevicePixelRatio as Se, usePointer as Re, useElementBounding as He, useWindowSize as je, useElementSize as Fe } from "@vueuse/core";
12
+ const ze = ({ sizes: e, scene: a }) => {
13
13
  const t = B([]), r = A(
14
14
  () => t.value[0]
15
15
  ), n = (s, f = !1) => {
@@ -17,15 +17,15 @@ const Fe = ({ sizes: e, scene: a }) => {
17
17
  }, o = (s) => {
18
18
  t.value = t.value.filter(({ uuid: f }) => f !== s.uuid);
19
19
  }, c = (s) => {
20
- const f = s instanceof we ? s : t.value.find((p) => p.uuid === s);
20
+ const f = s instanceof Ce ? s : t.value.find((m) => m.uuid === s);
21
21
  if (!f)
22
22
  return;
23
- const l = t.value.filter(({ uuid: p }) => p !== f.uuid);
23
+ const l = t.value.filter(({ uuid: m }) => m !== f.uuid);
24
24
  t.value = [f, ...l];
25
25
  };
26
26
  return D(() => {
27
27
  e.aspectRatio.value && t.value.forEach((s) => {
28
- s instanceof $ && (s.aspect = e.aspectRatio.value), (s instanceof $ || s instanceof ye) && s.updateProjectionMatrix();
28
+ s instanceof I && (s.aspect = e.aspectRatio.value), (s instanceof I || s instanceof we) && s.updateProjectionMatrix();
29
29
  });
30
30
  }), a.userData.tres__registerCamera = n, a.userData.tres__deregisterCamera = o, W(() => {
31
31
  t.value = [];
@@ -36,9 +36,9 @@ const Fe = ({ sizes: e, scene: a }) => {
36
36
  deregisterCamera: o,
37
37
  setCameraActive: c
38
38
  };
39
- }, te = L(), re = L(), N = L(), b = new Ce();
39
+ }, te = L(), re = L(), N = L(), b = new Pe();
40
40
  let j = 0, F = 0;
41
- const { pause: ze, resume: Ie, isActive: $e } = Be(
41
+ const { pause: $e, resume: Ie, isActive: Ge } = Oe(
42
42
  () => {
43
43
  te.trigger({ delta: j, elapsed: F, clock: b }), re.trigger({ delta: j, elapsed: F, clock: b }), N.trigger({ delta: j, elapsed: F, clock: b });
44
44
  },
@@ -51,10 +51,10 @@ const ne = () => ({
51
51
  onBeforeLoop: te.on,
52
52
  onLoop: re.on,
53
53
  onAfterLoop: N.on,
54
- pause: ze,
54
+ pause: $e,
55
55
  resume: Ie,
56
- isActive: $e
57
- }), mt = !0, K = "[TresJS ▲ ■ ●] ";
56
+ isActive: Ge
57
+ }), dt = !0, K = "[TresJS ▲ ■ ●] ";
58
58
  function O() {
59
59
  function e(r, n) {
60
60
  console.error(`${K} ${r}`, n || "");
@@ -70,30 +70,30 @@ function O() {
70
70
  logMessage: t
71
71
  };
72
72
  }
73
- function dt(e) {
74
- return typeof e == "number" ? [e, e, e] : e instanceof Pe ? [e.x, e.y, e.z] : e;
73
+ function vt(e) {
74
+ return typeof e == "number" ? [e, e, e] : e instanceof he ? [e.x, e.y, e.z] : e;
75
75
  }
76
- function Ge(e) {
76
+ function We(e) {
77
77
  return e instanceof H ? e : Array.isArray(e) ? new H(...e) : new H(e);
78
78
  }
79
79
  const ae = (e, a) => {
80
80
  for (const t of Object.keys(a))
81
81
  a[t] instanceof Object && Object.assign(a[t], ae(e[t], a[t]));
82
82
  return Object.assign(e || {}, a), e;
83
- }, We = "html,body,base,head,link,meta,style,title,address,article,aside,footer,header,hgroup,h1,h2,h3,h4,h5,h6,nav,section,div,dd,dl,dt,figcaption,figure,picture,hr,img,li,main,ol,p,pre,ul,a,b,abbr,bdi,bdo,br,cite,code,data,dfn,em,i,kbd,mark,q,rp,rt,ruby,s,samp,small,span,strong,sub,sup,time,u,var,wbr,area,audio,map,track,video,embed,object,param,source,canvas,script,noscript,del,ins,caption,col,colgroup,table,thead,tbody,td,th,tr,button,datalist,fieldset,form,input,label,legend,meter,optgroup,option,output,progress,select,textarea,details,dialog,menu,summary,template,blockquote,iframe,tfoot", Ne = /* @__PURE__ */ Ve(We);
83
+ }, Ne = "html,body,base,head,link,meta,style,title,address,article,aside,footer,header,hgroup,h1,h2,h3,h4,h5,h6,nav,section,div,dd,dl,dt,figcaption,figure,picture,hr,img,li,main,ol,p,pre,ul,a,b,abbr,bdi,bdo,br,cite,code,data,dfn,em,i,kbd,mark,q,rp,rt,ruby,s,samp,small,span,strong,sub,sup,time,u,var,wbr,area,audio,map,track,video,embed,object,param,source,canvas,script,noscript,del,ins,caption,col,colgroup,table,thead,tbody,td,th,tr,button,datalist,fieldset,form,input,label,legend,meter,optgroup,option,output,progress,select,textarea,details,dialog,menu,summary,template,blockquote,iframe,tfoot", Ve = /* @__PURE__ */ qe(Ne);
84
84
  function X(e) {
85
85
  return e && e.nodeType === 1;
86
86
  }
87
87
  function S(e) {
88
88
  return e.replace(/-([a-z])/g, (a, t) => t.toUpperCase());
89
89
  }
90
- function Ve(e, a) {
90
+ function qe(e, a) {
91
91
  const t = /* @__PURE__ */ Object.create(null), r = e.split(",");
92
92
  for (let n = 0; n < r.length; n++)
93
93
  t[r[n]] = !0;
94
94
  return a ? (n) => !!t[n.toLowerCase()] : (n) => !!t[n];
95
95
  }
96
- const qe = (e, a) => {
96
+ const Ue = (e, a) => {
97
97
  const t = /* @__PURE__ */ new Set(), r = [];
98
98
  for (const n of e) {
99
99
  const o = a(n);
@@ -105,7 +105,7 @@ const qe = (e, a) => {
105
105
  return;
106
106
  const t = Array.isArray(a) ? a : a.match(/([^[.\]])+/g);
107
107
  return t == null ? void 0 : t.reduce((r, n) => r && r[n], e);
108
- }, Ue = (e, a, t) => {
108
+ }, Je = (e, a, t) => {
109
109
  const r = Array.isArray(a) ? a : a.match(/([^[.\]])+/g);
110
110
  r && r.reduce((n, o, c) => (n[o] === void 0 && (n[o] = {}), c === r.length - 1 && (n[o] = t), n[o]), e);
111
111
  };
@@ -126,7 +126,7 @@ function oe(e, a) {
126
126
  return !1;
127
127
  return !0;
128
128
  }
129
- function Je(e, a) {
129
+ function Ke(e, a) {
130
130
  if (!Array.isArray(e) || !Array.isArray(a) || e.length !== a.length)
131
131
  return !1;
132
132
  for (let t = 0; t < e.length; t++)
@@ -134,20 +134,20 @@ function Je(e, a) {
134
134
  return !1;
135
135
  return !0;
136
136
  }
137
- const Ke = Array.isArray, Xe = Number.parseInt(_e.replace("dev", "")), R = {
137
+ const Xe = Array.isArray, Ye = Number.parseInt(Ee.replace("dev", "")), R = {
138
138
  realistic: {
139
139
  shadows: !0,
140
140
  physicallyCorrectLights: !0,
141
- outputColorSpace: he,
142
- toneMapping: Ee,
141
+ outputColorSpace: _e,
142
+ toneMapping: Me,
143
143
  toneMappingExposure: 3,
144
144
  shadowMap: {
145
145
  enabled: !0,
146
- type: Me
146
+ type: Ae
147
147
  }
148
148
  }
149
149
  };
150
- function Ye({
150
+ function Qe({
151
151
  scene: e,
152
152
  canvas: a,
153
153
  options: t,
@@ -155,25 +155,25 @@ function Ye({
155
155
  contextParts: { sizes: n, camera: o }
156
156
  }) {
157
157
  const c = A(() => ({
158
- alpha: h(t.alpha),
159
- depth: h(t.depth),
160
- canvas: Oe(a),
161
- context: h(t.context),
162
- stencil: h(t.stencil),
163
- antialias: h(t.antialias) === void 0 ? !0 : h(t.antialias),
164
- precision: h(t.precision),
165
- powerPreference: h(t.powerPreference),
166
- premultipliedAlpha: h(t.premultipliedAlpha),
167
- preserveDrawingBuffer: h(t.preserveDrawingBuffer),
168
- logarithmicDepthBuffer: h(t.logarithmicDepthBuffer),
169
- failIfMajorPerformanceCaveat: h(t.failIfMajorPerformanceCaveat)
158
+ alpha: E(t.alpha),
159
+ depth: E(t.depth),
160
+ canvas: Te(a),
161
+ context: E(t.context),
162
+ stencil: E(t.stencil),
163
+ antialias: E(t.antialias) === void 0 ? !0 : E(t.antialias),
164
+ precision: E(t.precision),
165
+ powerPreference: E(t.powerPreference),
166
+ premultipliedAlpha: E(t.premultipliedAlpha),
167
+ preserveDrawingBuffer: E(t.preserveDrawingBuffer),
168
+ logarithmicDepthBuffer: E(t.logarithmicDepthBuffer),
169
+ failIfMajorPerformanceCaveat: E(t.failIfMajorPerformanceCaveat)
170
170
  })), s = x(new z(c.value));
171
171
  ee(c, () => {
172
172
  s.value.dispose(), s.value = new z(c.value);
173
173
  }), D(() => {
174
174
  s.value.setSize(n.width.value, n.height.value);
175
175
  });
176
- const { pixelRatio: f } = Te();
176
+ const { pixelRatio: f } = Se();
177
177
  D(() => {
178
178
  s.value.setPixelRatio(f.value);
179
179
  });
@@ -190,10 +190,10 @@ function Ye({
190
190
  return v.dispose(), w;
191
191
  })();
192
192
  D(() => {
193
- const v = h(t.preset);
193
+ const v = E(t.preset);
194
194
  v && (v in R || l(`Renderer Preset must be one of these: ${Object.keys(R).join(", ")}`), ae(s.value, R[v]));
195
195
  const w = (P, C) => {
196
- const k = h(P), T = () => {
196
+ const k = E(P), T = () => {
197
197
  if (v)
198
198
  return Y(R[v], C);
199
199
  };
@@ -201,49 +201,49 @@ function Ye({
201
201
  return k;
202
202
  const y = T();
203
203
  return y !== void 0 ? y : Y(u, C);
204
- }, _ = (P, C) => Ue(s.value, C, w(P, C));
205
- _(t.shadows, "shadowMap.enabled"), _(t.toneMapping, "toneMapping"), _(t.shadowMapType, "shadowMap.type"), Xe < 150 && _(!t.useLegacyLights, "physicallyCorrectLights"), _(t.outputColorSpace, "outputColorSpace"), _(t.toneMappingExposure, "toneMappingExposure");
204
+ }, h = (P, C) => Je(s.value, C, w(P, C));
205
+ h(t.shadows, "shadowMap.enabled"), h(t.toneMapping, "toneMapping"), h(t.shadowMapType, "shadowMap.type"), Ye < 150 && h(!t.useLegacyLights, "physicallyCorrectLights"), h(t.outputColorSpace, "outputColorSpace"), h(t.toneMappingExposure, "toneMappingExposure");
206
206
  const M = w(t.clearColor, "clearColor");
207
207
  M && s.value.setClearColor(
208
- M ? Ge(M) : new H(0)
208
+ M ? We(M) : new H(0)
209
209
  // default clear color is not easily/efficiently retrievable from three
210
210
  );
211
211
  });
212
- const { pause: i, resume: d, onLoop: m } = ne();
213
- return m(() => {
214
- o.value && !h(r) && s.value.render(e, o.value);
215
- }), d(), W(() => {
212
+ const { pause: i, resume: p, onLoop: d } = ne();
213
+ return d(() => {
214
+ o.value && !E(r) && s.value.render(e, o.value);
215
+ }), p(), W(() => {
216
216
  i(), s.value.dispose(), s.value.forceContextLoss();
217
217
  }), {
218
218
  renderer: s
219
219
  };
220
220
  }
221
- const Q = (e) => typeof e == "function", Qe = (e) => !!e && e.constructor === Array;
222
- function Ze(e) {
221
+ const Q = (e) => typeof e == "function", Ze = (e) => !!e && e.constructor === Array;
222
+ function et(e) {
223
223
  const a = { nodes: {}, materials: {} };
224
224
  return e && e.traverse((t) => {
225
225
  t.name && (a.nodes[t.name] = t), t.material && !a.materials[t.material.name] && (a.materials[t.material.name] = t.material);
226
226
  }), a;
227
227
  }
228
- async function vt(e, a, t, r, n) {
228
+ async function gt(e, a, t, r, n) {
229
229
  const { logError: o } = O(), c = new e();
230
230
  n && n(c), t && t(c);
231
231
  const f = (Array.isArray(a) ? a : [a]).map(
232
- (l) => new Promise((p, u) => {
232
+ (l) => new Promise((m, u) => {
233
233
  c.load(
234
234
  l,
235
235
  (i) => {
236
- i.scene && Object.assign(i, Ze(i.scene)), p(i);
236
+ i.scene && Object.assign(i, et(i.scene)), m(i);
237
237
  },
238
238
  r,
239
239
  (i) => u(o("[useLoader] - Failed to load resource", i))
240
240
  );
241
241
  })
242
242
  );
243
- return Qe(a) ? await Promise.all(f) : await f[0];
243
+ return Ze(a) ? await Promise.all(f) : await f[0];
244
244
  }
245
- async function gt(e) {
246
- const a = new Ae(), t = new ke(a), r = (n) => new Promise((o, c) => {
245
+ async function yt(e) {
246
+ const a = new ke(), t = new De(a), r = (n) => new Promise((o, c) => {
247
247
  t.load(
248
248
  n,
249
249
  (s) => o(s),
@@ -253,7 +253,7 @@ async function gt(e) {
253
253
  }
254
254
  );
255
255
  });
256
- if (Ke(e)) {
256
+ if (Xe(e)) {
257
257
  const n = await Promise.all(e.map((o) => r(o)));
258
258
  return e.length > 1 ? n : n[0];
259
259
  } else {
@@ -264,7 +264,7 @@ async function gt(e) {
264
264
  roughnessMap: s,
265
265
  metalnessMap: f,
266
266
  aoMap: l,
267
- alphaMap: p,
267
+ alphaMap: m,
268
268
  matcap: u
269
269
  } = e;
270
270
  return {
@@ -274,49 +274,49 @@ async function gt(e) {
274
274
  roughnessMap: s ? await r(s) : null,
275
275
  metalnessMap: f ? await r(f) : null,
276
276
  aoMap: l ? await r(l) : null,
277
- alphaMap: p ? await r(p) : null,
277
+ alphaMap: m ? await r(m) : null,
278
278
  matcap: u ? await r(u) : null
279
279
  };
280
280
  }
281
281
  }
282
- const et = (e, { renderer: a, camera: t, raycaster: r }) => {
283
- const n = A(() => a.value.domElement), { x: o, y: c } = Se({ target: n }), { width: s, height: f, top: l, left: p } = Re(n), u = ({ x: y, y: E }) => {
282
+ const tt = (e, { renderer: a, camera: t, raycaster: r }) => {
283
+ const n = A(() => a.value.domElement), { x: o, y: c } = Re({ target: n }), { width: s, height: f, top: l, left: m } = He(n), u = ({ x: y, y: _ }) => {
284
284
  if (n.value)
285
285
  return {
286
- x: (y - p.value) / s.value * 2 - 1,
287
- y: -((E - l.value) / f.value) * 2 + 1
286
+ x: (y - m.value) / s.value * 2 - 1,
287
+ y: -((_ - l.value) / f.value) * 2 + 1
288
288
  };
289
- }, i = ({ x: y, y: E }) => {
289
+ }, i = ({ x: y, y: _ }) => {
290
290
  if (t.value)
291
- return r.value.setFromCamera(new De(y, E), t.value), r.value.intersectObjects(e.value, !1);
292
- }, d = (y) => {
293
- const E = u({
291
+ return r.value.setFromCamera(new be(y, _), t.value), r.value.intersectObjects(e.value, !1);
292
+ }, p = (y) => {
293
+ const _ = u({
294
294
  x: (y == null ? void 0 : y.clientX) ?? o.value,
295
295
  y: (y == null ? void 0 : y.clientY) ?? c.value
296
296
  });
297
- return E ? i(E) || [] : [];
298
- }, m = A(() => d()), v = L(), w = L(), _ = (y, E) => {
299
- y.trigger({ event: E, intersects: d(E) });
297
+ return _ ? i(_) || [] : [];
298
+ }, d = A(() => p()), v = L(), w = L(), h = (y, _) => {
299
+ y.trigger({ event: _, intersects: p(_) });
300
300
  }, M = (y) => {
301
- _(w, y);
301
+ h(w, y);
302
302
  };
303
303
  let P;
304
304
  const C = (y) => {
305
- var E;
306
- P = (E = d(y)[0]) == null ? void 0 : E.object;
305
+ var _;
306
+ P = (_ = p(y)[0]) == null ? void 0 : _.object;
307
307
  }, k = (y) => {
308
- var E;
309
- y instanceof PointerEvent && P === ((E = d(y)[0]) == null ? void 0 : E.object) && _(v, y);
308
+ var _;
309
+ y instanceof PointerEvent && P === ((_ = p(y)[0]) == null ? void 0 : _.object) && h(v, y);
310
310
  }, T = (y) => w.trigger({ event: y, intersects: [] });
311
311
  return n.value.addEventListener("pointerup", k), n.value.addEventListener("pointerdown", C), n.value.addEventListener("pointermove", M), n.value.addEventListener("pointerleave", T), W(() => {
312
312
  n != null && n.value && (n.value.removeEventListener("pointerup", k), n.value.removeEventListener("pointerdown", C), n.value.removeEventListener("pointermove", M), n.value.removeEventListener("pointerleave", T));
313
313
  }), {
314
- intersects: m,
314
+ intersects: d,
315
315
  onClick: (y) => v.on(y).off,
316
316
  onPointerMove: (y) => w.on(y).off
317
317
  };
318
318
  };
319
- function yt() {
319
+ function wt() {
320
320
  const { logWarning: e } = O();
321
321
  function a(r, n, o) {
322
322
  let c = null;
@@ -332,7 +332,7 @@ function yt() {
332
332
  seekByName: t
333
333
  };
334
334
  }
335
- const tt = ({ scene: e, contextParts: a }) => {
335
+ const rt = ({ scene: e, contextParts: a }) => {
336
336
  const t = se({
337
337
  click: /* @__PURE__ */ new Map(),
338
338
  pointerMove: /* @__PURE__ */ new Map(),
@@ -343,36 +343,36 @@ const tt = ({ scene: e, contextParts: a }) => {
343
343
  }, o = (i) => {
344
344
  r.value.delete(i);
345
345
  }, c = (i) => {
346
- Object.values(t).forEach((d) => d.delete(i)), o(i);
346
+ Object.values(t).forEach((p) => p.delete(i)), o(i);
347
347
  }, s = (i) => {
348
- const { onClick: d, onPointerMove: m, onPointerEnter: v, onPointerLeave: w } = i;
349
- d && t.click.set(i, d), m && t.pointerMove.set(i, m), v && t.pointerEnter.set(i, v), w && t.pointerLeave.set(i, w);
348
+ const { onClick: p, onPointerMove: d, onPointerEnter: v, onPointerLeave: w } = i;
349
+ p && t.click.set(i, p), d && t.pointerMove.set(i, d), v && t.pointerEnter.set(i, v), w && t.pointerLeave.set(i, w);
350
350
  };
351
351
  e.userData.tres__registerAtPointerEventHandler = s, e.userData.tres__deregisterAtPointerEventHandler = c, e.userData.tres__registerBlockingObjectAtPointerEventHandler = n, e.userData.tres__deregisterBlockingObjectAtPointerEventHandler = o;
352
352
  const f = A(
353
- () => qe(
353
+ () => Ue(
354
354
  [
355
355
  ...Array.from(r.value),
356
356
  ...Object.values(t).map((i) => Array.from(i.keys())).flat()
357
357
  ],
358
358
  ({ uuid: i }) => i
359
359
  )
360
- ), { onClick: l, onPointerMove: p } = et(f, a);
361
- l(({ intersects: i, event: d }) => {
362
- var m;
363
- i.length && ((m = t.click.get(i[0].object)) == null || m(i[0], d));
360
+ ), { onClick: l, onPointerMove: m } = tt(f, a);
361
+ l(({ intersects: i, event: p }) => {
362
+ var d;
363
+ i.length && ((d = t.click.get(i[0].object)) == null || d(i[0], p));
364
364
  });
365
365
  let u;
366
- return p(({ intersects: i, event: d }) => {
366
+ return m(({ intersects: i, event: p }) => {
367
367
  var M, P, C, k;
368
- const m = (M = i == null ? void 0 : i[0]) == null ? void 0 : M.object, { pointerLeave: v, pointerEnter: w, pointerMove: _ } = t;
369
- u && u !== m && ((P = v.get(u)) == null || P(u, d)), m && (u !== m && ((C = w.get(m)) == null || C(i[0], d)), (k = _.get(m)) == null || k(i[0], d)), u = m || null;
368
+ const d = (M = i == null ? void 0 : i[0]) == null ? void 0 : M.object, { pointerLeave: v, pointerEnter: w, pointerMove: h } = t;
369
+ u && u !== d && ((P = v.get(u)) == null || P(u, p)), d && (u !== d && ((C = w.get(d)) == null || C(i[0], p)), (k = h.get(d)) == null || k(i[0], p)), u = d || null;
370
370
  }), {
371
371
  registerObject: s,
372
372
  deregisterObject: c
373
373
  };
374
374
  }, G = B({}), V = (e) => Object.assign(G.value, e);
375
- function rt({
375
+ function nt({
376
376
  scene: e,
377
377
  canvas: a,
378
378
  windowSize: t,
@@ -380,18 +380,18 @@ function rt({
380
380
  rendererOptions: n
381
381
  }) {
382
382
  const o = A(
383
- () => h(t) ? He() : je(h(a).parentElement)
383
+ () => E(t) ? je() : Fe(E(a).parentElement)
384
384
  ), c = A(() => o.value.width.value), s = A(() => o.value.height.value), f = A(() => c.value / s.value), l = {
385
385
  height: s,
386
386
  width: c,
387
387
  aspectRatio: f
388
- }, p = x(e), {
388
+ }, m = x(e), {
389
389
  camera: u,
390
390
  cameras: i,
391
- registerCamera: d,
392
- deregisterCamera: m,
391
+ registerCamera: p,
392
+ deregisterCamera: d,
393
393
  setCameraActive: v
394
- } = Fe({ sizes: l, scene: e }), { renderer: w } = Ye(
394
+ } = ze({ sizes: l, scene: e }), { renderer: w } = Qe(
395
395
  {
396
396
  scene: e,
397
397
  canvas: a,
@@ -399,33 +399,33 @@ function rt({
399
399
  contextParts: { sizes: l, camera: u },
400
400
  disableRender: r
401
401
  }
402
- ), _ = {
402
+ ), h = {
403
403
  sizes: l,
404
- scene: p,
404
+ scene: m,
405
405
  camera: u,
406
406
  cameras: ie(i),
407
407
  renderer: w,
408
- raycaster: x(new be()),
408
+ raycaster: x(new xe()),
409
409
  controls: B(null),
410
410
  extend: V,
411
- registerCamera: d,
411
+ registerCamera: p,
412
412
  setCameraActive: v,
413
- deregisterCamera: m
413
+ deregisterCamera: d
414
414
  };
415
- return I("useTres", _), _;
415
+ return $("useTres", h), h;
416
416
  }
417
- function nt() {
417
+ function at() {
418
418
  const e = le("useTres");
419
419
  if (!e)
420
420
  throw new Error("useTresContext must be used together with useTresContextProvider");
421
421
  return e;
422
422
  }
423
- const wt = nt;
423
+ const Ct = at;
424
424
  let g = null;
425
- const { logError: Z } = O(), at = {
425
+ const { logError: Z } = O(), ot = {
426
426
  createElement(e, a, t, r) {
427
427
  var c, s;
428
- if (r || (r = {}), r.args || (r.args = []), e === "template" || Ne(e))
428
+ if (r || (r = {}), r.args || (r.args = []), e === "template" || Ve(e))
429
429
  return null;
430
430
  let n = e.replace("Tres", ""), o;
431
431
  if (e === "primitive") {
@@ -465,20 +465,20 @@ const { logError: Z } = O(), at = {
465
465
  if (e.isObject3D) {
466
466
  const r = e, n = (l) => {
467
467
  var u, i;
468
- const p = l;
469
- l.userData.tres__materialViaProp || (u = p.material) == null || u.dispose(), l.userData.tres__geometryViaProp || (i = p.geometry) == null || i.dispose();
468
+ const m = l;
469
+ l.userData.tres__materialViaProp || (u = m.material) == null || u.dispose(), l.userData.tres__geometryViaProp || (i = m.geometry) == null || i.dispose();
470
470
  }, o = g == null ? void 0 : g.userData.tres__deregisterAtPointerEventHandler, c = g == null ? void 0 : g.userData.tres__deregisterBlockingObjectAtPointerEventHandler, s = (l) => {
471
- var p, u;
471
+ var m, u;
472
472
  if (!c)
473
473
  throw "could not find tres__deregisterBlockingObjectAtPointerEventHandler on scene's userData";
474
- if ((u = g == null ? void 0 : (p = g.userData).tres__deregisterBlockingObjectAtPointerEventHandler) == null || u.call(p, l), !o)
474
+ if ((u = g == null ? void 0 : (m = g.userData).tres__deregisterBlockingObjectAtPointerEventHandler) == null || u.call(m, l), !o)
475
475
  throw "could not find tres__deregisterAtPointerEventHandler on scene's userData";
476
476
  (l != null && l.onClick || l != null && l.onPointerMove || l != null && l.onPointerEnter || l != null && l.onPointerLeave) && (o == null || o(l));
477
477
  }, f = (l) => {
478
- const p = g == null ? void 0 : g.userData.tres__deregisterCamera;
479
- if (!p)
478
+ const m = g == null ? void 0 : g.userData.tres__deregisterCamera;
479
+ if (!m)
480
480
  throw "could not find tres__deregisterCamera on scene's userData";
481
- l.isCamera && (p == null || p(l));
481
+ l.isCamera && (m == null || m(l));
482
482
  };
483
483
  r.traverse((l) => {
484
484
  n(l), f(l), s == null || s(l);
@@ -495,10 +495,10 @@ const { logError: Z } = O(), at = {
495
495
  r || r === "" ? (o = g == null ? void 0 : (n = g.userData).tres__registerBlockingObjectAtPointerEventHandler) == null || o.call(n, e) : (s = g == null ? void 0 : (c = g.userData).tres__deregisterBlockingObjectAtPointerEventHandler) == null || s.call(c, e);
496
496
  return;
497
497
  }
498
- let p = S(l), u = f == null ? void 0 : f[p];
498
+ let m = S(l), u = f == null ? void 0 : f[m];
499
499
  if (l === "args") {
500
- const d = e, m = t ?? [], v = r ?? [], w = e.userData.tres__name || e.type;
501
- w && m.length && !Je(m, v) && (f = Object.assign(d, new G.value[w](...r)));
500
+ const p = e, d = t ?? [], v = r ?? [], w = e.userData.tres__name || e.type;
501
+ w && d.length && !Ke(d, v) && (f = Object.assign(p, new G.value[w](...r)));
502
502
  return;
503
503
  }
504
504
  if (f.type === "BufferGeometry") {
@@ -506,20 +506,20 @@ const { logError: Z } = O(), at = {
506
506
  return;
507
507
  f.setAttribute(
508
508
  S(l),
509
- new xe(...r)
509
+ new Le(...r)
510
510
  );
511
511
  return;
512
512
  }
513
513
  if (l.includes("-") && u === void 0) {
514
- const d = l.split("-");
515
- u = d.reduce((m, v) => m[S(v)], f), l = d.pop(), p = l.toLowerCase(), u != null && u.set || (f = d.reduce((m, v) => m[S(v)], f));
514
+ const p = l.split("-");
515
+ u = p.reduce((d, v) => d[S(v)], f), l = p.pop(), m = l.toLowerCase(), u != null && u.set || (f = p.reduce((d, v) => d[S(v)], f));
516
516
  }
517
517
  let i = r;
518
518
  if (i === "" && (i = !0), Q(u)) {
519
- Array.isArray(i) ? e[p](...i) : e[p](i);
519
+ Array.isArray(i) ? e[m](...i) : e[m](i);
520
520
  return;
521
521
  }
522
- !(u != null && u.set) && !Q(u) ? f[p] = i : u.constructor === i.constructor && (u != null && u.copy) ? u == null || u.copy(i) : Array.isArray(i) ? u.set(...i) : !u.isColor && u.setScalar ? u.setScalar(i) : u.set(i);
522
+ !(u != null && u.set) && !Q(u) ? f[m] = i : u.constructor === i.constructor && (u != null && u.copy) ? u == null || u.copy(i) : Array.isArray(i) ? u.set(...i) : !u.isColor && u.setScalar ? u.setScalar(i) : u.set(i);
523
523
  }
524
524
  },
525
525
  parentNode(e) {
@@ -534,9 +534,9 @@ const { logError: Z } = O(), at = {
534
534
  setScopeId: () => void 0,
535
535
  cloneNode: () => void 0,
536
536
  insertStaticContent: () => void 0
537
- }, { render: ot } = ue(at);
538
- V(ge);
539
- const st = ["data-scene"], it = /* @__PURE__ */ q({
537
+ }, { render: st } = ue(ot);
538
+ V(ye);
539
+ const it = ["data-scene"], lt = /* @__PURE__ */ q({
540
540
  __name: "TresCanvas",
541
541
  props: {
542
542
  shadows: { type: Boolean, default: void 0 },
@@ -564,45 +564,45 @@ const st = ["data-scene"], it = /* @__PURE__ */ q({
564
564
  },
565
565
  setup(e, { expose: a }) {
566
566
  var i;
567
- const t = e, { logWarning: r } = O(), n = B(), o = x(new Le());
567
+ const t = e, { logWarning: r } = O(), n = B(), o = x(new Be());
568
568
  ne();
569
- const c = ce(), s = (i = U()) == null ? void 0 : i.appContext.app, f = (d) => q({
569
+ const c = ce(), s = (i = U()) == null ? void 0 : i.appContext.app, f = (p) => q({
570
570
  setup() {
571
571
  var v;
572
- const m = (v = U()) == null ? void 0 : v.appContext;
573
- return m && (m.app = s), I("useTres", d), I("extend", V), () => J(ve, null, c != null && c.default ? c.default() : []);
572
+ const d = (v = U()) == null ? void 0 : v.appContext;
573
+ return d && (d.app = s), $("useTres", p), $("extend", V), () => J(ge, null, c != null && c.default ? c.default() : []);
574
574
  }
575
- }), l = (d) => {
576
- const m = f(d);
577
- ot(J(m), o.value);
578
- }, p = A(() => t.disableRender), u = x(null);
575
+ }), l = (p) => {
576
+ const d = f(p);
577
+ st(J(d), o.value);
578
+ }, m = A(() => t.disableRender), u = x(null);
579
579
  return a({ context: u }), fe(() => {
580
- const d = n;
581
- u.value = rt({
580
+ const p = n;
581
+ u.value = nt({
582
582
  scene: o.value,
583
- canvas: d,
583
+ canvas: p,
584
584
  windowSize: t.windowSize,
585
- disableRender: p,
585
+ disableRender: m,
586
586
  rendererOptions: t
587
- }), tt({ scene: o.value, contextParts: u.value });
588
- const { registerCamera: m, camera: v, cameras: w, deregisterCamera: _ } = u.value;
587
+ }), rt({ scene: o.value, contextParts: u.value });
588
+ const { registerCamera: d, camera: v, cameras: w, deregisterCamera: h } = u.value;
589
589
  l(u.value);
590
590
  const M = () => {
591
- const P = new $(
591
+ const P = new I(
592
592
  45,
593
593
  window.innerWidth / window.innerHeight,
594
594
  0.1,
595
595
  1e3
596
596
  );
597
- P.position.set(3, 3, 3), P.lookAt(0, 0, 0), m(P);
597
+ P.position.set(3, 3, 3), P.lookAt(0, 0, 0), d(P);
598
598
  const C = D(() => {
599
- w.value.length >= 2 && (P.removeFromParent(), _(P), C == null || C());
599
+ w.value.length >= 2 && (P.removeFromParent(), h(P), C == null || C());
600
600
  });
601
601
  };
602
602
  ee(
603
603
  () => t.camera,
604
604
  (P, C) => {
605
- P && m(P), C && (C.removeFromParent(), _(C));
605
+ P && d(P), C && (C.removeFromParent(), h(C));
606
606
  },
607
607
  {
608
608
  immediate: !0
@@ -610,57 +610,59 @@ const st = ["data-scene"], it = /* @__PURE__ */ q({
610
610
  ), v.value || (r(
611
611
  "No camera found. Creating a default perspective camera. To have full control over a camera, please add one to the scene."
612
612
  ), M());
613
- }), (d, m) => (pe(), me("canvas", {
613
+ }), (p, d) => (pe(), me("canvas", {
614
614
  ref_key: "canvas",
615
615
  ref: n,
616
616
  "data-scene": o.value.uuid,
617
- style: de({
617
+ class: de(p.$attrs.class),
618
+ style: ve({
618
619
  display: "block",
619
620
  width: "100%",
620
621
  height: "100%",
621
- position: d.windowSize ? "fixed" : "relative",
622
+ position: p.windowSize ? "fixed" : "relative",
622
623
  top: 0,
623
624
  left: 0,
624
625
  pointerEvents: "auto",
625
- touchAction: "none"
626
+ touchAction: "none",
627
+ ...p.$attrs.style
626
628
  })
627
- }, null, 12, st));
629
+ }, null, 14, it));
628
630
  }
629
- }), lt = [
631
+ }), ut = [
630
632
  "TresCanvas",
631
633
  "TresLeches",
632
634
  "TresScene"
633
- ], ut = {
635
+ ], ct = {
634
636
  template: {
635
637
  compilerOptions: {
636
- isCustomElement: (e) => e.startsWith("Tres") && !lt.includes(e) || e === "primitive"
638
+ isCustomElement: (e) => e.startsWith("Tres") && !ut.includes(e) || e === "primitive"
637
639
  }
638
640
  }
639
- }, Ct = ut, Pt = {
641
+ }, Pt = ct, ht = {
640
642
  install(e) {
641
- e.component("TresCanvas", it);
643
+ e.component("TresCanvas", lt);
642
644
  }
643
645
  };
644
646
  export {
645
- it as TresCanvas,
647
+ lt as TresCanvas,
646
648
  G as catalogue,
647
- Pt as default,
649
+ ht as default,
648
650
  V as extend,
649
- mt as isProd,
650
- Ge as normalizeColor,
651
- dt as normalizeVectorFlexibleParam,
652
- Ct as templateCompilerOptions,
653
- Ze as trasverseObjects,
654
- Fe as useCamera,
655
- vt as useLoader,
651
+ dt as isProd,
652
+ We as normalizeColor,
653
+ vt as normalizeVectorFlexibleParam,
654
+ Pt as templateCompilerOptions,
655
+ et as trasverseObjects,
656
+ ze as useCamera,
657
+ gt as useLoader,
656
658
  O as useLogger,
657
- tt as usePointerEventHandler,
658
- et as useRaycaster,
659
+ rt as usePointerEventHandler,
660
+ tt as useRaycaster,
659
661
  ne as useRenderLoop,
660
- Ye as useRenderer,
661
- yt as useSeek,
662
- gt as useTexture,
663
- wt as useTres,
664
- nt as useTresContext,
665
- rt as useTresContextProvider
662
+ Qe as useRenderer,
663
+ wt as useSeek,
664
+ yt as useTexture,
665
+ Ct as useTres,
666
+ at as useTresContext,
667
+ nt as useTresContextProvider
666
668
  };
package/dist/tres.umd.cjs CHANGED
@@ -1,8 +1,8 @@
1
1
  /**
2
2
  * name: @tresjs/core
3
- * version: v3.3.0
3
+ * version: v3.4.1
4
4
  * (c) 2023
5
5
  * description: Declarative ThreeJS using Vue Components
6
6
  * author: Alvaro Saburido <hola@alvarosaburido.dev> (https://github.com/alvarosabu/)
7
7
  */
8
- (function(w,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):(w=typeof globalThis<"u"?globalThis:w||self,u(w.tres={},w.Vue,w.Three,w.VueUseCore))})(this,function(w,u,P,C){"use strict";function ae(e){const a=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const t in e)if(t!=="default"){const r=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(a,t,r.get?r:{enumerable:!0,get:()=>e[t]})}}return a.default=e,Object.freeze(a)}const oe=ae(P),R=({sizes:e,scene:a})=>{const t=u.ref([]),r=u.computed(()=>t.value[0]),n=(s,d=!1)=>{t.value.some(({uuid:l})=>l===s.uuid)||(d?f(s):t.value.push(s))},o=s=>{t.value=t.value.filter(({uuid:d})=>d!==s.uuid)},f=s=>{const d=s instanceof P.Camera?s:t.value.find(m=>m.uuid===s);if(!d)return;const l=t.value.filter(({uuid:m})=>m!==d.uuid);t.value=[d,...l]};return u.watchEffect(()=>{e.aspectRatio.value&&t.value.forEach(s=>{s instanceof P.PerspectiveCamera&&(s.aspect=e.aspectRatio.value),(s instanceof P.PerspectiveCamera||s instanceof P.OrthographicCamera)&&s.updateProjectionMatrix()})}),a.userData.tres__registerCamera=n,a.userData.tres__deregisterCamera=o,u.onUnmounted(()=>{t.value=[]}),{camera:r,cameras:t,registerCamera:n,deregisterCamera:o,setCameraActive:f}},I=C.createEventHook(),W=C.createEventHook(),F=C.createEventHook(),S=new P.Clock;let B=0,x=0;const{pause:se,resume:ie,isActive:le}=C.useRafFn(()=>{I.trigger({delta:B,elapsed:x,clock:S}),W.trigger({delta:B,elapsed:x,clock:S}),F.trigger({delta:B,elapsed:x,clock:S})},{immediate:!1});F.on(()=>{B=S.getDelta(),x=S.getElapsedTime()});const G=()=>({onBeforeLoop:I.on,onLoop:W.on,onAfterLoop:F.on,pause:se,resume:ie,isActive:le}),ue=!0,$="[TresJS ▲ ■ ●] ";function L(){function e(r,n){console.error(`${$} ${r}`,n||"")}function a(r){console.warn(`${$} ${r}`)}function t(r,n){}return{logError:e,logWarning:a,logMessage:t}}function ce(e){return typeof e=="number"?[e,e,e]:e instanceof P.Vector3?[e.x,e.y,e.z]:e}function N(e){return e instanceof P.Color?e:Array.isArray(e)?new P.Color(...e):new P.Color(e)}const q=(e,a)=>{for(const t of Object.keys(a))a[t]instanceof Object&&Object.assign(a[t],q(e[t],a[t]));return Object.assign(e||{},a),e},fe=de("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 U(e){return e&&e.nodeType===1}function E(e){return e.replace(/-([a-z])/g,(a,t)=>t.toUpperCase())}function de(e,a){const t=Object.create(null),r=e.split(",");for(let n=0;n<r.length;n++)t[r[n]]=!0;return a?n=>!!t[n.toLowerCase()]:n=>!!t[n]}const me=(e,a)=>{const t=new Set,r=[];for(const n of e){const o=a(n);t.has(o)||(t.add(o),r.push(n))}return r},H=(e,a)=>{if(!a)return;const t=Array.isArray(a)?a:a.match(/([^[.\]])+/g);return t==null?void 0:t.reduce((r,n)=>r&&r[n],e)},pe=(e,a,t)=>{const r=Array.isArray(a)?a:a.match(/([^[.\]])+/g);r&&r.reduce((n,o,f)=>(n[o]===void 0&&(n[o]={}),f===r.length-1&&(n[o]=t),n[o]),e)};function J(e,a){if(U(e)&&U(a)){const n=e.attributes,o=a.attributes;return n.length!==o.length?!1:Array.from(n).every(({name:f,value:s})=>a.getAttribute(f)===s)}if(e===a)return!0;if(e===null||typeof e!="object"||a===null||typeof a!="object")return!1;const t=Object.keys(e),r=Object.keys(a);if(t.length!==r.length)return!1;for(const n of t)if(!r.includes(n)||!J(e[n],a[n]))return!1;return!0}function ge(e,a){if(!Array.isArray(e)||!Array.isArray(a)||e.length!==a.length)return!1;for(let t=0;t<e.length;t++)if(!J(e[t],a[t]))return!1;return!0}const ve=Array.isArray,ye=Number.parseInt(P.REVISION.replace("dev","")),V={realistic:{shadows:!0,physicallyCorrectLights:!0,outputColorSpace:P.SRGBColorSpace,toneMapping:P.ACESFilmicToneMapping,toneMappingExposure:3,shadowMap:{enabled:!0,type:P.PCFSoftShadowMap}}};function K({scene:e,canvas:a,options:t,disableRender:r,contextParts:{sizes:n,camera:o}}){const f=u.computed(()=>({alpha:C.toValue(t.alpha),depth:C.toValue(t.depth),canvas:C.unrefElement(a),context:C.toValue(t.context),stencil:C.toValue(t.stencil),antialias:C.toValue(t.antialias)===void 0?!0:C.toValue(t.antialias),precision:C.toValue(t.precision),powerPreference:C.toValue(t.powerPreference),premultipliedAlpha:C.toValue(t.premultipliedAlpha),preserveDrawingBuffer:C.toValue(t.preserveDrawingBuffer),logarithmicDepthBuffer:C.toValue(t.logarithmicDepthBuffer),failIfMajorPerformanceCaveat:C.toValue(t.failIfMajorPerformanceCaveat)})),s=u.shallowRef(new P.WebGLRenderer(f.value));u.watch(f,()=>{s.value.dispose(),s.value=new P.WebGLRenderer(f.value)}),u.watchEffect(()=>{s.value.setSize(n.width.value,n.height.value)});const{pixelRatio:d}=C.useDevicePixelRatio();u.watchEffect(()=>{s.value.setPixelRatio(d.value)});const{logError:l}=L(),c=(()=>{const v=new P.WebGLRenderer,_={shadowMap:{enabled:v.shadowMap.enabled,type:v.shadowMap.type},toneMapping:v.toneMapping,toneMappingExposure:v.toneMappingExposure,outputColorSpace:v.outputColorSpace};return v.dispose(),_})();u.watchEffect(()=>{const v=C.toValue(t.preset);v&&(v in V||l(`Renderer Preset must be one of these: ${Object.keys(V).join(", ")}`),q(s.value,V[v]));const _=(A,M)=>{const O=C.toValue(A),z=()=>{if(v)return H(V[v],M)};if(O!==void 0)return O;const h=z();return h!==void 0?h:H(c,M)},k=(A,M)=>pe(s.value,M,_(A,M));k(t.shadows,"shadowMap.enabled"),k(t.toneMapping,"toneMapping"),k(t.shadowMapType,"shadowMap.type"),ye<150&&k(!t.useLegacyLights,"physicallyCorrectLights"),k(t.outputColorSpace,"outputColorSpace"),k(t.toneMappingExposure,"toneMappingExposure");const D=_(t.clearColor,"clearColor");D&&s.value.setClearColor(D?N(D):new P.Color(0))});const{pause:i,resume:g,onLoop:p}=G();return p(()=>{o.value&&!C.toValue(r)&&s.value.render(e,o.value)}),g(),u.onUnmounted(()=>{i(),s.value.dispose(),s.value.forceContextLoss()}),{renderer:s}}const X=e=>typeof e=="function",we=e=>!!e&&e.constructor===Array;function Y(e){const a={nodes:{},materials:{}};return e&&e.traverse(t=>{t.name&&(a.nodes[t.name]=t),t.material&&!a.materials[t.material.name]&&(a.materials[t.material.name]=t.material)}),a}async function Ce(e,a,t,r,n){const{logError:o}=L(),f=new e;n&&n(f),t&&t(f);const d=(Array.isArray(a)?a:[a]).map(l=>new Promise((m,c)=>{f.load(l,i=>{i.scene&&Object.assign(i,Y(i.scene)),m(i)},r,i=>c(o("[useLoader] - Failed to load resource",i)))}));return we(a)?await Promise.all(d):await d[0]}async function he(e){const a=new P.LoadingManager,t=new P.TextureLoader(a),r=n=>new Promise((o,f)=>{t.load(n,s=>o(s),()=>null,()=>{f(new Error("[useTextures] - Failed to load texture"))})});if(ve(e)){const n=await Promise.all(e.map(o=>r(o)));return e.length>1?n:n[0]}else{const{map:n,displacementMap:o,normalMap:f,roughnessMap:s,metalnessMap:d,aoMap:l,alphaMap:m,matcap:c}=e;return{map:n?await r(n):null,displacementMap:o?await r(o):null,normalMap:f?await r(f):null,roughnessMap:s?await r(s):null,metalnessMap:d?await r(d):null,aoMap:l?await r(l):null,alphaMap:m?await r(m):null,matcap:c?await r(c):null}}}const Q=(e,{renderer:a,camera:t,raycaster:r})=>{const n=u.computed(()=>a.value.domElement),{x:o,y:f}=C.usePointer({target:n}),{width:s,height:d,top:l,left:m}=C.useElementBounding(n),c=({x:h,y:b})=>{if(n.value)return{x:(h-m.value)/s.value*2-1,y:-((b-l.value)/d.value)*2+1}},i=({x:h,y:b})=>{if(t.value)return r.value.setFromCamera(new P.Vector2(h,b),t.value),r.value.intersectObjects(e.value,!1)},g=h=>{const b=c({x:(h==null?void 0:h.clientX)??o.value,y:(h==null?void 0:h.clientY)??f.value});return b?i(b)||[]:[]},p=u.computed(()=>g()),v=C.createEventHook(),_=C.createEventHook(),k=(h,b)=>{h.trigger({event:b,intersects:g(b)})},D=h=>{k(_,h)};let A;const M=h=>{var b;A=(b=g(h)[0])==null?void 0:b.object},O=h=>{var b;h instanceof PointerEvent&&A===((b=g(h)[0])==null?void 0:b.object)&&k(v,h)},z=h=>_.trigger({event:h,intersects:[]});return n.value.addEventListener("pointerup",O),n.value.addEventListener("pointerdown",M),n.value.addEventListener("pointermove",D),n.value.addEventListener("pointerleave",z),u.onUnmounted(()=>{n!=null&&n.value&&(n.value.removeEventListener("pointerup",O),n.value.removeEventListener("pointerdown",M),n.value.removeEventListener("pointermove",D),n.value.removeEventListener("pointerleave",z))}),{intersects:p,onClick:h=>v.on(h).off,onPointerMove:h=>_.on(h).off}};function Pe(){const{logWarning:e}=L();function a(r,n,o){let f=null;return r.traverse(s=>{s[n]===o&&(f=s)}),f||e(`Child with ${n} '${o}' not found.`),f}function t(r,n){return a(r,"name",n)}return{seek:a,seekByName:t}}const Z=({scene:e,contextParts:a})=>{const t=u.reactive({click:new Map,pointerMove:new Map,pointerEnter:new Map,pointerLeave:new Map}),r=u.ref(new Set),n=i=>{r.value.add(i)},o=i=>{r.value.delete(i)},f=i=>{Object.values(t).forEach(g=>g.delete(i)),o(i)},s=i=>{const{onClick:g,onPointerMove:p,onPointerEnter:v,onPointerLeave:_}=i;g&&t.click.set(i,g),p&&t.pointerMove.set(i,p),v&&t.pointerEnter.set(i,v),_&&t.pointerLeave.set(i,_)};e.userData.tres__registerAtPointerEventHandler=s,e.userData.tres__deregisterAtPointerEventHandler=f,e.userData.tres__registerBlockingObjectAtPointerEventHandler=n,e.userData.tres__deregisterBlockingObjectAtPointerEventHandler=o;const d=u.computed(()=>me([...Array.from(r.value),...Object.values(t).map(i=>Array.from(i.keys())).flat()],({uuid:i})=>i)),{onClick:l,onPointerMove:m}=Q(d,a);l(({intersects:i,event:g})=>{var p;i.length&&((p=t.click.get(i[0].object))==null||p(i[0],g))});let c;return m(({intersects:i,event:g})=>{var D,A,M,O;const p=(D=i==null?void 0:i[0])==null?void 0:D.object,{pointerLeave:v,pointerEnter:_,pointerMove:k}=t;c&&c!==p&&((A=v.get(c))==null||A(c,g)),p&&(c!==p&&((M=_.get(p))==null||M(i[0],g)),(O=k.get(p))==null||O(i[0],g)),c=p||null}),{registerObject:s,deregisterObject:f}},T=u.ref({}),j=e=>Object.assign(T.value,e);function ee({scene:e,canvas:a,windowSize:t,disableRender:r,rendererOptions:n}){const o=u.computed(()=>C.toValue(t)?C.useWindowSize():C.useElementSize(C.toValue(a).parentElement)),f=u.computed(()=>o.value.width.value),s=u.computed(()=>o.value.height.value),d=u.computed(()=>f.value/s.value),l={height:s,width:f,aspectRatio:d},m=u.shallowRef(e),{camera:c,cameras:i,registerCamera:g,deregisterCamera:p,setCameraActive:v}=R({sizes:l,scene:e}),{renderer:_}=K({scene:e,canvas:a,options:n,contextParts:{sizes:l,camera:c},disableRender:r}),k={sizes:l,scene:m,camera:c,cameras:u.readonly(i),renderer:_,raycaster:u.shallowRef(new P.Raycaster),controls:u.ref(null),extend:j,registerCamera:g,setCameraActive:v,deregisterCamera:p};return u.provide("useTres",k),k}function te(){const e=u.inject("useTres");if(!e)throw new Error("useTresContext must be used together with useTresContextProvider");return e}const _e=te;function Se(e){}let y=null;const{logError:re}=L(),Me={createElement(e,a,t,r){var f,s;if(r||(r={}),r.args||(r.args=[]),e==="template"||fe(e))return null;let n=e.replace("Tres",""),o;if(e==="primitive"){(r==null?void 0:r.object)===void 0&&re("Tres primitives need a prop 'object'");const d=r.object;n=d.type,o=Object.assign(d,{type:n,attach:r.attach,primitive:!0})}else{const d=T.value[n];d||re(`${n} is not defined on the THREE namespace. Use extend to add it to the catalog.`),o=new d(...r.args)}return o.isCamera&&(r!=null&&r.position||o.position.set(3,3,3),r!=null&&r.lookAt||o.lookAt(0,0,0)),(r==null?void 0:r.attach)===void 0&&(o.isMaterial?o.attach="material":o.isBufferGeometry&&(o.attach="geometry")),o.isObject3D&&((f=r==null?void 0:r.material)!=null&&f.isMaterial&&(o.userData.tres__materialViaProp=!0),(s=r==null?void 0:r.geometry)!=null&&s.isBufferGeometry&&(o.userData.tres__geometryViaProp=!0)),o.userData={...o.userData,tres__name:n},o},insert(e,a){var r,n,o,f;a&&a.isScene&&(y=a);const t=a||y;if(e!=null&&e.isObject3D){if(e!=null&&e.isCamera){if(!(y!=null&&y.userData.tres__registerCamera))throw"could not find tres__registerCamera on scene's userData";(n=y==null?void 0:(r=y.userData).tres__registerCamera)==null||n.call(r,e)}if(e!=null&&e.onClick||e!=null&&e.onPointerMove||e!=null&&e.onPointerEnter||e!=null&&e.onPointerLeave){if(!(y!=null&&y.userData.tres__registerAtPointerEventHandler))throw"could not find tres__registerAtPointerEventHandler on scene's userData";(f=y==null?void 0:(o=y.userData).tres__registerAtPointerEventHandler)==null||f.call(o,e)}}e!=null&&e.isObject3D&&(t!=null&&t.isObject3D)?(t.add(e),e.dispatchEvent({type:"added"})):e!=null&&e.isFog?t.fog=e:typeof(e==null?void 0:e.attach)=="string"&&(e.__previousAttach=e[t==null?void 0:t.attach],t&&(t[e.attach]=e))},remove(e){var a,t;if(e){if(e.isObject3D){const r=e,n=l=>{var c,i;const m=l;l.userData.tres__materialViaProp||(c=m.material)==null||c.dispose(),l.userData.tres__geometryViaProp||(i=m.geometry)==null||i.dispose()},o=y==null?void 0:y.userData.tres__deregisterAtPointerEventHandler,f=y==null?void 0:y.userData.tres__deregisterBlockingObjectAtPointerEventHandler,s=l=>{var m,c;if(!f)throw"could not find tres__deregisterBlockingObjectAtPointerEventHandler on scene's userData";if((c=y==null?void 0:(m=y.userData).tres__deregisterBlockingObjectAtPointerEventHandler)==null||c.call(m,l),!o)throw"could not find tres__deregisterAtPointerEventHandler on scene's userData";(l!=null&&l.onClick||l!=null&&l.onPointerMove||l!=null&&l.onPointerEnter||l!=null&&l.onPointerLeave)&&(o==null||o(l))},d=l=>{const m=y==null?void 0:y.userData.tres__deregisterCamera;if(!m)throw"could not find tres__deregisterCamera on scene's userData";l.isCamera&&(m==null||m(l))};r.traverse(l=>{n(l),d(l),s==null||s(l)}),n(r),d(r),s==null||s(r)}(a=e.removeFromParent)==null||a.call(e),(t=e.dispose)==null||t.call(e)}},patchProp(e,a,t,r){var n,o,f,s;if(e){let d=e,l=a;if(e.isObject3D&&l==="blocks-pointer-events"){r||r===""?(o=y==null?void 0:(n=y.userData).tres__registerBlockingObjectAtPointerEventHandler)==null||o.call(n,e):(s=y==null?void 0:(f=y.userData).tres__deregisterBlockingObjectAtPointerEventHandler)==null||s.call(f,e);return}let m=E(l),c=d==null?void 0:d[m];if(l==="args"){const g=e,p=t??[],v=r??[],_=e.userData.tres__name||e.type;_&&p.length&&!ge(p,v)&&(d=Object.assign(g,new T.value[_](...r)));return}if(d.type==="BufferGeometry"){if(l==="args")return;d.setAttribute(E(l),new P.BufferAttribute(...r));return}if(l.includes("-")&&c===void 0){const g=l.split("-");c=g.reduce((p,v)=>p[E(v)],d),l=g.pop(),m=l.toLowerCase(),c!=null&&c.set||(d=g.reduce((p,v)=>p[E(v)],d))}let i=r;if(i===""&&(i=!0),X(c)){Array.isArray(i)?e[m](...i):e[m](i);return}!(c!=null&&c.set)&&!X(c)?d[m]=i:c.constructor===i.constructor&&(c!=null&&c.copy)?c==null||c.copy(i):Array.isArray(i)?c.set(...i):!c.isColor&&c.setScalar?c.setScalar(i):c.set(i)}},parentNode(e){return(e==null?void 0:e.parent)||null},createText:()=>void 0,createComment:()=>void 0,setText:()=>void 0,setElementText:()=>void 0,nextSibling:()=>void 0,querySelector:()=>void 0,setScopeId:()=>void 0,cloneNode:()=>void 0,insertStaticContent:()=>void 0},{render:Ae}=u.createRenderer(Me);j(oe);const ke=["data-scene"],ne=u.defineComponent({__name:"TresCanvas",props:{shadows:{type:Boolean,default:void 0},clearColor:{},toneMapping:{},shadowMapType:{},useLegacyLights:{type:Boolean,default:void 0},outputColorSpace:{},toneMappingExposure:{},camera:{},preset:{},windowSize:{type:Boolean,default:void 0},disableRender:{type:Boolean,default:void 0},context:{},precision:{},alpha:{type:Boolean,default:void 0},premultipliedAlpha:{type:Boolean},antialias:{type:Boolean,default:void 0},stencil:{type:Boolean,default:void 0},preserveDrawingBuffer:{type:Boolean,default:void 0},powerPreference:{},depth:{type:Boolean,default:void 0},logarithmicDepthBuffer:{type:Boolean,default:void 0},failIfMajorPerformanceCaveat:{type:Boolean,default:void 0}},setup(e,{expose:a}){var i;const t=e,{logWarning:r}=L(),n=u.ref(),o=u.shallowRef(new P.Scene);G();const f=u.useSlots(),s=(i=u.getCurrentInstance())==null?void 0:i.appContext.app,d=g=>u.defineComponent({setup(){var v;const p=(v=u.getCurrentInstance())==null?void 0:v.appContext;return p&&(p.app=s),u.provide("useTres",g),u.provide("extend",j),()=>u.h(u.Fragment,null,f!=null&&f.default?f.default():[])}}),l=g=>{const p=d(g);Ae(u.h(p),o.value)},m=u.computed(()=>t.disableRender),c=u.shallowRef(null);return a({context:c}),u.onMounted(()=>{const g=n;c.value=ee({scene:o.value,canvas:g,windowSize:t.windowSize,disableRender:m,rendererOptions:t}),Z({scene:o.value,contextParts:c.value});const{registerCamera:p,camera:v,cameras:_,deregisterCamera:k}=c.value;l(c.value);const D=()=>{const A=new P.PerspectiveCamera(45,window.innerWidth/window.innerHeight,.1,1e3);A.position.set(3,3,3),A.lookAt(0,0,0),p(A);const M=u.watchEffect(()=>{_.value.length>=2&&(A.removeFromParent(),k(A),M==null||M())})};u.watch(()=>t.camera,(A,M)=>{A&&p(A),M&&(M.removeFromParent(),k(M))},{immediate:!0}),v.value||(r("No camera found. Creating a default perspective camera. To have full control over a camera, please add one to the scene."),D())}),(g,p)=>(u.openBlock(),u.createElementBlock("canvas",{ref_key:"canvas",ref:n,"data-scene":o.value.uuid,style:u.normalizeStyle({display:"block",width:"100%",height:"100%",position:g.windowSize?"fixed":"relative",top:0,left:0,pointerEvents:"auto",touchAction:"none"})},null,12,ke))}}),be=["TresCanvas","TresLeches","TresScene"],De={template:{compilerOptions:{isCustomElement:e=>e.startsWith("Tres")&&!be.includes(e)||e==="primitive"}}},Oe={install(e){e.component("TresCanvas",ne)}};w.TresCanvas=ne,w.catalogue=T,w.default=Oe,w.extend=j,w.isProd=ue,w.normalizeColor=N,w.normalizeVectorFlexibleParam=ce,w.templateCompilerOptions=De,w.trasverseObjects=Y,w.useCamera=R,w.useLoader=Ce,w.useLogger=L,w.usePointerEventHandler=Z,w.useRaycaster=Q,w.useRenderLoop=G,w.useRenderer=K,w.useSeek=Pe,w.useTexture=he,w.useTres=_e,w.useTresContext=te,w.useTresContextProvider=ee,Object.defineProperties(w,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});
8
+ (function(w,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):(w=typeof globalThis<"u"?globalThis:w||self,u(w.tres={},w.Vue,w.Three,w.VueUseCore))})(this,function(w,u,P,C){"use strict";function ae(e){const a=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const t in e)if(t!=="default"){const r=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(a,t,r.get?r:{enumerable:!0,get:()=>e[t]})}}return a.default=e,Object.freeze(a)}const oe=ae(P),R=({sizes:e,scene:a})=>{const t=u.ref([]),r=u.computed(()=>t.value[0]),n=(s,d=!1)=>{t.value.some(({uuid:l})=>l===s.uuid)||(d?f(s):t.value.push(s))},o=s=>{t.value=t.value.filter(({uuid:d})=>d!==s.uuid)},f=s=>{const d=s instanceof P.Camera?s:t.value.find(p=>p.uuid===s);if(!d)return;const l=t.value.filter(({uuid:p})=>p!==d.uuid);t.value=[d,...l]};return u.watchEffect(()=>{e.aspectRatio.value&&t.value.forEach(s=>{s instanceof P.PerspectiveCamera&&(s.aspect=e.aspectRatio.value),(s instanceof P.PerspectiveCamera||s instanceof P.OrthographicCamera)&&s.updateProjectionMatrix()})}),a.userData.tres__registerCamera=n,a.userData.tres__deregisterCamera=o,u.onUnmounted(()=>{t.value=[]}),{camera:r,cameras:t,registerCamera:n,deregisterCamera:o,setCameraActive:f}},$=C.createEventHook(),I=C.createEventHook(),F=C.createEventHook(),S=new P.Clock;let B=0,x=0;const{pause:se,resume:ie,isActive:le}=C.useRafFn(()=>{$.trigger({delta:B,elapsed:x,clock:S}),I.trigger({delta:B,elapsed:x,clock:S}),F.trigger({delta:B,elapsed:x,clock:S})},{immediate:!1});F.on(()=>{B=S.getDelta(),x=S.getElapsedTime()});const G=()=>({onBeforeLoop:$.on,onLoop:I.on,onAfterLoop:F.on,pause:se,resume:ie,isActive:le}),ue=!0,W="[TresJS ▲ ■ ●] ";function L(){function e(r,n){console.error(`${W} ${r}`,n||"")}function a(r){console.warn(`${W} ${r}`)}function t(r,n){}return{logError:e,logWarning:a,logMessage:t}}function ce(e){return typeof e=="number"?[e,e,e]:e instanceof P.Vector3?[e.x,e.y,e.z]:e}function N(e){return e instanceof P.Color?e:Array.isArray(e)?new P.Color(...e):new P.Color(e)}const q=(e,a)=>{for(const t of Object.keys(a))a[t]instanceof Object&&Object.assign(a[t],q(e[t],a[t]));return Object.assign(e||{},a),e},fe=de("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 U(e){return e&&e.nodeType===1}function E(e){return e.replace(/-([a-z])/g,(a,t)=>t.toUpperCase())}function de(e,a){const t=Object.create(null),r=e.split(",");for(let n=0;n<r.length;n++)t[r[n]]=!0;return a?n=>!!t[n.toLowerCase()]:n=>!!t[n]}const me=(e,a)=>{const t=new Set,r=[];for(const n of e){const o=a(n);t.has(o)||(t.add(o),r.push(n))}return r},H=(e,a)=>{if(!a)return;const t=Array.isArray(a)?a:a.match(/([^[.\]])+/g);return t==null?void 0:t.reduce((r,n)=>r&&r[n],e)},pe=(e,a,t)=>{const r=Array.isArray(a)?a:a.match(/([^[.\]])+/g);r&&r.reduce((n,o,f)=>(n[o]===void 0&&(n[o]={}),f===r.length-1&&(n[o]=t),n[o]),e)};function J(e,a){if(U(e)&&U(a)){const n=e.attributes,o=a.attributes;return n.length!==o.length?!1:Array.from(n).every(({name:f,value:s})=>a.getAttribute(f)===s)}if(e===a)return!0;if(e===null||typeof e!="object"||a===null||typeof a!="object")return!1;const t=Object.keys(e),r=Object.keys(a);if(t.length!==r.length)return!1;for(const n of t)if(!r.includes(n)||!J(e[n],a[n]))return!1;return!0}function ge(e,a){if(!Array.isArray(e)||!Array.isArray(a)||e.length!==a.length)return!1;for(let t=0;t<e.length;t++)if(!J(e[t],a[t]))return!1;return!0}const ve=Array.isArray,ye=Number.parseInt(P.REVISION.replace("dev","")),V={realistic:{shadows:!0,physicallyCorrectLights:!0,outputColorSpace:P.SRGBColorSpace,toneMapping:P.ACESFilmicToneMapping,toneMappingExposure:3,shadowMap:{enabled:!0,type:P.PCFSoftShadowMap}}};function K({scene:e,canvas:a,options:t,disableRender:r,contextParts:{sizes:n,camera:o}}){const f=u.computed(()=>({alpha:C.toValue(t.alpha),depth:C.toValue(t.depth),canvas:C.unrefElement(a),context:C.toValue(t.context),stencil:C.toValue(t.stencil),antialias:C.toValue(t.antialias)===void 0?!0:C.toValue(t.antialias),precision:C.toValue(t.precision),powerPreference:C.toValue(t.powerPreference),premultipliedAlpha:C.toValue(t.premultipliedAlpha),preserveDrawingBuffer:C.toValue(t.preserveDrawingBuffer),logarithmicDepthBuffer:C.toValue(t.logarithmicDepthBuffer),failIfMajorPerformanceCaveat:C.toValue(t.failIfMajorPerformanceCaveat)})),s=u.shallowRef(new P.WebGLRenderer(f.value));u.watch(f,()=>{s.value.dispose(),s.value=new P.WebGLRenderer(f.value)}),u.watchEffect(()=>{s.value.setSize(n.width.value,n.height.value)});const{pixelRatio:d}=C.useDevicePixelRatio();u.watchEffect(()=>{s.value.setPixelRatio(d.value)});const{logError:l}=L(),c=(()=>{const v=new P.WebGLRenderer,_={shadowMap:{enabled:v.shadowMap.enabled,type:v.shadowMap.type},toneMapping:v.toneMapping,toneMappingExposure:v.toneMappingExposure,outputColorSpace:v.outputColorSpace};return v.dispose(),_})();u.watchEffect(()=>{const v=C.toValue(t.preset);v&&(v in V||l(`Renderer Preset must be one of these: ${Object.keys(V).join(", ")}`),q(s.value,V[v]));const _=(A,M)=>{const O=C.toValue(A),z=()=>{if(v)return H(V[v],M)};if(O!==void 0)return O;const h=z();return h!==void 0?h:H(c,M)},k=(A,M)=>pe(s.value,M,_(A,M));k(t.shadows,"shadowMap.enabled"),k(t.toneMapping,"toneMapping"),k(t.shadowMapType,"shadowMap.type"),ye<150&&k(!t.useLegacyLights,"physicallyCorrectLights"),k(t.outputColorSpace,"outputColorSpace"),k(t.toneMappingExposure,"toneMappingExposure");const D=_(t.clearColor,"clearColor");D&&s.value.setClearColor(D?N(D):new P.Color(0))});const{pause:i,resume:m,onLoop:g}=G();return g(()=>{o.value&&!C.toValue(r)&&s.value.render(e,o.value)}),m(),u.onUnmounted(()=>{i(),s.value.dispose(),s.value.forceContextLoss()}),{renderer:s}}const X=e=>typeof e=="function",we=e=>!!e&&e.constructor===Array;function Y(e){const a={nodes:{},materials:{}};return e&&e.traverse(t=>{t.name&&(a.nodes[t.name]=t),t.material&&!a.materials[t.material.name]&&(a.materials[t.material.name]=t.material)}),a}async function Ce(e,a,t,r,n){const{logError:o}=L(),f=new e;n&&n(f),t&&t(f);const d=(Array.isArray(a)?a:[a]).map(l=>new Promise((p,c)=>{f.load(l,i=>{i.scene&&Object.assign(i,Y(i.scene)),p(i)},r,i=>c(o("[useLoader] - Failed to load resource",i)))}));return we(a)?await Promise.all(d):await d[0]}async function he(e){const a=new P.LoadingManager,t=new P.TextureLoader(a),r=n=>new Promise((o,f)=>{t.load(n,s=>o(s),()=>null,()=>{f(new Error("[useTextures] - Failed to load texture"))})});if(ve(e)){const n=await Promise.all(e.map(o=>r(o)));return e.length>1?n:n[0]}else{const{map:n,displacementMap:o,normalMap:f,roughnessMap:s,metalnessMap:d,aoMap:l,alphaMap:p,matcap:c}=e;return{map:n?await r(n):null,displacementMap:o?await r(o):null,normalMap:f?await r(f):null,roughnessMap:s?await r(s):null,metalnessMap:d?await r(d):null,aoMap:l?await r(l):null,alphaMap:p?await r(p):null,matcap:c?await r(c):null}}}const Q=(e,{renderer:a,camera:t,raycaster:r})=>{const n=u.computed(()=>a.value.domElement),{x:o,y:f}=C.usePointer({target:n}),{width:s,height:d,top:l,left:p}=C.useElementBounding(n),c=({x:h,y:b})=>{if(n.value)return{x:(h-p.value)/s.value*2-1,y:-((b-l.value)/d.value)*2+1}},i=({x:h,y:b})=>{if(t.value)return r.value.setFromCamera(new P.Vector2(h,b),t.value),r.value.intersectObjects(e.value,!1)},m=h=>{const b=c({x:(h==null?void 0:h.clientX)??o.value,y:(h==null?void 0:h.clientY)??f.value});return b?i(b)||[]:[]},g=u.computed(()=>m()),v=C.createEventHook(),_=C.createEventHook(),k=(h,b)=>{h.trigger({event:b,intersects:m(b)})},D=h=>{k(_,h)};let A;const M=h=>{var b;A=(b=m(h)[0])==null?void 0:b.object},O=h=>{var b;h instanceof PointerEvent&&A===((b=m(h)[0])==null?void 0:b.object)&&k(v,h)},z=h=>_.trigger({event:h,intersects:[]});return n.value.addEventListener("pointerup",O),n.value.addEventListener("pointerdown",M),n.value.addEventListener("pointermove",D),n.value.addEventListener("pointerleave",z),u.onUnmounted(()=>{n!=null&&n.value&&(n.value.removeEventListener("pointerup",O),n.value.removeEventListener("pointerdown",M),n.value.removeEventListener("pointermove",D),n.value.removeEventListener("pointerleave",z))}),{intersects:g,onClick:h=>v.on(h).off,onPointerMove:h=>_.on(h).off}};function Pe(){const{logWarning:e}=L();function a(r,n,o){let f=null;return r.traverse(s=>{s[n]===o&&(f=s)}),f||e(`Child with ${n} '${o}' not found.`),f}function t(r,n){return a(r,"name",n)}return{seek:a,seekByName:t}}const Z=({scene:e,contextParts:a})=>{const t=u.reactive({click:new Map,pointerMove:new Map,pointerEnter:new Map,pointerLeave:new Map}),r=u.ref(new Set),n=i=>{r.value.add(i)},o=i=>{r.value.delete(i)},f=i=>{Object.values(t).forEach(m=>m.delete(i)),o(i)},s=i=>{const{onClick:m,onPointerMove:g,onPointerEnter:v,onPointerLeave:_}=i;m&&t.click.set(i,m),g&&t.pointerMove.set(i,g),v&&t.pointerEnter.set(i,v),_&&t.pointerLeave.set(i,_)};e.userData.tres__registerAtPointerEventHandler=s,e.userData.tres__deregisterAtPointerEventHandler=f,e.userData.tres__registerBlockingObjectAtPointerEventHandler=n,e.userData.tres__deregisterBlockingObjectAtPointerEventHandler=o;const d=u.computed(()=>me([...Array.from(r.value),...Object.values(t).map(i=>Array.from(i.keys())).flat()],({uuid:i})=>i)),{onClick:l,onPointerMove:p}=Q(d,a);l(({intersects:i,event:m})=>{var g;i.length&&((g=t.click.get(i[0].object))==null||g(i[0],m))});let c;return p(({intersects:i,event:m})=>{var D,A,M,O;const g=(D=i==null?void 0:i[0])==null?void 0:D.object,{pointerLeave:v,pointerEnter:_,pointerMove:k}=t;c&&c!==g&&((A=v.get(c))==null||A(c,m)),g&&(c!==g&&((M=_.get(g))==null||M(i[0],m)),(O=k.get(g))==null||O(i[0],m)),c=g||null}),{registerObject:s,deregisterObject:f}},T=u.ref({}),j=e=>Object.assign(T.value,e);function ee({scene:e,canvas:a,windowSize:t,disableRender:r,rendererOptions:n}){const o=u.computed(()=>C.toValue(t)?C.useWindowSize():C.useElementSize(C.toValue(a).parentElement)),f=u.computed(()=>o.value.width.value),s=u.computed(()=>o.value.height.value),d=u.computed(()=>f.value/s.value),l={height:s,width:f,aspectRatio:d},p=u.shallowRef(e),{camera:c,cameras:i,registerCamera:m,deregisterCamera:g,setCameraActive:v}=R({sizes:l,scene:e}),{renderer:_}=K({scene:e,canvas:a,options:n,contextParts:{sizes:l,camera:c},disableRender:r}),k={sizes:l,scene:p,camera:c,cameras:u.readonly(i),renderer:_,raycaster:u.shallowRef(new P.Raycaster),controls:u.ref(null),extend:j,registerCamera:m,setCameraActive:v,deregisterCamera:g};return u.provide("useTres",k),k}function te(){const e=u.inject("useTres");if(!e)throw new Error("useTresContext must be used together with useTresContextProvider");return e}const _e=te;function Se(e){}let y=null;const{logError:re}=L(),Me={createElement(e,a,t,r){var f,s;if(r||(r={}),r.args||(r.args=[]),e==="template"||fe(e))return null;let n=e.replace("Tres",""),o;if(e==="primitive"){(r==null?void 0:r.object)===void 0&&re("Tres primitives need a prop 'object'");const d=r.object;n=d.type,o=Object.assign(d,{type:n,attach:r.attach,primitive:!0})}else{const d=T.value[n];d||re(`${n} is not defined on the THREE namespace. Use extend to add it to the catalog.`),o=new d(...r.args)}return o.isCamera&&(r!=null&&r.position||o.position.set(3,3,3),r!=null&&r.lookAt||o.lookAt(0,0,0)),(r==null?void 0:r.attach)===void 0&&(o.isMaterial?o.attach="material":o.isBufferGeometry&&(o.attach="geometry")),o.isObject3D&&((f=r==null?void 0:r.material)!=null&&f.isMaterial&&(o.userData.tres__materialViaProp=!0),(s=r==null?void 0:r.geometry)!=null&&s.isBufferGeometry&&(o.userData.tres__geometryViaProp=!0)),o.userData={...o.userData,tres__name:n},o},insert(e,a){var r,n,o,f;a&&a.isScene&&(y=a);const t=a||y;if(e!=null&&e.isObject3D){if(e!=null&&e.isCamera){if(!(y!=null&&y.userData.tres__registerCamera))throw"could not find tres__registerCamera on scene's userData";(n=y==null?void 0:(r=y.userData).tres__registerCamera)==null||n.call(r,e)}if(e!=null&&e.onClick||e!=null&&e.onPointerMove||e!=null&&e.onPointerEnter||e!=null&&e.onPointerLeave){if(!(y!=null&&y.userData.tres__registerAtPointerEventHandler))throw"could not find tres__registerAtPointerEventHandler on scene's userData";(f=y==null?void 0:(o=y.userData).tres__registerAtPointerEventHandler)==null||f.call(o,e)}}e!=null&&e.isObject3D&&(t!=null&&t.isObject3D)?(t.add(e),e.dispatchEvent({type:"added"})):e!=null&&e.isFog?t.fog=e:typeof(e==null?void 0:e.attach)=="string"&&(e.__previousAttach=e[t==null?void 0:t.attach],t&&(t[e.attach]=e))},remove(e){var a,t;if(e){if(e.isObject3D){const r=e,n=l=>{var c,i;const p=l;l.userData.tres__materialViaProp||(c=p.material)==null||c.dispose(),l.userData.tres__geometryViaProp||(i=p.geometry)==null||i.dispose()},o=y==null?void 0:y.userData.tres__deregisterAtPointerEventHandler,f=y==null?void 0:y.userData.tres__deregisterBlockingObjectAtPointerEventHandler,s=l=>{var p,c;if(!f)throw"could not find tres__deregisterBlockingObjectAtPointerEventHandler on scene's userData";if((c=y==null?void 0:(p=y.userData).tres__deregisterBlockingObjectAtPointerEventHandler)==null||c.call(p,l),!o)throw"could not find tres__deregisterAtPointerEventHandler on scene's userData";(l!=null&&l.onClick||l!=null&&l.onPointerMove||l!=null&&l.onPointerEnter||l!=null&&l.onPointerLeave)&&(o==null||o(l))},d=l=>{const p=y==null?void 0:y.userData.tres__deregisterCamera;if(!p)throw"could not find tres__deregisterCamera on scene's userData";l.isCamera&&(p==null||p(l))};r.traverse(l=>{n(l),d(l),s==null||s(l)}),n(r),d(r),s==null||s(r)}(a=e.removeFromParent)==null||a.call(e),(t=e.dispose)==null||t.call(e)}},patchProp(e,a,t,r){var n,o,f,s;if(e){let d=e,l=a;if(e.isObject3D&&l==="blocks-pointer-events"){r||r===""?(o=y==null?void 0:(n=y.userData).tres__registerBlockingObjectAtPointerEventHandler)==null||o.call(n,e):(s=y==null?void 0:(f=y.userData).tres__deregisterBlockingObjectAtPointerEventHandler)==null||s.call(f,e);return}let p=E(l),c=d==null?void 0:d[p];if(l==="args"){const m=e,g=t??[],v=r??[],_=e.userData.tres__name||e.type;_&&g.length&&!ge(g,v)&&(d=Object.assign(m,new T.value[_](...r)));return}if(d.type==="BufferGeometry"){if(l==="args")return;d.setAttribute(E(l),new P.BufferAttribute(...r));return}if(l.includes("-")&&c===void 0){const m=l.split("-");c=m.reduce((g,v)=>g[E(v)],d),l=m.pop(),p=l.toLowerCase(),c!=null&&c.set||(d=m.reduce((g,v)=>g[E(v)],d))}let i=r;if(i===""&&(i=!0),X(c)){Array.isArray(i)?e[p](...i):e[p](i);return}!(c!=null&&c.set)&&!X(c)?d[p]=i:c.constructor===i.constructor&&(c!=null&&c.copy)?c==null||c.copy(i):Array.isArray(i)?c.set(...i):!c.isColor&&c.setScalar?c.setScalar(i):c.set(i)}},parentNode(e){return(e==null?void 0:e.parent)||null},createText:()=>void 0,createComment:()=>void 0,setText:()=>void 0,setElementText:()=>void 0,nextSibling:()=>void 0,querySelector:()=>void 0,setScopeId:()=>void 0,cloneNode:()=>void 0,insertStaticContent:()=>void 0},{render:Ae}=u.createRenderer(Me);j(oe);const ke=["data-scene"],ne=u.defineComponent({__name:"TresCanvas",props:{shadows:{type:Boolean,default:void 0},clearColor:{},toneMapping:{},shadowMapType:{},useLegacyLights:{type:Boolean,default:void 0},outputColorSpace:{},toneMappingExposure:{},camera:{},preset:{},windowSize:{type:Boolean,default:void 0},disableRender:{type:Boolean,default:void 0},context:{},precision:{},alpha:{type:Boolean,default:void 0},premultipliedAlpha:{type:Boolean},antialias:{type:Boolean,default:void 0},stencil:{type:Boolean,default:void 0},preserveDrawingBuffer:{type:Boolean,default:void 0},powerPreference:{},depth:{type:Boolean,default:void 0},logarithmicDepthBuffer:{type:Boolean,default:void 0},failIfMajorPerformanceCaveat:{type:Boolean,default:void 0}},setup(e,{expose:a}){var i;const t=e,{logWarning:r}=L(),n=u.ref(),o=u.shallowRef(new P.Scene);G();const f=u.useSlots(),s=(i=u.getCurrentInstance())==null?void 0:i.appContext.app,d=m=>u.defineComponent({setup(){var v;const g=(v=u.getCurrentInstance())==null?void 0:v.appContext;return g&&(g.app=s),u.provide("useTres",m),u.provide("extend",j),()=>u.h(u.Fragment,null,f!=null&&f.default?f.default():[])}}),l=m=>{const g=d(m);Ae(u.h(g),o.value)},p=u.computed(()=>t.disableRender),c=u.shallowRef(null);return a({context:c}),u.onMounted(()=>{const m=n;c.value=ee({scene:o.value,canvas:m,windowSize:t.windowSize,disableRender:p,rendererOptions:t}),Z({scene:o.value,contextParts:c.value});const{registerCamera:g,camera:v,cameras:_,deregisterCamera:k}=c.value;l(c.value);const D=()=>{const A=new P.PerspectiveCamera(45,window.innerWidth/window.innerHeight,.1,1e3);A.position.set(3,3,3),A.lookAt(0,0,0),g(A);const M=u.watchEffect(()=>{_.value.length>=2&&(A.removeFromParent(),k(A),M==null||M())})};u.watch(()=>t.camera,(A,M)=>{A&&g(A),M&&(M.removeFromParent(),k(M))},{immediate:!0}),v.value||(r("No camera found. Creating a default perspective camera. To have full control over a camera, please add one to the scene."),D())}),(m,g)=>(u.openBlock(),u.createElementBlock("canvas",{ref_key:"canvas",ref:n,"data-scene":o.value.uuid,class:u.normalizeClass(m.$attrs.class),style:u.normalizeStyle({display:"block",width:"100%",height:"100%",position:m.windowSize?"fixed":"relative",top:0,left:0,pointerEvents:"auto",touchAction:"none",...m.$attrs.style})},null,14,ke))}}),be=["TresCanvas","TresLeches","TresScene"],De={template:{compilerOptions:{isCustomElement:e=>e.startsWith("Tres")&&!be.includes(e)||e==="primitive"}}},Oe={install(e){e.component("TresCanvas",ne)}};w.TresCanvas=ne,w.catalogue=T,w.default=Oe,w.extend=j,w.isProd=ue,w.normalizeColor=N,w.normalizeVectorFlexibleParam=ce,w.templateCompilerOptions=De,w.trasverseObjects=Y,w.useCamera=R,w.useLoader=Ce,w.useLogger=L,w.usePointerEventHandler=Z,w.useRaycaster=Q,w.useRenderLoop=G,w.useRenderer=K,w.useSeek=Pe,w.useTexture=he,w.useTres=_e,w.useTresContext=te,w.useTresContextProvider=ee,Object.defineProperties(w,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@tresjs/core",
3
3
  "type": "module",
4
- "version": "3.3.0",
4
+ "version": "3.4.1",
5
5
  "packageManager": "pnpm@8.3.1",
6
6
  "description": "Declarative ThreeJS using Vue Components",
7
7
  "author": "Alvaro Saburido <hola@alvarosaburido.dev> (https://github.com/alvarosabu/)",
@@ -17,7 +17,8 @@
17
17
  "exports": {
18
18
  ".": {
19
19
  "types": "./dist/index.d.ts",
20
- "import": "./dist/tres.js"
20
+ "import": "./dist/tres.js",
21
+ "require": "./dist/tres.umd.cjs"
21
22
  },
22
23
  "./components": {
23
24
  "types": "./dist/components/index.d.ts"
@@ -72,7 +73,7 @@
72
73
  "@release-it/conventional-changelog": "^7.0.0",
73
74
  "@stackblitz/sdk": "^1.9.0",
74
75
  "@tresjs/cientos": "3.1.0",
75
- "@tresjs/eslint-config-vue": "^0.1.1",
76
+ "@tresjs/eslint-config-vue": "^0.2.0",
76
77
  "@types/three": "^0.155.1",
77
78
  "@typescript-eslint/eslint-plugin": "^6.4.1",
78
79
  "@typescript-eslint/parser": "^6.4.1",