@hyperframes/studio 0.8.193 → 0.8.194

package/dist/assets/{index-Ci6GuloR.js → index-D9kA6JUX.js}

@@ -1,4 +1,4 @@
-import{n as Qi}from"./index-Ca-mgTnS.js";/*!
+import{n as Qi}from"./index-CAQ7OcNJ.js";/*!
  * Copyright (c) 2026-present, Vanilagy and contributors
  *
  * This Source Code Form is subject to the terms of the Mozilla Public

package/dist/index.html

@@ -14,7 +14,7 @@
         document.documentElement.dataset.theme = "paper";
       }
     </script>
-    <script type="module" crossorigin src="/assets/index-Ca-mgTnS.js"></script>
+    <script type="module" crossorigin src="/assets/index-CAQ7OcNJ.js"></script>
     <link rel="stylesheet" crossorigin href="/assets/index-CYbvOVp-.css">
   </head>
   <body>

package/dist/index.js

@@ -17608,7 +17608,7 @@ async function writeProjectFilesWithHistoryInQueue({
 
 // src/utils/gsapSoftReload.ts
 import { COLOR_GRADING_SOURCE_HIDDEN_ATTR as COLOR_GRADING_SOURCE_HIDDEN_ATTR2 } from "@hyperframes/core/color-grading";
-import { motionPathPluginUrl } from "@hyperframes/core/gsap-cdn";
+import { GSAP_BASE_URL_META, motionPathPluginUrl } from "@hyperframes/core/gsap-cdn";
 
 // src/utils/authoredSource.ts
 import { ensureHfIds, isCompositionTemplate } from "@hyperframes/parsers/hf-ids";
@@ -17870,6 +17870,12 @@ function fileDocs(ownFile, written, nestedFiles) {
 
 // src/utils/gsapSoftReload.ts
 var pendingReadyRetry = null;
+function previewMotionPathUrl(doc, version) {
+  const baseUrl = doc.head.querySelector(
+    `meta[name="${GSAP_BASE_URL_META}"]`
+  )?.content;
+  return motionPathPluginUrl(version, baseUrl);
+}
 function ensureMotionPathPluginLoaded(iframe) {
   if (pendingReadyRetry) window.removeEventListener("message", pendingReadyRetry);
   pendingReadyRetry = null;
@@ -17900,7 +17906,7 @@ function ensureMotionPathPluginLoaded(iframe) {
   try {
     win.__hfMotionPathPluginLoading = true;
     const pluginScript = doc.createElement("script");
-    pluginScript.src = motionPathPluginUrl(win.gsap?.version);
+    pluginScript.src = previewMotionPathUrl(doc, win.gsap?.version);
     const finalize = () => {
       win.__hfMotionPathPluginLoading = false;
       try {
@@ -18086,7 +18092,7 @@ function applySoftReload(iframe, scriptText, options = {}) {
       }
       win.__hfMotionPathPluginLoading = true;
       const pluginScript = doc.createElement("script");
-      pluginScript.src = motionPathPluginUrl(win.gsap?.version);
+      pluginScript.src = previewMotionPathUrl(doc, win.gsap?.version);
       pluginScript.onload = () => {
         win.__hfMotionPathPluginLoading = false;
         executeScript();
@@ -98684,7 +98690,7 @@ function levelOf(settings) {
   return settings.shutterDeg > STRONG_ABOVE ? "strong" : "subtle";
 }
 function patchForLevel(level) {
-  return level === "off" ? { enabled: false } : { enabled: true, ...LEVEL_SETTINGS[level] };
+  return level === "off" ? { enabled: false, events: false } : { enabled: true, events: true, ...LEVEL_SETTINGS[level] };
 }
 
 // src/components/panels/MotionBlurPanel.tsx

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hyperframes/studio",
-  "version": "0.8.193",
+  "version": "0.8.194",
   "description": "",
   "repository": {
     "type": "git",
@@ -60,12 +60,12 @@
     "dockview-react": "8.3.1",
     "gsap": "^3.13.0",
     "mediabunny": "^1.45.3",
-    "@hyperframes/parsers": "0.8.193",
-    "@hyperframes/sdk": "0.8.193",
-    "@hyperframes/core": "0.8.193",
-    "@hyperframes/shader-transitions": "0.8.193",
-    "@hyperframes/studio-server": "0.8.193",
-    "@hyperframes/player": "0.8.193"
+    "@hyperframes/parsers": "0.8.194",
+    "@hyperframes/core": "0.8.194",
+    "@hyperframes/sdk": "0.8.194",
+    "@hyperframes/shader-transitions": "0.8.194",
+    "@hyperframes/player": "0.8.194",
+    "@hyperframes/studio-server": "0.8.194"
   },
   "devDependencies": {
     "@tailwindcss/vite": "^4.3.3",
@@ -82,7 +82,7 @@
     "vite": "^6.4.2",
     "vitest": "^4.1.11",
     "zustand": "^5.0.0",
-    "@hyperframes/producer": "0.8.193"
+    "@hyperframes/producer": "0.8.194"
   },
   "peerDependencies": {
     "react": "19",

package/src/components/panels/MotionBlurPanel.test.tsx

@@ -130,20 +130,29 @@ describe("MotionBlurPanel", () => {
     expect(html).toContain('data-motion-blur-samples="64"');
   });
 
-  it("Off removes data-motion-blur and leaves every other setting on the root", async () => {
+  it("Off removes data-motion-blur and its events, and leaves the other settings on the root", async () => {
     const host = await mount(
       ' data-motion-blur="on" data-motion-blur-shutter="720" data-motion-blur-samples="64" data-motion-blur-tier="filter" data-motion-blur-events="on"',
     );
     await click(radio(host, "Off"));
     const html = files["index.html"] ?? "";
     expect(html).not.toContain('data-motion-blur="on"');
-    for (const kept of ['shutter="720"', 'samples="64"', 'tier="filter"', 'events="on"']) {
+    expect(html).not.toContain("data-motion-blur-events");
+    for (const kept of ['shutter="720"', 'samples="64"', 'tier="filter"']) {
       expect(html).toContain(`data-motion-blur-${kept}`);
     }
   });
 
+  it("turns the events attribute on with Subtle and Strong, so callback-driven motion is found", async () => {
+    const host = await mount();
+    await click(radio(host, "Subtle"));
+    expect(files["index.html"]).toContain('data-motion-blur-events="on"');
+    await click(radio(host, "Strong"));
+    expect(files["index.html"]).toContain('data-motion-blur-events="on"');
+  });
+
   it("writes nothing when the chosen level is already set", async () => {
-    const host = await mount(' data-motion-blur="on"');
+    const host = await mount(' data-motion-blur="on" data-motion-blur-events="on"');
     await click(radio(host, "Subtle"));
     expect(writeProjectFile).not.toHaveBeenCalled();
   });

package/src/components/panels/motionBlurPanelModel.test.ts

@@ -130,9 +130,19 @@ describe("levelOf and patchForLevel", () => {
   });
 
   it("sets Subtle to the default blur and Strong to the maximum, and leaves the rest alone for Off", () => {
-    expect(patchForLevel("subtle")).toEqual({ enabled: true, shutterDeg: 240, samples: null });
-    expect(patchForLevel("strong")).toEqual({ enabled: true, shutterDeg: 720, samples: 64 });
-    expect(patchForLevel("off")).toEqual({ enabled: false });
+    expect(patchForLevel("subtle")).toEqual({
+      enabled: true,
+      events: true,
+      shutterDeg: 240,
+      samples: null,
+    });
+    expect(patchForLevel("strong")).toEqual({
+      enabled: true,
+      events: true,
+      shutterDeg: 720,
+      samples: 64,
+    });
+    expect(patchForLevel("off")).toEqual({ enabled: false, events: false });
   });
 
   it("reads back as the level that was chosen", () => {

package/src/components/panels/motionBlurPanelModel.ts

@@ -92,7 +92,9 @@ export function levelOf(settings: MotionBlurSettings): BlurLevel {
   return settings.shutterDeg > STRONG_ABOVE ? "strong" : "subtle";
 }
 
-/** What choosing `level` changes; Off leaves the shutter, samples and every other setting where they were. */
+/** What choosing `level` changes; blur on turns events on too, and Off leaves the shutter, samples and the rest alone. */
 export function patchForLevel(level: BlurLevel): Partial<MotionBlurSettings> {
-  return level === "off" ? { enabled: false } : { enabled: true, ...LEVEL_SETTINGS[level] };
+  return level === "off"
+    ? { enabled: false, events: false }
+    : { enabled: true, events: true, ...LEVEL_SETTINGS[level] };
 }

