npm - hyperframes - Versions diffs - 0.8.31 → 0.8.32 - Mend

hyperframes 0.8.31 → 0.8.32

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (18) hide show

package/dist/cli.js +2661 -1736
package/dist/commands/layout-audit.browser.js +161 -12
package/dist/fontLocalizeCli.js +2599 -1970
package/dist/hyperframe-runtime.js +27 -27
package/dist/hyperframe.manifest.json +1 -1
package/dist/hyperframe.runtime.iife.js +27 -27
package/dist/hyperframes-player.global.js +5 -1
package/dist/hyperframes-slideshow.global.js +16 -16
package/dist/studio/assets/{hyperframes-player-0QzsrRGz.js → hyperframes-player-CroojEG1.js} +5 -1
package/dist/studio/assets/{index-DdTv4TqQ.js → index-CSyaU1m2.js} +1 -1
package/dist/studio/assets/{index-Dyhj0geW.js → index-D0AjUHNT.js} +1 -1
package/dist/studio/assets/{index-CfQexXc6.js → index-PVOehm7h.js} +113 -113
package/dist/studio/index.html +1 -1
package/dist/studio/index.js +26 -11
package/dist/studio/index.js.map +1 -1
package/dist/templates/_shared/AGENTS.md +4 -1
package/dist/templates/_shared/CLAUDE.md +4 -1
package/package.json +1 -1

package/dist/studio/index.html CHANGED Viewed

@@ -5,7 +5,7 @@
     <meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover" />
     <link rel="icon" type="image/svg+xml" href="/favicon.svg" />
     <title>HyperFrames Studio</title>
-    <script type="module" crossorigin src="/assets/index-CfQexXc6.js"></script>
+    <script type="module" crossorigin src="/assets/index-PVOehm7h.js"></script>
     <link rel="stylesheet" crossorigin href="/assets/index-DnRfAiK2.css">
   </head>
   <body>

package/dist/studio/index.js CHANGED Viewed

@@ -1193,24 +1193,38 @@ var MANIFEST_CLIP_ATTRS = [
   ["data-duration", (clip) => clip.duration],
   ["data-track-index", (clip) => clip.track]
 ];
+function nodeMatchesClipTag(node, clip) {
+  return !clip.tagName || node.tagName.toLowerCase() === clip.tagName.toLowerCase();
+}
 function nodeMatchesManifestClip(node, clip) {
-  const tagName = clip.tagName?.toLowerCase();
-  if (tagName && node.tagName.toLowerCase() !== tagName) return false;
+  if (!nodeMatchesClipTag(node, clip)) return false;
   return MANIFEST_CLIP_ATTRS.every(([attr, expected]) => {
     const actual = Number.parseFloat(node.getAttribute(attr) ?? "");
     return !Number.isFinite(actual) || numbersNearlyEqual(actual, expected(clip));
   });
 }
 function findTimelineDomNode(doc, id) {
-  return doc.getElementById(id) ?? doc.querySelector(`[data-composition-id="${CSS.escape(id)}"]`) ?? doc.querySelector(`.${CSS.escape(id)}`) ?? null;
+  return doc.getElementById(id) ?? doc.querySelector(`[data-hf-id="${CSS.escape(id)}"]`) ?? doc.querySelector(`[data-composition-id="${CSS.escape(id)}"]`) ?? doc.querySelector(`.${CSS.escape(id)}`) ?? null;
 }
-function findTimelineDomNodeForClip(doc, clip, fallbackIndex, usedNodes = /* @__PURE__ */ new Set()) {
+function findTimelineDomNodeForClip(doc, clip, fallbackIndex, usedNodes = /* @__PURE__ */ new Set(), getCandidates = () => getTimelineDomNodes(doc)) {
   const byIdentity = clip.id ? findTimelineDomNode(doc, clip.id) : null;
-  if (byIdentity && !usedNodes.has(byIdentity)) return byIdentity;
-  const candidates = getTimelineDomNodes(doc).filter((node) => !usedNodes.has(node));
+  if (byIdentity && !usedNodes.has(byIdentity) && nodeMatchesClipTag(byIdentity, clip))
+    return byIdentity;
+  const candidates = getCandidates().filter((node) => !usedNodes.has(node));
   const exact = candidates.find((node) => nodeMatchesManifestClip(node, clip));
   if (exact) return exact;
-  return candidates[fallbackIndex] ?? null;
+  const positional = candidates[fallbackIndex];
+  return positional && nodeMatchesClipTag(positional, clip) ? positional : null;
+}
+function createTimelineDomNodeResolver(doc) {
+  let candidates;
+  const usedNodes = /* @__PURE__ */ new Set();
+  const getCandidates = () => candidates ??= getTimelineDomNodes(doc);
+  return (clip, index) => {
+    const node = findTimelineDomNodeForClip(doc, clip, index, usedNodes, getCandidates);
+    if (node) usedNodes.add(node);
+    return node;
+  };
 }
 function isImplicitTimelineLayerCandidate(root, el) {
   if (!isHtmlElement2(el)) return false;
@@ -5197,7 +5211,7 @@ function isDeterministicTimelineWindow(input) {
   return ["video", "audio", "img"].includes(input.tag.toLowerCase());
 }
 function hasPatchableTimelineTarget(input) {
-  return Boolean(input.domId || input.selector);
+  return Boolean(input.domId || input.hfId || input.selector);
 }
 function getTimelineEditCapabilities(input) {
   if (input.timingSource === "implicit" || input.timelineLocked) {
@@ -5289,6 +5303,7 @@ function canTrimEdge(element, edge) {
     kind: element.kind,
     duration: element.duration,
     domId: element.domId,
+    hfId: element.hfId,
     selector: element.selector,
     compositionSrc: element.compositionSrc,
     playbackStart: element.playbackStart,
@@ -19291,6 +19306,7 @@ function canMoveTimelineElement(element) {
     kind: element.kind,
     duration: element.duration,
     domId: element.domId,
+    hfId: element.hfId,
     selector: element.selector,
     compositionSrc: element.compositionSrc,
     playbackStart: element.playbackStart,
@@ -24910,10 +24926,9 @@ function safeContentDocument(iframe) {
   }
 }
 function buildTimelineElementsFromClips(clips, iframeDoc) {
-  const usedHostEls = /* @__PURE__ */ new Set();
+  const resolveHost = iframeDoc ? createTimelineDomNodeResolver(iframeDoc) : null;
   return clips.map((clip, index) => {
-    const hostEl = iframeDoc ? findTimelineDomNodeForClip(iframeDoc, clip, index, usedHostEls) : null;
-    if (hostEl) usedHostEls.add(hostEl);
+    const hostEl = resolveHost?.(clip, index) ?? null;
     return createTimelineElementFromManifestClip({
       clip,
       fallbackIndex: index,