Mission Control Dashboard - Initial implementation

This commit is contained in:
Daniel Arroyo
2026-03-27 18:36:05 +00:00
parent 257cea2c7d
commit a8fb4d4555
12516 changed files with 2307128 additions and 2 deletions

25
node_modules/motion-dom/dist/es/utils/delay.mjs generated vendored Normal file
View File

@@ -0,0 +1,25 @@
import { time } from '../frameloop/sync-time.mjs';
import { secondsToMilliseconds } from 'motion-utils';
import { frame, cancelFrame } from '../frameloop/frame.mjs';
/**
* Timeout defined in ms
*/
function delay(callback, timeout) {
const start = time.now();
const checkElapsed = ({ timestamp }) => {
const elapsed = timestamp - start;
if (elapsed >= timeout) {
cancelFrame(checkElapsed);
callback(elapsed - timeout);
}
};
frame.setup(checkElapsed, true);
return () => cancelFrame(checkElapsed);
}
function delayInSeconds(callback, timeout) {
return delay(callback, secondsToMilliseconds(timeout));
}
export { delay, delayInSeconds };
//# sourceMappingURL=delay.mjs.map

1
node_modules/motion-dom/dist/es/utils/delay.mjs.map generated vendored Normal file
View File

@@ -0,0 +1 @@
{"version":3,"file":"delay.mjs","sources":["../../../src/utils/delay.ts"],"sourcesContent":["import { cancelFrame, frame } from \"../frameloop\"\nimport { time } from \"../frameloop/sync-time\"\nimport type { FrameData } from \"../frameloop/types\"\nimport { secondsToMilliseconds } from \"motion-utils\"\n\nexport type DelayedFunction = (overshoot: number) => void\n\n/**\n * Timeout defined in ms\n */\nexport function delay(callback: DelayedFunction, timeout: number) {\n const start = time.now()\n\n const checkElapsed = ({ timestamp }: FrameData) => {\n const elapsed = timestamp - start\n\n if (elapsed >= timeout) {\n cancelFrame(checkElapsed)\n callback(elapsed - timeout)\n }\n }\n\n frame.setup(checkElapsed, true)\n\n return () => cancelFrame(checkElapsed)\n}\n\nexport function delayInSeconds(callback: DelayedFunction, timeout: number) {\n return delay(callback, secondsToMilliseconds(timeout))\n}\n"],"names":[],"mappings":";;;;AAOA;;AAEG;AACG,SAAU,KAAK,CAAC,QAAyB,EAAE,OAAe,EAAA;AAC5D,IAAA,MAAM,KAAK,GAAG,IAAI,CAAC,GAAG,EAAE;AAExB,IAAA,MAAM,YAAY,GAAG,CAAC,EAAE,SAAS,EAAa,KAAI;AAC9C,QAAA,MAAM,OAAO,GAAG,SAAS,GAAG,KAAK;AAEjC,QAAA,IAAI,OAAO,IAAI,OAAO,EAAE;YACpB,WAAW,CAAC,YAAY,CAAC;AACzB,YAAA,QAAQ,CAAC,OAAO,GAAG,OAAO,CAAC;QAC/B;AACJ,IAAA,CAAC;AAED,IAAA,KAAK,CAAC,KAAK,CAAC,YAAY,EAAE,IAAI,CAAC;AAE/B,IAAA,OAAO,MAAM,WAAW,CAAC,YAAY,CAAC;AAC1C;AAEM,SAAU,cAAc,CAAC,QAAyB,EAAE,OAAe,EAAA;IACrE,OAAO,KAAK,CAAC,QAAQ,EAAE,qBAAqB,CAAC,OAAO,CAAC,CAAC;AAC1D;;;;"}

75
node_modules/motion-dom/dist/es/utils/interpolate.mjs generated vendored Normal file
View File

@@ -0,0 +1,75 @@
import { invariant, clamp, MotionGlobalConfig, noop, pipe, progress } from 'motion-utils';
import { mix } from './mix/index.mjs';
function createMixers(output, ease, customMixer) {
const mixers = [];
const mixerFactory = customMixer || MotionGlobalConfig.mix || mix;
const numMixers = output.length - 1;
for (let i = 0; i < numMixers; i++) {
let mixer = mixerFactory(output[i], output[i + 1]);
if (ease) {
const easingFunction = Array.isArray(ease) ? ease[i] || noop : ease;
mixer = pipe(easingFunction, mixer);
}
mixers.push(mixer);
}
return mixers;
}
/**
* Create a function that maps from a numerical input array to a generic output array.
*
* Accepts:
* - Numbers
* - Colors (hex, hsl, hsla, rgb, rgba)
* - Complex (combinations of one or more numbers or strings)
*
* ```jsx
* const mixColor = interpolate([0, 1], ['#fff', '#000'])
*
* mixColor(0.5) // 'rgba(128, 128, 128, 1)'
* ```
*
* TODO Revisit this approach once we've moved to data models for values,
* probably not needed to pregenerate mixer functions.
*
* @public
*/
function interpolate(input, output, { clamp: isClamp = true, ease, mixer } = {}) {
const inputLength = input.length;
invariant(inputLength === output.length, "Both input and output ranges must be the same length", "range-length");
/**
* If we're only provided a single input, we can just make a function
* that returns the output.
*/
if (inputLength === 1)
return () => output[0];
if (inputLength === 2 && output[0] === output[1])
return () => output[1];
const isZeroDeltaRange = input[0] === input[1];
// If input runs highest -> lowest, reverse both arrays
if (input[0] > input[inputLength - 1]) {
input = [...input].reverse();
output = [...output].reverse();
}
const mixers = createMixers(output, ease, mixer);
const numMixers = mixers.length;
const interpolator = (v) => {
if (isZeroDeltaRange && v < input[0])
return output[0];
let i = 0;
if (numMixers > 1) {
for (; i < input.length - 2; i++) {
if (v < input[i + 1])
break;
}
}
const progressInRange = progress(input[i], input[i + 1], v);
return mixers[i](progressInRange);
};
return isClamp
? (v) => interpolator(clamp(input[0], input[inputLength - 1], v))
: interpolator;
}
export { interpolate };
//# sourceMappingURL=interpolate.mjs.map

