@remotion/studio 4.0.439 → 4.0.440

package/dist/esm/renderEntry.mjs

@@ -208,7 +208,7 @@ var renderContent = (Root) => {
     renderToDOM(/* @__PURE__ */ jsx("div", {
       children: /* @__PURE__ */ jsx(DelayedSpinner, {})
     }));
-    import("./chunk-nnz9f1vq.js").then(({ StudioInternals }) => {
+    import("./chunk-1x2ychmc.js").then(({ StudioInternals }) => {
       window.remotion_isStudio = true;
       window.remotion_isReadOnlyStudio = true;
       window.remotion_inputProps = "{}";

package/dist/helpers/client-id.js

@@ -63,7 +63,7 @@ const PreviewServerConnection = ({ children, readOnlyStudio }) => {
     const openEventSource = (0, react_1.useCallback)(() => {
         const source = new EventSource('/events');
         source.addEventListener('message', (event) => {
-            var _a, _b;
+            var _a, _b, _c;
             const newEvent = JSON.parse(event.data);
             if (newEvent.type === 'new-input-props' ||
                 newEvent.type === 'new-env-variables') {
@@ -108,6 +108,9 @@ const PreviewServerConnection = ({ children, readOnlyStudio }) => {
                     detail: payload,
                 }));
             }
+            if (newEvent.type === 'hmr') {
+                (_c = window.__remotion_processHmrEvent) === null || _c === void 0 ? void 0 : _c.call(window, newEvent.hmrEvent);
+            }
             listeners.current.forEach((l) => {
                 if (l.type === newEvent.type) {
                     l.listener(newEvent);

package/dist/helpers/render-modal-sections.d.ts

@@ -1,6 +1,6 @@
 import type { RenderType } from '../components/RenderModal/RenderModalAdvanced';
 type Section = 'general' | 'picture' | 'advanced' | 'data' | 'gif' | 'audio';
-export declare const useRenderModalSections: (renderMode: RenderType, codec: "aac" | "gif" | "h264" | "h264-mkv" | "h264-ts" | "h265" | "mp3" | "prores" | "vp8" | "vp9" | "wav") => {
+export declare const useRenderModalSections: (renderMode: RenderType, codec: "aac" | "av1" | "gif" | "h264" | "h264-mkv" | "h264-ts" | "h265" | "mp3" | "prores" | "vp8" | "vp9" | "wav") => {
     tab: Section;
     setTab: import("react").Dispatch<import("react").SetStateAction<Section>>;
     shownTabs: Section[];

package/dist/helpers/timeline-layout.d.ts

@@ -16,4 +16,4 @@ export type SchemaFieldInfo = {
 };
 export declare const getSchemaFields: (controls: SequenceControls | null) => SchemaFieldInfo[] | null;
 export declare const getExpandedTrackHeight: (controls: SequenceControls | null) => number;
-export declare const getTimelineLayerHeight: (type: "other" | "video") => 25 | 50;
+export declare const getTimelineLayerHeight: (type: "audio" | "image" | "other" | "sequence" | "video") => 25 | 50;

package/dist/helpers/timeline-layout.js

@@ -44,7 +44,7 @@ const getExpandedTrackHeight = (controls) => {
 };
 exports.getExpandedTrackHeight = getExpandedTrackHeight;
 const getTimelineLayerHeight = (type) => {
-    if (type === 'video') {
+    if (type === 'video' || type === 'image') {
         return 50;
     }
     return 25;

package/dist/hot-middleware-client/client.d.ts

@@ -4,15 +4,10 @@
  * and rewritten in TypeScript. This file is MIT licensed
  */
 import type { HotMiddlewareMessage } from '@remotion/studio-shared';
-declare function eventSourceWrapper(): {
-    addMessageListener(fn: (msg: MessageEvent<any>) => void): void;
-};
 declare global {
     interface Window {
-        __whmEventSourceWrapper: {
-            [key: string]: ReturnType<typeof eventSourceWrapper>;
-        };
         __webpack_hot_middleware_reporter__: Reporter;
+        __remotion_processHmrEvent?: (hmrEvent: HotMiddlewareMessage) => void;
     }
 }
 type Reporter = ReturnType<typeof createReporter>;

package/dist/hot-middleware-client/client.js

@@ -5,70 +5,6 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.enableHotMiddleware = void 0;
 const studio_shared_1 = require("@remotion/studio-shared");
 const process_update_1 = require("./process-update");
-function eventSourceWrapper() {
-    let source;
-    let lastActivity = Date.now();
-    const listeners = [];
-    init();
-    const timer = setInterval(() => {
-        if (Date.now() - lastActivity > studio_shared_1.hotMiddlewareOptions.timeout) {
-            handleDisconnect();
-        }
-    }, studio_shared_1.hotMiddlewareOptions.timeout / 2);
-    function init() {
-        source = new window.EventSource(studio_shared_1.hotMiddlewareOptions.path);
-        source.onopen = handleOnline;
-        source.onerror = handleDisconnect;
-        source.onmessage = handleMessage;
-    }
-    function handleOnline() {
-        lastActivity = Date.now();
-    }
-    function handleMessage(event) {
-        lastActivity = Date.now();
-        for (let i = 0; i < listeners.length; i++) {
-            listeners[i](event);
-        }
-    }
-    function handleDisconnect() {
-        clearInterval(timer);
-        source.close();
-        setTimeout(init, 1000);
-    }
-    return {
-        addMessageListener(fn) {
-            listeners.push(fn);
-        },
-    };
-}
-function getEventSourceWrapper() {
-    if (!window.__whmEventSourceWrapper) {
-        window.__whmEventSourceWrapper = {};
-    }
-    if (!window.__whmEventSourceWrapper[studio_shared_1.hotMiddlewareOptions.path]) {
-        // cache the wrapper for other entries loaded on
-        // the same page with the same hotMiddlewareOptions.path
-        window.__whmEventSourceWrapper[studio_shared_1.hotMiddlewareOptions.path] =
-            eventSourceWrapper();
-    }
-    return window.__whmEventSourceWrapper[studio_shared_1.hotMiddlewareOptions.path];
-}
-function connect() {
-    getEventSourceWrapper().addMessageListener(handleMessage);
-    function handleMessage(event) {
-        if (event.data === '\uD83D\uDC93') {
-            return;
-        }
-        try {
-            processMessage(JSON.parse(event.data));
-        }
-        catch (ex) {
-            if (studio_shared_1.hotMiddlewareOptions.warn) {
-                console.warn('Invalid HMR message: ' + event.data + '\n' + ex);
-            }
-        }
-    }
-}
 function createReporter() {
     const styles = {
         errors: 'color: #ff0000;',
@@ -153,20 +89,33 @@ function processMessage(obj) {
 let reporter;
 const singletonKey = '__webpack_hot_middleware_reporter__';
 const enableHotMiddleware = () => {
-    if (typeof window === 'undefined') {
-        // do nothing
-    }
-    else if (typeof window.EventSource === 'undefined') {
-        console.warn('Unsupported browser: You need a browser that supports EventSource ');
-    }
-    else {
-        connect();
-    }
     if (typeof window !== 'undefined') {
         if (!window[singletonKey]) {
             window[singletonKey] = createReporter();
         }
         reporter = window[singletonKey];
     }
+    window.__remotion_processHmrEvent = (hmrEvent) => {
+        processMessage(hmrEvent);
+    };
+    // Create a standalone SSE listener for HMR events immediately.
+    // This is needed because lazy-compiled modules require HMR updates
+    // to deliver compiled code, but the React-managed /events SSE
+    // (in PreviewServerConnection) only connects after React mounts —
+    // which itself depends on lazy modules loading first.
+    if (typeof window !== 'undefined' && typeof EventSource !== 'undefined') {
+        const source = new EventSource('/events');
+        source.addEventListener('message', (event) => {
+            try {
+                const parsed = JSON.parse(event.data);
+                if (parsed.type === 'hmr') {
+                    processMessage(parsed.hmrEvent);
+                }
+            }
+            catch (_a) {
+                // Ignore parse errors
+            }
+        });
+    }
 };
 exports.enableHotMiddleware = enableHotMiddleware;

package/dist/hot-middleware-client/process-update.d.ts

@@ -10,9 +10,7 @@
  */
 import type { ModuleMap } from '@remotion/studio-shared';
 export declare const processUpdate: (hash: string | undefined, moduleMap: ModuleMap, options: {
-    path: string;
     timeout: number;
     reload: boolean;
     warn: boolean;
-    heartbeat: number;
 }) => void;

package/package.json

@@ -3,7 +3,7 @@
 		"url": "https://github.com/remotion-dev/remotion/tree/main/packages/studio"
 	},
 	"name": "@remotion/studio",
-	"version": "4.0.439",
+	"version": "4.0.440",
 	"description": "APIs for interacting with the Remotion Studio",
 	"main": "dist",
 	"sideEffects": false,
@@ -26,13 +26,13 @@
 	},
 	"dependencies": {
 		"semver": "7.5.3",
-		"remotion": "4.0.439",
-		"@remotion/player": "4.0.439",
-		"@remotion/media-utils": "4.0.439",
-		"@remotion/renderer": "4.0.439",
-		"@remotion/web-renderer": "4.0.439",
-		"@remotion/studio-shared": "4.0.439",
-		"@remotion/zod-types": "4.0.439",
+		"remotion": "4.0.440",
+		"@remotion/player": "4.0.440",
+		"@remotion/media-utils": "4.0.440",
+		"@remotion/renderer": "4.0.440",
+		"@remotion/web-renderer": "4.0.440",
+		"@remotion/studio-shared": "4.0.440",
+		"@remotion/zod-types": "4.0.440",
 		"mediabunny": "1.39.2",
 		"memfs": "3.4.3",
 		"source-map": "0.7.3",
@@ -43,7 +43,7 @@
 		"react": "19.2.3",
 		"react-dom": "19.2.3",
 		"@types/semver": "^7.3.4",
-		"@remotion/eslint-config-internal": "4.0.439",
+		"@remotion/eslint-config-internal": "4.0.440",
 		"eslint": "9.19.0",
 		"@typescript/native-preview": "7.0.0-dev.20260217.1"
 	},