motion 12.18.1 → 12.19.0

package/dist/es/motion-dom/dist/es/frameloop/microtask.mjs

@@ -1,6 +0,0 @@
-import { createRenderBatcher } from './batcher.mjs';
-
-const { schedule: microtask, cancel: cancelMicrotask } = 
-/* @__PURE__ */ createRenderBatcher(queueMicrotask, false);
-
-export { cancelMicrotask, microtask };

package/dist/es/motion-dom/dist/es/frameloop/order.mjs

@@ -1,12 +0,0 @@
-const stepsOrder = [
-    "setup", // Compute
-    "read", // Read
-    "resolveKeyframes", // Write/Read/Write/Read
-    "preUpdate", // Compute
-    "update", // Compute
-    "preRender", // Compute
-    "render", // Write
-    "postRender", // Compute
-];
-
-export { stepsOrder };

package/dist/es/motion-dom/dist/es/frameloop/render-step.mjs

@@ -1,92 +0,0 @@
-import { statsBuffer } from '../stats/buffer.mjs';
-
-function createRenderStep(runNextFrame, stepName) {
-    /**
-     * We create and reuse two queues, one to queue jobs for the current frame
-     * and one for the next. We reuse to avoid triggering GC after x frames.
-     */
-    let thisFrame = new Set();
-    let nextFrame = new Set();
-    /**
-     * Track whether we're currently processing jobs in this step. This way
-     * we can decide whether to schedule new jobs for this frame or next.
-     */
-    let isProcessing = false;
-    let flushNextFrame = false;
-    /**
-     * A set of processes which were marked keepAlive when scheduled.
-     */
-    const toKeepAlive = new WeakSet();
-    let latestFrameData = {
-        delta: 0.0,
-        timestamp: 0.0,
-        isProcessing: false,
-    };
-    let numCalls = 0;
-    function triggerCallback(callback) {
-        if (toKeepAlive.has(callback)) {
-            step.schedule(callback);
-            runNextFrame();
-        }
-        numCalls++;
-        callback(latestFrameData);
-    }
-    const step = {
-        /**
-         * Schedule a process to run on the next frame.
-         */
-        schedule: (callback, keepAlive = false, immediate = false) => {
-            const addToCurrentFrame = immediate && isProcessing;
-            const queue = addToCurrentFrame ? thisFrame : nextFrame;
-            if (keepAlive)
-                toKeepAlive.add(callback);
-            if (!queue.has(callback))
-                queue.add(callback);
-            return callback;
-        },
-        /**
-         * Cancel the provided callback from running on the next frame.
-         */
-        cancel: (callback) => {
-            nextFrame.delete(callback);
-            toKeepAlive.delete(callback);
-        },
-        /**
-         * Execute all schedule callbacks.
-         */
-        process: (frameData) => {
-            latestFrameData = frameData;
-            /**
-             * If we're already processing we've probably been triggered by a flushSync
-             * inside an existing process. Instead of executing, mark flushNextFrame
-             * as true and ensure we flush the following frame at the end of this one.
-             */
-            if (isProcessing) {
-                flushNextFrame = true;
-                return;
-            }
-            isProcessing = true;
-            [thisFrame, nextFrame] = [nextFrame, thisFrame];
-            // Execute this frame
-            thisFrame.forEach(triggerCallback);
-            /**
-             * If we're recording stats then
-             */
-            if (stepName && statsBuffer.value) {
-                statsBuffer.value.frameloop[stepName].push(numCalls);
-            }
-            numCalls = 0;
-            // Clear the frame so no callbacks remain. This is to avoid
-            // memory leaks should this render step not run for a while.
-            thisFrame.clear();
-            isProcessing = false;
-            if (flushNextFrame) {
-                flushNextFrame = false;
-                step.process(frameData);
-            }
-        },
-    };
-    return step;
-}
-
-export { createRenderStep };

package/dist/es/motion-dom/dist/es/frameloop/sync-time.mjs