File diff suppressed because one or more lines are too long

View File

@@ -0,0 +1,14 @@
import { isObject } from 'motion-utils';
/**
* Checks if an element is an HTML element in a way
* that works across iframes
*/
function isHTMLElement(element) {
return (isObject(element) &&
"offsetHeight" in element &&
!("ownerSVGElement" in element));
}
export { isHTMLElement };
//# sourceMappingURL=is-html-element.mjs.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"is-html-element.mjs","sources":["../../../src/utils/is-html-element.ts"],"sourcesContent":["import { isObject } from \"motion-utils\"\n\n/**\n * Checks if an element is an HTML element in a way\n * that works across iframes\n */\nexport function isHTMLElement(element: unknown): element is HTMLElement {\n return (\n isObject(element) &&\n \"offsetHeight\" in element &&\n !(\"ownerSVGElement\" in element)\n )\n}\n"],"names":[],"mappings":";;AAEA;;;AAGG;AACG,SAAU,aAAa,CAAC,OAAgB,EAAA;AAC1C,IAAA,QACI,QAAQ,CAAC,OAAO,CAAC;AACjB,QAAA,cAAc,IAAI,OAAO;AACzB,QAAA,EAAE,iBAAiB,IAAI,OAAO,CAAC;AAEvC;;;;"}

View File

@@ -0,0 +1,12 @@
import { isObject } from 'motion-utils';
/**
* Checks if an element is an SVG element in a way
* that works across iframes
*/
function isSVGElement(element) {
return isObject(element) && "ownerSVGElement" in element;
}
export { isSVGElement };
//# sourceMappingURL=is-svg-element.mjs.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"is-svg-element.mjs","sources":["../../../src/utils/is-svg-element.ts"],"sourcesContent":["import { isObject } from \"motion-utils\"\n\n/**\n * Checks if an element is an SVG element in a way\n * that works across iframes\n */\nexport function isSVGElement(element: unknown): element is SVGElement {\n return isObject(element) && \"ownerSVGElement\" in element\n}\n"],"names":[],"mappings":";;AAEA;;;AAGG;AACG,SAAU,YAAY,CAAC,OAAgB,EAAA;IACzC,OAAO,QAAQ,CAAC,OAAO,CAAC,IAAI,iBAAiB,IAAI,OAAO;AAC5D;;;;"}

View File

@@ -0,0 +1,12 @@
import { isSVGElement } from './is-svg-element.mjs';
/**
* Checks if an element is specifically an SVGSVGElement (the root SVG element)
* in a way that works across iframes
*/
function isSVGSVGElement(element) {
return isSVGElement(element) && element.tagName === "svg";
}
export { isSVGSVGElement };
//# sourceMappingURL=is-svg-svg-element.mjs.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"is-svg-svg-element.mjs","sources":["../../../src/utils/is-svg-svg-element.ts"],"sourcesContent":["import { isSVGElement } from \"./is-svg-element\"\n\n/**\n * Checks if an element is specifically an SVGSVGElement (the root SVG element)\n * in a way that works across iframes\n */\nexport function isSVGSVGElement(element: unknown): element is SVGSVGElement {\n return isSVGElement(element) && element.tagName === \"svg\"\n}\n"],"names":[],"mappings":";;AAEA;;;AAGG;AACG,SAAU,eAAe,CAAC,OAAgB,EAAA;IAC5C,OAAO,YAAY,CAAC,OAAO,CAAC,IAAI,OAAO,CAAC,OAAO,KAAK,KAAK;AAC7D;;;;"}

48
node_modules/motion-dom/dist/es/utils/mix/color.mjs generated vendored Normal file
View File

