@hyperframes/lint 0.8.199 → 0.8.201

package/dist/browser.js

@@ -1047,6 +1047,19 @@ function selectorAliasesRuntimeHiddenStyle(selector) {
   }
   return unsafe;
 }
+function selectsOnInlineStyle(selector) {
+  let found = false;
+  try {
+    selectorParser((root) => {
+      root.walkAttributes((node) => {
+        if (node.attribute.toLowerCase() === "style") found = true;
+      });
+    }).processSync(selector);
+  } catch {
+    return false;
+  }
+  return found;
+}
 var POSITION_PROPERTIES = /* @__PURE__ */ new Set(["left", "top", "right", "bottom", "inset"]);
 function weakIdOf(node) {
   if (node.type === "attribute" && node.attribute.toLowerCase() === "id") {
@@ -1454,6 +1467,7 @@ var coreRules = [
     const findings = [];
     const reportedRepeatedIds = /* @__PURE__ */ new Set();
     const reportedHiddenStyleSelectors = /* @__PURE__ */ new Set();
+    const reportedInlineStyleSelectors = /* @__PURE__ */ new Set();
     const reportedReducedIdSelectors = /* @__PURE__ */ new Set();
     for (const style of styles) {
       let root;
@@ -1486,6 +1500,17 @@ var coreRules = [
               fixHint: `Remove the duplicate ancestor: change \`#${repeatedId} #${repeatedId}\` to \`#${repeatedId}\`.`
             });
           }
+          if (!reportedInlineStyleSelectors.has(selector) && selectsOnInlineStyle(selector)) {
+            reportedInlineStyleSelectors.add(selector);
+            findings.push({
+              code: "inline_style_attribute_selector",
+              severity: "error",
+              message: `Selector "${selector}" reads the inline \`style\` attribute. GSAP writes inline styles every frame, and each write then restyles far more than the animated element, so the preview slows to a crawl.`,
+              selector,
+              fixHint: "Let the runtime hide hidden clips; it already hides their contents. For a state of your own, toggle a class or data attribute from your script and select on that.",
+              snippet: truncateSnippet(rule.toString())
+            });
+          }
           if (!forcesOpacityZero || reportedHiddenStyleSelectors.has(selector) || !selectorAliasesRuntimeHiddenStyle(selector)) {
             continue;
           }
@@ -1495,7 +1520,7 @@ var coreRules = [
             severity: "error",
             message: `Selector "${selector}" observes HyperFrames' runtime-owned hidden style and forces opacity to zero. The renderer hides each native video before copying its computed opacity to the visible replacement frame, so this rule makes both transparent.`,
             selector,
-            fixHint: 'Restrict the guard to sub-composition hosts, for example `[data-composition-src][style*="visibility: hidden"]` and `[data-composition-file][style*="visibility: hidden"]`. Do not derive arbitrary element or media opacity from runtime-owned inline visibility.',
+            fixHint: "Remove this rule; the runtime already hides a hidden clip and its contents. To fade or hide something yourself, animate it on the timeline, or toggle a class or data attribute and select on that.",
             snippet: truncateSnippet(rule.toString())
           });
         }
@@ -2478,7 +2503,7 @@ var mediaRules = [
       const source = { id: readAttr(tag.raw, "id") || void 0, raw: tag.raw };
       if (tag.name === "video") {
         if (isAudibleVideoTag(tag.raw)) videos.push([src, source]);
-      } else if (tag.name === "audio") {
+      } else if (tag.name === "audio" && readAttr(tag.raw, "data-timeline-role") !== "room-tone") {
         audios.push([src, source]);
       }
     }
@@ -2514,6 +2539,8 @@ var mediaRules = [
   findAudioGroupTimingAttrFindings,
   // audio_group_carve_attr
   findAudioGroupCarveAttrFindings,
+  // audio_group_holds_elements
+  findAudioGroupHoldsElementsFindings,
   findLinkedClipFindings
 ];
 function findVolumeTweenOverridesGainFindings(ctx) {
@@ -2651,6 +2678,26 @@ function findAudioGroupTimingAttrFindings(ctx) {
   }
   return findings;
 }
