@remotion/cli 3.2.15 → 3.2.16

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/cli/bundle');
+        log_1.Log.error('Documentation: https://www.remotion.dev/docs/render');
         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 setBundleDir: (path: string) => void;
+export declare const setBundleOutDir: (path: string) => void;

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

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

package/dist/editor/components/Canvas.js

@@ -3,7 +3,6 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.Canvas = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const player_1 = require("@remotion/player");
-const calculate_scale_1 = require("@remotion/player/src/calculate-scale");
 const react_1 = require("react");
 const smooth_zoom_1 = require("../../smooth-zoom");
 const colors_1 = require("../helpers/colors");
@@ -53,7 +52,7 @@ const Canvas = () => {
         }
         e.preventDefault();
         setSize((prevSize) => {
-            const scale = (0, calculate_scale_1.calculateScale)({
+            const scale = player_1.PlayerInternals.calculateScale({
                 canvasSize: size,
                 compositionHeight: dimensions.height,
                 compositionWidth: dimensions.width,
@@ -145,7 +144,7 @@ const Canvas = () => {
             return;
         }
         setSize((prevSize) => {
-            const scale = (0, calculate_scale_1.calculateScale)({
+            const scale = player_1.PlayerInternals.calculateScale({
                 canvasSize: size,
                 compositionHeight: dimensions.height,
                 compositionWidth: dimensions.width,
@@ -168,7 +167,7 @@ const Canvas = () => {
             return;
         }
         setSize((prevSize) => {
-            const scale = (0, calculate_scale_1.calculateScale)({
+            const scale = player_1.PlayerInternals.calculateScale({
                 canvasSize: size,
                 compositionHeight: dimensions.height,
                 compositionWidth: dimensions.width,

package/dist/editor/components/Preview.js

@@ -33,7 +33,7 @@ const Inner = ({ canvasSize }) => {
         canvasSize,
         compositionHeight: config.height,
         compositionWidth: config.width,
-        previewSize,
+        previewSize: previewSize.size,
     });
     const outer = (0, react_1.useMemo)(() => {
         return {

package/dist/editor/components/PreviewZoomControls.js

@@ -20,30 +20,48 @@ 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) => {
-            // 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) };
+            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);
         });
     }, [setSize]);
     const onZoomInClicked = (0, react_1.useCallback)(() => {
         setSize((z) => {
-            // TODO: Don't assume 1
-            if (z.size === 'auto')
-                return {
-                    size: 1 + preview_size_1.ZOOM_BUTTON_STEP,
-                    translation: {
-                        x: 0,
-                        y: 0,
-                    },
-                };
+            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 { ...z, size: Math.min(preview_size_1.PREVIEW_MAX_ZOOM, newSize) };
+            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;
         });
     }, [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: 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 }) })] }));
+    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 }) })] }));
 };
 exports.PreviewZoomControls = PreviewZoomControls;

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

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

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

@@ -0,0 +1,16 @@
+"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];
+}

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@remotion/cli",
-	"version": "3.2.15",
+	"version": "3.2.16",
 	"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.15",
-		"@remotion/media-utils": "3.2.15",
-		"@remotion/player": "3.2.15",
-		"@remotion/renderer": "3.2.15",
+		"@remotion/bundler": "3.2.16",
+		"@remotion/media-utils": "3.2.16",
+		"@remotion/player": "3.2.16",
+		"@remotion/renderer": "3.2.16",
 		"better-opn": "2.1.1",
 		"dotenv": "9.0.2",
 		"memfs": "3.4.3",
 		"minimist": "1.2.6",
-		"remotion": "3.2.15",
+		"remotion": "3.2.16",
 		"semver": "7.3.5",
 		"source-map": "0.6.1"
 	},
@@ -71,5 +71,5 @@
 	"publishConfig": {
 		"access": "public"
 	},
-	"gitHead": "7346704683815d274733cb3d280157b9ff570773"
+	"gitHead": "3c64e274a2c74e1b791d4a24b3af2ae456c0fd9e"
 }

package/dist/webpack-cache.d.ts

@@ -1,12 +0,0 @@
-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

@@ -1,66 +0,0 @@
-"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;