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