@wix/interact 2.2.2 → 2.4.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (55) hide show
  1. package/README.md +322 -246
  2. package/dist/cjs/index.js +1 -1
  3. package/dist/cjs/react.js +1 -1
  4. package/dist/cjs/web.js +1 -1
  5. package/dist/es/index.js +1 -1
  6. package/dist/es/react.js +2 -2
  7. package/dist/es/web.js +2 -2
  8. package/dist/index-C6u4q815.mjs +3291 -0
  9. package/dist/index-C6u4q815.mjs.map +1 -0
  10. package/dist/index-Qg46rn0Y.js +21 -0
  11. package/dist/index-Qg46rn0Y.js.map +1 -0
  12. package/dist/tsconfig.build.tsbuildinfo +1 -1
  13. package/dist/types/core/add.d.ts.map +1 -1
  14. package/dist/types/core/css.d.ts +17 -2
  15. package/dist/types/core/css.d.ts.map +1 -1
  16. package/dist/types/core/cssUtils.d.ts +8 -0
  17. package/dist/types/core/cssUtils.d.ts.map +1 -0
  18. package/dist/types/core/resolvers.d.ts +4 -0
  19. package/dist/types/core/resolvers.d.ts.map +1 -0
  20. package/dist/types/core/utilities.d.ts +6 -0
  21. package/dist/types/core/utilities.d.ts.map +1 -1
  22. package/dist/types/handlers/animationEnd.d.ts +1 -1
  23. package/dist/types/handlers/animationEnd.d.ts.map +1 -1
  24. package/dist/types/handlers/viewProgress.d.ts.map +1 -1
  25. package/dist/types/types/config.d.ts +23 -2
  26. package/dist/types/types/config.d.ts.map +1 -1
  27. package/dist/types/types/css.d.ts +26 -0
  28. package/dist/types/types/css.d.ts.map +1 -0
  29. package/dist/types/types/effects.d.ts +12 -0
  30. package/dist/types/types/effects.d.ts.map +1 -1
  31. package/dist/types/types/external.d.ts +3 -3
  32. package/dist/types/types/external.d.ts.map +1 -1
  33. package/dist/types/types/handlers.d.ts +2 -1
  34. package/dist/types/types/handlers.d.ts.map +1 -1
  35. package/dist/types/types/index.d.ts +1 -0
  36. package/dist/types/types/index.d.ts.map +1 -1
  37. package/dist/types/types/internal.d.ts +1 -1
  38. package/dist/types/types/internal.d.ts.map +1 -1
  39. package/dist/types/utils.d.ts +11 -2
  40. package/dist/types/utils.d.ts.map +1 -1
  41. package/docs/README.md +1 -1
  42. package/docs/api/README.md +4 -4
  43. package/docs/api/functions.md +157 -42
  44. package/docs/examples/entrance-animations.md +7 -5
  45. package/docs/guides/getting-started.md +1 -1
  46. package/docs/integration/react.md +8 -8
  47. package/package.json +6 -3
  48. package/rules/full-lean.md +24 -15
  49. package/rules/integration.md +23 -17
  50. package/rules/viewenter.md +4 -2
  51. package/rules/viewprogress.md +52 -0
  52. package/dist/index-A2Q0e94t.js +0 -18
  53. package/dist/index-A2Q0e94t.js.map +0 -1
  54. package/dist/index-HeFaJMEX.mjs +0 -2839
  55. package/dist/index-HeFaJMEX.mjs.map +0 -1
