@hyperframes/lint 0.7.24 → 0.7.26

package/dist/index.js

@@ -4,10 +4,13 @@ var STYLE_BLOCK_PATTERN = /<style\b([^>]*)>([\s\S]*?)<\/style>/gi;
 var SCRIPT_BLOCK_PATTERN = /<script\b([^>]*)>([\s\S]*?)<\/script>/gi;
 var COMPOSITION_ID_IN_CSS_PATTERN = /\[data-composition-id=["']([^"']+)["']\]/g;
 var TIMELINE_REGISTRY_INIT_PATTERN = /window\.__timelines\s*=\s*window\.__timelines\s*\|\|\s*\{\}|window\.__timelines\s*=\s*\{\}|window\.__timelines\s*\?\?=\s*\{\}/i;
+var TIMELINE_REGISTRY_OBJECT_LITERAL_PATTERN = /window\.__timelines\s*=\s*\{\s*(?:["'][^"']+["']|[A-Za-z_$][\w$]*)\s*:/i;
 var TIMELINE_REGISTRY_ASSIGN_PATTERN = /window\.__timelines(?:\[[^\]]+\]|\.[A-Za-z_$][\w$]*)\s*=/i;
 var WINDOW_TIMELINE_ASSIGN_PATTERN = /window\.__timelines(?:\[\s*["']([^"']+)["']\s*\]|\.\s*([A-Za-z_$][\w$]*))\s*=\s*([A-Za-z_$][\w$]*)/i;
 var INVALID_SCRIPT_CLOSE_PATTERN = /<script[^>]*>[\s\S]*?<\s*\/\s*script(?!>)/i;
 var TIMELINE_REGISTRY_KEY_PATTERN = /window\.__timelines(?:\[\s*["']([^"']+)["']\s*\]|\.\s*([A-Za-z_$][\w$]*))\s*=/g;
