motion 12.18.1 → 12.19.0

package/dist/es/motion-dom/dist/es/resize/index.mjs

@@ -1,8 +0,0 @@
-import { resizeElement } from './handle-element.mjs';
-import { resizeWindow } from './handle-window.mjs';
-
-function resize(a, b) {
-    return typeof a === "function" ? resizeWindow(a) : resizeElement(a, b);
-}
-
-export { resize };

package/dist/es/motion-dom/dist/es/scroll/observe.mjs

@@ -1,18 +0,0 @@
-import { frame, cancelFrame } from '../frameloop/frame.mjs';
-
-function observeTimeline(update, timeline) {
-    let prevProgress;
-    const onFrame = () => {
-        const { currentTime } = timeline;
-        const percentage = currentTime === null ? 0 : currentTime.value;
-        const progress = percentage / 100;
-        if (prevProgress !== progress) {
-            update(progress);
-        }
-        prevProgress = progress;
-    };
-    frame.preUpdate(onFrame, true);
-    return () => cancelFrame(onFrame);
-}
-
-export { observeTimeline };

package/dist/es/motion-dom/dist/es/stats/animation-count.mjs

@@ -1,7 +0,0 @@
-const activeAnimations = {
-    layout: 0,
-    mainThread: 0,
-    waapi: 0,
-};
-
-export { activeAnimations };

package/dist/es/motion-dom/dist/es/stats/buffer.mjs

@@ -1,6 +0,0 @@
-const statsBuffer = {
-    value: null,
-    addProjectionMetrics: null,
-};
-
-export { statsBuffer };

package/dist/es/motion-dom/dist/es/stats/index.mjs

@@ -1,117 +0,0 @@
-import { activeAnimations } from './animation-count.mjs';
-import { statsBuffer } from './buffer.mjs';
-import { frame, cancelFrame, frameData } from '../frameloop/frame.mjs';
-
-function record() {
-    const { value } = statsBuffer;
-    if (value === null) {
-        cancelFrame(record);
-        return;
-    }
-    value.frameloop.rate.push(frameData.delta);
-    value.animations.mainThread.push(activeAnimations.mainThread);
-    value.animations.waapi.push(activeAnimations.waapi);
-    value.animations.layout.push(activeAnimations.layout);
-}
-function mean(values) {
-    return values.reduce((acc, value) => acc + value, 0) / values.length;
-}
-function summarise(values, calcAverage = mean) {
-    if (values.length === 0) {
-        return {
-            min: 0,
-            max: 0,
-            avg: 0,
-        };
-    }
-    return {
-        min: Math.min(...values),
-        max: Math.max(...values),
-        avg: calcAverage(values),
-    };
-}
-const msToFps = (ms) => Math.round(1000 / ms);
-function clearStatsBuffer() {
-    statsBuffer.value = null;
-    statsBuffer.addProjectionMetrics = null;
-}
-function reportStats() {
-    const { value } = statsBuffer;
-    if (!value) {
-        throw new Error("Stats are not being measured");
-    }
-    clearStatsBuffer();
-    cancelFrame(record);
-    const summary = {
-        frameloop: {
-            setup: summarise(value.frameloop.setup),
-            rate: summarise(value.frameloop.rate),
-            read: summarise(value.frameloop.read),
-            resolveKeyframes: summarise(value.frameloop.resolveKeyframes),
-            preUpdate: summarise(value.frameloop.preUpdate),
-            update: summarise(value.frameloop.update),
-            preRender: summarise(value.frameloop.preRender),
-            render: summarise(value.frameloop.render),
-            postRender: summarise(value.frameloop.postRender),
-        },
-        animations: {
-            mainThread: summarise(value.animations.mainThread),
-            waapi: summarise(value.animations.waapi),
-            layout: summarise(value.animations.layout),
-        },
-        layoutProjection: {
-            nodes: summarise(value.layoutProjection.nodes),
-            calculatedTargetDeltas: summarise(value.layoutProjection.calculatedTargetDeltas),
-            calculatedProjections: summarise(value.layoutProjection.calculatedProjections),
-        },
-    };
-    /**
-     * Convert the rate to FPS
-     */
-    const { rate } = summary.frameloop;
-    rate.min = msToFps(rate.min);
-    rate.max = msToFps(rate.max);
-    rate.avg = msToFps(rate.avg);
-    [rate.min, rate.max] = [rate.max, rate.min];
-    return summary;
-}
-function recordStats() {
-    if (statsBuffer.value) {
-        clearStatsBuffer();
-        throw new Error("Stats are already being measured");
-    }
-    const newStatsBuffer = statsBuffer;
-    newStatsBuffer.value = {
-        frameloop: {
-            setup: [],
-            rate: [],
-            read: [],
-            resolveKeyframes: [],
-            preUpdate: [],
-            update: [],
-            preRender: [],
-            render: [],
-            postRender: [],
-        },
-        animations: {
-            mainThread: [],
-            waapi: [],
-            layout: [],
-        },
-        layoutProjection: {
-            nodes: [],
-            calculatedTargetDeltas: [],
-            calculatedProjections: [],
-        },
-    };
-    newStatsBuffer.addProjectionMetrics = (metrics) => {
-        const { layoutProjection } = newStatsBuffer.value;
-        layoutProjection.nodes.push(metrics.nodes);
-        layoutProjection.calculatedTargetDeltas.push(metrics.calculatedTargetDeltas);
-        layoutProjection.calculatedProjections.push(metrics.calculatedProjections);
-    };
-    frame.postRender(record, true);
-    return reportStats;
-}
-
-export { recordStats };