@@ -1,31 +0,0 @@
-import { frameData } from './frame.mjs';
-import { MotionGlobalConfig } from '../../../../motion-utils/dist/es/global-config.mjs';
-
-let now;
-function clearTime() {
-    now = undefined;
-}
-/**
- * An eventloop-synchronous alternative to performance.now().
- *
- * Ensures that time measurements remain consistent within a synchronous context.
- * Usually calling performance.now() twice within the same synchronous context
- * will return different values which isn't useful for animations when we're usually
- * trying to sync animations to the same frame.
- */
-const time = {
-    now: () => {
-        if (now === undefined) {
-            time.set(frameData.isProcessing || MotionGlobalConfig.useManualTiming
-                ? frameData.timestamp
-                : performance.now());
-        }
-        return now;
-    },
-    set: (newTime) => {
-        now = newTime;
-        queueMicrotask(clearTime);
-    },
-};
-
-export { time };

package/dist/es/motion-dom/dist/es/gestures/drag/state/is-active.mjs

@@ -1,9 +0,0 @@
-const isDragging = {
-    x: false,
-    y: false,
-};
-function isDragActive() {
-    return isDragging.x || isDragging.y;
-}
-
-export { isDragActive, isDragging };

package/dist/es/motion-dom/dist/es/gestures/drag/state/set-active.mjs

@@ -1,28 +0,0 @@
-import { isDragging } from './is-active.mjs';
-
-function setDragLock(axis) {
-    if (axis === "x" || axis === "y") {
-        if (isDragging[axis]) {
-            return null;
-        }
-        else {
-            isDragging[axis] = true;
-            return () => {
-                isDragging[axis] = false;
-            };
-        }
-    }
-    else {
-        if (isDragging.x || isDragging.y) {
-            return null;
-        }
-        else {
-            isDragging.x = isDragging.y = true;
-            return () => {
-                isDragging.x = isDragging.y = false;
-            };
-        }
-    }
-}
-
-export { setDragLock };

package/dist/es/motion-dom/dist/es/gestures/hover.mjs

@@ -1,37 +0,0 @@
-import { isDragActive } from './drag/state/is-active.mjs';
-import { setupGesture } from './utils/setup.mjs';
-
-function isValidHover(event) {
-    return !(event.pointerType === "touch" || isDragActive());
-}
-/**
- * Create a hover gesture. hover() is different to .addEventListener("pointerenter")
- * in that it has an easier syntax, filters out polyfilled touch events, interoperates
- * with drag gestures, and automatically removes the "pointerennd" event listener when the hover ends.
- *
- * @public
- */
-function hover(elementOrSelector, onHoverStart, options = {}) {
-    const [elements, eventOptions, cancel] = setupGesture(elementOrSelector, options);
-    const onPointerEnter = (enterEvent) => {
-        if (!isValidHover(enterEvent))
-            return;
-        const { target } = enterEvent;
-        const onHoverEnd = onHoverStart(target, enterEvent);
-        if (typeof onHoverEnd !== "function" || !target)
-            return;
-        const onPointerLeave = (leaveEvent) => {
-            if (!isValidHover(leaveEvent))
-                return;
-            onHoverEnd(leaveEvent);
-            target.removeEventListener("pointerleave", onPointerLeave);
-        };
-        target.addEventListener("pointerleave", onPointerLeave, eventOptions);
-    };
-    elements.forEach((element) => {
-        element.addEventListener("pointerenter", onPointerEnter, eventOptions);
-    });
-    return cancel;
-}
-
-export { hover };

package/dist/es/motion-dom/dist/es/gestures/press/index.mjs