package/src/utils/gsapSoftReload.test.ts

@@ -318,6 +318,28 @@ window.__timelines["root"] = tl;`;
     expect(contentWindow.__hfMotionPathPluginLoading).toBe(false);
   });
 
+  it("loads a missing soft-reload plugin from the iframe mirror and reports its failure", () => {
+    const { iframe, contentWindow } = buildMockIframe({
+      gsap: { timeline: vi.fn(), registerPlugin: vi.fn(), version: "3.14.2" },
+    });
+    const head = iframe.contentDocument!.head;
+    const meta = document.createElement("meta");
+    meta.name = "hyperframes-gsap-base-url";
+    meta.content = "http://localhost:8080/vendor/npm";
+    head.appendChild(meta);
+    const onAsyncFailure = vi.fn();
+    expect(applySoftReload(iframe, MOTION_PATH_SCRIPT_TEXT, { onAsyncFailure })).toBe("applied");
+    const plugin = head.querySelector("script");
+    expect(plugin?.src).toBe(
+      "http://localhost:8080/vendor/npm/gsap@3.14.2/dist/MotionPathPlugin.min.js",
+    );
+    plugin?.onerror?.(new Event("error"));
+    expect(onAsyncFailure).toHaveBeenCalledTimes(1);
+    expect(contentWindow.__hfForceTimelineRebind).not.toHaveBeenCalled();
+    expect(contentWindow.__hfMotionPathPluginLoading).toBe(false);
+    expect(head.querySelectorAll("script")).toHaveLength(1);
+  });
+
   it('returns "cannot-soft-reload" when multiple GSAP scripts exist (ambiguous)', () => {
     const script1 = document.createElement("script");
     script1.textContent = "const tl = gsap.timeline({ paused: true });";
@@ -490,6 +512,26 @@ describe("ensureMotionPathPluginLoaded", () => {
     );
   });
 
+  it("preloads from the iframe mirror once, retaining the runtime version", () => {
+    const { iframe, appendedScripts, contentWindow, registerPlugin } = buildBootstrapIframe({
+      gsap: { version: "3.14.2", registerPlugin: vi.fn() },
+    });
+    const meta = document.createElement("meta");
+    meta.name = "hyperframes-gsap-base-url";
+    meta.content = "http://localhost:8080/vendor/npm";
+    iframe.contentDocument!.head.appendChild(meta);
+    ensureMotionPathPluginLoaded(iframe);
+    ensureMotionPathPluginLoaded(iframe);
+    expect(appendedScripts).toHaveLength(1);
+    expect(appendedScripts[0]!.src).toBe(
+      "http://localhost:8080/vendor/npm/gsap@3.14.2/dist/MotionPathPlugin.min.js",
+    );
+    appendedScripts[0]!.onerror?.(new Event("error"));
+    expect(contentWindow.__hfMotionPathPluginLoading).toBe(false);
+    expect(registerPlugin).not.toHaveBeenCalled();
+    expect(appendedScripts).toHaveLength(1);
+  });
+
   it("appends the plugin script once and registers it on load", () => {
     const { iframe, contentWindow, appendedScripts, registerPlugin } = buildBootstrapIframe();
     ensureMotionPathPluginLoaded(iframe);

package/src/utils/gsapSoftReload.ts

@@ -1,5 +1,5 @@
 import { COLOR_GRADING_SOURCE_HIDDEN_ATTR } from "@hyperframes/core/color-grading";
-import { motionPathPluginUrl } from "@hyperframes/core/gsap-cdn";
+import { GSAP_BASE_URL_META, motionPathPluginUrl } from "@hyperframes/core/gsap-cdn";
 import { findAuthoredElement } from "./authoredSource";
 import { applyAuthoredInlineOpacity, readStampedAuthoredOpacity } from "./authoredOpacity";
 import {
@@ -50,6 +50,13 @@ type IframeWindow = Window & {
 // At most one preview waits for its runtime; a newer load replaces it, so a frame that never boots is not kept alive.
 let pendingReadyRetry: ((event: MessageEvent) => void) | null = null;
 
+function previewMotionPathUrl(doc: Document, version?: string): string {
+  const baseUrl = doc.head.querySelector<HTMLMetaElement>(
+    `meta[name="${GSAP_BASE_URL_META}"]`,
+  )?.content;
+  return motionPathPluginUrl(version, baseUrl);
+}
+
 export function ensureMotionPathPluginLoaded(iframe: HTMLIFrameElement | null): void {
   if (pendingReadyRetry) window.removeEventListener("message", pendingReadyRetry);
   pendingReadyRetry = null;
@@ -86,7 +93,7 @@ export function ensureMotionPathPluginLoaded(iframe: HTMLIFrameElement | null):
   try {
     win.__hfMotionPathPluginLoading = true;
     const pluginScript = doc.createElement("script");
-    pluginScript.src = motionPathPluginUrl(win.gsap?.version);
+    pluginScript.src = previewMotionPathUrl(doc, win.gsap?.version);
     const finalize = () => {
       win.__hfMotionPathPluginLoading = false;
       try {
@@ -480,7 +487,7 @@ export function applySoftReload(
       }
       win.__hfMotionPathPluginLoading = true;
       const pluginScript = doc.createElement("script");
-      pluginScript.src = motionPathPluginUrl(win.gsap?.version);
+      pluginScript.src = previewMotionPathUrl(doc, win.gsap?.version);
       pluginScript.onload = () => {
         win.__hfMotionPathPluginLoading = false;
         executeScript();