+var TIMELINE_REGISTRY_OBJECT_BODY_PATTERN = /window\.__timelines\s*=\s*\{([\s\S]*?)\}/i;
+var TIMELINE_REGISTRY_OBJECT_ENTRY_PATTERN = /(?:["']([^"']+)["']|([A-Za-z_$][\w$]*))\s*:\s*[A-Za-z_$][\w$]*/g;
 function extractOpenTags(source) {
   const tags = [];
   let match;
@@ -115,6 +118,17 @@ function extractTimelineRegistryKeys(source) {
     const key = match[1] ?? match[2];
     if (key) keys.add(key);
   }
+  const objectBody = TIMELINE_REGISTRY_OBJECT_BODY_PATTERN.exec(source)?.[1];
+  if (objectBody) {
+    const entryPattern = new RegExp(
+      TIMELINE_REGISTRY_OBJECT_ENTRY_PATTERN.source,
+      TIMELINE_REGISTRY_OBJECT_ENTRY_PATTERN.flags
+    );
+    while ((match = entryPattern.exec(objectBody)) !== null) {
+      const key = match[1] ?? match[2];
+      if (key) keys.add(key);
+    }
+  }
   return [...keys];
 }
 function getInlineScriptSyntaxError(source) {
@@ -211,6 +225,9 @@ function extractScriptTextsAndSrcs(scripts) {
 function isMediaTag(tagName) {
   return tagName === "video" || tagName === "audio" || tagName === "img";
 }
+function hasCaptionStyles(styles) {
+  return styles.some((s) => /\.caption[-_]?(?:group|word)/i.test(s.content));
+}
 function truncateSnippet(value, maxLength = 220) {
   const normalized = value.replace(/\s+/g, " ").trim();
   if (!normalized) return void 0;
@@ -438,7 +455,7 @@ var coreRules = [
       return [];
     }
     const findings = [];
-    if (!TIMELINE_REGISTRY_INIT_PATTERN.test(source) && !TIMELINE_REGISTRY_ASSIGN_PATTERN.test(source)) {
+    if (!TIMELINE_REGISTRY_INIT_PATTERN.test(source) && !TIMELINE_REGISTRY_ASSIGN_PATTERN.test(source) && !TIMELINE_REGISTRY_OBJECT_LITERAL_PATTERN.test(source)) {
       findings.push({
         code: "missing_timeline_registry",
         severity: "error",
@@ -1353,13 +1370,16 @@ function findContainingCompositionId(tag, ranges) {
   }
   return match?.id || null;
 }
+function getClipTagClasses(tag) {
+  const classAttr = readAttr(tag.raw, "class") || "";
+  const classes = classAttr.split(/\s+/).filter(Boolean);
+  return classes.includes("clip") ? { classAttr, classes } : null;
+}
 function collectClipStartBoundariesByComposition(source, tags) {
   const ranges = collectCompositionRanges(source, tags);
   const boundaries = /* @__PURE__ */ new Map();
   for (const tag of tags) {
-    const classAttr = readAttr(tag.raw, "class") || "";
-    const classes = classAttr.split(/\s+/).filter(Boolean);
-    if (!classes.includes("clip")) continue;
+    if (!getClipTagClasses(tag)) continue;
     const compositionId = findContainingCompositionId(tag, ranges);
     if (!compositionId) continue;
     const start = numberValue(readAttr(tag.raw, "data-start") ?? void 0);
@@ -1516,6 +1536,23 @@ function extractStandaloneGsapTransformCalls(script) {
   }
   return calls;
 }
+function scanScriptsForRegexMatches(scripts, pattern, options) {
+  const hits = [];
+  for (const script of scripts) {
+    const content = options.stripComments ? stripJsComments(script.content) : script.content;
+    const regex = new RegExp(pattern.source, pattern.flags);
+    let match;
+    while ((match = regex.exec(content)) !== null) {
+      const contextStart = Math.max(0, match.index - options.contextBefore);
+      const contextEnd = Math.min(
+        content.length,
+        match.index + match[0].length + options.contextAfter
+      );
+      hits.push({ match, snippet: content.slice(contextStart, contextEnd) });
+    }
+  }
+  return hits;
+}
 var gsapRules = [
   // overlapping_gsap_tweens + gsap_animates_clip_element + unscoped_gsap_selector
   // fallow-ignore-next-line complexity
@@ -1524,17 +1561,16 @@ var gsapRules = [
     const clipIds = /* @__PURE__ */ new Map();
     const clipClasses = /* @__PURE__ */ new Map();
     for (const tag of tags) {
-      const classAttr = readAttr(tag.raw, "class") || "";
-      const classes = classAttr.split(/\s+/).filter(Boolean);
-      if (!classes.includes("clip")) continue;
+      const clipTag = getClipTagClasses(tag);
+      if (!clipTag) continue;
       const id = readAttr(tag.raw, "id");
       const info = {
         tag: tag.name,
         id: id || "",
-        classes: classAttr
+        classes: clipTag.classAttr
       };
       if (id) clipIds.set(`#${id}`, info);
-      for (const cls of classes) {
+      for (const cls of clipTag.classes) {
         if (cls !== "clip") clipClasses.set(`.${cls}`, info);
       }
     }
@@ -1782,8 +1818,7 @@ ${right.raw}`)
   // fallow-ignore-next-line complexity
   ({ scripts, styles }) => {
     const findings = [];
-    const isCaptionFile = styles.some((s) => /\.caption[-_]?(?:group|word)/i.test(s.content));
-    if (!isCaptionFile) return findings;
+    if (!hasCaptionStyles(styles)) return findings;
     for (const script of scripts) {
       const content = script.content;
       const hasAudioData = /AUDIO|audio[-_]?data|bands\[/.test(content);
@@ -1808,44 +1843,38 @@ ${right.raw}`)
   // gsap_infinite_repeat
   ({ scripts }) => {
     const findings = [];
-    for (const script of scripts) {
-      const content = stripJsComments(script.content);
-      const pattern = /repeat\s*:\s*-1(?!\d)/g;
-      let match;
-      while ((match = pattern.exec(content)) !== null) {
-        const contextStart = Math.max(0, match.index - 60);
-        const contextEnd = Math.min(content.length, match.index + match[0].length + 60);
-        const snippet = content.slice(contextStart, contextEnd).trim();
-        findings.push({
-          code: "gsap_infinite_repeat",
-          severity: "error",
-          message: "GSAP tween uses `repeat: -1` (infinite). Infinite repeats break the deterministic capture engine which seeks to exact frame times. Use a finite repeat count calculated from the composition duration: `repeat: Math.floor(duration / cycleDuration) - 1`.",
-          fixHint: "Replace `repeat: -1` with a finite count, e.g. `repeat: Math.floor(totalDuration / singleCycleDuration) - 1`. Use Math.floor (not Math.ceil) to ensure the animation fits within the total duration.",
-          snippet: truncateSnippet(snippet)
-        });
-      }
+    const pattern = /repeat\s*:\s*-1(?!\d)/g;
+    for (const { snippet } of scanScriptsForRegexMatches(scripts, pattern, {
+      stripComments: true,
+      contextBefore: 60,
+      contextAfter: 60
+    })) {
+      findings.push({
+        code: "gsap_infinite_repeat",
+        severity: "error",
+        message: "GSAP tween uses `repeat: -1` (infinite). Infinite repeats break the deterministic capture engine which seeks to exact frame times. Use a finite repeat count calculated from the composition duration: `repeat: Math.floor(duration / cycleDuration) - 1`.",
+        fixHint: "Replace `repeat: -1` with a finite count, e.g. `repeat: Math.floor(totalDuration / singleCycleDuration) - 1`. Use Math.floor (not Math.ceil) to ensure the animation fits within the total duration.",
+        snippet: truncateSnippet(snippet)
+      });
     }
     return findings;
   },
   // gsap_repeat_ceil_overshoot
   ({ scripts }) => {
     const findings = [];
-    for (const script of scripts) {
-      const content = script.content;
-      const pattern = /repeat\s*:\s*Math\.ceil\s*\([^)]+\)\s*-\s*1/g;
-      let match;
-      while ((match = pattern.exec(content)) !== null) {
-        const contextStart = Math.max(0, match.index - 40);
-        const contextEnd = Math.min(content.length, match.index + match[0].length + 40);
-        const snippet = content.slice(contextStart, contextEnd).trim();
-        findings.push({
-          code: "gsap_repeat_ceil_overshoot",
-          severity: "warning",
-          message: "GSAP repeat calculation uses `Math.ceil` which can overshoot the composition duration. For example, Math.ceil(10.5 / 2) - 1 = 5 repeats \u2192 6 cycles \xD7 2s = 12s, exceeding 10.5s.",
-          fixHint: "Use `Math.floor` instead of `Math.ceil` to ensure the animation fits within the duration: `repeat: Math.floor(totalDuration / cycleDuration) - 1`. Math.floor(10.5 / 2) - 1 = 4 repeats \u2192 5 cycles \xD7 2s = 10s \u2713",
-          snippet: truncateSnippet(snippet)
-        });
-      }
+    const pattern = /repeat\s*:\s*Math\.ceil\s*\([^)]+\)\s*-\s*1/g;
+    for (const { snippet } of scanScriptsForRegexMatches(scripts, pattern, {
+      stripComments: false,
+      contextBefore: 40,
+      contextAfter: 40
+    })) {
+      findings.push({
+        code: "gsap_repeat_ceil_overshoot",
+        severity: "warning",
+        message: "GSAP repeat calculation uses `Math.ceil` which can overshoot the composition duration. For example, Math.ceil(10.5 / 2) - 1 = 5 repeats \u2192 6 cycles \xD7 2s = 12s, exceeding 10.5s.",
+        fixHint: "Use `Math.floor` instead of `Math.ceil` to ensure the animation fits within the duration: `repeat: Math.floor(totalDuration / cycleDuration) - 1`. Math.floor(10.5 / 2) - 1 = 4 repeats \u2192 5 cycles \xD7 2s = 10s \u2713",
+        snippet: truncateSnippet(snippet)
+      });
     }
     return findings;
   },
@@ -1886,7 +1915,7 @@ ${right.raw}`)
     for (const script of scripts) {
       const content = script.content;
       if (!/gsap\.timeline/.test(content)) continue;
-      const hasRegistration = WINDOW_TIMELINE_ASSIGN_PATTERN.test(content);
+      const hasRegistration = WINDOW_TIMELINE_ASSIGN_PATTERN.test(content) || TIMELINE_REGISTRY_OBJECT_LITERAL_PATTERN.test(content);
       if (hasRegistration || canInheritFromHost) continue;
       findings.push({
         code: "gsap_timeline_not_registered",
@@ -1971,23 +2000,21 @@ ${right.raw}`)
   // gsap_group_selector_keyframes
   ({ scripts }) => {
     const findings = [];
-    for (const script of scripts) {
-      const content = stripJsComments(script.content);
-      const pattern = /\.(?:to|from|fromTo)\(\s*["']([^"']+,\s*[^"']+)["']\s*,\s*\{[^}]*keyframes/g;
-      let match;
-      while ((match = pattern.exec(content)) !== null) {
-        const selector = match[1];
-        const count = selector.split(",").length;
-        const contextStart = Math.max(0, match.index - 20);
-        const contextEnd = Math.min(content.length, match.index + match[0].length + 40);
-        findings.push({
-          code: "gsap_group_selector_keyframes",
-          severity: "warning",
-          message: `GSAP tween targets ${count} elements with shared keyframes ("${truncateSnippet(selector, 60)}"). Editing one element's keyframes in Studio will affect all ${count} elements. Split into individual tweens for per-element keyframe control.`,
-          fixHint: `Replace the group selector with individual tl.to() calls per element, each with their own keyframes object.`,
-          snippet: truncateSnippet(content.slice(contextStart, contextEnd))
-        });
-      }
+    const pattern = /\.(?:to|from|fromTo)\(\s*["']([^"']+,\s*[^"']+)["']\s*,\s*\{[^}]*keyframes/g;
+    for (const { match, snippet } of scanScriptsForRegexMatches(scripts, pattern, {
+      stripComments: true,
+      contextBefore: 20,
+      contextAfter: 40
+    })) {
+      const selector = match[1];
+      const count = selector.split(",").length;
+      findings.push({
+        code: "gsap_group_selector_keyframes",
+        severity: "warning",
+        message: `GSAP tween targets ${count} elements with shared keyframes ("${truncateSnippet(selector, 60)}"). Editing one element's keyframes in Studio will affect all ${count} elements. Split into individual tweens for per-element keyframe control.`,
+        fixHint: `Replace the group selector with individual tl.to() calls per element, each with their own keyframes object.`,
+        snippet: truncateSnippet(snippet)
+      });
     }
     return findings;
   }
@@ -2208,6 +2235,7 @@ import { COMPOSITION_VARIABLE_TYPES } from "@hyperframes/parsers/composition";
 var MAX_COMPOSITION_LINES = 300;
 var MAX_TIMED_ELEMENTS_PER_TRACK = 3;
 var TRACK_DENSITY_EXEMPT_TAGS = /* @__PURE__ */ new Set(["audio", "script", "style", "video"]);
+var OVERLAP_EPSILON_SECONDS = 1e-6;
 function countPhysicalLines(source) {
   if (source.length === 0) return 0;
   const normalized = source.replace(/\r\n/g, "\n").replace(/\r/g, "\n");
@@ -2520,7 +2548,7 @@ var compositionRules = [
         const current = clips[i];
         const next = clips[i + 1];
         if (!current || !next) continue;
-        if (current.end > next.start) {
+        if (current.end - next.start > OVERLAP_EPSILON_SECONDS) {
           findings.push({
             code: "overlapping_clips_same_track",
             severity: "error",