framer-motion 7.0.3 → 7.1.2

package/dist/es/motion/features/viewport/observers.mjs

@@ -1,49 +1,49 @@
-import { __rest, __assign } from 'tslib';
+import { __rest } from 'tslib';
 
 /**
  * Map an IntersectionHandler callback to an element. We only ever make one handler for one
  * element, so even though these handlers might all be triggered by different
  * observers, we can keep them in the same map.
  */
-var observerCallbacks = new WeakMap();
+const observerCallbacks = new WeakMap();
 /**
  * Multiple observers can be created for multiple element/document roots. Each with
  * different settings. So here we store dictionaries of observers to each root,
  * using serialised settings (threshold/margin) as lookup keys.
  */
-var observers = new WeakMap();
-var fireObserverCallback = function (entry) {
+const observers = new WeakMap();
+const fireObserverCallback = (entry) => {
     var _a;
     (_a = observerCallbacks.get(entry.target)) === null || _a === void 0 ? void 0 : _a(entry);
 };
-var fireAllObserverCallbacks = function (entries) {
+const fireAllObserverCallbacks = (entries) => {
     entries.forEach(fireObserverCallback);
 };
 function initIntersectionObserver(_a) {
-    var root = _a.root, options = __rest(_a, ["root"]);
-    var lookupRoot = root || document;
+    var { root } = _a, options = __rest(_a, ["root"]);
+    const lookupRoot = root || document;
     /**
      * If we don't have an observer lookup map for this root, create one.
      */
     if (!observers.has(lookupRoot)) {
         observers.set(lookupRoot, {});
     }
-    var rootObservers = observers.get(lookupRoot);
-    var key = JSON.stringify(options);
+    const rootObservers = observers.get(lookupRoot);
+    const key = JSON.stringify(options);
     /**
      * If we don't have an observer for this combination of root and settings,
      * create one.
      */
     if (!rootObservers[key]) {
-        rootObservers[key] = new IntersectionObserver(fireAllObserverCallbacks, __assign({ root: root }, options));
+        rootObservers[key] = new IntersectionObserver(fireAllObserverCallbacks, Object.assign({ root }, options));
     }
     return rootObservers[key];
 }
 function observeIntersection(element, options, callback) {
-    var rootInteresectionObserver = initIntersectionObserver(options);
+    const rootInteresectionObserver = initIntersectionObserver(options);
     observerCallbacks.set(element, callback);
     rootInteresectionObserver.observe(element);
-    return function () {
+    return () => {
         observerCallbacks.delete(element);
         rootInteresectionObserver.unobserve(element);
     };

package/dist/es/motion/features/viewport/use-viewport.mjs

@@ -4,37 +4,35 @@ import { AnimationType } from '../../../render/utils/types.mjs';
 import { warnOnce } from '../../../utils/warn-once.mjs';
 import { observeIntersection } from './observers.mjs';
 
-function useViewport(_a) {
-    var visualElement = _a.visualElement, whileInView = _a.whileInView, onViewportEnter = _a.onViewportEnter, onViewportLeave = _a.onViewportLeave, _b = _a.viewport, viewport = _b === void 0 ? {} : _b;
-    var state = useRef({
+function useViewport({ visualElement, whileInView, onViewportEnter, onViewportLeave, viewport = {}, }) {
+    const state = useRef({
         hasEnteredView: false,
         isInView: false,
     });
-    var shouldObserve = Boolean(whileInView || onViewportEnter || onViewportLeave);
+    let shouldObserve = Boolean(whileInView || onViewportEnter || onViewportLeave);
     if (viewport.once && state.current.hasEnteredView)
         shouldObserve = false;
-    var useObserver = typeof IntersectionObserver === "undefined"
+    const useObserver = typeof IntersectionObserver === "undefined"
         ? useMissingIntersectionObserver
         : useIntersectionObserver;
     useObserver(shouldObserve, state.current, visualElement, viewport);
 }
-var thresholdNames = {
+const thresholdNames = {
     some: 0,
     all: 1,
 };
-function useIntersectionObserver(shouldObserve, state, visualElement, _a) {
-    var root = _a.root, rootMargin = _a.margin, _b = _a.amount, amount = _b === void 0 ? "some" : _b, once = _a.once;
-    useEffect(function () {
+function useIntersectionObserver(shouldObserve, state, visualElement, { root, margin: rootMargin, amount = "some", once }) {
+    useEffect(() => {
         if (!shouldObserve)
             return;
-        var options = {
+        const options = {
             root: root === null || root === void 0 ? void 0 : root.current,
-            rootMargin: rootMargin,
+            rootMargin,
             threshold: typeof amount === "number" ? amount : thresholdNames[amount],
         };
-        var intersectionCallback = function (entry) {
+        const intersectionCallback = (entry) => {
             var _a;
-            var isIntersecting = entry.isIntersecting;
+            const { isIntersecting } = entry;
             /**
              * If there's been no change in the viewport state, early return.
              */
@@ -56,8 +54,8 @@ function useIntersectionObserver(shouldObserve, state, visualElement, _a) {
              * Use the latest committed props rather than the ones in scope
              * when this observer is created
              */
-            var props = visualElement.getProps();
-            var callback = isIntersecting
+            const props = visualElement.getProps();
+            const callback = isIntersecting
                 ? props.onViewportEnter
                 : props.onViewportLeave;
             callback === null || callback === void 0 ? void 0 : callback(entry);
@@ -70,9 +68,8 @@ function useIntersectionObserver(shouldObserve, state, visualElement, _a) {
  * on mount. This way, the page will be in the state the author expects users
  * to see it in for everyone.
  */
-function useMissingIntersectionObserver(shouldObserve, state, visualElement, _a) {
-    var _b = _a.fallback, fallback = _b === void 0 ? true : _b;
-    useEffect(function () {
+function useMissingIntersectionObserver(shouldObserve, state, visualElement, { fallback = true }) {
+    useEffect(() => {
         if (!shouldObserve || !fallback)
             return;
         if (env !== "production") {
@@ -86,10 +83,10 @@ function useMissingIntersectionObserver(shouldObserve, state, visualElement, _a)
          * This hook should be quite rarely called so setting this in an rAF
          * is preferred to changing the behaviour of the animation state.
          */
-        requestAnimationFrame(function () {
+        requestAnimationFrame(() => {
             var _a;
             state.hasEnteredView = true;
-            var onViewportEnter = visualElement.getProps().onViewportEnter;
+            const { onViewportEnter } = visualElement.getProps();
             onViewportEnter === null || onViewportEnter === void 0 ? void 0 : onViewportEnter(null);
             (_a = visualElement.animationState) === null || _a === void 0 ? void 0 : _a.setActive(AnimationType.InView, true);
         });

package/dist/es/motion/index.mjs

@@ -1,4 +1,3 @@
-import { __assign } from 'tslib';
 import * as React from 'react';
 import { forwardRef, useContext } from 'react';
 import { useFeatures } from './features/use-features.mjs';
@@ -23,21 +22,20 @@ import { VisualElementHandler } from './utils/VisualElementHandler.mjs';
  * Alongside this is a config option which provides a way of rendering the provided
  * component "offline", or outside the React render cycle.
  */
-function createMotionComponent(_a) {
-    var preloadedFeatures = _a.preloadedFeatures, createVisualElement = _a.createVisualElement, projectionNodeConstructor = _a.projectionNodeConstructor, useRender = _a.useRender, useVisualState = _a.useVisualState, Component = _a.Component;
+function createMotionComponent({ preloadedFeatures, createVisualElement, projectionNodeConstructor, useRender, useVisualState, Component, }) {
     preloadedFeatures && loadFeatures(preloadedFeatures);
     function MotionComponent(props, externalRef) {
-        var layoutId = useLayoutId(props);
-        props = __assign(__assign({}, props), { layoutId: layoutId });
+        const layoutId = useLayoutId(props);
+        props = Object.assign(Object.assign({}, props), { layoutId });
         /**
          * If we're rendering in a static environment, we only visually update the component
          * as a result of a React-rerender rather than interactions or animations. This
          * means we don't need to load additional memory structures like VisualElement,
          * or any gesture/animation features.
          */
-        var config = useContext(MotionConfigContext);
-        var features = null;
-        var context = useCreateMotionContext(props);
+        const config = useContext(MotionConfigContext);
+        let features = null;
+        const context = useCreateMotionContext(props);
         /**
          * Create a unique projection ID for this component. If a new component is added
          * during a layout animation we'll use this to query the DOM and hydrate its ref early, allowing
@@ -49,11 +47,11 @@ function createMotionComponent(_a) {
          * shared element transitions however. Perhaps for those we could revert to a root node
          * that gets forceRendered and layout animations are triggered on its layout effect.
          */
-        var projectionId = config.isStatic ? undefined : useProjectionId();
+        const projectionId = config.isStatic ? undefined : useProjectionId();
         /**
          *
          */
-        var visualState = useVisualState(props, config.isStatic);
+        const visualState = useVisualState(props, config.isStatic);
         if (!config.isStatic && isBrowser) {
             /**
              * Create a VisualElement for this component. A VisualElement provides a common
@@ -61,7 +59,7 @@ function createMotionComponent(_a) {
              * providing a way of rendering to these APIs outside of the React render loop
              * for more performant animations and interactions
              */
-            context.visualElement = useVisualElement(Component, visualState, __assign(__assign({}, config), props), createVisualElement);
+            context.visualElement = useVisualElement(Component, visualState, Object.assign(Object.assign({}, config), props), createVisualElement);
             useProjection(projectionId, props, context.visualElement, projectionNodeConstructor ||
                 featureDefinitions.projectionNodeConstructor);
             /**
@@ -74,16 +72,15 @@ function createMotionComponent(_a) {
          * The mount order and hierarchy is specific to ensure our element ref
          * is hydrated by the time features fire their effects.
          */
-        return (React.createElement(VisualElementHandler, { visualElement: context.visualElement, props: __assign(__assign({}, config), props) },
+        return (React.createElement(VisualElementHandler, { visualElement: context.visualElement, props: Object.assign(Object.assign({}, config), props) },
             features,
             React.createElement(MotionContext.Provider, { value: context }, useRender(Component, props, projectionId, useMotionRef(visualState, context.visualElement, externalRef), visualState, config.isStatic, context.visualElement))));
     }
     return forwardRef(MotionComponent);
 }
-function useLayoutId(_a) {
-    var _b;
-    var layoutId = _a.layoutId;
-    var layoutGroupId = (_b = useContext(LayoutGroupContext)) === null || _b === void 0 ? void 0 : _b.id;
+function useLayoutId({ layoutId }) {
+    var _a;
+    const layoutGroupId = (_a = useContext(LayoutGroupContext)) === null || _a === void 0 ? void 0 : _a.id;
     return layoutGroupId && layoutId !== undefined
         ? layoutGroupId + "-" + layoutId
         : layoutId;

package/dist/es/motion/utils/VisualElementHandler.mjs

@@ -1,28 +1,22 @@
-import { __extends } from 'tslib';
 import React__default from 'react';
 
-var VisualElementHandler = /** @class */ (function (_super) {
-    __extends(VisualElementHandler, _super);
-    function VisualElementHandler() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
+class VisualElementHandler extends React__default.Component {
     /**
      * Update visual element props as soon as we know this update is going to be commited.
      */
-    VisualElementHandler.prototype.getSnapshotBeforeUpdate = function () {
+    getSnapshotBeforeUpdate() {
         this.updateProps();
         return null;
-    };
-    VisualElementHandler.prototype.componentDidUpdate = function () { };
-    VisualElementHandler.prototype.updateProps = function () {
-        var _a = this.props, visualElement = _a.visualElement, props = _a.props;
+    }
+    componentDidUpdate() { }
+    updateProps() {
+        const { visualElement, props } = this.props;
         if (visualElement)
             visualElement.setProps(props);
-    };
-    VisualElementHandler.prototype.render = function () {
+    }
+    render() {
         return this.props.children;
-    };
-    return VisualElementHandler;
-}(React__default.Component));
+    }
+}
 
 export { VisualElementHandler };

package/dist/es/motion/utils/is-forced-motion-value.mjs

@@ -1,8 +1,7 @@
 import { scaleCorrectors } from '../../projection/styles/scale-correction.mjs';
 import { isTransformProp, isTransformOriginProp } from '../../render/html/utils/transform.mjs';
 
-function isForcedMotionValue(key, _a) {
-    var layout = _a.layout, layoutId = _a.layoutId;
+function isForcedMotionValue(key, { layout, layoutId }) {
     return (isTransformProp(key) ||
         isTransformOriginProp(key) ||
         ((layout || layoutId !== undefined) &&

package/dist/es/motion/utils/make-renderless-component.mjs

@@ -1,6 +1,6 @@
-var makeRenderlessComponent = function (hook) { return function (props) {
+const makeRenderlessComponent = (hook) => (props) => {
     hook(props);
     return null;
-}; };
+};
 
 export { makeRenderlessComponent };

package/dist/es/motion/utils/use-motion-ref.mjs

@@ -6,7 +6,7 @@ import { isRefObject } from '../../utils/is-ref-object.mjs';
  * external ref and VisualElement.
  */
 function useMotionRef(visualState, visualElement, externalRef) {
-    return useCallback(function (instance) {
+    return useCallback((instance) => {
         var _a;
         instance && ((_a = visualState.mount) === null || _a === void 0 ? void 0 : _a.call(visualState, instance));
         if (visualElement) {

package/dist/es/motion/utils/use-visual-element.mjs

@@ -6,11 +6,11 @@ import { LazyContext } from '../../context/LazyContext.mjs';
 import { useReducedMotionConfig } from '../../utils/use-reduced-motion.mjs';
 
 function useVisualElement(Component, visualState, props, createVisualElement) {
-    var lazyContext = useContext(LazyContext);
-    var parent = useVisualElementContext();
-    var presenceContext = useContext(PresenceContext);
-    var shouldReduceMotion = useReducedMotionConfig();
-    var visualElementRef = useRef(undefined);
+    const lazyContext = useContext(LazyContext);
+    const parent = useVisualElementContext();
+    const presenceContext = useContext(PresenceContext);
+    const shouldReduceMotion = useReducedMotionConfig();
+    const visualElementRef = useRef(undefined);
     /**
      * If we haven't preloaded a renderer, check to see if we have one lazy-loaded
      */
@@ -18,23 +18,23 @@ function useVisualElement(Component, visualState, props, createVisualElement) {
         createVisualElement = lazyContext.renderer;
     if (!visualElementRef.current && createVisualElement) {
         visualElementRef.current = createVisualElement(Component, {
-            visualState: visualState,
-            parent: parent,
-            props: props,
+            visualState,
+            parent,
+            props,
             presenceId: presenceContext === null || presenceContext === void 0 ? void 0 : presenceContext.id,
             blockInitialAnimation: (presenceContext === null || presenceContext === void 0 ? void 0 : presenceContext.initial) === false,
-            shouldReduceMotion: shouldReduceMotion,
+            shouldReduceMotion,
         });
     }
-    var visualElement = visualElementRef.current;
-    useIsomorphicLayoutEffect(function () {
+    const visualElement = visualElementRef.current;
+    useIsomorphicLayoutEffect(() => {
         visualElement === null || visualElement === void 0 ? void 0 : visualElement.syncRender();
     });
-    useEffect(function () {
+    useEffect(() => {
         var _a;
         (_a = visualElement === null || visualElement === void 0 ? void 0 : visualElement.animationState) === null || _a === void 0 ? void 0 : _a.animateChanges();
     });
-    useIsomorphicLayoutEffect(function () { return function () { return visualElement === null || visualElement === void 0 ? void 0 : visualElement.notifyUnmount(); }; }, []);
+    useIsomorphicLayoutEffect(() => () => visualElement === null || visualElement === void 0 ? void 0 : visualElement.notifyUnmount(), []);
     return visualElement;
 }
 

package/dist/es/motion/utils/use-visual-state.mjs

@@ -7,38 +7,33 @@ import { useConstant } from '../../utils/use-constant.mjs';
 import { resolveMotionValue } from '../../value/utils/resolve-motion-value.mjs';
 import { MotionContext } from '../../context/MotionContext/index.mjs';
 
-function makeState(_a, props, context, presenceContext) {
-    var scrapeMotionValuesFromProps = _a.scrapeMotionValuesFromProps, createRenderState = _a.createRenderState, onMount = _a.onMount;
-    var state = {
+function makeState({ scrapeMotionValuesFromProps, createRenderState, onMount, }, props, context, presenceContext) {
+    const state = {
         latestValues: makeLatestValues(props, context, presenceContext, scrapeMotionValuesFromProps),
         renderState: createRenderState(),
     };
     if (onMount) {
-        state.mount = function (instance) { return onMount(props, instance, state); };
+        state.mount = (instance) => onMount(props, instance, state);
     }
     return state;
 }
-var makeUseVisualState = function (config) {
-    return function (props, isStatic) {
-        var context = useContext(MotionContext);
-        var presenceContext = useContext(PresenceContext);
-        return isStatic
-            ? makeState(config, props, context, presenceContext)
-            : useConstant(function () {
-                return makeState(config, props, context, presenceContext);
-            });
-    };
+const makeUseVisualState = (config) => (props, isStatic) => {
+    const context = useContext(MotionContext);
+    const presenceContext = useContext(PresenceContext);
+    return isStatic
+        ? makeState(config, props, context, presenceContext)
+        : useConstant(() => makeState(config, props, context, presenceContext));
 };
 function makeLatestValues(props, context, presenceContext, scrapeMotionValues) {
-    var values = {};
-    var blockInitialAnimation = (presenceContext === null || presenceContext === void 0 ? void 0 : presenceContext.initial) === false;
-    var motionValues = scrapeMotionValues(props);
-    for (var key in motionValues) {
+    const values = {};
+    const blockInitialAnimation = (presenceContext === null || presenceContext === void 0 ? void 0 : presenceContext.initial) === false;
+    const motionValues = scrapeMotionValues(props);
+    for (const key in motionValues) {
         values[key] = resolveMotionValue(motionValues[key]);
     }
-    var initial = props.initial, animate = props.animate;
-    var isControllingVariants = checkIfControllingVariants(props);
-    var isVariantNode = checkIfVariantNode(props);
+    let { initial, animate } = props;
+    const isControllingVariants = checkIfControllingVariants(props);
+    const isVariantNode = checkIfVariantNode(props);
     if (context &&
         isVariantNode &&
         !isControllingVariants &&
@@ -46,25 +41,25 @@ function makeLatestValues(props, context, presenceContext, scrapeMotionValues) {
         initial !== null && initial !== void 0 ? initial : (initial = context.initial);
         animate !== null && animate !== void 0 ? animate : (animate = context.animate);
     }
-    var initialAnimationIsBlocked = blockInitialAnimation || initial === false;
-    var variantToSet = initialAnimationIsBlocked ? animate : initial;
+    const initialAnimationIsBlocked = blockInitialAnimation || initial === false;
+    const variantToSet = initialAnimationIsBlocked ? animate : initial;
     if (variantToSet &&
         typeof variantToSet !== "boolean" &&
         !isAnimationControls(variantToSet)) {
-        var list = Array.isArray(variantToSet) ? variantToSet : [variantToSet];
-        list.forEach(function (definition) {
-            var resolved = resolveVariantFromProps(props, definition);
+        const list = Array.isArray(variantToSet) ? variantToSet : [variantToSet];
+        list.forEach((definition) => {
+            const resolved = resolveVariantFromProps(props, definition);
             if (!resolved)
                 return;
-            var transitionEnd = resolved.transitionEnd; resolved.transition; var target = __rest(resolved, ["transitionEnd", "transition"]);
-            for (var key in target) {
-                var valueTarget = target[key];
+            const { transitionEnd, transition } = resolved, target = __rest(resolved, ["transitionEnd", "transition"]);
+            for (const key in target) {
+                let valueTarget = target[key];
                 if (Array.isArray(valueTarget)) {
                     /**
                      * Take final keyframe if the initial animation is blocked because
                      * we want to initialise at the end of that blocked animation.
                      */
-                    var index = initialAnimationIsBlocked
+                    const index = initialAnimationIsBlocked
                         ? valueTarget.length - 1
                         : 0;
                     valueTarget = valueTarget[index];
@@ -73,7 +68,7 @@ function makeLatestValues(props, context, presenceContext, scrapeMotionValues) {
                     values[key] = valueTarget;
                 }
             }
-            for (var key in transitionEnd)
+            for (const key in transitionEnd)
                 values[key] = transitionEnd[key];
         });
     }

package/dist/es/motion/utils/valid-prop.mjs

@@ -4,7 +4,7 @@
  * @privateRemarks
  * This doesn't throw if a `MotionProp` name is missing - it should.
  */
-var validMotionProps = new Set([
+const validMotionProps = new Set([
     "initial",
     "animate",
     "exit",

package/dist/es/projection/animation/mix-values.mjs

@@ -1,14 +1,10 @@
 import { mix, progress, circOut, linear } from 'popmotion';
 import { percent, px } from 'style-value-types';
 
-var borders = ["TopLeft", "TopRight", "BottomLeft", "BottomRight"];
-var numBorders = borders.length;
-var asNumber = function (value) {
-    return typeof value === "string" ? parseFloat(value) : value;
-};
-var isPx = function (value) {
-    return typeof value === "number" || px.test(value);
-};
+const borders = ["TopLeft", "TopRight", "BottomLeft", "BottomRight"];
+const numBorders = borders.length;
+const asNumber = (value) => typeof value === "string" ? parseFloat(value) : value;
+const isPx = (value) => typeof value === "number" || px.test(value);
 function mixValues(target, follow, lead, progress, shouldCrossfadeOpacity, isOnlyMember) {
     var _a, _b, _c, _d;
     if (shouldCrossfadeOpacity) {
@@ -24,15 +20,15 @@ function mixValues(target, follow, lead, progress, shouldCrossfadeOpacity, isOnl
     /**
      * Mix border radius
      */
-    for (var i = 0; i < numBorders; i++) {
-        var borderLabel = "border".concat(borders[i], "Radius");
-        var followRadius = getRadius(follow, borderLabel);
-        var leadRadius = getRadius(lead, borderLabel);
+    for (let i = 0; i < numBorders; i++) {
+        const borderLabel = `border${borders[i]}Radius`;
+        let followRadius = getRadius(follow, borderLabel);
+        let leadRadius = getRadius(lead, borderLabel);
         if (followRadius === undefined && leadRadius === undefined)
             continue;
         followRadius || (followRadius = 0);
         leadRadius || (leadRadius = 0);
-        var canMix = followRadius === 0 ||
+        const canMix = followRadius === 0 ||
             leadRadius === 0 ||
             isPx(followRadius) === isPx(leadRadius);
         if (canMix) {
@@ -79,10 +75,10 @@ function getRadius(values, radiusName) {
 //         latestLeadValues.backgroundColor as string
 //     )(p)
 // }
-var easeCrossfadeIn = compress(0, 0.5, circOut);
-var easeCrossfadeOut = compress(0.5, 0.95, linear);
+const easeCrossfadeIn = compress(0, 0.5, circOut);
+const easeCrossfadeOut = compress(0.5, 0.95, linear);
 function compress(min, max, easing) {
-    return function (p) {
+    return (p) => {
         // Could replace ifs with clamp
         if (p < min)
             return 0;

package/dist/es/projection/geometry/conversion.mjs

@@ -3,15 +3,13 @@
  * it's easier to consider each axis individually. This function returns a bounding box
  * as a map of single-axis min/max values.
  */
-function convertBoundingBoxToBox(_a) {
-    var top = _a.top, left = _a.left, right = _a.right, bottom = _a.bottom;
+function convertBoundingBoxToBox({ top, left, right, bottom, }) {
     return {
         x: { min: left, max: right },
         y: { min: top, max: bottom },
     };
 }
-function convertBoxToBoundingBox(_a) {
-    var x = _a.x, y = _a.y;
+function convertBoxToBoundingBox({ x, y }) {
     return { top: y.min, right: x.max, bottom: y.max, left: x.min };
 }
 /**
@@ -22,8 +20,8 @@ function convertBoxToBoundingBox(_a) {
 function transformBoxPoints(point, transformPoint) {
     if (!transformPoint)
         return point;
-    var topLeft = transformPoint({ x: point.left, y: point.top });
-    var bottomRight = transformPoint({ x: point.right, y: point.bottom });
+    const topLeft = transformPoint({ x: point.left, y: point.top });
+    const bottomRight = transformPoint({ x: point.right, y: point.bottom });
     return {
         top: topLeft.y,
         left: topLeft.x,

package/dist/es/projection/geometry/delta-apply.mjs

@@ -1,4 +1,3 @@
-import { __read } from 'tslib';
 import { mix } from 'popmotion';
 import { hasTransform } from '../utils/has-transform.mjs';
 
@@ -6,8 +5,8 @@ import { hasTransform } from '../utils/has-transform.mjs';
  * Scales a point based on a factor and an originPoint
  */
 function scalePoint(point, scale, originPoint) {
-    var distanceFromOrigin = point - originPoint;
-    var scaled = scale * distanceFromOrigin;
+    const distanceFromOrigin = point - originPoint;
+    const scaled = scale * distanceFromOrigin;
     return originPoint + scaled;
 }
 /**
@@ -22,17 +21,14 @@ function applyPointDelta(point, translate, scale, originPoint, boxScale) {
 /**
  * Applies a translate/scale delta to an axis
  */
-function applyAxisDelta(axis, translate, scale, originPoint, boxScale) {
-    if (translate === void 0) { translate = 0; }
-    if (scale === void 0) { scale = 1; }
+function applyAxisDelta(axis, translate = 0, scale = 1, originPoint, boxScale) {
     axis.min = applyPointDelta(axis.min, translate, scale, originPoint, boxScale);
     axis.max = applyPointDelta(axis.max, translate, scale, originPoint, boxScale);
 }
 /**
  * Applies a translate/scale delta to a box
  */
-function applyBoxDelta(box, _a) {
-    var x = _a.x, y = _a.y;
+function applyBoxDelta(box, { x, y }) {
     applyAxisDelta(box.x, x.translate, x.scale, x.originPoint);
     applyAxisDelta(box.y, y.translate, y.scale, y.originPoint);
 }
@@ -42,17 +38,16 @@ function applyBoxDelta(box, _a) {
  *
  * This is the final nested loop within updateLayoutDelta for future refactoring
  */
-function applyTreeDeltas(box, treeScale, treePath, isSharedTransition) {
+function applyTreeDeltas(box, treeScale, treePath, isSharedTransition = false) {
     var _a, _b;
-    if (isSharedTransition === void 0) { isSharedTransition = false; }
-    var treeLength = treePath.length;
+    const treeLength = treePath.length;
     if (!treeLength)
         return;
     // Reset the treeScale
     treeScale.x = treeScale.y = 1;
-    var node;
-    var delta;
-    for (var i = 0; i < treeLength; i++) {
+    let node;
+    let delta;
+    for (let i = 0; i < treeLength; i++) {
         node = treePath[i];
         delta = node.projectionDelta;
         if (((_b = (_a = node.instance) === null || _a === void 0 ? void 0 : _a.style) === null || _b === void 0 ? void 0 : _b.display) === "contents")
@@ -84,18 +79,17 @@ function translateAxis(axis, distance) {
  * This function basically acts as a bridge between a flat motion value map
  * and applyAxisDelta
  */
-function transformAxis(axis, transforms, _a) {
-    var _b = __read(_a, 3), key = _b[0], scaleKey = _b[1], originKey = _b[2];
-    var axisOrigin = transforms[originKey] !== undefined ? transforms[originKey] : 0.5;
-    var originPoint = mix(axis.min, axis.max, axisOrigin);
+function transformAxis(axis, transforms, [key, scaleKey, originKey]) {
+    const axisOrigin = transforms[originKey] !== undefined ? transforms[originKey] : 0.5;
+    const originPoint = mix(axis.min, axis.max, axisOrigin);
     // Apply the axis delta to the final axis
     applyAxisDelta(axis, transforms[key], transforms[scaleKey], originPoint, transforms.scale);
 }
 /**
  * The names of the motion values we want to apply as translation, scale and origin.
  */
-var xKeys = ["x", "scaleX", "originX"];
-var yKeys = ["y", "scaleY", "originY"];
+const xKeys = ["x", "scaleX", "originX"];
+const yKeys = ["y", "scaleY", "originY"];
 /**
  * Apply a transform to a box from the latest resolved motion values.
  */

package/dist/es/projection/geometry/delta-calc.mjs

@@ -3,13 +3,10 @@ import { mix, distance } from 'popmotion';
 function calcLength(axis) {
     return axis.max - axis.min;
 }
-function isNear(value, target, maxDistance) {
-    if (target === void 0) { target = 0; }
-    if (maxDistance === void 0) { maxDistance = 0.01; }
+function isNear(value, target = 0, maxDistance = 0.01) {
     return distance(value, target) < maxDistance;
 }
-function calcAxisDelta(delta, source, target, origin) {
-    if (origin === void 0) { origin = 0.5; }
+function calcAxisDelta(delta, source, target, origin = 0.5) {
     delta.origin = origin;
     delta.originPoint = mix(source.min, source.max, delta.origin);
     delta.scale = calcLength(target) / calcLength(source);