@ssgoi/core 7.3.0-beta.1 → 7.3.0-beta.3
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/animation/frame-scheduler.d.ts +7 -25
- package/dist/animation/frame-scheduler.d.ts.map +1 -1
- package/dist/animation/multi-animation.d.ts.map +1 -1
- package/dist/animation/web-animation.d.ts +20 -20
- package/dist/animation/web-animation.d.ts.map +1 -1
- package/dist/index.cjs +1 -1
- package/dist/index.js +2 -2
- package/dist/internal.cjs +1 -1
- package/dist/internal.js +1 -1
- package/dist/retain-opacity-5kqI1OCo.cjs +1 -0
- package/dist/{retain-opacity-Dvv9gi8-.js → retain-opacity-Bp_Y__-B.js} +337 -393
- package/package.json +1 -1
- package/dist/retain-opacity-BFlsDhI7.cjs +0 -1
|
@@ -1,12 +1,12 @@
|
|
|
1
|
-
var
|
|
2
|
-
var
|
|
3
|
-
var h = (s, r, t) =>
|
|
4
|
-
import { A as
|
|
5
|
-
const
|
|
1
|
+
var at = Object.defineProperty;
|
|
2
|
+
var lt = (s, r, t) => r in s ? at(s, r, { enumerable: !0, configurable: !0, writable: !0, value: t }) : s[r] = t;
|
|
3
|
+
var h = (s, r, t) => lt(s, typeof r != "symbol" ? r + "" : r, t);
|
|
4
|
+
import { A as ht, c as U, a as ct, r as ut, i as dt, s as ft, I as pt } from "./provider-BLf6XeXT.js";
|
|
5
|
+
const E = {
|
|
6
6
|
reason: "finished",
|
|
7
7
|
owns: () => !0
|
|
8
8
|
};
|
|
9
|
-
class st extends
|
|
9
|
+
class st extends ht {
|
|
10
10
|
constructor() {
|
|
11
11
|
super(...arguments);
|
|
12
12
|
h(this, "_startCondition");
|
|
@@ -60,16 +60,7 @@ class st extends ut {
|
|
|
60
60
|
throw new Error("This animation does not support replacing its integrator");
|
|
61
61
|
}
|
|
62
62
|
}
|
|
63
|
-
|
|
64
|
-
return new Promise((r) => {
|
|
65
|
-
requestAnimationFrame(() => {
|
|
66
|
-
requestAnimationFrame(() => {
|
|
67
|
-
r();
|
|
68
|
-
});
|
|
69
|
-
});
|
|
70
|
-
});
|
|
71
|
-
}
|
|
72
|
-
const H = [1, 0, 0, 1, 0, 0], it = (s, r) => [
|
|
63
|
+
const L = [1, 0, 0, 1, 0, 0], it = (s, r) => [
|
|
73
64
|
s[0] * r[0] + s[2] * r[1],
|
|
74
65
|
s[1] * r[0] + s[3] * r[1],
|
|
75
66
|
s[0] * r[2] + s[2] * r[3],
|
|
@@ -77,7 +68,7 @@ const H = [1, 0, 0, 1, 0, 0], it = (s, r) => [
|
|
|
77
68
|
s[0] * r[4] + s[2] * r[5] + s[4],
|
|
78
69
|
s[1] * r[4] + s[3] * r[5] + s[5]
|
|
79
70
|
];
|
|
80
|
-
function
|
|
71
|
+
function Y(s) {
|
|
81
72
|
const r = s[0] * s[3] - s[1] * s[2];
|
|
82
73
|
return Math.abs(r) < 1e-10 ? null : [
|
|
83
74
|
s[3] / r,
|
|
@@ -88,53 +79,53 @@ function G(s) {
|
|
|
88
79
|
(s[1] * s[4] - s[0] * s[5]) / r
|
|
89
80
|
];
|
|
90
81
|
}
|
|
91
|
-
const
|
|
92
|
-
function
|
|
93
|
-
if (!s || s === "none") return [...
|
|
94
|
-
let e = [...
|
|
82
|
+
const P = (s, r) => [1, 0, 0, 1, s, r], H = (s, r) => [s, 0, 0, r, 0, 0];
|
|
83
|
+
function mt(s, r, t) {
|
|
84
|
+
if (!s || s === "none") return [...L];
|
|
85
|
+
let e = [...L];
|
|
95
86
|
const i = /([a-zA-Z][a-zA-Z0-9]*)\(([^()]*)\)/g;
|
|
96
87
|
let o = "";
|
|
97
|
-
for (const
|
|
98
|
-
o +=
|
|
99
|
-
const
|
|
100
|
-
if (
|
|
88
|
+
for (const d of s.matchAll(i)) {
|
|
89
|
+
o += d[0];
|
|
90
|
+
const f = d[1].toLowerCase(), c = d[2].trim().split(/\s*,\s*|\s+/);
|
|
91
|
+
if (c.some(
|
|
101
92
|
(n) => !/^[-+]?(?:\d*\.\d+|\d+\.?\d*)(?:e[-+]?\d+)?(?:px|%|deg|rad|turn)?$/i.test(
|
|
102
93
|
n
|
|
103
94
|
)
|
|
104
95
|
))
|
|
105
96
|
return null;
|
|
106
|
-
const
|
|
107
|
-
if (
|
|
97
|
+
const m = c.map(Number.parseFloat);
|
|
98
|
+
if (m.some((n) => !Number.isFinite(n))) return null;
|
|
108
99
|
const g = (n, y) => {
|
|
109
|
-
var
|
|
110
|
-
return
|
|
111
|
-
},
|
|
112
|
-
var y,
|
|
113
|
-
return
|
|
100
|
+
var a;
|
|
101
|
+
return m[n] * ((a = c[n]) != null && a.endsWith("%") ? y / 100 : 1);
|
|
102
|
+
}, u = (n) => {
|
|
103
|
+
var y, a;
|
|
104
|
+
return m[n] * ((y = c[n]) != null && y.endsWith("rad") ? 1 : (a = c[n]) != null && a.endsWith("turn") ? 2 * Math.PI : Math.PI / 180);
|
|
114
105
|
};
|
|
115
|
-
let
|
|
116
|
-
if (
|
|
117
|
-
else if (
|
|
118
|
-
if (
|
|
119
|
-
|
|
120
|
-
} else if (
|
|
121
|
-
else if (
|
|
122
|
-
else if (
|
|
123
|
-
else if (
|
|
124
|
-
else if (
|
|
125
|
-
else if (
|
|
126
|
-
else if (
|
|
127
|
-
const n =
|
|
128
|
-
|
|
106
|
+
let l;
|
|
107
|
+
if (f === "matrix" && m.length === 6) l = m;
|
|
108
|
+
else if (f === "translate" || f === "translate3d") {
|
|
109
|
+
if (f === "translate3d" && m[2] !== 0) return null;
|
|
110
|
+
l = P(g(0, r), c[1] ? g(1, t) : 0);
|
|
111
|
+
} else if (f === "translatex") l = P(g(0, r), 0);
|
|
112
|
+
else if (f === "translatey") l = P(0, g(0, t));
|
|
113
|
+
else if (f === "translatez" && m[0] === 0) l = [...L];
|
|
114
|
+
else if (f === "scale") l = H(m[0], m[1] ?? m[0]);
|
|
115
|
+
else if (f === "scalex") l = H(m[0], 1);
|
|
116
|
+
else if (f === "scaley") l = H(1, m[0]);
|
|
117
|
+
else if (f === "rotate" || f === "rotatez") {
|
|
118
|
+
const n = u(0);
|
|
119
|
+
l = [Math.cos(n), Math.sin(n), -Math.sin(n), Math.cos(n), 0, 0];
|
|
129
120
|
} else return null;
|
|
130
|
-
e = it(e,
|
|
121
|
+
e = it(e, l);
|
|
131
122
|
}
|
|
132
123
|
return o.replace(/\s/g, "") === s.replace(/\s/g, "") ? e : null;
|
|
133
124
|
}
|
|
134
|
-
function
|
|
125
|
+
function G(s, r) {
|
|
135
126
|
return { schema: s, value: r, velocity: r.map(() => 0) };
|
|
136
127
|
}
|
|
137
|
-
const
|
|
128
|
+
const J = /[-+]?(?:\d*\.\d+|\d+\.?\d*)(?:e[-+]?\d+)?/gi, _ = (s) => [
|
|
138
129
|
s[0],
|
|
139
130
|
s[2],
|
|
140
131
|
s[4],
|
|
@@ -145,7 +136,7 @@ const Q = /[-+]?(?:\d*\.\d+|\d+\.?\d*)(?:e[-+]?\d+)?/gi, A = (s) => [
|
|
|
145
136
|
0,
|
|
146
137
|
1
|
|
147
138
|
];
|
|
148
|
-
function
|
|
139
|
+
function T(s, r) {
|
|
149
140
|
return Array.from({ length: 9 }, (t, e) => {
|
|
150
141
|
const i = Math.floor(e / 3), o = e % 3;
|
|
151
142
|
return s[i * 3] * r[o] + s[i * 3 + 1] * r[o + 3] + s[i * 3 + 2] * r[o + 6];
|
|
@@ -154,19 +145,19 @@ function B(s, r) {
|
|
|
154
145
|
function rt(s) {
|
|
155
146
|
return Math.abs(s[8]) < 1e-8 || !s.every(Number.isFinite) ? null : s.map((r) => r / s[8]);
|
|
156
147
|
}
|
|
157
|
-
function
|
|
158
|
-
const e =
|
|
159
|
-
if (e) return
|
|
148
|
+
function Q(s, r, t) {
|
|
149
|
+
const e = mt(s, r, t);
|
|
150
|
+
if (e) return _(e);
|
|
160
151
|
if (typeof DOMMatrix > "u") return null;
|
|
161
152
|
const i = s.replace(
|
|
162
153
|
/(translate(?:3d|X|Y)?)\(([^()]*)\)/gi,
|
|
163
|
-
(o,
|
|
164
|
-
const
|
|
165
|
-
if (!
|
|
166
|
-
const
|
|
167
|
-
return `${Number.parseFloat(
|
|
154
|
+
(o, d, f) => {
|
|
155
|
+
const c = f.split(/\s*,\s*|\s+/).map((m, g) => {
|
|
156
|
+
if (!m.endsWith("%")) return m;
|
|
157
|
+
const u = d.toLowerCase() === "translatey" || g === 1 ? t : r;
|
|
158
|
+
return `${Number.parseFloat(m) * u / 100}px`;
|
|
168
159
|
});
|
|
169
|
-
return `${
|
|
160
|
+
return `${d}(${c.join(",")})`;
|
|
170
161
|
}
|
|
171
162
|
);
|
|
172
163
|
try {
|
|
@@ -186,134 +177,96 @@ function tt(s, r, t) {
|
|
|
186
177
|
return null;
|
|
187
178
|
}
|
|
188
179
|
}
|
|
189
|
-
const
|
|
190
|
-
function
|
|
191
|
-
var
|
|
192
|
-
const r = s.offsetWidth || 1, t = s.offsetHeight || 1, e = typeof getComputedStyle == "function" ? getComputedStyle(s) : null, i = ((e == null ? void 0 : e.transformOrigin) || `${r / 2}px ${t / 2}px`).split(" "), o = Number.parseFloat(i[0]) || 0,
|
|
193
|
-
let
|
|
180
|
+
const tt = "viewport-plane-v1";
|
|
181
|
+
function $(s) {
|
|
182
|
+
var S;
|
|
183
|
+
const r = s.offsetWidth || 1, t = s.offsetHeight || 1, e = typeof getComputedStyle == "function" ? getComputedStyle(s) : null, i = ((e == null ? void 0 : e.transformOrigin) || `${r / 2}px ${t / 2}px`).split(" "), o = Number.parseFloat(i[0]) || 0, d = Number.parseFloat(i[1]) || 0;
|
|
184
|
+
let f = !0;
|
|
194
185
|
if (typeof getComputedStyle == "function")
|
|
195
|
-
for (let
|
|
196
|
-
const
|
|
197
|
-
if (
|
|
198
|
-
|
|
186
|
+
for (let C = s.parentElement; C; C = C.parentElement) {
|
|
187
|
+
const w = getComputedStyle(C);
|
|
188
|
+
if (w.transform && w.transform !== "none" || w.perspective && w.perspective !== "none") {
|
|
189
|
+
f = !1;
|
|
199
190
|
break;
|
|
200
191
|
}
|
|
201
192
|
}
|
|
202
|
-
const
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
),
|
|
193
|
+
const c = (S = s.getBoundingClientRect) == null ? void 0 : S.call(s), m = Q((e == null ? void 0 : e.transform) || "", r, t) ?? _(L), g = T(
|
|
194
|
+
T(_(P(o, d)), m),
|
|
195
|
+
_(P(-o, -d))
|
|
196
|
+
), u = [
|
|
206
197
|
[0, 0],
|
|
207
198
|
[r, 0],
|
|
208
199
|
[0, t],
|
|
209
200
|
[r, t]
|
|
210
|
-
].map(([
|
|
211
|
-
const
|
|
201
|
+
].map(([C, w]) => {
|
|
202
|
+
const k = g[6] * C + g[7] * w + g[8];
|
|
212
203
|
return [
|
|
213
|
-
(g[0] *
|
|
214
|
-
(g[3] *
|
|
204
|
+
(g[0] * C + g[1] * w + g[2]) / k,
|
|
205
|
+
(g[3] * C + g[4] * w + g[5]) / k
|
|
215
206
|
];
|
|
216
|
-
}),
|
|
207
|
+
}), l = ((c == null ? void 0 : c.left) ?? 0) - Math.min(...u.map((C) => C[0])), n = ((c == null ? void 0 : c.top) ?? 0) - Math.min(...u.map((C) => C[1])), y = P(l + o, n + d), a = it(P(-o, -d), H(r, t)), p = _(Y(y)), b = _(Y(a));
|
|
217
208
|
return {
|
|
218
|
-
frame:
|
|
219
|
-
read(
|
|
220
|
-
const
|
|
221
|
-
for (const [
|
|
222
|
-
const
|
|
223
|
-
if (
|
|
224
|
-
if (!
|
|
225
|
-
const R =
|
|
209
|
+
frame: f ? { left: l, top: n, width: r, height: t } : void 0,
|
|
210
|
+
read(C) {
|
|
211
|
+
const w = {};
|
|
212
|
+
for (const [k, A] of Object.entries(C)) {
|
|
213
|
+
const M = String(A);
|
|
214
|
+
if (k === "transform") {
|
|
215
|
+
if (!f) continue;
|
|
216
|
+
const R = Q(M, r, t), x = R && rt(T(T(_(y), R), _(a)));
|
|
226
217
|
if (x) {
|
|
227
|
-
const [
|
|
228
|
-
if (
|
|
229
|
-
|
|
230
|
-
|
|
231
|
-
|
|
232
|
-
Math.atan2(
|
|
233
|
-
|
|
234
|
-
(
|
|
235
|
-
(
|
|
236
|
-
|
|
218
|
+
const [j, N, I, O, V, B, D, v] = x, q = j - I * D, z = O - B * D, Z = N - I * v, X = V - B * v, W = Math.hypot(q, z);
|
|
219
|
+
if (W > 1e-8) {
|
|
220
|
+
w[k] = G(tt, [
|
|
221
|
+
I,
|
|
222
|
+
B,
|
|
223
|
+
Math.atan2(z, q),
|
|
224
|
+
W,
|
|
225
|
+
(q * X - z * Z) / W,
|
|
226
|
+
(q * Z + z * X) / W,
|
|
227
|
+
D,
|
|
237
228
|
v
|
|
238
229
|
]);
|
|
239
230
|
continue;
|
|
240
231
|
}
|
|
241
232
|
}
|
|
242
233
|
}
|
|
243
|
-
const
|
|
234
|
+
const F = [...M.matchAll(J)].map(
|
|
244
235
|
(R) => Number(R[0])
|
|
245
236
|
);
|
|
246
|
-
|
|
247
|
-
`css:${
|
|
248
|
-
|
|
237
|
+
F.length && F.every(Number.isFinite) && (w[k] = G(
|
|
238
|
+
`css:${M.replace(J, "#")}`,
|
|
239
|
+
F
|
|
249
240
|
));
|
|
250
241
|
}
|
|
251
|
-
return
|
|
242
|
+
return w;
|
|
252
243
|
},
|
|
253
|
-
write(
|
|
254
|
-
const
|
|
255
|
-
for (const [
|
|
256
|
-
if (
|
|
257
|
-
const [
|
|
258
|
-
V * x +
|
|
259
|
-
V *
|
|
260
|
-
|
|
261
|
-
|
|
262
|
-
|
|
263
|
-
|
|
264
|
-
|
|
244
|
+
write(C) {
|
|
245
|
+
const w = {};
|
|
246
|
+
for (const [k, A] of Object.entries(C))
|
|
247
|
+
if (k === "transform" && A.schema === tt) {
|
|
248
|
+
const [M, F, R, x, j, N, I, O] = A.value, V = Math.cos(R), B = Math.sin(R), D = [
|
|
249
|
+
V * x + M * I,
|
|
250
|
+
V * N - B * j + M * O,
|
|
251
|
+
M,
|
|
252
|
+
B * x + F * I,
|
|
253
|
+
B * N + V * j + F * O,
|
|
254
|
+
F,
|
|
255
|
+
I,
|
|
265
256
|
O,
|
|
266
257
|
1
|
|
267
|
-
], v =
|
|
268
|
-
Math.abs(v[6]) + Math.abs(v[7]) < 1e-10 && Math.abs(v[8] - 1) < 1e-10 ?
|
|
269
|
-
} else if (
|
|
270
|
-
let
|
|
271
|
-
|
|
258
|
+
], v = T(T(p, D), b);
|
|
259
|
+
Math.abs(v[6]) + Math.abs(v[7]) < 1e-10 && Math.abs(v[8] - 1) < 1e-10 ? w[k] = `matrix(${[v[0], v[3], v[1], v[4], v[2], v[5]].join(",")})` : w[k] = `matrix3d(${[v[0], v[3], 0, v[6], v[1], v[4], 0, v[7], 0, 0, 1, 0, v[2], v[5], 0, v[8]].join(",")})`;
|
|
260
|
+
} else if (A.schema.startsWith("css:")) {
|
|
261
|
+
let M = 0;
|
|
262
|
+
w[k] = A.schema.slice(4).replace(/#/g, () => String(A.value[M++]));
|
|
272
263
|
}
|
|
273
|
-
return
|
|
264
|
+
return w;
|
|
274
265
|
}
|
|
275
266
|
};
|
|
276
267
|
}
|
|
277
|
-
const
|
|
278
|
-
class
|
|
279
|
-
constructor() {
|
|
280
|
-
h(this, "drivers", /* @__PURE__ */ new Set());
|
|
281
|
-
h(this, "observers", /* @__PURE__ */ new Set());
|
|
282
|
-
h(this, "frameRequest", null);
|
|
283
|
-
h(this, "previousTimestamp", null);
|
|
284
|
-
h(this, "tick", (r) => {
|
|
285
|
-
this.frameRequest = null;
|
|
286
|
-
const t = this.previousTimestamp === null ? bt : Math.max(0, r - this.previousTimestamp);
|
|
287
|
-
this.previousTimestamp = r;
|
|
288
|
-
const e = {
|
|
289
|
-
delta: Math.min(t, nt),
|
|
290
|
-
rawDelta: t
|
|
291
|
-
};
|
|
292
|
-
this.runPhase(this.drivers, e), this.runPhase(this.observers, e), this.hasCallbacks() ? this.requestFrame() : this.previousTimestamp = null;
|
|
293
|
-
});
|
|
294
|
-
}
|
|
295
|
-
subscribe(r, t = "drive") {
|
|
296
|
-
const e = t === "drive" ? this.drivers : this.observers;
|
|
297
|
-
return e.add(r), this.requestFrame(), () => {
|
|
298
|
-
e.delete(r), this.stopIfIdle();
|
|
299
|
-
};
|
|
300
|
-
}
|
|
301
|
-
requestFrame() {
|
|
302
|
-
this.frameRequest !== null || !this.hasCallbacks() || (this.frameRequest = requestAnimationFrame(this.tick));
|
|
303
|
-
}
|
|
304
|
-
runPhase(r, t) {
|
|
305
|
-
for (const e of [...r])
|
|
306
|
-
r.has(e) && e(t);
|
|
307
|
-
}
|
|
308
|
-
hasCallbacks() {
|
|
309
|
-
return this.drivers.size > 0 || this.observers.size > 0;
|
|
310
|
-
}
|
|
311
|
-
stopIfIdle() {
|
|
312
|
-
this.hasCallbacks() || (this.frameRequest !== null && typeof cancelAnimationFrame < "u" && cancelAnimationFrame(this.frameRequest), this.frameRequest = null, this.previousTimestamp = null);
|
|
313
|
-
}
|
|
314
|
-
}
|
|
315
|
-
const at = new wt(), Ct = 2;
|
|
316
|
-
class ot extends st {
|
|
268
|
+
const gt = 1e3 / 60;
|
|
269
|
+
class nt extends st {
|
|
317
270
|
constructor(t) {
|
|
318
271
|
super();
|
|
319
272
|
h(this, "_element");
|
|
@@ -332,11 +285,6 @@ class ot extends st {
|
|
|
332
285
|
h(this, "frames", []);
|
|
333
286
|
h(this, "waapi", null);
|
|
334
287
|
h(this, "runId", 0);
|
|
335
|
-
h(this, "waitingForStart", !1);
|
|
336
|
-
h(this, "startReady", !1);
|
|
337
|
-
h(this, "pendingFirstFrame");
|
|
338
|
-
h(this, "stopStartupClock", null);
|
|
339
|
-
h(this, "startupStableFrames", 0);
|
|
340
288
|
h(this, "running", !1);
|
|
341
289
|
h(this, "paused", !1);
|
|
342
290
|
h(this, "settled", !1);
|
|
@@ -381,11 +329,7 @@ class ot extends st {
|
|
|
381
329
|
var e;
|
|
382
330
|
const t = this.reversing;
|
|
383
331
|
if (this.reversing = !1, this.paused && this.waapi && !t) {
|
|
384
|
-
|
|
385
|
-
this.startReady && this.startFramePacedPlayback(this.waapi);
|
|
386
|
-
return;
|
|
387
|
-
}
|
|
388
|
-
this.waapi.play(), (e = this.fallbackCopy) == null || e.play();
|
|
332
|
+
this.paused = !1, this.running = !0, this.waapi.play(), (e = this.fallbackCopy) == null || e.play();
|
|
389
333
|
return;
|
|
390
334
|
}
|
|
391
335
|
this.runToward(this.upperBound);
|
|
@@ -394,8 +338,8 @@ class ot extends st {
|
|
|
394
338
|
this.reversing = !0, this.runToward(this.lowerBound);
|
|
395
339
|
}
|
|
396
340
|
pause() {
|
|
397
|
-
var t, e
|
|
398
|
-
this.running && (this.captureLiveState(), (t = this.waapi) == null || t.pause(), (e = this.fallbackCopy) == null || e.pause(),
|
|
341
|
+
var t, e;
|
|
342
|
+
this.running && (this.captureLiveState(), (t = this.waapi) == null || t.pause(), (e = this.fallbackCopy) == null || e.pause(), this.running = !1, this.paused = !0);
|
|
399
343
|
}
|
|
400
344
|
complete() {
|
|
401
345
|
this.settled || (this.clearWaapi(), this.running = !1, this.paused = !1, this.currentValue = this.upperBound, this.currentVelocity = 0, this.applyStyleAt(this.currentValue), this.settled = !0, this.finish());
|
|
@@ -431,7 +375,7 @@ class ot extends st {
|
|
|
431
375
|
}
|
|
432
376
|
finish() {
|
|
433
377
|
var t, e, i, o;
|
|
434
|
-
this.presentationTime = ((t = this.frames[this.frames.length - 1]) == null ? void 0 : t.time) ?? 0, this.solverState = void 0, (e = this.hold) == null || e.cancel(), this.hold = null, this.applyStyleAt(this.currentValue), this.clearWaapi(), (i = this.fallbackCopy) == null || i.cancel({ reason: "disposed", owns: () => !0 }), this.fallbackCopy = null, this.deferDisposal || this.disposeResources(
|
|
378
|
+
this.presentationTime = ((t = this.frames[this.frames.length - 1]) == null ? void 0 : t.time) ?? 0, this.solverState = void 0, (e = this.hold) == null || e.cancel(), this.hold = null, this.applyStyleAt(this.currentValue), this.clearWaapi(), (i = this.fallbackCopy) == null || i.cancel({ reason: "disposed", owns: () => !0 }), this.fallbackCopy = null, this.deferDisposal || this.disposeResources(E), (o = this.onComplete) == null || o.call(this);
|
|
435
379
|
}
|
|
436
380
|
get motionIdentity() {
|
|
437
381
|
return {
|
|
@@ -444,11 +388,11 @@ class ot extends st {
|
|
|
444
388
|
}
|
|
445
389
|
/** Final output, including any earlier residual, is the next handoff's source. */
|
|
446
390
|
getMotionSnapshot() {
|
|
447
|
-
var o,
|
|
391
|
+
var o, d;
|
|
448
392
|
this.running && this.captureLiveState();
|
|
449
393
|
const t = this.samplePresentation(
|
|
450
|
-
|
|
451
|
-
), e = this.paused
|
|
394
|
+
et(this.waapi) ?? this.presentationTime
|
|
395
|
+
), e = this.paused ? 0 : this.playbackRate, i = {
|
|
452
396
|
...this.styleFn(
|
|
453
397
|
this.currentValue,
|
|
454
398
|
this.lowerBound + this.upperBound - this.currentValue
|
|
@@ -459,21 +403,21 @@ class ot extends st {
|
|
|
459
403
|
...this.motionIdentity,
|
|
460
404
|
displayStyle: i,
|
|
461
405
|
inlineStyle: this.element.style.cssText,
|
|
462
|
-
frame: (
|
|
406
|
+
frame: (d = this.codec) == null ? void 0 : d.frame,
|
|
463
407
|
channels: Object.fromEntries(
|
|
464
|
-
Object.entries(t).map(([
|
|
465
|
-
|
|
408
|
+
Object.entries(t).map(([f, c]) => [
|
|
409
|
+
f,
|
|
466
410
|
{
|
|
467
|
-
...
|
|
468
|
-
velocity:
|
|
411
|
+
...c,
|
|
412
|
+
velocity: c.velocity.map((m) => m * e)
|
|
469
413
|
}
|
|
470
414
|
])
|
|
471
415
|
)
|
|
472
416
|
};
|
|
473
417
|
}
|
|
474
418
|
adopt(t) {
|
|
475
|
-
var
|
|
476
|
-
this.codec ?? (this.codec = this.motion.codec ??
|
|
419
|
+
var f, c, m, g, u;
|
|
420
|
+
this.codec ?? (this.codec = this.motion.codec ?? $(this.element)), this.adopted = t;
|
|
477
421
|
const e = this.codec.read({
|
|
478
422
|
transform: "none",
|
|
479
423
|
opacity: 1,
|
|
@@ -487,49 +431,49 @@ class ot extends st {
|
|
|
487
431
|
this.currentValue,
|
|
488
432
|
this.lowerBound + this.upperBound - this.currentValue
|
|
489
433
|
), o = t.displayStyle;
|
|
490
|
-
for (const [
|
|
491
|
-
|
|
492
|
-
for (const [
|
|
493
|
-
const y = e[
|
|
494
|
-
y && !
|
|
434
|
+
for (const [l, n] of Object.entries(o ?? {}))
|
|
435
|
+
l in i && String(n) !== String(i[l]) && (!t.channels[l] || !e[l]) && this.fallbackChannels.add(l);
|
|
436
|
+
for (const [l, n] of Object.entries(t.channels)) {
|
|
437
|
+
const y = e[l];
|
|
438
|
+
y && !U(n, y) && this.fallbackChannels.add(l);
|
|
495
439
|
}
|
|
496
440
|
if (this.fallbackChannels.size && (this.fallbackMode = "finish"), this.fallbackChannels.size && this.motion.fallback !== "finish") {
|
|
497
|
-
const
|
|
498
|
-
if (
|
|
499
|
-
|
|
441
|
+
const l = t;
|
|
442
|
+
if (l.frame && l.displayStyle && t.target.cloneNode && t.target.parentElement && !t.target.shadowRoot && !((c = (f = t.target).matches) != null && c.call(
|
|
443
|
+
f,
|
|
500
444
|
"canvas, video, audio, iframe, object, embed"
|
|
501
|
-
)) && !((g = (
|
|
502
|
-
|
|
445
|
+
)) && !((g = (m = t.target).querySelector) != null && g.call(
|
|
446
|
+
m,
|
|
503
447
|
"canvas, video, audio, iframe, object, embed"
|
|
504
448
|
))) {
|
|
505
449
|
this.fallbackMode = "crossfade";
|
|
506
450
|
const n = t.target.cloneNode(!0);
|
|
507
451
|
n.removeAttribute("id"), n.removeAttribute("data-ssgoi-transition");
|
|
508
|
-
for (const
|
|
452
|
+
for (const a of n.querySelectorAll(
|
|
509
453
|
"[id], [data-ssgoi-transition]"
|
|
510
454
|
))
|
|
511
|
-
|
|
512
|
-
n.style.cssText =
|
|
455
|
+
a.removeAttribute("id"), a.removeAttribute("data-ssgoi-transition");
|
|
456
|
+
n.style.cssText = l.inlineStyle ?? "", Object.assign(n.style, l.displayStyle, {
|
|
513
457
|
position: "fixed",
|
|
514
|
-
left: `${
|
|
515
|
-
top: `${
|
|
516
|
-
width: `${
|
|
517
|
-
height: `${
|
|
458
|
+
left: `${l.frame.left}px`,
|
|
459
|
+
top: `${l.frame.top}px`,
|
|
460
|
+
width: `${l.frame.width}px`,
|
|
461
|
+
height: `${l.frame.height}px`,
|
|
518
462
|
margin: "0",
|
|
519
463
|
pointerEvents: "none",
|
|
520
464
|
zIndex: "2147483646"
|
|
521
465
|
}), n.setAttribute("aria-hidden", "true"), n.inert = !0, t.target.parentElement.appendChild(n);
|
|
522
|
-
const y = Number(
|
|
523
|
-
this.fallbackCopy = new
|
|
466
|
+
const y = Number(l.displayStyle.opacity ?? 1);
|
|
467
|
+
this.fallbackCopy = new nt({
|
|
524
468
|
element: n,
|
|
525
469
|
integrator: {
|
|
526
|
-
step: (
|
|
527
|
-
position: Math.min(
|
|
470
|
+
step: (a, p, b) => ({
|
|
471
|
+
position: Math.min(p, a.position + b / 0.18),
|
|
528
472
|
velocity: 0
|
|
529
473
|
}),
|
|
530
|
-
isSettled: (
|
|
474
|
+
isSettled: (a, p) => a.position >= p
|
|
531
475
|
},
|
|
532
|
-
style: (
|
|
476
|
+
style: (a, p) => ({ opacity: y * p }),
|
|
533
477
|
onDispose: () => n.remove()
|
|
534
478
|
}), this.adopted = {
|
|
535
479
|
...t,
|
|
@@ -540,8 +484,8 @@ class ot extends st {
|
|
|
540
484
|
};
|
|
541
485
|
}
|
|
542
486
|
}
|
|
543
|
-
const
|
|
544
|
-
(
|
|
487
|
+
const d = this.codec.write(this.adopted.channels);
|
|
488
|
+
(u = this.hold) == null || u.cancel(), Object.keys(d).length && (this.hold = this.element.animate([d], {
|
|
545
489
|
duration: 1,
|
|
546
490
|
fill: "both"
|
|
547
491
|
}), this.hold.pause(), this.hold.currentTime = 0);
|
|
@@ -551,7 +495,7 @@ class ot extends st {
|
|
|
551
495
|
const e = this.presentationFrames[t];
|
|
552
496
|
if (e) return e.channels;
|
|
553
497
|
const i = this.frames[t];
|
|
554
|
-
return this.codec ?? (this.codec = this.motion.codec ??
|
|
498
|
+
return this.codec ?? (this.codec = this.motion.codec ?? $(this.element)), this.codec.read({
|
|
555
499
|
transform: "none",
|
|
556
500
|
opacity: 1,
|
|
557
501
|
...this.styleFn(
|
|
@@ -563,7 +507,7 @@ class ot extends st {
|
|
|
563
507
|
samplePresentation(t) {
|
|
564
508
|
const e = this.frames;
|
|
565
509
|
if (!e.length)
|
|
566
|
-
return this.adopted ? { ...this.adopted.channels } : (this.codec ?? (this.codec = this.motion.codec ??
|
|
510
|
+
return this.adopted ? { ...this.adopted.channels } : (this.codec ?? (this.codec = this.motion.codec ?? $(this.element)), this.codec.read({
|
|
567
511
|
transform: "none",
|
|
568
512
|
opacity: 1,
|
|
569
513
|
...this.styleFn(
|
|
@@ -573,22 +517,22 @@ class ot extends st {
|
|
|
573
517
|
}));
|
|
574
518
|
let i = e.findIndex((n) => n.time > t);
|
|
575
519
|
i < 0 && (i = e.length - 1);
|
|
576
|
-
const o = Math.max(0, i - 1),
|
|
577
|
-
for (const [n, y] of Object.entries(
|
|
578
|
-
const
|
|
579
|
-
if (!
|
|
580
|
-
|
|
520
|
+
const o = Math.max(0, i - 1), d = e[o], f = e[i], c = this.channelsAt(o), m = o === i ? c : this.channelsAt(i), g = (f.time - d.time) / 1e3, u = g ? Math.max(0, Math.min(1, (t - d.time) / (g * 1e3))) : 0, l = {};
|
|
521
|
+
for (const [n, y] of Object.entries(c)) {
|
|
522
|
+
const a = m[n];
|
|
523
|
+
if (!a || !U(y, a)) {
|
|
524
|
+
l[n] = y;
|
|
581
525
|
continue;
|
|
582
526
|
}
|
|
583
|
-
|
|
527
|
+
l[n] = {
|
|
584
528
|
schema: y.schema,
|
|
585
|
-
value: y.value.map((
|
|
529
|
+
value: y.value.map((p, b) => p + (a.value[b] - p) * u),
|
|
586
530
|
velocity: y.value.map(
|
|
587
|
-
(
|
|
531
|
+
(p, b) => t >= e[e.length - 1].time || !g ? 0 : (a.value[b] - p) / g
|
|
588
532
|
)
|
|
589
533
|
};
|
|
590
534
|
}
|
|
591
|
-
return
|
|
535
|
+
return l;
|
|
592
536
|
}
|
|
593
537
|
/**
|
|
594
538
|
* Drop the WAAPI forwards-fill after the run has settled, letting inline
|
|
@@ -644,12 +588,12 @@ class ot extends st {
|
|
|
644
588
|
}
|
|
645
589
|
getTimeline() {
|
|
646
590
|
const t = this.frames.map((e, i) => {
|
|
647
|
-
const o = e.position,
|
|
591
|
+
const o = e.position, d = this.lowerBound + this.upperBound - o;
|
|
648
592
|
return {
|
|
649
593
|
time: e.time,
|
|
650
594
|
value: e.position,
|
|
651
595
|
velocity: e.velocity,
|
|
652
|
-
style: this.renderedStyles[i] ?? this.styleFn(o,
|
|
596
|
+
style: this.renderedStyles[i] ?? this.styleFn(o, d)
|
|
653
597
|
};
|
|
654
598
|
});
|
|
655
599
|
return [{ element: this._element, frames: t }];
|
|
@@ -660,12 +604,12 @@ class ot extends st {
|
|
|
660
604
|
}
|
|
661
605
|
/* ───────────────────────────────────────────────────────── private */
|
|
662
606
|
runToward(t) {
|
|
663
|
-
var
|
|
607
|
+
var m, g;
|
|
664
608
|
if (this.validate(), this.running || this.paused) {
|
|
665
|
-
const
|
|
666
|
-
this.captureLiveState(), this.adopted =
|
|
609
|
+
const u = this.getMotionSnapshot();
|
|
610
|
+
this.captureLiveState(), this.adopted = u;
|
|
667
611
|
}
|
|
668
|
-
if (this.clearWaapi(), this.running = !1, this.paused = !1, this.settled = !1, this.disposed = !1, this.presentationTime = 0, this.presentationFrames = [], this.solverTarget = t, this.frames =
|
|
612
|
+
if (this.clearWaapi(), this.running = !1, this.paused = !1, this.settled = !1, this.disposed = !1, this.presentationTime = 0, this.presentationFrames = [], this.solverTarget = t, this.frames = ct(
|
|
669
613
|
this._integrator,
|
|
670
614
|
this.currentValue,
|
|
671
615
|
t,
|
|
@@ -676,17 +620,19 @@ class ot extends st {
|
|
|
676
620
|
this.currentValue = t, this.currentVelocity = 0, this.applyStyleAt(t), this.settled = !0, this.finish();
|
|
677
621
|
return;
|
|
678
622
|
}
|
|
679
|
-
const e = (
|
|
623
|
+
const e = (u) => this.styleFn(u.position, this.lowerBound + this.upperBound - u.position), i = this.adopted ? this.bridgeKeyframes(e) : this.frames.map((u) => e(u));
|
|
680
624
|
this.renderedStyles = i, this.adopted = void 0;
|
|
681
|
-
const o = i[0],
|
|
682
|
-
|
|
625
|
+
const o = i[0], d = this.frames[this.frames.length - 1], f = d.time;
|
|
626
|
+
this.runId++;
|
|
627
|
+
const c = this._element.animate(i, {
|
|
628
|
+
duration: f,
|
|
683
629
|
fill: "both",
|
|
684
630
|
easing: "linear",
|
|
685
631
|
composite: "replace"
|
|
686
632
|
});
|
|
687
|
-
|
|
688
|
-
!this.running || this.waapi !==
|
|
689
|
-
}, this.
|
|
633
|
+
c.playbackRate = this.playbackRate, this.waapi = c, (m = this.fallbackCopy) == null || m.play(), (g = this.hold) == null || g.cancel(), this.hold = null, this.running = !0, c.onfinish = () => {
|
|
634
|
+
!this.running || this.waapi !== c || (this.running = !1, this.settled = !0, this.currentValue = d.position, this.currentVelocity = 0, this.finish());
|
|
635
|
+
}, this.clearInlineStyle(o), this.beginPlayback(c, f);
|
|
690
636
|
}
|
|
691
637
|
/**
|
|
692
638
|
* Bake the residual correction into the keyframes: each authored frame is
|
|
@@ -696,150 +642,150 @@ class ot extends st {
|
|
|
696
642
|
*/
|
|
697
643
|
bridgeKeyframes(t) {
|
|
698
644
|
var g;
|
|
699
|
-
this.codec = this.motion.codec ??
|
|
645
|
+
this.codec = this.motion.codec ?? $(this.element);
|
|
700
646
|
const e = this.codec, i = Math.max(16, this.motion.handoffDuration ?? 280), o = this.frames[this.frames.length - 1];
|
|
701
|
-
for (let
|
|
702
|
-
this.frames.push({ time:
|
|
703
|
-
const
|
|
704
|
-
(
|
|
647
|
+
for (let u = o.time + 1e3 / 60; u < i + 1e3 / 60; u += 1e3 / 60)
|
|
648
|
+
this.frames.push({ time: u, position: o.position, velocity: 0 });
|
|
649
|
+
const d = this.frames.map(
|
|
650
|
+
(u) => e.read({ transform: "none", opacity: 1, ...t(u) })
|
|
705
651
|
);
|
|
706
|
-
for (let
|
|
707
|
-
const
|
|
708
|
-
if ((
|
|
652
|
+
for (let u = 1; u < d.length; u++) {
|
|
653
|
+
const l = d[u - 1].transform, n = d[u].transform;
|
|
654
|
+
if ((l == null ? void 0 : l.schema) === "viewport-plane-v1" && (n == null ? void 0 : n.schema) === l.schema) {
|
|
709
655
|
const y = [...n.value];
|
|
710
|
-
y[2] =
|
|
711
|
-
Math.sin(y[2] -
|
|
712
|
-
Math.cos(y[2] -
|
|
713
|
-
),
|
|
656
|
+
y[2] = l.value[2] + Math.atan2(
|
|
657
|
+
Math.sin(y[2] - l.value[2]),
|
|
658
|
+
Math.cos(y[2] - l.value[2])
|
|
659
|
+
), d[u].transform = { ...n, value: y };
|
|
714
660
|
}
|
|
715
661
|
}
|
|
716
|
-
const
|
|
717
|
-
for (const [
|
|
662
|
+
const f = d[0], c = d[1] ?? f, m = {};
|
|
663
|
+
for (const [u, l] of Object.entries(
|
|
718
664
|
((g = this.adopted) == null ? void 0 : g.channels) ?? {}
|
|
719
665
|
)) {
|
|
720
|
-
let n =
|
|
666
|
+
let n = f[u];
|
|
721
667
|
if (!n) {
|
|
722
|
-
const
|
|
723
|
-
if (n = e.read(
|
|
724
|
-
for (const
|
|
668
|
+
const a = u === "transform" ? { transform: "none" } : u === "opacity" ? { opacity: 1 } : {};
|
|
669
|
+
if (n = e.read(a)[u], n)
|
|
670
|
+
for (const p of d) p[u] = n;
|
|
725
671
|
}
|
|
726
|
-
if (!n || !
|
|
727
|
-
const y = u
|
|
728
|
-
|
|
729
|
-
offset:
|
|
730
|
-
let b =
|
|
731
|
-
return
|
|
672
|
+
if (!n || !U(l, n)) continue;
|
|
673
|
+
const y = c[u] ?? n;
|
|
674
|
+
m[u] = {
|
|
675
|
+
offset: l.value.map((a, p) => {
|
|
676
|
+
let b = a - n.value[p];
|
|
677
|
+
return u === "transform" && l.schema === "viewport-plane-v1" && p === 2 && (b = Math.atan2(Math.sin(b), Math.cos(b))), b;
|
|
732
678
|
}),
|
|
733
|
-
velocity:
|
|
734
|
-
(
|
|
679
|
+
velocity: l.velocity.map(
|
|
680
|
+
(a, p) => a / Math.max(Math.abs(this.playbackRate), 1e-4) - (y.value[p] - n.value[p]) * 60
|
|
735
681
|
)
|
|
736
682
|
};
|
|
737
683
|
}
|
|
738
|
-
return this.presentationFrames = this.frames.map((
|
|
739
|
-
const n = { ...
|
|
740
|
-
for (const [y,
|
|
741
|
-
const
|
|
684
|
+
return this.presentationFrames = this.frames.map((u, l) => {
|
|
685
|
+
const n = { ...d[l] };
|
|
686
|
+
for (const [y, a] of Object.entries(m)) {
|
|
687
|
+
const p = n[y];
|
|
742
688
|
n[y] = {
|
|
743
|
-
...
|
|
744
|
-
value:
|
|
745
|
-
(b,
|
|
746
|
-
|
|
747
|
-
|
|
748
|
-
|
|
689
|
+
...p,
|
|
690
|
+
value: p.value.map(
|
|
691
|
+
(b, S) => b + ut(
|
|
692
|
+
a.offset[S],
|
|
693
|
+
a.velocity[S],
|
|
694
|
+
u.time / 1e3,
|
|
749
695
|
i / 1e3
|
|
750
696
|
).value
|
|
751
697
|
)
|
|
752
698
|
};
|
|
753
699
|
}
|
|
754
|
-
return { time:
|
|
755
|
-
}), this.frames.map((
|
|
756
|
-
const n = this.presentationFrames[
|
|
700
|
+
return { time: u.time, channels: n };
|
|
701
|
+
}), this.frames.map((u, l) => {
|
|
702
|
+
const n = this.presentationFrames[l].channels;
|
|
757
703
|
return {
|
|
758
|
-
...t(
|
|
704
|
+
...t(u),
|
|
759
705
|
...e.write(
|
|
760
706
|
Object.fromEntries(
|
|
761
|
-
Object.keys(
|
|
707
|
+
Object.keys(m).map((y) => [y, n[y]])
|
|
762
708
|
)
|
|
763
709
|
)
|
|
764
710
|
};
|
|
765
711
|
});
|
|
766
712
|
}
|
|
767
713
|
clearWaapi() {
|
|
768
|
-
var t
|
|
769
|
-
this.runId++, (t = this.waapi) == null || t.cancel(), this.waapi = null
|
|
714
|
+
var t;
|
|
715
|
+
this.runId++, (t = this.waapi) == null || t.cancel(), this.waapi = null;
|
|
770
716
|
}
|
|
771
717
|
captureLiveState() {
|
|
772
718
|
if (this.frames.length === 0) return;
|
|
773
|
-
const t =
|
|
719
|
+
const t = et(this.waapi);
|
|
774
720
|
if (t === null) return;
|
|
775
721
|
this.presentationTime = t;
|
|
776
|
-
const { position: e, velocity: i } =
|
|
777
|
-
this.currentValue = e, this.currentVelocity = i, this.solverState =
|
|
722
|
+
const { position: e, velocity: i } = dt(this.frames, t);
|
|
723
|
+
this.currentValue = e, this.currentVelocity = i, this.solverState = ft(
|
|
778
724
|
this.frames,
|
|
779
725
|
t,
|
|
780
726
|
this._integrator,
|
|
781
727
|
this.solverTarget
|
|
782
728
|
);
|
|
783
729
|
}
|
|
784
|
-
|
|
785
|
-
|
|
786
|
-
|
|
787
|
-
|
|
788
|
-
|
|
789
|
-
|
|
790
|
-
|
|
791
|
-
|
|
792
|
-
|
|
793
|
-
|
|
794
|
-
|
|
795
|
-
|
|
796
|
-
this._element.style[e] = "";
|
|
797
|
-
if (this.pendingFirstFrame = void 0, typeof requestAnimationFrame > "u" || this.playbackRate < 0) {
|
|
798
|
-
this.handOffToWaapi(t);
|
|
799
|
-
return;
|
|
800
|
-
}
|
|
801
|
-
this.startupStableFrames = 0, this.stopStartupClock = at.subscribe((e) => {
|
|
802
|
-
this.advanceFramePacedStartup(t, e);
|
|
803
|
-
});
|
|
804
|
-
}
|
|
805
|
-
}
|
|
806
|
-
advanceFramePacedStartup(t, e) {
|
|
807
|
-
if (this.waapi !== t || !this.running || this.paused || !this.waitingForStart)
|
|
808
|
-
return;
|
|
809
|
-
const i = this.frames[this.frames.length - 1];
|
|
810
|
-
if (!i) return;
|
|
811
|
-
const o = $(t) ?? 0, c = Math.min(
|
|
812
|
-
i.time,
|
|
813
|
-
o + e.delta * Math.max(0, this.playbackRate)
|
|
814
|
-
);
|
|
815
|
-
if (t.currentTime = c, this.captureLiveState(), c >= i.time) {
|
|
816
|
-
this.finishFramePacedRun(t, i);
|
|
730
|
+
/**
|
|
731
|
+
* `Element.animate()` auto-plays with a pending start time that the browser
|
|
732
|
+
* resolves at its next rendering update, after whatever the current task
|
|
733
|
+
* still has to do. The run is seeked one nominal frame in while pending, so
|
|
734
|
+
* its first painted frame follows the frame that showed its first keyframe.
|
|
735
|
+
* A negative rate takes WAAPI's own auto-rewind: `play()` seeks to the end
|
|
736
|
+
* and runs the baked path backwards.
|
|
737
|
+
*/
|
|
738
|
+
beginPlayback(t, e) {
|
|
739
|
+
const i = this.playbackRate;
|
|
740
|
+
if (i < 0) {
|
|
741
|
+
t.play();
|
|
817
742
|
return;
|
|
818
743
|
}
|
|
819
|
-
|
|
820
|
-
}
|
|
821
|
-
handOffToWaapi(t) {
|
|
822
|
-
var e;
|
|
823
|
-
this.waapi !== t || !this.running || this.paused || ((e = this.stopStartupClock) == null || e.call(this), this.stopStartupClock = null, this.waitingForStart = !1, this.startReady = !1, this.startupStableFrames = 0, t.play());
|
|
744
|
+
i > 0 && (t.currentTime = Math.min(e, gt * i));
|
|
824
745
|
}
|
|
825
|
-
|
|
826
|
-
|
|
827
|
-
|
|
746
|
+
clearInlineStyle(t) {
|
|
747
|
+
if (t)
|
|
748
|
+
for (const e of Object.keys(t))
|
|
749
|
+
this._element.style[e] = "";
|
|
828
750
|
}
|
|
829
751
|
applyStyleAt(t) {
|
|
830
752
|
const e = this.lowerBound + this.upperBound - t, i = this.styleFn(t, e);
|
|
831
|
-
for (const [o,
|
|
832
|
-
this._element.style[o] = typeof
|
|
753
|
+
for (const [o, d] of Object.entries(i))
|
|
754
|
+
this._element.style[o] = typeof d == "number" ? String(d) : d;
|
|
833
755
|
}
|
|
834
756
|
}
|
|
835
|
-
function
|
|
757
|
+
function et(s) {
|
|
836
758
|
const r = s == null ? void 0 : s.currentTime;
|
|
837
759
|
return typeof r == "number" ? r : null;
|
|
838
760
|
}
|
|
839
|
-
|
|
840
|
-
|
|
761
|
+
class yt {
|
|
762
|
+
constructor() {
|
|
763
|
+
h(this, "callbacks", /* @__PURE__ */ new Set());
|
|
764
|
+
h(this, "frameRequest", null);
|
|
765
|
+
h(this, "tick", () => {
|
|
766
|
+
this.frameRequest = null;
|
|
767
|
+
for (const r of [...this.callbacks])
|
|
768
|
+
this.callbacks.has(r) && r();
|
|
769
|
+
this.requestFrame();
|
|
770
|
+
});
|
|
771
|
+
}
|
|
772
|
+
subscribe(r) {
|
|
773
|
+
return this.callbacks.add(r), this.requestFrame(), () => {
|
|
774
|
+
this.callbacks.delete(r), this.stopIfIdle();
|
|
775
|
+
};
|
|
776
|
+
}
|
|
777
|
+
requestFrame() {
|
|
778
|
+
this.frameRequest !== null || this.callbacks.size === 0 || (this.frameRequest = requestAnimationFrame(this.tick));
|
|
779
|
+
}
|
|
780
|
+
stopIfIdle() {
|
|
781
|
+
this.callbacks.size > 0 || this.frameRequest === null || (typeof cancelAnimationFrame < "u" && cancelAnimationFrame(this.frameRequest), this.frameRequest = null);
|
|
782
|
+
}
|
|
783
|
+
}
|
|
784
|
+
const vt = new yt();
|
|
785
|
+
function bt(s) {
|
|
786
|
+
return typeof s.step == "function" ? s : pt.from(s);
|
|
841
787
|
}
|
|
842
|
-
class
|
|
788
|
+
class ot extends st {
|
|
843
789
|
constructor(t, e = {}) {
|
|
844
790
|
super();
|
|
845
791
|
h(this, "_children");
|
|
@@ -861,7 +807,7 @@ class lt extends st {
|
|
|
861
807
|
), this._children = Array.isArray(t) ? [...t] : [...this.namedChildren.values()];
|
|
862
808
|
for (const i of this._children) i.deferDisposal = !0;
|
|
863
809
|
this.progressChildren = this._children.filter(
|
|
864
|
-
(i) => !(i instanceof
|
|
810
|
+
(i) => !(i instanceof ot) || i.progressChildren.length > 0
|
|
865
811
|
), (e.mode ?? "parallel") === "sequence" ? this._startAt = this._children.map((i, o) => o === 0 ? 0 : 1) : this._startAt = e.startAt ?? [];
|
|
866
812
|
}
|
|
867
813
|
/** Child animations in play order. */
|
|
@@ -898,7 +844,7 @@ class lt extends st {
|
|
|
898
844
|
set(t, e) {
|
|
899
845
|
if (typeof t == "string") {
|
|
900
846
|
const i = this.select(t);
|
|
901
|
-
return (e == null ? void 0 : e.integrator) !== void 0 && i.set({ integrator:
|
|
847
|
+
return (e == null ? void 0 : e.integrator) !== void 0 && i.set({ integrator: bt(e.integrator) }), this;
|
|
902
848
|
}
|
|
903
849
|
return super.set(t);
|
|
904
850
|
}
|
|
@@ -922,8 +868,8 @@ class lt extends st {
|
|
|
922
868
|
this.settled = !0, this.running = !1, this.clearPendingStartObservers(), this.restoreCompletionHandlers();
|
|
923
869
|
for (const e of this._children) e.complete();
|
|
924
870
|
if (!this.deferDisposal) {
|
|
925
|
-
for (const e of this._children) e.cancel(
|
|
926
|
-
this.disposeResources(
|
|
871
|
+
for (const e of this._children) e.cancel(E);
|
|
872
|
+
this.disposeResources(E);
|
|
927
873
|
}
|
|
928
874
|
(t = this.onComplete) == null || t.call(this);
|
|
929
875
|
}
|
|
@@ -987,68 +933,66 @@ class lt extends st {
|
|
|
987
933
|
}
|
|
988
934
|
/* ───────────────────────────────────────────────────────── private */
|
|
989
935
|
startRun(t) {
|
|
990
|
-
const e = this.buildDependencies(), i = this.pausedRun && t === this.lastMethod, o = t !== this.lastMethod,
|
|
991
|
-
this._children.filter((
|
|
992
|
-
),
|
|
936
|
+
const e = this.buildDependencies(), i = this.pausedRun && t === this.lastMethod, o = t !== this.lastMethod, d = new Set(this.startedChildren), f = new Set(
|
|
937
|
+
this._children.filter((a) => a.isComplete)
|
|
938
|
+
), c = t === "reverse" && d.size ? this._children.filter((a) => d.has(a)) : [...this._children], m = t === "reverse" ? [...c].reverse() : c, g = /* @__PURE__ */ new Map();
|
|
993
939
|
if (t === "reverse")
|
|
994
|
-
for (const [
|
|
995
|
-
if (!
|
|
940
|
+
for (const [a, p] of e) {
|
|
941
|
+
if (!c.includes(a) || !c.includes(p.after))
|
|
996
942
|
continue;
|
|
997
|
-
const b = g.get(
|
|
943
|
+
const b = g.get(p.after) ?? [];
|
|
998
944
|
b.push({
|
|
999
|
-
after:
|
|
1000
|
-
at:
|
|
1001
|
-
}), g.set(
|
|
945
|
+
after: a,
|
|
946
|
+
at: p.at === "settled" ? "settled" : 1 - p.at
|
|
947
|
+
}), g.set(p.after, b);
|
|
1002
948
|
}
|
|
1003
949
|
else
|
|
1004
|
-
for (const [
|
|
1005
|
-
g.set(
|
|
950
|
+
for (const [a, p] of e)
|
|
951
|
+
g.set(a, [p]);
|
|
1006
952
|
if (o || i)
|
|
1007
|
-
for (const
|
|
1008
|
-
|
|
953
|
+
for (const a of d)
|
|
954
|
+
f.has(a) || g.delete(a);
|
|
1009
955
|
this.running && this.pause(), this.restoreCompletionHandlers();
|
|
1010
|
-
const
|
|
1011
|
-
if (this.running = !0, this.pausedRun = !1, this.lastMethod = t, this.disposed = !1, this.settled = !1, this.pendingComplete =
|
|
956
|
+
const u = ++this.runId;
|
|
957
|
+
if (this.running = !0, this.pausedRun = !1, this.lastMethod = t, this.disposed = !1, this.settled = !1, this.pendingComplete = c.length, !i && !o && this.startedChildren.clear(), this.pendingComplete === 0) {
|
|
1012
958
|
this.handleFinished();
|
|
1013
959
|
return;
|
|
1014
960
|
}
|
|
1015
|
-
const
|
|
961
|
+
const l = /* @__PURE__ */ new Set(), n = /* @__PURE__ */ new Set();
|
|
1016
962
|
if (i)
|
|
1017
|
-
for (const
|
|
1018
|
-
|
|
1019
|
-
for (const
|
|
1020
|
-
const
|
|
1021
|
-
if (!(this.runId !==
|
|
963
|
+
for (const a of c)
|
|
964
|
+
d.has(a) && f.has(a) && (n.add(a), l.add(a), this.pendingComplete--);
|
|
965
|
+
for (const a of c) {
|
|
966
|
+
const p = a.onComplete, b = () => {
|
|
967
|
+
if (!(this.runId !== u || !this.running || l.has(a))) {
|
|
1022
968
|
try {
|
|
1023
|
-
|
|
1024
|
-
} catch (
|
|
1025
|
-
console.error("[ssgoi] animation completion failed",
|
|
969
|
+
p == null || p();
|
|
970
|
+
} catch (S) {
|
|
971
|
+
console.error("[ssgoi] animation completion failed", S);
|
|
1026
972
|
}
|
|
1027
|
-
|
|
973
|
+
l.add(a), --this.pendingComplete === 0 && this.handleFinished();
|
|
1028
974
|
}
|
|
1029
975
|
};
|
|
1030
|
-
|
|
1031
|
-
|
|
976
|
+
a.onComplete = b, this.restoreChildCallbacks.push(() => {
|
|
977
|
+
a.onComplete === b && (a.onComplete = p);
|
|
1032
978
|
});
|
|
1033
979
|
}
|
|
1034
980
|
const y = () => {
|
|
1035
|
-
let
|
|
1036
|
-
for (; this.running && this.runId ===
|
|
1037
|
-
|
|
1038
|
-
for (const
|
|
1039
|
-
!this.running || n.has(
|
|
1040
|
-
(
|
|
1041
|
-
|
|
1042
|
-
|
|
981
|
+
let a = !0;
|
|
982
|
+
for (; this.running && this.runId === u && a; ) {
|
|
983
|
+
a = !1;
|
|
984
|
+
for (const p of m)
|
|
985
|
+
!this.running || n.has(p) || (g.get(p) ?? []).some(
|
|
986
|
+
(S) => !n.has(S.after) || !this.hasReachedThreshold(
|
|
987
|
+
S.after,
|
|
988
|
+
S.at,
|
|
1043
989
|
t
|
|
1044
990
|
)
|
|
1045
|
-
) || (n.add(
|
|
991
|
+
) || (n.add(p), this.startedChildren.add(p), p[t](), a = !0);
|
|
1046
992
|
}
|
|
1047
|
-
n.size ===
|
|
993
|
+
n.size === c.length && this.clearPendingStartObservers();
|
|
1048
994
|
};
|
|
1049
|
-
y(), this.pendingComplete === 0 && this.handleFinished(), this.running && n.size !==
|
|
1050
|
-
at.subscribe(y, "observe")
|
|
1051
|
-
);
|
|
995
|
+
y(), this.pendingComplete === 0 && this.handleFinished(), this.running && n.size !== c.length && this.pendingStartObservers.push(vt.subscribe(y));
|
|
1052
996
|
}
|
|
1053
997
|
buildDependencies() {
|
|
1054
998
|
const t = /* @__PURE__ */ new Map(), e = new Set(this._children);
|
|
@@ -1056,28 +1000,28 @@ class lt extends st {
|
|
|
1056
1000
|
throw new Error(
|
|
1057
1001
|
"Each child animation must occur once in a MultiAnimation"
|
|
1058
1002
|
);
|
|
1059
|
-
this._children.forEach((
|
|
1060
|
-
const
|
|
1061
|
-
if (
|
|
1062
|
-
if (!e.has(
|
|
1003
|
+
this._children.forEach((f, c) => {
|
|
1004
|
+
const m = f.startCondition;
|
|
1005
|
+
if (m) {
|
|
1006
|
+
if (!e.has(m.after))
|
|
1063
1007
|
throw new Error(
|
|
1064
1008
|
"startAt.after must reference a sibling in the same MultiAnimation"
|
|
1065
1009
|
);
|
|
1066
|
-
t.set(
|
|
1067
|
-
} else
|
|
1068
|
-
after: this._children[
|
|
1069
|
-
at: this._startAt[
|
|
1010
|
+
t.set(f, { ...m });
|
|
1011
|
+
} else c > 0 && this._startAt.some((g) => g > 0) && t.set(f, {
|
|
1012
|
+
after: this._children[c - 1],
|
|
1013
|
+
at: this._startAt[c] ?? 0
|
|
1070
1014
|
});
|
|
1071
1015
|
});
|
|
1072
|
-
const i = /* @__PURE__ */ new Set(), o = /* @__PURE__ */ new Set(),
|
|
1073
|
-
if (o.has(
|
|
1016
|
+
const i = /* @__PURE__ */ new Set(), o = /* @__PURE__ */ new Set(), d = (f) => {
|
|
1017
|
+
if (o.has(f))
|
|
1074
1018
|
throw new Error("Animation startAt dependencies form a cycle");
|
|
1075
|
-
if (i.has(
|
|
1076
|
-
o.add(
|
|
1077
|
-
const
|
|
1078
|
-
|
|
1019
|
+
if (i.has(f)) return;
|
|
1020
|
+
o.add(f);
|
|
1021
|
+
const c = t.get(f);
|
|
1022
|
+
c && d(c.after), o.delete(f), i.add(f);
|
|
1079
1023
|
};
|
|
1080
|
-
return this._children.forEach(
|
|
1024
|
+
return this._children.forEach(d), t;
|
|
1081
1025
|
}
|
|
1082
1026
|
hasReachedThreshold(t, e, i) {
|
|
1083
1027
|
return t.isComplete ? !0 : e === "settled" ? !1 : e <= 0 ? !0 : (i === "play" ? t.progress : 1 - t.progress) >= e;
|
|
@@ -1094,8 +1038,8 @@ class lt extends st {
|
|
|
1094
1038
|
var t;
|
|
1095
1039
|
if (this.running) {
|
|
1096
1040
|
if (this.running = !1, this.settled = !0, this.clearPendingStartObservers(), this.restoreCompletionHandlers(), !this.deferDisposal) {
|
|
1097
|
-
for (const e of this._children) e.cancel(
|
|
1098
|
-
this.disposeResources(
|
|
1041
|
+
for (const e of this._children) e.cancel(E);
|
|
1042
|
+
this.disposeResources(E);
|
|
1099
1043
|
}
|
|
1100
1044
|
(t = this.onComplete) == null || t.call(this);
|
|
1101
1045
|
}
|
|
@@ -1104,15 +1048,15 @@ class lt extends st {
|
|
|
1104
1048
|
return null;
|
|
1105
1049
|
}
|
|
1106
1050
|
}
|
|
1107
|
-
const
|
|
1108
|
-
function
|
|
1109
|
-
const r =
|
|
1051
|
+
const K = /* @__PURE__ */ new WeakMap();
|
|
1052
|
+
function St(s) {
|
|
1053
|
+
const r = K.get(s) ?? {
|
|
1110
1054
|
value: s.style.getPropertyValue("opacity"),
|
|
1111
1055
|
priority: s.style.getPropertyPriority("opacity"),
|
|
1112
1056
|
opacity: typeof getComputedStyle == "function" ? Number.parseFloat(getComputedStyle(s).opacity) : Number.NaN,
|
|
1113
1057
|
users: /* @__PURE__ */ new Set()
|
|
1114
1058
|
}, t = {};
|
|
1115
|
-
r.users.add(t),
|
|
1059
|
+
r.users.add(t), K.set(s, r);
|
|
1116
1060
|
let e = !1;
|
|
1117
1061
|
return {
|
|
1118
1062
|
opacity: Number.isFinite(r.opacity) ? r.opacity : 1,
|
|
@@ -1126,16 +1070,16 @@ function Mt(s) {
|
|
|
1126
1070
|
(o == null ? void 0 : o.value) !== void 0 && (s.style.opacity = String(o.value));
|
|
1127
1071
|
return;
|
|
1128
1072
|
}
|
|
1129
|
-
r.value ? s.style.setProperty("opacity", r.value, r.priority) : s.style.removeProperty("opacity"),
|
|
1073
|
+
r.value ? s.style.setProperty("opacity", r.value, r.priority) : s.style.removeProperty("opacity"), K.delete(s);
|
|
1130
1074
|
}
|
|
1131
1075
|
}
|
|
1132
1076
|
};
|
|
1133
1077
|
}
|
|
1134
1078
|
export {
|
|
1135
1079
|
st as A,
|
|
1136
|
-
|
|
1137
|
-
|
|
1138
|
-
|
|
1139
|
-
|
|
1140
|
-
|
|
1080
|
+
ot as M,
|
|
1081
|
+
nt as W,
|
|
1082
|
+
$ as c,
|
|
1083
|
+
E as f,
|
|
1084
|
+
St as r
|
|
1141
1085
|
};
|