package/dist/es/motion-dom/dist/es/utils/interpolate.mjs

@@ -1,79 +0,0 @@
-import { mix } from './mix/index.mjs';
-import { invariant } from '../../../../motion-utils/dist/es/errors.mjs';
-import { clamp } from '../../../../motion-utils/dist/es/clamp.mjs';
-import { MotionGlobalConfig } from '../../../../motion-utils/dist/es/global-config.mjs';
-import { noop } from '../../../../motion-utils/dist/es/noop.mjs';
-import { pipe } from '../../../../motion-utils/dist/es/pipe.mjs';
-import { progress } from '../../../../motion-utils/dist/es/progress.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");
-    /**
-     * 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 };

package/dist/es/motion-dom/dist/es/utils/is-html-element.mjs

@@ -1,11 +0,0 @@
-import { isObject } from '../../../../motion-utils/dist/es/is-object.mjs';
-
-/**
- * Checks if an element is an HTML element in a way
- * that works across iframes
- */
-function isHTMLElement(element) {
-    return isObject(element) && "offsetHeight" in element;
-}
-
-export { isHTMLElement };

package/dist/es/motion-dom/dist/es/utils/is-svg-element.mjs

@@ -1,11 +0,0 @@
-import { isObject } from '../../../../motion-utils/dist/es/is-object.mjs';
-
-/**
- * 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 };

package/dist/es/motion-dom/dist/es/utils/is-svg-svg-element.mjs

@@ -1,11 +0,0 @@
-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 };

package/dist/es/motion-dom/dist/es/utils/mix/color.mjs

@@ -1,47 +0,0 @@
-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';
-import { warning } from '../../../../../motion-utils/dist/es/errors.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.`);
-    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 };

package/dist/es/motion-dom/dist/es/utils/mix/complex.mjs

@@ -1,93 +0,0 @@
-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';
-import { pipe } from '../../../../../motion-utils/dist/es/pipe.mjs';
-import { warning } from '../../../../../motion-utils/dist/es/errors.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.`);
-        return mixImmediate(origin, target);
-    }
-};
-
-export { getMixer, mixArray, mixComplex, mixObject };

package/dist/es/motion-dom/dist/es/utils/mix/immediate.mjs

@@ -1,5 +0,0 @@
-function mixImmediate(a, b) {
-    return (p) => (p > 0 ? b : a);
-}
-
-export { mixImmediate };

package/dist/es/motion-dom/dist/es/utils/mix/index.mjs

@@ -1,14 +0,0 @@
-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 };

package/dist/es/motion-dom/dist/es/utils/mix/number.mjs

@@ -1,26 +0,0 @@
-/*
-  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 };

package/dist/es/motion-dom/dist/es/utils/mix/visibility.mjs

@@ -1,16 +0,0 @@
-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 };

package/dist/es/motion-dom/dist/es/utils/resolve-elements.mjs

@@ -1,17 +0,0 @@
-function resolveElements(elementOrSelector, scope, selectorCache) {
-    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);
-}
-
-export { resolveElements };

package/dist/es/motion-dom/dist/es/utils/supports/flags.mjs

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

package/dist/es/motion-dom/dist/es/utils/supports/linear-easing.mjs

@@ -1,15 +0,0 @@
-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 };

package/dist/es/motion-dom/dist/es/utils/supports/memo.mjs

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

package/dist/es/motion-dom/dist/es/utils/supports/scroll-timeline.mjs

@@ -1,5 +0,0 @@
-import { memo } from '../../../../../motion-utils/dist/es/memo.mjs';
-
-const supportsScrollTimeline = /* @__PURE__ */ memo(() => window.ScrollTimeline !== undefined);
-
-export { supportsScrollTimeline };

package/dist/es/motion-dom/dist/es/utils/transform.mjs

@@ -1,14 +0,0 @@
-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 };