@@ -1,83 +0,0 @@
-import { isHTMLElement } from '../../utils/is-html-element.mjs';
-import { isDragActive } from '../drag/state/is-active.mjs';
-import { isNodeOrChild } from '../utils/is-node-or-child.mjs';
-import { isPrimaryPointer } from '../utils/is-primary-pointer.mjs';
-import { setupGesture } from '../utils/setup.mjs';
-import { isElementKeyboardAccessible } from './utils/is-keyboard-accessible.mjs';
-import { enableKeyboardPress } from './utils/keyboard.mjs';
-import { isPressing } from './utils/state.mjs';
-
-/**
- * Filter out events that are not primary pointer events, or are triggering
- * while a Motion gesture is active.
- */
-function isValidPressEvent(event) {
-    return isPrimaryPointer(event) && !isDragActive();
-}
-/**
- * Create a press gesture.
- *
- * Press is different to `"pointerdown"`, `"pointerup"` in that it
- * automatically filters out secondary pointer events like right
- * click and multitouch.
- *
- * It also adds accessibility support for keyboards, where
- * an element with a press gesture will receive focus and
- *  trigger on Enter `"keydown"` and `"keyup"` events.
- *
- * This is different to a browser's `"click"` event, which does
- * respond to keyboards but only for the `"click"` itself, rather
- * than the press start and end/cancel. The element also needs
- * to be focusable for this to work, whereas a press gesture will
- * make an element focusable by default.
- *
- * @public
- */
-function press(targetOrSelector, onPressStart, options = {}) {
-    const [targets, eventOptions, cancelEvents] = setupGesture(targetOrSelector, options);
-    const startPress = (startEvent) => {
-        const target = startEvent.currentTarget;
-        if (!isValidPressEvent(startEvent))
-            return;
-        isPressing.add(target);
-        const onPressEnd = onPressStart(target, startEvent);
-        const onPointerEnd = (endEvent, success) => {
-            window.removeEventListener("pointerup", onPointerUp);
-            window.removeEventListener("pointercancel", onPointerCancel);
-            if (isPressing.has(target)) {
-                isPressing.delete(target);
-            }
-            if (!isValidPressEvent(endEvent)) {
-                return;
-            }
-            if (typeof onPressEnd === "function") {
-                onPressEnd(endEvent, { success });
-            }
-        };
-        const onPointerUp = (upEvent) => {
-            onPointerEnd(upEvent, target === window ||
-                target === document ||
-                options.useGlobalTarget ||
-                isNodeOrChild(target, upEvent.target));
-        };
-        const onPointerCancel = (cancelEvent) => {
-            onPointerEnd(cancelEvent, false);
-        };
-        window.addEventListener("pointerup", onPointerUp, eventOptions);
-        window.addEventListener("pointercancel", onPointerCancel, eventOptions);
-    };
-    targets.forEach((target) => {
-        const pointerDownTarget = options.useGlobalTarget ? window : target;
-        pointerDownTarget.addEventListener("pointerdown", startPress, eventOptions);
-        if (isHTMLElement(target)) {
-            target.addEventListener("focus", (event) => enableKeyboardPress(event, eventOptions));
-            if (!isElementKeyboardAccessible(target) &&
-                !target.hasAttribute("tabindex")) {
-                target.tabIndex = 0;
-            }
-        }
-    });
-    return cancelEvents;
-}
-
-export { press };

package/dist/es/motion-dom/dist/es/gestures/press/utils/is-keyboard-accessible.mjs

@@ -1,13 +0,0 @@
-const focusableElements = new Set([
-    "BUTTON",
-    "INPUT",
-    "SELECT",
-    "TEXTAREA",
-    "A",
-]);
-function isElementKeyboardAccessible(element) {
-    return (focusableElements.has(element.tagName) ||
-        element.tabIndex !== -1);
-}
-
-export { isElementKeyboardAccessible };

package/dist/es/motion-dom/dist/es/gestures/press/utils/keyboard.mjs