+function findAudioGroupHoldsElementsFindings(ctx) {
+  const findings = [];
+  for (const group of ctx.tags) {
+    if (group.name !== "hf-audio-group") continue;
+    const end = group.closeIndex ?? Number.POSITIVE_INFINITY;
+    const held = ctx.tags.filter((tag) => tag.index > group.index && tag.index < end);
+    if (held.length === 0) continue;
+    const elementId = readAttr(group.raw, "id") || void 0;
+    const first = readAttr(held[0].raw, "id");
+    findings.push({
+      code: "audio_group_holds_elements",
+      severity: "warning",
+      message: `${elementId ? `#${elementId}` : "This audio group"} holds ${held.length} element(s), starting with <${held[0].name}${first ? `#${first}` : ""}>. Being inside it routes no audio through the bus (only \`data-audio-group\` does), and while the group has \`data-hidden\` they are hidden and silenced in preview and render.`,
+      elementId,
+      fixHint: "Close the group with `</hf-audio-group>` right after its opening tag (`/>` does not close a custom element), and give clips meant for this bus `data-audio-group`.",
+      snippet: truncateSnippet(group.raw)
+    });
+  }
+  return findings;
+}
 function findAudioGroupCarveAttrFindings(ctx) {
   const findings = [];
   for (const tag of ctx.tags) {
@@ -3174,13 +3221,14 @@ function variablesDeclarationFindings(tag, tags) {
         code: "invalid_composition_variables_declaration",
         severity: "error",
         message: `data-composition-variables entry [${i}] has a default that does not match its type, or an enum without an options array.`,
-        fixHint: "Use number defaults for number variables, boolean defaults for boolean variables, and string defaults for other types. Enum variables also require an options array.",
+        fixHint: "Use number defaults for number variables, boolean defaults for boolean variables, and string defaults for other types. Font/image also accept font {name, source} or image {url, alt?, fit?} objects. Enum variables also require an options array.",
         snippet: truncateSnippet(tag.raw)
       });
       continue;
     }
