@remotion/studio-server 4.0.501 → 4.0.503

package/dist/routes.js

@@ -39,7 +39,6 @@ const node_fs_1 = require("node:fs");
 const node_path_1 = __importStar(require("node:path"));
 const node_url_1 = require("node:url");
 const bundler_1 = require("@remotion/bundler");
-const drag_and_drop_1 = require("@remotion/drag-and-drop");
 const renderer_1 = require("@remotion/renderer");
 const studio_shared_1 = require("@remotion/studio-shared");
 const better_opn_1 = require("./better-opn");
@@ -48,19 +47,18 @@ const get_file_source_1 = require("./helpers/get-file-source");
 const get_installed_installable_packages_1 = require("./helpers/get-installed-installable-packages");
 const resolve_output_path_1 = require("./helpers/resolve-output-path");
 const api_routes_1 = require("./preview-server/api-routes");
-const element_install_state_1 = require("./preview-server/element-install-state");
 const get_package_manager_1 = require("./preview-server/get-package-manager");
 const get_static_file_fallback_hint_1 = require("./preview-server/get-static-file-fallback-hint");
 const handler_1 = require("./preview-server/handler");
-const parse_body_1 = require("./preview-server/parse-body");
 const public_folder_1 = require("./preview-server/public-folder");
 const open_in_editor_1 = require("./preview-server/routes/open-in-editor");
 const serve_static_1 = require("./preview-server/serve-static");
+const handle_discovery_1 = require("./preview-server/studio-protocol/handle-discovery");
+const handle_install_1 = require("./preview-server/studio-protocol/handle-install");
+const origin_policy_1 = require("./preview-server/studio-protocol/origin-policy");
 const validate_same_origin_1 = require("./preview-server/validate-same-origin");
 const watch_ignore_next_change_1 = require("./preview-server/watch-ignore-next-change");
 const loggedStaticFileHints = new Set();
