@tresjs/core 3.4.1 → 3.5.0
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/composables/useSeek/index.d.ts +2 -0
- package/dist/tres.js +155 -144
- package/dist/tres.umd.cjs +2 -2
- package/dist/types/index.d.ts +3 -3
- package/package.json +1 -1
|
@@ -7,6 +7,8 @@
|
|
|
7
7
|
export interface UseSeekReturn {
|
|
8
8
|
seek: (parent: THREE.Scene | THREE.Object3D, property: string, value: string) => THREE.Object3D | null;
|
|
9
9
|
seekByName: (parent: THREE.Scene | THREE.Object3D, value: string) => THREE.Object3D | null;
|
|
10
|
+
seekAll: (parent: THREE.Scene | THREE.Object3D, property: string, value: string) => THREE.Object3D[];
|
|
11
|
+
seekAllByName: (parent: THREE.Scene | THREE.Object3D, value: string) => THREE.Object3D[];
|
|
10
12
|
}
|
|
11
13
|
/**
|
|
12
14
|
* Composable that provides utilities to easily traverse and navigate through complex scenes and object children graphs
|
package/dist/tres.js
CHANGED
|
@@ -1,57 +1,57 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* name: @tresjs/core
|
|
3
|
-
* version: v3.
|
|
3
|
+
* version: v3.5.0
|
|
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
|
|
8
|
+
import { ref as L, computed as A, watchEffect as D, onUnmounted as N, shallowRef as x, watch as ee, reactive as se, readonly as ie, provide as z, 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
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
|
|
11
|
-
import { createEventHook as
|
|
12
|
-
const
|
|
13
|
-
const t =
|
|
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 $, LoadingManager as ke, TextureLoader as De, Vector2 as be, Raycaster as xe, BufferAttribute as Be, Scene as Le } from "three";
|
|
11
|
+
import { createEventHook as B, 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 $e = ({ sizes: e, scene: a }) => {
|
|
13
|
+
const t = L([]), r = A(
|
|
14
14
|
() => t.value[0]
|
|
15
15
|
), n = (s, f = !1) => {
|
|
16
|
-
t.value.some(({ uuid:
|
|
16
|
+
t.value.some(({ uuid: i }) => i === s.uuid) || (f ? u(s) : t.value.push(s));
|
|
17
17
|
}, o = (s) => {
|
|
18
18
|
t.value = t.value.filter(({ uuid: f }) => f !== s.uuid);
|
|
19
|
-
},
|
|
19
|
+
}, u = (s) => {
|
|
20
20
|
const f = s instanceof Ce ? s : t.value.find((m) => m.uuid === s);
|
|
21
21
|
if (!f)
|
|
22
22
|
return;
|
|
23
|
-
const
|
|
24
|
-
t.value = [f, ...
|
|
23
|
+
const i = t.value.filter(({ uuid: m }) => m !== f.uuid);
|
|
24
|
+
t.value = [f, ...i];
|
|
25
25
|
};
|
|
26
26
|
return D(() => {
|
|
27
27
|
e.aspectRatio.value && t.value.forEach((s) => {
|
|
28
28
|
s instanceof I && (s.aspect = e.aspectRatio.value), (s instanceof I || s instanceof we) && s.updateProjectionMatrix();
|
|
29
29
|
});
|
|
30
|
-
}), a.userData.tres__registerCamera = n, a.userData.tres__deregisterCamera = o,
|
|
30
|
+
}), a.userData.tres__registerCamera = n, a.userData.tres__deregisterCamera = o, N(() => {
|
|
31
31
|
t.value = [];
|
|
32
32
|
}), {
|
|
33
33
|
camera: r,
|
|
34
34
|
cameras: t,
|
|
35
35
|
registerCamera: n,
|
|
36
36
|
deregisterCamera: o,
|
|
37
|
-
setCameraActive:
|
|
37
|
+
setCameraActive: u
|
|
38
38
|
};
|
|
39
|
-
}, te =
|
|
39
|
+
}, te = B(), re = B(), W = B(), b = new Pe();
|
|
40
40
|
let j = 0, F = 0;
|
|
41
|
-
const { pause:
|
|
41
|
+
const { pause: ze, resume: Ie, isActive: Ge } = Oe(
|
|
42
42
|
() => {
|
|
43
|
-
te.trigger({ delta: j, elapsed: F, clock: b }), re.trigger({ delta: j, elapsed: F, clock: b }),
|
|
43
|
+
te.trigger({ delta: j, elapsed: F, clock: b }), re.trigger({ delta: j, elapsed: F, clock: b }), W.trigger({ delta: j, elapsed: F, clock: b });
|
|
44
44
|
},
|
|
45
45
|
{ immediate: !1 }
|
|
46
46
|
);
|
|
47
|
-
|
|
47
|
+
W.on(() => {
|
|
48
48
|
j = b.getDelta(), F = b.getElapsedTime();
|
|
49
49
|
});
|
|
50
50
|
const ne = () => ({
|
|
51
51
|
onBeforeLoop: te.on,
|
|
52
52
|
onLoop: re.on,
|
|
53
|
-
onAfterLoop:
|
|
54
|
-
pause:
|
|
53
|
+
onAfterLoop: W.on,
|
|
54
|
+
pause: ze,
|
|
55
55
|
resume: Ie,
|
|
56
56
|
isActive: Ge
|
|
57
57
|
}), dt = !0, K = "[TresJS ▲ ■ ●] ";
|
|
@@ -73,14 +73,14 @@ function O() {
|
|
|
73
73
|
function vt(e) {
|
|
74
74
|
return typeof e == "number" ? [e, e, e] : e instanceof he ? [e.x, e.y, e.z] : e;
|
|
75
75
|
}
|
|
76
|
-
function
|
|
76
|
+
function Ne(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
|
-
},
|
|
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", Ve = /* @__PURE__ */ qe(We);
|
|
84
84
|
function X(e) {
|
|
85
85
|
return e && e.nodeType === 1;
|
|
86
86
|
}
|
|
@@ -107,12 +107,12 @@ const Ue = (e, a) => {
|
|
|
107
107
|
return t == null ? void 0 : t.reduce((r, n) => r && r[n], e);
|
|
108
108
|
}, Je = (e, a, t) => {
|
|
109
109
|
const r = Array.isArray(a) ? a : a.match(/([^[.\]])+/g);
|
|
110
|
-
r && r.reduce((n, o,
|
|
110
|
+
r && r.reduce((n, o, u) => (n[o] === void 0 && (n[o] = {}), u === r.length - 1 && (n[o] = t), n[o]), e);
|
|
111
111
|
};
|
|
112
112
|
function oe(e, a) {
|
|
113
113
|
if (X(e) && X(a)) {
|
|
114
114
|
const n = e.attributes, o = a.attributes;
|
|
115
|
-
return n.length !== o.length ? !1 : Array.from(n).every(({ name:
|
|
115
|
+
return n.length !== o.length ? !1 : Array.from(n).every(({ name: u, value: s }) => a.getAttribute(u) === s);
|
|
116
116
|
}
|
|
117
117
|
if (e === a)
|
|
118
118
|
return !0;
|
|
@@ -154,7 +154,7 @@ function Qe({
|
|
|
154
154
|
disableRender: r,
|
|
155
155
|
contextParts: { sizes: n, camera: o }
|
|
156
156
|
}) {
|
|
157
|
-
const
|
|
157
|
+
const u = A(() => ({
|
|
158
158
|
alpha: E(t.alpha),
|
|
159
159
|
depth: E(t.depth),
|
|
160
160
|
canvas: Te(a),
|
|
@@ -167,9 +167,9 @@ function Qe({
|
|
|
167
167
|
preserveDrawingBuffer: E(t.preserveDrawingBuffer),
|
|
168
168
|
logarithmicDepthBuffer: E(t.logarithmicDepthBuffer),
|
|
169
169
|
failIfMajorPerformanceCaveat: E(t.failIfMajorPerformanceCaveat)
|
|
170
|
-
})), s = x(new
|
|
171
|
-
ee(
|
|
172
|
-
s.value.dispose(), s.value = new
|
|
170
|
+
})), s = x(new $(u.value));
|
|
171
|
+
ee(u, () => {
|
|
172
|
+
s.value.dispose(), s.value = new $(u.value);
|
|
173
173
|
}), D(() => {
|
|
174
174
|
s.value.setSize(n.width.value, n.height.value);
|
|
175
175
|
});
|
|
@@ -177,8 +177,8 @@ function Qe({
|
|
|
177
177
|
D(() => {
|
|
178
178
|
s.value.setPixelRatio(f.value);
|
|
179
179
|
});
|
|
180
|
-
const { logError:
|
|
181
|
-
const v = new
|
|
180
|
+
const { logError: i } = O(), c = (() => {
|
|
181
|
+
const v = new $(), w = {
|
|
182
182
|
shadowMap: {
|
|
183
183
|
enabled: v.shadowMap.enabled,
|
|
184
184
|
type: v.shadowMap.type
|
|
@@ -191,7 +191,7 @@ function Qe({
|
|
|
191
191
|
})();
|
|
192
192
|
D(() => {
|
|
193
193
|
const v = E(t.preset);
|
|
194
|
-
v && (v in R ||
|
|
194
|
+
v && (v in R || i(`Renderer Preset must be one of these: ${Object.keys(R).join(", ")}`), ae(s.value, R[v]));
|
|
195
195
|
const w = (P, C) => {
|
|
196
196
|
const k = E(P), T = () => {
|
|
197
197
|
if (v)
|
|
@@ -200,20 +200,20 @@ function Qe({
|
|
|
200
200
|
if (k !== void 0)
|
|
201
201
|
return k;
|
|
202
202
|
const y = T();
|
|
203
|
-
return y !== void 0 ? y : Y(
|
|
203
|
+
return y !== void 0 ? y : Y(c, C);
|
|
204
204
|
}, h = (P, C) => Je(s.value, C, w(P, C));
|
|
205
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 ?
|
|
208
|
+
M ? Ne(M) : new H(0)
|
|
209
209
|
// default clear color is not easily/efficiently retrievable from three
|
|
210
210
|
);
|
|
211
211
|
});
|
|
212
|
-
const { pause:
|
|
212
|
+
const { pause: l, resume: p, onLoop: d } = ne();
|
|
213
213
|
return d(() => {
|
|
214
214
|
o.value && !E(r) && s.value.render(e, o.value);
|
|
215
|
-
}), p(),
|
|
216
|
-
|
|
215
|
+
}), p(), N(() => {
|
|
216
|
+
l(), s.value.dispose(), s.value.forceContextLoss();
|
|
217
217
|
}), {
|
|
218
218
|
renderer: s
|
|
219
219
|
};
|
|
@@ -226,30 +226,30 @@ function et(e) {
|
|
|
226
226
|
}), a;
|
|
227
227
|
}
|
|
228
228
|
async function gt(e, a, t, r, n) {
|
|
229
|
-
const { logError: o } = O(),
|
|
230
|
-
n && n(
|
|
229
|
+
const { logError: o } = O(), u = new e();
|
|
230
|
+
n && n(u), t && t(u);
|
|
231
231
|
const f = (Array.isArray(a) ? a : [a]).map(
|
|
232
|
-
(
|
|
233
|
-
|
|
234
|
-
|
|
235
|
-
(
|
|
236
|
-
|
|
232
|
+
(i) => new Promise((m, c) => {
|
|
233
|
+
u.load(
|
|
234
|
+
i,
|
|
235
|
+
(l) => {
|
|
236
|
+
l.scene && Object.assign(l, et(l.scene)), m(l);
|
|
237
237
|
},
|
|
238
238
|
r,
|
|
239
|
-
(
|
|
239
|
+
(l) => c(o("[useLoader] - Failed to load resource", l))
|
|
240
240
|
);
|
|
241
241
|
})
|
|
242
242
|
);
|
|
243
243
|
return Ze(a) ? await Promise.all(f) : await f[0];
|
|
244
244
|
}
|
|
245
245
|
async function yt(e) {
|
|
246
|
-
const a = new ke(), t = new De(a), r = (n) => new Promise((o,
|
|
246
|
+
const a = new ke(), t = new De(a), r = (n) => new Promise((o, u) => {
|
|
247
247
|
t.load(
|
|
248
248
|
n,
|
|
249
249
|
(s) => o(s),
|
|
250
250
|
() => null,
|
|
251
251
|
() => {
|
|
252
|
-
|
|
252
|
+
u(new Error("[useTextures] - Failed to load texture"));
|
|
253
253
|
}
|
|
254
254
|
);
|
|
255
255
|
});
|
|
@@ -260,42 +260,42 @@ async function yt(e) {
|
|
|
260
260
|
const {
|
|
261
261
|
map: n,
|
|
262
262
|
displacementMap: o,
|
|
263
|
-
normalMap:
|
|
263
|
+
normalMap: u,
|
|
264
264
|
roughnessMap: s,
|
|
265
265
|
metalnessMap: f,
|
|
266
|
-
aoMap:
|
|
266
|
+
aoMap: i,
|
|
267
267
|
alphaMap: m,
|
|
268
|
-
matcap:
|
|
268
|
+
matcap: c
|
|
269
269
|
} = e;
|
|
270
270
|
return {
|
|
271
271
|
map: n ? await r(n) : null,
|
|
272
272
|
displacementMap: o ? await r(o) : null,
|
|
273
|
-
normalMap:
|
|
273
|
+
normalMap: u ? await r(u) : null,
|
|
274
274
|
roughnessMap: s ? await r(s) : null,
|
|
275
275
|
metalnessMap: f ? await r(f) : null,
|
|
276
|
-
aoMap:
|
|
276
|
+
aoMap: i ? await r(i) : null,
|
|
277
277
|
alphaMap: m ? await r(m) : null,
|
|
278
|
-
matcap:
|
|
278
|
+
matcap: c ? await r(c) : null
|
|
279
279
|
};
|
|
280
280
|
}
|
|
281
281
|
}
|
|
282
282
|
const tt = (e, { renderer: a, camera: t, raycaster: r }) => {
|
|
283
|
-
const n = A(() => a.value.domElement), { x: o, y:
|
|
283
|
+
const n = A(() => a.value.domElement), { x: o, y: u } = Re({ target: n }), { width: s, height: f, top: i, left: m } = He(n), c = ({ x: y, y: _ }) => {
|
|
284
284
|
if (n.value)
|
|
285
285
|
return {
|
|
286
286
|
x: (y - m.value) / s.value * 2 - 1,
|
|
287
|
-
y: -((_ -
|
|
287
|
+
y: -((_ - i.value) / f.value) * 2 + 1
|
|
288
288
|
};
|
|
289
|
-
},
|
|
289
|
+
}, l = ({ x: y, y: _ }) => {
|
|
290
290
|
if (t.value)
|
|
291
291
|
return r.value.setFromCamera(new be(y, _), t.value), r.value.intersectObjects(e.value, !1);
|
|
292
292
|
}, p = (y) => {
|
|
293
|
-
const _ =
|
|
293
|
+
const _ = c({
|
|
294
294
|
x: (y == null ? void 0 : y.clientX) ?? o.value,
|
|
295
|
-
y: (y == null ? void 0 : y.clientY) ??
|
|
295
|
+
y: (y == null ? void 0 : y.clientY) ?? u.value
|
|
296
296
|
});
|
|
297
|
-
return _ ?
|
|
298
|
-
}, d = A(() => p()), v =
|
|
297
|
+
return _ ? l(_) || [] : [];
|
|
298
|
+
}, d = A(() => p()), v = B(), w = B(), h = (y, _) => {
|
|
299
299
|
y.trigger({ event: _, intersects: p(_) });
|
|
300
300
|
}, M = (y) => {
|
|
301
301
|
h(w, y);
|
|
@@ -308,7 +308,7 @@ const tt = (e, { renderer: a, camera: t, raycaster: r }) => {
|
|
|
308
308
|
var _;
|
|
309
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
|
-
return n.value.addEventListener("pointerup", k), n.value.addEventListener("pointerdown", C), n.value.addEventListener("pointermove", M), n.value.addEventListener("pointerleave", T),
|
|
311
|
+
return n.value.addEventListener("pointerup", k), n.value.addEventListener("pointerdown", C), n.value.addEventListener("pointermove", M), n.value.addEventListener("pointerleave", T), N(() => {
|
|
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
314
|
intersects: d,
|
|
@@ -318,18 +318,29 @@ const tt = (e, { renderer: a, camera: t, raycaster: r }) => {
|
|
|
318
318
|
};
|
|
319
319
|
function wt() {
|
|
320
320
|
const { logWarning: e } = O();
|
|
321
|
-
function a(
|
|
322
|
-
let
|
|
323
|
-
return
|
|
324
|
-
|
|
325
|
-
}),
|
|
321
|
+
function a(o, u, s) {
|
|
322
|
+
let f = null;
|
|
323
|
+
return o.traverse((i) => {
|
|
324
|
+
i[u] === s && (f = i);
|
|
325
|
+
}), f || e(`Child with ${u} '${s}' not found.`), f;
|
|
326
326
|
}
|
|
327
|
-
function t(
|
|
328
|
-
|
|
327
|
+
function t(o, u, s) {
|
|
328
|
+
const f = [];
|
|
329
|
+
return o.traverse((i) => {
|
|
330
|
+
i[u].includes(s) && f.push(i);
|
|
331
|
+
}), f.length || e(`Children with ${u} '${s}' not found.`), f;
|
|
332
|
+
}
|
|
333
|
+
function r(o, u) {
|
|
334
|
+
return a(o, "name", u);
|
|
335
|
+
}
|
|
336
|
+
function n(o, u) {
|
|
337
|
+
return t(o, "name", u);
|
|
329
338
|
}
|
|
330
339
|
return {
|
|
331
340
|
seek: a,
|
|
332
|
-
seekByName:
|
|
341
|
+
seekByName: r,
|
|
342
|
+
seekAll: t,
|
|
343
|
+
seekAllByName: n
|
|
333
344
|
};
|
|
334
345
|
}
|
|
335
346
|
const rt = ({ scene: e, contextParts: a }) => {
|
|
@@ -338,40 +349,40 @@ const rt = ({ scene: e, contextParts: a }) => {
|
|
|
338
349
|
pointerMove: /* @__PURE__ */ new Map(),
|
|
339
350
|
pointerEnter: /* @__PURE__ */ new Map(),
|
|
340
351
|
pointerLeave: /* @__PURE__ */ new Map()
|
|
341
|
-
}), r =
|
|
342
|
-
r.value.add(
|
|
343
|
-
}, o = (
|
|
344
|
-
r.value.delete(
|
|
345
|
-
},
|
|
346
|
-
Object.values(t).forEach((p) => p.delete(
|
|
347
|
-
}, s = (
|
|
348
|
-
const { onClick: p, onPointerMove: d, onPointerEnter: v, onPointerLeave: w } =
|
|
349
|
-
p && t.click.set(
|
|
352
|
+
}), r = L(/* @__PURE__ */ new Set()), n = (l) => {
|
|
353
|
+
r.value.add(l);
|
|
354
|
+
}, o = (l) => {
|
|
355
|
+
r.value.delete(l);
|
|
356
|
+
}, u = (l) => {
|
|
357
|
+
Object.values(t).forEach((p) => p.delete(l)), o(l);
|
|
358
|
+
}, s = (l) => {
|
|
359
|
+
const { onClick: p, onPointerMove: d, onPointerEnter: v, onPointerLeave: w } = l;
|
|
360
|
+
p && t.click.set(l, p), d && t.pointerMove.set(l, d), v && t.pointerEnter.set(l, v), w && t.pointerLeave.set(l, w);
|
|
350
361
|
};
|
|
351
|
-
e.userData.tres__registerAtPointerEventHandler = s, e.userData.tres__deregisterAtPointerEventHandler =
|
|
362
|
+
e.userData.tres__registerAtPointerEventHandler = s, e.userData.tres__deregisterAtPointerEventHandler = u, e.userData.tres__registerBlockingObjectAtPointerEventHandler = n, e.userData.tres__deregisterBlockingObjectAtPointerEventHandler = o;
|
|
352
363
|
const f = A(
|
|
353
364
|
() => Ue(
|
|
354
365
|
[
|
|
355
366
|
...Array.from(r.value),
|
|
356
|
-
...Object.values(t).map((
|
|
367
|
+
...Object.values(t).map((l) => Array.from(l.keys())).flat()
|
|
357
368
|
],
|
|
358
|
-
({ uuid:
|
|
369
|
+
({ uuid: l }) => l
|
|
359
370
|
)
|
|
360
|
-
), { onClick:
|
|
361
|
-
|
|
371
|
+
), { onClick: i, onPointerMove: m } = tt(f, a);
|
|
372
|
+
i(({ intersects: l, event: p }) => {
|
|
362
373
|
var d;
|
|
363
|
-
|
|
374
|
+
l.length && ((d = t.click.get(l[0].object)) == null || d(l[0], p));
|
|
364
375
|
});
|
|
365
|
-
let
|
|
366
|
-
return m(({ intersects:
|
|
376
|
+
let c;
|
|
377
|
+
return m(({ intersects: l, event: p }) => {
|
|
367
378
|
var M, P, C, k;
|
|
368
|
-
const d = (M =
|
|
369
|
-
|
|
379
|
+
const d = (M = l == null ? void 0 : l[0]) == null ? void 0 : M.object, { pointerLeave: v, pointerEnter: w, pointerMove: h } = t;
|
|
380
|
+
c && c !== d && ((P = v.get(c)) == null || P(c, p)), d && (c !== d && ((C = w.get(d)) == null || C(l[0], p)), (k = h.get(d)) == null || k(l[0], p)), c = d || null;
|
|
370
381
|
}), {
|
|
371
382
|
registerObject: s,
|
|
372
|
-
deregisterObject:
|
|
383
|
+
deregisterObject: u
|
|
373
384
|
};
|
|
374
|
-
}, G =
|
|
385
|
+
}, G = L({}), V = (e) => Object.assign(G.value, e);
|
|
375
386
|
function nt({
|
|
376
387
|
scene: e,
|
|
377
388
|
canvas: a,
|
|
@@ -381,38 +392,38 @@ function nt({
|
|
|
381
392
|
}) {
|
|
382
393
|
const o = A(
|
|
383
394
|
() => E(t) ? je() : Fe(E(a).parentElement)
|
|
384
|
-
),
|
|
395
|
+
), u = A(() => o.value.width.value), s = A(() => o.value.height.value), f = A(() => u.value / s.value), i = {
|
|
385
396
|
height: s,
|
|
386
|
-
width:
|
|
397
|
+
width: u,
|
|
387
398
|
aspectRatio: f
|
|
388
399
|
}, m = x(e), {
|
|
389
|
-
camera:
|
|
390
|
-
cameras:
|
|
400
|
+
camera: c,
|
|
401
|
+
cameras: l,
|
|
391
402
|
registerCamera: p,
|
|
392
403
|
deregisterCamera: d,
|
|
393
404
|
setCameraActive: v
|
|
394
|
-
} =
|
|
405
|
+
} = $e({ sizes: i, scene: e }), { renderer: w } = Qe(
|
|
395
406
|
{
|
|
396
407
|
scene: e,
|
|
397
408
|
canvas: a,
|
|
398
409
|
options: n,
|
|
399
|
-
contextParts: { sizes:
|
|
410
|
+
contextParts: { sizes: i, camera: c },
|
|
400
411
|
disableRender: r
|
|
401
412
|
}
|
|
402
413
|
), h = {
|
|
403
|
-
sizes:
|
|
414
|
+
sizes: i,
|
|
404
415
|
scene: m,
|
|
405
|
-
camera:
|
|
406
|
-
cameras: ie(
|
|
416
|
+
camera: c,
|
|
417
|
+
cameras: ie(l),
|
|
407
418
|
renderer: w,
|
|
408
419
|
raycaster: x(new xe()),
|
|
409
|
-
controls:
|
|
420
|
+
controls: L(null),
|
|
410
421
|
extend: V,
|
|
411
422
|
registerCamera: p,
|
|
412
423
|
setCameraActive: v,
|
|
413
424
|
deregisterCamera: d
|
|
414
425
|
};
|
|
415
|
-
return
|
|
426
|
+
return z("useTres", h), h;
|
|
416
427
|
}
|
|
417
428
|
function at() {
|
|
418
429
|
const e = le("useTres");
|
|
@@ -424,7 +435,7 @@ const Ct = at;
|
|
|
424
435
|
let g = null;
|
|
425
436
|
const { logError: Z } = O(), ot = {
|
|
426
437
|
createElement(e, a, t, r) {
|
|
427
|
-
var
|
|
438
|
+
var u, s;
|
|
428
439
|
if (r || (r = {}), r.args || (r.args = []), e === "template" || Ve(e))
|
|
429
440
|
return null;
|
|
430
441
|
let n = e.replace("Tres", ""), o;
|
|
@@ -436,13 +447,13 @@ const { logError: Z } = O(), ot = {
|
|
|
436
447
|
const f = G.value[n];
|
|
437
448
|
f || Z(`${n} is not defined on the THREE namespace. Use extend to add it to the catalog.`), o = new f(...r.args);
|
|
438
449
|
}
|
|
439
|
-
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 && ((
|
|
450
|
+
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 && ((u = r == null ? void 0 : r.material) != null && u.isMaterial && (o.userData.tres__materialViaProp = !0), (s = r == null ? void 0 : r.geometry) != null && s.isBufferGeometry && (o.userData.tres__geometryViaProp = !0)), o.userData = {
|
|
440
451
|
...o.userData,
|
|
441
452
|
tres__name: n
|
|
442
453
|
}, o;
|
|
443
454
|
},
|
|
444
455
|
insert(e, a) {
|
|
445
|
-
var r, n, o,
|
|
456
|
+
var r, n, o, u;
|
|
446
457
|
a && a.isScene && (g = a);
|
|
447
458
|
const t = a || g;
|
|
448
459
|
if (e != null && e.isObject3D) {
|
|
@@ -454,7 +465,7 @@ const { logError: Z } = O(), ot = {
|
|
|
454
465
|
if (e != null && e.onClick || e != null && e.onPointerMove || e != null && e.onPointerEnter || e != null && e.onPointerLeave) {
|
|
455
466
|
if (!(g != null && g.userData.tres__registerAtPointerEventHandler))
|
|
456
467
|
throw "could not find tres__registerAtPointerEventHandler on scene's userData";
|
|
457
|
-
(
|
|
468
|
+
(u = g == null ? void 0 : (o = g.userData).tres__registerAtPointerEventHandler) == null || u.call(o, e);
|
|
458
469
|
}
|
|
459
470
|
}
|
|
460
471
|
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));
|
|
@@ -463,63 +474,63 @@ const { logError: Z } = O(), ot = {
|
|
|
463
474
|
var a, t;
|
|
464
475
|
if (e) {
|
|
465
476
|
if (e.isObject3D) {
|
|
466
|
-
const r = e, n = (
|
|
467
|
-
var
|
|
468
|
-
const m =
|
|
469
|
-
|
|
470
|
-
}, o = g == null ? void 0 : g.userData.tres__deregisterAtPointerEventHandler,
|
|
471
|
-
var m,
|
|
472
|
-
if (!
|
|
477
|
+
const r = e, n = (i) => {
|
|
478
|
+
var c, l;
|
|
479
|
+
const m = i;
|
|
480
|
+
i.userData.tres__materialViaProp || (c = m.material) == null || c.dispose(), i.userData.tres__geometryViaProp || (l = m.geometry) == null || l.dispose();
|
|
481
|
+
}, o = g == null ? void 0 : g.userData.tres__deregisterAtPointerEventHandler, u = g == null ? void 0 : g.userData.tres__deregisterBlockingObjectAtPointerEventHandler, s = (i) => {
|
|
482
|
+
var m, c;
|
|
483
|
+
if (!u)
|
|
473
484
|
throw "could not find tres__deregisterBlockingObjectAtPointerEventHandler on scene's userData";
|
|
474
|
-
if ((
|
|
485
|
+
if ((c = g == null ? void 0 : (m = g.userData).tres__deregisterBlockingObjectAtPointerEventHandler) == null || c.call(m, i), !o)
|
|
475
486
|
throw "could not find tres__deregisterAtPointerEventHandler on scene's userData";
|
|
476
|
-
(
|
|
477
|
-
}, f = (
|
|
487
|
+
(i != null && i.onClick || i != null && i.onPointerMove || i != null && i.onPointerEnter || i != null && i.onPointerLeave) && (o == null || o(i));
|
|
488
|
+
}, f = (i) => {
|
|
478
489
|
const m = g == null ? void 0 : g.userData.tres__deregisterCamera;
|
|
479
490
|
if (!m)
|
|
480
491
|
throw "could not find tres__deregisterCamera on scene's userData";
|
|
481
|
-
|
|
492
|
+
i.isCamera && (m == null || m(i));
|
|
482
493
|
};
|
|
483
|
-
r.traverse((
|
|
484
|
-
n(
|
|
494
|
+
r.traverse((i) => {
|
|
495
|
+
n(i), f(i), s == null || s(i);
|
|
485
496
|
}), n(r), f(r), s == null || s(r);
|
|
486
497
|
}
|
|
487
498
|
(a = e.removeFromParent) == null || a.call(e), (t = e.dispose) == null || t.call(e);
|
|
488
499
|
}
|
|
489
500
|
},
|
|
490
501
|
patchProp(e, a, t, r) {
|
|
491
|
-
var n, o,
|
|
502
|
+
var n, o, u, s;
|
|
492
503
|
if (e) {
|
|
493
|
-
let f = e,
|
|
494
|
-
if (e.isObject3D &&
|
|
495
|
-
r || r === "" ? (o = g == null ? void 0 : (n = g.userData).tres__registerBlockingObjectAtPointerEventHandler) == null || o.call(n, e) : (s = g == null ? void 0 : (
|
|
504
|
+
let f = e, i = a;
|
|
505
|
+
if (e.isObject3D && i === "blocks-pointer-events") {
|
|
506
|
+
r || r === "" ? (o = g == null ? void 0 : (n = g.userData).tres__registerBlockingObjectAtPointerEventHandler) == null || o.call(n, e) : (s = g == null ? void 0 : (u = g.userData).tres__deregisterBlockingObjectAtPointerEventHandler) == null || s.call(u, e);
|
|
496
507
|
return;
|
|
497
508
|
}
|
|
498
|
-
let m = S(
|
|
499
|
-
if (
|
|
509
|
+
let m = S(i), c = f == null ? void 0 : f[m];
|
|
510
|
+
if (i === "args") {
|
|
500
511
|
const p = e, d = t ?? [], v = r ?? [], w = e.userData.tres__name || e.type;
|
|
501
512
|
w && d.length && !Ke(d, v) && (f = Object.assign(p, new G.value[w](...r)));
|
|
502
513
|
return;
|
|
503
514
|
}
|
|
504
515
|
if (f.type === "BufferGeometry") {
|
|
505
|
-
if (
|
|
516
|
+
if (i === "args")
|
|
506
517
|
return;
|
|
507
518
|
f.setAttribute(
|
|
508
|
-
S(
|
|
509
|
-
new
|
|
519
|
+
S(i),
|
|
520
|
+
new Be(...r)
|
|
510
521
|
);
|
|
511
522
|
return;
|
|
512
523
|
}
|
|
513
|
-
if (
|
|
514
|
-
const p =
|
|
515
|
-
|
|
524
|
+
if (i.includes("-") && c === void 0) {
|
|
525
|
+
const p = i.split("-");
|
|
526
|
+
c = p.reduce((d, v) => d[S(v)], f), i = p.pop(), m = i.toLowerCase(), c != null && c.set || (f = p.reduce((d, v) => d[S(v)], f));
|
|
516
527
|
}
|
|
517
|
-
let
|
|
518
|
-
if (
|
|
519
|
-
Array.isArray(
|
|
528
|
+
let l = r;
|
|
529
|
+
if (l === "" && (l = !0), Q(c)) {
|
|
530
|
+
Array.isArray(l) ? e[m](...l) : e[m](l);
|
|
520
531
|
return;
|
|
521
532
|
}
|
|
522
|
-
!(
|
|
533
|
+
!(c != null && c.set) && !Q(c) ? f[m] = l : c.constructor === l.constructor && (c != null && c.copy) ? c == null || c.copy(l) : Array.isArray(l) ? c.set(...l) : !c.isColor && c.setScalar ? c.setScalar(l) : c.set(l);
|
|
523
534
|
}
|
|
524
535
|
},
|
|
525
536
|
parentNode(e) {
|
|
@@ -563,30 +574,30 @@ const it = ["data-scene"], lt = /* @__PURE__ */ q({
|
|
|
563
574
|
failIfMajorPerformanceCaveat: { type: Boolean, default: void 0 }
|
|
564
575
|
},
|
|
565
576
|
setup(e, { expose: a }) {
|
|
566
|
-
var
|
|
567
|
-
const t = e, { logWarning: r } = O(), n =
|
|
577
|
+
var l;
|
|
578
|
+
const t = e, { logWarning: r } = O(), n = L(), o = x(new Le());
|
|
568
579
|
ne();
|
|
569
|
-
const
|
|
580
|
+
const u = ce(), s = (l = U()) == null ? void 0 : l.appContext.app, f = (p) => q({
|
|
570
581
|
setup() {
|
|
571
582
|
var v;
|
|
572
583
|
const d = (v = U()) == null ? void 0 : v.appContext;
|
|
573
|
-
return d && (d.app = s),
|
|
584
|
+
return d && (d.app = s), z("useTres", p), z("extend", V), () => J(ge, null, u != null && u.default ? u.default() : []);
|
|
574
585
|
}
|
|
575
|
-
}),
|
|
586
|
+
}), i = (p) => {
|
|
576
587
|
const d = f(p);
|
|
577
588
|
st(J(d), o.value);
|
|
578
|
-
}, m = A(() => t.disableRender),
|
|
579
|
-
return a({ context:
|
|
589
|
+
}, m = A(() => t.disableRender), c = x(null);
|
|
590
|
+
return a({ context: c }), fe(() => {
|
|
580
591
|
const p = n;
|
|
581
|
-
|
|
592
|
+
c.value = nt({
|
|
582
593
|
scene: o.value,
|
|
583
594
|
canvas: p,
|
|
584
595
|
windowSize: t.windowSize,
|
|
585
596
|
disableRender: m,
|
|
586
597
|
rendererOptions: t
|
|
587
|
-
}), rt({ scene: o.value, contextParts:
|
|
588
|
-
const { registerCamera: d, camera: v, cameras: w, deregisterCamera: h } =
|
|
589
|
-
|
|
598
|
+
}), rt({ scene: o.value, contextParts: c.value });
|
|
599
|
+
const { registerCamera: d, camera: v, cameras: w, deregisterCamera: h } = c.value;
|
|
600
|
+
i(c.value);
|
|
590
601
|
const M = () => {
|
|
591
602
|
const P = new I(
|
|
592
603
|
45,
|
|
@@ -649,11 +660,11 @@ export {
|
|
|
649
660
|
ht as default,
|
|
650
661
|
V as extend,
|
|
651
662
|
dt as isProd,
|
|
652
|
-
|
|
663
|
+
Ne as normalizeColor,
|
|
653
664
|
vt as normalizeVectorFlexibleParam,
|
|
654
665
|
Pt as templateCompilerOptions,
|
|
655
666
|
et as trasverseObjects,
|
|
656
|
-
|
|
667
|
+
$e as useCamera,
|
|
657
668
|
gt as useLoader,
|
|
658
669
|
O as useLogger,
|
|
659
670
|
rt as usePointerEventHandler,
|
package/dist/tres.umd.cjs
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* name: @tresjs/core
|
|
3
|
-
* version: v3.
|
|
3
|
+
* version: v3.5.0
|
|
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(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"}})});
|
|
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),G=({sizes:e,scene:a})=>{const t=u.ref([]),r=u.computed(()=>t.value[0]),n=(s,d=!1)=>{t.value.some(({uuid:i})=>i===s.uuid)||(d?c(s):t.value.push(s))},o=s=>{t.value=t.value.filter(({uuid:d})=>d!==s.uuid)},c=s=>{const d=s instanceof P.Camera?s:t.value.find(p=>p.uuid===s);if(!d)return;const i=t.value.filter(({uuid:p})=>p!==d.uuid);t.value=[d,...i]};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:c}},R=C.createEventHook(),I=C.createEventHook(),F=C.createEventHook(),B=new P.Clock;let S=0,x=0;const{pause:se,resume:ie,isActive:le}=C.useRafFn(()=>{R.trigger({delta:S,elapsed:x,clock:B}),I.trigger({delta:S,elapsed:x,clock:B}),F.trigger({delta:S,elapsed:x,clock:B})},{immediate:!1});F.on(()=>{S=B.getDelta(),x=B.getElapsedTime()});const $=()=>({onBeforeLoop:R.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,c)=>(n[o]===void 0&&(n[o]={}),c===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:c,value:s})=>a.getAttribute(c)===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 c=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(c.value));u.watch(c,()=>{s.value.dispose(),s.value=new P.WebGLRenderer(c.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:i}=L(),f=(()=>{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||i(`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(f,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:l,resume:m,onLoop:g}=$();return g(()=>{o.value&&!C.toValue(r)&&s.value.render(e,o.value)}),m(),u.onUnmounted(()=>{l(),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(),c=new e;n&&n(c),t&&t(c);const d=(Array.isArray(a)?a:[a]).map(i=>new Promise((p,f)=>{c.load(i,l=>{l.scene&&Object.assign(l,Y(l.scene)),p(l)},r,l=>f(o("[useLoader] - Failed to load resource",l)))}));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,c)=>{t.load(n,s=>o(s),()=>null,()=>{c(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:c,roughnessMap:s,metalnessMap:d,aoMap:i,alphaMap:p,matcap:f}=e;return{map:n?await r(n):null,displacementMap:o?await r(o):null,normalMap:c?await r(c):null,roughnessMap:s?await r(s):null,metalnessMap:d?await r(d):null,aoMap:i?await r(i):null,alphaMap:p?await r(p):null,matcap:f?await r(f):null}}}const Q=(e,{renderer:a,camera:t,raycaster:r})=>{const n=u.computed(()=>a.value.domElement),{x:o,y:c}=C.usePointer({target:n}),{width:s,height:d,top:i,left:p}=C.useElementBounding(n),f=({x:h,y:b})=>{if(n.value)return{x:(h-p.value)/s.value*2-1,y:-((b-i.value)/d.value)*2+1}},l=({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=f({x:(h==null?void 0:h.clientX)??o.value,y:(h==null?void 0:h.clientY)??c.value});return b?l(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(o,c,s){let d=null;return o.traverse(i=>{i[c]===s&&(d=i)}),d||e(`Child with ${c} '${s}' not found.`),d}function t(o,c,s){const d=[];return o.traverse(i=>{i[c].includes(s)&&d.push(i)}),d.length||e(`Children with ${c} '${s}' not found.`),d}function r(o,c){return a(o,"name",c)}function n(o,c){return t(o,"name",c)}return{seek:a,seekByName:r,seekAll:t,seekAllByName:n}}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=l=>{r.value.add(l)},o=l=>{r.value.delete(l)},c=l=>{Object.values(t).forEach(m=>m.delete(l)),o(l)},s=l=>{const{onClick:m,onPointerMove:g,onPointerEnter:v,onPointerLeave:_}=l;m&&t.click.set(l,m),g&&t.pointerMove.set(l,g),v&&t.pointerEnter.set(l,v),_&&t.pointerLeave.set(l,_)};e.userData.tres__registerAtPointerEventHandler=s,e.userData.tres__deregisterAtPointerEventHandler=c,e.userData.tres__registerBlockingObjectAtPointerEventHandler=n,e.userData.tres__deregisterBlockingObjectAtPointerEventHandler=o;const d=u.computed(()=>me([...Array.from(r.value),...Object.values(t).map(l=>Array.from(l.keys())).flat()],({uuid:l})=>l)),{onClick:i,onPointerMove:p}=Q(d,a);i(({intersects:l,event:m})=>{var g;l.length&&((g=t.click.get(l[0].object))==null||g(l[0],m))});let f;return p(({intersects:l,event:m})=>{var D,A,M,O;const g=(D=l==null?void 0:l[0])==null?void 0:D.object,{pointerLeave:v,pointerEnter:_,pointerMove:k}=t;f&&f!==g&&((A=v.get(f))==null||A(f,m)),g&&(f!==g&&((M=_.get(g))==null||M(l[0],m)),(O=k.get(g))==null||O(l[0],m)),f=g||null}),{registerObject:s,deregisterObject:c}},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)),c=u.computed(()=>o.value.width.value),s=u.computed(()=>o.value.height.value),d=u.computed(()=>c.value/s.value),i={height:s,width:c,aspectRatio:d},p=u.shallowRef(e),{camera:f,cameras:l,registerCamera:m,deregisterCamera:g,setCameraActive:v}=G({sizes:i,scene:e}),{renderer:_}=K({scene:e,canvas:a,options:n,contextParts:{sizes:i,camera:f},disableRender:r}),k={sizes:i,scene:p,camera:f,cameras:u.readonly(l),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 Be(e){}let y=null;const{logError:re}=L(),Me={createElement(e,a,t,r){var c,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&&((c=r==null?void 0:r.material)!=null&&c.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,c;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";(c=y==null?void 0:(o=y.userData).tres__registerAtPointerEventHandler)==null||c.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=i=>{var f,l;const p=i;i.userData.tres__materialViaProp||(f=p.material)==null||f.dispose(),i.userData.tres__geometryViaProp||(l=p.geometry)==null||l.dispose()},o=y==null?void 0:y.userData.tres__deregisterAtPointerEventHandler,c=y==null?void 0:y.userData.tres__deregisterBlockingObjectAtPointerEventHandler,s=i=>{var p,f;if(!c)throw"could not find tres__deregisterBlockingObjectAtPointerEventHandler on scene's userData";if((f=y==null?void 0:(p=y.userData).tres__deregisterBlockingObjectAtPointerEventHandler)==null||f.call(p,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))},d=i=>{const p=y==null?void 0:y.userData.tres__deregisterCamera;if(!p)throw"could not find tres__deregisterCamera on scene's userData";i.isCamera&&(p==null||p(i))};r.traverse(i=>{n(i),d(i),s==null||s(i)}),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,c,s;if(e){let d=e,i=a;if(e.isObject3D&&i==="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:(c=y.userData).tres__deregisterBlockingObjectAtPointerEventHandler)==null||s.call(c,e);return}let p=E(i),f=d==null?void 0:d[p];if(i==="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(i==="args")return;d.setAttribute(E(i),new P.BufferAttribute(...r));return}if(i.includes("-")&&f===void 0){const m=i.split("-");f=m.reduce((g,v)=>g[E(v)],d),i=m.pop(),p=i.toLowerCase(),f!=null&&f.set||(d=m.reduce((g,v)=>g[E(v)],d))}let l=r;if(l===""&&(l=!0),X(f)){Array.isArray(l)?e[p](...l):e[p](l);return}!(f!=null&&f.set)&&!X(f)?d[p]=l:f.constructor===l.constructor&&(f!=null&&f.copy)?f==null||f.copy(l):Array.isArray(l)?f.set(...l):!f.isColor&&f.setScalar?f.setScalar(l):f.set(l)}},parentNode(e){return(e==null?void 0:e.parent)||null},createText:()=>void 0,createComment:()=>void 0,setText:()=>void 0,setElementText:()=>void 0,nextSibling:()=>void 0,querySelector:()=>void 0,setScopeId:()=>void 0,cloneNode:()=>void 0,insertStaticContent:()=>void 0},{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 l;const t=e,{logWarning:r}=L(),n=u.ref(),o=u.shallowRef(new P.Scene);$();const c=u.useSlots(),s=(l=u.getCurrentInstance())==null?void 0:l.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,c!=null&&c.default?c.default():[])}}),i=m=>{const g=d(m);Ae(u.h(g),o.value)},p=u.computed(()=>t.disableRender),f=u.shallowRef(null);return a({context:f}),u.onMounted(()=>{const m=n;f.value=ee({scene:o.value,canvas:m,windowSize:t.windowSize,disableRender:p,rendererOptions:t}),Z({scene:o.value,contextParts:f.value});const{registerCamera:g,camera:v,cameras:_,deregisterCamera:k}=f.value;i(f.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=G,w.useLoader=Ce,w.useLogger=L,w.usePointerEventHandler=Z,w.useRaycaster=Q,w.useRenderLoop=$,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/dist/types/index.d.ts
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import type { DefineComponent,
|
|
1
|
+
import type { DefineComponent, VNode, VNodeRef } from 'vue';
|
|
2
2
|
import type * as THREE from 'three';
|
|
3
3
|
import type { EventProps as PointerEventHandlerEventProps } from '../composables/usePointerEventHandler';
|
|
4
4
|
export type AttachFnType<O = any> = (parent: any, self: O) => () => void;
|
|
@@ -134,8 +134,8 @@ interface RaycastableRepresentation {
|
|
|
134
134
|
type EventProps<P> = P extends RaycastableRepresentation ? Partial<EventHandlers> : unknown;
|
|
135
135
|
export interface VueProps<P> {
|
|
136
136
|
children?: VNode[];
|
|
137
|
-
ref?:
|
|
138
|
-
key?: string;
|
|
137
|
+
ref?: VNodeRef;
|
|
138
|
+
key?: string | number | symbol;
|
|
139
139
|
}
|
|
140
140
|
type ElementProps<T extends ConstructorRepresentation, P = InstanceType<T>> = Partial<Overwrite<WithMathProps<P>, VueProps<P> & EventProps<P>>>;
|
|
141
141
|
export type ThreeElement<T extends ConstructorRepresentation> = Mutable<Overwrite<ElementProps<T>, Omit<InstanceProps<InstanceType<T>, T>, 'object'>>>;
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@tresjs/core",
|
|
3
3
|
"type": "module",
|
|
4
|
-
"version": "3.
|
|
4
|
+
"version": "3.5.0",
|
|
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/)",
|