@remotion/studio-server 4.0.497 → 4.0.499

package/dist/index.d.ts

@@ -2,7 +2,7 @@ export { ApiRoutes, CopyStillToClipboardRequest, getDefaultOutLocation, OpenInFi
 export type { AggregateRenderProgress, BundlingState, CopyingState, DownloadProgress, HotMiddlewareOptions, JobProgressCallback, ModuleMap, PackageManager, ProjectInfo, RenderingProgressInput, RenderJob, RenderJobWithCleanup, RequiredChromiumOptions, StitchingProgressInput, UiOpenGlOptions, } from '@remotion/studio-shared';
 import { AnsiDiff } from './ansi-diff';
 export declare const StudioServerInternals: {
-    startStudio: ({ browserArgs, browserFlag, shouldOpenBrowser, fullEntryPath, logLevel, getCurrentInputProps, getEnvVariables, desiredPort, maxTimelineTracks, remotionRoot, keyboardShortcutsEnabled, relativePublicDir, webpackOverride, poll, getRenderDefaults, getRenderQueue, getNumberOfAudioTags, queueMethods, previewEntry, gitSource, bufferStateDelayInMilliseconds, binariesDirectory, forceIPv4, getAudioLatencyHint, getPreviewSampleRate, enableCrossSiteIsolation, askAIEnabled, interactivityEnabled, forceNew, rspack, getStudioRuntimeConfig, }: {
+    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, }: {
         browserArgs: string;
         browserFlag: string;
         logLevel: "error" | "info" | "trace" | "verbose" | "warn";
@@ -11,11 +11,10 @@ export declare const StudioServerInternals: {
         getCurrentInputProps: () => object;
         getEnvVariables: () => Record<string, string>;
         desiredPort: number | null;
-        maxTimelineTracks: number | null;
-        bufferStateDelayInMilliseconds: number | null;
         remotionRoot: string;
-        keyboardShortcutsEnabled: boolean;
         relativePublicDir: string | null;
+        bundlerOverride: import("@remotion/bundler").BundlerOverrideFn;
+        rspackOverride: import("@remotion/bundler").RspackOverrideFn;
         webpackOverride: import("@remotion/bundler").WebpackOverrideFn;
         poll: number | null;
         getRenderDefaults: () => import("@remotion/studio-shared").RenderDefaults;
@@ -29,11 +28,10 @@ export declare const StudioServerInternals: {
         gitSource: import("@remotion/studio-shared").GitSource | null;
         binariesDirectory: string | null;
         forceIPv4: boolean;
-        askAIEnabled: boolean;
-        interactivityEnabled: boolean;
         forceNew: boolean;
         rspack: boolean;
         getStudioRuntimeConfig: () => import("@remotion/studio-shared").StudioRuntimeConfig;
+        configFile: string | null;
     }) => Promise<import("./start-studio").StartStudioResult>;
     getRemotionVersion: () => any;
     waitForLiveEventsListener: () => Promise<import("./preview-server/live-events").LiveEventsServer>;

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

@@ -8,6 +8,7 @@ const add_render_1 = require("./routes/add-render");
 const add_sequence_keyframe_1 = require("./routes/add-sequence-keyframe");
 const apply_codemod_1 = require("./routes/apply-codemod");
 const apply_visual_control_change_1 = require("./routes/apply-visual-control-change");
+const batch_update_keyframe_settings_1 = require("./routes/batch-update-keyframe-settings");
 const cancel_render_1 = require("./routes/cancel-render");
 const composition_component_info_1 = require("./routes/composition-component-info");
 const convert_figma_clipboard_to_svg_1 = require("./routes/convert-figma-clipboard-to-svg");
@@ -49,6 +50,7 @@ const update_available_1 = require("./routes/update-available");
 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");
+const update_public_license_1 = require("./routes/update-public-license");
 const update_sequence_keyframe_settings_1 = require("./routes/update-sequence-keyframe-settings");
 exports.allApiRoutes = {
     '/api/composition-component-info': composition_component_info_1.compositionComponentInfoHandler,
@@ -82,6 +84,7 @@ exports.allApiRoutes = {
     '/api/add-keyframes': add_keyframes_1.addKeyframesHandler,
     '/api/update-sequence-keyframe-settings': update_sequence_keyframe_settings_1.updateSequenceKeyframeSettingsHandler,
     '/api/update-effect-keyframe-settings': update_effect_keyframe_settings_1.updateEffectKeyframeSettingsHandler,
+    '/api/batch-update-keyframe-settings': batch_update_keyframe_settings_1.batchUpdateKeyframeSettingsHandler,
     '/api/delete-effect': delete_effect_1.deleteEffectHandler,
     '/api/paste-effects': paste_effects_1.pasteEffectsHandler,
     '/api/delete-jsx-node': delete_jsx_node_1.deleteJsxNodeHandler,
@@ -92,6 +95,7 @@ exports.allApiRoutes = {
     '/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-public-license': update_public_license_1.updatePublicLicenseHandler,
     '/api/install-package': install_dependency_1.handleInstallPackage,
     '/api/insert-jsx-element': insert_jsx_element_1.insertJsxElementHandler,
     '/api/insert-element': insert_element_1.insertElementHandler,

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

@@ -21,4 +21,5 @@ export type ApiHandler<ReqData, ResData> = (params: {
     methods: QueueMethods;
     publicDir: string;
     binariesDirectory: string | null;
+    configFile: string | null;
 }) => Promise<ResData>;

package/dist/preview-server/handler.d.ts

@@ -1,12 +1,13 @@
 import type { IncomingMessage, ServerResponse } from 'node:http';
 import type { ApiHandler, QueueMethods } from './api-types';
-export declare const handleRequest: <Req, Res>({ remotionRoot, request, response, entryPoint, handler, logLevel, methods, binariesDirectory, publicDir, }: {
+export declare const handleRequest: <Req, Res>({ remotionRoot, request, response, entryPoint, handler, logLevel, methods, binariesDirectory, publicDir, configFile, }: {
     remotionRoot: string;
     publicDir: string;
     request: IncomingMessage;
     response: ServerResponse<IncomingMessage>;
     entryPoint: string;
     binariesDirectory: string | null;
+    configFile: string | null;
     handler: ApiHandler<Req, Res>;
     logLevel: "error" | "info" | "trace" | "verbose" | "warn";
     methods: QueueMethods;

package/dist/preview-server/handler.js

@@ -3,7 +3,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.handleRequest = void 0;
 const parse_body_1 = require("./parse-body");
 const validate_same_origin_1 = require("./validate-same-origin");
-const handleRequest = async ({ remotionRoot, request, response, entryPoint, handler, logLevel, methods, binariesDirectory, publicDir, }) => {
+const handleRequest = async ({ remotionRoot, request, response, entryPoint, handler, logLevel, methods, binariesDirectory, publicDir, configFile, }) => {
     if (request.method === 'OPTIONS') {
         response.statusCode = 200;
         response.end();
@@ -24,6 +24,7 @@ const handleRequest = async ({ remotionRoot, request, response, entryPoint, hand
             methods,
             binariesDirectory,
             publicDir,
+            configFile,
         });
         response.end(JSON.stringify({
             success: true,

package/dist/preview-server/routes/batch-update-keyframe-settings.d.ts

@@ -0,0 +1,7 @@
+import type { BatchUpdateKeyframeSettingsRequest, BatchUpdateKeyframeSettingsResponse } from '@remotion/studio-shared';
+import type { ApiHandler } from '../api-types';
+export declare const batchUpdateKeyframeSettings: ({ sequenceKeyframes, effectKeyframes, clientId, remotionRoot, logLevel, }: BatchUpdateKeyframeSettingsRequest & {
+    remotionRoot: string;
+    logLevel: "error" | "info" | "trace" | "verbose" | "warn";
+}) => Promise<void>;
+export declare const batchUpdateKeyframeSettingsHandler: ApiHandler<BatchUpdateKeyframeSettingsRequest, BatchUpdateKeyframeSettingsResponse>;

package/dist/preview-server/routes/batch-update-keyframe-settings.js

@@ -0,0 +1,187 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.batchUpdateKeyframeSettingsHandler = exports.batchUpdateKeyframeSettings = void 0;
+const node_fs_1 = require("node:fs");
+const renderer_1 = require("@remotion/renderer");
+const update_keyframes_1 = require("../../codemods/update-keyframes/update-keyframes");
+const file_watcher_1 = require("../../file-watcher");
+const resolve_file_inside_project_1 = require("../../helpers/resolve-file-inside-project");
+const undo_stack_1 = require("../undo-stack");
+const watch_ignore_next_change_1 = require("../watch-ignore-next-change");
+const log_effect_update_1 = require("./log-updates/log-effect-update");
+const log_update_1 = require("./log-updates/log-update");
+const source_file_write_queue_1 = require("./source-file-write-queue");
+const groupBy = (items, getKey) => {
+    var _a;
+    const groups = new Map();
+    for (const item of items) {
+        const key = getKey(item);
+        const group = (_a = groups.get(key)) !== null && _a !== void 0 ? _a : [];
+        group.push(item);
+        groups.set(key, group);
+    }
+    return [...groups.values()];
+};
+const toOperation = (settings) => settings.type === 'settings'
+    ? {
+        type: 'settings',
+        clamping: settings.clamping,
+        posterize: settings.posterize,
+        output: settings.output,
+    }
+    : {
+        type: 'easing',
+        segmentIndex: settings.segmentIndex,
+        easing: settings.easing,
+    };
+const batchUpdateKeyframeSettings = async ({ sequenceKeyframes, effectKeyframes, clientId, remotionRoot, logLevel, }) => {
+    var _a, _b;
+    const totalUpdates = sequenceKeyframes.length + effectKeyframes.length;
+    if (totalUpdates === 0) {
+        throw new Error('No keyframe settings updates were specified');
+    }
+    const fileGroups = new Map();
+    for (const update of sequenceKeyframes) {
+        const { absolutePath, fileRelativeToRoot } = (0, resolve_file_inside_project_1.resolveFileInsideProject)({
+            remotionRoot,
+            fileName: update.fileName,
+            action: 'modify',
+        });
+        const group = (_a = fileGroups.get(absolutePath)) !== null && _a !== void 0 ? _a : {
+            sequenceKeyframes: [],
+            effectKeyframes: [],
+        };
+        group.sequenceKeyframes.push({ ...update, fileRelativeToRoot });
+        fileGroups.set(absolutePath, group);
+    }
+    for (const update of effectKeyframes) {
+        const { absolutePath, fileRelativeToRoot } = (0, resolve_file_inside_project_1.resolveFileInsideProject)({
+            remotionRoot,
+            fileName: update.fileName,
+            action: 'modify',
+        });
+        const group = (_b = fileGroups.get(absolutePath)) !== null && _b !== void 0 ? _b : {
+            sequenceKeyframes: [],
+            effectKeyframes: [],
+        };
+        group.effectKeyframes.push({ ...update, fileRelativeToRoot });
+        fileGroups.set(absolutePath, group);
+    }
+    const snapshots = [];
+    const sequenceLogs = [];
+    const effectLogs = [];
+    for (const [absolutePath, group] of fileGroups) {
+        const fileContents = (0, node_fs_1.readFileSync)(absolutePath, 'utf-8');
+        let output = fileContents;
+        let firstLogLine = Number.POSITIVE_INFINITY;
+        for (const updates of groupBy(group.sequenceKeyframes, (update) => JSON.stringify(update.nodePath.nodePath))) {
+            const firstUpdate = updates[0];
+            const result = await (0, update_keyframes_1.updateSequenceKeyframes)({
+                input: output,
+                nodePath: firstUpdate.nodePath.nodePath,
+                schema: firstUpdate.schema,
+                videoConfigValues: firstUpdate.nodePath.videoConfigValues,
+                updates: updates.map((update) => ({
+                    key: update.key,
+                    operation: toOperation(update.settings),
+                })),
+            });
+            output = result.output;
+            firstLogLine = Math.min(firstLogLine, result.logLine);
+            for (const [index, update] of updates.entries()) {
+                sequenceLogs.push({
+                    fileRelativeToRoot: update.fileRelativeToRoot,
+                    line: result.logLine,
+                    key: update.key,
+                    oldValueString: result.oldValueStrings[index],
+                    newValueString: result.newValueStrings[index],
+                    formatted: result.formatted,
+                });
+            }
+        }
+        for (const updates of groupBy(group.effectKeyframes, (update) => `${JSON.stringify(update.sequenceNodePath.nodePath)}:${update.effectIndex}`)) {
+            const firstUpdate = updates[0];
+            const result = await (0, update_keyframes_1.updateEffectKeyframes)({
+                input: output,
+                sequenceNodePath: firstUpdate.sequenceNodePath.nodePath,
+                effectIndex: firstUpdate.effectIndex,
+                schema: firstUpdate.schema,
+                videoConfigValues: firstUpdate.sequenceNodePath.videoConfigValues,
+                updates: updates.map((update) => ({
+                    key: update.key,
+                    operation: toOperation(update.settings),
+                })),
+            });
+            output = result.output;
+            firstLogLine = Math.min(firstLogLine, result.logLine);
+            for (const [index, update] of updates.entries()) {
+                effectLogs.push({
+                    fileRelativeToRoot: update.fileRelativeToRoot,
+                    line: result.logLine,
+                    effectName: result.effectCallee,
+                    propKey: update.key,
+                    oldValueString: result.oldValueStrings[index],
+                    newValueString: result.newValueStrings[index],
+                    formatted: result.formatted,
+                });
+            }
+        }
+        snapshots.push({
+            filePath: absolutePath,
+            oldContents: fileContents,
+            newContents: output,
+            logLine: Number.isFinite(firstLogLine) ? firstLogLine : 1,
+        });
+    }
+    (0, undo_stack_1.pushTransactionToUndoStack)({
+        snapshots,
+        logLevel,
+        remotionRoot,
+        description: totalUpdates === 1
+            ? {
+                undoMessage: '↩️  Keyframe settings reverted',
+                redoMessage: '↪️  Keyframe settings updated',
+            }
+            : {
+                undoMessage: `↩️  ${totalUpdates} keyframe settings reverted`,
+                redoMessage: `↪️  ${totalUpdates} keyframe settings updated`,
+            },
+        entryType: sequenceKeyframes.length > 0 ? 'sequence-props' : 'effect-props',
+        suppressHmrOnFileRestore: true,
+    });
+    for (const snapshot of snapshots) {
+        (0, undo_stack_1.suppressUndoStackInvalidation)(snapshot.filePath);
+        (0, watch_ignore_next_change_1.suppressBundlerUpdateForFile)(snapshot.filePath);
+        (0, file_watcher_1.writeFileAndNotifyFileWatchers)(snapshot.filePath, snapshot.newContents, clientId);
+    }
+    for (const log of sequenceLogs) {
+        (0, log_update_1.logUpdate)({
+            ...log,
+            defaultValueString: null,
+            logLevel,
+            removedProps: [],
+            addedProps: [],
+        });
+    }
+    for (const log of effectLogs) {
+        (0, log_effect_update_1.logEffectUpdate)({
+            ...log,
+            defaultValueString: null,
+            logLevel,
+            removedProps: [],
+            addedProps: [],
+        });
+    }
+    (0, undo_stack_1.printUndoHint)(logLevel);
+};
+exports.batchUpdateKeyframeSettings = batchUpdateKeyframeSettings;
+const batchUpdateKeyframeSettingsHandler = ({ input, remotionRoot, logLevel }) => (0, source_file_write_queue_1.withSourceFileWriteQueue)(async () => {
+    renderer_1.RenderInternals.Log.trace({ indent: false, logLevel }, `[batch-update-keyframe-settings] Received ${input.sequenceKeyframes.length + input.effectKeyframes.length} update(s)`);
+    await (0, exports.batchUpdateKeyframeSettings)({
+        ...input,
+        remotionRoot,
+        logLevel,
+    });
+    return { success: true };
+});
+exports.batchUpdateKeyframeSettingsHandler = batchUpdateKeyframeSettingsHandler;

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

@@ -6,8 +6,8 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.insertElementHandler = void 0;
 const node_fs_1 = require("node:fs");
 const node_path_1 = __importDefault(require("node:path"));
+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 file_watcher_1 = require("../../file-watcher");
 const resolve_composition_component_1 = require("../../helpers/resolve-composition-component");
 const format_log_file_location_1 = require("../format-log-file-location");
@@ -56,7 +56,7 @@ const validateDimensions = (dimensions) => {
     }
 };
 const validateElement = (element) => {
-    if ((0, studio_shared_1.makeElementFileNameFromSlug)(element.slug) === null) {
+    if (drag_and_drop_1.DragAndDropInternals.makeElementFileNameFromSlug(element.slug) === null) {
         throw new Error('Element slug must produce a safe lowercase .tsx file name');
     }
     if (typeof element.sourceCode !== 'string' ||
@@ -64,7 +64,7 @@ const validateElement = (element) => {
         element.sourceCode.length > 200000) {
         throw new Error('Unsupported Element source code');
     }
-    if ((0, studio_shared_1.getElementComponentNameFromSourceCode)(element.sourceCode) === null) {
+    if (drag_and_drop_1.DragAndDropInternals.getElementComponentNameFromSourceCode(element.sourceCode) === null) {
         throw new Error('Element source must export exactly one named component');
     }
     validateDimensions(element.dimensions);
@@ -77,7 +77,7 @@ const insertElementHandler = ({ input: { compositionFile, compositionId, element
             (!Number.isInteger(from) || !Number.isFinite(from) || from < 0)) {
             throw new Error('from must be a non-negative integer');
         }
-        const componentName = (0, studio_shared_1.getElementComponentNameFromSourceCode)(element.sourceCode);
+        const componentName = drag_and_drop_1.DragAndDropInternals.getElementComponentNameFromSourceCode(element.sourceCode);
         if (componentName === null) {
             throw new Error('Element source must export exactly one named component');
         }
@@ -90,7 +90,7 @@ const insertElementHandler = ({ input: { compositionFile, compositionId, element
         if (!location.canAddSequence) {
             throw new Error('Cannot insert Element into this composition component');
         }
-        const derivedElementFileName = (0, studio_shared_1.makeElementFileNameFromSlug)(element.slug);
+        const derivedElementFileName = drag_and_drop_1.DragAndDropInternals.makeElementFileNameFromSlug(element.slug);
         if (derivedElementFileName === null) {
             throw new Error('Element slug must produce a safe lowercase .tsx file name');
         }

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

@@ -5,6 +5,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.insertJsxElementHandler = void 0;
 const node_path_1 = __importDefault(require("node:path"));
+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 file_watcher_1 = require("../../file-watcher");
@@ -78,16 +79,16 @@ const validateElement = (element, remotionRoot) => {
         return;
     }
     if (element.type === 'component') {
-        if (!(0, studio_shared_1.isComponentIdentifier)(element.componentName)) {
+        if (!drag_and_drop_1.DragAndDropInternals.isComponentIdentifier(element.componentName)) {
             throw new Error('Unsupported component name');
         }
-        if (!(0, studio_shared_1.isComponentIdentifier)(element.importName)) {
+        if (!drag_and_drop_1.DragAndDropInternals.isComponentIdentifier(element.importName)) {
             throw new Error('Unsupported component import name');
         }
-        if (!(0, studio_shared_1.isComponentImportPath)(element.importPath)) {
+        if (!drag_and_drop_1.DragAndDropInternals.isComponentImportPath(element.importPath)) {
             throw new Error('Unsupported component import path');
         }
-        if (!(0, studio_shared_1.areComponentProps)(element.props)) {
+        if (!drag_and_drop_1.DragAndDropInternals.areComponentProps(element.props)) {
             throw new Error('Unsupported component props');
         }
         return;

package/dist/preview-server/routes/update-public-license.d.ts

@@ -0,0 +1,7 @@
+import type { UpdatePublicLicenseRequest, UpdatePublicLicenseResponse } from '@remotion/studio-shared';
+import type { ApiHandler } from '../api-types';
+export declare const updatePublicLicenseInConfig: ({ configContents, publicLicenseKey, }: {
+    configContents: string;
+    publicLicenseKey: string;
+}) => string;
+export declare const updatePublicLicenseHandler: ApiHandler<UpdatePublicLicenseRequest, UpdatePublicLicenseResponse>;

package/dist/preview-server/routes/update-public-license.js

@@ -0,0 +1,93 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.updatePublicLicenseHandler = exports.updatePublicLicenseInConfig = void 0;
+const node_fs_1 = require("node:fs");
+const recast = __importStar(require("recast"));
+const parse_ast_1 = require("../../codemods/parse-ast");
+const file_watcher_1 = require("../../file-watcher");
+const updatePublicLicenseInConfig = ({ configContents, publicLicenseKey, }) => {
+    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' &&
+                expression.callee.property.name === 'setPublicLicenseKey') {
+                path.prune();
+                return false;
+            }
+            this.traverse(path);
+        },
+    });
+    const configWithoutExistingCalls = recast.print(ast, {
+        lineTerminator: '\n',
+    }).code;
+    const separator = configWithoutExistingCalls.endsWith('\n') ? '' : '\n';
+    const escapedPublicLicenseKey = publicLicenseKey
+        .replaceAll('\\', '\\\\')
+        .replaceAll("'", "\\'")
+        .replaceAll('\r', '\\r')
+        .replaceAll('\n', '\\n')
+        .replaceAll('\u2028', '\\u2028')
+        .replaceAll('\u2029', '\\u2029');
+    return `${configWithoutExistingCalls}${separator}Config.setPublicLicenseKey('${escapedPublicLicenseKey}');\n`;
+};
+exports.updatePublicLicenseInConfig = updatePublicLicenseInConfig;
+const updatePublicLicenseHandler = ({ input, configFile }) => {
+    if (configFile === null || configFile === undefined) {
+        return Promise.resolve({
+            success: false,
+            reason: 'No Remotion config file was loaded.',
+        });
+    }
+    if (input.publicLicenseKey.length === 0) {
+        return Promise.resolve({
+            success: false,
+            reason: 'The public license key must not be empty.',
+        });
+    }
+    const configContents = (0, node_fs_1.readFileSync)(configFile, 'utf8');
+    (0, file_watcher_1.writeFileAndNotifyFileWatchers)(configFile, (0, exports.updatePublicLicenseInConfig)({
+        configContents,
+        publicLicenseKey: input.publicLicenseKey,
+    }), undefined);
+    return Promise.resolve({ success: true });
+};
+exports.updatePublicLicenseHandler = updatePublicLicenseHandler;

package/dist/preview-server/start-server.d.ts

@@ -1,4 +1,4 @@
-import type { WebpackOverrideFn } from '@remotion/bundler';
+import type { BundlerOverrideFn, RspackOverrideFn, WebpackOverrideFn } from '@remotion/bundler';
 import type { GitSource, RenderDefaults, RenderJob, StudioRuntimeConfig } from '@remotion/studio-shared';
 import type { QueueMethods } from './api-types';
 import type { LiveEventsServer } from './live-events';
@@ -14,14 +14,13 @@ export type StartServerResult = {
 export declare const startServer: (options: {
     entry: string;
     userDefinedComponent: string;
+    bundlerOverride: BundlerOverrideFn;
+    rspackOverride: RspackOverrideFn;
     webpackOverride: WebpackOverrideFn;
     getCurrentInputProps: () => object;
     getEnvVariables: () => Record<string, string>;
     port: number | null;
-    maxTimelineTracks: number | null;
-    bufferStateDelayInMilliseconds: number | null;
     remotionRoot: string;
-    keyboardShortcutsEnabled: boolean;
     publicDir: string;
     poll: number | null;
     staticHash: string;
@@ -39,9 +38,8 @@ export declare const startServer: (options: {
     getAudioLatencyHint: () => AudioContextLatencyCategory | null;
     getPreviewSampleRate: () => number | null;
     enableCrossSiteIsolation: boolean;
-    askAIEnabled: boolean;
-    interactivityEnabled: boolean;
     forceNew: boolean;
     rspack: boolean;
     getStudioRuntimeConfig: () => StudioRuntimeConfig;
+    configFile: string | null;
 }) => Promise<StartServerResult>;

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

@@ -16,7 +16,7 @@ const node_path_cache_1 = require("./node-path-cache");
 const undo_stack_1 = require("./undo-stack");
 const watch_ignore_next_change_1 = require("./watch-ignore-next-change");
 const startServer = async (options) => {
-    var _a, _b, _c;
+    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
@@ -37,14 +37,11 @@ const startServer = async (options) => {
         userDefinedComponent: options.userDefinedComponent,
         outDir: null,
         environment: 'development',
+        bundlerOverride: options.bundlerOverride,
+        rspackOverride: options.rspackOverride,
         webpackOverride: options === null || options === void 0 ? void 0 : options.webpackOverride,
-        maxTimelineTracks: (_c = options === null || options === void 0 ? void 0 : options.maxTimelineTracks) !== null && _c !== void 0 ? _c : null,
         remotionRoot: options.remotionRoot,
-        keyboardShortcutsEnabled: options.keyboardShortcutsEnabled,
         poll: options.poll,
-        bufferStateDelayInMilliseconds: options.bufferStateDelayInMilliseconds,
-        askAIEnabled: options.askAIEnabled,
-        interactivityEnabled: options.interactivityEnabled,
         extraPlugins: [watchIgnorePlugin],
     };
     let compiler;
@@ -105,6 +102,7 @@ const startServer = async (options) => {
                 getPreviewSampleRate: options.getPreviewSampleRate,
                 enableCrossSiteIsolation: options.enableCrossSiteIsolation,
                 getStudioRuntimeConfig: options.getStudioRuntimeConfig,
+                configFile: options.configFile,
             });
         })
             .catch((err) => {

package/dist/routes.d.ts

@@ -2,7 +2,7 @@ import type { IncomingMessage, ServerResponse } from 'node:http';
 import type { GitSource, RenderDefaults, RenderJob, StudioRuntimeConfig } from '@remotion/studio-shared';
 import type { QueueMethods } from './preview-server/api-types';
 import type { LiveEventsServer } from './preview-server/live-events';
-export declare 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, }: {
+export declare 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, }: {
     staticHash: string;
     staticHashPrefix: string;
     outputHash: string;
@@ -26,4 +26,5 @@ export declare const handleRoutes: ({ staticHash, staticHashPrefix, outputHash,
     getPreviewSampleRate: () => number | null;
     enableCrossSiteIsolation: boolean;
     getStudioRuntimeConfig: () => StudioRuntimeConfig;
+    configFile: string | null;
 }) => Promise<void>;

package/dist/routes.js

@@ -39,6 +39,7 @@ 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");
@@ -165,12 +166,11 @@ const handleRequestElementInstall = async ({ liveEventsServer, request, response
     response.setHeader('Content-Type', 'application/json');
     try {
         const body = await (0, parse_body_1.parseRequestBody)(request);
-        const parsed = (0, studio_shared_1.parseElementDragData)(JSON.stringify({
-            type: 'remotion-element',
-            version: 1,
-            element: body.element,
-        }));
-        if (parsed === null) {
+        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;
@@ -201,7 +201,7 @@ const handleRequestElementInstall = async ({ liveEventsServer, request, response
             createdAt: Date.now(),
             compositionFile: target.compositionFile,
             compositionId: target.compositionId,
-            element: parsed.element,
+            element: parsed.data.element,
             position: null,
         };
         const delivered = liveEventsServer.sendEventToClientId(target.clientId, {
@@ -394,7 +394,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, }) => {
+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 url = new URL(request.url, 'http://localhost');
     if (url.pathname === '/api/file-source') {
         return handleFileSource({
@@ -453,6 +453,7 @@ const handleRoutes = ({ staticHash, staticHashPrefix, outputHash, outputHashPref
                 methods,
                 binariesDirectory,
                 publicDir,
+                configFile,
             });
         }
     }

package/dist/start-studio.d.ts

@@ -1,4 +1,4 @@
-import type { WebpackOverrideFn } from '@remotion/bundler';
+import type { BundlerOverrideFn, RspackOverrideFn, WebpackOverrideFn } from '@remotion/bundler';
 import type { GitSource, RenderDefaults, RenderJob, StudioRuntimeConfig } from '@remotion/studio-shared';
 import type { QueueMethods } from './preview-server/api-types';
 export type StartStudioResult = {
@@ -6,7 +6,7 @@ export type StartStudioResult = {
 } | {
     type: 'already-running';
 };
-export declare const startStudio: ({ browserArgs, browserFlag, shouldOpenBrowser, fullEntryPath, logLevel, getCurrentInputProps, getEnvVariables, desiredPort, maxTimelineTracks, remotionRoot, keyboardShortcutsEnabled, relativePublicDir, webpackOverride, poll, getRenderDefaults, getRenderQueue, getNumberOfAudioTags, queueMethods, previewEntry, gitSource, bufferStateDelayInMilliseconds, binariesDirectory, forceIPv4, getAudioLatencyHint, getPreviewSampleRate, enableCrossSiteIsolation, askAIEnabled, interactivityEnabled, forceNew, rspack, getStudioRuntimeConfig, }: {
+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, }: {
     browserArgs: string;
     browserFlag: string;
     logLevel: "error" | "info" | "trace" | "verbose" | "warn";
@@ -15,11 +15,10 @@ export declare const startStudio: ({ browserArgs, browserFlag, shouldOpenBrowser
     getCurrentInputProps: () => object;
     getEnvVariables: () => Record<string, string>;
     desiredPort: number | null;
-    maxTimelineTracks: number | null;
-    bufferStateDelayInMilliseconds: number | null;
     remotionRoot: string;
-    keyboardShortcutsEnabled: boolean;
     relativePublicDir: string | null;
+    bundlerOverride: BundlerOverrideFn;
+    rspackOverride: RspackOverrideFn;
     webpackOverride: WebpackOverrideFn;
     poll: number | null;
     getRenderDefaults: () => RenderDefaults;
@@ -33,9 +32,8 @@ export declare const startStudio: ({ browserArgs, browserFlag, shouldOpenBrowser
     gitSource: GitSource | null;
     binariesDirectory: string | null;
     forceIPv4: boolean;
-    askAIEnabled: boolean;
-    interactivityEnabled: boolean;
     forceNew: boolean;
     rspack: boolean;
     getStudioRuntimeConfig: () => StudioRuntimeConfig;
+    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, maxTimelineTracks, remotionRoot, keyboardShortcutsEnabled, relativePublicDir, webpackOverride, poll, getRenderDefaults, getRenderQueue, getNumberOfAudioTags, queueMethods, previewEntry, gitSource, bufferStateDelayInMilliseconds, binariesDirectory, forceIPv4, getAudioLatencyHint, getPreviewSampleRate, enableCrossSiteIsolation, askAIEnabled, interactivityEnabled, forceNew, rspack, getStudioRuntimeConfig, }) => {
+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, }) => {
     try {
         if (typeof Bun === 'undefined') {
             process.title = 'node (npx remotion studio)';
@@ -69,10 +69,10 @@ const startStudio = async ({ browserArgs, browserFlag, shouldOpenBrowser, fullEn
         getCurrentInputProps,
         getEnvVariables,
         port: desiredPort,
-        maxTimelineTracks,
         remotionRoot,
-        keyboardShortcutsEnabled,
         publicDir,
+        bundlerOverride,
+        rspackOverride,
         webpackOverride,
         poll,
         staticHash,
@@ -85,17 +85,15 @@ const startStudio = async ({ browserArgs, browserFlag, shouldOpenBrowser, fullEn
         getNumberOfAudioTags,
         queueMethods,
         gitSource,
-        bufferStateDelayInMilliseconds,
         binariesDirectory,
         forceIPv4,
         getAudioLatencyHint,
         getPreviewSampleRate,
         enableCrossSiteIsolation,
-        askAIEnabled,
-        interactivityEnabled,
         forceNew,
         rspack,
         getStudioRuntimeConfig,
+        configFile,
     });
     if (result.type === 'already-running') {
         renderer_1.RenderInternals.Log.info({ indent: false, logLevel }, `Already running on port ${result.port}.`);

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.497",
+	"version": "4.0.499",
 	"description": "Run a Remotion Studio with a server backend",
 	"main": "dist",
 	"scripts": {
@@ -23,6 +23,7 @@
 		"access": "public"
 	},
 	"dependencies": {
+		"@remotion/drag-and-drop": "4.0.499",
 		"@babel/types": "7.24.0",
 		"@babel/parser": "7.24.1",
 		"@svgr/core": "8.1.0",
@@ -30,11 +31,11 @@
 		"kiwi-schema": "0.5.0",
 		"semver": "7.5.3",
 		"prettier": "3.8.1",
-		"remotion": "4.0.497",
+		"remotion": "4.0.499",
 		"recast": "0.23.11",
-		"@remotion/bundler": "4.0.497",
-		"@remotion/renderer": "4.0.497",
-		"@remotion/studio-shared": "4.0.497",
+		"@remotion/bundler": "4.0.499",
+		"@remotion/renderer": "4.0.499",
+		"@remotion/studio-shared": "4.0.499",
 		"memfs": "3.4.3",
 		"open": "8.4.2"
 	},
@@ -42,7 +43,7 @@
 		"ast-types": "0.16.1",
 		"react": "19.2.3",
 		"@types/semver": "7.5.3",
-		"@remotion/eslint-config-internal": "4.0.497",
+		"@remotion/eslint-config-internal": "4.0.499",
 		"eslint": "9.19.0",
 		"@types/node": "20.12.14",
 		"@typescript/native-preview": "7.0.0-dev.20260217.1"