-const ELEMENT_INSTALL_FOCUS_MAX_AGE = 5 * 60 * 1000;
-const ELEMENT_INSTALL_TARGET_RESPONSE_WAIT = 250;
 const static404 = (response) => {
     response.writeHead(404);
     response.end('The static/ prefix has been changed, this URL is no longer valid.');
@@ -84,148 +82,7 @@ const handleRemotionConfig = (response, remotionRoot) => {
     response.end(JSON.stringify(body));
     return Promise.resolve();
 };
-const isAllowedElementInstallOrigin = (origin) => {
-    if (!origin) {
-        return false;
-    }
-    try {
-        const url = new URL(origin);
-        return ((url.protocol === 'https:' &&
-            (url.hostname === 'remotion.dev' ||
-                url.hostname === 'www.remotion.dev')) ||
-            (url.protocol === 'http:' &&
-                (url.hostname === 'localhost' || url.hostname === '127.0.0.1')));
-    }
-    catch (_a) {
-        return false;
-    }
-};
-const setElementInstallCorsHeaders = ({ request, response, }) => {
-    const { origin } = request.headers;
-    if (isAllowedElementInstallOrigin(origin)) {
-        response.setHeader('Access-Control-Allow-Origin', origin);
-        response.setHeader('Vary', 'Origin');
-        response.setHeader('Access-Control-Allow-Methods', 'GET, POST, OPTIONS');
-        response.setHeader('Access-Control-Allow-Headers', 'Content-Type');
-        response.setHeader('Access-Control-Max-Age', '600');
-        response.setHeader('Access-Control-Allow-Private-Network', 'true');
-    }
-};
-const handleElementInstallOptions = ({ request, response, }) => {
-    setElementInstallCorsHeaders({ request, response });
-    response.writeHead(isAllowedElementInstallOrigin(request.headers.origin) ? 204 : 403);
-    response.end();
-    return Promise.resolve();
-};
-const handleElementInstallTarget = ({ liveEventsServer, request, response, remotionRoot, gitSource, }) => {
-    if (!isAllowedElementInstallOrigin(request.headers.origin)) {
-        response.writeHead(403);
-        response.end(JSON.stringify({ success: false, reason: 'Origin not allowed' }));
-        return Promise.resolve();
-    }
-    const requestId = `${Date.now()}-${Math.random().toString(16).slice(2)}`;
-    liveEventsServer.sendEventToClient({
-        type: 'request-element-install-target',
-        requestId,
-    });
-    return new Promise((resolve) => {
-        setTimeout(() => {
-            var _a, _b, _c, _d, _e;
-            const target = (0, element_install_state_1.getElementInstallTarget)(requestId);
-            const now = Date.now();
-            const targetIsLive = target !== null &&
-                now - target.updatedAt < element_install_state_1.ELEMENT_INSTALL_TARGET_MAX_AGE;
-            const host = (_a = request.headers.host) !== null && _a !== void 0 ? _a : null;
-            const port = (_b = host === null || host === void 0 ? void 0 : host.split(':').at(-1)) !== null && _b !== void 0 ? _b : null;
-            setElementInstallCorsHeaders({ request, response });
-            response.writeHead(200, { 'Content-Type': 'application/json' });
-            response.end(JSON.stringify({
-                type: 'remotion-studio',
-                projectName: (0, studio_shared_1.getProjectName)({
-                    basename: node_path_1.default.basename,
-                    gitSource,
-                    resolvedRemotionRoot: remotionRoot,
-                }),
-                port: port === null ? null : Number(port),
-                lastFocusedAt: (_c = target === null || target === void 0 ? void 0 : target.lastFocusedAt) !== null && _c !== void 0 ? _c : null,
-                canInstall: target !== null && target.canInstall && targetIsLive,
-                activeCompositionId: (_d = target === null || target === void 0 ? void 0 : target.compositionId) !== null && _d !== void 0 ? _d : null,
-                readOnly: (_e = target === null || target === void 0 ? void 0 : target.readOnly) !== null && _e !== void 0 ? _e : false,
-            }));
-            resolve();
-        }, ELEMENT_INSTALL_TARGET_RESPONSE_WAIT);
-    });
-};
-const handleRequestElementInstall = async ({ liveEventsServer, request, response, }) => {
-    if (!isAllowedElementInstallOrigin(request.headers.origin)) {
-        response.writeHead(403);
-        response.end(JSON.stringify({ success: false, reason: 'Origin not allowed' }));
-        return;
-    }
-    setElementInstallCorsHeaders({ request, response });
-    response.setHeader('Content-Type', 'application/json');
-    try {
-        const body = await (0, parse_body_1.parseRequestBody)(request);
-        const { mimeType, payload } = body;
-        const parsed = typeof mimeType === 'string' && typeof payload === 'string'
-            ? drag_and_drop_1.DragAndDropInternals.parseDragData({ mimeType, payload })
-            : null;
-        if ((parsed === null || parsed === void 0 ? void 0 : parsed.type) !== 'element') {
-            response.writeHead(400);
-            response.end(JSON.stringify({ success: false, reason: 'Invalid Element payload' }));
-            return;
-        }
-        const target = (0, element_install_state_1.getElementInstallTarget)(null);
-        const now = Date.now();
-        const targetIsLive = target !== null &&
-            now - target.updatedAt < element_install_state_1.ELEMENT_INSTALL_TARGET_MAX_AGE;
-        const targetWasRecentlyFocused = target !== null &&
-            target.lastFocusedAt !== null &&
-            now - target.lastFocusedAt < ELEMENT_INSTALL_FOCUS_MAX_AGE;
-        if (target === null ||
-            !target.canInstall ||
-            target.compositionFile === null ||
-            target.compositionId === null ||
-            !targetIsLive ||
-            !targetWasRecentlyFocused) {
-            response.writeHead(409);
-            response.end(JSON.stringify({
-                success: false,
-                reason: 'No focused writable Remotion Studio composition',
-            }));
-            return;
-        }
-        const installRequest = {
-            id: `${Date.now()}-${Math.random().toString(16).slice(2)}`,
-            clientId: target.clientId,
-            createdAt: Date.now(),
-            compositionFile: target.compositionFile,
-            compositionId: target.compositionId,
-            element: parsed.data.element,
-            position: null,
-        };
-        const delivered = liveEventsServer.sendEventToClientId(target.clientId, {
-            type: 'element-install-request',
-            request: installRequest,
-        });
-        if (delivered === false) {
-            response.writeHead(409);
-            response.end(JSON.stringify({
-                success: false,
-                reason: 'The selected Remotion Studio tab is no longer connected',
-            }));
-            return;
-        }
-        (0, better_opn_1.focusBrowserTab)({ url: target.studioUrl }).catch(() => undefined);
-        response.writeHead(200);
-        response.end(JSON.stringify({ success: true, status: 'sent' }));
-    }
-    catch (err) {
-        response.writeHead(500);
-        response.end(JSON.stringify({ success: false, reason: err.message }));
-    }
-};
-const handleFallback = async ({ remotionRoot, hash, response, request, getCurrentInputProps, getEnvVariables, publicDir, getRenderQueue, getRenderDefaults, getNumberOfAudioTags, getAudioLatencyHint, getPreviewSampleRate, gitSource, logLevel, enableCrossSiteIsolation, getStudioRuntimeConfig, }) => {
+const handleFallback = async ({ remotionRoot, hash, response, request, getCurrentInputProps, getEnvVariables, publicDir, getRenderQueue, getRenderDefaults, getNumberOfAudioTags, getAudioLatencyHint, getPreviewSampleRate, gitSource, logLevel, enableCrossSiteIsolation, getStudioRuntimeConfig, getDefaultEditor, }) => {
     var _a, _b;
     const acceptsHtml = ((_a = request.headers.accept) !== null && _a !== void 0 ? _a : '').includes('text/html');
     if (request.method === 'GET' && acceptsHtml) {
@@ -248,7 +105,7 @@ const handleFallback = async ({ remotionRoot, hash, response, request, getCurren
             `Change \`"${pathname}"\` to \`staticFile("${pathname}")\` to fix the error.`,
         ].join('\n'));
     }
-    const displayName = await (0, open_in_editor_1.getEditorName)();
+    const displayName = await (0, open_in_editor_1.getEditorName)({ getDefaultEditor, logLevel });
     response.setHeader('content-type', 'text/html');
     if (enableCrossSiteIsolation) {
         response.setHeader('Cross-Origin-Opener-Policy', 'same-origin');
@@ -394,7 +251,7 @@ const handleBeep = (_, response) => {
     readStream.pipe(response);
     return Promise.resolve();
 };
-const handleRoutes = ({ staticHash, staticHashPrefix, outputHash, outputHashPrefix, request, response, liveEventsServer, getCurrentInputProps, getEnvVariables, remotionRoot, entryPoint, publicDir, logLevel, getRenderQueue, getRenderDefaults, getNumberOfAudioTags, queueMethods: methods, gitSource, binariesDirectory, getAudioLatencyHint, getPreviewSampleRate, enableCrossSiteIsolation, getStudioRuntimeConfig, configFile, }) => {
+const handleRoutes = ({ staticHash, staticHashPrefix, outputHash, outputHashPrefix, request, response, liveEventsServer, getCurrentInputProps, getEnvVariables, remotionRoot, entryPoint, publicDir, logLevel, getRenderQueue, getRenderDefaults, getNumberOfAudioTags, queueMethods: methods, gitSource, binariesDirectory, getAudioLatencyHint, getPreviewSampleRate, enableCrossSiteIsolation, getStudioRuntimeConfig, getDefaultEditor, configFile, }) => {
     const url = new URL(request.url, 'http://localhost');
     if (url.pathname === '/api/file-source') {
         return handleFileSource({
@@ -421,21 +278,24 @@ const handleRoutes = ({ staticHash, staticHashPrefix, outputHash, outputHashPref
             remotionRoot,
         });
     }
-    if (url.pathname === '/api/element-install-target' ||
-        url.pathname === '/api/request-element-install') {
+    if (url.pathname === '/api/studio-protocol' ||
+        url.pathname === '/api/studio-protocol/install') {
         if (request.method === 'OPTIONS') {
-            return handleElementInstallOptions({ request, response });
+            return (0, origin_policy_1.handleStudioProtocolOptions)({ request, response });
         }
-        if (url.pathname === '/api/element-install-target') {
-            return handleElementInstallTarget({
+        if (url.pathname === '/api/studio-protocol') {
+            return (0, handle_discovery_1.handleStudioProtocolDiscovery)({
+                gitSource,
                 liveEventsServer,
+                remotionRoot,
                 request,
                 response,
-                remotionRoot,
-                gitSource,
             });
         }
-        return handleRequestElementInstall({
+        return (0, handle_install_1.handleStudioProtocolInstall)({
+            focusStudioTab: (studioUrl) => {
+                (0, better_opn_1.focusBrowserTab)({ url: studioUrl }).catch(() => undefined);
+            },
             liveEventsServer,
             request,
             response,
@@ -454,6 +314,7 @@ const handleRoutes = ({ staticHash, staticHashPrefix, outputHash, outputHashPref
                 binariesDirectory,
                 publicDir,
                 configFile,
+                getDefaultEditor,
             });
         }
     }
@@ -514,6 +375,7 @@ const handleRoutes = ({ staticHash, staticHashPrefix, outputHash, outputHashPref
         getPreviewSampleRate,
         enableCrossSiteIsolation,
         getStudioRuntimeConfig,
+        getDefaultEditor,
     });
 };
 exports.handleRoutes = handleRoutes;

package/dist/start-studio.d.ts

@@ -1,4 +1,5 @@
 import type { BundlerOverrideFn, RspackOverrideFn, WebpackOverrideFn } from '@remotion/bundler';
+import type { DefaultEditor } from '@remotion/renderer';
 import type { GitSource, RenderDefaults, RenderJob, StudioRuntimeConfig } from '@remotion/studio-shared';
 import type { QueueMethods } from './preview-server/api-types';
 export type StartStudioResult = {
@@ -6,7 +7,7 @@ export type StartStudioResult = {
 } | {
     type: 'already-running';
 };
-export declare const startStudio: ({ browserArgs, browserFlag, shouldOpenBrowser, fullEntryPath, logLevel, getCurrentInputProps, getEnvVariables, desiredPort, remotionRoot, relativePublicDir, bundlerOverride, rspackOverride, webpackOverride, poll, getRenderDefaults, getRenderQueue, getNumberOfAudioTags, queueMethods, previewEntry, gitSource, binariesDirectory, forceIPv4, getAudioLatencyHint, getPreviewSampleRate, enableCrossSiteIsolation, forceNew, rspack, getStudioRuntimeConfig, configFile, }: {
+export declare const startStudio: ({ browserArgs, browserFlag, shouldOpenBrowser, fullEntryPath, logLevel, getCurrentInputProps, getEnvVariables, desiredPort, remotionRoot, relativePublicDir, bundlerOverride, rspackOverride, webpackOverride, poll, getRenderDefaults, getRenderQueue, getNumberOfAudioTags, queueMethods, previewEntry, gitSource, binariesDirectory, forceIPv4, getAudioLatencyHint, getPreviewSampleRate, enableCrossSiteIsolation, forceNew, rspack, getStudioRuntimeConfig, getDefaultEditor, configFile, }: {
     browserArgs: string;
     browserFlag: string;
     logLevel: "error" | "info" | "trace" | "verbose" | "warn";
@@ -35,5 +36,6 @@ export declare const startStudio: ({ browserArgs, browserFlag, shouldOpenBrowser
     forceNew: boolean;
     rspack: boolean;
     getStudioRuntimeConfig: () => StudioRuntimeConfig;
+    getDefaultEditor: () => DefaultEditor | null;
     configFile: string | null;
 }) => Promise<StartStudioResult>;

package/dist/start-studio.js

@@ -19,7 +19,7 @@ const public_folder_1 = require("./preview-server/public-folder");
 const start_server_1 = require("./preview-server/start-server");
 const server_ready_1 = require("./server-ready");
 const watch_root_file_1 = require("./watch-root-file");
-const startStudio = async ({ browserArgs, browserFlag, shouldOpenBrowser, fullEntryPath, logLevel, getCurrentInputProps, getEnvVariables, desiredPort, remotionRoot, relativePublicDir, bundlerOverride, rspackOverride, webpackOverride, poll, getRenderDefaults, getRenderQueue, getNumberOfAudioTags, queueMethods, previewEntry, gitSource, binariesDirectory, forceIPv4, getAudioLatencyHint, getPreviewSampleRate, enableCrossSiteIsolation, forceNew, rspack, getStudioRuntimeConfig, configFile, }) => {
+const startStudio = async ({ browserArgs, browserFlag, shouldOpenBrowser, fullEntryPath, logLevel, getCurrentInputProps, getEnvVariables, desiredPort, remotionRoot, relativePublicDir, bundlerOverride, rspackOverride, webpackOverride, poll, getRenderDefaults, getRenderQueue, getNumberOfAudioTags, queueMethods, previewEntry, gitSource, binariesDirectory, forceIPv4, getAudioLatencyHint, getPreviewSampleRate, enableCrossSiteIsolation, forceNew, rspack, getStudioRuntimeConfig, getDefaultEditor, configFile, }) => {
     try {
         if (typeof Bun === 'undefined') {
             process.title = 'node (npx remotion studio)';
@@ -93,6 +93,7 @@ const startStudio = async ({ browserArgs, browserFlag, shouldOpenBrowser, fullEn
         forceNew,
         rspack,
         getStudioRuntimeConfig,
+        getDefaultEditor,
         configFile,
     });
     if (result.type === 'already-running') {

package/package.json

@@ -3,7 +3,7 @@
 		"url": "https://github.com/remotion-dev/remotion/tree/main/packages/studio-server"
 	},
 	"name": "@remotion/studio-server",
-	"version": "4.0.501",
+	"version": "4.0.503",
 	"description": "Run a Remotion Studio with a server backend",
 	"main": "dist",
 	"scripts": {
@@ -23,20 +23,21 @@
 		"access": "public"
 	},
 	"dependencies": {
-		"@remotion/drag-and-drop": "4.0.501",
+		"@remotion/studio-protocol": "4.0.503",
 		"@babel/types": "7.24.0",
 		"@babel/parser": "7.24.1",
 		"@svgr/core": "8.1.0",
 		"@svgr/plugin-jsx": "8.1.0",
 		"kiwi-schema": "0.5.0",
 		"semver": "7.5.3",
+		"zod": "4.4.3",
 		"prettier": "3.8.1",
-		"remotion": "4.0.501",
+		"remotion": "4.0.503",
 		"recast": "0.23.11",
-		"@remotion/bundler": "4.0.501",
-		"@remotion/renderer": "4.0.501",
-		"@remotion/studio-codemods": "4.0.501",
-		"@remotion/studio-shared": "4.0.501",
+		"@remotion/bundler": "4.0.503",
+		"@remotion/renderer": "4.0.503",
+		"@remotion/studio-codemods": "4.0.503",
+		"@remotion/studio-shared": "4.0.503",
 		"memfs": "3.4.3",
 		"open": "8.4.2"
 	},
@@ -44,7 +45,7 @@
 		"ast-types": "0.16.1",
 		"react": "19.2.3",
 		"@types/semver": "7.5.3",
-		"@remotion/eslint-config-internal": "4.0.501",
+		"@remotion/eslint-config-internal": "4.0.503",
 		"eslint": "9.19.0",
 		"@types/node": "20.12.14",
 		"@typescript/native-preview": "7.0.0-dev.20260217.1"