@remotion/cli 4.0.396 → 4.0.398

package/dist/benchmark.js

@@ -119,6 +119,10 @@ const benchmarkCommand = async (remotionRoot, args, logLevel) => {
     const publicDir = publicDirOption.getValue({ commandLine: parsed_cli_1.parsedCli }).value;
     const chromeMode = chromeModeOption.getValue({ commandLine: parsed_cli_1.parsedCli }).value;
     const darkMode = darkModeOption.getValue({ commandLine: parsed_cli_1.parsedCli }).value;
+    const experimentalClientSideRenderingEnabled = config_1.ConfigInternals.getExperimentalClientSideRenderingEnabled();
+    if (experimentalClientSideRenderingEnabled) {
+        log_1.Log.warn({ indent: false, logLevel }, 'Enabling WIP client-side rendering. Please see caveats on https://www.remotion.dev/docs/client-side-rendering/.');
+    }
     const chromiumOptions = {
         disableWebSecurity,
         enableMultiProcessOnLinux,
@@ -171,6 +175,7 @@ const benchmarkCommand = async (remotionRoot, args, logLevel) => {
         maxTimelineTracks: null,
         publicPath,
         audioLatencyHint: null,
+        experimentalClientSideRenderingEnabled,
     });
     (0, cleanup_before_quit_1.registerCleanupJob)(`Deleting bundle`, () => cleanupBundle());
     const puppeteerInstance = await browserInstance;

package/dist/bundle.js

@@ -10,6 +10,7 @@ const studio_server_1 = require("@remotion/studio-server");
 const fs_1 = require("fs");
 const path_1 = __importDefault(require("path"));
 const chalk_1 = require("./chalk");
+const config_1 = require("./config");
 const entry_point_1 = require("./entry-point");
 const get_github_repository_1 = require("./get-github-repository");
 const log_1 = require("./log");
@@ -40,6 +41,10 @@ const bundleCommand = async (remotionRoot, args, logLevel) => {
         log_1.Log.error({ indent: false, logLevel }, 'See: https://www.remotion.dev/docs/terminology/entry-point');
         process.exit(1);
     }
+    const experimentalClientSideRenderingEnabled = config_1.ConfigInternals.getExperimentalClientSideRenderingEnabled();
+    if (experimentalClientSideRenderingEnabled) {
+        log_1.Log.warn({ indent: false, logLevel }, 'Enabling WIP client-side rendering. Please see caveats on https://www.remotion.dev/docs/client-side-rendering/.');
+    }
     const publicPath = publicPathOption.getValue({ commandLine: parsed_cli_1.parsedCli }).value;
     const publicDir = publicDirOption.getValue({ commandLine: parsed_cli_1.parsedCli }).value;
     const disableGitSource = disableGitSourceOption.getValue({
@@ -93,6 +98,7 @@ const bundleCommand = async (remotionRoot, args, logLevel) => {
         maxTimelineTracks: null,
         publicPath,
         audioLatencyHint,
+        experimentalClientSideRenderingEnabled,
     });
     log_1.Log.info({ indent: false, logLevel }, chalk_1.chalk.blue(`${existed ? '○' : '+'} ${output}`));
     if (!gitignoreFolder) {

package/dist/compositions.js

@@ -6,6 +6,7 @@ const client_1 = require("@remotion/renderer/client");
 const no_react_1 = require("remotion/no-react");
 const browser_download_bar_1 = require("./browser-download-bar");
 const cleanup_before_quit_1 = require("./cleanup-before-quit");
+const config_1 = require("./config");
 const preview_server_1 = require("./config/preview-server");
 const entry_point_1 = require("./entry-point");
 const get_cli_options_1 = require("./get-cli-options");
@@ -68,6 +69,10 @@ const listCompositionsCommand = async (remotionRoot, args, logLevel) => {
         userAgent,
         darkMode,
     };
+    const experimentalClientSideRenderingEnabled = config_1.ConfigInternals.getExperimentalClientSideRenderingEnabled();
+    if (experimentalClientSideRenderingEnabled) {
+        log_1.Log.warn({ indent: false, logLevel }, 'Enabling WIP client-side rendering. Please see caveats on https://www.remotion.dev/docs/client-side-rendering/.');
+    }
     const { urlOrBundle: bundled, cleanup: cleanupBundle } = await (0, setup_cache_1.bundleOnCliOrTakeServeUrl)({
         remotionRoot,
         fullPath: file,
@@ -87,6 +92,7 @@ const listCompositionsCommand = async (remotionRoot, args, logLevel) => {
         maxTimelineTracks: null,
         publicPath,
         audioLatencyHint,
+        experimentalClientSideRenderingEnabled,
     });
     (0, cleanup_before_quit_1.registerCleanupJob)(`Cleanup bundle`, () => cleanupBundle());
     const compositions = await renderer_1.RenderInternals.internalGetCompositions({

package/dist/config/index.d.ts

@@ -327,6 +327,12 @@ declare global {
          * @param pattern The pattern string, e.g. 'frame_[frame].[ext]'.
          */
         readonly setImageSequencePattern: (pattern: string | null) => void;
+        /**
+         * Set the public license key for your company license.
+         * Obtain it from the "Usage" tab on https://remotion.pro
+         * Pass "free-license" if you are eligible for the free license.
+         */
+        readonly setPublicLicenseKey: (key: string | null) => void;
     }
 }
 type FlatConfig = RemotionConfigObject & RemotionBundlingOptions & {

package/dist/config/index.js

@@ -43,7 +43,7 @@ const user_agent_1 = require("./user-agent");
 const webpack_caching_2 = require("./webpack-caching");
 const webpack_poll_1 = require("./webpack-poll");
 const width_1 = require("./width");
-const { offthreadVideoCacheSizeInBytesOption, x264Option, audioBitrateOption, videoBitrateOption, scaleOption, crfOption, jpegQualityOption, enforceAudioOption, overwriteOption, chromeModeOption, mutedOption, videoCodecOption, colorSpaceOption, disallowParallelEncodingOption, deleteAfterOption, folderExpiryOption, enableMultiprocessOnLinuxOption, glOption, headlessOption, numberOfGifLoopsOption, beepOnFinishOption, encodingMaxRateOption, encodingBufferSizeOption, reproOption, enableLambdaInsights, logLevelOption, delayRenderTimeoutInMillisecondsOption, publicDirOption, binariesDirectoryOption, preferLosslessOption, forSeamlessAacConcatenationOption, audioCodecOption, publicPathOption, hardwareAccelerationOption, audioLatencyHintOption, enableCrossSiteIsolationOption, imageSequencePatternOption, darkModeOption, } = client_1.BrowserSafeApis.options;
+const { offthreadVideoCacheSizeInBytesOption, x264Option, audioBitrateOption, videoBitrateOption, scaleOption, crfOption, jpegQualityOption, enforceAudioOption, overwriteOption, chromeModeOption, mutedOption, videoCodecOption, colorSpaceOption, disallowParallelEncodingOption, deleteAfterOption, folderExpiryOption, enableMultiprocessOnLinuxOption, glOption, headlessOption, numberOfGifLoopsOption, beepOnFinishOption, encodingMaxRateOption, encodingBufferSizeOption, reproOption, enableLambdaInsights, logLevelOption, delayRenderTimeoutInMillisecondsOption, publicDirOption, binariesDirectoryOption, preferLosslessOption, forSeamlessAacConcatenationOption, audioCodecOption, publicPathOption, hardwareAccelerationOption, audioLatencyHintOption, enableCrossSiteIsolationOption, imageSequencePatternOption, darkModeOption, publicLicenseKeyOption, } = client_1.BrowserSafeApis.options;
 exports.Config = {
     get Bundling() {
         throw new Error('The config format has changed. Change `Config.Bundling.*()` calls to `Config.*()` in your config file.');
@@ -141,6 +141,7 @@ exports.Config = {
     setImageSequencePattern: imageSequencePatternOption.setConfig,
     setHardwareAcceleration: hardwareAccelerationOption.setConfig,
     setEnableCrossSiteIsolation: enableCrossSiteIsolationOption.setConfig,
+    setPublicLicenseKey: publicLicenseKeyOption.setConfig,
 };
 exports.ConfigInternals = {
     getRange: frame_range_1.getRange,

package/dist/get-render-defaults.js

@@ -5,7 +5,7 @@ const renderer_1 = require("@remotion/renderer");
 const client_1 = require("@remotion/renderer/client");
 const config_1 = require("./config");
 const parsed_cli_1 = require("./parsed-cli");
-const { x264Option, audioBitrateOption, offthreadVideoCacheSizeInBytesOption, offthreadVideoThreadsOption, scaleOption, jpegQualityOption, videoBitrateOption, enforceAudioOption, mutedOption, colorSpaceOption, enableMultiprocessOnLinuxOption, glOption, numberOfGifLoopsOption, beepOnFinishOption, encodingMaxRateOption, encodingBufferSizeOption, reproOption, logLevelOption, delayRenderTimeoutInMillisecondsOption, headlessOption, forSeamlessAacConcatenationOption, audioCodecOption, hardwareAccelerationOption, chromeModeOption, mediaCacheSizeInBytesOption, darkModeOption, } = client_1.BrowserSafeApis.options;
+const { x264Option, audioBitrateOption, offthreadVideoCacheSizeInBytesOption, offthreadVideoThreadsOption, scaleOption, jpegQualityOption, videoBitrateOption, enforceAudioOption, mutedOption, colorSpaceOption, enableMultiprocessOnLinuxOption, glOption, numberOfGifLoopsOption, beepOnFinishOption, encodingMaxRateOption, encodingBufferSizeOption, reproOption, logLevelOption, delayRenderTimeoutInMillisecondsOption, headlessOption, forSeamlessAacConcatenationOption, audioCodecOption, hardwareAccelerationOption, chromeModeOption, mediaCacheSizeInBytesOption, darkModeOption, publicLicenseKeyOption, } = client_1.BrowserSafeApis.options;
 const getRenderDefaults = () => {
     var _a;
     const defaultJpegQuality = jpegQualityOption.getValue({
@@ -85,6 +85,9 @@ const getRenderDefaults = () => {
     const mediaCacheSizeInBytes = mediaCacheSizeInBytesOption.getValue({
         commandLine: parsed_cli_1.parsedCli,
     }).value;
+    const publicLicenseKey = publicLicenseKeyOption.getValue({
+        commandLine: parsed_cli_1.parsedCli,
+    }).value;
     const everyNthFrame = config_1.ConfigInternals.getEveryNthFrame();
     const stillImageFormat = config_1.ConfigInternals.getUserPreferredStillImageFormat();
     const videoImageFormat = config_1.ConfigInternals.getUserPreferredVideoImageFormat();
@@ -137,6 +140,7 @@ const getRenderDefaults = () => {
         hardwareAcceleration,
         chromeMode,
         mediaCacheSizeInBytes,
+        publicLicenseKey,
     };
 };
 exports.getRenderDefaults = getRenderDefaults;

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

@@ -300,6 +300,20 @@ declare const beepOnFinishOption: {
         value: boolean;
     };
     setConfig: (value: boolean) => void;
+}, publicLicenseKeyOption: {
+    name: string;
+    cliFlag: "public-license-key";
+    description: () => import("react/jsx-runtime").JSX.Element;
+    ssrName: "publicLicenseKey";
+    docLink: string;
+    getValue: ({ commandLine }: {
+        commandLine: Record<string, unknown>;
+    }) => {
+        source: string;
+        value: string | null;
+    };
+    setConfig: (value: string | null) => void;
+    type: string | null;
 };
 export type CommandLineOptions = {
     ['browser-executable']: BrowserExecutable;
@@ -372,6 +386,8 @@ export type CommandLineOptions = {
     [enableMultiprocessOnLinuxOption.cliFlag]: TypeOfOption<typeof enableMultiprocessOnLinuxOption>;
     repro: boolean;
     'image-sequence-pattern': string;
+    'license-key': string;
+    [publicLicenseKeyOption.cliFlag]: string;
 };
 export declare const parseCommandLine: () => void;
 export {};

package/dist/parse-command-line.js

@@ -5,7 +5,7 @@ const client_1 = require("@remotion/renderer/client");
 const config_1 = require("./config");
 const log_1 = require("./log");
 const parsed_cli_1 = require("./parsed-cli");
-const { beepOnFinishOption, colorSpaceOption, disallowParallelEncodingOption, offthreadVideoCacheSizeInBytesOption, encodingBufferSizeOption, encodingMaxRateOption, deleteAfterOption, folderExpiryOption, enableMultiprocessOnLinuxOption, numberOfGifLoopsOption, x264Option, enforceAudioOption, jpegQualityOption, audioBitrateOption, videoBitrateOption, audioCodecOption, publicPathOption, audioLatencyHintOption, darkModeOption, } = client_1.BrowserSafeApis.options;
+const { beepOnFinishOption, colorSpaceOption, disallowParallelEncodingOption, offthreadVideoCacheSizeInBytesOption, encodingBufferSizeOption, encodingMaxRateOption, deleteAfterOption, folderExpiryOption, enableMultiprocessOnLinuxOption, numberOfGifLoopsOption, x264Option, enforceAudioOption, jpegQualityOption, audioBitrateOption, videoBitrateOption, audioCodecOption, publicPathOption, audioLatencyHintOption, darkModeOption, publicLicenseKeyOption, } = client_1.BrowserSafeApis.options;
 const parseCommandLine = () => {
     if (parsed_cli_1.parsedCli['pixel-format']) {
         config_1.Config.setPixelFormat(parsed_cli_1.parsedCli['pixel-format']);
@@ -55,6 +55,13 @@ const parseCommandLine = () => {
     if (parsed_cli_1.parsedCli['prores-profile']) {
         config_1.Config.setProResProfile(String(parsed_cli_1.parsedCli['prores-profile']));
     }
+    if (parsed_cli_1.parsedCli['license-key'] &&
+        parsed_cli_1.parsedCli['license-key'].startsWith('rm_pub_')) {
+        config_1.Config.setPublicLicenseKey(parsed_cli_1.parsedCli['license-key']);
+    }
+    if (parsed_cli_1.parsedCli['public-license-key']) {
+        config_1.Config.setPublicLicenseKey(parsed_cli_1.parsedCli['public-license-key']);
+    }
     if (typeof parsed_cli_1.parsedCli.quality !== 'undefined') {
         log_1.Log.warn({ indent: false, logLevel: 'info' }, 'The --quality flag has been renamed to --jpeg-quality instead.');
         config_1.Config.setJpegQuality(parsed_cli_1.parsedCli.quality);

package/dist/render-flows/render.js

@@ -160,6 +160,7 @@ const renderVideoFlow = async ({ remotionRoot, fullEntryPoint, indent, logLevel,
         maxTimelineTracks: null,
         publicPath,
         audioLatencyHint,
+        experimentalClientSideRenderingEnabled: false,
     });
     addCleanupCallback(`Cleanup bundle`, () => cleanupBundle());
     const onDownload = (0, make_on_download_1.makeOnDownload)({

package/dist/render-flows/still.js

@@ -101,6 +101,7 @@ const renderStillFlow = async ({ remotionRoot, fullEntryPoint, entryPointReason,
         maxTimelineTracks: null,
         publicPath,
         audioLatencyHint,
+        experimentalClientSideRenderingEnabled: false,
     });
     const server = await renderer_1.RenderInternals.prepareServer({
         offthreadVideoThreads: offthreadVideoThreads !== null && offthreadVideoThreads !== void 0 ? offthreadVideoThreads : renderer_1.RenderInternals.DEFAULT_RENDER_FRAMES_OFFTHREAD_VIDEO_THREADS,

package/dist/setup-cache.d.ts

@@ -1,7 +1,7 @@
 import type { LogLevel } from '@remotion/renderer';
 import type { BundlingState, CopyingState } from '@remotion/studio-server';
 import type { GitSource } from '@remotion/studio-shared';
-export declare const bundleOnCliOrTakeServeUrl: ({ fullPath, remotionRoot, publicDir, onProgress, indentOutput, logLevel, onDirectoryCreated, quietProgress, quietFlag, outDir, gitSource, bufferStateDelayInMilliseconds, maxTimelineTracks, publicPath, audioLatencyHint, }: {
+export declare const bundleOnCliOrTakeServeUrl: ({ fullPath, remotionRoot, publicDir, onProgress, indentOutput, logLevel, onDirectoryCreated, quietProgress, quietFlag, outDir, gitSource, bufferStateDelayInMilliseconds, maxTimelineTracks, publicPath, audioLatencyHint, experimentalClientSideRenderingEnabled, }: {
     fullPath: string;
     remotionRoot: string;
     publicDir: string | null;
@@ -20,11 +20,12 @@ export declare const bundleOnCliOrTakeServeUrl: ({ fullPath, remotionRoot, publi
     maxTimelineTracks: number | null;
     publicPath: string | null;
     audioLatencyHint: AudioContextLatencyCategory | null;
+    experimentalClientSideRenderingEnabled: boolean;
 }) => Promise<{
     urlOrBundle: string;
     cleanup: () => void;
 }>;
-export declare const bundleOnCli: ({ fullPath, remotionRoot, publicDir, onProgressCallback, indent, logLevel, onDirectoryCreated, quietProgress, quietFlag, outDir, gitSource, maxTimelineTracks, bufferStateDelayInMilliseconds, publicPath, audioLatencyHint, }: {
+export declare const bundleOnCli: ({ fullPath, remotionRoot, publicDir, onProgressCallback, indent, logLevel, onDirectoryCreated, quietProgress, quietFlag, outDir, gitSource, maxTimelineTracks, bufferStateDelayInMilliseconds, publicPath, audioLatencyHint, experimentalClientSideRenderingEnabled, }: {
     fullPath: string;
     remotionRoot: string;
     publicDir: string | null;
@@ -43,4 +44,5 @@ export declare const bundleOnCli: ({ fullPath, remotionRoot, publicDir, onProgre
     bufferStateDelayInMilliseconds: number | null;
     publicPath: string | null;
     audioLatencyHint: AudioContextLatencyCategory | null;
+    experimentalClientSideRenderingEnabled: boolean;
 }) => Promise<string>;

package/dist/setup-cache.js

@@ -9,10 +9,11 @@ const renderer_1 = require("@remotion/renderer");
 const fs_1 = require("fs");
 const path_1 = __importDefault(require("path"));
 const config_1 = require("./config");
+const get_render_defaults_1 = require("./get-render-defaults");
 const log_1 = require("./log");
 const progress_bar_1 = require("./progress-bar");
 const should_use_non_overlaying_logger_1 = require("./should-use-non-overlaying-logger");
-const bundleOnCliOrTakeServeUrl = async ({ fullPath, remotionRoot, publicDir, onProgress, indentOutput, logLevel, onDirectoryCreated, quietProgress, quietFlag, outDir, gitSource, bufferStateDelayInMilliseconds, maxTimelineTracks, publicPath, audioLatencyHint, }) => {
+const bundleOnCliOrTakeServeUrl = async ({ fullPath, remotionRoot, publicDir, onProgress, indentOutput, logLevel, onDirectoryCreated, quietProgress, quietFlag, outDir, gitSource, bufferStateDelayInMilliseconds, maxTimelineTracks, publicPath, audioLatencyHint, experimentalClientSideRenderingEnabled, }) => {
     const isServeUrl = renderer_1.RenderInternals.isServeUrl(fullPath);
     const isBundle = (0, fs_1.existsSync)(fullPath) && (0, fs_1.existsSync)(path_1.default.join(fullPath, 'index.html'));
     if (isServeUrl || isBundle) {
@@ -47,6 +48,7 @@ const bundleOnCliOrTakeServeUrl = async ({ fullPath, remotionRoot, publicDir, on
         maxTimelineTracks,
         publicPath,
         audioLatencyHint,
+        experimentalClientSideRenderingEnabled,
     });
     return {
         urlOrBundle: bundled,
@@ -54,7 +56,7 @@ const bundleOnCliOrTakeServeUrl = async ({ fullPath, remotionRoot, publicDir, on
     };
 };
 exports.bundleOnCliOrTakeServeUrl = bundleOnCliOrTakeServeUrl;
-const bundleOnCli = async ({ fullPath, remotionRoot, publicDir, onProgressCallback, indent, logLevel, onDirectoryCreated, quietProgress, quietFlag, outDir, gitSource, maxTimelineTracks, bufferStateDelayInMilliseconds, publicPath, audioLatencyHint, }) => {
+const bundleOnCli = async ({ fullPath, remotionRoot, publicDir, onProgressCallback, indent, logLevel, onDirectoryCreated, quietProgress, quietFlag, outDir, gitSource, maxTimelineTracks, bufferStateDelayInMilliseconds, publicPath, audioLatencyHint, experimentalClientSideRenderingEnabled, }) => {
     var _a;
     const shouldCache = config_1.ConfigInternals.getWebpackCaching();
     const symlinkState = {
@@ -115,6 +117,7 @@ const bundleOnCli = async ({ fullPath, remotionRoot, publicDir, onProgressCallba
         resolvedRemotionRoot: remotionRoot,
         bufferStateDelayInMilliseconds,
         maxTimelineTracks,
+        experimentalClientSideRenderingEnabled,
     });
     const cacheExistedBefore = bundler_1.BundlerInternals.cacheExists(remotionRoot, 'production', hash);
     if (cacheExistedBefore !== 'does-not-exist' && !shouldCache) {
@@ -152,6 +155,8 @@ const bundleOnCli = async ({ fullPath, remotionRoot, publicDir, onProgressCallba
         maxTimelineTracks,
         bufferStateDelayInMilliseconds,
         audioLatencyHint,
+        experimentalClientSideRenderingEnabled,
+        renderDefaults: (0, get_render_defaults_1.getRenderDefaults)(),
     });
     bundlingState = {
         progress: 1,

package/package.json

@@ -3,7 +3,7 @@
 		"url": "https://github.com/remotion-dev/remotion/tree/main/packages/cli"
 	},
 	"name": "@remotion/cli",
-	"version": "4.0.396",
+	"version": "4.0.398",
 	"description": "Control Remotion features using the `npx remotion` command",
 	"main": "dist/index.js",
 	"sideEffects": false,
@@ -36,17 +36,17 @@
 	"author": "Jonny Burger <jonny@remotion.dev>",
 	"license": "SEE LICENSE IN LICENSE.md",
 	"dependencies": {
-		"@remotion/bundler": "4.0.396",
-		"@remotion/media-utils": "4.0.396",
-		"@remotion/player": "4.0.396",
-		"@remotion/renderer": "4.0.396",
-		"@remotion/studio-shared": "4.0.396",
-		"@remotion/studio-server": "4.0.396",
-		"@remotion/studio": "4.0.396",
+		"@remotion/bundler": "4.0.398",
+		"@remotion/media-utils": "4.0.398",
+		"@remotion/player": "4.0.398",
+		"@remotion/renderer": "4.0.398",
+		"@remotion/studio-shared": "4.0.398",
+		"@remotion/studio-server": "4.0.398",
+		"@remotion/studio": "4.0.398",
 		"dotenv": "9.0.2",
 		"minimist": "1.2.6",
 		"prompts": "2.4.2",
-		"remotion": "4.0.396"
+		"remotion": "4.0.398"
 	},
 	"peerDependencies": {
 		"react": ">=16.8.0",
@@ -57,14 +57,14 @@
 		"@types/prompts": "^2.4.1",
 		"@types/prettier": "^2.7.2",
 		"@types/node": "20.12.14",
-		"@remotion/zod-types": "4.0.396",
-		"@remotion/tailwind-v4": "4.0.396",
-		"@remotion/enable-scss": "4.0.396",
-		"@remotion/skia": "4.0.396",
+		"@remotion/zod-types": "4.0.398",
+		"@remotion/tailwind-v4": "4.0.398",
+		"@remotion/enable-scss": "4.0.398",
+		"@remotion/skia": "4.0.398",
 		"react": "19.2.3",
 		"react-dom": "19.2.3",
 		"zod": "3.22.3",
-		"@remotion/eslint-config-internal": "4.0.396",
+		"@remotion/eslint-config-internal": "4.0.398",
 		"eslint": "9.19.0"
 	},
 	"keywords": [