@@ -1,38 +0,0 @@
-import { isPressing } from './state.mjs';
-
-/**
- * Filter out events that are not "Enter" keys.
- */
-function filterEvents(callback) {
-    return (event) => {
-        if (event.key !== "Enter")
-            return;
-        callback(event);
-    };
-}
-function firePointerEvent(target, type) {
-    target.dispatchEvent(new PointerEvent("pointer" + type, { isPrimary: true, bubbles: true }));
-}
-const enableKeyboardPress = (focusEvent, eventOptions) => {
-    const element = focusEvent.currentTarget;
-    if (!element)
-        return;
-    const handleKeydown = filterEvents(() => {
-        if (isPressing.has(element))
-            return;
-        firePointerEvent(element, "down");
-        const handleKeyup = filterEvents(() => {
-            firePointerEvent(element, "up");
-        });
-        const handleBlur = () => firePointerEvent(element, "cancel");
-        element.addEventListener("keyup", handleKeyup, eventOptions);
-        element.addEventListener("blur", handleBlur, eventOptions);
-    });
-    element.addEventListener("keydown", handleKeydown, eventOptions);
-    /**
-     * Add an event listener that fires on blur to remove the keydown events.
-     */
-    element.addEventListener("blur", () => element.removeEventListener("keydown", handleKeydown), eventOptions);
-};
-
-export { enableKeyboardPress };

package/dist/es/motion-dom/dist/es/gestures/press/utils/state.mjs

@@ -1,3 +0,0 @@
-const isPressing = new WeakSet();
-
-export { isPressing };

package/dist/es/motion-dom/dist/es/gestures/utils/is-node-or-child.mjs

@@ -1,20 +0,0 @@
-/**
- * Recursively traverse up the tree to check whether the provided child node
- * is the parent or a descendant of it.
- *
- * @param parent - Element to find
- * @param child - Element to test against parent
- */
-const isNodeOrChild = (parent, child) => {
-    if (!child) {
-        return false;
-    }
-    else if (parent === child) {
-        return true;
-    }
-    else {
-        return isNodeOrChild(parent, child.parentElement);
-    }
-};
-
-export { isNodeOrChild };

package/dist/es/motion-dom/dist/es/gestures/utils/is-primary-pointer.mjs

@@ -1,18 +0,0 @@
-const isPrimaryPointer = (event) => {
-    if (event.pointerType === "mouse") {
-        return typeof event.button !== "number" || event.button <= 0;
-    }
-    else {
-        /**
-         * isPrimary is true for all mice buttons, whereas every touch point
-         * is regarded as its own input. So subsequent concurrent touch points
-         * will be false.
-         *
-         * Specifically match against false here as incomplete versions of
-         * PointerEvents in very old browser might have it set as undefined.
-         */
-        return event.isPrimary !== false;
-    }
-};
-
-export { isPrimaryPointer };

package/dist/es/motion-dom/dist/es/gestures/utils/setup.mjs

@@ -1,15 +0,0 @@
-import { resolveElements } from '../../utils/resolve-elements.mjs';
-
-function setupGesture(elementOrSelector, options) {
-    const elements = resolveElements(elementOrSelector);
-    const gestureAbortController = new AbortController();
-    const eventOptions = {
-        passive: true,
-        ...options,
-        signal: gestureAbortController.signal,
-    };
-    const cancel = () => gestureAbortController.abort();
-    return [elements, eventOptions, cancel];
-}
-
-export { setupGesture };

package/dist/es/motion-dom/dist/es/render/dom/is-css-var.mjs

@@ -1,3 +0,0 @@
-const isCSSVar = (name) => name.startsWith("--");
-
-export { isCSSVar };

package/dist/es/motion-dom/dist/es/render/dom/parse-transform.mjs