@@ -0,0 +1,48 @@
import { warning } from 'motion-utils';
import { hex } from '../../value/types/color/hex.mjs';
import { hsla } from '../../value/types/color/hsla.mjs';
import { hslaToRgba } from '../../value/types/color/hsla-to-rgba.mjs';
import { rgba } from '../../value/types/color/rgba.mjs';
import { mixImmediate } from './immediate.mjs';
import { mixNumber } from './number.mjs';
// Linear color space blending
// Explained https://www.youtube.com/watch?v=LKnqECcg6Gw
// Demonstrated http://codepen.io/osublake/pen/xGVVaN
const mixLinearColor = (from, to, v) => {
const fromExpo = from * from;
const expo = v * (to * to - fromExpo) + fromExpo;
return expo < 0 ? 0 : Math.sqrt(expo);
};
const colorTypes = [hex, rgba, hsla];
const getColorType = (v) => colorTypes.find((type) => type.test(v));
function asRGBA(color) {
const type = getColorType(color);
warning(Boolean(type), `'${color}' is not an animatable color. Use the equivalent color code instead.`, "color-not-animatable");
if (!Boolean(type))
return false;
let model = type.parse(color);
if (type === hsla) {
// TODO Remove this cast - needed since Motion's stricter typing
model = hslaToRgba(model);
}
return model;
}
const mixColor = (from, to) => {
const fromRGBA = asRGBA(from);
const toRGBA = asRGBA(to);
if (!fromRGBA || !toRGBA) {
return mixImmediate(from, to);
}
const blended = { ...fromRGBA };
return (v) => {
blended.red = mixLinearColor(fromRGBA.red, toRGBA.red, v);
blended.green = mixLinearColor(fromRGBA.green, toRGBA.green, v);
blended.blue = mixLinearColor(fromRGBA.blue, toRGBA.blue, v);
blended.alpha = mixNumber(fromRGBA.alpha, toRGBA.alpha, v);
return rgba.transform(blended);
};
};
export { mixColor, mixLinearColor };
//# sourceMappingURL=color.mjs.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"color.mjs","sources":["../../../../src/utils/mix/color.ts"],"sourcesContent":["import { warning } from \"motion-utils\"\nimport { hex } from \"../../value/types/color/hex\"\nimport { hsla } from \"../../value/types/color/hsla\"\nimport { hslaToRgba } from \"../../value/types/color/hsla-to-rgba\"\nimport { rgba } from \"../../value/types/color/rgba\"\nimport { Color, HSLA, RGBA } from \"../../value/types/types\"\nimport { mixImmediate } from \"./immediate\"\nimport { mixNumber } from \"./number\"\n\n// Linear color space blending\n// Explained https://www.youtube.com/watch?v=LKnqECcg6Gw\n// Demonstrated http://codepen.io/osublake/pen/xGVVaN\nexport const mixLinearColor = (from: number, to: number, v: number) => {\n const fromExpo = from * from\n const expo = v * (to * to - fromExpo) + fromExpo\n return expo < 0 ? 0 : Math.sqrt(expo)\n}\n\nconst colorTypes = [hex, rgba, hsla]\nconst getColorType = (v: Color | string) =>\n colorTypes.find((type) => type.test(v))\n\nfunction asRGBA(color: Color | string) {\n const type = getColorType(color)\n\n warning(\n Boolean(type),\n `'${color}' is not an animatable color. Use the equivalent color code instead.`,\n \"color-not-animatable\"\n )\n\n if (!Boolean(type)) return false\n\n let model = type!.parse(color)\n\n if (type === hsla) {\n // TODO Remove this cast - needed since Motion's stricter typing\n model = hslaToRgba(model as HSLA)\n }\n\n return model as RGBA\n}\n\nexport const mixColor = (from: Color | string, to: Color | string) => {\n const fromRGBA = asRGBA(from)\n const toRGBA = asRGBA(to)\n\n if (!fromRGBA || !toRGBA) {\n return mixImmediate(from, to)\n }\n\n const blended = { ...fromRGBA }\n\n return (v: number) => {\n blended.red = mixLinearColor(fromRGBA.red, toRGBA.red, v)\n blended.green = mixLinearColor(fromRGBA.green, toRGBA.green, v)\n blended.blue = mixLinearColor(fromRGBA.blue, toRGBA.blue, v)\n blended.alpha = mixNumber(fromRGBA.alpha, toRGBA.alpha, v)\n return rgba.transform!(blended)\n }\n}\n"],"names":[],"mappings":";;;;;;;;AASA;AACA;AACA;AACO,MAAM,cAAc,GAAG,CAAC,IAAY,EAAE,EAAU,EAAE,CAAS,KAAI;AAClE,IAAA,MAAM,QAAQ,GAAG,IAAI,GAAG,IAAI;AAC5B,IAAA,MAAM,IAAI,GAAG,CAAC,IAAI,EAAE,GAAG,EAAE,GAAG,QAAQ,CAAC,GAAG,QAAQ;AAChD,IAAA,OAAO,IAAI,GAAG,CAAC,GAAG,CAAC,GAAG,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC;AACzC;AAEA,MAAM,UAAU,GAAG,CAAC,GAAG,EAAE,IAAI,EAAE,IAAI,CAAC;AACpC,MAAM,YAAY,GAAG,CAAC,CAAiB,KACnC,UAAU,CAAC,IAAI,CAAC,CAAC,IAAI,KAAK,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;AAE3C,SAAS,MAAM,CAAC,KAAqB,EAAA;AACjC,IAAA,MAAM,IAAI,GAAG,YAAY,CAAC,KAAK,CAAC;AAEhC,IAAA,OAAO,CACH,OAAO,CAAC,IAAI,CAAC,EACb,CAAA,CAAA,EAAI,KAAK,CAAA,oEAAA,CAAsE,EAC/E,sBAAsB,CACzB;AAED,IAAA,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC;AAAE,QAAA,OAAO,KAAK;IAEhC,IAAI,KAAK,GAAG,IAAK,CAAC,KAAK,CAAC,KAAK,CAAC;AAE9B,IAAA,IAAI,IAAI,KAAK,IAAI,EAAE;;AAEf,QAAA,KAAK,GAAG,UAAU,CAAC,KAAa,CAAC;IACrC;AAEA,IAAA,OAAO,KAAa;AACxB;MAEa,QAAQ,GAAG,CAAC,IAAoB,EAAE,EAAkB,KAAI;AACjE,IAAA,MAAM,QAAQ,GAAG,MAAM,CAAC,IAAI,CAAC;AAC7B,IAAA,MAAM,MAAM,GAAG,MAAM,CAAC,EAAE,CAAC;AAEzB,IAAA,IAAI,CAAC,QAAQ,IAAI,CAAC,MAAM,EAAE;AACtB,QAAA,OAAO,YAAY,CAAC,IAAI,EAAE,EAAE,CAAC;IACjC;AAEA,IAAA,MAAM,OAAO,GAAG,EAAE,GAAG,QAAQ,EAAE;IAE/B,OAAO,CAAC,CAAS,KAAI;AACjB,QAAA,OAAO,CAAC,GAAG,GAAG,cAAc,CAAC,QAAQ,CAAC,GAAG,EAAE,MAAM,CAAC,GAAG,EAAE,CAAC,CAAC;AACzD,QAAA,OAAO,CAAC,KAAK,GAAG,cAAc,CAAC,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC,KAAK,EAAE,CAAC,CAAC;AAC/D,QAAA,OAAO,CAAC,IAAI,GAAG,cAAc,CAAC,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAC,IAAI,EAAE,CAAC,CAAC;AAC5D,QAAA,OAAO,CAAC,KAAK,GAAG,SAAS,CAAC,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC,KAAK,EAAE,CAAC,CAAC;AAC1D,QAAA,OAAO,IAAI,CAAC,SAAU,CAAC,OAAO,CAAC;AACnC,IAAA,CAAC;AACL;;;;"}

