@hyperframes/parsers 0.7.46 → 0.7.48

package/dist/index.js

@@ -1936,6 +1936,46 @@ function parseGsapScriptAcorn(script) {
   }
 }
 
+// src/compositionVariables.ts
+var DEFAULT_TYPEOF = {
+  string: "string",
+  number: "number",
+  color: "string",
+  boolean: "boolean",
+  enum: "string",
+  font: "string",
+  image: "string"
+};
+function isRecord(v) {
+  return typeof v === "object" && v !== null;
+}
+function isVariableType(t) {
+  return typeof t === "string" && t in DEFAULT_TYPEOF;
+}
+function isCompositionVariable(v) {
+  if (!isRecord(v)) return false;
+  if (typeof v.id !== "string" || typeof v.label !== "string") return false;
+  if (!isVariableType(v.type)) return false;
+  if (typeof v.default !== DEFAULT_TYPEOF[v.type]) return false;
+  if (v.type === "enum" && !Array.isArray(v.options)) return false;
+  return true;
+}
+function parseCompositionVariables(htmlEl) {
+  const variablesAttr = htmlEl.getAttribute("data-composition-variables");
+  if (!variablesAttr) {
+    return [];
+  }
+  try {
+    const parsed = JSON.parse(variablesAttr);
+    if (!Array.isArray(parsed)) {
+      return [];
+    }
+    return parsed.filter(isCompositionVariable);
+  } catch {
+    return [];
+  }
+}
+
 // src/hfIds.ts
 import { parseHTML } from "linkedom";
 var EXCLUDED_TAGS = /* @__PURE__ */ new Set([
@@ -1987,7 +2027,12 @@ function mintHfId(el, assigned) {
   return id;
 }
 function isCompositionTemplate(el) {
-  return el.tagName.toLowerCase() === "template" && el.getAttribute("data-composition-id") !== null;
+  if (el.tagName.toLowerCase() !== "template") return false;
+  if (el.getAttribute("data-composition-id") !== null) return true;
+  for (const child of Array.from(el.children)) {
+    if (child.getAttribute("data-composition-id") !== null) return true;
+  }
+  return false;
 }
 function walkElements(root, visit) {
   for (const child of Array.from(root.children)) {
@@ -2615,44 +2660,6 @@ function extractCompositionMetadata(html) {
     variables
   };
 }
-function parseCompositionVariables(htmlEl) {
-  const variablesAttr = htmlEl.getAttribute("data-composition-variables");
-  if (!variablesAttr) {
-    return [];
-  }
-  try {
-    const parsed = JSON.parse(variablesAttr);
-    if (!Array.isArray(parsed)) {
-      return [];
-    }
-    return parsed.filter((v) => {
-      if (typeof v !== "object" || v === null) return false;
-      if (typeof v.id !== "string" || typeof v.label !== "string") return false;
-      if (!["string", "number", "color", "boolean", "enum", "font", "image"].includes(v.type))
-        return false;
-      switch (v.type) {
-        case "string":
-          return typeof v.default === "string";
-        case "number":
-          return typeof v.default === "number";
-        case "color":
-          return typeof v.default === "string";
-        case "boolean":
-          return typeof v.default === "boolean";
-        case "enum":
-          return typeof v.default === "string" && Array.isArray(v.options);
-        case "font":
-          return typeof v.default === "string";
-        case "image":
-          return typeof v.default === "string";
-        default:
-          return false;
-      }
-    });
-  } catch {
-    return [];
-  }
-}
 function validateCompositionHtml(html) {
   const errors = [];
   const warnings = [];
@@ -2936,6 +2943,110 @@ function decodeUrlPathVariants(path) {
   return variants;
 }
 
+// src/variableUsage.ts
+import * as acorn3 from "acorn";
+import * as acornWalk3 from "acorn-walk";
+function isGetVariablesCallee(callee) {
+  if (callee?.type === "Identifier") return callee.name === "getVariables";
+  if (callee?.type === "MemberExpression" && !callee.computed) {
+    return callee.property?.type === "Identifier" && callee.property.name === "getVariables";
+  }
+  return false;
+}
+function collectFromObjectPattern(pattern, out) {
+  for (const prop of pattern.properties ?? []) {
+    if (prop?.type === "RestElement") {
+      out.incomplete();
+      continue;
+    }
+    if (prop?.type !== "Property") continue;
+    if (prop.computed === true) {
+      out.incomplete();
+    } else if (prop.key?.type === "Identifier") {
+      out.use(String(prop.key.name));
+    } else if (prop.key?.type === "Literal" && typeof prop.key.value === "string") {
+      out.use(prop.key.value);
+    } else {
+      out.incomplete();
+    }
+  }
+}
+function collectFromMemberAccess(member, out) {
+  if (member.computed !== true && member.property?.type === "Identifier") {
+    out.use(String(member.property.name));
+  } else if (member.computed === true && member.property?.type === "Literal" && typeof member.property.value === "string") {
+    out.use(member.property.value);
+  } else {
+    out.incomplete();
+  }
+}
+function classifyValueRead(parent, valueNode, out) {
+  if (!parent || parent.type === "ExpressionStatement") {
+    return null;
+  }
+  if (parent.type === "MemberExpression" && parent.object === valueNode) {
+    collectFromMemberAccess(parent, out);
+    return null;
+  }
+  if (parent.type === "VariableDeclarator" && parent.init === valueNode) {
+    if (parent.id?.type === "ObjectPattern") {
+      collectFromObjectPattern(parent.id, out);
+      return null;
+    }
+    if (parent.id?.type === "Identifier") return String(parent.id.name);
+    out.incomplete();
+    return null;
+  }
+  out.incomplete();
+  return null;
+}
+function scanVariableUsage(scriptText) {
+  const usedIds = [];
+  const seen = /* @__PURE__ */ new Set();
+  let scanIncomplete = false;
+  const sink = {
+    use(id) {
+      if (!seen.has(id)) {
+        seen.add(id);
+        usedIds.push(id);
+      }
+    },
+    incomplete() {
+      scanIncomplete = true;
+    }
+  };
+  let ast;
+  try {
+    ast = acorn3.parse(scriptText, { ecmaVersion: "latest", sourceType: "script" });
+  } catch {
+    return { usedIds: [], scanIncomplete: true };
+  }
+  const aliases = /* @__PURE__ */ new Set();
+  acornWalk3.ancestor(ast, {
+    CallExpression(node, _, ancestors) {
+      if (!isGetVariablesCallee(node.callee)) return;
+      const parent = ancestors[ancestors.length - 2];
+      const alias = classifyValueRead(parent, node, sink);
+      if (alias) aliases.add(alias);
+    }
+  });
+  if (aliases.size > 0) {
+    acornWalk3.ancestor(ast, {
+      // fallow-ignore-next-line complexity
+      Identifier(node, _, ancestors) {
+        if (!aliases.has(String(node.name))) return;
+        const parent = ancestors[ancestors.length - 2];
+        if (!parent) return;
+        if (parent.type === "VariableDeclarator" && parent.id === node) return;
+        if (parent.type === "MemberExpression" && parent.property === node) return;
+        if (parent.type === "Property" && parent.key === node && parent.computed !== true) return;
+        if (classifyValueRead(parent, node, sink)) sink.incomplete();
+      }
+    });
+  }
+  return { usedIds, scanIncomplete };
+}
+
 // src/fontAliases.ts
 var FONT_ALIAS_MAP = {
   // ── Canonical bundled fonts (self-referencing) ────────────────────────
@@ -3077,11 +3188,13 @@ export {
   keyframesToGsapAnimations,
   mintHfId,
   normalizeResolutionFlag,
+  parseCompositionVariables,
   parseGsapScriptAcorn as parseGsapScript,
   parseHtml,
   queryByAttr,
   removeElementFromHtml,
   resolveAliasDisplayName,
+  scanVariableUsage,
   serializeGsapAnimations,
   unrollComputedTimeline,
   updateElementInHtml,