@hyperframes/core 0.6.86 → 0.6.87

package/dist/parsers/gsapConstants.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"gsapConstants.d.ts","sourceRoot":"","sources":["../../src/parsers/gsapConstants.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,eAAO,MAAM,eAAe,UAsC3B,CAAC;AAEF,eAAO,MAAM,eAAe,UA+B3B,CAAC"}
+{"version":3,"file":"gsapConstants.d.ts","sourceRoot":"","sources":["../../src/parsers/gsapConstants.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,eAAO,MAAM,eAAe,UAsC3B,CAAC;AAEF,eAAO,MAAM,eAAe,UAgC3B,CAAC"}

package/dist/parsers/gsapConstants.js

@@ -74,5 +74,6 @@ export const SUPPORTED_EASES = [
     "spring-stiff",
     "spring-wobbly",
     "spring-heavy",
+    "steps(1)",
 ];
 //# sourceMappingURL=gsapConstants.js.map

package/dist/parsers/gsapConstants.js.map

@@ -1 +1 @@
-{"version":3,"file":"gsapConstants.js","sourceRoot":"","sources":["../../src/parsers/gsapConstants.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,MAAM,CAAC,MAAM,eAAe,GAAG;IAC7B,gBAAgB;IAChB,GAAG;IACH,GAAG;IACH,OAAO;IACP,QAAQ;IACR,QAAQ;IACR,UAAU;IACV,OAAO;IACP,OAAO;IACP,gBAAgB;IAChB,GAAG;IACH,WAAW;IACX,WAAW;IACX,WAAW;IACX,aAAa;IACb,iBAAiB;IACjB,aAAa;IACb,SAAS;IACT,YAAY;IACZ,WAAW;IACX,aAAa;IACb,OAAO;IACP,QAAQ;IACR,SAAS;IACT,OAAO;IACP,iBAAiB;IACjB,aAAa;IACb,YAAY;IACZ,cAAc;IACd,aAAa;IACb,UAAU;IACV,eAAe;IACf,oBAAoB;IACpB,QAAQ;IACR,UAAU;IACV,+CAA+C;IAC/C,WAAW;CACZ,CAAC;AAEF,MAAM,CAAC,MAAM,eAAe,GAAG;IAC7B,MAAM;IACN,WAAW;IACX,YAAY;IACZ,cAAc;IACd,WAAW;IACX,YAAY;IACZ,cAAc;IACd,WAAW;IACX,YAAY;IACZ,cAAc;IACd,WAAW;IACX,YAAY;IACZ,cAAc;IACd,SAAS;IACT,UAAU;IACV,YAAY;IACZ,YAAY;IACZ,aAAa;IACb,eAAe;IACf,WAAW;IACX,YAAY;IACZ,cAAc;IACd,SAAS;IACT,UAAU;IACV,YAAY;IACZ,eAAe;IACf,eAAe;IACf,cAAc;IACd,eAAe;IACf,cAAc;CACf,CAAC"}
+{"version":3,"file":"gsapConstants.js","sourceRoot":"","sources":["../../src/parsers/gsapConstants.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,MAAM,CAAC,MAAM,eAAe,GAAG;IAC7B,gBAAgB;IAChB,GAAG;IACH,GAAG;IACH,OAAO;IACP,QAAQ;IACR,QAAQ;IACR,UAAU;IACV,OAAO;IACP,OAAO;IACP,gBAAgB;IAChB,GAAG;IACH,WAAW;IACX,WAAW;IACX,WAAW;IACX,aAAa;IACb,iBAAiB;IACjB,aAAa;IACb,SAAS;IACT,YAAY;IACZ,WAAW;IACX,aAAa;IACb,OAAO;IACP,QAAQ;IACR,SAAS;IACT,OAAO;IACP,iBAAiB;IACjB,aAAa;IACb,YAAY;IACZ,cAAc;IACd,aAAa;IACb,UAAU;IACV,eAAe;IACf,oBAAoB;IACpB,QAAQ;IACR,UAAU;IACV,+CAA+C;IAC/C,WAAW;CACZ,CAAC;AAEF,MAAM,CAAC,MAAM,eAAe,GAAG;IAC7B,MAAM;IACN,WAAW;IACX,YAAY;IACZ,cAAc;IACd,WAAW;IACX,YAAY;IACZ,cAAc;IACd,WAAW;IACX,YAAY;IACZ,cAAc;IACd,WAAW;IACX,YAAY;IACZ,cAAc;IACd,SAAS;IACT,UAAU;IACV,YAAY;IACZ,YAAY;IACZ,aAAa;IACb,eAAe;IACf,WAAW;IACX,YAAY;IACZ,cAAc;IACd,SAAS;IACT,UAAU;IACV,YAAY;IACZ,eAAe;IACf,eAAe;IACf,cAAc;IACd,eAAe;IACf,cAAc;IACd,UAAU;CACX,CAAC"}

package/dist/parsers/gsapParser.d.ts

@@ -1,5 +1,5 @@
-import { type GsapAnimation, type ParsedGsap } from "./gsapSerialize";
-export type { GsapAnimation, GsapMethod, ParsedGsap, GsapKeyframesData, GsapPercentageKeyframe, GsapKeyframeFormat, } from "./gsapSerialize";
+import { type ArcPathConfig, type ArcPathSegment, type GsapAnimation, type ParsedGsap } from "./gsapSerialize";
+export type { ArcPathConfig, ArcPathSegment, GsapAnimation, GsapMethod, ParsedGsap, GsapKeyframesData, GsapPercentageKeyframe, GsapKeyframeFormat, } from "./gsapSerialize";
 export { serializeGsapAnimations, getAnimationsForElementId, validateCompositionGsap, keyframesToGsapAnimations, gsapAnimationsToKeyframes, SUPPORTED_PROPS, SUPPORTED_EASES, } from "./gsapSerialize";
 export { generateSpringEaseData, SPRING_PRESETS } from "./springEase";
 export type { SpringPreset } from "./springEase";
@@ -9,6 +9,15 @@ export declare function addAnimationToScript(script: string, animation: Omit<Gsa
     script: string;
     id: string;
 };
+export declare function addAnimationWithKeyframesToScript(script: string, targetSelector: string, position: number, duration: number, keyframes: Array<{
+    percentage: number;
+    properties: Record<string, number | string>;
+    ease?: string;
+    auto?: boolean;
+}>, ease?: string): {
+    script: string;
+    id: string;
+};
 export declare function removeAnimationFromScript(script: string, animationId: string): string;
 /**
  * Insert a keyframe at the given percentage in an existing percentage-keyframes
@@ -45,6 +54,9 @@ export declare function materializeKeyframesInScript(script: string, animationId
     properties: Record<string, number | string>;
     ease?: string;
 }>, easeEach?: string, resolvedSelector?: string): string;
+export declare function setArcPathInScript(script: string, animationId: string, config: ArcPathConfig): string;
+export declare function updateArcSegmentInScript(script: string, animationId: string, segmentIndex: number, update: Partial<ArcPathSegment>): string;
+export declare function removeArcPathFromScript(script: string, animationId: string): string;
 /**
  * Replace a dynamic loop that generates multiple tween calls with individual
  * static `tl.to()` calls — one per element. Finds the loop containing the

package/dist/parsers/gsapParser.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"gsapParser.d.ts","sourceRoot":"","sources":["../../src/parsers/gsapParser.ts"],"names":[],"mappings":"AAYA,OAAO,EACL,KAAK,aAAa,EAIlB,KAAK,UAAU,EAChB,MAAM,iBAAiB,CAAC;AAEzB,YAAY,EACV,aAAa,EACb,UAAU,EACV,UAAU,EACV,iBAAiB,EACjB,sBAAsB,EACtB,kBAAkB,GACnB,MAAM,iBAAiB,CAAC;AACzB,OAAO,EACL,uBAAuB,EACvB,yBAAyB,EACzB,uBAAuB,EACvB,yBAAyB,EACzB,yBAAyB,EACzB,eAAe,EACf,eAAe,GAChB,MAAM,iBAAiB,CAAC;AACzB,OAAO,EAAE,sBAAsB,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AACtE,YAAY,EAAE,YAAY,EAAE,MAAM,cAAc,CAAC;AA+wBjD,wBAAgB,eAAe,CAAC,MAAM,EAAE,MAAM,GAAG,UAAU,CA+B1D;AAuID,wBAAgB,uBAAuB,CACrC,MAAM,EAAE,MAAM,EACd,WAAW,EAAE,MAAM,EACnB,OAAO,EAAE,OAAO,CAAC,aAAa,CAAC,GAC9B,MAAM,CAYR;AAED,wBAAgB,oBAAoB,CAClC,MAAM,EAAE,MAAM,EACd,SAAS,EAAE,IAAI,CAAC,aAAa,EAAE,IAAI,CAAC,GACnC;IAAE,MAAM,EAAE,MAAM,CAAC;IAAC,EAAE,EAAE,MAAM,CAAA;CAAE,CA4BhC;AAoCD,wBAAgB,yBAAyB,CAAC,MAAM,EAAE,MAAM,EAAE,WAAW,EAAE,MAAM,GAAG,MAAM,CA0BrF;AAqED;;;GAGG;AACH,wBAAgB,mBAAmB,CACjC,MAAM,EAAE,MAAM,EACd,WAAW,EAAE,MAAM,EACnB,UAAU,EAAE,MAAM,EAClB,UAAU,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,CAAC,EAC3C,IAAI,CAAC,EAAE,MAAM,EACb,gBAAgB,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,CAAC,GACjD,MAAM,CA0DR;AAED;;;;GAIG;AACH,wBAAgB,wBAAwB,CACtC,MAAM,EAAE,MAAM,EACd,WAAW,EAAE,MAAM,EACnB,UAAU,EAAE,MAAM,GACjB,MAAM,CAwBR;AAED;;GAEG;AACH,wBAAgB,sBAAsB,CACpC,MAAM,EAAE,MAAM,EACd,WAAW,EAAE,MAAM,EACnB,UAAU,EAAE,MAAM,EAClB,UAAU,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,CAAC,EAC3C,IAAI,CAAC,EAAE,MAAM,GACZ,MAAM,CAcR;AAuED;;;;GAIG;AACH,wBAAgB,0BAA0B,CACxC,MAAM,EAAE,MAAM,EACd,WAAW,EAAE,MAAM,EACnB,kBAAkB,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,CAAC,GACnD,MAAM,CAyBR;AAED;;;GAGG;AACH,wBAAgB,4BAA4B,CAAC,MAAM,EAAE,MAAM,EAAE,WAAW,EAAE,MAAM,GAAG,MAAM,CAoBxF;AAED;;;GAGG;AACH,wBAAgB,4BAA4B,CAC1C,MAAM,EAAE,MAAM,EACd,WAAW,EAAE,MAAM,EACnB,SAAS,EAAE,KAAK,CAAC;IACf,UAAU,EAAE,MAAM,CAAC;IACnB,UAAU,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,CAAC,CAAC;IAC5C,IAAI,CAAC,EAAE,MAAM,CAAC;CACf,CAAC,EACF,QAAQ,CAAC,EAAE,MAAM,EACjB,gBAAgB,CAAC,EAAE,MAAM,GACxB,MAAM,CAsCR;AAED;;;;GAIG;AACH,wBAAgB,uBAAuB,CACrC,MAAM,EAAE,MAAM,EACd,WAAW,EAAE,MAAM,EACnB,QAAQ,EAAE,KAAK,CAAC;IACd,QAAQ,EAAE,MAAM,CAAC;IACjB,SAAS,EAAE,KAAK,CAAC;QAAE,UAAU,EAAE,MAAM,CAAC;QAAC,UAAU,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,CAAC,CAAA;KAAE,CAAC,CAAC;IACtF,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB,CAAC,GACD,MAAM,CAsFR"}
+{"version":3,"file":"gsapParser.d.ts","sourceRoot":"","sources":["../../src/parsers/gsapParser.ts"],"names":[],"mappings":"AAYA,OAAO,EACL,KAAK,aAAa,EAClB,KAAK,cAAc,EACnB,KAAK,aAAa,EAIlB,KAAK,UAAU,EAChB,MAAM,iBAAiB,CAAC;AAEzB,YAAY,EACV,aAAa,EACb,cAAc,EACd,aAAa,EACb,UAAU,EACV,UAAU,EACV,iBAAiB,EACjB,sBAAsB,EACtB,kBAAkB,GACnB,MAAM,iBAAiB,CAAC;AACzB,OAAO,EACL,uBAAuB,EACvB,yBAAyB,EACzB,uBAAuB,EACvB,yBAAyB,EACzB,yBAAyB,EACzB,eAAe,EACf,eAAe,GAChB,MAAM,iBAAiB,CAAC;AACzB,OAAO,EAAE,sBAAsB,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AACtE,YAAY,EAAE,YAAY,EAAE,MAAM,cAAc,CAAC;AA63BjD,wBAAgB,eAAe,CAAC,MAAM,EAAE,MAAM,GAAG,UAAU,CA+B1D;AA+ID,wBAAgB,uBAAuB,CACrC,MAAM,EAAE,MAAM,EACd,WAAW,EAAE,MAAM,EACnB,OAAO,EAAE,OAAO,CAAC,aAAa,CAAC,GAC9B,MAAM,CAYR;AAED,wBAAgB,oBAAoB,CAClC,MAAM,EAAE,MAAM,EACd,SAAS,EAAE,IAAI,CAAC,aAAa,EAAE,IAAI,CAAC,GACnC;IAAE,MAAM,EAAE,MAAM,CAAC;IAAC,EAAE,EAAE,MAAM,CAAA;CAAE,CA4BhC;AAED,wBAAgB,iCAAiC,CAC/C,MAAM,EAAE,MAAM,EACd,cAAc,EAAE,MAAM,EACtB,QAAQ,EAAE,MAAM,EAChB,QAAQ,EAAE,MAAM,EAChB,SAAS,EAAE,KAAK,CAAC;IACf,UAAU,EAAE,MAAM,CAAC;IACnB,UAAU,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,CAAC,CAAC;IAC5C,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,OAAO,CAAC;CAChB,CAAC,EACF,IAAI,CAAC,EAAE,MAAM,GACZ;IAAE,MAAM,EAAE,MAAM,CAAC;IAAC,EAAE,EAAE,MAAM,CAAA;CAAE,CA2ChC;AAoCD,wBAAgB,yBAAyB,CAAC,MAAM,EAAE,MAAM,EAAE,WAAW,EAAE,MAAM,GAAG,MAAM,CA0BrF;AAqED;;;GAGG;AACH,wBAAgB,mBAAmB,CACjC,MAAM,EAAE,MAAM,EACd,WAAW,EAAE,MAAM,EACnB,UAAU,EAAE,MAAM,EAClB,UAAU,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,CAAC,EAC3C,IAAI,CAAC,EAAE,MAAM,EACb,gBAAgB,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,CAAC,GACjD,MAAM,CA2FR;AAED;;;;GAIG;AACH,wBAAgB,wBAAwB,CACtC,MAAM,EAAE,MAAM,EACd,WAAW,EAAE,MAAM,EACnB,UAAU,EAAE,MAAM,GACjB,MAAM,CAwBR;AAED;;GAEG;AACH,wBAAgB,sBAAsB,CACpC,MAAM,EAAE,MAAM,EACd,WAAW,EAAE,MAAM,EACnB,UAAU,EAAE,MAAM,EAClB,UAAU,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,CAAC,EAC3C,IAAI,CAAC,EAAE,MAAM,GACZ,MAAM,CAcR;AAuED;;;;GAIG;AACH,wBAAgB,0BAA0B,CACxC,MAAM,EAAE,MAAM,EACd,WAAW,EAAE,MAAM,EACnB,kBAAkB,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,CAAC,GACnD,MAAM,CAyBR;AAED;;;GAGG;AACH,wBAAgB,4BAA4B,CAAC,MAAM,EAAE,MAAM,EAAE,WAAW,EAAE,MAAM,GAAG,MAAM,CAoBxF;AAED;;;GAGG;AACH,wBAAgB,4BAA4B,CAC1C,MAAM,EAAE,MAAM,EACd,WAAW,EAAE,MAAM,EACnB,SAAS,EAAE,KAAK,CAAC;IACf,UAAU,EAAE,MAAM,CAAC;IACnB,UAAU,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,CAAC,CAAC;IAC5C,IAAI,CAAC,EAAE,MAAM,CAAC;CACf,CAAC,EACF,QAAQ,CAAC,EAAE,MAAM,EACjB,gBAAgB,CAAC,EAAE,MAAM,GACxB,MAAM,CAsCR;AAsDD,wBAAgB,kBAAkB,CAChC,MAAM,EAAE,MAAM,EACd,WAAW,EAAE,MAAM,EACnB,MAAM,EAAE,aAAa,GACpB,MAAM,CAsGR;AAED,wBAAgB,wBAAwB,CACtC,MAAM,EAAE,MAAM,EACd,WAAW,EAAE,MAAM,EACnB,YAAY,EAAE,MAAM,EACpB,MAAM,EAAE,OAAO,CAAC,cAAc,CAAC,GAC9B,MAAM,CAsCR;AAED,wBAAgB,uBAAuB,CAAC,MAAM,EAAE,MAAM,EAAE,WAAW,EAAE,MAAM,GAAG,MAAM,CAMnF;AAED;;;;GAIG;AACH,wBAAgB,uBAAuB,CACrC,MAAM,EAAE,MAAM,EACd,WAAW,EAAE,MAAM,EACnB,QAAQ,EAAE,KAAK,CAAC;IACd,QAAQ,EAAE,MAAM,CAAC;IACjB,SAAS,EAAE,KAAK,CAAC;QAAE,UAAU,EAAE,MAAM,CAAC;QAAC,UAAU,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,CAAC,CAAA;KAAE,CAAC,CAAC;IACtF,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB,CAAC,GACD,MAAM,CAsFR"}

package/dist/parsers/gsapParser.js

@@ -587,6 +587,81 @@ function parseSimpleArrayKeyframes(node, scope) {
         ...(easeEach ? { easeEach } : {}),
     };
 }
+function parseMotionPathNode(node, scope) {
+    if (!node)
+        return undefined;
+    let pathNode;
+    let autoRotate = false;
+    let curviness = 1;
+    let isCubic = false;
+    if (node.type === "ObjectExpression") {
+        for (const prop of node.properties ?? []) {
+            if (!isObjectProperty(prop))
+                continue;
+            const key = propKeyName(prop);
+            if (key === "path")
+                pathNode = prop.value;
+            else if (key === "autoRotate") {
+                const val = resolveNode(prop.value, scope);
+                autoRotate = typeof val === "number" ? val : val === true;
+            }
+            else if (key === "curviness") {
+                const val = resolveNode(prop.value, scope);
+                if (typeof val === "number")
+                    curviness = val;
+            }
+            else if (key === "type") {
+                const val = resolveNode(prop.value, scope);
+                if (val === "cubic")
+                    isCubic = true;
+            }
+        }
+    }
+    else if (node.type === "ArrayExpression") {
+        pathNode = node;
+    }
+    if (!pathNode || pathNode.type !== "ArrayExpression")
+        return undefined;
+    const elements = pathNode.elements ?? [];
+    const coords = [];
+    for (const elem of elements) {
+        if (!elem || elem.type !== "ObjectExpression")
+            continue;
+        const rec = objectExpressionToRecord(elem, scope);
+        const x = typeof rec.x === "number" ? rec.x : undefined;
+        const y = typeof rec.y === "number" ? rec.y : undefined;
+        if (x !== undefined && y !== undefined)
+            coords.push({ x, y });
+    }
+    if (coords.length < 2)
+        return undefined;
+    let waypoints;
+    const segments = [];
+    if (isCubic && coords.length >= 4) {
+        // type: "cubic" — coords are [anchor, cp1, cp2, anchor, cp1, cp2, anchor, ...]
+        // Every 3rd coord starting from 0 is an anchor, the two between are control points.
+        waypoints = [];
+        waypoints.push(coords[0]);
+        for (let i = 1; i + 2 < coords.length; i += 3) {
+            const cp1 = coords[i];
+            const cp2 = coords[i + 1];
+            const anchor = coords[i + 2];
+            waypoints.push(anchor);
+            segments.push({ curviness, cp1, cp2 });
+        }
+    }
+    else {
+        // Waypoint array with global curviness
+        waypoints = coords;
+        for (let i = 0; i < waypoints.length - 1; i++) {
+            segments.push({ curviness });
+        }
+    }
+    return {
+        arcPath: { enabled: true, autoRotate, segments },
+        waypoints,
+    };
+}
 // fallow-ignore-next-line complexity
 function tweenCallToAnimation(call, scope) {
     const vars = objectExpressionToRecord(call.varsArg, scope);
@@ -594,6 +669,7 @@ function tweenCallToAnimation(call, scope) {
     const extras = {};
     let keyframesData;
     let hasUnresolvedKeyframes = false;
+    let motionPathResult;
     for (const [key, val] of Object.entries(vars)) {
         if (BUILTIN_VAR_KEYS.has(key))
             continue;
@@ -606,6 +682,11 @@ function tweenCallToAnimation(call, scope) {
                 hasUnresolvedKeyframes = true;
             continue;
         }
+        if (key === "motionPath") {
+            const mpNode = findPropertyNode(call.varsArg, "motionPath");
+            motionPathResult = parseMotionPathNode(mpNode, scope);
+            continue;
+        }
         if (key === "easeEach") {
             // easeEach is only meaningful alongside keyframes — handled below.
             continue;
@@ -630,6 +711,30 @@ function tweenCallToAnimation(call, scope) {
     if (keyframesData && typeof vars.easeEach === "string") {
         keyframesData.easeEach = vars.easeEach;
     }
+    // When motionPath is present, reconstruct x/y as keyframe waypoints.
+    if (motionPathResult) {
+        const { waypoints } = motionPathResult;
+        if (!keyframesData) {
+            // No explicit keyframes — create synthetic percentage keyframes from waypoints.
+            const kf = waypoints.map((wp, i) => ({
+                percentage: waypoints.length > 1 ? Math.round((i / (waypoints.length - 1)) * 100) : 0,
+                properties: { x: wp.x, y: wp.y },
+            }));
+            keyframesData = { format: "percentage", keyframes: kf };
+        }
+        else {
+            // Merge waypoint positions into existing keyframes at matching percentages.
+            // If keyframe count matches waypoint count, assign positionally.
+            const kfs = keyframesData.keyframes;
+            if (kfs.length === waypoints.length) {
+                for (let i = 0; i < kfs.length; i++) {
+                    kfs[i].properties.x = waypoints[i].x;
+                    kfs[i].properties.y = waypoints[i].y;
+                }
+            }
+        }
+        // arcPath is attached below on the animation result.
+    }
     let fromProperties;
     if (call.method === "fromTo" && call.fromArg) {
         fromProperties = {};
@@ -657,6 +762,8 @@ function tweenCallToAnimation(call, scope) {
         anim.extras = extras;
     if (keyframesData)
         anim.keyframes = keyframesData;
+    if (motionPathResult)
+        anim.arcPath = motionPathResult.arcPath;
     if (hasUnresolvedKeyframes)
         anim.hasUnresolvedKeyframes = true;
     if (call.selector === "__unresolved__")
@@ -809,8 +916,16 @@ function applyUpdatesToCall(call, updates) {
     }
     if (updates.duration !== undefined)
         setVarsKey(call.varsArg, "duration", updates.duration);
-    if (updates.ease !== undefined)
-        setVarsKey(call.varsArg, "ease", updates.ease);
+    if (updates.ease !== undefined) {
+        const kfNode = findKeyframesObjectNode(call.varsArg);
+        if (kfNode) {
+            setVarsKey(kfNode, "easeEach", updates.ease);
+            removeVarsKey(call.varsArg, "ease");
+        }
+        else {
+            setVarsKey(call.varsArg, "ease", updates.ease);
+        }
+    }
     if (updates.position !== undefined) {
         const posIdx = call.method === "fromTo" ? 3 : 2;
         call.node.arguments[posIdx] = parseExpr(valueToCode(updates.position));
@@ -893,6 +1008,49 @@ export function addAnimationToScript(script, animation) {
     }
     return { script: recast.print(parsed.ast).code, id };
 }
+export function addAnimationWithKeyframesToScript(script, targetSelector, position, duration, keyframes, ease) {
+    let parsed;
+    try {
+        parsed = parseGsapAst(script);
+    }
+    catch (e) {
+        console.warn("[gsap-parser] addAnimationWithKeyframesToScript parse failed:", e);
+        return { script, id: "" };
+    }
+    if (parsed.located.length === 0 && parsed.detection.timelineVar === null) {
+        return { script, id: "" };
+    }
+    const selector = JSON.stringify(targetSelector);
+    const kfEntries = keyframes.map((kf) => {
+        const propEntries = Object.entries(kf.properties).map(([k, v]) => `${safeKey(k)}: ${valueToCode(v)}`);
+        if (kf.ease)
+            propEntries.push(`ease: ${JSON.stringify(kf.ease)}`);
+        if (kf.auto)
+            propEntries.push(`_auto: 1`);
+        return `${JSON.stringify(`${kf.percentage}%`)}: { ${propEntries.join(", ")} }`;
+    });
+    const kfCode = `{ ${kfEntries.join(", ")} }`;
+    const varEntries = [`keyframes: ${kfCode}`, `duration: ${valueToCode(duration)}`];
+    if (ease)
+        varEntries.push(`ease: ${JSON.stringify(ease)}`);
+    const posCode = valueToCode(position);
+    const stmtCode = `${parsed.timelineVar}.to(${selector}, { ${varEntries.join(", ")} }, ${posCode});`;
+    const newStatement = parseScript(stmtCode).program.body[0];
+    const lastCall = parsed.located[parsed.located.length - 1]?.call;
+    const anchorPath = lastCall
+        ? findStatementPath(lastCall.path)
+        : findTimelineDeclarationPath(parsed.ast, parsed.timelineVar);
+    if (anchorPath) {
+        anchorPath.insertAfter(newStatement);
+    }
+    else {
+        parsed.ast.program.body.push(newStatement);
+    }
+    const result = recast.print(parsed.ast).code;
+    const reParsed = parseGsapAst(result);
+    const newId = reParsed.located[reParsed.located.length - 1]?.id ?? "";
+    return { script: result, id: newId };
+}
 /** Find the statement path of `const <timelineVar> = gsap.timeline(...)`. */
 function findTimelineDeclarationPath(ast, timelineVar) {
     let found = null;
@@ -1023,12 +1181,27 @@ function collapseKeyframesToFlat(varsArg, record) {
  * object. If the percentage already exists, its value is replaced.
  */
 export function addKeyframeToScript(script, animationId, percentage, properties, ease, backfillDefaults) {
-    const loc = locateAnimation(script, animationId);
+    let loc = locateAnimation(script, animationId);
+    if (!loc) {
+        const convertedId = animationId.replace(/-from-|-fromTo-/, "-to-");
+        loc = locateAnimation(script, convertedId);
+    }
     if (!loc)
         return script;
-    const kfNode = findKeyframesObjectNode(loc.target.call.varsArg);
-    if (!kfNode)
-        return script;
+    let kfNode = findKeyframesObjectNode(loc.target.call.varsArg);
+    if (!kfNode) {
+        script = convertToKeyframesInScript(script, animationId);
+        loc = locateAnimation(script, animationId);
+        if (!loc) {
+            const convertedId = animationId.replace(/-from-|-fromTo-/, "-to-");
+            loc = locateAnimation(script, convertedId);
+        }
+        if (!loc)
+            return script;
+        kfNode = findKeyframesObjectNode(loc.target.call.varsArg);
+        if (!kfNode)
+            return script;
+    }
     const pctKey = `${percentage}%`;
     const newValueNode = buildKeyframeValueNode(properties, ease);
     // Replace if this percentage already exists
@@ -1053,6 +1226,21 @@ export function addKeyframeToScript(script, animationId, percentage, properties,
         }
         kfNode.properties.splice(insertIdx, 0, newProp);
     }
+    // Auto-update 100%: if the 100% keyframe still has `_auto: 1` (never
+    // explicitly edited by the user), update it to match the new keyframe's
+    // values so the element holds its final position instead of snapping back.
+    // Once the user drags at 100%, `_auto` is gone and we stop touching it.
+    if (percentage < 100 && percentage !== 0) {
+        const pctProps = filterPercentageProps(kfNode);
+        const hundredProp = pctProps.find((p) => percentageFromKey(propKeyName(p) ?? "") === 100);
+        if (hundredProp?.value?.type === "ObjectExpression") {
+            const hasAuto = hundredProp.value.properties.some((p) => isObjectProperty(p) && propKeyName(p) === "_auto");
+            if (hasAuto) {
+                const updatedProps = { ...properties, _auto: 1 };
+                hundredProp.value = buildKeyframeValueNode(updatedProps, undefined);
+            }
+        }
+    }
     // Backfill: when the new keyframe introduces properties absent from other
     // keyframes, add default values so GSAP can interpolate them.
     if (backfillDefaults) {
@@ -1271,6 +1459,184 @@ export function materializeKeyframesInScript(script, animationId, keyframes, eas
     removeVarsKey(varsArg, "easeEach");
     return recast.print(loc.parsed.ast).code;
 }
+// ── Arc Path (motionPath) AST Mutations ──────────────────────────────────
+function buildMotionPathObjectCode(config) {
+    const { waypoints, segments, autoRotate } = config;
+    const hasExplicitControlPoints = segments.some((s) => s.cp1 && s.cp2);
+    let pathEntries;
+    if (hasExplicitControlPoints && waypoints.length >= 2) {
+        // type: "cubic" — interleave control points: [anchor, cp1, cp2, anchor, ...]
+        pathEntries = [`{x: ${waypoints[0].x}, y: ${waypoints[0].y}}`];
+        for (let i = 0; i < segments.length; i++) {
+            const seg = segments[i];
+            const nextWp = waypoints[i + 1];
+            if (seg.cp1 && seg.cp2) {
+                pathEntries.push(`{x: ${seg.cp1.x}, y: ${seg.cp1.y}}`);
+                pathEntries.push(`{x: ${seg.cp2.x}, y: ${seg.cp2.y}}`);
+            }
+            else {
+                // Auto-generate simple midpoint control points from curviness
+                const wp = waypoints[i];
+                const dx = nextWp.x - wp.x;
+                const dy = nextWp.y - wp.y;
+                const c = seg.curviness ?? 1;
+                pathEntries.push(`{x: ${wp.x + dx * 0.33}, y: ${wp.y + dy * 0.33 - c * Math.abs(dx) * 0.25}}`);
+                pathEntries.push(`{x: ${wp.x + dx * 0.66}, y: ${wp.y + dy * 0.66 - c * Math.abs(dx) * 0.25}}`);
+            }
+            pathEntries.push(`{x: ${nextWp.x}, y: ${nextWp.y}}`);
+        }
+        const pathStr = pathEntries.join(", ");
+        const parts = [`path: [${pathStr}]`, `type: "cubic"`];
+        if (autoRotate === true)
+            parts.push("autoRotate: true");
+        else if (typeof autoRotate === "number")
+            parts.push(`autoRotate: ${autoRotate}`);
+        return `{ ${parts.join(", ")} }`;
+    }
+    // Simple waypoint array with curviness
+    pathEntries = waypoints.map((wp) => `{x: ${wp.x}, y: ${wp.y}}`);
+    const curviness = segments[0]?.curviness ?? 1;
+    const parts = [`path: [${pathEntries.join(", ")}]`];
+    if (curviness !== 1)
+        parts.push(`curviness: ${curviness}`);
+    if (autoRotate === true)
+        parts.push("autoRotate: true");
+    else if (typeof autoRotate === "number")
+        parts.push(`autoRotate: ${autoRotate}`);
+    return `{ ${parts.join(", ")} }`;
+}
+export function setArcPathInScript(script, animationId, config) {
+    const loc = locateAnimation(script, animationId);
+    if (!loc)
+        return script;
+    const varsArg = loc.target.call.varsArg;
+    const anim = loc.target.animation;
+    if (!config.enabled) {
+        // Disable arc: restore x/y from motionPath's last waypoint, then remove motionPath
+        const motionPathProp = varsArg.properties.find((p) => isObjectProperty(p) && propKeyName(p) === "motionPath");
+        if (motionPathProp) {
+            const mpVal = motionPathProp.value;
+            let pathArr;
+            if (mpVal?.type === "ObjectExpression") {
+                const pathProp = mpVal.properties.find((p) => isObjectProperty(p) && propKeyName(p) === "path");
+                if (pathProp?.value?.type === "ArrayExpression")
+                    pathArr = pathProp.value.elements;
+            }
+            if (pathArr && pathArr.length > 0) {
+                const last = pathArr[pathArr.length - 1];
+                if (last?.type === "ObjectExpression") {
+                    for (const p of last.properties) {
+                        const k = propKeyName(p);
+                        if (k === "x" || k === "y") {
+                            const v = p.value?.value;
+                            if (typeof v === "number")
+                                setVarsKey(varsArg, k, v);
+                        }
+                    }
+                }
+            }
+        }
+        removeVarsKey(varsArg, "motionPath");
+        return recast.print(loc.parsed.ast).code;
+    }
+    // Extract x/y waypoints from keyframes or flat tween properties
+    const kfs = anim.keyframes?.keyframes ?? [];
+    const waypoints = [];
+    for (const kf of kfs) {
+        const x = typeof kf.properties.x === "number" ? kf.properties.x : undefined;
+        const y = typeof kf.properties.y === "number" ? kf.properties.y : undefined;
+        if (x !== undefined && y !== undefined)
+            waypoints.push({ x, y });
+    }
+    // For flat tweens with x/y in properties, synthesize start → end waypoints
+    if (waypoints.length < 2) {
+        const px = anim.properties.x;
+        const py = anim.properties.y;
+        if (typeof px === "number" || typeof py === "number") {
+            waypoints.length = 0;
+            waypoints.push({ x: 0, y: 0 });
+            waypoints.push({ x: typeof px === "number" ? px : 0, y: typeof py === "number" ? py : 0 });
+        }
+    }
+    if (waypoints.length < 2)
+        return script;
+    // Build segments — use provided segments or create defaults
+    const segments = config.segments.length === waypoints.length - 1
+        ? config.segments
+        : Array.from({ length: waypoints.length - 1 }, () => ({ curviness: 1 }));
+    const motionPathCode = buildMotionPathObjectCode({
+        waypoints,
+        segments,
+        autoRotate: config.autoRotate,
+    });
+    // Set motionPath on the vars
+    const motionPathNode = parseExpr(motionPathCode);
+    const existingProp = varsArg.properties.find((p) => isObjectProperty(p) && propKeyName(p) === "motionPath");
+    if (existingProp) {
+        existingProp.value = motionPathNode;
+    }
+    else {
+        const prop = parseExpr(`{ motionPath: ${motionPathCode} }`).properties[0];
+        varsArg.properties.push(prop);
+    }
+    // Strip x/y from keyframes (they're now in motionPath)
+    const kfNode = findKeyframesObjectNode(varsArg);
+    if (kfNode) {
+        for (const pctProp of filterPercentageProps(kfNode)) {
+            if (pctProp.value?.type === "ObjectExpression") {
+                pctProp.value.properties = pctProp.value.properties.filter((p) => {
+                    const k = propKeyName(p);
+                    return k !== "x" && k !== "y";
+                });
+            }
+        }
+    }
+    // Strip flat x/y from vars (they're now in motionPath)
+    removeVarsKey(varsArg, "x");
+    removeVarsKey(varsArg, "y");
+    return recast.print(loc.parsed.ast).code;
+}
+export function updateArcSegmentInScript(script, animationId, segmentIndex, update) {
+    const loc = locateAnimation(script, animationId);
+    if (!loc)
+        return script;
+    const anim = loc.target.animation;
+    if (!anim.arcPath?.enabled)
+        return script;
+    const segments = [...anim.arcPath.segments];
+    if (segmentIndex < 0 || segmentIndex >= segments.length)
+        return script;
+    segments[segmentIndex] = { ...segments[segmentIndex], ...update };
+    // Rebuild the full motionPath with updated segments
+    const kfs = anim.keyframes?.keyframes ?? [];
+    const waypoints = [];
+    for (const kf of kfs) {
+        const x = typeof kf.properties.x === "number" ? kf.properties.x : undefined;
+        const y = typeof kf.properties.y === "number" ? kf.properties.y : undefined;
+        if (x !== undefined && y !== undefined)
+            waypoints.push({ x, y });
+    }
+    if (waypoints.length < 2)
+        return script;
+    const motionPathCode = buildMotionPathObjectCode({
+        waypoints,
+        segments,
+        autoRotate: anim.arcPath.autoRotate,
+    });
+    const varsArg = loc.target.call.varsArg;
+    const existingProp = varsArg.properties.find((p) => isObjectProperty(p) && propKeyName(p) === "motionPath");
+    if (existingProp) {
+        existingProp.value = parseExpr(motionPathCode);
+    }
+    return recast.print(loc.parsed.ast).code;
+}
+export function removeArcPathFromScript(script, animationId) {
+    return setArcPathInScript(script, animationId, {
+        enabled: false,
+        autoRotate: false,
+        segments: [],
+    });
+}
 /**
  * Replace a dynamic loop that generates multiple tween calls with individual
  * static `tl.to()` calls — one per element. Finds the loop containing the