@hyperframes/parsers 0.7.15 → 0.7.16

package/dist/gsapParser.js

@@ -572,6 +572,35 @@ function objectExpressionToRecord(node, scope) {
 function isGsapTimelineCall(node) {
   return node?.type === "CallExpression" && node.callee?.type === "MemberExpression" && node.callee.object?.name === "gsap" && node.callee.property?.name === "timeline";
 }
+function staticMemberKey(node) {
+  if (!node || node.type !== "MemberExpression") return null;
+  if (node.computed) {
+    const p = node.property;
+    if (p?.type === "StringLiteral") return p.value;
+    if (p?.type === "Literal" && typeof p.value === "string") return p.value;
+    return null;
+  }
+  return node.property?.type === "Identifier" ? node.property.name : null;
+}
+function isStaticMemberRef(node) {
+  return node?.type === "MemberExpression" && staticMemberKey(node) !== null;
+}
+function sameMemberAccess(a, b) {
+  if (a?.type !== "MemberExpression" || b?.type !== "MemberExpression") return false;
+  if (staticMemberKey(a) !== staticMemberKey(b) || staticMemberKey(a) === null) return false;
+  const ao = a.object;
+  const bo = b.object;
+  if (ao?.type === "Identifier" && bo?.type === "Identifier") return ao.name === bo.name;
+  if (ao?.type === "MemberExpression" && bo?.type === "MemberExpression")
+    return sameMemberAccess(ao, bo);
+  return false;
+}
+function timelineRootSource(ref) {
+  return ref.kind === "identifier" ? ref.name : recast.print(ref.node).code;
+}
+function escapeRegExp(s) {
+  return s.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
+}
 function extractTimelineDefaults(callNode, scope) {
   const arg = callNode.arguments?.[0];
   if (!arg || arg.type !== "ObjectExpression") return void 0;
@@ -587,6 +616,7 @@ function extractTimelineDefaults(callNode, scope) {
 }
 function findTimelineVar(ast, scope) {
   let timelineVar = null;
+  let ref = null;
   let timelineCount = 0;
   let defaults;
   const emptyScope = scope ?? /* @__PURE__ */ new Map();
@@ -594,8 +624,9 @@ function findTimelineVar(ast, scope) {
     visitVariableDeclarator(path) {
       if (isGsapTimelineCall(path.node.init)) {
         timelineCount += 1;
-        if (!timelineVar) {
-          timelineVar = path.node.id?.name ?? null;
+        if (!ref && path.node.id?.type === "Identifier") {
+          timelineVar = path.node.id.name;
+          ref = { kind: "identifier", name: path.node.id.name };
           defaults = extractTimelineDefaults(path.node.init, emptyScope);
         }
       }
@@ -604,25 +635,32 @@ function findTimelineVar(ast, scope) {
     visitAssignmentExpression(path) {
       if (isGsapTimelineCall(path.node.right)) {
         timelineCount += 1;
-        if (!timelineVar) {
+        if (!ref) {
           const left = path.node.left;
-          if (left?.type === "Identifier") timelineVar = left.name;
-          defaults = extractTimelineDefaults(path.node.right, emptyScope);
+          if (left?.type === "Identifier") {
+            timelineVar = left.name;
+            ref = { kind: "identifier", name: left.name };
+            defaults = extractTimelineDefaults(path.node.right, emptyScope);
+          } else if (isStaticMemberRef(left)) {
+            ref = { kind: "member", node: left };
+            defaults = extractTimelineDefaults(path.node.right, emptyScope);
+          }
         }
       }
       this.traverse(path);
     }
   });
-  return { timelineVar, timelineCount, defaults };
+  return { timelineVar, ref, timelineCount, defaults };
 }
-function isTimelineRootedCall(callNode, timelineVar) {
+function isTimelineRootedCall(callNode, ref) {
   let obj = callNode.callee?.object;
   while (obj?.type === "CallExpression") {
     obj = obj.callee?.object;
   }
-  return obj?.type === "Identifier" && obj.name === timelineVar;
+  if (ref.kind === "identifier") return obj?.type === "Identifier" && obj.name === ref.name;
+  return sameMemberAccess(obj, ref.node);
 }
-function findAllTweenCalls(ast, timelineVar, scope, targetBindings) {
+function findAllTweenCalls(ast, ref, scope, targetBindings) {
   const results = [];
   recast.types.visit(ast, {
     visitCallExpression(path) {
@@ -630,7 +668,7 @@ function findAllTweenCalls(ast, timelineVar, scope, targetBindings) {
       const callee = node.callee;
       const gsapSetArg = node.arguments?.[0];
       const isGlobalSet = callee?.type === "MemberExpression" && callee.object?.type === "Identifier" && callee.object.name === "gsap" && callee.property?.type === "Identifier" && callee.property.name === "set" && (gsapSetArg?.type === "StringLiteral" || gsapSetArg?.type === "Literal" && typeof gsapSetArg.value === "string");
-      if (callee?.type === "MemberExpression" && callee.property?.type === "Identifier" && (isTimelineRootedCall(node, timelineVar) || isGlobalSet)) {
+      if (callee?.type === "MemberExpression" && callee.property?.type === "Identifier" && (isTimelineRootedCall(node, ref) || isGlobalSet)) {
         const method = callee.property.name;
         if (!GSAP_METHODS.has(method)) {
           this.traverse(path);
@@ -1108,8 +1146,9 @@ function parseGsapAst(script) {
   const scope = collectScopeBindings(ast);
   const targetBindings = collectTargetBindings(ast, scope);
   const detection = findTimelineVar(ast, scope);
-  const timelineVar = detection.timelineVar ?? "tl";
-  const calls = findAllTweenCalls(ast, timelineVar, scope, targetBindings);
+  const ref = detection.ref ?? { kind: "identifier", name: "tl" };
+  const timelineVar = timelineRootSource(ref);
+  const calls = findAllTweenCalls(ast, ref, scope, targetBindings);
   sortBySourcePosition(calls);
   const rawAnims = calls.map((call) => tweenCallToAnimation(call, scope));
   applyTimelineDefaults(rawAnims, detection.defaults);
@@ -1125,13 +1164,12 @@ function parseGsapAst(script) {
 function parseGsapScript(script) {
   try {
     const { detection, timelineVar, located } = parseGsapAst(script);
+    const ref = detection.ref ?? { kind: "identifier", name: "tl" };
     const animations = located.map((l) => l.animation);
-    const timelineMatch = script.match(
-      new RegExp(
-        `^[\\s\\S]*?(?:const|let|var)\\s+${timelineVar}\\s*=\\s*gsap\\.timeline\\s*\\([^)]*\\)\\s*;?`
-      )
-    );
-    const preamble = timelineMatch?.[0] ?? `const ${timelineVar} = gsap.timeline({ paused: true });`;
+    const declPattern = ref.kind === "identifier" ? `(?:const|let|var)\\s+${timelineVar}\\s*=\\s*gsap\\.timeline\\s*\\([^)]*\\)\\s*;?` : `${escapeRegExp(timelineVar)}\\s*=\\s*gsap\\.timeline\\s*\\([^)]*\\)\\s*;?`;
+    const timelineMatch = script.match(new RegExp(`^[\\s\\S]*?${declPattern}`));
+    const fallbackPreamble = ref.kind === "identifier" ? `const ${timelineVar} = gsap.timeline({ paused: true });` : `${timelineVar} = gsap.timeline({ paused: true });`;
+    const preamble = timelineMatch?.[0] ?? fallbackPreamble;
     const lastCallIdx = script.lastIndexOf(`${timelineVar}.`);
     let postamble = "";
     if (lastCallIdx !== -1) {
@@ -1143,7 +1181,7 @@ function parseGsapScript(script) {
     }
     const result = { animations, timelineVar, preamble, postamble };
     if (detection.timelineCount > 1) result.multipleTimelines = true;
-    if (detection.timelineCount > 0 && detection.timelineVar === null)
+    if (detection.timelineCount > 0 && detection.ref === null)
       result.unsupportedTimelinePattern = true;
     return result;
   } catch {
@@ -1355,7 +1393,7 @@ function addAnimationToScript(script, animation) {
     console.warn("[gsap-parser] addAnimationToScript parse failed:", e);
     return { script, id: "" };
   }
-  if (parsed.located.length === 0 && parsed.detection.timelineVar === null) {
+  if (parsed.located.length === 0 && parsed.detection.ref === null) {
     return { script, id: "" };
   }
   const id = `anim-${Date.now()}`;
@@ -1372,7 +1410,7 @@ function addAnimationWithKeyframesToScript(script, targetSelector, position, dur
     console.warn("[gsap-parser] addAnimationWithKeyframesToScript parse failed:", e);
     return { script, id: "" };
   }
-  if (parsed.located.length === 0 && parsed.detection.timelineVar === null) {
+  if (parsed.located.length === 0 && parsed.detection.ref === null) {
     return { script, id: "" };
   }
   const selector = JSON.stringify(targetSelector);
@@ -1889,9 +1927,9 @@ function updateKeyframeInScript(script, animationId, percentage, properties, eas
   const match = findKeyframePropByPct(kfNode, percentage);
   if (!match) return script;
   if (Object.keys(properties).length === 0 && ease) {
-    const existing = match.prop.value;
-    if (existing?.type === "ObjectExpression") {
-      const props = existing.properties ?? [];
+    const existing2 = match.prop.value;
+    if (existing2?.type === "ObjectExpression") {
+      const props = existing2.properties ?? [];
       const easeIdx = props.findIndex(
         (p) => isObjectProperty(p) && propKeyName(p) === "ease"
       );
@@ -1905,6 +1943,19 @@ function updateKeyframeInScript(script, animationId, percentage, properties, eas
     }
     return script;
   }
+  const existing = match.prop.value;
+  if (existing?.type === "ObjectExpression") {
+    const props = existing.properties ?? [];
+    const upsert = (key, valueCode) => {
+      const idx = props.findIndex((p) => isObjectProperty(p) && propKeyName(p) === key);
+      const node = parseExpr(`({ ${safeJsKey(key)}: ${valueCode} })`).properties[0];
+      if (idx >= 0) props[idx] = node;
+      else props.push(node);
+    };
+    for (const [k, v] of Object.entries(properties)) upsert(k, serializeValue(v));
+    if (ease !== void 0) upsert("ease", JSON.stringify(ease));
+    return recast.print(loc.parsed.ast).code;
+  }
   match.prop.value = buildKeyframeValueNode(properties, ease);
   return recast.print(loc.parsed.ast).code;
 }
@@ -2210,7 +2261,7 @@ function addMotionPathToScript(script, targetSelector, position, duration, point
     console.warn("[gsap-parser] addMotionPathToScript parse failed:", e);
     return { script, id: null };
   }
-  if (parsed.located.length === 0 && parsed.detection.timelineVar === null) {
+  if (parsed.located.length === 0 && parsed.detection.ref === null) {
     return { script, id: null };
   }
   const motionPathCode = buildMotionPathObjectCode({