@remotion/cli 4.0.0-alpha4 → 4.0.0-alpha6

package/dist/index.js

@@ -17,24 +17,25 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.CliInternals = exports.overrideRemotion = exports.ConfigInternals = exports.cli = void 0;
+exports.CliInternals = exports.cli = void 0;
 const renderer_1 = require("@remotion/renderer");
 const minimist_1 = __importDefault(require("minimist"));
 const benchmark_1 = require("./benchmark");
 const chalk_1 = require("./chalk");
 const cleanup_before_quit_1 = require("./cleanup-before-quit");
+const cloudrun_command_1 = require("./cloudrun-command");
 const compositions_1 = require("./compositions");
-const index_1 = require("./config/index");
 const determine_image_format_1 = require("./determine-image-format");
 const download_progress_1 = require("./download-progress");
 const entry_point_1 = require("./entry-point");
+const ffmpeg_1 = require("./ffmpeg");
 const format_bytes_1 = require("./format-bytes");
 const get_cli_options_1 = require("./get-cli-options");
 const get_config_file_name_1 = require("./get-config-file-name");
+const get_final_output_codec_1 = require("./get-final-output-codec");
 const handle_common_errors_1 = require("./handle-common-errors");
 const image_formats_1 = require("./image-formats");
 const initialize_cli_1 = require("./initialize-cli");
-const install_1 = require("./install");
 const lambda_command_1 = require("./lambda-command");
 const list_of_remotion_packages_1 = require("./list-of-remotion-packages");
 const log_1 = require("./log");