93
node_modules/motion-dom/dist/es/utils/mix/complex.mjs generated vendored Normal file
View File

@@ -0,0 +1,93 @@
import { pipe, warning } from 'motion-utils';
import { isCSSVariableToken } from '../../animation/utils/is-css-variable.mjs';
import { color } from '../../value/types/color/index.mjs';
import { complex, analyseComplexValue } from '../../value/types/complex/index.mjs';
import { mixColor } from './color.mjs';
import { mixImmediate } from './immediate.mjs';
import { mixNumber as mixNumber$1 } from './number.mjs';
import { invisibleValues, mixVisibility } from './visibility.mjs';
function mixNumber(a, b) {
return (p) => mixNumber$1(a, b, p);
}
function getMixer(a) {
if (typeof a === "number") {
return mixNumber;
}
else if (typeof a === "string") {
return isCSSVariableToken(a)
? mixImmediate
: color.test(a)
? mixColor
: mixComplex;
}
else if (Array.isArray(a)) {
return mixArray;
}
else if (typeof a === "object") {
return color.test(a) ? mixColor : mixObject;
}
return mixImmediate;
}
function mixArray(a, b) {
const output = [...a];
const numValues = output.length;
const blendValue = a.map((v, i) => getMixer(v)(v, b[i]));
return (p) => {
for (let i = 0; i < numValues; i++) {
output[i] = blendValue[i](p);
}
return output;
};
}
function mixObject(a, b) {
const output = { ...a, ...b };
const blendValue = {};
for (const key in output) {
if (a[key] !== undefined && b[key] !== undefined) {
blendValue[key] = getMixer(a[key])(a[key], b[key]);
}
}
return (v) => {
for (const key in blendValue) {
output[key] = blendValue[key](v);
}
return output;
};
}
function matchOrder(origin, target) {
const orderedOrigin = [];
const pointers = { color: 0, var: 0, number: 0 };
for (let i = 0; i < target.values.length; i++) {
const type = target.types[i];
const originIndex = origin.indexes[type][pointers[type]];
const originValue = origin.values[originIndex] ?? 0;
orderedOrigin[i] = originValue;
pointers[type]++;
}
return orderedOrigin;
}
const mixComplex = (origin, target) => {
const template = complex.createTransformer(target);
const originStats = analyseComplexValue(origin);
const targetStats = analyseComplexValue(target);
const canInterpolate = originStats.indexes.var.length === targetStats.indexes.var.length &&
originStats.indexes.color.length === targetStats.indexes.color.length &&
originStats.indexes.number.length >= targetStats.indexes.number.length;
if (canInterpolate) {
if ((invisibleValues.has(origin) &&
!targetStats.values.length) ||
(invisibleValues.has(target) &&
!originStats.values.length)) {
return mixVisibility(origin, target);
}
return pipe(mixArray(matchOrder(originStats, targetStats), targetStats.values), template);
}
else {
warning(true, `Complex values '${origin}' and '${target}' too different to mix. Ensure all colors are of the same type, and that each contains the same quantity of number and color values. Falling back to instant transition.`, "complex-values-different");
return mixImmediate(origin, target);
}
};
export { getMixer, mixArray, mixComplex, mixObject };
//# sourceMappingURL=complex.mjs.map

File diff suppressed because one or more lines are too long

View File

@@ -0,0 +1,6 @@
function mixImmediate(a, b) {
return (p) => (p > 0 ? b : a);
}
export { mixImmediate };
//# sourceMappingURL=immediate.mjs.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"immediate.mjs","sources":["../../../../src/utils/mix/immediate.ts"],"sourcesContent":["export function mixImmediate<T>(a: T, b: T) {\n return (p: number) => (p > 0 ? b : a)\n}\n"],"names":[],"mappings":"AAAM,SAAU,YAAY,CAAI,CAAI,EAAE,CAAI,EAAA;AACtC,IAAA,OAAO,CAAC,CAAS,MAAM,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;AACzC;;;;"}

15
node_modules/motion-dom/dist/es/utils/mix/index.mjs generated vendored Normal file
View File

@@ -0,0 +1,15 @@
import { getMixer } from './complex.mjs';
import { mixNumber } from './number.mjs';
function mix(from, to, p) {
if (typeof from === "number" &&
typeof to === "number" &&
typeof p === "number") {
return mixNumber(from, to, p);
}
const mixer = getMixer(from);
return mixer(from, to);
}
export { mix };
//# sourceMappingURL=index.mjs.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"index.mjs","sources":["../../../../src/utils/mix/index.ts"],"sourcesContent":["import { getMixer } from \"./complex\"\nimport { mixNumber as mixNumberImmediate } from \"./number\"\nimport { Mixer } from \"./types\"\n\nexport function mix<T>(from: T, to: T): Mixer<T>\nexport function mix(from: number, to: number, p: number): number\nexport function mix<T>(from: T, to: T, p?: T): Mixer<T> | number {\n if (\n typeof from === \"number\" &&\n typeof to === \"number\" &&\n typeof p === \"number\"\n ) {\n return mixNumberImmediate(from, to, p)\n }\n\n const mixer = getMixer(from)\n return mixer(from as any, to as any) as Mixer<T>\n}\n"],"names":["mixNumberImmediate"],"mappings":";;;SAMgB,GAAG,CAAI,IAAO,EAAE,EAAK,EAAE,CAAK,EAAA;IACxC,IACI,OAAO,IAAI,KAAK,QAAQ;QACxB,OAAO,EAAE,KAAK,QAAQ;AACtB,QAAA,OAAO,CAAC,KAAK,QAAQ,EACvB;QACE,OAAOA,SAAkB,CAAC,IAAI,EAAE,EAAE,EAAE,CAAC,CAAC;IAC1C;AAEA,IAAA,MAAM,KAAK,GAAG,QAAQ,CAAC,IAAI,CAAC;AAC5B,IAAA,OAAO,KAAK,CAAC,IAAW,EAAE,EAAS,CAAa;AACpD;;;;"}

