hookery 0.0.1 → 1.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +72 -11
- package/dist/bridges/auth0.d.mts +16 -0
- package/dist/bridges/auth0.d.ts +16 -0
- package/dist/bridges/auth0.js +3015 -0
- package/dist/bridges/auth0.js.map +1 -0
- package/dist/bridges/auth0.mjs +2977 -0
- package/dist/bridges/auth0.mjs.map +1 -0
- package/dist/bridges/axios.d.mts +17 -0
- package/dist/bridges/axios.d.ts +17 -0
- package/dist/bridges/axios.js +15351 -0
- package/dist/bridges/axios.js.map +1 -0
- package/dist/bridges/axios.mjs +15347 -0
- package/dist/bridges/axios.mjs.map +1 -0
- package/dist/bridges/clerk.d.mts +1 -0
- package/dist/bridges/clerk.d.ts +1 -0
- package/dist/bridges/clerk.js +5991 -0
- package/dist/bridges/clerk.js.map +1 -0
- package/dist/bridges/clerk.mjs +5985 -0
- package/dist/bridges/clerk.mjs.map +1 -0
- package/dist/bridges/firebase.d.mts +14 -0
- package/dist/bridges/firebase.d.ts +14 -0
- package/dist/bridges/firebase.js +52 -0
- package/dist/bridges/firebase.js.map +1 -0
- package/dist/bridges/firebase.mjs +25 -0
- package/dist/bridges/firebase.mjs.map +1 -0
- package/dist/bridges/jotai.d.mts +11 -0
- package/dist/bridges/jotai.d.ts +11 -0
- package/dist/bridges/jotai.js +870 -0
- package/dist/bridges/jotai.js.map +1 -0
- package/dist/bridges/jotai.mjs +827 -0
- package/dist/bridges/jotai.mjs.map +1 -0
- package/dist/bridges/motion.d.mts +6 -0
- package/dist/bridges/motion.d.ts +6 -0
- package/dist/bridges/motion.js +3752 -0
- package/dist/bridges/motion.js.map +1 -0
- package/dist/bridges/motion.mjs +3721 -0
- package/dist/bridges/motion.mjs.map +1 -0
- package/dist/bridges/next.d.mts +10 -0
- package/dist/bridges/next.d.ts +10 -0
- package/dist/bridges/next.js +2588 -0
- package/dist/bridges/next.js.map +1 -0
- package/dist/bridges/next.mjs +2582 -0
- package/dist/bridges/next.mjs.map +1 -0
- package/dist/bridges/redux.d.mts +15 -0
- package/dist/bridges/redux.d.ts +15 -0
- package/dist/bridges/redux.js +410 -0
- package/dist/bridges/redux.js.map +1 -0
- package/dist/bridges/redux.mjs +402 -0
- package/dist/bridges/redux.mjs.map +1 -0
- package/dist/bridges/remix.d.mts +1 -0
- package/dist/bridges/remix.d.ts +1 -0
- package/dist/bridges/remix.js +2215 -0
- package/dist/bridges/remix.js.map +1 -0
- package/dist/bridges/remix.mjs +2174 -0
- package/dist/bridges/remix.mjs.map +1 -0
- package/dist/bridges/stripe.d.mts +15 -0
- package/dist/bridges/stripe.d.ts +15 -0
- package/dist/bridges/stripe.js +1572 -0
- package/dist/bridges/stripe.js.map +1 -0
- package/dist/bridges/stripe.mjs +1556 -0
- package/dist/bridges/stripe.mjs.map +1 -0
- package/dist/bridges/supabase.d.mts +13 -0
- package/dist/bridges/supabase.d.ts +13 -0
- package/dist/bridges/supabase.js +51 -0
- package/dist/bridges/supabase.js.map +1 -0
- package/dist/bridges/supabase.mjs +24 -0
- package/dist/bridges/supabase.mjs.map +1 -0
- package/dist/bridges/tanstack.d.mts +3 -0
- package/dist/bridges/tanstack.d.ts +3 -0
- package/dist/bridges/tanstack.js +1319 -0
- package/dist/bridges/tanstack.js.map +1 -0
- package/dist/bridges/tanstack.mjs +1281 -0
- package/dist/bridges/tanstack.mjs.map +1 -0
- package/dist/bridges/yup.d.mts +16 -0
- package/dist/bridges/yup.d.ts +16 -0
- package/dist/bridges/yup.js +80 -0
- package/dist/bridges/yup.js.map +1 -0
- package/dist/bridges/yup.mjs +43 -0
- package/dist/bridges/yup.mjs.map +1 -0
- package/dist/bridges/zod.d.mts +19 -0
- package/dist/bridges/zod.d.ts +19 -0
- package/dist/bridges/zod.js +66 -0
- package/dist/bridges/zod.js.map +1 -0
- package/dist/bridges/zod.mjs +39 -0
- package/dist/bridges/zod.mjs.map +1 -0
- package/dist/bridges/zustand.d.mts +14 -0
- package/dist/bridges/zustand.d.ts +14 -0
- package/dist/bridges/zustand.js +58 -0
- package/dist/bridges/zustand.js.map +1 -0
- package/dist/bridges/zustand.mjs +21 -0
- package/dist/bridges/zustand.mjs.map +1 -0
- package/dist/index.d.mts +3124 -8
- package/dist/index.d.ts +3124 -8
- package/dist/index.js +4290 -10
- package/dist/index.js.map +1 -0
- package/dist/index.mjs +4172 -7
- package/dist/index.mjs.map +1 -0
- package/package.json +131 -6
|
@@ -0,0 +1,3721 @@
|
|
|
1
|
+
// node_modules/framer-motion/dist/es/utils/use-constant.mjs
|
|
2
|
+
import { useRef } from "react";
|
|
3
|
+
function useConstant(init) {
|
|
4
|
+
const ref = useRef(null);
|
|
5
|
+
if (ref.current === null) {
|
|
6
|
+
ref.current = init();
|
|
7
|
+
}
|
|
8
|
+
return ref.current;
|
|
9
|
+
}
|
|
10
|
+
|
|
11
|
+
// node_modules/framer-motion/dist/es/utils/use-isomorphic-effect.mjs
|
|
12
|
+
import { useLayoutEffect, useEffect } from "react";
|
|
13
|
+
|
|
14
|
+
// node_modules/framer-motion/dist/es/utils/is-browser.mjs
|
|
15
|
+
var isBrowser = typeof window !== "undefined";
|
|
16
|
+
|
|
17
|
+
// node_modules/framer-motion/dist/es/utils/use-isomorphic-effect.mjs
|
|
18
|
+
var useIsomorphicLayoutEffect = isBrowser ? useLayoutEffect : useEffect;
|
|
19
|
+
|
|
20
|
+
// node_modules/motion-utils/dist/es/array.mjs
|
|
21
|
+
function addUniqueItem(arr, item) {
|
|
22
|
+
if (arr.indexOf(item) === -1)
|
|
23
|
+
arr.push(item);
|
|
24
|
+
}
|
|
25
|
+
function removeItem(arr, item) {
|
|
26
|
+
const index = arr.indexOf(item);
|
|
27
|
+
if (index > -1)
|
|
28
|
+
arr.splice(index, 1);
|
|
29
|
+
}
|
|
30
|
+
|
|
31
|
+
// node_modules/motion-utils/dist/es/clamp.mjs
|
|
32
|
+
var clamp = (min, max, v) => {
|
|
33
|
+
if (v > max)
|
|
34
|
+
return max;
|
|
35
|
+
if (v < min)
|
|
36
|
+
return min;
|
|
37
|
+
return v;
|
|
38
|
+
};
|
|
39
|
+
|
|
40
|
+
// node_modules/motion-utils/dist/es/format-error-message.mjs
|
|
41
|
+
function formatErrorMessage(message, errorCode) {
|
|
42
|
+
return errorCode ? `${message}. For more information and steps for solving, visit https://motion.dev/troubleshooting/${errorCode}` : message;
|
|
43
|
+
}
|
|
44
|
+
|
|
45
|
+
// node_modules/motion-utils/dist/es/errors.mjs
|
|
46
|
+
var warning = () => {
|
|
47
|
+
};
|
|
48
|
+
var invariant = () => {
|
|
49
|
+
};
|
|
50
|
+
if (typeof process !== "undefined" && process.env?.NODE_ENV !== "production") {
|
|
51
|
+
warning = (check, message, errorCode) => {
|
|
52
|
+
if (!check && typeof console !== "undefined") {
|
|
53
|
+
console.warn(formatErrorMessage(message, errorCode));
|
|
54
|
+
}
|
|
55
|
+
};
|
|
56
|
+
invariant = (check, message, errorCode) => {
|
|
57
|
+
if (!check) {
|
|
58
|
+
throw new Error(formatErrorMessage(message, errorCode));
|
|
59
|
+
}
|
|
60
|
+
};
|
|
61
|
+
}
|
|
62
|
+
|
|
63
|
+
// node_modules/motion-utils/dist/es/global-config.mjs
|
|
64
|
+
var MotionGlobalConfig = {};
|
|
65
|
+
|
|
66
|
+
// node_modules/motion-utils/dist/es/is-object.mjs
|
|
67
|
+
function isObject(value) {
|
|
68
|
+
return typeof value === "object" && value !== null;
|
|
69
|
+
}
|
|
70
|
+
|
|
71
|
+
// node_modules/motion-utils/dist/es/memo.mjs
|
|
72
|
+
// @__NO_SIDE_EFFECTS__
|
|
73
|
+
function memo(callback) {
|
|
74
|
+
let result;
|
|
75
|
+
return () => {
|
|
76
|
+
if (result === void 0)
|
|
77
|
+
result = callback();
|
|
78
|
+
return result;
|
|
79
|
+
};
|
|
80
|
+
}
|
|
81
|
+
|
|
82
|
+
// node_modules/motion-utils/dist/es/noop.mjs
|
|
83
|
+
var noop = /* @__NO_SIDE_EFFECTS__ */ (any) => any;
|
|
84
|
+
|
|
85
|
+
// node_modules/motion-utils/dist/es/pipe.mjs
|
|
86
|
+
var combineFunctions = (a, b) => (v) => b(a(v));
|
|
87
|
+
var pipe = (...transformers) => transformers.reduce(combineFunctions);
|
|
88
|
+
|
|
89
|
+
// node_modules/motion-utils/dist/es/progress.mjs
|
|
90
|
+
var progress = /* @__NO_SIDE_EFFECTS__ */ (from, to, value) => {
|
|
91
|
+
const toFromDifference = to - from;
|
|
92
|
+
return toFromDifference === 0 ? 1 : (value - from) / toFromDifference;
|
|
93
|
+
};
|
|
94
|
+
|
|
95
|
+
// node_modules/motion-utils/dist/es/subscription-manager.mjs
|
|
96
|
+
var SubscriptionManager = class {
|
|
97
|
+
constructor() {
|
|
98
|
+
this.subscriptions = [];
|
|
99
|
+
}
|
|
100
|
+
add(handler) {
|
|
101
|
+
addUniqueItem(this.subscriptions, handler);
|
|
102
|
+
return () => removeItem(this.subscriptions, handler);
|
|
103
|
+
}
|
|
104
|
+
notify(a, b, c) {
|
|
105
|
+
const numSubscriptions = this.subscriptions.length;
|
|
106
|
+
if (!numSubscriptions)
|
|
107
|
+
return;
|
|
108
|
+
if (numSubscriptions === 1) {
|
|
109
|
+
this.subscriptions[0](a, b, c);
|
|
110
|
+
} else {
|
|
111
|
+
for (let i = 0; i < numSubscriptions; i++) {
|
|
112
|
+
const handler = this.subscriptions[i];
|
|
113
|
+
handler && handler(a, b, c);
|
|
114
|
+
}
|
|
115
|
+
}
|
|
116
|
+
}
|
|
117
|
+
getSize() {
|
|
118
|
+
return this.subscriptions.length;
|
|
119
|
+
}
|
|
120
|
+
clear() {
|
|
121
|
+
this.subscriptions.length = 0;
|
|
122
|
+
}
|
|
123
|
+
};
|
|
124
|
+
|
|
125
|
+
// node_modules/motion-utils/dist/es/time-conversion.mjs
|
|
126
|
+
var secondsToMilliseconds = /* @__NO_SIDE_EFFECTS__ */ (seconds) => seconds * 1e3;
|
|
127
|
+
var millisecondsToSeconds = /* @__NO_SIDE_EFFECTS__ */ (milliseconds) => milliseconds / 1e3;
|
|
128
|
+
|
|
129
|
+
// node_modules/motion-utils/dist/es/velocity-per-second.mjs
|
|
130
|
+
function velocityPerSecond(velocity, frameDuration) {
|
|
131
|
+
return frameDuration ? velocity * (1e3 / frameDuration) : 0;
|
|
132
|
+
}
|
|
133
|
+
|
|
134
|
+
// node_modules/motion-utils/dist/es/warn-once.mjs
|
|
135
|
+
var warned = /* @__PURE__ */ new Set();
|
|
136
|
+
function warnOnce(condition, message, errorCode) {
|
|
137
|
+
if (condition || warned.has(message))
|
|
138
|
+
return;
|
|
139
|
+
console.warn(formatErrorMessage(message, errorCode));
|
|
140
|
+
warned.add(message);
|
|
141
|
+
}
|
|
142
|
+
|
|
143
|
+
// node_modules/motion-utils/dist/es/easing/cubic-bezier.mjs
|
|
144
|
+
var calcBezier = (t, a1, a2) => (((1 - 3 * a2 + 3 * a1) * t + (3 * a2 - 6 * a1)) * t + 3 * a1) * t;
|
|
145
|
+
var subdivisionPrecision = 1e-7;
|
|
146
|
+
var subdivisionMaxIterations = 12;
|
|
147
|
+
function binarySubdivide(x, lowerBound, upperBound, mX1, mX2) {
|
|
148
|
+
let currentX;
|
|
149
|
+
let currentT;
|
|
150
|
+
let i = 0;
|
|
151
|
+
do {
|
|
152
|
+
currentT = lowerBound + (upperBound - lowerBound) / 2;
|
|
153
|
+
currentX = calcBezier(currentT, mX1, mX2) - x;
|
|
154
|
+
if (currentX > 0) {
|
|
155
|
+
upperBound = currentT;
|
|
156
|
+
} else {
|
|
157
|
+
lowerBound = currentT;
|
|
158
|
+
}
|
|
159
|
+
} while (Math.abs(currentX) > subdivisionPrecision && ++i < subdivisionMaxIterations);
|
|
160
|
+
return currentT;
|
|
161
|
+
}
|
|
162
|
+
function cubicBezier(mX1, mY1, mX2, mY2) {
|
|
163
|
+
if (mX1 === mY1 && mX2 === mY2)
|
|
164
|
+
return noop;
|
|
165
|
+
const getTForX = (aX) => binarySubdivide(aX, 0, 1, mX1, mX2);
|
|
166
|
+
return (t) => t === 0 || t === 1 ? t : calcBezier(getTForX(t), mY1, mY2);
|
|
167
|
+
}
|
|
168
|
+
|
|
169
|
+
// node_modules/motion-utils/dist/es/easing/modifiers/mirror.mjs
|
|
170
|
+
var mirrorEasing = (easing) => (p) => p <= 0.5 ? easing(2 * p) / 2 : (2 - easing(2 * (1 - p))) / 2;
|
|
171
|
+
|
|
172
|
+
// node_modules/motion-utils/dist/es/easing/modifiers/reverse.mjs
|
|
173
|
+
var reverseEasing = (easing) => (p) => 1 - easing(1 - p);
|
|
174
|
+
|
|
175
|
+
// node_modules/motion-utils/dist/es/easing/back.mjs
|
|
176
|
+
var backOut = /* @__PURE__ */ cubicBezier(0.33, 1.53, 0.69, 0.99);
|
|
177
|
+
var backIn = /* @__PURE__ */ reverseEasing(backOut);
|
|
178
|
+
var backInOut = /* @__PURE__ */ mirrorEasing(backIn);
|
|
179
|
+
|
|
180
|
+
// node_modules/motion-utils/dist/es/easing/anticipate.mjs
|
|
181
|
+
var anticipate = (p) => (p *= 2) < 1 ? 0.5 * backIn(p) : 0.5 * (2 - Math.pow(2, -10 * (p - 1)));
|
|
182
|
+
|
|
183
|
+
// node_modules/motion-utils/dist/es/easing/circ.mjs
|
|
184
|
+
var circIn = (p) => 1 - Math.sin(Math.acos(p));
|
|
185
|
+
var circOut = reverseEasing(circIn);
|
|
186
|
+
var circInOut = mirrorEasing(circIn);
|
|
187
|
+
|
|
188
|
+
// node_modules/motion-utils/dist/es/easing/ease.mjs
|
|
189
|
+
var easeIn = /* @__PURE__ */ cubicBezier(0.42, 0, 1, 1);
|
|
190
|
+
var easeOut = /* @__PURE__ */ cubicBezier(0, 0, 0.58, 1);
|
|
191
|
+
var easeInOut = /* @__PURE__ */ cubicBezier(0.42, 0, 0.58, 1);
|
|
192
|
+
|
|
193
|
+
// node_modules/motion-utils/dist/es/easing/utils/is-easing-array.mjs
|
|
194
|
+
var isEasingArray = (ease2) => {
|
|
195
|
+
return Array.isArray(ease2) && typeof ease2[0] !== "number";
|
|
196
|
+
};
|
|
197
|
+
|
|
198
|
+
// node_modules/motion-utils/dist/es/easing/utils/is-bezier-definition.mjs
|
|
199
|
+
var isBezierDefinition = (easing) => Array.isArray(easing) && typeof easing[0] === "number";
|
|
200
|
+
|
|
201
|
+
// node_modules/motion-utils/dist/es/easing/utils/map.mjs
|
|
202
|
+
var easingLookup = {
|
|
203
|
+
linear: noop,
|
|
204
|
+
easeIn,
|
|
205
|
+
easeInOut,
|
|
206
|
+
easeOut,
|
|
207
|
+
circIn,
|
|
208
|
+
circInOut,
|
|
209
|
+
circOut,
|
|
210
|
+
backIn,
|
|
211
|
+
backInOut,
|
|
212
|
+
backOut,
|
|
213
|
+
anticipate
|
|
214
|
+
};
|
|
215
|
+
var isValidEasing = (easing) => {
|
|
216
|
+
return typeof easing === "string";
|
|
217
|
+
};
|
|
218
|
+
var easingDefinitionToFunction = (definition) => {
|
|
219
|
+
if (isBezierDefinition(definition)) {
|
|
220
|
+
invariant(definition.length === 4, `Cubic bezier arrays must contain four numerical values.`, "cubic-bezier-length");
|
|
221
|
+
const [x1, y1, x2, y2] = definition;
|
|
222
|
+
return cubicBezier(x1, y1, x2, y2);
|
|
223
|
+
} else if (isValidEasing(definition)) {
|
|
224
|
+
invariant(easingLookup[definition] !== void 0, `Invalid easing type '${definition}'`, "invalid-easing-type");
|
|
225
|
+
return easingLookup[definition];
|
|
226
|
+
}
|
|
227
|
+
return definition;
|
|
228
|
+
};
|
|
229
|
+
|
|
230
|
+
// node_modules/motion-dom/dist/es/frameloop/order.mjs
|
|
231
|
+
var stepsOrder = [
|
|
232
|
+
"setup",
|
|
233
|
+
// Compute
|
|
234
|
+
"read",
|
|
235
|
+
// Read
|
|
236
|
+
"resolveKeyframes",
|
|
237
|
+
// Write/Read/Write/Read
|
|
238
|
+
"preUpdate",
|
|
239
|
+
// Compute
|
|
240
|
+
"update",
|
|
241
|
+
// Compute
|
|
242
|
+
"preRender",
|
|
243
|
+
// Compute
|
|
244
|
+
"render",
|
|
245
|
+
// Write
|
|
246
|
+
"postRender"
|
|
247
|
+
// Compute
|
|
248
|
+
];
|
|
249
|
+
|
|
250
|
+
// node_modules/motion-dom/dist/es/stats/buffer.mjs
|
|
251
|
+
var statsBuffer = {
|
|
252
|
+
value: null,
|
|
253
|
+
addProjectionMetrics: null
|
|
254
|
+
};
|
|
255
|
+
|
|
256
|
+
// node_modules/motion-dom/dist/es/frameloop/render-step.mjs
|
|
257
|
+
function createRenderStep(runNextFrame, stepName) {
|
|
258
|
+
let thisFrame = /* @__PURE__ */ new Set();
|
|
259
|
+
let nextFrame = /* @__PURE__ */ new Set();
|
|
260
|
+
let isProcessing = false;
|
|
261
|
+
let flushNextFrame = false;
|
|
262
|
+
const toKeepAlive = /* @__PURE__ */ new WeakSet();
|
|
263
|
+
let latestFrameData = {
|
|
264
|
+
delta: 0,
|
|
265
|
+
timestamp: 0,
|
|
266
|
+
isProcessing: false
|
|
267
|
+
};
|
|
268
|
+
let numCalls = 0;
|
|
269
|
+
function triggerCallback(callback) {
|
|
270
|
+
if (toKeepAlive.has(callback)) {
|
|
271
|
+
step.schedule(callback);
|
|
272
|
+
runNextFrame();
|
|
273
|
+
}
|
|
274
|
+
numCalls++;
|
|
275
|
+
callback(latestFrameData);
|
|
276
|
+
}
|
|
277
|
+
const step = {
|
|
278
|
+
/**
|
|
279
|
+
* Schedule a process to run on the next frame.
|
|
280
|
+
*/
|
|
281
|
+
schedule: (callback, keepAlive = false, immediate = false) => {
|
|
282
|
+
const addToCurrentFrame = immediate && isProcessing;
|
|
283
|
+
const queue = addToCurrentFrame ? thisFrame : nextFrame;
|
|
284
|
+
if (keepAlive)
|
|
285
|
+
toKeepAlive.add(callback);
|
|
286
|
+
if (!queue.has(callback))
|
|
287
|
+
queue.add(callback);
|
|
288
|
+
return callback;
|
|
289
|
+
},
|
|
290
|
+
/**
|
|
291
|
+
* Cancel the provided callback from running on the next frame.
|
|
292
|
+
*/
|
|
293
|
+
cancel: (callback) => {
|
|
294
|
+
nextFrame.delete(callback);
|
|
295
|
+
toKeepAlive.delete(callback);
|
|
296
|
+
},
|
|
297
|
+
/**
|
|
298
|
+
* Execute all schedule callbacks.
|
|
299
|
+
*/
|
|
300
|
+
process: (frameData2) => {
|
|
301
|
+
latestFrameData = frameData2;
|
|
302
|
+
if (isProcessing) {
|
|
303
|
+
flushNextFrame = true;
|
|
304
|
+
return;
|
|
305
|
+
}
|
|
306
|
+
isProcessing = true;
|
|
307
|
+
[thisFrame, nextFrame] = [nextFrame, thisFrame];
|
|
308
|
+
thisFrame.forEach(triggerCallback);
|
|
309
|
+
if (stepName && statsBuffer.value) {
|
|
310
|
+
statsBuffer.value.frameloop[stepName].push(numCalls);
|
|
311
|
+
}
|
|
312
|
+
numCalls = 0;
|
|
313
|
+
thisFrame.clear();
|
|
314
|
+
isProcessing = false;
|
|
315
|
+
if (flushNextFrame) {
|
|
316
|
+
flushNextFrame = false;
|
|
317
|
+
step.process(frameData2);
|
|
318
|
+
}
|
|
319
|
+
}
|
|
320
|
+
};
|
|
321
|
+
return step;
|
|
322
|
+
}
|
|
323
|
+
|
|
324
|
+
// node_modules/motion-dom/dist/es/frameloop/batcher.mjs
|
|
325
|
+
var maxElapsed = 40;
|
|
326
|
+
function createRenderBatcher(scheduleNextBatch, allowKeepAlive) {
|
|
327
|
+
let runNextFrame = false;
|
|
328
|
+
let useDefaultElapsed = true;
|
|
329
|
+
const state = {
|
|
330
|
+
delta: 0,
|
|
331
|
+
timestamp: 0,
|
|
332
|
+
isProcessing: false
|
|
333
|
+
};
|
|
334
|
+
const flagRunNextFrame = () => runNextFrame = true;
|
|
335
|
+
const steps = stepsOrder.reduce((acc, key) => {
|
|
336
|
+
acc[key] = createRenderStep(flagRunNextFrame, allowKeepAlive ? key : void 0);
|
|
337
|
+
return acc;
|
|
338
|
+
}, {});
|
|
339
|
+
const { setup, read, resolveKeyframes, preUpdate, update, preRender, render, postRender } = steps;
|
|
340
|
+
const processBatch = () => {
|
|
341
|
+
const timestamp = MotionGlobalConfig.useManualTiming ? state.timestamp : performance.now();
|
|
342
|
+
runNextFrame = false;
|
|
343
|
+
if (!MotionGlobalConfig.useManualTiming) {
|
|
344
|
+
state.delta = useDefaultElapsed ? 1e3 / 60 : Math.max(Math.min(timestamp - state.timestamp, maxElapsed), 1);
|
|
345
|
+
}
|
|
346
|
+
state.timestamp = timestamp;
|
|
347
|
+
state.isProcessing = true;
|
|
348
|
+
setup.process(state);
|
|
349
|
+
read.process(state);
|
|
350
|
+
resolveKeyframes.process(state);
|
|
351
|
+
preUpdate.process(state);
|
|
352
|
+
update.process(state);
|
|
353
|
+
preRender.process(state);
|
|
354
|
+
render.process(state);
|
|
355
|
+
postRender.process(state);
|
|
356
|
+
state.isProcessing = false;
|
|
357
|
+
if (runNextFrame && allowKeepAlive) {
|
|
358
|
+
useDefaultElapsed = false;
|
|
359
|
+
scheduleNextBatch(processBatch);
|
|
360
|
+
}
|
|
361
|
+
};
|
|
362
|
+
const wake = () => {
|
|
363
|
+
runNextFrame = true;
|
|
364
|
+
useDefaultElapsed = true;
|
|
365
|
+
if (!state.isProcessing) {
|
|
366
|
+
scheduleNextBatch(processBatch);
|
|
367
|
+
}
|
|
368
|
+
};
|
|
369
|
+
const schedule = stepsOrder.reduce((acc, key) => {
|
|
370
|
+
const step = steps[key];
|
|
371
|
+
acc[key] = (process2, keepAlive = false, immediate = false) => {
|
|
372
|
+
if (!runNextFrame)
|
|
373
|
+
wake();
|
|
374
|
+
return step.schedule(process2, keepAlive, immediate);
|
|
375
|
+
};
|
|
376
|
+
return acc;
|
|
377
|
+
}, {});
|
|
378
|
+
const cancel = (process2) => {
|
|
379
|
+
for (let i = 0; i < stepsOrder.length; i++) {
|
|
380
|
+
steps[stepsOrder[i]].cancel(process2);
|
|
381
|
+
}
|
|
382
|
+
};
|
|
383
|
+
return { schedule, cancel, state, steps };
|
|
384
|
+
}
|
|
385
|
+
|
|
386
|
+
// node_modules/motion-dom/dist/es/frameloop/frame.mjs
|
|
387
|
+
var { schedule: frame, cancel: cancelFrame, state: frameData, steps: frameSteps } = /* @__PURE__ */ createRenderBatcher(typeof requestAnimationFrame !== "undefined" ? requestAnimationFrame : noop, true);
|
|
388
|
+
|
|
389
|
+
// node_modules/motion-dom/dist/es/frameloop/sync-time.mjs
|
|
390
|
+
var now;
|
|
391
|
+
function clearTime() {
|
|
392
|
+
now = void 0;
|
|
393
|
+
}
|
|
394
|
+
var time = {
|
|
395
|
+
now: () => {
|
|
396
|
+
if (now === void 0) {
|
|
397
|
+
time.set(frameData.isProcessing || MotionGlobalConfig.useManualTiming ? frameData.timestamp : performance.now());
|
|
398
|
+
}
|
|
399
|
+
return now;
|
|
400
|
+
},
|
|
401
|
+
set: (newTime) => {
|
|
402
|
+
now = newTime;
|
|
403
|
+
queueMicrotask(clearTime);
|
|
404
|
+
}
|
|
405
|
+
};
|
|
406
|
+
|
|
407
|
+
// node_modules/motion-dom/dist/es/stats/animation-count.mjs
|
|
408
|
+
var activeAnimations = {
|
|
409
|
+
layout: 0,
|
|
410
|
+
mainThread: 0,
|
|
411
|
+
waapi: 0
|
|
412
|
+
};
|
|
413
|
+
|
|
414
|
+
// node_modules/motion-dom/dist/es/animation/utils/is-css-variable.mjs
|
|
415
|
+
var checkStringStartsWith = (token) => (key) => typeof key === "string" && key.startsWith(token);
|
|
416
|
+
var startsAsVariableToken = /* @__PURE__ */ checkStringStartsWith("var(--");
|
|
417
|
+
var isCSSVariableToken = (value) => {
|
|
418
|
+
const startsWithToken = startsAsVariableToken(value);
|
|
419
|
+
if (!startsWithToken)
|
|
420
|
+
return false;
|
|
421
|
+
return singleCssVariableRegex.test(value.split("/*")[0].trim());
|
|
422
|
+
};
|
|
423
|
+
var singleCssVariableRegex = /var\(--(?:[\w-]+\s*|[\w-]+\s*,(?:\s*[^)(\s]|\s*\((?:[^)(]|\([^)(]*\))*\))+\s*)\)$/iu;
|
|
424
|
+
|
|
425
|
+
// node_modules/motion-dom/dist/es/value/types/numbers/index.mjs
|
|
426
|
+
var number = {
|
|
427
|
+
test: (v) => typeof v === "number",
|
|
428
|
+
parse: parseFloat,
|
|
429
|
+
transform: (v) => v
|
|
430
|
+
};
|
|
431
|
+
var alpha = {
|
|
432
|
+
...number,
|
|
433
|
+
transform: (v) => clamp(0, 1, v)
|
|
434
|
+
};
|
|
435
|
+
var scale = {
|
|
436
|
+
...number,
|
|
437
|
+
default: 1
|
|
438
|
+
};
|
|
439
|
+
|
|
440
|
+
// node_modules/motion-dom/dist/es/value/types/utils/sanitize.mjs
|
|
441
|
+
var sanitize = (v) => Math.round(v * 1e5) / 1e5;
|
|
442
|
+
|
|
443
|
+
// node_modules/motion-dom/dist/es/value/types/utils/float-regex.mjs
|
|
444
|
+
var floatRegex = /-?(?:\d+(?:\.\d+)?|\.\d+)/gu;
|
|
445
|
+
|
|
446
|
+
// node_modules/motion-dom/dist/es/value/types/utils/is-nullish.mjs
|
|
447
|
+
function isNullish(v) {
|
|
448
|
+
return v == null;
|
|
449
|
+
}
|
|
450
|
+
|
|
451
|
+
// node_modules/motion-dom/dist/es/value/types/utils/single-color-regex.mjs
|
|
452
|
+
var singleColorRegex = /^(?:#[\da-f]{3,8}|(?:rgb|hsl)a?\((?:-?[\d.]+%?[,\s]+){2}-?[\d.]+%?\s*(?:[,/]\s*)?(?:\b\d+(?:\.\d+)?|\.\d+)?%?\))$/iu;
|
|
453
|
+
|
|
454
|
+
// node_modules/motion-dom/dist/es/value/types/color/utils.mjs
|
|
455
|
+
var isColorString = (type, testProp) => (v) => {
|
|
456
|
+
return Boolean(typeof v === "string" && singleColorRegex.test(v) && v.startsWith(type) || testProp && !isNullish(v) && Object.prototype.hasOwnProperty.call(v, testProp));
|
|
457
|
+
};
|
|
458
|
+
var splitColor = (aName, bName, cName) => (v) => {
|
|
459
|
+
if (typeof v !== "string")
|
|
460
|
+
return v;
|
|
461
|
+
const [a, b, c, alpha2] = v.match(floatRegex);
|
|
462
|
+
return {
|
|
463
|
+
[aName]: parseFloat(a),
|
|
464
|
+
[bName]: parseFloat(b),
|
|
465
|
+
[cName]: parseFloat(c),
|
|
466
|
+
alpha: alpha2 !== void 0 ? parseFloat(alpha2) : 1
|
|
467
|
+
};
|
|
468
|
+
};
|
|
469
|
+
|
|
470
|
+
// node_modules/motion-dom/dist/es/value/types/color/rgba.mjs
|
|
471
|
+
var clampRgbUnit = (v) => clamp(0, 255, v);
|
|
472
|
+
var rgbUnit = {
|
|
473
|
+
...number,
|
|
474
|
+
transform: (v) => Math.round(clampRgbUnit(v))
|
|
475
|
+
};
|
|
476
|
+
var rgba = {
|
|
477
|
+
test: /* @__PURE__ */ isColorString("rgb", "red"),
|
|
478
|
+
parse: /* @__PURE__ */ splitColor("red", "green", "blue"),
|
|
479
|
+
transform: ({ red, green, blue, alpha: alpha$1 = 1 }) => "rgba(" + rgbUnit.transform(red) + ", " + rgbUnit.transform(green) + ", " + rgbUnit.transform(blue) + ", " + sanitize(alpha.transform(alpha$1)) + ")"
|
|
480
|
+
};
|
|
481
|
+
|
|
482
|
+
// node_modules/motion-dom/dist/es/value/types/color/hex.mjs
|
|
483
|
+
function parseHex(v) {
|
|
484
|
+
let r = "";
|
|
485
|
+
let g = "";
|
|
486
|
+
let b = "";
|
|
487
|
+
let a = "";
|
|
488
|
+
if (v.length > 5) {
|
|
489
|
+
r = v.substring(1, 3);
|
|
490
|
+
g = v.substring(3, 5);
|
|
491
|
+
b = v.substring(5, 7);
|
|
492
|
+
a = v.substring(7, 9);
|
|
493
|
+
} else {
|
|
494
|
+
r = v.substring(1, 2);
|
|
495
|
+
g = v.substring(2, 3);
|
|
496
|
+
b = v.substring(3, 4);
|
|
497
|
+
a = v.substring(4, 5);
|
|
498
|
+
r += r;
|
|
499
|
+
g += g;
|
|
500
|
+
b += b;
|
|
501
|
+
a += a;
|
|
502
|
+
}
|
|
503
|
+
return {
|
|
504
|
+
red: parseInt(r, 16),
|
|
505
|
+
green: parseInt(g, 16),
|
|
506
|
+
blue: parseInt(b, 16),
|
|
507
|
+
alpha: a ? parseInt(a, 16) / 255 : 1
|
|
508
|
+
};
|
|
509
|
+
}
|
|
510
|
+
var hex = {
|
|
511
|
+
test: /* @__PURE__ */ isColorString("#"),
|
|
512
|
+
parse: parseHex,
|
|
513
|
+
transform: rgba.transform
|
|
514
|
+
};
|
|
515
|
+
|
|
516
|
+
// node_modules/motion-dom/dist/es/value/types/numbers/units.mjs
|
|
517
|
+
var createUnitType = /* @__NO_SIDE_EFFECTS__ */ (unit) => ({
|
|
518
|
+
test: (v) => typeof v === "string" && v.endsWith(unit) && v.split(" ").length === 1,
|
|
519
|
+
parse: parseFloat,
|
|
520
|
+
transform: (v) => `${v}${unit}`
|
|
521
|
+
});
|
|
522
|
+
var percent = /* @__PURE__ */ createUnitType("%");
|
|
523
|
+
|
|
524
|
+
// node_modules/motion-dom/dist/es/value/types/color/hsla.mjs
|
|
525
|
+
var hsla = {
|
|
526
|
+
test: /* @__PURE__ */ isColorString("hsl", "hue"),
|
|
527
|
+
parse: /* @__PURE__ */ splitColor("hue", "saturation", "lightness"),
|
|
528
|
+
transform: ({ hue, saturation, lightness, alpha: alpha$1 = 1 }) => {
|
|
529
|
+
return "hsla(" + Math.round(hue) + ", " + percent.transform(sanitize(saturation)) + ", " + percent.transform(sanitize(lightness)) + ", " + sanitize(alpha.transform(alpha$1)) + ")";
|
|
530
|
+
}
|
|
531
|
+
};
|
|
532
|
+
|
|
533
|
+
// node_modules/motion-dom/dist/es/value/types/color/index.mjs
|
|
534
|
+
var color = {
|
|
535
|
+
test: (v) => rgba.test(v) || hex.test(v) || hsla.test(v),
|
|
536
|
+
parse: (v) => {
|
|
537
|
+
if (rgba.test(v)) {
|
|
538
|
+
return rgba.parse(v);
|
|
539
|
+
} else if (hsla.test(v)) {
|
|
540
|
+
return hsla.parse(v);
|
|
541
|
+
} else {
|
|
542
|
+
return hex.parse(v);
|
|
543
|
+
}
|
|
544
|
+
},
|
|
545
|
+
transform: (v) => {
|
|
546
|
+
return typeof v === "string" ? v : v.hasOwnProperty("red") ? rgba.transform(v) : hsla.transform(v);
|
|
547
|
+
},
|
|
548
|
+
getAnimatableNone: (v) => {
|
|
549
|
+
const parsed = color.parse(v);
|
|
550
|
+
parsed.alpha = 0;
|
|
551
|
+
return color.transform(parsed);
|
|
552
|
+
}
|
|
553
|
+
};
|
|
554
|
+
|
|
555
|
+
// node_modules/motion-dom/dist/es/value/types/utils/color-regex.mjs
|
|
556
|
+
var colorRegex = /(?:#[\da-f]{3,8}|(?:rgb|hsl)a?\((?:-?[\d.]+%?[,\s]+){2}-?[\d.]+%?\s*(?:[,/]\s*)?(?:\b\d+(?:\.\d+)?|\.\d+)?%?\))/giu;
|
|
557
|
+
|
|
558
|
+
// node_modules/motion-dom/dist/es/value/types/complex/index.mjs
|
|
559
|
+
function test(v) {
|
|
560
|
+
return isNaN(v) && typeof v === "string" && (v.match(floatRegex)?.length || 0) + (v.match(colorRegex)?.length || 0) > 0;
|
|
561
|
+
}
|
|
562
|
+
var NUMBER_TOKEN = "number";
|
|
563
|
+
var COLOR_TOKEN = "color";
|
|
564
|
+
var VAR_TOKEN = "var";
|
|
565
|
+
var VAR_FUNCTION_TOKEN = "var(";
|
|
566
|
+
var SPLIT_TOKEN = "${}";
|
|
567
|
+
var complexRegex = /var\s*\(\s*--(?:[\w-]+\s*|[\w-]+\s*,(?:\s*[^)(\s]|\s*\((?:[^)(]|\([^)(]*\))*\))+\s*)\)|#[\da-f]{3,8}|(?:rgb|hsl)a?\((?:-?[\d.]+%?[,\s]+){2}-?[\d.]+%?\s*(?:[,/]\s*)?(?:\b\d+(?:\.\d+)?|\.\d+)?%?\)|-?(?:\d+(?:\.\d+)?|\.\d+)/giu;
|
|
568
|
+
function analyseComplexValue(value) {
|
|
569
|
+
const originalValue = value.toString();
|
|
570
|
+
const values = [];
|
|
571
|
+
const indexes = {
|
|
572
|
+
color: [],
|
|
573
|
+
number: [],
|
|
574
|
+
var: []
|
|
575
|
+
};
|
|
576
|
+
const types = [];
|
|
577
|
+
let i = 0;
|
|
578
|
+
const tokenised = originalValue.replace(complexRegex, (parsedValue) => {
|
|
579
|
+
if (color.test(parsedValue)) {
|
|
580
|
+
indexes.color.push(i);
|
|
581
|
+
types.push(COLOR_TOKEN);
|
|
582
|
+
values.push(color.parse(parsedValue));
|
|
583
|
+
} else if (parsedValue.startsWith(VAR_FUNCTION_TOKEN)) {
|
|
584
|
+
indexes.var.push(i);
|
|
585
|
+
types.push(VAR_TOKEN);
|
|
586
|
+
values.push(parsedValue);
|
|
587
|
+
} else {
|
|
588
|
+
indexes.number.push(i);
|
|
589
|
+
types.push(NUMBER_TOKEN);
|
|
590
|
+
values.push(parseFloat(parsedValue));
|
|
591
|
+
}
|
|
592
|
+
++i;
|
|
593
|
+
return SPLIT_TOKEN;
|
|
594
|
+
});
|
|
595
|
+
const split = tokenised.split(SPLIT_TOKEN);
|
|
596
|
+
return { values, split, indexes, types };
|
|
597
|
+
}
|
|
598
|
+
function parseComplexValue(v) {
|
|
599
|
+
return analyseComplexValue(v).values;
|
|
600
|
+
}
|
|
601
|
+
function createTransformer(source) {
|
|
602
|
+
const { split, types } = analyseComplexValue(source);
|
|
603
|
+
const numSections = split.length;
|
|
604
|
+
return (v) => {
|
|
605
|
+
let output = "";
|
|
606
|
+
for (let i = 0; i < numSections; i++) {
|
|
607
|
+
output += split[i];
|
|
608
|
+
if (v[i] !== void 0) {
|
|
609
|
+
const type = types[i];
|
|
610
|
+
if (type === NUMBER_TOKEN) {
|
|
611
|
+
output += sanitize(v[i]);
|
|
612
|
+
} else if (type === COLOR_TOKEN) {
|
|
613
|
+
output += color.transform(v[i]);
|
|
614
|
+
} else {
|
|
615
|
+
output += v[i];
|
|
616
|
+
}
|
|
617
|
+
}
|
|
618
|
+
}
|
|
619
|
+
return output;
|
|
620
|
+
};
|
|
621
|
+
}
|
|
622
|
+
var convertNumbersToZero = (v) => typeof v === "number" ? 0 : color.test(v) ? color.getAnimatableNone(v) : v;
|
|
623
|
+
function getAnimatableNone(v) {
|
|
624
|
+
const parsed = parseComplexValue(v);
|
|
625
|
+
const transformer = createTransformer(v);
|
|
626
|
+
return transformer(parsed.map(convertNumbersToZero));
|
|
627
|
+
}
|
|
628
|
+
var complex = {
|
|
629
|
+
test,
|
|
630
|
+
parse: parseComplexValue,
|
|
631
|
+
createTransformer,
|
|
632
|
+
getAnimatableNone
|
|
633
|
+
};
|
|
634
|
+
|
|
635
|
+
// node_modules/motion-dom/dist/es/value/types/color/hsla-to-rgba.mjs
|
|
636
|
+
function hueToRgb(p, q, t) {
|
|
637
|
+
if (t < 0)
|
|
638
|
+
t += 1;
|
|
639
|
+
if (t > 1)
|
|
640
|
+
t -= 1;
|
|
641
|
+
if (t < 1 / 6)
|
|
642
|
+
return p + (q - p) * 6 * t;
|
|
643
|
+
if (t < 1 / 2)
|
|
644
|
+
return q;
|
|
645
|
+
if (t < 2 / 3)
|
|
646
|
+
return p + (q - p) * (2 / 3 - t) * 6;
|
|
647
|
+
return p;
|
|
648
|
+
}
|
|
649
|
+
function hslaToRgba({ hue, saturation, lightness, alpha: alpha2 }) {
|
|
650
|
+
hue /= 360;
|
|
651
|
+
saturation /= 100;
|
|
652
|
+
lightness /= 100;
|
|
653
|
+
let red = 0;
|
|
654
|
+
let green = 0;
|
|
655
|
+
let blue = 0;
|
|
656
|
+
if (!saturation) {
|
|
657
|
+
red = green = blue = lightness;
|
|
658
|
+
} else {
|
|
659
|
+
const q = lightness < 0.5 ? lightness * (1 + saturation) : lightness + saturation - lightness * saturation;
|
|
660
|
+
const p = 2 * lightness - q;
|
|
661
|
+
red = hueToRgb(p, q, hue + 1 / 3);
|
|
662
|
+
green = hueToRgb(p, q, hue);
|
|
663
|
+
blue = hueToRgb(p, q, hue - 1 / 3);
|
|
664
|
+
}
|
|
665
|
+
return {
|
|
666
|
+
red: Math.round(red * 255),
|
|
667
|
+
green: Math.round(green * 255),
|
|
668
|
+
blue: Math.round(blue * 255),
|
|
669
|
+
alpha: alpha2
|
|
670
|
+
};
|
|
671
|
+
}
|
|
672
|
+
|
|
673
|
+
// node_modules/motion-dom/dist/es/utils/mix/immediate.mjs
|
|
674
|
+
function mixImmediate(a, b) {
|
|
675
|
+
return (p) => p > 0 ? b : a;
|
|
676
|
+
}
|
|
677
|
+
|
|
678
|
+
// node_modules/motion-dom/dist/es/utils/mix/number.mjs
|
|
679
|
+
var mixNumber = (from, to, progress2) => {
|
|
680
|
+
return from + (to - from) * progress2;
|
|
681
|
+
};
|
|
682
|
+
|
|
683
|
+
// node_modules/motion-dom/dist/es/utils/mix/color.mjs
|
|
684
|
+
var mixLinearColor = (from, to, v) => {
|
|
685
|
+
const fromExpo = from * from;
|
|
686
|
+
const expo = v * (to * to - fromExpo) + fromExpo;
|
|
687
|
+
return expo < 0 ? 0 : Math.sqrt(expo);
|
|
688
|
+
};
|
|
689
|
+
var colorTypes = [hex, rgba, hsla];
|
|
690
|
+
var getColorType = (v) => colorTypes.find((type) => type.test(v));
|
|
691
|
+
function asRGBA(color2) {
|
|
692
|
+
const type = getColorType(color2);
|
|
693
|
+
warning(Boolean(type), `'${color2}' is not an animatable color. Use the equivalent color code instead.`, "color-not-animatable");
|
|
694
|
+
if (!Boolean(type))
|
|
695
|
+
return false;
|
|
696
|
+
let model = type.parse(color2);
|
|
697
|
+
if (type === hsla) {
|
|
698
|
+
model = hslaToRgba(model);
|
|
699
|
+
}
|
|
700
|
+
return model;
|
|
701
|
+
}
|
|
702
|
+
var mixColor = (from, to) => {
|
|
703
|
+
const fromRGBA = asRGBA(from);
|
|
704
|
+
const toRGBA = asRGBA(to);
|
|
705
|
+
if (!fromRGBA || !toRGBA) {
|
|
706
|
+
return mixImmediate(from, to);
|
|
707
|
+
}
|
|
708
|
+
const blended = { ...fromRGBA };
|
|
709
|
+
return (v) => {
|
|
710
|
+
blended.red = mixLinearColor(fromRGBA.red, toRGBA.red, v);
|
|
711
|
+
blended.green = mixLinearColor(fromRGBA.green, toRGBA.green, v);
|
|
712
|
+
blended.blue = mixLinearColor(fromRGBA.blue, toRGBA.blue, v);
|
|
713
|
+
blended.alpha = mixNumber(fromRGBA.alpha, toRGBA.alpha, v);
|
|
714
|
+
return rgba.transform(blended);
|
|
715
|
+
};
|
|
716
|
+
};
|
|
717
|
+
|
|
718
|
+
// node_modules/motion-dom/dist/es/utils/mix/visibility.mjs
|
|
719
|
+
var invisibleValues = /* @__PURE__ */ new Set(["none", "hidden"]);
|
|
720
|
+
function mixVisibility(origin, target) {
|
|
721
|
+
if (invisibleValues.has(origin)) {
|
|
722
|
+
return (p) => p <= 0 ? origin : target;
|
|
723
|
+
} else {
|
|
724
|
+
return (p) => p >= 1 ? target : origin;
|
|
725
|
+
}
|
|
726
|
+
}
|
|
727
|
+
|
|
728
|
+
// node_modules/motion-dom/dist/es/utils/mix/complex.mjs
|
|
729
|
+
function mixNumber2(a, b) {
|
|
730
|
+
return (p) => mixNumber(a, b, p);
|
|
731
|
+
}
|
|
732
|
+
function getMixer(a) {
|
|
733
|
+
if (typeof a === "number") {
|
|
734
|
+
return mixNumber2;
|
|
735
|
+
} else if (typeof a === "string") {
|
|
736
|
+
return isCSSVariableToken(a) ? mixImmediate : color.test(a) ? mixColor : mixComplex;
|
|
737
|
+
} else if (Array.isArray(a)) {
|
|
738
|
+
return mixArray;
|
|
739
|
+
} else if (typeof a === "object") {
|
|
740
|
+
return color.test(a) ? mixColor : mixObject;
|
|
741
|
+
}
|
|
742
|
+
return mixImmediate;
|
|
743
|
+
}
|
|
744
|
+
function mixArray(a, b) {
|
|
745
|
+
const output = [...a];
|
|
746
|
+
const numValues = output.length;
|
|
747
|
+
const blendValue = a.map((v, i) => getMixer(v)(v, b[i]));
|
|
748
|
+
return (p) => {
|
|
749
|
+
for (let i = 0; i < numValues; i++) {
|
|
750
|
+
output[i] = blendValue[i](p);
|
|
751
|
+
}
|
|
752
|
+
return output;
|
|
753
|
+
};
|
|
754
|
+
}
|
|
755
|
+
function mixObject(a, b) {
|
|
756
|
+
const output = { ...a, ...b };
|
|
757
|
+
const blendValue = {};
|
|
758
|
+
for (const key in output) {
|
|
759
|
+
if (a[key] !== void 0 && b[key] !== void 0) {
|
|
760
|
+
blendValue[key] = getMixer(a[key])(a[key], b[key]);
|
|
761
|
+
}
|
|
762
|
+
}
|
|
763
|
+
return (v) => {
|
|
764
|
+
for (const key in blendValue) {
|
|
765
|
+
output[key] = blendValue[key](v);
|
|
766
|
+
}
|
|
767
|
+
return output;
|
|
768
|
+
};
|
|
769
|
+
}
|
|
770
|
+
function matchOrder(origin, target) {
|
|
771
|
+
const orderedOrigin = [];
|
|
772
|
+
const pointers = { color: 0, var: 0, number: 0 };
|
|
773
|
+
for (let i = 0; i < target.values.length; i++) {
|
|
774
|
+
const type = target.types[i];
|
|
775
|
+
const originIndex = origin.indexes[type][pointers[type]];
|
|
776
|
+
const originValue = origin.values[originIndex] ?? 0;
|
|
777
|
+
orderedOrigin[i] = originValue;
|
|
778
|
+
pointers[type]++;
|
|
779
|
+
}
|
|
780
|
+
return orderedOrigin;
|
|
781
|
+
}
|
|
782
|
+
var mixComplex = (origin, target) => {
|
|
783
|
+
const template = complex.createTransformer(target);
|
|
784
|
+
const originStats = analyseComplexValue(origin);
|
|
785
|
+
const targetStats = analyseComplexValue(target);
|
|
786
|
+
const canInterpolate = originStats.indexes.var.length === targetStats.indexes.var.length && originStats.indexes.color.length === targetStats.indexes.color.length && originStats.indexes.number.length >= targetStats.indexes.number.length;
|
|
787
|
+
if (canInterpolate) {
|
|
788
|
+
if (invisibleValues.has(origin) && !targetStats.values.length || invisibleValues.has(target) && !originStats.values.length) {
|
|
789
|
+
return mixVisibility(origin, target);
|
|
790
|
+
}
|
|
791
|
+
return pipe(mixArray(matchOrder(originStats, targetStats), targetStats.values), template);
|
|
792
|
+
} else {
|
|
793
|
+
warning(true, `Complex values '${origin}' and '${target}' too different to mix. Ensure all colors are of the same type, and that each contains the same quantity of number and color values. Falling back to instant transition.`, "complex-values-different");
|
|
794
|
+
return mixImmediate(origin, target);
|
|
795
|
+
}
|
|
796
|
+
};
|
|
797
|
+
|
|
798
|
+
// node_modules/motion-dom/dist/es/utils/mix/index.mjs
|
|
799
|
+
function mix(from, to, p) {
|
|
800
|
+
if (typeof from === "number" && typeof to === "number" && typeof p === "number") {
|
|
801
|
+
return mixNumber(from, to, p);
|
|
802
|
+
}
|
|
803
|
+
const mixer = getMixer(from);
|
|
804
|
+
return mixer(from, to);
|
|
805
|
+
}
|
|
806
|
+
|
|
807
|
+
// node_modules/motion-dom/dist/es/animation/drivers/frame.mjs
|
|
808
|
+
var frameloopDriver = (update) => {
|
|
809
|
+
const passTimestamp = ({ timestamp }) => update(timestamp);
|
|
810
|
+
return {
|
|
811
|
+
start: (keepAlive = true) => frame.update(passTimestamp, keepAlive),
|
|
812
|
+
stop: () => cancelFrame(passTimestamp),
|
|
813
|
+
/**
|
|
814
|
+
* If we're processing this frame we can use the
|
|
815
|
+
* framelocked timestamp to keep things in sync.
|
|
816
|
+
*/
|
|
817
|
+
now: () => frameData.isProcessing ? frameData.timestamp : time.now()
|
|
818
|
+
};
|
|
819
|
+
};
|
|
820
|
+
|
|
821
|
+
// node_modules/motion-dom/dist/es/animation/waapi/utils/linear.mjs
|
|
822
|
+
var generateLinearEasing = (easing, duration, resolution = 10) => {
|
|
823
|
+
let points = "";
|
|
824
|
+
const numPoints = Math.max(Math.round(duration / resolution), 2);
|
|
825
|
+
for (let i = 0; i < numPoints; i++) {
|
|
826
|
+
points += Math.round(easing(i / (numPoints - 1)) * 1e4) / 1e4 + ", ";
|
|
827
|
+
}
|
|
828
|
+
return `linear(${points.substring(0, points.length - 2)})`;
|
|
829
|
+
};
|
|
830
|
+
|
|
831
|
+
// node_modules/motion-dom/dist/es/animation/generators/utils/calc-duration.mjs
|
|
832
|
+
var maxGeneratorDuration = 2e4;
|
|
833
|
+
function calcGeneratorDuration(generator) {
|
|
834
|
+
let duration = 0;
|
|
835
|
+
const timeStep = 50;
|
|
836
|
+
let state = generator.next(duration);
|
|
837
|
+
while (!state.done && duration < maxGeneratorDuration) {
|
|
838
|
+
duration += timeStep;
|
|
839
|
+
state = generator.next(duration);
|
|
840
|
+
}
|
|
841
|
+
return duration >= maxGeneratorDuration ? Infinity : duration;
|
|
842
|
+
}
|
|
843
|
+
|
|
844
|
+
// node_modules/motion-dom/dist/es/animation/generators/utils/create-generator-easing.mjs
|
|
845
|
+
function createGeneratorEasing(options, scale2 = 100, createGenerator) {
|
|
846
|
+
const generator = createGenerator({ ...options, keyframes: [0, scale2] });
|
|
847
|
+
const duration = Math.min(calcGeneratorDuration(generator), maxGeneratorDuration);
|
|
848
|
+
return {
|
|
849
|
+
type: "keyframes",
|
|
850
|
+
ease: (progress2) => {
|
|
851
|
+
return generator.next(duration * progress2).value / scale2;
|
|
852
|
+
},
|
|
853
|
+
duration: millisecondsToSeconds(duration)
|
|
854
|
+
};
|
|
855
|
+
}
|
|
856
|
+
|
|
857
|
+
// node_modules/motion-dom/dist/es/animation/generators/utils/velocity.mjs
|
|
858
|
+
var velocitySampleDuration = 5;
|
|
859
|
+
function calcGeneratorVelocity(resolveValue, t, current) {
|
|
860
|
+
const prevT = Math.max(t - velocitySampleDuration, 0);
|
|
861
|
+
return velocityPerSecond(current - resolveValue(prevT), t - prevT);
|
|
862
|
+
}
|
|
863
|
+
|
|
864
|
+
// node_modules/motion-dom/dist/es/animation/generators/spring/defaults.mjs
|
|
865
|
+
var springDefaults = {
|
|
866
|
+
// Default spring physics
|
|
867
|
+
stiffness: 100,
|
|
868
|
+
damping: 10,
|
|
869
|
+
mass: 1,
|
|
870
|
+
velocity: 0,
|
|
871
|
+
// Default duration/bounce-based options
|
|
872
|
+
duration: 800,
|
|
873
|
+
// in ms
|
|
874
|
+
bounce: 0.3,
|
|
875
|
+
visualDuration: 0.3,
|
|
876
|
+
// in seconds
|
|
877
|
+
// Rest thresholds
|
|
878
|
+
restSpeed: {
|
|
879
|
+
granular: 0.01,
|
|
880
|
+
default: 2
|
|
881
|
+
},
|
|
882
|
+
restDelta: {
|
|
883
|
+
granular: 5e-3,
|
|
884
|
+
default: 0.5
|
|
885
|
+
},
|
|
886
|
+
// Limits
|
|
887
|
+
minDuration: 0.01,
|
|
888
|
+
// in seconds
|
|
889
|
+
maxDuration: 10,
|
|
890
|
+
// in seconds
|
|
891
|
+
minDamping: 0.05,
|
|
892
|
+
maxDamping: 1
|
|
893
|
+
};
|
|
894
|
+
|
|
895
|
+
// node_modules/motion-dom/dist/es/animation/generators/spring/find.mjs
|
|
896
|
+
var safeMin = 1e-3;
|
|
897
|
+
function findSpring({ duration = springDefaults.duration, bounce = springDefaults.bounce, velocity = springDefaults.velocity, mass = springDefaults.mass }) {
|
|
898
|
+
let envelope;
|
|
899
|
+
let derivative;
|
|
900
|
+
warning(duration <= secondsToMilliseconds(springDefaults.maxDuration), "Spring duration must be 10 seconds or less", "spring-duration-limit");
|
|
901
|
+
let dampingRatio = 1 - bounce;
|
|
902
|
+
dampingRatio = clamp(springDefaults.minDamping, springDefaults.maxDamping, dampingRatio);
|
|
903
|
+
duration = clamp(springDefaults.minDuration, springDefaults.maxDuration, millisecondsToSeconds(duration));
|
|
904
|
+
if (dampingRatio < 1) {
|
|
905
|
+
envelope = (undampedFreq2) => {
|
|
906
|
+
const exponentialDecay = undampedFreq2 * dampingRatio;
|
|
907
|
+
const delta = exponentialDecay * duration;
|
|
908
|
+
const a = exponentialDecay - velocity;
|
|
909
|
+
const b = calcAngularFreq(undampedFreq2, dampingRatio);
|
|
910
|
+
const c = Math.exp(-delta);
|
|
911
|
+
return safeMin - a / b * c;
|
|
912
|
+
};
|
|
913
|
+
derivative = (undampedFreq2) => {
|
|
914
|
+
const exponentialDecay = undampedFreq2 * dampingRatio;
|
|
915
|
+
const delta = exponentialDecay * duration;
|
|
916
|
+
const d = delta * velocity + velocity;
|
|
917
|
+
const e = Math.pow(dampingRatio, 2) * Math.pow(undampedFreq2, 2) * duration;
|
|
918
|
+
const f = Math.exp(-delta);
|
|
919
|
+
const g = calcAngularFreq(Math.pow(undampedFreq2, 2), dampingRatio);
|
|
920
|
+
const factor = -envelope(undampedFreq2) + safeMin > 0 ? -1 : 1;
|
|
921
|
+
return factor * ((d - e) * f) / g;
|
|
922
|
+
};
|
|
923
|
+
} else {
|
|
924
|
+
envelope = (undampedFreq2) => {
|
|
925
|
+
const a = Math.exp(-undampedFreq2 * duration);
|
|
926
|
+
const b = (undampedFreq2 - velocity) * duration + 1;
|
|
927
|
+
return -safeMin + a * b;
|
|
928
|
+
};
|
|
929
|
+
derivative = (undampedFreq2) => {
|
|
930
|
+
const a = Math.exp(-undampedFreq2 * duration);
|
|
931
|
+
const b = (velocity - undampedFreq2) * (duration * duration);
|
|
932
|
+
return a * b;
|
|
933
|
+
};
|
|
934
|
+
}
|
|
935
|
+
const initialGuess = 5 / duration;
|
|
936
|
+
const undampedFreq = approximateRoot(envelope, derivative, initialGuess);
|
|
937
|
+
duration = secondsToMilliseconds(duration);
|
|
938
|
+
if (isNaN(undampedFreq)) {
|
|
939
|
+
return {
|
|
940
|
+
stiffness: springDefaults.stiffness,
|
|
941
|
+
damping: springDefaults.damping,
|
|
942
|
+
duration
|
|
943
|
+
};
|
|
944
|
+
} else {
|
|
945
|
+
const stiffness = Math.pow(undampedFreq, 2) * mass;
|
|
946
|
+
return {
|
|
947
|
+
stiffness,
|
|
948
|
+
damping: dampingRatio * 2 * Math.sqrt(mass * stiffness),
|
|
949
|
+
duration
|
|
950
|
+
};
|
|
951
|
+
}
|
|
952
|
+
}
|
|
953
|
+
var rootIterations = 12;
|
|
954
|
+
function approximateRoot(envelope, derivative, initialGuess) {
|
|
955
|
+
let result = initialGuess;
|
|
956
|
+
for (let i = 1; i < rootIterations; i++) {
|
|
957
|
+
result = result - envelope(result) / derivative(result);
|
|
958
|
+
}
|
|
959
|
+
return result;
|
|
960
|
+
}
|
|
961
|
+
function calcAngularFreq(undampedFreq, dampingRatio) {
|
|
962
|
+
return undampedFreq * Math.sqrt(1 - dampingRatio * dampingRatio);
|
|
963
|
+
}
|
|
964
|
+
|
|
965
|
+
// node_modules/motion-dom/dist/es/animation/generators/spring/index.mjs
|
|
966
|
+
var durationKeys = ["duration", "bounce"];
|
|
967
|
+
var physicsKeys = ["stiffness", "damping", "mass"];
|
|
968
|
+
function isSpringType(options, keys2) {
|
|
969
|
+
return keys2.some((key) => options[key] !== void 0);
|
|
970
|
+
}
|
|
971
|
+
function getSpringOptions(options) {
|
|
972
|
+
let springOptions = {
|
|
973
|
+
velocity: springDefaults.velocity,
|
|
974
|
+
stiffness: springDefaults.stiffness,
|
|
975
|
+
damping: springDefaults.damping,
|
|
976
|
+
mass: springDefaults.mass,
|
|
977
|
+
isResolvedFromDuration: false,
|
|
978
|
+
...options
|
|
979
|
+
};
|
|
980
|
+
if (!isSpringType(options, physicsKeys) && isSpringType(options, durationKeys)) {
|
|
981
|
+
if (options.visualDuration) {
|
|
982
|
+
const visualDuration = options.visualDuration;
|
|
983
|
+
const root = 2 * Math.PI / (visualDuration * 1.2);
|
|
984
|
+
const stiffness = root * root;
|
|
985
|
+
const damping = 2 * clamp(0.05, 1, 1 - (options.bounce || 0)) * Math.sqrt(stiffness);
|
|
986
|
+
springOptions = {
|
|
987
|
+
...springOptions,
|
|
988
|
+
mass: springDefaults.mass,
|
|
989
|
+
stiffness,
|
|
990
|
+
damping
|
|
991
|
+
};
|
|
992
|
+
} else {
|
|
993
|
+
const derived = findSpring(options);
|
|
994
|
+
springOptions = {
|
|
995
|
+
...springOptions,
|
|
996
|
+
...derived,
|
|
997
|
+
mass: springDefaults.mass
|
|
998
|
+
};
|
|
999
|
+
springOptions.isResolvedFromDuration = true;
|
|
1000
|
+
}
|
|
1001
|
+
}
|
|
1002
|
+
return springOptions;
|
|
1003
|
+
}
|
|
1004
|
+
function spring(optionsOrVisualDuration = springDefaults.visualDuration, bounce = springDefaults.bounce) {
|
|
1005
|
+
const options = typeof optionsOrVisualDuration !== "object" ? {
|
|
1006
|
+
visualDuration: optionsOrVisualDuration,
|
|
1007
|
+
keyframes: [0, 1],
|
|
1008
|
+
bounce
|
|
1009
|
+
} : optionsOrVisualDuration;
|
|
1010
|
+
let { restSpeed, restDelta } = options;
|
|
1011
|
+
const origin = options.keyframes[0];
|
|
1012
|
+
const target = options.keyframes[options.keyframes.length - 1];
|
|
1013
|
+
const state = { done: false, value: origin };
|
|
1014
|
+
const { stiffness, damping, mass, duration, velocity, isResolvedFromDuration } = getSpringOptions({
|
|
1015
|
+
...options,
|
|
1016
|
+
velocity: -millisecondsToSeconds(options.velocity || 0)
|
|
1017
|
+
});
|
|
1018
|
+
const initialVelocity = velocity || 0;
|
|
1019
|
+
const dampingRatio = damping / (2 * Math.sqrt(stiffness * mass));
|
|
1020
|
+
const initialDelta = target - origin;
|
|
1021
|
+
const undampedAngularFreq = millisecondsToSeconds(Math.sqrt(stiffness / mass));
|
|
1022
|
+
const isGranularScale = Math.abs(initialDelta) < 5;
|
|
1023
|
+
restSpeed || (restSpeed = isGranularScale ? springDefaults.restSpeed.granular : springDefaults.restSpeed.default);
|
|
1024
|
+
restDelta || (restDelta = isGranularScale ? springDefaults.restDelta.granular : springDefaults.restDelta.default);
|
|
1025
|
+
let resolveSpring;
|
|
1026
|
+
if (dampingRatio < 1) {
|
|
1027
|
+
const angularFreq = calcAngularFreq(undampedAngularFreq, dampingRatio);
|
|
1028
|
+
resolveSpring = (t) => {
|
|
1029
|
+
const envelope = Math.exp(-dampingRatio * undampedAngularFreq * t);
|
|
1030
|
+
return target - envelope * ((initialVelocity + dampingRatio * undampedAngularFreq * initialDelta) / angularFreq * Math.sin(angularFreq * t) + initialDelta * Math.cos(angularFreq * t));
|
|
1031
|
+
};
|
|
1032
|
+
} else if (dampingRatio === 1) {
|
|
1033
|
+
resolveSpring = (t) => target - Math.exp(-undampedAngularFreq * t) * (initialDelta + (initialVelocity + undampedAngularFreq * initialDelta) * t);
|
|
1034
|
+
} else {
|
|
1035
|
+
const dampedAngularFreq = undampedAngularFreq * Math.sqrt(dampingRatio * dampingRatio - 1);
|
|
1036
|
+
resolveSpring = (t) => {
|
|
1037
|
+
const envelope = Math.exp(-dampingRatio * undampedAngularFreq * t);
|
|
1038
|
+
const freqForT = Math.min(dampedAngularFreq * t, 300);
|
|
1039
|
+
return target - envelope * ((initialVelocity + dampingRatio * undampedAngularFreq * initialDelta) * Math.sinh(freqForT) + dampedAngularFreq * initialDelta * Math.cosh(freqForT)) / dampedAngularFreq;
|
|
1040
|
+
};
|
|
1041
|
+
}
|
|
1042
|
+
const generator = {
|
|
1043
|
+
calculatedDuration: isResolvedFromDuration ? duration || null : null,
|
|
1044
|
+
next: (t) => {
|
|
1045
|
+
const current = resolveSpring(t);
|
|
1046
|
+
if (!isResolvedFromDuration) {
|
|
1047
|
+
let currentVelocity = t === 0 ? initialVelocity : 0;
|
|
1048
|
+
if (dampingRatio < 1) {
|
|
1049
|
+
currentVelocity = t === 0 ? secondsToMilliseconds(initialVelocity) : calcGeneratorVelocity(resolveSpring, t, current);
|
|
1050
|
+
}
|
|
1051
|
+
const isBelowVelocityThreshold = Math.abs(currentVelocity) <= restSpeed;
|
|
1052
|
+
const isBelowDisplacementThreshold = Math.abs(target - current) <= restDelta;
|
|
1053
|
+
state.done = isBelowVelocityThreshold && isBelowDisplacementThreshold;
|
|
1054
|
+
} else {
|
|
1055
|
+
state.done = t >= duration;
|
|
1056
|
+
}
|
|
1057
|
+
state.value = state.done ? target : current;
|
|
1058
|
+
return state;
|
|
1059
|
+
},
|
|
1060
|
+
toString: () => {
|
|
1061
|
+
const calculatedDuration = Math.min(calcGeneratorDuration(generator), maxGeneratorDuration);
|
|
1062
|
+
const easing = generateLinearEasing((progress2) => generator.next(calculatedDuration * progress2).value, calculatedDuration, 30);
|
|
1063
|
+
return calculatedDuration + "ms " + easing;
|
|
1064
|
+
},
|
|
1065
|
+
toTransition: () => {
|
|
1066
|
+
}
|
|
1067
|
+
};
|
|
1068
|
+
return generator;
|
|
1069
|
+
}
|
|
1070
|
+
spring.applyToOptions = (options) => {
|
|
1071
|
+
const generatorOptions = createGeneratorEasing(options, 100, spring);
|
|
1072
|
+
options.ease = generatorOptions.ease;
|
|
1073
|
+
options.duration = secondsToMilliseconds(generatorOptions.duration);
|
|
1074
|
+
options.type = "keyframes";
|
|
1075
|
+
return options;
|
|
1076
|
+
};
|
|
1077
|
+
|
|
1078
|
+
// node_modules/motion-dom/dist/es/animation/generators/inertia.mjs
|
|
1079
|
+
function inertia({ keyframes: keyframes2, velocity = 0, power = 0.8, timeConstant = 325, bounceDamping = 10, bounceStiffness = 500, modifyTarget, min, max, restDelta = 0.5, restSpeed }) {
|
|
1080
|
+
const origin = keyframes2[0];
|
|
1081
|
+
const state = {
|
|
1082
|
+
done: false,
|
|
1083
|
+
value: origin
|
|
1084
|
+
};
|
|
1085
|
+
const isOutOfBounds = (v) => min !== void 0 && v < min || max !== void 0 && v > max;
|
|
1086
|
+
const nearestBoundary = (v) => {
|
|
1087
|
+
if (min === void 0)
|
|
1088
|
+
return max;
|
|
1089
|
+
if (max === void 0)
|
|
1090
|
+
return min;
|
|
1091
|
+
return Math.abs(min - v) < Math.abs(max - v) ? min : max;
|
|
1092
|
+
};
|
|
1093
|
+
let amplitude = power * velocity;
|
|
1094
|
+
const ideal = origin + amplitude;
|
|
1095
|
+
const target = modifyTarget === void 0 ? ideal : modifyTarget(ideal);
|
|
1096
|
+
if (target !== ideal)
|
|
1097
|
+
amplitude = target - origin;
|
|
1098
|
+
const calcDelta = (t) => -amplitude * Math.exp(-t / timeConstant);
|
|
1099
|
+
const calcLatest = (t) => target + calcDelta(t);
|
|
1100
|
+
const applyFriction = (t) => {
|
|
1101
|
+
const delta = calcDelta(t);
|
|
1102
|
+
const latest = calcLatest(t);
|
|
1103
|
+
state.done = Math.abs(delta) <= restDelta;
|
|
1104
|
+
state.value = state.done ? target : latest;
|
|
1105
|
+
};
|
|
1106
|
+
let timeReachedBoundary;
|
|
1107
|
+
let spring$1;
|
|
1108
|
+
const checkCatchBoundary = (t) => {
|
|
1109
|
+
if (!isOutOfBounds(state.value))
|
|
1110
|
+
return;
|
|
1111
|
+
timeReachedBoundary = t;
|
|
1112
|
+
spring$1 = spring({
|
|
1113
|
+
keyframes: [state.value, nearestBoundary(state.value)],
|
|
1114
|
+
velocity: calcGeneratorVelocity(calcLatest, t, state.value),
|
|
1115
|
+
// TODO: This should be passing * 1000
|
|
1116
|
+
damping: bounceDamping,
|
|
1117
|
+
stiffness: bounceStiffness,
|
|
1118
|
+
restDelta,
|
|
1119
|
+
restSpeed
|
|
1120
|
+
});
|
|
1121
|
+
};
|
|
1122
|
+
checkCatchBoundary(0);
|
|
1123
|
+
return {
|
|
1124
|
+
calculatedDuration: null,
|
|
1125
|
+
next: (t) => {
|
|
1126
|
+
let hasUpdatedFrame = false;
|
|
1127
|
+
if (!spring$1 && timeReachedBoundary === void 0) {
|
|
1128
|
+
hasUpdatedFrame = true;
|
|
1129
|
+
applyFriction(t);
|
|
1130
|
+
checkCatchBoundary(t);
|
|
1131
|
+
}
|
|
1132
|
+
if (timeReachedBoundary !== void 0 && t >= timeReachedBoundary) {
|
|
1133
|
+
return spring$1.next(t - timeReachedBoundary);
|
|
1134
|
+
} else {
|
|
1135
|
+
!hasUpdatedFrame && applyFriction(t);
|
|
1136
|
+
return state;
|
|
1137
|
+
}
|
|
1138
|
+
}
|
|
1139
|
+
};
|
|
1140
|
+
}
|
|
1141
|
+
|
|
1142
|
+
// node_modules/motion-dom/dist/es/utils/interpolate.mjs
|
|
1143
|
+
function createMixers(output, ease2, customMixer) {
|
|
1144
|
+
const mixers = [];
|
|
1145
|
+
const mixerFactory = customMixer || MotionGlobalConfig.mix || mix;
|
|
1146
|
+
const numMixers = output.length - 1;
|
|
1147
|
+
for (let i = 0; i < numMixers; i++) {
|
|
1148
|
+
let mixer = mixerFactory(output[i], output[i + 1]);
|
|
1149
|
+
if (ease2) {
|
|
1150
|
+
const easingFunction = Array.isArray(ease2) ? ease2[i] || noop : ease2;
|
|
1151
|
+
mixer = pipe(easingFunction, mixer);
|
|
1152
|
+
}
|
|
1153
|
+
mixers.push(mixer);
|
|
1154
|
+
}
|
|
1155
|
+
return mixers;
|
|
1156
|
+
}
|
|
1157
|
+
function interpolate(input, output, { clamp: isClamp = true, ease: ease2, mixer } = {}) {
|
|
1158
|
+
const inputLength = input.length;
|
|
1159
|
+
invariant(inputLength === output.length, "Both input and output ranges must be the same length", "range-length");
|
|
1160
|
+
if (inputLength === 1)
|
|
1161
|
+
return () => output[0];
|
|
1162
|
+
if (inputLength === 2 && output[0] === output[1])
|
|
1163
|
+
return () => output[1];
|
|
1164
|
+
const isZeroDeltaRange = input[0] === input[1];
|
|
1165
|
+
if (input[0] > input[inputLength - 1]) {
|
|
1166
|
+
input = [...input].reverse();
|
|
1167
|
+
output = [...output].reverse();
|
|
1168
|
+
}
|
|
1169
|
+
const mixers = createMixers(output, ease2, mixer);
|
|
1170
|
+
const numMixers = mixers.length;
|
|
1171
|
+
const interpolator = (v) => {
|
|
1172
|
+
if (isZeroDeltaRange && v < input[0])
|
|
1173
|
+
return output[0];
|
|
1174
|
+
let i = 0;
|
|
1175
|
+
if (numMixers > 1) {
|
|
1176
|
+
for (; i < input.length - 2; i++) {
|
|
1177
|
+
if (v < input[i + 1])
|
|
1178
|
+
break;
|
|
1179
|
+
}
|
|
1180
|
+
}
|
|
1181
|
+
const progressInRange = progress(input[i], input[i + 1], v);
|
|
1182
|
+
return mixers[i](progressInRange);
|
|
1183
|
+
};
|
|
1184
|
+
return isClamp ? (v) => interpolator(clamp(input[0], input[inputLength - 1], v)) : interpolator;
|
|
1185
|
+
}
|
|
1186
|
+
|
|
1187
|
+
// node_modules/motion-dom/dist/es/animation/keyframes/offsets/fill.mjs
|
|
1188
|
+
function fillOffset(offset, remaining) {
|
|
1189
|
+
const min = offset[offset.length - 1];
|
|
1190
|
+
for (let i = 1; i <= remaining; i++) {
|
|
1191
|
+
const offsetProgress = progress(0, remaining, i);
|
|
1192
|
+
offset.push(mixNumber(min, 1, offsetProgress));
|
|
1193
|
+
}
|
|
1194
|
+
}
|
|
1195
|
+
|
|
1196
|
+
// node_modules/motion-dom/dist/es/animation/keyframes/offsets/default.mjs
|
|
1197
|
+
function defaultOffset(arr) {
|
|
1198
|
+
const offset = [0];
|
|
1199
|
+
fillOffset(offset, arr.length - 1);
|
|
1200
|
+
return offset;
|
|
1201
|
+
}
|
|
1202
|
+
|
|
1203
|
+
// node_modules/motion-dom/dist/es/animation/keyframes/offsets/time.mjs
|
|
1204
|
+
function convertOffsetToTimes(offset, duration) {
|
|
1205
|
+
return offset.map((o) => o * duration);
|
|
1206
|
+
}
|
|
1207
|
+
|
|
1208
|
+
// node_modules/motion-dom/dist/es/animation/generators/keyframes.mjs
|
|
1209
|
+
function defaultEasing(values, easing) {
|
|
1210
|
+
return values.map(() => easing || easeInOut).splice(0, values.length - 1);
|
|
1211
|
+
}
|
|
1212
|
+
function keyframes({ duration = 300, keyframes: keyframeValues, times, ease: ease2 = "easeInOut" }) {
|
|
1213
|
+
const easingFunctions = isEasingArray(ease2) ? ease2.map(easingDefinitionToFunction) : easingDefinitionToFunction(ease2);
|
|
1214
|
+
const state = {
|
|
1215
|
+
done: false,
|
|
1216
|
+
value: keyframeValues[0]
|
|
1217
|
+
};
|
|
1218
|
+
const absoluteTimes = convertOffsetToTimes(
|
|
1219
|
+
// Only use the provided offsets if they're the correct length
|
|
1220
|
+
// TODO Maybe we should warn here if there's a length mismatch
|
|
1221
|
+
times && times.length === keyframeValues.length ? times : defaultOffset(keyframeValues),
|
|
1222
|
+
duration
|
|
1223
|
+
);
|
|
1224
|
+
const mapTimeToKeyframe = interpolate(absoluteTimes, keyframeValues, {
|
|
1225
|
+
ease: Array.isArray(easingFunctions) ? easingFunctions : defaultEasing(keyframeValues, easingFunctions)
|
|
1226
|
+
});
|
|
1227
|
+
return {
|
|
1228
|
+
calculatedDuration: duration,
|
|
1229
|
+
next: (t) => {
|
|
1230
|
+
state.value = mapTimeToKeyframe(t);
|
|
1231
|
+
state.done = t >= duration;
|
|
1232
|
+
return state;
|
|
1233
|
+
}
|
|
1234
|
+
};
|
|
1235
|
+
}
|
|
1236
|
+
|
|
1237
|
+
// node_modules/motion-dom/dist/es/animation/keyframes/get-final.mjs
|
|
1238
|
+
var isNotNull = (value) => value !== null;
|
|
1239
|
+
function getFinalKeyframe(keyframes2, { repeat, repeatType = "loop" }, finalKeyframe, speed = 1) {
|
|
1240
|
+
const resolvedKeyframes = keyframes2.filter(isNotNull);
|
|
1241
|
+
const useFirstKeyframe = speed < 0 || repeat && repeatType !== "loop" && repeat % 2 === 1;
|
|
1242
|
+
const index = useFirstKeyframe ? 0 : resolvedKeyframes.length - 1;
|
|
1243
|
+
return !index || finalKeyframe === void 0 ? resolvedKeyframes[index] : finalKeyframe;
|
|
1244
|
+
}
|
|
1245
|
+
|
|
1246
|
+
// node_modules/motion-dom/dist/es/animation/utils/replace-transition-type.mjs
|
|
1247
|
+
var transitionTypeMap = {
|
|
1248
|
+
decay: inertia,
|
|
1249
|
+
inertia,
|
|
1250
|
+
tween: keyframes,
|
|
1251
|
+
keyframes,
|
|
1252
|
+
spring
|
|
1253
|
+
};
|
|
1254
|
+
function replaceTransitionType(transition) {
|
|
1255
|
+
if (typeof transition.type === "string") {
|
|
1256
|
+
transition.type = transitionTypeMap[transition.type];
|
|
1257
|
+
}
|
|
1258
|
+
}
|
|
1259
|
+
|
|
1260
|
+
// node_modules/motion-dom/dist/es/animation/utils/WithPromise.mjs
|
|
1261
|
+
var WithPromise = class {
|
|
1262
|
+
constructor() {
|
|
1263
|
+
this.updateFinished();
|
|
1264
|
+
}
|
|
1265
|
+
get finished() {
|
|
1266
|
+
return this._finished;
|
|
1267
|
+
}
|
|
1268
|
+
updateFinished() {
|
|
1269
|
+
this._finished = new Promise((resolve) => {
|
|
1270
|
+
this.resolve = resolve;
|
|
1271
|
+
});
|
|
1272
|
+
}
|
|
1273
|
+
notifyFinished() {
|
|
1274
|
+
this.resolve();
|
|
1275
|
+
}
|
|
1276
|
+
/**
|
|
1277
|
+
* Allows the animation to be awaited.
|
|
1278
|
+
*
|
|
1279
|
+
* @deprecated Use `finished` instead.
|
|
1280
|
+
*/
|
|
1281
|
+
then(onResolve, onReject) {
|
|
1282
|
+
return this.finished.then(onResolve, onReject);
|
|
1283
|
+
}
|
|
1284
|
+
};
|
|
1285
|
+
|
|
1286
|
+
// node_modules/motion-dom/dist/es/animation/JSAnimation.mjs
|
|
1287
|
+
var percentToProgress = (percent2) => percent2 / 100;
|
|
1288
|
+
var JSAnimation = class extends WithPromise {
|
|
1289
|
+
constructor(options) {
|
|
1290
|
+
super();
|
|
1291
|
+
this.state = "idle";
|
|
1292
|
+
this.startTime = null;
|
|
1293
|
+
this.isStopped = false;
|
|
1294
|
+
this.currentTime = 0;
|
|
1295
|
+
this.holdTime = null;
|
|
1296
|
+
this.playbackSpeed = 1;
|
|
1297
|
+
this.stop = () => {
|
|
1298
|
+
const { motionValue: motionValue2 } = this.options;
|
|
1299
|
+
if (motionValue2 && motionValue2.updatedAt !== time.now()) {
|
|
1300
|
+
this.tick(time.now());
|
|
1301
|
+
}
|
|
1302
|
+
this.isStopped = true;
|
|
1303
|
+
if (this.state === "idle")
|
|
1304
|
+
return;
|
|
1305
|
+
this.teardown();
|
|
1306
|
+
this.options.onStop?.();
|
|
1307
|
+
};
|
|
1308
|
+
activeAnimations.mainThread++;
|
|
1309
|
+
this.options = options;
|
|
1310
|
+
this.initAnimation();
|
|
1311
|
+
this.play();
|
|
1312
|
+
if (options.autoplay === false)
|
|
1313
|
+
this.pause();
|
|
1314
|
+
}
|
|
1315
|
+
initAnimation() {
|
|
1316
|
+
const { options } = this;
|
|
1317
|
+
replaceTransitionType(options);
|
|
1318
|
+
const { type = keyframes, repeat = 0, repeatDelay = 0, repeatType, velocity = 0 } = options;
|
|
1319
|
+
let { keyframes: keyframes$1 } = options;
|
|
1320
|
+
const generatorFactory = type || keyframes;
|
|
1321
|
+
if (process.env.NODE_ENV !== "production" && generatorFactory !== keyframes) {
|
|
1322
|
+
invariant(keyframes$1.length <= 2, `Only two keyframes currently supported with spring and inertia animations. Trying to animate ${keyframes$1}`, "spring-two-frames");
|
|
1323
|
+
}
|
|
1324
|
+
if (generatorFactory !== keyframes && typeof keyframes$1[0] !== "number") {
|
|
1325
|
+
this.mixKeyframes = pipe(percentToProgress, mix(keyframes$1[0], keyframes$1[1]));
|
|
1326
|
+
keyframes$1 = [0, 100];
|
|
1327
|
+
}
|
|
1328
|
+
const generator = generatorFactory({ ...options, keyframes: keyframes$1 });
|
|
1329
|
+
if (repeatType === "mirror") {
|
|
1330
|
+
this.mirroredGenerator = generatorFactory({
|
|
1331
|
+
...options,
|
|
1332
|
+
keyframes: [...keyframes$1].reverse(),
|
|
1333
|
+
velocity: -velocity
|
|
1334
|
+
});
|
|
1335
|
+
}
|
|
1336
|
+
if (generator.calculatedDuration === null) {
|
|
1337
|
+
generator.calculatedDuration = calcGeneratorDuration(generator);
|
|
1338
|
+
}
|
|
1339
|
+
const { calculatedDuration } = generator;
|
|
1340
|
+
this.calculatedDuration = calculatedDuration;
|
|
1341
|
+
this.resolvedDuration = calculatedDuration + repeatDelay;
|
|
1342
|
+
this.totalDuration = this.resolvedDuration * (repeat + 1) - repeatDelay;
|
|
1343
|
+
this.generator = generator;
|
|
1344
|
+
}
|
|
1345
|
+
updateTime(timestamp) {
|
|
1346
|
+
const animationTime = Math.round(timestamp - this.startTime) * this.playbackSpeed;
|
|
1347
|
+
if (this.holdTime !== null) {
|
|
1348
|
+
this.currentTime = this.holdTime;
|
|
1349
|
+
} else {
|
|
1350
|
+
this.currentTime = animationTime;
|
|
1351
|
+
}
|
|
1352
|
+
}
|
|
1353
|
+
tick(timestamp, sample = false) {
|
|
1354
|
+
const { generator, totalDuration, mixKeyframes, mirroredGenerator, resolvedDuration, calculatedDuration } = this;
|
|
1355
|
+
if (this.startTime === null)
|
|
1356
|
+
return generator.next(0);
|
|
1357
|
+
const { delay = 0, keyframes: keyframes2, repeat, repeatType, repeatDelay, type, onUpdate, finalKeyframe } = this.options;
|
|
1358
|
+
if (this.speed > 0) {
|
|
1359
|
+
this.startTime = Math.min(this.startTime, timestamp);
|
|
1360
|
+
} else if (this.speed < 0) {
|
|
1361
|
+
this.startTime = Math.min(timestamp - totalDuration / this.speed, this.startTime);
|
|
1362
|
+
}
|
|
1363
|
+
if (sample) {
|
|
1364
|
+
this.currentTime = timestamp;
|
|
1365
|
+
} else {
|
|
1366
|
+
this.updateTime(timestamp);
|
|
1367
|
+
}
|
|
1368
|
+
const timeWithoutDelay = this.currentTime - delay * (this.playbackSpeed >= 0 ? 1 : -1);
|
|
1369
|
+
const isInDelayPhase = this.playbackSpeed >= 0 ? timeWithoutDelay < 0 : timeWithoutDelay > totalDuration;
|
|
1370
|
+
this.currentTime = Math.max(timeWithoutDelay, 0);
|
|
1371
|
+
if (this.state === "finished" && this.holdTime === null) {
|
|
1372
|
+
this.currentTime = totalDuration;
|
|
1373
|
+
}
|
|
1374
|
+
let elapsed = this.currentTime;
|
|
1375
|
+
let frameGenerator = generator;
|
|
1376
|
+
if (repeat) {
|
|
1377
|
+
const progress2 = Math.min(this.currentTime, totalDuration) / resolvedDuration;
|
|
1378
|
+
let currentIteration = Math.floor(progress2);
|
|
1379
|
+
let iterationProgress = progress2 % 1;
|
|
1380
|
+
if (!iterationProgress && progress2 >= 1) {
|
|
1381
|
+
iterationProgress = 1;
|
|
1382
|
+
}
|
|
1383
|
+
iterationProgress === 1 && currentIteration--;
|
|
1384
|
+
currentIteration = Math.min(currentIteration, repeat + 1);
|
|
1385
|
+
const isOddIteration = Boolean(currentIteration % 2);
|
|
1386
|
+
if (isOddIteration) {
|
|
1387
|
+
if (repeatType === "reverse") {
|
|
1388
|
+
iterationProgress = 1 - iterationProgress;
|
|
1389
|
+
if (repeatDelay) {
|
|
1390
|
+
iterationProgress -= repeatDelay / resolvedDuration;
|
|
1391
|
+
}
|
|
1392
|
+
} else if (repeatType === "mirror") {
|
|
1393
|
+
frameGenerator = mirroredGenerator;
|
|
1394
|
+
}
|
|
1395
|
+
}
|
|
1396
|
+
elapsed = clamp(0, 1, iterationProgress) * resolvedDuration;
|
|
1397
|
+
}
|
|
1398
|
+
const state = isInDelayPhase ? { done: false, value: keyframes2[0] } : frameGenerator.next(elapsed);
|
|
1399
|
+
if (mixKeyframes) {
|
|
1400
|
+
state.value = mixKeyframes(state.value);
|
|
1401
|
+
}
|
|
1402
|
+
let { done } = state;
|
|
1403
|
+
if (!isInDelayPhase && calculatedDuration !== null) {
|
|
1404
|
+
done = this.playbackSpeed >= 0 ? this.currentTime >= totalDuration : this.currentTime <= 0;
|
|
1405
|
+
}
|
|
1406
|
+
const isAnimationFinished = this.holdTime === null && (this.state === "finished" || this.state === "running" && done);
|
|
1407
|
+
if (isAnimationFinished && type !== inertia) {
|
|
1408
|
+
state.value = getFinalKeyframe(keyframes2, this.options, finalKeyframe, this.speed);
|
|
1409
|
+
}
|
|
1410
|
+
if (onUpdate) {
|
|
1411
|
+
onUpdate(state.value);
|
|
1412
|
+
}
|
|
1413
|
+
if (isAnimationFinished) {
|
|
1414
|
+
this.finish();
|
|
1415
|
+
}
|
|
1416
|
+
return state;
|
|
1417
|
+
}
|
|
1418
|
+
/**
|
|
1419
|
+
* Allows the returned animation to be awaited or promise-chained. Currently
|
|
1420
|
+
* resolves when the animation finishes at all but in a future update could/should
|
|
1421
|
+
* reject if its cancels.
|
|
1422
|
+
*/
|
|
1423
|
+
then(resolve, reject) {
|
|
1424
|
+
return this.finished.then(resolve, reject);
|
|
1425
|
+
}
|
|
1426
|
+
get duration() {
|
|
1427
|
+
return millisecondsToSeconds(this.calculatedDuration);
|
|
1428
|
+
}
|
|
1429
|
+
get iterationDuration() {
|
|
1430
|
+
const { delay = 0 } = this.options || {};
|
|
1431
|
+
return this.duration + millisecondsToSeconds(delay);
|
|
1432
|
+
}
|
|
1433
|
+
get time() {
|
|
1434
|
+
return millisecondsToSeconds(this.currentTime);
|
|
1435
|
+
}
|
|
1436
|
+
set time(newTime) {
|
|
1437
|
+
newTime = secondsToMilliseconds(newTime);
|
|
1438
|
+
this.currentTime = newTime;
|
|
1439
|
+
if (this.startTime === null || this.holdTime !== null || this.playbackSpeed === 0) {
|
|
1440
|
+
this.holdTime = newTime;
|
|
1441
|
+
} else if (this.driver) {
|
|
1442
|
+
this.startTime = this.driver.now() - newTime / this.playbackSpeed;
|
|
1443
|
+
}
|
|
1444
|
+
this.driver?.start(false);
|
|
1445
|
+
}
|
|
1446
|
+
get speed() {
|
|
1447
|
+
return this.playbackSpeed;
|
|
1448
|
+
}
|
|
1449
|
+
set speed(newSpeed) {
|
|
1450
|
+
this.updateTime(time.now());
|
|
1451
|
+
const hasChanged = this.playbackSpeed !== newSpeed;
|
|
1452
|
+
this.playbackSpeed = newSpeed;
|
|
1453
|
+
if (hasChanged) {
|
|
1454
|
+
this.time = millisecondsToSeconds(this.currentTime);
|
|
1455
|
+
}
|
|
1456
|
+
}
|
|
1457
|
+
play() {
|
|
1458
|
+
if (this.isStopped)
|
|
1459
|
+
return;
|
|
1460
|
+
const { driver = frameloopDriver, startTime } = this.options;
|
|
1461
|
+
if (!this.driver) {
|
|
1462
|
+
this.driver = driver((timestamp) => this.tick(timestamp));
|
|
1463
|
+
}
|
|
1464
|
+
this.options.onPlay?.();
|
|
1465
|
+
const now2 = this.driver.now();
|
|
1466
|
+
if (this.state === "finished") {
|
|
1467
|
+
this.updateFinished();
|
|
1468
|
+
this.startTime = now2;
|
|
1469
|
+
} else if (this.holdTime !== null) {
|
|
1470
|
+
this.startTime = now2 - this.holdTime;
|
|
1471
|
+
} else if (!this.startTime) {
|
|
1472
|
+
this.startTime = startTime ?? now2;
|
|
1473
|
+
}
|
|
1474
|
+
if (this.state === "finished" && this.speed < 0) {
|
|
1475
|
+
this.startTime += this.calculatedDuration;
|
|
1476
|
+
}
|
|
1477
|
+
this.holdTime = null;
|
|
1478
|
+
this.state = "running";
|
|
1479
|
+
this.driver.start();
|
|
1480
|
+
}
|
|
1481
|
+
pause() {
|
|
1482
|
+
this.state = "paused";
|
|
1483
|
+
this.updateTime(time.now());
|
|
1484
|
+
this.holdTime = this.currentTime;
|
|
1485
|
+
}
|
|
1486
|
+
complete() {
|
|
1487
|
+
if (this.state !== "running") {
|
|
1488
|
+
this.play();
|
|
1489
|
+
}
|
|
1490
|
+
this.state = "finished";
|
|
1491
|
+
this.holdTime = null;
|
|
1492
|
+
}
|
|
1493
|
+
finish() {
|
|
1494
|
+
this.notifyFinished();
|
|
1495
|
+
this.teardown();
|
|
1496
|
+
this.state = "finished";
|
|
1497
|
+
this.options.onComplete?.();
|
|
1498
|
+
}
|
|
1499
|
+
cancel() {
|
|
1500
|
+
this.holdTime = null;
|
|
1501
|
+
this.startTime = 0;
|
|
1502
|
+
this.tick(0);
|
|
1503
|
+
this.teardown();
|
|
1504
|
+
this.options.onCancel?.();
|
|
1505
|
+
}
|
|
1506
|
+
teardown() {
|
|
1507
|
+
this.state = "idle";
|
|
1508
|
+
this.stopDriver();
|
|
1509
|
+
this.startTime = this.holdTime = null;
|
|
1510
|
+
activeAnimations.mainThread--;
|
|
1511
|
+
}
|
|
1512
|
+
stopDriver() {
|
|
1513
|
+
if (!this.driver)
|
|
1514
|
+
return;
|
|
1515
|
+
this.driver.stop();
|
|
1516
|
+
this.driver = void 0;
|
|
1517
|
+
}
|
|
1518
|
+
sample(sampleTime) {
|
|
1519
|
+
this.startTime = 0;
|
|
1520
|
+
return this.tick(sampleTime, true);
|
|
1521
|
+
}
|
|
1522
|
+
attachTimeline(timeline) {
|
|
1523
|
+
if (this.options.allowFlatten) {
|
|
1524
|
+
this.options.type = "keyframes";
|
|
1525
|
+
this.options.ease = "linear";
|
|
1526
|
+
this.initAnimation();
|
|
1527
|
+
}
|
|
1528
|
+
this.driver?.stop();
|
|
1529
|
+
return timeline.observe(this);
|
|
1530
|
+
}
|
|
1531
|
+
};
|
|
1532
|
+
|
|
1533
|
+
// node_modules/motion-dom/dist/es/animation/keyframes/utils/fill-wildcards.mjs
|
|
1534
|
+
function fillWildcards(keyframes2) {
|
|
1535
|
+
for (let i = 1; i < keyframes2.length; i++) {
|
|
1536
|
+
keyframes2[i] ?? (keyframes2[i] = keyframes2[i - 1]);
|
|
1537
|
+
}
|
|
1538
|
+
}
|
|
1539
|
+
|
|
1540
|
+
// node_modules/motion-dom/dist/es/render/dom/parse-transform.mjs
|
|
1541
|
+
var radToDeg = (rad) => rad * 180 / Math.PI;
|
|
1542
|
+
var rotate = (v) => {
|
|
1543
|
+
const angle = radToDeg(Math.atan2(v[1], v[0]));
|
|
1544
|
+
return rebaseAngle(angle);
|
|
1545
|
+
};
|
|
1546
|
+
var matrix2dParsers = {
|
|
1547
|
+
x: 4,
|
|
1548
|
+
y: 5,
|
|
1549
|
+
translateX: 4,
|
|
1550
|
+
translateY: 5,
|
|
1551
|
+
scaleX: 0,
|
|
1552
|
+
scaleY: 3,
|
|
1553
|
+
scale: (v) => (Math.abs(v[0]) + Math.abs(v[3])) / 2,
|
|
1554
|
+
rotate,
|
|
1555
|
+
rotateZ: rotate,
|
|
1556
|
+
skewX: (v) => radToDeg(Math.atan(v[1])),
|
|
1557
|
+
skewY: (v) => radToDeg(Math.atan(v[2])),
|
|
1558
|
+
skew: (v) => (Math.abs(v[1]) + Math.abs(v[2])) / 2
|
|
1559
|
+
};
|
|
1560
|
+
var rebaseAngle = (angle) => {
|
|
1561
|
+
angle = angle % 360;
|
|
1562
|
+
if (angle < 0)
|
|
1563
|
+
angle += 360;
|
|
1564
|
+
return angle;
|
|
1565
|
+
};
|
|
1566
|
+
var rotateZ = rotate;
|
|
1567
|
+
var scaleX = (v) => Math.sqrt(v[0] * v[0] + v[1] * v[1]);
|
|
1568
|
+
var scaleY = (v) => Math.sqrt(v[4] * v[4] + v[5] * v[5]);
|
|
1569
|
+
var matrix3dParsers = {
|
|
1570
|
+
x: 12,
|
|
1571
|
+
y: 13,
|
|
1572
|
+
z: 14,
|
|
1573
|
+
translateX: 12,
|
|
1574
|
+
translateY: 13,
|
|
1575
|
+
translateZ: 14,
|
|
1576
|
+
scaleX,
|
|
1577
|
+
scaleY,
|
|
1578
|
+
scale: (v) => (scaleX(v) + scaleY(v)) / 2,
|
|
1579
|
+
rotateX: (v) => rebaseAngle(radToDeg(Math.atan2(v[6], v[5]))),
|
|
1580
|
+
rotateY: (v) => rebaseAngle(radToDeg(Math.atan2(-v[2], v[0]))),
|
|
1581
|
+
rotateZ,
|
|
1582
|
+
rotate: rotateZ,
|
|
1583
|
+
skewX: (v) => radToDeg(Math.atan(v[4])),
|
|
1584
|
+
skewY: (v) => radToDeg(Math.atan(v[1])),
|
|
1585
|
+
skew: (v) => (Math.abs(v[1]) + Math.abs(v[4])) / 2
|
|
1586
|
+
};
|
|
1587
|
+
function defaultTransformValue(name) {
|
|
1588
|
+
return name.includes("scale") ? 1 : 0;
|
|
1589
|
+
}
|
|
1590
|
+
function parseValueFromTransform(transform2, name) {
|
|
1591
|
+
if (!transform2 || transform2 === "none") {
|
|
1592
|
+
return defaultTransformValue(name);
|
|
1593
|
+
}
|
|
1594
|
+
const matrix3dMatch = transform2.match(/^matrix3d\(([-\d.e\s,]+)\)$/u);
|
|
1595
|
+
let parsers;
|
|
1596
|
+
let match;
|
|
1597
|
+
if (matrix3dMatch) {
|
|
1598
|
+
parsers = matrix3dParsers;
|
|
1599
|
+
match = matrix3dMatch;
|
|
1600
|
+
} else {
|
|
1601
|
+
const matrix2dMatch = transform2.match(/^matrix\(([-\d.e\s,]+)\)$/u);
|
|
1602
|
+
parsers = matrix2dParsers;
|
|
1603
|
+
match = matrix2dMatch;
|
|
1604
|
+
}
|
|
1605
|
+
if (!match) {
|
|
1606
|
+
return defaultTransformValue(name);
|
|
1607
|
+
}
|
|
1608
|
+
const valueParser = parsers[name];
|
|
1609
|
+
const values = match[1].split(",").map(convertTransformToNumber);
|
|
1610
|
+
return typeof valueParser === "function" ? valueParser(values) : values[valueParser];
|
|
1611
|
+
}
|
|
1612
|
+
function convertTransformToNumber(value) {
|
|
1613
|
+
return parseFloat(value.trim());
|
|
1614
|
+
}
|
|
1615
|
+
|
|
1616
|
+
// node_modules/motion-dom/dist/es/render/utils/keys-transform.mjs
|
|
1617
|
+
var transformPropOrder = [
|
|
1618
|
+
"transformPerspective",
|
|
1619
|
+
"x",
|
|
1620
|
+
"y",
|
|
1621
|
+
"z",
|
|
1622
|
+
"translateX",
|
|
1623
|
+
"translateY",
|
|
1624
|
+
"translateZ",
|
|
1625
|
+
"scale",
|
|
1626
|
+
"scaleX",
|
|
1627
|
+
"scaleY",
|
|
1628
|
+
"rotate",
|
|
1629
|
+
"rotateX",
|
|
1630
|
+
"rotateY",
|
|
1631
|
+
"rotateZ",
|
|
1632
|
+
"skew",
|
|
1633
|
+
"skewX",
|
|
1634
|
+
"skewY"
|
|
1635
|
+
];
|
|
1636
|
+
var transformProps = /* @__PURE__ */ (() => new Set(transformPropOrder))();
|
|
1637
|
+
|
|
1638
|
+
// node_modules/motion-dom/dist/es/animation/keyframes/utils/unit-conversion.mjs
|
|
1639
|
+
var transformKeys = /* @__PURE__ */ new Set(["x", "y", "z"]);
|
|
1640
|
+
var nonTranslationalTransformKeys = transformPropOrder.filter((key) => !transformKeys.has(key));
|
|
1641
|
+
function removeNonTranslationalTransform(visualElement) {
|
|
1642
|
+
const removedTransforms = [];
|
|
1643
|
+
nonTranslationalTransformKeys.forEach((key) => {
|
|
1644
|
+
const value = visualElement.getValue(key);
|
|
1645
|
+
if (value !== void 0) {
|
|
1646
|
+
removedTransforms.push([key, value.get()]);
|
|
1647
|
+
value.set(key.startsWith("scale") ? 1 : 0);
|
|
1648
|
+
}
|
|
1649
|
+
});
|
|
1650
|
+
return removedTransforms;
|
|
1651
|
+
}
|
|
1652
|
+
var positionalValues = {
|
|
1653
|
+
// Dimensions
|
|
1654
|
+
width: ({ x }, { paddingLeft = "0", paddingRight = "0" }) => x.max - x.min - parseFloat(paddingLeft) - parseFloat(paddingRight),
|
|
1655
|
+
height: ({ y }, { paddingTop = "0", paddingBottom = "0" }) => y.max - y.min - parseFloat(paddingTop) - parseFloat(paddingBottom),
|
|
1656
|
+
top: (_bbox, { top }) => parseFloat(top),
|
|
1657
|
+
left: (_bbox, { left }) => parseFloat(left),
|
|
1658
|
+
bottom: ({ y }, { top }) => parseFloat(top) + (y.max - y.min),
|
|
1659
|
+
right: ({ x }, { left }) => parseFloat(left) + (x.max - x.min),
|
|
1660
|
+
// Transform
|
|
1661
|
+
x: (_bbox, { transform: transform2 }) => parseValueFromTransform(transform2, "x"),
|
|
1662
|
+
y: (_bbox, { transform: transform2 }) => parseValueFromTransform(transform2, "y")
|
|
1663
|
+
};
|
|
1664
|
+
positionalValues.translateX = positionalValues.x;
|
|
1665
|
+
positionalValues.translateY = positionalValues.y;
|
|
1666
|
+
|
|
1667
|
+
// node_modules/motion-dom/dist/es/animation/keyframes/KeyframesResolver.mjs
|
|
1668
|
+
var toResolve = /* @__PURE__ */ new Set();
|
|
1669
|
+
var isScheduled = false;
|
|
1670
|
+
var anyNeedsMeasurement = false;
|
|
1671
|
+
var isForced = false;
|
|
1672
|
+
function measureAllKeyframes() {
|
|
1673
|
+
if (anyNeedsMeasurement) {
|
|
1674
|
+
const resolversToMeasure = Array.from(toResolve).filter((resolver) => resolver.needsMeasurement);
|
|
1675
|
+
const elementsToMeasure = new Set(resolversToMeasure.map((resolver) => resolver.element));
|
|
1676
|
+
const transformsToRestore = /* @__PURE__ */ new Map();
|
|
1677
|
+
elementsToMeasure.forEach((element) => {
|
|
1678
|
+
const removedTransforms = removeNonTranslationalTransform(element);
|
|
1679
|
+
if (!removedTransforms.length)
|
|
1680
|
+
return;
|
|
1681
|
+
transformsToRestore.set(element, removedTransforms);
|
|
1682
|
+
element.render();
|
|
1683
|
+
});
|
|
1684
|
+
resolversToMeasure.forEach((resolver) => resolver.measureInitialState());
|
|
1685
|
+
elementsToMeasure.forEach((element) => {
|
|
1686
|
+
element.render();
|
|
1687
|
+
const restore = transformsToRestore.get(element);
|
|
1688
|
+
if (restore) {
|
|
1689
|
+
restore.forEach(([key, value]) => {
|
|
1690
|
+
element.getValue(key)?.set(value);
|
|
1691
|
+
});
|
|
1692
|
+
}
|
|
1693
|
+
});
|
|
1694
|
+
resolversToMeasure.forEach((resolver) => resolver.measureEndState());
|
|
1695
|
+
resolversToMeasure.forEach((resolver) => {
|
|
1696
|
+
if (resolver.suspendedScrollY !== void 0) {
|
|
1697
|
+
window.scrollTo(0, resolver.suspendedScrollY);
|
|
1698
|
+
}
|
|
1699
|
+
});
|
|
1700
|
+
}
|
|
1701
|
+
anyNeedsMeasurement = false;
|
|
1702
|
+
isScheduled = false;
|
|
1703
|
+
toResolve.forEach((resolver) => resolver.complete(isForced));
|
|
1704
|
+
toResolve.clear();
|
|
1705
|
+
}
|
|
1706
|
+
function readAllKeyframes() {
|
|
1707
|
+
toResolve.forEach((resolver) => {
|
|
1708
|
+
resolver.readKeyframes();
|
|
1709
|
+
if (resolver.needsMeasurement) {
|
|
1710
|
+
anyNeedsMeasurement = true;
|
|
1711
|
+
}
|
|
1712
|
+
});
|
|
1713
|
+
}
|
|
1714
|
+
function flushKeyframeResolvers() {
|
|
1715
|
+
isForced = true;
|
|
1716
|
+
readAllKeyframes();
|
|
1717
|
+
measureAllKeyframes();
|
|
1718
|
+
isForced = false;
|
|
1719
|
+
}
|
|
1720
|
+
var KeyframeResolver = class {
|
|
1721
|
+
constructor(unresolvedKeyframes, onComplete, name, motionValue2, element, isAsync = false) {
|
|
1722
|
+
this.state = "pending";
|
|
1723
|
+
this.isAsync = false;
|
|
1724
|
+
this.needsMeasurement = false;
|
|
1725
|
+
this.unresolvedKeyframes = [...unresolvedKeyframes];
|
|
1726
|
+
this.onComplete = onComplete;
|
|
1727
|
+
this.name = name;
|
|
1728
|
+
this.motionValue = motionValue2;
|
|
1729
|
+
this.element = element;
|
|
1730
|
+
this.isAsync = isAsync;
|
|
1731
|
+
}
|
|
1732
|
+
scheduleResolve() {
|
|
1733
|
+
this.state = "scheduled";
|
|
1734
|
+
if (this.isAsync) {
|
|
1735
|
+
toResolve.add(this);
|
|
1736
|
+
if (!isScheduled) {
|
|
1737
|
+
isScheduled = true;
|
|
1738
|
+
frame.read(readAllKeyframes);
|
|
1739
|
+
frame.resolveKeyframes(measureAllKeyframes);
|
|
1740
|
+
}
|
|
1741
|
+
} else {
|
|
1742
|
+
this.readKeyframes();
|
|
1743
|
+
this.complete();
|
|
1744
|
+
}
|
|
1745
|
+
}
|
|
1746
|
+
readKeyframes() {
|
|
1747
|
+
const { unresolvedKeyframes, name, element, motionValue: motionValue2 } = this;
|
|
1748
|
+
if (unresolvedKeyframes[0] === null) {
|
|
1749
|
+
const currentValue = motionValue2?.get();
|
|
1750
|
+
const finalKeyframe = unresolvedKeyframes[unresolvedKeyframes.length - 1];
|
|
1751
|
+
if (currentValue !== void 0) {
|
|
1752
|
+
unresolvedKeyframes[0] = currentValue;
|
|
1753
|
+
} else if (element && name) {
|
|
1754
|
+
const valueAsRead = element.readValue(name, finalKeyframe);
|
|
1755
|
+
if (valueAsRead !== void 0 && valueAsRead !== null) {
|
|
1756
|
+
unresolvedKeyframes[0] = valueAsRead;
|
|
1757
|
+
}
|
|
1758
|
+
}
|
|
1759
|
+
if (unresolvedKeyframes[0] === void 0) {
|
|
1760
|
+
unresolvedKeyframes[0] = finalKeyframe;
|
|
1761
|
+
}
|
|
1762
|
+
if (motionValue2 && currentValue === void 0) {
|
|
1763
|
+
motionValue2.set(unresolvedKeyframes[0]);
|
|
1764
|
+
}
|
|
1765
|
+
}
|
|
1766
|
+
fillWildcards(unresolvedKeyframes);
|
|
1767
|
+
}
|
|
1768
|
+
setFinalKeyframe() {
|
|
1769
|
+
}
|
|
1770
|
+
measureInitialState() {
|
|
1771
|
+
}
|
|
1772
|
+
renderEndStyles() {
|
|
1773
|
+
}
|
|
1774
|
+
measureEndState() {
|
|
1775
|
+
}
|
|
1776
|
+
complete(isForcedComplete = false) {
|
|
1777
|
+
this.state = "complete";
|
|
1778
|
+
this.onComplete(this.unresolvedKeyframes, this.finalKeyframe, isForcedComplete);
|
|
1779
|
+
toResolve.delete(this);
|
|
1780
|
+
}
|
|
1781
|
+
cancel() {
|
|
1782
|
+
if (this.state === "scheduled") {
|
|
1783
|
+
toResolve.delete(this);
|
|
1784
|
+
this.state = "pending";
|
|
1785
|
+
}
|
|
1786
|
+
}
|
|
1787
|
+
resume() {
|
|
1788
|
+
if (this.state === "pending")
|
|
1789
|
+
this.scheduleResolve();
|
|
1790
|
+
}
|
|
1791
|
+
};
|
|
1792
|
+
|
|
1793
|
+
// node_modules/motion-dom/dist/es/render/dom/is-css-var.mjs
|
|
1794
|
+
var isCSSVar = (name) => name.startsWith("--");
|
|
1795
|
+
|
|
1796
|
+
// node_modules/motion-dom/dist/es/render/dom/style-set.mjs
|
|
1797
|
+
function setStyle(element, name, value) {
|
|
1798
|
+
isCSSVar(name) ? element.style.setProperty(name, value) : element.style[name] = value;
|
|
1799
|
+
}
|
|
1800
|
+
|
|
1801
|
+
// node_modules/motion-dom/dist/es/utils/supports/scroll-timeline.mjs
|
|
1802
|
+
var supportsScrollTimeline = /* @__PURE__ */ memo(() => window.ScrollTimeline !== void 0);
|
|
1803
|
+
|
|
1804
|
+
// node_modules/motion-dom/dist/es/utils/supports/flags.mjs
|
|
1805
|
+
var supportsFlags = {};
|
|
1806
|
+
|
|
1807
|
+
// node_modules/motion-dom/dist/es/utils/supports/memo.mjs
|
|
1808
|
+
function memoSupports(callback, supportsFlag) {
|
|
1809
|
+
const memoized = memo(callback);
|
|
1810
|
+
return () => supportsFlags[supportsFlag] ?? memoized();
|
|
1811
|
+
}
|
|
1812
|
+
|
|
1813
|
+
// node_modules/motion-dom/dist/es/utils/supports/linear-easing.mjs
|
|
1814
|
+
var supportsLinearEasing = /* @__PURE__ */ memoSupports(() => {
|
|
1815
|
+
try {
|
|
1816
|
+
document.createElement("div").animate({ opacity: 0 }, { easing: "linear(0, 1)" });
|
|
1817
|
+
} catch (e) {
|
|
1818
|
+
return false;
|
|
1819
|
+
}
|
|
1820
|
+
return true;
|
|
1821
|
+
}, "linearEasing");
|
|
1822
|
+
|
|
1823
|
+
// node_modules/motion-dom/dist/es/animation/waapi/easing/cubic-bezier.mjs
|
|
1824
|
+
var cubicBezierAsString = ([a, b, c, d]) => `cubic-bezier(${a}, ${b}, ${c}, ${d})`;
|
|
1825
|
+
|
|
1826
|
+
// node_modules/motion-dom/dist/es/animation/waapi/easing/supported.mjs
|
|
1827
|
+
var supportedWaapiEasing = {
|
|
1828
|
+
linear: "linear",
|
|
1829
|
+
ease: "ease",
|
|
1830
|
+
easeIn: "ease-in",
|
|
1831
|
+
easeOut: "ease-out",
|
|
1832
|
+
easeInOut: "ease-in-out",
|
|
1833
|
+
circIn: /* @__PURE__ */ cubicBezierAsString([0, 0.65, 0.55, 1]),
|
|
1834
|
+
circOut: /* @__PURE__ */ cubicBezierAsString([0.55, 0, 1, 0.45]),
|
|
1835
|
+
backIn: /* @__PURE__ */ cubicBezierAsString([0.31, 0.01, 0.66, -0.59]),
|
|
1836
|
+
backOut: /* @__PURE__ */ cubicBezierAsString([0.33, 1.53, 0.69, 0.99])
|
|
1837
|
+
};
|
|
1838
|
+
|
|
1839
|
+
// node_modules/motion-dom/dist/es/animation/waapi/easing/map-easing.mjs
|
|
1840
|
+
function mapEasingToNativeEasing(easing, duration) {
|
|
1841
|
+
if (!easing) {
|
|
1842
|
+
return void 0;
|
|
1843
|
+
} else if (typeof easing === "function") {
|
|
1844
|
+
return supportsLinearEasing() ? generateLinearEasing(easing, duration) : "ease-out";
|
|
1845
|
+
} else if (isBezierDefinition(easing)) {
|
|
1846
|
+
return cubicBezierAsString(easing);
|
|
1847
|
+
} else if (Array.isArray(easing)) {
|
|
1848
|
+
return easing.map((segmentEasing) => mapEasingToNativeEasing(segmentEasing, duration) || supportedWaapiEasing.easeOut);
|
|
1849
|
+
} else {
|
|
1850
|
+
return supportedWaapiEasing[easing];
|
|
1851
|
+
}
|
|
1852
|
+
}
|
|
1853
|
+
|
|
1854
|
+
// node_modules/motion-dom/dist/es/animation/waapi/start-waapi-animation.mjs
|
|
1855
|
+
function startWaapiAnimation(element, valueName, keyframes2, { delay = 0, duration = 300, repeat = 0, repeatType = "loop", ease: ease2 = "easeOut", times } = {}, pseudoElement = void 0) {
|
|
1856
|
+
const keyframeOptions = {
|
|
1857
|
+
[valueName]: keyframes2
|
|
1858
|
+
};
|
|
1859
|
+
if (times)
|
|
1860
|
+
keyframeOptions.offset = times;
|
|
1861
|
+
const easing = mapEasingToNativeEasing(ease2, duration);
|
|
1862
|
+
if (Array.isArray(easing))
|
|
1863
|
+
keyframeOptions.easing = easing;
|
|
1864
|
+
if (statsBuffer.value) {
|
|
1865
|
+
activeAnimations.waapi++;
|
|
1866
|
+
}
|
|
1867
|
+
const options = {
|
|
1868
|
+
delay,
|
|
1869
|
+
duration,
|
|
1870
|
+
easing: !Array.isArray(easing) ? easing : "linear",
|
|
1871
|
+
fill: "both",
|
|
1872
|
+
iterations: repeat + 1,
|
|
1873
|
+
direction: repeatType === "reverse" ? "alternate" : "normal"
|
|
1874
|
+
};
|
|
1875
|
+
if (pseudoElement)
|
|
1876
|
+
options.pseudoElement = pseudoElement;
|
|
1877
|
+
const animation = element.animate(keyframeOptions, options);
|
|
1878
|
+
if (statsBuffer.value) {
|
|
1879
|
+
animation.finished.finally(() => {
|
|
1880
|
+
activeAnimations.waapi--;
|
|
1881
|
+
});
|
|
1882
|
+
}
|
|
1883
|
+
return animation;
|
|
1884
|
+
}
|
|
1885
|
+
|
|
1886
|
+
// node_modules/motion-dom/dist/es/animation/generators/utils/is-generator.mjs
|
|
1887
|
+
function isGenerator(type) {
|
|
1888
|
+
return typeof type === "function" && "applyToOptions" in type;
|
|
1889
|
+
}
|
|
1890
|
+
|
|
1891
|
+
// node_modules/motion-dom/dist/es/animation/waapi/utils/apply-generator.mjs
|
|
1892
|
+
function applyGeneratorOptions({ type, ...options }) {
|
|
1893
|
+
if (isGenerator(type) && supportsLinearEasing()) {
|
|
1894
|
+
return type.applyToOptions(options);
|
|
1895
|
+
} else {
|
|
1896
|
+
options.duration ?? (options.duration = 300);
|
|
1897
|
+
options.ease ?? (options.ease = "easeOut");
|
|
1898
|
+
}
|
|
1899
|
+
return options;
|
|
1900
|
+
}
|
|
1901
|
+
|
|
1902
|
+
// node_modules/motion-dom/dist/es/animation/NativeAnimation.mjs
|
|
1903
|
+
var NativeAnimation = class extends WithPromise {
|
|
1904
|
+
constructor(options) {
|
|
1905
|
+
super();
|
|
1906
|
+
this.finishedTime = null;
|
|
1907
|
+
this.isStopped = false;
|
|
1908
|
+
this.manualStartTime = null;
|
|
1909
|
+
if (!options)
|
|
1910
|
+
return;
|
|
1911
|
+
const { element, name, keyframes: keyframes2, pseudoElement, allowFlatten = false, finalKeyframe, onComplete } = options;
|
|
1912
|
+
this.isPseudoElement = Boolean(pseudoElement);
|
|
1913
|
+
this.allowFlatten = allowFlatten;
|
|
1914
|
+
this.options = options;
|
|
1915
|
+
invariant(typeof options.type !== "string", `Mini animate() doesn't support "type" as a string.`, "mini-spring");
|
|
1916
|
+
const transition = applyGeneratorOptions(options);
|
|
1917
|
+
this.animation = startWaapiAnimation(element, name, keyframes2, transition, pseudoElement);
|
|
1918
|
+
if (transition.autoplay === false) {
|
|
1919
|
+
this.animation.pause();
|
|
1920
|
+
}
|
|
1921
|
+
this.animation.onfinish = () => {
|
|
1922
|
+
this.finishedTime = this.time;
|
|
1923
|
+
if (!pseudoElement) {
|
|
1924
|
+
const keyframe = getFinalKeyframe(keyframes2, this.options, finalKeyframe, this.speed);
|
|
1925
|
+
if (this.updateMotionValue) {
|
|
1926
|
+
this.updateMotionValue(keyframe);
|
|
1927
|
+
} else {
|
|
1928
|
+
setStyle(element, name, keyframe);
|
|
1929
|
+
}
|
|
1930
|
+
this.animation.cancel();
|
|
1931
|
+
}
|
|
1932
|
+
onComplete?.();
|
|
1933
|
+
this.notifyFinished();
|
|
1934
|
+
};
|
|
1935
|
+
}
|
|
1936
|
+
play() {
|
|
1937
|
+
if (this.isStopped)
|
|
1938
|
+
return;
|
|
1939
|
+
this.manualStartTime = null;
|
|
1940
|
+
this.animation.play();
|
|
1941
|
+
if (this.state === "finished") {
|
|
1942
|
+
this.updateFinished();
|
|
1943
|
+
}
|
|
1944
|
+
}
|
|
1945
|
+
pause() {
|
|
1946
|
+
this.animation.pause();
|
|
1947
|
+
}
|
|
1948
|
+
complete() {
|
|
1949
|
+
this.animation.finish?.();
|
|
1950
|
+
}
|
|
1951
|
+
cancel() {
|
|
1952
|
+
try {
|
|
1953
|
+
this.animation.cancel();
|
|
1954
|
+
} catch (e) {
|
|
1955
|
+
}
|
|
1956
|
+
}
|
|
1957
|
+
stop() {
|
|
1958
|
+
if (this.isStopped)
|
|
1959
|
+
return;
|
|
1960
|
+
this.isStopped = true;
|
|
1961
|
+
const { state } = this;
|
|
1962
|
+
if (state === "idle" || state === "finished") {
|
|
1963
|
+
return;
|
|
1964
|
+
}
|
|
1965
|
+
if (this.updateMotionValue) {
|
|
1966
|
+
this.updateMotionValue();
|
|
1967
|
+
} else {
|
|
1968
|
+
this.commitStyles();
|
|
1969
|
+
}
|
|
1970
|
+
if (!this.isPseudoElement)
|
|
1971
|
+
this.cancel();
|
|
1972
|
+
}
|
|
1973
|
+
/**
|
|
1974
|
+
* WAAPI doesn't natively have any interruption capabilities.
|
|
1975
|
+
*
|
|
1976
|
+
* In this method, we commit styles back to the DOM before cancelling
|
|
1977
|
+
* the animation.
|
|
1978
|
+
*
|
|
1979
|
+
* This is designed to be overridden by NativeAnimationExtended, which
|
|
1980
|
+
* will create a renderless JS animation and sample it twice to calculate
|
|
1981
|
+
* its current value, "previous" value, and therefore allow
|
|
1982
|
+
* Motion to also correctly calculate velocity for any subsequent animation
|
|
1983
|
+
* while deferring the commit until the next animation frame.
|
|
1984
|
+
*/
|
|
1985
|
+
commitStyles() {
|
|
1986
|
+
if (!this.isPseudoElement) {
|
|
1987
|
+
this.animation.commitStyles?.();
|
|
1988
|
+
}
|
|
1989
|
+
}
|
|
1990
|
+
get duration() {
|
|
1991
|
+
const duration = this.animation.effect?.getComputedTiming?.().duration || 0;
|
|
1992
|
+
return millisecondsToSeconds(Number(duration));
|
|
1993
|
+
}
|
|
1994
|
+
get iterationDuration() {
|
|
1995
|
+
const { delay = 0 } = this.options || {};
|
|
1996
|
+
return this.duration + millisecondsToSeconds(delay);
|
|
1997
|
+
}
|
|
1998
|
+
get time() {
|
|
1999
|
+
return millisecondsToSeconds(Number(this.animation.currentTime) || 0);
|
|
2000
|
+
}
|
|
2001
|
+
set time(newTime) {
|
|
2002
|
+
this.manualStartTime = null;
|
|
2003
|
+
this.finishedTime = null;
|
|
2004
|
+
this.animation.currentTime = secondsToMilliseconds(newTime);
|
|
2005
|
+
}
|
|
2006
|
+
/**
|
|
2007
|
+
* The playback speed of the animation.
|
|
2008
|
+
* 1 = normal speed, 2 = double speed, 0.5 = half speed.
|
|
2009
|
+
*/
|
|
2010
|
+
get speed() {
|
|
2011
|
+
return this.animation.playbackRate;
|
|
2012
|
+
}
|
|
2013
|
+
set speed(newSpeed) {
|
|
2014
|
+
if (newSpeed < 0)
|
|
2015
|
+
this.finishedTime = null;
|
|
2016
|
+
this.animation.playbackRate = newSpeed;
|
|
2017
|
+
}
|
|
2018
|
+
get state() {
|
|
2019
|
+
return this.finishedTime !== null ? "finished" : this.animation.playState;
|
|
2020
|
+
}
|
|
2021
|
+
get startTime() {
|
|
2022
|
+
return this.manualStartTime ?? Number(this.animation.startTime);
|
|
2023
|
+
}
|
|
2024
|
+
set startTime(newStartTime) {
|
|
2025
|
+
this.manualStartTime = this.animation.startTime = newStartTime;
|
|
2026
|
+
}
|
|
2027
|
+
/**
|
|
2028
|
+
* Attaches a timeline to the animation, for instance the `ScrollTimeline`.
|
|
2029
|
+
*/
|
|
2030
|
+
attachTimeline({ timeline, observe }) {
|
|
2031
|
+
if (this.allowFlatten) {
|
|
2032
|
+
this.animation.effect?.updateTiming({ easing: "linear" });
|
|
2033
|
+
}
|
|
2034
|
+
this.animation.onfinish = null;
|
|
2035
|
+
if (timeline && supportsScrollTimeline()) {
|
|
2036
|
+
this.animation.timeline = timeline;
|
|
2037
|
+
return noop;
|
|
2038
|
+
} else {
|
|
2039
|
+
return observe(this);
|
|
2040
|
+
}
|
|
2041
|
+
}
|
|
2042
|
+
};
|
|
2043
|
+
|
|
2044
|
+
// node_modules/motion-dom/dist/es/animation/waapi/utils/unsupported-easing.mjs
|
|
2045
|
+
var unsupportedEasingFunctions = {
|
|
2046
|
+
anticipate,
|
|
2047
|
+
backInOut,
|
|
2048
|
+
circInOut
|
|
2049
|
+
};
|
|
2050
|
+
function isUnsupportedEase(key) {
|
|
2051
|
+
return key in unsupportedEasingFunctions;
|
|
2052
|
+
}
|
|
2053
|
+
function replaceStringEasing(transition) {
|
|
2054
|
+
if (typeof transition.ease === "string" && isUnsupportedEase(transition.ease)) {
|
|
2055
|
+
transition.ease = unsupportedEasingFunctions[transition.ease];
|
|
2056
|
+
}
|
|
2057
|
+
}
|
|
2058
|
+
|
|
2059
|
+
// node_modules/motion-dom/dist/es/animation/NativeAnimationExtended.mjs
|
|
2060
|
+
var sampleDelta = 10;
|
|
2061
|
+
var NativeAnimationExtended = class extends NativeAnimation {
|
|
2062
|
+
constructor(options) {
|
|
2063
|
+
replaceStringEasing(options);
|
|
2064
|
+
replaceTransitionType(options);
|
|
2065
|
+
super(options);
|
|
2066
|
+
if (options.startTime !== void 0) {
|
|
2067
|
+
this.startTime = options.startTime;
|
|
2068
|
+
}
|
|
2069
|
+
this.options = options;
|
|
2070
|
+
}
|
|
2071
|
+
/**
|
|
2072
|
+
* WAAPI doesn't natively have any interruption capabilities.
|
|
2073
|
+
*
|
|
2074
|
+
* Rather than read committed styles back out of the DOM, we can
|
|
2075
|
+
* create a renderless JS animation and sample it twice to calculate
|
|
2076
|
+
* its current value, "previous" value, and therefore allow
|
|
2077
|
+
* Motion to calculate velocity for any subsequent animation.
|
|
2078
|
+
*/
|
|
2079
|
+
updateMotionValue(value) {
|
|
2080
|
+
const { motionValue: motionValue2, onUpdate, onComplete, element, ...options } = this.options;
|
|
2081
|
+
if (!motionValue2)
|
|
2082
|
+
return;
|
|
2083
|
+
if (value !== void 0) {
|
|
2084
|
+
motionValue2.set(value);
|
|
2085
|
+
return;
|
|
2086
|
+
}
|
|
2087
|
+
const sampleAnimation = new JSAnimation({
|
|
2088
|
+
...options,
|
|
2089
|
+
autoplay: false
|
|
2090
|
+
});
|
|
2091
|
+
const sampleTime = Math.max(sampleDelta, time.now() - this.startTime);
|
|
2092
|
+
const delta = clamp(0, sampleDelta, sampleTime - sampleDelta);
|
|
2093
|
+
motionValue2.setWithVelocity(sampleAnimation.sample(Math.max(0, sampleTime - delta)).value, sampleAnimation.sample(sampleTime).value, delta);
|
|
2094
|
+
sampleAnimation.stop();
|
|
2095
|
+
}
|
|
2096
|
+
};
|
|
2097
|
+
|
|
2098
|
+
// node_modules/motion-dom/dist/es/animation/utils/is-animatable.mjs
|
|
2099
|
+
var isAnimatable = (value, name) => {
|
|
2100
|
+
if (name === "zIndex")
|
|
2101
|
+
return false;
|
|
2102
|
+
if (typeof value === "number" || Array.isArray(value))
|
|
2103
|
+
return true;
|
|
2104
|
+
if (typeof value === "string" && // It's animatable if we have a string
|
|
2105
|
+
(complex.test(value) || value === "0") && // And it contains numbers and/or colors
|
|
2106
|
+
!value.startsWith("url(")) {
|
|
2107
|
+
return true;
|
|
2108
|
+
}
|
|
2109
|
+
return false;
|
|
2110
|
+
};
|
|
2111
|
+
|
|
2112
|
+
// node_modules/motion-dom/dist/es/animation/utils/can-animate.mjs
|
|
2113
|
+
function hasKeyframesChanged(keyframes2) {
|
|
2114
|
+
const current = keyframes2[0];
|
|
2115
|
+
if (keyframes2.length === 1)
|
|
2116
|
+
return true;
|
|
2117
|
+
for (let i = 0; i < keyframes2.length; i++) {
|
|
2118
|
+
if (keyframes2[i] !== current)
|
|
2119
|
+
return true;
|
|
2120
|
+
}
|
|
2121
|
+
}
|
|
2122
|
+
function canAnimate(keyframes2, name, type, velocity) {
|
|
2123
|
+
const originKeyframe = keyframes2[0];
|
|
2124
|
+
if (originKeyframe === null) {
|
|
2125
|
+
return false;
|
|
2126
|
+
}
|
|
2127
|
+
if (name === "display" || name === "visibility")
|
|
2128
|
+
return true;
|
|
2129
|
+
const targetKeyframe = keyframes2[keyframes2.length - 1];
|
|
2130
|
+
const isOriginAnimatable = isAnimatable(originKeyframe, name);
|
|
2131
|
+
const isTargetAnimatable = isAnimatable(targetKeyframe, name);
|
|
2132
|
+
warning(isOriginAnimatable === isTargetAnimatable, `You are trying to animate ${name} from "${originKeyframe}" to "${targetKeyframe}". "${isOriginAnimatable ? targetKeyframe : originKeyframe}" is not an animatable value.`, "value-not-animatable");
|
|
2133
|
+
if (!isOriginAnimatable || !isTargetAnimatable) {
|
|
2134
|
+
return false;
|
|
2135
|
+
}
|
|
2136
|
+
return hasKeyframesChanged(keyframes2) || (type === "spring" || isGenerator(type)) && velocity;
|
|
2137
|
+
}
|
|
2138
|
+
|
|
2139
|
+
// node_modules/motion-dom/dist/es/animation/utils/make-animation-instant.mjs
|
|
2140
|
+
function makeAnimationInstant(options) {
|
|
2141
|
+
options.duration = 0;
|
|
2142
|
+
options.type = "keyframes";
|
|
2143
|
+
}
|
|
2144
|
+
|
|
2145
|
+
// node_modules/motion-dom/dist/es/animation/waapi/supports/waapi.mjs
|
|
2146
|
+
var acceleratedValues = /* @__PURE__ */ new Set([
|
|
2147
|
+
"opacity",
|
|
2148
|
+
"clipPath",
|
|
2149
|
+
"filter",
|
|
2150
|
+
"transform"
|
|
2151
|
+
// TODO: Could be re-enabled now we have support for linear() easing
|
|
2152
|
+
// "background-color"
|
|
2153
|
+
]);
|
|
2154
|
+
var supportsWaapi = /* @__PURE__ */ memo(() => Object.hasOwnProperty.call(Element.prototype, "animate"));
|
|
2155
|
+
function supportsBrowserAnimation(options) {
|
|
2156
|
+
const { motionValue: motionValue2, name, repeatDelay, repeatType, damping, type } = options;
|
|
2157
|
+
const subject = motionValue2?.owner?.current;
|
|
2158
|
+
if (!(subject instanceof HTMLElement)) {
|
|
2159
|
+
return false;
|
|
2160
|
+
}
|
|
2161
|
+
const { onUpdate, transformTemplate } = motionValue2.owner.getProps();
|
|
2162
|
+
return supportsWaapi() && name && acceleratedValues.has(name) && (name !== "transform" || !transformTemplate) && /**
|
|
2163
|
+
* If we're outputting values to onUpdate then we can't use WAAPI as there's
|
|
2164
|
+
* no way to read the value from WAAPI every frame.
|
|
2165
|
+
*/
|
|
2166
|
+
!onUpdate && !repeatDelay && repeatType !== "mirror" && damping !== 0 && type !== "inertia";
|
|
2167
|
+
}
|
|
2168
|
+
|
|
2169
|
+
// node_modules/motion-dom/dist/es/animation/AsyncMotionValueAnimation.mjs
|
|
2170
|
+
var MAX_RESOLVE_DELAY = 40;
|
|
2171
|
+
var AsyncMotionValueAnimation = class extends WithPromise {
|
|
2172
|
+
constructor({ autoplay = true, delay = 0, type = "keyframes", repeat = 0, repeatDelay = 0, repeatType = "loop", keyframes: keyframes2, name, motionValue: motionValue2, element, ...options }) {
|
|
2173
|
+
super();
|
|
2174
|
+
this.stop = () => {
|
|
2175
|
+
if (this._animation) {
|
|
2176
|
+
this._animation.stop();
|
|
2177
|
+
this.stopTimeline?.();
|
|
2178
|
+
}
|
|
2179
|
+
this.keyframeResolver?.cancel();
|
|
2180
|
+
};
|
|
2181
|
+
this.createdAt = time.now();
|
|
2182
|
+
const optionsWithDefaults = {
|
|
2183
|
+
autoplay,
|
|
2184
|
+
delay,
|
|
2185
|
+
type,
|
|
2186
|
+
repeat,
|
|
2187
|
+
repeatDelay,
|
|
2188
|
+
repeatType,
|
|
2189
|
+
name,
|
|
2190
|
+
motionValue: motionValue2,
|
|
2191
|
+
element,
|
|
2192
|
+
...options
|
|
2193
|
+
};
|
|
2194
|
+
const KeyframeResolver$1 = element?.KeyframeResolver || KeyframeResolver;
|
|
2195
|
+
this.keyframeResolver = new KeyframeResolver$1(keyframes2, (resolvedKeyframes, finalKeyframe, forced) => this.onKeyframesResolved(resolvedKeyframes, finalKeyframe, optionsWithDefaults, !forced), name, motionValue2, element);
|
|
2196
|
+
this.keyframeResolver?.scheduleResolve();
|
|
2197
|
+
}
|
|
2198
|
+
onKeyframesResolved(keyframes2, finalKeyframe, options, sync) {
|
|
2199
|
+
this.keyframeResolver = void 0;
|
|
2200
|
+
const { name, type, velocity, delay, isHandoff, onUpdate } = options;
|
|
2201
|
+
this.resolvedAt = time.now();
|
|
2202
|
+
if (!canAnimate(keyframes2, name, type, velocity)) {
|
|
2203
|
+
if (MotionGlobalConfig.instantAnimations || !delay) {
|
|
2204
|
+
onUpdate?.(getFinalKeyframe(keyframes2, options, finalKeyframe));
|
|
2205
|
+
}
|
|
2206
|
+
keyframes2[0] = keyframes2[keyframes2.length - 1];
|
|
2207
|
+
makeAnimationInstant(options);
|
|
2208
|
+
options.repeat = 0;
|
|
2209
|
+
}
|
|
2210
|
+
const startTime = sync ? !this.resolvedAt ? this.createdAt : this.resolvedAt - this.createdAt > MAX_RESOLVE_DELAY ? this.resolvedAt : this.createdAt : void 0;
|
|
2211
|
+
const resolvedOptions = {
|
|
2212
|
+
startTime,
|
|
2213
|
+
finalKeyframe,
|
|
2214
|
+
...options,
|
|
2215
|
+
keyframes: keyframes2
|
|
2216
|
+
};
|
|
2217
|
+
const useWaapi = !isHandoff && supportsBrowserAnimation(resolvedOptions);
|
|
2218
|
+
const element = resolvedOptions.motionValue?.owner?.current;
|
|
2219
|
+
const animation = useWaapi ? new NativeAnimationExtended({
|
|
2220
|
+
...resolvedOptions,
|
|
2221
|
+
element
|
|
2222
|
+
}) : new JSAnimation(resolvedOptions);
|
|
2223
|
+
animation.finished.then(() => {
|
|
2224
|
+
this.notifyFinished();
|
|
2225
|
+
}).catch(noop);
|
|
2226
|
+
if (this.pendingTimeline) {
|
|
2227
|
+
this.stopTimeline = animation.attachTimeline(this.pendingTimeline);
|
|
2228
|
+
this.pendingTimeline = void 0;
|
|
2229
|
+
}
|
|
2230
|
+
this._animation = animation;
|
|
2231
|
+
}
|
|
2232
|
+
get finished() {
|
|
2233
|
+
if (!this._animation) {
|
|
2234
|
+
return this._finished;
|
|
2235
|
+
} else {
|
|
2236
|
+
return this.animation.finished;
|
|
2237
|
+
}
|
|
2238
|
+
}
|
|
2239
|
+
then(onResolve, _onReject) {
|
|
2240
|
+
return this.finished.finally(onResolve).then(() => {
|
|
2241
|
+
});
|
|
2242
|
+
}
|
|
2243
|
+
get animation() {
|
|
2244
|
+
if (!this._animation) {
|
|
2245
|
+
this.keyframeResolver?.resume();
|
|
2246
|
+
flushKeyframeResolvers();
|
|
2247
|
+
}
|
|
2248
|
+
return this._animation;
|
|
2249
|
+
}
|
|
2250
|
+
get duration() {
|
|
2251
|
+
return this.animation.duration;
|
|
2252
|
+
}
|
|
2253
|
+
get iterationDuration() {
|
|
2254
|
+
return this.animation.iterationDuration;
|
|
2255
|
+
}
|
|
2256
|
+
get time() {
|
|
2257
|
+
return this.animation.time;
|
|
2258
|
+
}
|
|
2259
|
+
set time(newTime) {
|
|
2260
|
+
this.animation.time = newTime;
|
|
2261
|
+
}
|
|
2262
|
+
get speed() {
|
|
2263
|
+
return this.animation.speed;
|
|
2264
|
+
}
|
|
2265
|
+
get state() {
|
|
2266
|
+
return this.animation.state;
|
|
2267
|
+
}
|
|
2268
|
+
set speed(newSpeed) {
|
|
2269
|
+
this.animation.speed = newSpeed;
|
|
2270
|
+
}
|
|
2271
|
+
get startTime() {
|
|
2272
|
+
return this.animation.startTime;
|
|
2273
|
+
}
|
|
2274
|
+
attachTimeline(timeline) {
|
|
2275
|
+
if (this._animation) {
|
|
2276
|
+
this.stopTimeline = this.animation.attachTimeline(timeline);
|
|
2277
|
+
} else {
|
|
2278
|
+
this.pendingTimeline = timeline;
|
|
2279
|
+
}
|
|
2280
|
+
return () => this.stop();
|
|
2281
|
+
}
|
|
2282
|
+
play() {
|
|
2283
|
+
this.animation.play();
|
|
2284
|
+
}
|
|
2285
|
+
pause() {
|
|
2286
|
+
this.animation.pause();
|
|
2287
|
+
}
|
|
2288
|
+
complete() {
|
|
2289
|
+
this.animation.complete();
|
|
2290
|
+
}
|
|
2291
|
+
cancel() {
|
|
2292
|
+
if (this._animation) {
|
|
2293
|
+
this.animation.cancel();
|
|
2294
|
+
}
|
|
2295
|
+
this.keyframeResolver?.cancel();
|
|
2296
|
+
}
|
|
2297
|
+
};
|
|
2298
|
+
|
|
2299
|
+
// node_modules/motion-dom/dist/es/animation/utils/calc-child-stagger.mjs
|
|
2300
|
+
function calcChildStagger(children, child, delayChildren, staggerChildren = 0, staggerDirection = 1) {
|
|
2301
|
+
const index = Array.from(children).sort((a, b) => a.sortNodePosition(b)).indexOf(child);
|
|
2302
|
+
const numChildren = children.size;
|
|
2303
|
+
const maxStaggerDuration = (numChildren - 1) * staggerChildren;
|
|
2304
|
+
const delayIsFunction = typeof delayChildren === "function";
|
|
2305
|
+
return delayIsFunction ? delayChildren(index, numChildren) : staggerDirection === 1 ? index * staggerChildren : maxStaggerDuration - index * staggerChildren;
|
|
2306
|
+
}
|
|
2307
|
+
|
|
2308
|
+
// node_modules/motion-dom/dist/es/animation/utils/default-transitions.mjs
|
|
2309
|
+
var underDampedSpring = {
|
|
2310
|
+
type: "spring",
|
|
2311
|
+
stiffness: 500,
|
|
2312
|
+
damping: 25,
|
|
2313
|
+
restSpeed: 10
|
|
2314
|
+
};
|
|
2315
|
+
var criticallyDampedSpring = (target) => ({
|
|
2316
|
+
type: "spring",
|
|
2317
|
+
stiffness: 550,
|
|
2318
|
+
damping: target === 0 ? 2 * Math.sqrt(550) : 30,
|
|
2319
|
+
restSpeed: 10
|
|
2320
|
+
});
|
|
2321
|
+
var keyframesTransition = {
|
|
2322
|
+
type: "keyframes",
|
|
2323
|
+
duration: 0.8
|
|
2324
|
+
};
|
|
2325
|
+
var ease = {
|
|
2326
|
+
type: "keyframes",
|
|
2327
|
+
ease: [0.25, 0.1, 0.35, 1],
|
|
2328
|
+
duration: 0.3
|
|
2329
|
+
};
|
|
2330
|
+
var getDefaultTransition = (valueKey, { keyframes: keyframes2 }) => {
|
|
2331
|
+
if (keyframes2.length > 2) {
|
|
2332
|
+
return keyframesTransition;
|
|
2333
|
+
} else if (transformProps.has(valueKey)) {
|
|
2334
|
+
return valueKey.startsWith("scale") ? criticallyDampedSpring(keyframes2[1]) : underDampedSpring;
|
|
2335
|
+
}
|
|
2336
|
+
return ease;
|
|
2337
|
+
};
|
|
2338
|
+
|
|
2339
|
+
// node_modules/motion-dom/dist/es/animation/utils/get-final-keyframe.mjs
|
|
2340
|
+
var isNotNull2 = (value) => value !== null;
|
|
2341
|
+
function getFinalKeyframe2(keyframes2, { repeat, repeatType = "loop" }, finalKeyframe) {
|
|
2342
|
+
const resolvedKeyframes = keyframes2.filter(isNotNull2);
|
|
2343
|
+
const index = repeat && repeatType !== "loop" && repeat % 2 === 1 ? 0 : resolvedKeyframes.length - 1;
|
|
2344
|
+
return !index || finalKeyframe === void 0 ? resolvedKeyframes[index] : finalKeyframe;
|
|
2345
|
+
}
|
|
2346
|
+
|
|
2347
|
+
// node_modules/motion-dom/dist/es/animation/utils/get-value-transition.mjs
|
|
2348
|
+
function getValueTransition(transition, key) {
|
|
2349
|
+
return transition?.[key] ?? transition?.["default"] ?? transition;
|
|
2350
|
+
}
|
|
2351
|
+
|
|
2352
|
+
// node_modules/motion-dom/dist/es/animation/utils/is-transition-defined.mjs
|
|
2353
|
+
function isTransitionDefined({ when, delay: _delay, delayChildren, staggerChildren, staggerDirection, repeat, repeatType, repeatDelay, from, elapsed, ...transition }) {
|
|
2354
|
+
return !!Object.keys(transition).length;
|
|
2355
|
+
}
|
|
2356
|
+
|
|
2357
|
+
// node_modules/motion-dom/dist/es/animation/interfaces/motion-value.mjs
|
|
2358
|
+
var animateMotionValue = (name, value, target, transition = {}, element, isHandoff) => (onComplete) => {
|
|
2359
|
+
const valueTransition = getValueTransition(transition, name) || {};
|
|
2360
|
+
const delay = valueTransition.delay || transition.delay || 0;
|
|
2361
|
+
let { elapsed = 0 } = transition;
|
|
2362
|
+
elapsed = elapsed - secondsToMilliseconds(delay);
|
|
2363
|
+
const options = {
|
|
2364
|
+
keyframes: Array.isArray(target) ? target : [null, target],
|
|
2365
|
+
ease: "easeOut",
|
|
2366
|
+
velocity: value.getVelocity(),
|
|
2367
|
+
...valueTransition,
|
|
2368
|
+
delay: -elapsed,
|
|
2369
|
+
onUpdate: (v) => {
|
|
2370
|
+
value.set(v);
|
|
2371
|
+
valueTransition.onUpdate && valueTransition.onUpdate(v);
|
|
2372
|
+
},
|
|
2373
|
+
onComplete: () => {
|
|
2374
|
+
onComplete();
|
|
2375
|
+
valueTransition.onComplete && valueTransition.onComplete();
|
|
2376
|
+
},
|
|
2377
|
+
name,
|
|
2378
|
+
motionValue: value,
|
|
2379
|
+
element: isHandoff ? void 0 : element
|
|
2380
|
+
};
|
|
2381
|
+
if (!isTransitionDefined(valueTransition)) {
|
|
2382
|
+
Object.assign(options, getDefaultTransition(name, options));
|
|
2383
|
+
}
|
|
2384
|
+
options.duration && (options.duration = secondsToMilliseconds(options.duration));
|
|
2385
|
+
options.repeatDelay && (options.repeatDelay = secondsToMilliseconds(options.repeatDelay));
|
|
2386
|
+
if (options.from !== void 0) {
|
|
2387
|
+
options.keyframes[0] = options.from;
|
|
2388
|
+
}
|
|
2389
|
+
let shouldSkip = false;
|
|
2390
|
+
if (options.type === false || options.duration === 0 && !options.repeatDelay) {
|
|
2391
|
+
makeAnimationInstant(options);
|
|
2392
|
+
if (options.delay === 0) {
|
|
2393
|
+
shouldSkip = true;
|
|
2394
|
+
}
|
|
2395
|
+
}
|
|
2396
|
+
if (MotionGlobalConfig.instantAnimations || MotionGlobalConfig.skipAnimations) {
|
|
2397
|
+
shouldSkip = true;
|
|
2398
|
+
makeAnimationInstant(options);
|
|
2399
|
+
options.delay = 0;
|
|
2400
|
+
}
|
|
2401
|
+
options.allowFlatten = !valueTransition.type && !valueTransition.ease;
|
|
2402
|
+
if (shouldSkip && !isHandoff && value.get() !== void 0) {
|
|
2403
|
+
const finalKeyframe = getFinalKeyframe2(options.keyframes, valueTransition);
|
|
2404
|
+
if (finalKeyframe !== void 0) {
|
|
2405
|
+
frame.update(() => {
|
|
2406
|
+
options.onUpdate(finalKeyframe);
|
|
2407
|
+
options.onComplete();
|
|
2408
|
+
});
|
|
2409
|
+
return;
|
|
2410
|
+
}
|
|
2411
|
+
}
|
|
2412
|
+
return valueTransition.isSync ? new JSAnimation(options) : new AsyncMotionValueAnimation(options);
|
|
2413
|
+
};
|
|
2414
|
+
|
|
2415
|
+
// node_modules/motion-dom/dist/es/render/utils/resolve-variants.mjs
|
|
2416
|
+
function getValueState(visualElement) {
|
|
2417
|
+
const state = [{}, {}];
|
|
2418
|
+
visualElement?.values.forEach((value, key) => {
|
|
2419
|
+
state[0][key] = value.get();
|
|
2420
|
+
state[1][key] = value.getVelocity();
|
|
2421
|
+
});
|
|
2422
|
+
return state;
|
|
2423
|
+
}
|
|
2424
|
+
function resolveVariantFromProps(props, definition, custom, visualElement) {
|
|
2425
|
+
if (typeof definition === "function") {
|
|
2426
|
+
const [current, velocity] = getValueState(visualElement);
|
|
2427
|
+
definition = definition(custom !== void 0 ? custom : props.custom, current, velocity);
|
|
2428
|
+
}
|
|
2429
|
+
if (typeof definition === "string") {
|
|
2430
|
+
definition = props.variants && props.variants[definition];
|
|
2431
|
+
}
|
|
2432
|
+
if (typeof definition === "function") {
|
|
2433
|
+
const [current, velocity] = getValueState(visualElement);
|
|
2434
|
+
definition = definition(custom !== void 0 ? custom : props.custom, current, velocity);
|
|
2435
|
+
}
|
|
2436
|
+
return definition;
|
|
2437
|
+
}
|
|
2438
|
+
|
|
2439
|
+
// node_modules/motion-dom/dist/es/render/utils/resolve-dynamic-variants.mjs
|
|
2440
|
+
function resolveVariant(visualElement, definition, custom) {
|
|
2441
|
+
const props = visualElement.getProps();
|
|
2442
|
+
return resolveVariantFromProps(props, definition, custom !== void 0 ? custom : props.custom, visualElement);
|
|
2443
|
+
}
|
|
2444
|
+
|
|
2445
|
+
// node_modules/motion-dom/dist/es/render/utils/keys-position.mjs
|
|
2446
|
+
var positionalKeys = /* @__PURE__ */ new Set([
|
|
2447
|
+
"width",
|
|
2448
|
+
"height",
|
|
2449
|
+
"top",
|
|
2450
|
+
"left",
|
|
2451
|
+
"right",
|
|
2452
|
+
"bottom",
|
|
2453
|
+
...transformPropOrder
|
|
2454
|
+
]);
|
|
2455
|
+
|
|
2456
|
+
// node_modules/motion-dom/dist/es/value/index.mjs
|
|
2457
|
+
var MAX_VELOCITY_DELTA = 30;
|
|
2458
|
+
var isFloat = (value) => {
|
|
2459
|
+
return !isNaN(parseFloat(value));
|
|
2460
|
+
};
|
|
2461
|
+
var collectMotionValues = {
|
|
2462
|
+
current: void 0
|
|
2463
|
+
};
|
|
2464
|
+
var MotionValue = class {
|
|
2465
|
+
/**
|
|
2466
|
+
* @param init - The initiating value
|
|
2467
|
+
* @param config - Optional configuration options
|
|
2468
|
+
*
|
|
2469
|
+
* - `transformer`: A function to transform incoming values with.
|
|
2470
|
+
*/
|
|
2471
|
+
constructor(init, options = {}) {
|
|
2472
|
+
this.canTrackVelocity = null;
|
|
2473
|
+
this.events = {};
|
|
2474
|
+
this.updateAndNotify = (v) => {
|
|
2475
|
+
const currentTime = time.now();
|
|
2476
|
+
if (this.updatedAt !== currentTime) {
|
|
2477
|
+
this.setPrevFrameValue();
|
|
2478
|
+
}
|
|
2479
|
+
this.prev = this.current;
|
|
2480
|
+
this.setCurrent(v);
|
|
2481
|
+
if (this.current !== this.prev) {
|
|
2482
|
+
this.events.change?.notify(this.current);
|
|
2483
|
+
if (this.dependents) {
|
|
2484
|
+
for (const dependent of this.dependents) {
|
|
2485
|
+
dependent.dirty();
|
|
2486
|
+
}
|
|
2487
|
+
}
|
|
2488
|
+
}
|
|
2489
|
+
};
|
|
2490
|
+
this.hasAnimated = false;
|
|
2491
|
+
this.setCurrent(init);
|
|
2492
|
+
this.owner = options.owner;
|
|
2493
|
+
}
|
|
2494
|
+
setCurrent(current) {
|
|
2495
|
+
this.current = current;
|
|
2496
|
+
this.updatedAt = time.now();
|
|
2497
|
+
if (this.canTrackVelocity === null && current !== void 0) {
|
|
2498
|
+
this.canTrackVelocity = isFloat(this.current);
|
|
2499
|
+
}
|
|
2500
|
+
}
|
|
2501
|
+
setPrevFrameValue(prevFrameValue = this.current) {
|
|
2502
|
+
this.prevFrameValue = prevFrameValue;
|
|
2503
|
+
this.prevUpdatedAt = this.updatedAt;
|
|
2504
|
+
}
|
|
2505
|
+
/**
|
|
2506
|
+
* Adds a function that will be notified when the `MotionValue` is updated.
|
|
2507
|
+
*
|
|
2508
|
+
* It returns a function that, when called, will cancel the subscription.
|
|
2509
|
+
*
|
|
2510
|
+
* When calling `onChange` inside a React component, it should be wrapped with the
|
|
2511
|
+
* `useEffect` hook. As it returns an unsubscribe function, this should be returned
|
|
2512
|
+
* from the `useEffect` function to ensure you don't add duplicate subscribers..
|
|
2513
|
+
*
|
|
2514
|
+
* ```jsx
|
|
2515
|
+
* export const MyComponent = () => {
|
|
2516
|
+
* const x = useMotionValue(0)
|
|
2517
|
+
* const y = useMotionValue(0)
|
|
2518
|
+
* const opacity = useMotionValue(1)
|
|
2519
|
+
*
|
|
2520
|
+
* useEffect(() => {
|
|
2521
|
+
* function updateOpacity() {
|
|
2522
|
+
* const maxXY = Math.max(x.get(), y.get())
|
|
2523
|
+
* const newOpacity = transform(maxXY, [0, 100], [1, 0])
|
|
2524
|
+
* opacity.set(newOpacity)
|
|
2525
|
+
* }
|
|
2526
|
+
*
|
|
2527
|
+
* const unsubscribeX = x.on("change", updateOpacity)
|
|
2528
|
+
* const unsubscribeY = y.on("change", updateOpacity)
|
|
2529
|
+
*
|
|
2530
|
+
* return () => {
|
|
2531
|
+
* unsubscribeX()
|
|
2532
|
+
* unsubscribeY()
|
|
2533
|
+
* }
|
|
2534
|
+
* }, [])
|
|
2535
|
+
*
|
|
2536
|
+
* return <motion.div style={{ x }} />
|
|
2537
|
+
* }
|
|
2538
|
+
* ```
|
|
2539
|
+
*
|
|
2540
|
+
* @param subscriber - A function that receives the latest value.
|
|
2541
|
+
* @returns A function that, when called, will cancel this subscription.
|
|
2542
|
+
*
|
|
2543
|
+
* @deprecated
|
|
2544
|
+
*/
|
|
2545
|
+
onChange(subscription) {
|
|
2546
|
+
if (process.env.NODE_ENV !== "production") {
|
|
2547
|
+
warnOnce(false, `value.onChange(callback) is deprecated. Switch to value.on("change", callback).`);
|
|
2548
|
+
}
|
|
2549
|
+
return this.on("change", subscription);
|
|
2550
|
+
}
|
|
2551
|
+
on(eventName, callback) {
|
|
2552
|
+
if (!this.events[eventName]) {
|
|
2553
|
+
this.events[eventName] = new SubscriptionManager();
|
|
2554
|
+
}
|
|
2555
|
+
const unsubscribe = this.events[eventName].add(callback);
|
|
2556
|
+
if (eventName === "change") {
|
|
2557
|
+
return () => {
|
|
2558
|
+
unsubscribe();
|
|
2559
|
+
frame.read(() => {
|
|
2560
|
+
if (!this.events.change.getSize()) {
|
|
2561
|
+
this.stop();
|
|
2562
|
+
}
|
|
2563
|
+
});
|
|
2564
|
+
};
|
|
2565
|
+
}
|
|
2566
|
+
return unsubscribe;
|
|
2567
|
+
}
|
|
2568
|
+
clearListeners() {
|
|
2569
|
+
for (const eventManagers in this.events) {
|
|
2570
|
+
this.events[eventManagers].clear();
|
|
2571
|
+
}
|
|
2572
|
+
}
|
|
2573
|
+
/**
|
|
2574
|
+
* Attaches a passive effect to the `MotionValue`.
|
|
2575
|
+
*/
|
|
2576
|
+
attach(passiveEffect, stopPassiveEffect) {
|
|
2577
|
+
this.passiveEffect = passiveEffect;
|
|
2578
|
+
this.stopPassiveEffect = stopPassiveEffect;
|
|
2579
|
+
}
|
|
2580
|
+
/**
|
|
2581
|
+
* Sets the state of the `MotionValue`.
|
|
2582
|
+
*
|
|
2583
|
+
* @remarks
|
|
2584
|
+
*
|
|
2585
|
+
* ```jsx
|
|
2586
|
+
* const x = useMotionValue(0)
|
|
2587
|
+
* x.set(10)
|
|
2588
|
+
* ```
|
|
2589
|
+
*
|
|
2590
|
+
* @param latest - Latest value to set.
|
|
2591
|
+
* @param render - Whether to notify render subscribers. Defaults to `true`
|
|
2592
|
+
*
|
|
2593
|
+
* @public
|
|
2594
|
+
*/
|
|
2595
|
+
set(v) {
|
|
2596
|
+
if (!this.passiveEffect) {
|
|
2597
|
+
this.updateAndNotify(v);
|
|
2598
|
+
} else {
|
|
2599
|
+
this.passiveEffect(v, this.updateAndNotify);
|
|
2600
|
+
}
|
|
2601
|
+
}
|
|
2602
|
+
setWithVelocity(prev, current, delta) {
|
|
2603
|
+
this.set(current);
|
|
2604
|
+
this.prev = void 0;
|
|
2605
|
+
this.prevFrameValue = prev;
|
|
2606
|
+
this.prevUpdatedAt = this.updatedAt - delta;
|
|
2607
|
+
}
|
|
2608
|
+
/**
|
|
2609
|
+
* Set the state of the `MotionValue`, stopping any active animations,
|
|
2610
|
+
* effects, and resets velocity to `0`.
|
|
2611
|
+
*/
|
|
2612
|
+
jump(v, endAnimation = true) {
|
|
2613
|
+
this.updateAndNotify(v);
|
|
2614
|
+
this.prev = v;
|
|
2615
|
+
this.prevUpdatedAt = this.prevFrameValue = void 0;
|
|
2616
|
+
endAnimation && this.stop();
|
|
2617
|
+
if (this.stopPassiveEffect)
|
|
2618
|
+
this.stopPassiveEffect();
|
|
2619
|
+
}
|
|
2620
|
+
dirty() {
|
|
2621
|
+
this.events.change?.notify(this.current);
|
|
2622
|
+
}
|
|
2623
|
+
addDependent(dependent) {
|
|
2624
|
+
if (!this.dependents) {
|
|
2625
|
+
this.dependents = /* @__PURE__ */ new Set();
|
|
2626
|
+
}
|
|
2627
|
+
this.dependents.add(dependent);
|
|
2628
|
+
}
|
|
2629
|
+
removeDependent(dependent) {
|
|
2630
|
+
if (this.dependents) {
|
|
2631
|
+
this.dependents.delete(dependent);
|
|
2632
|
+
}
|
|
2633
|
+
}
|
|
2634
|
+
/**
|
|
2635
|
+
* Returns the latest state of `MotionValue`
|
|
2636
|
+
*
|
|
2637
|
+
* @returns - The latest state of `MotionValue`
|
|
2638
|
+
*
|
|
2639
|
+
* @public
|
|
2640
|
+
*/
|
|
2641
|
+
get() {
|
|
2642
|
+
if (collectMotionValues.current) {
|
|
2643
|
+
collectMotionValues.current.push(this);
|
|
2644
|
+
}
|
|
2645
|
+
return this.current;
|
|
2646
|
+
}
|
|
2647
|
+
/**
|
|
2648
|
+
* @public
|
|
2649
|
+
*/
|
|
2650
|
+
getPrevious() {
|
|
2651
|
+
return this.prev;
|
|
2652
|
+
}
|
|
2653
|
+
/**
|
|
2654
|
+
* Returns the latest velocity of `MotionValue`
|
|
2655
|
+
*
|
|
2656
|
+
* @returns - The latest velocity of `MotionValue`. Returns `0` if the state is non-numerical.
|
|
2657
|
+
*
|
|
2658
|
+
* @public
|
|
2659
|
+
*/
|
|
2660
|
+
getVelocity() {
|
|
2661
|
+
const currentTime = time.now();
|
|
2662
|
+
if (!this.canTrackVelocity || this.prevFrameValue === void 0 || currentTime - this.updatedAt > MAX_VELOCITY_DELTA) {
|
|
2663
|
+
return 0;
|
|
2664
|
+
}
|
|
2665
|
+
const delta = Math.min(this.updatedAt - this.prevUpdatedAt, MAX_VELOCITY_DELTA);
|
|
2666
|
+
return velocityPerSecond(parseFloat(this.current) - parseFloat(this.prevFrameValue), delta);
|
|
2667
|
+
}
|
|
2668
|
+
/**
|
|
2669
|
+
* Registers a new animation to control this `MotionValue`. Only one
|
|
2670
|
+
* animation can drive a `MotionValue` at one time.
|
|
2671
|
+
*
|
|
2672
|
+
* ```jsx
|
|
2673
|
+
* value.start()
|
|
2674
|
+
* ```
|
|
2675
|
+
*
|
|
2676
|
+
* @param animation - A function that starts the provided animation
|
|
2677
|
+
*/
|
|
2678
|
+
start(startAnimation) {
|
|
2679
|
+
this.stop();
|
|
2680
|
+
return new Promise((resolve) => {
|
|
2681
|
+
this.hasAnimated = true;
|
|
2682
|
+
this.animation = startAnimation(resolve);
|
|
2683
|
+
if (this.events.animationStart) {
|
|
2684
|
+
this.events.animationStart.notify();
|
|
2685
|
+
}
|
|
2686
|
+
}).then(() => {
|
|
2687
|
+
if (this.events.animationComplete) {
|
|
2688
|
+
this.events.animationComplete.notify();
|
|
2689
|
+
}
|
|
2690
|
+
this.clearAnimation();
|
|
2691
|
+
});
|
|
2692
|
+
}
|
|
2693
|
+
/**
|
|
2694
|
+
* Stop the currently active animation.
|
|
2695
|
+
*
|
|
2696
|
+
* @public
|
|
2697
|
+
*/
|
|
2698
|
+
stop() {
|
|
2699
|
+
if (this.animation) {
|
|
2700
|
+
this.animation.stop();
|
|
2701
|
+
if (this.events.animationCancel) {
|
|
2702
|
+
this.events.animationCancel.notify();
|
|
2703
|
+
}
|
|
2704
|
+
}
|
|
2705
|
+
this.clearAnimation();
|
|
2706
|
+
}
|
|
2707
|
+
/**
|
|
2708
|
+
* Returns `true` if this value is currently animating.
|
|
2709
|
+
*
|
|
2710
|
+
* @public
|
|
2711
|
+
*/
|
|
2712
|
+
isAnimating() {
|
|
2713
|
+
return !!this.animation;
|
|
2714
|
+
}
|
|
2715
|
+
clearAnimation() {
|
|
2716
|
+
delete this.animation;
|
|
2717
|
+
}
|
|
2718
|
+
/**
|
|
2719
|
+
* Destroy and clean up subscribers to this `MotionValue`.
|
|
2720
|
+
*
|
|
2721
|
+
* The `MotionValue` hooks like `useMotionValue` and `useTransform` automatically
|
|
2722
|
+
* handle the lifecycle of the returned `MotionValue`, so this method is only necessary if you've manually
|
|
2723
|
+
* created a `MotionValue` via the `motionValue` function.
|
|
2724
|
+
*
|
|
2725
|
+
* @public
|
|
2726
|
+
*/
|
|
2727
|
+
destroy() {
|
|
2728
|
+
this.dependents?.clear();
|
|
2729
|
+
this.events.destroy?.notify();
|
|
2730
|
+
this.clearListeners();
|
|
2731
|
+
this.stop();
|
|
2732
|
+
if (this.stopPassiveEffect) {
|
|
2733
|
+
this.stopPassiveEffect();
|
|
2734
|
+
}
|
|
2735
|
+
}
|
|
2736
|
+
};
|
|
2737
|
+
function motionValue(init, options) {
|
|
2738
|
+
return new MotionValue(init, options);
|
|
2739
|
+
}
|
|
2740
|
+
|
|
2741
|
+
// node_modules/motion-dom/dist/es/render/utils/is-keyframes-target.mjs
|
|
2742
|
+
var isKeyframesTarget = (v) => {
|
|
2743
|
+
return Array.isArray(v);
|
|
2744
|
+
};
|
|
2745
|
+
|
|
2746
|
+
// node_modules/motion-dom/dist/es/render/utils/setters.mjs
|
|
2747
|
+
function setMotionValue(visualElement, key, value) {
|
|
2748
|
+
if (visualElement.hasValue(key)) {
|
|
2749
|
+
visualElement.getValue(key).set(value);
|
|
2750
|
+
} else {
|
|
2751
|
+
visualElement.addValue(key, motionValue(value));
|
|
2752
|
+
}
|
|
2753
|
+
}
|
|
2754
|
+
function resolveFinalValueInKeyframes(v) {
|
|
2755
|
+
return isKeyframesTarget(v) ? v[v.length - 1] || 0 : v;
|
|
2756
|
+
}
|
|
2757
|
+
function setTarget(visualElement, definition) {
|
|
2758
|
+
const resolved = resolveVariant(visualElement, definition);
|
|
2759
|
+
let { transitionEnd = {}, transition = {}, ...target } = resolved || {};
|
|
2760
|
+
target = { ...target, ...transitionEnd };
|
|
2761
|
+
for (const key in target) {
|
|
2762
|
+
const value = resolveFinalValueInKeyframes(target[key]);
|
|
2763
|
+
setMotionValue(visualElement, key, value);
|
|
2764
|
+
}
|
|
2765
|
+
}
|
|
2766
|
+
|
|
2767
|
+
// node_modules/motion-dom/dist/es/value/utils/is-motion-value.mjs
|
|
2768
|
+
var isMotionValue = (value) => Boolean(value && value.getVelocity);
|
|
2769
|
+
|
|
2770
|
+
// node_modules/motion-dom/dist/es/value/will-change/is.mjs
|
|
2771
|
+
function isWillChangeMotionValue(value) {
|
|
2772
|
+
return Boolean(isMotionValue(value) && value.add);
|
|
2773
|
+
}
|
|
2774
|
+
|
|
2775
|
+
// node_modules/motion-dom/dist/es/value/will-change/add-will-change.mjs
|
|
2776
|
+
function addValueToWillChange(visualElement, key) {
|
|
2777
|
+
const willChange = visualElement.getValue("willChange");
|
|
2778
|
+
if (isWillChangeMotionValue(willChange)) {
|
|
2779
|
+
return willChange.add(key);
|
|
2780
|
+
} else if (!willChange && MotionGlobalConfig.WillChange) {
|
|
2781
|
+
const newWillChange = new MotionGlobalConfig.WillChange("auto");
|
|
2782
|
+
visualElement.addValue("willChange", newWillChange);
|
|
2783
|
+
newWillChange.add(key);
|
|
2784
|
+
}
|
|
2785
|
+
}
|
|
2786
|
+
|
|
2787
|
+
// node_modules/motion-dom/dist/es/render/dom/utils/camel-to-dash.mjs
|
|
2788
|
+
function camelToDash(str) {
|
|
2789
|
+
return str.replace(/([A-Z])/g, (match) => `-${match.toLowerCase()}`);
|
|
2790
|
+
}
|
|
2791
|
+
|
|
2792
|
+
// node_modules/motion-dom/dist/es/animation/optimized-appear/data-id.mjs
|
|
2793
|
+
var optimizedAppearDataId = "framerAppearId";
|
|
2794
|
+
var optimizedAppearDataAttribute = "data-" + camelToDash(optimizedAppearDataId);
|
|
2795
|
+
|
|
2796
|
+
// node_modules/motion-dom/dist/es/animation/optimized-appear/get-appear-id.mjs
|
|
2797
|
+
function getOptimisedAppearId(visualElement) {
|
|
2798
|
+
return visualElement.props[optimizedAppearDataAttribute];
|
|
2799
|
+
}
|
|
2800
|
+
|
|
2801
|
+
// node_modules/motion-dom/dist/es/animation/interfaces/visual-element-target.mjs
|
|
2802
|
+
function shouldBlockAnimation({ protectedKeys, needsAnimating }, key) {
|
|
2803
|
+
const shouldBlock = protectedKeys.hasOwnProperty(key) && needsAnimating[key] !== true;
|
|
2804
|
+
needsAnimating[key] = false;
|
|
2805
|
+
return shouldBlock;
|
|
2806
|
+
}
|
|
2807
|
+
function animateTarget(visualElement, targetAndTransition, { delay = 0, transitionOverride, type } = {}) {
|
|
2808
|
+
let { transition = visualElement.getDefaultTransition(), transitionEnd, ...target } = targetAndTransition;
|
|
2809
|
+
const reduceMotion = transition?.reduceMotion;
|
|
2810
|
+
if (transitionOverride)
|
|
2811
|
+
transition = transitionOverride;
|
|
2812
|
+
const animations = [];
|
|
2813
|
+
const animationTypeState = type && visualElement.animationState && visualElement.animationState.getState()[type];
|
|
2814
|
+
for (const key in target) {
|
|
2815
|
+
const value = visualElement.getValue(key, visualElement.latestValues[key] ?? null);
|
|
2816
|
+
const valueTarget = target[key];
|
|
2817
|
+
if (valueTarget === void 0 || animationTypeState && shouldBlockAnimation(animationTypeState, key)) {
|
|
2818
|
+
continue;
|
|
2819
|
+
}
|
|
2820
|
+
const valueTransition = {
|
|
2821
|
+
delay,
|
|
2822
|
+
...getValueTransition(transition || {}, key)
|
|
2823
|
+
};
|
|
2824
|
+
const currentValue = value.get();
|
|
2825
|
+
if (currentValue !== void 0 && !value.isAnimating && !Array.isArray(valueTarget) && valueTarget === currentValue && !valueTransition.velocity) {
|
|
2826
|
+
continue;
|
|
2827
|
+
}
|
|
2828
|
+
let isHandoff = false;
|
|
2829
|
+
if (window.MotionHandoffAnimation) {
|
|
2830
|
+
const appearId = getOptimisedAppearId(visualElement);
|
|
2831
|
+
if (appearId) {
|
|
2832
|
+
const startTime = window.MotionHandoffAnimation(appearId, key, frame);
|
|
2833
|
+
if (startTime !== null) {
|
|
2834
|
+
valueTransition.startTime = startTime;
|
|
2835
|
+
isHandoff = true;
|
|
2836
|
+
}
|
|
2837
|
+
}
|
|
2838
|
+
}
|
|
2839
|
+
addValueToWillChange(visualElement, key);
|
|
2840
|
+
const shouldReduceMotion = reduceMotion ?? visualElement.shouldReduceMotion;
|
|
2841
|
+
value.start(animateMotionValue(key, value, valueTarget, shouldReduceMotion && positionalKeys.has(key) ? { type: false } : valueTransition, visualElement, isHandoff));
|
|
2842
|
+
const animation = value.animation;
|
|
2843
|
+
if (animation) {
|
|
2844
|
+
animations.push(animation);
|
|
2845
|
+
}
|
|
2846
|
+
}
|
|
2847
|
+
if (transitionEnd) {
|
|
2848
|
+
Promise.all(animations).then(() => {
|
|
2849
|
+
frame.update(() => {
|
|
2850
|
+
transitionEnd && setTarget(visualElement, transitionEnd);
|
|
2851
|
+
});
|
|
2852
|
+
});
|
|
2853
|
+
}
|
|
2854
|
+
return animations;
|
|
2855
|
+
}
|
|
2856
|
+
|
|
2857
|
+
// node_modules/motion-dom/dist/es/animation/interfaces/visual-element-variant.mjs
|
|
2858
|
+
function animateVariant(visualElement, variant, options = {}) {
|
|
2859
|
+
const resolved = resolveVariant(visualElement, variant, options.type === "exit" ? visualElement.presenceContext?.custom : void 0);
|
|
2860
|
+
let { transition = visualElement.getDefaultTransition() || {} } = resolved || {};
|
|
2861
|
+
if (options.transitionOverride) {
|
|
2862
|
+
transition = options.transitionOverride;
|
|
2863
|
+
}
|
|
2864
|
+
const getAnimation = resolved ? () => Promise.all(animateTarget(visualElement, resolved, options)) : () => Promise.resolve();
|
|
2865
|
+
const getChildAnimations = visualElement.variantChildren && visualElement.variantChildren.size ? (forwardDelay = 0) => {
|
|
2866
|
+
const { delayChildren = 0, staggerChildren, staggerDirection } = transition;
|
|
2867
|
+
return animateChildren(visualElement, variant, forwardDelay, delayChildren, staggerChildren, staggerDirection, options);
|
|
2868
|
+
} : () => Promise.resolve();
|
|
2869
|
+
const { when } = transition;
|
|
2870
|
+
if (when) {
|
|
2871
|
+
const [first, last] = when === "beforeChildren" ? [getAnimation, getChildAnimations] : [getChildAnimations, getAnimation];
|
|
2872
|
+
return first().then(() => last());
|
|
2873
|
+
} else {
|
|
2874
|
+
return Promise.all([getAnimation(), getChildAnimations(options.delay)]);
|
|
2875
|
+
}
|
|
2876
|
+
}
|
|
2877
|
+
function animateChildren(visualElement, variant, delay = 0, delayChildren = 0, staggerChildren = 0, staggerDirection = 1, options) {
|
|
2878
|
+
const animations = [];
|
|
2879
|
+
for (const child of visualElement.variantChildren) {
|
|
2880
|
+
child.notify("AnimationStart", variant);
|
|
2881
|
+
animations.push(animateVariant(child, variant, {
|
|
2882
|
+
...options,
|
|
2883
|
+
delay: delay + (typeof delayChildren === "function" ? 0 : delayChildren) + calcChildStagger(visualElement.variantChildren, child, delayChildren, staggerChildren, staggerDirection)
|
|
2884
|
+
}).then(() => child.notify("AnimationComplete", variant)));
|
|
2885
|
+
}
|
|
2886
|
+
return Promise.all(animations);
|
|
2887
|
+
}
|
|
2888
|
+
|
|
2889
|
+
// node_modules/motion-dom/dist/es/animation/interfaces/visual-element.mjs
|
|
2890
|
+
function animateVisualElement(visualElement, definition, options = {}) {
|
|
2891
|
+
visualElement.notify("AnimationStart", definition);
|
|
2892
|
+
let animation;
|
|
2893
|
+
if (Array.isArray(definition)) {
|
|
2894
|
+
const animations = definition.map((variant) => animateVariant(visualElement, variant, options));
|
|
2895
|
+
animation = Promise.all(animations);
|
|
2896
|
+
} else if (typeof definition === "string") {
|
|
2897
|
+
animation = animateVariant(visualElement, definition, options);
|
|
2898
|
+
} else {
|
|
2899
|
+
const resolvedDefinition = typeof definition === "function" ? resolveVariant(visualElement, definition, options.custom) : definition;
|
|
2900
|
+
animation = Promise.all(animateTarget(visualElement, resolvedDefinition, options));
|
|
2901
|
+
}
|
|
2902
|
+
return animation.then(() => {
|
|
2903
|
+
visualElement.notify("AnimationComplete", definition);
|
|
2904
|
+
});
|
|
2905
|
+
}
|
|
2906
|
+
|
|
2907
|
+
// node_modules/motion-dom/dist/es/utils/resolve-elements.mjs
|
|
2908
|
+
function resolveElements(elementOrSelector, scope, selectorCache) {
|
|
2909
|
+
if (elementOrSelector == null) {
|
|
2910
|
+
return [];
|
|
2911
|
+
}
|
|
2912
|
+
if (elementOrSelector instanceof EventTarget) {
|
|
2913
|
+
return [elementOrSelector];
|
|
2914
|
+
} else if (typeof elementOrSelector === "string") {
|
|
2915
|
+
let root = document;
|
|
2916
|
+
if (scope) {
|
|
2917
|
+
root = scope.current;
|
|
2918
|
+
}
|
|
2919
|
+
const elements = selectorCache?.[elementOrSelector] ?? root.querySelectorAll(elementOrSelector);
|
|
2920
|
+
return elements ? Array.from(elements) : [];
|
|
2921
|
+
}
|
|
2922
|
+
return Array.from(elementOrSelector).filter((element) => element != null);
|
|
2923
|
+
}
|
|
2924
|
+
|
|
2925
|
+
// node_modules/motion-dom/dist/es/utils/is-html-element.mjs
|
|
2926
|
+
function isHTMLElement(element) {
|
|
2927
|
+
return isObject(element) && "offsetHeight" in element;
|
|
2928
|
+
}
|
|
2929
|
+
|
|
2930
|
+
// node_modules/motion-dom/dist/es/utils/is-svg-element.mjs
|
|
2931
|
+
function isSVGElement(element) {
|
|
2932
|
+
return isObject(element) && "ownerSVGElement" in element;
|
|
2933
|
+
}
|
|
2934
|
+
|
|
2935
|
+
// node_modules/motion-dom/dist/es/resize/handle-element.mjs
|
|
2936
|
+
var resizeHandlers = /* @__PURE__ */ new WeakMap();
|
|
2937
|
+
var observer;
|
|
2938
|
+
var getSize = (borderBoxAxis, svgAxis, htmlAxis) => (target, borderBoxSize) => {
|
|
2939
|
+
if (borderBoxSize && borderBoxSize[0]) {
|
|
2940
|
+
return borderBoxSize[0][borderBoxAxis + "Size"];
|
|
2941
|
+
} else if (isSVGElement(target) && "getBBox" in target) {
|
|
2942
|
+
return target.getBBox()[svgAxis];
|
|
2943
|
+
} else {
|
|
2944
|
+
return target[htmlAxis];
|
|
2945
|
+
}
|
|
2946
|
+
};
|
|
2947
|
+
var getWidth = /* @__PURE__ */ getSize("inline", "width", "offsetWidth");
|
|
2948
|
+
var getHeight = /* @__PURE__ */ getSize("block", "height", "offsetHeight");
|
|
2949
|
+
function notifyTarget({ target, borderBoxSize }) {
|
|
2950
|
+
resizeHandlers.get(target)?.forEach((handler) => {
|
|
2951
|
+
handler(target, {
|
|
2952
|
+
get width() {
|
|
2953
|
+
return getWidth(target, borderBoxSize);
|
|
2954
|
+
},
|
|
2955
|
+
get height() {
|
|
2956
|
+
return getHeight(target, borderBoxSize);
|
|
2957
|
+
}
|
|
2958
|
+
});
|
|
2959
|
+
});
|
|
2960
|
+
}
|
|
2961
|
+
function notifyAll(entries) {
|
|
2962
|
+
entries.forEach(notifyTarget);
|
|
2963
|
+
}
|
|
2964
|
+
function createResizeObserver() {
|
|
2965
|
+
if (typeof ResizeObserver === "undefined")
|
|
2966
|
+
return;
|
|
2967
|
+
observer = new ResizeObserver(notifyAll);
|
|
2968
|
+
}
|
|
2969
|
+
function resizeElement(target, handler) {
|
|
2970
|
+
if (!observer)
|
|
2971
|
+
createResizeObserver();
|
|
2972
|
+
const elements = resolveElements(target);
|
|
2973
|
+
elements.forEach((element) => {
|
|
2974
|
+
let elementHandlers = resizeHandlers.get(element);
|
|
2975
|
+
if (!elementHandlers) {
|
|
2976
|
+
elementHandlers = /* @__PURE__ */ new Set();
|
|
2977
|
+
resizeHandlers.set(element, elementHandlers);
|
|
2978
|
+
}
|
|
2979
|
+
elementHandlers.add(handler);
|
|
2980
|
+
observer?.observe(element);
|
|
2981
|
+
});
|
|
2982
|
+
return () => {
|
|
2983
|
+
elements.forEach((element) => {
|
|
2984
|
+
const elementHandlers = resizeHandlers.get(element);
|
|
2985
|
+
elementHandlers?.delete(handler);
|
|
2986
|
+
if (!elementHandlers?.size) {
|
|
2987
|
+
observer?.unobserve(element);
|
|
2988
|
+
}
|
|
2989
|
+
});
|
|
2990
|
+
};
|
|
2991
|
+
}
|
|
2992
|
+
|
|
2993
|
+
// node_modules/motion-dom/dist/es/resize/handle-window.mjs
|
|
2994
|
+
var windowCallbacks = /* @__PURE__ */ new Set();
|
|
2995
|
+
var windowResizeHandler;
|
|
2996
|
+
function createWindowResizeHandler() {
|
|
2997
|
+
windowResizeHandler = () => {
|
|
2998
|
+
const info = {
|
|
2999
|
+
get width() {
|
|
3000
|
+
return window.innerWidth;
|
|
3001
|
+
},
|
|
3002
|
+
get height() {
|
|
3003
|
+
return window.innerHeight;
|
|
3004
|
+
}
|
|
3005
|
+
};
|
|
3006
|
+
windowCallbacks.forEach((callback) => callback(info));
|
|
3007
|
+
};
|
|
3008
|
+
window.addEventListener("resize", windowResizeHandler);
|
|
3009
|
+
}
|
|
3010
|
+
function resizeWindow(callback) {
|
|
3011
|
+
windowCallbacks.add(callback);
|
|
3012
|
+
if (!windowResizeHandler)
|
|
3013
|
+
createWindowResizeHandler();
|
|
3014
|
+
return () => {
|
|
3015
|
+
windowCallbacks.delete(callback);
|
|
3016
|
+
if (!windowCallbacks.size && typeof windowResizeHandler === "function") {
|
|
3017
|
+
window.removeEventListener("resize", windowResizeHandler);
|
|
3018
|
+
windowResizeHandler = void 0;
|
|
3019
|
+
}
|
|
3020
|
+
};
|
|
3021
|
+
}
|
|
3022
|
+
|
|
3023
|
+
// node_modules/motion-dom/dist/es/resize/index.mjs
|
|
3024
|
+
function resize(a, b) {
|
|
3025
|
+
return typeof a === "function" ? resizeWindow(a) : resizeElement(a, b);
|
|
3026
|
+
}
|
|
3027
|
+
|
|
3028
|
+
// node_modules/motion-dom/dist/es/scroll/observe.mjs
|
|
3029
|
+
function observeTimeline(update, timeline) {
|
|
3030
|
+
let prevProgress;
|
|
3031
|
+
const onFrame = () => {
|
|
3032
|
+
const { currentTime } = timeline;
|
|
3033
|
+
const percentage = currentTime === null ? 0 : currentTime.value;
|
|
3034
|
+
const progress2 = percentage / 100;
|
|
3035
|
+
if (prevProgress !== progress2) {
|
|
3036
|
+
update(progress2);
|
|
3037
|
+
}
|
|
3038
|
+
prevProgress = progress2;
|
|
3039
|
+
};
|
|
3040
|
+
frame.preUpdate(onFrame, true);
|
|
3041
|
+
return () => cancelFrame(onFrame);
|
|
3042
|
+
}
|
|
3043
|
+
|
|
3044
|
+
// node_modules/motion-dom/dist/es/utils/transform.mjs
|
|
3045
|
+
function transform(...args) {
|
|
3046
|
+
const useImmediate = !Array.isArray(args[0]);
|
|
3047
|
+
const argOffset = useImmediate ? 0 : -1;
|
|
3048
|
+
const inputValue = args[0 + argOffset];
|
|
3049
|
+
const inputRange = args[1 + argOffset];
|
|
3050
|
+
const outputRange = args[2 + argOffset];
|
|
3051
|
+
const options = args[3 + argOffset];
|
|
3052
|
+
const interpolator = interpolate(inputRange, outputRange, options);
|
|
3053
|
+
return useImmediate ? interpolator(inputValue) : interpolator;
|
|
3054
|
+
}
|
|
3055
|
+
|
|
3056
|
+
// node_modules/motion-dom/dist/es/value/follow-value.mjs
|
|
3057
|
+
function attachFollow(value, source, options = {}) {
|
|
3058
|
+
const initialValue = value.get();
|
|
3059
|
+
let activeAnimation = null;
|
|
3060
|
+
let latestValue = initialValue;
|
|
3061
|
+
let latestSetter;
|
|
3062
|
+
const unit = typeof initialValue === "string" ? initialValue.replace(/[\d.-]/g, "") : void 0;
|
|
3063
|
+
const stopAnimation2 = () => {
|
|
3064
|
+
if (activeAnimation) {
|
|
3065
|
+
activeAnimation.stop();
|
|
3066
|
+
activeAnimation = null;
|
|
3067
|
+
}
|
|
3068
|
+
};
|
|
3069
|
+
const startAnimation = () => {
|
|
3070
|
+
stopAnimation2();
|
|
3071
|
+
const currentValue = asNumber(value.get());
|
|
3072
|
+
const targetValue = asNumber(latestValue);
|
|
3073
|
+
if (currentValue === targetValue) {
|
|
3074
|
+
return;
|
|
3075
|
+
}
|
|
3076
|
+
activeAnimation = new JSAnimation({
|
|
3077
|
+
keyframes: [currentValue, targetValue],
|
|
3078
|
+
velocity: value.getVelocity(),
|
|
3079
|
+
// Default to spring if no type specified (matches useSpring behavior)
|
|
3080
|
+
type: "spring",
|
|
3081
|
+
restDelta: 1e-3,
|
|
3082
|
+
restSpeed: 0.01,
|
|
3083
|
+
...options,
|
|
3084
|
+
onUpdate: latestSetter
|
|
3085
|
+
});
|
|
3086
|
+
};
|
|
3087
|
+
value.attach((v, set) => {
|
|
3088
|
+
latestValue = v;
|
|
3089
|
+
latestSetter = (latest) => set(parseValue(latest, unit));
|
|
3090
|
+
frame.postRender(() => {
|
|
3091
|
+
startAnimation();
|
|
3092
|
+
value["events"].animationStart?.notify();
|
|
3093
|
+
activeAnimation?.then(() => {
|
|
3094
|
+
value["events"].animationComplete?.notify();
|
|
3095
|
+
});
|
|
3096
|
+
});
|
|
3097
|
+
}, stopAnimation2);
|
|
3098
|
+
if (isMotionValue(source)) {
|
|
3099
|
+
const removeSourceOnChange = source.on("change", (v) => value.set(parseValue(v, unit)));
|
|
3100
|
+
const removeValueOnDestroy = value.on("destroy", removeSourceOnChange);
|
|
3101
|
+
return () => {
|
|
3102
|
+
removeSourceOnChange();
|
|
3103
|
+
removeValueOnDestroy();
|
|
3104
|
+
};
|
|
3105
|
+
}
|
|
3106
|
+
return stopAnimation2;
|
|
3107
|
+
}
|
|
3108
|
+
function parseValue(v, unit) {
|
|
3109
|
+
return unit ? v + unit : v;
|
|
3110
|
+
}
|
|
3111
|
+
function asNumber(v) {
|
|
3112
|
+
return typeof v === "number" ? v : parseFloat(v);
|
|
3113
|
+
}
|
|
3114
|
+
|
|
3115
|
+
// node_modules/framer-motion/dist/es/context/MotionConfigContext.mjs
|
|
3116
|
+
import { createContext } from "react";
|
|
3117
|
+
var MotionConfigContext = createContext({
|
|
3118
|
+
transformPagePoint: (p) => p,
|
|
3119
|
+
isStatic: false,
|
|
3120
|
+
reducedMotion: "never"
|
|
3121
|
+
});
|
|
3122
|
+
|
|
3123
|
+
// node_modules/framer-motion/dist/es/value/use-scroll.mjs
|
|
3124
|
+
import { useRef as useRef2, useCallback, useEffect as useEffect2 } from "react";
|
|
3125
|
+
|
|
3126
|
+
// node_modules/framer-motion/dist/es/render/dom/scroll/info.mjs
|
|
3127
|
+
var maxElapsed2 = 50;
|
|
3128
|
+
var createAxisInfo = () => ({
|
|
3129
|
+
current: 0,
|
|
3130
|
+
offset: [],
|
|
3131
|
+
progress: 0,
|
|
3132
|
+
scrollLength: 0,
|
|
3133
|
+
targetOffset: 0,
|
|
3134
|
+
targetLength: 0,
|
|
3135
|
+
containerLength: 0,
|
|
3136
|
+
velocity: 0
|
|
3137
|
+
});
|
|
3138
|
+
var createScrollInfo = () => ({
|
|
3139
|
+
time: 0,
|
|
3140
|
+
x: createAxisInfo(),
|
|
3141
|
+
y: createAxisInfo()
|
|
3142
|
+
});
|
|
3143
|
+
var keys = {
|
|
3144
|
+
x: {
|
|
3145
|
+
length: "Width",
|
|
3146
|
+
position: "Left"
|
|
3147
|
+
},
|
|
3148
|
+
y: {
|
|
3149
|
+
length: "Height",
|
|
3150
|
+
position: "Top"
|
|
3151
|
+
}
|
|
3152
|
+
};
|
|
3153
|
+
function updateAxisInfo(element, axisName, info, time2) {
|
|
3154
|
+
const axis = info[axisName];
|
|
3155
|
+
const { length, position } = keys[axisName];
|
|
3156
|
+
const prev = axis.current;
|
|
3157
|
+
const prevTime = info.time;
|
|
3158
|
+
axis.current = element[`scroll${position}`];
|
|
3159
|
+
axis.scrollLength = element[`scroll${length}`] - element[`client${length}`];
|
|
3160
|
+
axis.offset.length = 0;
|
|
3161
|
+
axis.offset[0] = 0;
|
|
3162
|
+
axis.offset[1] = axis.scrollLength;
|
|
3163
|
+
axis.progress = progress(0, axis.scrollLength, axis.current);
|
|
3164
|
+
const elapsed = time2 - prevTime;
|
|
3165
|
+
axis.velocity = elapsed > maxElapsed2 ? 0 : velocityPerSecond(axis.current - prev, elapsed);
|
|
3166
|
+
}
|
|
3167
|
+
function updateScrollInfo(element, info, time2) {
|
|
3168
|
+
updateAxisInfo(element, "x", info, time2);
|
|
3169
|
+
updateAxisInfo(element, "y", info, time2);
|
|
3170
|
+
info.time = time2;
|
|
3171
|
+
}
|
|
3172
|
+
|
|
3173
|
+
// node_modules/framer-motion/dist/es/render/dom/scroll/offsets/inset.mjs
|
|
3174
|
+
function calcInset(element, container) {
|
|
3175
|
+
const inset = { x: 0, y: 0 };
|
|
3176
|
+
let current = element;
|
|
3177
|
+
while (current && current !== container) {
|
|
3178
|
+
if (isHTMLElement(current)) {
|
|
3179
|
+
inset.x += current.offsetLeft;
|
|
3180
|
+
inset.y += current.offsetTop;
|
|
3181
|
+
current = current.offsetParent;
|
|
3182
|
+
} else if (current.tagName === "svg") {
|
|
3183
|
+
const svgBoundingBox = current.getBoundingClientRect();
|
|
3184
|
+
current = current.parentElement;
|
|
3185
|
+
const parentBoundingBox = current.getBoundingClientRect();
|
|
3186
|
+
inset.x += svgBoundingBox.left - parentBoundingBox.left;
|
|
3187
|
+
inset.y += svgBoundingBox.top - parentBoundingBox.top;
|
|
3188
|
+
} else if (current instanceof SVGGraphicsElement) {
|
|
3189
|
+
const { x, y } = current.getBBox();
|
|
3190
|
+
inset.x += x;
|
|
3191
|
+
inset.y += y;
|
|
3192
|
+
let svg = null;
|
|
3193
|
+
let parent = current.parentNode;
|
|
3194
|
+
while (!svg) {
|
|
3195
|
+
if (parent.tagName === "svg") {
|
|
3196
|
+
svg = parent;
|
|
3197
|
+
}
|
|
3198
|
+
parent = current.parentNode;
|
|
3199
|
+
}
|
|
3200
|
+
current = svg;
|
|
3201
|
+
} else {
|
|
3202
|
+
break;
|
|
3203
|
+
}
|
|
3204
|
+
}
|
|
3205
|
+
return inset;
|
|
3206
|
+
}
|
|
3207
|
+
|
|
3208
|
+
// node_modules/framer-motion/dist/es/render/dom/scroll/offsets/edge.mjs
|
|
3209
|
+
var namedEdges = {
|
|
3210
|
+
start: 0,
|
|
3211
|
+
center: 0.5,
|
|
3212
|
+
end: 1
|
|
3213
|
+
};
|
|
3214
|
+
function resolveEdge(edge, length, inset = 0) {
|
|
3215
|
+
let delta = 0;
|
|
3216
|
+
if (edge in namedEdges) {
|
|
3217
|
+
edge = namedEdges[edge];
|
|
3218
|
+
}
|
|
3219
|
+
if (typeof edge === "string") {
|
|
3220
|
+
const asNumber2 = parseFloat(edge);
|
|
3221
|
+
if (edge.endsWith("px")) {
|
|
3222
|
+
delta = asNumber2;
|
|
3223
|
+
} else if (edge.endsWith("%")) {
|
|
3224
|
+
edge = asNumber2 / 100;
|
|
3225
|
+
} else if (edge.endsWith("vw")) {
|
|
3226
|
+
delta = asNumber2 / 100 * document.documentElement.clientWidth;
|
|
3227
|
+
} else if (edge.endsWith("vh")) {
|
|
3228
|
+
delta = asNumber2 / 100 * document.documentElement.clientHeight;
|
|
3229
|
+
} else {
|
|
3230
|
+
edge = asNumber2;
|
|
3231
|
+
}
|
|
3232
|
+
}
|
|
3233
|
+
if (typeof edge === "number") {
|
|
3234
|
+
delta = length * edge;
|
|
3235
|
+
}
|
|
3236
|
+
return inset + delta;
|
|
3237
|
+
}
|
|
3238
|
+
|
|
3239
|
+
// node_modules/framer-motion/dist/es/render/dom/scroll/offsets/offset.mjs
|
|
3240
|
+
var defaultOffset2 = [0, 0];
|
|
3241
|
+
function resolveOffset(offset, containerLength, targetLength, targetInset) {
|
|
3242
|
+
let offsetDefinition = Array.isArray(offset) ? offset : defaultOffset2;
|
|
3243
|
+
let targetPoint = 0;
|
|
3244
|
+
let containerPoint = 0;
|
|
3245
|
+
if (typeof offset === "number") {
|
|
3246
|
+
offsetDefinition = [offset, offset];
|
|
3247
|
+
} else if (typeof offset === "string") {
|
|
3248
|
+
offset = offset.trim();
|
|
3249
|
+
if (offset.includes(" ")) {
|
|
3250
|
+
offsetDefinition = offset.split(" ");
|
|
3251
|
+
} else {
|
|
3252
|
+
offsetDefinition = [offset, namedEdges[offset] ? offset : `0`];
|
|
3253
|
+
}
|
|
3254
|
+
}
|
|
3255
|
+
targetPoint = resolveEdge(offsetDefinition[0], targetLength, targetInset);
|
|
3256
|
+
containerPoint = resolveEdge(offsetDefinition[1], containerLength);
|
|
3257
|
+
return targetPoint - containerPoint;
|
|
3258
|
+
}
|
|
3259
|
+
|
|
3260
|
+
// node_modules/framer-motion/dist/es/render/dom/scroll/offsets/presets.mjs
|
|
3261
|
+
var ScrollOffset = {
|
|
3262
|
+
Enter: [
|
|
3263
|
+
[0, 1],
|
|
3264
|
+
[1, 1]
|
|
3265
|
+
],
|
|
3266
|
+
Exit: [
|
|
3267
|
+
[0, 0],
|
|
3268
|
+
[1, 0]
|
|
3269
|
+
],
|
|
3270
|
+
Any: [
|
|
3271
|
+
[1, 0],
|
|
3272
|
+
[0, 1]
|
|
3273
|
+
],
|
|
3274
|
+
All: [
|
|
3275
|
+
[0, 0],
|
|
3276
|
+
[1, 1]
|
|
3277
|
+
]
|
|
3278
|
+
};
|
|
3279
|
+
|
|
3280
|
+
// node_modules/framer-motion/dist/es/render/dom/scroll/offsets/index.mjs
|
|
3281
|
+
var point = { x: 0, y: 0 };
|
|
3282
|
+
function getTargetSize(target) {
|
|
3283
|
+
return "getBBox" in target && target.tagName !== "svg" ? target.getBBox() : { width: target.clientWidth, height: target.clientHeight };
|
|
3284
|
+
}
|
|
3285
|
+
function resolveOffsets(container, info, options) {
|
|
3286
|
+
const { offset: offsetDefinition = ScrollOffset.All } = options;
|
|
3287
|
+
const { target = container, axis = "y" } = options;
|
|
3288
|
+
const lengthLabel = axis === "y" ? "height" : "width";
|
|
3289
|
+
const inset = target !== container ? calcInset(target, container) : point;
|
|
3290
|
+
const targetSize = target === container ? { width: container.scrollWidth, height: container.scrollHeight } : getTargetSize(target);
|
|
3291
|
+
const containerSize = {
|
|
3292
|
+
width: container.clientWidth,
|
|
3293
|
+
height: container.clientHeight
|
|
3294
|
+
};
|
|
3295
|
+
info[axis].offset.length = 0;
|
|
3296
|
+
let hasChanged = !info[axis].interpolate;
|
|
3297
|
+
const numOffsets = offsetDefinition.length;
|
|
3298
|
+
for (let i = 0; i < numOffsets; i++) {
|
|
3299
|
+
const offset = resolveOffset(offsetDefinition[i], containerSize[lengthLabel], targetSize[lengthLabel], inset[axis]);
|
|
3300
|
+
if (!hasChanged && offset !== info[axis].interpolatorOffsets[i]) {
|
|
3301
|
+
hasChanged = true;
|
|
3302
|
+
}
|
|
3303
|
+
info[axis].offset[i] = offset;
|
|
3304
|
+
}
|
|
3305
|
+
if (hasChanged) {
|
|
3306
|
+
info[axis].interpolate = interpolate(info[axis].offset, defaultOffset(offsetDefinition), { clamp: false });
|
|
3307
|
+
info[axis].interpolatorOffsets = [...info[axis].offset];
|
|
3308
|
+
}
|
|
3309
|
+
info[axis].progress = clamp(0, 1, info[axis].interpolate(info[axis].current));
|
|
3310
|
+
}
|
|
3311
|
+
|
|
3312
|
+
// node_modules/framer-motion/dist/es/render/dom/scroll/on-scroll-handler.mjs
|
|
3313
|
+
function measure(container, target = container, info) {
|
|
3314
|
+
info.x.targetOffset = 0;
|
|
3315
|
+
info.y.targetOffset = 0;
|
|
3316
|
+
if (target !== container) {
|
|
3317
|
+
let node = target;
|
|
3318
|
+
while (node && node !== container) {
|
|
3319
|
+
info.x.targetOffset += node.offsetLeft;
|
|
3320
|
+
info.y.targetOffset += node.offsetTop;
|
|
3321
|
+
node = node.offsetParent;
|
|
3322
|
+
}
|
|
3323
|
+
}
|
|
3324
|
+
info.x.targetLength = target === container ? target.scrollWidth : target.clientWidth;
|
|
3325
|
+
info.y.targetLength = target === container ? target.scrollHeight : target.clientHeight;
|
|
3326
|
+
info.x.containerLength = container.clientWidth;
|
|
3327
|
+
info.y.containerLength = container.clientHeight;
|
|
3328
|
+
if (process.env.NODE_ENV !== "production") {
|
|
3329
|
+
if (container && target && target !== container) {
|
|
3330
|
+
warnOnce(getComputedStyle(container).position !== "static", "Please ensure that the container has a non-static position, like 'relative', 'fixed', or 'absolute' to ensure scroll offset is calculated correctly.");
|
|
3331
|
+
}
|
|
3332
|
+
}
|
|
3333
|
+
}
|
|
3334
|
+
function createOnScrollHandler(element, onScroll, info, options = {}) {
|
|
3335
|
+
return {
|
|
3336
|
+
measure: (time2) => {
|
|
3337
|
+
measure(element, options.target, info);
|
|
3338
|
+
updateScrollInfo(element, info, time2);
|
|
3339
|
+
if (options.offset || options.target) {
|
|
3340
|
+
resolveOffsets(element, info, options);
|
|
3341
|
+
}
|
|
3342
|
+
},
|
|
3343
|
+
notify: () => onScroll(info)
|
|
3344
|
+
};
|
|
3345
|
+
}
|
|
3346
|
+
|
|
3347
|
+
// node_modules/framer-motion/dist/es/render/dom/scroll/track.mjs
|
|
3348
|
+
var scrollListeners = /* @__PURE__ */ new WeakMap();
|
|
3349
|
+
var resizeListeners = /* @__PURE__ */ new WeakMap();
|
|
3350
|
+
var onScrollHandlers = /* @__PURE__ */ new WeakMap();
|
|
3351
|
+
var scrollSize = /* @__PURE__ */ new WeakMap();
|
|
3352
|
+
var dimensionCheckProcesses = /* @__PURE__ */ new WeakMap();
|
|
3353
|
+
var getEventTarget = (element) => element === document.scrollingElement ? window : element;
|
|
3354
|
+
function scrollInfo(onScroll, { container = document.scrollingElement, trackContentSize = false, ...options } = {}) {
|
|
3355
|
+
if (!container)
|
|
3356
|
+
return noop;
|
|
3357
|
+
let containerHandlers = onScrollHandlers.get(container);
|
|
3358
|
+
if (!containerHandlers) {
|
|
3359
|
+
containerHandlers = /* @__PURE__ */ new Set();
|
|
3360
|
+
onScrollHandlers.set(container, containerHandlers);
|
|
3361
|
+
}
|
|
3362
|
+
const info = createScrollInfo();
|
|
3363
|
+
const containerHandler = createOnScrollHandler(container, onScroll, info, options);
|
|
3364
|
+
containerHandlers.add(containerHandler);
|
|
3365
|
+
if (!scrollListeners.has(container)) {
|
|
3366
|
+
const measureAll = () => {
|
|
3367
|
+
for (const handler of containerHandlers) {
|
|
3368
|
+
handler.measure(frameData.timestamp);
|
|
3369
|
+
}
|
|
3370
|
+
frame.preUpdate(notifyAll2);
|
|
3371
|
+
};
|
|
3372
|
+
const notifyAll2 = () => {
|
|
3373
|
+
for (const handler of containerHandlers) {
|
|
3374
|
+
handler.notify();
|
|
3375
|
+
}
|
|
3376
|
+
};
|
|
3377
|
+
const listener2 = () => frame.read(measureAll);
|
|
3378
|
+
scrollListeners.set(container, listener2);
|
|
3379
|
+
const target = getEventTarget(container);
|
|
3380
|
+
window.addEventListener("resize", listener2, { passive: true });
|
|
3381
|
+
if (container !== document.documentElement) {
|
|
3382
|
+
resizeListeners.set(container, resize(container, listener2));
|
|
3383
|
+
}
|
|
3384
|
+
target.addEventListener("scroll", listener2, { passive: true });
|
|
3385
|
+
listener2();
|
|
3386
|
+
}
|
|
3387
|
+
if (trackContentSize && !dimensionCheckProcesses.has(container)) {
|
|
3388
|
+
const listener2 = scrollListeners.get(container);
|
|
3389
|
+
const size = {
|
|
3390
|
+
width: container.scrollWidth,
|
|
3391
|
+
height: container.scrollHeight
|
|
3392
|
+
};
|
|
3393
|
+
scrollSize.set(container, size);
|
|
3394
|
+
const checkScrollDimensions = () => {
|
|
3395
|
+
const newWidth = container.scrollWidth;
|
|
3396
|
+
const newHeight = container.scrollHeight;
|
|
3397
|
+
if (size.width !== newWidth || size.height !== newHeight) {
|
|
3398
|
+
listener2();
|
|
3399
|
+
size.width = newWidth;
|
|
3400
|
+
size.height = newHeight;
|
|
3401
|
+
}
|
|
3402
|
+
};
|
|
3403
|
+
const dimensionCheckProcess = frame.read(checkScrollDimensions, true);
|
|
3404
|
+
dimensionCheckProcesses.set(container, dimensionCheckProcess);
|
|
3405
|
+
}
|
|
3406
|
+
const listener = scrollListeners.get(container);
|
|
3407
|
+
frame.read(listener, false, true);
|
|
3408
|
+
return () => {
|
|
3409
|
+
cancelFrame(listener);
|
|
3410
|
+
const currentHandlers = onScrollHandlers.get(container);
|
|
3411
|
+
if (!currentHandlers)
|
|
3412
|
+
return;
|
|
3413
|
+
currentHandlers.delete(containerHandler);
|
|
3414
|
+
if (currentHandlers.size)
|
|
3415
|
+
return;
|
|
3416
|
+
const scrollListener = scrollListeners.get(container);
|
|
3417
|
+
scrollListeners.delete(container);
|
|
3418
|
+
if (scrollListener) {
|
|
3419
|
+
getEventTarget(container).removeEventListener("scroll", scrollListener);
|
|
3420
|
+
resizeListeners.get(container)?.();
|
|
3421
|
+
window.removeEventListener("resize", scrollListener);
|
|
3422
|
+
}
|
|
3423
|
+
const dimensionCheckProcess = dimensionCheckProcesses.get(container);
|
|
3424
|
+
if (dimensionCheckProcess) {
|
|
3425
|
+
cancelFrame(dimensionCheckProcess);
|
|
3426
|
+
dimensionCheckProcesses.delete(container);
|
|
3427
|
+
}
|
|
3428
|
+
scrollSize.delete(container);
|
|
3429
|
+
};
|
|
3430
|
+
}
|
|
3431
|
+
|
|
3432
|
+
// node_modules/framer-motion/dist/es/render/dom/scroll/utils/get-timeline.mjs
|
|
3433
|
+
var timelineCache = /* @__PURE__ */ new Map();
|
|
3434
|
+
function scrollTimelineFallback(options) {
|
|
3435
|
+
const currentTime = { value: 0 };
|
|
3436
|
+
const cancel = scrollInfo((info) => {
|
|
3437
|
+
currentTime.value = info[options.axis].progress * 100;
|
|
3438
|
+
}, options);
|
|
3439
|
+
return { currentTime, cancel };
|
|
3440
|
+
}
|
|
3441
|
+
function getTimeline({ source, container, ...options }) {
|
|
3442
|
+
const { axis } = options;
|
|
3443
|
+
if (source)
|
|
3444
|
+
container = source;
|
|
3445
|
+
const containerCache = timelineCache.get(container) ?? /* @__PURE__ */ new Map();
|
|
3446
|
+
timelineCache.set(container, containerCache);
|
|
3447
|
+
const targetKey = options.target ?? "self";
|
|
3448
|
+
const targetCache = containerCache.get(targetKey) ?? {};
|
|
3449
|
+
const axisKey = axis + (options.offset ?? []).join(",");
|
|
3450
|
+
if (!targetCache[axisKey]) {
|
|
3451
|
+
targetCache[axisKey] = !options.target && supportsScrollTimeline() ? new ScrollTimeline({ source: container, axis }) : scrollTimelineFallback({ container, ...options });
|
|
3452
|
+
}
|
|
3453
|
+
return targetCache[axisKey];
|
|
3454
|
+
}
|
|
3455
|
+
|
|
3456
|
+
// node_modules/framer-motion/dist/es/render/dom/scroll/attach-animation.mjs
|
|
3457
|
+
function attachToAnimation(animation, options) {
|
|
3458
|
+
const timeline = getTimeline(options);
|
|
3459
|
+
return animation.attachTimeline({
|
|
3460
|
+
timeline: options.target ? void 0 : timeline,
|
|
3461
|
+
observe: (valueAnimation) => {
|
|
3462
|
+
valueAnimation.pause();
|
|
3463
|
+
return observeTimeline((progress2) => {
|
|
3464
|
+
valueAnimation.time = valueAnimation.iterationDuration * progress2;
|
|
3465
|
+
}, timeline);
|
|
3466
|
+
}
|
|
3467
|
+
});
|
|
3468
|
+
}
|
|
3469
|
+
|
|
3470
|
+
// node_modules/framer-motion/dist/es/render/dom/scroll/attach-function.mjs
|
|
3471
|
+
function isOnScrollWithInfo(onScroll) {
|
|
3472
|
+
return onScroll.length === 2;
|
|
3473
|
+
}
|
|
3474
|
+
function attachToFunction(onScroll, options) {
|
|
3475
|
+
if (isOnScrollWithInfo(onScroll)) {
|
|
3476
|
+
return scrollInfo((info) => {
|
|
3477
|
+
onScroll(info[options.axis].progress, info);
|
|
3478
|
+
}, options);
|
|
3479
|
+
} else {
|
|
3480
|
+
return observeTimeline(onScroll, getTimeline(options));
|
|
3481
|
+
}
|
|
3482
|
+
}
|
|
3483
|
+
|
|
3484
|
+
// node_modules/framer-motion/dist/es/render/dom/scroll/index.mjs
|
|
3485
|
+
function scroll(onScroll, { axis = "y", container = document.scrollingElement, ...options } = {}) {
|
|
3486
|
+
if (!container)
|
|
3487
|
+
return noop;
|
|
3488
|
+
const optionsWithDefaults = { axis, container, ...options };
|
|
3489
|
+
return typeof onScroll === "function" ? attachToFunction(onScroll, optionsWithDefaults) : attachToAnimation(onScroll, optionsWithDefaults);
|
|
3490
|
+
}
|
|
3491
|
+
|
|
3492
|
+
// node_modules/framer-motion/dist/es/value/use-scroll.mjs
|
|
3493
|
+
var createScrollMotionValues = () => ({
|
|
3494
|
+
scrollX: motionValue(0),
|
|
3495
|
+
scrollY: motionValue(0),
|
|
3496
|
+
scrollXProgress: motionValue(0),
|
|
3497
|
+
scrollYProgress: motionValue(0)
|
|
3498
|
+
});
|
|
3499
|
+
var isRefPending = (ref) => {
|
|
3500
|
+
if (!ref)
|
|
3501
|
+
return false;
|
|
3502
|
+
return !ref.current;
|
|
3503
|
+
};
|
|
3504
|
+
function useScroll({ container, target, ...options } = {}) {
|
|
3505
|
+
const values = useConstant(createScrollMotionValues);
|
|
3506
|
+
const scrollAnimation = useRef2(null);
|
|
3507
|
+
const needsStart = useRef2(false);
|
|
3508
|
+
const start = useCallback(() => {
|
|
3509
|
+
scrollAnimation.current = scroll((_progress, { x, y }) => {
|
|
3510
|
+
values.scrollX.set(x.current);
|
|
3511
|
+
values.scrollXProgress.set(x.progress);
|
|
3512
|
+
values.scrollY.set(y.current);
|
|
3513
|
+
values.scrollYProgress.set(y.progress);
|
|
3514
|
+
}, {
|
|
3515
|
+
...options,
|
|
3516
|
+
container: container?.current || void 0,
|
|
3517
|
+
target: target?.current || void 0
|
|
3518
|
+
});
|
|
3519
|
+
return () => {
|
|
3520
|
+
scrollAnimation.current?.();
|
|
3521
|
+
};
|
|
3522
|
+
}, [container, target, JSON.stringify(options.offset)]);
|
|
3523
|
+
useIsomorphicLayoutEffect(() => {
|
|
3524
|
+
needsStart.current = false;
|
|
3525
|
+
if (isRefPending(container) || isRefPending(target)) {
|
|
3526
|
+
needsStart.current = true;
|
|
3527
|
+
return;
|
|
3528
|
+
} else {
|
|
3529
|
+
return start();
|
|
3530
|
+
}
|
|
3531
|
+
}, [start]);
|
|
3532
|
+
useEffect2(() => {
|
|
3533
|
+
if (needsStart.current) {
|
|
3534
|
+
invariant(!isRefPending(container), "Container ref is defined but not hydrated", "use-scroll-ref");
|
|
3535
|
+
invariant(!isRefPending(target), "Target ref is defined but not hydrated", "use-scroll-ref");
|
|
3536
|
+
return start();
|
|
3537
|
+
} else {
|
|
3538
|
+
return;
|
|
3539
|
+
}
|
|
3540
|
+
}, [start]);
|
|
3541
|
+
return values;
|
|
3542
|
+
}
|
|
3543
|
+
|
|
3544
|
+
// node_modules/framer-motion/dist/es/value/use-motion-value.mjs
|
|
3545
|
+
import { useContext, useState, useEffect as useEffect3 } from "react";
|
|
3546
|
+
function useMotionValue(initial) {
|
|
3547
|
+
const value = useConstant(() => motionValue(initial));
|
|
3548
|
+
const { isStatic } = useContext(MotionConfigContext);
|
|
3549
|
+
if (isStatic) {
|
|
3550
|
+
const [, setLatest] = useState(initial);
|
|
3551
|
+
useEffect3(() => value.on("change", setLatest), []);
|
|
3552
|
+
}
|
|
3553
|
+
return value;
|
|
3554
|
+
}
|
|
3555
|
+
|
|
3556
|
+
// node_modules/framer-motion/dist/es/value/use-combine-values.mjs
|
|
3557
|
+
function useCombineMotionValues(values, combineValues) {
|
|
3558
|
+
const value = useMotionValue(combineValues());
|
|
3559
|
+
const updateValue = () => value.set(combineValues());
|
|
3560
|
+
updateValue();
|
|
3561
|
+
useIsomorphicLayoutEffect(() => {
|
|
3562
|
+
const scheduleUpdate = () => frame.preRender(updateValue, false, true);
|
|
3563
|
+
const subscriptions = values.map((v) => v.on("change", scheduleUpdate));
|
|
3564
|
+
return () => {
|
|
3565
|
+
subscriptions.forEach((unsubscribe) => unsubscribe());
|
|
3566
|
+
cancelFrame(updateValue);
|
|
3567
|
+
};
|
|
3568
|
+
});
|
|
3569
|
+
return value;
|
|
3570
|
+
}
|
|
3571
|
+
|
|
3572
|
+
// node_modules/framer-motion/dist/es/value/use-follow-value.mjs
|
|
3573
|
+
import { useContext as useContext2, useInsertionEffect } from "react";
|
|
3574
|
+
|
|
3575
|
+
// node_modules/framer-motion/dist/es/value/use-computed.mjs
|
|
3576
|
+
function useComputed(compute) {
|
|
3577
|
+
collectMotionValues.current = [];
|
|
3578
|
+
compute();
|
|
3579
|
+
const value = useCombineMotionValues(collectMotionValues.current, compute);
|
|
3580
|
+
collectMotionValues.current = void 0;
|
|
3581
|
+
return value;
|
|
3582
|
+
}
|
|
3583
|
+
|
|
3584
|
+
// node_modules/framer-motion/dist/es/value/use-transform.mjs
|
|
3585
|
+
function useTransform(input, inputRangeOrTransformer, outputRangeOrMap, options) {
|
|
3586
|
+
if (typeof input === "function") {
|
|
3587
|
+
return useComputed(input);
|
|
3588
|
+
}
|
|
3589
|
+
const isOutputMap = outputRangeOrMap !== void 0 && !Array.isArray(outputRangeOrMap) && typeof inputRangeOrTransformer !== "function";
|
|
3590
|
+
if (isOutputMap) {
|
|
3591
|
+
return useMapTransform(input, inputRangeOrTransformer, outputRangeOrMap, options);
|
|
3592
|
+
}
|
|
3593
|
+
const outputRange = outputRangeOrMap;
|
|
3594
|
+
const transformer = typeof inputRangeOrTransformer === "function" ? inputRangeOrTransformer : transform(inputRangeOrTransformer, outputRange, options);
|
|
3595
|
+
return Array.isArray(input) ? useListTransform(input, transformer) : useListTransform([input], ([latest]) => transformer(latest));
|
|
3596
|
+
}
|
|
3597
|
+
function useListTransform(values, transformer) {
|
|
3598
|
+
const latest = useConstant(() => []);
|
|
3599
|
+
return useCombineMotionValues(values, () => {
|
|
3600
|
+
latest.length = 0;
|
|
3601
|
+
const numValues = values.length;
|
|
3602
|
+
for (let i = 0; i < numValues; i++) {
|
|
3603
|
+
latest[i] = values[i].get();
|
|
3604
|
+
}
|
|
3605
|
+
return transformer(latest);
|
|
3606
|
+
});
|
|
3607
|
+
}
|
|
3608
|
+
function useMapTransform(inputValue, inputRange, outputMap, options) {
|
|
3609
|
+
const keys2 = useConstant(() => Object.keys(outputMap));
|
|
3610
|
+
const output = useConstant(() => ({}));
|
|
3611
|
+
for (const key of keys2) {
|
|
3612
|
+
output[key] = useTransform(inputValue, inputRange, outputMap[key], options);
|
|
3613
|
+
}
|
|
3614
|
+
return output;
|
|
3615
|
+
}
|
|
3616
|
+
|
|
3617
|
+
// node_modules/framer-motion/dist/es/value/use-follow-value.mjs
|
|
3618
|
+
function useFollowValue(source, options = {}) {
|
|
3619
|
+
const { isStatic } = useContext2(MotionConfigContext);
|
|
3620
|
+
const getFromSource = () => isMotionValue(source) ? source.get() : source;
|
|
3621
|
+
if (isStatic) {
|
|
3622
|
+
return useTransform(getFromSource);
|
|
3623
|
+
}
|
|
3624
|
+
const value = useMotionValue(getFromSource());
|
|
3625
|
+
useInsertionEffect(() => {
|
|
3626
|
+
return attachFollow(value, source, options);
|
|
3627
|
+
}, [value, JSON.stringify(options)]);
|
|
3628
|
+
return value;
|
|
3629
|
+
}
|
|
3630
|
+
|
|
3631
|
+
// node_modules/framer-motion/dist/es/value/use-spring.mjs
|
|
3632
|
+
function useSpring(source, options = {}) {
|
|
3633
|
+
return useFollowValue(source, { type: "spring", ...options });
|
|
3634
|
+
}
|
|
3635
|
+
|
|
3636
|
+
// node_modules/framer-motion/dist/es/animation/hooks/animation-controls.mjs
|
|
3637
|
+
function stopAnimation(visualElement) {
|
|
3638
|
+
visualElement.values.forEach((value) => value.stop());
|
|
3639
|
+
}
|
|
3640
|
+
function setVariants(visualElement, variantLabels) {
|
|
3641
|
+
const reversedLabels = [...variantLabels].reverse();
|
|
3642
|
+
reversedLabels.forEach((key) => {
|
|
3643
|
+
const variant = visualElement.getVariant(key);
|
|
3644
|
+
variant && setTarget(visualElement, variant);
|
|
3645
|
+
if (visualElement.variantChildren) {
|
|
3646
|
+
visualElement.variantChildren.forEach((child) => {
|
|
3647
|
+
setVariants(child, variantLabels);
|
|
3648
|
+
});
|
|
3649
|
+
}
|
|
3650
|
+
});
|
|
3651
|
+
}
|
|
3652
|
+
function setValues(visualElement, definition) {
|
|
3653
|
+
if (Array.isArray(definition)) {
|
|
3654
|
+
return setVariants(visualElement, definition);
|
|
3655
|
+
} else if (typeof definition === "string") {
|
|
3656
|
+
return setVariants(visualElement, [definition]);
|
|
3657
|
+
} else {
|
|
3658
|
+
setTarget(visualElement, definition);
|
|
3659
|
+
}
|
|
3660
|
+
}
|
|
3661
|
+
function animationControls() {
|
|
3662
|
+
let hasMounted = false;
|
|
3663
|
+
const subscribers = /* @__PURE__ */ new Set();
|
|
3664
|
+
const controls = {
|
|
3665
|
+
subscribe(visualElement) {
|
|
3666
|
+
subscribers.add(visualElement);
|
|
3667
|
+
return () => void subscribers.delete(visualElement);
|
|
3668
|
+
},
|
|
3669
|
+
start(definition, transitionOverride) {
|
|
3670
|
+
invariant(hasMounted, "controls.start() should only be called after a component has mounted. Consider calling within a useEffect hook.");
|
|
3671
|
+
const animations = [];
|
|
3672
|
+
subscribers.forEach((visualElement) => {
|
|
3673
|
+
animations.push(animateVisualElement(visualElement, definition, {
|
|
3674
|
+
transitionOverride
|
|
3675
|
+
}));
|
|
3676
|
+
});
|
|
3677
|
+
return Promise.all(animations);
|
|
3678
|
+
},
|
|
3679
|
+
set(definition) {
|
|
3680
|
+
invariant(hasMounted, "controls.set() should only be called after a component has mounted. Consider calling within a useEffect hook.");
|
|
3681
|
+
return subscribers.forEach((visualElement) => {
|
|
3682
|
+
setValues(visualElement, definition);
|
|
3683
|
+
});
|
|
3684
|
+
},
|
|
3685
|
+
stop() {
|
|
3686
|
+
subscribers.forEach((visualElement) => {
|
|
3687
|
+
stopAnimation(visualElement);
|
|
3688
|
+
});
|
|
3689
|
+
},
|
|
3690
|
+
mount() {
|
|
3691
|
+
hasMounted = true;
|
|
3692
|
+
return () => {
|
|
3693
|
+
hasMounted = false;
|
|
3694
|
+
controls.stop();
|
|
3695
|
+
};
|
|
3696
|
+
}
|
|
3697
|
+
};
|
|
3698
|
+
return controls;
|
|
3699
|
+
}
|
|
3700
|
+
|
|
3701
|
+
// node_modules/framer-motion/dist/es/animation/hooks/use-animation.mjs
|
|
3702
|
+
function useAnimationControls() {
|
|
3703
|
+
const controls = useConstant(animationControls);
|
|
3704
|
+
useIsomorphicLayoutEffect(controls.mount, []);
|
|
3705
|
+
return controls;
|
|
3706
|
+
}
|
|
3707
|
+
var useAnimation = useAnimationControls;
|
|
3708
|
+
|
|
3709
|
+
// src/bridges/motion/index.ts
|
|
3710
|
+
function useScrollProgress() {
|
|
3711
|
+
const { scrollYProgress } = useScroll();
|
|
3712
|
+
return scrollYProgress;
|
|
3713
|
+
}
|
|
3714
|
+
export {
|
|
3715
|
+
useAnimation,
|
|
3716
|
+
useMotionValue,
|
|
3717
|
+
useScrollProgress,
|
|
3718
|
+
useSpring,
|
|
3719
|
+
useTransform
|
|
3720
|
+
};
|
|
3721
|
+
//# sourceMappingURL=motion.mjs.map
|