@remotion/studio-server 4.0.517 → 4.0.519

package/dist/codemods/delete-jsx-node.d.ts

@@ -9,10 +9,7 @@ export declare const deleteJsxNodes: ({ input, nodePaths, }: {
     formatted: boolean;
     nodeLabels: string[];
     logLines: number[];
-    nodePathRemappings: {
-        oldNodePath: SequenceNodePath;
-        newNodePath: SequenceNodePath | null;
-    }[];
+    nodePathRemappings: import("@remotion/studio-shared").SequenceNodePathRemapping[];
 }>;
 export declare const deleteJsxNode: ({ input, nodePath, }: {
     input: string;

package/dist/codemods/duplicate-jsx-node.d.ts

@@ -12,3 +12,14 @@ export declare const duplicateJsxNode: ({ input, nodePath, prettierConfigOverrid
     logLine: number;
     nodePathRemappings: import("@remotion/studio-shared").SequenceNodePathRemapping[];
 }>;
+export declare const duplicateJsxNodes: ({ input, nodePaths, prettierConfigOverride, }: {
+    input: string;
+    nodePaths: SequenceNodePath[];
+    prettierConfigOverride?: Record<string, unknown> | null | undefined;
+}) => Promise<{
+    output: string;
+    formatted: boolean;
+    nodeLabels: string[];
+    logLines: number[];
+    nodePathRemappings: import("@remotion/studio-shared").SequenceNodePathRemapping[];
+}>;

package/dist/codemods/duplicate-jsx-node.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.duplicateJsxNode = exports.duplicateJsxElementAtPath = void 0;
+exports.duplicateJsxNodes = exports.duplicateJsxNode = exports.duplicateJsxElementAtPath = void 0;
 const studio_codemods_1 = require("@remotion/studio-codemods");
 Object.defineProperty(exports, "duplicateJsxElementAtPath", { enumerable: true, get: function () { return studio_codemods_1.duplicateJsxElementAtPath; } });
 const format_file_content_1 = require("./format-file-content");
@@ -14,3 +14,13 @@ const duplicateJsxNode = ({ input, nodePath, prettierConfigOverride, }) => (0, s
     prettierConfigOverride,
 });
 exports.duplicateJsxNode = duplicateJsxNode;
+const duplicateJsxNodes = ({ input, nodePaths, prettierConfigOverride, }) => (0, studio_codemods_1.duplicateJsxNodes)({
+    input,
+    nodePaths,
+    formatFile: ({ contents, prettierConfigOverride: override }) => (0, format_file_content_1.formatFileContent)({
+        input: contents,
+        prettierConfigOverride: override,
+    }),
+    prettierConfigOverride,
+});
+exports.duplicateJsxNodes = duplicateJsxNodes;

package/dist/codemods/get-node-path-remappings.d.ts

@@ -4,6 +4,7 @@ import type { SequenceNodePath } from 'remotion';
 export type CapturedJsxNodePath = {
     node: JSXOpeningElement;
     nodePath: SequenceNodePath;
+    signature: string;
 };
 export declare const captureJsxNodePaths: (ast: File) => CapturedJsxNodePath[];
 export declare const getNodePathRemappings: ({ ast, captured, output, }: {

package/dist/codemods/get-node-path-remappings.js

@@ -44,6 +44,7 @@ const captureJsxNodePaths = (ast) => {
             captured.push({
                 node: path.node,
                 nodePath: (0, can_update_sequence_props_1.getNodePathForRecastPath)(path, ast),
+                signature: recast.prettyPrint(path.node).code,
             });
             return this.traverse(path);
         },
@@ -74,15 +75,27 @@ const getNodePathRemappings = ({ ast, captured, output, }) => {
     for (let i = 0; i < nodesAfterMutation.length; i++) {
         finalNodePathByNode.set(nodesAfterMutation[i], finalNodePaths[i]);
     }
-    const nodePathRemappings = captured.flatMap(({ node, nodePath }) => {
+    const capturedNodes = new Set(captured.map(({ node }) => node));
+    const nodePathRemappings = captured.flatMap(({ node, nodePath, signature }) => {
         var _a;
         const newNodePath = (_a = finalNodePathByNode.get(node)) !== null && _a !== void 0 ? _a : null;
         if (newNodePath !== null &&
-            JSON.stringify(nodePath) === JSON.stringify(newNodePath)) {
+            JSON.stringify(nodePath) === JSON.stringify(newNodePath) &&
+            recast.prettyPrint(node).code === signature) {
             return [];
         }
         return [{ oldNodePath: nodePath, newNodePath }];
     });
+    for (const node of nodesAfterMutation) {
+        if (capturedNodes.has(node)) {
+            continue;
+        }
+        const newNodePath = finalNodePathByNode.get(node);
+        if (!newNodePath) {
+            throw new Error('Could not map inserted JSX node path');
+        }
+        nodePathRemappings.push({ oldNodePath: null, newNodePath });
+    }
     return { finalNodePathByNode, nodePathRemappings };
 };
 exports.getNodePathRemappings = getNodePathRemappings;

package/dist/codemods/split-video-from-audio.d.ts

@@ -8,8 +8,5 @@ export declare const splitVideoFromAudio: ({ input, nodePath, prettierConfigOver
     formatted: boolean;
     nodeLabel: string;
     logLine: number;
-    nodePathRemappings: {
-        oldNodePath: SequenceNodePath;
-        newNodePath: SequenceNodePath | null;
-    }[];
+    nodePathRemappings: import("@remotion/studio-shared").SequenceNodePathRemapping[];
 }>;

package/dist/helpers/open-in-editor.js

@@ -255,7 +255,7 @@ function getArgumentsForLineNumber(editor, fileName, lineNumber, colNumber) {
         editor.endsWith('/Zed Preview.app/Contents/MacOS/cli');
     const isFolder = node_fs_1.default.existsSync(fileName) && node_fs_1.default.lstatSync(fileName).isDirectory();
     if (isZedEditor) {
-        return [fileName + ':' + lineNumber + ':' + colNumber];
+        return ['--existing', fileName + ':' + lineNumber + ':' + colNumber];
     }
     switch (editorBasename) {
         case 'atom':

package/dist/preview-server/api-routes.d.ts

@@ -1,5 +1,7 @@
 import type { ApiRoutes } from '@remotion/studio-shared';
 import type { ApiHandler } from './api-types';
+type StandardApiRoute = Exclude<keyof ApiRoutes, '/api/update-config'>;
 export declare const allApiRoutes: {
-    [key in keyof ApiRoutes]: ApiHandler<ApiRoutes[key]['Request'], ApiRoutes[key]['Response']>;
+    [key in StandardApiRoute]: ApiHandler<ApiRoutes[key]['Request'], ApiRoutes[key]['Response']>;
 };
+export {};

package/dist/preview-server/api-routes.js

@@ -37,6 +37,7 @@ const prepare_element_install_1 = require("./routes/prepare-element-install");
 const project_info_1 = require("./routes/project-info");
 const redo_1 = require("./routes/redo");
 const register_client_render_1 = require("./routes/register-client-render");
+const release_notes_1 = require("./routes/release-notes");
 const remotion_skills_info_1 = require("./routes/remotion-skills-info");
 const remove_render_1 = require("./routes/remove-render");
 const rename_static_file_1 = require("./routes/rename-static-file");
@@ -57,7 +58,6 @@ const unsubscribe_from_default_props_1 = require("./routes/unsubscribe-from-defa
 const unsubscribe_from_file_existence_1 = require("./routes/unsubscribe-from-file-existence");
 const unsubscribe_from_sequence_props_1 = require("./routes/unsubscribe-from-sequence-props");
 const update_available_1 = require("./routes/update-available");
-const update_config_1 = require("./routes/update-config");
 const update_default_props_1 = require("./routes/update-default-props");
 const update_effect_keyframe_settings_1 = require("./routes/update-effect-keyframe-settings");
 const update_element_install_target_1 = require("./routes/update-element-install-target");
@@ -108,12 +108,12 @@ exports.allApiRoutes = {
     '/api/split-jsx-sequence': split_jsx_sequence_1.splitJsxSequenceHandler,
     '/api/split-video-from-audio': split_video_from_audio_1.splitVideoFromAudioHandler,
     '/api/update-available': update_available_1.handleUpdate,
+    '/api/release-notes': release_notes_1.getReleaseNotesHandler,
     '/api/remotion-skills-info': remotion_skills_info_1.remotionSkillsInfoHandler,
     '/api/project-info': project_info_1.projectInfoHandler,
     '/api/delete-static-file': delete_static_file_1.deleteStaticFileHandler,
     '/api/rename-static-file': rename_static_file_1.renameStaticFileHandler,
     '/api/restart-studio': restart_studio_1.handleRestartStudio,
-    '/api/update-config': update_config_1.updateConfigHandler,
     '/api/default-coding-agent-info': default_coding_agent_1.getDefaultCodingAgentInfoHandler,
     '/api/default-editor-info': default_editor_1.getDefaultEditorInfoHandler,
     '/api/install-package': install_dependency_1.handleInstallPackage,

package/dist/preview-server/element-install-state.d.ts

@@ -5,13 +5,12 @@ export type ElementInstallTarget = {
     clientId: string;
     compositionFile: string | null;
     compositionId: string | null;
-    canInstall: boolean;
     lastFocusedAt: number | null;
     readOnly: boolean;
     studioUrl: string;
     updatedAt: number;
 };
-export type StudioProtocolTargetPurpose = 'install-element' | 'set-license-key';
+export type StudioProtocolTargetPurpose = 'install-element' | 'set-license-key' | 'add-element-library';
 type StudioProtocolTarget = {
     readonly id: string;
     readonly origin: string;

package/dist/preview-server/element-install-state.js

@@ -77,11 +77,10 @@ const consumeStudioProtocolTarget = ({ now, origin, purpose, targetId, }) => {
         current.readOnly) {
         return null;
     }
-    if (purpose === 'set-license-key') {
+    if (purpose !== 'install-element') {
         return issued.target;
     }
-    if (!current.canInstall ||
-        current.compositionFile !== issued.target.compositionFile ||
+    if (current.compositionFile !== issued.target.compositionFile ||
         current.compositionId !== issued.target.compositionId) {
         return null;
     }

package/dist/preview-server/routes/delete-jsx-node.js

@@ -65,7 +65,6 @@ const deleteJsxNodeHandler = ({ input: { nodes }, remotionRoot, logLevel }) => {
             const nodePathMutation = (0, sequence_node_path_mutation_1.broadcastSequenceNodePathMutation)(updates.map((update) => ({
                 absolutePath: update.absolutePath,
                 remappings: update.nodePathRemappings,
-                restoredNodePaths: [],
             })));
             for (const update of updates) {
                 const deletedNodeDescription = getDeletedNodeDescription(update.nodeLabels);

package/dist/preview-server/routes/duplicate-jsx-node.js

@@ -11,56 +11,88 @@ const sequence_node_path_mutation_1 = require("../sequence-node-path-mutation");
 const undo_stack_1 = require("../undo-stack");
 const log_update_1 = require("./log-updates/log-update");
 const source_file_write_queue_1 = require("./source-file-write-queue");
-const duplicateJsxNodeHandler = ({ input: { fileName, nodePath }, remotionRoot, logLevel }) => {
+const duplicateJsxNodeHandler = ({ input: { nodes }, remotionRoot, logLevel }) => {
     return (0, source_file_write_queue_1.withSourceFileWriteQueue)(async () => {
+        var _a;
         try {
-            renderer_1.RenderInternals.Log.trace({ indent: false, logLevel }, `[duplicate-jsx-node] Received request for fileName="${fileName}"`);
-            const { absolutePath, fileRelativeToRoot } = (0, resolve_file_inside_project_1.resolveFileInsideProject)({
-                remotionRoot,
-                fileName,
-                action: 'modify',
-            });
-            const fileContents = (0, node_fs_1.readFileSync)(absolutePath, 'utf-8');
-            const { output, formatted, nodeLabel, logLine, nodePathRemappings } = await (0, duplicate_jsx_node_1.duplicateJsxNode)({ input: fileContents, nodePath });
-            const nodePathMutation = (0, sequence_node_path_mutation_1.broadcastSequenceNodePathMutation)([
-                {
+            if (nodes.length === 0) {
+                throw new Error('No JSX nodes were specified for duplication');
+            }
+            renderer_1.RenderInternals.Log.trace({ indent: false, logLevel }, `[duplicate-jsx-node] Received request to duplicate ${nodes.length} JSX node${nodes.length === 1 ? '' : 's'}`);
+            const itemsByFileName = new Map();
+            for (const item of nodes) {
+                const fileItems = (_a = itemsByFileName.get(item.fileName)) !== null && _a !== void 0 ? _a : [];
+                fileItems.push(item);
+                itemsByFileName.set(item.fileName, fileItems);
+            }
+            const updates = await Promise.all([...itemsByFileName.entries()].map(async ([fileName, fileItems]) => {
+                const { absolutePath, fileRelativeToRoot } = (0, resolve_file_inside_project_1.resolveFileInsideProject)({
+                    remotionRoot,
+                    fileName,
+                    action: 'modify',
+                });
+                const fileContents = (0, node_fs_1.readFileSync)(absolutePath, 'utf-8');
+                const { output, formatted, nodeLabels, logLines, nodePathRemappings } = await (0, duplicate_jsx_node_1.duplicateJsxNodes)({
+                    input: fileContents,
+                    nodePaths: fileItems.map((item) => item.nodePath),
+                });
+                return {
                     absolutePath,
-                    remappings: nodePathRemappings,
-                    restoredNodePaths: [],
-                },
-            ]);
-            (0, undo_stack_1.pushToUndoStack)({
-                filePath: absolutePath,
-                oldContents: fileContents,
-                newContents: null,
+                    fileRelativeToRoot,
+                    fileContents,
+                    formatted,
+                    logLine: Math.min(...logLines),
+                    nodeLabels,
+                    nodePathRemappings,
+                    output,
+                };
+            }));
+            const nodePathMutation = (0, sequence_node_path_mutation_1.broadcastSequenceNodePathMutation)(updates.map((update) => ({
+                absolutePath: update.absolutePath,
+                remappings: update.nodePathRemappings,
+            })));
+            const duplicatedNodeDescription = nodes.length === 1
+                ? updates[0].nodeLabels[0]
+                : `${nodes.length} JSX nodes`;
+            (0, undo_stack_1.pushTransactionToUndoStack)({
+                snapshots: updates.map((update) => ({
+                    filePath: update.absolutePath,
+                    oldContents: update.fileContents,
+                    newContents: null,
+                    logLine: update.logLine,
+                    nodePathRemappings: update.nodePathRemappings,
+                })),
                 logLevel,
                 remotionRoot,
-                logLine,
                 description: {
-                    undoMessage: `↩️  Duplication of ${nodeLabel}`,
-                    redoMessage: `↪️  Duplication of ${nodeLabel}`,
+                    undoMessage: `↩️  Duplication of ${duplicatedNodeDescription}`,
+                    redoMessage: `↪️  Duplication of ${duplicatedNodeDescription}`,
                 },
                 entryType: 'duplicate-jsx-node',
                 suppressHmrOnFileRestore: false,
-                nodePathRemappings,
-            });
-            (0, undo_stack_1.suppressUndoStackInvalidation)(absolutePath);
-            (0, file_watcher_1.writeFileAndNotifyFileWatchers)({
-                file: absolutePath,
-                content: output,
-                originatorClientId: undefined,
-                metadata: { skipSequencePropsUpdate: true },
-            });
-            const locationLabel = (0, format_log_file_location_1.formatLogFileLocation)({
-                remotionRoot,
-                absolutePath,
-                line: logLine,
             });
-            renderer_1.RenderInternals.Log.info({ indent: false, logLevel }, `${(0, source_file_write_queue_1.getCodemodTimingPrefix)(logLevel)}${renderer_1.RenderInternals.chalk.blueBright(`${locationLabel}`)} Duplicated ${nodeLabel}`);
-            if (!formatted) {
-                (0, log_update_1.warnAboutPrettierOnce)(logLevel);
+            for (const update of updates) {
+                (0, undo_stack_1.suppressUndoStackInvalidation)(update.absolutePath);
+                (0, file_watcher_1.writeFileAndNotifyFileWatchers)({
+                    file: update.absolutePath,
+                    content: update.output,
+                    originatorClientId: undefined,
+                    metadata: { skipSequencePropsUpdate: true },
+                });
+                const locationLabel = (0, format_log_file_location_1.formatLogFileLocation)({
+                    remotionRoot,
+                    absolutePath: update.absolutePath,
+                    line: update.logLine,
+                });
+                const fileDescription = update.nodeLabels.length === 1
+                    ? update.nodeLabels[0]
+                    : `${update.nodeLabels.length} JSX nodes`;
+                renderer_1.RenderInternals.Log.info({ indent: false, logLevel }, `${(0, source_file_write_queue_1.getCodemodTimingPrefix)(logLevel)}${renderer_1.RenderInternals.chalk.blueBright(`${locationLabel}`)} Duplicated ${fileDescription}`);
+                if (!update.formatted) {
+                    (0, log_update_1.warnAboutPrettierOnce)(logLevel);
+                }
+                renderer_1.RenderInternals.Log.verbose({ indent: false, logLevel }, `[duplicate-jsx-node] Wrote ${update.fileRelativeToRoot}${update.formatted ? ' (formatted)' : ''}`);
             }
-            renderer_1.RenderInternals.Log.verbose({ indent: false, logLevel }, `[duplicate-jsx-node] Wrote ${fileRelativeToRoot}${formatted ? ' (formatted)' : ''}`);
             (0, undo_stack_1.printUndoHint)(logLevel);
             return {
                 success: true,

package/dist/preview-server/routes/element-install-plan.d.ts

@@ -15,17 +15,19 @@ export declare const makeRelativeElementImportPath: ({ fromFile, toFile, }: {
     fromFile: string;
     toFile: string;
 }) => string;
-export declare const getElementInstallPlan: ({ compositionFile, compositionId, element, remotionRoot, }: PrepareElementInstallRequest & {
+export declare const getElementInstallPlan: ({ destination, element, entryPoint, remotionRoot, }: PrepareElementInstallRequest & {
+    entryPoint: string;
     remotionRoot: string;
 }) => Promise<{
     componentName: string;
+    destinationCompositionFileName: string;
     elementFileExists: boolean;
     elementFileName: string;
     existingElementSource: string | null;
     expectedFileState: ElementInstallExpectedFileState;
     filePath: string;
     importPath: string;
-    location: import("@remotion/studio-codemods").ResolvedCompositionComponentWithFile;
+    location: import("@remotion/studio-codemods").ResolvedCompositionComponentWithFile | null;
     safePaths: {
         compositionFileName: string;
         elementFileName: string;

package/dist/preview-server/routes/element-install-plan.js

@@ -9,6 +9,7 @@ const node_fs_1 = require("node:fs");
 const node_path_1 = __importDefault(require("node:path"));
 const studio_protocol_1 = require("@remotion/studio-protocol");
 const resolve_composition_component_1 = require("../../helpers/resolve-composition-component");
+const project_info_1 = require("../project-info");
 const safe_element_install_path_1 = require("./safe-element-install-path");
 const normalizeElementSourceForComparison = (source) => {
     return source.replace(/\r\n/g, '\n').trim();
@@ -74,27 +75,38 @@ const getExpectedFileState = (existingSource) => {
         sourceHash: (0, exports.getElementSourceHash)(existingSource),
     };
 };
-const getElementInstallPlan = async ({ compositionFile, compositionId, element, remotionRoot, }) => {
+const getElementInstallPlan = async ({ destination, element, entryPoint, remotionRoot, }) => {
+    var _a;
     (0, exports.validateElementForInstallation)(element);
     const componentName = studio_protocol_1.StudioProtocolInternals.getElementComponentNameFromSourceCode(element.sourceCode);
     if (componentName === null) {
         throw new Error('Element source must export exactly one named component');
     }
-    const location = await (0, resolve_composition_component_1.resolveCompositionComponentWithFile)({
-        remotionRoot,
-        compositionFile,
-        compositionId,
-    });
-    if (!location.canAddSequence) {
+    const location = destination.type === 'current-composition'
+        ? await (0, resolve_composition_component_1.resolveCompositionComponentWithFile)({
+            remotionRoot,
+            compositionFile: destination.compositionFile,
+            compositionId: destination.compositionId,
+        })
+        : null;
+    if (location !== null && !location.canAddSequence) {
         throw new Error('Cannot insert Element into this composition component');
     }
     const derivedElementFileName = studio_protocol_1.StudioProtocolInternals.makeElementFileNameFromSlug(element.slug);
     if (derivedElementFileName === null) {
         throw new Error('Element slug must produce a safe lowercase .tsx file name');
     }
+    const destinationCompositionFile = destination.compositionFile;
+    const destinationCompositionFileName = destinationCompositionFile === null
+        ? (await (0, project_info_1.getProjectInfo)(remotionRoot, entryPoint)).rootFile
+        : node_path_1.default.resolve(remotionRoot, destinationCompositionFile);
+    if (destinationCompositionFileName === null) {
+        throw new Error('Could not find the root file of the project');
+    }
+    const compositionFileName = (_a = location === null || location === void 0 ? void 0 : location.fileName) !== null && _a !== void 0 ? _a : destinationCompositionFileName;
     const safePaths = await (0, safe_element_install_path_1.getSafeElementInstallPaths)({
-        compositionFileName: location.fileName,
-        elementFileName: node_path_1.default.resolve(node_path_1.default.dirname(location.fileName), derivedElementFileName),
+        compositionFileName,
+        elementFileName: node_path_1.default.resolve(node_path_1.default.dirname(compositionFileName), derivedElementFileName),
         remotionRoot,
     });
     const elementFileExists = (0, node_fs_1.existsSync)(safePaths.elementFileName);
@@ -103,6 +115,7 @@ const getElementInstallPlan = async ({ compositionFile, compositionId, element,
         : null;
     return {
         componentName,
+        destinationCompositionFileName,
         elementFileExists,
         elementFileName: safePaths.elementFileName,
         existingElementSource,

package/dist/preview-server/routes/insert-element.js

@@ -22,7 +22,7 @@ const hasExpectedFileState = ({ expected, actual, }) => {
     }
     return actual.sourceHash === expected.sourceHash;
 };
-const insertElementHandler = ({ input: { compositionFile, compositionId, element, expectedFileState, from, position, overwriteExisting, }, remotionRoot, logLevel, }) => (0, source_file_write_queue_1.withSourceFileWriteQueue)(async () => {
+const insertElementHandler = ({ input: { compositionFile, compositionId, element, expectedFileState, from, position, overwriteExisting, }, entryPoint, remotionRoot, logLevel, }) => (0, source_file_write_queue_1.withSourceFileWriteQueue)(async () => {
     var _a, _b;
     try {
         (0, element_install_plan_1.validateElementInstallPosition)(position);
@@ -34,9 +34,13 @@ const insertElementHandler = ({ input: { compositionFile, compositionId, element
         const componentOwnsSequence = installationMode === 'component-owned-sequence';
         renderer_1.RenderInternals.Log.trace({ indent: false, logLevel }, `[insert-element] Received request for compositionFile="${compositionFile}" compositionId="${compositionId}" element="${element.slug}"`);
         const plan = await (0, element_install_plan_1.getElementInstallPlan)({
-            compositionFile,
-            compositionId,
+            destination: {
+                type: 'current-composition',
+                compositionFile,
+                compositionId,
+            },
             element,
+            entryPoint,
             remotionRoot,
         });
         if (expectedFileState !== null &&
@@ -112,9 +116,13 @@ const insertElementHandler = ({ input: { compositionFile, compositionId, element
                 },
         });
         const finalPlan = await (0, element_install_plan_1.getElementInstallPlan)({
-            compositionFile,
-            compositionId,
+            destination: {
+                type: 'current-composition',
+                compositionFile,
+                compositionId,
+            },
             element,
+            entryPoint,
             remotionRoot,
         });
         if (finalPlan.safePaths.compositionFileName !==
@@ -131,7 +139,6 @@ const insertElementHandler = ({ input: { compositionFile, compositionId, element
             {
                 absolutePath: inserted.fileName,
                 remappings: inserted.nodePathRemappings,
-                restoredNodePaths: [],
             },
         ]);
         (0, undo_stack_1.pushTransactionToUndoStack)({

package/dist/preview-server/routes/insert-jsx-element.js

@@ -171,7 +171,6 @@ const insertJsxElementHandler = ({ input: { compositionFile, compositionId, elem
             {
                 absolutePath: fileName,
                 remappings: nodePathRemappings,
-                restoredNodePaths: [],
             },
         ]);
         if (insertedNodePath === null) {

package/dist/preview-server/routes/prepare-element-install.js

@@ -3,12 +3,17 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.prepareElementInstallHandler = void 0;
 const element_install_plan_1 = require("./element-install-plan");
 const source_file_write_queue_1 = require("./source-file-write-queue");
-const prepareElementInstallHandler = ({ input, remotionRoot }) => (0, source_file_write_queue_1.withSourceFileWriteQueue)(async () => {
+const prepareElementInstallHandler = ({ entryPoint, input, remotionRoot }) => (0, source_file_write_queue_1.withSourceFileWriteQueue)(async () => {
     try {
-        const plan = await (0, element_install_plan_1.getElementInstallPlan)({ ...input, remotionRoot });
+        const plan = await (0, element_install_plan_1.getElementInstallPlan)({
+            ...input,
+            entryPoint,
+            remotionRoot,
+        });
         return {
             success: true,
             plan: {
+                compositionFile: plan.destinationCompositionFileName,
                 expectedFileState: plan.expectedFileState,
                 filePath: plan.filePath,
             },

package/dist/preview-server/routes/release-notes.d.ts

@@ -0,0 +1,3 @@
+import type { GetReleaseNotesRequest, GetReleaseNotesResponse } from '@remotion/studio-shared';
+import type { ApiHandler } from '../api-types';
+export declare const getReleaseNotesHandler: ApiHandler<GetReleaseNotesRequest, GetReleaseNotesResponse>;

package/dist/preview-server/routes/release-notes.js

@@ -0,0 +1,127 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getReleaseNotesHandler = void 0;
+const semver_1 = __importDefault(require("semver"));
+const githubApiVersion = '2022-11-28';
+const releaseNotesTimeout = 5000;
+const releaseNotesCacheDuration = 5 * 60 * 1000;
+const maximumReleaseNotes = 5;
+const releaseNotesCache = new Map();
+const getReleaseNotesHandler = async ({ input }) => {
+    const currentVersion = semver_1.default.valid(input.currentVersion);
+    const latestVersion = semver_1.default.valid(input.latestVersion);
+    if (currentVersion === null || latestVersion === null) {
+        throw new Error(`Invalid Remotion version range: ${input.currentVersion} to ${input.latestVersion}`);
+    }
+    const cacheKey = `${currentVersion}:${latestVersion}`;
+    const cachedReleaseNotes = releaseNotesCache.get(cacheKey);
+    if (cachedReleaseNotes && cachedReleaseNotes.expiresAt > Date.now()) {
+        return cachedReleaseNotes.response;
+    }
+    const controller = new AbortController();
+    const timeout = setTimeout(() => controller.abort(), releaseNotesTimeout);
+    try {
+        const releaseResponse = await fetch('https://api.github.com/repos/remotion-dev/remotion/releases?per_page=100', {
+            headers: {
+                accept: 'application/vnd.github+json',
+                'user-agent': 'Remotion Studio',
+                'x-github-api-version': githubApiVersion,
+            },
+            signal: controller.signal,
+        });
+        if (!releaseResponse.ok) {
+            return { hasMore: false, releases: [] };
+        }
+        const githubReleases = (await releaseResponse.json());
+        if (!Array.isArray(githubReleases)) {
+            return { hasMore: false, releases: [] };
+        }
+        const matchingReleases = githubReleases
+            .flatMap((release) => {
+            if (typeof release !== 'object' || release === null) {
+                return [];
+            }
+            const { body, published_at: publishedAt, tag_name: tagName, } = release;
+            if (typeof tagName !== 'string') {
+                return [];
+            }
+            const version = semver_1.default.valid(tagName.startsWith('v') ? tagName.slice(1) : tagName);
+            if (version === null ||
+                !semver_1.default.gt(version, currentVersion) ||
+                !semver_1.default.lte(version, latestVersion)) {
+                return [];
+            }
+            return [
+                {
+                    body: typeof body === 'string' ? body : null,
+                    publishedAt: typeof publishedAt === 'string' ? publishedAt : null,
+                    version,
+                },
+            ];
+        })
+            .sort((a, b) => semver_1.default.rcompare(a.version, b.version));
+        const hasMore = matchingReleases.length > maximumReleaseNotes;
+        const releases = await Promise.all(matchingReleases.slice(0, maximumReleaseNotes).map(async (release) => {
+            if (release.body === null || release.body.trim() === '') {
+                return {
+                    publishedAt: release.publishedAt,
+                    releaseNotesHtml: null,
+                    version: release.version,
+                };
+            }
+            try {
+                const markdownResponse = await fetch('https://api.github.com/markdown', {
+                    body: JSON.stringify({
+                        context: 'remotion-dev/remotion',
+                        mode: 'gfm',
+                        text: release.body,
+                    }),
+                    headers: {
+                        accept: 'text/html',
+                        'content-type': 'application/json',
+                        'user-agent': 'Remotion Studio',
+                        'x-github-api-version': githubApiVersion,
+                    },
+                    method: 'POST',
+                    signal: controller.signal,
+                });
+                if (!markdownResponse.ok) {
+                    return {
+                        publishedAt: release.publishedAt,
+                        releaseNotesHtml: null,
+                        version: release.version,
+                    };
+                }
+                const releaseNotesHtml = await markdownResponse.text();
+                return {
+                    publishedAt: release.publishedAt,
+                    releaseNotesHtml: releaseNotesHtml || null,
+                    version: release.version,
+                };
+            }
+            catch (_a) {
+                return {
+                    publishedAt: release.publishedAt,
+                    releaseNotesHtml: null,
+                    version: release.version,
+                };
+            }
+        }));
+        const response = { hasMore, releases };
+        releaseNotesCache.set(cacheKey, {
+            expiresAt: Date.now() + releaseNotesCacheDuration,
+            response,
+        });
+        return response;
+    }
+    catch (_a) {
+        return { hasMore: false, releases: [] };
+    }
+    finally {
+        clearTimeout(timeout);
+    }
+};
+exports.getReleaseNotesHandler = getReleaseNotesHandler;

package/dist/preview-server/routes/reorder-sequence.js

@@ -32,7 +32,6 @@ const reorderSequenceHandler = ({ input: { fileName, sourceNodePath, targetNodeP
                 {
                     absolutePath,
                     remappings: nodePathRemappings,
-                    restoredNodePaths: [],
                 },
             ]);
             (0, undo_stack_1.pushToUndoStack)({

package/dist/preview-server/routes/split-jsx-sequence.js

@@ -30,7 +30,6 @@ const splitJsxSequenceHandler = ({ input: { fileName, nodePath, sequenceKeys, sp
             {
                 absolutePath,
                 remappings: nodePathRemappings,
-                restoredNodePaths: [],
             },
         ]);
         (0, undo_stack_1.pushToUndoStack)({

package/dist/preview-server/routes/split-video-from-audio.js

@@ -28,7 +28,6 @@ const splitVideoFromAudioHandler = ({ input: { fileName, nodePath }, remotionRoo
             {
                 absolutePath,
                 remappings: nodePathRemappings,
-                restoredNodePaths: [],
             },
         ]);
         (0, undo_stack_1.pushToUndoStack)({

package/dist/preview-server/routes/update-config.d.ts

@@ -1,7 +1,12 @@
-import { type ConfigUpdate, type UpdateConfigRequest, type UpdateConfigResponse } from '@remotion/studio-shared';
+import { type ConfigUpdate, type StudioRuntimeConfig, type UpdateConfigRequest, type UpdateConfigResponse } from '@remotion/studio-shared';
 import type { ApiHandler } from '../api-types';
-export declare const updateConfigFile: ({ configContents, updates, }: {
+export declare const updateConfigFile: ({ configContents, existingElementLibraryUrls, updates, }: {
     readonly configContents: string;
+    readonly existingElementLibraryUrls: readonly string[];
     readonly updates: ConfigUpdate[];
 }) => string;
-export declare const updateConfigHandler: ApiHandler<UpdateConfigRequest, UpdateConfigResponse>;
+type UpdateConfigHandlerParams = Parameters<ApiHandler<UpdateConfigRequest, UpdateConfigResponse>>[0] & {
+    readonly getStudioRuntimeConfig: () => StudioRuntimeConfig;
+};
+export declare const updateConfigHandler: ({ input, configFile, getStudioRuntimeConfig, }: UpdateConfigHandlerParams) => Promise<UpdateConfigResponse>;
+export {};

package/dist/preview-server/routes/update-config.js

@@ -74,7 +74,7 @@ const validateUpdates = (updates) => {
         }
         const { setter, type } = update;
         if (typeof setter !== 'string' ||
-            !validSetterName.test(setter) ||
+            (!validSetterName.test(setter) && setter !== 'addElementLibrary') ||
             !(setter in studio_shared_1.configMethodLifecycles)) {
             return `Invalid config setter: ${JSON.stringify(setter)}.`;
         }
@@ -82,6 +82,34 @@ const validateUpdates = (updates) => {
             return `The config setter ${setter} was specified more than once.`;
         }
         setters.add(setter);
+        if (setter === 'addElementLibrary') {
+            if (type !== 'set' ||
+                !('value' in update) ||
+                typeof update.value !== 'object' ||
+                update.value === null ||
+                Array.isArray(update.value)) {
+                return 'Config.addElementLibrary() expects an object value.';
+            }
+            const elementLibrary = update.value;
+            const { displayName, url } = elementLibrary;
+            if (typeof url !== 'string') {
+                return 'Config.addElementLibrary() expects an HTTP or HTTPS URL.';
+            }
+            try {
+                const parsedUrl = new URL(url);
+                if (parsedUrl.protocol !== 'http:' && parsedUrl.protocol !== 'https:') {
+                    return 'Config.addElementLibrary() expects an HTTP or HTTPS URL.';
+                }
+            }
+            catch (_a) {
+                return 'Config.addElementLibrary() expects an HTTP or HTTPS URL.';
+            }
+            if (displayName !== undefined &&
+                (typeof displayName !== 'string' || displayName.trim() === '')) {
+                return 'Config.addElementLibrary() expects a non-empty display name.';
+            }
+            continue;
+        }
         if (type === 'delete') {
             continue;
         }
@@ -93,20 +121,64 @@ const validateUpdates = (updates) => {
     }
     return null;
 };
-const updateConfigFile = ({ configContents, updates, }) => {
+const updateConfigFile = ({ configContents, existingElementLibraryUrls, updates, }) => {
     const setters = new Set(updates.map(({ setter }) => setter));
+    const elementLibraryUrls = new Set();
+    for (const url of existingElementLibraryUrls) {
+        try {
+            elementLibraryUrls.add(new URL(url).href);
+        }
+        catch (_a) {
+            // Runtime config only contains validated URLs.
+        }
+    }
+    let changed = false;
     const ast = (0, parse_ast_1.parseAst)(configContents);
     recast.types.visit(ast.program, {
         visitExpressionStatement(path) {
             const { expression } = path.node;
-            if (expression.type === 'CallExpression' &&
-                expression.callee.type === 'MemberExpression' &&
-                !expression.callee.computed &&
-                expression.callee.object.type === 'Identifier' &&
-                expression.callee.object.name === 'Config' &&
-                expression.callee.property.type === 'Identifier' &&
-                setters.has(expression.callee.property.name)) {
+            if (expression.type !== 'CallExpression' ||
+                expression.callee.type !== 'MemberExpression' ||
+                expression.callee.computed ||
+                expression.callee.object.type !== 'Identifier' ||
+                expression.callee.object.name !== 'Config' ||
+                expression.callee.property.type !== 'Identifier') {
+                this.traverse(path);
+                return;
+            }
+            const setter = expression.callee.property.name;
+            if (setter === 'addElementLibrary') {
+                const argument = expression.arguments[0];
+                if ((argument === null || argument === void 0 ? void 0 : argument.type) === 'ObjectExpression') {
+                    const urlProperty = argument.properties.find((property) => {
+                        if (property.type !== 'ObjectProperty' || property.computed) {
+                            return false;
+                        }
+                        return ((property.key.type === 'Identifier' &&
+                            property.key.name === 'url') ||
+                            (property.key.type === 'StringLiteral' &&
+                                property.key.value === 'url'));
+                    });
+                    if ((urlProperty === null || urlProperty === void 0 ? void 0 : urlProperty.type) === 'ObjectProperty' &&
+                        urlProperty.value.type === 'StringLiteral') {
+                        try {
+                            const parsedUrl = new URL(urlProperty.value.value);
+                            if (parsedUrl.protocol === 'http:' ||
+                                parsedUrl.protocol === 'https:') {
+                                elementLibraryUrls.add(parsedUrl.href);
+                            }
+                        }
+                        catch (_a) {
+                            // Preserve invalid existing config without treating it as a match.
+                        }
+                    }
+                }
+                this.traverse(path);
+                return;
+            }
+            if (setters.has(setter)) {
                 path.prune();
+                changed = true;
                 return false;
             }
             this.traverse(path);
@@ -117,22 +189,41 @@ const updateConfigFile = ({ configContents, updates, }) => {
         if (update.type === 'delete') {
             continue;
         }
-        const serializedValue = JSON.stringify(update.value)
+        const { setter, value: initialValue } = update;
+        let value = initialValue;
+        if (setter === 'addElementLibrary') {
+            const elementLibrary = initialValue;
+            const { displayName: rawDisplayName, url } = elementLibrary;
+            const normalizedUrl = new URL(url).href;
+            if (elementLibraryUrls.has(normalizedUrl)) {
+                continue;
+            }
+            const displayName = typeof rawDisplayName === 'string' ? rawDisplayName.trim() : null;
+            value =
+                displayName === null
+                    ? { url: normalizedUrl }
+                    : { url: normalizedUrl, displayName };
+            elementLibraryUrls.add(normalizedUrl);
+        }
+        const serializedValue = JSON.stringify(value)
             .replaceAll('\u2028', '\\u2028')
             .replaceAll('\u2029', '\\u2029');
-        const statement = (0, parse_ast_1.parseAst)(`Config.${update.setter}(${serializedValue});`)
-            .program.body[0];
+        const statement = (0, parse_ast_1.parseAst)(`Config.${setter}(${serializedValue});`).program
+            .body[0];
         const separator = updatedConfig.endsWith('\n') ? '' : '\n';
         updatedConfig += `${separator}${recast.prettyPrint(statement, {
             lineTerminator: '\n',
             quote: 'single',
             useTabs: true,
         }).code}\n`;
+        changed = true;
     }
-    return updatedConfig;
+    return changed ? updatedConfig : configContents;
 };
 exports.updateConfigFile = updateConfigFile;
-const updateConfigHandler = async ({ input, configFile }) => {
+const updateConfigHandler = async ({ input, configFile, getStudioRuntimeConfig, }) => {
+    var _a;
+    var _b;
     if (configFile === null || configFile === undefined) {
         return {
             success: false,
@@ -182,9 +273,17 @@ const updateConfigHandler = async ({ input, configFile }) => {
         }
     }
     const configContents = (0, node_fs_1.readFileSync)(configFile, 'utf8');
+    const updatedConfig = (0, exports.updateConfigFile)({
+        configContents,
+        existingElementLibraryUrls: (_b = (_a = getStudioRuntimeConfig().elementLibraries) === null || _a === void 0 ? void 0 : _a.map(({ url }) => url)) !== null && _b !== void 0 ? _b : [],
+        updates: input.updates,
+    });
+    if (updatedConfig === configContents) {
+        return { success: true };
+    }
     (0, file_watcher_1.writeFileAndNotifyFileWatchers)({
         file: configFile,
-        content: (0, exports.updateConfigFile)({ configContents, updates: input.updates }),
+        content: updatedConfig,
         originatorClientId: input.clientId,
         metadata: null,
     });

package/dist/preview-server/sequence-node-path-mutation.d.ts

@@ -1,7 +1,5 @@
 import type { SequenceNodePathMutation, SequenceNodePathRemapping } from '@remotion/studio-shared';
-import type { SequenceNodePath } from 'remotion';
 export declare const broadcastSequenceNodePathMutation: (files: {
     absolutePath: string;
     remappings: SequenceNodePathRemapping[];
-    restoredNodePaths: SequenceNodePath[];
 }[]) => SequenceNodePathMutation;

package/dist/preview-server/start-server.js

@@ -19,16 +19,20 @@ const startServer = async (options) => {
     var _a, _b;
     const desiredPort = (_b = (_a = options === null || options === void 0 ? void 0 : options.port) !== null && _a !== void 0 ? _a : (process.env.PORT ? Number(process.env.PORT) : undefined)) !== null && _b !== void 0 ? _b : undefined;
     const portConfig = renderer_1.RenderInternals.getPortConfig(options.forceIPv4);
-    const onPortUnavailable = options.forceNew
-        ? undefined
-        : async (port) => {
+    const onPortUnavailable = async (port) => {
+        if (!options.forceNew) {
             const detection = await (0, detect_remotion_server_1.detectRemotionServer)({
                 port,
                 cwd: options.remotionRoot,
                 hostname: portConfig.hostsToTry[0],
             });
-            return detection.type === 'match' ? 'stop' : 'continue';
-        };
+            if (detection.type === 'match') {
+                return 'stop';
+            }
+        }
+        renderer_1.RenderInternals.Log.info({ indent: false, logLevel: options.logLevel }, renderer_1.RenderInternals.chalk.gray(`Port ${port} is busy, trying another.`));
+        return 'continue';
+    };
     let portSelection = await renderer_1.RenderInternals.getDesiredPort({
         desiredPort,
         from: 3000,

package/dist/preview-server/studio-protocol/handle-discovery.js

@@ -32,8 +32,7 @@ const getLiveStudioTarget = (requestId) => {
     }
     return target;
 };
-const isInstallableTarget = (target) => target !== null &&
-    target.canInstall &&
+const isElementRequestTarget = (target) => target !== null &&
     target.compositionFile !== null &&
     target.compositionId !== null &&
     target.lastFocusedAt !== null;
@@ -68,7 +67,7 @@ const handleStudioProtocolDiscovery = ({ gitSource, liveEventsServer, remotionRo
         setTimeout(() => {
             const now = Date.now();
             const target = getLiveStudioTarget(requestId);
-            const installTarget = isInstallableTarget(target) ? target : null;
+            const installTarget = isElementRequestTarget(target) ? target : null;
             const issuedInstallTarget = installTarget === null
                 ? null
                 : (0, element_install_state_1.issueStudioProtocolTarget)({
@@ -85,6 +84,14 @@ const handleStudioProtocolDiscovery = ({ gitSource, liveEventsServer, remotionRo
                     purpose: 'set-license-key',
                     target,
                 });
+            const issuedElementLibraryTarget = target === null
+                ? null
+                : (0, element_install_state_1.issueStudioProtocolTarget)({
+                    now,
+                    origin: requestOrigin,
+                    purpose: 'add-element-library',
+                    target,
+                });
             response.writeHead(200, {
                 'Cache-Control': 'no-store',
                 'Content-Type': 'application/json',
@@ -120,6 +127,18 @@ const handleStudioProtocolDiscovery = ({ gitSource, liveEventsServer, remotionRo
                                 lastFocusedAt: target.lastFocusedAt,
                             },
                     },
+                    {
+                        type: 'add-element-library',
+                        target: issuedElementLibraryTarget === null ||
+                            target === null ||
+                            target.lastFocusedAt === null
+                            ? null
+                            : {
+                                id: issuedElementLibraryTarget.id,
+                                expiresAt: issuedElementLibraryTarget.expiresAt,
+                                lastFocusedAt: target.lastFocusedAt,
+                            },
+                    },
                 ],
             }));
             resolve();

package/dist/preview-server/studio-protocol/handle-element-library.d.ts

@@ -0,0 +1,11 @@
+import type { IncomingMessage, ServerResponse } from 'node:http';
+import type { LiveEventsServer } from '../live-events';
+type FocusStudioTab = (studioUrl: string) => void;
+export declare const handleStudioProtocolElementLibrary: ({ configFile, focusStudioTab, liveEventsServer, request, response, }: {
+    readonly configFile: string | null;
+    readonly focusStudioTab: FocusStudioTab;
+    readonly liveEventsServer: LiveEventsServer;
+    readonly request: IncomingMessage;
+    readonly response: ServerResponse<IncomingMessage>;
+}) => Promise<void>;
+export {};

package/dist/preview-server/studio-protocol/handle-element-library.js

@@ -0,0 +1,149 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.handleStudioProtocolElementLibrary = void 0;
+const zod_1 = require("zod");
+const element_install_state_1 = require("../element-install-state");
+const parse_body_1 = require("../parse-body");
+const origin_policy_1 = require("./origin-policy");
+const protocol_response_1 = require("./protocol-response");
+const studioProtocolElementLibraryRequestSchema = zod_1.z.object({
+    operation: zod_1.z.literal('add-element-library'),
+    protocol: zod_1.z.literal('remotion-studio-protocol'),
+    protocolVersion: zod_1.z.literal(1),
+    targetId: zod_1.z.string().min(1),
+    url: zod_1.z.string(),
+    displayName: zod_1.z.string().nullable(),
+});
+const MAX_STUDIO_PROTOCOL_ELEMENT_LIBRARY_BODY_SIZE = 16 * 1024;
+const handleStudioProtocolElementLibrary = async ({ configFile, focusStudioTab, liveEventsServer, request, response, }) => {
+    var _a;
+    var _b;
+    (0, origin_policy_1.setStudioProtocolCorsHeaders)({ request, response });
+    const requestOrigin = (0, origin_policy_1.getAllowedStudioProtocolOrigin)(request.headers.origin);
+    if (requestOrigin === null) {
+        (0, protocol_response_1.writeStudioProtocolError)({
+            code: 'unsupported-origin',
+            message: 'Origin not allowed',
+            response,
+            status: 403,
+        });
+        return;
+    }
+    if (request.method !== 'POST') {
+        (0, protocol_response_1.writeStudioProtocolError)({
+            code: 'method-not-allowed',
+            message: 'Use POST to add an Element catalog.',
+            response,
+            status: 405,
+        });
+        return;
+    }
+    let body;
+    try {
+        body = await (0, parse_body_1.parseRequestBody)(request, {
+            maxBytes: MAX_STUDIO_PROTOCOL_ELEMENT_LIBRARY_BODY_SIZE,
+        });
+    }
+    catch (error) {
+        if (error instanceof parse_body_1.RequestBodyTooLargeError) {
+            (0, protocol_response_1.writeStudioProtocolError)({
+                code: 'request-too-large',
+                message: 'The request body is too large.',
+                response,
+                status: 413,
+            });
+            return;
+        }
+        (0, protocol_response_1.writeStudioProtocolError)({
+            code: 'invalid-request',
+            message: 'The request body is not valid JSON.',
+            response,
+            status: 400,
+        });
+        return;
+    }
+    const parsedRequest = studioProtocolElementLibraryRequestSchema.safeParse(body);
+    if (!parsedRequest.success) {
+        (0, protocol_response_1.writeStudioProtocolError)({
+            code: 'unsupported-protocol',
+            message: 'Invalid Remotion Studio Protocol request.',
+            response,
+            status: 400,
+        });
+        return;
+    }
+    let normalizedUrl;
+    try {
+        const parsedUrl = new URL(parsedRequest.data.url);
+        if (parsedUrl.protocol !== 'http:' && parsedUrl.protocol !== 'https:') {
+            throw new Error('Unsupported protocol');
+        }
+        normalizedUrl = parsedUrl.href;
+    }
+    catch (_c) {
+        (0, protocol_response_1.writeStudioProtocolError)({
+            code: 'invalid-url',
+            message: 'The Element catalog URL must be an absolute HTTP or HTTPS URL.',
+            response,
+            status: 400,
+        });
+        return;
+    }
+    const displayName = (_b = (_a = parsedRequest.data.displayName) === null || _a === void 0 ? void 0 : _a.trim()) !== null && _b !== void 0 ? _b : null;
+    if (displayName === '') {
+        (0, protocol_response_1.writeStudioProtocolError)({
+            code: 'invalid-display-name',
+            message: 'The Element catalog display name must not be empty.',
+            response,
+            status: 400,
+        });
+        return;
+    }
+    const target = (0, element_install_state_1.consumeStudioProtocolTarget)({
+        now: Date.now(),
+        origin: requestOrigin,
+        purpose: 'add-element-library',
+        targetId: parsedRequest.data.targetId,
+    });
+    if (target === null) {
+        (0, protocol_response_1.writeStudioProtocolError)({
+            code: 'target-expired',
+            message: 'The selected Studio target is no longer available.',
+            response,
+            status: 409,
+        });
+        return;
+    }
+    if (configFile === null) {
+        (0, protocol_response_1.writeStudioProtocolError)({
+            code: 'no-config-file',
+            message: 'The selected Studio did not load a Remotion config file.',
+            response,
+            status: 409,
+        });
+        return;
+    }
+    const delivered = liveEventsServer.sendEventToClientId(target.clientId, {
+        type: 'element-library-add-request',
+        url: normalizedUrl,
+        displayName,
+        origin: requestOrigin,
+    });
+    if (!delivered) {
+        (0, protocol_response_1.writeStudioProtocolError)({
+            code: 'target-expired',
+            message: 'The selected Remotion Studio tab is no longer connected.',
+            response,
+            status: 409,
+        });
+        return;
+    }
+    focusStudioTab(target.studioUrl);
+    response.writeHead(200, { 'Content-Type': 'application/json' });
+    response.end(JSON.stringify({
+        protocol: 'remotion-studio-protocol',
+        protocolVersion: 1,
+        status: 'awaiting-confirmation',
+    }));
+};
+exports.handleStudioProtocolElementLibrary = handleStudioProtocolElementLibrary;

package/dist/preview-server/undo-stack.js

@@ -257,18 +257,10 @@ function popUndo() {
         return [
             {
                 absolutePath: snapshot.filePath,
-                remappings: snapshot.nodePathRemappings.flatMap((remapping) => {
-                    if (remapping.newNodePath === null) {
-                        return [];
-                    }
-                    return [
-                        {
-                            oldNodePath: remapping.newNodePath,
-                            newNodePath: remapping.oldNodePath,
-                        },
-                    ];
-                }),
-                restoredNodePaths: snapshot.nodePathRemappings.flatMap((remapping) => remapping.newNodePath === null ? [remapping.oldNodePath] : []),
+                remappings: snapshot.nodePathRemappings.map((remapping) => ({
+                    oldNodePath: remapping.newNodePath,
+                    newNodePath: remapping.oldNodePath,
+                })),
             },
         ];
     });
@@ -339,7 +331,6 @@ function popRedo() {
             {
                 absolutePath: snapshot.filePath,
                 remappings: snapshot.nodePathRemappings,
-                restoredNodePaths: [],
             },
         ];
     });

package/dist/routes.js

@@ -53,8 +53,10 @@ const handler_1 = require("./preview-server/handler");
 const public_folder_1 = require("./preview-server/public-folder");
 const app_icon_1 = require("./preview-server/routes/app-icon");
 const open_in_editor_1 = require("./preview-server/routes/open-in-editor");
+const update_config_1 = require("./preview-server/routes/update-config");
 const serve_static_1 = require("./preview-server/serve-static");
 const handle_discovery_1 = require("./preview-server/studio-protocol/handle-discovery");
+const handle_element_library_1 = require("./preview-server/studio-protocol/handle-element-library");
 const handle_install_1 = require("./preview-server/studio-protocol/handle-install");
 const handle_license_key_1 = require("./preview-server/studio-protocol/handle-license-key");
 const origin_policy_1 = require("./preview-server/studio-protocol/origin-policy");
@@ -321,7 +323,8 @@ const handleRoutes = ({ staticHash, staticHashPrefix, outputHash, outputHashPref
     }
     if (url.pathname === '/api/studio-protocol' ||
         url.pathname === '/api/studio-protocol/install' ||
-        url.pathname === '/api/studio-protocol/license-key') {
+        url.pathname === '/api/studio-protocol/license-key' ||
+        url.pathname === '/api/studio-protocol/element-library') {
         if (request.method === 'OPTIONS') {
             return (0, origin_policy_1.handleStudioProtocolOptions)({
                 request,
@@ -348,6 +351,17 @@ const handleRoutes = ({ staticHash, staticHashPrefix, outputHash, outputHashPref
                 response,
             });
         }
+        if (url.pathname === '/api/studio-protocol/element-library') {
+            return (0, handle_element_library_1.handleStudioProtocolElementLibrary)({
+                configFile,
+                focusStudioTab: (studioUrl) => {
+                    (0, better_opn_1.focusBrowserTab)({ url: studioUrl }).catch(() => undefined);
+                },
+                liveEventsServer,
+                request,
+                response,
+            });
+        }
         return (0, handle_install_1.handleStudioProtocolInstall)({
             focusStudioTab: (studioUrl) => {
                 (0, better_opn_1.focusBrowserTab)({ url: studioUrl }).catch(() => undefined);
@@ -357,6 +371,22 @@ const handleRoutes = ({ staticHash, staticHashPrefix, outputHash, outputHashPref
             response,
         });
     }
+    if (url.pathname === '/api/update-config') {
+        return (0, handler_1.handleRequest)({
+            remotionRoot,
+            entryPoint,
+            handler: (params) => (0, update_config_1.updateConfigHandler)({ ...params, getStudioRuntimeConfig }),
+            request,
+            response,
+            logLevel,
+            methods,
+            binariesDirectory,
+            publicDir,
+            configFile,
+            getDefaultCodingAgent,
+            getDefaultEditor,
+        });
+    }
     for (const [key, value] of Object.entries(api_routes_1.allApiRoutes)) {
         if (url.pathname === key) {
             return (0, handler_1.handleRequest)({

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.517",
+	"version": "4.0.519",
 	"description": "Run a Remotion Studio with a server backend",
 	"main": "dist",
 	"scripts": {
@@ -23,7 +23,7 @@
 		"access": "public"
 	},
 	"dependencies": {
-		"@remotion/studio-protocol": "4.0.517",
+		"@remotion/studio-protocol": "4.0.519",
 		"@babel/types": "7.24.0",
 		"@babel/parser": "7.24.1",
 		"@svgr/core": "8.1.0",
@@ -32,12 +32,12 @@
 		"semver": "7.5.3",
 		"zod": "4.4.3",
 		"prettier": "3.8.1",
-		"remotion": "4.0.517",
+		"remotion": "4.0.519",
 		"recast": "0.23.21",
-		"@remotion/bundler": "4.0.517",
-		"@remotion/renderer": "4.0.517",
-		"@remotion/studio-codemods": "4.0.517",
-		"@remotion/studio-shared": "4.0.517",
+		"@remotion/bundler": "4.0.519",
+		"@remotion/renderer": "4.0.519",
+		"@remotion/studio-codemods": "4.0.519",
+		"@remotion/studio-shared": "4.0.519",
 		"memfs": "3.4.3",
 		"open": "8.4.2"
 	},
@@ -45,7 +45,7 @@
 		"ast-types": "0.16.1",
 		"react": "19.2.3",
 		"@types/semver": "7.5.3",
-		"@remotion/eslint-config-internal": "4.0.517",
+		"@remotion/eslint-config-internal": "4.0.519",
 		"eslint": "9.19.0",
 		"@types/node": "20.12.14",
 		"@typescript/native-preview": "7.0.0-dev.20260217.1"