27
node_modules/motion-dom/dist/es/utils/mix/number.mjs generated vendored Normal file
View File

@@ -0,0 +1,27 @@
/*
Value in range from progress
Given a lower limit and an upper limit, we return the value within
that range as expressed by progress (usually a number from 0 to 1)
So progress = 0.5 would change
from -------- to
to
from ---- to
E.g. from = 10, to = 20, progress = 0.5 => 15
@param [number]: Lower limit of range
@param [number]: Upper limit of range
@param [number]: The progress between lower and upper limits expressed 0-1
@return [number]: Value as calculated from progress within range (not limited within range)
*/
const mixNumber = (from, to, progress) => {
return from + (to - from) * progress;
};
export { mixNumber };
//# sourceMappingURL=number.mjs.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"number.mjs","sources":["../../../../src/utils/mix/number.ts"],"sourcesContent":["/*\n Value in range from progress\n\n Given a lower limit and an upper limit, we return the value within\n that range as expressed by progress (usually a number from 0 to 1)\n\n So progress = 0.5 would change\n\n from -------- to\n\n to\n\n from ---- to\n\n E.g. from = 10, to = 20, progress = 0.5 => 15\n\n @param [number]: Lower limit of range\n @param [number]: Upper limit of range\n @param [number]: The progress between lower and upper limits expressed 0-1\n @return [number]: Value as calculated from progress within range (not limited within range)\n*/\nexport const mixNumber = (from: number, to: number, progress: number) => {\n return from + (to - from) * progress\n}\n"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;AAoBE;AACK,MAAM,SAAS,GAAG,CAAC,IAAY,EAAE,EAAU,EAAE,QAAgB,KAAI;IACpE,OAAO,IAAI,GAAG,CAAC,EAAE,GAAG,IAAI,IAAI,QAAQ;AACxC;;;;"}

View File

@@ -0,0 +1,17 @@
const invisibleValues = new Set(["none", "hidden"]);
/**
* Returns a function that, when provided a progress value between 0 and 1,
* will return the "none" or "hidden" string only when the progress is that of
* the origin or target.
*/
function mixVisibility(origin, target) {
if (invisibleValues.has(origin)) {
return (p) => (p <= 0 ? origin : target);
}
else {
return (p) => (p >= 1 ? target : origin);
}
}
export { invisibleValues, mixVisibility };
//# sourceMappingURL=visibility.mjs.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"visibility.mjs","sources":["../../../../src/utils/mix/visibility.ts"],"sourcesContent":["export const invisibleValues = new Set([\"none\", \"hidden\"])\n\n/**\n * Returns a function that, when provided a progress value between 0 and 1,\n * will return the \"none\" or \"hidden\" string only when the progress is that of\n * the origin or target.\n */\nexport function mixVisibility(origin: string, target: string) {\n if (invisibleValues.has(origin)) {\n return (p: number) => (p <= 0 ? origin : target)\n } else {\n return (p: number) => (p >= 1 ? target : origin)\n }\n}\n"],"names":[],"mappings":"AAAO,MAAM,eAAe,GAAG,IAAI,GAAG,CAAC,CAAC,MAAM,EAAE,QAAQ,CAAC;AAEzD;;;;AAIG;AACG,SAAU,aAAa,CAAC,MAAc,EAAE,MAAc,EAAA;AACxD,IAAA,IAAI,eAAe,CAAC,GAAG,CAAC,MAAM,CAAC,EAAE;AAC7B,QAAA,OAAO,CAAC,CAAS,MAAM,CAAC,IAAI,CAAC,GAAG,MAAM,GAAG,MAAM,CAAC;IACpD;SAAO;AACH,QAAA,OAAO,CAAC,CAAS,MAAM,CAAC,IAAI,CAAC,GAAG,MAAM,GAAG,MAAM,CAAC;IACpD;AACJ;;;;"}

View File

