@hyperframes/producer 0.1.13 → 0.1.14

package/dist/public-server.js

@@ -90223,7 +90223,7 @@ var Context = class {
    * @param layout - The layout to set.
    * @returns The layout function.
    */
-  setLayout = (layout) => this.#layout = layout;
+  setLayout = (layout2) => this.#layout = layout2;
   /**
    * Gets the current layout for the response.
    *
@@ -102176,6 +102176,19 @@ function lintHyperframeHtml(html, options = {}) {
       )
     });
   }
+  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 id = readAttr(tag.raw, "id");
+    const info = { tag: tag.name, id: id || "", classes: classAttr };
+    if (id) clipIds.set(`#${id}`, info);
+    for (const cls of classes) {
+      if (cls !== "clip") clipClasses.set(`.${cls}`, info);
+    }
+  }
   const classUsage = countClassUsage(tags);
   for (const script of scripts) {
     const localTimelineCompId = readRegisteredTimelineCompositionId(script.content);
@@ -102218,24 +102231,39 @@ ${right2.raw}`)
         });
       }
     }
+    for (const win of gsapWindows) {
+      const sel = win.targetSelector;
+      const clipInfo = clipIds.get(sel) || clipClasses.get(sel);
+      if (!clipInfo) continue;
+      const elDesc = `<${clipInfo.tag}${clipInfo.id ? ` id="${clipInfo.id}"` : ""} class="${clipInfo.classes}">`;
+      pushFinding({
+        code: "gsap_animates_clip_element",
+        severity: "error",
+        message: `GSAP animation targets a clip element. Selector "${sel}" resolves to element ${elDesc}. The framework manages clip visibility \u2014 animate an inner wrapper instead.`,
+        selector: sel,
+        elementId: clipInfo.id || void 0,
+        fixHint: "Wrap content in a child <div> and target that with GSAP.",
+        snippet: truncateSnippet(win.raw)
+      });
+    }
     if (!localTimelineCompId || localTimelineCompId === rootCompositionId) {
       continue;
     }
-    for (const window3 of gsapWindows) {
-      if (!isSuspiciousGlobalSelector(window3.targetSelector)) {
+    for (const win of gsapWindows) {
+      if (!isSuspiciousGlobalSelector(win.targetSelector)) {
         continue;
       }
-      const className = getSingleClassSelector(window3.targetSelector);
+      const className = getSingleClassSelector(win.targetSelector);
       if (className && (classUsage.get(className) || 0) < 2) {
         continue;
       }
       pushFinding({
         code: "unscoped_gsap_selector",
         severity: "warning",
-        message: `Timeline "${localTimelineCompId}" uses unscoped selector "${window3.targetSelector}" that will target elements in ALL compositions when bundled, causing data loss (opacity, transforms, etc.).`,
-        selector: window3.targetSelector,
-        fixHint: `Scope the selector: \`[data-composition-id="${localTimelineCompId}"] ${window3.targetSelector}\` or use a unique id.`,
-        snippet: truncateSnippet(window3.raw)
+        message: `Timeline "${localTimelineCompId}" uses unscoped selector "${win.targetSelector}" that will target elements in ALL compositions when bundled, causing data loss (opacity, transforms, etc.).`,
+        selector: win.targetSelector,
+        fixHint: `Scope the selector: \`[data-composition-id="${localTimelineCompId}"] ${win.targetSelector}\` or use a unique id.`,
+        snippet: truncateSnippet(win.raw)
       });
     }
   }
@@ -102488,6 +102516,58 @@ ${right2.raw}`)
       }
     }
   }
+  for (const script of scripts) {
+    const content = script.content;
+    const hasExitTween = /\.to\s*\([^,]+,\s*\{[^}]*opacity\s*:\s*0/.test(content);
+    const hasHardKill = /\.set\s*\([^,]+,\s*\{[^}]*(?:visibility\s*:\s*["']hidden["']|opacity\s*:\s*0)/.test(content);
+    const hasCaptionLoop = /forEach|\.forEach\s*\(/.test(content) && /createElement|caption|group|cg-/.test(content);
+    if (hasCaptionLoop && hasExitTween && !hasHardKill) {
+      pushFinding({
+        code: "caption_exit_missing_hard_kill",
+        severity: "warning",
+        message: "Caption exit animations (tl.to with opacity: 0) detected without a hard tl.set kill. Exit tweens can fail when karaoke word-level tweens conflict, leaving captions stuck on screen.",
+        fixHint: 'Add `tl.set(groupEl, { opacity: 0, visibility: "hidden" }, group.end)` after every exit tl.to animation as a deterministic kill.'
+      });
+    }
+  }
+  for (const style of styles) {
+    const content = style.content;
+    const captionBlocks = content.matchAll(
+      /(\.caption[-_]?(?:group|container|text|line|word)|#caption[-_]?container)\s*\{([^}]+)\}/gi
+    );
+    for (const [, selector, body] of captionBlocks) {
+      if (!body) continue;
+      const hasNowrap = /white-space\s*:\s*nowrap/i.test(body);
+      const hasMaxWidth = /max-width/i.test(body);
+      if (hasNowrap && !hasMaxWidth) {
+        pushFinding({
+          code: "caption_text_overflow_risk",
+          severity: "warning",
+          selector: (selector ?? "").trim(),
+          message: `Caption selector "${(selector ?? "").trim()}" has white-space: nowrap but no max-width. Long phrases will clip off-screen.`,
+          fixHint: "Add max-width: 1600px (landscape) or max-width: 900px (portrait) and overflow: hidden."
+        });
+      }
+    }
+  }
+  for (const style of styles) {
+    const content = style.content;
+    const captionBlocks = content.matchAll(
+      /(\.caption[-_]?(?:group|container|text|line)|#caption[-_]?container)\s*\{([^}]+)\}/gi
+    );
+    for (const [, selector, body] of captionBlocks) {
+      if (!body) continue;
+      if (/position\s*:\s*relative/i.test(body)) {
+        pushFinding({
+          code: "caption_container_relative_position",
+          severity: "warning",
+          selector: (selector ?? "").trim(),
+          message: `Caption selector "${(selector ?? "").trim()}" uses position: relative which causes overflow and breaks caption stacking.`,
+          fixHint: "Use position: absolute for all caption elements."
+        });
+      }
+    }
+  }
   {
     const externalScriptRe = /<script\b[^>]*\bsrc=["'](https?:\/\/[^"']+)["'][^>]*>/gi;
     let match2;
@@ -102506,11 +102586,13 @@ ${right2.raw}`)
     }
   }
   const errorCount = findings.filter((finding) => finding.severity === "error").length;
-  const warningCount = findings.length - errorCount;
+  const warningCount = findings.filter((finding) => finding.severity === "warning").length;
+  const infoCount = findings.filter((finding) => finding.severity === "info").length;
   return {
     ok: errorCount === 0,
     errorCount,
     warningCount,
+    infoCount,
     findings
   };
 }
@@ -102829,6 +102911,14 @@ function quantizeTimeToFrame(timeSeconds, fps) {
   return frameIndex / safeFps;
 }
 
+// ../../node_modules/.bun/@chenglou+pretext@0.0.3/node_modules/@chenglou/pretext/dist/analysis.js
+var arabicScriptRe = new RegExp("\\p{Script=Arabic}", "u");
+var combiningMarkRe = new RegExp("\\p{M}", "u");
+var decimalDigitRe = new RegExp("\\p{Nd}", "u");
+
+// ../../node_modules/.bun/@chenglou+pretext@0.0.3/node_modules/@chenglou/pretext/dist/measurement.js
+var emojiPresentationRe = new RegExp("\\p{Emoji_Presentation}", "u");
+
 // ../engine/src/services/screenshotService.ts
 var cdpSessionCache = /* @__PURE__ */ new WeakMap();
 async function getCdpSession(page) {