@remotion/cli 3.2.16 → 3.2.20

package/dist/bundle.js

@@ -11,7 +11,7 @@ const bundleCommand = async (remotionRoot) => {
     if (!file) {
         log_1.Log.error('No entry point specified. Pass more arguments:');
         log_1.Log.error('   npx remotion bundle [entry-point]');
-        log_1.Log.error('Documentation: https://www.remotion.dev/docs/render');
+        log_1.Log.error('Documentation: https://www.remotion.dev/docs/cli/bundle');
         process.exit(1);
     }
     await (0, initialize_render_cli_1.initializeRenderCli)(remotionRoot, 'bundle');

package/dist/config/bundle-out-dir.d.ts

@@ -1,2 +1,2 @@
 export declare const getBundleOutDir: () => string | null;
-export declare const setBundleOutDir: (path: string) => void;
+export declare const setBundleDir: (path: string) => void;

package/dist/config/bundle-out-dir.js

@@ -1,12 +1,12 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.setBundleOutDir = exports.getBundleOutDir = void 0;
+exports.setBundleDir = exports.getBundleOutDir = void 0;
 let bundleOutDir = null;
 const getBundleOutDir = () => {
     return bundleOutDir;
 };
 exports.getBundleOutDir = getBundleOutDir;
-const setBundleOutDir = (path) => {
+const setBundleDir = (path) => {
     bundleOutDir = path;
 };
-exports.setBundleOutDir = setBundleOutDir;
+exports.setBundleDir = setBundleDir;

package/dist/editor/components/PreviewZoomControls.js

@@ -20,48 +20,30 @@ const iconStyle = {
     color: 'white',
     width: 14,
 };
-const slider = {
-    width: 120,
-    accentColor: 'var(--blue)',
-};
 const PreviewZoomControls = () => {
     const { size, setSize } = (0, react_1.useContext)(preview_size_1.PreviewSizeContext);
     const onZoomOutClicked = (0, react_1.useCallback)(() => {
         setSize((z) => {
-            if (z === 'auto')
-                return 1 - preview_size_1.ZOOM_BUTTON_STEP;
-            const newSize = Number((Number(z) - preview_size_1.ZOOM_BUTTON_STEP).toFixed(2));
-            return Math.max(preview_size_1.PREVIEW_MIN_ZOOM, newSize);
+            // TODO: Don't assume 1
+            const newSize = Number((z.size === 'auto' ? 1 : z.size - preview_size_1.ZOOM_BUTTON_STEP).toFixed(2));
+            return { ...z, size: Math.max(preview_size_1.PREVIEW_MIN_ZOOM, newSize) };
         });
     }, [setSize]);
     const onZoomInClicked = (0, react_1.useCallback)(() => {
         setSize((z) => {
-            if (z === 'auto')
-                return 1 + preview_size_1.ZOOM_BUTTON_STEP;
+            // TODO: Don't assume 1
+            if (z.size === 'auto')
+                return {
+                    size: 1 + preview_size_1.ZOOM_BUTTON_STEP,
+                    translation: {
+                        x: 0,
+                        y: 0,
+                    },
+                };
             const newSize = Number((Number(z) + preview_size_1.ZOOM_BUTTON_STEP).toFixed(2));
-            return Math.min(preview_size_1.PREVIEW_MAX_ZOOM, newSize);
-        });
-    }, [setSize]);
-    const onChange = (0, react_1.useCallback)((e) => {
-        setSize(() => Number(e.target.value));
-    }, [setSize]);
-    const onWheel = (0, react_1.useCallback)((e) => {
-        setSize((z) => {
-            if (e.deltaY > 0) {
-                if (z === 'auto')
-                    return 1 - preview_size_1.ZOOM_SLIDER_STEP;
-                const newSize = Number((Number(z) - preview_size_1.ZOOM_SLIDER_STEP).toFixed(2));
-                return Math.max(preview_size_1.PREVIEW_MIN_ZOOM, newSize);
-            }
-            if (e.deltaY < 0) {
-                if (z === 'auto')
-                    return 1 + preview_size_1.ZOOM_SLIDER_STEP;
-                const newSize = Number((Number(z) + preview_size_1.ZOOM_SLIDER_STEP).toFixed(2));
-                return Math.min(preview_size_1.PREVIEW_MAX_ZOOM, newSize);
-            }
-            return z;
+            return { ...z, size: Math.min(preview_size_1.PREVIEW_MAX_ZOOM, newSize) };
         });
     }, [setSize]);
-    return ((0, jsx_runtime_1.jsxs)("div", { style: container, children: [(0, jsx_runtime_1.jsx)(ControlButton_1.ControlButton, { onClick: onZoomOutClicked, style: buttonStyle, title: "Zoom out preview", role: 'ControlButton', type: "button", disabled: preview_size_1.PREVIEW_MIN_ZOOM === size, children: (0, jsx_runtime_1.jsx)(minus_1.Minus, { style: iconStyle }) }), (0, jsx_runtime_1.jsx)(layout_1.Spacing, { x: 0.5 }), (0, jsx_runtime_1.jsx)("input", { title: `Preview size (${size}x)`, alt: `Preview size (${size}x)`, type: 'range', min: preview_size_1.PREVIEW_MIN_ZOOM, step: preview_size_1.ZOOM_SLIDER_STEP, value: size, max: preview_size_1.PREVIEW_MAX_ZOOM, onChange: onChange, onWheel: onWheel, style: slider }), (0, jsx_runtime_1.jsx)(layout_1.Spacing, { x: 0.5 }), (0, jsx_runtime_1.jsx)(ControlButton_1.ControlButton, { onClick: onZoomInClicked, style: buttonStyle, title: "Zoom in preview", role: 'button', type: "button", disabled: preview_size_1.PREVIEW_MAX_ZOOM === size, children: (0, jsx_runtime_1.jsx)(plus_1.Plus, { style: iconStyle }) })] }));
+    return ((0, jsx_runtime_1.jsxs)("div", { style: container, children: [(0, jsx_runtime_1.jsx)(ControlButton_1.ControlButton, { onClick: onZoomOutClicked, style: buttonStyle, title: "Zoom out preview", role: 'ControlButton', type: "button", disabled: size.size !== 'auto' && preview_size_1.PREVIEW_MIN_ZOOM === size.size, children: (0, jsx_runtime_1.jsx)(minus_1.Minus, { style: iconStyle }) }), (0, jsx_runtime_1.jsx)(layout_1.Spacing, { x: 0.5 }), (0, jsx_runtime_1.jsx)(layout_1.Spacing, { x: 0.5 }), (0, jsx_runtime_1.jsx)(ControlButton_1.ControlButton, { onClick: onZoomInClicked, style: buttonStyle, title: "Zoom in preview", role: 'button', type: "button", disabled: size.size !== 'auto' && preview_size_1.PREVIEW_MAX_ZOOM === size.size, children: (0, jsx_runtime_1.jsx)(plus_1.Plus, { style: iconStyle }) })] }));
 };
 exports.PreviewZoomControls = PreviewZoomControls;

package/dist/get-cli-options.d.ts

@@ -5,7 +5,7 @@ export declare const getCliOptions: (options: {
     type: 'still' | 'series' | 'get-compositions';
 }) => Promise<{
     puppeteerTimeout: number;
-    parallelism: number | null;
+    concurrency: number | null;
     frameRange: FrameRange | null;
     shouldOutputImageSequence: boolean;
     codec: "h264" | "h265" | "vp8" | "vp9" | "mp3" | "aac" | "wav" | "prores" | "h264-mkv" | "gif";

package/dist/get-cli-options.js

@@ -152,11 +152,11 @@ const getCliOptions = async (options) => {
     };
     const everyNthFrame = config_1.ConfigInternals.getAndValidateEveryNthFrame(codec);
     const numberOfGifLoops = config_1.ConfigInternals.getAndValidateNumberOfGifLoops(codec);
-    const parallelism = config_1.ConfigInternals.getConcurrency();
-    renderer_1.RenderInternals.validateConcurrency(parallelism, 'concurrency');
+    const concurrency = config_1.ConfigInternals.getConcurrency();
+    renderer_1.RenderInternals.validateConcurrency(concurrency, 'concurrency');
     return {
         puppeteerTimeout: config_1.ConfigInternals.getCurrentPuppeteerTimeout(),
-        parallelism,
+        concurrency,
         frameRange,
         shouldOutputImageSequence,
         codec,

package/dist/index.d.ts

@@ -72,7 +72,7 @@ export declare const CliInternals: {
         type: "still" | "series" | "get-compositions";
     }) => Promise<{
         puppeteerTimeout: number;
-        parallelism: number | null;
+        concurrency: number | null;
         frameRange: import("@remotion/renderer").FrameRange | null;
         shouldOutputImageSequence: boolean;
         codec: "h264" | "h265" | "vp8" | "vp9" | "mp3" | "aac" | "wav" | "prores" | "h264-mkv" | "gif";

package/dist/render.js

@@ -36,7 +36,7 @@ const render = async (remotionRoot) => {
     const downloadMap = renderer_1.RenderInternals.makeDownloadMap();
     await (0, initialize_render_cli_1.initializeRenderCli)(remotionRoot, 'sequence');
     log_1.Log.verbose('Asset dirs', downloadMap.assetDir);
-    const { codec, proResProfile, parallelism, frameRange, shouldOutputImageSequence, overwrite, inputProps, envVariables, quality, browser, crf, pixelFormat, imageFormat, browserExecutable, ffmpegExecutable, ffprobeExecutable, scale, chromiumOptions, port, numberOfGifLoops, everyNthFrame, puppeteerTimeout, muted, enforceAudioTrack, publicDir, } = await (0, get_cli_options_1.getCliOptions)({
+    const { codec, proResProfile, concurrency, frameRange, shouldOutputImageSequence, overwrite, inputProps, envVariables, quality, browser, crf, pixelFormat, imageFormat, browserExecutable, ffmpegExecutable, ffprobeExecutable, scale, chromiumOptions, port, numberOfGifLoops, everyNthFrame, puppeteerTimeout, muted, enforceAudioTrack, publicDir, } = await (0, get_cli_options_1.getCliOptions)({
         isLambda: false,
         type: 'series',
     });
@@ -129,7 +129,7 @@ const render = async (remotionRoot) => {
             rendering: {
                 frames: renderedFrames,
                 totalFrames: totalFrames.length,
-                concurrency: renderer_1.RenderInternals.getActualConcurrency(parallelism),
+                concurrency: renderer_1.RenderInternals.getActualConcurrency(concurrency),
                 doneIn: renderedDoneIn,
                 steps,
             },
@@ -178,7 +178,7 @@ const render = async (remotionRoot) => {
             everyNthFrame,
             envVariables,
             frameRange,
-            parallelism,
+            concurrency,
             puppeteerInstance,
             quality,
             timeoutInMilliseconds: puppeteerTimeout,
@@ -218,7 +218,7 @@ const render = async (remotionRoot) => {
         },
         puppeteerInstance,
         overwrite,
-        parallelism,
+        concurrency,
         pixelFormat,
         proResProfile,
         quality,

package/dist/setup-cache.js

@@ -40,7 +40,7 @@ const bundleOnCli = async ({ fullPath, steps, remotionRoot, publicDir, }) => {
     const [hash] = bundler_1.BundlerInternals.getConfig({
         outDir: '',
         entryPoint: fullPath,
-        onProgressUpdate: onProgress,
+        onProgress,
         options,
         resolvedRemotionRoot: remotionRoot,
     });
@@ -55,13 +55,17 @@ const bundleOnCli = async ({ fullPath, steps, remotionRoot, publicDir, }) => {
     }
     const bundleStartTime = Date.now();
     const bundlingProgress = (0, progress_bar_1.createOverwriteableCliOutput)((0, parse_command_line_1.quietFlagProvided)());
-    const bundled = await (0, bundler_1.bundle)(fullPath, (progress) => {
-        bundlingProgress.update((0, progress_bar_1.makeBundlingProgress)({
-            progress: progress / 100,
-            steps,
-            doneIn: null,
-        }));
-    }, options);
+    const bundled = await (0, bundler_1.bundle)({
+        entryPoint: fullPath,
+        onProgress: (progress) => {
+            bundlingProgress.update((0, progress_bar_1.makeBundlingProgress)({
+                progress: progress / 100,
+                steps,
+                doneIn: null,
+            }));
+        },
+        ...options,
+    });
     bundlingProgress.update((0, progress_bar_1.makeBundlingProgress)({
         progress: 1,
         steps,

package/dist/webpack-cache.d.ts

@@ -0,0 +1,12 @@
+declare type Environment = 'development' | 'production';
+declare global {
+    namespace NodeJS {
+        interface ProcessVersions {
+            pnp?: string;
+        }
+    }
+}
+export declare const clearCache: (environment: Environment, inputProps: object | null) => Promise<void>;
+export declare const getWebpackCacheName: (environment: Environment, inputProps: object | null) => string;
+export declare const cacheExists: (environment: Environment, inputProps: object | null) => boolean;
+export {};

package/dist/webpack-cache.js

@@ -0,0 +1,66 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.cacheExists = exports.getWebpackCacheName = exports.clearCache = void 0;
+const fs_1 = __importDefault(require("fs"));
+const path_1 = __importDefault(require("path"));
+const remotion_1 = require("remotion");
+// Inlined from https://github.com/webpack/webpack/blob/4c2ee7a4ddb8db2362ca83b6c4190523387ba7ee/lib/config/defaults.js#L265
+// An algorithm to determine where Webpack will cache the depencies
+const getWebpackCacheDir = () => {
+    const cwd = process.cwd();
+    let dir = cwd;
+    for (;;) {
+        try {
+            if (fs_1.default.statSync(path_1.default.join(dir, 'package.json')).isFile()) {
+                break;
+            }
+            // eslint-disable-next-line no-empty
+        }
+        catch (e) { }
+        const parent = path_1.default.dirname(dir);
+        if (dir === parent) {
+            dir = undefined;
+            break;
+        }
+        dir = parent;
+    }
+    if (!dir) {
+        return path_1.default.resolve(cwd, '.cache/webpack');
+    }
+    if (process.versions.pnp === '1') {
+        return path_1.default.resolve(dir, '.pnp/.cache/webpack');
+    }
+    if (process.versions.pnp === '3') {
+        return path_1.default.resolve(dir, '.yarn/.cache/webpack');
+    }
+    return path_1.default.resolve(dir, 'node_modules/.cache/webpack');
+};
+const remotionCacheLocation = (environment, inputProps) => {
+    return path_1.default.join(getWebpackCacheDir(), (0, exports.getWebpackCacheName)(environment, inputProps));
+};
+const clearCache = (environment, inputProps) => {
+    var _a;
+    return ((_a = fs_1.default.promises.rm) !== null && _a !== void 0 ? _a : fs_1.default.promises.rmdir)(remotionCacheLocation(environment, inputProps), {
+        recursive: true,
+    });
+};
+exports.clearCache = clearCache;
+const getWebpackCacheName = (environment, inputProps) => {
+    // In development, let's reset the cache when input props
+    // are changing, because they are injected using Webpack and if changed,
+    // it will get the cached version
+    if (environment === 'development') {
+        return `remotion-v3-${environment}-${(0, remotion_1.random)(JSON.stringify(inputProps))}`;
+    }
+    // In production, the cache is independent from input props because
+    // they are passed over URL params. Speed is mostly important in production.
+    return `remotion-v3-${environment}`;
+};
+exports.getWebpackCacheName = getWebpackCacheName;
+const cacheExists = (environment, inputProps) => {
+    return fs_1.default.existsSync(remotionCacheLocation(environment, inputProps));
+};
+exports.cacheExists = cacheExists;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@remotion/cli",
-	"version": "3.2.16",
+	"version": "3.2.20",
 	"description": "CLI for Remotion",
 	"main": "dist/index.js",
 	"sideEffects": false,
@@ -23,15 +23,15 @@
 	"author": "Jonny Burger <jonny@remotion.dev>",
 	"license": "SEE LICENSE IN LICENSE.md",
 	"dependencies": {
-		"@remotion/bundler": "3.2.16",
-		"@remotion/media-utils": "3.2.16",
-		"@remotion/player": "3.2.16",
-		"@remotion/renderer": "3.2.16",
+		"@remotion/bundler": "3.2.20",
+		"@remotion/media-utils": "3.2.20",
+		"@remotion/player": "3.2.20",
+		"@remotion/renderer": "3.2.20",
 		"better-opn": "2.1.1",
 		"dotenv": "9.0.2",
 		"memfs": "3.4.3",
 		"minimist": "1.2.6",
-		"remotion": "3.2.16",
+		"remotion": "3.2.20",
 		"semver": "7.3.5",
 		"source-map": "0.6.1"
 	},
@@ -71,5 +71,5 @@
 	"publishConfig": {
 		"access": "public"
 	},
-	"gitHead": "3c64e274a2c74e1b791d4a24b3af2ae456c0fd9e"
+	"gitHead": "640f36c0c2d9fb1b7768925bf9d64840cbc31bc6"
 }

package/dist/editor/helpers/normalize-zoom.d.ts

@@ -1 +0,0 @@
-declare function normalizeWheel(event: WheelEvent): number[];

package/dist/editor/helpers/normalize-zoom.js

@@ -1,16 +0,0 @@
-"use strict";
-// Adapted from https://stackoverflow.com/a/13650579
-function normalizeWheel(event) {
-    const { deltaY, deltaX } = event;
-    let deltaZ = 0;
-    if (event.ctrlKey || event.metaKey) {
-        const signY = Math.sign(event.deltaY);
-        const absDeltaY = Math.abs(event.deltaY);
-        let dy = deltaY;
-        if (absDeltaY > MAX_ZOOM_STEP) {
-            dy = MAX_ZOOM_STEP * signY;
-        }
-        deltaZ = dy;
-    }
-    return [deltaX, deltaY, deltaZ];
-}