@hyperframes/parsers 0.8.133 → 0.8.135

package/dist/{gsapSerialize-CfSXM_Ez.d.ts → gsapSerialize-WJrRO8uT.d.ts}

@@ -22,11 +22,17 @@ type PositionWrite = Pick<GsapAnimation, "propertyGroup" | "properties" | "fromP
 declare function isXYPositionWrite(a: PositionWrite): boolean;
 declare function classifyPropertyGroup(prop: string): PropertyGroupName;
 declare function classifyTweenPropertyGroup(properties: Record<string, unknown>): PropertyGroupName | undefined;
+interface HoldScope {
+    touched: (animation: GsapAnimation) => boolean;
+    held: (selector: string) => ReadonlyMap<string, unknown>;
+}
+/** The tweens an edit touched (not in `previous`; none without it), and what the script's holds already pin. */
+declare function holdScope(before: readonly GsapAnimation[], previous: readonly GsapAnimation[] | null): HoldScope;
 /**
- * What a Studio hold pins from t=0 before a later keyframed tween: its 0% keyframe's position props,
- * minus those an earlier timeline tween on the target writes (a global `gsap.set` is a base value).
+ * What a Studio hold pins from t=0: a keyframed tween's 0% position props before a later start, and the position and
+ * size of a lone key (GSAP renders none) only where this edit made it or a hold already pins it, minus earlier tweens.
  */
-declare function positionHoldForAnimation(animation: GsapAnimation, animations: readonly GsapAnimation[]): Record<string, number> | null;
+declare function keyframeHoldForAnimation(animation: GsapAnimation, animations: readonly GsapAnimation[], scope: HoldScope): Record<string, number> | null;
 declare const SUPPORTED_EASES: string[];
 
 /**
@@ -216,4 +222,4 @@ declare function gsapAnimationsToKeyframes(animations: GsapAnimation[], elementS
     skipBaseSet?: boolean;
 }): Keyframe[];
 
-export { type ArcPathConfig as A, BUILTIN_VAR_KEYS as B, DROPPED_VAR_KEYS as D, EXTRAS_KEYS as E, type GsapMethod as G, type KeyframeEditability as K, type MotionPathShape as M, type ParsedGsap as P, SUPPORTED_EASES as S, type GsapAnimation as a, type ArcPathSegment as b, type GsapProvenance as c, type GsapProvenanceKind as d, buildArcPath as e, editabilityForProvenance as f, type GsapKeyframeFormat as g, type GsapKeyframesData as h, type GsapPercentageKeyframe as i, PROPERTY_GROUPS as j, type PropertyGroupName as k, SUPPORTED_PROPS as l, classifyPropertyGroup as m, classifyTweenPropertyGroup as n, getAnimationsForElementId as o, gsapAnimationsToKeyframes as p, keyframesToGsapAnimations as q, type SplitAnimationsOptions as r, serializeGsapAnimations as s, type SplitAnimationsResult as t, GSAP_DEFAULT_DURATION as u, validateCompositionGsap as v, type SourcedGsapPercentageKeyframe as w, isTweenConfigKey as x, isXYPositionWrite as y, positionHoldForAnimation as z };
+export { type ArcPathConfig as A, BUILTIN_VAR_KEYS as B, keyframeHoldForAnimation as C, DROPPED_VAR_KEYS as D, EXTRAS_KEYS as E, type GsapAnimation as G, type HoldScope as H, type KeyframeEditability as K, type MotionPathShape as M, type ParsedGsap as P, SUPPORTED_EASES as S, type ArcPathSegment as a, type GsapKeyframeFormat as b, type GsapKeyframesData as c, type GsapMethod as d, type GsapPercentageKeyframe as e, PROPERTY_GROUPS as f, type PropertyGroupName as g, SUPPORTED_PROPS as h, classifyPropertyGroup as i, classifyTweenPropertyGroup as j, getAnimationsForElementId as k, gsapAnimationsToKeyframes as l, keyframesToGsapAnimations as m, type GsapProvenance as n, type GsapProvenanceKind as o, buildArcPath as p, editabilityForProvenance as q, type SplitAnimationsOptions as r, serializeGsapAnimations as s, type SplitAnimationsResult as t, GSAP_DEFAULT_DURATION as u, validateCompositionGsap as v, type SourcedGsapPercentageKeyframe as w, holdScope as x, isTweenConfigKey as y, isXYPositionWrite as z };

package/dist/gsapWriterAcorn.d.ts

@@ -1,4 +1,4 @@
-import { a as GsapAnimation, A as ArcPathConfig, r as SplitAnimationsOptions, t as SplitAnimationsResult, b as ArcPathSegment } from './gsapSerialize-CfSXM_Ez.js';
+import { G as GsapAnimation, A as ArcPathConfig, r as SplitAnimationsOptions, t as SplitAnimationsResult, a as ArcPathSegment } from './gsapSerialize-WJrRO8uT.js';
 import './types-Ejqndkej.js';
 
 type TweenTarget = Pick<GsapAnimation, "targetSelector" | "hasPartialSelector">;
@@ -179,7 +179,10 @@ declare function addMotionPathToScript(script: string, targetSelector: string, p
 };
 declare function removeArcPathFromScript(script: string, animationId: string): string;
 /** Acorn-native, byte-preserving hold synchronization used after mutations. */