@@ -50,7 +51,6 @@ const still_1 = require("./still");
 const upgrade_1 = require("./upgrade");
 const versions_1 = require("./versions");
 const cli = async () => {
-    (0, index_1.overrideRemotion)();
     const [command, ...args] = parse_command_line_1.parsedCli._;
     if (parse_command_line_1.parsedCli.help) {
         (0, print_help_1.printHelp)();
@@ -73,21 +73,27 @@ const cli = async () => {
         else if (command === 'lambda') {
             await (0, lambda_command_1.lambdaCommand)(remotionRoot, args);
         }
+        else if (command === 'cloudrun') {
+            await (0, cloudrun_command_1.cloudrunCommand)(remotionRoot, args);
+        }
         else if (command === 'render') {
             await (0, render_1.render)(remotionRoot, args);
         }
         else if (command === 'still') {
             await (0, still_1.still)(remotionRoot, args);
         }
+        else if (command === 'ffmpeg') {
+            (0, ffmpeg_1.ffmpegCommand)(remotionRoot, process.argv.slice(3));
+        }
+        else if (command === 'ffprobe') {
+            (0, ffmpeg_1.ffprobeCommand)(remotionRoot, process.argv.slice(3));
+        }
         else if (command === 'upgrade') {
             await (0, upgrade_1.upgrade)(remotionRoot, parse_command_line_1.parsedCli['package-manager']);
         }
         else if (command === versions_1.VERSIONS_COMMAND) {
             await (0, versions_1.versionsCommand)(remotionRoot);
         }
-        else if (command === install_1.INSTALL_COMMAND) {
-            await (0, install_1.installCommand)(remotionRoot, args);
-        }
         else if (command === 'benchmark') {
             await (0, benchmark_1.benchmarkCommand)(remotionRoot, args);
         }
@@ -115,9 +121,6 @@ const cli = async () => {
     }
 };
 exports.cli = cli;
-var index_2 = require("./config/index");
-Object.defineProperty(exports, "ConfigInternals", { enumerable: true, get: function () { return index_2.ConfigInternals; } });
-Object.defineProperty(exports, "overrideRemotion", { enumerable: true, get: function () { return index_2.overrideRemotion; } });
 __exportStar(require("./render"), exports);
 exports.CliInternals = {
     createOverwriteableCliOutput: progress_bar_1.createOverwriteableCliOutput,
@@ -133,12 +136,12 @@ exports.CliInternals = {
     handleCommonError: handle_common_errors_1.handleCommonError,
     formatBytes: format_bytes_1.formatBytes,
     getFileSizeDownloadBar: download_progress_1.getFileSizeDownloadBar,
-    getFinalCodec: get_cli_options_1.getFinalCodec,
-    determineFinalImageFormat: determine_image_format_1.determineFinalImageFormat,
+    determineFinalStillImageFormat: determine_image_format_1.determineFinalStillImageFormat,
     minimist: minimist_1.default,
     selectComposition: select_composition_1.selectComposition,
     findEntryPoint: entry_point_1.findEntryPoint,
-    getImageFormat: image_formats_1.getImageFormat,
+    getVideoImageFormat: image_formats_1.getVideoImageFormat,
     printCompositions: print_compositions_1.printCompositions,
+    getFinalOutputCodec: get_final_output_codec_1.getFinalOutputCodec,
     listOfRemotionPackages: list_of_remotion_packages_1.listOfRemotionPackages,
 };

package/dist/list-of-remotion-packages.js

@@ -23,5 +23,6 @@ exports.listOfRemotionPackages = [
     '@remotion/rive',
     '@remotion/gif',
     '@remotion/shapes',
+    '@remotion/zod-types',
     'remotion',
 ];

package/dist/load-config.js

@@ -5,14 +5,14 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.loadConfigFile = void 0;
 const bundler_1 = require("@remotion/bundler");
-const fs_1 = __importDefault(require("fs"));
-const path_1 = __importDefault(require("path"));
-const worker_threads_1 = require("worker_threads");
+const node_fs_1 = __importDefault(require("node:fs"));
+const node_path_1 = __importDefault(require("node:path"));
+const node_worker_threads_1 = require("node:worker_threads");
 const log_1 = require("./log");
 const loadConfigFile = async (remotionRoot, configFileName, isJavascript) => {
-    const resolved = path_1.default.resolve(remotionRoot, configFileName);
-    const tsconfigJson = path_1.default.join(remotionRoot, 'tsconfig.json');
-    if (!isJavascript && !fs_1.default.existsSync(tsconfigJson)) {
+    const resolved = node_path_1.default.resolve(remotionRoot, configFileName);
+    const tsconfigJson = node_path_1.default.join(remotionRoot, 'tsconfig.json');
+    if (!isJavascript && !node_fs_1.default.existsSync(tsconfigJson)) {
         log_1.Log.error('Could not find a tsconfig.json file in your project. Did you delete it? Create a tsconfig.json in the root of your project. Copy the default file from https://github.com/remotion-dev/template-helloworld/blob/main/tsconfig.json.');
         log_1.Log.error('The root directory is:', remotionRoot);
         process.exit(1);
@@ -20,7 +20,7 @@ const loadConfigFile = async (remotionRoot, configFileName, isJavascript) => {
     const virtualOutfile = 'bundle.js';
     const result = await bundler_1.BundlerInternals.esbuild.build({
         platform: 'node',
-        target: 'node14',
+        target: 'node16',
         bundle: true,
         entryPoints: [resolved],
         tsconfig: isJavascript ? undefined : tsconfigJson,
@@ -39,13 +39,13 @@ const loadConfigFile = async (remotionRoot, configFileName, isJavascript) => {
     const str = new TextDecoder().decode(result.outputFiles[0].contents);
     const currentCwd = process.cwd();
     // The config file is always executed from the Remotion root, if `process.cwd()` is being used. We cannot enforce this in worker threads used for testing
-    if (worker_threads_1.isMainThread) {
+    if (node_worker_threads_1.isMainThread) {
         process.chdir(remotionRoot);
     }
     // Exectute the contents of the config file
     // eslint-disable-next-line no-eval
     eval(str);
-    if (worker_threads_1.isMainThread) {
+    if (node_worker_threads_1.isMainThread) {
         process.chdir(currentCwd);
     }
     return resolved;

package/dist/log.d.ts

@@ -1,6 +1,20 @@
+import type { LogLevel } from '@remotion/renderer';
+export declare const INDENT_TOKEN: string;
 export declare const Log: {
     verbose: (message?: any, ...optionalParams: any[]) => void;
+    verboseAdvanced: (options: {
+        indent: boolean;
+        logLevel: LogLevel;
+    }, message?: any, ...optionalParams: any[]) => void;
     info: (message?: any, ...optionalParams: any[]) => void;
+    infoAdvanced: (options: {
+        indent: boolean;
+        logLevel: LogLevel;
+    }, message?: any, ...optionalParams: any[]) => void;
     warn: (message?: any, ...optionalParams: any[]) => void;
+    warnAdvanced: (options: {
+        indent: boolean;
+        logLevel: LogLevel;
+    }, message?: any, ...optionalParams: any[]) => void;
     error: (message?: any, ...optionalParams: any[]) => void;
 };

package/dist/log.js

@@ -1,24 +1,40 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.Log = void 0;
-/* eslint-disable no-console */
+exports.Log = exports.INDENT_TOKEN = void 0;
 const renderer_1 = require("@remotion/renderer");
 const chalk_1 = require("./chalk");
 const config_1 = require("./config");
+const truthy_1 = require("./truthy");
+exports.INDENT_TOKEN = chalk_1.chalk.gray('│');
 exports.Log = {
     verbose: (...args) => {
-        if (renderer_1.RenderInternals.isEqualOrBelowLogLevel(config_1.ConfigInternals.Logging.getLogLevel(), 'verbose')) {
-            return console.log(...args.map((a) => chalk_1.chalk.blueBright(a)));
+        exports.Log.verboseAdvanced({ indent: false, logLevel: config_1.ConfigInternals.Logging.getLogLevel() }, ...args);
+    },
+    verboseAdvanced: (options, ...args) => {
+        if (renderer_1.RenderInternals.isEqualOrBelowLogLevel(options.logLevel, 'verbose')) {
+            return console.log(...[
+                options.indent ? exports.INDENT_TOKEN : null,
+                ...args.map((a) => chalk_1.chalk.blueBright(a)),
+            ].filter(truthy_1.truthy));
         }
     },
     info: (...args) => {
-        if (renderer_1.RenderInternals.isEqualOrBelowLogLevel(config_1.ConfigInternals.Logging.getLogLevel(), 'info')) {
-            return console.log(...args);
+        exports.Log.infoAdvanced({ indent: false, logLevel: config_1.ConfigInternals.Logging.getLogLevel() }, ...args);
+    },
+    infoAdvanced: (options, ...args) => {
+        if (renderer_1.RenderInternals.isEqualOrBelowLogLevel(options.logLevel, 'info')) {
+            return console.log(...[options.indent ? exports.INDENT_TOKEN : null, ...args].filter(truthy_1.truthy));
         }
     },
     warn: (...args) => {
-        if (renderer_1.RenderInternals.isEqualOrBelowLogLevel(config_1.ConfigInternals.Logging.getLogLevel(), 'warn')) {
-            return console.warn(...args.map((a) => chalk_1.chalk.yellow(a)));
+        exports.Log.warnAdvanced({ indent: false, logLevel: config_1.ConfigInternals.Logging.getLogLevel() }, ...args);
+    },
+    warnAdvanced: (options, ...args) => {
+        if (renderer_1.RenderInternals.isEqualOrBelowLogLevel(options.logLevel, 'warn')) {
+            return console.warn(...[
+                options.indent ? chalk_1.chalk.yellow(exports.INDENT_TOKEN) : null,
+                ...args.map((a) => chalk_1.chalk.yellow(a)),
+            ].filter(truthy_1.truthy));
         }
     },
     error: (...args) => {

package/dist/parse-command-line.d.ts

@@ -1,10 +1,8 @@
-import type { AudioCodec, BrowserExecutable, Codec, FfmpegExecutable, ImageFormat, OpenGlRenderer, PixelFormat, ProResProfile } from '@remotion/renderer';
-export declare type CommandLineOptions = {
+import type { AudioCodec, BrowserExecutable, Codec, OpenGlRenderer, PixelFormat, ProResProfile, StillImageFormat, VideoImageFormat } from '@remotion/renderer';
+declare type CommandLineOptions = {
     ['browser-executable']: BrowserExecutable;
-    ['ffmpeg-executable']: FfmpegExecutable;
-    ['ffprobe-executable']: FfmpegExecutable;
     ['pixel-format']: PixelFormat;
-    ['image-format']: ImageFormat;
+    ['image-format']: VideoImageFormat | StillImageFormat;
     ['prores-profile']: ProResProfile;
     ['bundle-cache']: string;
     ['env-file']: string;
@@ -27,6 +25,7 @@ export declare type CommandLineOptions = {
     png: boolean;
     props: string;
     quality: number;
+    ['jpeg-quality']: number;
     frames: string | number;
     scale: number;
     sequence: boolean;
@@ -58,3 +57,4 @@ export declare const parsedCli: CommandLineOptions & {
 };
 export declare const parseCommandLine: () => void;
 export declare const quietFlagProvided: () => boolean;
+export {};

package/dist/parse-command-line.js

@@ -6,7 +6,6 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.quietFlagProvided = exports.parseCommandLine = exports.parsedCli = exports.BooleanFlags = void 0;
 const renderer_1 = require("@remotion/renderer");
 const minimist_1 = __importDefault(require("minimist"));
-const path_1 = require("path");
 const config_1 = require("./config");
 const log_1 = require("./log");
 exports.BooleanFlags = [
@@ -39,21 +38,12 @@ const parseCommandLine = () => {
     if (exports.parsedCli['pixel-format']) {
         config_1.Config.setPixelFormat(exports.parsedCli['pixel-format']);
     }
-    if (exports.parsedCli['image-format']) {
-        config_1.Config.setImageFormat(exports.parsedCli['image-format']);
-    }
     if (exports.parsedCli['browser-executable']) {
         config_1.Config.setBrowserExecutable(exports.parsedCli['browser-executable']);
     }
-    if (exports.parsedCli['ffmpeg-executable']) {
-        config_1.Config.setFfmpegExecutable((0, path_1.resolve)(exports.parsedCli['ffmpeg-executable']));
-    }
     if (exports.parsedCli['number-of-gif-loops']) {
         config_1.Config.setNumberOfGifLoops(exports.parsedCli['number-of-gif-loops']);
     }
-    if (exports.parsedCli['ffprobe-executable']) {
-        config_1.Config.setFfprobeExecutable((0, path_1.resolve)(exports.parsedCli['ffprobe-executable']));
-    }
     if (typeof exports.parsedCli['bundle-cache'] !== 'undefined') {
         config_1.Config.setCachingEnabled(exports.parsedCli['bundle-cache'] !== 'false');
     }
@@ -98,9 +88,7 @@ const parseCommandLine = () => {
         config_1.ConfigInternals.setStillFrame(Number(exports.parsedCli.frame));
     }
     if (exports.parsedCli.png) {
-        log_1.Log.warn('The --png flag has been deprecrated. Use --sequence --image-format=png from now on.');
-        config_1.Config.setImageSequence(true);
-        config_1.Config.setImageFormat('png');
+        throw new Error('The --png flag has been deprecrated. Use --sequence --image-format=png from now on.');
     }
     if (exports.parsedCli.sequence) {
         config_1.Config.setImageSequence(true);
@@ -121,7 +109,11 @@ const parseCommandLine = () => {
         config_1.Config.setOverwriteOutput(exports.parsedCli.overwrite);
     }
     if (typeof exports.parsedCli.quality !== 'undefined') {
-        config_1.Config.setQuality(exports.parsedCli.quality);
+        log_1.Log.warn('The --quality flag has been renamed to --jpeg-quality instead.');
+        config_1.Config.setJpegQuality(exports.parsedCli.quality);
+    }
+    if (typeof exports.parsedCli['jpeg-quality'] !== 'undefined') {
+        config_1.Config.setJpegQuality(exports.parsedCli['jpeg-quality']);
     }
     if (typeof exports.parsedCli.scale !== 'undefined') {
         config_1.Config.setScale(exports.parsedCli.scale);

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

@@ -0,0 +1,4 @@
+import type { ApiHandler, ApiRoutes } from './api-types';
+export declare const allApiRoutes: {
+    [key in keyof ApiRoutes]: ApiHandler<ApiRoutes[key]['Request'], ApiRoutes[key]['Response']>;
+};

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

@@ -0,0 +1,21 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.allApiRoutes = void 0;
+const add_render_1 = require("./routes/add-render");
+const can_update_default_props_1 = require("./routes/can-update-default-props");
+const cancel_render_1 = require("./routes/cancel-render");
+const open_in_file_explorer_1 = require("./routes/open-in-file-explorer");
+const remove_render_1 = require("./routes/remove-render");
+const subscribe_to_file_existence_1 = require("./routes/subscribe-to-file-existence");
+const unsubscribe_from_file_existence_1 = require("./routes/unsubscribe-from-file-existence");
+const update_default_props_1 = require("./routes/update-default-props");
+exports.allApiRoutes = {
+    '/api/cancel': cancel_render_1.handleCancelRender,
+    '/api/render': add_render_1.handleAddRender,
+    '/api/unsubscribe-from-file-existence': unsubscribe_from_file_existence_1.unsubscribeFromFileExistence,
+    '/api/subscribe-to-file-existence': subscribe_to_file_existence_1.subscribeToFileExistence,
+    '/api/remove-render': remove_render_1.handleRemoveRender,
+    '/api/open-in-file-explorer': open_in_file_explorer_1.handleOpenInFileExplorer,
+    '/api/update-default-props': update_default_props_1.updateDefaultPropsHandler,
+    '/api/can-update-default-props': can_update_default_props_1.canUpdateDefaultPropsHandler,
+};

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

@@ -0,0 +1,25 @@
+/// <reference types="node" />
+import type { IncomingMessage, ServerResponse } from 'node:http';
+import type { AddRenderRequest, CancelRenderRequest, CancelRenderResponse, CanUpdateDefaultPropsRequest, CanUpdateDefaultPropsResponse, OpenInFileExplorerRequest, RemoveRenderRequest, SubscribeToFileExistenceRequest, SubscribeToFileExistenceResponse, UnsubscribeFromFileExistenceRequest, UpdateDefaultPropsRequest } from './render-queue/job';
+export declare type ApiHandler<ReqData, ResData> = (params: {
+    input: ReqData;
+    entryPoint: string;
+    remotionRoot: string;
+    request: IncomingMessage;
+    response: ServerResponse;
+}) => Promise<ResData>;
+declare type ReqAndRes<A, B> = {
+    Request: A;
+    Response: B;
+};
+export declare type ApiRoutes = {
+    '/api/cancel': ReqAndRes<CancelRenderRequest, CancelRenderResponse>;
+    '/api/render': ReqAndRes<AddRenderRequest, undefined>;
+    '/api/unsubscribe-from-file-existence': ReqAndRes<UnsubscribeFromFileExistenceRequest, undefined>;
+    '/api/subscribe-to-file-existence': ReqAndRes<SubscribeToFileExistenceRequest, SubscribeToFileExistenceResponse>;
+    '/api/remove-render': ReqAndRes<RemoveRenderRequest, undefined>;
+    '/api/open-in-file-explorer': ReqAndRes<OpenInFileExplorerRequest, void>;
+    '/api/update-default-props': ReqAndRes<UpdateDefaultPropsRequest, void>;
+    '/api/can-update-default-props': ReqAndRes<CanUpdateDefaultPropsRequest, CanUpdateDefaultPropsResponse>;
+};
+export {};

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

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/dist/preview-server/dev-middleware/compatible-api.d.ts

@@ -1,7 +1,7 @@
 /// <reference types="node" />
 /// <reference types="node" />
 /// <reference types="node" />
-import type { ReadStream } from 'fs';
-import type { IncomingMessage, ServerResponse } from 'http';
+import type { ReadStream } from 'node:fs';
+import type { IncomingMessage, ServerResponse } from 'node:http';
 export declare function setHeaderForResponse(res: ServerResponse, name: string, value: string | number): void;
 export declare function send(req: IncomingMessage, res: ServerResponse, bufferOtStream: ReadStream | string | Buffer, byteLength: number): void;

package/dist/preview-server/dev-middleware/middleware.d.ts

@@ -1,7 +1,6 @@
 /// <reference types="node" />
-import type { IncomingMessage, ServerResponse } from 'http';
+import type { IncomingMessage, ServerResponse } from 'node:http';
 import type { DevMiddlewareContext } from './types';
-export declare function getFilenameFromUrl(context: DevMiddlewareContext, url: string | undefined): string | undefined;
 export declare function getValueContentRangeHeader(type: string, size: number, range?: {
     start: number;
     end: number;

package/dist/preview-server/dev-middleware/middleware.js

@@ -3,11 +3,11 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.middleware = exports.getValueContentRangeHeader = exports.getFilenameFromUrl = void 0;
+exports.middleware = exports.getValueContentRangeHeader = void 0;
 const renderer_1 = require("@remotion/renderer");
-const path_1 = __importDefault(require("path"));
-const querystring_1 = __importDefault(require("querystring"));
-const url_1 = require("url");
+const node_path_1 = __importDefault(require("node:path"));
+const node_querystring_1 = __importDefault(require("node:querystring"));
+const node_url_1 = require("node:url");
 const compatible_api_1 = require("./compatible-api");
 const get_paths_1 = require("./get-paths");
 const range_parser_1 = require("./range-parser");
@@ -29,7 +29,7 @@ const mem = (fn, { cache = new Map() } = {}) => {
     cacheStore.set(memoized, cache);
     return memoized;
 };
-const memoizedParse = mem(url_1.parse);
+const memoizedParse = mem(node_url_1.parse);
 function getFilenameFromUrl(context, url) {
     var _a, _b;
     const paths = (0, get_paths_1.getPaths)(context);
@@ -57,7 +57,7 @@ function getFilenameFromUrl(context, url) {
             // `/complex/foo.js` => `foo.js`
             const pathname = urlObject.pathname.substr(publicPathObject.pathname.length);
             if (pathname) {
-                filename = path_1.default.join(outputPath, querystring_1.default.unescape(pathname));
+                filename = node_path_1.default.join(outputPath, node_querystring_1.default.unescape(pathname));
             }
             if (!context.outputFileSystem) {
                 continue;
@@ -70,7 +70,7 @@ function getFilenameFromUrl(context, url) {
                 }
                 else if (fsStats.isDirectory()) {
                     const indexValue = 'index.html';
-                    filename = path_1.default.join(filename, indexValue);
+                    filename = node_path_1.default.join(filename, indexValue);
                     // eslint-disable-next-line max-depth
                     try {
                         fsStats = context.outputFileSystem.statSync(filename);
@@ -92,7 +92,6 @@ function getFilenameFromUrl(context, url) {
     }
     return foundFilename;
 }
-exports.getFilenameFromUrl = getFilenameFromUrl;
 function getValueContentRangeHeader(type, size, range) {
     return `${type} ${range ? `${range.start}-${range.end}` : '*'}/${size}`;
 }
@@ -133,7 +132,7 @@ function middleware(context) {
              */
             if (!res.getHeader('Content-Type')) {
                 // content-type name(like application/javascript; charset=utf-8) or false
-                const contentType = renderer_1.RenderInternals.mimeContentType(path_1.default.extname(filename));
+                const contentType = renderer_1.RenderInternals.mimeContentType(node_path_1.default.extname(filename));
                 // Only set content-type header if media type is known
                 // https://tools.ietf.org/html/rfc7231#section-3.1.1.5
                 if (contentType) {

package/dist/preview-server/error-overlay/react-overlay/utils/get-file-source.js

@@ -4,18 +4,18 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.getFileSource = void 0;
-const fs_1 = __importDefault(require("fs"));
-const path_1 = __importDefault(require("path"));
+const node_fs_1 = __importDefault(require("node:fs"));
+const node_path_1 = __importDefault(require("node:path"));
 const allowedFileExtensions = ['js', 'ts', 'tsx', 'jsx', 'map', 'mjs'];
 const getFileSource = (remotionRoot, p) => {
     if (!allowedFileExtensions.find((extension) => p.endsWith(extension))) {
         throw new Error(`Not allowed to open ${p}`);
     }
-    const resolved = path_1.default.resolve(remotionRoot, p);
-    const relativeToProcessCwd = path_1.default.relative(remotionRoot, resolved);
+    const resolved = node_path_1.default.resolve(remotionRoot, p);
+    const relativeToProcessCwd = node_path_1.default.relative(remotionRoot, resolved);
     if (relativeToProcessCwd.startsWith('..')) {
         throw new Error(`Not allowed to open ${relativeToProcessCwd}`);
     }
-    return fs_1.default.promises.readFile(p, 'utf-8');
+    return node_fs_1.default.promises.readFile(p, 'utf-8');
 };
 exports.getFileSource = getFileSource;

package/dist/preview-server/error-overlay/react-overlay/utils/open-in-editor.js

@@ -28,13 +28,13 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.launchEditor = exports.guessEditor = exports.getDisplayNameForEditor = void 0;
-const child_process_1 = __importStar(require("child_process"));
-const fs_1 = __importDefault(require("fs"));
-const os_1 = __importDefault(require("os"));
-const path_1 = __importDefault(require("path"));
-const util_1 = __importDefault(require("util"));
+const node_child_process_1 = __importStar(require("node:child_process"));
+const node_fs_1 = __importDefault(require("node:fs"));
+const node_os_1 = __importDefault(require("node:os"));
+const node_path_1 = __importDefault(require("node:path"));
+const node_util_1 = __importDefault(require("node:util"));
 const log_1 = require("../../../../log");
-const execProm = util_1.default.promisify(child_process_1.exec);
+const execProm = node_util_1.default.promisify(node_child_process_1.exec);
 const isVsCodeDerivative = (editor) => {
     return (editor === 'code' ||
         editor === 'code-insiders' ||
@@ -253,8 +253,8 @@ const COMMON_EDITORS_WIN = [
 // alphanumeric characters, periods, dashes, slashes, and underscores.
 const WINDOWS_FILE_NAME_WHITELIST = /^([A-Za-z]:[/\\])?(?:[\x2D-9A-Z\\_a-z\xAA\xB5\xBA\xC0-\xD6\xD8-\xF6\xF8-\u02C1\u02C6-\u02D1\u02E0-\u02E4\u02EC\u02EE\u0370-\u0374\u0376\u0377\u037A-\u037D\u037F\u0386\u0388-\u038A\u038C\u038E-\u03A1\u03A3-\u03F5\u03F7-\u0481\u048A-\u052F\u0531-\u0556\u0559\u0560-\u0588\u05D0-\u05EA\u05EF-\u05F2\u0620-\u064A\u066E\u066F\u0671-\u06D3\u06D5\u06E5\u06E6\u06EE\u06EF\u06FA-\u06FC\u06FF\u0710\u0712-\u072F\u074D-\u07A5\u07B1\u07CA-\u07EA\u07F4\u07F5\u07FA\u0800-\u0815\u081A\u0824\u0828\u0840-\u0858\u0860-\u086A\u08A0-\u08B4\u08B6-\u08BD\u0904-\u0939\u093D\u0950\u0958-\u0961\u0971-\u0980\u0985-\u098C\u098F\u0990\u0993-\u09A8\u09AA-\u09B0\u09B2\u09B6-\u09B9\u09BD\u09CE\u09DC\u09DD\u09DF-\u09E1\u09F0\u09F1\u09FC\u0A05-\u0A0A\u0A0F\u0A10\u0A13-\u0A28\u0A2A-\u0A30\u0A32\u0A33\u0A35\u0A36\u0A38\u0A39\u0A59-\u0A5C\u0A5E\u0A72-\u0A74\u0A85-\u0A8D\u0A8F-\u0A91\u0A93-\u0AA8\u0AAA-\u0AB0\u0AB2\u0AB3\u0AB5-\u0AB9\u0ABD\u0AD0\u0AE0\u0AE1\u0AF9\u0B05-\u0B0C\u0B0F\u0B10\u0B13-\u0B28\u0B2A-\u0B30\u0B32\u0B33\u0B35-\u0B39\u0B3D\u0B5C\u0B5D\u0B5F-\u0B61\u0B71\u0B83\u0B85-\u0B8A\u0B8E-\u0B90\u0B92-\u0B95\u0B99\u0B9A\u0B9C\u0B9E\u0B9F\u0BA3\u0BA4\u0BA8-\u0BAA\u0BAE-\u0BB9\u0BD0\u0C05-\u0C0C\u0C0E-\u0C10\u0C12-\u0C28\u0C2A-\u0C39\u0C3D\u0C58-\u0C5A\u0C60\u0C61\u0C80\u0C85-\u0C8C\u0C8E-\u0C90\u0C92-\u0CA8\u0CAA-\u0CB3\u0CB5-\u0CB9\u0CBD\u0CDE\u0CE0\u0CE1\u0CF1\u0CF2\u0D05-\u0D0C\u0D0E-\u0D10\u0D12-\u0D3A\u0D3D\u0D4E\u0D54-\u0D56\u0D5F-\u0D61\u0D7A-\u0D7F\u0D85-\u0D96\u0D9A-\u0DB1\u0DB3-\u0DBB\u0DBD\u0DC0-\u0DC6\u0E01-\u0E30\u0E32\u0E33\u0E40-\u0E46\u0E81\u0E82\u0E84\u0E87\u0E88\u0E8A\u0E8D\u0E94-\u0E97\u0E99-\u0E9F\u0EA1-\u0EA3\u0EA5\u0EA7\u0EAA\u0EAB\u0EAD-\u0EB0\u0EB2\u0EB3\u0EBD\u0EC0-\u0EC4\u0EC6\u0EDC-\u0EDF\u0F00\u0F40-\u0F47\u0F49-\u0F6C\u0F88-\u0F8C\u1000-\u102A\u103F\u1050-\u1055\u105A-\u105D\u1061\u1065\u1066\u106E-\u1070\u1075-\u1081\u108E\u10A0-\u10C5\u10C7\u10CD\u10D0-\u10FA\u10FC-\u1248\u124A-\u124D\u1250-\u1256\u1258\u125A-\u125D\u1260-\u1288\u128A-\u128D\u1290-\u12B0\u12B2-\u12B5\u12B8-\u12BE\u12C0\u12C2-\u12C5\u12C8-\u12D6\u12D8-\u1310\u1312-\u1315\u1318-\u135A\u1380-\u138F\u13A0-\u13F5\u13F8-\u13FD\u1401-\u166C\u166F-\u167F\u1681-\u169A\u16A0-\u16EA\u16F1-\u16F8\u1700-\u170C\u170E-\u1711\u1720-\u1731\u1740-\u1751\u1760-\u176C\u176E-\u1770\u1780-\u17B3\u17D7\u17DC\u1820-\u1878\u1880-\u1884\u1887-\u18A8\u18AA\u18B0-\u18F5\u1900-\u191E\u1950-\u196D\u1970-\u1974\u1980-\u19AB\u19B0-\u19C9\u1A00-\u1A16\u1A20-\u1A54\u1AA7\u1B05-\u1B33\u1B45-\u1B4B\u1B83-\u1BA0\u1BAE\u1BAF\u1BBA-\u1BE5\u1C00-\u1C23\u1C4D-\u1C4F\u1C5A-\u1C7D\u1C80-\u1C88\u1C90-\u1CBA\u1CBD-\u1CBF\u1CE9-\u1CEC\u1CEE-\u1CF1\u1CF5\u1CF6\u1D00-\u1DBF\u1E00-\u1F15\u1F18-\u1F1D\u1F20-\u1F45\u1F48-\u1F4D\u1F50-\u1F57\u1F59\u1F5B\u1F5D\u1F5F-\u1F7D\u1F80-\u1FB4\u1FB6-\u1FBC\u1FBE\u1FC2-\u1FC4\u1FC6-\u1FCC\u1FD0-\u1FD3\u1FD6-\u1FDB\u1FE0-\u1FEC\u1FF2-\u1FF4\u1FF6-\u1FFC\u2071\u207F\u2090-\u209C\u2102\u2107\u210A-\u2113\u2115\u2119-\u211D\u2124\u2126\u2128\u212A-\u212D\u212F-\u2139\u213C-\u213F\u2145-\u2149\u214E\u2183\u2184\u2C00-\u2C2E\u2C30-\u2C5E\u2C60-\u2CE4\u2CEB-\u2CEE\u2CF2\u2CF3\u2D00-\u2D25\u2D27\u2D2D\u2D30-\u2D67\u2D6F\u2D80-\u2D96\u2DA0-\u2DA6\u2DA8-\u2DAE\u2DB0-\u2DB6\u2DB8-\u2DBE\u2DC0-\u2DC6\u2DC8-\u2DCE\u2DD0-\u2DD6\u2DD8-\u2DDE\u2E2F\u3005\u3006\u3031-\u3035\u303B\u303C\u3041-\u3096\u309D-\u309F\u30A1-\u30FA\u30FC-\u30FF\u3105-\u312F\u3131-\u318E\u31A0-\u31BA\u31F0-\u31FF\u3400-\u4DB5\u4E00-\u9FEF\uA000-\uA48C\uA4D0-\uA4FD\uA500-\uA60C\uA610-\uA61F\uA62A\uA62B\uA640-\uA66E\uA67F-\uA69D\uA6A0-\uA6E5\uA717-\uA71F\uA722-\uA788\uA78B-\uA7B9\uA7F7-\uA801\uA803-\uA805\uA807-\uA80A\uA80C-\uA822\uA840-\uA873\uA882-\uA8B3\uA8F2-\uA8F7\uA8FB\uA8FD\uA8FE\uA90A-\uA925\uA930-\uA946\uA960-\uA97C\uA984-\uA9B2\uA9CF\uA9E0-\uA9E4\uA9E6-\uA9EF\uA9FA-\uA9FE\uAA00-\uAA28\uAA40-\uAA42\uAA44-\uAA4B\uAA60-\uAA76\uAA7A\uAA7E-\uAAAF\uAAB1\uAAB5\uAAB6\uAAB9-\uAABD\uAAC0\uAAC2\uAADB-\uAADD\uAAE0-\uAAEA\uAAF2-\uAAF4\uAB01-\uAB06\uAB09-\uAB0E\uAB11-\uAB16\uAB20-\uAB26\uAB28-\uAB2E\uAB30-\uAB5A\uAB5C-\uAB65\uAB70-\uABE2\uAC00-\uD7A3\uD7B0-\uD7C6\uD7CB-\uD7FB\uF900-\uFA6D\uFA70-\uFAD9\uFB00-\uFB06\uFB13-\uFB17\uFB1D\uFB1F-\uFB28\uFB2A-\uFB36\uFB38-\uFB3C\uFB3E\uFB40\uFB41\uFB43\uFB44\uFB46-\uFBB1\uFBD3-\uFD3D\uFD50-\uFD8F\uFD92-\uFDC7\uFDF0-\uFDFB\uFE70-\uFE74\uFE76-\uFEFC\uFF21-\uFF3A\uFF41-\uFF5A\uFF66-\uFFBE\uFFC2-\uFFC7\uFFCA-\uFFCF\uFFD2-\uFFD7\uFFDA-\uFFDC]|\uD800[\uDC00-\uDC0B\uDC0D-\uDC26\uDC28-\uDC3A\uDC3C\uDC3D\uDC3F-\uDC4D\uDC50-\uDC5D\uDC80-\uDCFA\uDE80-\uDE9C\uDEA0-\uDED0\uDF00-\uDF1F\uDF2D-\uDF40\uDF42-\uDF49\uDF50-\uDF75\uDF80-\uDF9D\uDFA0-\uDFC3\uDFC8-\uDFCF]|\uD801[\uDC00-\uDC9D\uDCB0-\uDCD3\uDCD8-\uDCFB\uDD00-\uDD27\uDD30-\uDD63\uDE00-\uDF36\uDF40-\uDF55\uDF60-\uDF67]|\uD802[\uDC00-\uDC05\uDC08\uDC0A-\uDC35\uDC37\uDC38\uDC3C\uDC3F-\uDC55\uDC60-\uDC76\uDC80-\uDC9E\uDCE0-\uDCF2\uDCF4\uDCF5\uDD00-\uDD15\uDD20-\uDD39\uDD80-\uDDB7\uDDBE\uDDBF\uDE00\uDE10-\uDE13\uDE15-\uDE17\uDE19-\uDE35\uDE60-\uDE7C\uDE80-\uDE9C\uDEC0-\uDEC7\uDEC9-\uDEE4\uDF00-\uDF35\uDF40-\uDF55\uDF60-\uDF72\uDF80-\uDF91]|\uD803[\uDC00-\uDC48\uDC80-\uDCB2\uDCC0-\uDCF2\uDD00-\uDD23\uDF00-\uDF1C\uDF27\uDF30-\uDF45]|\uD804[\uDC03-\uDC37\uDC83-\uDCAF\uDCD0-\uDCE8\uDD03-\uDD26\uDD44\uDD50-\uDD72\uDD76\uDD83-\uDDB2\uDDC1-\uDDC4\uDDDA\uDDDC\uDE00-\uDE11\uDE13-\uDE2B\uDE80-\uDE86\uDE88\uDE8A-\uDE8D\uDE8F-\uDE9D\uDE9F-\uDEA8\uDEB0-\uDEDE\uDF05-\uDF0C\uDF0F\uDF10\uDF13-\uDF28\uDF2A-\uDF30\uDF32\uDF33\uDF35-\uDF39\uDF3D\uDF50\uDF5D-\uDF61]|\uD805[\uDC00-\uDC34\uDC47-\uDC4A\uDC80-\uDCAF\uDCC4\uDCC5\uDCC7\uDD80-\uDDAE\uDDD8-\uDDDB\uDE00-\uDE2F\uDE44\uDE80-\uDEAA\uDF00-\uDF1A]|\uD806[\uDC00-\uDC2B\uDCA0-\uDCDF\uDCFF\uDE00\uDE0B-\uDE32\uDE3A\uDE50\uDE5C-\uDE83\uDE86-\uDE89\uDE9D\uDEC0-\uDEF8]|\uD807[\uDC00-\uDC08\uDC0A-\uDC2E\uDC40\uDC72-\uDC8F\uDD00-\uDD06\uDD08\uDD09\uDD0B-\uDD30\uDD46\uDD60-\uDD65\uDD67\uDD68\uDD6A-\uDD89\uDD98\uDEE0-\uDEF2]|\uD808[\uDC00-\uDF99]|\uD809[\uDC80-\uDD43]|[\uD80C\uD81C-\uD820\uD840-\uD868\uD86A-\uD86C\uD86F-\uD872\uD874-\uD879][\uDC00-\uDFFF]|\uD80D[\uDC00-\uDC2E]|\uD811[\uDC00-\uDE46]|\uD81A[\uDC00-\uDE38\uDE40-\uDE5E\uDED0-\uDEED\uDF00-\uDF2F\uDF40-\uDF43\uDF63-\uDF77\uDF7D-\uDF8F]|\uD81B[\uDE40-\uDE7F\uDF00-\uDF44\uDF50\uDF93-\uDF9F\uDFE0\uDFE1]|\uD821[\uDC00-\uDFF1]|\uD822[\uDC00-\uDEF2]|\uD82C[\uDC00-\uDD1E\uDD70-\uDEFB]|\uD82F[\uDC00-\uDC6A\uDC70-\uDC7C\uDC80-\uDC88\uDC90-\uDC99]|\uD835[\uDC00-\uDC54\uDC56-\uDC9C\uDC9E\uDC9F\uDCA2\uDCA5\uDCA6\uDCA9-\uDCAC\uDCAE-\uDCB9\uDCBB\uDCBD-\uDCC3\uDCC5-\uDD05\uDD07-\uDD0A\uDD0D-\uDD14\uDD16-\uDD1C\uDD1E-\uDD39\uDD3B-\uDD3E\uDD40-\uDD44\uDD46\uDD4A-\uDD50\uDD52-\uDEA5\uDEA8-\uDEC0\uDEC2-\uDEDA\uDEDC-\uDEFA\uDEFC-\uDF14\uDF16-\uDF34\uDF36-\uDF4E\uDF50-\uDF6E\uDF70-\uDF88\uDF8A-\uDFA8\uDFAA-\uDFC2\uDFC4-\uDFCB]|\uD83A[\uDC00-\uDCC4\uDD00-\uDD43]|\uD83B[\uDE00-\uDE03\uDE05-\uDE1F\uDE21\uDE22\uDE24\uDE27\uDE29-\uDE32\uDE34-\uDE37\uDE39\uDE3B\uDE42\uDE47\uDE49\uDE4B\uDE4D-\uDE4F\uDE51\uDE52\uDE54\uDE57\uDE59\uDE5B\uDE5D\uDE5F\uDE61\uDE62\uDE64\uDE67-\uDE6A\uDE6C-\uDE72\uDE74-\uDE77\uDE79-\uDE7C\uDE7E\uDE80-\uDE89\uDE8B-\uDE9B\uDEA1-\uDEA3\uDEA5-\uDEA9\uDEAB-\uDEBB]|\uD869[\uDC00-\uDED6\uDF00-\uDFFF]|\uD86D[\uDC00-\uDF34\uDF40-\uDFFF]|\uD86E[\uDC00-\uDC1D\uDC20-\uDFFF]|\uD873[\uDC00-\uDEA1\uDEB0-\uDFFF]|\uD87A[\uDC00-\uDFE0]|\uD87E[\uDC00-\uDE1D])+$/;
 function getArgumentsForLineNumber(editor, fileName, lineNumber, colNumber) {
-    const editorBasename = path_1.default.basename(editor).replace(/\.(exe|cmd|bat)$/i, '');
-    const isFolder = fs_1.default.existsSync(fileName) && fs_1.default.lstatSync(fileName).isDirectory();
+    const editorBasename = node_path_1.default.basename(editor).replace(/\.(exe|cmd|bat)$/i, '');
+    const isFolder = node_fs_1.default.existsSync(fileName) && node_fs_1.default.lstatSync(fileName).isDirectory();
     switch (editorBasename) {
         case 'atom':
         case 'Atom':
@@ -341,7 +341,7 @@ async function guessEditor() {
             const runningProcesses = output.split('\r\n');
             for (let i = 0; i < runningProcesses.length; i++) {
                 const processPath = runningProcesses[i].trim();
-                const processName = path_1.default.basename(processPath);
+                const processName = node_path_1.default.basename(processPath);
                 if (COMMON_EDITORS_WIN.indexOf(processName) !== -1) {
                     availableEditors.push({
                         process: processPath,
@@ -394,7 +394,7 @@ async function guessEditor() {
 exports.guessEditor = guessEditor;
 let _childProcess = null;
 async function launchEditor({ colNumber, editor, fileName, lineNumber, vsCodeNewWindow, }) {
-    if (!fs_1.default.existsSync(fileName)) {
+    if (!node_fs_1.default.existsSync(fileName)) {
         return false;
     }
     // Sanitize lineNumber to prevent malicious use on win32
@@ -413,14 +413,14 @@ async function launchEditor({ colNumber, editor, fileName, lineNumber, vsCodeNew
     }
     if (process.platform === 'linux' &&
         fileName.startsWith('/mnt/') &&
-        /Microsoft/i.test(os_1.default.release())) {
+        /Microsoft/i.test(node_os_1.default.release())) {
         // Assume WSL / "Bash on Ubuntu on Windows" is being used, and
         // that the file exists on the Windows file system.
         // `os.release()` is "4.4.0-43-Microsoft" in the current release
         // build of WSL, see: https://github.com/Microsoft/BashOnWindows/issues/423#issuecomment-221627364
         // When a Windows editor is specified, interop functionality can
         // handle the path translation, but only if a relative path is used.
-        fileName = path_1.default.relative('', fileName);
+        fileName = node_path_1.default.relative('', fileName);
     }
     // cmd.exe on Windows is vulnerable to RCE attacks given a file name of the
     // form "C:\Users\myusername\Downloads\& curl 172.21.93.52". Use a whitelist
@@ -429,7 +429,7 @@ async function launchEditor({ colNumber, editor, fileName, lineNumber, vsCodeNew
     if (process.platform === 'win32' &&
         !WINDOWS_FILE_NAME_WHITELIST.test(fileName.trim())) {
         log_1.Log.error();
-        log_1.Log.error('Could not open ' + path_1.default.basename(fileName) + ' in the editor.');
+        log_1.Log.error('Could not open ' + node_path_1.default.basename(fileName) + ' in the editor.');
         log_1.Log.error();
         log_1.Log.error('When running on Windows, file names are checked against a whitelist ' +
             'to protect against remote code execution attacks. File names may ' +
@@ -450,14 +450,14 @@ async function launchEditor({ colNumber, editor, fileName, lineNumber, vsCodeNew
         // instances attach to the stdin/stdout which gets confusing.
         _childProcess.kill('SIGKILL');
     }
-    const isWin = os_1.default.platform() === 'win32';
+    const isWin = node_os_1.default.platform() === 'win32';
     const where = isWin ? 'where' : 'which';
     const binaryToUse = await new Promise((resolve) => {
         if (editor.command === editor.process) {
             resolve(editor.command);
             return;
         }
-        child_process_1.default.exec(`${where} "${editor.command}"`, (err) => {
+        node_child_process_1.default.exec(`${where} "${editor.command}"`, (err) => {
             if (err) {
                 resolve(editor.process);
             }
@@ -470,10 +470,10 @@ async function launchEditor({ colNumber, editor, fileName, lineNumber, vsCodeNew
         if (process.platform === 'win32') {
             // On Windows, launch the editor in a shell because spawn can only
             // launch .exe files.
-            _childProcess = child_process_1.default.spawn('cmd.exe', ['/C', binaryToUse].concat(args), { stdio: 'inherit', detached: true });
+            _childProcess = node_child_process_1.default.spawn('cmd.exe', ['/C', binaryToUse].concat(args), { stdio: 'inherit', detached: true });
         }
         else {
-            _childProcess = child_process_1.default.spawn(binaryToUse, args, {
+            _childProcess = node_child_process_1.default.spawn(binaryToUse, args, {
                 stdio: 'inherit',
             });
         }

package/dist/preview-server/error-overlay/remotion-overlay/AskOnDiscord.js

@@ -25,6 +25,7 @@ const AskOnDiscord = ({ canHaveKeyboardShortcuts }) => {
             callback: onEditor,
             commandCtrlKey: true,
             preventDefault: true,
+            triggerIfInputFieldFocused: false,
         });
         return () => unregister();
     }, [canHaveKeyboardShortcuts, openInBrowser, registerKeybinding]);

package/dist/preview-server/error-overlay/remotion-overlay/Button.d.ts

@@ -1,7 +1,11 @@
 import React from 'react';
-export declare const Button: React.FC<{
+export declare const Button: React.ForwardRefExoticComponent<{
     onClick: () => void;
-    disabled?: boolean;
+    disabled?: boolean | undefined;
     children: React.ReactNode;
-    style?: React.CSSProperties;
-}>;
+    style?: React.CSSProperties | undefined;
+    buttonContainerStyle?: React.CSSProperties | undefined;
+    autoFocus?: boolean | undefined;
+    title?: string | undefined;
+    id?: string | undefined;
+} & React.RefAttributes<HTMLButtonElement>>;