@tresjs/core 3.2.1-next.0 → 3.2.1-next.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 +192 -194
- package/dist/tres.umd.cjs +2 -2
- package/package.json +1 -1
package/dist/tres.js
CHANGED
|
@@ -1,31 +1,31 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* name: @tresjs/core
|
|
3
|
-
* version: v3.2.1-next.
|
|
3
|
+
* version: v3.2.1-next.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 h, computed as
|
|
8
|
+
import { ref as h, computed as A, watchEffect as D, onUnmounted as N, shallowRef as F, watch as te, reactive as ue, readonly as le, provide as I, inject as ce, createRenderer as fe, defineComponent as U, useSlots as me, getCurrentInstance as J, onMounted as pe, openBlock as ve, createElementBlock as de, normalizeStyle as ge, h as K, Fragment as ye } from "vue";
|
|
9
9
|
import * as we from "three";
|
|
10
|
-
import { PerspectiveCamera as W, OrthographicCamera as Ce, Camera as _e, Clock as Pe, Vector3 as Ee, Color as R, REVISION as Me, SRGBColorSpace as Ae, ACESFilmicToneMapping as
|
|
11
|
-
import { createEventHook as
|
|
10
|
+
import { PerspectiveCamera as W, OrthographicCamera as Ce, Camera as _e, Clock as Pe, Vector3 as Ee, Color as R, REVISION as Me, SRGBColorSpace as Ae, ACESFilmicToneMapping as be, PCFSoftShadowMap as ke, WebGLRenderer as z, LoadingManager as De, TextureLoader as Oe, Vector2 as xe, Raycaster as he, BufferAttribute as Be, Scene as Le } from "three";
|
|
11
|
+
import { createEventHook as x, useRafFn as Te, toValue as P, unrefElement as Se, useDevicePixelRatio as Re, usePointer as je, useElementBounding as He, useWindowSize as Fe, useElementSize as ze } from "@vueuse/core";
|
|
12
12
|
const Ge = ({ sizes: e, scene: n }) => {
|
|
13
|
-
const t = h([]), r =
|
|
13
|
+
const t = h([]), r = A(
|
|
14
14
|
() => t.value[0]
|
|
15
|
-
), a = (
|
|
16
|
-
t.value.some(({ uuid:
|
|
17
|
-
}, o = (
|
|
18
|
-
t.value = t.value.filter(({ uuid: c }) => c !==
|
|
19
|
-
}, f = (
|
|
20
|
-
const c =
|
|
15
|
+
), a = (s, c = !1) => {
|
|
16
|
+
t.value.some(({ uuid: i }) => i === s.uuid) || (c ? f(s) : t.value.push(s));
|
|
17
|
+
}, o = (s) => {
|
|
18
|
+
t.value = t.value.filter(({ uuid: c }) => c !== s.uuid);
|
|
19
|
+
}, f = (s) => {
|
|
20
|
+
const c = s instanceof _e ? s : t.value.find((m) => m.uuid === s);
|
|
21
21
|
if (!c)
|
|
22
22
|
return;
|
|
23
|
-
const
|
|
24
|
-
t.value = [c, ...
|
|
23
|
+
const i = t.value.filter(({ uuid: m }) => m !== c.uuid);
|
|
24
|
+
t.value = [c, ...i];
|
|
25
25
|
};
|
|
26
26
|
return D(() => {
|
|
27
|
-
e.aspectRatio.value && t.value.forEach((
|
|
28
|
-
|
|
27
|
+
e.aspectRatio.value && t.value.forEach((s) => {
|
|
28
|
+
s instanceof W && (s.aspect = e.aspectRatio.value), (s instanceof W || s instanceof Ce) && s.updateProjectionMatrix();
|
|
29
29
|
});
|
|
30
30
|
}), n.userData.tres__registerCamera = a, n.userData.tres__deregisterCamera = o, N(() => {
|
|
31
31
|
t.value = [];
|
|
@@ -36,16 +36,16 @@ const Ge = ({ sizes: e, scene: n }) => {
|
|
|
36
36
|
deregisterCamera: o,
|
|
37
37
|
setCameraActive: f
|
|
38
38
|
};
|
|
39
|
-
}, re =
|
|
39
|
+
}, re = x(), ne = x(), V = x(), O = new Pe();
|
|
40
40
|
let j = 0, H = 0;
|
|
41
41
|
const { pause: Ie, resume: We, isActive: $e } = Te(
|
|
42
42
|
() => {
|
|
43
|
-
re.trigger({ delta: j, elapsed: H, clock:
|
|
43
|
+
re.trigger({ delta: j, elapsed: H, clock: O }), ne.trigger({ delta: j, elapsed: H, clock: O }), V.trigger({ delta: j, elapsed: H, clock: O });
|
|
44
44
|
},
|
|
45
45
|
{ immediate: !1 }
|
|
46
46
|
);
|
|
47
47
|
V.on(() => {
|
|
48
|
-
j =
|
|
48
|
+
j = O.getDelta(), H = O.getElapsedTime();
|
|
49
49
|
});
|
|
50
50
|
const ae = () => ({
|
|
51
51
|
onBeforeLoop: re.on,
|
|
@@ -112,7 +112,7 @@ const Je = (e, n) => {
|
|
|
112
112
|
function se(e, n) {
|
|
113
113
|
if (Y(e) && Y(n)) {
|
|
114
114
|
const a = e.attributes, o = n.attributes;
|
|
115
|
-
return a.length !== o.length ? !1 : Array.from(a).every(({ name: f, value:
|
|
115
|
+
return a.length !== o.length ? !1 : Array.from(a).every(({ name: f, value: s }) => n.getAttribute(f) === s);
|
|
116
116
|
}
|
|
117
117
|
if (e === n)
|
|
118
118
|
return !0;
|
|
@@ -137,11 +137,11 @@ function Xe(e, n) {
|
|
|
137
137
|
const Ye = Number.parseInt(Me.replace("dev", "")), S = {
|
|
138
138
|
realistic: {
|
|
139
139
|
outputColorSpace: Ae,
|
|
140
|
-
toneMapping:
|
|
140
|
+
toneMapping: be,
|
|
141
141
|
toneMappingExposure: 3,
|
|
142
142
|
shadowMap: {
|
|
143
143
|
enabled: !0,
|
|
144
|
-
type:
|
|
144
|
+
type: ke
|
|
145
145
|
}
|
|
146
146
|
}
|
|
147
147
|
};
|
|
@@ -152,7 +152,7 @@ function Qe({
|
|
|
152
152
|
disableRender: r,
|
|
153
153
|
contextParts: { sizes: a, camera: o }
|
|
154
154
|
}) {
|
|
155
|
-
const f =
|
|
155
|
+
const f = A(() => ({
|
|
156
156
|
alpha: P(t.alpha),
|
|
157
157
|
depth: P(t.depth),
|
|
158
158
|
canvas: Se(n),
|
|
@@ -165,55 +165,55 @@ function Qe({
|
|
|
165
165
|
preserveDrawingBuffer: P(t.preserveDrawingBuffer),
|
|
166
166
|
logarithmicDepthBuffer: P(t.logarithmicDepthBuffer),
|
|
167
167
|
failIfMajorPerformanceCaveat: P(t.failIfMajorPerformanceCaveat)
|
|
168
|
-
})),
|
|
168
|
+
})), s = F(new z(f.value));
|
|
169
169
|
te(f, () => {
|
|
170
|
-
|
|
170
|
+
s.value.dispose(), s.value = new z(f.value);
|
|
171
171
|
}), D(() => {
|
|
172
|
-
|
|
172
|
+
s.value.setSize(a.width.value, a.height.value);
|
|
173
173
|
});
|
|
174
174
|
const { pixelRatio: c } = Re();
|
|
175
175
|
D(() => {
|
|
176
|
-
|
|
176
|
+
s.value.setPixelRatio(c.value);
|
|
177
177
|
});
|
|
178
|
-
const { logError:
|
|
179
|
-
const
|
|
178
|
+
const { logError: i } = B(), u = (() => {
|
|
179
|
+
const v = new z(), C = {
|
|
180
180
|
shadowMap: {
|
|
181
|
-
enabled:
|
|
182
|
-
type:
|
|
181
|
+
enabled: v.shadowMap.enabled,
|
|
182
|
+
type: v.shadowMap.type
|
|
183
183
|
},
|
|
184
|
-
toneMapping:
|
|
185
|
-
toneMappingExposure:
|
|
186
|
-
outputColorSpace:
|
|
184
|
+
toneMapping: v.toneMapping,
|
|
185
|
+
toneMappingExposure: v.toneMappingExposure,
|
|
186
|
+
outputColorSpace: v.outputColorSpace
|
|
187
187
|
};
|
|
188
|
-
return
|
|
188
|
+
return v.dispose(), C;
|
|
189
189
|
})();
|
|
190
190
|
D(() => {
|
|
191
|
-
const
|
|
192
|
-
|
|
193
|
-
const
|
|
194
|
-
const
|
|
195
|
-
if (
|
|
196
|
-
return Q(S[
|
|
191
|
+
const v = P(t.preset);
|
|
192
|
+
v && (v in S || i(`Renderer Preset must be one of these: ${Object.keys(S).join(", ")}`), oe(s.value, S[v]));
|
|
193
|
+
const C = (b, M) => {
|
|
194
|
+
const k = P(b), L = () => {
|
|
195
|
+
if (v)
|
|
196
|
+
return Q(S[v], M);
|
|
197
197
|
};
|
|
198
|
-
if (
|
|
199
|
-
return
|
|
200
|
-
const
|
|
201
|
-
return
|
|
202
|
-
},
|
|
203
|
-
|
|
204
|
-
const
|
|
205
|
-
|
|
206
|
-
|
|
198
|
+
if (k !== void 0)
|
|
199
|
+
return k;
|
|
200
|
+
const d = L();
|
|
201
|
+
return d !== void 0 ? d : Q(u, M);
|
|
202
|
+
}, w = (b, M) => Ke(s.value, M, C(b, M));
|
|
203
|
+
w(t.shadows, "shadowMap.enabled"), w(t.toneMapping, "toneMapping"), w(t.shadowMapType, "shadowMap.type"), Ye < 150 && w(!t.useLegacyLights, "physicallyCorrectLights"), w(t.outputColorSpace, "outputColorSpace"), w(t.toneMappingExposure, "toneMappingExposure");
|
|
204
|
+
const _ = C(t.clearColor, "clearColor");
|
|
205
|
+
_ && s.value.setClearColor(
|
|
206
|
+
_ ? Ne(_) : new R(0)
|
|
207
207
|
// default clear color is not easily/efficiently retrievable from three
|
|
208
208
|
);
|
|
209
209
|
});
|
|
210
|
-
const { pause:
|
|
210
|
+
const { pause: l, resume: g, onLoop: y } = ae();
|
|
211
211
|
return y(() => {
|
|
212
|
-
o.value && !P(r) &&
|
|
213
|
-
}),
|
|
214
|
-
|
|
212
|
+
o.value && !P(r) && s.value.render(e, o.value);
|
|
213
|
+
}), g(), N(() => {
|
|
214
|
+
l(), s.value.dispose(), s.value.forceContextLoss();
|
|
215
215
|
}), {
|
|
216
|
-
renderer:
|
|
216
|
+
renderer: s
|
|
217
217
|
};
|
|
218
218
|
}
|
|
219
219
|
const Z = (e) => typeof e == "function", ie = (e) => !!e && e.constructor === Array;
|
|
@@ -227,24 +227,24 @@ async function dt(e, n, t, r, a) {
|
|
|
227
227
|
const { logError: o } = B(), f = new e();
|
|
228
228
|
a && a(f), t && t(f);
|
|
229
229
|
const c = (Array.isArray(n) ? n : [n]).map(
|
|
230
|
-
(
|
|
230
|
+
(i) => new Promise((m, u) => {
|
|
231
231
|
f.load(
|
|
232
|
-
|
|
233
|
-
(
|
|
234
|
-
|
|
232
|
+
i,
|
|
233
|
+
(l) => {
|
|
234
|
+
l.scene && Object.assign(l, Ze(l.scene)), m(l);
|
|
235
235
|
},
|
|
236
236
|
r,
|
|
237
|
-
(
|
|
237
|
+
(l) => u(o("[useLoader] - Failed to load resource", l))
|
|
238
238
|
);
|
|
239
239
|
})
|
|
240
240
|
);
|
|
241
241
|
return ie(n) ? await Promise.all(c) : await c[0];
|
|
242
242
|
}
|
|
243
243
|
async function gt(e) {
|
|
244
|
-
const n = new De(), t = new
|
|
244
|
+
const n = new De(), t = new Oe(n), r = (a) => new Promise((o, f) => {
|
|
245
245
|
t.load(
|
|
246
246
|
a,
|
|
247
|
-
(
|
|
247
|
+
(s) => o(s),
|
|
248
248
|
() => null,
|
|
249
249
|
() => {
|
|
250
250
|
f(new Error("[useTextures] - Failed to load texture"));
|
|
@@ -259,67 +259,67 @@ async function gt(e) {
|
|
|
259
259
|
map: a,
|
|
260
260
|
displacementMap: o,
|
|
261
261
|
normalMap: f,
|
|
262
|
-
roughnessMap:
|
|
262
|
+
roughnessMap: s,
|
|
263
263
|
metalnessMap: c,
|
|
264
|
-
aoMap:
|
|
264
|
+
aoMap: i,
|
|
265
265
|
alphaMap: m,
|
|
266
|
-
matcap:
|
|
266
|
+
matcap: u
|
|
267
267
|
} = e;
|
|
268
268
|
return {
|
|
269
269
|
map: a ? await r(a) : null,
|
|
270
270
|
displacementMap: o ? await r(o) : null,
|
|
271
271
|
normalMap: f ? await r(f) : null,
|
|
272
|
-
roughnessMap:
|
|
272
|
+
roughnessMap: s ? await r(s) : null,
|
|
273
273
|
metalnessMap: c ? await r(c) : null,
|
|
274
|
-
aoMap:
|
|
274
|
+
aoMap: i ? await r(i) : null,
|
|
275
275
|
alphaMap: m ? await r(m) : null,
|
|
276
|
-
matcap:
|
|
276
|
+
matcap: u ? await r(u) : null
|
|
277
277
|
};
|
|
278
278
|
}
|
|
279
279
|
}
|
|
280
280
|
const et = (e, { renderer: n, camera: t, raycaster: r }) => {
|
|
281
|
-
const a =
|
|
281
|
+
const a = A(() => n.value.domElement), { x: o, y: f } = je({ target: a }), { width: s, height: c, top: i, left: m } = He(a), u = ({ x: d, y: E }) => {
|
|
282
282
|
if (a.value)
|
|
283
283
|
return {
|
|
284
|
-
x: (
|
|
285
|
-
y: -((
|
|
284
|
+
x: (d - m.value) / s.value * 2 - 1,
|
|
285
|
+
y: -((E - i.value) / c.value) * 2 + 1
|
|
286
286
|
};
|
|
287
|
-
},
|
|
287
|
+
}, l = ({ x: d, y: E }) => {
|
|
288
288
|
if (t.value)
|
|
289
|
-
return r.value.setFromCamera(new
|
|
290
|
-
},
|
|
291
|
-
const
|
|
292
|
-
x: (
|
|
293
|
-
y: (
|
|
289
|
+
return r.value.setFromCamera(new xe(d, E), t.value), r.value.intersectObjects(e.value, !1);
|
|
290
|
+
}, g = (d) => {
|
|
291
|
+
const E = u({
|
|
292
|
+
x: (d == null ? void 0 : d.clientX) ?? o.value,
|
|
293
|
+
y: (d == null ? void 0 : d.clientY) ?? f.value
|
|
294
294
|
});
|
|
295
|
-
return
|
|
296
|
-
}, y =
|
|
297
|
-
|
|
298
|
-
},
|
|
299
|
-
|
|
295
|
+
return E ? l(E) || [] : [];
|
|
296
|
+
}, y = A(() => g()), v = x(), C = x(), w = (d, E) => {
|
|
297
|
+
d.trigger({ event: E, intersects: g(E) });
|
|
298
|
+
}, _ = (d) => {
|
|
299
|
+
w(C, d);
|
|
300
300
|
};
|
|
301
|
-
let
|
|
302
|
-
const
|
|
303
|
-
var
|
|
304
|
-
|
|
305
|
-
},
|
|
306
|
-
var
|
|
307
|
-
|
|
308
|
-
}, L = (
|
|
309
|
-
return a.value.addEventListener("pointerup",
|
|
310
|
-
a != null && a.value && (a.value.removeEventListener("pointerup",
|
|
301
|
+
let b;
|
|
302
|
+
const M = (d) => {
|
|
303
|
+
var E;
|
|
304
|
+
b = (E = g(d)[0]) == null ? void 0 : E.object;
|
|
305
|
+
}, k = (d) => {
|
|
306
|
+
var E;
|
|
307
|
+
d instanceof PointerEvent && b === ((E = g(d)[0]) == null ? void 0 : E.object) && w(v, d);
|
|
308
|
+
}, L = (d) => C.trigger({ event: d, intersects: [] });
|
|
309
|
+
return a.value.addEventListener("pointerup", k), a.value.addEventListener("pointerdown", M), a.value.addEventListener("pointermove", _), a.value.addEventListener("pointerleave", L), N(() => {
|
|
310
|
+
a != null && a.value && (a.value.removeEventListener("pointerup", k), a.value.removeEventListener("pointerdown", M), a.value.removeEventListener("pointermove", _), a.value.removeEventListener("pointerleave", L));
|
|
311
311
|
}), {
|
|
312
312
|
intersects: y,
|
|
313
|
-
onClick: (
|
|
314
|
-
onPointerMove: (
|
|
313
|
+
onClick: (d) => v.on(d).off,
|
|
314
|
+
onPointerMove: (d) => C.on(d).off
|
|
315
315
|
};
|
|
316
316
|
};
|
|
317
317
|
function yt() {
|
|
318
318
|
const { logWarning: e } = B();
|
|
319
319
|
function n(r, a, o) {
|
|
320
320
|
let f = null;
|
|
321
|
-
return r.traverse((
|
|
322
|
-
|
|
321
|
+
return r.traverse((s) => {
|
|
322
|
+
s[a] === o && (f = s);
|
|
323
323
|
}), f || e(`Child with ${a} '${o}' not found.`), f;
|
|
324
324
|
}
|
|
325
325
|
function t(r, a) {
|
|
@@ -336,37 +336,37 @@ const tt = ({ scene: e, contextParts: n }) => {
|
|
|
336
336
|
pointerMove: /* @__PURE__ */ new Map(),
|
|
337
337
|
pointerEnter: /* @__PURE__ */ new Map(),
|
|
338
338
|
pointerLeave: /* @__PURE__ */ new Map()
|
|
339
|
-
}), r = h(/* @__PURE__ */ new Set()), a = (
|
|
340
|
-
r.value.add(
|
|
341
|
-
}, o = (
|
|
342
|
-
r.value.delete(
|
|
343
|
-
}, f = (
|
|
344
|
-
Object.values(t).forEach((
|
|
345
|
-
},
|
|
346
|
-
const { onClick:
|
|
347
|
-
|
|
339
|
+
}), r = h(/* @__PURE__ */ new Set()), a = (l) => {
|
|
340
|
+
r.value.add(l);
|
|
341
|
+
}, o = (l) => {
|
|
342
|
+
r.value.delete(l);
|
|
343
|
+
}, f = (l) => {
|
|
344
|
+
Object.values(t).forEach((g) => g.delete(l)), o(l);
|
|
345
|
+
}, s = (l) => {
|
|
346
|
+
const { onClick: g, onPointerMove: y, onPointerEnter: v, onPointerLeave: C } = l;
|
|
347
|
+
g && t.click.set(l, g), y && t.pointerMove.set(l, y), v && t.pointerEnter.set(l, v), C && t.pointerLeave.set(l, C);
|
|
348
348
|
};
|
|
349
|
-
e.userData.tres__registerAtPointerEventHandler =
|
|
350
|
-
const c =
|
|
349
|
+
e.userData.tres__registerAtPointerEventHandler = s, e.userData.tres__deregisterAtPointerEventHandler = f, e.userData.tres__registerBlockingObjectAtPointerEventHandler = a, e.userData.tres__deregisterBlockingObjectAtPointerEventHandler = o;
|
|
350
|
+
const c = A(
|
|
351
351
|
() => Je(
|
|
352
352
|
[
|
|
353
353
|
...Array.from(r.value),
|
|
354
|
-
...Object.values(t).map((
|
|
354
|
+
...Object.values(t).map((l) => Array.from(l.keys())).flat()
|
|
355
355
|
],
|
|
356
|
-
({ uuid:
|
|
356
|
+
({ uuid: l }) => l
|
|
357
357
|
)
|
|
358
|
-
), { onClick:
|
|
359
|
-
|
|
358
|
+
), { onClick: i, onPointerMove: m } = et(c, n);
|
|
359
|
+
i(({ intersects: l, event: g }) => {
|
|
360
360
|
var y;
|
|
361
|
-
|
|
361
|
+
l.length && ((y = t.click.get(l[0].object)) == null || y(l[0], g));
|
|
362
362
|
});
|
|
363
|
-
let
|
|
364
|
-
return m(({ intersects:
|
|
365
|
-
var
|
|
366
|
-
const y = (
|
|
367
|
-
|
|
363
|
+
let u;
|
|
364
|
+
return m(({ intersects: l, event: g }) => {
|
|
365
|
+
var _, b, M, k;
|
|
366
|
+
const y = (_ = l == null ? void 0 : l[0]) == null ? void 0 : _.object, { pointerLeave: v, pointerEnter: C, pointerMove: w } = t;
|
|
367
|
+
u && u !== y && ((b = v.get(u)) == null || b(u, g)), y && (u !== y && ((M = C.get(y)) == null || M(l[0], g)), (k = w.get(y)) == null || k(l[0], g)), u = y || null;
|
|
368
368
|
}), {
|
|
369
|
-
registerObject:
|
|
369
|
+
registerObject: s,
|
|
370
370
|
deregisterObject: f
|
|
371
371
|
};
|
|
372
372
|
}, $ = h({}), q = (e) => Object.assign($.value, e);
|
|
@@ -377,40 +377,40 @@ function rt({
|
|
|
377
377
|
disableRender: r,
|
|
378
378
|
rendererOptions: a
|
|
379
379
|
}) {
|
|
380
|
-
const o =
|
|
380
|
+
const o = A(
|
|
381
381
|
() => P(t) ? Fe() : ze(P(n).parentElement)
|
|
382
|
-
), f =
|
|
383
|
-
height:
|
|
382
|
+
), f = A(() => o.value.width.value), s = A(() => o.value.height.value), c = A(() => f.value / s.value), i = {
|
|
383
|
+
height: s,
|
|
384
384
|
width: f,
|
|
385
385
|
aspectRatio: c
|
|
386
386
|
}, m = F(e), {
|
|
387
|
-
camera:
|
|
388
|
-
cameras:
|
|
389
|
-
registerCamera:
|
|
387
|
+
camera: u,
|
|
388
|
+
cameras: l,
|
|
389
|
+
registerCamera: g,
|
|
390
390
|
deregisterCamera: y,
|
|
391
|
-
setCameraActive:
|
|
392
|
-
} = Ge({ sizes:
|
|
391
|
+
setCameraActive: v
|
|
392
|
+
} = Ge({ sizes: i, scene: e }), { renderer: C } = Qe(
|
|
393
393
|
{
|
|
394
394
|
scene: e,
|
|
395
395
|
canvas: n,
|
|
396
396
|
options: a,
|
|
397
|
-
contextParts: { sizes:
|
|
397
|
+
contextParts: { sizes: i, camera: u },
|
|
398
398
|
disableRender: r
|
|
399
399
|
}
|
|
400
|
-
),
|
|
401
|
-
sizes:
|
|
400
|
+
), w = {
|
|
401
|
+
sizes: i,
|
|
402
402
|
scene: m,
|
|
403
|
-
camera:
|
|
404
|
-
cameras: le(
|
|
405
|
-
renderer:
|
|
403
|
+
camera: u,
|
|
404
|
+
cameras: le(l),
|
|
405
|
+
renderer: C,
|
|
406
406
|
raycaster: F(new he()),
|
|
407
407
|
controls: h(null),
|
|
408
408
|
extend: q,
|
|
409
|
-
registerCamera:
|
|
410
|
-
setCameraActive:
|
|
409
|
+
registerCamera: g,
|
|
410
|
+
setCameraActive: v,
|
|
411
411
|
deregisterCamera: y
|
|
412
412
|
};
|
|
413
|
-
return I("useTres",
|
|
413
|
+
return I("useTres", w), w;
|
|
414
414
|
}
|
|
415
415
|
function nt() {
|
|
416
416
|
const e = ce("useTres");
|
|
@@ -422,7 +422,7 @@ const wt = nt;
|
|
|
422
422
|
let G = null, p = null;
|
|
423
423
|
const { logError: ee } = B(), at = {
|
|
424
424
|
createElement(e, n, t, r) {
|
|
425
|
-
var f,
|
|
425
|
+
var f, s;
|
|
426
426
|
if (r || (r = {}), r.args || (r.args = []), e === "template" || qe(e))
|
|
427
427
|
return null;
|
|
428
428
|
let a = e.replace("Tres", ""), o;
|
|
@@ -434,13 +434,13 @@ const { logError: ee } = B(), at = {
|
|
|
434
434
|
const c = $.value[a];
|
|
435
435
|
c || ee(`${a} is not defined on the THREE namespace. Use extend to add it to the catalog.`), o = new c(...r.args);
|
|
436
436
|
}
|
|
437
|
-
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), (
|
|
437
|
+
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 = {
|
|
438
438
|
...o.userData,
|
|
439
439
|
tres__name: a
|
|
440
440
|
}, o;
|
|
441
441
|
},
|
|
442
442
|
insert(e, n) {
|
|
443
|
-
var t, r, a, o, f,
|
|
443
|
+
var t, r, a, o, f, s, c, i, m;
|
|
444
444
|
if (n && n.isScene && (p = n), (((t = e == null ? void 0 : e.__vnode) == null ? void 0 : t.type) === "TresGroup" || ((r = e == null ? void 0 : e.__vnode) == null ? void 0 : r.type) === "TresObject3D") && n === null && !((o = (a = e == null ? void 0 : e.__vnode) == null ? void 0 : a.ctx) != null && o.asyncResolved)) {
|
|
445
445
|
G = e;
|
|
446
446
|
return;
|
|
@@ -450,12 +450,12 @@ const { logError: ee } = B(), at = {
|
|
|
450
450
|
if (e != null && e.isCamera) {
|
|
451
451
|
if (!(p != null && p.userData.tres__registerCamera))
|
|
452
452
|
throw "could not find tres__registerCamera on scene's userData";
|
|
453
|
-
(c = p == null ? void 0 : (
|
|
453
|
+
(c = p == null ? void 0 : (s = p.userData).tres__registerCamera) == null || c.call(s, e);
|
|
454
454
|
}
|
|
455
455
|
if (e != null && e.onClick || e != null && e.onPointerMove || e != null && e.onPointerEnter || e != null && e.onPointerLeave) {
|
|
456
456
|
if (!(p != null && p.userData.tres__registerAtPointerEventHandler))
|
|
457
457
|
throw "could not find tres__registerAtPointerEventHandler on scene's userData";
|
|
458
|
-
(m = p == null ? void 0 : (
|
|
458
|
+
(m = p == null ? void 0 : (i = p.userData).tres__registerAtPointerEventHandler) == null || m.call(i, e);
|
|
459
459
|
}
|
|
460
460
|
}
|
|
461
461
|
e != null && e.isObject3D && (n != null && n.isObject3D) ? (n.add(e), e.dispatchEvent({ type: "added" })) : e != null && e.isFog ? n.fog = e : typeof (e == null ? void 0 : e.attach) == "string" && (e.__previousAttach = e[n == null ? void 0 : n.attach], n && (n[e.attach] = e));
|
|
@@ -464,63 +464,63 @@ const { logError: ee } = B(), at = {
|
|
|
464
464
|
var n, t;
|
|
465
465
|
if (e) {
|
|
466
466
|
if (e.isObject3D) {
|
|
467
|
-
const r = e, a = (
|
|
468
|
-
var
|
|
469
|
-
const m =
|
|
470
|
-
|
|
471
|
-
}, o = p == null ? void 0 : p.userData.tres__deregisterAtPointerEventHandler, f = p == null ? void 0 : p.userData.tres__deregisterBlockingObjectAtPointerEventHandler,
|
|
472
|
-
var m,
|
|
467
|
+
const r = e, a = (i) => {
|
|
468
|
+
var u, l;
|
|
469
|
+
const m = i;
|
|
470
|
+
i.userData.tres__materialViaProp || (u = m.material) == null || u.dispose(), i.userData.tres__geometryViaProp || (l = m.geometry) == null || l.dispose();
|
|
471
|
+
}, o = p == null ? void 0 : p.userData.tres__deregisterAtPointerEventHandler, f = p == null ? void 0 : p.userData.tres__deregisterBlockingObjectAtPointerEventHandler, s = (i) => {
|
|
472
|
+
var m, u;
|
|
473
473
|
if (!f)
|
|
474
474
|
throw "could not find tres__deregisterBlockingObjectAtPointerEventHandler on scene's userData";
|
|
475
|
-
if ((
|
|
475
|
+
if ((u = p == null ? void 0 : (m = p.userData).tres__deregisterBlockingObjectAtPointerEventHandler) == null || u.call(m, i), !o)
|
|
476
476
|
throw "could not find tres__deregisterAtPointerEventHandler on scene's userData";
|
|
477
|
-
(
|
|
478
|
-
}, c = (
|
|
477
|
+
(i != null && i.onClick || i != null && i.onPointerMove || i != null && i.onPointerEnter || i != null && i.onPointerLeave) && (o == null || o(i));
|
|
478
|
+
}, c = (i) => {
|
|
479
479
|
const m = p == null ? void 0 : p.userData.tres__deregisterCamera;
|
|
480
480
|
if (!m)
|
|
481
481
|
throw "could not find tres__deregisterCamera on scene's userData";
|
|
482
|
-
|
|
482
|
+
i.isCamera && (m == null || m(i));
|
|
483
483
|
};
|
|
484
|
-
r.traverse((
|
|
485
|
-
a(
|
|
486
|
-
}), a(r), c(r),
|
|
484
|
+
r.traverse((i) => {
|
|
485
|
+
a(i), c(i), s == null || s(i);
|
|
486
|
+
}), a(r), c(r), s == null || s(r);
|
|
487
487
|
}
|
|
488
488
|
(n = e.removeFromParent) == null || n.call(e), (t = e.dispose) == null || t.call(e);
|
|
489
489
|
}
|
|
490
490
|
},
|
|
491
491
|
patchProp(e, n, t, r) {
|
|
492
|
-
var a, o, f,
|
|
492
|
+
var a, o, f, s;
|
|
493
493
|
if (e) {
|
|
494
|
-
let c = e,
|
|
495
|
-
if (e.isObject3D &&
|
|
496
|
-
r || r === "" ? (o = p == null ? void 0 : (a = p.userData).tres__registerBlockingObjectAtPointerEventHandler) == null || o.call(a, e) : (
|
|
494
|
+
let c = e, i = n;
|
|
495
|
+
if (e.isObject3D && i === "blocks-pointer-events") {
|
|
496
|
+
r || r === "" ? (o = p == null ? void 0 : (a = p.userData).tres__registerBlockingObjectAtPointerEventHandler) == null || o.call(a, e) : (s = p == null ? void 0 : (f = p.userData).tres__deregisterBlockingObjectAtPointerEventHandler) == null || s.call(f, e);
|
|
497
497
|
return;
|
|
498
498
|
}
|
|
499
|
-
let m = T(
|
|
500
|
-
if (
|
|
501
|
-
const
|
|
502
|
-
|
|
499
|
+
let m = T(i), u = c == null ? void 0 : c[m];
|
|
500
|
+
if (i === "args") {
|
|
501
|
+
const g = e, y = t ?? [], v = r ?? [], C = e.userData.tres__name || e.type;
|
|
502
|
+
C && y.length && !Xe(y, v) && (c = Object.assign(g, new $.value[C](...r)));
|
|
503
503
|
return;
|
|
504
504
|
}
|
|
505
505
|
if (c.type === "BufferGeometry") {
|
|
506
|
-
if (
|
|
506
|
+
if (i === "args")
|
|
507
507
|
return;
|
|
508
508
|
c.setAttribute(
|
|
509
|
-
T(
|
|
509
|
+
T(i),
|
|
510
510
|
new Be(...r)
|
|
511
511
|
);
|
|
512
512
|
return;
|
|
513
513
|
}
|
|
514
|
-
if (
|
|
515
|
-
const
|
|
516
|
-
|
|
514
|
+
if (i.includes("-") && u === void 0) {
|
|
515
|
+
const g = i.split("-");
|
|
516
|
+
u = g.reduce((y, v) => y[T(v)], c), i = g.pop(), m = i.toLowerCase(), u != null && u.set || (c = g.reduce((y, v) => y[T(v)], c));
|
|
517
517
|
}
|
|
518
|
-
let
|
|
519
|
-
if (
|
|
520
|
-
Array.isArray(
|
|
518
|
+
let l = r;
|
|
519
|
+
if (l === "" && (l = !0), Z(u)) {
|
|
520
|
+
Array.isArray(l) ? e[m](...l) : e[m](l);
|
|
521
521
|
return;
|
|
522
522
|
}
|
|
523
|
-
!(
|
|
523
|
+
!(u != null && u.set) && !Z(u) ? c[m] = l : u.constructor === l.constructor && (u != null && u.copy) ? u == null || u.copy(l) : Array.isArray(l) ? u.set(...l) : !u.isColor && u.setScalar ? u.setScalar(l) : u.set(l);
|
|
524
524
|
}
|
|
525
525
|
},
|
|
526
526
|
parentNode(e) {
|
|
@@ -564,54 +564,52 @@ const st = ["data-scene"], it = /* @__PURE__ */ U({
|
|
|
564
564
|
failIfMajorPerformanceCaveat: { type: Boolean, default: void 0 }
|
|
565
565
|
},
|
|
566
566
|
setup(e) {
|
|
567
|
-
var m;
|
|
568
567
|
const n = e, { logWarning: t } = B(), r = h(), a = F(new Le());
|
|
569
568
|
ae();
|
|
570
|
-
const o = me(), f =
|
|
569
|
+
const o = me(), f = J(), s = (m) => U({
|
|
571
570
|
setup() {
|
|
572
|
-
|
|
573
|
-
|
|
574
|
-
return s && (s.app = f), I("useTres", l), I("extend", q), () => K(ye, null, o != null && o.default ? o.default() : []);
|
|
571
|
+
const u = J();
|
|
572
|
+
return Object.assign(u.appContext, f.appContext), Object.assign(u.provides, u.appContext.provides), I("useTres", m), I("extend", q), () => K(ye, null, o != null && o.default ? o.default() : []);
|
|
575
573
|
}
|
|
576
|
-
}), c = (
|
|
577
|
-
const
|
|
578
|
-
ot(K(
|
|
579
|
-
},
|
|
574
|
+
}), c = (m) => {
|
|
575
|
+
const u = s(m);
|
|
576
|
+
ot(K(u), a.value);
|
|
577
|
+
}, i = A(() => n.disableRender);
|
|
580
578
|
return pe(() => {
|
|
581
|
-
const
|
|
579
|
+
const m = r, u = rt({
|
|
582
580
|
scene: a.value,
|
|
583
|
-
canvas:
|
|
581
|
+
canvas: m,
|
|
584
582
|
windowSize: n.windowSize,
|
|
585
|
-
disableRender:
|
|
583
|
+
disableRender: i,
|
|
586
584
|
rendererOptions: n
|
|
587
585
|
});
|
|
588
|
-
tt({ scene: a.value, contextParts:
|
|
589
|
-
const { registerCamera:
|
|
590
|
-
c(
|
|
591
|
-
const
|
|
592
|
-
const
|
|
586
|
+
tt({ scene: a.value, contextParts: u });
|
|
587
|
+
const { registerCamera: l, camera: g, cameras: y, deregisterCamera: v } = u;
|
|
588
|
+
c(u);
|
|
589
|
+
const C = () => {
|
|
590
|
+
const w = new W(
|
|
593
591
|
45,
|
|
594
592
|
window.innerWidth / window.innerHeight,
|
|
595
593
|
0.1,
|
|
596
594
|
1e3
|
|
597
595
|
);
|
|
598
|
-
|
|
596
|
+
w.position.set(3, 3, 3), w.lookAt(0, 0, 0), l(w);
|
|
599
597
|
const _ = D(() => {
|
|
600
|
-
|
|
598
|
+
y.value.length >= 2 && (w.removeFromParent(), v(w), _ == null || _());
|
|
601
599
|
});
|
|
602
600
|
};
|
|
603
601
|
te(
|
|
604
602
|
() => n.camera,
|
|
605
|
-
(
|
|
606
|
-
|
|
603
|
+
(w, _) => {
|
|
604
|
+
w ? l(w) : _ && (_.removeFromParent(), v(_));
|
|
607
605
|
},
|
|
608
606
|
{
|
|
609
607
|
immediate: !0
|
|
610
608
|
}
|
|
611
|
-
),
|
|
609
|
+
), g.value || (t(
|
|
612
610
|
"No camera found. Creating a default perspective camera. To have full control over a camera, please add one to the scene."
|
|
613
|
-
),
|
|
614
|
-
}), (
|
|
611
|
+
), C());
|
|
612
|
+
}), (m, u) => (ve(), de("canvas", {
|
|
615
613
|
ref_key: "canvas",
|
|
616
614
|
ref: r,
|
|
617
615
|
"data-scene": a.value.uuid,
|
|
@@ -619,7 +617,7 @@ const st = ["data-scene"], it = /* @__PURE__ */ U({
|
|
|
619
617
|
display: "block",
|
|
620
618
|
width: "100%",
|
|
621
619
|
height: "100%",
|
|
622
|
-
position:
|
|
620
|
+
position: m.windowSize ? "fixed" : "relative",
|
|
623
621
|
top: 0,
|
|
624
622
|
left: 0,
|
|
625
623
|
pointerEvents: "auto",
|
package/dist/tres.umd.cjs
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* name: @tresjs/core
|
|
3
|
-
* version: v3.2.1-next.
|
|
3
|
+
* version: v3.2.1-next.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(y,c){typeof exports=="object"&&typeof module<"u"?c(exports,require("vue"),require("three"),require("@vueuse/core")):typeof define=="function"&&define.amd?define(["exports","vue","three","@vueuse/core"],c):(y=typeof globalThis<"u"?globalThis:y||self,c(y.tres={},y.Vue,y.Three,y.VueUseCore))})(this,function(y,c,_,w){"use strict";function se(e){const n=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(n,t,r.get?r:{enumerable:!0,get:()=>e[t]})}}return n.default=e,Object.freeze(n)}const ie=se(_),I=({sizes:e,scene:n})=>{const t=c.ref([]),r=c.computed(()=>t.value[0]),a=(i,f=!1)=>{t.value.some(({uuid:l})=>l===i.uuid)||(f?m(i):t.value.push(i))},o=i=>{t.value=t.value.filter(({uuid:f})=>f!==i.uuid)},m=i=>{const f=i instanceof _.Camera?i:t.value.find(d=>d.uuid===i);if(!f)return;const l=t.value.filter(({uuid:d})=>d!==f.uuid);t.value=[f,...l]};return c.watchEffect(()=>{e.aspectRatio.value&&t.value.forEach(i=>{i instanceof _.PerspectiveCamera&&(i.aspect=e.aspectRatio.value),(i instanceof _.PerspectiveCamera||i instanceof _.OrthographicCamera)&&i.updateProjectionMatrix()})}),n.userData.tres__registerCamera=a,n.userData.tres__deregisterCamera=o,c.onUnmounted(()=>{t.value=[]}),{camera:r,cameras:t,registerCamera:a,deregisterCamera:o,setCameraActive:m}},W=w.createEventHook(),N=w.createEventHook(),F=w.createEventHook(),S=new _.Clock;let B=0,x=0;const{pause:le,resume:ue,isActive:ce}=w.useRafFn(()=>{W.trigger({delta:B,elapsed:x,clock:S}),N.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:W.on,onLoop:N.on,onAfterLoop:F.on,pause:le,resume:ue,isActive:ce}),fe=!0,$="[TresJS ▲ ■ ●] ";function L(){function e(r,a){console.error(`${$} ${r}`,a||"")}function n(r){console.warn(`${$} ${r}`)}function t(r,a){}return{logError:e,logWarning:n,logMessage:t}}function me(e){return typeof e=="number"?[e,e,e]:e instanceof _.Vector3?[e.x,e.y,e.z]:e}function q(e){return e instanceof _.Color?e:Array.isArray(e)?new _.Color(...e):new _.Color(e)}const U=(e,n)=>{for(const t of Object.keys(n))n[t]instanceof Object&&Object.assign(n[t],U(e[t],n[t]));return Object.assign(e||{},n),e},de=pe("html,body,base,head,link,meta,style,title,address,article,aside,footer,header,hgroup,h1,h2,h3,h4,h5,h6,nav,section,div,dd,dl,dt,figcaption,figure,picture,hr,img,li,main,ol,p,pre,ul,a,b,abbr,bdi,bdo,br,cite,code,data,dfn,em,i,kbd,mark,q,rp,rt,ruby,s,samp,small,span,strong,sub,sup,time,u,var,wbr,area,audio,map,track,video,embed,object,param,source,canvas,script,noscript,del,ins,caption,col,colgroup,table,thead,tbody,td,th,tr,button,datalist,fieldset,form,input,label,legend,meter,optgroup,option,output,progress,select,textarea,details,dialog,menu,summary,template,blockquote,iframe,tfoot");function H(e){return e&&e.nodeType===1}function j(e){return e.replace(/-([a-z])/g,(n,t)=>t.toUpperCase())}function pe(e,n){const t=Object.create(null),r=e.split(",");for(let a=0;a<r.length;a++)t[r[a]]=!0;return n?a=>!!t[a.toLowerCase()]:a=>!!t[a]}const ge=(e,n)=>{const t=new Set,r=[];for(const a of e){const o=n(a);t.has(o)||(t.add(o),r.push(a))}return r},J=(e,n)=>{if(!n)return;const t=Array.isArray(n)?n:n.match(/([^[.\]])+/g);return t==null?void 0:t.reduce((r,a)=>r&&r[a],e)},ve=(e,n,t)=>{const r=Array.isArray(n)?n:n.match(/([^[.\]])+/g);r&&r.reduce((a,o,m)=>(a[o]===void 0&&(a[o]={}),m===r.length-1&&(a[o]=t),a[o]),e)};function K(e,n){if(H(e)&&H(n)){const a=e.attributes,o=n.attributes;return a.length!==o.length?!1:Array.from(a).every(({name:m,value:i})=>n.getAttribute(m)===i)}if(e===n)return!0;if(e===null||typeof e!="object"||n===null||typeof n!="object")return!1;const t=Object.keys(e),r=Object.keys(n);if(t.length!==r.length)return!1;for(const a of t)if(!r.includes(a)||!K(e[a],n[a]))return!1;return!0}function ye(e,n){if(!Array.isArray(e)||!Array.isArray(n)||e.length!==n.length)return!1;for(let t=0;t<e.length;t++)if(!K(e[t],n[t]))return!1;return!0}const we=Number.parseInt(_.REVISION.replace("dev","")),T={realistic:{outputColorSpace:_.SRGBColorSpace,toneMapping:_.ACESFilmicToneMapping,toneMappingExposure:3,shadowMap:{enabled:!0,type:_.PCFSoftShadowMap}}};function X({scene:e,canvas:n,options:t,disableRender:r,contextParts:{sizes:a,camera:o}}){const m=c.computed(()=>({alpha:w.toValue(t.alpha),depth:w.toValue(t.depth),canvas:w.unrefElement(n),context:w.toValue(t.context),stencil:w.toValue(t.stencil),antialias:w.toValue(t.antialias)===void 0?!0:w.toValue(t.antialias),precision:w.toValue(t.precision),powerPreference:w.toValue(t.powerPreference),premultipliedAlpha:w.toValue(t.premultipliedAlpha),preserveDrawingBuffer:w.toValue(t.preserveDrawingBuffer),logarithmicDepthBuffer:w.toValue(t.logarithmicDepthBuffer),failIfMajorPerformanceCaveat:w.toValue(t.failIfMajorPerformanceCaveat)})),i=c.shallowRef(new _.WebGLRenderer(m.value));c.watch(m,()=>{i.value.dispose(),i.value=new _.WebGLRenderer(m.value)}),c.watchEffect(()=>{i.value.setSize(a.width.value,a.height.value)});const{pixelRatio:f}=w.useDevicePixelRatio();c.watchEffect(()=>{i.value.setPixelRatio(f.value)});const{logError:l}=L(),u=(()=>{const v=new _.WebGLRenderer,M={shadowMap:{enabled:v.shadowMap.enabled,type:v.shadowMap.type},toneMapping:v.toneMapping,toneMappingExposure:v.toneMappingExposure,outputColorSpace:v.outputColorSpace};return v.dispose(),M})();c.watchEffect(()=>{const v=w.toValue(t.preset);v&&(v in T||l(`Renderer Preset must be one of these: ${Object.keys(T).join(", ")}`),U(i.value,T[v]));const M=(k,O)=>{const D=w.toValue(k),z=()=>{if(v)return J(T[v],O)};if(D!==void 0)return D;const C=z();return C!==void 0?C:J(u,O)},h=(k,O)=>ve(i.value,O,M(k,O));h(t.shadows,"shadowMap.enabled"),h(t.toneMapping,"toneMapping"),h(t.shadowMapType,"shadowMap.type"),we<150&&h(!t.useLegacyLights,"physicallyCorrectLights"),h(t.outputColorSpace,"outputColorSpace"),h(t.toneMappingExposure,"toneMappingExposure");const b=M(t.clearColor,"clearColor");b&&i.value.setClearColor(b?q(b):new _.Color(0))});const{pause:s,resume:g,onLoop:P}=G();return P(()=>{o.value&&!w.toValue(r)&&i.value.render(e,o.value)}),g(),c.onUnmounted(()=>{s(),i.value.dispose(),i.value.forceContextLoss()}),{renderer:i}}const Y=e=>typeof e=="function",Q=e=>!!e&&e.constructor===Array;function Z(e){const n={nodes:{},materials:{}};return e&&e.traverse(t=>{t.name&&(n.nodes[t.name]=t),t.material&&!n.materials[t.material.name]&&(n.materials[t.material.name]=t.material)}),n}async function Ce(e,n,t,r,a){const{logError:o}=L(),m=new e;a&&a(m),t&&t(m);const f=(Array.isArray(n)?n:[n]).map(l=>new Promise((d,u)=>{m.load(l,s=>{s.scene&&Object.assign(s,Z(s.scene)),d(s)},r,s=>u(o("[useLoader] - Failed to load resource",s)))}));return Q(n)?await Promise.all(f):await f[0]}async function Pe(e){const n=new _.LoadingManager,t=new _.TextureLoader(n),r=a=>new Promise((o,m)=>{t.load(a,i=>o(i),()=>null,()=>{m(new Error("[useTextures] - Failed to load texture"))})});if(Q(e)){const a=await Promise.all(e.map(o=>r(o)));return e.length>1?a:a[0]}else{const{map:a,displacementMap:o,normalMap:m,roughnessMap:i,metalnessMap:f,aoMap:l,alphaMap:d,matcap:u}=e;return{map:a?await r(a):null,displacementMap:o?await r(o):null,normalMap:m?await r(m):null,roughnessMap:i?await r(i):null,metalnessMap:f?await r(f):null,aoMap:l?await r(l):null,alphaMap:d?await r(d):null,matcap:u?await r(u):null}}}const ee=(e,{renderer:n,camera:t,raycaster:r})=>{const a=c.computed(()=>n.value.domElement),{x:o,y:m}=w.usePointer({target:a}),{width:i,height:f,top:l,left:d}=w.useElementBounding(a),u=({x:C,y:A})=>{if(a.value)return{x:(C-d.value)/i.value*2-1,y:-((A-l.value)/f.value)*2+1}},s=({x:C,y:A})=>{if(t.value)return r.value.setFromCamera(new _.Vector2(C,A),t.value),r.value.intersectObjects(e.value,!1)},g=C=>{const A=u({x:(C==null?void 0:C.clientX)??o.value,y:(C==null?void 0:C.clientY)??m.value});return A?s(A)||[]:[]},P=c.computed(()=>g()),v=w.createEventHook(),M=w.createEventHook(),h=(C,A)=>{C.trigger({event:A,intersects:g(A)})},b=C=>{h(M,C)};let k;const O=C=>{var A;k=(A=g(C)[0])==null?void 0:A.object},D=C=>{var A;C instanceof PointerEvent&&k===((A=g(C)[0])==null?void 0:A.object)&&h(v,C)},z=C=>M.trigger({event:C,intersects:[]});return a.value.addEventListener("pointerup",D),a.value.addEventListener("pointerdown",O),a.value.addEventListener("pointermove",b),a.value.addEventListener("pointerleave",z),c.onUnmounted(()=>{a!=null&&a.value&&(a.value.removeEventListener("pointerup",D),a.value.removeEventListener("pointerdown",O),a.value.removeEventListener("pointermove",b),a.value.removeEventListener("pointerleave",z))}),{intersects:P,onClick:C=>v.on(C).off,onPointerMove:C=>M.on(C).off}};function _e(){const{logWarning:e}=L();function n(r,a,o){let m=null;return r.traverse(i=>{i[a]===o&&(m=i)}),m||e(`Child with ${a} '${o}' not found.`),m}function t(r,a){return n(r,"name",a)}return{seek:n,seekByName:t}}const te=({scene:e,contextParts:n})=>{const t=c.reactive({click:new Map,pointerMove:new Map,pointerEnter:new Map,pointerLeave:new Map}),r=c.ref(new Set),a=s=>{r.value.add(s)},o=s=>{r.value.delete(s)},m=s=>{Object.values(t).forEach(g=>g.delete(s)),o(s)},i=s=>{const{onClick:g,onPointerMove:P,onPointerEnter:v,onPointerLeave:M}=s;g&&t.click.set(s,g),P&&t.pointerMove.set(s,P),v&&t.pointerEnter.set(s,v),M&&t.pointerLeave.set(s,M)};e.userData.tres__registerAtPointerEventHandler=i,e.userData.tres__deregisterAtPointerEventHandler=m,e.userData.tres__registerBlockingObjectAtPointerEventHandler=a,e.userData.tres__deregisterBlockingObjectAtPointerEventHandler=o;const f=c.computed(()=>ge([...Array.from(r.value),...Object.values(t).map(s=>Array.from(s.keys())).flat()],({uuid:s})=>s)),{onClick:l,onPointerMove:d}=ee(f,n);l(({intersects:s,event:g})=>{var P;s.length&&((P=t.click.get(s[0].object))==null||P(s[0],g))});let u;return d(({intersects:s,event:g})=>{var b,k,O,D;const P=(b=s==null?void 0:s[0])==null?void 0:b.object,{pointerLeave:v,pointerEnter:M,pointerMove:h}=t;u&&u!==P&&((k=v.get(u))==null||k(u,g)),P&&(u!==P&&((O=M.get(P))==null||O(s[0],g)),(D=h.get(P))==null||D(s[0],g)),u=P||null}),{registerObject:i,deregisterObject:m}},E=c.ref({}),V=e=>Object.assign(E.value,e);function re({scene:e,canvas:n,windowSize:t,disableRender:r,rendererOptions:a}){const o=c.computed(()=>w.toValue(t)?w.useWindowSize():w.useElementSize(w.toValue(n).parentElement)),m=c.computed(()=>o.value.width.value),i=c.computed(()=>o.value.height.value),f=c.computed(()=>m.value/i.value),l={height:i,width:m,aspectRatio:f},d=c.shallowRef(e),{camera:u,cameras:s,registerCamera:g,deregisterCamera:P,setCameraActive:v}=I({sizes:l,scene:e}),{renderer:M}=X({scene:e,canvas:n,options:a,contextParts:{sizes:l,camera:u},disableRender:r}),h={sizes:l,scene:d,camera:u,cameras:c.readonly(s),renderer:M,raycaster:c.shallowRef(new _.Raycaster),controls:c.ref(null),extend:V,registerCamera:g,setCameraActive:v,deregisterCamera:P};return c.provide("useTres",h),h}function ne(){const e=c.inject("useTres");if(!e)throw new Error("useTresContext must be used together with useTresContextProvider");return e}const Me=ne;function Se(e){}let R=null,p=null;const{logError:ae}=L(),be={createElement(e,n,t,r){var m,i;if(r||(r={}),r.args||(r.args=[]),e==="template"||de(e))return null;let a=e.replace("Tres",""),o;if(e==="primitive"){(r==null?void 0:r.object)===void 0&&ae("Tres primitives need a prop 'object'");const f=r.object;a=f.type,o=Object.assign(f,{type:a,attach:r.attach,primitive:!0})}else{const f=E.value[a];f||ae(`${a} is not defined on the THREE namespace. Use extend to add it to the catalog.`),o=new f(...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&&((m=r==null?void 0:r.material)!=null&&m.isMaterial&&(o.userData.tres__materialViaProp=!0),(i=r==null?void 0:r.geometry)!=null&&i.isBufferGeometry&&(o.userData.tres__geometryViaProp=!0)),o.userData={...o.userData,tres__name:a},o},insert(e,n){var t,r,a,o,m,i,f,l,d;if(n&&n.isScene&&(p=n),(((t=e==null?void 0:e.__vnode)==null?void 0:t.type)==="TresGroup"||((r=e==null?void 0:e.__vnode)==null?void 0:r.type)==="TresObject3D")&&n===null&&!((o=(a=e==null?void 0:e.__vnode)==null?void 0:a.ctx)!=null&&o.asyncResolved)){R=e;return}else(m=e==null?void 0:e.__vnode)!=null&&m.type.includes("Controls")&&n===null&&(R=p);if(n||(n=R),e!=null&&e.isObject3D){if(e!=null&&e.isCamera){if(!(p!=null&&p.userData.tres__registerCamera))throw"could not find tres__registerCamera on scene's userData";(f=p==null?void 0:(i=p.userData).tres__registerCamera)==null||f.call(i,e)}if(e!=null&&e.onClick||e!=null&&e.onPointerMove||e!=null&&e.onPointerEnter||e!=null&&e.onPointerLeave){if(!(p!=null&&p.userData.tres__registerAtPointerEventHandler))throw"could not find tres__registerAtPointerEventHandler on scene's userData";(d=p==null?void 0:(l=p.userData).tres__registerAtPointerEventHandler)==null||d.call(l,e)}}e!=null&&e.isObject3D&&(n!=null&&n.isObject3D)?(n.add(e),e.dispatchEvent({type:"added"})):e!=null&&e.isFog?n.fog=e:typeof(e==null?void 0:e.attach)=="string"&&(e.__previousAttach=e[n==null?void 0:n.attach],n&&(n[e.attach]=e))},remove(e){var n,t;if(e){if(e.isObject3D){const r=e,a=l=>{var u,s;const d=l;l.userData.tres__materialViaProp||(u=d.material)==null||u.dispose(),l.userData.tres__geometryViaProp||(s=d.geometry)==null||s.dispose()},o=p==null?void 0:p.userData.tres__deregisterAtPointerEventHandler,m=p==null?void 0:p.userData.tres__deregisterBlockingObjectAtPointerEventHandler,i=l=>{var d,u;if(!m)throw"could not find tres__deregisterBlockingObjectAtPointerEventHandler on scene's userData";if((u=p==null?void 0:(d=p.userData).tres__deregisterBlockingObjectAtPointerEventHandler)==null||u.call(d,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))},f=l=>{const d=p==null?void 0:p.userData.tres__deregisterCamera;if(!d)throw"could not find tres__deregisterCamera on scene's userData";l.isCamera&&(d==null||d(l))};r.traverse(l=>{a(l),f(l),i==null||i(l)}),a(r),f(r),i==null||i(r)}(n=e.removeFromParent)==null||n.call(e),(t=e.dispose)==null||t.call(e)}},patchProp(e,n,t,r){var a,o,m,i;if(e){let f=e,l=n;if(e.isObject3D&&l==="blocks-pointer-events"){r||r===""?(o=p==null?void 0:(a=p.userData).tres__registerBlockingObjectAtPointerEventHandler)==null||o.call(a,e):(i=p==null?void 0:(m=p.userData).tres__deregisterBlockingObjectAtPointerEventHandler)==null||i.call(m,e);return}let d=j(l),u=f==null?void 0:f[d];if(l==="args"){const g=e,P=t??[],v=r??[],M=e.userData.tres__name||e.type;M&&P.length&&!ye(P,v)&&(f=Object.assign(g,new E.value[M](...r)));return}if(f.type==="BufferGeometry"){if(l==="args")return;f.setAttribute(j(l),new _.BufferAttribute(...r));return}if(l.includes("-")&&u===void 0){const g=l.split("-");u=g.reduce((P,v)=>P[j(v)],f),l=g.pop(),d=l.toLowerCase(),u!=null&&u.set||(f=g.reduce((P,v)=>P[j(v)],f))}let s=r;if(s===""&&(s=!0),Y(u)){Array.isArray(s)?e[d](...s):e[d](s);return}!(u!=null&&u.set)&&!Y(u)?f[d]=s:u.constructor===s.constructor&&(u!=null&&u.copy)?u==null||u.copy(s):Array.isArray(s)?u.set(...s):!u.isColor&&u.setScalar?u.setScalar(s):u.set(s)}},parentNode(e){return(e==null?void 0:e.parent)||null},createText:()=>void 0,createComment:()=>void 0,setText:()=>void 0,setElementText:()=>void 0,nextSibling:()=>void 0,querySelector:()=>void 0,setScopeId:()=>void 0,cloneNode:()=>void 0,insertStaticContent:()=>void 0},{render:ke}=c.createRenderer(be);V(ie);const he=["data-scene"],oe=c.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){var d;const n=e,{logWarning:t}=L(),r=c.ref(),a=c.shallowRef(new _.Scene);G();const o=c.useSlots(),m=(d=c.getCurrentInstance())==null?void 0:d.appContext.app,i=u=>c.defineComponent({setup(){var g;const s=(g=c.getCurrentInstance())==null?void 0:g.appContext;return s&&(s.app=m),c.provide("useTres",u),c.provide("extend",V),()=>c.h(c.Fragment,null,o!=null&&o.default?o.default():[])}}),f=u=>{const s=i(u);ke(c.h(s),a.value)},l=c.computed(()=>n.disableRender);return c.onMounted(()=>{const u=r,s=re({scene:a.value,canvas:u,windowSize:n.windowSize,disableRender:l,rendererOptions:n});te({scene:a.value,contextParts:s});const{registerCamera:g,camera:P,cameras:v,deregisterCamera:M}=s;f(s);const h=()=>{const b=new _.PerspectiveCamera(45,window.innerWidth/window.innerHeight,.1,1e3);b.position.set(3,3,3),b.lookAt(0,0,0),g(b);const k=c.watchEffect(()=>{v.value.length>=2&&(b.removeFromParent(),M(b),k==null||k())})};c.watch(()=>n.camera,(b,k)=>{b?g(b):k&&(k.removeFromParent(),M(k))},{immediate:!0}),P.value||(t("No camera found. Creating a default perspective camera. To have full control over a camera, please add one to the scene."),h())}),(u,s)=>(c.openBlock(),c.createElementBlock("canvas",{ref_key:"canvas",ref:r,"data-scene":a.value.uuid,style:c.normalizeStyle({display:"block",width:"100%",height:"100%",position:u.windowSize?"fixed":"relative",top:0,left:0,pointerEvents:"auto",touchAction:"none"})},null,12,he))}}),Ae=["TresCanvas","TresLeches","TresScene"],Oe={template:{compilerOptions:{isCustomElement:e=>e.startsWith("Tres")&&!Ae.includes(e)||e==="primitive"}}},De={install(e){e.component("TresCanvas",oe)}};y.TresCanvas=oe,y.catalogue=E,y.default=De,y.extend=V,y.isProd=fe,y.normalizeColor=q,y.normalizeVectorFlexibleParam=me,y.templateCompilerOptions=Oe,y.trasverseObjects=Z,y.useCamera=I,y.useLoader=Ce,y.useLogger=L,y.usePointerEventHandler=te,y.useRaycaster=ee,y.useRenderLoop=G,y.useRenderer=X,y.useSeek=_e,y.useTexture=Pe,y.useTres=Me,y.useTresContext=ne,y.useTresContextProvider=re,Object.defineProperties(y,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});
|
|
8
|
+
(function(v,c){typeof exports=="object"&&typeof module<"u"?c(exports,require("vue"),require("three"),require("@vueuse/core")):typeof define=="function"&&define.amd?define(["exports","vue","three","@vueuse/core"],c):(v=typeof globalThis<"u"?globalThis:v||self,c(v.tres={},v.Vue,v.Three,v.VueUseCore))})(this,function(v,c,_,y){"use strict";function se(e){const n=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(n,t,r.get?r:{enumerable:!0,get:()=>e[t]})}}return n.default=e,Object.freeze(n)}const ie=se(_),I=({sizes:e,scene:n})=>{const t=c.ref([]),r=c.computed(()=>t.value[0]),a=(s,f=!1)=>{t.value.some(({uuid:i})=>i===s.uuid)||(f?m(s):t.value.push(s))},o=s=>{t.value=t.value.filter(({uuid:f})=>f!==s.uuid)},m=s=>{const f=s instanceof _.Camera?s:t.value.find(d=>d.uuid===s);if(!f)return;const i=t.value.filter(({uuid:d})=>d!==f.uuid);t.value=[f,...i]};return c.watchEffect(()=>{e.aspectRatio.value&&t.value.forEach(s=>{s instanceof _.PerspectiveCamera&&(s.aspect=e.aspectRatio.value),(s instanceof _.PerspectiveCamera||s instanceof _.OrthographicCamera)&&s.updateProjectionMatrix()})}),n.userData.tres__registerCamera=a,n.userData.tres__deregisterCamera=o,c.onUnmounted(()=>{t.value=[]}),{camera:r,cameras:t,registerCamera:a,deregisterCamera:o,setCameraActive:m}},W=y.createEventHook(),N=y.createEventHook(),F=y.createEventHook(),S=new _.Clock;let B=0,x=0;const{pause:le,resume:ue,isActive:ce}=y.useRafFn(()=>{W.trigger({delta:B,elapsed:x,clock:S}),N.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:W.on,onLoop:N.on,onAfterLoop:F.on,pause:le,resume:ue,isActive:ce}),fe=!0,$="[TresJS ▲ ■ ●] ";function L(){function e(r,a){console.error(`${$} ${r}`,a||"")}function n(r){console.warn(`${$} ${r}`)}function t(r,a){}return{logError:e,logWarning:n,logMessage:t}}function me(e){return typeof e=="number"?[e,e,e]:e instanceof _.Vector3?[e.x,e.y,e.z]:e}function q(e){return e instanceof _.Color?e:Array.isArray(e)?new _.Color(...e):new _.Color(e)}const U=(e,n)=>{for(const t of Object.keys(n))n[t]instanceof Object&&Object.assign(n[t],U(e[t],n[t]));return Object.assign(e||{},n),e},de=pe("html,body,base,head,link,meta,style,title,address,article,aside,footer,header,hgroup,h1,h2,h3,h4,h5,h6,nav,section,div,dd,dl,dt,figcaption,figure,picture,hr,img,li,main,ol,p,pre,ul,a,b,abbr,bdi,bdo,br,cite,code,data,dfn,em,i,kbd,mark,q,rp,rt,ruby,s,samp,small,span,strong,sub,sup,time,u,var,wbr,area,audio,map,track,video,embed,object,param,source,canvas,script,noscript,del,ins,caption,col,colgroup,table,thead,tbody,td,th,tr,button,datalist,fieldset,form,input,label,legend,meter,optgroup,option,output,progress,select,textarea,details,dialog,menu,summary,template,blockquote,iframe,tfoot");function H(e){return e&&e.nodeType===1}function j(e){return e.replace(/-([a-z])/g,(n,t)=>t.toUpperCase())}function pe(e,n){const t=Object.create(null),r=e.split(",");for(let a=0;a<r.length;a++)t[r[a]]=!0;return n?a=>!!t[a.toLowerCase()]:a=>!!t[a]}const ge=(e,n)=>{const t=new Set,r=[];for(const a of e){const o=n(a);t.has(o)||(t.add(o),r.push(a))}return r},J=(e,n)=>{if(!n)return;const t=Array.isArray(n)?n:n.match(/([^[.\]])+/g);return t==null?void 0:t.reduce((r,a)=>r&&r[a],e)},ve=(e,n,t)=>{const r=Array.isArray(n)?n:n.match(/([^[.\]])+/g);r&&r.reduce((a,o,m)=>(a[o]===void 0&&(a[o]={}),m===r.length-1&&(a[o]=t),a[o]),e)};function K(e,n){if(H(e)&&H(n)){const a=e.attributes,o=n.attributes;return a.length!==o.length?!1:Array.from(a).every(({name:m,value:s})=>n.getAttribute(m)===s)}if(e===n)return!0;if(e===null||typeof e!="object"||n===null||typeof n!="object")return!1;const t=Object.keys(e),r=Object.keys(n);if(t.length!==r.length)return!1;for(const a of t)if(!r.includes(a)||!K(e[a],n[a]))return!1;return!0}function ye(e,n){if(!Array.isArray(e)||!Array.isArray(n)||e.length!==n.length)return!1;for(let t=0;t<e.length;t++)if(!K(e[t],n[t]))return!1;return!0}const we=Number.parseInt(_.REVISION.replace("dev","")),T={realistic:{outputColorSpace:_.SRGBColorSpace,toneMapping:_.ACESFilmicToneMapping,toneMappingExposure:3,shadowMap:{enabled:!0,type:_.PCFSoftShadowMap}}};function X({scene:e,canvas:n,options:t,disableRender:r,contextParts:{sizes:a,camera:o}}){const m=c.computed(()=>({alpha:y.toValue(t.alpha),depth:y.toValue(t.depth),canvas:y.unrefElement(n),context:y.toValue(t.context),stencil:y.toValue(t.stencil),antialias:y.toValue(t.antialias)===void 0?!0:y.toValue(t.antialias),precision:y.toValue(t.precision),powerPreference:y.toValue(t.powerPreference),premultipliedAlpha:y.toValue(t.premultipliedAlpha),preserveDrawingBuffer:y.toValue(t.preserveDrawingBuffer),logarithmicDepthBuffer:y.toValue(t.logarithmicDepthBuffer),failIfMajorPerformanceCaveat:y.toValue(t.failIfMajorPerformanceCaveat)})),s=c.shallowRef(new _.WebGLRenderer(m.value));c.watch(m,()=>{s.value.dispose(),s.value=new _.WebGLRenderer(m.value)}),c.watchEffect(()=>{s.value.setSize(a.width.value,a.height.value)});const{pixelRatio:f}=y.useDevicePixelRatio();c.watchEffect(()=>{s.value.setPixelRatio(f.value)});const{logError:i}=L(),l=(()=>{const g=new _.WebGLRenderer,b={shadowMap:{enabled:g.shadowMap.enabled,type:g.shadowMap.type},toneMapping:g.toneMapping,toneMappingExposure:g.toneMappingExposure,outputColorSpace:g.outputColorSpace};return g.dispose(),b})();c.watchEffect(()=>{const g=y.toValue(t.preset);g&&(g in T||i(`Renderer Preset must be one of these: ${Object.keys(T).join(", ")}`),U(s.value,T[g]));const b=(A,O)=>{const D=y.toValue(A),z=()=>{if(g)return J(T[g],O)};if(D!==void 0)return D;const w=z();return w!==void 0?w:J(l,O)},M=(A,O)=>ve(s.value,O,b(A,O));M(t.shadows,"shadowMap.enabled"),M(t.toneMapping,"toneMapping"),M(t.shadowMapType,"shadowMap.type"),we<150&&M(!t.useLegacyLights,"physicallyCorrectLights"),M(t.outputColorSpace,"outputColorSpace"),M(t.toneMappingExposure,"toneMappingExposure");const k=b(t.clearColor,"clearColor");k&&s.value.setClearColor(k?q(k):new _.Color(0))});const{pause:u,resume:C,onLoop:P}=G();return P(()=>{o.value&&!y.toValue(r)&&s.value.render(e,o.value)}),C(),c.onUnmounted(()=>{u(),s.value.dispose(),s.value.forceContextLoss()}),{renderer:s}}const Y=e=>typeof e=="function",Q=e=>!!e&&e.constructor===Array;function Z(e){const n={nodes:{},materials:{}};return e&&e.traverse(t=>{t.name&&(n.nodes[t.name]=t),t.material&&!n.materials[t.material.name]&&(n.materials[t.material.name]=t.material)}),n}async function Ce(e,n,t,r,a){const{logError:o}=L(),m=new e;a&&a(m),t&&t(m);const f=(Array.isArray(n)?n:[n]).map(i=>new Promise((d,l)=>{m.load(i,u=>{u.scene&&Object.assign(u,Z(u.scene)),d(u)},r,u=>l(o("[useLoader] - Failed to load resource",u)))}));return Q(n)?await Promise.all(f):await f[0]}async function Pe(e){const n=new _.LoadingManager,t=new _.TextureLoader(n),r=a=>new Promise((o,m)=>{t.load(a,s=>o(s),()=>null,()=>{m(new Error("[useTextures] - Failed to load texture"))})});if(Q(e)){const a=await Promise.all(e.map(o=>r(o)));return e.length>1?a:a[0]}else{const{map:a,displacementMap:o,normalMap:m,roughnessMap:s,metalnessMap:f,aoMap:i,alphaMap:d,matcap:l}=e;return{map:a?await r(a):null,displacementMap:o?await r(o):null,normalMap:m?await r(m):null,roughnessMap:s?await r(s):null,metalnessMap:f?await r(f):null,aoMap:i?await r(i):null,alphaMap:d?await r(d):null,matcap:l?await r(l):null}}}const ee=(e,{renderer:n,camera:t,raycaster:r})=>{const a=c.computed(()=>n.value.domElement),{x:o,y:m}=y.usePointer({target:a}),{width:s,height:f,top:i,left:d}=y.useElementBounding(a),l=({x:w,y:h})=>{if(a.value)return{x:(w-d.value)/s.value*2-1,y:-((h-i.value)/f.value)*2+1}},u=({x:w,y:h})=>{if(t.value)return r.value.setFromCamera(new _.Vector2(w,h),t.value),r.value.intersectObjects(e.value,!1)},C=w=>{const h=l({x:(w==null?void 0:w.clientX)??o.value,y:(w==null?void 0:w.clientY)??m.value});return h?u(h)||[]:[]},P=c.computed(()=>C()),g=y.createEventHook(),b=y.createEventHook(),M=(w,h)=>{w.trigger({event:h,intersects:C(h)})},k=w=>{M(b,w)};let A;const O=w=>{var h;A=(h=C(w)[0])==null?void 0:h.object},D=w=>{var h;w instanceof PointerEvent&&A===((h=C(w)[0])==null?void 0:h.object)&&M(g,w)},z=w=>b.trigger({event:w,intersects:[]});return a.value.addEventListener("pointerup",D),a.value.addEventListener("pointerdown",O),a.value.addEventListener("pointermove",k),a.value.addEventListener("pointerleave",z),c.onUnmounted(()=>{a!=null&&a.value&&(a.value.removeEventListener("pointerup",D),a.value.removeEventListener("pointerdown",O),a.value.removeEventListener("pointermove",k),a.value.removeEventListener("pointerleave",z))}),{intersects:P,onClick:w=>g.on(w).off,onPointerMove:w=>b.on(w).off}};function _e(){const{logWarning:e}=L();function n(r,a,o){let m=null;return r.traverse(s=>{s[a]===o&&(m=s)}),m||e(`Child with ${a} '${o}' not found.`),m}function t(r,a){return n(r,"name",a)}return{seek:n,seekByName:t}}const te=({scene:e,contextParts:n})=>{const t=c.reactive({click:new Map,pointerMove:new Map,pointerEnter:new Map,pointerLeave:new Map}),r=c.ref(new Set),a=u=>{r.value.add(u)},o=u=>{r.value.delete(u)},m=u=>{Object.values(t).forEach(C=>C.delete(u)),o(u)},s=u=>{const{onClick:C,onPointerMove:P,onPointerEnter:g,onPointerLeave:b}=u;C&&t.click.set(u,C),P&&t.pointerMove.set(u,P),g&&t.pointerEnter.set(u,g),b&&t.pointerLeave.set(u,b)};e.userData.tres__registerAtPointerEventHandler=s,e.userData.tres__deregisterAtPointerEventHandler=m,e.userData.tres__registerBlockingObjectAtPointerEventHandler=a,e.userData.tres__deregisterBlockingObjectAtPointerEventHandler=o;const f=c.computed(()=>ge([...Array.from(r.value),...Object.values(t).map(u=>Array.from(u.keys())).flat()],({uuid:u})=>u)),{onClick:i,onPointerMove:d}=ee(f,n);i(({intersects:u,event:C})=>{var P;u.length&&((P=t.click.get(u[0].object))==null||P(u[0],C))});let l;return d(({intersects:u,event:C})=>{var k,A,O,D;const P=(k=u==null?void 0:u[0])==null?void 0:k.object,{pointerLeave:g,pointerEnter:b,pointerMove:M}=t;l&&l!==P&&((A=g.get(l))==null||A(l,C)),P&&(l!==P&&((O=b.get(P))==null||O(u[0],C)),(D=M.get(P))==null||D(u[0],C)),l=P||null}),{registerObject:s,deregisterObject:m}},E=c.ref({}),V=e=>Object.assign(E.value,e);function re({scene:e,canvas:n,windowSize:t,disableRender:r,rendererOptions:a}){const o=c.computed(()=>y.toValue(t)?y.useWindowSize():y.useElementSize(y.toValue(n).parentElement)),m=c.computed(()=>o.value.width.value),s=c.computed(()=>o.value.height.value),f=c.computed(()=>m.value/s.value),i={height:s,width:m,aspectRatio:f},d=c.shallowRef(e),{camera:l,cameras:u,registerCamera:C,deregisterCamera:P,setCameraActive:g}=I({sizes:i,scene:e}),{renderer:b}=X({scene:e,canvas:n,options:a,contextParts:{sizes:i,camera:l},disableRender:r}),M={sizes:i,scene:d,camera:l,cameras:c.readonly(u),renderer:b,raycaster:c.shallowRef(new _.Raycaster),controls:c.ref(null),extend:V,registerCamera:C,setCameraActive:g,deregisterCamera:P};return c.provide("useTres",M),M}function ne(){const e=c.inject("useTres");if(!e)throw new Error("useTresContext must be used together with useTresContextProvider");return e}const Me=ne;function Se(e){}let R=null,p=null;const{logError:ae}=L(),be={createElement(e,n,t,r){var m,s;if(r||(r={}),r.args||(r.args=[]),e==="template"||de(e))return null;let a=e.replace("Tres",""),o;if(e==="primitive"){(r==null?void 0:r.object)===void 0&&ae("Tres primitives need a prop 'object'");const f=r.object;a=f.type,o=Object.assign(f,{type:a,attach:r.attach,primitive:!0})}else{const f=E.value[a];f||ae(`${a} is not defined on the THREE namespace. Use extend to add it to the catalog.`),o=new f(...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&&((m=r==null?void 0:r.material)!=null&&m.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:a},o},insert(e,n){var t,r,a,o,m,s,f,i,d;if(n&&n.isScene&&(p=n),(((t=e==null?void 0:e.__vnode)==null?void 0:t.type)==="TresGroup"||((r=e==null?void 0:e.__vnode)==null?void 0:r.type)==="TresObject3D")&&n===null&&!((o=(a=e==null?void 0:e.__vnode)==null?void 0:a.ctx)!=null&&o.asyncResolved)){R=e;return}else(m=e==null?void 0:e.__vnode)!=null&&m.type.includes("Controls")&&n===null&&(R=p);if(n||(n=R),e!=null&&e.isObject3D){if(e!=null&&e.isCamera){if(!(p!=null&&p.userData.tres__registerCamera))throw"could not find tres__registerCamera on scene's userData";(f=p==null?void 0:(s=p.userData).tres__registerCamera)==null||f.call(s,e)}if(e!=null&&e.onClick||e!=null&&e.onPointerMove||e!=null&&e.onPointerEnter||e!=null&&e.onPointerLeave){if(!(p!=null&&p.userData.tres__registerAtPointerEventHandler))throw"could not find tres__registerAtPointerEventHandler on scene's userData";(d=p==null?void 0:(i=p.userData).tres__registerAtPointerEventHandler)==null||d.call(i,e)}}e!=null&&e.isObject3D&&(n!=null&&n.isObject3D)?(n.add(e),e.dispatchEvent({type:"added"})):e!=null&&e.isFog?n.fog=e:typeof(e==null?void 0:e.attach)=="string"&&(e.__previousAttach=e[n==null?void 0:n.attach],n&&(n[e.attach]=e))},remove(e){var n,t;if(e){if(e.isObject3D){const r=e,a=i=>{var l,u;const d=i;i.userData.tres__materialViaProp||(l=d.material)==null||l.dispose(),i.userData.tres__geometryViaProp||(u=d.geometry)==null||u.dispose()},o=p==null?void 0:p.userData.tres__deregisterAtPointerEventHandler,m=p==null?void 0:p.userData.tres__deregisterBlockingObjectAtPointerEventHandler,s=i=>{var d,l;if(!m)throw"could not find tres__deregisterBlockingObjectAtPointerEventHandler on scene's userData";if((l=p==null?void 0:(d=p.userData).tres__deregisterBlockingObjectAtPointerEventHandler)==null||l.call(d,i),!o)throw"could not find tres__deregisterAtPointerEventHandler on scene's userData";(i!=null&&i.onClick||i!=null&&i.onPointerMove||i!=null&&i.onPointerEnter||i!=null&&i.onPointerLeave)&&(o==null||o(i))},f=i=>{const d=p==null?void 0:p.userData.tres__deregisterCamera;if(!d)throw"could not find tres__deregisterCamera on scene's userData";i.isCamera&&(d==null||d(i))};r.traverse(i=>{a(i),f(i),s==null||s(i)}),a(r),f(r),s==null||s(r)}(n=e.removeFromParent)==null||n.call(e),(t=e.dispose)==null||t.call(e)}},patchProp(e,n,t,r){var a,o,m,s;if(e){let f=e,i=n;if(e.isObject3D&&i==="blocks-pointer-events"){r||r===""?(o=p==null?void 0:(a=p.userData).tres__registerBlockingObjectAtPointerEventHandler)==null||o.call(a,e):(s=p==null?void 0:(m=p.userData).tres__deregisterBlockingObjectAtPointerEventHandler)==null||s.call(m,e);return}let d=j(i),l=f==null?void 0:f[d];if(i==="args"){const C=e,P=t??[],g=r??[],b=e.userData.tres__name||e.type;b&&P.length&&!ye(P,g)&&(f=Object.assign(C,new E.value[b](...r)));return}if(f.type==="BufferGeometry"){if(i==="args")return;f.setAttribute(j(i),new _.BufferAttribute(...r));return}if(i.includes("-")&&l===void 0){const C=i.split("-");l=C.reduce((P,g)=>P[j(g)],f),i=C.pop(),d=i.toLowerCase(),l!=null&&l.set||(f=C.reduce((P,g)=>P[j(g)],f))}let u=r;if(u===""&&(u=!0),Y(l)){Array.isArray(u)?e[d](...u):e[d](u);return}!(l!=null&&l.set)&&!Y(l)?f[d]=u:l.constructor===u.constructor&&(l!=null&&l.copy)?l==null||l.copy(u):Array.isArray(u)?l.set(...u):!l.isColor&&l.setScalar?l.setScalar(u):l.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},{render:ke}=c.createRenderer(be);V(ie);const he=["data-scene"],oe=c.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){const n=e,{logWarning:t}=L(),r=c.ref(),a=c.shallowRef(new _.Scene);G();const o=c.useSlots(),m=c.getCurrentInstance(),s=d=>c.defineComponent({setup(){const l=c.getCurrentInstance();return Object.assign(l.appContext,m.appContext),Object.assign(l.provides,l.appContext.provides),c.provide("useTres",d),c.provide("extend",V),()=>c.h(c.Fragment,null,o!=null&&o.default?o.default():[])}}),f=d=>{const l=s(d);ke(c.h(l),a.value)},i=c.computed(()=>n.disableRender);return c.onMounted(()=>{const d=r,l=re({scene:a.value,canvas:d,windowSize:n.windowSize,disableRender:i,rendererOptions:n});te({scene:a.value,contextParts:l});const{registerCamera:u,camera:C,cameras:P,deregisterCamera:g}=l;f(l);const b=()=>{const M=new _.PerspectiveCamera(45,window.innerWidth/window.innerHeight,.1,1e3);M.position.set(3,3,3),M.lookAt(0,0,0),u(M);const k=c.watchEffect(()=>{P.value.length>=2&&(M.removeFromParent(),g(M),k==null||k())})};c.watch(()=>n.camera,(M,k)=>{M?u(M):k&&(k.removeFromParent(),g(k))},{immediate:!0}),C.value||(t("No camera found. Creating a default perspective camera. To have full control over a camera, please add one to the scene."),b())}),(d,l)=>(c.openBlock(),c.createElementBlock("canvas",{ref_key:"canvas",ref:r,"data-scene":a.value.uuid,style:c.normalizeStyle({display:"block",width:"100%",height:"100%",position:d.windowSize?"fixed":"relative",top:0,left:0,pointerEvents:"auto",touchAction:"none"})},null,12,he))}}),Oe=["TresCanvas","TresLeches","TresScene"],Ae={template:{compilerOptions:{isCustomElement:e=>e.startsWith("Tres")&&!Oe.includes(e)||e==="primitive"}}},De={install(e){e.component("TresCanvas",oe)}};v.TresCanvas=oe,v.catalogue=E,v.default=De,v.extend=V,v.isProd=fe,v.normalizeColor=q,v.normalizeVectorFlexibleParam=me,v.templateCompilerOptions=Ae,v.trasverseObjects=Z,v.useCamera=I,v.useLoader=Ce,v.useLogger=L,v.usePointerEventHandler=te,v.useRaycaster=ee,v.useRenderLoop=G,v.useRenderer=X,v.useSeek=_e,v.useTexture=Pe,v.useTres=Me,v.useTresContext=ne,v.useTresContextProvider=re,Object.defineProperties(v,{__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.2.1-next.
|
|
4
|
+
"version": "3.2.1-next.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/)",
|