remotion 3.3.43 → 3.3.45

package/README.md

@@ -7,11 +7,11 @@
   </a>
 </p>
 
-[![Discord Shield](https://discordapp.com/api/guilds/809501355504959528/widget.png?style=shield)](https://remotion.dev/discord)
-[![NPM Version](https://img.shields.io/npm/v/remotion.svg?style=flat)](https://www.npmjs.org/package/remotion)
-[![NPM Downloads](https://img.shields.io/npm/dm/remotion.svg?style=flat)](https://npmcharts.com/compare/remotion?minimal=true)
-[![Install Size](https://packagephobia.now.sh/badge?p=remotion)](https://packagephobia.now.sh/result?p=remotion)
-<a href="https://twitter.com/remotion"><img src="https://img.shields.io/twitter/follow/remotion?label=Twitter&style=social" alt="Twitter"></a>
+[![Discord Shield](https://img.shields.io/discord/809501355504959528?color=000000&label=Discord&logo=fdgssdf)](https://remotion.dev/discord)
+[![NPM Version](https://img.shields.io/npm/v/remotion.svg?style=flat&color=black)](https://www.npmjs.org/package/remotion)
+[![NPM Downloads](https://img.shields.io/npm/dm/remotion.svg?style=flat&color=black&label=Downloads)](https://npmcharts.com/compare/remotion?minimal=true)
+[![Open Bounties](https://img.shields.io/endpoint?url=https%3A%2F%2Fconsole.algora.io%2Fapi%2Fshields%2Fremotion%2Fbounties%3Fstatus%3Dopen&style=flat&color=black&labelColor=grey&label=Open+Bounties)](https://github.com/remotion-dev/remotion/issues?q=is%3Aopen+label%3A%22%F0%9F%92%8E+Bounty%22+sort%3Aupdated-desc)
+<a href="https://twitter.com/remotion"><img src="https://img.shields.io/twitter/follow/remotion?label=Twitter&color=black" alt="Twitter"></a>
 
 Remotion is a framework for **creating videos programmatically using React.**
 

package/dist/CompositionManager.js

@@ -49,19 +49,29 @@ const CompositionManagerProvider = ({ children }) => {
     // Wontfix, expected to have
     // eslint-disable-next-line @typescript-eslint/no-explicit-any
     const [compositions, setCompositions] = (0, react_1.useState)([]);
+    const currentcompositionsRef = (0, react_1.useRef)(compositions);
     const [currentComposition, setCurrentComposition] = (0, react_1.useState)(null);
     const [assets, setAssets] = (0, react_1.useState)([]);
     const [folders, setFolders] = (0, react_1.useState)([]);
     const [sequences, setSequences] = (0, react_1.useState)([]);
     const [currentCompositionMetadata, setCurrentCompositionMetadata] = (0, react_1.useState)(null);
-    const registerComposition = (0, react_1.useCallback)((comp) => {
+    const updateCompositions = (0, react_1.useCallback)(
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    (updateComps) => {
         setCompositions((comps) => {
+            const updated = updateComps(comps);
+            currentcompositionsRef.current = updated;
+            return updated;
+        });
+    }, []);
+    const registerComposition = (0, react_1.useCallback)((comp) => {
+        updateCompositions((comps) => {
             if (comps.find((c) => c.id === comp.id)) {
                 throw new Error(`Multiple composition with id ${comp.id} are registered.`);
             }
             return [...comps, comp].slice().sort((a, b) => a.nonce - b.nonce);
         });
-    }, []);
+    }, [updateCompositions]);
     const registerSequence = (0, react_1.useCallback)((seq) => {
         setSequences((seqs) => {
             return [...seqs, seq];
@@ -111,9 +121,9 @@ const CompositionManagerProvider = ({ children }) => {
     }, [assets]);
     (0, react_1.useImperativeHandle)(exports.compositionsRef, () => {
         return {
-            getCompositions: () => compositions,
+            getCompositions: () => currentcompositionsRef.current,
         };
-    }, [compositions]);
+    }, []);
     const contextValue = (0, react_1.useMemo)(() => {
         return {
             compositions,

package/dist/Satori.d.ts

@@ -0,0 +1,5 @@
+import type { PropsWithChildren } from 'react';
+import React from 'react';
+export declare const Satori: React.FC<PropsWithChildren>;
+export declare const SatoriForRendering: React.FC<PropsWithChildren>;
+export declare const SatoriForDevelopment: React.FC<PropsWithChildren>;

package/dist/Satori.js

@@ -0,0 +1,92 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SatoriForDevelopment = exports.SatoriForRendering = exports.Satori = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = __importStar(require("react"));
+const satori_1 = __importDefault(require("satori"));
+const _1 = require(".");
+const get_environment_1 = require("./get-environment");
+const NativeLayers_1 = require("./NativeLayers");
+const use_video_config_1 = require("./use-video-config");
+const Satori = ({ children }) => {
+    if ((0, get_environment_1.getRemotionEnvironment)() === 'rendering') {
+        return (0, jsx_runtime_1.jsx)(exports.SatoriForRendering, { children: children });
+    }
+    return (0, jsx_runtime_1.jsx)(exports.SatoriForDevelopment, { children: children });
+};
+exports.Satori = Satori;
+const SatoriForRendering = ({ children }) => {
+    const { width, height } = (0, use_video_config_1.useVideoConfig)();
+    const { setSatoriStack } = (0, react_1.useContext)(NativeLayers_1.NativeLayersContext);
+    (0, react_1.useLayoutEffect)(() => {
+        const handle = (0, _1.delayRender)();
+        (0, satori_1.default)(children, {
+            width,
+            height,
+            fonts: [],
+        })
+            .then((svg) => {
+            (0, _1.continueRender)(handle);
+            setSatoriStack(svg);
+            console.log({ svg });
+        })
+            .catch((err) => {
+            console.log(err);
+        });
+    }, [children, height, setSatoriStack, width]);
+    return (0, jsx_runtime_1.jsx)(_1.Experimental.Null, {});
+};
+exports.SatoriForRendering = SatoriForRendering;
+const SatoriForDevelopment = ({ children, }) => {
+    const [markup, setMarkup] = react_1.default.useState(null);
+    const { width, height } = (0, use_video_config_1.useVideoConfig)();
+    (0, react_1.useEffect)(() => {
+        (0, satori_1.default)(children, {
+            width,
+            height,
+            fonts: [],
+        })
+            .then((svg) => {
+            setMarkup(svg);
+            console.log({ svg });
+        })
+            .catch((err) => {
+            console.log(err);
+        });
+    }, [children, height, width]);
+    if (!markup) {
+        return null;
+    }
+    return ((0, jsx_runtime_1.jsx)("div", { 
+        // eslint-disable-next-line react/no-danger
+        dangerouslySetInnerHTML: {
+            __html: markup,
+        } }));
+};
+exports.SatoriForDevelopment = SatoriForDevelopment;

package/dist/Sequence.d.ts

@@ -12,6 +12,7 @@ export declare type LayoutAndStyle = {
 } | {
     layout?: 'absolute-fill';
     style?: React.CSSProperties;
+    className?: string;
 };
 export declare type SequenceProps = {
     children: React.ReactNode;

package/dist/cancel-render.d.ts

@@ -0,0 +1 @@
+export declare function cancelRender(err: unknown): never;

package/dist/cancel-render.js

@@ -0,0 +1,43 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.cancelRender = void 0;
+const isErrorLike = (err) => {
+    if (err === null) {
+        return false;
+    }
+    if (typeof err !== 'object') {
+        return false;
+    }
+    if (!('stack' in err)) {
+        return false;
+    }
+    // eslint-disable-next-line @typescript-eslint/prefer-ts-expect-error
+    // @ts-ignore we just asserted
+    if (typeof err.stack !== 'string') {
+        return false;
+    }
+    if (!('message' in err)) {
+        return false;
+    }
+    // eslint-disable-next-line @typescript-eslint/prefer-ts-expect-error
+    // @ts-ignore we just asserted
+    if (typeof err.message !== 'string') {
+        return false;
+    }
+    return true;
+};
+function cancelRender(err) {
+    let error;
+    if (isErrorLike(err)) {
+        error = err;
+    }
+    else if (typeof err === 'string') {
+        error = Error(err);
+    }
+    else {
+        error = Error('Rendering was cancelled');
+    }
+    window.remotion_cancelledError = error.stack;
+    throw error;
+}
+exports.cancelRender = cancelRender;

package/dist/config.d.ts

@@ -3,74 +3,26 @@
  * For the moment the type definitions are going to stay here
  */
 declare type Concurrency = number | null;
-import type { Configuration } from 'webpack';
-declare type WebpackConfiguration = Configuration;
-declare type WebpackOverrideFn = (currentConfiguration: WebpackConfiguration) => WebpackConfiguration;
 declare type BrowserExecutable = string | null;
 declare type FrameRange = number | [number, number];
 declare type FfmpegExecutable = string | null;
 declare type Loop = number | null;
 declare type CodecOrUndefined = 'h264' | 'h265' | 'vp8' | 'vp9' | 'mp3' | 'aac' | 'wav' | 'prores' | 'h264-mkv' | 'gif' | undefined;
 declare type Crf = number | undefined;
-declare type FlatConfig = ObjectConfig['Bundling'] & ObjectConfig['Log'] & ObjectConfig['Preview'] & ObjectConfig['Puppeteer'] & ObjectConfig['Output'] & ObjectConfig['Rendering'] & {
+declare type FlatConfig = RemotionConfigObject['Bundling'] & RemotionConfigObject['Log'] & RemotionConfigObject['Preview'] & RemotionConfigObject['Puppeteer'] & RemotionConfigObject['Output'] & RemotionConfigObject['Rendering'] & {
     /**
      * Set the audio codec to use for the output video.
      * See the Encoding guide in the docs for defaults and available options.
      */
     setAudioCodec: (codec: 'pcm-16' | 'aac' | 'mp3' | 'opus') => void;
 };
-declare type ObjectConfig = {
-    /**
-     * @deprecated New flat config format: You can now replace `Config.Preview.` with `Config.`
-     */
-    readonly Preview: {
-        /**
-         * Change the maximum amount of tracks that are shown in the timeline.
-         * @param maxTracks The maximum amount of timeline tracks that you would like to show.
-         * @default 15
-         */
-        readonly setMaxTimelineTracks: (maxTracks: number) => void;
-        /**
-         * Enable Keyboard shortcuts in the Remotion Preview.
-         * @param enabled Boolean whether to enable the keyboard shortcuts
-         * @default true
-         */
-        readonly setKeyboardShortcutsEnabled: (enableShortcuts: boolean) => void;
-        /**
-         * Set number of shared audio tags. https://www.remotion.dev/docs/player/autoplay#use-the-numberofsharedaudiotags-property
-         * @param numberOfAudioTags
-         * @default 0
-         */
-        readonly setNumberOfSharedAudioTags: (numberOfAudioTags: number) => void;
-        /**
-         * Enable Webpack polling instead of file system listeners for hot reloading in the preview.
-         * This is useful if you are using a remote directory or a virtual machine.
-         * @param interval
-         * @default null
-         */
-        readonly setWebpackPollingInMilliseconds: (interval: number | null) => void;
-        /**
-         * Whether Remotion should open a browser when starting the Preview.
-         * @param should
-         * @default true
-         */
-        readonly setShouldOpenBrowser: (should: boolean) => void;
-    };
-    /**
-     * @deprecated New flat config format: You can now replace `Config.Bundling.` with `Config.`
-     */
-    readonly Bundling: {
+declare global {
+    interface RemotionBundlingOptions {
         /**
          * Specify the entry point so you don't have to specify it in the
          * CLI command
          */
         readonly setEntryPoint: (src: string) => void;
-        /**
-         * Pass in a function which takes the current Webpack config
-         * and return a modified Webpack configuration.
-         * Docs: http://remotion.dev/docs/webpack
-         */
-        readonly overrideWebpackConfig: (fn: WebpackOverrideFn) => void;
         /**
          * Whether Webpack bundles should be cached to make
          * subsequent renders faster. Default: true
@@ -88,204 +40,246 @@ declare type ObjectConfig = {
          * You can set an absolute path or a relative path that will be resolved from the closest package.json location.
          */
         readonly setPublicDir: (publicDir: string | null) => void;
-    };
-    /**
-     * @deprecated New flat config format: You can now replace `Config.Log.` with `Config.`
-     */
-    readonly Log: {
-        /**
-         * Set the log level.
-         * Acceptable values: 'error' | 'warning' | 'info' | 'verbose'
-         * Default value: 'info'
-         *
-         * Set this to 'verbose' to get browser logs and other IO.
-         */
-        readonly setLevel: (newLogLevel: 'verbose' | 'info' | 'warn' | 'error') => void;
-    };
-    /**
-     * @deprecated New flat config format: You can now replace `Config.Puppeteer.` with `Config.`
-     */
-    readonly Puppeteer: {
-        /**
-         * Specify executable path for the browser to use.
-         * Default: null, which will make Remotion find or download a version of said browser.
-         */
-        readonly setBrowserExecutable: (newBrowserExecutablePath: BrowserExecutable) => void;
-        /**
-         * Set how many milliseconds a frame may take to render before it times out.
-         * Default: `30000`
-         */
-        readonly setDelayRenderTimeoutInMilliseconds: (newPuppeteerTimeout: number) => void;
-        /**
-         * @deprecated Renamed to `setDelayRenderTimeoutInMilliseconds`.
-         * Set how many milliseconds a frame may take to render before it times out.
-         * Default: `30000`
-         */
-        readonly setTimeoutInMilliseconds: (newPuppeteerTimeout: number) => void;
-        /**
-         * Setting deciding whether to disable CORS and other Chrome security features.
-         * Default: false
-         */
-        readonly setChromiumDisableWebSecurity: (should: boolean) => void;
-        /**
-         * Setting whether to ignore any invalid SSL certificates, such as self-signed ones.
-         * Default: false
-         */
-        readonly setChromiumIgnoreCertificateErrors: (should: boolean) => void;
-        /**
-         * If false, will open an actual browser during rendering to observe progress.
-         * Default: true
-         */
-        readonly setChromiumHeadlessMode: (should: boolean) => void;
-        /**
-         * Set the OpenGL rendering backend for Chrome. Possible values: 'egl', 'angle', 'swiftshader' and 'swangle'.
-         * Default: 'swangle' in Lambda, null elsewhere.
-         */
-        readonly setChromiumOpenGlRenderer: (renderer: 'swangle' | 'angle' | 'egl' | 'swiftshader') => void;
-    };
-    /**
-     * @deprecated New flat config format: You can now replace `Config.Rendering.` with `Config.`
-     */
-    readonly Rendering: {
-        /**
-         * Set a custom location for a .env file.
-         * Default: `.env`
-         */
-        readonly setDotEnvLocation: (file: string) => void;
-        /**
-         * Sets how many Puppeteer instances will work on rendering your video in parallel.
-         * Default: `null`, meaning half of the threads available on your CPU.
-         */
-        readonly setConcurrency: (newConcurrency: Concurrency) => void;
-        /**
-         * Set the JPEG quality for the frames.
-         * Must be between 0 and 100.
-         * Must be between 0 and 100.
-         * Default: 80
-         */
-        readonly setQuality: (q: number | undefined) => void;
-        /** Decide in which image format to render. Can be either 'jpeg' or 'png'.
-         * PNG is slower, but supports transparency.
-         */
-        readonly setImageFormat: (format: 'png' | 'jpeg' | 'none') => void;
-        /**
-         * Render only a subset of a video.
-         * Pass in a tuple [20, 30] to only render frames 20-30 into a video.
-         * Pass in a single number `20` to only render a single frame as an image.
-         * The frame count starts at 0.
-         */
-        readonly setFrameRange: (newFrameRange: FrameRange | null) => void;
-        /**
-         * Specify local ffmpeg executable.
-         * Default: null, which will use ffmpeg available in PATH.
-         */
-        readonly setFfmpegExecutable: (ffmpegPath: FfmpegExecutable) => void;
-        /**
-         * Specify local ffprobe executable.
-         * Default: null, which will use ffprobe available in PATH.
-         */
-        readonly setFfprobeExecutable: (ffprobePath: FfmpegExecutable) => void;
-        /**
-         * Scales the output dimensions by a factor.
-         * Default: 1.
-         */
-        readonly setScale: (newScale: number) => void;
-        /**
-         * Specify which frames should be picked for rendering a GIF
-         * Default: 1, which means every frame
-         * https://remotion.dev/docs/render-as-gif
-         */
-        readonly setEveryNthFrame: (frame: number) => void;
-        /**
-         * Specify the number of Loop a GIF should have.
-         * Default: null (means GIF will loop infinite)
-         */
-        readonly setNumberOfGifLoops: (newLoop: Loop) => void;
-        /**
-         * Disable audio output.
-         * Default: false
-         */
-        readonly setMuted: (muted: boolean) => void;
-        /**
-         * Don't render an audio track if it would be silent.
-         * Default: true
-         */
-        readonly setEnforceAudioTrack: (enforceAudioTrack: boolean) => void;
-    };
-    /**
-     * @deprecated New flat config format: You can now replace `Config.Output.` with `Config.`
-     */
-    readonly Output: {
-        /**
-         * Set the output file location string. Default: `out/{composition}.{codec}`
-         */
-        readonly setOutputLocation: (newOutputLocation: string) => void;
-        /**
-         * If the video file already exists, should Remotion overwrite
-         * the output? Default: true
-         */
-        readonly setOverwriteOutput: (newOverwrite: boolean) => void;
-        /**
-         * Sets the pixel format in FFMPEG.
-         * See https://trac.ffmpeg.org/wiki/Chroma%20Subsampling for an explanation.
-         * You can override this using the `--pixel-format` Cli flag.
-         */
-        readonly setPixelFormat: (format: 'yuv420p' | 'yuva420p' | 'yuv422p' | 'yuv444p' | 'yuv420p10le' | 'yuv422p10le' | 'yuv444p10le' | 'yuva444p10le') => void;
-        /**
-         * @deprecated Use setCodec() and setImageSequence() instead.
-         * Specify what kind of output you, either `mp4` or `png-sequence`.
-         */
-        readonly setOutputFormat: (newLegacyFormat: 'mp4' | 'png-sequence') => void;
-        /**
-         * Specify the codec for stitching the frames into a video.
-         * Can be `h264` (default), `h265`, `vp8` or `vp9`
-         */
-        readonly setCodec: (newCodec: CodecOrUndefined) => void;
-        /**
-         * Set the Constant Rate Factor to pass to FFMPEG.
-         * Lower values mean better quality, but be aware that the ranges of
-         * possible values greatly differs between codecs.
-         */
-        readonly setCrf: (newCrf: Crf) => void;
-        /**
-         * Set to true if don't want a video but an image sequence as the output.
-         */
-        readonly setImageSequence: (newImageSequence: boolean) => void;
-        /**
-         * Overrides the height of a composition
-         */
-        readonly overrideHeight: (newHeight: number) => void;
-        /**
-         * Overrides the width of a composition
-         */
-        readonly overrideWidth: (newWidth: number) => void;
-        /**
-         * Set the ProRes profile.
-         * This method is only valid if the codec has been set to 'prores'.
-         * Possible values: 4444-xq, 4444, hq, standard, light, proxy. Default: 'hq'
-         * See https://avpres.net/FFmpeg/im_ProRes.html for meaning of possible values.
-         */
-        readonly setProResProfile: (profile: '4444-xq' | '4444' | 'hq' | 'standard' | 'light' | 'proxy' | undefined) => void;
-        /**
-         * Override the arguments that Remotion passes to FFMPEG.
-         * Consult https://remotion.dev/docs/renderer/render-media#ffmpegoverride before using this feature.
-         */
-        readonly overrideFfmpegCommand: (command: (info: {
-            type: 'pre-stitcher' | 'stitcher';
-            args: string[];
-        }) => string[]) => void;
-        /**
-         * Set a target audio bitrate to be passed to FFMPEG.
-         */
-        readonly setAudioBitrate: (bitrate: string | null) => void;
-        /**
-         * Set a target video bitrate to be passed to FFMPEG.
-         * Mutually exclusive with setCrf().
-         */
-        readonly setVideoBitrate: (bitrate: string | null) => void;
-    };
-};
-export declare type ConfigType = ObjectConfig & FlatConfig;
-export type { Concurrency, WebpackConfiguration, WebpackOverrideFn };
+    }
+    interface RemotionConfigObject {
+        /**
+         * @deprecated New flat config format: You can now replace `Config.Preview.` with `Config.`
+         */
+        readonly Preview: {
+            /**
+             * Change the maximum amount of tracks that are shown in the timeline.
+             * @param maxTracks The maximum amount of timeline tracks that you would like to show.
+             * @default 15
+             */
+            readonly setMaxTimelineTracks: (maxTracks: number) => void;
+            /**
+             * Enable Keyboard shortcuts in the Remotion Preview.
+             * @param enabled Boolean whether to enable the keyboard shortcuts
+             * @default true
+             */
+            readonly setKeyboardShortcutsEnabled: (enableShortcuts: boolean) => void;
+            /**
+             * Set number of shared audio tags. https://www.remotion.dev/docs/player/autoplay#use-the-numberofsharedaudiotags-property
+             * @param numberOfAudioTags
+             * @default 0
+             */
+            readonly setNumberOfSharedAudioTags: (numberOfAudioTags: number) => void;
+            /**
+             * Enable Webpack polling instead of file system listeners for hot reloading in the preview.
+             * This is useful if you are using a remote directory or a virtual machine.
+             * @param interval
+             * @default null
+             */
+            readonly setWebpackPollingInMilliseconds: (interval: number | null) => void;
+            /**
+             * Whether Remotion should open a browser when starting the Preview.
+             * @param should
+             * @default true
+             */
+            readonly setShouldOpenBrowser: (should: boolean) => void;
+        };
+        /**
+         * @deprecated New flat config format: You can now replace `Config.Bundling.` with `Config.`
+         */
+        readonly Bundling: RemotionBundlingOptions;
+        /**
+         * @deprecated New flat config format: You can now replace `Config.Log.` with `Config.`
+         */
+        readonly Log: {
+            /**
+             * Set the log level.
+             * Acceptable values: 'error' | 'warning' | 'info' | 'verbose'
+             * Default value: 'info'
+             *
+             * Set this to 'verbose' to get browser logs and other IO.
+             */
+            readonly setLevel: (newLogLevel: 'verbose' | 'info' | 'warn' | 'error') => void;
+        };
+        /**
+         * @deprecated New flat config format: You can now replace `Config.Puppeteer.` with `Config.`
+         */
+        readonly Puppeteer: {
+            /**
+             * Specify executable path for the browser to use.
+             * Default: null, which will make Remotion find or download a version of said browser.
+             */
+            readonly setBrowserExecutable: (newBrowserExecutablePath: BrowserExecutable) => void;
+            /**
+             * Set how many milliseconds a frame may take to render before it times out.
+             * Default: `30000`
+             */
+            readonly setDelayRenderTimeoutInMilliseconds: (newPuppeteerTimeout: number) => void;
+            /**
+             * @deprecated Renamed to `setDelayRenderTimeoutInMilliseconds`.
+             * Set how many milliseconds a frame may take to render before it times out.
+             * Default: `30000`
+             */
+            readonly setTimeoutInMilliseconds: (newPuppeteerTimeout: number) => void;
+            /**
+             * Setting deciding whether to disable CORS and other Chrome security features.
+             * Default: false
+             */
+            readonly setChromiumDisableWebSecurity: (should: boolean) => void;
+            /**
+             * Setting whether to ignore any invalid SSL certificates, such as self-signed ones.
+             * Default: false
+             */
+            readonly setChromiumIgnoreCertificateErrors: (should: boolean) => void;
+            /**
+             * If false, will open an actual browser during rendering to observe progress.
+             * Default: true
+             */
+            readonly setChromiumHeadlessMode: (should: boolean) => void;
+            /**
+             * Set the OpenGL rendering backend for Chrome. Possible values: 'egl', 'angle', 'swiftshader' and 'swangle'.
+             * Default: 'swangle' in Lambda, null elsewhere.
+             */
+            readonly setChromiumOpenGlRenderer: (renderer: 'swangle' | 'angle' | 'egl' | 'swiftshader') => void;
+        };
+        /**
+         * @deprecated New flat config format: You can now replace `Config.Rendering.` with `Config.`
+         */
+        readonly Rendering: {
+            /**
+             * Set a custom location for a .env file.
+             * Default: `.env`
+             */
+            readonly setDotEnvLocation: (file: string) => void;
+            /**
+             * Sets how many Puppeteer instances will work on rendering your video in parallel.
+             * Default: `null`, meaning half of the threads available on your CPU.
+             */
+            readonly setConcurrency: (newConcurrency: Concurrency) => void;
+            /**
+             * Set the JPEG quality for the frames.
+             * Must be between 0 and 100.
+             * Must be between 0 and 100.
+             * Default: 80
+             */
+            readonly setQuality: (q: number | undefined) => void;
+            /** Decide in which image format to render. Can be either 'jpeg' or 'png'.
+             * PNG is slower, but supports transparency.
+             */
+            readonly setImageFormat: (format: 'png' | 'jpeg' | 'none') => void;
+            /**
+             * Render only a subset of a video.
+             * Pass in a tuple [20, 30] to only render frames 20-30 into a video.
+             * Pass in a single number `20` to only render a single frame as an image.
+             * The frame count starts at 0.
+             */
+            readonly setFrameRange: (newFrameRange: FrameRange | null) => void;
+            /**
+             * Specify local ffmpeg executable.
+             * Default: null, which will use ffmpeg available in PATH.
+             */
+            readonly setFfmpegExecutable: (ffmpegPath: FfmpegExecutable) => void;
+            /**
+             * Specify local ffprobe executable.
+             * Default: null, which will use ffprobe available in PATH.
+             */
+            readonly setFfprobeExecutable: (ffprobePath: FfmpegExecutable) => void;
+            /**
+             * Scales the output dimensions by a factor.
+             * Default: 1.
+             */
+            readonly setScale: (newScale: number) => void;
+            /**
+             * Specify which frames should be picked for rendering a GIF
+             * Default: 1, which means every frame
+             * https://remotion.dev/docs/render-as-gif
+             */
+            readonly setEveryNthFrame: (frame: number) => void;
+            /**
+             * Specify the number of Loop a GIF should have.
+             * Default: null (means GIF will loop infinite)
+             */
+            readonly setNumberOfGifLoops: (newLoop: Loop) => void;
+            /**
+             * Disable audio output.
+             * Default: false
+             */
+            readonly setMuted: (muted: boolean) => void;
+            /**
+             * Don't render an audio track if it would be silent.
+             * Default: true
+             */
+            readonly setEnforceAudioTrack: (enforceAudioTrack: boolean) => void;
+        };
+        /**
+         * @deprecated New flat config format: You can now replace `Config.Output.` with `Config.`
+         */
+        readonly Output: {
+            /**
+             * Set the output file location string. Default: `out/{composition}.{codec}`
+             */
+            readonly setOutputLocation: (newOutputLocation: string) => void;
+            /**
+             * If the video file already exists, should Remotion overwrite
+             * the output? Default: true
+             */
+            readonly setOverwriteOutput: (newOverwrite: boolean) => void;
+            /**
+             * Sets the pixel format in FFMPEG.
+             * See https://trac.ffmpeg.org/wiki/Chroma%20Subsampling for an explanation.
+             * You can override this using the `--pixel-format` Cli flag.
+             */
+            readonly setPixelFormat: (format: 'yuv420p' | 'yuva420p' | 'yuv422p' | 'yuv444p' | 'yuv420p10le' | 'yuv422p10le' | 'yuv444p10le' | 'yuva444p10le') => void;
+            /**
+             * @deprecated Use setCodec() and setImageSequence() instead.
+             * Specify what kind of output you, either `mp4` or `png-sequence`.
+             */
+            readonly setOutputFormat: (newLegacyFormat: 'mp4' | 'png-sequence') => void;
+            /**
+             * Specify the codec for stitching the frames into a video.
+             * Can be `h264` (default), `h265`, `vp8` or `vp9`
+             */
+            readonly setCodec: (newCodec: CodecOrUndefined) => void;
+            /**
+             * Set the Constant Rate Factor to pass to FFMPEG.
+             * Lower values mean better quality, but be aware that the ranges of
+             * possible values greatly differs between codecs.
+             */
+            readonly setCrf: (newCrf: Crf) => void;
+            /**
+             * Set to true if don't want a video but an image sequence as the output.
+             */
+            readonly setImageSequence: (newImageSequence: boolean) => void;
+            /**
+             * Overrides the height of a composition
+             */
+            readonly overrideHeight: (newHeight: number) => void;
+            /**
+             * Overrides the width of a composition
+             */
+            readonly overrideWidth: (newWidth: number) => void;
+            /**
+             * Set the ProRes profile.
+             * This method is only valid if the codec has been set to 'prores'.
+             * Possible values: 4444-xq, 4444, hq, standard, light, proxy. Default: 'hq'
+             * See https://avpres.net/FFmpeg/im_ProRes.html for meaning of possible values.
+             */
+            readonly setProResProfile: (profile: '4444-xq' | '4444' | 'hq' | 'standard' | 'light' | 'proxy' | undefined) => void;
+            /**
+             * Override the arguments that Remotion passes to FFMPEG.
+             * Consult https://remotion.dev/docs/renderer/render-media#ffmpegoverride before using this feature.
+             */
+            readonly overrideFfmpegCommand: (command: (info: {
+                type: 'pre-stitcher' | 'stitcher';
+                args: string[];
+            }) => string[]) => void;
+            /**
+             * Set a target audio bitrate to be passed to FFMPEG.
+             */
+            readonly setAudioBitrate: (bitrate: string | null) => void;
+            /**
+             * Set a target video bitrate to be passed to FFMPEG.
+             * Mutually exclusive with setCrf().
+             */
+            readonly setVideoBitrate: (bitrate: string | null) => void;
+        };
+    }
+}
+export declare type ConfigType = RemotionConfigObject & FlatConfig;
+export type { Concurrency };
 export declare const Config: ConfigType;
 export declare const enableLegacyRemotionConfig: () => void;

package/dist/index.d.ts

@@ -5,6 +5,7 @@ import type { ClipRegion } from './NativeLayers';
 declare global {
     interface Window {
         ready: boolean;
+        remotion_cancelledError: string | undefined;
         getStaticCompositions: () => TCompMetadata[];
         setBundleMode: (bundleMode: BundleState) => void;
         remotion_staticBase: string;
@@ -47,11 +48,12 @@ export declare type BundleState = {
 };
 export * from './AbsoluteFill';
 export * from './audio';
+export { cancelRender } from './cancel-render';
 export * from './Composition';
 export { SmallTCompMetadata, TAsset, TCompMetadata } from './CompositionManager';
 export { Config, ConfigType } from './config';
 export { getInputProps } from './config/input-props';
-export * from './delay-render';
+export { continueRender, delayRender } from './delay-render';
 export * from './easing';
 export * from './Folder';
 export * from './freeze';
@@ -87,3 +89,4 @@ export declare const Experimental: {
     Null: import("react").FC<{}>;
     useIsPlayer: () => boolean;
 };
+export declare type WebpackOverrideFn = "The 'WebpackOverrideFn' has been moved to '@remotion/bundler'. Update your imports and install '@remotion/bundler' if necessary.";

package/dist/index.js

@@ -14,7 +14,7 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
     for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.Experimental = exports.useCurrentFrame = exports.staticFile = exports.Series = exports.Sequence = exports.registerRoot = exports.random = exports.prefetch = exports.Loop = exports.interpolateColors = exports.getStaticFiles = exports.getInputProps = exports.Config = void 0;
+exports.Experimental = exports.useCurrentFrame = exports.staticFile = exports.Series = exports.Sequence = exports.registerRoot = exports.random = exports.prefetch = exports.Loop = exports.interpolateColors = exports.getStaticFiles = exports.delayRender = exports.continueRender = exports.getInputProps = exports.Config = exports.cancelRender = void 0;
 require("./asset-types");
 const Clipper_1 = require("./Clipper");
 const is_player_1 = require("./is-player");
@@ -23,12 +23,16 @@ const Null_1 = require("./Null");
 (0, multiple_versions_warning_1.checkMultipleRemotionVersions)();
 __exportStar(require("./AbsoluteFill"), exports);
 __exportStar(require("./audio"), exports);
+var cancel_render_1 = require("./cancel-render");
+Object.defineProperty(exports, "cancelRender", { enumerable: true, get: function () { return cancel_render_1.cancelRender; } });
 __exportStar(require("./Composition"), exports);
 var config_1 = require("./config");
 Object.defineProperty(exports, "Config", { enumerable: true, get: function () { return config_1.Config; } });
 var input_props_1 = require("./config/input-props");
 Object.defineProperty(exports, "getInputProps", { enumerable: true, get: function () { return input_props_1.getInputProps; } });
-__exportStar(require("./delay-render"), exports);
+var delay_render_1 = require("./delay-render");
+Object.defineProperty(exports, "continueRender", { enumerable: true, get: function () { return delay_render_1.continueRender; } });
+Object.defineProperty(exports, "delayRender", { enumerable: true, get: function () { return delay_render_1.delayRender; } });
 __exportStar(require("./easing"), exports);
 __exportStar(require("./Folder"), exports);
 __exportStar(require("./freeze"), exports);

package/dist/internals.d.ts

@@ -1,5 +1,4 @@
 /// <reference types="react" />
-import type { Configuration } from 'webpack';
 import type { CompProps } from './Composition';
 import type { CompositionManagerContext, TAsset, TCompMetadata, TComposition, TSequence } from './CompositionManager';
 import * as CSSUtils from './default-css';
@@ -96,6 +95,4 @@ export declare const Internals: {
     useIsPlayer: () => boolean;
     useRemotionEnvironment: () => RemotionEnvironment;
 };
-declare type WebpackConfiguration = Configuration;
-declare type WebpackOverrideFn = (currentConfiguration: WebpackConfiguration) => WebpackConfiguration;
-export type { TComposition, Timeline, TCompMetadata, TSequence, WebpackOverrideFn, WebpackConfiguration, TAsset, TimelineContextValue, SetTimelineContextValue, CompProps, CompositionManagerContext, MediaVolumeContextValue, SetMediaVolumeContextValue, RemotionEnvironment, };
+export type { TComposition, Timeline, TCompMetadata, TSequence, TAsset, TimelineContextValue, SetTimelineContextValue, CompProps, CompositionManagerContext, MediaVolumeContextValue, SetMediaVolumeContextValue, RemotionEnvironment, };

package/dist/version.d.ts

@@ -1 +1 @@
-export declare const VERSION = "3.3.43";
+export declare const VERSION = "3.3.45";

package/dist/version.js

@@ -2,4 +2,4 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.VERSION = void 0;
 // Automatically generated on publish
-exports.VERSION = '3.3.43';
+exports.VERSION = '3.3.45';

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "remotion",
-	"version": "3.3.43",
+	"version": "3.3.45",
 	"description": "Render videos in React",
 	"main": "dist/index.js",
 	"types": "dist/index.d.ts",
@@ -41,8 +41,7 @@
 		"react-test-renderer": "^18.0.0",
 		"rimraf": "^3.0.2",
 		"typescript": "^4.7.0",
-		"vitest": "0.24.3",
-		"webpack": "5.74.0"
+		"vitest": "0.24.3"
 	},
 	"keywords": [
 		"remotion",
@@ -65,5 +64,5 @@
 			]
 		}
 	},
-	"gitHead": "3585e437a30ba001e983539728eb1914172b729c"
+	"gitHead": "75c028236b43ff2fd0f3f3772f9f79cfde069e36"
 }