Function buildKeyframesVarsCode

packages/parsers/src/gsapWriterAcorn.ts:1386–1411

Build the full replacement vars object for a tween being converted to keyframes.

(
  animation: GsapAnimation,
  fromProps: Record<string, number | string>,
  toProps: Record<string, number | string>,
  varsNode: Node,
  source: string,
  setDuration?: number,
)

/** Build the full replacement vars object for a tween being converted to keyframes. */
function buildKeyframesVarsCode(
  animation: GsapAnimation,
  fromProps: Record<string, number | string>,
  toProps: Record<string, number | string>,
  varsNode: Node,
  source: string,
  setDuration?: number,
): string {
  const fromEntries = Object.entries(fromProps).map(([k, v]) => `${safeKey(k)}: ${valueToCode(v)}`);
  const toEntries = Object.entries(toProps).map(([k, v]) => `${safeKey(k)}: ${valueToCode(v)}`);
  const easeEntry = animation.ease ? `, easeEach: ${JSON.stringify(animation.ease)}` : "";
  const kfCode = `{ "0%": { ${fromEntries.join(", ")} }, "100%": { ${toEntries.join(", ")} }${easeEntry} }`;
  // Preserve every non-editable key (duration/delay/callbacks/stagger/yoyo/…)
  // verbatim from source — rebuilding from the animation object alone dropped
  // `delay` (not a GsapAnimation field), shifting the tween's start time.
  let preserved = preservedVarsEntries(varsNode, source);
  // Converting a static `set` → drop its hold markers and give it a real duration
  // so the keyframes span time.
  if (setDuration !== undefined) {
    preserved = preserved.filter((e) => !/^\s*(immediateRender|data|duration)\s*:/.test(e));
  }
  const parts: string[] = [`keyframes: ${kfCode}`, ...preserved];
  if (setDuration !== undefined) parts.push(`duration: ${Math.max(0.001, setDuration)}`);
  if (animation.ease) parts.push(`ease: "none"`);
  return `{ ${parts.join(", ")} }`;
}

/**
 * Convert a flat tween (to/from/fromTo) to percentage-keyframes format.