-declare function syncPositionHoldsBeforeKeyframes(script: string): string;
+declare function syncPositionHoldsBeforeKeyframes(script: string, previous?: string): string;
+/** GSAP 3.15 stretches a keyframe tween that stops short of 100% on its first render, unlike once played:
+ *  each tween this mutation wrote or edited ends on its last key instead. Tweens it left alone keep their tail. */
+declare function trimTrailingKeyframeSpans(previous: string, script: string): string;
 declare function splitAnimationsInScript(script: string, opts: SplitAnimationsOptions): SplitAnimationsResult;
 type UnrollElement = {
     selector: string;
@@ -197,4 +200,4 @@ type UnrollElement = {
  */
 declare function unrollDynamicAnimations(script: string, animationId: string, elements: UnrollElement[]): string;
 
-export { type ClipTweenRetime, type UnrollElement, addAnimationToScript, addAnimationWithKeyframesToScript, addKeyframeToScript, addLabelToScript, addMotionPathPointInScript, addMotionPathToScript, clipQueryRoot, clipTweenMatcher, convertToKeyframesFromScript, copyAnimationsInScript, dedupePositionWritesInScript, hasExplicitTime, materializeKeyframesFromScript, moveKeyframeInScript, removeAllKeyframesFromScript, removeAnimationFromScript, removeArcPathFromScript, removeKeyframeFromScript, removeLabelFromScript, removeMotionPathPointInScript, removePropertyFromAnimation, replaceTweenWithKeyframesInScript, resizeKeyframedTweenInScript, retimeClipTweensInScript, scalePositionsInScript, setArcPathInScript, shiftPositionsInScript, splitAnimationsInScript, splitIntoPropertyGroupsFromScript, syncPositionHoldsBeforeKeyframes, unrollDynamicAnimations, updateAnimationInScript, updateArcSegmentInScript, updateKeyframeInScript, updateMotionPathPointInScript };
+export { type ClipTweenRetime, type UnrollElement, addAnimationToScript, addAnimationWithKeyframesToScript, addKeyframeToScript, addLabelToScript, addMotionPathPointInScript, addMotionPathToScript, clipQueryRoot, clipTweenMatcher, convertToKeyframesFromScript, copyAnimationsInScript, dedupePositionWritesInScript, hasExplicitTime, materializeKeyframesFromScript, moveKeyframeInScript, removeAllKeyframesFromScript, removeAnimationFromScript, removeArcPathFromScript, removeKeyframeFromScript, removeLabelFromScript, removeMotionPathPointInScript, removePropertyFromAnimation, replaceTweenWithKeyframesInScript, resizeKeyframedTweenInScript, retimeClipTweensInScript, scalePositionsInScript, setArcPathInScript, shiftPositionsInScript, splitAnimationsInScript, splitIntoPropertyGroupsFromScript, syncPositionHoldsBeforeKeyframes, trimTrailingKeyframeSpans, unrollDynamicAnimations, updateAnimationInScript, updateArcSegmentInScript, updateKeyframeInScript, updateMotionPathPointInScript };

package/dist/gsapWriterAcorn.js

@@ -57,23 +57,43 @@ function knownStart(animation) {
   if (animation.resolvedStart !== void 0) return animation.resolvedStart;
   return typeof animation.position === "number" ? animation.position : void 0;
 }
-function positionHoldForAnimation(animation, animations) {
+var tweenSignature = (a) => JSON.stringify([a.targetSelector, a.method, a.position, a.duration, a.properties, a.keyframes]);
+function holdScope(before, previous) {
+  const kept = new Set(previous?.map(tweenSignature));
+  const held = /* @__PURE__ */ new Map();
+  for (const a of before.filter((b) => b.method === "set" && b.properties?.data === "hf-hold")) {
+    const props = held.get(a.targetSelector) ?? /* @__PURE__ */ new Map();
+    for (const [property, value] of Object.entries(a.properties)) props.set(property, value);
+    held.set(a.targetSelector, props);
+  }
+  return {
+    touched: (a) => previous !== null && !kept.has(tweenSignature(a)),
+    held: (selector) => held.get(selector) ?? /* @__PURE__ */ new Map()
+  };
+}
+function keyframeHoldForAnimation(animation, animations, scope) {
   if (!animation.keyframes) return null;
-  const start = knownStart(animation) ?? 0;
-  if (!(start > 1e-3)) return null;
+  const start = knownStart(animation);
+  const lone = animation.keyframes.keyframes.length === 1;
+  if (start === void 0 || !(start > 1e-3) && !lone) return null;
   const atStart = animation.keyframes.keyframes.find((keyframe) => keyframe.percentage === 0);
   if (!atStart) return null;
   const earlier = animations.filter((other) => {
     const otherStart = knownStart(other);
     return other !== animation && !other.global && other.targetSelector === animation.targetSelector && otherStart !== void 0 && otherStart < start - 1e-3;
   });
-  const position = {};
+  const touched = scope.touched(animation);
+  const pinned = scope.held(animation.targetSelector);
+  const kept = (property, value) => touched ? pinned.has(property) : pinned.get(property) === value;
+  const pins = (group, property, value) => group === "position" && start > 1e-3 || (group === "position" || group === "size") && (lone && touched || kept(property, value));
+  const hold = {};
   for (const [property, value] of Object.entries(atStart.properties)) {
-    if (classifyPropertyGroup(property) !== "position" || typeof value !== "number") continue;
+    if (!pins(classifyPropertyGroup(property), property, value) || typeof value !== "number")
+      continue;
     if (earlier.some((other) => writesProperty(other, property))) continue;
-    position[property] = value;
+    hold[property] = value;
   }
-  return Object.keys(position).length > 0 ? position : null;
+  return Object.keys(hold).length > 0 ? hold : null;
 }
 
 // src/gsapSerialize.ts
@@ -118,6 +138,10 @@ function buildArcPath(coords, curviness, autoRotate, isCubic) {
   }
   return { arcPath: { enabled: true, autoRotate, segments }, waypoints };
 }
+function plainPercentKey(percentage) {
+  const text = Math.abs(percentage) < 1e-6 ? percentage.toFixed(20).replace(/\.?0+$/, "") : String(percentage);
+  return `${text}%`;
+}
 var CSS_IDENTITY = {
   opacity: 1,
   autoAlpha: 1,
@@ -1067,9 +1091,6 @@ function tweenCallToAnimation(call, scope, source, identifierBindings) {
       properties[key] = val;
     }
   }
-  if (keyframesData && typeof vars.easeEach === "string") {
-    keyframesData.easeEach = vars.easeEach;
-  }
   if (motionPathResult) {
     const { waypoints } = motionPathResult;
     if (!keyframesData) {
@@ -2135,7 +2156,7 @@ function convertArrayKeyframesToObject(script, target) {
   if (!timing) return script;
   const entries = els.map((el, i) => {
     const { duration: _duration, ...record } = records[i];
-    return `${JSON.stringify(`${timing.percentages[i]}%`)}: ${recordToCode(record)}`;
+    return `${JSON.stringify(plainPercentKey(timing.percentages[i]))}: ${recordToCode(record)}`;
   });
   const ms = new MagicString(script);
   ms.overwrite(
@@ -2197,7 +2218,13 @@ function addKeyframeToScript(script, animationId, percentage, properties, ease,
       ms.overwrite(existing.prop.value.start, existing.prop.value.end, recordToCode(targetRecord));
     }
   } else {
-    insertNewKeyframe(ms, kfNode, percentage, `${percentage}%`, recordToCode(targetRecord));
+    insertNewKeyframe(
+      ms,
+      kfNode,
+      percentage,
+      plainPercentKey(percentage),
+      recordToCode(targetRecord)
+    );
   }
   for (const [prop, rec] of [...endpointOverwrites, ...backfillOverwrites]) {
     ms.overwrite(prop.value.start, prop.value.end, recordToCode(rec));
@@ -2296,7 +2323,12 @@ function moveKeyframeInScript(script, animationId, fromPercentage, toPercentage)
   }
   entries.push({ pct: toPercentage, record: valueNodeToRecord(match.prop.value, src) });
   entries.sort((a, b) => a.pct - b.pct);
-  const body = entries.map((e) => `${JSON.stringify(`${e.pct}%`)}: ${recordToCode(e.record)}`).join(", ");
+  const pctProps = new Set(percentagePropsOf(kfNode));
+  const kept = (kfNode.properties ?? []).filter((p) => !pctProps.has(p)).map((p) => src.slice(p.start, p.end));
+  const body = [
+    ...entries.map((e) => `${JSON.stringify(plainPercentKey(e.pct))}: ${recordToCode(e.record)}`),
+    ...kept
+  ].join(", ");
   const ms = new MagicString(src);
   ms.overwrite(kfNode.start, kfNode.end, `{ ${body} }`);
   return ms.toString();
@@ -2315,7 +2347,7 @@ function resizeKeyframedTweenInScript(script, animationId, newPosition, newDurat
   }
   const ms = new MagicString(src);
   for (const { keyNode, to } of edits) {
-    ms.overwrite(keyNode.start, keyNode.end, JSON.stringify(`${to}%`));
+    ms.overwrite(keyNode.start, keyNode.end, JSON.stringify(plainPercentKey(to)));
   }
   overwritePosition(ms, target.call, newPosition);
   upsertProp(ms, target.call.varsArg, "duration", newDuration);
@@ -2433,7 +2465,7 @@ function buildKeyframeObjectCode(keyframes, easeEach) {
     const props = Object.entries(kf.properties).map(([k, v]) => `${safeKey(k)}: ${valueToCode(v)}`);
     if (kf.ease) props.push(`ease: ${valueToCode(kf.ease)}`);
     if (kf.auto) props.push(`_auto: 1`);
-    return `${JSON.stringify(`${kf.percentage}%`)}: { ${props.join(", ")} }`;
+    return `${JSON.stringify(plainPercentKey(kf.percentage))}: { ${props.join(", ")} }`;
   });
   if (easeEach) entries.push(`easeEach: ${valueToCode(easeEach)}`);
   return `{ ${entries.join(", ")} }`;
@@ -2587,7 +2619,8 @@ function addGroupAnimToScript(script, anim, propSet) {
       pos,
       anim.duration ?? 0.5,
       groupKeyframes,
-      anim.keyframes.easeEach ?? anim.ease
+      anim.keyframes.ease ?? anim.ease,
+      anim.keyframes.easeEach
     );
   }
   const groupProperties = filterGroupProperties(anim.properties, propSet);
@@ -2906,15 +2939,20 @@ function removeStudioHoldSets(script, parsed) {
   for (const hold of staleHolds) removeCallFromMagicString(ms, hold.call, script);
   return ms.toString();
 }
-function syncPositionHoldsBeforeKeyframes(script) {
+function syncPositionHoldsBeforeKeyframes(script, previous) {
   const parsed = parseGsapScriptAcornForWrite(script);
   if (!parsed) return script;
+  const tweensOf = (text) => parseGsapScriptAcornForWrite(text)?.located.map((entry) => entry.animation) ?? null;
+  const scope = holdScope(
+    parsed.located.map((entry) => entry.animation),
+    previous === void 0 ? null : tweensOf(previous)
+  );
   let result = removeStudioHoldSets(script, parsed);
   const current = parseGsapScriptAcornForWrite(result);
   if (!current) return result;
   const animations = current.located.map((entry) => entry.animation);
   for (const animation of animations) {
-    const position = positionHoldForAnimation(animation, animations);
+    const position = keyframeHoldForAnimation(animation, animations, scope);
     if (!position) continue;
     result = insertInheritedStateSetInScript(result, animation.targetSelector, 0, {
       ...position,
@@ -2923,6 +2961,62 @@ function syncPositionHoldsBeforeKeyframes(script) {
   }
   return result;
 }
+var roundPct = (pct) => Math.round(pct * 1e3) / 1e3;
+var LINEAR_RUN = /* @__PURE__ */ new Set(["none", "linear"]);
+var PLACED_BY_TIMELINE = /\.(?:add|addLabel|addPause|call|repeat|yoyo|duration|timeScale)\s*\(|\b(?:repeat|yoyo)\s*:/;
+function linearPercentageKeys(animation) {
+  const data = animation.keyframes;
+  if (data?.format !== "percentage" || data.fromMotionPath || animation.arcPath) return null;
+  if (animation.durationUnresolved || !LINEAR_RUN.has(animation.ease || "none")) return null;
+  return data.keyframes;
+}
+var loops = (animation) => Boolean(animation.extras?.repeat || animation.extras?.yoyo);
+function trimmableKeyframes(animation) {
+  const keyframes = loops(animation) ? null : linearPercentageKeys(animation);
+  const { duration, position } = animation;
+  if (!keyframes || typeof position !== "number" || typeof duration !== "number") return null;
+  return duration > 0 ? { keyframes, duration, position } : null;
+}
+function trailingSpanTrim(animation) {
+  const tween = trimmableKeyframes(animation);
+  if (!tween) return null;
+  const last = Math.max(...tween.keyframes.map((keyframe) => keyframe.percentage));
+  if (tween.keyframes.length < 2 || !(last > 0) || last >= 99.999) return null;
+  return {
+    position: tween.position,
+    duration: Math.round(tween.duration * last * 10) / 1e3,
+    pctRemap: tween.keyframes.map(({ percentage: from }) => ({
+      from,
+      to: roundPct(from / last * 100)
+    }))
+  };
+}
+function trimTrailingKeyframeSpans(previous, script) {
+  if (script === previous) return script;
+  const located = parseGsapScriptAcornForWrite(script)?.located ?? [];
+  const placedAfter = ({ animation: a }) => !a.global && (a.implicitPosition || typeof a.position !== "number");
+  if (PLACED_BY_TIMELINE.test(script) || located.some(placedAfter)) return script;
+  const trims = located.flatMap((entry) => {
+    const trim = trailingSpanTrim(entry.animation);
+    return trim ? [{ entry, trim }] : [];
+  });
+  if (!trims.length) return script;
+  const source = (text, { call }) => `${call.method}${text.slice(call.node.arguments[0]?.start, call.node.end)}`;
+  const previousTweens = parseGsapScriptAcornForWrite(previous)?.located ?? [];
+  const untouched = new Set(previousTweens.map((entry) => source(previous, entry)));
+  let result = script;
+  for (const { entry, trim } of trims) {
+    if (untouched.has(source(script, entry))) continue;
+    result = resizeKeyframedTweenInScript(
+      result,
+      entry.id,
+      trim.position,
+      trim.duration,
+      trim.pctRemap
+    );
+  }
+  return result;
+}
 function computeForwardBaselines(matching, splitTime) {
   const before = [];
   const acc = {};
@@ -3244,6 +3338,7 @@ export {
   splitAnimationsInScript,
   splitIntoPropertyGroupsFromScript,
   syncPositionHoldsBeforeKeyframes,
+  trimTrailingKeyframeSpans,
   unrollDynamicAnimations,
   updateAnimationInScript,
   updateArcSegmentInScript,