@@ -1,83 +0,0 @@
-const radToDeg = (rad) => (rad * 180) / Math.PI;
-const rotate = (v) => {
-    const angle = radToDeg(Math.atan2(v[1], v[0]));
-    return rebaseAngle(angle);
-};
-const matrix2dParsers = {
-    x: 4,
-    y: 5,
-    translateX: 4,
-    translateY: 5,
-    scaleX: 0,
-    scaleY: 3,
-    scale: (v) => (Math.abs(v[0]) + Math.abs(v[3])) / 2,
-    rotate,
-    rotateZ: rotate,
-    skewX: (v) => radToDeg(Math.atan(v[1])),
-    skewY: (v) => radToDeg(Math.atan(v[2])),
-    skew: (v) => (Math.abs(v[1]) + Math.abs(v[2])) / 2,
-};
-const rebaseAngle = (angle) => {
-    angle = angle % 360;
-    if (angle < 0)
-        angle += 360;
-    return angle;
-};
-const rotateZ = rotate;
-const scaleX = (v) => Math.sqrt(v[0] * v[0] + v[1] * v[1]);
-const scaleY = (v) => Math.sqrt(v[4] * v[4] + v[5] * v[5]);
-const matrix3dParsers = {
-    x: 12,
-    y: 13,
-    z: 14,
-    translateX: 12,
-    translateY: 13,
-    translateZ: 14,
-    scaleX,
-    scaleY,
-    scale: (v) => (scaleX(v) + scaleY(v)) / 2,
-    rotateX: (v) => rebaseAngle(radToDeg(Math.atan2(v[6], v[5]))),
-    rotateY: (v) => rebaseAngle(radToDeg(Math.atan2(-v[2], v[0]))),
-    rotateZ,
-    rotate: rotateZ,
-    skewX: (v) => radToDeg(Math.atan(v[4])),
-    skewY: (v) => radToDeg(Math.atan(v[1])),
-    skew: (v) => (Math.abs(v[1]) + Math.abs(v[4])) / 2,
-};
-function defaultTransformValue(name) {
-    return name.includes("scale") ? 1 : 0;
-}
-function parseValueFromTransform(transform, name) {
-    if (!transform || transform === "none") {
-        return defaultTransformValue(name);
-    }
-    const matrix3dMatch = transform.match(/^matrix3d\(([-\d.e\s,]+)\)$/u);
-    let parsers;
-    let match;
-    if (matrix3dMatch) {
-        parsers = matrix3dParsers;
-        match = matrix3dMatch;
-    }
-    else {
-        const matrix2dMatch = transform.match(/^matrix\(([-\d.e\s,]+)\)$/u);
-        parsers = matrix2dParsers;
-        match = matrix2dMatch;
-    }
-    if (!match) {
-        return defaultTransformValue(name);
-    }
-    const valueParser = parsers[name];
-    const values = match[1].split(",").map(convertTransformToNumber);
-    return typeof valueParser === "function"
-        ? valueParser(values)
-        : values[valueParser];
-}
-const readTransformValue = (instance, name) => {
-    const { transform = "none" } = getComputedStyle(instance);
-    return parseValueFromTransform(transform, name);
-};
-function convertTransformToNumber(value) {
-    return parseFloat(value.trim());
-}
-
-export { defaultTransformValue, parseValueFromTransform, readTransformValue };

package/dist/es/motion-dom/dist/es/render/dom/style-computed.mjs

@@ -1,10 +0,0 @@
-import { isCSSVar } from './is-css-var.mjs';
-
-function getComputedStyle(element, name) {
-    const computedStyle = window.getComputedStyle(element);
-    return isCSSVar(name)
-        ? computedStyle.getPropertyValue(name)
-        : computedStyle[name];
-}
-
-export { getComputedStyle };

package/dist/es/motion-dom/dist/es/render/dom/style-set.mjs

@@ -1,9 +0,0 @@
-import { isCSSVar } from './is-css-var.mjs';
-
-function setStyle(element, name, value) {
-    isCSSVar(name)
-        ? element.style.setProperty(name, value)
-        : (element.style[name] = value);
-}
-
-export { setStyle };

package/dist/es/motion-dom/dist/es/render/dom/utils/camel-to-dash.mjs

@@ -1,5 +0,0 @@
-function camelToDash(str) {
-    return str.replace(/([A-Z])/g, (match) => `-${match.toLowerCase()}`);
-}
-
-export { camelToDash };

package/dist/es/motion-dom/dist/es/render/utils/keys-position.mjs

@@ -1,13 +0,0 @@
-import { transformPropOrder } from './keys-transform.mjs';
-
-const positionalKeys = new Set([
-    "width",
-    "height",
-    "top",
-    "left",
-    "right",
-    "bottom",
-    ...transformPropOrder,
-]);
-
-export { positionalKeys };

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

