Mission Control Dashboard - Initial implementation
This commit is contained in:
21
node_modules/motion-dom/LICENSE.md
generated
vendored
Normal file
21
node_modules/motion-dom/LICENSE.md
generated
vendored
Normal file
@@ -0,0 +1,21 @@
|
||||
The MIT License (MIT)
|
||||
|
||||
Copyright (c) 2024 [Motion](https://motion.dev) B.V.
|
||||
|
||||
Permission is hereby granted, free of charge, to any person obtaining a copy
|
||||
of this software and associated documentation files (the "Software"), to deal
|
||||
in the Software without restriction, including without limitation the rights
|
||||
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
||||
copies of the Software, and to permit persons to whom the Software is
|
||||
furnished to do so, subject to the following conditions:
|
||||
|
||||
The above copyright notice and this permission notice shall be included in all
|
||||
copies or substantial portions of the Software.
|
||||
|
||||
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
||||
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
||||
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
||||
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
||||
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
||||
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
||||
SOFTWARE.
|
||||
10014
node_modules/motion-dom/dist/cjs/index.js
generated
vendored
Normal file
10014
node_modules/motion-dom/dist/cjs/index.js
generated
vendored
Normal file
File diff suppressed because it is too large
Load Diff
1
node_modules/motion-dom/dist/cjs/index.js.map
generated
vendored
Normal file
1
node_modules/motion-dom/dist/cjs/index.js.map
generated
vendored
Normal file
File diff suppressed because one or more lines are too long
199
node_modules/motion-dom/dist/es/animation/AsyncMotionValueAnimation.mjs
generated
vendored
Normal file
199
node_modules/motion-dom/dist/es/animation/AsyncMotionValueAnimation.mjs
generated
vendored
Normal file
@@ -0,0 +1,199 @@
|
||||
import { MotionGlobalConfig, noop } from 'motion-utils';
|
||||
import { time } from '../frameloop/sync-time.mjs';
|
||||
import { JSAnimation } from './JSAnimation.mjs';
|
||||
import { getFinalKeyframe } from './keyframes/get-final.mjs';
|
||||
import { KeyframeResolver, flushKeyframeResolvers } from './keyframes/KeyframesResolver.mjs';
|
||||
import { NativeAnimationExtended } from './NativeAnimationExtended.mjs';
|
||||
import { canAnimate } from './utils/can-animate.mjs';
|
||||
import { makeAnimationInstant } from './utils/make-animation-instant.mjs';
|
||||
import { WithPromise } from './utils/WithPromise.mjs';
|
||||
import { supportsBrowserAnimation } from './waapi/supports/waapi.mjs';
|
||||
|
||||
/**
|
||||
* Maximum time allowed between an animation being created and it being
|
||||
* resolved for us to use the latter as the start time.
|
||||
*
|
||||
* This is to ensure that while we prefer to "start" an animation as soon
|
||||
* as it's triggered, we also want to avoid a visual jump if there's a big delay
|
||||
* between these two moments.
|
||||
*/
|
||||
const MAX_RESOLVE_DELAY = 40;
|
||||
class AsyncMotionValueAnimation extends WithPromise {
|
||||
constructor({ autoplay = true, delay = 0, type = "keyframes", repeat = 0, repeatDelay = 0, repeatType = "loop", keyframes, name, motionValue, element, ...options }) {
|
||||
super();
|
||||
/**
|
||||
* Bound to support return animation.stop pattern
|
||||
*/
|
||||
this.stop = () => {
|
||||
if (this._animation) {
|
||||
this._animation.stop();
|
||||
this.stopTimeline?.();
|
||||
}
|
||||
this.keyframeResolver?.cancel();
|
||||
};
|
||||
this.createdAt = time.now();
|
||||
const optionsWithDefaults = {
|
||||
autoplay,
|
||||
delay,
|
||||
type,
|
||||
repeat,
|
||||
repeatDelay,
|
||||
repeatType,
|
||||
name,
|
||||
motionValue,
|
||||
element,
|
||||
...options,
|
||||
};
|
||||
const KeyframeResolver$1 = element?.KeyframeResolver || KeyframeResolver;
|
||||
this.keyframeResolver = new KeyframeResolver$1(keyframes, (resolvedKeyframes, finalKeyframe, forced) => this.onKeyframesResolved(resolvedKeyframes, finalKeyframe, optionsWithDefaults, !forced), name, motionValue, element);
|
||||
this.keyframeResolver?.scheduleResolve();
|
||||
}
|
||||
onKeyframesResolved(keyframes, finalKeyframe, options, sync) {
|
||||
this.keyframeResolver = undefined;
|
||||
const { name, type, velocity, delay, isHandoff, onUpdate } = options;
|
||||
this.resolvedAt = time.now();
|
||||
/**
|
||||
* If we can't animate this value with the resolved keyframes
|
||||
* then we should complete it immediately.
|
||||
*/
|
||||
let canAnimateValue = true;
|
||||
if (!canAnimate(keyframes, name, type, velocity)) {
|
||||
canAnimateValue = false;
|
||||
if (MotionGlobalConfig.instantAnimations || !delay) {
|
||||
onUpdate?.(getFinalKeyframe(keyframes, options, finalKeyframe));
|
||||
}
|
||||
keyframes[0] = keyframes[keyframes.length - 1];
|
||||
makeAnimationInstant(options);
|
||||
options.repeat = 0;
|
||||
}
|
||||
/**
|
||||
* Resolve startTime for the animation.
|
||||
*
|
||||
* This method uses the createdAt and resolvedAt to calculate the
|
||||
* animation startTime. *Ideally*, we would use the createdAt time as t=0
|
||||
* as the following frame would then be the first frame of the animation in
|
||||
* progress, which would feel snappier.
|
||||
*
|
||||
* However, if there's a delay (main thread work) between the creation of
|
||||
* the animation and the first committed frame, we prefer to use resolvedAt
|
||||
* to avoid a sudden jump into the animation.
|
||||
*/
|
||||
const startTime = sync
|
||||
? !this.resolvedAt
|
||||
? this.createdAt
|
||||
: this.resolvedAt - this.createdAt > MAX_RESOLVE_DELAY
|
||||
? this.resolvedAt
|
||||
: this.createdAt
|
||||
: undefined;
|
||||
const resolvedOptions = {
|
||||
startTime,
|
||||
finalKeyframe,
|
||||
...options,
|
||||
keyframes,
|
||||
};
|
||||
/**
|
||||
* Animate via WAAPI if possible. If this is a handoff animation, the optimised animation will be running via
|
||||
* WAAPI. Therefore, this animation must be JS to ensure it runs "under" the
|
||||
* optimised animation.
|
||||
*
|
||||
* Also skip WAAPI when keyframes aren't animatable, as the resolved
|
||||
* values may not be valid CSS and would trigger browser warnings.
|
||||
*/
|
||||
const useWaapi = canAnimateValue &&
|
||||
!isHandoff &&
|
||||
supportsBrowserAnimation(resolvedOptions);
|
||||
const element = resolvedOptions.motionValue?.owner?.current;
|
||||
let animation;
|
||||
if (useWaapi) {
|
||||
try {
|
||||
animation = new NativeAnimationExtended({
|
||||
...resolvedOptions,
|
||||
element,
|
||||
});
|
||||
}
|
||||
catch {
|
||||
animation = new JSAnimation(resolvedOptions);
|
||||
}
|
||||
}
|
||||
else {
|
||||
animation = new JSAnimation(resolvedOptions);
|
||||
}
|
||||
animation.finished.then(() => {
|
||||
this.notifyFinished();
|
||||
}).catch(noop);
|
||||
if (this.pendingTimeline) {
|
||||
this.stopTimeline = animation.attachTimeline(this.pendingTimeline);
|
||||
this.pendingTimeline = undefined;
|
||||
}
|
||||
this._animation = animation;
|
||||
}
|
||||
get finished() {
|
||||
if (!this._animation) {
|
||||
return this._finished;
|
||||
}
|
||||
else {
|
||||
return this.animation.finished;
|
||||
}
|
||||
}
|
||||
then(onResolve, _onReject) {
|
||||
return this.finished.finally(onResolve).then(() => { });
|
||||
}
|
||||
get animation() {
|
||||
if (!this._animation) {
|
||||
this.keyframeResolver?.resume();
|
||||
flushKeyframeResolvers();
|
||||
}
|
||||
return this._animation;
|
||||
}
|
||||
get duration() {
|
||||
return this.animation.duration;
|
||||
}
|
||||
get iterationDuration() {
|
||||
return this.animation.iterationDuration;
|
||||
}
|
||||
get time() {
|
||||
return this.animation.time;
|
||||
}
|
||||
set time(newTime) {
|
||||
this.animation.time = newTime;
|
||||
}
|
||||
get speed() {
|
||||
return this.animation.speed;
|
||||
}
|
||||
get state() {
|
||||
return this.animation.state;
|
||||
}
|
||||
set speed(newSpeed) {
|
||||
this.animation.speed = newSpeed;
|
||||
}
|
||||
get startTime() {
|
||||
return this.animation.startTime;
|
||||
}
|
||||
attachTimeline(timeline) {
|
||||
if (this._animation) {
|
||||
this.stopTimeline = this.animation.attachTimeline(timeline);
|
||||
}
|
||||
else {
|
||||
this.pendingTimeline = timeline;
|
||||
}
|
||||
return () => this.stop();
|
||||
}
|
||||
play() {
|
||||
this.animation.play();
|
||||
}
|
||||
pause() {
|
||||
this.animation.pause();
|
||||
}
|
||||
complete() {
|
||||
this.animation.complete();
|
||||
}
|
||||
cancel() {
|
||||
if (this._animation) {
|
||||
this.animation.cancel();
|
||||
}
|
||||
this.keyframeResolver?.cancel();
|
||||
}
|
||||
}
|
||||
|
||||
export { AsyncMotionValueAnimation };
|
||||
//# sourceMappingURL=AsyncMotionValueAnimation.mjs.map
|
||||
1
node_modules/motion-dom/dist/es/animation/AsyncMotionValueAnimation.mjs.map
generated
vendored
Normal file
1
node_modules/motion-dom/dist/es/animation/AsyncMotionValueAnimation.mjs.map
generated
vendored
Normal file
File diff suppressed because one or more lines are too long
82
node_modules/motion-dom/dist/es/animation/GroupAnimation.mjs
generated
vendored
Normal file
82
node_modules/motion-dom/dist/es/animation/GroupAnimation.mjs
generated
vendored
Normal file
@@ -0,0 +1,82 @@
|
||||
class GroupAnimation {
|
||||
constructor(animations) {
|
||||
// Bound to accomadate common `return animation.stop` pattern
|
||||
this.stop = () => this.runAll("stop");
|
||||
this.animations = animations.filter(Boolean);
|
||||
}
|
||||
get finished() {
|
||||
return Promise.all(this.animations.map((animation) => animation.finished));
|
||||
}
|
||||
/**
|
||||
* TODO: Filter out cancelled or stopped animations before returning
|
||||
*/
|
||||
getAll(propName) {
|
||||
return this.animations[0][propName];
|
||||
}
|
||||
setAll(propName, newValue) {
|
||||
for (let i = 0; i < this.animations.length; i++) {
|
||||
this.animations[i][propName] = newValue;
|
||||
}
|
||||
}
|
||||
attachTimeline(timeline) {
|
||||
const subscriptions = this.animations.map((animation) => animation.attachTimeline(timeline));
|
||||
return () => {
|
||||
subscriptions.forEach((cancel, i) => {
|
||||
cancel && cancel();
|
||||
this.animations[i].stop();
|
||||
});
|
||||
};
|
||||
}
|
||||
get time() {
|
||||
return this.getAll("time");
|
||||
}
|
||||
set time(time) {
|
||||
this.setAll("time", time);
|
||||
}
|
||||
get speed() {
|
||||
return this.getAll("speed");
|
||||
}
|
||||
set speed(speed) {
|
||||
this.setAll("speed", speed);
|
||||
}
|
||||
get state() {
|
||||
return this.getAll("state");
|
||||
}
|
||||
get startTime() {
|
||||
return this.getAll("startTime");
|
||||
}
|
||||
get duration() {
|
||||
return getMax(this.animations, "duration");
|
||||
}
|
||||
get iterationDuration() {
|
||||
return getMax(this.animations, "iterationDuration");
|
||||
}
|
||||
runAll(methodName) {
|
||||
this.animations.forEach((controls) => controls[methodName]());
|
||||
}
|
||||
play() {
|
||||
this.runAll("play");
|
||||
}
|
||||
pause() {
|
||||
this.runAll("pause");
|
||||
}
|
||||
cancel() {
|
||||
this.runAll("cancel");
|
||||
}
|
||||
complete() {
|
||||
this.runAll("complete");
|
||||
}
|
||||
}
|
||||
function getMax(animations, propName) {
|
||||
let max = 0;
|
||||
for (let i = 0; i < animations.length; i++) {
|
||||
const value = animations[i][propName];
|
||||
if (value !== null && value > max) {
|
||||
max = value;
|
||||
}
|
||||
}
|
||||
return max;
|
||||
}
|
||||
|
||||
export { GroupAnimation };
|
||||
//# sourceMappingURL=GroupAnimation.mjs.map
|
||||
1
node_modules/motion-dom/dist/es/animation/GroupAnimation.mjs.map
generated
vendored
Normal file
1
node_modules/motion-dom/dist/es/animation/GroupAnimation.mjs.map
generated
vendored
Normal file
File diff suppressed because one or more lines are too long
10
node_modules/motion-dom/dist/es/animation/GroupAnimationWithThen.mjs
generated
vendored
Normal file
10
node_modules/motion-dom/dist/es/animation/GroupAnimationWithThen.mjs
generated
vendored
Normal file
@@ -0,0 +1,10 @@
|
||||
import { GroupAnimation } from './GroupAnimation.mjs';
|
||||
|
||||
class GroupAnimationWithThen extends GroupAnimation {
|
||||
then(onResolve, _onReject) {
|
||||
return this.finished.finally(onResolve).then(() => { });
|
||||
}
|
||||
}
|
||||
|
||||
export { GroupAnimationWithThen };
|
||||
//# sourceMappingURL=GroupAnimationWithThen.mjs.map
|
||||
1
node_modules/motion-dom/dist/es/animation/GroupAnimationWithThen.mjs.map
generated
vendored
Normal file
1
node_modules/motion-dom/dist/es/animation/GroupAnimationWithThen.mjs.map
generated
vendored
Normal file
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"GroupAnimationWithThen.mjs","sources":["../../../src/animation/GroupAnimationWithThen.ts"],"sourcesContent":["import { GroupAnimation } from \"./GroupAnimation\"\nimport { AnimationPlaybackControlsWithThen } from \"./types\"\n\nexport class GroupAnimationWithThen\n extends GroupAnimation\n implements AnimationPlaybackControlsWithThen\n{\n then(onResolve: VoidFunction, _onReject?: VoidFunction) {\n return this.finished.finally(onResolve).then(() => {})\n }\n}\n"],"names":[],"mappings":";;AAGM,MAAO,sBACT,SAAQ,cAAc,CAAA;IAGtB,IAAI,CAAC,SAAuB,EAAE,SAAwB,EAAA;AAClD,QAAA,OAAO,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,SAAS,CAAC,CAAC,IAAI,CAAC,MAAK,EAAE,CAAC,CAAC;IAC1D;AACH;;;;"}
|
||||
390
node_modules/motion-dom/dist/es/animation/JSAnimation.mjs
generated
vendored
Normal file
390
node_modules/motion-dom/dist/es/animation/JSAnimation.mjs
generated
vendored
Normal file
@@ -0,0 +1,390 @@
|
||||
import { invariant, pipe, clamp, millisecondsToSeconds, secondsToMilliseconds } from 'motion-utils';
|
||||
import { time } from '../frameloop/sync-time.mjs';
|
||||
import { activeAnimations } from '../stats/animation-count.mjs';
|
||||
import { mix } from '../utils/mix/index.mjs';
|
||||
import { frameloopDriver } from './drivers/frame.mjs';
|
||||
import { inertia } from './generators/inertia.mjs';
|
||||
import { keyframes } from './generators/keyframes.mjs';
|
||||
import { calcGeneratorDuration } from './generators/utils/calc-duration.mjs';
|
||||
import { getGeneratorVelocity } from './generators/utils/velocity.mjs';
|
||||
import { getFinalKeyframe } from './keyframes/get-final.mjs';
|
||||
import { replaceTransitionType } from './utils/replace-transition-type.mjs';
|
||||
import { WithPromise } from './utils/WithPromise.mjs';
|
||||
|
||||
const percentToProgress = (percent) => percent / 100;
|
||||
class JSAnimation extends WithPromise {
|
||||
constructor(options) {
|
||||
super();
|
||||
this.state = "idle";
|
||||
this.startTime = null;
|
||||
this.isStopped = false;
|
||||
/**
|
||||
* The current time of the animation.
|
||||
*/
|
||||
this.currentTime = 0;
|
||||
/**
|
||||
* The time at which the animation was paused.
|
||||
*/
|
||||
this.holdTime = null;
|
||||
/**
|
||||
* Playback speed as a factor. 0 would be stopped, -1 reverse and 2 double speed.
|
||||
*/
|
||||
this.playbackSpeed = 1;
|
||||
/**
|
||||
* Reusable state object for the delay phase to avoid
|
||||
* allocating a new object every frame.
|
||||
*/
|
||||
this.delayState = {
|
||||
done: false,
|
||||
value: undefined,
|
||||
};
|
||||
/**
|
||||
* This method is bound to the instance to fix a pattern where
|
||||
* animation.stop is returned as a reference from a useEffect.
|
||||
*/
|
||||
this.stop = () => {
|
||||
const { motionValue } = this.options;
|
||||
if (motionValue && motionValue.updatedAt !== time.now()) {
|
||||
this.tick(time.now());
|
||||
}
|
||||
this.isStopped = true;
|
||||
if (this.state === "idle")
|
||||
return;
|
||||
this.teardown();
|
||||
this.options.onStop?.();
|
||||
};
|
||||
activeAnimations.mainThread++;
|
||||
this.options = options;
|
||||
this.initAnimation();
|
||||
this.play();
|
||||
if (options.autoplay === false)
|
||||
this.pause();
|
||||
}
|
||||
initAnimation() {
|
||||
const { options } = this;
|
||||
replaceTransitionType(options);
|
||||
const { type = keyframes, repeat = 0, repeatDelay = 0, repeatType, velocity = 0, } = options;
|
||||
let { keyframes: keyframes$1 } = options;
|
||||
const generatorFactory = type || keyframes;
|
||||
if (process.env.NODE_ENV !== "production" &&
|
||||
generatorFactory !== keyframes) {
|
||||
invariant(keyframes$1.length <= 2, `Only two keyframes currently supported with spring and inertia animations. Trying to animate ${keyframes$1}`, "spring-two-frames");
|
||||
}
|
||||
if (generatorFactory !== keyframes &&
|
||||
typeof keyframes$1[0] !== "number") {
|
||||
this.mixKeyframes = pipe(percentToProgress, mix(keyframes$1[0], keyframes$1[1]));
|
||||
keyframes$1 = [0, 100];
|
||||
}
|
||||
const generator = generatorFactory({ ...options, keyframes: keyframes$1 });
|
||||
/**
|
||||
* If we have a mirror repeat type we need to create a second generator that outputs the
|
||||
* mirrored (not reversed) animation and later ping pong between the two generators.
|
||||
*/
|
||||
if (repeatType === "mirror") {
|
||||
this.mirroredGenerator = generatorFactory({
|
||||
...options,
|
||||
keyframes: [...keyframes$1].reverse(),
|
||||
velocity: -velocity,
|
||||
});
|
||||
}
|
||||
/**
|
||||
* If duration is undefined and we have repeat options,
|
||||
* we need to calculate a duration from the generator.
|
||||
*
|
||||
* We set it to the generator itself to cache the duration.
|
||||
* Any timeline resolver will need to have already precalculated
|
||||
* the duration by this step.
|
||||
*/
|
||||
if (generator.calculatedDuration === null) {
|
||||
generator.calculatedDuration = calcGeneratorDuration(generator);
|
||||
}
|
||||
const { calculatedDuration } = generator;
|
||||
this.calculatedDuration = calculatedDuration;
|
||||
this.resolvedDuration = calculatedDuration + repeatDelay;
|
||||
this.totalDuration = this.resolvedDuration * (repeat + 1) - repeatDelay;
|
||||
this.generator = generator;
|
||||
}
|
||||
updateTime(timestamp) {
|
||||
const animationTime = Math.round(timestamp - this.startTime) * this.playbackSpeed;
|
||||
// Update currentTime
|
||||
if (this.holdTime !== null) {
|
||||
this.currentTime = this.holdTime;
|
||||
}
|
||||
else {
|
||||
// Rounding the time because floating point arithmetic is not always accurate, e.g. 3000.367 - 1000.367 =
|
||||
// 2000.0000000000002. This is a problem when we are comparing the currentTime with the duration, for
|
||||
// example.
|
||||
this.currentTime = animationTime;
|
||||
}
|
||||
}
|
||||
tick(timestamp, sample = false) {
|
||||
const { generator, totalDuration, mixKeyframes, mirroredGenerator, resolvedDuration, calculatedDuration, } = this;
|
||||
if (this.startTime === null)
|
||||
return generator.next(0);
|
||||
const { delay = 0, keyframes, repeat, repeatType, repeatDelay, type, onUpdate, finalKeyframe, } = this.options;
|
||||
/**
|
||||
* requestAnimationFrame timestamps can come through as lower than
|
||||
* the startTime as set by performance.now(). Here we prevent this,
|
||||
* though in the future it could be possible to make setting startTime
|
||||
* a pending operation that gets resolved here.
|
||||
*/
|
||||
if (this.speed > 0) {
|
||||
this.startTime = Math.min(this.startTime, timestamp);
|
||||
}
|
||||
else if (this.speed < 0) {
|
||||
this.startTime = Math.min(timestamp - totalDuration / this.speed, this.startTime);
|
||||
}
|
||||
if (sample) {
|
||||
this.currentTime = timestamp;
|
||||
}
|
||||
else {
|
||||
this.updateTime(timestamp);
|
||||
}
|
||||
// Rebase on delay
|
||||
const timeWithoutDelay = this.currentTime - delay * (this.playbackSpeed >= 0 ? 1 : -1);
|
||||
const isInDelayPhase = this.playbackSpeed >= 0
|
||||
? timeWithoutDelay < 0
|
||||
: timeWithoutDelay > totalDuration;
|
||||
this.currentTime = Math.max(timeWithoutDelay, 0);
|
||||
// If this animation has finished, set the current time to the total duration.
|
||||
if (this.state === "finished" && this.holdTime === null) {
|
||||
this.currentTime = totalDuration;
|
||||
}
|
||||
let elapsed = this.currentTime;
|
||||
let frameGenerator = generator;
|
||||
if (repeat) {
|
||||
/**
|
||||
* Get the current progress (0-1) of the animation. If t is >
|
||||
* than duration we'll get values like 2.5 (midway through the
|
||||
* third iteration)
|
||||
*/
|
||||
const progress = Math.min(this.currentTime, totalDuration) / resolvedDuration;
|
||||
/**
|
||||
* Get the current iteration (0 indexed). For instance the floor of
|
||||
* 2.5 is 2.
|
||||
*/
|
||||
let currentIteration = Math.floor(progress);
|
||||
/**
|
||||
* Get the current progress of the iteration by taking the remainder
|
||||
* so 2.5 is 0.5 through iteration 2
|
||||
*/
|
||||
let iterationProgress = progress % 1.0;
|
||||
/**
|
||||
* If iteration progress is 1 we count that as the end
|
||||
* of the previous iteration.
|
||||
*/
|
||||
if (!iterationProgress && progress >= 1) {
|
||||
iterationProgress = 1;
|
||||
}
|
||||
iterationProgress === 1 && currentIteration--;
|
||||
currentIteration = Math.min(currentIteration, repeat + 1);
|
||||
/**
|
||||
* Reverse progress if we're not running in "normal" direction
|
||||
*/
|
||||
const isOddIteration = Boolean(currentIteration % 2);
|
||||
if (isOddIteration) {
|
||||
if (repeatType === "reverse") {
|
||||
iterationProgress = 1 - iterationProgress;
|
||||
if (repeatDelay) {
|
||||
iterationProgress -= repeatDelay / resolvedDuration;
|
||||
}
|
||||
}
|
||||
else if (repeatType === "mirror") {
|
||||
frameGenerator = mirroredGenerator;
|
||||
}
|
||||
}
|
||||
elapsed = clamp(0, 1, iterationProgress) * resolvedDuration;
|
||||
}
|
||||
/**
|
||||
* If we're in negative time, set state as the initial keyframe.
|
||||
* This prevents delay: x, duration: 0 animations from finishing
|
||||
* instantly.
|
||||
*/
|
||||
let state;
|
||||
if (isInDelayPhase) {
|
||||
this.delayState.value = keyframes[0];
|
||||
state = this.delayState;
|
||||
}
|
||||
else {
|
||||
state = frameGenerator.next(elapsed);
|
||||
}
|
||||
if (mixKeyframes && !isInDelayPhase) {
|
||||
state.value = mixKeyframes(state.value);
|
||||
}
|
||||
let { done } = state;
|
||||
if (!isInDelayPhase && calculatedDuration !== null) {
|
||||
done =
|
||||
this.playbackSpeed >= 0
|
||||
? this.currentTime >= totalDuration
|
||||
: this.currentTime <= 0;
|
||||
}
|
||||
const isAnimationFinished = this.holdTime === null &&
|
||||
(this.state === "finished" || (this.state === "running" && done));
|
||||
// TODO: The exception for inertia could be cleaner here
|
||||
if (isAnimationFinished && type !== inertia) {
|
||||
state.value = getFinalKeyframe(keyframes, this.options, finalKeyframe, this.speed);
|
||||
}
|
||||
if (onUpdate) {
|
||||
onUpdate(state.value);
|
||||
}
|
||||
if (isAnimationFinished) {
|
||||
this.finish();
|
||||
}
|
||||
return state;
|
||||
}
|
||||
/**
|
||||
* Allows the returned animation to be awaited or promise-chained. Currently
|
||||
* resolves when the animation finishes at all but in a future update could/should
|
||||
* reject if its cancels.
|
||||
*/
|
||||
then(resolve, reject) {
|
||||
return this.finished.then(resolve, reject);
|
||||
}
|
||||
get duration() {
|
||||
return millisecondsToSeconds(this.calculatedDuration);
|
||||
}
|
||||
get iterationDuration() {
|
||||
const { delay = 0 } = this.options || {};
|
||||
return this.duration + millisecondsToSeconds(delay);
|
||||
}
|
||||
get time() {
|
||||
return millisecondsToSeconds(this.currentTime);
|
||||
}
|
||||
set time(newTime) {
|
||||
newTime = secondsToMilliseconds(newTime);
|
||||
this.currentTime = newTime;
|
||||
if (this.startTime === null ||
|
||||
this.holdTime !== null ||
|
||||
this.playbackSpeed === 0) {
|
||||
this.holdTime = newTime;
|
||||
}
|
||||
else if (this.driver) {
|
||||
this.startTime = this.driver.now() - newTime / this.playbackSpeed;
|
||||
}
|
||||
if (this.driver) {
|
||||
this.driver.start(false);
|
||||
}
|
||||
else {
|
||||
this.startTime = 0;
|
||||
this.state = "paused";
|
||||
this.holdTime = newTime;
|
||||
this.tick(newTime);
|
||||
}
|
||||
}
|
||||
/**
|
||||
* Returns the generator's velocity at the current time in units/second.
|
||||
* Uses the analytical derivative when available (springs), avoiding
|
||||
* the MotionValue's frame-dependent velocity estimation.
|
||||
*/
|
||||
getGeneratorVelocity() {
|
||||
const t = this.currentTime;
|
||||
if (t <= 0)
|
||||
return this.options.velocity || 0;
|
||||
if (this.generator.velocity) {
|
||||
return this.generator.velocity(t);
|
||||
}
|
||||
// Fallback: finite difference
|
||||
const current = this.generator.next(t).value;
|
||||
return getGeneratorVelocity((s) => this.generator.next(s).value, t, current);
|
||||
}
|
||||
get speed() {
|
||||
return this.playbackSpeed;
|
||||
}
|
||||
set speed(newSpeed) {
|
||||
const hasChanged = this.playbackSpeed !== newSpeed;
|
||||
if (hasChanged && this.driver) {
|
||||
this.updateTime(time.now());
|
||||
}
|
||||
this.playbackSpeed = newSpeed;
|
||||
if (hasChanged && this.driver) {
|
||||
this.time = millisecondsToSeconds(this.currentTime);
|
||||
}
|
||||
}
|
||||
play() {
|
||||
if (this.isStopped)
|
||||
return;
|
||||
const { driver = frameloopDriver, startTime } = this.options;
|
||||
if (!this.driver) {
|
||||
this.driver = driver((timestamp) => this.tick(timestamp));
|
||||
}
|
||||
this.options.onPlay?.();
|
||||
const now = this.driver.now();
|
||||
if (this.state === "finished") {
|
||||
this.updateFinished();
|
||||
this.startTime = now;
|
||||
}
|
||||
else if (this.holdTime !== null) {
|
||||
this.startTime = now - this.holdTime;
|
||||
}
|
||||
else if (!this.startTime) {
|
||||
this.startTime = startTime ?? now;
|
||||
}
|
||||
if (this.state === "finished" && this.speed < 0) {
|
||||
this.startTime += this.calculatedDuration;
|
||||
}
|
||||
this.holdTime = null;
|
||||
/**
|
||||
* Set playState to running only after we've used it in
|
||||
* the previous logic.
|
||||
*/
|
||||
this.state = "running";
|
||||
this.driver.start();
|
||||
}
|
||||
pause() {
|
||||
this.state = "paused";
|
||||
this.updateTime(time.now());
|
||||
this.holdTime = this.currentTime;
|
||||
}
|
||||
complete() {
|
||||
if (this.state !== "running") {
|
||||
this.play();
|
||||
}
|
||||
this.state = "finished";
|
||||
this.holdTime = null;
|
||||
}
|
||||
finish() {
|
||||
this.notifyFinished();
|
||||
this.teardown();
|
||||
this.state = "finished";
|
||||
this.options.onComplete?.();
|
||||
}
|
||||
cancel() {
|
||||
this.holdTime = null;
|
||||
this.startTime = 0;
|
||||
this.tick(0);
|
||||
this.teardown();
|
||||
this.options.onCancel?.();
|
||||
}
|
||||
teardown() {
|
||||
this.state = "idle";
|
||||
this.stopDriver();
|
||||
this.startTime = this.holdTime = null;
|
||||
activeAnimations.mainThread--;
|
||||
}
|
||||
stopDriver() {
|
||||
if (!this.driver)
|
||||
return;
|
||||
this.driver.stop();
|
||||
this.driver = undefined;
|
||||
}
|
||||
sample(sampleTime) {
|
||||
this.startTime = 0;
|
||||
return this.tick(sampleTime, true);
|
||||
}
|
||||
attachTimeline(timeline) {
|
||||
if (this.options.allowFlatten) {
|
||||
this.options.type = "keyframes";
|
||||
this.options.ease = "linear";
|
||||
this.initAnimation();
|
||||
}
|
||||
this.driver?.stop();
|
||||
return timeline.observe(this);
|
||||
}
|
||||
}
|
||||
// Legacy function support
|
||||
function animateValue(options) {
|
||||
return new JSAnimation(options);
|
||||
}
|
||||
|
||||
export { JSAnimation, animateValue };
|
||||
//# sourceMappingURL=JSAnimation.mjs.map
|
||||
1
node_modules/motion-dom/dist/es/animation/JSAnimation.mjs.map
generated
vendored
Normal file
1
node_modules/motion-dom/dist/es/animation/JSAnimation.mjs.map
generated
vendored
Normal file
File diff suppressed because one or more lines are too long
179
node_modules/motion-dom/dist/es/animation/NativeAnimation.mjs
generated
vendored
Normal file
179
node_modules/motion-dom/dist/es/animation/NativeAnimation.mjs
generated
vendored
Normal file
@@ -0,0 +1,179 @@
|
||||
import { invariant, millisecondsToSeconds, secondsToMilliseconds, noop } from 'motion-utils';
|
||||
import { setStyle } from '../render/dom/style-set.mjs';
|
||||
import { supportsScrollTimeline } from '../utils/supports/scroll-timeline.mjs';
|
||||
import { getFinalKeyframe } from './keyframes/get-final.mjs';
|
||||
import { WithPromise } from './utils/WithPromise.mjs';
|
||||
import { startWaapiAnimation } from './waapi/start-waapi-animation.mjs';
|
||||
import { applyGeneratorOptions } from './waapi/utils/apply-generator.mjs';
|
||||
|
||||
/**
|
||||
* NativeAnimation implements AnimationPlaybackControls for the browser's Web Animations API.
|
||||
*/
|
||||
class NativeAnimation extends WithPromise {
|
||||
constructor(options) {
|
||||
super();
|
||||
this.finishedTime = null;
|
||||
this.isStopped = false;
|
||||
/**
|
||||
* Tracks a manually-set start time that takes precedence over WAAPI's
|
||||
* dynamic startTime. This is cleared when play() or time setter is called,
|
||||
* allowing WAAPI to take over timing.
|
||||
*/
|
||||
this.manualStartTime = null;
|
||||
if (!options)
|
||||
return;
|
||||
const { element, name, keyframes, pseudoElement, allowFlatten = false, finalKeyframe, onComplete, } = options;
|
||||
this.isPseudoElement = Boolean(pseudoElement);
|
||||
this.allowFlatten = allowFlatten;
|
||||
this.options = options;
|
||||
invariant(typeof options.type !== "string", `Mini animate() doesn't support "type" as a string.`, "mini-spring");
|
||||
const transition = applyGeneratorOptions(options);
|
||||
this.animation = startWaapiAnimation(element, name, keyframes, transition, pseudoElement);
|
||||
if (transition.autoplay === false) {
|
||||
this.animation.pause();
|
||||
}
|
||||
this.animation.onfinish = () => {
|
||||
this.finishedTime = this.time;
|
||||
if (!pseudoElement) {
|
||||
const keyframe = getFinalKeyframe(keyframes, this.options, finalKeyframe, this.speed);
|
||||
if (this.updateMotionValue) {
|
||||
this.updateMotionValue(keyframe);
|
||||
}
|
||||
/**
|
||||
* If we can, we want to commit the final style as set by the user,
|
||||
* rather than the computed keyframe value supplied by the animation.
|
||||
* We always do this, even when a motion value is present, to prevent
|
||||
* a visual flash in Firefox where the WAAPI animation's fill is removed
|
||||
* during cancel() before the scheduled render can apply the correct value.
|
||||
*/
|
||||
setStyle(element, name, keyframe);
|
||||
this.animation.cancel();
|
||||
}
|
||||
onComplete?.();
|
||||
this.notifyFinished();
|
||||
};
|
||||
}
|
||||
play() {
|
||||
if (this.isStopped)
|
||||
return;
|
||||
this.manualStartTime = null;
|
||||
this.animation.play();
|
||||
if (this.state === "finished") {
|
||||
this.updateFinished();
|
||||
}
|
||||
}
|
||||
pause() {
|
||||
this.animation.pause();
|
||||
}
|
||||
complete() {
|
||||
this.animation.finish?.();
|
||||
}
|
||||
cancel() {
|
||||
try {
|
||||
this.animation.cancel();
|
||||
}
|
||||
catch (e) { }
|
||||
}
|
||||
stop() {
|
||||
if (this.isStopped)
|
||||
return;
|
||||
this.isStopped = true;
|
||||
const { state } = this;
|
||||
if (state === "idle" || state === "finished") {
|
||||
return;
|
||||
}
|
||||
if (this.updateMotionValue) {
|
||||
this.updateMotionValue();
|
||||
}
|
||||
else {
|
||||
this.commitStyles();
|
||||
}
|
||||
if (!this.isPseudoElement)
|
||||
this.cancel();
|
||||
}
|
||||
/**
|
||||
* WAAPI doesn't natively have any interruption capabilities.
|
||||
*
|
||||
* In this method, we commit styles back to the DOM before cancelling
|
||||
* the animation.
|
||||
*
|
||||
* This is designed to be overridden by NativeAnimationExtended, which
|
||||
* will create a renderless JS animation and sample it twice to calculate
|
||||
* its current value, "previous" value, and therefore allow
|
||||
* Motion to also correctly calculate velocity for any subsequent animation
|
||||
* while deferring the commit until the next animation frame.
|
||||
*/
|
||||
commitStyles() {
|
||||
const element = this.options?.element;
|
||||
if (!this.isPseudoElement && element?.isConnected) {
|
||||
this.animation.commitStyles?.();
|
||||
}
|
||||
}
|
||||
get duration() {
|
||||
const duration = this.animation.effect?.getComputedTiming?.().duration || 0;
|
||||
return millisecondsToSeconds(Number(duration));
|
||||
}
|
||||
get iterationDuration() {
|
||||
const { delay = 0 } = this.options || {};
|
||||
return this.duration + millisecondsToSeconds(delay);
|
||||
}
|
||||
get time() {
|
||||
return millisecondsToSeconds(Number(this.animation.currentTime) || 0);
|
||||
}
|
||||
set time(newTime) {
|
||||
const wasFinished = this.finishedTime !== null;
|
||||
this.manualStartTime = null;
|
||||
this.finishedTime = null;
|
||||
this.animation.currentTime = secondsToMilliseconds(newTime);
|
||||
if (wasFinished) {
|
||||
this.animation.pause();
|
||||
}
|
||||
}
|
||||
/**
|
||||
* The playback speed of the animation.
|
||||
* 1 = normal speed, 2 = double speed, 0.5 = half speed.
|
||||
*/
|
||||
get speed() {
|
||||
return this.animation.playbackRate;
|
||||
}
|
||||
set speed(newSpeed) {
|
||||
// Allow backwards playback after finishing
|
||||
if (newSpeed < 0)
|
||||
this.finishedTime = null;
|
||||
this.animation.playbackRate = newSpeed;
|
||||
}
|
||||
get state() {
|
||||
return this.finishedTime !== null
|
||||
? "finished"
|
||||
: this.animation.playState;
|
||||
}
|
||||
get startTime() {
|
||||
return this.manualStartTime ?? Number(this.animation.startTime);
|
||||
}
|
||||
set startTime(newStartTime) {
|
||||
this.manualStartTime = this.animation.startTime = newStartTime;
|
||||
}
|
||||
/**
|
||||
* Attaches a timeline to the animation, for instance the `ScrollTimeline`.
|
||||
*/
|
||||
attachTimeline({ timeline, rangeStart, rangeEnd, observe, }) {
|
||||
if (this.allowFlatten) {
|
||||
this.animation.effect?.updateTiming({ easing: "linear" });
|
||||
}
|
||||
this.animation.onfinish = null;
|
||||
if (timeline && supportsScrollTimeline()) {
|
||||
this.animation.timeline = timeline;
|
||||
if (rangeStart)
|
||||
this.animation.rangeStart = rangeStart;
|
||||
if (rangeEnd)
|
||||
this.animation.rangeEnd = rangeEnd;
|
||||
return noop;
|
||||
}
|
||||
else {
|
||||
return observe(this);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
export { NativeAnimation };
|
||||
//# sourceMappingURL=NativeAnimation.mjs.map
|
||||
1
node_modules/motion-dom/dist/es/animation/NativeAnimation.mjs.map
generated
vendored
Normal file
1
node_modules/motion-dom/dist/es/animation/NativeAnimation.mjs.map
generated
vendored
Normal file
File diff suppressed because one or more lines are too long
88
node_modules/motion-dom/dist/es/animation/NativeAnimationExtended.mjs
generated
vendored
Normal file
88
node_modules/motion-dom/dist/es/animation/NativeAnimationExtended.mjs
generated
vendored
Normal file
@@ -0,0 +1,88 @@
|
||||
import { clamp } from 'motion-utils';
|
||||
import { time } from '../frameloop/sync-time.mjs';
|
||||
import { setStyle } from '../render/dom/style-set.mjs';
|
||||
import { JSAnimation } from './JSAnimation.mjs';
|
||||
import { NativeAnimation } from './NativeAnimation.mjs';
|
||||
import { replaceTransitionType } from './utils/replace-transition-type.mjs';
|
||||
import { replaceStringEasing } from './waapi/utils/unsupported-easing.mjs';
|
||||
|
||||
/**
|
||||
* 10ms is chosen here as it strikes a balance between smooth
|
||||
* results (more than one keyframe per frame at 60fps) and
|
||||
* keyframe quantity.
|
||||
*/
|
||||
const sampleDelta = 10; //ms
|
||||
class NativeAnimationExtended extends NativeAnimation {
|
||||
constructor(options) {
|
||||
/**
|
||||
* The base NativeAnimation function only supports a subset
|
||||
* of Motion easings, and WAAPI also only supports some
|
||||
* easing functions via string/cubic-bezier definitions.
|
||||
*
|
||||
* This function replaces those unsupported easing functions
|
||||
* with a JS easing function. This will later get compiled
|
||||
* to a linear() easing function.
|
||||
*/
|
||||
replaceStringEasing(options);
|
||||
/**
|
||||
* Ensure we replace the transition type with a generator function
|
||||
* before passing to WAAPI.
|
||||
*
|
||||
* TODO: Does this have a better home? It could be shared with
|
||||
* JSAnimation.
|
||||
*/
|
||||
replaceTransitionType(options);
|
||||
super(options);
|
||||
/**
|
||||
* Only set startTime when the animation should autoplay.
|
||||
* Setting startTime on a paused WAAPI animation unpauses it
|
||||
* (per the WAAPI spec), which breaks autoplay: false.
|
||||
*/
|
||||
if (options.startTime !== undefined && options.autoplay !== false) {
|
||||
this.startTime = options.startTime;
|
||||
}
|
||||
this.options = options;
|
||||
}
|
||||
/**
|
||||
* WAAPI doesn't natively have any interruption capabilities.
|
||||
*
|
||||
* Rather than read committed styles back out of the DOM, we can
|
||||
* create a renderless JS animation and sample it twice to calculate
|
||||
* its current value, "previous" value, and therefore allow
|
||||
* Motion to calculate velocity for any subsequent animation.
|
||||
*/
|
||||
updateMotionValue(value) {
|
||||
const { motionValue, onUpdate, onComplete, element, ...options } = this.options;
|
||||
if (!motionValue)
|
||||
return;
|
||||
if (value !== undefined) {
|
||||
motionValue.set(value);
|
||||
return;
|
||||
}
|
||||
const sampleAnimation = new JSAnimation({
|
||||
...options,
|
||||
autoplay: false,
|
||||
});
|
||||
/**
|
||||
* Use wall-clock elapsed time for sampling.
|
||||
* Under CPU load, WAAPI's currentTime may not reflect actual
|
||||
* elapsed time, causing incorrect sampling and visual jumps.
|
||||
*/
|
||||
const sampleTime = Math.max(sampleDelta, time.now() - this.startTime);
|
||||
const delta = clamp(0, sampleDelta, sampleTime - sampleDelta);
|
||||
const current = sampleAnimation.sample(sampleTime).value;
|
||||
/**
|
||||
* Write the estimated value to inline style so it persists
|
||||
* after cancel(), covering the async gap before the next
|
||||
* animation starts.
|
||||
*/
|
||||
const { name } = this.options;
|
||||
if (element && name)
|
||||
setStyle(element, name, current);
|
||||
motionValue.setWithVelocity(sampleAnimation.sample(Math.max(0, sampleTime - delta)).value, current, delta);
|
||||
sampleAnimation.stop();
|
||||
}
|
||||
}
|
||||
|
||||
export { NativeAnimationExtended };
|
||||
//# sourceMappingURL=NativeAnimationExtended.mjs.map
|
||||
1
node_modules/motion-dom/dist/es/animation/NativeAnimationExtended.mjs.map
generated
vendored
Normal file
1
node_modules/motion-dom/dist/es/animation/NativeAnimationExtended.mjs.map
generated
vendored
Normal file
File diff suppressed because one or more lines are too long
15
node_modules/motion-dom/dist/es/animation/NativeAnimationWrapper.mjs
generated
vendored
Normal file
15
node_modules/motion-dom/dist/es/animation/NativeAnimationWrapper.mjs
generated
vendored
Normal file
@@ -0,0 +1,15 @@
|
||||
import { NativeAnimation } from './NativeAnimation.mjs';
|
||||
|
||||
class NativeAnimationWrapper extends NativeAnimation {
|
||||
constructor(animation) {
|
||||
super();
|
||||
this.animation = animation;
|
||||
animation.onfinish = () => {
|
||||
this.finishedTime = this.time;
|
||||
this.notifyFinished();
|
||||
};
|
||||
}
|
||||
}
|
||||
|
||||
export { NativeAnimationWrapper };
|
||||
//# sourceMappingURL=NativeAnimationWrapper.mjs.map
|
||||
1
node_modules/motion-dom/dist/es/animation/NativeAnimationWrapper.mjs.map
generated
vendored
Normal file
1
node_modules/motion-dom/dist/es/animation/NativeAnimationWrapper.mjs.map
generated
vendored
Normal file
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"NativeAnimationWrapper.mjs","sources":["../../../src/animation/NativeAnimationWrapper.ts"],"sourcesContent":["import { NativeAnimation } from \"./NativeAnimation\"\nimport { AnyResolvedKeyframe } from \"./types\"\n\nexport class NativeAnimationWrapper<\n T extends AnyResolvedKeyframe\n> extends NativeAnimation<T> {\n constructor(animation: Animation) {\n super()\n\n this.animation = animation\n animation.onfinish = () => {\n this.finishedTime = this.time\n this.notifyFinished()\n }\n }\n}\n"],"names":[],"mappings":";;AAGM,MAAO,sBAEX,SAAQ,eAAkB,CAAA;AACxB,IAAA,WAAA,CAAY,SAAoB,EAAA;AAC5B,QAAA,KAAK,EAAE;AAEP,QAAA,IAAI,CAAC,SAAS,GAAG,SAAS;AAC1B,QAAA,SAAS,CAAC,QAAQ,GAAG,MAAK;AACtB,YAAA,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,IAAI;YAC7B,IAAI,CAAC,cAAc,EAAE;AACzB,QAAA,CAAC;IACL;AACH;;;;"}
|
||||
12
node_modules/motion-dom/dist/es/animation/animate/single-value.mjs
generated
vendored
Normal file
12
node_modules/motion-dom/dist/es/animation/animate/single-value.mjs
generated
vendored
Normal file
@@ -0,0 +1,12 @@
|
||||
import { animateMotionValue } from '../interfaces/motion-value.mjs';
|
||||
import { motionValue } from '../../value/index.mjs';
|
||||
import { isMotionValue } from '../../value/utils/is-motion-value.mjs';
|
||||
|
||||
function animateSingleValue(value, keyframes, options) {
|
||||
const motionValue$1 = isMotionValue(value) ? value : motionValue(value);
|
||||
motionValue$1.start(animateMotionValue("", motionValue$1, keyframes, options));
|
||||
return motionValue$1.animation;
|
||||
}
|
||||
|
||||
export { animateSingleValue };
|
||||
//# sourceMappingURL=single-value.mjs.map
|
||||
1
node_modules/motion-dom/dist/es/animation/animate/single-value.mjs.map
generated
vendored
Normal file
1
node_modules/motion-dom/dist/es/animation/animate/single-value.mjs.map
generated
vendored
Normal file
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"single-value.mjs","sources":["../../../../src/animation/animate/single-value.ts"],"sourcesContent":["import { animateMotionValue } from \"../interfaces/motion-value\"\nimport type {\n AnimationPlaybackControlsWithThen,\n AnyResolvedKeyframe,\n UnresolvedValueKeyframe,\n ValueAnimationTransition,\n} from \"../types\"\nimport {\n motionValue as createMotionValue,\n MotionValue,\n} from \"../../value\"\nimport { isMotionValue } from \"../../value/utils/is-motion-value\"\n\nexport function animateSingleValue<V extends AnyResolvedKeyframe>(\n value: MotionValue<V> | V,\n keyframes: V | UnresolvedValueKeyframe<V>[],\n options?: ValueAnimationTransition\n): AnimationPlaybackControlsWithThen {\n const motionValue = isMotionValue(value) ? value : createMotionValue(value)\n\n motionValue.start(animateMotionValue(\"\", motionValue, keyframes, options))\n\n return motionValue.animation!\n}\n"],"names":["motionValue","createMotionValue"],"mappings":";;;;SAagB,kBAAkB,CAC9B,KAAyB,EACzB,SAA2C,EAC3C,OAAkC,EAAA;AAElC,IAAA,MAAMA,aAAW,GAAG,aAAa,CAAC,KAAK,CAAC,GAAG,KAAK,GAAGC,WAAiB,CAAC,KAAK,CAAC;AAE3E,IAAAD,aAAW,CAAC,KAAK,CAAC,kBAAkB,CAAC,EAAE,EAAEA,aAAW,EAAE,SAAS,EAAE,OAAO,CAAC,CAAC;IAE1E,OAAOA,aAAW,CAAC,SAAU;AACjC;;;;"}
|
||||
18
node_modules/motion-dom/dist/es/animation/drivers/frame.mjs
generated
vendored
Normal file
18
node_modules/motion-dom/dist/es/animation/drivers/frame.mjs
generated
vendored
Normal file
@@ -0,0 +1,18 @@
|
||||
import { time } from '../../frameloop/sync-time.mjs';
|
||||
import { frameData, cancelFrame, frame } from '../../frameloop/frame.mjs';
|
||||
|
||||
const frameloopDriver = (update) => {
|
||||
const passTimestamp = ({ timestamp }) => update(timestamp);
|
||||
return {
|
||||
start: (keepAlive = true) => frame.update(passTimestamp, keepAlive),
|
||||
stop: () => cancelFrame(passTimestamp),
|
||||
/**
|
||||
* If we're processing this frame we can use the
|
||||
* framelocked timestamp to keep things in sync.
|
||||
*/
|
||||
now: () => (frameData.isProcessing ? frameData.timestamp : time.now()),
|
||||
};
|
||||
};
|
||||
|
||||
export { frameloopDriver };
|
||||
//# sourceMappingURL=frame.mjs.map
|
||||
1
node_modules/motion-dom/dist/es/animation/drivers/frame.mjs.map
generated
vendored
Normal file
1
node_modules/motion-dom/dist/es/animation/drivers/frame.mjs.map
generated
vendored
Normal file
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"frame.mjs","sources":["../../../../src/animation/drivers/frame.ts"],"sourcesContent":["import { cancelFrame, frame, frameData } from \"../../frameloop\"\nimport { time } from \"../../frameloop/sync-time\"\nimport { FrameData } from \"../../frameloop/types\"\nimport { Driver } from \"./types\"\n\nexport const frameloopDriver: Driver = (update) => {\n const passTimestamp = ({ timestamp }: FrameData) => update(timestamp)\n\n return {\n start: (keepAlive = true) => frame.update(passTimestamp, keepAlive),\n stop: () => cancelFrame(passTimestamp),\n /**\n * If we're processing this frame we can use the\n * framelocked timestamp to keep things in sync.\n */\n now: () => (frameData.isProcessing ? frameData.timestamp : time.now()),\n }\n}\n"],"names":[],"mappings":";;;AAKO,MAAM,eAAe,GAAW,CAAC,MAAM,KAAI;AAC9C,IAAA,MAAM,aAAa,GAAG,CAAC,EAAE,SAAS,EAAa,KAAK,MAAM,CAAC,SAAS,CAAC;IAErE,OAAO;AACH,QAAA,KAAK,EAAE,CAAC,SAAS,GAAG,IAAI,KAAK,KAAK,CAAC,MAAM,CAAC,aAAa,EAAE,SAAS,CAAC;AACnE,QAAA,IAAI,EAAE,MAAM,WAAW,CAAC,aAAa,CAAC;AACtC;;;AAGG;QACH,GAAG,EAAE,OAAO,SAAS,CAAC,YAAY,GAAG,SAAS,CAAC,SAAS,GAAG,IAAI,CAAC,GAAG,EAAE,CAAC;KACzE;AACL;;;;"}
|
||||
88
node_modules/motion-dom/dist/es/animation/generators/inertia.mjs
generated
vendored
Normal file
88
node_modules/motion-dom/dist/es/animation/generators/inertia.mjs
generated
vendored
Normal file
@@ -0,0 +1,88 @@
|
||||
import { spring } from './spring.mjs';
|
||||
import { getGeneratorVelocity } from './utils/velocity.mjs';
|
||||
|
||||
function inertia({ keyframes, velocity = 0.0, power = 0.8, timeConstant = 325, bounceDamping = 10, bounceStiffness = 500, modifyTarget, min, max, restDelta = 0.5, restSpeed, }) {
|
||||
const origin = keyframes[0];
|
||||
const state = {
|
||||
done: false,
|
||||
value: origin,
|
||||
};
|
||||
const isOutOfBounds = (v) => (min !== undefined && v < min) || (max !== undefined && v > max);
|
||||
const nearestBoundary = (v) => {
|
||||
if (min === undefined)
|
||||
return max;
|
||||
if (max === undefined)
|
||||
return min;
|
||||
return Math.abs(min - v) < Math.abs(max - v) ? min : max;
|
||||
};
|
||||
let amplitude = power * velocity;
|
||||
const ideal = origin + amplitude;
|
||||
const target = modifyTarget === undefined ? ideal : modifyTarget(ideal);
|
||||
/**
|
||||
* If the target has changed we need to re-calculate the amplitude, otherwise
|
||||
* the animation will start from the wrong position.
|
||||
*/
|
||||
if (target !== ideal)
|
||||
amplitude = target - origin;
|
||||
const calcDelta = (t) => -amplitude * Math.exp(-t / timeConstant);
|
||||
const calcLatest = (t) => target + calcDelta(t);
|
||||
const applyFriction = (t) => {
|
||||
const delta = calcDelta(t);
|
||||
const latest = calcLatest(t);
|
||||
state.done = Math.abs(delta) <= restDelta;
|
||||
state.value = state.done ? target : latest;
|
||||
};
|
||||
/**
|
||||
* Ideally this would resolve for t in a stateless way, we could
|
||||
* do that by always precalculating the animation but as we know
|
||||
* this will be done anyway we can assume that spring will
|
||||
* be discovered during that.
|
||||
*/
|
||||
let timeReachedBoundary;
|
||||
let spring$1;
|
||||
const checkCatchBoundary = (t) => {
|
||||
if (!isOutOfBounds(state.value))
|
||||
return;
|
||||
timeReachedBoundary = t;
|
||||
spring$1 = spring({
|
||||
keyframes: [state.value, nearestBoundary(state.value)],
|
||||
velocity: getGeneratorVelocity(calcLatest, t, state.value), // TODO: This should be passing * 1000
|
||||
damping: bounceDamping,
|
||||
stiffness: bounceStiffness,
|
||||
restDelta,
|
||||
restSpeed,
|
||||
});
|
||||
};
|
||||
checkCatchBoundary(0);
|
||||
return {
|
||||
calculatedDuration: null,
|
||||
next: (t) => {
|
||||
/**
|
||||
* We need to resolve the friction to figure out if we need a
|
||||
* spring but we don't want to do this twice per frame. So here
|
||||
* we flag if we updated for this frame and later if we did
|
||||
* we can skip doing it again.
|
||||
*/
|
||||
let hasUpdatedFrame = false;
|
||||
if (!spring$1 && timeReachedBoundary === undefined) {
|
||||
hasUpdatedFrame = true;
|
||||
applyFriction(t);
|
||||
checkCatchBoundary(t);
|
||||
}
|
||||
/**
|
||||
* If we have a spring and the provided t is beyond the moment the friction
|
||||
* animation crossed the min/max boundary, use the spring.
|
||||
*/
|
||||
if (timeReachedBoundary !== undefined && t >= timeReachedBoundary) {
|
||||
return spring$1.next(t - timeReachedBoundary);
|
||||
}
|
||||
else {
|
||||
!hasUpdatedFrame && applyFriction(t);
|
||||
return state;
|
||||
}
|
||||
},
|
||||
};
|
||||
}
|
||||
|
||||
export { inertia };
|
||||
//# sourceMappingURL=inertia.mjs.map
|
||||
1
node_modules/motion-dom/dist/es/animation/generators/inertia.mjs.map
generated
vendored
Normal file
1
node_modules/motion-dom/dist/es/animation/generators/inertia.mjs.map
generated
vendored
Normal file
File diff suppressed because one or more lines are too long
50
node_modules/motion-dom/dist/es/animation/generators/keyframes.mjs
generated
vendored
Normal file
50
node_modules/motion-dom/dist/es/animation/generators/keyframes.mjs
generated
vendored
Normal file
@@ -0,0 +1,50 @@
|
||||
import { easeInOut, isEasingArray, easingDefinitionToFunction } from 'motion-utils';
|
||||
import { interpolate } from '../../utils/interpolate.mjs';
|
||||
import { defaultOffset } from '../keyframes/offsets/default.mjs';
|
||||
import { convertOffsetToTimes } from '../keyframes/offsets/time.mjs';
|
||||
|
||||
function defaultEasing(values, easing) {
|
||||
return values.map(() => easing || easeInOut).splice(0, values.length - 1);
|
||||
}
|
||||
function keyframes({ duration = 300, keyframes: keyframeValues, times, ease = "easeInOut", }) {
|
||||
/**
|
||||
* Easing functions can be externally defined as strings. Here we convert them
|
||||
* into actual functions.
|
||||
*/
|
||||
const easingFunctions = isEasingArray(ease)
|
||||
? ease.map(easingDefinitionToFunction)
|
||||
: easingDefinitionToFunction(ease);
|
||||
/**
|
||||
* This is the Iterator-spec return value. We ensure it's mutable rather than using a generator
|
||||
* to reduce GC during animation.
|
||||
*/
|
||||
const state = {
|
||||
done: false,
|
||||
value: keyframeValues[0],
|
||||
};
|
||||
/**
|
||||
* Create a times array based on the provided 0-1 offsets
|
||||
*/
|
||||
const absoluteTimes = convertOffsetToTimes(
|
||||
// Only use the provided offsets if they're the correct length
|
||||
// TODO Maybe we should warn here if there's a length mismatch
|
||||
times && times.length === keyframeValues.length
|
||||
? times
|
||||
: defaultOffset(keyframeValues), duration);
|
||||
const mapTimeToKeyframe = interpolate(absoluteTimes, keyframeValues, {
|
||||
ease: Array.isArray(easingFunctions)
|
||||
? easingFunctions
|
||||
: defaultEasing(keyframeValues, easingFunctions),
|
||||
});
|
||||
return {
|
||||
calculatedDuration: duration,
|
||||
next: (t) => {
|
||||
state.value = mapTimeToKeyframe(t);
|
||||
state.done = t >= duration;
|
||||
return state;
|
||||
},
|
||||
};
|
||||
}
|
||||
|
||||
export { defaultEasing, keyframes };
|
||||
//# sourceMappingURL=keyframes.mjs.map
|
||||
1
node_modules/motion-dom/dist/es/animation/generators/keyframes.mjs.map
generated
vendored
Normal file
1
node_modules/motion-dom/dist/es/animation/generators/keyframes.mjs.map
generated
vendored
Normal file
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"keyframes.mjs","sources":["../../../../src/animation/generators/keyframes.ts"],"sourcesContent":["import {\n easeInOut,\n easingDefinitionToFunction,\n EasingFunction,\n isEasingArray,\n} from \"motion-utils\"\nimport { interpolate } from \"../../utils/interpolate\"\nimport { defaultOffset } from \"../keyframes/offsets/default\"\nimport { convertOffsetToTimes } from \"../keyframes/offsets/time\"\nimport {\n AnimationState,\n AnyResolvedKeyframe,\n KeyframeGenerator,\n ValueAnimationOptions,\n} from \"../types\"\n\nexport function defaultEasing(\n values: any[],\n easing?: EasingFunction\n): EasingFunction[] {\n return values.map(() => easing || easeInOut).splice(0, values.length - 1)\n}\n\nexport function keyframes<T extends AnyResolvedKeyframe>({\n duration = 300,\n keyframes: keyframeValues,\n times,\n ease = \"easeInOut\",\n}: ValueAnimationOptions<T>): KeyframeGenerator<T> {\n /**\n * Easing functions can be externally defined as strings. Here we convert them\n * into actual functions.\n */\n const easingFunctions = isEasingArray(ease)\n ? ease.map(easingDefinitionToFunction)\n : easingDefinitionToFunction(ease)\n\n /**\n * This is the Iterator-spec return value. We ensure it's mutable rather than using a generator\n * to reduce GC during animation.\n */\n const state: AnimationState<T> = {\n done: false,\n value: keyframeValues[0],\n }\n\n /**\n * Create a times array based on the provided 0-1 offsets\n */\n const absoluteTimes = convertOffsetToTimes(\n // Only use the provided offsets if they're the correct length\n // TODO Maybe we should warn here if there's a length mismatch\n times && times.length === keyframeValues.length\n ? times\n : defaultOffset(keyframeValues),\n duration\n )\n\n const mapTimeToKeyframe = interpolate<T>(absoluteTimes, keyframeValues, {\n ease: Array.isArray(easingFunctions)\n ? easingFunctions\n : defaultEasing(keyframeValues, easingFunctions),\n })\n\n return {\n calculatedDuration: duration,\n next: (t: number) => {\n state.value = mapTimeToKeyframe(t)\n state.done = t >= duration\n return state\n },\n }\n}\n"],"names":[],"mappings":";;;;;AAgBM,SAAU,aAAa,CACzB,MAAa,EACb,MAAuB,EAAA;IAEvB,OAAO,MAAM,CAAC,GAAG,CAAC,MAAM,MAAM,IAAI,SAAS,CAAC,CAAC,MAAM,CAAC,CAAC,EAAE,MAAM,CAAC,MAAM,GAAG,CAAC,CAAC;AAC7E;SAEgB,SAAS,CAAgC,EACrD,QAAQ,GAAG,GAAG,EACd,SAAS,EAAE,cAAc,EACzB,KAAK,EACL,IAAI,GAAG,WAAW,GACK,EAAA;AACvB;;;AAGG;AACH,IAAA,MAAM,eAAe,GAAG,aAAa,CAAC,IAAI;AACtC,UAAE,IAAI,CAAC,GAAG,CAAC,0BAA0B;AACrC,UAAE,0BAA0B,CAAC,IAAI,CAAC;AAEtC;;;AAGG;AACH,IAAA,MAAM,KAAK,GAAsB;AAC7B,QAAA,IAAI,EAAE,KAAK;AACX,QAAA,KAAK,EAAE,cAAc,CAAC,CAAC,CAAC;KAC3B;AAED;;AAEG;IACH,MAAM,aAAa,GAAG,oBAAoB;;;AAGtC,IAAA,KAAK,IAAI,KAAK,CAAC,MAAM,KAAK,cAAc,CAAC;AACrC,UAAE;UACA,aAAa,CAAC,cAAc,CAAC,EACnC,QAAQ,CACX;AAED,IAAA,MAAM,iBAAiB,GAAG,WAAW,CAAI,aAAa,EAAE,cAAc,EAAE;AACpE,QAAA,IAAI,EAAE,KAAK,CAAC,OAAO,CAAC,eAAe;AAC/B,cAAE;AACF,cAAE,aAAa,CAAC,cAAc,EAAE,eAAe,CAAC;AACvD,KAAA,CAAC;IAEF,OAAO;AACH,QAAA,kBAAkB,EAAE,QAAQ;AAC5B,QAAA,IAAI,EAAE,CAAC,CAAS,KAAI;AAChB,YAAA,KAAK,CAAC,KAAK,GAAG,iBAAiB,CAAC,CAAC,CAAC;AAClC,YAAA,KAAK,CAAC,IAAI,GAAG,CAAC,IAAI,QAAQ;AAC1B,YAAA,OAAO,KAAK;QAChB,CAAC;KACJ;AACL;;;;"}
|
||||
329
node_modules/motion-dom/dist/es/animation/generators/spring.mjs
generated
vendored
Normal file
329
node_modules/motion-dom/dist/es/animation/generators/spring.mjs
generated
vendored
Normal file
@@ -0,0 +1,329 @@
|
||||
import { millisecondsToSeconds, clamp, secondsToMilliseconds, warning } from 'motion-utils';
|
||||
import { generateLinearEasing } from '../waapi/utils/linear.mjs';
|
||||
import { calcGeneratorDuration, maxGeneratorDuration } from './utils/calc-duration.mjs';
|
||||
import { createGeneratorEasing } from './utils/create-generator-easing.mjs';
|
||||
|
||||
const springDefaults = {
|
||||
// Default spring physics
|
||||
stiffness: 100,
|
||||
damping: 10,
|
||||
mass: 1.0,
|
||||
velocity: 0.0,
|
||||
// Default duration/bounce-based options
|
||||
duration: 800, // in ms
|
||||
bounce: 0.3,
|
||||
visualDuration: 0.3, // in seconds
|
||||
// Rest thresholds
|
||||
restSpeed: {
|
||||
granular: 0.01,
|
||||
default: 2,
|
||||
},
|
||||
restDelta: {
|
||||
granular: 0.005,
|
||||
default: 0.5,
|
||||
},
|
||||
// Limits
|
||||
minDuration: 0.01, // in seconds
|
||||
maxDuration: 10.0, // in seconds
|
||||
minDamping: 0.05,
|
||||
maxDamping: 1,
|
||||
};
|
||||
function calcAngularFreq(undampedFreq, dampingRatio) {
|
||||
return undampedFreq * Math.sqrt(1 - dampingRatio * dampingRatio);
|
||||
}
|
||||
const rootIterations = 12;
|
||||
function approximateRoot(envelope, derivative, initialGuess) {
|
||||
let result = initialGuess;
|
||||
for (let i = 1; i < rootIterations; i++) {
|
||||
result = result - envelope(result) / derivative(result);
|
||||
}
|
||||
return result;
|
||||
}
|
||||
/**
|
||||
* This is ported from the Framer implementation of duration-based spring resolution.
|
||||
*/
|
||||
const safeMin = 0.001;
|
||||
function findSpring({ duration = springDefaults.duration, bounce = springDefaults.bounce, velocity = springDefaults.velocity, mass = springDefaults.mass, }) {
|
||||
let envelope;
|
||||
let derivative;
|
||||
warning(duration <= secondsToMilliseconds(springDefaults.maxDuration), "Spring duration must be 10 seconds or less", "spring-duration-limit");
|
||||
let dampingRatio = 1 - bounce;
|
||||
/**
|
||||
* Restrict dampingRatio and duration to within acceptable ranges.
|
||||
*/
|
||||
dampingRatio = clamp(springDefaults.minDamping, springDefaults.maxDamping, dampingRatio);
|
||||
duration = clamp(springDefaults.minDuration, springDefaults.maxDuration, millisecondsToSeconds(duration));
|
||||
if (dampingRatio < 1) {
|
||||
/**
|
||||
* Underdamped spring
|
||||
*/
|
||||
envelope = (undampedFreq) => {
|
||||
const exponentialDecay = undampedFreq * dampingRatio;
|
||||
const delta = exponentialDecay * duration;
|
||||
const a = exponentialDecay - velocity;
|
||||
const b = calcAngularFreq(undampedFreq, dampingRatio);
|
||||
const c = Math.exp(-delta);
|
||||
return safeMin - (a / b) * c;
|
||||
};
|
||||
derivative = (undampedFreq) => {
|
||||
const exponentialDecay = undampedFreq * dampingRatio;
|
||||
const delta = exponentialDecay * duration;
|
||||
const d = delta * velocity + velocity;
|
||||
const e = Math.pow(dampingRatio, 2) * Math.pow(undampedFreq, 2) * duration;
|
||||
const f = Math.exp(-delta);
|
||||
const g = calcAngularFreq(Math.pow(undampedFreq, 2), dampingRatio);
|
||||
const factor = -envelope(undampedFreq) + safeMin > 0 ? -1 : 1;
|
||||
return (factor * ((d - e) * f)) / g;
|
||||
};
|
||||
}
|
||||
else {
|
||||
/**
|
||||
* Critically-damped spring
|
||||
*/
|
||||
envelope = (undampedFreq) => {
|
||||
const a = Math.exp(-undampedFreq * duration);
|
||||
const b = (undampedFreq - velocity) * duration + 1;
|
||||
return -safeMin + a * b;
|
||||
};
|
||||
derivative = (undampedFreq) => {
|
||||
const a = Math.exp(-undampedFreq * duration);
|
||||
const b = (velocity - undampedFreq) * (duration * duration);
|
||||
return a * b;
|
||||
};
|
||||
}
|
||||
const initialGuess = 5 / duration;
|
||||
const undampedFreq = approximateRoot(envelope, derivative, initialGuess);
|
||||
duration = secondsToMilliseconds(duration);
|
||||
if (isNaN(undampedFreq)) {
|
||||
return {
|
||||
stiffness: springDefaults.stiffness,
|
||||
damping: springDefaults.damping,
|
||||
duration,
|
||||
};
|
||||
}
|
||||
else {
|
||||
const stiffness = Math.pow(undampedFreq, 2) * mass;
|
||||
return {
|
||||
stiffness,
|
||||
damping: dampingRatio * 2 * Math.sqrt(mass * stiffness),
|
||||
duration,
|
||||
};
|
||||
}
|
||||
}
|
||||
const durationKeys = ["duration", "bounce"];
|
||||
const physicsKeys = ["stiffness", "damping", "mass"];
|
||||
function isSpringType(options, keys) {
|
||||
return keys.some((key) => options[key] !== undefined);
|
||||
}
|
||||
function getSpringOptions(options) {
|
||||
let springOptions = {
|
||||
velocity: springDefaults.velocity,
|
||||
stiffness: springDefaults.stiffness,
|
||||
damping: springDefaults.damping,
|
||||
mass: springDefaults.mass,
|
||||
isResolvedFromDuration: false,
|
||||
...options,
|
||||
};
|
||||
// stiffness/damping/mass overrides duration/bounce
|
||||
if (!isSpringType(options, physicsKeys) &&
|
||||
isSpringType(options, durationKeys)) {
|
||||
// Time-defined springs should ignore inherited velocity.
|
||||
// Velocity from interrupted animations can cause findSpring()
|
||||
// to compute wildly different spring parameters, leading to
|
||||
// massive oscillation on small-range animations.
|
||||
springOptions.velocity = 0;
|
||||
if (options.visualDuration) {
|
||||
const visualDuration = options.visualDuration;
|
||||
const root = (2 * Math.PI) / (visualDuration * 1.2);
|
||||
const stiffness = root * root;
|
||||
const damping = 2 *
|
||||
clamp(0.05, 1, 1 - (options.bounce || 0)) *
|
||||
Math.sqrt(stiffness);
|
||||
springOptions = {
|
||||
...springOptions,
|
||||
mass: springDefaults.mass,
|
||||
stiffness,
|
||||
damping,
|
||||
};
|
||||
}
|
||||
else {
|
||||
const derived = findSpring({ ...options, velocity: 0 });
|
||||
springOptions = {
|
||||
...springOptions,
|
||||
...derived,
|
||||
mass: springDefaults.mass,
|
||||
};
|
||||
springOptions.isResolvedFromDuration = true;
|
||||
}
|
||||
}
|
||||
return springOptions;
|
||||
}
|
||||
function spring(optionsOrVisualDuration = springDefaults.visualDuration, bounce = springDefaults.bounce) {
|
||||
const options = typeof optionsOrVisualDuration !== "object"
|
||||
? {
|
||||
visualDuration: optionsOrVisualDuration,
|
||||
keyframes: [0, 1],
|
||||
bounce,
|
||||
}
|
||||
: optionsOrVisualDuration;
|
||||
let { restSpeed, restDelta } = options;
|
||||
const origin = options.keyframes[0];
|
||||
const target = options.keyframes[options.keyframes.length - 1];
|
||||
/**
|
||||
* This is the Iterator-spec return value. We ensure it's mutable rather than using a generator
|
||||
* to reduce GC during animation.
|
||||
*/
|
||||
const state = { done: false, value: origin };
|
||||
const { stiffness, damping, mass, duration, velocity, isResolvedFromDuration, } = getSpringOptions({
|
||||
...options,
|
||||
velocity: -millisecondsToSeconds(options.velocity || 0),
|
||||
});
|
||||
const initialVelocity = velocity || 0.0;
|
||||
const dampingRatio = damping / (2 * Math.sqrt(stiffness * mass));
|
||||
const initialDelta = target - origin;
|
||||
const undampedAngularFreq = millisecondsToSeconds(Math.sqrt(stiffness / mass));
|
||||
/**
|
||||
* If we're working on a granular scale, use smaller defaults for determining
|
||||
* when the spring is finished.
|
||||
*
|
||||
* These defaults have been selected emprically based on what strikes a good
|
||||
* ratio between feeling good and finishing as soon as changes are imperceptible.
|
||||
*/
|
||||
const isGranularScale = Math.abs(initialDelta) < 5;
|
||||
restSpeed || (restSpeed = isGranularScale
|
||||
? springDefaults.restSpeed.granular
|
||||
: springDefaults.restSpeed.default);
|
||||
restDelta || (restDelta = isGranularScale
|
||||
? springDefaults.restDelta.granular
|
||||
: springDefaults.restDelta.default);
|
||||
let resolveSpring;
|
||||
let resolveVelocity;
|
||||
// Underdamped coefficients, hoisted for use in the inlined next() hot path
|
||||
let angularFreq;
|
||||
let A;
|
||||
let sinCoeff;
|
||||
let cosCoeff;
|
||||
if (dampingRatio < 1) {
|
||||
angularFreq = calcAngularFreq(undampedAngularFreq, dampingRatio);
|
||||
A =
|
||||
(initialVelocity +
|
||||
dampingRatio * undampedAngularFreq * initialDelta) /
|
||||
angularFreq;
|
||||
// Underdamped spring
|
||||
resolveSpring = (t) => {
|
||||
const envelope = Math.exp(-dampingRatio * undampedAngularFreq * t);
|
||||
return (target -
|
||||
envelope *
|
||||
(A * Math.sin(angularFreq * t) +
|
||||
initialDelta * Math.cos(angularFreq * t)));
|
||||
};
|
||||
// Analytical derivative of underdamped spring (px/ms)
|
||||
sinCoeff =
|
||||
dampingRatio * undampedAngularFreq * A + initialDelta * angularFreq;
|
||||
cosCoeff =
|
||||
dampingRatio * undampedAngularFreq * initialDelta - A * angularFreq;
|
||||
resolveVelocity = (t) => {
|
||||
const envelope = Math.exp(-dampingRatio * undampedAngularFreq * t);
|
||||
return envelope *
|
||||
(sinCoeff * Math.sin(angularFreq * t) +
|
||||
cosCoeff * Math.cos(angularFreq * t));
|
||||
};
|
||||
}
|
||||
else if (dampingRatio === 1) {
|
||||
// Critically damped spring
|
||||
resolveSpring = (t) => target -
|
||||
Math.exp(-undampedAngularFreq * t) *
|
||||
(initialDelta +
|
||||
(initialVelocity + undampedAngularFreq * initialDelta) * t);
|
||||
// Analytical derivative of critically damped spring (px/ms)
|
||||
const C = initialVelocity + undampedAngularFreq * initialDelta;
|
||||
resolveVelocity = (t) => Math.exp(-undampedAngularFreq * t) *
|
||||
(undampedAngularFreq * C * t - initialVelocity);
|
||||
}
|
||||
else {
|
||||
// Overdamped spring
|
||||
const dampedAngularFreq = undampedAngularFreq * Math.sqrt(dampingRatio * dampingRatio - 1);
|
||||
resolveSpring = (t) => {
|
||||
const envelope = Math.exp(-dampingRatio * undampedAngularFreq * t);
|
||||
// When performing sinh or cosh values can hit Infinity so we cap them here
|
||||
const freqForT = Math.min(dampedAngularFreq * t, 300);
|
||||
return (target -
|
||||
(envelope *
|
||||
((initialVelocity +
|
||||
dampingRatio * undampedAngularFreq * initialDelta) *
|
||||
Math.sinh(freqForT) +
|
||||
dampedAngularFreq *
|
||||
initialDelta *
|
||||
Math.cosh(freqForT))) /
|
||||
dampedAngularFreq);
|
||||
};
|
||||
// Analytical derivative of overdamped spring (px/ms)
|
||||
const P = (initialVelocity +
|
||||
dampingRatio * undampedAngularFreq * initialDelta) /
|
||||
dampedAngularFreq;
|
||||
const sinhCoeff = dampingRatio * undampedAngularFreq * P - initialDelta * dampedAngularFreq;
|
||||
const coshCoeff = dampingRatio * undampedAngularFreq * initialDelta - P * dampedAngularFreq;
|
||||
resolveVelocity = (t) => {
|
||||
const envelope = Math.exp(-dampingRatio * undampedAngularFreq * t);
|
||||
const freqForT = Math.min(dampedAngularFreq * t, 300);
|
||||
return envelope *
|
||||
(sinhCoeff * Math.sinh(freqForT) +
|
||||
coshCoeff * Math.cosh(freqForT));
|
||||
};
|
||||
}
|
||||
const generator = {
|
||||
calculatedDuration: isResolvedFromDuration ? duration || null : null,
|
||||
velocity: (t) => secondsToMilliseconds(resolveVelocity(t)),
|
||||
next: (t) => {
|
||||
/**
|
||||
* For underdamped physics springs we need both position and
|
||||
* velocity each tick. Compute shared trig values once to avoid
|
||||
* duplicate Math.exp/sin/cos calls on the hot path.
|
||||
*/
|
||||
if (!isResolvedFromDuration && dampingRatio < 1) {
|
||||
const envelope = Math.exp(-dampingRatio * undampedAngularFreq * t);
|
||||
const sin = Math.sin(angularFreq * t);
|
||||
const cos = Math.cos(angularFreq * t);
|
||||
const current = target -
|
||||
envelope *
|
||||
(A * sin + initialDelta * cos);
|
||||
const currentVelocity = secondsToMilliseconds(envelope *
|
||||
(sinCoeff * sin + cosCoeff * cos));
|
||||
state.done =
|
||||
Math.abs(currentVelocity) <= restSpeed &&
|
||||
Math.abs(target - current) <= restDelta;
|
||||
state.value = state.done ? target : current;
|
||||
return state;
|
||||
}
|
||||
const current = resolveSpring(t);
|
||||
if (!isResolvedFromDuration) {
|
||||
const currentVelocity = secondsToMilliseconds(resolveVelocity(t));
|
||||
state.done =
|
||||
Math.abs(currentVelocity) <= restSpeed &&
|
||||
Math.abs(target - current) <= restDelta;
|
||||
}
|
||||
else {
|
||||
state.done = t >= duration;
|
||||
}
|
||||
state.value = state.done ? target : current;
|
||||
return state;
|
||||
},
|
||||
toString: () => {
|
||||
const calculatedDuration = Math.min(calcGeneratorDuration(generator), maxGeneratorDuration);
|
||||
const easing = generateLinearEasing((progress) => generator.next(calculatedDuration * progress).value, calculatedDuration, 30);
|
||||
return calculatedDuration + "ms " + easing;
|
||||
},
|
||||
toTransition: () => { },
|
||||
};
|
||||
return generator;
|
||||
}
|
||||
spring.applyToOptions = (options) => {
|
||||
const generatorOptions = createGeneratorEasing(options, 100, spring);
|
||||
options.ease = generatorOptions.ease;
|
||||
options.duration = secondsToMilliseconds(generatorOptions.duration);
|
||||
options.type = "keyframes";
|
||||
return options;
|
||||
};
|
||||
|
||||
export { spring };
|
||||
//# sourceMappingURL=spring.mjs.map
|
||||
1
node_modules/motion-dom/dist/es/animation/generators/spring.mjs.map
generated
vendored
Normal file
1
node_modules/motion-dom/dist/es/animation/generators/spring.mjs.map
generated
vendored
Normal file
File diff suppressed because one or more lines are too long
18
node_modules/motion-dom/dist/es/animation/generators/utils/calc-duration.mjs
generated
vendored
Normal file
18
node_modules/motion-dom/dist/es/animation/generators/utils/calc-duration.mjs
generated
vendored
Normal file
@@ -0,0 +1,18 @@
|
||||
/**
|
||||
* Implement a practical max duration for keyframe generation
|
||||
* to prevent infinite loops
|
||||
*/
|
||||
const maxGeneratorDuration = 20000;
|
||||
function calcGeneratorDuration(generator) {
|
||||
let duration = 0;
|
||||
const timeStep = 50;
|
||||
let state = generator.next(duration);
|
||||
while (!state.done && duration < maxGeneratorDuration) {
|
||||
duration += timeStep;
|
||||
state = generator.next(duration);
|
||||
}
|
||||
return duration >= maxGeneratorDuration ? Infinity : duration;
|
||||
}
|
||||
|
||||
export { calcGeneratorDuration, maxGeneratorDuration };
|
||||
//# sourceMappingURL=calc-duration.mjs.map
|
||||
1
node_modules/motion-dom/dist/es/animation/generators/utils/calc-duration.mjs.map
generated
vendored
Normal file
1
node_modules/motion-dom/dist/es/animation/generators/utils/calc-duration.mjs.map
generated
vendored
Normal file
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"calc-duration.mjs","sources":["../../../../../src/animation/generators/utils/calc-duration.ts"],"sourcesContent":["import { KeyframeGenerator } from \"../../types\"\n\n/**\n * Implement a practical max duration for keyframe generation\n * to prevent infinite loops\n */\nexport const maxGeneratorDuration = 20_000\nexport function calcGeneratorDuration(\n generator: KeyframeGenerator<unknown>\n): number {\n let duration = 0\n const timeStep = 50\n let state = generator.next(duration)\n while (!state.done && duration < maxGeneratorDuration) {\n duration += timeStep\n state = generator.next(duration)\n }\n\n return duration >= maxGeneratorDuration ? Infinity : duration\n}\n"],"names":[],"mappings":"AAEA;;;AAGG;AACI,MAAM,oBAAoB,GAAG;AAC9B,SAAU,qBAAqB,CACjC,SAAqC,EAAA;IAErC,IAAI,QAAQ,GAAG,CAAC;IAChB,MAAM,QAAQ,GAAG,EAAE;IACnB,IAAI,KAAK,GAAG,SAAS,CAAC,IAAI,CAAC,QAAQ,CAAC;IACpC,OAAO,CAAC,KAAK,CAAC,IAAI,IAAI,QAAQ,GAAG,oBAAoB,EAAE;QACnD,QAAQ,IAAI,QAAQ;AACpB,QAAA,KAAK,GAAG,SAAS,CAAC,IAAI,CAAC,QAAQ,CAAC;IACpC;IAEA,OAAO,QAAQ,IAAI,oBAAoB,GAAG,QAAQ,GAAG,QAAQ;AACjE;;;;"}
|
||||
20
node_modules/motion-dom/dist/es/animation/generators/utils/create-generator-easing.mjs
generated
vendored
Normal file
20
node_modules/motion-dom/dist/es/animation/generators/utils/create-generator-easing.mjs
generated
vendored
Normal file
@@ -0,0 +1,20 @@
|
||||
import { millisecondsToSeconds } from 'motion-utils';
|
||||
import { calcGeneratorDuration, maxGeneratorDuration } from './calc-duration.mjs';
|
||||
|
||||
/**
|
||||
* Create a progress => progress easing function from a generator.
|
||||
*/
|
||||
function createGeneratorEasing(options, scale = 100, createGenerator) {
|
||||
const generator = createGenerator({ ...options, keyframes: [0, scale] });
|
||||
const duration = Math.min(calcGeneratorDuration(generator), maxGeneratorDuration);
|
||||
return {
|
||||
type: "keyframes",
|
||||
ease: (progress) => {
|
||||
return generator.next(duration * progress).value / scale;
|
||||
},
|
||||
duration: millisecondsToSeconds(duration),
|
||||
};
|
||||
}
|
||||
|
||||
export { createGeneratorEasing };
|
||||
//# sourceMappingURL=create-generator-easing.mjs.map
|
||||
1
node_modules/motion-dom/dist/es/animation/generators/utils/create-generator-easing.mjs.map
generated
vendored
Normal file
1
node_modules/motion-dom/dist/es/animation/generators/utils/create-generator-easing.mjs.map
generated
vendored
Normal file
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"create-generator-easing.mjs","sources":["../../../../../src/animation/generators/utils/create-generator-easing.ts"],"sourcesContent":["import { millisecondsToSeconds } from \"motion-utils\"\nimport { GeneratorFactory, Transition } from \"../../types\"\nimport { calcGeneratorDuration, maxGeneratorDuration } from \"./calc-duration\"\n\n/**\n * Create a progress => progress easing function from a generator.\n */\nexport function createGeneratorEasing(\n options: Transition,\n scale = 100,\n createGenerator: GeneratorFactory\n) {\n const generator = createGenerator({ ...options, keyframes: [0, scale] })\n const duration = Math.min(\n calcGeneratorDuration(generator),\n maxGeneratorDuration\n )\n\n return {\n type: \"keyframes\",\n ease: (progress: number) => {\n return generator.next(duration * progress).value / scale\n },\n duration: millisecondsToSeconds(duration),\n }\n}\n"],"names":[],"mappings":";;;AAIA;;AAEG;AACG,SAAU,qBAAqB,CACjC,OAAmB,EACnB,KAAK,GAAG,GAAG,EACX,eAAiC,EAAA;AAEjC,IAAA,MAAM,SAAS,GAAG,eAAe,CAAC,EAAE,GAAG,OAAO,EAAE,SAAS,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,EAAE,CAAC;AACxE,IAAA,MAAM,QAAQ,GAAG,IAAI,CAAC,GAAG,CACrB,qBAAqB,CAAC,SAAS,CAAC,EAChC,oBAAoB,CACvB;IAED,OAAO;AACH,QAAA,IAAI,EAAE,WAAW;AACjB,QAAA,IAAI,EAAE,CAAC,QAAgB,KAAI;AACvB,YAAA,OAAO,SAAS,CAAC,IAAI,CAAC,QAAQ,GAAG,QAAQ,CAAC,CAAC,KAAK,GAAG,KAAK;QAC5D,CAAC;AACD,QAAA,QAAQ,EAAE,qBAAqB,CAAC,QAAQ,CAAC;KAC5C;AACL;;;;"}
|
||||
6
node_modules/motion-dom/dist/es/animation/generators/utils/is-generator.mjs
generated
vendored
Normal file
6
node_modules/motion-dom/dist/es/animation/generators/utils/is-generator.mjs
generated
vendored
Normal file
@@ -0,0 +1,6 @@
|
||||
function isGenerator(type) {
|
||||
return typeof type === "function" && "applyToOptions" in type;
|
||||
}
|
||||
|
||||
export { isGenerator };
|
||||
//# sourceMappingURL=is-generator.mjs.map
|
||||
1
node_modules/motion-dom/dist/es/animation/generators/utils/is-generator.mjs.map
generated
vendored
Normal file
1
node_modules/motion-dom/dist/es/animation/generators/utils/is-generator.mjs.map
generated
vendored
Normal file
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"is-generator.mjs","sources":["../../../../../src/animation/generators/utils/is-generator.ts"],"sourcesContent":["import { AnimationGeneratorType, GeneratorFactory } from \"../../types\"\n\nexport function isGenerator(\n type?: AnimationGeneratorType\n): type is GeneratorFactory {\n return typeof type === \"function\" && \"applyToOptions\" in type\n}\n"],"names":[],"mappings":"AAEM,SAAU,WAAW,CACvB,IAA6B,EAAA;IAE7B,OAAO,OAAO,IAAI,KAAK,UAAU,IAAI,gBAAgB,IAAI,IAAI;AACjE;;;;"}
|
||||
10
node_modules/motion-dom/dist/es/animation/generators/utils/velocity.mjs
generated
vendored
Normal file
10
node_modules/motion-dom/dist/es/animation/generators/utils/velocity.mjs
generated
vendored
Normal file
@@ -0,0 +1,10 @@
|
||||
import { velocityPerSecond } from 'motion-utils';
|
||||
|
||||
const velocitySampleDuration = 5; // ms
|
||||
function getGeneratorVelocity(resolveValue, t, current) {
|
||||
const prevT = Math.max(t - velocitySampleDuration, 0);
|
||||
return velocityPerSecond(current - resolveValue(prevT), t - prevT);
|
||||
}
|
||||
|
||||
export { getGeneratorVelocity };
|
||||
//# sourceMappingURL=velocity.mjs.map
|
||||
1
node_modules/motion-dom/dist/es/animation/generators/utils/velocity.mjs.map
generated
vendored
Normal file
1
node_modules/motion-dom/dist/es/animation/generators/utils/velocity.mjs.map
generated
vendored
Normal file
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"velocity.mjs","sources":["../../../../../src/animation/generators/utils/velocity.ts"],"sourcesContent":["import { velocityPerSecond } from \"motion-utils\"\n\nconst velocitySampleDuration = 5 // ms\n\nexport function getGeneratorVelocity(\n resolveValue: (v: number) => number,\n t: number,\n current: number\n) {\n const prevT = Math.max(t - velocitySampleDuration, 0)\n return velocityPerSecond(current - resolveValue(prevT), t - prevT)\n}\n"],"names":[],"mappings":";;AAEA,MAAM,sBAAsB,GAAG,CAAC,CAAA;SAEhB,oBAAoB,CAChC,YAAmC,EACnC,CAAS,EACT,OAAe,EAAA;AAEf,IAAA,MAAM,KAAK,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,sBAAsB,EAAE,CAAC,CAAC;AACrD,IAAA,OAAO,iBAAiB,CAAC,OAAO,GAAG,YAAY,CAAC,KAAK,CAAC,EAAE,CAAC,GAAG,KAAK,CAAC;AACtE;;;;"}
|
||||
104
node_modules/motion-dom/dist/es/animation/interfaces/motion-value.mjs
generated
vendored
Normal file
104
node_modules/motion-dom/dist/es/animation/interfaces/motion-value.mjs
generated
vendored
Normal file
@@ -0,0 +1,104 @@
|
||||
import { secondsToMilliseconds, MotionGlobalConfig } from 'motion-utils';
|
||||
import { AsyncMotionValueAnimation } from '../AsyncMotionValueAnimation.mjs';
|
||||
import { JSAnimation } from '../JSAnimation.mjs';
|
||||
import { getValueTransition } from '../utils/get-value-transition.mjs';
|
||||
import { makeAnimationInstant } from '../utils/make-animation-instant.mjs';
|
||||
import { getDefaultTransition } from '../utils/default-transitions.mjs';
|
||||
import { getFinalKeyframe } from '../keyframes/get-final.mjs';
|
||||
import { isTransitionDefined } from '../utils/is-transition-defined.mjs';
|
||||
import { frame } from '../../frameloop/frame.mjs';
|
||||
|
||||
const animateMotionValue = (name, value, target, transition = {}, element, isHandoff) => (onComplete) => {
|
||||
const valueTransition = getValueTransition(transition, name) || {};
|
||||
/**
|
||||
* Most transition values are currently completely overwritten by value-specific
|
||||
* transitions. In the future it'd be nicer to blend these transitions. But for now
|
||||
* delay actually does inherit from the root transition if not value-specific.
|
||||
*/
|
||||
const delay = valueTransition.delay || transition.delay || 0;
|
||||
/**
|
||||
* Elapsed isn't a public transition option but can be passed through from
|
||||
* optimized appear effects in milliseconds.
|
||||
*/
|
||||
let { elapsed = 0 } = transition;
|
||||
elapsed = elapsed - secondsToMilliseconds(delay);
|
||||
const options = {
|
||||
keyframes: Array.isArray(target) ? target : [null, target],
|
||||
ease: "easeOut",
|
||||
velocity: value.getVelocity(),
|
||||
...valueTransition,
|
||||
delay: -elapsed,
|
||||
onUpdate: (v) => {
|
||||
value.set(v);
|
||||
valueTransition.onUpdate && valueTransition.onUpdate(v);
|
||||
},
|
||||
onComplete: () => {
|
||||
onComplete();
|
||||
valueTransition.onComplete && valueTransition.onComplete();
|
||||
},
|
||||
name,
|
||||
motionValue: value,
|
||||
element: isHandoff ? undefined : element,
|
||||
};
|
||||
/**
|
||||
* If there's no transition defined for this value, we can generate
|
||||
* unique transition settings for this value.
|
||||
*/
|
||||
if (!isTransitionDefined(valueTransition)) {
|
||||
Object.assign(options, getDefaultTransition(name, options));
|
||||
}
|
||||
/**
|
||||
* Both WAAPI and our internal animation functions use durations
|
||||
* as defined by milliseconds, while our external API defines them
|
||||
* as seconds.
|
||||
*/
|
||||
options.duration && (options.duration = secondsToMilliseconds(options.duration));
|
||||
options.repeatDelay && (options.repeatDelay = secondsToMilliseconds(options.repeatDelay));
|
||||
/**
|
||||
* Support deprecated way to set initial value. Prefer keyframe syntax.
|
||||
*/
|
||||
if (options.from !== undefined) {
|
||||
options.keyframes[0] = options.from;
|
||||
}
|
||||
let shouldSkip = false;
|
||||
if (options.type === false ||
|
||||
(options.duration === 0 && !options.repeatDelay)) {
|
||||
makeAnimationInstant(options);
|
||||
if (options.delay === 0) {
|
||||
shouldSkip = true;
|
||||
}
|
||||
}
|
||||
if (MotionGlobalConfig.instantAnimations ||
|
||||
MotionGlobalConfig.skipAnimations ||
|
||||
element?.shouldSkipAnimations) {
|
||||
shouldSkip = true;
|
||||
makeAnimationInstant(options);
|
||||
options.delay = 0;
|
||||
}
|
||||
/**
|
||||
* If the transition type or easing has been explicitly set by the user
|
||||
* then we don't want to allow flattening the animation.
|
||||
*/
|
||||
options.allowFlatten = !valueTransition.type && !valueTransition.ease;
|
||||
/**
|
||||
* If we can or must skip creating the animation, and apply only
|
||||
* the final keyframe, do so. We also check once keyframes are resolved but
|
||||
* this early check prevents the need to create an animation at all.
|
||||
*/
|
||||
if (shouldSkip && !isHandoff && value.get() !== undefined) {
|
||||
const finalKeyframe = getFinalKeyframe(options.keyframes, valueTransition);
|
||||
if (finalKeyframe !== undefined) {
|
||||
frame.update(() => {
|
||||
options.onUpdate(finalKeyframe);
|
||||
options.onComplete();
|
||||
});
|
||||
return;
|
||||
}
|
||||
}
|
||||
return valueTransition.isSync
|
||||
? new JSAnimation(options)
|
||||
: new AsyncMotionValueAnimation(options);
|
||||
};
|
||||
|
||||
export { animateMotionValue };
|
||||
//# sourceMappingURL=motion-value.mjs.map
|
||||
1
node_modules/motion-dom/dist/es/animation/interfaces/motion-value.mjs.map
generated
vendored
Normal file
1
node_modules/motion-dom/dist/es/animation/interfaces/motion-value.mjs.map
generated
vendored
Normal file
File diff suppressed because one or more lines are too long
100
node_modules/motion-dom/dist/es/animation/interfaces/visual-element-target.mjs
generated
vendored
Normal file
100
node_modules/motion-dom/dist/es/animation/interfaces/visual-element-target.mjs
generated
vendored
Normal file
@@ -0,0 +1,100 @@
|
||||
import { getValueTransition } from '../utils/get-value-transition.mjs';
|
||||
import { resolveTransition } from '../utils/resolve-transition.mjs';
|
||||
import { positionalKeys } from '../../render/utils/keys-position.mjs';
|
||||
import { setTarget } from '../../render/utils/setters.mjs';
|
||||
import { addValueToWillChange } from '../../value/will-change/add-will-change.mjs';
|
||||
import { getOptimisedAppearId } from '../optimized-appear/get-appear-id.mjs';
|
||||
import { animateMotionValue } from './motion-value.mjs';
|
||||
import { frame } from '../../frameloop/frame.mjs';
|
||||
|
||||
/**
|
||||
* Decide whether we should block this animation. Previously, we achieved this
|
||||
* just by checking whether the key was listed in protectedKeys, but this
|
||||
* posed problems if an animation was triggered by afterChildren and protectedKeys
|
||||
* had been set to true in the meantime.
|
||||
*/
|
||||
function shouldBlockAnimation({ protectedKeys, needsAnimating }, key) {
|
||||
const shouldBlock = protectedKeys.hasOwnProperty(key) && needsAnimating[key] !== true;
|
||||
needsAnimating[key] = false;
|
||||
return shouldBlock;
|
||||
}
|
||||
function animateTarget(visualElement, targetAndTransition, { delay = 0, transitionOverride, type } = {}) {
|
||||
let { transition, transitionEnd, ...target } = targetAndTransition;
|
||||
const defaultTransition = visualElement.getDefaultTransition();
|
||||
transition = transition
|
||||
? resolveTransition(transition, defaultTransition)
|
||||
: defaultTransition;
|
||||
const reduceMotion = transition?.reduceMotion;
|
||||
if (transitionOverride)
|
||||
transition = transitionOverride;
|
||||
const animations = [];
|
||||
const animationTypeState = type &&
|
||||
visualElement.animationState &&
|
||||
visualElement.animationState.getState()[type];
|
||||
for (const key in target) {
|
||||
const value = visualElement.getValue(key, visualElement.latestValues[key] ?? null);
|
||||
const valueTarget = target[key];
|
||||
if (valueTarget === undefined ||
|
||||
(animationTypeState &&
|
||||
shouldBlockAnimation(animationTypeState, key))) {
|
||||
continue;
|
||||
}
|
||||
const valueTransition = {
|
||||
delay,
|
||||
...getValueTransition(transition || {}, key),
|
||||
};
|
||||
/**
|
||||
* If the value is already at the defined target, skip the animation.
|
||||
* We still re-assert the value via frame.update to take precedence
|
||||
* over any stale transitionEnd callbacks from previous animations.
|
||||
*/
|
||||
const currentValue = value.get();
|
||||
if (currentValue !== undefined &&
|
||||
!value.isAnimating() &&
|
||||
!Array.isArray(valueTarget) &&
|
||||
valueTarget === currentValue &&
|
||||
!valueTransition.velocity) {
|
||||
frame.update(() => value.set(valueTarget));
|
||||
continue;
|
||||
}
|
||||
/**
|
||||
* If this is the first time a value is being animated, check
|
||||
* to see if we're handling off from an existing animation.
|
||||
*/
|
||||
let isHandoff = false;
|
||||
if (window.MotionHandoffAnimation) {
|
||||
const appearId = getOptimisedAppearId(visualElement);
|
||||
if (appearId) {
|
||||
const startTime = window.MotionHandoffAnimation(appearId, key, frame);
|
||||
if (startTime !== null) {
|
||||
valueTransition.startTime = startTime;
|
||||
isHandoff = true;
|
||||
}
|
||||
}
|
||||
}
|
||||
addValueToWillChange(visualElement, key);
|
||||
const shouldReduceMotion = reduceMotion ?? visualElement.shouldReduceMotion;
|
||||
value.start(animateMotionValue(key, value, valueTarget, shouldReduceMotion && positionalKeys.has(key)
|
||||
? { type: false }
|
||||
: valueTransition, visualElement, isHandoff));
|
||||
const animation = value.animation;
|
||||
if (animation) {
|
||||
animations.push(animation);
|
||||
}
|
||||
}
|
||||
if (transitionEnd) {
|
||||
const applyTransitionEnd = () => frame.update(() => {
|
||||
transitionEnd && setTarget(visualElement, transitionEnd);
|
||||
});
|
||||
if (animations.length) {
|
||||
Promise.all(animations).then(applyTransitionEnd);
|
||||
}
|
||||
else {
|
||||
applyTransitionEnd();
|
||||
}
|
||||
}
|
||||
return animations;
|
||||
}
|
||||
|
||||
export { animateTarget };
|
||||
//# sourceMappingURL=visual-element-target.mjs.map
|
||||
1
node_modules/motion-dom/dist/es/animation/interfaces/visual-element-target.mjs.map
generated
vendored
Normal file
1
node_modules/motion-dom/dist/es/animation/interfaces/visual-element-target.mjs.map
generated
vendored
Normal file
File diff suppressed because one or more lines are too long
60
node_modules/motion-dom/dist/es/animation/interfaces/visual-element-variant.mjs
generated
vendored
Normal file
60
node_modules/motion-dom/dist/es/animation/interfaces/visual-element-variant.mjs
generated
vendored
Normal file
@@ -0,0 +1,60 @@
|
||||
import { resolveVariant } from '../../render/utils/resolve-dynamic-variants.mjs';
|
||||
import { calcChildStagger } from '../utils/calc-child-stagger.mjs';
|
||||
import { animateTarget } from './visual-element-target.mjs';
|
||||
|
||||
function animateVariant(visualElement, variant, options = {}) {
|
||||
const resolved = resolveVariant(visualElement, variant, options.type === "exit"
|
||||
? visualElement.presenceContext?.custom
|
||||
: undefined);
|
||||
let { transition = visualElement.getDefaultTransition() || {} } = resolved || {};
|
||||
if (options.transitionOverride) {
|
||||
transition = options.transitionOverride;
|
||||
}
|
||||
/**
|
||||
* If we have a variant, create a callback that runs it as an animation.
|
||||
* Otherwise, we resolve a Promise immediately for a composable no-op.
|
||||
*/
|
||||
const getAnimation = resolved
|
||||
? () => Promise.all(animateTarget(visualElement, resolved, options))
|
||||
: () => Promise.resolve();
|
||||
/**
|
||||
* If we have children, create a callback that runs all their animations.
|
||||
* Otherwise, we resolve a Promise immediately for a composable no-op.
|
||||
*/
|
||||
const getChildAnimations = visualElement.variantChildren && visualElement.variantChildren.size
|
||||
? (forwardDelay = 0) => {
|
||||
const { delayChildren = 0, staggerChildren, staggerDirection, } = transition;
|
||||
return animateChildren(visualElement, variant, forwardDelay, delayChildren, staggerChildren, staggerDirection, options);
|
||||
}
|
||||
: () => Promise.resolve();
|
||||
/**
|
||||
* If the transition explicitly defines a "when" option, we need to resolve either
|
||||
* this animation or all children animations before playing the other.
|
||||
*/
|
||||
const { when } = transition;
|
||||
if (when) {
|
||||
const [first, last] = when === "beforeChildren"
|
||||
? [getAnimation, getChildAnimations]
|
||||
: [getChildAnimations, getAnimation];
|
||||
return first().then(() => last());
|
||||
}
|
||||
else {
|
||||
return Promise.all([getAnimation(), getChildAnimations(options.delay)]);
|
||||
}
|
||||
}
|
||||
function animateChildren(visualElement, variant, delay = 0, delayChildren = 0, staggerChildren = 0, staggerDirection = 1, options) {
|
||||
const animations = [];
|
||||
for (const child of visualElement.variantChildren) {
|
||||
child.notify("AnimationStart", variant);
|
||||
animations.push(animateVariant(child, variant, {
|
||||
...options,
|
||||
delay: delay +
|
||||
(typeof delayChildren === "function" ? 0 : delayChildren) +
|
||||
calcChildStagger(visualElement.variantChildren, child, delayChildren, staggerChildren, staggerDirection),
|
||||
}).then(() => child.notify("AnimationComplete", variant)));
|
||||
}
|
||||
return Promise.all(animations);
|
||||
}
|
||||
|
||||
export { animateVariant };
|
||||
//# sourceMappingURL=visual-element-variant.mjs.map
|
||||
1
node_modules/motion-dom/dist/es/animation/interfaces/visual-element-variant.mjs.map
generated
vendored
Normal file
1
node_modules/motion-dom/dist/es/animation/interfaces/visual-element-variant.mjs.map
generated
vendored
Normal file
File diff suppressed because one or more lines are too long
27
node_modules/motion-dom/dist/es/animation/interfaces/visual-element.mjs
generated
vendored
Normal file
27
node_modules/motion-dom/dist/es/animation/interfaces/visual-element.mjs
generated
vendored
Normal file
@@ -0,0 +1,27 @@
|
||||
import { resolveVariant } from '../../render/utils/resolve-dynamic-variants.mjs';
|
||||
import { animateTarget } from './visual-element-target.mjs';
|
||||
import { animateVariant } from './visual-element-variant.mjs';
|
||||
|
||||
function animateVisualElement(visualElement, definition, options = {}) {
|
||||
visualElement.notify("AnimationStart", definition);
|
||||
let animation;
|
||||
if (Array.isArray(definition)) {
|
||||
const animations = definition.map((variant) => animateVariant(visualElement, variant, options));
|
||||
animation = Promise.all(animations);
|
||||
}
|
||||
else if (typeof definition === "string") {
|
||||
animation = animateVariant(visualElement, definition, options);
|
||||
}
|
||||
else {
|
||||
const resolvedDefinition = typeof definition === "function"
|
||||
? resolveVariant(visualElement, definition, options.custom)
|
||||
: definition;
|
||||
animation = Promise.all(animateTarget(visualElement, resolvedDefinition, options));
|
||||
}
|
||||
return animation.then(() => {
|
||||
visualElement.notify("AnimationComplete", definition);
|
||||
});
|
||||
}
|
||||
|
||||
export { animateVisualElement };
|
||||
//# sourceMappingURL=visual-element.mjs.map
|
||||
1
node_modules/motion-dom/dist/es/animation/interfaces/visual-element.mjs.map
generated
vendored
Normal file
1
node_modules/motion-dom/dist/es/animation/interfaces/visual-element.mjs.map
generated
vendored
Normal file
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"visual-element.mjs","sources":["../../../../src/animation/interfaces/visual-element.ts"],"sourcesContent":["import { resolveVariant } from \"../../render/utils/resolve-dynamic-variants\"\nimport type { AnimationDefinition } from \"../../node/types\"\nimport type { VisualElement } from \"../../render/VisualElement\"\nimport type { VisualElementAnimationOptions } from \"./types\"\nimport { animateTarget } from \"./visual-element-target\"\nimport { animateVariant } from \"./visual-element-variant\"\n\nexport function animateVisualElement(\n visualElement: VisualElement,\n definition: AnimationDefinition,\n options: VisualElementAnimationOptions = {}\n) {\n visualElement.notify(\"AnimationStart\", definition)\n let animation: Promise<any>\n\n if (Array.isArray(definition)) {\n const animations = definition.map((variant) =>\n animateVariant(visualElement, variant, options)\n )\n animation = Promise.all(animations)\n } else if (typeof definition === \"string\") {\n animation = animateVariant(visualElement, definition, options)\n } else {\n const resolvedDefinition =\n typeof definition === \"function\"\n ? resolveVariant(visualElement, definition, options.custom)\n : definition\n\n animation = Promise.all(\n animateTarget(visualElement, resolvedDefinition, options)\n )\n }\n\n return animation.then(() => {\n visualElement.notify(\"AnimationComplete\", definition)\n })\n}\n"],"names":[],"mappings":";;;;AAOM,SAAU,oBAAoB,CAChC,aAA4B,EAC5B,UAA+B,EAC/B,UAAyC,EAAE,EAAA;AAE3C,IAAA,aAAa,CAAC,MAAM,CAAC,gBAAgB,EAAE,UAAU,CAAC;AAClD,IAAA,IAAI,SAAuB;AAE3B,IAAA,IAAI,KAAK,CAAC,OAAO,CAAC,UAAU,CAAC,EAAE;QAC3B,MAAM,UAAU,GAAG,UAAU,CAAC,GAAG,CAAC,CAAC,OAAO,KACtC,cAAc,CAAC,aAAa,EAAE,OAAO,EAAE,OAAO,CAAC,CAClD;AACD,QAAA,SAAS,GAAG,OAAO,CAAC,GAAG,CAAC,UAAU,CAAC;IACvC;AAAO,SAAA,IAAI,OAAO,UAAU,KAAK,QAAQ,EAAE;QACvC,SAAS,GAAG,cAAc,CAAC,aAAa,EAAE,UAAU,EAAE,OAAO,CAAC;IAClE;SAAO;AACH,QAAA,MAAM,kBAAkB,GACpB,OAAO,UAAU,KAAK;cAChB,cAAc,CAAC,aAAa,EAAE,UAAU,EAAE,OAAO,CAAC,MAAM;cACxD,UAAU;AAEpB,QAAA,SAAS,GAAG,OAAO,CAAC,GAAG,CACnB,aAAa,CAAC,aAAa,EAAE,kBAAkB,EAAE,OAAO,CAAC,CAC5D;IACL;AAEA,IAAA,OAAO,SAAS,CAAC,IAAI,CAAC,MAAK;AACvB,QAAA,aAAa,CAAC,MAAM,CAAC,mBAAmB,EAAE,UAAU,CAAC;AACzD,IAAA,CAAC,CAAC;AACN;;;;"}
|
||||
142
node_modules/motion-dom/dist/es/animation/keyframes/DOMKeyframesResolver.mjs
generated
vendored
Normal file
142
node_modules/motion-dom/dist/es/animation/keyframes/DOMKeyframesResolver.mjs
generated
vendored
Normal file
@@ -0,0 +1,142 @@
|
||||
import { positionalKeys } from '../../render/utils/keys-position.mjs';
|
||||
import { findDimensionValueType } from '../../value/types/dimensions.mjs';
|
||||
import { getVariableValue } from '../utils/css-variables-conversion.mjs';
|
||||
import { isCSSVariableToken, containsCSSVariable } from '../utils/is-css-variable.mjs';
|
||||
import { KeyframeResolver } from './KeyframesResolver.mjs';
|
||||
import { isNone } from './utils/is-none.mjs';
|
||||
import { makeNoneKeyframesAnimatable } from './utils/make-none-animatable.mjs';
|
||||
import { positionalValues, isNumOrPxType } from './utils/unit-conversion.mjs';
|
||||
|
||||
class DOMKeyframesResolver extends KeyframeResolver {
|
||||
constructor(unresolvedKeyframes, onComplete, name, motionValue, element) {
|
||||
super(unresolvedKeyframes, onComplete, name, motionValue, element, true);
|
||||
}
|
||||
readKeyframes() {
|
||||
const { unresolvedKeyframes, element, name } = this;
|
||||
if (!element || !element.current)
|
||||
return;
|
||||
super.readKeyframes();
|
||||
/**
|
||||
* If any keyframe is a CSS variable, we need to find its value by sampling the element
|
||||
*/
|
||||
for (let i = 0; i < unresolvedKeyframes.length; i++) {
|
||||
let keyframe = unresolvedKeyframes[i];
|
||||
if (typeof keyframe === "string") {
|
||||
keyframe = keyframe.trim();
|
||||
if (isCSSVariableToken(keyframe)) {
|
||||
const resolved = getVariableValue(keyframe, element.current);
|
||||
if (resolved !== undefined) {
|
||||
unresolvedKeyframes[i] = resolved;
|
||||
}
|
||||
if (i === unresolvedKeyframes.length - 1) {
|
||||
this.finalKeyframe = keyframe;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
/**
|
||||
* Resolve "none" values. We do this potentially twice - once before and once after measuring keyframes.
|
||||
* This could be seen as inefficient but it's a trade-off to avoid measurements in more situations, which
|
||||
* have a far bigger performance impact.
|
||||
*/
|
||||
this.resolveNoneKeyframes();
|
||||
/**
|
||||
* Check to see if unit type has changed. If so schedule jobs that will
|
||||
* temporarily set styles to the destination keyframes.
|
||||
* Skip if we have more than two keyframes or this isn't a positional value.
|
||||
* TODO: We can throw if there are multiple keyframes and the value type changes.
|
||||
*/
|
||||
if (!positionalKeys.has(name) || unresolvedKeyframes.length !== 2) {
|
||||
return;
|
||||
}
|
||||
const [origin, target] = unresolvedKeyframes;
|
||||
const originType = findDimensionValueType(origin);
|
||||
const targetType = findDimensionValueType(target);
|
||||
/**
|
||||
* If one keyframe contains embedded CSS variables (e.g. in calc()) and the other
|
||||
* doesn't, we need to measure to convert to pixels. This handles GitHub issue #3410.
|
||||
*/
|
||||
const originHasVar = containsCSSVariable(origin);
|
||||
const targetHasVar = containsCSSVariable(target);
|
||||
if (originHasVar !== targetHasVar && positionalValues[name]) {
|
||||
this.needsMeasurement = true;
|
||||
return;
|
||||
}
|
||||
/**
|
||||
* Either we don't recognise these value types or we can animate between them.
|
||||
*/
|
||||
if (originType === targetType)
|
||||
return;
|
||||
/**
|
||||
* If both values are numbers or pixels, we can animate between them by
|
||||
* converting them to numbers.
|
||||
*/
|
||||
if (isNumOrPxType(originType) && isNumOrPxType(targetType)) {
|
||||
for (let i = 0; i < unresolvedKeyframes.length; i++) {
|
||||
const value = unresolvedKeyframes[i];
|
||||
if (typeof value === "string") {
|
||||
unresolvedKeyframes[i] = parseFloat(value);
|
||||
}
|
||||
}
|
||||
}
|
||||
else if (positionalValues[name]) {
|
||||
/**
|
||||
* Else, the only way to resolve this is by measuring the element.
|
||||
*/
|
||||
this.needsMeasurement = true;
|
||||
}
|
||||
}
|
||||
resolveNoneKeyframes() {
|
||||
const { unresolvedKeyframes, name } = this;
|
||||
const noneKeyframeIndexes = [];
|
||||
for (let i = 0; i < unresolvedKeyframes.length; i++) {
|
||||
if (unresolvedKeyframes[i] === null ||
|
||||
isNone(unresolvedKeyframes[i])) {
|
||||
noneKeyframeIndexes.push(i);
|
||||
}
|
||||
}
|
||||
if (noneKeyframeIndexes.length) {
|
||||
makeNoneKeyframesAnimatable(unresolvedKeyframes, noneKeyframeIndexes, name);
|
||||
}
|
||||
}
|
||||
measureInitialState() {
|
||||
const { element, unresolvedKeyframes, name } = this;
|
||||
if (!element || !element.current)
|
||||
return;
|
||||
if (name === "height") {
|
||||
this.suspendedScrollY = window.pageYOffset;
|
||||
}
|
||||
this.measuredOrigin = positionalValues[name](element.measureViewportBox(), window.getComputedStyle(element.current));
|
||||
unresolvedKeyframes[0] = this.measuredOrigin;
|
||||
// Set final key frame to measure after next render
|
||||
const measureKeyframe = unresolvedKeyframes[unresolvedKeyframes.length - 1];
|
||||
if (measureKeyframe !== undefined) {
|
||||
element.getValue(name, measureKeyframe).jump(measureKeyframe, false);
|
||||
}
|
||||
}
|
||||
measureEndState() {
|
||||
const { element, name, unresolvedKeyframes } = this;
|
||||
if (!element || !element.current)
|
||||
return;
|
||||
const value = element.getValue(name);
|
||||
value && value.jump(this.measuredOrigin, false);
|
||||
const finalKeyframeIndex = unresolvedKeyframes.length - 1;
|
||||
const finalKeyframe = unresolvedKeyframes[finalKeyframeIndex];
|
||||
unresolvedKeyframes[finalKeyframeIndex] = positionalValues[name](element.measureViewportBox(), window.getComputedStyle(element.current));
|
||||
if (finalKeyframe !== null && this.finalKeyframe === undefined) {
|
||||
this.finalKeyframe = finalKeyframe;
|
||||
}
|
||||
// If we removed transform values, reapply them before the next render
|
||||
if (this.removedTransforms?.length) {
|
||||
this.removedTransforms.forEach(([unsetTransformName, unsetTransformValue]) => {
|
||||
element
|
||||
.getValue(unsetTransformName)
|
||||
.set(unsetTransformValue);
|
||||
});
|
||||
}
|
||||
this.resolveNoneKeyframes();
|
||||
}
|
||||
}
|
||||
|
||||
export { DOMKeyframesResolver };
|
||||
//# sourceMappingURL=DOMKeyframesResolver.mjs.map
|
||||
1
node_modules/motion-dom/dist/es/animation/keyframes/DOMKeyframesResolver.mjs.map
generated
vendored
Normal file
1
node_modules/motion-dom/dist/es/animation/keyframes/DOMKeyframesResolver.mjs.map
generated
vendored
Normal file
File diff suppressed because one or more lines are too long
148
node_modules/motion-dom/dist/es/animation/keyframes/KeyframesResolver.mjs
generated
vendored
Normal file
148
node_modules/motion-dom/dist/es/animation/keyframes/KeyframesResolver.mjs
generated
vendored
Normal file
@@ -0,0 +1,148 @@
|
||||
import { fillWildcards } from './utils/fill-wildcards.mjs';
|
||||
import { removeNonTranslationalTransform } from './utils/unit-conversion.mjs';
|
||||
import { frame } from '../../frameloop/frame.mjs';
|
||||
|
||||
const toResolve = new Set();
|
||||
let isScheduled = false;
|
||||
let anyNeedsMeasurement = false;
|
||||
let isForced = false;
|
||||
function measureAllKeyframes() {
|
||||
if (anyNeedsMeasurement) {
|
||||
const resolversToMeasure = Array.from(toResolve).filter((resolver) => resolver.needsMeasurement);
|
||||
const elementsToMeasure = new Set(resolversToMeasure.map((resolver) => resolver.element));
|
||||
const transformsToRestore = new Map();
|
||||
/**
|
||||
* Write pass
|
||||
* If we're measuring elements we want to remove bounding box-changing transforms.
|
||||
*/
|
||||
elementsToMeasure.forEach((element) => {
|
||||
const removedTransforms = removeNonTranslationalTransform(element);
|
||||
if (!removedTransforms.length)
|
||||
return;
|
||||
transformsToRestore.set(element, removedTransforms);
|
||||
element.render();
|
||||
});
|
||||
// Read
|
||||
resolversToMeasure.forEach((resolver) => resolver.measureInitialState());
|
||||
// Write
|
||||
elementsToMeasure.forEach((element) => {
|
||||
element.render();
|
||||
const restore = transformsToRestore.get(element);
|
||||
if (restore) {
|
||||
restore.forEach(([key, value]) => {
|
||||
element.getValue(key)?.set(value);
|
||||
});
|
||||
}
|
||||
});
|
||||
// Read
|
||||
resolversToMeasure.forEach((resolver) => resolver.measureEndState());
|
||||
// Write
|
||||
resolversToMeasure.forEach((resolver) => {
|
||||
if (resolver.suspendedScrollY !== undefined) {
|
||||
window.scrollTo(0, resolver.suspendedScrollY);
|
||||
}
|
||||
});
|
||||
}
|
||||
anyNeedsMeasurement = false;
|
||||
isScheduled = false;
|
||||
toResolve.forEach((resolver) => resolver.complete(isForced));
|
||||
toResolve.clear();
|
||||
}
|
||||
function readAllKeyframes() {
|
||||
toResolve.forEach((resolver) => {
|
||||
resolver.readKeyframes();
|
||||
if (resolver.needsMeasurement) {
|
||||
anyNeedsMeasurement = true;
|
||||
}
|
||||
});
|
||||
}
|
||||
function flushKeyframeResolvers() {
|
||||
isForced = true;
|
||||
readAllKeyframes();
|
||||
measureAllKeyframes();
|
||||
isForced = false;
|
||||
}
|
||||
class KeyframeResolver {
|
||||
constructor(unresolvedKeyframes, onComplete, name, motionValue, element, isAsync = false) {
|
||||
this.state = "pending";
|
||||
/**
|
||||
* Track whether this resolver is async. If it is, it'll be added to the
|
||||
* resolver queue and flushed in the next frame. Resolvers that aren't going
|
||||
* to trigger read/write thrashing don't need to be async.
|
||||
*/
|
||||
this.isAsync = false;
|
||||
/**
|
||||
* Track whether this resolver needs to perform a measurement
|
||||
* to resolve its keyframes.
|
||||
*/
|
||||
this.needsMeasurement = false;
|
||||
this.unresolvedKeyframes = [...unresolvedKeyframes];
|
||||
this.onComplete = onComplete;
|
||||
this.name = name;
|
||||
this.motionValue = motionValue;
|
||||
this.element = element;
|
||||
this.isAsync = isAsync;
|
||||
}
|
||||
scheduleResolve() {
|
||||
this.state = "scheduled";
|
||||
if (this.isAsync) {
|
||||
toResolve.add(this);
|
||||
if (!isScheduled) {
|
||||
isScheduled = true;
|
||||
frame.read(readAllKeyframes);
|
||||
frame.resolveKeyframes(measureAllKeyframes);
|
||||
}
|
||||
}
|
||||
else {
|
||||
this.readKeyframes();
|
||||
this.complete();
|
||||
}
|
||||
}
|
||||
readKeyframes() {
|
||||
const { unresolvedKeyframes, name, element, motionValue } = this;
|
||||
// If initial keyframe is null we need to read it from the DOM
|
||||
if (unresolvedKeyframes[0] === null) {
|
||||
const currentValue = motionValue?.get();
|
||||
// TODO: This doesn't work if the final keyframe is a wildcard
|
||||
const finalKeyframe = unresolvedKeyframes[unresolvedKeyframes.length - 1];
|
||||
if (currentValue !== undefined) {
|
||||
unresolvedKeyframes[0] = currentValue;
|
||||
}
|
||||
else if (element && name) {
|
||||
const valueAsRead = element.readValue(name, finalKeyframe);
|
||||
if (valueAsRead !== undefined && valueAsRead !== null) {
|
||||
unresolvedKeyframes[0] = valueAsRead;
|
||||
}
|
||||
}
|
||||
if (unresolvedKeyframes[0] === undefined) {
|
||||
unresolvedKeyframes[0] = finalKeyframe;
|
||||
}
|
||||
if (motionValue && currentValue === undefined) {
|
||||
motionValue.set(unresolvedKeyframes[0]);
|
||||
}
|
||||
}
|
||||
fillWildcards(unresolvedKeyframes);
|
||||
}
|
||||
setFinalKeyframe() { }
|
||||
measureInitialState() { }
|
||||
renderEndStyles() { }
|
||||
measureEndState() { }
|
||||
complete(isForcedComplete = false) {
|
||||
this.state = "complete";
|
||||
this.onComplete(this.unresolvedKeyframes, this.finalKeyframe, isForcedComplete);
|
||||
toResolve.delete(this);
|
||||
}
|
||||
cancel() {
|
||||
if (this.state === "scheduled") {
|
||||
toResolve.delete(this);
|
||||
this.state = "pending";
|
||||
}
|
||||
}
|
||||
resume() {
|
||||
if (this.state === "pending")
|
||||
this.scheduleResolve();
|
||||
}
|
||||
}
|
||||
|
||||
export { KeyframeResolver, flushKeyframeResolvers };
|
||||
//# sourceMappingURL=KeyframesResolver.mjs.map
|
||||
1
node_modules/motion-dom/dist/es/animation/keyframes/KeyframesResolver.mjs.map
generated
vendored
Normal file
1
node_modules/motion-dom/dist/es/animation/keyframes/KeyframesResolver.mjs.map
generated
vendored
Normal file
File diff suppressed because one or more lines are too long
12
node_modules/motion-dom/dist/es/animation/keyframes/get-final.mjs
generated
vendored
Normal file
12
node_modules/motion-dom/dist/es/animation/keyframes/get-final.mjs
generated
vendored
Normal file
@@ -0,0 +1,12 @@
|
||||
const isNotNull = (value) => value !== null;
|
||||
function getFinalKeyframe(keyframes, { repeat, repeatType = "loop" }, finalKeyframe, speed = 1) {
|
||||
const resolvedKeyframes = keyframes.filter(isNotNull);
|
||||
const useFirstKeyframe = speed < 0 || (repeat && repeatType !== "loop" && repeat % 2 === 1);
|
||||
const index = useFirstKeyframe ? 0 : resolvedKeyframes.length - 1;
|
||||
return !index || finalKeyframe === undefined
|
||||
? resolvedKeyframes[index]
|
||||
: finalKeyframe;
|
||||
}
|
||||
|
||||
export { getFinalKeyframe };
|
||||
//# sourceMappingURL=get-final.mjs.map
|
||||
1
node_modules/motion-dom/dist/es/animation/keyframes/get-final.mjs.map
generated
vendored
Normal file
1
node_modules/motion-dom/dist/es/animation/keyframes/get-final.mjs.map
generated
vendored
Normal file
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"get-final.mjs","sources":["../../../../src/animation/keyframes/get-final.ts"],"sourcesContent":["import { AnimationPlaybackOptions } from \"../types\"\n\nconst isNotNull = (value: unknown) => value !== null\n\nexport function getFinalKeyframe<T>(\n keyframes: T[],\n { repeat, repeatType = \"loop\" }: AnimationPlaybackOptions,\n finalKeyframe?: T,\n speed: number = 1\n): T {\n const resolvedKeyframes = keyframes.filter(isNotNull)\n const useFirstKeyframe =\n speed < 0 || (repeat && repeatType !== \"loop\" && repeat % 2 === 1)\n const index = useFirstKeyframe ? 0 : resolvedKeyframes.length - 1\n\n return !index || finalKeyframe === undefined\n ? resolvedKeyframes[index]\n : finalKeyframe\n}\n"],"names":[],"mappings":"AAEA,MAAM,SAAS,GAAG,CAAC,KAAc,KAAK,KAAK,KAAK,IAAI;SAEpC,gBAAgB,CAC5B,SAAc,EACd,EAAE,MAAM,EAAE,UAAU,GAAG,MAAM,EAA4B,EACzD,aAAiB,EACjB,QAAgB,CAAC,EAAA;IAEjB,MAAM,iBAAiB,GAAG,SAAS,CAAC,MAAM,CAAC,SAAS,CAAC;AACrD,IAAA,MAAM,gBAAgB,GAClB,KAAK,GAAG,CAAC,KAAK,MAAM,IAAI,UAAU,KAAK,MAAM,IAAI,MAAM,GAAG,CAAC,KAAK,CAAC,CAAC;AACtE,IAAA,MAAM,KAAK,GAAG,gBAAgB,GAAG,CAAC,GAAG,iBAAiB,CAAC,MAAM,GAAG,CAAC;AAEjE,IAAA,OAAO,CAAC,KAAK,IAAI,aAAa,KAAK;AAC/B,UAAE,iBAAiB,CAAC,KAAK;UACvB,aAAa;AACvB;;;;"}
|
||||
10
node_modules/motion-dom/dist/es/animation/keyframes/offsets/default.mjs
generated
vendored
Normal file
10
node_modules/motion-dom/dist/es/animation/keyframes/offsets/default.mjs
generated
vendored
Normal file
@@ -0,0 +1,10 @@
|
||||
import { fillOffset } from './fill.mjs';
|
||||
|
||||
function defaultOffset(arr) {
|
||||
const offset = [0];
|
||||
fillOffset(offset, arr.length - 1);
|
||||
return offset;
|
||||
}
|
||||
|
||||
export { defaultOffset };
|
||||
//# sourceMappingURL=default.mjs.map
|
||||
1
node_modules/motion-dom/dist/es/animation/keyframes/offsets/default.mjs.map
generated
vendored
Normal file
1
node_modules/motion-dom/dist/es/animation/keyframes/offsets/default.mjs.map
generated
vendored
Normal file
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"default.mjs","sources":["../../../../../src/animation/keyframes/offsets/default.ts"],"sourcesContent":["import { fillOffset } from \"./fill\"\n\nexport function defaultOffset(arr: any[]): number[] {\n const offset = [0]\n fillOffset(offset, arr.length - 1)\n return offset\n}\n"],"names":[],"mappings":";;AAEM,SAAU,aAAa,CAAC,GAAU,EAAA;AACpC,IAAA,MAAM,MAAM,GAAG,CAAC,CAAC,CAAC;IAClB,UAAU,CAAC,MAAM,EAAE,GAAG,CAAC,MAAM,GAAG,CAAC,CAAC;AAClC,IAAA,OAAO,MAAM;AACjB;;;;"}
|
||||
13
node_modules/motion-dom/dist/es/animation/keyframes/offsets/fill.mjs
generated
vendored
Normal file
13
node_modules/motion-dom/dist/es/animation/keyframes/offsets/fill.mjs
generated
vendored
Normal file
@@ -0,0 +1,13 @@
|
||||
import { progress } from 'motion-utils';
|
||||
import { mixNumber } from '../../../utils/mix/number.mjs';
|
||||
|
||||
function fillOffset(offset, remaining) {
|
||||
const min = offset[offset.length - 1];
|
||||
for (let i = 1; i <= remaining; i++) {
|
||||
const offsetProgress = progress(0, remaining, i);
|
||||
offset.push(mixNumber(min, 1, offsetProgress));
|
||||
}
|
||||
}
|
||||
|
||||
export { fillOffset };
|
||||
//# sourceMappingURL=fill.mjs.map
|
||||
1
node_modules/motion-dom/dist/es/animation/keyframes/offsets/fill.mjs.map
generated
vendored
Normal file
1
node_modules/motion-dom/dist/es/animation/keyframes/offsets/fill.mjs.map
generated
vendored
Normal file
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"fill.mjs","sources":["../../../../../src/animation/keyframes/offsets/fill.ts"],"sourcesContent":["import { progress } from \"motion-utils\"\nimport { mixNumber } from \"../../../utils/mix/number\"\n\nexport function fillOffset(offset: number[], remaining: number): void {\n const min = offset[offset.length - 1]\n for (let i = 1; i <= remaining; i++) {\n const offsetProgress = progress(0, remaining, i)\n offset.push(mixNumber(min, 1, offsetProgress))\n }\n}\n"],"names":[],"mappings":";;;AAGM,SAAU,UAAU,CAAC,MAAgB,EAAE,SAAiB,EAAA;IAC1D,MAAM,GAAG,GAAG,MAAM,CAAC,MAAM,CAAC,MAAM,GAAG,CAAC,CAAC;AACrC,IAAA,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,IAAI,SAAS,EAAE,CAAC,EAAE,EAAE;QACjC,MAAM,cAAc,GAAG,QAAQ,CAAC,CAAC,EAAE,SAAS,EAAE,CAAC,CAAC;AAChD,QAAA,MAAM,CAAC,IAAI,CAAC,SAAS,CAAC,GAAG,EAAE,CAAC,EAAE,cAAc,CAAC,CAAC;IAClD;AACJ;;;;"}
|
||||
6
node_modules/motion-dom/dist/es/animation/keyframes/offsets/time.mjs
generated
vendored
Normal file
6
node_modules/motion-dom/dist/es/animation/keyframes/offsets/time.mjs
generated
vendored
Normal file
@@ -0,0 +1,6 @@
|
||||
function convertOffsetToTimes(offset, duration) {
|
||||
return offset.map((o) => o * duration);
|
||||
}
|
||||
|
||||
export { convertOffsetToTimes };
|
||||
//# sourceMappingURL=time.mjs.map
|
||||
1
node_modules/motion-dom/dist/es/animation/keyframes/offsets/time.mjs.map
generated
vendored
Normal file
1
node_modules/motion-dom/dist/es/animation/keyframes/offsets/time.mjs.map
generated
vendored
Normal file
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"time.mjs","sources":["../../../../../src/animation/keyframes/offsets/time.ts"],"sourcesContent":["export function convertOffsetToTimes(offset: number[], duration: number) {\n return offset.map((o) => o * duration)\n}\n"],"names":[],"mappings":"AAAM,SAAU,oBAAoB,CAAC,MAAgB,EAAE,QAAgB,EAAA;AACnE,IAAA,OAAO,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,KAAK,CAAC,GAAG,QAAQ,CAAC;AAC1C;;;;"}
|
||||
12
node_modules/motion-dom/dist/es/animation/keyframes/utils/apply-px-defaults.mjs
generated
vendored
Normal file
12
node_modules/motion-dom/dist/es/animation/keyframes/utils/apply-px-defaults.mjs
generated
vendored
Normal file
@@ -0,0 +1,12 @@
|
||||
import { pxValues } from '../../waapi/utils/px-values.mjs';
|
||||
|
||||
function applyPxDefaults(keyframes, name) {
|
||||
for (let i = 0; i < keyframes.length; i++) {
|
||||
if (typeof keyframes[i] === "number" && pxValues.has(name)) {
|
||||
keyframes[i] = keyframes[i] + "px";
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
export { applyPxDefaults };
|
||||
//# sourceMappingURL=apply-px-defaults.mjs.map
|
||||
1
node_modules/motion-dom/dist/es/animation/keyframes/utils/apply-px-defaults.mjs.map
generated
vendored
Normal file
1
node_modules/motion-dom/dist/es/animation/keyframes/utils/apply-px-defaults.mjs.map
generated
vendored
Normal file
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"apply-px-defaults.mjs","sources":["../../../../../src/animation/keyframes/utils/apply-px-defaults.ts"],"sourcesContent":["import { UnresolvedValueKeyframe, ValueKeyframe } from \"../../types\"\nimport { pxValues } from \"../../waapi/utils/px-values\"\n\nexport function applyPxDefaults(\n keyframes: ValueKeyframe[] | UnresolvedValueKeyframe[],\n name: string\n) {\n for (let i = 0; i < keyframes.length; i++) {\n if (typeof keyframes[i] === \"number\" && pxValues.has(name)) {\n keyframes[i] = keyframes[i] + \"px\"\n }\n }\n}\n"],"names":[],"mappings":";;AAGM,SAAU,eAAe,CAC3B,SAAsD,EACtD,IAAY,EAAA;AAEZ,IAAA,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,SAAS,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE;AACvC,QAAA,IAAI,OAAO,SAAS,CAAC,CAAC,CAAC,KAAK,QAAQ,IAAI,QAAQ,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE;YACxD,SAAS,CAAC,CAAC,CAAC,GAAG,SAAS,CAAC,CAAC,CAAC,GAAG,IAAI;QACtC;IACJ;AACJ;;;;"}
|
||||
8
node_modules/motion-dom/dist/es/animation/keyframes/utils/fill-wildcards.mjs
generated
vendored
Normal file
8
node_modules/motion-dom/dist/es/animation/keyframes/utils/fill-wildcards.mjs
generated
vendored
Normal file
@@ -0,0 +1,8 @@
|
||||
function fillWildcards(keyframes) {
|
||||
for (let i = 1; i < keyframes.length; i++) {
|
||||
keyframes[i] ?? (keyframes[i] = keyframes[i - 1]);
|
||||
}
|
||||
}
|
||||
|
||||
export { fillWildcards };
|
||||
//# sourceMappingURL=fill-wildcards.mjs.map
|
||||
1
node_modules/motion-dom/dist/es/animation/keyframes/utils/fill-wildcards.mjs.map
generated
vendored
Normal file
1
node_modules/motion-dom/dist/es/animation/keyframes/utils/fill-wildcards.mjs.map
generated
vendored
Normal file
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"fill-wildcards.mjs","sources":["../../../../../src/animation/keyframes/utils/fill-wildcards.ts"],"sourcesContent":["import { UnresolvedValueKeyframe, ValueKeyframe } from \"../../types\"\n\nexport function fillWildcards(\n keyframes: ValueKeyframe[] | UnresolvedValueKeyframe[]\n) {\n for (let i = 1; i < keyframes.length; i++) {\n keyframes[i] ??= keyframes[i - 1]\n }\n}\n"],"names":[],"mappings":"AAEM,SAAU,aAAa,CACzB,SAAsD,EAAA;AAEtD,IAAA,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,SAAS,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE;AACvC,QAAA,SAAS,CAAC,CAAC,CAAA,KAAX,SAAS,CAAC,CAAC,CAAA,GAAM,SAAS,CAAC,CAAC,GAAG,CAAC,CAAC,CAAA;IACrC;AACJ;;;;"}
|
||||
16
node_modules/motion-dom/dist/es/animation/keyframes/utils/is-none.mjs
generated
vendored
Normal file
16
node_modules/motion-dom/dist/es/animation/keyframes/utils/is-none.mjs
generated
vendored
Normal file
@@ -0,0 +1,16 @@
|
||||
import { isZeroValueString } from 'motion-utils';
|
||||
|
||||
function isNone(value) {
|
||||
if (typeof value === "number") {
|
||||
return value === 0;
|
||||
}
|
||||
else if (value !== null) {
|
||||
return value === "none" || value === "0" || isZeroValueString(value);
|
||||
}
|
||||
else {
|
||||
return true;
|
||||
}
|
||||
}
|
||||
|
||||
export { isNone };
|
||||
//# sourceMappingURL=is-none.mjs.map
|
||||
1
node_modules/motion-dom/dist/es/animation/keyframes/utils/is-none.mjs.map
generated
vendored
Normal file
1
node_modules/motion-dom/dist/es/animation/keyframes/utils/is-none.mjs.map
generated
vendored
Normal file
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"is-none.mjs","sources":["../../../../../src/animation/keyframes/utils/is-none.ts"],"sourcesContent":["import { isZeroValueString } from \"motion-utils\"\nimport { AnyResolvedKeyframe } from \"../../types\"\n\nexport function isNone(value: AnyResolvedKeyframe | null) {\n if (typeof value === \"number\") {\n return value === 0\n } else if (value !== null) {\n return value === \"none\" || value === \"0\" || isZeroValueString(value)\n } else {\n return true\n }\n}\n"],"names":[],"mappings":";;AAGM,SAAU,MAAM,CAAC,KAAiC,EAAA;AACpD,IAAA,IAAI,OAAO,KAAK,KAAK,QAAQ,EAAE;QAC3B,OAAO,KAAK,KAAK,CAAC;IACtB;AAAO,SAAA,IAAI,KAAK,KAAK,IAAI,EAAE;AACvB,QAAA,OAAO,KAAK,KAAK,MAAM,IAAI,KAAK,KAAK,GAAG,IAAI,iBAAiB,CAAC,KAAK,CAAC;IACxE;SAAO;AACH,QAAA,OAAO,IAAI;IACf;AACJ;;;;"}
|
||||
31
node_modules/motion-dom/dist/es/animation/keyframes/utils/make-none-animatable.mjs
generated
vendored
Normal file
31
node_modules/motion-dom/dist/es/animation/keyframes/utils/make-none-animatable.mjs
generated
vendored
Normal file
@@ -0,0 +1,31 @@
|
||||
import { analyseComplexValue } from '../../../value/types/complex/index.mjs';
|
||||
import { getAnimatableNone } from '../../../value/types/utils/animatable-none.mjs';
|
||||
|
||||
/**
|
||||
* If we encounter keyframes like "none" or "0" and we also have keyframes like
|
||||
* "#fff" or "200px 200px" we want to find a keyframe to serve as a template for
|
||||
* the "none" keyframes. In this case "#fff" or "200px 200px" - then these get turned into
|
||||
* zero equivalents, i.e. "#fff0" or "0px 0px".
|
||||
*/
|
||||
const invalidTemplates = new Set(["auto", "none", "0"]);
|
||||
function makeNoneKeyframesAnimatable(unresolvedKeyframes, noneKeyframeIndexes, name) {
|
||||
let i = 0;
|
||||
let animatableTemplate = undefined;
|
||||
while (i < unresolvedKeyframes.length && !animatableTemplate) {
|
||||
const keyframe = unresolvedKeyframes[i];
|
||||
if (typeof keyframe === "string" &&
|
||||
!invalidTemplates.has(keyframe) &&
|
||||
analyseComplexValue(keyframe).values.length) {
|
||||
animatableTemplate = unresolvedKeyframes[i];
|
||||
}
|
||||
i++;
|
||||
}
|
||||
if (animatableTemplate && name) {
|
||||
for (const noneIndex of noneKeyframeIndexes) {
|
||||
unresolvedKeyframes[noneIndex] = getAnimatableNone(name, animatableTemplate);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
export { makeNoneKeyframesAnimatable };
|
||||
//# sourceMappingURL=make-none-animatable.mjs.map
|
||||
1
node_modules/motion-dom/dist/es/animation/keyframes/utils/make-none-animatable.mjs.map
generated
vendored
Normal file
1
node_modules/motion-dom/dist/es/animation/keyframes/utils/make-none-animatable.mjs.map
generated
vendored
Normal file
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"make-none-animatable.mjs","sources":["../../../../../src/animation/keyframes/utils/make-none-animatable.ts"],"sourcesContent":["import { analyseComplexValue } from \"../../../value/types/complex\"\nimport { getAnimatableNone } from \"../../../value/types/utils/animatable-none\"\nimport { AnyResolvedKeyframe } from \"../../types\"\nimport { UnresolvedKeyframes } from \"../KeyframesResolver\"\n\n/**\n * If we encounter keyframes like \"none\" or \"0\" and we also have keyframes like\n * \"#fff\" or \"200px 200px\" we want to find a keyframe to serve as a template for\n * the \"none\" keyframes. In this case \"#fff\" or \"200px 200px\" - then these get turned into\n * zero equivalents, i.e. \"#fff0\" or \"0px 0px\".\n */\nconst invalidTemplates = new Set([\"auto\", \"none\", \"0\"])\n\nexport function makeNoneKeyframesAnimatable(\n unresolvedKeyframes: UnresolvedKeyframes<AnyResolvedKeyframe>,\n noneKeyframeIndexes: number[],\n name?: string\n) {\n let i = 0\n let animatableTemplate: string | undefined = undefined\n while (i < unresolvedKeyframes.length && !animatableTemplate) {\n const keyframe = unresolvedKeyframes[i]\n if (\n typeof keyframe === \"string\" &&\n !invalidTemplates.has(keyframe) &&\n analyseComplexValue(keyframe).values.length\n ) {\n animatableTemplate = unresolvedKeyframes[i] as string\n }\n i++\n }\n\n if (animatableTemplate && name) {\n for (const noneIndex of noneKeyframeIndexes) {\n unresolvedKeyframes[noneIndex] = getAnimatableNone(\n name,\n animatableTemplate\n )\n }\n }\n}\n"],"names":[],"mappings":";;;AAKA;;;;;AAKG;AACH,MAAM,gBAAgB,GAAG,IAAI,GAAG,CAAC,CAAC,MAAM,EAAE,MAAM,EAAE,GAAG,CAAC,CAAC;SAEvC,2BAA2B,CACvC,mBAA6D,EAC7D,mBAA6B,EAC7B,IAAa,EAAA;IAEb,IAAI,CAAC,GAAG,CAAC;IACT,IAAI,kBAAkB,GAAuB,SAAS;IACtD,OAAO,CAAC,GAAG,mBAAmB,CAAC,MAAM,IAAI,CAAC,kBAAkB,EAAE;AAC1D,QAAA,MAAM,QAAQ,GAAG,mBAAmB,CAAC,CAAC,CAAC;QACvC,IACI,OAAO,QAAQ,KAAK,QAAQ;AAC5B,YAAA,CAAC,gBAAgB,CAAC,GAAG,CAAC,QAAQ,CAAC;YAC/B,mBAAmB,CAAC,QAAQ,CAAC,CAAC,MAAM,CAAC,MAAM,EAC7C;AACE,YAAA,kBAAkB,GAAG,mBAAmB,CAAC,CAAC,CAAW;QACzD;AACA,QAAA,CAAC,EAAE;IACP;AAEA,IAAA,IAAI,kBAAkB,IAAI,IAAI,EAAE;AAC5B,QAAA,KAAK,MAAM,SAAS,IAAI,mBAAmB,EAAE;YACzC,mBAAmB,CAAC,SAAS,CAAC,GAAG,iBAAiB,CAC9C,IAAI,EACJ,kBAAkB,CACrB;QACL;IACJ;AACJ;;;;"}
|
||||
47
node_modules/motion-dom/dist/es/animation/keyframes/utils/unit-conversion.mjs
generated
vendored
Normal file
47
node_modules/motion-dom/dist/es/animation/keyframes/utils/unit-conversion.mjs
generated
vendored
Normal file
@@ -0,0 +1,47 @@
|
||||
import { parseValueFromTransform } from '../../../render/dom/parse-transform.mjs';
|
||||
import { transformPropOrder } from '../../../render/utils/keys-transform.mjs';
|
||||
import { number } from '../../../value/types/numbers/index.mjs';
|
||||
import { px } from '../../../value/types/numbers/units.mjs';
|
||||
|
||||
const isNumOrPxType = (v) => v === number || v === px;
|
||||
const transformKeys = new Set(["x", "y", "z"]);
|
||||
const nonTranslationalTransformKeys = transformPropOrder.filter((key) => !transformKeys.has(key));
|
||||
function removeNonTranslationalTransform(visualElement) {
|
||||
const removedTransforms = [];
|
||||
nonTranslationalTransformKeys.forEach((key) => {
|
||||
const value = visualElement.getValue(key);
|
||||
if (value !== undefined) {
|
||||
removedTransforms.push([key, value.get()]);
|
||||
value.set(key.startsWith("scale") ? 1 : 0);
|
||||
}
|
||||
});
|
||||
return removedTransforms;
|
||||
}
|
||||
const positionalValues = {
|
||||
// Dimensions
|
||||
width: ({ x }, { paddingLeft = "0", paddingRight = "0", boxSizing }) => {
|
||||
const width = x.max - x.min;
|
||||
return boxSizing === "border-box"
|
||||
? width
|
||||
: width - parseFloat(paddingLeft) - parseFloat(paddingRight);
|
||||
},
|
||||
height: ({ y }, { paddingTop = "0", paddingBottom = "0", boxSizing }) => {
|
||||
const height = y.max - y.min;
|
||||
return boxSizing === "border-box"
|
||||
? height
|
||||
: height - parseFloat(paddingTop) - parseFloat(paddingBottom);
|
||||
},
|
||||
top: (_bbox, { top }) => parseFloat(top),
|
||||
left: (_bbox, { left }) => parseFloat(left),
|
||||
bottom: ({ y }, { top }) => parseFloat(top) + (y.max - y.min),
|
||||
right: ({ x }, { left }) => parseFloat(left) + (x.max - x.min),
|
||||
// Transform
|
||||
x: (_bbox, { transform }) => parseValueFromTransform(transform, "x"),
|
||||
y: (_bbox, { transform }) => parseValueFromTransform(transform, "y"),
|
||||
};
|
||||
// Alias translate longform names
|
||||
positionalValues.translateX = positionalValues.x;
|
||||
positionalValues.translateY = positionalValues.y;
|
||||
|
||||
export { isNumOrPxType, positionalValues, removeNonTranslationalTransform };
|
||||
//# sourceMappingURL=unit-conversion.mjs.map
|
||||
1
node_modules/motion-dom/dist/es/animation/keyframes/utils/unit-conversion.mjs.map
generated
vendored
Normal file
1
node_modules/motion-dom/dist/es/animation/keyframes/utils/unit-conversion.mjs.map
generated
vendored
Normal file
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"unit-conversion.mjs","sources":["../../../../../src/animation/keyframes/utils/unit-conversion.ts"],"sourcesContent":["import type { Box } from \"motion-utils\"\nimport { parseValueFromTransform } from \"../../../render/dom/parse-transform\"\nimport { transformPropOrder } from \"../../../render/utils/keys-transform\"\nimport { MotionValue } from \"../../../value\"\nimport { number } from \"../../../value/types/numbers\"\nimport { px } from \"../../../value/types/numbers/units\"\nimport { ValueType } from \"../../../value/types/types\"\nimport { AnyResolvedKeyframe } from \"../../types\"\nimport { WithRender } from \"../types\"\n\nexport const isNumOrPxType = (v?: ValueType): v is ValueType =>\n v === number || v === px\n\ntype GetActualMeasurementInPixels = (\n bbox: Box,\n computedStyle: Partial<CSSStyleDeclaration>\n) => number\n\nconst transformKeys = new Set([\"x\", \"y\", \"z\"])\nconst nonTranslationalTransformKeys = transformPropOrder.filter(\n (key) => !transformKeys.has(key)\n)\n\ntype RemovedTransforms = [string, AnyResolvedKeyframe][]\nexport function removeNonTranslationalTransform(visualElement: WithRender) {\n const removedTransforms: RemovedTransforms = []\n\n nonTranslationalTransformKeys.forEach((key) => {\n const value: MotionValue<AnyResolvedKeyframe> | undefined =\n visualElement.getValue(key)\n if (value !== undefined) {\n removedTransforms.push([key, value.get()])\n value.set(key.startsWith(\"scale\") ? 1 : 0)\n }\n })\n\n return removedTransforms\n}\n\nexport const positionalValues: { [key: string]: GetActualMeasurementInPixels } =\n {\n // Dimensions\n width: (\n { x },\n { paddingLeft = \"0\", paddingRight = \"0\", boxSizing }\n ) => {\n const width = x.max - x.min\n return boxSizing === \"border-box\"\n ? width\n : width - parseFloat(paddingLeft) - parseFloat(paddingRight)\n },\n height: (\n { y },\n { paddingTop = \"0\", paddingBottom = \"0\", boxSizing }\n ) => {\n const height = y.max - y.min\n return boxSizing === \"border-box\"\n ? height\n : height - parseFloat(paddingTop) - parseFloat(paddingBottom)\n },\n\n top: (_bbox, { top }) => parseFloat(top as string),\n left: (_bbox, { left }) => parseFloat(left as string),\n bottom: ({ y }, { top }) => parseFloat(top as string) + (y.max - y.min),\n right: ({ x }, { left }) =>\n parseFloat(left as string) + (x.max - x.min),\n\n // Transform\n x: (_bbox, { transform }) => parseValueFromTransform(transform, \"x\"),\n y: (_bbox, { transform }) => parseValueFromTransform(transform, \"y\"),\n }\n\n// Alias translate longform names\npositionalValues.translateX = positionalValues.x\npositionalValues.translateY = positionalValues.y\n"],"names":[],"mappings":";;;;;AAUO,MAAM,aAAa,GAAG,CAAC,CAAa,KACvC,CAAC,KAAK,MAAM,IAAI,CAAC,KAAK;AAO1B,MAAM,aAAa,GAAG,IAAI,GAAG,CAAC,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC,CAAC;AAC9C,MAAM,6BAA6B,GAAG,kBAAkB,CAAC,MAAM,CAC3D,CAAC,GAAG,KAAK,CAAC,aAAa,CAAC,GAAG,CAAC,GAAG,CAAC,CACnC;AAGK,SAAU,+BAA+B,CAAC,aAAyB,EAAA;IACrE,MAAM,iBAAiB,GAAsB,EAAE;AAE/C,IAAA,6BAA6B,CAAC,OAAO,CAAC,CAAC,GAAG,KAAI;QAC1C,MAAM,KAAK,GACP,aAAa,CAAC,QAAQ,CAAC,GAAG,CAAC;AAC/B,QAAA,IAAI,KAAK,KAAK,SAAS,EAAE;AACrB,YAAA,iBAAiB,CAAC,IAAI,CAAC,CAAC,GAAG,EAAE,KAAK,CAAC,GAAG,EAAE,CAAC,CAAC;AAC1C,YAAA,KAAK,CAAC,GAAG,CAAC,GAAG,CAAC,UAAU,CAAC,OAAO,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;QAC9C;AACJ,IAAA,CAAC,CAAC;AAEF,IAAA,OAAO,iBAAiB;AAC5B;AAEO,MAAM,gBAAgB,GACzB;;AAEI,IAAA,KAAK,EAAE,CACH,EAAE,CAAC,EAAE,EACL,EAAE,WAAW,GAAG,GAAG,EAAE,YAAY,GAAG,GAAG,EAAE,SAAS,EAAE,KACpD;QACA,MAAM,KAAK,GAAG,CAAC,CAAC,GAAG,GAAG,CAAC,CAAC,GAAG;QAC3B,OAAO,SAAS,KAAK;AACjB,cAAE;AACF,cAAE,KAAK,GAAG,UAAU,CAAC,WAAW,CAAC,GAAG,UAAU,CAAC,YAAY,CAAC;IACpE,CAAC;AACD,IAAA,MAAM,EAAE,CACJ,EAAE,CAAC,EAAE,EACL,EAAE,UAAU,GAAG,GAAG,EAAE,aAAa,GAAG,GAAG,EAAE,SAAS,EAAE,KACpD;QACA,MAAM,MAAM,GAAG,CAAC,CAAC,GAAG,GAAG,CAAC,CAAC,GAAG;QAC5B,OAAO,SAAS,KAAK;AACjB,cAAE;AACF,cAAE,MAAM,GAAG,UAAU,CAAC,UAAU,CAAC,GAAG,UAAU,CAAC,aAAa,CAAC;IACrE,CAAC;AAED,IAAA,GAAG,EAAE,CAAC,KAAK,EAAE,EAAE,GAAG,EAAE,KAAK,UAAU,CAAC,GAAa,CAAC;AAClD,IAAA,IAAI,EAAE,CAAC,KAAK,EAAE,EAAE,IAAI,EAAE,KAAK,UAAU,CAAC,IAAc,CAAC;IACrD,MAAM,EAAE,CAAC,EAAE,CAAC,EAAE,EAAE,EAAE,GAAG,EAAE,KAAK,UAAU,CAAC,GAAa,CAAC,IAAI,CAAC,CAAC,GAAG,GAAG,CAAC,CAAC,GAAG,CAAC;IACvE,KAAK,EAAE,CAAC,EAAE,CAAC,EAAE,EAAE,EAAE,IAAI,EAAE,KACnB,UAAU,CAAC,IAAc,CAAC,IAAI,CAAC,CAAC,GAAG,GAAG,CAAC,CAAC,GAAG,CAAC;;AAGhD,IAAA,CAAC,EAAE,CAAC,KAAK,EAAE,EAAE,SAAS,EAAE,KAAK,uBAAuB,CAAC,SAAS,EAAE,GAAG,CAAC;AACpE,IAAA,CAAC,EAAE,CAAC,KAAK,EAAE,EAAE,SAAS,EAAE,KAAK,uBAAuB,CAAC,SAAS,EAAE,GAAG,CAAC;;AAG5E;AACA,gBAAgB,CAAC,UAAU,GAAG,gBAAgB,CAAC,CAAC;AAChD,gBAAgB,CAAC,UAAU,GAAG,gBAAgB,CAAC,CAAC;;;;"}
|
||||
7
node_modules/motion-dom/dist/es/animation/optimized-appear/data-id.mjs
generated
vendored
Normal file
7
node_modules/motion-dom/dist/es/animation/optimized-appear/data-id.mjs
generated
vendored
Normal file
@@ -0,0 +1,7 @@
|
||||
import { camelToDash } from '../../render/dom/utils/camel-to-dash.mjs';
|
||||
|
||||
const optimizedAppearDataId = "framerAppearId";
|
||||
const optimizedAppearDataAttribute = "data-" + camelToDash(optimizedAppearDataId);
|
||||
|
||||
export { optimizedAppearDataAttribute, optimizedAppearDataId };
|
||||
//# sourceMappingURL=data-id.mjs.map
|
||||
1
node_modules/motion-dom/dist/es/animation/optimized-appear/data-id.mjs.map
generated
vendored
Normal file
1
node_modules/motion-dom/dist/es/animation/optimized-appear/data-id.mjs.map
generated
vendored
Normal file
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"data-id.mjs","sources":["../../../../src/animation/optimized-appear/data-id.ts"],"sourcesContent":["import { camelToDash } from \"../../render/dom/utils/camel-to-dash\"\n\nexport const optimizedAppearDataId = \"framerAppearId\"\n\nexport const optimizedAppearDataAttribute =\n \"data-\" + camelToDash(optimizedAppearDataId) as \"data-framer-appear-id\"\n"],"names":[],"mappings":";;AAEO,MAAM,qBAAqB,GAAG;AAE9B,MAAM,4BAA4B,GACrC,OAAO,GAAG,WAAW,CAAC,qBAAqB;;;;"}
|
||||
8
node_modules/motion-dom/dist/es/animation/optimized-appear/get-appear-id.mjs
generated
vendored
Normal file
8
node_modules/motion-dom/dist/es/animation/optimized-appear/get-appear-id.mjs
generated
vendored
Normal file
@@ -0,0 +1,8 @@
|
||||
import { optimizedAppearDataAttribute } from './data-id.mjs';
|
||||
|
||||
function getOptimisedAppearId(visualElement) {
|
||||
return visualElement.props[optimizedAppearDataAttribute];
|
||||
}
|
||||
|
||||
export { getOptimisedAppearId };
|
||||
//# sourceMappingURL=get-appear-id.mjs.map
|
||||
1
node_modules/motion-dom/dist/es/animation/optimized-appear/get-appear-id.mjs.map
generated
vendored
Normal file
1
node_modules/motion-dom/dist/es/animation/optimized-appear/get-appear-id.mjs.map
generated
vendored
Normal file
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"get-appear-id.mjs","sources":["../../../../src/animation/optimized-appear/get-appear-id.ts"],"sourcesContent":["import { optimizedAppearDataAttribute } from \"./data-id\"\nimport type { WithAppearProps } from \"./types\"\n\nexport function getOptimisedAppearId(\n visualElement: WithAppearProps\n): string | undefined {\n return visualElement.props[optimizedAppearDataAttribute]\n}\n"],"names":[],"mappings":";;AAGM,SAAU,oBAAoB,CAChC,aAA8B,EAAA;AAE9B,IAAA,OAAO,aAAa,CAAC,KAAK,CAAC,4BAA4B,CAAC;AAC5D;;;;"}
|
||||
27
node_modules/motion-dom/dist/es/animation/utils/WithPromise.mjs
generated
vendored
Normal file
27
node_modules/motion-dom/dist/es/animation/utils/WithPromise.mjs
generated
vendored
Normal file
@@ -0,0 +1,27 @@
|
||||
class WithPromise {
|
||||
constructor() {
|
||||
this.updateFinished();
|
||||
}
|
||||
get finished() {
|
||||
return this._finished;
|
||||
}
|
||||
updateFinished() {
|
||||
this._finished = new Promise((resolve) => {
|
||||
this.resolve = resolve;
|
||||
});
|
||||
}
|
||||
notifyFinished() {
|
||||
this.resolve();
|
||||
}
|
||||
/**
|
||||
* Allows the animation to be awaited.
|
||||
*
|
||||
* @deprecated Use `finished` instead.
|
||||
*/
|
||||
then(onResolve, onReject) {
|
||||
return this.finished.then(onResolve, onReject);
|
||||
}
|
||||
}
|
||||
|
||||
export { WithPromise };
|
||||
//# sourceMappingURL=WithPromise.mjs.map
|
||||
1
node_modules/motion-dom/dist/es/animation/utils/WithPromise.mjs.map
generated
vendored
Normal file
1
node_modules/motion-dom/dist/es/animation/utils/WithPromise.mjs.map
generated
vendored
Normal file
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"WithPromise.mjs","sources":["../../../../src/animation/utils/WithPromise.ts"],"sourcesContent":["export class WithPromise {\n protected _finished: Promise<void>\n\n resolve: VoidFunction\n\n constructor() {\n this.updateFinished()\n }\n\n get finished() {\n return this._finished\n }\n\n protected updateFinished() {\n this._finished = new Promise<void>((resolve) => {\n this.resolve = resolve\n })\n }\n\n protected notifyFinished() {\n this.resolve()\n }\n\n /**\n * Allows the animation to be awaited.\n *\n * @deprecated Use `finished` instead.\n */\n then(onResolve: VoidFunction, onReject?: VoidFunction) {\n return this.finished.then(onResolve, onReject)\n }\n}\n"],"names":[],"mappings":"MAAa,WAAW,CAAA;AAKpB,IAAA,WAAA,GAAA;QACI,IAAI,CAAC,cAAc,EAAE;IACzB;AAEA,IAAA,IAAI,QAAQ,GAAA;QACR,OAAO,IAAI,CAAC,SAAS;IACzB;IAEU,cAAc,GAAA;QACpB,IAAI,CAAC,SAAS,GAAG,IAAI,OAAO,CAAO,CAAC,OAAO,KAAI;AAC3C,YAAA,IAAI,CAAC,OAAO,GAAG,OAAO;AAC1B,QAAA,CAAC,CAAC;IACN;IAEU,cAAc,GAAA;QACpB,IAAI,CAAC,OAAO,EAAE;IAClB;AAEA;;;;AAIG;IACH,IAAI,CAAC,SAAuB,EAAE,QAAuB,EAAA;QACjD,OAAO,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,SAAS,EAAE,QAAQ,CAAC;IAClD;AACH;;;;"}
|
||||
13
node_modules/motion-dom/dist/es/animation/utils/active-animations.mjs
generated
vendored
Normal file
13
node_modules/motion-dom/dist/es/animation/utils/active-animations.mjs
generated
vendored
Normal file
@@ -0,0 +1,13 @@
|
||||
const animationMaps = new WeakMap();
|
||||
const animationMapKey = (name, pseudoElement = "") => `${name}:${pseudoElement}`;
|
||||
function getAnimationMap(element) {
|
||||
let map = animationMaps.get(element);
|
||||
if (!map) {
|
||||
map = new Map();
|
||||
animationMaps.set(element, map);
|
||||
}
|
||||
return map;
|
||||
}
|
||||
|
||||
export { animationMapKey, getAnimationMap };
|
||||
//# sourceMappingURL=active-animations.mjs.map
|
||||
1
node_modules/motion-dom/dist/es/animation/utils/active-animations.mjs.map
generated
vendored
Normal file
1
node_modules/motion-dom/dist/es/animation/utils/active-animations.mjs.map
generated
vendored
Normal file
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"active-animations.mjs","sources":["../../../../src/animation/utils/active-animations.ts"],"sourcesContent":["import { NativeAnimation } from \"../NativeAnimation\"\nimport { AnyResolvedKeyframe } from \"../types\"\n\nconst animationMaps = new WeakMap<\n Element,\n Map<string, NativeAnimation<AnyResolvedKeyframe>>\n>()\nexport const animationMapKey = (name: string, pseudoElement: string = \"\") =>\n `${name}:${pseudoElement}`\n\nexport function getAnimationMap(element: Element) {\n let map = animationMaps.get(element)\n if (!map) {\n map = new Map()\n animationMaps.set(element, map)\n }\n return map\n}\n"],"names":[],"mappings":"AAGA,MAAM,aAAa,GAAG,IAAI,OAAO,EAG9B;AACI,MAAM,eAAe,GAAG,CAAC,IAAY,EAAE,aAAA,GAAwB,EAAE,KACpE,CAAA,EAAG,IAAI,CAAA,CAAA,EAAI,aAAa;AAEtB,SAAU,eAAe,CAAC,OAAgB,EAAA;IAC5C,IAAI,GAAG,GAAG,aAAa,CAAC,GAAG,CAAC,OAAO,CAAC;IACpC,IAAI,CAAC,GAAG,EAAE;AACN,QAAA,GAAG,GAAG,IAAI,GAAG,EAAE;AACf,QAAA,aAAa,CAAC,GAAG,CAAC,OAAO,EAAE,GAAG,CAAC;IACnC;AACA,IAAA,OAAO,GAAG;AACd;;;;"}
|
||||
16
node_modules/motion-dom/dist/es/animation/utils/calc-child-stagger.mjs
generated
vendored
Normal file
16
node_modules/motion-dom/dist/es/animation/utils/calc-child-stagger.mjs
generated
vendored
Normal file
@@ -0,0 +1,16 @@
|
||||
function calcChildStagger(children, child, delayChildren, staggerChildren = 0, staggerDirection = 1) {
|
||||
const index = Array.from(children)
|
||||
.sort((a, b) => a.sortNodePosition(b))
|
||||
.indexOf(child);
|
||||
const numChildren = children.size;
|
||||
const maxStaggerDuration = (numChildren - 1) * staggerChildren;
|
||||
const delayIsFunction = typeof delayChildren === "function";
|
||||
return delayIsFunction
|
||||
? delayChildren(index, numChildren)
|
||||
: staggerDirection === 1
|
||||
? index * staggerChildren
|
||||
: maxStaggerDuration - index * staggerChildren;
|
||||
}
|
||||
|
||||
export { calcChildStagger };
|
||||
//# sourceMappingURL=calc-child-stagger.mjs.map
|
||||
1
node_modules/motion-dom/dist/es/animation/utils/calc-child-stagger.mjs.map
generated
vendored
Normal file
1
node_modules/motion-dom/dist/es/animation/utils/calc-child-stagger.mjs.map
generated
vendored
Normal file
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"calc-child-stagger.mjs","sources":["../../../../src/animation/utils/calc-child-stagger.ts"],"sourcesContent":["import type { DynamicOption } from \"../types\"\nimport type { VisualElement } from \"../../render/VisualElement\"\n\nexport function calcChildStagger(\n children: Set<VisualElement>,\n child: VisualElement,\n delayChildren?: number | DynamicOption<number>,\n staggerChildren: number = 0,\n staggerDirection: number = 1\n): number {\n const index = Array.from(children)\n .sort((a, b) => a.sortNodePosition(b))\n .indexOf(child)\n const numChildren = children.size\n const maxStaggerDuration = (numChildren - 1) * staggerChildren\n const delayIsFunction = typeof delayChildren === \"function\"\n\n return delayIsFunction\n ? delayChildren(index, numChildren)\n : staggerDirection === 1\n ? index * staggerChildren\n : maxStaggerDuration - index * staggerChildren\n}\n"],"names":[],"mappings":"AAGM,SAAU,gBAAgB,CAC5B,QAA4B,EAC5B,KAAoB,EACpB,aAA8C,EAC9C,eAAA,GAA0B,CAAC,EAC3B,mBAA2B,CAAC,EAAA;AAE5B,IAAA,MAAM,KAAK,GAAG,KAAK,CAAC,IAAI,CAAC,QAAQ;AAC5B,SAAA,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC;SACpC,OAAO,CAAC,KAAK,CAAC;AACnB,IAAA,MAAM,WAAW,GAAG,QAAQ,CAAC,IAAI;IACjC,MAAM,kBAAkB,GAAG,CAAC,WAAW,GAAG,CAAC,IAAI,eAAe;AAC9D,IAAA,MAAM,eAAe,GAAG,OAAO,aAAa,KAAK,UAAU;AAE3D,IAAA,OAAO;AACH,UAAE,aAAa,CAAC,KAAK,EAAE,WAAW;UAChC,gBAAgB,KAAK;cACrB,KAAK,GAAG;AACV,cAAE,kBAAkB,GAAG,KAAK,GAAG,eAAe;AACtD;;;;"}
|
||||
44
node_modules/motion-dom/dist/es/animation/utils/can-animate.mjs
generated
vendored
Normal file
44
node_modules/motion-dom/dist/es/animation/utils/can-animate.mjs
generated
vendored
Normal file
@@ -0,0 +1,44 @@
|
||||
import { warning } from 'motion-utils';
|
||||
import { isGenerator } from '../generators/utils/is-generator.mjs';
|
||||
import { isAnimatable } from './is-animatable.mjs';
|
||||
|
||||
function hasKeyframesChanged(keyframes) {
|
||||
const current = keyframes[0];
|
||||
if (keyframes.length === 1)
|
||||
return true;
|
||||
for (let i = 0; i < keyframes.length; i++) {
|
||||
if (keyframes[i] !== current)
|
||||
return true;
|
||||
}
|
||||
}
|
||||
function canAnimate(keyframes, name, type, velocity) {
|
||||
/**
|
||||
* Check if we're able to animate between the start and end keyframes,
|
||||
* and throw a warning if we're attempting to animate between one that's
|
||||
* animatable and another that isn't.
|
||||
*/
|
||||
const originKeyframe = keyframes[0];
|
||||
if (originKeyframe === null) {
|
||||
return false;
|
||||
}
|
||||
/**
|
||||
* These aren't traditionally animatable but we do support them.
|
||||
* In future we could look into making this more generic or replacing
|
||||
* this function with mix() === mixImmediate
|
||||
*/
|
||||
if (name === "display" || name === "visibility")
|
||||
return true;
|
||||
const targetKeyframe = keyframes[keyframes.length - 1];
|
||||
const isOriginAnimatable = isAnimatable(originKeyframe, name);
|
||||
const isTargetAnimatable = isAnimatable(targetKeyframe, name);
|
||||
warning(isOriginAnimatable === isTargetAnimatable, `You are trying to animate ${name} from "${originKeyframe}" to "${targetKeyframe}". "${isOriginAnimatable ? targetKeyframe : originKeyframe}" is not an animatable value.`, "value-not-animatable");
|
||||
// Always skip if any of these are true
|
||||
if (!isOriginAnimatable || !isTargetAnimatable) {
|
||||
return false;
|
||||
}
|
||||
return (hasKeyframesChanged(keyframes) ||
|
||||
((type === "spring" || isGenerator(type)) && velocity));
|
||||
}
|
||||
|
||||
export { canAnimate };
|
||||
//# sourceMappingURL=can-animate.mjs.map
|
||||
1
node_modules/motion-dom/dist/es/animation/utils/can-animate.mjs.map
generated
vendored
Normal file
1
node_modules/motion-dom/dist/es/animation/utils/can-animate.mjs.map
generated
vendored
Normal file
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"can-animate.mjs","sources":["../../../../src/animation/utils/can-animate.ts"],"sourcesContent":["import { warning } from \"motion-utils\"\nimport { isGenerator } from \"../generators/utils/is-generator\"\nimport { ResolvedKeyframes } from \"../keyframes/KeyframesResolver\"\nimport { AnimationGeneratorType } from \"../types\"\nimport { isAnimatable } from \"./is-animatable\"\n\nfunction hasKeyframesChanged(keyframes: ResolvedKeyframes<any>) {\n const current = keyframes[0]\n if (keyframes.length === 1) return true\n for (let i = 0; i < keyframes.length; i++) {\n if (keyframes[i] !== current) return true\n }\n}\n\nexport function canAnimate(\n keyframes: ResolvedKeyframes<any>,\n name?: string,\n type?: AnimationGeneratorType,\n velocity?: number\n) {\n /**\n * Check if we're able to animate between the start and end keyframes,\n * and throw a warning if we're attempting to animate between one that's\n * animatable and another that isn't.\n */\n const originKeyframe = keyframes[0]\n if (originKeyframe === null) {\n return false\n }\n\n /**\n * These aren't traditionally animatable but we do support them.\n * In future we could look into making this more generic or replacing\n * this function with mix() === mixImmediate\n */\n if (name === \"display\" || name === \"visibility\") return true\n\n const targetKeyframe = keyframes[keyframes.length - 1]\n const isOriginAnimatable = isAnimatable(originKeyframe, name)\n const isTargetAnimatable = isAnimatable(targetKeyframe, name)\n\n warning(\n isOriginAnimatable === isTargetAnimatable,\n `You are trying to animate ${name} from \"${originKeyframe}\" to \"${targetKeyframe}\". \"${\n isOriginAnimatable ? targetKeyframe : originKeyframe\n }\" is not an animatable value.`,\n \"value-not-animatable\"\n )\n\n // Always skip if any of these are true\n if (!isOriginAnimatable || !isTargetAnimatable) {\n return false\n }\n\n return (\n hasKeyframesChanged(keyframes) ||\n ((type === \"spring\" || isGenerator(type)) && velocity)\n )\n}\n"],"names":[],"mappings":";;;;AAMA,SAAS,mBAAmB,CAAC,SAAiC,EAAA;AAC1D,IAAA,MAAM,OAAO,GAAG,SAAS,CAAC,CAAC,CAAC;AAC5B,IAAA,IAAI,SAAS,CAAC,MAAM,KAAK,CAAC;AAAE,QAAA,OAAO,IAAI;AACvC,IAAA,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,SAAS,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE;AACvC,QAAA,IAAI,SAAS,CAAC,CAAC,CAAC,KAAK,OAAO;AAAE,YAAA,OAAO,IAAI;IAC7C;AACJ;AAEM,SAAU,UAAU,CACtB,SAAiC,EACjC,IAAa,EACb,IAA6B,EAC7B,QAAiB,EAAA;AAEjB;;;;AAIG;AACH,IAAA,MAAM,cAAc,GAAG,SAAS,CAAC,CAAC,CAAC;AACnC,IAAA,IAAI,cAAc,KAAK,IAAI,EAAE;AACzB,QAAA,OAAO,KAAK;IAChB;AAEA;;;;AAIG;AACH,IAAA,IAAI,IAAI,KAAK,SAAS,IAAI,IAAI,KAAK,YAAY;AAAE,QAAA,OAAO,IAAI;IAE5D,MAAM,cAAc,GAAG,SAAS,CAAC,SAAS,CAAC,MAAM,GAAG,CAAC,CAAC;IACtD,MAAM,kBAAkB,GAAG,YAAY,CAAC,cAAc,EAAE,IAAI,CAAC;IAC7D,MAAM,kBAAkB,GAAG,YAAY,CAAC,cAAc,EAAE,IAAI,CAAC;IAE7D,OAAO,CACH,kBAAkB,KAAK,kBAAkB,EACzC,6BAA6B,IAAI,CAAA,OAAA,EAAU,cAAc,CAAA,MAAA,EAAS,cAAc,CAAA,IAAA,EAC5E,kBAAkB,GAAG,cAAc,GAAG,cAC1C,CAAA,6BAAA,CAA+B,EAC/B,sBAAsB,CACzB;;AAGD,IAAA,IAAI,CAAC,kBAAkB,IAAI,CAAC,kBAAkB,EAAE;AAC5C,QAAA,OAAO,KAAK;IAChB;AAEA,IAAA,QACI,mBAAmB,CAAC,SAAS,CAAC;AAC9B,SAAC,CAAC,IAAI,KAAK,QAAQ,IAAI,WAAW,CAAC,IAAI,CAAC,KAAK,QAAQ,CAAC;AAE9D;;;;"}
|
||||
42
node_modules/motion-dom/dist/es/animation/utils/css-variables-conversion.mjs
generated
vendored
Normal file
42
node_modules/motion-dom/dist/es/animation/utils/css-variables-conversion.mjs
generated
vendored
Normal file
@@ -0,0 +1,42 @@
|
||||
import { invariant, isNumericalString } from 'motion-utils';
|
||||
import { isCSSVariableToken } from './is-css-variable.mjs';
|
||||
|
||||
/**
|
||||
* Parse Framer's special CSS variable format into a CSS token and a fallback.
|
||||
*
|
||||
* ```
|
||||
* `var(--foo, #fff)` => [`--foo`, '#fff']
|
||||
* ```
|
||||
*
|
||||
* @param current
|
||||
*/
|
||||
const splitCSSVariableRegex =
|
||||
// eslint-disable-next-line redos-detector/no-unsafe-regex -- false positive, as it can match a lot of words
|
||||
/^var\(--(?:([\w-]+)|([\w-]+), ?([a-zA-Z\d ()%#.,-]+))\)/u;
|
||||
function parseCSSVariable(current) {
|
||||
const match = splitCSSVariableRegex.exec(current);
|
||||
if (!match)
|
||||
return [,];
|
||||
const [, token1, token2, fallback] = match;
|
||||
return [`--${token1 ?? token2}`, fallback];
|
||||
}
|
||||
const maxDepth = 4;
|
||||
function getVariableValue(current, element, depth = 1) {
|
||||
invariant(depth <= maxDepth, `Max CSS variable fallback depth detected in property "${current}". This may indicate a circular fallback dependency.`, "max-css-var-depth");
|
||||
const [token, fallback] = parseCSSVariable(current);
|
||||
// No CSS variable detected
|
||||
if (!token)
|
||||
return;
|
||||
// Attempt to read this CSS variable off the element
|
||||
const resolved = window.getComputedStyle(element).getPropertyValue(token);
|
||||
if (resolved) {
|
||||
const trimmed = resolved.trim();
|
||||
return isNumericalString(trimmed) ? parseFloat(trimmed) : trimmed;
|
||||
}
|
||||
return isCSSVariableToken(fallback)
|
||||
? getVariableValue(fallback, element, depth + 1)
|
||||
: fallback;
|
||||
}
|
||||
|
||||
export { getVariableValue, parseCSSVariable };
|
||||
//# sourceMappingURL=css-variables-conversion.mjs.map
|
||||
1
node_modules/motion-dom/dist/es/animation/utils/css-variables-conversion.mjs.map
generated
vendored
Normal file
1
node_modules/motion-dom/dist/es/animation/utils/css-variables-conversion.mjs.map
generated
vendored
Normal file
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"css-variables-conversion.mjs","sources":["../../../../src/animation/utils/css-variables-conversion.ts"],"sourcesContent":["import { invariant, isNumericalString } from \"motion-utils\"\nimport { AnyResolvedKeyframe } from \"../types\"\nimport { CSSVariableToken, isCSSVariableToken } from \"./is-css-variable\"\n\n/**\n * Parse Framer's special CSS variable format into a CSS token and a fallback.\n *\n * ```\n * `var(--foo, #fff)` => [`--foo`, '#fff']\n * ```\n *\n * @param current\n */\n\nconst splitCSSVariableRegex =\n // eslint-disable-next-line redos-detector/no-unsafe-regex -- false positive, as it can match a lot of words\n /^var\\(--(?:([\\w-]+)|([\\w-]+), ?([a-zA-Z\\d ()%#.,-]+))\\)/u\nexport function parseCSSVariable(current: string) {\n const match = splitCSSVariableRegex.exec(current)\n if (!match) return [,]\n\n const [, token1, token2, fallback] = match\n return [`--${token1 ?? token2}`, fallback]\n}\n\nconst maxDepth = 4\nexport function getVariableValue(\n current: CSSVariableToken,\n element: Element,\n depth = 1\n): AnyResolvedKeyframe | undefined {\n invariant(\n depth <= maxDepth,\n `Max CSS variable fallback depth detected in property \"${current}\". This may indicate a circular fallback dependency.`,\n \"max-css-var-depth\"\n )\n\n const [token, fallback] = parseCSSVariable(current)\n\n // No CSS variable detected\n if (!token) return\n\n // Attempt to read this CSS variable off the element\n const resolved = window.getComputedStyle(element).getPropertyValue(token)\n\n if (resolved) {\n const trimmed = resolved.trim()\n return isNumericalString(trimmed) ? parseFloat(trimmed) : trimmed\n }\n\n return isCSSVariableToken(fallback)\n ? getVariableValue(fallback, element, depth + 1)\n : fallback\n}\n"],"names":[],"mappings":";;;AAIA;;;;;;;;AAQG;AAEH,MAAM,qBAAqB;AACvB;AACA,0DAA0D;AACxD,SAAU,gBAAgB,CAAC,OAAe,EAAA;IAC5C,MAAM,KAAK,GAAG,qBAAqB,CAAC,IAAI,CAAC,OAAO,CAAC;AACjD,IAAA,IAAI,CAAC,KAAK;QAAE,OAAO,GAAG;IAEtB,MAAM,GAAG,MAAM,EAAE,MAAM,EAAE,QAAQ,CAAC,GAAG,KAAK;IAC1C,OAAO,CAAC,KAAK,MAAM,IAAI,MAAM,CAAA,CAAE,EAAE,QAAQ,CAAC;AAC9C;AAEA,MAAM,QAAQ,GAAG,CAAC;AACZ,SAAU,gBAAgB,CAC5B,OAAyB,EACzB,OAAgB,EAChB,KAAK,GAAG,CAAC,EAAA;IAET,SAAS,CACL,KAAK,IAAI,QAAQ,EACjB,CAAA,sDAAA,EAAyD,OAAO,CAAA,oDAAA,CAAsD,EACtH,mBAAmB,CACtB;IAED,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,gBAAgB,CAAC,OAAO,CAAC;;AAGnD,IAAA,IAAI,CAAC,KAAK;QAAE;;AAGZ,IAAA,MAAM,QAAQ,GAAG,MAAM,CAAC,gBAAgB,CAAC,OAAO,CAAC,CAAC,gBAAgB,CAAC,KAAK,CAAC;IAEzE,IAAI,QAAQ,EAAE;AACV,QAAA,MAAM,OAAO,GAAG,QAAQ,CAAC,IAAI,EAAE;AAC/B,QAAA,OAAO,iBAAiB,CAAC,OAAO,CAAC,GAAG,UAAU,CAAC,OAAO,CAAC,GAAG,OAAO;IACrE;IAEA,OAAO,kBAAkB,CAAC,QAAQ;UAC5B,gBAAgB,CAAC,QAAQ,EAAE,OAAO,EAAE,KAAK,GAAG,CAAC;UAC7C,QAAQ;AAClB;;;;"}
|
||||
41
node_modules/motion-dom/dist/es/animation/utils/default-transitions.mjs
generated
vendored
Normal file
41
node_modules/motion-dom/dist/es/animation/utils/default-transitions.mjs
generated
vendored
Normal file
@@ -0,0 +1,41 @@
|
||||
import { transformProps } from '../../render/utils/keys-transform.mjs';
|
||||
|
||||
const underDampedSpring = {
|
||||
type: "spring",
|
||||
stiffness: 500,
|
||||
damping: 25,
|
||||
restSpeed: 10,
|
||||
};
|
||||
const criticallyDampedSpring = (target) => ({
|
||||
type: "spring",
|
||||
stiffness: 550,
|
||||
damping: target === 0 ? 2 * Math.sqrt(550) : 30,
|
||||
restSpeed: 10,
|
||||
});
|
||||
const keyframesTransition = {
|
||||
type: "keyframes",
|
||||
duration: 0.8,
|
||||
};
|
||||
/**
|
||||
* Default easing curve is a slightly shallower version of
|
||||
* the default browser easing curve.
|
||||
*/
|
||||
const ease = {
|
||||
type: "keyframes",
|
||||
ease: [0.25, 0.1, 0.35, 1],
|
||||
duration: 0.3,
|
||||
};
|
||||
const getDefaultTransition = (valueKey, { keyframes }) => {
|
||||
if (keyframes.length > 2) {
|
||||
return keyframesTransition;
|
||||
}
|
||||
else if (transformProps.has(valueKey)) {
|
||||
return valueKey.startsWith("scale")
|
||||
? criticallyDampedSpring(keyframes[1])
|
||||
: underDampedSpring;
|
||||
}
|
||||
return ease;
|
||||
};
|
||||
|
||||
export { getDefaultTransition };
|
||||
//# sourceMappingURL=default-transitions.mjs.map
|
||||
1
node_modules/motion-dom/dist/es/animation/utils/default-transitions.mjs.map
generated
vendored
Normal file
1
node_modules/motion-dom/dist/es/animation/utils/default-transitions.mjs.map
generated
vendored
Normal file
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"default-transitions.mjs","sources":["../../../../src/animation/utils/default-transitions.ts"],"sourcesContent":["import { transformProps } from \"../../render/utils/keys-transform\"\nimport type { ValueAnimationOptions } from \"../types\"\n\nconst underDampedSpring: Partial<ValueAnimationOptions> = {\n type: \"spring\",\n stiffness: 500,\n damping: 25,\n restSpeed: 10,\n}\n\nconst criticallyDampedSpring = (\n target: unknown\n): Partial<ValueAnimationOptions> => ({\n type: \"spring\",\n stiffness: 550,\n damping: target === 0 ? 2 * Math.sqrt(550) : 30,\n restSpeed: 10,\n})\n\nconst keyframesTransition: Partial<ValueAnimationOptions> = {\n type: \"keyframes\",\n duration: 0.8,\n}\n\n/**\n * Default easing curve is a slightly shallower version of\n * the default browser easing curve.\n */\nconst ease: Partial<ValueAnimationOptions> = {\n type: \"keyframes\",\n ease: [0.25, 0.1, 0.35, 1],\n duration: 0.3,\n}\n\nexport const getDefaultTransition = (\n valueKey: string,\n { keyframes }: ValueAnimationOptions\n): Partial<ValueAnimationOptions> => {\n if (keyframes.length > 2) {\n return keyframesTransition\n } else if (transformProps.has(valueKey)) {\n return valueKey.startsWith(\"scale\")\n ? criticallyDampedSpring(keyframes[1])\n : underDampedSpring\n }\n\n return ease\n}\n"],"names":[],"mappings":";;AAGA,MAAM,iBAAiB,GAAmC;AACtD,IAAA,IAAI,EAAE,QAAQ;AACd,IAAA,SAAS,EAAE,GAAG;AACd,IAAA,OAAO,EAAE,EAAE;AACX,IAAA,SAAS,EAAE,EAAE;CAChB;AAED,MAAM,sBAAsB,GAAG,CAC3B,MAAe,MACmB;AAClC,IAAA,IAAI,EAAE,QAAQ;AACd,IAAA,SAAS,EAAE,GAAG;AACd,IAAA,OAAO,EAAE,MAAM,KAAK,CAAC,GAAG,CAAC,GAAG,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,GAAG,EAAE;AAC/C,IAAA,SAAS,EAAE,EAAE;AAChB,CAAA,CAAC;AAEF,MAAM,mBAAmB,GAAmC;AACxD,IAAA,IAAI,EAAE,WAAW;AACjB,IAAA,QAAQ,EAAE,GAAG;CAChB;AAED;;;AAGG;AACH,MAAM,IAAI,GAAmC;AACzC,IAAA,IAAI,EAAE,WAAW;IACjB,IAAI,EAAE,CAAC,IAAI,EAAE,GAAG,EAAE,IAAI,EAAE,CAAC,CAAC;AAC1B,IAAA,QAAQ,EAAE,GAAG;CAChB;AAEM,MAAM,oBAAoB,GAAG,CAChC,QAAgB,EAChB,EAAE,SAAS,EAAyB,KACJ;AAChC,IAAA,IAAI,SAAS,CAAC,MAAM,GAAG,CAAC,EAAE;AACtB,QAAA,OAAO,mBAAmB;IAC9B;AAAO,SAAA,IAAI,cAAc,CAAC,GAAG,CAAC,QAAQ,CAAC,EAAE;AACrC,QAAA,OAAO,QAAQ,CAAC,UAAU,CAAC,OAAO;AAC9B,cAAE,sBAAsB,CAAC,SAAS,CAAC,CAAC,CAAC;cACnC,iBAAiB;IAC3B;AAEA,IAAA,OAAO,IAAI;AACf;;;;"}
|
||||
14
node_modules/motion-dom/dist/es/animation/utils/get-value-transition.mjs
generated
vendored
Normal file
14
node_modules/motion-dom/dist/es/animation/utils/get-value-transition.mjs
generated
vendored
Normal file
@@ -0,0 +1,14 @@
|
||||
import { resolveTransition } from './resolve-transition.mjs';
|
||||
|
||||
function getValueTransition(transition, key) {
|
||||
const valueTransition = transition?.[key] ??
|
||||
transition?.["default"] ??
|
||||
transition;
|
||||
if (valueTransition !== transition) {
|
||||
return resolveTransition(valueTransition, transition);
|
||||
}
|
||||
return valueTransition;
|
||||
}
|
||||
|
||||
export { getValueTransition };
|
||||
//# sourceMappingURL=get-value-transition.mjs.map
|
||||
1
node_modules/motion-dom/dist/es/animation/utils/get-value-transition.mjs.map
generated
vendored
Normal file
1
node_modules/motion-dom/dist/es/animation/utils/get-value-transition.mjs.map
generated
vendored
Normal file
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"get-value-transition.mjs","sources":["../../../../src/animation/utils/get-value-transition.ts"],"sourcesContent":["import { resolveTransition } from \"./resolve-transition\"\n\nexport function getValueTransition(transition: any, key: string) {\n const valueTransition =\n transition?.[key as keyof typeof transition] ??\n transition?.[\"default\"] ??\n transition\n\n if (valueTransition !== transition) {\n return resolveTransition(valueTransition, transition)\n }\n\n return valueTransition\n}\n"],"names":[],"mappings":";;AAEM,SAAU,kBAAkB,CAAC,UAAe,EAAE,GAAW,EAAA;AAC3D,IAAA,MAAM,eAAe,GACjB,UAAU,GAAG,GAA8B,CAAC;QAC5C,UAAU,GAAG,SAAS,CAAC;AACvB,QAAA,UAAU;AAEd,IAAA,IAAI,eAAe,KAAK,UAAU,EAAE;AAChC,QAAA,OAAO,iBAAiB,CAAC,eAAe,EAAE,UAAU,CAAC;IACzD;AAEA,IAAA,OAAO,eAAe;AAC1B;;;;"}
|
||||
31
node_modules/motion-dom/dist/es/animation/utils/is-animatable.mjs
generated
vendored
Normal file
31
node_modules/motion-dom/dist/es/animation/utils/is-animatable.mjs
generated
vendored
Normal file
@@ -0,0 +1,31 @@
|
||||
import { complex } from '../../value/types/complex/index.mjs';
|
||||
|
||||
/**
|
||||
* Check if a value is animatable. Examples:
|
||||
*
|
||||
* ✅: 100, "100px", "#fff"
|
||||
* ❌: "block", "url(2.jpg)"
|
||||
* @param value
|
||||
*
|
||||
* @internal
|
||||
*/
|
||||
const isAnimatable = (value, name) => {
|
||||
// If the list of keys that might be non-animatable grows, replace with Set
|
||||
if (name === "zIndex")
|
||||
return false;
|
||||
// If it's a number or a keyframes array, we can animate it. We might at some point
|
||||
// need to do a deep isAnimatable check of keyframes, or let Popmotion handle this,
|
||||
// but for now lets leave it like this for performance reasons
|
||||
if (typeof value === "number" || Array.isArray(value))
|
||||
return true;
|
||||
if (typeof value === "string" && // It's animatable if we have a string
|
||||
(complex.test(value) || value === "0") && // And it contains numbers and/or colors
|
||||
!value.startsWith("url(") // Unless it starts with "url("
|
||||
) {
|
||||
return true;
|
||||
}
|
||||
return false;
|
||||
};
|
||||
|
||||
export { isAnimatable };
|
||||
//# sourceMappingURL=is-animatable.mjs.map
|
||||
1
node_modules/motion-dom/dist/es/animation/utils/is-animatable.mjs.map
generated
vendored
Normal file
1
node_modules/motion-dom/dist/es/animation/utils/is-animatable.mjs.map
generated
vendored
Normal file
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"is-animatable.mjs","sources":["../../../../src/animation/utils/is-animatable.ts"],"sourcesContent":["import { complex } from \"../../value/types/complex\"\nimport { ValueKeyframesDefinition } from \"../types\"\n\n/**\n * Check if a value is animatable. Examples:\n *\n * ✅: 100, \"100px\", \"#fff\"\n * ❌: \"block\", \"url(2.jpg)\"\n * @param value\n *\n * @internal\n */\nexport const isAnimatable = (\n value: ValueKeyframesDefinition,\n name?: string\n) => {\n // If the list of keys that might be non-animatable grows, replace with Set\n if (name === \"zIndex\") return false\n\n // If it's a number or a keyframes array, we can animate it. We might at some point\n // need to do a deep isAnimatable check of keyframes, or let Popmotion handle this,\n // but for now lets leave it like this for performance reasons\n if (typeof value === \"number\" || Array.isArray(value)) return true\n\n if (\n typeof value === \"string\" && // It's animatable if we have a string\n (complex.test(value) || value === \"0\") && // And it contains numbers and/or colors\n !value.startsWith(\"url(\") // Unless it starts with \"url(\"\n ) {\n return true\n }\n\n return false\n}\n"],"names":[],"mappings":";;AAGA;;;;;;;;AAQG;MACU,YAAY,GAAG,CACxB,KAA+B,EAC/B,IAAa,KACb;;IAEA,IAAI,IAAI,KAAK,QAAQ;AAAE,QAAA,OAAO,KAAK;;;;IAKnC,IAAI,OAAO,KAAK,KAAK,QAAQ,IAAI,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC;AAAE,QAAA,OAAO,IAAI;AAElE,IAAA,IACI,OAAO,KAAK,KAAK,QAAQ;AACzB,SAAC,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,KAAK,KAAK,GAAG,CAAC;AACtC,QAAA,CAAC,KAAK,CAAC,UAAU,CAAC,MAAM,CAAC;MAC3B;AACE,QAAA,OAAO,IAAI;IACf;AAEA,IAAA,OAAO,KAAK;AAChB;;;;"}
|
||||
27
node_modules/motion-dom/dist/es/animation/utils/is-css-variable.mjs
generated
vendored
Normal file
27
node_modules/motion-dom/dist/es/animation/utils/is-css-variable.mjs
generated
vendored
Normal file
@@ -0,0 +1,27 @@
|
||||
const checkStringStartsWith = (token) => (key) => typeof key === "string" && key.startsWith(token);
|
||||
const isCSSVariableName =
|
||||
/*@__PURE__*/ checkStringStartsWith("--");
|
||||
const startsAsVariableToken =
|
||||
/*@__PURE__*/ checkStringStartsWith("var(--");
|
||||
const isCSSVariableToken = (value) => {
|
||||
const startsWithToken = startsAsVariableToken(value);
|
||||
if (!startsWithToken)
|
||||
return false;
|
||||
// Ensure any comments are stripped from the value as this can harm performance of the regex.
|
||||
return singleCssVariableRegex.test(value.split("/*")[0].trim());
|
||||
};
|
||||
const singleCssVariableRegex = /var\(--(?:[\w-]+\s*|[\w-]+\s*,(?:\s*[^)(\s]|\s*\((?:[^)(]|\([^)(]*\))*\))+\s*)\)$/iu;
|
||||
/**
|
||||
* Check if a value contains a CSS variable anywhere (e.g. inside calc()).
|
||||
* Unlike isCSSVariableToken which checks if the value IS a var() token,
|
||||
* this checks if the value CONTAINS var() somewhere in the string.
|
||||
*/
|
||||
function containsCSSVariable(value) {
|
||||
if (typeof value !== "string")
|
||||
return false;
|
||||
// Strip comments to avoid false positives
|
||||
return value.split("/*")[0].includes("var(--");
|
||||
}
|
||||
|
||||
export { containsCSSVariable, isCSSVariableName, isCSSVariableToken };
|
||||
//# sourceMappingURL=is-css-variable.mjs.map
|
||||
1
node_modules/motion-dom/dist/es/animation/utils/is-css-variable.mjs.map
generated
vendored
Normal file
1
node_modules/motion-dom/dist/es/animation/utils/is-css-variable.mjs.map
generated
vendored
Normal file
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"is-css-variable.mjs","sources":["../../../../src/animation/utils/is-css-variable.ts"],"sourcesContent":["import { AnyResolvedKeyframe } from \"../types\"\n\nexport type CSSVariableName = `--${string}`\n\nexport type CSSVariableToken = `var(${CSSVariableName})`\n\nconst checkStringStartsWith =\n <T extends string>(token: string) =>\n (key?: AnyResolvedKeyframe | null): key is T =>\n typeof key === \"string\" && key.startsWith(token)\n\nexport const isCSSVariableName =\n /*@__PURE__*/ checkStringStartsWith<CSSVariableName>(\"--\")\n\nconst startsAsVariableToken =\n /*@__PURE__*/ checkStringStartsWith<CSSVariableToken>(\"var(--\")\nexport const isCSSVariableToken = (\n value?: string\n): value is CSSVariableToken => {\n const startsWithToken = startsAsVariableToken(value)\n\n if (!startsWithToken) return false\n\n // Ensure any comments are stripped from the value as this can harm performance of the regex.\n return singleCssVariableRegex.test(value.split(\"/*\")[0].trim())\n}\n\nconst singleCssVariableRegex =\n /var\\(--(?:[\\w-]+\\s*|[\\w-]+\\s*,(?:\\s*[^)(\\s]|\\s*\\((?:[^)(]|\\([^)(]*\\))*\\))+\\s*)\\)$/iu\n\n/**\n * Check if a value contains a CSS variable anywhere (e.g. inside calc()).\n * Unlike isCSSVariableToken which checks if the value IS a var() token,\n * this checks if the value CONTAINS var() somewhere in the string.\n */\nexport function containsCSSVariable(\n value?: AnyResolvedKeyframe | null\n): boolean {\n if (typeof value !== \"string\") return false\n // Strip comments to avoid false positives\n return value.split(\"/*\")[0].includes(\"var(--\")\n}\n"],"names":[],"mappings":"AAMA,MAAM,qBAAqB,GACvB,CAAmB,KAAa,KAChC,CAAC,GAAgC,KAC7B,OAAO,GAAG,KAAK,QAAQ,IAAI,GAAG,CAAC,UAAU,CAAC,KAAK,CAAC;MAE3C,iBAAiB;AAC1B,cAAc,qBAAqB,CAAkB,IAAI;AAE7D,MAAM,qBAAqB;AACvB,cAAc,qBAAqB,CAAmB,QAAQ,CAAC;AAC5D,MAAM,kBAAkB,GAAG,CAC9B,KAAc,KACa;AAC3B,IAAA,MAAM,eAAe,GAAG,qBAAqB,CAAC,KAAK,CAAC;AAEpD,IAAA,IAAI,CAAC,eAAe;AAAE,QAAA,OAAO,KAAK;;AAGlC,IAAA,OAAO,sBAAsB,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,EAAE,CAAC;AACnE;AAEA,MAAM,sBAAsB,GACxB,qFAAqF;AAEzF;;;;AAIG;AACG,SAAU,mBAAmB,CAC/B,KAAkC,EAAA;IAElC,IAAI,OAAO,KAAK,KAAK,QAAQ;AAAE,QAAA,OAAO,KAAK;;AAE3C,IAAA,OAAO,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,QAAQ,CAAC;AAClD;;;;"}
|
||||
27
node_modules/motion-dom/dist/es/animation/utils/is-transition-defined.mjs
generated
vendored
Normal file
27
node_modules/motion-dom/dist/es/animation/utils/is-transition-defined.mjs
generated
vendored
Normal file
@@ -0,0 +1,27 @@
|
||||
const orchestrationKeys = new Set([
|
||||
"when",
|
||||
"delay",
|
||||
"delayChildren",
|
||||
"staggerChildren",
|
||||
"staggerDirection",
|
||||
"repeat",
|
||||
"repeatType",
|
||||
"repeatDelay",
|
||||
"from",
|
||||
"elapsed",
|
||||
]);
|
||||
/**
|
||||
* Decide whether a transition is defined on a given Transition.
|
||||
* This filters out orchestration options and returns true
|
||||
* if any options are left.
|
||||
*/
|
||||
function isTransitionDefined(transition) {
|
||||
for (const key in transition) {
|
||||
if (!orchestrationKeys.has(key))
|
||||
return true;
|
||||
}
|
||||
return false;
|
||||
}
|
||||
|
||||
export { isTransitionDefined };
|
||||
//# sourceMappingURL=is-transition-defined.mjs.map
|
||||
1
node_modules/motion-dom/dist/es/animation/utils/is-transition-defined.mjs.map
generated
vendored
Normal file
1
node_modules/motion-dom/dist/es/animation/utils/is-transition-defined.mjs.map
generated
vendored
Normal file
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"is-transition-defined.mjs","sources":["../../../../src/animation/utils/is-transition-defined.ts"],"sourcesContent":["import type { AnyResolvedKeyframe } from \"../types\"\nimport type { Transition } from \"../types\"\n\nconst orchestrationKeys = new Set([\n \"when\",\n \"delay\",\n \"delayChildren\",\n \"staggerChildren\",\n \"staggerDirection\",\n \"repeat\",\n \"repeatType\",\n \"repeatDelay\",\n \"from\",\n \"elapsed\",\n])\n\n/**\n * Decide whether a transition is defined on a given Transition.\n * This filters out orchestration options and returns true\n * if any options are left.\n */\nexport function isTransitionDefined(\n transition: Transition & { elapsed?: number; from?: AnyResolvedKeyframe }\n) {\n for (const key in transition) {\n if (!orchestrationKeys.has(key)) return true\n }\n return false\n}\n"],"names":[],"mappings":"AAGA,MAAM,iBAAiB,GAAG,IAAI,GAAG,CAAC;IAC9B,MAAM;IACN,OAAO;IACP,eAAe;IACf,iBAAiB;IACjB,kBAAkB;IAClB,QAAQ;IACR,YAAY;IACZ,aAAa;IACb,MAAM;IACN,SAAS;AACZ,CAAA,CAAC;AAEF;;;;AAIG;AACG,SAAU,mBAAmB,CAC/B,UAAyE,EAAA;AAEzE,IAAA,KAAK,MAAM,GAAG,IAAI,UAAU,EAAE;AAC1B,QAAA,IAAI,CAAC,iBAAiB,CAAC,GAAG,CAAC,GAAG,CAAC;AAAE,YAAA,OAAO,IAAI;IAChD;AACA,IAAA,OAAO,KAAK;AAChB;;;;"}
|
||||
7
node_modules/motion-dom/dist/es/animation/utils/make-animation-instant.mjs
generated
vendored
Normal file
7
node_modules/motion-dom/dist/es/animation/utils/make-animation-instant.mjs
generated
vendored
Normal file
@@ -0,0 +1,7 @@
|
||||
function makeAnimationInstant(options) {
|
||||
options.duration = 0;
|
||||
options.type = "keyframes";
|
||||
}
|
||||
|
||||
export { makeAnimationInstant };
|
||||
//# sourceMappingURL=make-animation-instant.mjs.map
|
||||
1
node_modules/motion-dom/dist/es/animation/utils/make-animation-instant.mjs.map
generated
vendored
Normal file
1
node_modules/motion-dom/dist/es/animation/utils/make-animation-instant.mjs.map
generated
vendored
Normal file
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"make-animation-instant.mjs","sources":["../../../../src/animation/utils/make-animation-instant.ts"],"sourcesContent":["import { ValueAnimationOptions } from \"../types\"\n\nexport function makeAnimationInstant(\n options: Partial<{\n duration: ValueAnimationOptions[\"duration\"]\n type: ValueAnimationOptions[\"type\"]\n }>\n): void {\n options.duration = 0\n options.type = \"keyframes\"\n}\n"],"names":[],"mappings":"AAEM,SAAU,oBAAoB,CAChC,OAGE,EAAA;AAEF,IAAA,OAAO,CAAC,QAAQ,GAAG,CAAC;AACpB,IAAA,OAAO,CAAC,IAAI,GAAG,WAAW;AAC9B;;;;"}
|
||||
19
node_modules/motion-dom/dist/es/animation/utils/replace-transition-type.mjs
generated
vendored
Normal file
19
node_modules/motion-dom/dist/es/animation/utils/replace-transition-type.mjs
generated
vendored
Normal file
@@ -0,0 +1,19 @@
|
||||
import { inertia } from '../generators/inertia.mjs';
|
||||
import { keyframes } from '../generators/keyframes.mjs';
|
||||
import { spring } from '../generators/spring.mjs';
|
||||
|
||||
const transitionTypeMap = {
|
||||
decay: inertia,
|
||||
inertia,
|
||||
tween: keyframes,
|
||||
keyframes: keyframes,
|
||||
spring,
|
||||
};
|
||||
function replaceTransitionType(transition) {
|
||||
if (typeof transition.type === "string") {
|
||||
transition.type = transitionTypeMap[transition.type];
|
||||
}
|
||||
}
|
||||
|
||||
export { replaceTransitionType };
|
||||
//# sourceMappingURL=replace-transition-type.mjs.map
|
||||
1
node_modules/motion-dom/dist/es/animation/utils/replace-transition-type.mjs.map
generated
vendored
Normal file
1
node_modules/motion-dom/dist/es/animation/utils/replace-transition-type.mjs.map
generated
vendored
Normal file
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"replace-transition-type.mjs","sources":["../../../../src/animation/utils/replace-transition-type.ts"],"sourcesContent":["import { inertia } from \"../generators/inertia\"\nimport { keyframes } from \"../generators/keyframes\"\nimport { spring } from \"../generators/spring\"\nimport { GeneratorFactory, ValueAnimationTransition } from \"../types\"\n\nconst transitionTypeMap: { [key: string]: GeneratorFactory } = {\n decay: inertia,\n inertia,\n tween: keyframes,\n keyframes: keyframes,\n spring,\n}\n\nexport function replaceTransitionType(transition: ValueAnimationTransition) {\n if (typeof transition.type === \"string\") {\n transition.type = transitionTypeMap[transition.type]\n }\n}\n"],"names":[],"mappings":";;;;AAKA,MAAM,iBAAiB,GAAwC;AAC3D,IAAA,KAAK,EAAE,OAAO;IACd,OAAO;AACP,IAAA,KAAK,EAAE,SAAS;AAChB,IAAA,SAAS,EAAE,SAAS;IACpB,MAAM;CACT;AAEK,SAAU,qBAAqB,CAAC,UAAoC,EAAA;AACtE,IAAA,IAAI,OAAO,UAAU,CAAC,IAAI,KAAK,QAAQ,EAAE;QACrC,UAAU,CAAC,IAAI,GAAG,iBAAiB,CAAC,UAAU,CAAC,IAAI,CAAC;IACxD;AACJ;;;;"}
|
||||
15
node_modules/motion-dom/dist/es/animation/utils/resolve-transition.mjs
generated
vendored
Normal file
15
node_modules/motion-dom/dist/es/animation/utils/resolve-transition.mjs
generated
vendored
Normal file
@@ -0,0 +1,15 @@
|
||||
/**
|
||||
* If `transition` has `inherit: true`, shallow-merge it with
|
||||
* `parentTransition` (child keys win) and strip the `inherit` key.
|
||||
* Otherwise return `transition` unchanged.
|
||||
*/
|
||||
function resolveTransition(transition, parentTransition) {
|
||||
if (transition?.inherit && parentTransition) {
|
||||
const { inherit: _, ...rest } = transition;
|
||||
return { ...parentTransition, ...rest };
|
||||
}
|
||||
return transition;
|
||||
}
|
||||
|
||||
export { resolveTransition };
|
||||
//# sourceMappingURL=resolve-transition.mjs.map
|
||||
1
node_modules/motion-dom/dist/es/animation/utils/resolve-transition.mjs.map
generated
vendored
Normal file
1
node_modules/motion-dom/dist/es/animation/utils/resolve-transition.mjs.map
generated
vendored
Normal file
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"resolve-transition.mjs","sources":["../../../../src/animation/utils/resolve-transition.ts"],"sourcesContent":["/**\n * If `transition` has `inherit: true`, shallow-merge it with\n * `parentTransition` (child keys win) and strip the `inherit` key.\n * Otherwise return `transition` unchanged.\n */\nexport function resolveTransition(\n transition: any,\n parentTransition?: any\n) {\n if (transition?.inherit && parentTransition) {\n const { inherit: _, ...rest } = transition\n return { ...parentTransition, ...rest }\n }\n\n return transition\n}\n"],"names":[],"mappings":"AAAA;;;;AAIG;AACG,SAAU,iBAAiB,CAC7B,UAAe,EACf,gBAAsB,EAAA;AAEtB,IAAA,IAAI,UAAU,EAAE,OAAO,IAAI,gBAAgB,EAAE;QACzC,MAAM,EAAE,OAAO,EAAE,CAAC,EAAE,GAAG,IAAI,EAAE,GAAG,UAAU;AAC1C,QAAA,OAAO,EAAE,GAAG,gBAAgB,EAAE,GAAG,IAAI,EAAE;IAC3C;AAEA,IAAA,OAAO,UAAU;AACrB;;;;"}
|
||||
4
node_modules/motion-dom/dist/es/animation/waapi/easing/cubic-bezier.mjs
generated
vendored
Normal file
4
node_modules/motion-dom/dist/es/animation/waapi/easing/cubic-bezier.mjs
generated
vendored
Normal file
@@ -0,0 +1,4 @@
|
||||
const cubicBezierAsString = ([a, b, c, d]) => `cubic-bezier(${a}, ${b}, ${c}, ${d})`;
|
||||
|
||||
export { cubicBezierAsString };
|
||||
//# sourceMappingURL=cubic-bezier.mjs.map
|
||||
1
node_modules/motion-dom/dist/es/animation/waapi/easing/cubic-bezier.mjs.map
generated
vendored
Normal file
1
node_modules/motion-dom/dist/es/animation/waapi/easing/cubic-bezier.mjs.map
generated
vendored
Normal file
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"cubic-bezier.mjs","sources":["../../../../../src/animation/waapi/easing/cubic-bezier.ts"],"sourcesContent":["import { BezierDefinition } from \"motion-utils\"\n\nexport const cubicBezierAsString = ([a, b, c, d]: BezierDefinition) =>\n `cubic-bezier(${a}, ${b}, ${c}, ${d})`\n"],"names":[],"mappings":"AAEO,MAAM,mBAAmB,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAmB,KAC9D,CAAA,aAAA,EAAgB,CAAC,CAAA,EAAA,EAAK,CAAC,CAAA,EAAA,EAAK,CAAC,CAAA,EAAA,EAAK,CAAC,CAAA,CAAA;;;;"}
|
||||
15
node_modules/motion-dom/dist/es/animation/waapi/easing/is-supported.mjs
generated
vendored
Normal file
15
node_modules/motion-dom/dist/es/animation/waapi/easing/is-supported.mjs
generated
vendored
Normal file
@@ -0,0 +1,15 @@
|
||||
import { isBezierDefinition } from 'motion-utils';
|
||||
import { supportsLinearEasing } from '../../../utils/supports/linear-easing.mjs';
|
||||
import { supportedWaapiEasing } from './supported.mjs';
|
||||
|
||||
function isWaapiSupportedEasing(easing) {
|
||||
return Boolean((typeof easing === "function" && supportsLinearEasing()) ||
|
||||
!easing ||
|
||||
(typeof easing === "string" &&
|
||||
(easing in supportedWaapiEasing || supportsLinearEasing())) ||
|
||||
isBezierDefinition(easing) ||
|
||||
(Array.isArray(easing) && easing.every(isWaapiSupportedEasing)));
|
||||
}
|
||||
|
||||
export { isWaapiSupportedEasing };
|
||||
//# sourceMappingURL=is-supported.mjs.map
|
||||
1
node_modules/motion-dom/dist/es/animation/waapi/easing/is-supported.mjs.map
generated
vendored
Normal file
1
node_modules/motion-dom/dist/es/animation/waapi/easing/is-supported.mjs.map
generated
vendored
Normal file
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"is-supported.mjs","sources":["../../../../../src/animation/waapi/easing/is-supported.ts"],"sourcesContent":["import { Easing, isBezierDefinition } from \"motion-utils\"\nimport { supportsLinearEasing } from \"../../../utils/supports/linear-easing\"\nimport { supportedWaapiEasing } from \"./supported\"\n\nexport function isWaapiSupportedEasing(easing?: Easing | Easing[]): boolean {\n return Boolean(\n (typeof easing === \"function\" && supportsLinearEasing()) ||\n !easing ||\n (typeof easing === \"string\" &&\n (easing in supportedWaapiEasing || supportsLinearEasing())) ||\n isBezierDefinition(easing) ||\n (Array.isArray(easing) && easing.every(isWaapiSupportedEasing))\n )\n}\n"],"names":[],"mappings":";;;;AAIM,SAAU,sBAAsB,CAAC,MAA0B,EAAA;IAC7D,OAAO,OAAO,CACV,CAAC,OAAO,MAAM,KAAK,UAAU,IAAI,oBAAoB,EAAE;AACnD,QAAA,CAAC,MAAM;SACN,OAAO,MAAM,KAAK,QAAQ;AACvB,aAAC,MAAM,IAAI,oBAAoB,IAAI,oBAAoB,EAAE,CAAC,CAAC;QAC/D,kBAAkB,CAAC,MAAM,CAAC;AAC1B,SAAC,KAAK,CAAC,OAAO,CAAC,MAAM,CAAC,IAAI,MAAM,CAAC,KAAK,CAAC,sBAAsB,CAAC,CAAC,CACtE;AACL;;;;"}
|
||||
29
node_modules/motion-dom/dist/es/animation/waapi/easing/map-easing.mjs
generated
vendored
Normal file
29
node_modules/motion-dom/dist/es/animation/waapi/easing/map-easing.mjs
generated
vendored
Normal file
@@ -0,0 +1,29 @@
|
||||
import { isBezierDefinition } from 'motion-utils';
|
||||
import { supportsLinearEasing } from '../../../utils/supports/linear-easing.mjs';
|
||||
import { generateLinearEasing } from '../utils/linear.mjs';
|
||||
import { cubicBezierAsString } from './cubic-bezier.mjs';
|
||||
import { supportedWaapiEasing } from './supported.mjs';
|
||||
|
||||
function mapEasingToNativeEasing(easing, duration) {
|
||||
if (!easing) {
|
||||
return undefined;
|
||||
}
|
||||
else if (typeof easing === "function") {
|
||||
return supportsLinearEasing()
|
||||
? generateLinearEasing(easing, duration)
|
||||
: "ease-out";
|
||||
}
|
||||
else if (isBezierDefinition(easing)) {
|
||||
return cubicBezierAsString(easing);
|
||||
}
|
||||
else if (Array.isArray(easing)) {
|
||||
return easing.map((segmentEasing) => mapEasingToNativeEasing(segmentEasing, duration) ||
|
||||
supportedWaapiEasing.easeOut);
|
||||
}
|
||||
else {
|
||||
return supportedWaapiEasing[easing];
|
||||
}
|
||||
}
|
||||
|
||||
export { mapEasingToNativeEasing };
|
||||
//# sourceMappingURL=map-easing.mjs.map
|
||||
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user