@@ -0,0 +1,21 @@
function resolveElements(elementOrSelector, scope, selectorCache) {
if (elementOrSelector == null) {
return [];
}
if (elementOrSelector instanceof EventTarget) {
return [elementOrSelector];
}
else if (typeof elementOrSelector === "string") {
let root = document;
if (scope) {
root = scope.current;
}
const elements = selectorCache?.[elementOrSelector] ??
root.querySelectorAll(elementOrSelector);
return elements ? Array.from(elements) : [];
}
return Array.from(elementOrSelector).filter((element) => element != null);
}
export { resolveElements };
//# sourceMappingURL=resolve-elements.mjs.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"resolve-elements.mjs","sources":["../../../src/utils/resolve-elements.ts"],"sourcesContent":["export type ElementOrSelector =\n | Element\n | Element[]\n | NodeListOf<Element>\n | string\n | null\n | undefined\n\nexport interface WithQuerySelectorAll {\n querySelectorAll: Element[\"querySelectorAll\"]\n}\n\nexport interface AnimationScope<T = any> {\n readonly current: T\n animations: any[] // TODO: Refactor to types package AnimationPlaybackControls[]\n}\n\nexport interface SelectorCache {\n [key: string]: NodeListOf<Element>\n}\n\nexport function resolveElements(\n elementOrSelector: ElementOrSelector,\n scope?: AnimationScope,\n selectorCache?: SelectorCache\n): Element[] {\n if (elementOrSelector == null) {\n return []\n }\n\n if (elementOrSelector instanceof EventTarget) {\n return [elementOrSelector]\n } else if (typeof elementOrSelector === \"string\") {\n let root: WithQuerySelectorAll = document\n\n if (scope) {\n root = scope.current\n }\n\n const elements =\n selectorCache?.[elementOrSelector] ??\n root.querySelectorAll(elementOrSelector)\n\n return elements ? Array.from(elements) : []\n }\n\n return Array.from(elementOrSelector).filter(\n (element): element is Element => element != null\n )\n}\n"],"names":[],"mappings":"SAqBgB,eAAe,CAC3B,iBAAoC,EACpC,KAAsB,EACtB,aAA6B,EAAA;AAE7B,IAAA,IAAI,iBAAiB,IAAI,IAAI,EAAE;AAC3B,QAAA,OAAO,EAAE;IACb;AAEA,IAAA,IAAI,iBAAiB,YAAY,WAAW,EAAE;QAC1C,OAAO,CAAC,iBAAiB,CAAC;IAC9B;AAAO,SAAA,IAAI,OAAO,iBAAiB,KAAK,QAAQ,EAAE;QAC9C,IAAI,IAAI,GAAyB,QAAQ;QAEzC,IAAI,KAAK,EAAE;AACP,YAAA,IAAI,GAAG,KAAK,CAAC,OAAO;QACxB;AAEA,QAAA,MAAM,QAAQ,GACV,aAAa,GAAG,iBAAiB,CAAC;AAClC,YAAA,IAAI,CAAC,gBAAgB,CAAC,iBAAiB,CAAC;AAE5C,QAAA,OAAO,QAAQ,GAAG,KAAK,CAAC,IAAI,CAAC,QAAQ,CAAC,GAAG,EAAE;IAC/C;AAEA,IAAA,OAAO,KAAK,CAAC,IAAI,CAAC,iBAAiB,CAAC,CAAC,MAAM,CACvC,CAAC,OAAO,KAAyB,OAAO,IAAI,IAAI,CACnD;AACL;;;;"}

27
node_modules/motion-dom/dist/es/utils/stagger.mjs generated vendored Normal file
View File

@@ -0,0 +1,27 @@
import { easingDefinitionToFunction } from 'motion-utils';
function getOriginIndex(from, total) {
if (from === "first") {
return 0;
}
else {
const lastIndex = total - 1;
return from === "last" ? lastIndex : lastIndex / 2;
}
}
function stagger(duration = 0.1, { startDelay = 0, from = 0, ease } = {}) {
return (i, total) => {
const fromIndex = typeof from === "number" ? from : getOriginIndex(from, total);
const distance = Math.abs(fromIndex - i);
let delay = duration * distance;
if (ease) {
const maxDelay = total * duration;
const easingFunction = easingDefinitionToFunction(ease);
delay = easingFunction(delay / maxDelay) * maxDelay;
}
return startDelay + delay;
};
}
export { getOriginIndex, stagger };
//# sourceMappingURL=stagger.mjs.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"stagger.mjs","sources":["../../../src/utils/stagger.ts"],"sourcesContent":["import { Easing, easingDefinitionToFunction } from \"motion-utils\"\nimport { DynamicOption } from \"../animation/types\"\n\nexport type StaggerOrigin = \"first\" | \"last\" | \"center\" | number\n\nexport type StaggerOptions = {\n startDelay?: number\n from?: StaggerOrigin\n ease?: Easing\n}\n\nexport function getOriginIndex(from: StaggerOrigin, total: number) {\n if (from === \"first\") {\n return 0\n } else {\n const lastIndex = total - 1\n return from === \"last\" ? lastIndex : lastIndex / 2\n }\n}\n\nexport function stagger(\n duration: number = 0.1,\n { startDelay = 0, from = 0, ease }: StaggerOptions = {}\n): DynamicOption<number> {\n return (i: number, total: number) => {\n const fromIndex =\n typeof from === \"number\" ? from : getOriginIndex(from, total)\n const distance = Math.abs(fromIndex - i)\n let delay = duration * distance\n\n if (ease) {\n const maxDelay = total * duration\n const easingFunction = easingDefinitionToFunction(ease)\n delay = easingFunction(delay / maxDelay) * maxDelay\n }\n\n return startDelay + delay\n }\n}\n"],"names":[],"mappings":";;AAWM,SAAU,cAAc,CAAC,IAAmB,EAAE,KAAa,EAAA;AAC7D,IAAA,IAAI,IAAI,KAAK,OAAO,EAAE;AAClB,QAAA,OAAO,CAAC;IACZ;SAAO;AACH,QAAA,MAAM,SAAS,GAAG,KAAK,GAAG,CAAC;AAC3B,QAAA,OAAO,IAAI,KAAK,MAAM,GAAG,SAAS,GAAG,SAAS,GAAG,CAAC;IACtD;AACJ;SAEgB,OAAO,CACnB,QAAA,GAAmB,GAAG,EACtB,EAAE,UAAU,GAAG,CAAC,EAAE,IAAI,GAAG,CAAC,EAAE,IAAI,KAAqB,EAAE,EAAA;AAEvD,IAAA,OAAO,CAAC,CAAS,EAAE,KAAa,KAAI;AAChC,QAAA,MAAM,SAAS,GACX,OAAO,IAAI,KAAK,QAAQ,GAAG,IAAI,GAAG,cAAc,CAAC,IAAI,EAAE,KAAK,CAAC;QACjE,MAAM,QAAQ,GAAG,IAAI,CAAC,GAAG,CAAC,SAAS,GAAG,CAAC,CAAC;AACxC,QAAA,IAAI,KAAK,GAAG,QAAQ,GAAG,QAAQ;QAE/B,IAAI,IAAI,EAAE;AACN,YAAA,MAAM,QAAQ,GAAG,KAAK,GAAG,QAAQ;AACjC,YAAA,MAAM,cAAc,GAAG,0BAA0B,CAAC,IAAI,CAAC;YACvD,KAAK,GAAG,cAAc,CAAC,KAAK,GAAG,QAAQ,CAAC,GAAG,QAAQ;QACvD;QAEA,OAAO,UAAU,GAAG,KAAK;AAC7B,IAAA,CAAC;AACL;;;;"}