@@ -1,2839 +0,0 @@
1
- function st(t) {
2
- return [...t.matchAll(/\[([-\w]+)]/g)].map(([e, n]) => n);
3
- }
4
- function C(t, e) {
5
- const n = st(e);
6
- let s = 0;
7
- return n.length ? t.replace(/\[]/g, () => {
8
- const r = n[s++];
9
- return r !== void 0 ? `[${r}]` : "[]";
10
- }) : t;
11
- }
12
- class G {
13
- animations;
14
- options;
15
- ready;
16
- isCSS;
17
- longestAnimation;
18
- constructor(e, n) {
19
- this.animations = e, this.options = n, this.ready = n?.measured || Promise.resolve(), this.isCSS = e[0] instanceof CSSAnimation, this.longestAnimation = this._getAnimationWithLongestEndTime();
20
- }
21
- _getAnimationWithLongestEndTime() {
22
- return this.animations.reduce((e, n) => {
23
- const s = e.effect?.getComputedTiming().endTime ?? 0, r = n.effect?.getComputedTiming().endTime ?? 0;
24
- return s > r ? e : n;
25
- }, this.animations[0]);
26
- }
27
- getProgress() {
28
- return this.longestAnimation?.effect?.getComputedTiming().progress || 0;
29
- }
30
- async play(e) {
31
- await this.ready;
32
- for (const n of this.animations)
33
- n.play();
34
- await Promise.all(this.animations.map((n) => n.ready)), e && e();
35
- }
36
- pause() {
37
- for (const e of this.animations)
38
- e.pause();
39
- }
40
- async reverse(e) {
41
- await this.ready;
42
- for (const n of this.animations)
43
- n.reverse();
44
- await Promise.all(this.animations.map((n) => n.ready)), e && e();
45
- }
46
- progress(e) {
47
- for (const n of this.animations) {
48
- const { delay: s, duration: r, iterations: i } = n.effect.getTiming(), o = (Number.isFinite(r) ? r : 0) * (Number.isFinite(i) ? i : 1);
49
- n.currentTime = ((s || 0) + o) * e;
50
- }
51
- }
52
- cancel() {
53
- for (const e of this.animations)
54
- e.cancel();
55
- }
56
- setPlaybackRate(e) {
57
- for (const n of this.animations)
58
- n.playbackRate = e;
59
- }
60
- async onFinish(e) {
61
- try {
62
- await Promise.all(this.animations.map((s) => s.finished));
63
- const n = this.animations[0];
64
- if (n && !this.isCSS) {
65
- const s = n.effect?.target;
66
- if (s) {
67
- const r = new Event("animationend");
68
- s.dispatchEvent(r);
69
- }
70
- }
71
- e();
72
- } catch (n) {
73
- console.warn("animation was interrupted - aborting onFinish callback - ", n);
74
- }
75
- }
76
- async onAbort(e) {
77
- try {
78
- await Promise.all(this.animations.map((n) => n.finished));
79
- } catch (n) {
80
- if (n.name === "AbortError") {
81
- const s = this.animations[0];
82
- if (s && !this.isCSS) {
83
- const r = s.effect?.target;
84
- if (r) {
85
- const i = new Event("animationcancel");
86
- r.dispatchEvent(i);
87
- }
88
- }
89
- e();
90
- }
91
- }
92
- }
93
- get finished() {
94
- return Promise.all(this.animations.map((e) => e.finished));
95
- }
96
- get playState() {
97
- return this.animations[0]?.playState;
98
- }
99
- getTimingOptions() {
100
- return this.animations.map((e) => {
101
- const n = e.effect?.getTiming(), s = n?.delay ?? 0, r = Number(n?.duration) || 0, i = n?.iterations ?? 1;
102
- return {
103
- delay: s,
104
- duration: r,
105
- iterations: i
106
- };
107
- });
108
- }
109
- }
110
- const Re = (t) => t, it = (t) => 1 - Math.cos(t * Math.PI / 2), rt = (t) => Math.sin(t * Math.PI / 2), ot = (t) => -(Math.cos(Math.PI * t) - 1) / 2, ct = (t) => t ** 2, at = (t) => 1 - (1 - t) ** 2, ft = (t) => t < 0.5 ? 2 * t ** 2 : 1 - (-2 * t + 2) ** 2 / 2, lt = (t) => t ** 3, ut = (t) => 1 - (1 - t) ** 3, dt = (t) => t < 0.5 ? 4 * t ** 3 : 1 - (-2 * t + 2) ** 3 / 2, ht = (t) => t ** 4, mt = (t) => 1 - (1 - t) ** 4, pt = (t) => t < 0.5 ? 8 * t ** 4 : 1 - (-2 * t + 2) ** 4 / 2, gt = (t) => t ** 5, vt = (t) => 1 - (1 - t) ** 5, yt = (t) => t < 0.5 ? 16 * t ** 5 : 1 - (-2 * t + 2) ** 5 / 2, Et = (t) => t === 0 ? 0 : 2 ** (10 * t - 10), wt = (t) => t === 1 ? 1 : 1 - 2 ** (-10 * t), bt = (t) => t === 0 ? 0 : t === 1 ? 1 : t < 0.5 ? 2 ** (20 * t - 10) / 2 : (2 - 2 ** (-20 * t + 10)) / 2, St = (t) => 1 - Math.sqrt(1 - t ** 2), Tt = (t) => Math.sqrt(1 - (t - 1) ** 2), It = (t) => t < 0.5 ? (1 - Math.sqrt(1 - 4 * t ** 2)) / 2 : (Math.sqrt(-(2 * t - 3) * (2 * t - 1)) + 1) / 2, Ot = (t) => 2.70158 * t ** 3 - 1.70158 * t ** 2, Ct = (t) => 1 + 2.70158 * (t - 1) ** 3 + 1.70158 * (t - 1) ** 2, At = (t, e = 1.70158 * 1.525) => t < 0.5 ? (2 * t) ** 2 * ((e + 1) * 2 * t - e) / 2 : ((2 * t - 2) ** 2 * ((e + 1) * (t * 2 - 2) + e) + 2) / 2, we = {
111
- linear: Re,
112
- sineIn: it,
113
- sineOut: rt,
114
- sineInOut: ot,
115
- quadIn: ct,
116
- quadOut: at,
117
- quadInOut: ft,
118
- cubicIn: lt,
119
- cubicOut: ut,
120
- cubicInOut: dt,
121
- quartIn: ht,
122
- quartOut: mt,
123
- quartInOut: pt,
124
- quintIn: gt,
125
- quintOut: vt,
126
- quintInOut: yt,
127
- expoIn: Et,
128
- expoOut: wt,
129
- expoInOut: bt,
130
- circIn: St,
131
- circOut: Tt,
132
- circInOut: It,
133
- backIn: Ot,
134
- backOut: Ct,
135
- backInOut: At
136
- }, be = {
137
- linear: "linear",
138
- ease: "ease",
139
- easeIn: "ease-in",
140
- easeOut: "ease-out",
141
- easeInOut: "ease-in-out",
142
- sineIn: "cubic-bezier(0.47, 0, 0.745, 0.715)",
143
- sineOut: "cubic-bezier(0.39, 0.575, 0.565, 1)",
144
- sineInOut: "cubic-bezier(0.445, 0.05, 0.55, 0.95)",
145
- quadIn: "cubic-bezier(0.55, 0.085, 0.68, 0.53)",
146
- quadOut: "cubic-bezier(0.25, 0.46, 0.45, 0.94)",
147
- quadInOut: "cubic-bezier(0.455, 0.03, 0.515, 0.955)",
148
- cubicIn: "cubic-bezier(0.55, 0.055, 0.675, 0.19)",
149
- cubicOut: "cubic-bezier(0.215, 0.61, 0.355, 1)",
150
- cubicInOut: "cubic-bezier(0.645, 0.045, 0.355, 1)",
151
- quartIn: "cubic-bezier(0.895, 0.03, 0.685, 0.22)",
152
- quartOut: "cubic-bezier(0.165, 0.84, 0.44, 1)",
153
- quartInOut: "cubic-bezier(0.77, 0, 0.175, 1)",
154
- quintIn: "cubic-bezier(0.755, 0.05, 0.855, 0.06)",
155
- quintOut: "cubic-bezier(0.23, 1, 0.32, 1)",
156
- quintInOut: "cubic-bezier(0.86, 0, 0.07, 1)",
157
- expoIn: "cubic-bezier(0.95, 0.05, 0.795, 0.035)",
158
- expoOut: "cubic-bezier(0.19, 1, 0.22, 1)",
159
- expoInOut: "cubic-bezier(1, 0, 0, 1)",
160
- circIn: "cubic-bezier(0.6, 0.04, 0.98, 0.335)",
161
- circOut: "cubic-bezier(0.075, 0.82, 0.165, 1)",
162
- circInOut: "cubic-bezier(0.785, 0.135, 0.15, 0.86)",
163
- backIn: "cubic-bezier(0.6, -0.28, 0.735, 0.045)",
164
- backOut: "cubic-bezier(0.175, 0.885, 0.32, 1.275)",
165
- backInOut: "cubic-bezier(0.68, -0.55, 0.265, 1.55)"
166
- };
167
- function kt(t) {
168
- return t === "percentage" ? "%" : t || "px";
169
- }
170
- function Q(t) {
171
- return t ? be[t] || t : be.linear;
172
- }
173
- function _t(t, e, n, s) {
174
- const r = 3 * t, i = 3 * (n - t) - r, o = 1 - r - i, c = 3 * e, l = 3 * (s - e) - c, f = 1 - c - l, a = (d) => ((o * d + i) * d + r) * d, u = (d) => ((f * d + l) * d + c) * d, h = (d) => (3 * o * d + 2 * i) * d + r;
175
- function g(d) {
176
- let m = d;
177
- for (let v = 0; v < 8; v++) {
178
- const w = a(m) - d;
179
- if (Math.abs(w) < 1e-7) return m;
180
- const b = h(m);
181
- if (Math.abs(b) < 1e-6) break;
182
- m -= w / b;
183
- }
184
- let p = 0, y = 1;
185
- for (m = (p + y) / 2; y - p > 1e-7; ) {
186
- const v = a(m);
187
- if (Math.abs(v - d) < 1e-7) return m;
188
- d > v ? p = m : y = m, m = (p + y) / 2;
189
- }
190
- return m;
191
- }
192
- return (d) => d <= 0 ? 0 : d >= 1 ? 1 : u(g(d));
193
- }
194
- function qt(t) {
195
- const e = t.match(
196
- /^cubic-bezier\(\s*(-?[\d.]+)\s*,\s*(-?[\d.]+)\s*,\s*(-?[\d.]+)\s*,\s*(-?[\d.]+)\s*\)$/
197
- );
198
- if (!e) return;
199
- const n = parseFloat(e[1]), s = parseFloat(e[2]), r = parseFloat(e[3]), i = parseFloat(e[4]);
200
- if (![n, s, r, i].some(isNaN))
201
- return _t(n, s, r, i);
202
- }
203
- function xt(t) {
204
- const e = t.match(/^linear\((.+)\)$/);
205
- if (!e) return;
206
- const n = e[1].split(",").map((o) => o.trim()).filter(Boolean);
207
- if (n.length === 0) return;
208
- const s = [];
209
- for (const o of n) {
210
- const c = o.split(/\s+/), l = parseFloat(c[0]);
211
- if (isNaN(l)) return;
212
- const f = [];
213
- for (let a = 1; a < c.length; a++)
214
- if (c[a].endsWith("%")) {
215
- const u = parseFloat(c[a]) / 100;
216
- if (isNaN(u)) return;
217
- f.push(u);
218
- }
219
- f.length === 0 ? s.push({ output: l, pos: null }) : f.length === 1 ? s.push({ output: l, pos: f[0] }) : (s.push({ output: l, pos: f[0] }), s.push({ output: l, pos: f[1] }));
220
- }
221
- if (s.length === 0) return;
222
- s[0].pos === null && (s[0].pos = 0), s[s.length - 1].pos === null && (s[s.length - 1].pos = 1);
223
- let r = 0;
224
- for (; r < s.length; )
225
- if (s[r].pos === null) {
226
- const o = r - 1;
227
- let c = r;
228
- for (; c < s.length && s[c].pos === null; ) c++;
229
- const l = s[o].pos, f = s[c].pos, a = c - o;
230
- for (let u = o + 1; u < c; u++)
231
- s[u].pos = l + (f - l) * (u - o) / a;
232
- r = c + 1;
233
- } else
234
- r++;
235
- for (let o = 1; o < s.length; o++)
236
- s[o].pos < s[o - 1].pos && (s[o].pos = s[o - 1].pos);
237
- const i = s;
238
- return (o) => {
239
- if (o <= i[0].pos) return i[0].output;
240
- const c = i[i.length - 1];
241
- if (o >= c.pos) return c.output;
242
- let l = 0, f = i.length - 1;
243
- for (; l < f - 1; ) {
244
- const h = l + f >>> 1;
245
- i[h].pos <= o ? l = h : f = h;
246
- }
247
- const a = i[l], u = i[f];
248
- return u.pos === a.pos ? u.output : a.output + (u.output - a.output) * (o - a.pos) / (u.pos - a.pos);
249
- };
250
- }
251
- function He(t) {
252
- if (!t) return;
253
- const e = we[t];
254
- return e || (qt(t) ?? xt(t) ?? we.linear);
255
- }
256
- class Mt extends G {
257
- animationGroups;
258
- delay;
259
- offset;
260
- offsetEasing;
261
- timingOptions;
262
- constructor(e, n = {}) {
263
- const s = e.flatMap((r) => [...r.animations]);
264
- super(s), this.animationGroups = e, this.delay = n.delay ?? 0, this.offset = n.offset ?? 0, this.offsetEasing = typeof n.offsetEasing == "function" ? n.offsetEasing : He(n.offsetEasing) ?? Re, this.timingOptions = this.animationGroups.map((r) => r.getTimingOptions().map(({ delay: i, duration: o, iterations: c }) => ({
265
- delay: i,
266
- duration: Number.isFinite(o) ? o : 0,
267
- iterations: Number.isFinite(c) ? c : 1
268
- }))), this.applyOffsets(), this.ready = Promise.all(e.map((r) => r.ready)).then(() => {
269
- });
270
- }
271
- /**
272
- * Calculates stagger delay offsets for each animation group using the formula:
273
- * easing(i / last) * last * offset
274
- * where i is the group index and last is the index of the final group.
275
- */
276
- calculateOffsets() {
277
- const e = this.animationGroups.length;
278
- if (e <= 1) return [0];
279
- const n = e - 1;
280
- return Array.from(
281
- { length: e },
282
- (s, r) => this.offsetEasing(r / n) * n * this.offset | 0
283
- );
284
- }
285
- applyOffsets() {
286
- if (this.animationGroups.length === 0 || this.animations.length === 0) return;
287
- const e = this.calculateOffsets(), n = this.getSequenceActiveDuration(e);
288
- this.animationGroups.forEach((s, r) => {
289
- s.animations.forEach((i, o) => {
290
- const c = i.effect;
291
- if (!c) return;
292
- const { delay: l, duration: f, iterations: a } = this.timingOptions[r][o], u = l + e[r], h = n - (u + f * a);
293
- c.updateTiming({ delay: u + this.delay, endDelay: h });
294
- });
295
- });
296
- }
297
- getSequenceActiveDuration(e) {
298
- const n = [];
299
- for (let s = 0; s < this.timingOptions.length; s++) {
300
- const r = this.timingOptions[s].reduce((i, o) => {
301
- if (!o) return i;
302
- const { delay: c, duration: l, iterations: f } = o;
303
- return Math.max(i, c + l * f);
304
- }, 0);
305
- n.push(e[s] + r);
306
- }
307
- return Math.max(...n);
308
- }
309
- /**
310
- * Inserts new AnimationGroups at specified indices, then recalculates
311
- * stagger offsets for all groups. Each entry specifies the target index
312
- * in the animationGroups array where the group should be inserted.
313
- */
314
- addGroups(e) {
315
- if (e.length === 0) return;
316
- const n = [...e].sort((s, r) => r.index - s.index);
317
- for (const { index: s, group: r } of n) {
318
- const i = Math.min(s, this.animationGroups.length);
319
- this.animationGroups.splice(i, 0, r), this.timingOptions.splice(i, 0, r.getTimingOptions());
320
- const o = [...r.animations], c = this.animationGroups.slice(0, i).reduce((l, f) => l + f.animations.length, 0);
321
- this.animations.splice(c, 0, ...o);
322
- }
323
- this.applyOffsets(), this.ready = Promise.all(this.animationGroups.map((s) => s.ready)).then(() => {
324
- });
325
- }
326
- /**
327
- * Removes AnimationGroups that match the predicate, then recalculates
328
- * stagger offsets for remaining groups. Cancelled animations in removed
329
- * groups are returned.
330
- */
331
- removeGroups(e) {
332
- const n = [], s = [], r = [];
333
- for (let i = 0; i < this.animationGroups.length; i++)
334
- e(this.animationGroups[i]) ? n.push(this.animationGroups[i]) : (s.push(this.animationGroups[i]), r.push(this.timingOptions[i]));
335
- if (n.length === 0) return n;
336
- for (const i of n)
337
- i.cancel();
338
- return this.animationGroups = s, this.timingOptions = r, this.animations = s.flatMap((i) => [...i.animations]), this.applyOffsets(), this.ready = Promise.all(this.animationGroups.map((i) => i.ready)).then(() => {
339
- }), n;
340
- }
341
- async onFinish(e) {
342
- try {
343
- await Promise.all(this.animationGroups.map((n) => n.finished)), e();
344
- } catch (n) {
345
- console.warn("animation was interrupted - aborting onFinish callback - ", n);
346
- }
347
- }
348
- }
349
- class Lt {
350
- _animation;
351
- customEffect;
352
- progress;
353
- _tickCbId;
354
- _finishHandler;
355
- constructor(e, n, s, r) {
356
- const i = new KeyframeEffect(n, [], {
357
- ...s,
358
- composite: "add"
359
- }), { timeline: o } = r;
360
- this._animation = new Animation(i, o), this._tickCbId = null, this.progress = null, this.customEffect = (c) => e(i.target, c), this._finishHandler = (c) => {
361
- this.effect.target?.getAnimations().find((l) => l === this._animation) || this.cancel();
362
- }, this.addEventListener("finish", this._finishHandler), this.addEventListener("remove", this._finishHandler);
363
- }
364
- // private tick method for customEffect loop implementation
365
- _tick() {
366
- try {
367
- const e = this.effect?.getComputedTiming().progress ?? null;
368
- e !== this.progress && (this.customEffect?.(e), this.progress = e), this._tickCbId = requestAnimationFrame(() => {
369
- this._tick();
370
- });
371
- } catch (e) {
372
- this._tickCbId = null, console.error(
373
- `failed to run customEffect! effectId: ${this.id}, error: ${e instanceof Error ? e.message : e}`
374
- );
375
- }
376
- }
377
- // Animation timing properties
378
- get currentTime() {
379
- return this._animation.currentTime;
380
- }
381
- set currentTime(e) {
382
- this._animation.currentTime = e;
383
- }
384
- get startTime() {
385
- return this._animation.startTime;
386
- }
387
- set startTime(e) {
388
- this._animation.startTime = e;
389
- }
390
- get playbackRate() {
391
- return this._animation.playbackRate;
392
- }
393
- set playbackRate(e) {
394
- this._animation.playbackRate = e;
395
- }
396
- // Animation basic properties
397
- get id() {
398
- return this._animation.id;
399
- }
400
- set id(e) {
401
- this._animation.id = e;
402
- }
403
- get effect() {
404
- return this._animation.effect;
405
- }
406
- set effect(e) {
407
- this._animation.effect = e;
408
- }
409
- get timeline() {
410
- return this._animation.timeline;
411
- }
412
- set timeline(e) {
413
- this._animation.timeline = e;
414
- }
415
- // Animation readonly state properties
416
- get finished() {
417
- return this._animation.finished;
418
- }
419
- get pending() {
420
- return this._animation.pending;
421
- }
422
- get playState() {
423
- return this._animation.playState;
424
- }
425
- get ready() {
426
- return this._animation.ready;
427
- }
428
- get replaceState() {
429
- return this._animation.replaceState;
430
- }
431
- // Animation event handlers
432
- get oncancel() {
433
- return this._animation.oncancel;
434
- }
435
- set oncancel(e) {
436
- this._animation.oncancel = e;
437
- }
438
- get onfinish() {
439
- return this._animation.onfinish;
440
- }
441
- set onfinish(e) {
442
- this._animation.onfinish = e;
443
- }
444
- get onremove() {
445
- return this._animation.onremove;
446
- }
447
- set onremove(e) {
448
- this._animation.onremove = e;
449
- }
450
- // CustomAnimation overridden methods
451
- play() {
452
- this._animation.play(), cancelAnimationFrame(this._tickCbId), this._tickCbId = requestAnimationFrame(() => this._tick());
453
- }
454
- pause() {
455
- this._animation.pause(), cancelAnimationFrame(this._tickCbId), this._tickCbId = null;
456
- }
457
- cancel() {
458
- this.removeEventListener("finish", this._finishHandler), this.removeEventListener("remove", this._finishHandler), this._animation.cancel(), this.customEffect(null), cancelAnimationFrame(this._tickCbId), this._tickCbId = null;
459
- }
460
- commitStyles() {
461
- console.warn(
462
- "CustomEffect animations do not support commitStyles method as they have no style to commit"
463
- );
464
- }
465
- // Animation methods without override
466
- finish() {
467
- this._animation.finish();
468
- }
469
- persist() {
470
- this._animation.persist();
471
- }
472
- reverse() {
473
- this._animation.reverse();
474
- }
475
- updatePlaybackRate(e) {
476
- this._animation.updatePlaybackRate(e);
477
- }
478
- // Animation events API
479
- addEventListener(e, n, s) {
480
- this._animation.addEventListener(e, n, s);
481
- }
482
- removeEventListener(e, n, s) {
483
- this._animation.removeEventListener(e, n, s);
484
- }
485
- dispatchEvent(e) {
486
- return this._animation.dispatchEvent(e);
487
- }
488
- }
489
- function $t(t) {
490
- return t && t.__esModule && Object.prototype.hasOwnProperty.call(t, "default") ? t.default : t;
491
- }
492
- var X = { exports: {} }, Se = X.exports, Te;
493
- function Pt() {
494
- return Te || (Te = 1, (function(t) {
495
- (function(e) {
496
- var n = function() {
497
- }, s = e.requestAnimationFrame || e.webkitRequestAnimationFrame || e.mozRequestAnimationFrame || e.msRequestAnimationFrame || function(a) {
498
- return setTimeout(a, 16);
499
- };
500
- function r() {
501
- var a = this;
502
- a.reads = [], a.writes = [], a.raf = s.bind(e);
503
- }
504
- r.prototype = {
505
- constructor: r,
506
- /**
507
- * We run this inside a try catch
508
- * so that if any jobs error, we
509
- * are able to recover and continue
510
- * to flush the batch until it's empty.
511
- *
512
- * @param {Array} tasks
513
- */
514
- runTasks: function(a) {
515
- for (var u; u = a.shift(); ) u();
516
- },
517
- /**
518
- * Adds a job to the read batch and
519
- * schedules a new frame if need be.
520
- *
521
- * @param {Function} fn
522
- * @param {Object} ctx the context to be bound to `fn` (optional).
523
- * @public
524
- */
525
- measure: function(a, u) {
526
- var h = u ? a.bind(u) : a;
527
- return this.reads.push(h), i(this), h;
528
- },
529
- /**
530
- * Adds a job to the
531
- * write batch and schedules
532
- * a new frame if need be.
533
- *
534
- * @param {Function} fn
535
- * @param {Object} ctx the context to be bound to `fn` (optional).
536
- * @public
537
- */
538
- mutate: function(a, u) {
539
- var h = u ? a.bind(u) : a;
540
- return this.writes.push(h), i(this), h;
541
- },
542
- /**
543
- * Clears a scheduled 'read' or 'write' task.
544
- *
545
- * @param {Object} task
546
- * @return {Boolean} success
547
- * @public
548
- */
549
- clear: function(a) {
550
- return c(this.reads, a) || c(this.writes, a);
551
- },
552
- /**
553
- * Extend this FastDom with some
554
- * custom functionality.
555
- *
556
- * Because fastdom must *always* be a
557
- * singleton, we're actually extending
558
- * the fastdom instance. This means tasks
559
- * scheduled by an extension still enter
560
- * fastdom's global task queue.
561
- *
562
- * The 'super' instance can be accessed
563
- * from `this.fastdom`.
564
- *
565
- * @example
566
- *
567
- * var myFastdom = fastdom.extend({
568
- * initialize: function() {
569
- * // runs on creation
570
- * },
571
- *
572
- * // override a method
573
- * measure: function(fn) {
574
- * // do extra stuff ...
575
- *
576
- * // then call the original
577
- * return this.fastdom.measure(fn);
578
- * },
579
- *
580
- * ...
581
- * });
582
- *
583
- * @param {Object} props properties to mixin
584
- * @return {FastDom}
585
- */
586
- extend: function(a) {
587
- if (typeof a != "object") throw new Error("expected object");
588
- var u = Object.create(this);
589
- return l(u, a), u.fastdom = this, u.initialize && u.initialize(), u;
590
- },
591
- // override this with a function
592
- // to prevent Errors in console
593
- // when tasks throw
594
- catch: null
595
- };
596
- function i(a) {
597
- a.scheduled || (a.scheduled = !0, a.raf(o.bind(null, a)));
598
- }
599
- function o(a) {
600
- var u = a.writes, h = a.reads, g;
601
- try {
602
- n("flushing reads", h.length), a.runTasks(h), n("flushing writes", u.length), a.runTasks(u);
603
- } catch (d) {
604
- g = d;
605
- }
606
- if (a.scheduled = !1, (h.length || u.length) && i(a), g)
607
- if (n("task errored", g.message), a.catch) a.catch(g);
608
- else throw g;
609
- }
610
- function c(a, u) {
611
- var h = a.indexOf(u);
612
- return !!~h && !!a.splice(h, 1);
613
- }
614
- function l(a, u) {
615
- for (var h in u)
616
- u.hasOwnProperty(h) && (a[h] = u[h]);
617
- }
618
- var f = e.fastdom = e.fastdom || new r();
619
- t.exports = f;
620
- })(typeof window < "u" ? window : typeof Se < "u" ? Se : globalThis);
621
- })(X)), X.exports;
622
- }
623
- var Ft = Pt();
624
- const I = /* @__PURE__ */ $t(Ft), fe = {};
625
- function Rt(t) {
626
- Object.assign(fe, t);
627
- }
628
- function Ht(t) {
629
- return t in fe ? fe[t] : (console.warn(
630
- `${t} not found in registry. Please make sure to import and register the preset.`
631
- ), null);
632
- }
633
- function L(t, e) {
634
- return t ? document.getElementById(t) : null;
635
- }
636
- function zt(t, e) {
637
- return t?.matches(`[data-motion-part~="${e}"]`) ? t : t?.querySelector(`[data-motion-part~="${e}"]`);
638
- }
639
- function Nt(t) {
640
- const e = t.alternate ? "alternate" : "";
641
- return t.reversed ? `${e ? `${e}-` : ""}reverse` : e || "normal";
642
- }
643
- function re(t) {
644
- return `${t.value}${kt(t.unit)}`;
645
- }
646
- function Ie(t, e, n) {
647
- return `${t.name || "cover"} ${n && t.offset.unit !== "percentage" ? `calc(100% + ${re(t.offset)}${e ? ` + ${e}` : ""})` : e ? `calc(${re(t.offset)} + ${e})` : re(t.offset)}`;
648
- }
649
- function Dt(t) {
650
- return {
651
- start: Ie(t.startOffset, t.startOffsetAdd),
652
- end: Ie(t.endOffset, t.endOffsetAdd, !0)
653
- };
654
- }
655
- function ze(t) {
656
- return (e) => I.measure(() => e(t));
657
- }
658
- function Ne(t) {
659
- return (e) => I.mutate(() => e(t));
660
- }
661
- function Z(t) {
662
- if (t.namedEffect) {
663
- const e = t.namedEffect.type;
664
- return typeof e == "string" ? Ht(e) : null;
665
- } else if (t.keyframeEffect) {
666
- const e = (s) => {
667
- const { name: r, keyframes: i } = s.keyframeEffect;
668
- return [{ ...s, name: r, keyframes: i }];
669
- };
670
- return { web: e, style: e, getNames: (s) => {
671
- const { effectId: r } = s, { name: i } = s.keyframeEffect, o = i || r;
672
- return o ? [o] : [];
673
- } };
674
- } else if (t.customEffect)
675
- return (e) => [{ ...e, keyframes: [] }];
676
- return null;
677
- }
678
- function Gt(t, e, n) {
679
- return t.map((s, r) => {
680
- const i = {
681
- fill: s.fill,
682
- easing: Q(s.easing),
683
- iterations: s.iterations === 0 ? 1 / 0 : s.iterations || 1,
684
- composite: s.composite,
685
- direction: Nt(s)
686
- };
687
- return De(e) ? (i.duration = s.duration, i.delay = s.delay || 0) : window.ViewTimeline && e?.trigger === "view-progress" ? i.duration = "auto" : (i.duration = 99.99, i.delay = 0.01), {
688
- effect: s,
689
- options: i,
690
- id: n && `${n}-${r + 1}`,
691
- part: s.part
692
- };
693
- });
694
- }
695
- function De(t) {
696
- return !t || t.trigger !== "pointer-move" && t.trigger !== "view-progress";
697
- }
698
- function Oe(t, e, n, s, r) {
699
- if (t) {
700
- if (De(s) && (e.duration = e.duration || 1, r?.reducedMotion))
701
- if (e.iterations === 1 || e.iterations == null)
702
- e = { ...e, duration: 1 };
703
- else
704
- return [];
705
- let i;
706
- return n instanceof HTMLElement && (i = { measure: ze(n), mutate: Ne(n) }), t.web ? t.web(e, i, r) : t(e, i, r);
707
- }
708
- return [];
709
- }
710
- function ve(t, e, n, s, r) {
711
- const i = t instanceof HTMLElement ? t : L(t);
712
- if (n?.trigger === "pointer-move" && !e.keyframeEffect) {
713
- let h = e;
714
- e.customEffect && (h = {
715
- ...e,
716
- namedEffect: { id: "", type: "CustomMouse" }
717
- });
718
- const g = Z(
719
- h
720
- ), d = Oe(
721
- g,
722
- e,
723
- i,
724
- n,
725
- s
726
- );
727
- return typeof d != "function" ? null : d(i);
728
- }
729
- const o = Z(e), c = Oe(
730
- o,
731
- e,
732
- i,
733
- n,
734
- s
735
- );
736
- if (!c || c.length === 0)
737
- return null;
738
- const l = Gt(c, n, e.effectId);
739
- let f;
740
- const a = n?.trigger === "view-progress";
741
- a && window.ViewTimeline && (f = new ViewTimeline({
742
- subject: n.element || L(n.componentId)
743
- }));
744
- const u = l.map(({ effect: h, options: g, id: d, part: m }) => {
745
- const p = m ? zt(i, m) : i, y = new KeyframeEffect(p || null, [], g);
746
- I.mutate(() => {
747
- "timing" in h && y.updateTiming(h.timing), y.setKeyframes(h.keyframes);
748
- });
749
- const v = a && f ? { timeline: f } : {}, w = typeof h.customEffect == "function" ? new Lt(
750
- h.customEffect,
751
- p || null,
752
- g,
753
- v
754
- ) : new Animation(y, v.timeline);
755
- if (a)
756
- if (f)
757
- I.mutate(() => {
758
- const { start: b, end: S } = Dt(h);
759
- w.rangeStart = b, w.rangeEnd = S, w.play();
760
- });
761
- else {
762
- const { startOffset: b, endOffset: S } = e;
763
- I.mutate(() => {
764
- const T = h.startOffset || b, F = h.endOffset || S;
765
- Object.assign(w, {
766
- start: {
767
- name: T.name,
768
- offset: T.offset?.value,
769
- add: h.startOffsetAdd
770
- },
771
- end: {
772
- name: F.name,
773
- offset: F.offset?.value,
774
- add: h.endOffsetAdd
775
- }
776
- });
777
- });
778
- }
779
- return d && (w.id = d), w;
780
- });
781
- return new G(u, {
782
- ...e,
783
- trigger: { ...n || {} },
784
- // make sure the group is ready after all animation targets are measured and mutated
785
- measured: new Promise((h) => I.mutate(h))
786
- });
787
- }
788
- function Wt(t, e, n) {
789
- const s = Z(e), r = t instanceof HTMLElement ? t : L(t);
790
- if (s && s.prepare && r) {
791
- const i = { measure: ze(r), mutate: Ne(r) };
792
- s.prepare(e, i);
793
- }
794
- n && I.mutate(n);
795
- }
796
- function Vt(t, e) {
797
- const n = Z(e);
798
- if (!n)
799
- return null;
800
- if (!n.style)
801
- return e.effectId && t ? jt(t, e.effectId) : null;
802
- const s = n.getNames(e), i = (typeof t == "string" ? L(t) : t)?.getAnimations(), o = i?.map((l) => l.animationName) || [], c = [];
803
- return s.forEach((l) => {
804
- o.includes(l) && c.push(
805
- i?.find((f) => f.animationName === l)
806
- );
807
- }), c?.length ? new G(c) : null;
808
- }
809
- function jt(t, e) {
810
- const s = (typeof t == "string" ? L(t) : t)?.getAnimations().filter((r) => {
811
- const i = r.id || r.animationName;
812
- return i ? i.startsWith(e) : !0;
813
- });
814
- return s?.length ? new G(s) : null;
815
- }
816
- function Ge(t, e, n, s = {}) {
817
- const { disabled: r, allowActiveEvent: i, ...o } = s, c = ve(t, e, n, o);
818
- if (!c)
819
- return null;
820
- let l = {};
821
- if (n.trigger === "view-progress" && !window.ViewTimeline) {
822
- const f = n.element || L(n.componentId), { ready: a } = c;
823
- return c.animations.map((u) => ({
824
- /* we use getters for start and end in order to access the animation's start and end
825
- only when initializing the scrub scene rather than immediately */
826
- get start() {
827
- return u.start;
828
- },
829
- get end() {
830
- return u.end;
831
- },
832
- viewSource: f,
833
- ready: a,
834
- getProgress() {
835
- return c.getProgress();
836
- },
837
- effect(h, g) {
838
- const { activeDuration: d } = u.effect.getComputedTiming(), { delay: m } = u.effect.getTiming();
839
- u.currentTime = ((m || 0) + (d || 0)) * g;
840
- },
841
- disabled: r,
842
- destroy() {
843
- u.cancel();
844
- }
845
- }));
846
- } else if (n.trigger === "pointer-move") {
847
- const f = e, { centeredToTarget: a, transitionDuration: u, transitionEasing: h } = f, g = n.axis;
848
- if (f.keyframeEffect) {
849
- const d = c;
850
- return d.animations?.length === 0 ? null : {
851
- target: void 0,
852
- centeredToTarget: a,
853
- ready: d.ready,
854
- _currentProgress: 0,
855
- getProgress() {
856
- return this._currentProgress;
857
- },
858
- effect(p, y) {
859
- const v = g === "x" ? y.x : y.y;
860
- this._currentProgress = v, d.progress(v);
861
- },
862
- disabled: r ?? !1,
863
- destroy() {
864
- d.cancel();
865
- }
866
- };
867
- }
868
- l = {
869
- centeredToTarget: a,
870
- allowActiveEvent: i
871
- }, e.customEffect && u && (l.transitionDuration = u, l.transitionEasing = He(h)), l.target = c.target;
872
- }
873
- return {
874
- ...l,
875
- getProgress() {
876
- return c.getProgress();
877
- },
878
- effect(f, a, u, h) {
879
- c.progress(
880
- u ? {
881
- // @ts-expect-error spread error on p
882
- ...a,
883
- v: u,
884
- active: h
885
- } : a
886
- );
887
- },
888
- disabled: r,
889
- destroy() {
890
- c.cancel();
891
- }
892
- };
893
- }
894
- function ne(t, e, n, s = !1) {
895
- const r = Vt(t, e);
896
- return r ? (r.ready = new Promise((i) => {
897
- Wt(t, e, i);
898
- }), r) : ve(t, e, n, { reducedMotion: s });
899
- }
900
- function Yt(t) {
901
- return t === null ? [null] : typeof t == "string" ? Array.from(document.querySelectorAll(t)) : Array.isArray(t) ? t : [t];
902
- }
903
- function We(t, e) {
904
- const n = [];
905
- for (const { target: s, options: r } of t) {
906
- const i = Yt(s);
907
- for (const o of i) {
908
- const c = ne(
909
- o,
910
- r,
911
- void 0,
912
- e?.reducedMotion
913
- );
914
- c instanceof G && n.push(c);
915
- }
916
- }
917
- return n;
918
- }
919
- function Bt(t, e, n) {
920
- const s = We(e, n);
921
- return new Mt(s, t);
922
- }
923
- function U(t, e) {
924
- return e.includes("&") ? e.replace(/&/g, t) : `${t}${e}`;
925
- }
926
- function x() {
927
- return "wi-12343210".replace(
928
- /\d/g,
929
- (t) => String.fromCharCode(
930
- (+t ^ crypto.getRandomValues(new Uint8Array(1))[0] & 15 >> +t / 4) + 97
931
- )
932
- // 97 for "a"
933
- );
934
- }
935
- function Kt({
936
- key: t,
937
- effectId: e,
938
- transition: n,
939
- properties: s,
940
- childSelector: r = "> :first-child",
941
- selectorCondition: i
942
- }) {
943
- let o = [];
944
- if (n?.styleProperties) {
945
- const { duration: d, easing: m, delay: p } = n;
946
- d && (n.styleProperties.some(
947
- (v) => v.name.startsWith("--")
948
- ) ? o = [
949
- `all ${d}ms ${Q(m || "ease")}${p ? ` ${p}ms` : ""}`,
950
- "visibility 0s"
951
- ] : o = n.styleProperties.map(
952
- (v) => `${v.name} ${d}ms ${Q(
953
- m || "ease"
954
- )}${p ? ` ${p}ms` : ""}`
955
- )), s = n.styleProperties;
956
- } else
957
- o = s?.filter((d) => d.duration).map(
958
- (d) => `${d.name} ${d.duration}ms ${Q(d.easing) || "ease"}${d.delay ? ` ${d.delay}ms` : ""}`
959
- ) || [];
960
- const c = s?.map((d) => `${d.name}: ${d.value};`) || [], l = t.replace(/"/g, "'"), f = `:is(:state(${e}), :--${e}) ${r}`, a = `[data-interact-effect~="${e}"] ${r}`, u = i ? U(f, i) : f, h = i ? U(a, i) : a, g = [
961
- `${u},
962
- ${h} {
963
- ${c.join(`
964
- `)}
965
- }`
966
- ];
967
- if (o.length) {
968
- const d = `[data-interact-key="${l}"] ${r}`, m = i ? U(d, i) : d;
969
- g.push(`@media (prefers-reduced-motion: no-preference) { ${m} {
970
- transition: ${o.join(", ")};
971
- } }`);
972
- }
973
- return g;
974
- }
975
- function A(t, e) {
976
- const n = (t || []).filter((i) => e[i]?.type === "media" && e[i].predicate).map((i) => e[i].predicate).join(") and ("), s = n && `(${n})`;
977
- return s && window.matchMedia(s);
978
- }
979
- function $(t, e) {
980
- for (const n of t || []) {
981
- const s = e[n];
982
- if (s?.type === "selector" && s.predicate)
983
- return s.predicate;
984
- }
985
- }
986
- const V = {
987
- rangeStart: { name: "cover", offset: { value: 0, unit: "percentage" } },
988
- rangeEnd: { name: "cover", offset: { value: 100, unit: "percentage" } }
989
- };
990
- function Qt(t, e) {
991
- const n = t?.name ?? V.rangeStart.name, s = e?.name ?? t?.name ?? V.rangeEnd.name, r = {
992
- name: n,
993
- offset: t?.offset || V.rangeStart.offset
994
- }, i = {
995
- name: s,
996
- offset: e?.offset || V.rangeEnd.offset
997
- };
998
- return { startOffset: r, endOffset: i };
999
- }
1000
- function P(t) {
1001
- if ("keyframeEffect" in t && !t.keyframeEffect.name && "effectId" in t && (t.keyframeEffect.name = t.effectId), "duration" in t)
1002
- return {
1003
- id: "",
1004
- ...t
1005
- };
1006
- const { rangeStart: e, rangeEnd: n, ...s } = t, { startOffset: r, endOffset: i } = Qt(e, n);
1007
- return {
1008
- id: "",
1009
- startOffset: r,
1010
- endOffset: i,
1011
- ...s
1012
- };
1013
- }
1014
- function O(t, e, n) {
1015
- let s = t.get(e);
1016
- s || (s = /* @__PURE__ */ new Set(), t.set(e, s)), s.add(n);
1017
- }
1018
- function W(t, e) {
1019
- t.get(e)?.forEach((s) => {
1020
- const { source: r, target: i, cleanup: o } = s;
1021
- o();
1022
- const c = r === e ? i : r;
1023
- t.get(c)?.delete(s);
1024
- }), t.delete(e);
1025
- }
1026
- const Xt = {
1027
- root: null,
1028
- rootMargin: "0px 0px -10% 0px",
1029
- threshold: [0]
1030
- }, Ut = {
1031
- root: null,
1032
- rootMargin: "0px",
1033
- threshold: [0]
1034
- }, Jt = 0.2;
1035
- function Zt(t) {
1036
- const e = t.trim().split(/\s+/), n = e[0], s = e.length > 1 ? e[1] : e[0], r = (i) => i.startsWith("-") ? i.slice(1) : parseFloat(i) ? `-${i}` : i;
1037
- return `${r(n)} 0px ${r(s)}`;
1038
- }
1039
- const N = {}, k = /* @__PURE__ */ new WeakMap(), ee = /* @__PURE__ */ new WeakSet(), R = /* @__PURE__ */ new WeakMap();
1040
- let Ve = {}, H = null;
1041
- function en(t) {
1042
- Ve = t;
1043
- }
1044
- function je(t, e, n) {
1045
- k.get(t)?.forEach(({ source: r, handler: i }) => {
1046
- r === t && i(e, n);
1047
- });
1048
- }
1049
- function Ce() {
1050
- return H || (H = new IntersectionObserver((t) => {
1051
- t.forEach((e) => {
1052
- const n = e.target;
1053
- e.isIntersecting || je(n, !1, !0);
1054
- });
1055
- }, Ut), H);
1056
- }
1057
- function Ye(t, e = !1) {
1058
- const n = JSON.stringify({ ...t, isSafeMode: e });
1059
- if (N[n])
1060
- return N[n];
1061
- const s = t.threshold ?? Jt, r = e ? Xt : {
1062
- root: null,
1063
- rootMargin: t.inset ? Zt(t.inset) : "0px",
1064
- threshold: s
1065
- }, i = new IntersectionObserver((o) => {
1066
- o.forEach((c) => {
1067
- const l = c.target, f = !ee.has(l);
1068
- if (f && (ee.add(l), t.useSafeViewEnter && !c.isIntersecting)) {
1069
- I.measure(() => {
1070
- const a = c.boundingClientRect.height, u = c.rootBounds?.height;
1071
- if (!u)
1072
- return;
1073
- const h = Array.isArray(t.threshold) ? Math.min(...t.threshold) : t.threshold;
1074
- h && a * h > u && I.mutate(() => {
1075
- i.unobserve(l);
1076
- const d = Ye(t, !0);
1077
- R.set(l, d), d.observe(l);
1078
- });
1079
- });
1080
- return;
1081
- }
1082
- (c.isIntersecting || !f) && je(l, c.isIntersecting);
1083
- });
1084
- }, r);
1085
- return N[n] = i, i;
1086
- }
1087
- function tn(t, e, n, s = {}, { reducedMotion: r, selectorCondition: i, animation: o } = {}) {
1088
- const c = { ...Ve, ...s }, l = n.triggerType || "once", f = o || ne(
1089
- e,
1090
- P(n),
1091
- void 0,
1092
- r
1093
- );
1094
- if (!f)
1095
- return;
1096
- const a = Ye(c);
1097
- l !== "once" && f.persist?.();
1098
- let u = !0, h = !1, g;
1099
- g = { source: t, target: e, handler: (p, y) => {
1100
- if (!(i && !e.matches(i)))
1101
- if (l === "once") {
1102
- if (p && !h) {
1103
- h = !0, k.get(t)?.delete(g), k.get(e)?.delete(g);
1104
- const v = k.get(t);
1105
- (!v || v.size === 0) && ((R.get(t) || a).unobserve(t), ee.delete(t)), f.play(() => {
1106
- const w = () => {
1107
- e.dataset.interactEnter = "start";
1108
- };
1109
- if (f.isCSS) {
1110
- I.mutate(() => {
1111
- requestAnimationFrame(w);
1112
- });
1113
- const b = () => {
1114
- I.mutate(() => {
1115
- e.dataset.interactEnter = "done";
1116
- });
1117
- };
1118
- f.onFinish(b), f.onAbort(b);
1119
- } else
1120
- I.mutate(w);
1121
- });
1122
- }
1123
- } else l === "alternate" ? u && p ? (u = !1, f.play()) : u || f.reverse() : l === "repeat" ? p ? (f.progress(0), f.play()) : y && (f.pause(), f.progress(0)) : l === "state" && (p ? f.play() : y && f.pause());
1124
- }, cleanup: () => {
1125
- (R.get(t) || a).unobserve(t), (l === "repeat" || l === "state") && Ce().unobserve(t), f.cancel(), ee.delete(t), R.delete(t);
1126
- } }, O(k, t, g), O(k, e, g), R.set(t, a), a.observe(t), (l === "repeat" || l === "state") && Ce().observe(t);
1127
- }
1128
- function nn(t) {
1129
- W(k, t);
1130
- }
1131
- function sn() {
1132
- H = null, Object.keys(N).forEach((t) => delete N[t]);
1133
- }
1134
- const Ae = {
1135
- add: tn,
1136
- remove: nn,
1137
- setOptions: en,
1138
- reset: sn
1139
- };
1140
- function Be(t, e) {
1141
- return Object.assign(Object.create(e), t);
1142
- }
1143
- function rn(t, e, n, s) {
1144
- let r = t * (1 - n) + e * n;
1145
- if (s) {
1146
- const i = r - t;
1147
- Math.abs(i) < s && (r = t + s * Math.sign(i));
1148
- const o = e - r;
1149
- if (Math.abs(o) < s)
1150
- return e;
1151
- }
1152
- return r;
1153
- }
1154
- function on(t) {
1155
- let e = !1;
1156
- return function() {
1157
- e || (e = !0, window.requestAnimationFrame(() => {
1158
- e = !1, t();
1159
- }));
1160
- };
1161
- }
1162
- function ke(t, e) {
1163
- let n = 0;
1164
- return function() {
1165
- n && window.clearTimeout(n), n = window.setTimeout(() => {
1166
- n = 0, t();
1167
- }, e);
1168
- };
1169
- }
1170
- function cn(t, e) {
1171
- const n = t.match(/^calc\s*\(\s*(-?\d+((px)|([lsd]?vh)|([lsd]?vw)))\s*\+\s*(-?\d+((px)|([lsd]?vh)|([lsd]?vw)))\s*\)\s*$/);
1172
- return te(n[1], e) + te(n[6], e);
1173
- }
1174
- function te(t, e) {
1175
- return t ? /^-?\d+px$/.test(t) ? parseInt(t) : /^-?\d+[lsd]?vh$/.test(t) ? parseInt(t) * e.viewportHeight / 100 : /^-?\d+[lsd]?vw$/.test(t) ? parseInt(t) * e.viewportWidth / 100 : /^calc\s*\(\s*-?\d+((px)|([lsd]?vh)|([lsd]?vw))\s*\+\s*-?\d+((px)|([lsd]?vh)|([lsd]?vw))\s*\)\s*$/.test(t) ? cn(t, e) : parseInt(t) || 0 : 0;
1176
- }
1177
- function q(t, e, n) {
1178
- const { name: s, offset: r = 0 } = t, { start: i, end: o } = n, c = o - i, l = r / 100;
1179
- let f, a;
1180
- return s === "entry" ? (f = i - e, a = Math.min(e, c)) : s === "entry-crossing" ? (f = i - e, a = c) : s === "contain" ? (f = Math.min(o - e, i), a = Math.abs(e - c)) : s === "exit" ? (f = Math.max(i, o - e), a = Math.min(e, c)) : s === "exit-crossing" ? (f = i, a = c) : s === "cover" && (f = i - e, a = c + e), f + l * a | 0;
1181
- }
1182
- function oe(t, e, n, s, r) {
1183
- let i = 0;
1184
- const o = { start: e, end: n };
1185
- return t.forEach((c, l) => {
1186
- i += c.offset;
1187
- const f = c.sticky;
1188
- if (f) {
1189
- if ("end" in f && t[l - 1]?.element) {
1190
- const h = ((r ? c.element.offsetWidth : c.element.offsetHeight) || 0) + f.end - s, g = i + h - c.offset, d = g < o.start, m = !d && g <= n;
1191
- let p = 0;
1192
- (d || m) && (p = c.offset, o.end += p), d && (o.start += p);
1193
- }
1194
- if ("start" in f) {
1195
- const a = i - f.start, u = a < o.start, h = !u && a <= o.end;
1196
- let g = 0;
1197
- const d = t[l - 1]?.element;
1198
- if (d) {
1199
- if (u || h) {
1200
- const m = (r ? d.offsetWidth : d.offsetHeight) || 0, p = c.offset, y = (r ? c.element.offsetWidth : c.element.offsetHeight) || 0;
1201
- g = m - (p + y), i += g, o.end += g;
1202
- }
1203
- u && (o.start += g);
1204
- }
1205
- }
1206
- }
1207
- }), o;
1208
- }
1209
- function an(t, e, n, s, r, i) {
1210
- const { start: o, end: c, duration: l } = t;
1211
- let f = o, a = c, u = t.startRange, h = t.endRange, g;
1212
- if (typeof l == "string") {
1213
- u = { name: l, offset: 0 }, h = { name: l, offset: 100 }, f = q(u, n, e), a = q(h, n, e), g = a - f;
1214
- const d = oe(i, f, a, n, s);
1215
- f = d.start, a = d.end;
1216
- } else {
1217
- if (u || o?.name) {
1218
- u = u || o;
1219
- const d = te(u.add, r), m = q({ ...u, offset: 0 }, n, e), p = q({ ...u, offset: 100 }, n, e), y = oe(i, m, p, n, s);
1220
- f = y.start + u.offset / 100 * (y.end - y.start) + d;
1221
- }
1222
- if (h || c?.name) {
1223
- h = h || c;
1224
- const d = te(h.add, r), m = q({ ...h, offset: 0 }, n, e), p = q({ ...h, offset: 100 }, n, e), y = oe(i, m, p, n, s);
1225
- a = y.start + h.offset / 100 * (y.end - y.start) + d;
1226
- } else typeof l == "number" && (a = f + l);
1227
- }
1228
- return !g && !l && (g = a - f), { ...t, start: f, end: a, startRange: u, endRange: h, duration: g || l };
1229
- }
1230
- function fn(t) {
1231
- return t.position === "sticky";
1232
- }
1233
- function ln(t, e, n) {
1234
- return t.position === "fixed" && (!e || e === window.document.body || e === n);
1235
- }
1236
- function un(t, e) {
1237
- return parseInt(e ? t.left : t.top);
1238
- }
1239
- function dn(t, e) {
1240
- return parseInt(e ? t.right : t.bottom);
1241
- }
1242
- function hn(t, e, n) {
1243
- n && (t.style.position = "static");
1244
- const s = (e ? t.offsetLeft : t.offsetTop) || 0;
1245
- return n && (t.style.position = null), s;
1246
- }
1247
- function mn(t, e) {
1248
- let n;
1249
- const s = un(t, e), r = dn(t, e), i = !isNaN(s), o = !isNaN(r);
1250
- return (i || o) && (n = {}, i && (n.start = s), o && (n.end = r)), n;
1251
- }
1252
- function j(t, e, n, s, r) {
1253
- const i = t[0].viewSource, o = [];
1254
- let c = (s ? i.offsetWidth : i.offsetHeight) || 0, l = 0, f = i;
1255
- for (; f; ) {
1256
- const u = window.getComputedStyle(f), h = fn(u), g = h ? mn(u, s) : void 0, d = hn(f, s, h);
1257
- if ((!g || !("end" in g)) && (l += d), o.push({ element: f, offset: d, sticky: g }), f = f.offsetParent, ln(u, f, e))
1258
- break;
1259
- if (f === e) {
1260
- o.push({ element: f, offset: 0 });
1261
- break;
1262
- }
1263
- }
1264
- return o.reverse(), t.map((u) => ({
1265
- ...an(
1266
- u,
1267
- { start: l, end: l + c },
1268
- n,
1269
- s,
1270
- r,
1271
- o
1272
- )
1273
- }));
1274
- }
1275
- const _e = 100, pn = {
1276
- horizontal: !1,
1277
- observeViewportEntry: !0,
1278
- viewportRootMargin: "7% 7%",
1279
- observeViewportResize: !1,
1280
- observeSourcesResize: !1,
1281
- observeContentResize: !1
1282
- };
1283
- function gn(t, e, n, s) {
1284
- let r = 0;
1285
- return t >= e && t <= n ? r = s ? (t - e) / s : 1 : t > n && (r = 1), r;
1286
- }
1287
- function qe(t, e) {
1288
- return t === window ? e ? window.document.documentElement.clientWidth : window.document.documentElement.clientHeight : e ? t.clientWidth : t.clientHeight;
1289
- }
1290
- function vn() {
1291
- return {
1292
- viewportWidth: window.document.documentElement.clientWidth,
1293
- viewportHeight: window.document.documentElement.clientHeight
1294
- };
1295
- }
1296
- function yn(t) {
1297
- const e = Be(t, pn), n = e.root, s = e.horizontal, r = /* @__PURE__ */ new WeakMap();
1298
- let i = qe(n, s), o, c, l, f, a;
1299
- const u = [], h = vn();
1300
- if (e.scenes = Object.values(
1301
- // TODO(ameerf): find a polyfill and use groupBy instead of following reduce
1302
- t.scenes.reduce(
1303
- (m, p, y) => {
1304
- const v = p.groupId ? `group-${p.groupId}` : String(y);
1305
- return m[v] ? m[v].push(p) : m[v] = [p], m;
1306
- },
1307
- {}
1308
- )
1309
- ).flatMap((m) => (m.every((p) => p.viewSource && (typeof p.duration == "string" || p.start?.name)) ? (m = j(m, n, i, s, h), (e.observeSourcesResize || e.observeContentResize) && u.push(m)) : m.forEach((p) => {
1310
- p.end == null && (p.end = p.start + p.duration), p.duration == null && (p.duration = p.end - p.start);
1311
- }), m)), e.scenes.forEach((m, p) => {
1312
- m.index = p;
1313
- }), u.length) {
1314
- const m = /* @__PURE__ */ new Map();
1315
- window.ResizeObserver && (l = new window.ResizeObserver(function(p) {
1316
- p.forEach((y) => {
1317
- const v = m.get(y.target), w = j(v, n, i, s, h);
1318
- w.forEach((b, S) => {
1319
- e.scenes[b.index] = w[S];
1320
- }), u.splice(u.indexOf(v), 1, w);
1321
- });
1322
- }), u.forEach((p) => {
1323
- l.observe(p[0].viewSource, { box: "border-box" }), m.set(p[0].viewSource, p);
1324
- }), e.observeContentResize && e.contentRoot && new window.ResizeObserver(ke(() => {
1325
- const y = u.map((v) => {
1326
- const w = j(v, n, i, s, h);
1327
- return w.forEach((b, S) => {
1328
- e.scenes[b.index] = w[S];
1329
- }), w;
1330
- });
1331
- u.length = 0, u.push(...y), u.forEach((v) => {
1332
- m.set(v[0].viewSource, v);
1333
- });
1334
- }, _e)).observe(e.contentRoot, { box: "border-box" })), e.observeViewportResize && (f = ke(function() {
1335
- i = qe(n, s);
1336
- const p = u.map((y) => {
1337
- const v = j(y, n, i, s, h);
1338
- return v.forEach((w, b) => {
1339
- e.scenes[w.index] = v[b];
1340
- }), v;
1341
- });
1342
- u.length = 0, u.push(...p), u.forEach((y) => {
1343
- m.set(y[0].viewSource, y);
1344
- });
1345
- }, _e), n === window ? window.addEventListener("resize", f) : window.ResizeObserver && (a = new window.ResizeObserver(f), a.observe(n, { box: "border-box" })));
1346
- }
1347
- e.observeViewportEntry && window.IntersectionObserver && (c = new window.IntersectionObserver(function(m) {
1348
- m.forEach((p) => {
1349
- (r.get(p.target) || []).forEach((y) => {
1350
- y.disabled = !p.isIntersecting;
1351
- });
1352
- });
1353
- }, {
1354
- root: n === window ? window.document : n,
1355
- rootMargin: e.viewportRootMargin,
1356
- threshold: 0
1357
- }), e.scenes.forEach((m) => {
1358
- if (m.viewSource) {
1359
- let p = r.get(m.viewSource);
1360
- p || (p = [], r.set(m.viewSource, p), c.observe(m.viewSource)), p.push(m);
1361
- }
1362
- }));
1363
- function g({ p: m, vp: p }) {
1364
- m = +m.toFixed(1);
1365
- const y = +p.toFixed(4);
1366
- if (m !== o) {
1367
- for (let v of e.scenes)
1368
- if (!v.disabled) {
1369
- const { start: w, end: b, duration: S } = v, T = gn(m, w, b, S);
1370
- v.effect(v, T, y);
1371
- }
1372
- o = m;
1373
- }
1374
- }
1375
- function d() {
1376
- e.scenes.forEach((m) => m.destroy?.()), c && (c.disconnect(), c = null), l && (l.disconnect(), l = null), f && (a ? (a.disconnect(), a = null) : window.removeEventListener("resize", f));
1377
- }
1378
- return {
1379
- tick: g,
1380
- destroy: d
1381
- };
1382
- }
1383
- const En = {
1384
- transitionActive: !1,
1385
- transitionFriction: 0.9,
1386
- transitionEpsilon: 1,
1387
- velocityActive: !1,
1388
- velocityMax: 1
1389
- };
1390
- class wn {
1391
- constructor(e = {}) {
1392
- this.config = Be(e, En), this.progress = {
1393
- p: 0,
1394
- prevP: 0,
1395
- vp: 0
1396
- }, this.currentProgress = {
1397
- p: 0,
1398
- prevP: 0,
1399
- vp: 0
1400
- }, this._lerpFrameId = 0, this.effect = null;
1401
- const n = !this.config.root || this.config.root === window.document.body;
1402
- this.config.root = n ? window : this.config.root, this.config.contentRoot = this.config.contentRoot || (n ? window.document.body : this.config.root.firstElementChild), this.config.resetProgress = this.config.resetProgress || this.resetProgress.bind(this), this._measure = this.config.measure || (() => {
1403
- const s = this.config.root;
1404
- this.progress.p = this.config.horizontal ? s.scrollX || s.scrollLeft || 0 : s.scrollY || s.scrollTop || 0;
1405
- }), this._trigger = on(() => {
1406
- this._measure?.(), this.tick(!0);
1407
- });
1408
- }
1409
- /**
1410
- * Setup event and effect, and reset progress and frame.
1411
- */
1412
- start() {
1413
- this.setupEffect(), this.setupEvent(), this.resetProgress(), this.tick();
1414
- }
1415
- /**
1416
- * Removes event listener.
1417
- */
1418
- pause() {
1419
- this.removeEvent();
1420
- }
1421
- /**
1422
- * Reset progress in the DOM and inner state to given x and y.
1423
- *
1424
- * @param {Object} [scrollPosition]
1425
- * @param {number} [scrollPosition.x]
1426
- * @param {number} [scrollPosition.y]
1427
- */
1428
- resetProgress(e = {}) {
1429
- const n = this.config.root, s = e.x || e.x === 0 ? e.x : n.scrollX || n.scrollLeft || 0, r = e.y || e.y === 0 ? e.y : n.scrollY || n.scrollTop || 0, i = this.config.horizontal ? s : r;
1430
- this.progress.p = i, this.progress.prevP = i, this.progress.vp = 0, this.config.transitionActive && (this.currentProgress.p = i, this.currentProgress.prevP = i, this.currentProgress.vp = 0), e && this.config.root.scrollTo(s, r);
1431
- }
1432
- /**
1433
- * Handle animation frame work.
1434
- *
1435
- * @param {boolean} [clearLerpFrame] whether to cancel an existing lerp frame
1436
- */
1437
- tick(e) {
1438
- const n = this.config.transitionActive;
1439
- n && this.lerp();
1440
- const s = n ? this.currentProgress : this.progress;
1441
- if (this.config.velocityActive) {
1442
- const r = s.p - s.prevP, i = r < 0 ? -1 : 1;
1443
- s.vp = Math.min(this.config.velocityMax, Math.abs(r)) / this.config.velocityMax * i;
1444
- }
1445
- this.effect.tick(s), n && s.p !== this.progress.p && (e && this._lerpFrameId && window.cancelAnimationFrame(this._lerpFrameId), this._lerpFrameId = window.requestAnimationFrame(() => this.tick())), s.prevP = s.p;
1446
- }
1447
- /**
1448
- * Calculate current progress.
1449
- */
1450
- lerp() {
1451
- this.currentProgress.p = rn(this.currentProgress.p, this.progress.p, +(1 - this.config.transitionFriction).toFixed(3), this.config.transitionEpsilon);
1452
- }
1453
- /**
1454
- * Stop the event and effect, and remove all DOM side-effects.
1455
- */
1456
- destroy() {
1457
- this.pause(), this.removeEffect();
1458
- }
1459
- /**
1460
- * Register to scroll for triggering update.
1461
- */
1462
- setupEvent() {
1463
- this.removeEvent(), this.config.root.addEventListener("scroll", this._trigger);
1464
- }
1465
- /**
1466
- * Remove scroll handler.
1467
- */
1468
- removeEvent() {
1469
- this.config.root.removeEventListener("scroll", this._trigger);
1470
- }
1471
- /**
1472
- * Reset registered effect.
1473
- */
1474
- setupEffect() {
1475
- this.removeEffect(), this.effect = yn(this.config);
1476
- }
1477
- /**
1478
- * Remove registered effect.
1479
- */
1480
- removeEffect() {
1481
- this.effect && this.effect.destroy(), this.effect = null;
1482
- }
1483
- }
1484
- const le = /* @__PURE__ */ new WeakMap();
1485
- let Ke = () => ({});
1486
- function bn(t) {
1487
- Ke = t;
1488
- }
1489
- function Sn(t, e, n, s, { reducedMotion: r }) {
1490
- if (r)
1491
- return;
1492
- const i = {
1493
- trigger: "view-progress",
1494
- element: t
1495
- }, o = P(n);
1496
- let c;
1497
- if ("ViewTimeline" in window) {
1498
- const f = ve(e, o, i);
1499
- f && (f.play(), c = () => {
1500
- f.ready.then(() => {
1501
- f.cancel();
1502
- });
1503
- });
1504
- } else {
1505
- const f = Ge(e, o, i);
1506
- if (f) {
1507
- const a = Array.isArray(f) ? f : [f], u = new wn({
1508
- viewSource: t,
1509
- scenes: a,
1510
- observeViewportEntry: !1,
1511
- observeViewportResize: !1,
1512
- observeSourcesResize: !0,
1513
- root: document.body,
1514
- ...Ke()
1515
- });
1516
- c = () => {
1517
- u.destroy();
1518
- }, Promise.all(a.map((h) => h.ready || Promise.resolve())).then(
1519
- () => {
1520
- u.start();
1521
- }
1522
- );
1523
- }
1524
- }
1525
- if (!c) return;
1526
- const l = { source: t, target: e, cleanup: c };
1527
- O(le, t, l), O(le, e, l);
1528
- }
1529
- function Tn(t) {
1530
- W(le, t);
1531
- }
1532
- const In = {
1533
- add: Sn,
1534
- remove: Tn,
1535
- registerOptionsGetter: bn
1536
- };
1537
- function xe(t, e, n) {
1538
- return Math.min(Math.max(t, n), e);
1539
- }
1540
- function Me(t) {
1541
- let e = !1;
1542
- return function() {
1543
- if (!e)
1544
- return e = !0, window.requestAnimationFrame(() => {
1545
- e = !1, t();
1546
- });
1547
- };
1548
- }
1549
- function On(t) {
1550
- let e = t, n = 0, s = 0;
1551
- if (e.offsetParent)
1552
- do
1553
- n += e.offsetLeft, s += e.offsetTop, e = e.offsetParent;
1554
- while (e);
1555
- return {
1556
- left: n,
1557
- top: s,
1558
- width: t.offsetWidth,
1559
- height: t.offsetHeight
1560
- };
1561
- }
1562
- function Cn() {
1563
- const t = window.devicePixelRatio;
1564
- let e = !1;
1565
- if (t === 1)
1566
- return !1;
1567
- document.body.addEventListener("pointerdown", (s) => {
1568
- e = s.offsetX !== 10;
1569
- }, { once: !0 });
1570
- const n = new PointerEvent("pointerdown", {
1571
- clientX: 10
1572
- });
1573
- return document.body.dispatchEvent(n), e;
1574
- }
1575
- function An() {
1576
- return new Promise((t) => {
1577
- const e = window.scrollY;
1578
- let n = !1, s;
1579
- function r() {
1580
- document.body.addEventListener("pointerdown", (c) => {
1581
- s === void 0 ? s = c.offsetY : n = c.offsetY === s;
1582
- }, { once: !0 });
1583
- const o = new PointerEvent("pointerdown", {
1584
- clientY: 500
1585
- });
1586
- document.body.dispatchEvent(o);
1587
- }
1588
- function i() {
1589
- window.scrollY !== e && (window.removeEventListener("scroll", i), r(), t(n));
1590
- }
1591
- r(), window.addEventListener("scroll", i), window.scrollY > 0 && window.scrollBy(0, -1);
1592
- });
1593
- }
1594
- function kn(t) {
1595
- An().then((e) => {
1596
- t.fixRequired = e, e && (window.addEventListener("scroll", t.scrollHandler), t.scrollHandler());
1597
- });
1598
- }
1599
- let Y = 0;
1600
- const J = /* @__PURE__ */ new Set();
1601
- function _n() {
1602
- const t = (n) => {
1603
- for (let s of n.changedTouches)
1604
- J.add(s.identifier);
1605
- }, e = (n) => {
1606
- for (let s of n.changedTouches)
1607
- J.delete(s.identifier);
1608
- };
1609
- return document.addEventListener("touchstart", t, { passive: !0 }), document.addEventListener("touchend", e, { passive: !0 }), function() {
1610
- J.clear(), document.removeEventListener("touchstart", t), document.removeEventListener("touchend", e);
1611
- };
1612
- }
1613
- function qn(t, e) {
1614
- if ("onscrollend" in window)
1615
- return t.addEventListener("scrollend", e), function() {
1616
- t.removeEventListener("scrollend", e);
1617
- };
1618
- let n = 0, s;
1619
- Y || (s = _n()), Y += 1;
1620
- function r(i) {
1621
- clearTimeout(n), n = setTimeout(() => {
1622
- J.size ? setTimeout(r, 100) : (e(i), n = 0);
1623
- }, 100);
1624
- }
1625
- return t.addEventListener("scroll", r), function() {
1626
- t.removeEventListener("scroll", r), Y -= 1, Y || s();
1627
- };
1628
- }
1629
- function xn(t, e, n) {
1630
- return {
1631
- x(s) {
1632
- const r = t.left - n.x + t.width / 2, i = r >= e.width / 2, o = (i ? r : e.width - r) * 2, c = i ? 0 : r - o / 2;
1633
- return (s - c) / o;
1634
- },
1635
- y(s) {
1636
- const r = t.top - n.y + t.height / 2, i = r >= e.height / 2, o = (i ? r : e.height - r) * 2, c = i ? 0 : r - o / 2;
1637
- return (s - c) / o;
1638
- }
1639
- };
1640
- }
1641
- function Mn(t, e) {
1642
- this.x = window.scrollX, this.y = window.scrollY, requestAnimationFrame(() => t && t(e));
1643
- }
1644
- function Ln(t) {
1645
- t.rect.width = window.document.documentElement.clientWidth, t.rect.height = window.document.documentElement.clientHeight;
1646
- }
1647
- function $n(t) {
1648
- const e = new ResizeObserver((n) => {
1649
- n.forEach((s) => {
1650
- t.rect.width = s.borderBoxSize[0].inlineSize, t.rect.height = s.borderBoxSize[0].blockSize;
1651
- });
1652
- });
1653
- return e.observe(t.root, { box: "border-box" }), e;
1654
- }
1655
- function Pn(t) {
1656
- let e = !1, n = { x: t.rect.width / 2, y: t.rect.height / 2, vx: 0, vy: 0 }, s, r, i, o, c;
1657
- const l = { x: 0, y: 0 };
1658
- t.scenes.forEach((a) => {
1659
- a.target && a.centeredToTarget && (a.transform = xn(On(a.target), t.rect, l), e = !0), t.root ? r = $n(t) : (i = Ln.bind(null, t), window.addEventListener("resize", i));
1660
- }), s = function(a) {
1661
- for (let u of t.scenes)
1662
- if (!u.disabled) {
1663
- const h = u.transform?.x(a.x) || a.x / t.rect.width, g = u.transform?.y(a.y) || a.y / t.rect.height, d = +xe(0, 1, h).toPrecision(4), m = +xe(0, 1, g).toPrecision(4), p = { x: a.vx, y: a.vy };
1664
- t.allowActiveEvent && (a.active = h <= 1 && g <= 1 && h >= 0 && g >= 0), u.effect(u, { x: d, y: m }, p, a.active);
1665
- }
1666
- Object.assign(n, a);
1667
- }, e && (o = Mn.bind(l, s, n), c = qn(document, o));
1668
- function f() {
1669
- t.scenes.forEach((a) => a.destroy?.()), c?.(), r ? (r.disconnect(), r = null) : (window.removeEventListener("resize", i), i = null), s = null, n = null;
1670
- }
1671
- return {
1672
- tick: s,
1673
- destroy: f
1674
- };
1675
- }
1676
- const Fn = 1e3 / 60 * 3;
1677
- let B;
1678
- function Rn() {
1679
- M.x = window.scrollX, M.y = window.scrollY;
1680
- }
1681
- const M = { x: 0, y: 0, scrollHandler: Rn, fixRequired: void 0 };
1682
- class Hn {
1683
- constructor(e = {}) {
1684
- this.config = { ...e }, this.effect = null, this._nextTick = null, this._nextTransitionTick = null, this._startTime = 0;
1685
- let n;
1686
- this.config.transitionDuration ? n = this.config.noThrottle ? () => this.transition() : Me(() => this.transition()) : n = this.config.noThrottle ? () => (this.tick(), null) : Me(() => {
1687
- this.tick();
1688
- }), this.config.rect = this.config.root ? {
1689
- width: this.config.root.offsetWidth,
1690
- height: this.config.root.offsetHeight
1691
- } : {
1692
- width: window.document.documentElement.clientWidth,
1693
- height: window.document.documentElement.clientHeight
1694
- }, this.progress = {
1695
- x: this.config.rect.width / 2,
1696
- y: this.config.rect.height / 2,
1697
- vx: 0,
1698
- vy: 0
1699
- }, this.previousProgress = { ...this.progress }, this.currentProgress = null;
1700
- const s = (r) => {
1701
- const i = this.config.root ? r.offsetX : r.x, o = this.config.root ? r.offsetY : r.y;
1702
- this.progress.vx = i - this.progress.x, this.progress.vy = o - this.progress.y, this.progress.x = i, this.progress.y = o, this._nextTick = n();
1703
- };
1704
- if (this._pointerLeave = () => {
1705
- this.progress.active = !1, this.progress.vx = 0, this.progress.vy = 0, this._nextTick = n();
1706
- }, this._pointerEnter = () => {
1707
- this.progress.active = !0, this._nextTick = n();
1708
- }, this.config.root) {
1709
- B = typeof B == "boolean" ? B : Cn();
1710
- const r = B ? window.devicePixelRatio : 1;
1711
- typeof M.fixRequired > "u" && kn(M), this._measure = (i) => {
1712
- if (i.target !== this.config.root) {
1713
- const o = new PointerEvent("pointermove", {
1714
- bubbles: !0,
1715
- cancelable: !0,
1716
- clientX: i.x * r + M.x,
1717
- clientY: i.y * r + M.y
1718
- });
1719
- i.stopPropagation(), this.config.root.dispatchEvent(o);
1720
- } else
1721
- s(i);
1722
- };
1723
- } else
1724
- this._measure = s;
1725
- }
1726
- /**
1727
- * Setup event and effect, and reset progress and frame.
1728
- */
1729
- start() {
1730
- this.setupEffect(), this.setupEvent();
1731
- }
1732
- /**
1733
- * Removes event listener.
1734
- */
1735
- pause() {
1736
- this.removeEvent();
1737
- }
1738
- /**
1739
- * Handle animation frame work.
1740
- */
1741
- tick() {
1742
- this.effect.tick(this.progress);
1743
- }
1744
- /**
1745
- * Starts a transition from the previous progress to the current progress.
1746
- *
1747
- * @returns {number} the requestAnimationFrame id for the transition tick.
1748
- */
1749
- transition() {
1750
- const e = this.config.transitionDuration, n = this.config.transitionEasing || ((o) => o), s = performance.now();
1751
- let r = !1;
1752
- const i = (o) => {
1753
- const c = (o - this._startTime) / e, l = n(Math.min(1, c));
1754
- r && (this.progress.vx = 0, this.progress.vy = 0, r = !1), this.currentProgress = Object.entries(this.progress).reduce((f, [a, u]) => (a === "active" ? f[a] = u : f[a] = this.previousProgress[a] + (u - this.previousProgress[a]) * l, f), this.currentProgress || {}), c < 1 && (this._nextTransitionTick = requestAnimationFrame(i), r = o - this._startTime > Fn), this.effect.tick(this.currentProgress);
1755
- };
1756
- return this._startTime ? (this._nextTransitionTick && cancelAnimationFrame(this._nextTransitionTick), Object.assign(this.previousProgress, this.currentProgress), this._startTime = s, i(s)) : this._startTime = s, this._nextTransitionTick;
1757
- }
1758
- /**
1759
- * Stop the event and effect, and remove all DOM side effects.
1760
- */
1761
- destroy() {
1762
- this.pause(), this.removeEffect(), this._nextTick && cancelAnimationFrame(this._nextTick), this._nextTransitionTick && cancelAnimationFrame(this._nextTransitionTick);
1763
- }
1764
- /**
1765
- * Register to pointermove for triggering update.
1766
- */
1767
- setupEvent() {
1768
- this.removeEvent();
1769
- const e = this.config.root || window;
1770
- e.addEventListener("pointermove", this._measure, { passive: !0 }), this.config.eventSource && this.config.eventSource.addEventListener("pointermove", this._measure, { passive: !0 }), this.config.allowActiveEvent && (e.addEventListener("pointerleave", this._pointerLeave, { passive: !0 }), e.addEventListener("pointerenter", this._pointerEnter, { passive: !0 }), this.config.eventSource && (this.config.eventSource.addEventListener("pointerleave", this._pointerLeave, { passive: !0 }), this.config.eventSource.addEventListener("pointerenter", this._pointerEnter, { passive: !0 })));
1771
- }
1772
- /**
1773
- * Remove pointermove handler.
1774
- */
1775
- removeEvent() {
1776
- const e = this.config.root || window;
1777
- e.removeEventListener("pointermove", this._measure), this.config.eventSource && this.config.eventSource.removeEventListener("pointermove", this._measure), this.config.allowActiveEvent && (e.removeEventListener("pointerleave", this._pointerLeave), e.removeEventListener("pointerenter", this._pointerEnter), this.config.eventSource && (this.config.eventSource.removeEventListener("pointerleave", this._pointerLeave), this.config.eventSource.removeEventListener("pointerenter", this._pointerEnter)));
1778
- }
1779
- /**
1780
- * Reset registered effect.
1781
- */
1782
- setupEffect() {
1783
- this.removeEffect(), this.effect = Pn(this.config);
1784
- }
1785
- /**
1786
- * Remove registered effect.
1787
- */
1788
- removeEffect() {
1789
- this.effect && this.effect.destroy(), this.effect = null;
1790
- }
1791
- }
1792
- const ue = /* @__PURE__ */ new WeakMap();
1793
- let Qe = () => ({});
1794
- function zn(t) {
1795
- Qe = t;
1796
- }
1797
- function Nn(t, e, n, s = {}, { reducedMotion: r }) {
1798
- if (r)
1799
- return;
1800
- const i = {
1801
- trigger: "pointer-move",
1802
- element: t,
1803
- axis: s.axis ?? "y"
1804
- }, o = Ge(e, P(n), i);
1805
- if (o) {
1806
- const c = Array.isArray(o) ? o : [o], l = new Hn({
1807
- root: s.hitArea === "self" ? t : void 0,
1808
- scenes: c,
1809
- ...Qe()
1810
- }), a = { source: t, target: e, cleanup: () => {
1811
- l.destroy();
1812
- } };
1813
- O(ue, t, a), O(ue, e, a), Promise.all(
1814
- c.map((u) => u.ready || Promise.resolve())
1815
- ).then(() => {
1816
- l.start();
1817
- });
1818
- }
1819
- }
1820
- function Dn(t) {
1821
- W(ue, t);
1822
- }
1823
- const Gn = {
1824
- add: Nn,
1825
- remove: Dn,
1826
- registerOptionsGetter: zn
1827
- }, de = /* @__PURE__ */ new WeakMap();
1828
- function Wn(t, e, n, s, { reducedMotion: r, selectorCondition: i, animation: o }) {
1829
- const c = o || ne(
1830
- e,
1831
- P(n),
1832
- void 0,
1833
- r
1834
- );
1835
- if (!c)
1836
- return;
1837
- const l = () => {
1838
- i && !e.matches(i) || c.play();
1839
- }, a = { source: t, target: e, cleanup: () => {
1840
- c.cancel(), t.removeEventListener("animationend", l);
1841
- } };
1842
- O(de, t, a), O(de, e, a), t.addEventListener("animationend", l);
1843
- }
1844
- function Vn(t) {
1845
- W(de, t);
1846
- }
1847
- const jn = {
1848
- add: Wn,
1849
- remove: Vn
1850
- };
1851
- function Yn(t, e, n = !1, s, r, i) {
1852
- const o = i || ne(
1853
- t,
1854
- P(e),
1855
- void 0,
1856
- n
1857
- );
1858
- if (!o)
1859
- return null;
1860
- let c = !0;
1861
- const l = e.triggerType || "alternate";
1862
- return (f) => {
1863
- if (s && !t.matches(s)) return;
1864
- const a = !r, u = r?.enter?.includes(f.type), h = r?.leave?.includes(f.type);
1865
- if (u || a) {
1866
- if (l === "alternate" || l === "state")
1867
- c ? (c = !1, o.play()) : l === "alternate" ? o.reverse() : l === "state" && (o.playState === "running" ? o.pause() : o.playState !== "finished" && o.play());
1868
- else {
1869
- if (o.progress(0), delete t.dataset.interactEnter, o.isCSS) {
1870
- const g = () => {
1871
- I.mutate(() => {
1872
- t.dataset.interactEnter = "done";
1873
- });
1874
- };
1875
- o.onFinish(g), o.onAbort(g);
1876
- }
1877
- o.play();
1878
- }
1879
- return;
1880
- }
1881
- h && (l === "alternate" ? o.reverse() : l === "repeat" ? (o.cancel(), I.mutate(() => {
1882
- delete t.dataset.interactEnter;
1883
- })) : l === "state" && o.playState === "running" && o.pause());
1884
- };
1885
- }
1886
- function Bn(t, e, {
1887
- effectId: n,
1888
- listContainer: s,
1889
- listItemSelector: r,
1890
- stateAction: i
1891
- }, o, c) {
1892
- const l = !!s, f = i ?? "toggle", a = f === "toggle";
1893
- return (u) => {
1894
- if (o && !t.matches(o)) return;
1895
- const h = l ? t.closest(
1896
- `${s} > ${r || ""}:has(:scope)`
1897
- ) : void 0, g = !c, d = c?.enter?.includes(u.type), m = c?.leave?.includes(u.type);
1898
- g ? e.toggleEffect(n, f, h) : (d && e.toggleEffect(n, a ? "add" : f, h), m && a && e.toggleEffect(n, "remove", h));
1899
- };
1900
- }
1901
- const he = /* @__PURE__ */ new WeakMap();
1902
- function Le(t, e) {
1903
- return (n) => {
1904
- const s = n;
1905
- t.contains(s.relatedTarget) || e(s);
1906
- };
1907
- }
1908
- function Kn(t) {
1909
- return (e) => {
1910
- const n = e;
1911
- n.pointerType && t(n);
1912
- };
1913
- }
1914
- function Qn(t) {
1915
- return (e) => {
1916
- const n = e;
1917
- n.code === "Space" ? (n.preventDefault(), t(n)) : n.code === "Enter" && t(n);
1918
- };
1919
- }
1920
- const Xn = {
1921
- focusin: (t, e) => Le(t, e),
1922
- focusout: (t, e) => Le(t, e),
1923
- click: (t, e) => Kn(e),
1924
- keydown: (t, e) => Qn(e)
1925
- };
1926
- function Un(t, e, n) {
1927
- const s = Xn[t];
1928
- return s ? s(e, n) : (r) => n(r);
1929
- }
1930
- function Jn(t) {
1931
- return typeof t == "object" && !Array.isArray(t) && ("enter" in t || "leave" in t);
1932
- }
1933
- function Zn(t) {
1934
- if (typeof t == "string")
1935
- return { toggle: [t] };
1936
- if (Array.isArray(t))
1937
- return { toggle: [...t] };
1938
- if (Jn(t)) {
1939
- const e = t.enter ? [...t.enter] : [], n = t.leave ? [...t.leave] : [];
1940
- return { enter: e, leave: n };
1941
- }
1942
- return {};
1943
- }
1944
- function es(t) {
1945
- return !!(t.enter?.length || t.leave?.length);
1946
- }
1947
- function ts(t) {
1948
- return es(t) ? { enter: t.enter ?? [], leave: t.leave ?? [] } : void 0;
1949
- }
1950
- function ns(t, e, n, s, {
1951
- reducedMotion: r,
1952
- targetController: i,
1953
- selectorCondition: o,
1954
- animation: c
1955
- }) {
1956
- const l = Zn(s.eventConfig), f = n.transition || n.transitionProperties, a = ts(l);
1957
- let u, h = !1;
1958
- if (f ? u = Bn(
1959
- e,
1960
- i,
1961
- n,
1962
- o,
1963
- a
1964
- ) : (u = Yn(
1965
- e,
1966
- n,
1967
- r,
1968
- o,
1969
- a,
1970
- c
1971
- ), h = n.triggerType === "once"), !u)
1972
- return;
1973
- const g = u, d = new AbortController();
1974
- function m(v, w, b) {
1975
- const S = Un(w, t, g);
1976
- v.addEventListener(w, S, { ...b, signal: d.signal });
1977
- }
1978
- const y = { source: t, target: e, cleanup: () => {
1979
- d.abort();
1980
- } };
1981
- if (O(he, t, y), O(he, e, y), a) {
1982
- const v = l.enter, w = l.leave;
1983
- v.forEach((T) => {
1984
- T === "focusin" && (t.tabIndex = 0), m(t, T, { passive: !0, once: h });
1985
- });
1986
- const b = !n.stateAction || n.stateAction === "toggle";
1987
- (f ? b : n.triggerType !== "once") && w.forEach((T) => {
1988
- if (T === "focusout") {
1989
- m(t, T, { once: h });
1990
- return;
1991
- }
1992
- m(t, T, { passive: !0 });
1993
- });
1994
- } else
1995
- (l.toggle ?? []).forEach((w) => {
1996
- m(t, w, { once: h, passive: w !== "keydown" });
1997
- });
1998
- }
1999
- function ss(t) {
2000
- W(he, t);
2001
- }
2002
- const z = {
2003
- add: ns,
2004
- remove: ss
2005
- }, me = {
2006
- click: ["click"],
2007
- activate: ["click", "keydown"],
2008
- hover: { enter: ["mouseenter"], leave: ["mouseleave"] },
2009
- interest: {
2010
- enter: ["mouseenter", "focusin"],
2011
- leave: ["mouseleave", "focusout"]
2012
- }
2013
- }, $e = {
2014
- click: me.activate,
2015
- hover: me.interest
2016
- };
2017
- function K(t) {
2018
- const e = me[t];
2019
- return (n, s, r, i, o) => {
2020
- const c = o?.allowA11yTriggers && t in $e ? $e[t] : e;
2021
- z.add(n, s, r, { eventConfig: c }, o ?? {});
2022
- };
2023
- }
2024
- const _ = {
2025
- viewEnter: Ae,
2026
- hover: {
2027
- add: K("hover"),
2028
- remove: z.remove
2029
- },
2030
- click: {
2031
- add: K("click"),
2032
- remove: z.remove
2033
- },
2034
- pageVisible: Ae,
2035
- animationEnd: jn,
2036
- viewProgress: In,
2037
- pointerMove: Gn,
2038
- activate: {
2039
- add: K("activate"),
2040
- remove: z.remove
2041
- },
2042
- interest: {
2043
- add: K("interest"),
2044
- remove: z.remove
2045
- }
2046
- };
2047
- function is(t) {
2048
- return t.replace(/\[([-\w]+)]/g, "[]");
2049
- }
2050
- class E {
2051
- static defineInteractElement;
2052
- dataCache;
2053
- addedInteractions;
2054
- mediaQueryListeners;
2055
- listInteractionsCache;
2056
- controllers;
2057
- static forceReducedMotion = !1;
2058
- static allowA11yTriggers = !0;
2059
- static instances = [];
2060
- static controllerCache = /* @__PURE__ */ new Map();
2061
- static sequenceCache = /* @__PURE__ */ new Map();
2062
- static elementSequenceMap = /* @__PURE__ */ new WeakMap();
2063
- constructor() {
2064
- this.dataCache = { effects: {}, sequences: {}, conditions: {}, interactions: {} }, this.addedInteractions = {}, this.mediaQueryListeners = /* @__PURE__ */ new Map(), this.listInteractionsCache = {}, this.controllers = /* @__PURE__ */ new Set();
2065
- }
2066
- init(e, n) {
2067
- if (typeof window > "u" || !window.customElements)
2068
- return;
2069
- const s = n?.useCustomElement ?? !!E.defineInteractElement;
2070
- this.dataCache = os(e, s);
2071
- const r = E.defineInteractElement?.();
2072
- s && r === !1 ? document.querySelectorAll("interact-element").forEach((i) => {
2073
- i.connect();
2074
- }) : E.controllerCache.forEach(
2075
- (i, o) => i.connect(o)
2076
- );
2077
- }
2078
- destroy() {
2079
- for (const e of this.controllers)
2080
- e.disconnect();
2081
- for (const [, e] of this.mediaQueryListeners.entries())
2082
- e.mql.removeEventListener("change", e.handler);
2083
- this.mediaQueryListeners.clear(), this.addedInteractions = {}, this.listInteractionsCache = {}, this.controllers.clear(), this.dataCache = { effects: {}, sequences: {}, conditions: {}, interactions: {} }, E.instances.splice(E.instances.indexOf(this), 1);
2084
- }
2085
- setController(e, n) {
2086
- this.controllers.add(n), E.setController(e, n);
2087
- }
2088
- deleteController(e, n = !1) {
2089
- const s = E.controllerCache.get(e);
2090
- this.clearInteractionStateForKey(e), this.clearMediaQueryListenersForKey(e), s && n && (this.controllers.delete(s), E.deleteController(e));
2091
- }
2092
- has(e) {
2093
- return !!this.get(e);
2094
- }
2095
- get(e) {
2096
- const n = is(e);
2097
- return this.dataCache.interactions[n];
2098
- }
2099
- clearMediaQueryListenersForKey(e) {
2100
- for (const [n, s] of this.mediaQueryListeners.entries())
2101
- s.key === e && (s.mql.removeEventListener("change", s.handler), this.mediaQueryListeners.delete(n));
2102
- }
2103
- clearInteractionStateForKey(e) {
2104
- (this.get(e)?.interactionIds || []).forEach((r) => {
2105
- const i = C(r, e);
2106
- delete this.addedInteractions[i];
2107
- });
2108
- const s = `${e}::seq::`;
2109
- for (const r of E.sequenceCache.keys())
2110
- r.startsWith(s) && (E.sequenceCache.delete(r), delete this.addedInteractions[r]);
2111
- }
2112
- setupMediaQueryListener(e, n, s, r) {
2113
- this.mediaQueryListeners.has(e) || (n.addEventListener("change", r), this.mediaQueryListeners.set(e, {
2114
- mql: n,
2115
- handler: r,
2116
- key: s
2117
- }));
2118
- }
2119
- static create(e, n) {
2120
- const s = new E();
2121
- return E.instances.push(s), s.init(e, n), s;
2122
- }
2123
- static destroy() {
2124
- E.controllerCache.forEach((e) => {
2125
- e.disconnect();
2126
- }), E.instances.length = 0, E.controllerCache.clear(), E.sequenceCache.clear(), E.elementSequenceMap = /* @__PURE__ */ new WeakMap();
2127
- }
2128
- static setup(e) {
2129
- e.scrollOptionsGetter && _.viewProgress.registerOptionsGetter?.(
2130
- e.scrollOptionsGetter
2131
- ), e.pointerOptionsGetter && _.pointerMove.registerOptionsGetter?.(
2132
- e.pointerOptionsGetter
2133
- ), e.viewEnter && _.viewEnter.setOptions(
2134
- e.viewEnter
2135
- ), e.allowA11yTriggers !== void 0 && (E.allowA11yTriggers = e.allowA11yTriggers);
2136
- }
2137
- static getInstance(e) {
2138
- const n = E.instances.find((s) => s.has(e));
2139
- return n || console.warn(`Interact: Instance for key "${e}" not found`), n;
2140
- }
2141
- static getController(e) {
2142
- const n = e ? E.controllerCache.get(e) : void 0;
2143
- return n || console.warn(`Interact: Controller for key "${e}" not found`), n;
2144
- }
2145
- static setController(e, n) {
2146
- E.controllerCache.set(e, n);
2147
- }
2148
- static deleteController(e) {
2149
- E.controllerCache.delete(e);
2150
- }
2151
- static registerEffects = Rt;
2152
- static getSequence(e, n, s, r) {
2153
- const i = E.sequenceCache.get(e);
2154
- if (i) return i;
2155
- const o = Bt(n, s, r);
2156
- return E.sequenceCache.set(e, o), E._registerSequenceElements(s, o), o;
2157
- }
2158
- static addToSequence(e, n, s, r) {
2159
- const i = E.sequenceCache.get(e);
2160
- if (!i) return !1;
2161
- const c = We(n, r).map((l, f) => ({
2162
- index: s[f] ?? i.animationGroups.length,
2163
- group: l
2164
- }));
2165
- return i.addGroups(c), E._registerSequenceElements(n, i), !0;
2166
- }
2167
- static _registerSequenceElements(e, n) {
2168
- for (const { target: s } of e) {
2169
- const r = Array.isArray(s) ? s : s instanceof HTMLElement ? [s] : [];
2170
- for (const i of r) {
2171
- let o = E.elementSequenceMap.get(i);
2172
- o || (o = /* @__PURE__ */ new Set(), E.elementSequenceMap.set(i, o)), o.add(n);
2173
- }
2174
- }
2175
- }
2176
- static removeFromSequences(e) {
2177
- for (const n of e) {
2178
- const s = E.elementSequenceMap.get(n);
2179
- if (s) {
2180
- for (const r of s)
2181
- r.removeGroups(
2182
- (i) => i.animations.some((o) => o.effect?.target === n)
2183
- );
2184
- E.elementSequenceMap.delete(n);
2185
- }
2186
- }
2187
- }
2188
- }
2189
- let rs = 0;
2190
- function D(t, {
2191
- asCombinator: e = !1,
2192
- addItemFilter: n = !1,
2193
- useFirstChild: s = !1
2194
- } = {}) {
2195
- if (t.listContainer) {
2196
- const r = `${n && t.listItemSelector ? ` > ${t.listItemSelector}` : ""}`;
2197
- return t.selector ? `${t.listContainer}${r} ${t.selector}` : `${t.listContainer}${r || " > *"}`;
2198
- } else if (t.selector)
2199
- return t.selector;
2200
- return s ? e ? "> :first-child" : ":scope > :first-child" : "";
2201
- }
2202
- function Pe(t) {
2203
- return "sequenceId" in t && !("effects" in t);
2204
- }
2205
- function ce(t, e) {
2206
- return t[e] || (t[e] = {
2207
- triggers: [],
2208
- effects: {},
2209
- sequences: {},
2210
- interactionIds: /* @__PURE__ */ new Set(),
2211
- selectors: /* @__PURE__ */ new Set()
2212
- }), t[e];
2213
- }
2214
- function os(t, e = !1) {
2215
- const n = t.conditions || {}, s = {};
2216
- return t.interactions?.forEach((r) => {
2217
- const i = r.key, o = ++rs, { effects: c, sequences: l, ...f } = r;
2218
- if (!i) {
2219
- console.error(`Interaction ${o} is missing a key for source element.`);
2220
- return;
2221
- }
2222
- ce(s, i);
2223
- const a = c ? Array.from(c) : [];
2224
- a.reverse();
2225
- const u = l?.map((d) => {
2226
- if (Pe(d)) {
2227
- const p = t.sequences?.[d.sequenceId];
2228
- return p ? { ...p, ...d } : (console.warn(`Interact: Sequence "${d.sequenceId}" not found in config`), d);
2229
- }
2230
- const m = d;
2231
- return m.sequenceId || (m.sequenceId = x()), m;
2232
- }), h = {
2233
- ...f,
2234
- effects: a.length > 0 ? a : void 0,
2235
- sequences: u
2236
- };
2237
- s[i].triggers.push(h), s[i].selectors.add(
2238
- D(h, { useFirstChild: e })
2239
- );
2240
- const g = h.listContainer;
2241
- a.forEach((d) => {
2242
- let m = d.key;
2243
- if (!m && d.effectId) {
2244
- const w = t.effects[d.effectId];
2245
- w && (m = w.key);
2246
- }
2247
- d.effectId || (d.effectId = x()), m = m || i, d.key = m;
2248
- const p = d.effectId;
2249
- if (g && d.listContainer && (m !== i || d.listContainer !== g))
2250
- return;
2251
- const y = `${i}::${m}::${p}::${o}`;
2252
- if (d.interactionId = y, s[i].interactionIds.add(y), m === i)
2253
- return;
2254
- const v = ce(s, m);
2255
- v.effects[y] || (v.effects[y] = [], v.interactionIds.add(y)), v.effects[y].push({ ...f, effect: d }), v.selectors.add(D(d, { useFirstChild: e }));
2256
- }), u?.forEach((d) => {
2257
- if (!d || Pe(d)) return;
2258
- const m = d, p = m.sequenceId || x(), y = m.effects;
2259
- for (const v of y) {
2260
- v.effectId || (v.effectId = x());
2261
- let w = v.key;
2262
- if (!w && v.effectId) {
2263
- const S = t.effects[v.effectId];
2264
- S && (w = S.key);
2265
- }
2266
- w = w || i;
2267
- const b = D(v, { useFirstChild: e });
2268
- if (b && s[i].selectors.add(b), w !== i) {
2269
- const S = ce(s, w), T = `${w}::seq::${p}::${o}`;
2270
- S.sequences[T] || (S.sequences[T] = [], S.interactionIds.add(T)), S.sequences[T].push({
2271
- ...f,
2272
- sequence: m
2273
- }), S.selectors.add(b);
2274
- }
2275
- }
2276
- });
2277
- }), {
2278
- effects: t.effects || {},
2279
- sequences: t.sequences || {},
2280
- conditions: n,
2281
- interactions: s
2282
- };
2283
- }
2284
- function pe(t, e, n) {
2285
- if (t.listContainer) {
2286
- const s = e.querySelector(t.listContainer);
2287
- return s ? t.selector ? Array.from(s.querySelectorAll(t.selector)) : Array.from(s.children) : (console.warn(`Interact: No container found for list container "${t.listContainer}"`), []);
2288
- }
2289
- if (t.selector) {
2290
- const s = e.querySelectorAll(t.selector);
2291
- if (s.length > 0)
2292
- return Array.from(s);
2293
- console.warn(`Interact: No elements found for selector "${t.selector}"`);
2294
- }
2295
- return n ? e.firstElementChild : e;
2296
- }
2297
- function ge(t, e) {
2298
- return e.map((n) => t.selector ? n.querySelector(t.selector) : n).filter(Boolean);
2299
- }
2300
- function Xe(t, e, n, s, r, i, o, c) {
2301
- return [
2302
- o ? ge(t, o) : pe(t, n, s),
2303
- c ? ge(e, c) : pe(e, r, i)
2304
- ];
2305
- }
2306
- function Ue(t, e, n, s, r, i, o) {
2307
- const c = Array.isArray(s), l = Array.isArray(r);
2308
- c ? s.forEach((f, a) => {
2309
- const u = l ? r[a] : r;
2310
- u && Fe(
2311
- t,
2312
- f,
2313
- e.trigger,
2314
- u,
2315
- n,
2316
- e.params,
2317
- i,
2318
- o
2319
- );
2320
- }) : (l ? r : [r]).forEach((a) => {
2321
- Fe(
2322
- t,
2323
- s,
2324
- e.trigger,
2325
- a,
2326
- n,
2327
- e.params,
2328
- i,
2329
- o
2330
- );
2331
- });
2332
- }
2333
- function Je(t, e, n, s, r) {
2334
- const i = {}, o = [];
2335
- (s.effects || []).forEach((c) => {
2336
- const l = c.effectId, f = {
2337
- ...n.dataCache.effects[l] || {},
2338
- ...c,
2339
- effectId: l
2340
- }, a = f.key, u = C(c.interactionId, t);
2341
- if (i[u] || n.addedInteractions[u] && !r)
2342
- return;
2343
- const h = A(f.conditions || [], n.dataCache.conditions);
2344
- if (h && n.setupMediaQueryListener(u, h, t, () => {
2345
- e.update();
2346
- }), !h || h.matches) {
2347
- i[u] = !0;
2348
- const g = a && C(a, t);
2349
- let d;
2350
- if (g) {
2351
- if (d = E.getController(g), !d)
2352
- return;
2353
- f.listContainer && d.watchChildList(f.listContainer);
2354
- } else
2355
- d = e;
2356
- const [m, p] = Xe(
2357
- s,
2358
- f,
2359
- e.element,
2360
- e.useFirstChild,
2361
- d.element,
2362
- d.useFirstChild,
2363
- r
2364
- );
2365
- if (!m || !p)
2366
- return;
2367
- n.addedInteractions[u] = !0;
2368
- const y = g || s.key, v = $(
2369
- f.conditions || [],
2370
- n.dataCache.conditions
2371
- );
2372
- o.push([
2373
- y,
2374
- s,
2375
- f,
2376
- m,
2377
- p,
2378
- v,
2379
- d.useFirstChild
2380
- ]);
2381
- }
2382
- }), o.reverse().forEach((c) => {
2383
- Ue(...c);
2384
- }), as(t, e, n, s, r);
2385
- }
2386
- function cs(t) {
2387
- return "sequenceId" in t && !("effects" in t);
2388
- }
2389
- function Ze(t, e, n, s, r, i, o) {
2390
- const c = A(t.conditions || [], r.dataCache.conditions);
2391
- if (c && r.setupMediaQueryListener(e, c, i.updateKey, i.onUpdate), c && !c.matches) return null;
2392
- const l = t.effects || [], f = [];
2393
- let a = !1;
2394
- for (const u of l) {
2395
- const h = u.effectId, d = {
2396
- ...h ? r.dataCache.effects[h] || {} : {},
2397
- ...u
2398
- }, m = A(d.conditions || [], r.dataCache.conditions);
2399
- if (m) {
2400
- const T = `${e}::${h || "eff"}`;
2401
- r.setupMediaQueryListener(
2402
- T,
2403
- m,
2404
- i.updateKey,
2405
- i.onUpdate
2406
- );
2407
- }
2408
- if (m && !m.matches) continue;
2409
- const p = d.key, y = p && C(p, n);
2410
- let v;
2411
- if (y) {
2412
- if (v = E.getController(y), !v) return null;
2413
- } else
2414
- v = s;
2415
- const w = y || n;
2416
- let b;
2417
- if (o && w === o.controllerKey && d.listContainer === o.listContainer ? (b = ge(d, o.elements), b.length > 0 && (a = !0)) : b = pe(
2418
- d,
2419
- v.element,
2420
- v.useFirstChild
2421
- ), !b || Array.isArray(b) && b.length === 0) return null;
2422
- const S = P(d);
2423
- f.push({ target: b, options: S });
2424
- }
2425
- return o && !a ? null : f.length > 0 ? f : null;
2426
- }
2427
- function et(t, e, n) {
2428
- const i = (t.useFirstChild ? t.element.firstElementChild : t.element)?.querySelector(e);
2429
- if (!i) return n.map((c, l) => l);
2430
- const o = Array.from(i.children);
2431
- return n.map((c) => {
2432
- const l = o.indexOf(c);
2433
- return l >= 0 ? l : o.length;
2434
- });
2435
- }
2436
- function as(t, e, n, s, r) {
2437
- s.sequences?.forEach((i) => {
2438
- let o;
2439
- if (cs(i)) {
2440
- const g = n.dataCache.sequences[i.sequenceId];
2441
- if (!g) {
2442
- console.warn(`Interact: Sequence "${i.sequenceId}" not found in cache`);
2443
- return;
2444
- }
2445
- o = { ...g, ...i };
2446
- } else
2447
- o = i;
2448
- const c = o.sequenceId || x(), l = C(`${t}::seq::${c}`, t);
2449
- if (n.addedInteractions[l] && !r) return;
2450
- const f = r && s.listContainer ? { controllerKey: t, listContainer: s.listContainer, elements: r } : void 0, a = Ze(
2451
- o,
2452
- l,
2453
- t,
2454
- e,
2455
- n,
2456
- { updateKey: t, onUpdate: () => e.update() },
2457
- f
2458
- );
2459
- if (!a) return;
2460
- if (r && n.addedInteractions[l]) {
2461
- const g = et(
2462
- e,
2463
- s.listContainer,
2464
- r
2465
- );
2466
- E.addToSequence(l, a, g, {
2467
- reducedMotion: E.forceReducedMotion
2468
- });
2469
- return;
2470
- }
2471
- const u = E.getSequence(l, o, a, {
2472
- reducedMotion: E.forceReducedMotion
2473
- });
2474
- n.addedInteractions[l] = !0;
2475
- const h = $(
2476
- s.conditions || [],
2477
- n.dataCache.conditions
2478
- );
2479
- _[s.trigger]?.add(
2480
- e.element,
2481
- e.element,
2482
- { triggerType: o.triggerType },
2483
- s.params || {},
2484
- {
2485
- reducedMotion: E.forceReducedMotion,
2486
- selectorCondition: h,
2487
- animation: u,
2488
- allowA11yTriggers: E.allowA11yTriggers
2489
- }
2490
- );
2491
- });
2492
- }
2493
- function fs(t, e, n, s, r) {
2494
- const i = n.get(t)?.sequences || {};
2495
- Object.keys(i).forEach((c) => {
2496
- i[c].some(({ sequence: f, ...a }) => {
2497
- const u = A(
2498
- a.conditions || [],
2499
- n.dataCache.conditions
2500
- );
2501
- if (u && !u.matches)
2502
- return !1;
2503
- const h = a.key && C(a.key, t), g = E.getController(h);
2504
- if (!g)
2505
- return !0;
2506
- const d = f.sequenceId || x(), m = C(`${h}::seq::${d}`, h);
2507
- if (n.addedInteractions[m] && !r)
2508
- return !0;
2509
- const y = Ze(
2510
- f,
2511
- m,
2512
- h,
2513
- g,
2514
- n,
2515
- { updateKey: t, onUpdate: () => e.update() },
2516
- r && s ? { controllerKey: t, listContainer: s, elements: r } : void 0
2517
- );
2518
- if (!y) return !0;
2519
- if (r && n.addedInteractions[m]) {
2520
- const b = et(e, s, r);
2521
- return E.addToSequence(m, y, b, {
2522
- reducedMotion: E.forceReducedMotion
2523
- }), !0;
2524
- }
2525
- const v = E.getSequence(m, f, y, {
2526
- reducedMotion: E.forceReducedMotion
2527
- });
2528
- n.addedInteractions[m] = !0;
2529
- const w = $(
2530
- a.conditions || [],
2531
- n.dataCache.conditions
2532
- );
2533
- return _[a.trigger]?.add(
2534
- g.element,
2535
- g.element,
2536
- { triggerType: f.triggerType },
2537
- a.params || {},
2538
- {
2539
- reducedMotion: E.forceReducedMotion,
2540
- selectorCondition: w,
2541
- animation: v,
2542
- allowA11yTriggers: E.allowA11yTriggers
2543
- }
2544
- ), !0;
2545
- });
2546
- });
2547
- }
2548
- function tt(t, e, n, s, r) {
2549
- const i = n.get(t), o = i?.effects || {}, c = Object.keys(o), l = [];
2550
- c.forEach((a) => {
2551
- const u = C(a, t);
2552
- if (n.addedInteractions[u] && !r)
2553
- return;
2554
- o[a].some(({ effect: g, ...d }) => {
2555
- const m = A(
2556
- d.conditions || [],
2557
- n.dataCache.conditions
2558
- );
2559
- if (m && !m.matches)
2560
- return !1;
2561
- const p = g.effectId, y = {
2562
- ...n.dataCache.effects[p] || {},
2563
- ...g,
2564
- effectId: p
2565
- };
2566
- if (s && y.listContainer !== s)
2567
- return !1;
2568
- const v = A(y.conditions || [], n.dataCache.conditions);
2569
- if (v && n.setupMediaQueryListener(u, v, t, () => {
2570
- e.update();
2571
- }), !v || v.matches) {
2572
- const w = d.key && C(d.key, t), b = E.getController(w);
2573
- if (!b)
2574
- return !0;
2575
- y.listContainer && e.watchChildList(y.listContainer);
2576
- const [S, T] = Xe(
2577
- d,
2578
- y,
2579
- b.element,
2580
- b.useFirstChild,
2581
- e.element,
2582
- e.useFirstChild,
2583
- void 0,
2584
- r
2585
- );
2586
- if (!S || !T)
2587
- return !0;
2588
- n.addedInteractions[u] = !0;
2589
- const F = $(
2590
- y.conditions || [],
2591
- n.dataCache.conditions
2592
- );
2593
- return l.push([
2594
- t,
2595
- d,
2596
- y,
2597
- S,
2598
- T,
2599
- F,
2600
- e.useFirstChild
2601
- ]), !0;
2602
- }
2603
- return !1;
2604
- });
2605
- }), l.reverse().forEach((a) => {
2606
- Ue(...a);
2607
- }), fs(t, e, n, s, r);
2608
- const f = Object.keys(i?.sequences || {}).length > 0;
2609
- return c.length > 0 || f;
2610
- }
2611
- function Fe(t, e, n, s, r, i, o, c) {
2612
- let l;
2613
- if (r.transition || r.transitionProperties) {
2614
- const f = {
2615
- key: t,
2616
- effectId: r.effectId,
2617
- transition: r.transition,
2618
- properties: r.transitionProperties,
2619
- childSelector: D(r, {
2620
- asCombinator: !0,
2621
- addItemFilter: !0,
2622
- useFirstChild: c
2623
- }),
2624
- selectorCondition: o
2625
- };
2626
- if (l = E.getController(t), !l)
2627
- return;
2628
- l.renderStyle(Kt(f));
2629
- }
2630
- _[n]?.add(e, s, r, i, {
2631
- reducedMotion: E.forceReducedMotion,
2632
- targetController: l,
2633
- selectorCondition: o,
2634
- allowA11yTriggers: E.allowA11yTriggers
2635
- });
2636
- }
2637
- function ls(t) {
2638
- const e = t.key, n = E.getInstance(e);
2639
- if (!n)
2640
- return console.warn(`No instance found for key: ${e}`), E.setController(e, t), !1;
2641
- const { triggers: s = [] } = n?.get(e) || {}, r = s.length > 0;
2642
- n.setController(e, t), s.forEach((o, c) => {
2643
- const l = A(o.conditions, n.dataCache.conditions);
2644
- if (l) {
2645
- const f = `${e}::trigger::${c}`;
2646
- n.setupMediaQueryListener(f, l, e, () => {
2647
- t.update();
2648
- });
2649
- }
2650
- (!l || l.matches) && (o.listContainer && t.watchChildList(o.listContainer), Je(e, t, n, o));
2651
- });
2652
- let i = !1;
2653
- return n && (i = tt(e, t, n)), r || i;
2654
- }
2655
- function us(t, e, n) {
2656
- const s = t.key, r = E.getInstance(s);
2657
- if (r) {
2658
- const { triggers: i = [] } = r?.get(s) || {};
2659
- i.forEach((o, c) => {
2660
- if (o.listContainer !== e)
2661
- return;
2662
- const l = A(o.conditions, r.dataCache.conditions);
2663
- if (l) {
2664
- const f = `${s}::listTrigger::${e}::${c}`;
2665
- r.setupMediaQueryListener(f, l, s, () => {
2666
- t.update();
2667
- });
2668
- }
2669
- (!l || l.matches) && Je(s, t, r, o, n);
2670
- }), tt(s, t, r, e, n);
2671
- }
2672
- }
2673
- function ds(t, e = !1) {
2674
- const n = t.key, s = E.getInstance(n);
2675
- if (!s)
2676
- return;
2677
- const r = [...s.get(n)?.selectors.values() || []].filter(Boolean).join(",");
2678
- let i;
2679
- r ? (i = [...t.element.querySelectorAll(r)], t.useFirstChild || i.push(t.element)) : i = [t.element], nt(i), s.deleteController(n, e);
2680
- }
2681
- function nt(t) {
2682
- const e = Object.values(_);
2683
- for (const n of t)
2684
- for (const s of e)
2685
- s.remove(n);
2686
- E.removeFromSequences(t);
2687
- }
2688
- const ae = "interactEffect";
2689
- class hs {
2690
- element;
2691
- key;
2692
- connected;
2693
- sheet;
2694
- useFirstChild;
2695
- _observers;
2696
- constructor(e, n, s) {
2697
- this.element = e, this.key = n, this.connected = !1, this.sheet = null, this._observers = /* @__PURE__ */ new WeakMap(), this.useFirstChild = s?.useFirstChild ?? !1;
2698
- }
2699
- connect(e) {
2700
- if (this.connected)
2701
- return;
2702
- const n = this.element.dataset.interactKey;
2703
- if (e = e || this.key || n, !e) {
2704
- console.warn("Interact: No key provided");
2705
- return;
2706
- }
2707
- n !== e && (n && console.warn(
2708
- `Interact: Key mismatch between element ${n} and parameter ${e}, updating element key`
2709
- ), this.element.dataset.interactKey = e), this.key = e, this.connected = ls(this);
2710
- }
2711
- disconnect({ removeFromCache: e = !1 } = {}) {
2712
- if ((this.key || this.element.dataset.interactKey) && ds(this, e), this.sheet) {
2713
- const s = this.element?.getRootNode(), r = s.host ? s : document;
2714
- r.adoptedStyleSheets.indexOf(this.sheet) !== -1 && (r.adoptedStyleSheets = r.adoptedStyleSheets.filter(
2715
- (o) => o !== this.sheet
2716
- ));
2717
- }
2718
- this._observers = /* @__PURE__ */ new WeakMap(), this.sheet = null, this.connected = !1;
2719
- }
2720
- update() {
2721
- this.disconnect(), this.connect();
2722
- }
2723
- renderStyle(e) {
2724
- const n = this.element?.getRootNode(), s = n.host ? n : document;
2725
- if (!this.sheet)
2726
- this.sheet = new CSSStyleSheet(), this.sheet.replaceSync(e.join(`
2727
- `)), s.adoptedStyleSheets = [...s.adoptedStyleSheets || [], this.sheet];
2728
- else {
2729
- let r = this.sheet.cssRules.length;
2730
- for (const i of e)
2731
- try {
2732
- this.sheet.insertRule(i, r), r++;
2733
- } catch (o) {
2734
- console.error(o);
2735
- }
2736
- }
2737
- }
2738
- toggleEffect(e, n, s, r) {
2739
- if (s === null)
2740
- return;
2741
- if (!r && this.element.toggleEffect) {
2742
- this.element.toggleEffect(e, n, s);
2743
- return;
2744
- }
2745
- const i = new Set(
2746
- this.element.dataset[ae]?.split(" ") || []
2747
- );
2748
- n === "toggle" ? i.has(e) ? i.delete(e) : i.add(e) : n === "add" ? i.add(e) : n === "remove" ? i.delete(e) : n === "clear" && i.clear(), (s || this.element).dataset[ae] = Array.from(i).join(" ");
2749
- }
2750
- getActiveEffects() {
2751
- const n = (this.element.dataset[ae] || "").trim();
2752
- return n ? n.split(/\s+/) : [];
2753
- }
2754
- watchChildList(e) {
2755
- const n = this.element.querySelector(e);
2756
- if (n) {
2757
- let s = this._observers.get(n);
2758
- s || (s = new MutationObserver(this._childListChangeHandler.bind(this, e)), this._observers.set(n, s), s.observe(n, { childList: !0 }));
2759
- }
2760
- }
2761
- _childListChangeHandler(e, n) {
2762
- const s = this.key || this.element.dataset.interactKey, r = [], i = [];
2763
- n.forEach((o) => {
2764
- o.removedNodes.forEach((c) => {
2765
- c instanceof HTMLElement && r.push(c);
2766
- }), o.addedNodes.forEach((c) => {
2767
- c instanceof HTMLElement && i.push(c);
2768
- });
2769
- }), nt(r), s && us(this, e, i);
2770
- }
2771
- }
2772
- function gs(t, e) {
2773
- new hs(t, e).connect();
2774
- }
2775
- function vs(t) {
2776
- const e = E.getController(t);
2777
- e && e.disconnect({ removeFromCache: !0 });
2778
- }
2779
- const ms = (t, e, n, s) => {
2780
- let i = `[data-interact-key="${t.replace(/"/g, "'")}"]`;
2781
- const o = D(e, { asCombinator: !0, useFirstChild: s });
2782
- return o && (i = `${i} ${o}`), n && (i = U(i, n)), i;
2783
- };
2784
- function ys(t, e = !1) {
2785
- const n = [], s = /* @__PURE__ */ new Set();
2786
- return t.interactions.forEach(
2787
- ({
2788
- key: r,
2789
- selector: i,
2790
- listContainer: o,
2791
- listItemSelector: c,
2792
- trigger: l,
2793
- effects: f,
2794
- conditions: a
2795
- }) => {
2796
- l === "viewEnter" && f?.forEach((h) => {
2797
- const g = h?.effectId && t.effects[h.effectId] || h;
2798
- if (!(!g.triggerType || g.triggerType === "once")) return;
2799
- const {
2800
- key: m,
2801
- selector: p,
2802
- listContainer: y,
2803
- listItemSelector: v,
2804
- conditions: w
2805
- } = g;
2806
- if (!(!m || m === r) || !(!p && !i || p === i) || !(!y && !o || y === o) || !(!v && !c || v === c)) return;
2807
- const ye = t.conditions || {}, Ee = $(w, ye), se = $(
2808
- a,
2809
- ye
2810
- );
2811
- if (!(!Ee && !se || Ee === se)) return;
2812
- const ie = ms(
2813
- r,
2814
- g,
2815
- se,
2816
- e
2817
- );
2818
- s.has(ie) || (s.add(ie), n.push(`@media (prefers-reduced-motion: no-preference) {
2819
- ${ie}:not([data-interact-enter]) {
2820
- visibility: hidden;
2821
- transform: none;
2822
- translate: none;
2823
- scale: none;
2824
- rotate: none;
2825
- }
2826
- }`));
2827
- });
2828
- }
2829
- ), n.join(`
2830
- `);
2831
- }
2832
- export {
2833
- hs as I,
2834
- E as a,
2835
- gs as b,
2836
- ys as g,
2837
- vs as r
2838
- };
2839
- //# sourceMappingURL=index-HeFaJMEX.mjs.map