@@ -1,28 +0,0 @@
-/**
- * Generate a list of every possible transform key.
- */
-const transformPropOrder = [
-    "transformPerspective",
-    "x",
-    "y",
-    "z",
-    "translateX",
-    "translateY",
-    "translateZ",
-    "scale",
-    "scaleX",
-    "scaleY",
-    "rotate",
-    "rotateX",
-    "rotateY",
-    "rotateZ",
-    "skew",
-    "skewX",
-    "skewY",
-];
-/**
- * A quick lookup for transform props.
- */
-const transformProps = /*@__PURE__*/ (() => new Set(transformPropOrder))();
-
-export { transformPropOrder, transformProps };

package/dist/es/motion-dom/dist/es/resize/handle-element.mjs

@@ -1,63 +0,0 @@
-import { isSVGElement } from '../utils/is-svg-element.mjs';
-import { resolveElements } from '../utils/resolve-elements.mjs';
-
-const resizeHandlers = new WeakMap();
-let observer;
-const getSize = (borderBoxAxis, svgAxis, htmlAxis) => (target, borderBoxSize) => {
-    if (borderBoxSize && borderBoxSize[0]) {
-        return borderBoxSize[0][(borderBoxAxis + "Size")];
-    }
-    else if (isSVGElement(target) && "getBBox" in target) {
-        return target.getBBox()[svgAxis];
-    }
-    else {
-        return target[htmlAxis];
-    }
-};
-const getWidth = /*@__PURE__*/ getSize("inline", "width", "offsetWidth");
-const getHeight = /*@__PURE__*/ getSize("block", "height", "offsetHeight");
-function notifyTarget({ target, borderBoxSize }) {
-    resizeHandlers.get(target)?.forEach((handler) => {
-        handler(target, {
-            get width() {
-                return getWidth(target, borderBoxSize);
-            },
-            get height() {
-                return getHeight(target, borderBoxSize);
-            },
-        });
-    });
-}
-function notifyAll(entries) {
-    entries.forEach(notifyTarget);
-}
-function createResizeObserver() {
-    if (typeof ResizeObserver === "undefined")
-        return;
-    observer = new ResizeObserver(notifyAll);
-}
-function resizeElement(target, handler) {
-    if (!observer)
-        createResizeObserver();
-    const elements = resolveElements(target);
-    elements.forEach((element) => {
-        let elementHandlers = resizeHandlers.get(element);
-        if (!elementHandlers) {
-            elementHandlers = new Set();
-            resizeHandlers.set(element, elementHandlers);
-        }
-        elementHandlers.add(handler);
-        observer?.observe(element);
-    });
-    return () => {
-        elements.forEach((element) => {
-            const elementHandlers = resizeHandlers.get(element);
-            elementHandlers?.delete(handler);
-            if (!elementHandlers?.size) {
-                observer?.unobserve(element);
-            }
-        });
-    };
-}
-
-export { resizeElement };

package/dist/es/motion-dom/dist/es/resize/handle-window.mjs

@@ -1,31 +0,0 @@
-const windowCallbacks = new Set();
-let windowResizeHandler;
-function createWindowResizeHandler() {
-    windowResizeHandler = () => {
-        const info = {
-            get width() {
-                return window.innerWidth;
-            },
-            get height() {
-                return window.innerHeight;
-            },
-        };
-        windowCallbacks.forEach((callback) => callback(info));
-    };
-    window.addEventListener("resize", windowResizeHandler);
-}
-function resizeWindow(callback) {
-    windowCallbacks.add(callback);
-    if (!windowResizeHandler)
-        createWindowResizeHandler();
-    return () => {
-        windowCallbacks.delete(callback);
-        if (!windowCallbacks.size &&
-            typeof windowResizeHandler === "function") {
-            window.removeEventListener("resize", windowResizeHandler);
-            windowResizeHandler = undefined;
-        }
-    };
-}
-
-export { resizeWindow };