View File

@@ -0,0 +1,8 @@
/**
* Add the ability for test suites to manually set support flags
* to better test more environments.
*/
const supportsFlags = {};
export { supportsFlags };
//# sourceMappingURL=flags.mjs.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"flags.mjs","sources":["../../../../src/utils/supports/flags.ts"],"sourcesContent":["/**\n * Add the ability for test suites to manually set support flags\n * to better test more environments.\n */\nexport const supportsFlags: Record<string, boolean | undefined> = {}\n"],"names":[],"mappings":"AAAA;;;AAGG;AACI,MAAM,aAAa,GAAwC;;;;"}

View File

@@ -0,0 +1,16 @@
import { memoSupports } from './memo.mjs';
const supportsLinearEasing = /*@__PURE__*/ memoSupports(() => {
try {
document
.createElement("div")
.animate({ opacity: 0 }, { easing: "linear(0, 1)" });
}
catch (e) {
return false;
}
return true;
}, "linearEasing");
export { supportsLinearEasing };
//# sourceMappingURL=linear-easing.mjs.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"linear-easing.mjs","sources":["../../../../src/utils/supports/linear-easing.ts"],"sourcesContent":["import { memoSupports } from \"./memo\"\n\nexport const supportsLinearEasing = /*@__PURE__*/ memoSupports(() => {\n try {\n document\n .createElement(\"div\")\n .animate({ opacity: 0 }, { easing: \"linear(0, 1)\" })\n } catch (e) {\n return false\n }\n return true\n}, \"linearEasing\")\n"],"names":[],"mappings":";;MAEa,oBAAoB,iBAAiB,YAAY,CAAC,MAAK;AAChE,IAAA,IAAI;QACA;aACK,aAAa,CAAC,KAAK;AACnB,aAAA,OAAO,CAAC,EAAE,OAAO,EAAE,CAAC,EAAE,EAAE,EAAE,MAAM,EAAE,cAAc,EAAE,CAAC;IAC5D;IAAE,OAAO,CAAC,EAAE;AACR,QAAA,OAAO,KAAK;IAChB;AACA,IAAA,OAAO,IAAI;AACf,CAAC,EAAE,cAAc;;;;"}

View File

@@ -0,0 +1,10 @@
import { memo } from 'motion-utils';
import { supportsFlags } from './flags.mjs';
function memoSupports(callback, supportsFlag) {
const memoized = memo(callback);
return () => supportsFlags[supportsFlag] ?? memoized();
}
export { memoSupports };
//# sourceMappingURL=memo.mjs.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"memo.mjs","sources":["../../../../src/utils/supports/memo.ts"],"sourcesContent":["import { memo } from \"motion-utils\"\nimport { supportsFlags } from \"./flags\"\n\nexport function memoSupports<T extends any>(\n callback: () => T,\n supportsFlag: keyof typeof supportsFlags\n) {\n const memoized = memo(callback)\n return () => supportsFlags[supportsFlag] ?? memoized()\n}\n"],"names":[],"mappings":";;;AAGM,SAAU,YAAY,CACxB,QAAiB,EACjB,YAAwC,EAAA;AAExC,IAAA,MAAM,QAAQ,GAAG,IAAI,CAAC,QAAQ,CAAC;IAC/B,OAAO,MAAM,aAAa,CAAC,YAAY,CAAC,IAAI,QAAQ,EAAE;AAC1D;;;;"}

View File

@@ -0,0 +1,7 @@
import { memoSupports } from './memo.mjs';
const supportsScrollTimeline = /* @__PURE__ */ memoSupports(() => window.ScrollTimeline !== undefined, "scrollTimeline");
const supportsViewTimeline = /* @__PURE__ */ memoSupports(() => window.ViewTimeline !== undefined, "viewTimeline");
export { supportsScrollTimeline, supportsViewTimeline };
//# sourceMappingURL=scroll-timeline.mjs.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"scroll-timeline.mjs","sources":["../../../../src/utils/supports/scroll-timeline.ts"],"sourcesContent":["import { ProgressTimeline } from \"../..\"\nimport { memoSupports } from \"./memo\"\n\ndeclare global {\n interface Window {\n ScrollTimeline: ScrollTimeline\n ViewTimeline: ViewTimeline\n }\n}\n\ndeclare class ScrollTimeline implements ProgressTimeline {\n constructor(options: ScrollOptions)\n\n currentTime: null | { value: number }\n\n cancel?: VoidFunction\n}\n\ndeclare class ViewTimeline implements ProgressTimeline {\n constructor(options: { subject: Element; axis?: string })\n\n currentTime: null | { value: number }\n\n cancel?: VoidFunction\n}\n\nexport const supportsScrollTimeline = /* @__PURE__ */ memoSupports(\n () => window.ScrollTimeline !== undefined,\n \"scrollTimeline\"\n)\n\nexport const supportsViewTimeline = /* @__PURE__ */ memoSupports(\n () => window.ViewTimeline !== undefined,\n \"viewTimeline\"\n)\n"],"names":[],"mappings":";;AA0BO,MAAM,sBAAsB,mBAAmB,YAAY,CAC9D,MAAM,MAAM,CAAC,cAAc,KAAK,SAAS,EACzC,gBAAgB;AAGb,MAAM,oBAAoB,mBAAmB,YAAY,CAC5D,MAAM,MAAM,CAAC,YAAY,KAAK,SAAS,EACvC,cAAc;;;;"}