-    const id = String(e.id);
-    if ((e.type === "image" || varSrcIds.has(id)) && typeof e.default === "string" && e.default.length > 0 && !isSafeMediaUrl(e.default)) {
+    const id = e.id;
+    const mediaUrl = e.type === "image" && typeof e.default !== "string" ? e.default.url : e.default;
+    if ((e.type === "image" || varSrcIds.has(id)) && typeof mediaUrl === "string" && mediaUrl.length > 0 && !isSafeMediaUrl(mediaUrl)) {
       findings.push({
         code: "unloadable_media_variable_default",
         severity: "error",

package/dist/index.js

@@ -1053,6 +1053,19 @@ function selectorAliasesRuntimeHiddenStyle(selector) {
   }
   return unsafe;
 }
+function selectsOnInlineStyle(selector) {
+  let found = false;
+  try {
+    selectorParser((root) => {
+      root.walkAttributes((node) => {
+        if (node.attribute.toLowerCase() === "style") found = true;
+      });
+    }).processSync(selector);
+  } catch {
+    return false;
+  }
+  return found;
+}
 var POSITION_PROPERTIES = /* @__PURE__ */ new Set(["left", "top", "right", "bottom", "inset"]);
 function weakIdOf(node) {
   if (node.type === "attribute" && node.attribute.toLowerCase() === "id") {
@@ -1460,6 +1473,7 @@ var coreRules = [
     const findings = [];
     const reportedRepeatedIds = /* @__PURE__ */ new Set();
     const reportedHiddenStyleSelectors = /* @__PURE__ */ new Set();
+    const reportedInlineStyleSelectors = /* @__PURE__ */ new Set();
     const reportedReducedIdSelectors = /* @__PURE__ */ new Set();
     for (const style of styles) {
       let root;
@@ -1492,6 +1506,17 @@ var coreRules = [
               fixHint: `Remove the duplicate ancestor: change \`#${repeatedId} #${repeatedId}\` to \`#${repeatedId}\`.`
             });
           }
+          if (!reportedInlineStyleSelectors.has(selector) && selectsOnInlineStyle(selector)) {
+            reportedInlineStyleSelectors.add(selector);
+            findings.push({
+              code: "inline_style_attribute_selector",
+              severity: "error",
+              message: `Selector "${selector}" reads the inline \`style\` attribute. GSAP writes inline styles every frame, and each write then restyles far more than the animated element, so the preview slows to a crawl.`,
+              selector,
+              fixHint: "Let the runtime hide hidden clips; it already hides their contents. For a state of your own, toggle a class or data attribute from your script and select on that.",
+              snippet: truncateSnippet(rule.toString())
+            });
+          }
           if (!forcesOpacityZero || reportedHiddenStyleSelectors.has(selector) || !selectorAliasesRuntimeHiddenStyle(selector)) {
             continue;
           }
@@ -1501,7 +1526,7 @@ var coreRules = [
             severity: "error",
             message: `Selector "${selector}" observes HyperFrames' runtime-owned hidden style and forces opacity to zero. The renderer hides each native video before copying its computed opacity to the visible replacement frame, so this rule makes both transparent.`,
             selector,
-            fixHint: 'Restrict the guard to sub-composition hosts, for example `[data-composition-src][style*="visibility: hidden"]` and `[data-composition-file][style*="visibility: hidden"]`. Do not derive arbitrary element or media opacity from runtime-owned inline visibility.',
+            fixHint: "Remove this rule; the runtime already hides a hidden clip and its contents. To fade or hide something yourself, animate it on the timeline, or toggle a class or data attribute and select on that.",
             snippet: truncateSnippet(rule.toString())
           });
         }
@@ -2484,7 +2509,7 @@ var mediaRules = [
       const source = { id: readAttr(tag.raw, "id") || void 0, raw: tag.raw };
       if (tag.name === "video") {
         if (isAudibleVideoTag(tag.raw)) videos.push([src, source]);
-      } else if (tag.name === "audio") {
+      } else if (tag.name === "audio" && readAttr(tag.raw, "data-timeline-role") !== "room-tone") {
         audios.push([src, source]);
       }
     }
@@ -2520,6 +2545,8 @@ var mediaRules = [
   findAudioGroupTimingAttrFindings,
   // audio_group_carve_attr
   findAudioGroupCarveAttrFindings,
+  // audio_group_holds_elements
+  findAudioGroupHoldsElementsFindings,
   findLinkedClipFindings
 ];
 function findVolumeTweenOverridesGainFindings(ctx) {
@@ -2657,6 +2684,26 @@ function findAudioGroupTimingAttrFindings(ctx) {
   }
   return findings;
 }
+function findAudioGroupHoldsElementsFindings(ctx) {
+  const findings = [];
+  for (const group of ctx.tags) {
+    if (group.name !== "hf-audio-group") continue;
+    const end = group.closeIndex ?? Number.POSITIVE_INFINITY;
+    const held = ctx.tags.filter((tag) => tag.index > group.index && tag.index < end);
+    if (held.length === 0) continue;
+    const elementId = readAttr(group.raw, "id") || void 0;
+    const first = readAttr(held[0].raw, "id");
+    findings.push({
+      code: "audio_group_holds_elements",
+      severity: "warning",
+      message: `${elementId ? `#${elementId}` : "This audio group"} holds ${held.length} element(s), starting with <${held[0].name}${first ? `#${first}` : ""}>. Being inside it routes no audio through the bus (only \`data-audio-group\` does), and while the group has \`data-hidden\` they are hidden and silenced in preview and render.`,
+      elementId,
+      fixHint: "Close the group with `</hf-audio-group>` right after its opening tag (`/>` does not close a custom element), and give clips meant for this bus `data-audio-group`.",
+      snippet: truncateSnippet(group.raw)
+    });
+  }
+  return findings;
+}
 function findAudioGroupCarveAttrFindings(ctx) {
   const findings = [];
   for (const tag of ctx.tags) {
@@ -3180,13 +3227,14 @@ function variablesDeclarationFindings(tag, tags) {
         code: "invalid_composition_variables_declaration",
         severity: "error",
         message: `data-composition-variables entry [${i}] has a default that does not match its type, or an enum without an options array.`,
-        fixHint: "Use number defaults for number variables, boolean defaults for boolean variables, and string defaults for other types. Enum variables also require an options array.",
+        fixHint: "Use number defaults for number variables, boolean defaults for boolean variables, and string defaults for other types. Font/image also accept font {name, source} or image {url, alt?, fit?} objects. Enum variables also require an options array.",
         snippet: truncateSnippet(tag.raw)
       });
       continue;
     }
-    const id = String(e.id);
-    if ((e.type === "image" || varSrcIds.has(id)) && typeof e.default === "string" && e.default.length > 0 && !isSafeMediaUrl(e.default)) {
+    const id = e.id;
+    const mediaUrl = e.type === "image" && typeof e.default !== "string" ? e.default.url : e.default;
+    if ((e.type === "image" || varSrcIds.has(id)) && typeof mediaUrl === "string" && mediaUrl.length > 0 && !isSafeMediaUrl(mediaUrl)) {
       findings.push({
         code: "unloadable_media_variable_default",
         severity: "error",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hyperframes/lint",
-  "version": "0.8.199",
+  "version": "0.8.201",
   "repository": {
     "type": "git",
     "url": "https://github.com/heygen-com/hyperframes",
@@ -35,7 +35,7 @@
     "linkedom": "^0.18.12",
     "postcss": "^8.5.8",
     "postcss-selector-parser": "^7.1.4",
-    "@hyperframes/parsers": "0.8.199"
+    "@hyperframes/parsers": "0.8.201"
   },
   "devDependencies": {
     "@types/node": "^25.0.10",