@remotion/renderer 4.0.2 → 4.0.3

package/dist/get-compositions.d.ts

@@ -1,4 +1,4 @@
-import type { VideoConfig } from 'remotion';
+import { type VideoConfig } from 'remotion';
 import type { BrowserExecutable } from './browser-executable';
 import type { BrowserLog } from './browser-log';
 import type { HeadlessBrowser } from './browser/Browser';
@@ -6,7 +6,7 @@ import type { ChromiumOptions } from './open-browser';
 import type { RemotionServer } from './prepare-server';
 import { type LogLevel } from './log-level';
 type InternalGetCompositionsOptions = {
-    inputProps: Record<string, unknown>;
+    serializedInputPropsWithCustomSchema: string;
     envVariables: Record<string, string>;
     puppeteerInstance: HeadlessBrowser | undefined;
     onBrowserLog: null | ((log: BrowserLog) => void);
@@ -30,7 +30,7 @@ export type GetCompositionsOptions = {
     port?: number | null;
     logLevel?: LogLevel;
 };
-export declare const internalGetCompositions: ({ browserExecutable, chromiumOptions, envVariables, indent, inputProps, onBrowserLog, port, puppeteerInstance, serveUrlOrWebpackUrl, server, timeoutInMilliseconds, logLevel, }: InternalGetCompositionsOptions) => Promise<VideoConfig[]>;
+export declare const internalGetCompositions: ({ browserExecutable, chromiumOptions, envVariables, indent, serializedInputPropsWithCustomSchema, onBrowserLog, port, puppeteerInstance, serveUrlOrWebpackUrl, server, timeoutInMilliseconds, logLevel, }: InternalGetCompositionsOptions) => Promise<VideoConfig[]>;
 /**
  * @description Gets the compositions defined in a Remotion project based on a Webpack bundle.
  * @see [Documentation](https://www.remotion.dev/docs/renderer/get-compositions)

package/dist/get-compositions.js

@@ -1,6 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.getCompositions = exports.internalGetCompositions = void 0;
+const remotion_1 = require("remotion");
 const TimeoutSettings_1 = require("./browser/TimeoutSettings");
 const handle_javascript_exception_1 = require("./error-handling/handle-javascript-exception");
 const find_closest_package_json_1 = require("./find-closest-package-json");
@@ -11,7 +12,7 @@ const seek_to_frame_1 = require("./seek-to-frame");
 const set_props_and_env_1 = require("./set-props-and-env");
 const validate_puppeteer_timeout_1 = require("./validate-puppeteer-timeout");
 const logger_1 = require("./logger");
-const innerGetCompositions = async ({ envVariables, inputProps, onBrowserLog, page, proxyPort, serveUrl, timeoutInMilliseconds, }) => {
+const innerGetCompositions = async ({ envVariables, serializedInputPropsWithCustomSchema, onBrowserLog, page, proxyPort, serveUrl, timeoutInMilliseconds, }) => {
     if (onBrowserLog) {
         page.on('console', (log) => {
             onBrowserLog({
@@ -23,7 +24,7 @@ const innerGetCompositions = async ({ envVariables, inputProps, onBrowserLog, pa
     }
     (0, validate_puppeteer_timeout_1.validatePuppeteerTimeout)(timeoutInMilliseconds);
     await (0, set_props_and_env_1.setPropsAndEnv)({
-        inputProps,
+        serializedInputPropsWithCustomSchema,
         envVariables,
         page,
         serveUrl,
@@ -55,7 +56,7 @@ const innerGetCompositions = async ({ envVariables, inputProps, onBrowserLog, pa
     });
     return result;
 };
-const internalGetCompositions = async ({ browserExecutable, chromiumOptions, envVariables, indent, inputProps, onBrowserLog, port, puppeteerInstance, serveUrlOrWebpackUrl, server, timeoutInMilliseconds, logLevel, }) => {
+const internalGetCompositions = async ({ browserExecutable, chromiumOptions, envVariables, indent, serializedInputPropsWithCustomSchema, onBrowserLog, port, puppeteerInstance, serveUrlOrWebpackUrl, server, timeoutInMilliseconds, logLevel, }) => {
     const { page, cleanup: cleanupPage } = await (0, get_browser_instance_1.getPageAndCleanupFn)({
         passedInInstance: puppeteerInstance,
         browserExecutable,
@@ -89,7 +90,7 @@ const internalGetCompositions = async ({ browserExecutable, chromiumOptions, env
             cleanup.push(() => cleanupServer(true));
             return innerGetCompositions({
                 envVariables,
-                inputProps,
+                serializedInputPropsWithCustomSchema,
                 onBrowserLog,
                 page,
                 proxyPort: offthreadPort,
@@ -121,7 +122,11 @@ const getCompositions = (serveUrlOrWebpackUrl, config) => {
         browserExecutable: browserExecutable !== null && browserExecutable !== void 0 ? browserExecutable : null,
         chromiumOptions: chromiumOptions !== null && chromiumOptions !== void 0 ? chromiumOptions : {},
         envVariables: envVariables !== null && envVariables !== void 0 ? envVariables : {},
-        inputProps: inputProps !== null && inputProps !== void 0 ? inputProps : {},
+        serializedInputPropsWithCustomSchema: remotion_1.Internals.serializeJSONWithDate({
+            data: inputProps !== null && inputProps !== void 0 ? inputProps : {},
+            indent: undefined,
+            staticBase: null,
+        }).serializedString,
         indent: false,
         onBrowserLog: onBrowserLog !== null && onBrowserLog !== void 0 ? onBrowserLog : null,
         port: port !== null && port !== void 0 ? port : null,

package/dist/index.d.ts

@@ -404,7 +404,8 @@ export declare const RenderInternals: {
         composition: import("remotion").VideoConfig;
         output: string | null;
         frame: number;
-        inputProps: Record<string, unknown>;
+        serializedInputPropsWithCustomSchema: string;
+        serializedResolvedPropsWithCustomSchema: string;
         imageFormat: "jpeg" | "png" | "webp" | "pdf";
         jpegQuality: number;
         puppeteerInstance: HeadlessBrowser | null;
@@ -435,7 +436,7 @@ export declare const RenderInternals: {
         logLevel: "error" | "verbose" | "info" | "warn";
     }) => Promise<HeadlessBrowser>;
     internalSelectComposition: (options: {
-        inputProps: Record<string, unknown>;
+        serializedInputPropsWithCustomSchema: string;
         envVariables: Record<string, string>;
         puppeteerInstance: HeadlessBrowser | undefined;
         onBrowserLog: ((log: import("./browser-log").BrowserLog) => void) | null;
@@ -452,8 +453,8 @@ export declare const RenderInternals: {
         metadata: import("remotion").VideoConfig;
         propsSize: number;
     }>;
-    internalGetCompositions: ({ browserExecutable, chromiumOptions, envVariables, indent, inputProps, onBrowserLog, port, puppeteerInstance, serveUrlOrWebpackUrl, server, timeoutInMilliseconds, logLevel, }: {
-        inputProps: Record<string, unknown>;
+    internalGetCompositions: ({ browserExecutable, chromiumOptions, envVariables, indent, serializedInputPropsWithCustomSchema, onBrowserLog, port, puppeteerInstance, serveUrlOrWebpackUrl, server, timeoutInMilliseconds, logLevel, }: {
+        serializedInputPropsWithCustomSchema: string;
         envVariables: Record<string, string>;
         puppeteerInstance: HeadlessBrowser | undefined;
         onBrowserLog: ((log: import("./browser-log").BrowserLog) => void) | null;
@@ -466,8 +467,8 @@ export declare const RenderInternals: {
         logLevel: "error" | "verbose" | "info" | "warn";
         serveUrlOrWebpackUrl: string;
     }) => Promise<import("remotion").VideoConfig[]>;
-    internalRenderFrames: ({ browserExecutable, cancelSignal, chromiumOptions, composition, concurrency, envVariables, everyNthFrame, frameRange, imageFormat, indent, inputProps, jpegQuality, muted, onBrowserLog, onDownload, onFrameBuffer, onFrameUpdate, onStart, outputDir, port, puppeteerInstance, scale, server, timeoutInMilliseconds, logLevel, webpackBundleOrServeUrl, }: import("./render-frames").InternalRenderFramesOptions) => Promise<import("./types").RenderFramesOutput>;
-    internalRenderMedia: ({ proResProfile, crf, composition, inputProps, pixelFormat, codec, envVariables, frameRange, puppeteerInstance, outputLocation, onProgress, overwrite, onDownload, onBrowserLog, onStart, timeoutInMilliseconds, chromiumOptions, scale, browserExecutable, port, cancelSignal, muted, enforceAudioTrack, ffmpegOverride, audioBitrate, videoBitrate, audioCodec, concurrency, disallowParallelEncoding, everyNthFrame, imageFormat: provisionalImageFormat, indent, jpegQuality, numberOfGifLoops, onCtrlCExit, preferLossless, serveUrl, server: reusedServer, logLevel, }: import("./render-media").InternalRenderMediaOptions) => Promise<{
+    internalRenderFrames: ({ browserExecutable, cancelSignal, chromiumOptions, composition, concurrency, envVariables, everyNthFrame, frameRange, imageFormat, indent, jpegQuality, muted, onBrowserLog, onDownload, onFrameBuffer, onFrameUpdate, onStart, outputDir, port, puppeteerInstance, scale, server, timeoutInMilliseconds, logLevel, webpackBundleOrServeUrl, serializedInputPropsWithCustomSchema, serializedResolvedPropsWithCustomSchema, }: import("./render-frames").InternalRenderFramesOptions) => Promise<import("./types").RenderFramesOutput>;
+    internalRenderMedia: ({ proResProfile, crf, composition, serializedInputPropsWithCustomSchema, pixelFormat, codec, envVariables, frameRange, puppeteerInstance, outputLocation, onProgress, overwrite, onDownload, onBrowserLog, onStart, timeoutInMilliseconds, chromiumOptions, scale, browserExecutable, port, cancelSignal, muted, enforceAudioTrack, ffmpegOverride, audioBitrate, videoBitrate, audioCodec, concurrency, disallowParallelEncoding, everyNthFrame, imageFormat: provisionalImageFormat, indent, jpegQuality, numberOfGifLoops, onCtrlCExit, preferLossless, serveUrl, server: reusedServer, logLevel, serializedResolvedPropsWithCustomSchema, }: import("./render-media").InternalRenderMediaOptions) => Promise<{
         buffer: Buffer | null;
         slowestFrames: import("./render-media").SlowFrame[];
     }>;

package/dist/render-frames.d.ts

@@ -15,7 +15,6 @@ export type InternalRenderFramesOptions = {
     onStart: null | ((data: OnStartData) => void);
     onFrameUpdate: null | ((framesRendered: number, frameIndex: number, timeToRenderInMilliseconds: number) => void);
     outputDir: string | null;
-    inputProps: Record<string, unknown>;
     envVariables: Record<string, string>;
     imageFormat: VideoImageFormat;
     jpegQuality: number;
@@ -31,13 +30,15 @@ export type InternalRenderFramesOptions = {
     scale: number;
     port: number | null;
     cancelSignal: CancelSignal | undefined;
-    composition: VideoConfig;
+    composition: Omit<VideoConfig, 'props' | 'defaultProps'>;
     indent: boolean;
     server: RemotionServer | undefined;
     muted: boolean;
     concurrency: number | string | null;
     webpackBundleOrServeUrl: string;
     logLevel: LogLevel;
+    serializedInputPropsWithCustomSchema: string;
+    serializedResolvedPropsWithCustomSchema: string;
 };
 export type RenderFramesOptions = {
     onStart: (data: OnStartData) => void;
@@ -77,7 +78,7 @@ export type RenderFramesOptions = {
     concurrency?: number | string | null;
     serveUrl: string;
 };
-export declare const internalRenderFrames: ({ browserExecutable, cancelSignal, chromiumOptions, composition, concurrency, envVariables, everyNthFrame, frameRange, imageFormat, indent, inputProps, jpegQuality, muted, onBrowserLog, onDownload, onFrameBuffer, onFrameUpdate, onStart, outputDir, port, puppeteerInstance, scale, server, timeoutInMilliseconds, logLevel, webpackBundleOrServeUrl, }: InternalRenderFramesOptions) => Promise<RenderFramesOutput>;
+export declare const internalRenderFrames: ({ browserExecutable, cancelSignal, chromiumOptions, composition, concurrency, envVariables, everyNthFrame, frameRange, imageFormat, indent, jpegQuality, muted, onBrowserLog, onDownload, onFrameBuffer, onFrameUpdate, onStart, outputDir, port, puppeteerInstance, scale, server, timeoutInMilliseconds, logLevel, webpackBundleOrServeUrl, serializedInputPropsWithCustomSchema, serializedResolvedPropsWithCustomSchema, }: InternalRenderFramesOptions) => Promise<RenderFramesOutput>;
 /**
  * @description Renders a series of images using Puppeteer and computes information for mixing audio.
  * @see [Documentation](https://www.remotion.dev/docs/renderer/render-frames)

package/dist/render-frames.js

@@ -35,7 +35,7 @@ const truthy_1 = require("./truthy");
 const validate_scale_1 = require("./validate-scale");
 const logger_1 = require("./logger");
 const MAX_RETRIES_PER_FRAME = 1;
-const innerRenderFrames = async ({ onFrameUpdate, outputDir, onStart, inputProps, jpegQuality, imageFormat, frameRange, onError, envVariables, onBrowserLog, onFrameBuffer, onDownload, pagesArray, serveUrl, composition, timeoutInMilliseconds, scale, actualConcurrency, everyNthFrame, proxyPort, cancelSignal, downloadMap, muted, makeBrowser, browserReplacer, compositor, sourcemapContext, logLevel, indent, }) => {
+const innerRenderFrames = async ({ onFrameUpdate, outputDir, onStart, serializedInputPropsWithCustomSchema, serializedResolvedPropsWithCustomSchema, jpegQuality, imageFormat, frameRange, onError, envVariables, onBrowserLog, onFrameBuffer, onDownload, pagesArray, serveUrl, composition, timeoutInMilliseconds, scale, actualConcurrency, everyNthFrame, proxyPort, cancelSignal, downloadMap, muted, makeBrowser, browserReplacer, compositor, sourcemapContext, logLevel, indent, }) => {
     if (outputDir) {
         if (!node_fs_1.default.existsSync(outputDir)) {
             node_fs_1.default.mkdirSync(outputDir, {
@@ -69,7 +69,7 @@ const innerRenderFrames = async ({ onFrameUpdate, outputDir, onStart, inputProps
         }
         const initialFrame = realFrameRange[0];
         await (0, set_props_and_env_1.setPropsAndEnv)({
-            inputProps,
+            serializedInputPropsWithCustomSchema,
             envVariables,
             page,
             serveUrl,
@@ -86,7 +86,7 @@ const innerRenderFrames = async ({ onFrameUpdate, outputDir, onStart, inputProps
                 window.remotion_setBundleMode({
                     type: 'composition',
                     compositionName: id,
-                    props,
+                    serializedResolvedPropsWithSchema: props,
                     compositionDurationInFrames: durationInFrames,
                     compositionFps: fps,
                     compositionHeight: height,
@@ -95,7 +95,7 @@ const innerRenderFrames = async ({ onFrameUpdate, outputDir, onStart, inputProps
             },
             args: [
                 composition.id,
-                composition.props,
+                serializedResolvedPropsWithCustomSchema,
                 composition.durationInFrames,
                 composition.fps,
                 composition.height,
@@ -292,7 +292,7 @@ const innerRenderFrames = async ({ onFrameUpdate, outputDir, onStart, inputProps
     await Promise.all(downloadPromises);
     return result;
 };
-const internalRenderFrames = ({ browserExecutable, cancelSignal, chromiumOptions, composition, concurrency, envVariables, everyNthFrame, frameRange, imageFormat, indent, inputProps, jpegQuality, muted, onBrowserLog, onDownload, onFrameBuffer, onFrameUpdate, onStart, outputDir, port, puppeteerInstance, scale, server, timeoutInMilliseconds, logLevel, webpackBundleOrServeUrl, }) => {
+const internalRenderFrames = ({ browserExecutable, cancelSignal, chromiumOptions, composition, concurrency, envVariables, everyNthFrame, frameRange, imageFormat, indent, jpegQuality, muted, onBrowserLog, onDownload, onFrameBuffer, onFrameUpdate, onStart, outputDir, port, puppeteerInstance, scale, server, timeoutInMilliseconds, logLevel, webpackBundleOrServeUrl, serializedInputPropsWithCustomSchema, serializedResolvedPropsWithCustomSchema, }) => {
     remotion_1.Internals.validateDimension(composition.height, 'height', 'in the `config` object passed to `renderFrames()`');
     remotion_1.Internals.validateDimension(composition.width, 'width', 'in the `config` object passed to `renderFrames()`');
     remotion_1.Internals.validateFps(composition.fps, 'in the `config` object of `renderFrames()`', false);
@@ -360,7 +360,6 @@ const internalRenderFrames = ({ browserExecutable, cancelSignal, chromiumOptions
                     everyNthFrame,
                     frameRange,
                     imageFormat,
-                    inputProps,
                     jpegQuality,
                     muted,
                     onBrowserLog,
@@ -372,6 +371,8 @@ const internalRenderFrames = ({ browserExecutable, cancelSignal, chromiumOptions
                     timeoutInMilliseconds,
                     logLevel,
                     indent,
+                    serializedInputPropsWithCustomSchema,
+                    serializedResolvedPropsWithCustomSchema,
                 });
             }),
         ])
@@ -438,7 +439,16 @@ const renderFrames = (options) => {
         indent: false,
         jpegQuality: jpegQuality !== null && jpegQuality !== void 0 ? jpegQuality : jpeg_quality_1.DEFAULT_JPEG_QUALITY,
         onDownload: onDownload !== null && onDownload !== void 0 ? onDownload : null,
-        inputProps,
+        serializedInputPropsWithCustomSchema: remotion_1.Internals.serializeJSONWithDate({
+            indent: undefined,
+            staticBase: null,
+            data: inputProps !== null && inputProps !== void 0 ? inputProps : {},
+        }).serializedString,
+        serializedResolvedPropsWithCustomSchema: remotion_1.Internals.serializeJSONWithDate({
+            indent: undefined,
+            staticBase: null,
+            data: composition.props,
+        }).serializedString,
         puppeteerInstance,
         muted: muted !== null && muted !== void 0 ? muted : false,
         onBrowserLog: onBrowserLog !== null && onBrowserLog !== void 0 ? onBrowserLog : null,

package/dist/render-media.d.ts

@@ -32,8 +32,9 @@ export type RenderMediaOnProgress = (progress: {
 export type InternalRenderMediaOptions = {
     outputLocation: string | null;
     codec: Codec;
-    composition: VideoConfig;
-    inputProps: Record<string, unknown>;
+    composition: Omit<VideoConfig, 'props' | 'defaultProps'>;
+    serializedInputPropsWithCustomSchema: string;
+    serializedResolvedPropsWithCustomSchema: string;
     crf: number | null;
     imageFormat: VideoImageFormat;
     pixelFormat: PixelFormat;
@@ -124,7 +125,7 @@ type RenderMediaResult = {
     buffer: Buffer | null;
     slowestFrames: SlowFrame[];
 };
-export declare const internalRenderMedia: ({ proResProfile, crf, composition, inputProps, pixelFormat, codec, envVariables, frameRange, puppeteerInstance, outputLocation, onProgress, overwrite, onDownload, onBrowserLog, onStart, timeoutInMilliseconds, chromiumOptions, scale, browserExecutable, port, cancelSignal, muted, enforceAudioTrack, ffmpegOverride, audioBitrate, videoBitrate, audioCodec, concurrency, disallowParallelEncoding, everyNthFrame, imageFormat: provisionalImageFormat, indent, jpegQuality, numberOfGifLoops, onCtrlCExit, preferLossless, serveUrl, server: reusedServer, logLevel, }: InternalRenderMediaOptions) => Promise<RenderMediaResult>;
+export declare const internalRenderMedia: ({ proResProfile, crf, composition, serializedInputPropsWithCustomSchema, pixelFormat, codec, envVariables, frameRange, puppeteerInstance, outputLocation, onProgress, overwrite, onDownload, onBrowserLog, onStart, timeoutInMilliseconds, chromiumOptions, scale, browserExecutable, port, cancelSignal, muted, enforceAudioTrack, ffmpegOverride, audioBitrate, videoBitrate, audioCodec, concurrency, disallowParallelEncoding, everyNthFrame, imageFormat: provisionalImageFormat, indent, jpegQuality, numberOfGifLoops, onCtrlCExit, preferLossless, serveUrl, server: reusedServer, logLevel, serializedResolvedPropsWithCustomSchema, }: InternalRenderMediaOptions) => Promise<RenderMediaResult>;
 /**
  *
  * @description Render a video from a composition

package/dist/render-media.js

@@ -43,7 +43,7 @@ const validate_output_filename_1 = require("./validate-output-filename");
 const validate_scale_1 = require("./validate-scale");
 const validate_videobitrate_1 = require("./validate-videobitrate");
 const SLOWEST_FRAME_COUNT = 10;
-const internalRenderMedia = ({ proResProfile, crf, composition, inputProps, pixelFormat, codec, envVariables, frameRange, puppeteerInstance, outputLocation, onProgress, overwrite, onDownload, onBrowserLog, onStart, timeoutInMilliseconds, chromiumOptions, scale, browserExecutable, port, cancelSignal, muted, enforceAudioTrack, ffmpegOverride, audioBitrate, videoBitrate, audioCodec, concurrency, disallowParallelEncoding, everyNthFrame, imageFormat: provisionalImageFormat, indent, jpegQuality, numberOfGifLoops, onCtrlCExit, preferLossless, serveUrl, server: reusedServer, logLevel, }) => {
+const internalRenderMedia = ({ proResProfile, crf, composition, serializedInputPropsWithCustomSchema, pixelFormat, codec, envVariables, frameRange, puppeteerInstance, outputLocation, onProgress, overwrite, onDownload, onBrowserLog, onStart, timeoutInMilliseconds, chromiumOptions, scale, browserExecutable, port, cancelSignal, muted, enforceAudioTrack, ffmpegOverride, audioBitrate, videoBitrate, audioCodec, concurrency, disallowParallelEncoding, everyNthFrame, imageFormat: provisionalImageFormat, indent, jpegQuality, numberOfGifLoops, onCtrlCExit, preferLossless, serveUrl, server: reusedServer, logLevel, serializedResolvedPropsWithCustomSchema, }) => {
     (0, jpeg_quality_1.validateJpegQuality)(jpegQuality);
     (0, crf_1.validateQualitySettings)({ crf, codec, videoBitrate });
     (0, validate_videobitrate_1.validateBitrate)(audioBitrate, 'audioBitrate');
@@ -250,7 +250,7 @@ const internalRenderMedia = ({ proResProfile, crf, composition, inputProps, pixe
                     callUpdate();
                     onStart === null || onStart === void 0 ? void 0 : onStart(data);
                 },
-                inputProps,
+                serializedInputPropsWithCustomSchema,
                 envVariables,
                 imageFormat,
                 jpegQuality,
@@ -290,6 +290,7 @@ const internalRenderMedia = ({ proResProfile, crf, composition, inputProps, pixe
                 logLevel,
                 indent,
                 server,
+                serializedResolvedPropsWithCustomSchema,
             });
             return renderFramesProc;
         })
@@ -426,7 +427,11 @@ const renderMedia = ({ proResProfile, crf, composition, inputProps, pixelFormat,
         ffmpegOverride: ffmpegOverride !== null && ffmpegOverride !== void 0 ? ffmpegOverride : undefined,
         frameRange: frameRange !== null && frameRange !== void 0 ? frameRange : null,
         imageFormat: imageFormat !== null && imageFormat !== void 0 ? imageFormat : image_format_1.DEFAULT_VIDEO_IMAGE_FORMAT,
-        inputProps: inputProps !== null && inputProps !== void 0 ? inputProps : {},
+        serializedInputPropsWithCustomSchema: remotion_1.Internals.serializeJSONWithDate({
+            indent: undefined,
+            staticBase: null,
+            data: inputProps !== null && inputProps !== void 0 ? inputProps : {},
+        }).serializedString,
         jpegQuality: (_a = jpegQuality !== null && jpegQuality !== void 0 ? jpegQuality : quality) !== null && _a !== void 0 ? _a : jpeg_quality_1.DEFAULT_JPEG_QUALITY,
         muted: muted !== null && muted !== void 0 ? muted : false,
         numberOfGifLoops: numberOfGifLoops !== null && numberOfGifLoops !== void 0 ? numberOfGifLoops : null,
@@ -447,6 +452,11 @@ const renderMedia = ({ proResProfile, crf, composition, inputProps, pixelFormat,
         indent: false,
         onCtrlCExit: () => undefined,
         server: undefined,
+        serializedResolvedPropsWithCustomSchema: remotion_1.Internals.serializeJSONWithDate({
+            indent: undefined,
+            staticBase: null,
+            data: composition.props,
+        }).serializedString,
     });
 };
 exports.renderMedia = renderMedia;

package/dist/render-still.d.ts

@@ -13,7 +13,8 @@ type InternalRenderStillOptions = {
     composition: VideoConfig;
     output: string | null;
     frame: number;
-    inputProps: Record<string, unknown>;
+    serializedInputPropsWithCustomSchema: string;
+    serializedResolvedPropsWithCustomSchema: string;
     imageFormat: StillImageFormat;
     jpegQuality: number;
     puppeteerInstance: HeadlessBrowser | null;

package/dist/render-still.js

@@ -49,7 +49,7 @@ const take_frame_and_compose_1 = require("./take-frame-and-compose");
 const validate_puppeteer_timeout_1 = require("./validate-puppeteer-timeout");
 const validate_scale_1 = require("./validate-scale");
 const logger_1 = require("./logger");
-const innerRenderStill = async ({ composition, imageFormat = image_format_1.DEFAULT_STILL_IMAGE_FORMAT, serveUrl, puppeteerInstance, onError, inputProps, envVariables, output, frame = 0, overwrite, browserExecutable, timeoutInMilliseconds, chromiumOptions, scale, proxyPort, cancelSignal, jpegQuality, onBrowserLog, compositor, sourceMapContext, downloadMap, logLevel, indent, }) => {
+const innerRenderStill = async ({ composition, imageFormat = image_format_1.DEFAULT_STILL_IMAGE_FORMAT, serveUrl, puppeteerInstance, onError, serializedInputPropsWithCustomSchema, envVariables, output, frame = 0, overwrite, browserExecutable, timeoutInMilliseconds, chromiumOptions, scale, proxyPort, cancelSignal, jpegQuality, onBrowserLog, compositor, sourceMapContext, downloadMap, logLevel, indent, serializedResolvedPropsWithCustomSchema, }) => {
     remotion_1.Internals.validateDimension(composition.height, 'height', 'in the `config` object passed to `renderStill()`');
     remotion_1.Internals.validateDimension(composition.width, 'width', 'in the `config` object passed to `renderStill()`');
     remotion_1.Internals.validateFps(composition.fps, 'in the `config` object of `renderStill()`', false);
@@ -134,7 +134,7 @@ const innerRenderStill = async ({ composition, imageFormat = image_format_1.DEFA
         page.on('console', logCallback);
     }
     await (0, set_props_and_env_1.setPropsAndEnv)({
-        inputProps,
+        serializedInputPropsWithCustomSchema,
         envVariables,
         page,
         serveUrl,
@@ -151,7 +151,7 @@ const innerRenderStill = async ({ composition, imageFormat = image_format_1.DEFA
             window.remotion_setBundleMode({
                 type: 'composition',
                 compositionName: id,
-                props,
+                serializedResolvedPropsWithSchema: props,
                 compositionDurationInFrames: durationInFrames,
                 compositionFps: fps,
                 compositionHeight: height,
@@ -160,7 +160,7 @@ const innerRenderStill = async ({ composition, imageFormat = image_format_1.DEFA
         },
         args: [
             composition.id,
-            composition.props,
+            serializedResolvedPropsWithCustomSchema,
             composition.durationInFrames,
             composition.fps,
             composition.height,
@@ -239,7 +239,7 @@ exports.internalRenderStill = internalRenderStill;
  * @see [Documentation](https://www.remotion.dev/docs/renderer/render-still)
  */
 const renderStill = (options) => {
-    var _a;
+    var _a, _b;
     const { composition, serveUrl, browserExecutable, cancelSignal, chromiumOptions, dumpBrowserLogs, envVariables, frame, imageFormat, inputProps, jpegQuality, onBrowserLog, onDownload, output, overwrite, port, puppeteerInstance, scale, timeoutInMilliseconds, verbose, quality, } = options;
     if (typeof jpegQuality !== 'undefined' && imageFormat !== 'jpeg') {
         throw new Error("You can only pass the `quality` option if `imageFormat` is 'jpeg'.");
@@ -256,7 +256,11 @@ const renderStill = (options) => {
         frame: frame !== null && frame !== void 0 ? frame : 0,
         imageFormat: imageFormat !== null && imageFormat !== void 0 ? imageFormat : image_format_1.DEFAULT_STILL_IMAGE_FORMAT,
         indent: false,
-        inputProps: inputProps !== null && inputProps !== void 0 ? inputProps : {},
+        serializedInputPropsWithCustomSchema: remotion_1.Internals.serializeJSONWithDate({
+            staticBase: null,
+            indent: undefined,
+            data: inputProps !== null && inputProps !== void 0 ? inputProps : {},
+        }).serializedString,
         jpegQuality: (_a = jpegQuality !== null && jpegQuality !== void 0 ? jpegQuality : quality) !== null && _a !== void 0 ? _a : jpeg_quality_1.DEFAULT_JPEG_QUALITY,
         onBrowserLog: onBrowserLog !== null && onBrowserLog !== void 0 ? onBrowserLog : null,
         onDownload: onDownload !== null && onDownload !== void 0 ? onDownload : null,
@@ -269,6 +273,11 @@ const renderStill = (options) => {
         serveUrl,
         timeoutInMilliseconds: timeoutInMilliseconds !== null && timeoutInMilliseconds !== void 0 ? timeoutInMilliseconds : TimeoutSettings_1.DEFAULT_TIMEOUT,
         logLevel: verbose || dumpBrowserLogs ? 'verbose' : (0, logger_1.getLogLevel)(),
+        serializedResolvedPropsWithCustomSchema: remotion_1.Internals.serializeJSONWithDate({
+            indent: undefined,
+            staticBase: null,
+            data: (_b = composition.props) !== null && _b !== void 0 ? _b : {},
+        }).serializedString,
     });
 };
 exports.renderStill = renderStill;

package/dist/select-composition.d.ts

@@ -1,4 +1,4 @@
-import type { VideoConfig } from 'remotion';
+import { type VideoConfig } from 'remotion';
 import type { BrowserExecutable } from './browser-executable';
 import type { BrowserLog } from './browser-log';
 import type { HeadlessBrowser } from './browser/Browser';
@@ -6,7 +6,7 @@ import type { ChromiumOptions } from './open-browser';
 import type { RemotionServer } from './prepare-server';
 import { type LogLevel } from './log-level';
 type InternalSelectCompositionsConfig = {
-    inputProps: Record<string, unknown>;
+    serializedInputPropsWithCustomSchema: string;
     envVariables: Record<string, string>;
     puppeteerInstance: HeadlessBrowser | undefined;
     onBrowserLog: null | ((log: BrowserLog) => void);
@@ -42,5 +42,5 @@ export declare const internalSelectComposition: (options: InternalSelectComposit
  * @description Gets a composition defined in a Remotion project based on a Webpack bundle.
  * @see [Documentation](https://www.remotion.dev/docs/renderer/select-composition)
  */
-export declare const selectComposition: (options: SelectCompositionOptions) => Promise<VideoConfig>;
+export declare const selectComposition: (options: SelectCompositionOptions) => Promise<Omit<VideoConfig, 'defaultProps'>>;
 export {};

package/dist/select-composition.js

@@ -1,6 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.selectComposition = exports.internalSelectComposition = void 0;
+const remotion_1 = require("remotion");
 const TimeoutSettings_1 = require("./browser/TimeoutSettings");
 const handle_javascript_exception_1 = require("./error-handling/handle-javascript-exception");
 const find_closest_package_json_1 = require("./find-closest-package-json");
@@ -11,7 +12,7 @@ const puppeteer_evaluate_1 = require("./puppeteer-evaluate");
 const seek_to_frame_1 = require("./seek-to-frame");
 const set_props_and_env_1 = require("./set-props-and-env");
 const validate_puppeteer_timeout_1 = require("./validate-puppeteer-timeout");
-const innerSelectComposition = async ({ page, onBrowserLog, inputProps, envVariables, serveUrl, timeoutInMilliseconds, port, id, indent, logLevel, }) => {
+const innerSelectComposition = async ({ page, onBrowserLog, serializedInputPropsWithCustomSchema, envVariables, serveUrl, timeoutInMilliseconds, port, id, indent, logLevel, }) => {
     if (onBrowserLog) {
         page.on('console', (log) => {
             onBrowserLog({
@@ -23,7 +24,7 @@ const innerSelectComposition = async ({ page, onBrowserLog, inputProps, envVaria
     }
     (0, validate_puppeteer_timeout_1.validatePuppeteerTimeout)(timeoutInMilliseconds);
     await (0, set_props_and_env_1.setPropsAndEnv)({
-        inputProps,
+        serializedInputPropsWithCustomSchema,
         envVariables,
         page,
         serveUrl,
@@ -64,11 +65,24 @@ const innerSelectComposition = async ({ page, onBrowserLog, inputProps, envVaria
         tag: 'selectComposition()',
         logLevel,
     }, `calculateMetadata() took ${Date.now() - time}ms`);
-    return { metadata: result, propsSize: size };
+    const res = result;
+    const { width, durationInFrames, fps, height } = res;
+    return {
+        metadata: {
+            id,
+            width,
+            height,
+            fps,
+            durationInFrames,
+            props: remotion_1.Internals.deserializeJSONWithCustomFields(res.serializedResolvedPropsWithCustomSchema),
+            defaultProps: remotion_1.Internals.deserializeJSONWithCustomFields(res.serializedDefaultPropsWithCustomSchema),
+        },
+        propsSize: size,
+    };
 };
 const internalSelectComposition = async (options) => {
     const cleanup = [];
-    const { puppeteerInstance, browserExecutable, chromiumOptions, serveUrl: serveUrlOrWebpackUrl, logLevel, indent, port, envVariables, id, inputProps, onBrowserLog, server, timeoutInMilliseconds, } = options;
+    const { puppeteerInstance, browserExecutable, chromiumOptions, serveUrl: serveUrlOrWebpackUrl, logLevel, indent, port, envVariables, id, serializedInputPropsWithCustomSchema, onBrowserLog, server, timeoutInMilliseconds, } = options;
     const { page, cleanup: cleanupPage } = await (0, get_browser_instance_1.getPageAndCleanupFn)({
         passedInInstance: puppeteerInstance,
         browserExecutable,
@@ -108,7 +122,7 @@ const internalSelectComposition = async (options) => {
                 chromiumOptions,
                 envVariables,
                 id,
-                inputProps,
+                serializedInputPropsWithCustomSchema,
                 onBrowserLog,
                 timeoutInMilliseconds,
                 logLevel,
@@ -143,7 +157,11 @@ const selectComposition = async (options) => {
         browserExecutable: browserExecutable !== null && browserExecutable !== void 0 ? browserExecutable : null,
         chromiumOptions: chromiumOptions !== null && chromiumOptions !== void 0 ? chromiumOptions : {},
         envVariables: envVariables !== null && envVariables !== void 0 ? envVariables : {},
-        inputProps: inputProps !== null && inputProps !== void 0 ? inputProps : {},
+        serializedInputPropsWithCustomSchema: remotion_1.Internals.serializeJSONWithDate({
+            indent: undefined,
+            staticBase: null,
+            data: inputProps !== null && inputProps !== void 0 ? inputProps : {},
+        }).serializedString,
         onBrowserLog: onBrowserLog !== null && onBrowserLog !== void 0 ? onBrowserLog : null,
         port: port !== null && port !== void 0 ? port : null,
         puppeteerInstance,

package/dist/serialize-props.d.ts

@@ -0,0 +1,6 @@
+import type { SerializedJSONWithCustomFields } from 'remotion';
+export declare const serializeJSONWithDate: ({ data, indent, staticBase, }: {
+    data: Record<string, unknown>;
+    indent: number | undefined;
+    staticBase: string | null;
+}) => SerializedJSONWithCustomFields;

package/dist/serialize-props.js

@@ -0,0 +1,36 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.serializeJSONWithDate = void 0;
+// Keep in sync with /packages/core/src/input-props-serialization.ts
+const DATE_TOKEN = 'remotion-date:';
+const FILE_TOKEN = 'remotion-file:';
+const serializeJSONWithDate = ({ data, indent, staticBase, }) => {
+    let customDateUsed = false;
+    let customFileUsed = false;
+    let mapUsed = false;
+    let setUsed = false;
+    const serializedString = JSON.stringify(data, function (key, value) {
+        const item = this[key];
+        if (item instanceof Date) {
+            customDateUsed = true;
+            return `${DATE_TOKEN}${item.toISOString()}`;
+        }
+        if (item instanceof Map) {
+            mapUsed = true;
+            return value;
+        }
+        if (item instanceof Set) {
+            setUsed = true;
+            return value;
+        }
+        if (typeof item === 'string' &&
+            staticBase !== null &&
+            item.startsWith(staticBase)) {
+            customFileUsed = true;
+            return `${FILE_TOKEN}${item.replace(staticBase + '/', '')}`;
+        }
+        return value;
+    }, indent);
+    return { serializedString, customDateUsed, customFileUsed, mapUsed, setUsed };
+};
+exports.serializeJSONWithDate = serializeJSONWithDate;

package/dist/set-props-and-env.d.ts

@@ -1,6 +1,6 @@
 import type { Page } from './browser/BrowserPage';
 type SetPropsAndEnv = {
-    inputProps: Record<string, unknown>;
+    serializedInputPropsWithCustomSchema: string;
     envVariables: Record<string, string> | undefined;
     page: Page;
     serveUrl: string;

package/dist/set-props-and-env.js

@@ -8,7 +8,7 @@ const puppeteer_evaluate_1 = require("./puppeteer-evaluate");
 const redirect_status_codes_1 = require("./redirect-status-codes");
 const validate_puppeteer_timeout_1 = require("./validate-puppeteer-timeout");
 const logger_1 = require("./logger");
-const innerSetPropsAndEnv = async ({ inputProps, envVariables, page, serveUrl, initialFrame, timeoutInMilliseconds, proxyPort, retriesRemaining, audioEnabled, videoEnabled, }) => {
+const innerSetPropsAndEnv = async ({ serializedInputPropsWithCustomSchema, envVariables, page, serveUrl, initialFrame, timeoutInMilliseconds, proxyPort, retriesRemaining, audioEnabled, videoEnabled, }) => {
     (0, validate_puppeteer_timeout_1.validatePuppeteerTimeout)(timeoutInMilliseconds);
     const actualTimeout = timeoutInMilliseconds !== null && timeoutInMilliseconds !== void 0 ? timeoutInMilliseconds : TimeoutSettings_1.DEFAULT_TIMEOUT;
     page.setDefaultTimeout(actualTimeout);
@@ -17,14 +17,9 @@ const innerSetPropsAndEnv = async ({ inputProps, envVariables, page, serveUrl, i
     await page.evaluateOnNewDocument((timeout) => {
         window.remotion_puppeteerTimeout = timeout;
     }, actualTimeout);
-    if (typeof inputProps === 'string') {
-        throw new Error('Input props should be an object, not a string.');
-    }
-    if (inputProps) {
-        await page.evaluateOnNewDocument((input) => {
-            window.remotion_inputProps = input;
-        }, JSON.stringify(inputProps));
-    }
+    await page.evaluateOnNewDocument((input) => {
+        window.remotion_inputProps = input;
+    }, serializedInputPropsWithCustomSchema);
     if (envVariables) {
         await page.evaluateOnNewDocument((input) => {
             window.remotion_envVariables = input;
@@ -58,7 +53,7 @@ const innerSetPropsAndEnv = async ({ inputProps, envVariables, page, serveUrl, i
         return innerSetPropsAndEnv({
             envVariables,
             initialFrame,
-            inputProps,
+            serializedInputPropsWithCustomSchema,
             page,
             proxyPort,
             retriesRemaining: retriesRemaining - 1,
@@ -98,7 +93,7 @@ const innerSetPropsAndEnv = async ({ inputProps, envVariables, page, serveUrl, i
         frame: null,
         page,
     });
-    const requiredVersion = '7';
+    const requiredVersion = '8';
     if (siteVersion !== requiredVersion) {
         throw new Error(`Incompatible site: When visiting ${urlToVisit}, a bundle was found, but one that is not compatible with this version of Remotion. Found version: ${siteVersion} - Required version: ${requiredVersion}. To resolve this error, please bundle and deploy again.`);
     }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@remotion/renderer",
-  "version": "4.0.2",
+  "version": "4.0.3",
   "description": "Renderer for Remotion",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
@@ -18,7 +18,7 @@
     "extract-zip": "2.0.1",
     "source-map": "^0.8.0-beta.0",
     "ws": "8.7.0",
-    "remotion": "4.0.2"
+    "remotion": "4.0.3"
   },
   "peerDependencies": {
     "react": ">=16.8.0",
@@ -42,13 +42,13 @@
     "zod": "^3.21.4"
   },
   "optionalDependencies": {
-    "@remotion/compositor-darwin-x64": "4.0.2",
-    "@remotion/compositor-darwin-arm64": "4.0.2",
-    "@remotion/compositor-linux-x64-gnu": "4.0.2",
-    "@remotion/compositor-linux-arm64-gnu": "4.0.2",
-    "@remotion/compositor-linux-arm64-musl": "4.0.2",
-    "@remotion/compositor-linux-x64-musl": "4.0.2",
-    "@remotion/compositor-win32-x64-msvc": "4.0.2"
+    "@remotion/compositor-darwin-x64": "4.0.3",
+    "@remotion/compositor-darwin-arm64": "4.0.3",
+    "@remotion/compositor-linux-arm64-musl": "4.0.3",
+    "@remotion/compositor-linux-x64-gnu": "4.0.3",
+    "@remotion/compositor-linux-x64-musl": "4.0.3",
+    "@remotion/compositor-linux-arm64-gnu": "4.0.3",
+    "@remotion/compositor-win32-x64-msvc": "4.0.3"
   },
   "keywords": [
     "remotion",