15
node_modules/motion-dom/dist/es/utils/transform.mjs generated vendored Normal file
View File

@@ -0,0 +1,15 @@
import { interpolate } from './interpolate.mjs';
function transform(...args) {
const useImmediate = !Array.isArray(args[0]);
const argOffset = useImmediate ? 0 : -1;
const inputValue = args[0 + argOffset];
const inputRange = args[1 + argOffset];
const outputRange = args[2 + argOffset];
const options = args[3 + argOffset];
const interpolator = interpolate(inputRange, outputRange, options);
return useImmediate ? interpolator(inputValue) : interpolator;
}
export { transform };
//# sourceMappingURL=transform.mjs.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"transform.mjs","sources":["../../../src/utils/transform.ts"],"sourcesContent":["import { EasingFunction } from \"motion-utils\"\nimport { interpolate } from \"./interpolate\"\n\n/**\n * @public\n */\nexport interface TransformOptions<T> {\n /**\n * Clamp values to within the given range. Defaults to `true`\n *\n * @public\n */\n clamp?: boolean\n\n /**\n * Easing functions to use on the interpolations between each value in the input and output ranges.\n *\n * If provided as an array, the array must be one item shorter than the input and output ranges, as the easings apply to the transition **between** each.\n *\n * @public\n */\n ease?: EasingFunction | EasingFunction[]\n\n /**\n * Provide a function that can interpolate between any two values in the provided range.\n *\n * @public\n */\n mixer?: (from: T, to: T) => (v: number) => any\n}\n\n/**\n * Transforms numbers into other values by mapping them from an input range to an output range.\n * Returns the type of the input provided.\n *\n * @remarks\n *\n * Given an input range of `[0, 200]` and an output range of\n * `[0, 1]`, this function will return a value between `0` and `1`.\n * The input range must be a linear series of numbers. The output range\n * can be any supported value type, such as numbers, colors, shadows, arrays, objects and more.\n * Every value in the output range must be of the same type and in the same format.\n *\n * ```jsx\n * export function MyComponent() {\n * const inputRange = [0, 200]\n * const outputRange = [0, 1]\n * const output = transform(100, inputRange, outputRange)\n *\n * // Returns 0.5\n * return <div>{output}</div>\n * }\n * ```\n *\n * @param inputValue - A number to transform between the input and output ranges.\n * @param inputRange - A linear series of numbers (either all increasing or decreasing).\n * @param outputRange - A series of numbers, colors, strings, or arrays/objects of those. Must be the same length as `inputRange`.\n * @param options - Clamp: Clamp values to within the given range. Defaults to `true`.\n *\n * @public\n */\nexport function transform<T>(\n inputValue: number,\n inputRange: number[],\n outputRange: T[],\n options?: TransformOptions<T>\n): T\n/**\n *\n * Transforms numbers into other values by mapping them from an input range to an output range.\n *\n * Given an input range of `[0, 200]` and an output range of\n * `[0, 1]`, this function will return a value between `0` and `1`.\n * The input range must be a linear series of numbers. The output range\n * can be any supported value type, such as numbers, colors, shadows, arrays, objects and more.\n * Every value in the output range must be of the same type and in the same format.\n *\n * ```jsx\n * export function MyComponent() {\n * const inputRange = [-200, -100, 100, 200]\n * const outputRange = [0, 1, 1, 0]\n * const convertRange = transform(inputRange, outputRange)\n * const output = convertRange(-150)\n *\n * // Returns 0.5\n * return <div>{output}</div>\n * }\n *\n * ```\n *\n * @param inputRange - A linear series of numbers (either all increasing or decreasing).\n * @param outputRange - A series of numbers, colors or strings. Must be the same length as `inputRange`.\n * @param options - Clamp: clamp values to within the given range. Defaults to `true`.\n *\n * @public\n */\nexport function transform<T>(\n inputRange: number[],\n outputRange: T[],\n options?: TransformOptions<T>\n): (inputValue: number) => T\nexport function transform<T>(\n ...args:\n | [number, number[], T[], TransformOptions<T>?]\n | [number[], T[], TransformOptions<T>?]\n) {\n const useImmediate = !Array.isArray(args[0])\n const argOffset = useImmediate ? 0 : -1\n const inputValue = args[0 + argOffset] as number\n const inputRange = args[1 + argOffset] as number[]\n const outputRange = args[2 + argOffset] as T[]\n const options = args[3 + argOffset] as TransformOptions<T>\n\n const interpolator = interpolate(inputRange, outputRange, options)\n\n return useImmediate ? interpolator(inputValue) : interpolator\n}\n"],"names":[],"mappings":";;AAqGM,SAAU,SAAS,CACrB,GAAG,IAEwC,EAAA;AAE3C,IAAA,MAAM,YAAY,GAAG,CAAC,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;AAC5C,IAAA,MAAM,SAAS,GAAG,YAAY,GAAG,CAAC,GAAG,EAAE;IACvC,MAAM,UAAU,GAAG,IAAI,CAAC,CAAC,GAAG,SAAS,CAAW;IAChD,MAAM,UAAU,GAAG,IAAI,CAAC,CAAC,GAAG,SAAS,CAAa;IAClD,MAAM,WAAW,GAAG,IAAI,CAAC,CAAC,GAAG,SAAS,CAAQ;IAC9C,MAAM,OAAO,GAAG,IAAI,CAAC,CAAC,GAAG,SAAS,CAAwB;IAE1D,MAAM,YAAY,GAAG,WAAW,CAAC,UAAU,EAAE,WAAW,EAAE,OAAO,CAAC;AAElE,IAAA,OAAO,YAAY,GAAG,YAAY,CAAC,UAAU,CAAC,GAAG,YAAY;AACjE;;;;"}