@remotion/bundler 4.0.136 → 4.0.138

package/dist/bundle.js

@@ -161,9 +161,9 @@ const internalBundle = async (actualArgs) => {
     if (errors !== undefined && errors.length > 0) {
         throw new Error(errors[0].message + '\n' + errors[0].details);
     }
-    const baseDir = (_g = actualArgs === null || actualArgs === void 0 ? void 0 : actualArgs.publicPath) !== null && _g !== void 0 ? _g : '/';
+    const publicPath = (_g = actualArgs === null || actualArgs === void 0 ? void 0 : actualArgs.publicPath) !== null && _g !== void 0 ? _g : '/';
     const staticHash = '/' +
-        [trimTrailingSlash(trimLeadingSlash(baseDir)), 'public']
+        [trimTrailingSlash(trimLeadingSlash(publicPath)), 'public']
             .filter(Boolean)
             .join('/');
     const from = (options === null || options === void 0 ? void 0 : options.publicDir)
@@ -195,7 +195,7 @@ const internalBundle = async (actualArgs) => {
     }
     const html = (0, index_html_1.indexHtml)({
         staticHash,
-        baseDir,
+        publicPath,
         editorName: null,
         inputProps: null,
         remotionRoot: resolvedRemotionRoot,
@@ -213,10 +213,10 @@ const internalBundle = async (actualArgs) => {
                 name: f.name.split(node_path_1.default.sep).join('/'),
             };
         }),
-        includeFavicon: false,
+        includeFavicon: true,
         title: 'Remotion Bundle',
         renderDefaults: undefined,
-        publicFolderExists: `${baseDir + (baseDir.endsWith('/') ? '' : '/')}public`,
+        publicFolderExists: `${publicPath + (publicPath.endsWith('/') ? '' : '/')}public`,
         gitSource: (_h = actualArgs.gitSource) !== null && _h !== void 0 ? _h : null,
         projectName: (0, studio_shared_1.getProjectName)({
             gitSource: (_j = actualArgs.gitSource) !== null && _j !== void 0 ? _j : null,

package/dist/case-sensitive-paths.d.ts

@@ -0,0 +1,20 @@
+import type { Compiler } from 'webpack';
+export declare class CaseSensitivePathsPlugin {
+    fs: Compiler['inputFileSystem'];
+    context: string;
+    cacheMap: Map<string, string[]>;
+    deferrerMap: Map<string, Promise<string[]>>;
+    /**
+     * Check if resource need to be checked
+     */
+    isCheckable(res: string, type?: string, issuer?: string): boolean;
+    /**
+     * Check if file exists with case sensitive
+     */
+    checkFileExistsWithCase(res: string): Promise<unknown>;
+    /**
+     * reset this plugin, wait for the next compilation
+     */
+    reset(): void;
+    apply(compiler: Compiler): void;
+}

package/dist/case-sensitive-paths.js

@@ -0,0 +1,143 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.CaseSensitivePathsPlugin = void 0;
+const path_1 = __importDefault(require("path"));
+// Inlined from https://github.com/umijs/case-sensitive-paths-webpack-plugin/blob/master/src/index.ts
+/**
+ * The MIT License (MIT)
+
+Copyright (c) 2022-present UmiJS Team
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in
+all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+THE SOFTWARE.
+ */
+const PLUGIN_NAME = 'CaseSensitive';
+class CaseSensitivePathsPlugin {
+    constructor() {
+        this.context = '';
+        this.cacheMap = new Map();
+        this.deferrerMap = new Map();
+    }
+    /**
+     * Check if resource need to be checked
+     */
+    isCheckable(res, type, issuer) {
+        return (
+        // skip base64 url in css files
+        type !== 'asset/inline' &&
+            // skip resources which outside project
+            res.startsWith(this.context) &&
+            // skip node_modules
+            !/(\/|\\)node_modules\1/.test(res) &&
+            // skip duplicated css resource by unknown reason
+            res !== issuer);
+    }
+    /**
+     * Check if file exists with case sensitive
+     */
+    checkFileExistsWithCase(res) {
+        return new Promise((resolve, reject) => {
+            let full = res;
+            let caseError = null;
+            const deferrers = [];
+            // check every level directories for resource, except outside project
+            while (full.length > this.context.length) {
+                const { dir, base: current } = path_1.default.parse(full);
+                let deferrer;
+                if (this.cacheMap.get(dir)) {
+                    // use cache first
+                    deferrer = Promise.resolve(this.cacheMap.get(dir));
+                }
+                else if (this.deferrerMap.get(dir)) {
+                    // wait another same directory to be resolved
+                    deferrer = this.deferrerMap.get(dir);
+                }
+                else {
+                    // read directory for the first time
+                    deferrer = new Promise((resolve2) => {
+                        this.fs.readdir(dir, (_, files = []) => {
+                            // save cache, resolve promise and release deferrer
+                            this.cacheMap.set(dir, files);
+                            resolve2(files);
+                            this.deferrerMap.delete(dir);
+                        });
+                    });
+                    // save deferrer for another called
+                    this.deferrerMap.set(dir, deferrer);
+                }
+                // check current file synchronously, for performance
+                deferrer.then((files) => {
+                    // try to find correct name
+                    // if current file not exists in current directory and there has no existing error
+                    if (!files.includes(current) && !caseError) {
+                        const correctName = files.find((file) => file.toLowerCase() === current.toLowerCase());
+                        // only throw first error for the single resource
+                        if (correctName) {
+                            caseError = new Error(`Capitalization mismatch in \`${path_1.default.join(res)}\`: \`${current}\` does not match the name on disk \`${correctName}\``);
+                            reject(caseError);
+                        }
+                    }
+                });
+                deferrers.push(deferrer);
+                // continue to check upper directory
+                full = dir;
+            }
+            Promise.all(deferrers).then(() => {
+                // resolve if no error
+                if (!caseError) {
+                    resolve(caseError);
+                }
+            });
+        });
+    }
+    /**
+     * reset this plugin, wait for the next compilation
+     */
+    reset() {
+        this.cacheMap = new Map();
+        this.deferrerMap = new Map();
+    }
+    apply(compiler) {
+        this.context = compiler.options.context || process.cwd();
+        this.fs = compiler.inputFileSystem;
+        compiler.hooks.normalModuleFactory.tap(PLUGIN_NAME, (factory) => {
+            factory.hooks.afterResolve.tapAsync(PLUGIN_NAME, (data, done) => {
+                var _a, _b;
+                // compatible with webpack 4.x
+                const { createData = data } = data;
+                if (createData.resource &&
+                    this.isCheckable(createData.resource, createData.type, (_b = (_a = createData.resourceResolveData) === null || _a === void 0 ? void 0 : _a.context) === null || _b === void 0 ? void 0 : _b.issuer)) {
+                    this.checkFileExistsWithCase(createData.resource
+                        .replace(/\?.+$/, '')
+                        // replace escaped \0# with # see: https://github.com/webpack/enhanced-resolve#escaping
+                        .replace('\u0000#', '#')).then(() => done(null), (err) => done(err));
+                }
+                else {
+                    done(null);
+                }
+            });
+        });
+        compiler.hooks.done.tap(PLUGIN_NAME, () => {
+            this.reset();
+        });
+    }
+}
+exports.CaseSensitivePathsPlugin = CaseSensitivePathsPlugin;

package/dist/copy-dir.d.ts

@@ -1,4 +1,5 @@
 /// <reference types="node" />
+/// <reference types="bun-types" />
 import fs from 'node:fs';
 export declare function copyDir({ src, dest, onSymlinkDetected, onProgress, copiedBytes, lastReportedProgress, }: {
     src: string;

package/dist/index-html.d.ts

@@ -1,8 +1,8 @@
 import type { GitSource, RenderDefaults } from '@remotion/studio';
 import type { StaticFile } from 'remotion';
-export declare const indexHtml: ({ baseDir, editorName, inputProps, envVariables, staticHash, remotionRoot, studioServerCommand, renderQueue, numberOfAudioTags, publicFiles, includeFavicon, title, renderDefaults, publicFolderExists, gitSource, projectName, }: {
+export declare const indexHtml: ({ publicPath, editorName, inputProps, envVariables, staticHash, remotionRoot, studioServerCommand, renderQueue, numberOfAudioTags, publicFiles, includeFavicon, title, renderDefaults, publicFolderExists, gitSource, projectName, }: {
     staticHash: string;
-    baseDir: string;
+    publicPath: string;
     editorName: string | null;
     inputProps: object | null;
     envVariables?: Record<string, string> | undefined;

package/dist/index-html.js

@@ -2,7 +2,7 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.indexHtml = void 0;
 const remotion_1 = require("remotion");
-const indexHtml = ({ baseDir, editorName, inputProps, envVariables, staticHash, remotionRoot, studioServerCommand, renderQueue, numberOfAudioTags, publicFiles, includeFavicon, title, renderDefaults, publicFolderExists, gitSource, projectName, }) => 
+const indexHtml = ({ publicPath, editorName, inputProps, envVariables, staticHash, remotionRoot, studioServerCommand, renderQueue, numberOfAudioTags, publicFiles, includeFavicon, title, renderDefaults, publicFolderExists, gitSource, projectName, }) => 
 // Must setup remotion_editorName and remotion.remotion_projectName before bundle.js is loaded
 `
 <!DOCTYPE html>
@@ -12,7 +12,7 @@ const indexHtml = ({ baseDir, editorName, inputProps, envVariables, staticHash,
 		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
 		<link rel="preconnect" href="https://fonts.gstatic.com" />
 		${includeFavicon
-    ? `<link id="__remotion_favicon" rel="icon" type="image/png" href="/remotion.png" />`
+    ? `<link id="__remotion_favicon" rel="icon" type="image/png" href="${publicPath}favicon.ico" />`
     : ''}
 		<title>${title}</title>
 	</head>
@@ -23,6 +23,7 @@ const indexHtml = ({ baseDir, editorName, inputProps, envVariables, staticHash,
     ? `<script>window.remotion_editorName = "${editorName}";</script>`
     : '<script>window.remotion_editorName = null;</script>'}
 		<script>window.remotion_projectName = ${JSON.stringify(projectName)};</script>
+		<script>window.remotion_publicPath = ${JSON.stringify(publicPath)};</script>
 		<script>window.remotion_renderDefaults = ${JSON.stringify(renderDefaults)};</script>
 		<script>window.remotion_cwd = ${JSON.stringify(remotionRoot)};</script>
 		<script>window.remotion_studioServerCommand = ${studioServerCommand ? JSON.stringify(studioServerCommand) : 'null'};</script>
@@ -51,7 +52,7 @@ const indexHtml = ({ baseDir, editorName, inputProps, envVariables, staticHash,
 		<div id="menuportal-5"></div>
 		<div id="remotion-error-overlay"></div>
 		<div id="server-disconnected-overlay"></div>
-		<script src="${baseDir}bundle.js"></script>
+		<script src="${publicPath}bundle.js"></script>
 	</body>
 </html>
 `.trim();

package/dist/index.d.ts

@@ -16,9 +16,9 @@ export declare const BundlerInternals: {
         remotionRoot: string;
         poll: number | null;
     }) => Promise<[string, webpack.Configuration]>;
-    indexHtml: ({ baseDir, editorName, inputProps, envVariables, staticHash, remotionRoot, studioServerCommand, renderQueue, numberOfAudioTags, publicFiles, includeFavicon, title, renderDefaults, publicFolderExists, gitSource, projectName, }: {
+    indexHtml: ({ publicPath, editorName, inputProps, envVariables, staticHash, remotionRoot, studioServerCommand, renderQueue, numberOfAudioTags, publicFiles, includeFavicon, title, renderDefaults, publicFolderExists, gitSource, projectName, }: {
         staticHash: string;
-        baseDir: string;
+        publicPath: string;
         editorName: string | null;
         inputProps: object | null;
         envVariables?: Record<string, string> | undefined;
@@ -66,6 +66,6 @@ export declare const BundlerInternals: {
     } & import("./bundle").MandatoryLegacyBundleOptions) => Promise<string>;
 };
 export type { GitSource } from '@remotion/studio';
-export { bundle, BundleOptions, LegacyBundleOptions, MandatoryLegacyBundleOptions, } from './bundle';
+export { BundleOptions, LegacyBundleOptions, MandatoryLegacyBundleOptions, bundle, } from './bundle';
 export { WebpackConfiguration, WebpackOverrideFn } from './webpack-config';
 export { webpack };

package/dist/webpack-config.js

@@ -35,6 +35,7 @@ const stringify_with_circular_references_1 = require("./stringify-with-circular-
 const webpack_cache_1 = require("./webpack-cache");
 const esbuild = require("esbuild");
 const no_react_1 = require("remotion/no-react");
+const case_sensitive_paths_1 = require("./case-sensitive-paths");
 const optional_dependencies_1 = require("./optional-dependencies");
 if (!(react_dom_1.default === null || react_dom_1.default === void 0 ? void 0 : react_dom_1.default.version)) {
     throw new Error('Could not find "react-dom" package. Did you install it?');
@@ -96,6 +97,7 @@ const webpackConfig = async ({ entry, userDefinedComponent, outDir, environment,
         plugins: environment === 'development'
             ? [
                 new fast_refresh_1.ReactFreshWebpackPlugin(),
+                new case_sensitive_paths_1.CaseSensitivePathsPlugin(),
                 new webpack_1.default.HotModuleReplacementPlugin(),
                 define,
                 new optional_dependencies_1.AllowOptionalDependenciesPlugin(),

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@remotion/bundler",
-  "version": "4.0.136",
+  "version": "4.0.138",
   "description": "Bundler for Remotion",
   "main": "dist/index.js",
   "sideEffects": false,
@@ -25,25 +25,25 @@
     "style-loader": "2.0.0",
     "source-map": "0.7.3",
     "webpack": "5.83.1",
-    "remotion": "4.0.136",
-    "@remotion/studio": "4.0.136",
-    "@remotion/studio-shared": "4.0.136"
+    "remotion": "4.0.138",
+    "@remotion/studio": "4.0.138",
+    "@remotion/studio-shared": "4.0.138"
   },
   "peerDependencies": {
     "react": ">=16.8.0",
     "react-dom": ">=16.8.0"
   },
   "devDependencies": {
-    "@jonny/eslint-config": "3.0.276",
+    "@jonny/eslint-config": "3.0.281",
     "@types/node": "18.14.6",
     "bun-types": "0.8.0",
     "@types/react": "18.2.48",
     "@types/react-dom": "18.2.18",
-    "eslint": "8.42.0",
+    "eslint": "8.56.0",
     "eslint-plugin-10x": "1.5.2",
     "eslint-plugin-react": "7.32.2",
     "eslint-plugin-react-hooks": "4.4.0",
-    "prettier": "3.1.1",
+    "prettier": "3.2.5",
     "prettier-plugin-organize-imports": "3.2.4",
     "react": "18.2.0",
     "react-dom": "18.2.0",

package/dist/bundle-mode.d.ts

@@ -1,3 +0,0 @@
-import type { BundleState } from 'remotion';
-export declare const setBundleMode: (state: BundleState) => void;
-export declare const getBundleMode: () => BundleState;

package/dist/bundle-mode.js

@@ -1,14 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.getBundleMode = exports.setBundleMode = void 0;
-let bundleMode = {
-    type: 'index',
-};
-const setBundleMode = (state) => {
-    bundleMode = state;
-};
-exports.setBundleMode = setBundleMode;
-const getBundleMode = () => {
-    return bundleMode;
-};
-exports.getBundleMode = getBundleMode;

package/dist/homepage/homepage.d.ts

@@ -1,2 +0,0 @@
-import React from 'react';
-export declare const Homepage: React.FC;

package/dist/homepage/homepage.js

@@ -1,108 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Homepage = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const bundle_mode_1 = require("../bundle-mode");
-const renderEntry_1 = require("../renderEntry");
-const container = {
-    width: 800,
-    margin: 'auto',
-    paddingLeft: 20,
-    paddingRight: 20,
-    fontFamily: 'sans-serif',
-    lineHeight: 1.5,
-};
-const pre = {
-    display: 'block',
-    backgroundColor: '#f7f7f7',
-    whiteSpace: 'nowrap',
-    padding: 16,
-    fontFamily: 'monospace',
-    borderRadius: 5,
-    fontSize: 15,
-    overflowX: 'auto',
-};
-const AvailableCompositions = () => {
-    const [state, setComps] = (0, react_1.useState)({
-        type: 'not-initialized',
-    });
-    (0, react_1.useEffect)(() => {
-        if ((0, bundle_mode_1.getBundleMode)().type !== 'evaluation') {
-            return;
-        }
-        let timeout = null;
-        const check = () => {
-            if (window.remotion_renderReady === true) {
-                setComps({ type: 'loading' });
-                setTimeout(() => {
-                    try {
-                        const newComps = window.remotion_getCompositionNames();
-                        setComps({ type: 'loaded', comps: newComps });
-                    }
-                    catch (err) {
-                        setComps({ type: 'error', error: err });
-                    }
-                }, 250);
-            }
-            else {
-                timeout = setTimeout(check, 250);
-            }
-        };
-        check();
-        return () => {
-            if (!timeout) {
-                return;
-            }
-            clearTimeout(timeout);
-        };
-    }, []);
-    const showComps = (0, react_1.useCallback)(() => {
-        (0, renderEntry_1.setBundleModeAndUpdate)({ type: 'evaluation' });
-    }, []);
-    if ((0, bundle_mode_1.getBundleMode)().type !== 'evaluation') {
-        return ((0, jsx_runtime_1.jsx)("button", { type: "button", onClick: showComps, children: "Click here to see a list of available compositions." }));
-    }
-    if (state.type === 'loading') {
-        return (0, jsx_runtime_1.jsx)("div", { children: state === null ? (0, jsx_runtime_1.jsx)("p", { children: "Loading compositions..." }) : null });
-    }
-    if (state.type === 'error') {
-        return (0, jsx_runtime_1.jsxs)("div", { children: ["Error loading compositions: ", state.error.stack] });
-    }
-    if (state.type === 'not-initialized') {
-        return (0, jsx_runtime_1.jsx)("div", { children: "Not initialized" });
-    }
-    return ((0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)("ul", { children: state === null
-                ? []
-                : state.comps.map((c) => {
-                    return (0, jsx_runtime_1.jsx)("li", { children: c }, c);
-                }) }) }));
-};
-const TestCORS = () => {
-    const [serveUrl, setServeUrl] = (0, react_1.useState)('');
-    const [result, setResult] = (0, react_1.useState)('');
-    const handleServeUrl = (0, react_1.useCallback)((e) => {
-        setServeUrl(e.target.value);
-    }, []);
-    const isCORSWorking = (0, react_1.useCallback)(async (e) => {
-        e.preventDefault();
-        try {
-            const response = await fetch(serveUrl, { mode: 'cors' });
-            if (response.ok) {
-                setResult(`CORS is enabled on this URL: ${serveUrl}`);
-            }
-            else {
-                setResult('URL does not support CORS - See DevTools console for more details');
-            }
-        }
-        catch (error) {
-            setResult('URL does not support CORS - See DevTools console for more details');
-        }
-    }, [serveUrl]);
-    return ((0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsxs)("p", { children: ["Quickly test if a URL is supported being loaded on origin", ' ', (0, jsx_runtime_1.jsx)("code", { children: window.location.origin }), ". Enter the URL of an asset below."] }), result ? (0, jsx_runtime_1.jsx)("p", { className: "result", children: result }) : null, (0, jsx_runtime_1.jsxs)("form", { onSubmit: isCORSWorking, children: [(0, jsx_runtime_1.jsx)("label", { htmlFor: "serveurl", children: (0, jsx_runtime_1.jsx)("input", { placeholder: "Enter URL", type: "text", name: "serveurl", value: serveUrl, onChange: handleServeUrl }) }), (0, jsx_runtime_1.jsx)("br", {}), (0, jsx_runtime_1.jsx)("button", { type: "submit", children: "Test CORS" })] })] }));
-};
-const Homepage = () => {
-    const url = window.location.origin + window.location.pathname;
-    return ((0, jsx_runtime_1.jsxs)("div", { style: container, children: [(0, jsx_runtime_1.jsx)("h1", { children: "Remotion Bundle" }), "This is a website which contains a bundled Remotion video. You can render videos based on this URL.", (0, jsx_runtime_1.jsx)("h2", { children: "Available compositions" }), (0, jsx_runtime_1.jsx)(AvailableCompositions, {}), (0, jsx_runtime_1.jsx)("h2", { children: "How to render" }), "Locally: ", (0, jsx_runtime_1.jsx)("br", {}), (0, jsx_runtime_1.jsx)("br", {}), (0, jsx_runtime_1.jsxs)("div", { style: pre, children: ["npx remotion render ", url, " ", '<comp-name> <output-location>'] }), (0, jsx_runtime_1.jsx)("br", {}), (0, jsx_runtime_1.jsx)("br", {}), "With Remotion Lambda: ", (0, jsx_runtime_1.jsx)("br", {}), (0, jsx_runtime_1.jsx)("br", {}), (0, jsx_runtime_1.jsxs)("div", { style: pre, children: ["npx remotion lambda render ", url, " ", '<comp-name>'] }), (0, jsx_runtime_1.jsx)("br", {}), (0, jsx_runtime_1.jsxs)("p", { children: ["You can also render still images, and use the Node.JS APIs", ' ', (0, jsx_runtime_1.jsx)("code", { children: "getCompositions()" }), ", ", (0, jsx_runtime_1.jsx)("code", { children: "renderMedia()" }), ",", ' ', (0, jsx_runtime_1.jsx)("code", { children: "renderMediaOnLambda()" }), ", ", (0, jsx_runtime_1.jsx)("code", { children: "renderStill()" }), " and", ' ', (0, jsx_runtime_1.jsx)("code", { children: "renderStillOnLambda()" }), " with this URL."] }), (0, jsx_runtime_1.jsxs)("p", { children: ["Visit", ' ', (0, jsx_runtime_1.jsx)("a", { href: "https://remotion.dev/docs", target: "_blank", children: "remotion.dev/docs" }), ' ', "to read the documentation."] }), (0, jsx_runtime_1.jsx)("h2", { children: "CORS testing tool" }), (0, jsx_runtime_1.jsx)(TestCORS, {}), (0, jsx_runtime_1.jsx)("br", {}), (0, jsx_runtime_1.jsx)("br", {}), (0, jsx_runtime_1.jsx)("br", {})] }));
-};
-exports.Homepage = Homepage;

package/dist/renderEntry.d.ts

@@ -1,2 +0,0 @@
-import type { BundleState } from 'remotion';
-export declare const setBundleModeAndUpdate: (state: BundleState) => void;

package/dist/renderEntry.js

@@ -1,274 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.setBundleModeAndUpdate = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-// In React 18, you should use createRoot() from "react-dom/client".
-// In React 18, you should use render from "react-dom".
-// We support both, but Webpack chooses both of them and normalizes them to "react-dom/client",
-// hence why we import the right thing all the time but need to differentiate here
-const client_1 = __importDefault(require("react-dom/client"));
-const remotion_1 = require("remotion");
-const no_react_1 = require("remotion/no-react");
-const bundle_mode_1 = require("./bundle-mode");
-const homepage_1 = require("./homepage/homepage");
-remotion_1.Internals.CSSUtils.injectCSS(remotion_1.Internals.CSSUtils.makeDefaultCSS(null, '#fff'));
-const getCanSerializeDefaultProps = (object) => {
-    try {
-        const str = JSON.stringify(object);
-        // 256MB is the theoretical limit, making it throw if over 90% of that is reached.
-        return str.length < 256 * 1024 * 1024 * 0.9;
-    }
-    catch (err) {
-        if (err.message.includes('Invalid string length')) {
-            return false;
-        }
-        throw err;
-    }
-};
-const GetVideo = ({ state }) => {
-    const video = remotion_1.Internals.useVideo();
-    const compositions = (0, react_1.useContext)(remotion_1.Internals.CompositionManager);
-    const portalContainer = (0, react_1.useRef)(null);
-    const [handle] = (0, react_1.useState)(() => (0, remotion_1.delayRender)('Wait for Composition' + JSON.stringify(state)));
-    (0, react_1.useEffect)(() => {
-        return () => (0, remotion_1.continueRender)(handle);
-    }, [handle]);
-    (0, react_1.useEffect)(() => {
-        if (state.type !== 'composition') {
-            return;
-        }
-        if (!video && compositions.compositions.length > 0) {
-            const foundComposition = compositions.compositions.find((c) => c.id === state.compositionName);
-            if (!foundComposition) {
-                throw new Error(`Found no composition with the name ${state.compositionName}. The following compositions were found instead: ${compositions.compositions
-                    .map((c) => c.id)
-                    .join(', ')}. All compositions must have their ID calculated deterministically and must be mounted at the same time.`);
-            }
-            if (foundComposition) {
-                compositions.setCanvasContent({
-                    type: 'composition',
-                    compositionId: foundComposition.id,
-                });
-            }
-            else {
-                compositions.setCanvasContent(null);
-            }
-            compositions.setCurrentCompositionMetadata({
-                props: no_react_1.NoReactInternals.deserializeJSONWithCustomFields(state.serializedResolvedPropsWithSchema),
-                durationInFrames: state.compositionDurationInFrames,
-                fps: state.compositionFps,
-                height: state.compositionHeight,
-                width: state.compositionWidth,
-                defaultCodec: state.compositionDefaultCodec,
-            });
-        }
-    }, [compositions, compositions.compositions, state, video]);
-    (0, react_1.useEffect)(() => {
-        if (state.type === 'evaluation') {
-            (0, remotion_1.continueRender)(handle);
-        }
-        else if (video) {
-            (0, remotion_1.continueRender)(handle);
-        }
-    }, [handle, state.type, video]);
-    (0, react_1.useEffect)(() => {
-        if (!video) {
-            return;
-        }
-        const { current } = portalContainer;
-        if (!current) {
-            throw new Error('portal did not render');
-        }
-        current.appendChild(remotion_1.Internals.portalNode());
-        return () => {
-            current.removeChild(remotion_1.Internals.portalNode());
-        };
-    }, [video]);
-    if (!video) {
-        return null;
-    }
-    return ((0, jsx_runtime_1.jsx)("div", { ref: portalContainer, id: "remotion-canvas", style: {
-            width: video.width,
-            height: video.height,
-            display: 'flex',
-            backgroundColor: 'transparent',
-        } }));
-};
-const videoContainer = document.getElementById('video-container');
-const explainerContainer = document.getElementById('explainer-container');
-let cleanupVideoContainer = () => {
-    videoContainer.innerHTML = '';
-};
-let cleanupExplainerContainer = () => {
-    explainerContainer.innerHTML = '';
-};
-const waitForRootHandle = (0, remotion_1.delayRender)('Loading root component - See https://remotion.dev/docs/troubleshooting/loading-root-component if you experience a timeout');
-const WaitForRoot = () => {
-    const [Root, setRoot] = (0, react_1.useState)(() => remotion_1.Internals.getRoot());
-    (0, react_1.useEffect)(() => {
-        if (Root) {
-            (0, remotion_1.continueRender)(waitForRootHandle);
-            return;
-        }
-        const cleanup = remotion_1.Internals.waitForRoot((NewRoot) => {
-            setRoot(() => NewRoot);
-        });
-        return () => cleanup();
-    }, [Root]);
-    if (Root === null) {
-        return null;
-    }
-    return (0, jsx_runtime_1.jsx)(Root, {});
-};
-const renderContent = () => {
-    const bundleMode = (0, bundle_mode_1.getBundleMode)();
-    if (bundleMode.type === 'composition' || bundleMode.type === 'evaluation') {
-        const markup = ((0, jsx_runtime_1.jsxs)(remotion_1.Internals.RemotionRoot, { numberOfAudioTags: 0, children: [(0, jsx_runtime_1.jsx)(WaitForRoot, {}), (0, jsx_runtime_1.jsx)(GetVideo, { state: bundleMode })] }));
-        if (client_1.default.createRoot) {
-            const root = client_1.default.createRoot(videoContainer);
-            root.render(markup);
-            cleanupVideoContainer = () => {
-                root.unmount();
-            };
-        }
-        else {
-            client_1.default.render(markup, videoContainer);
-            cleanupVideoContainer = () => {
-                client_1.default.unmountComponentAtNode(videoContainer);
-            };
-        }
-    }
-    else {
-        cleanupVideoContainer();
-        cleanupVideoContainer = () => {
-            videoContainer.innerHTML = '';
-        };
-    }
-    if (bundleMode.type === 'index' || bundleMode.type === 'evaluation') {
-        if (client_1.default.createRoot) {
-            const root = client_1.default.createRoot(explainerContainer);
-            root.render((0, jsx_runtime_1.jsx)(homepage_1.Homepage, {}));
-            cleanupExplainerContainer = () => {
-                root.unmount();
-            };
-        }
-        else {
-            const root = client_1.default;
-            root.render((0, jsx_runtime_1.jsx)(homepage_1.Homepage, {}), explainerContainer);
-            cleanupExplainerContainer = () => {
-                root.unmountComponentAtNode(explainerContainer);
-            };
-        }
-    }
-    else {
-        cleanupExplainerContainer();
-        cleanupExplainerContainer = () => {
-            explainerContainer.innerHTML = '';
-        };
-    }
-};
-renderContent();
-const setBundleModeAndUpdate = (state) => {
-    (0, bundle_mode_1.setBundleMode)(state);
-    renderContent();
-};
-exports.setBundleModeAndUpdate = setBundleModeAndUpdate;
-if (typeof window !== 'undefined') {
-    const getUnevaluatedComps = () => {
-        if (!remotion_1.Internals.getRoot()) {
-            throw new Error('registerRoot() was never called. 1. Make sure you specified the correct entrypoint for your bundle. 2. If your registerRoot() call is deferred, use the delayRender/continueRender pattern to tell Remotion to wait.');
-        }
-        if (!remotion_1.Internals.compositionsRef.current) {
-            throw new Error('Unexpectedly did not have a CompositionManager');
-        }
-        const compositions = remotion_1.Internals.compositionsRef.current.getCompositions();
-        const canSerializeDefaultProps = getCanSerializeDefaultProps(compositions);
-        if (!canSerializeDefaultProps) {
-            console.warn('defaultProps are too big to serialize - trying to find the problematic composition...');
-            for (const comp of compositions) {
-                if (!getCanSerializeDefaultProps(comp)) {
-                    throw new Error(`defaultProps too big - could not serialize - the defaultProps of composition with ID ${comp.id} - the object that was passed to defaultProps was too big. Learn how to mitigate this error by visiting https://remotion.dev/docs/troubleshooting/serialize-defaultprops`);
-                }
-            }
-            console.warn('Could not single out a problematic composition -  The composition list as a whole is too big to serialize.');
-            throw new Error('defaultProps too big - Could not serialize - an object that was passed to defaultProps was too big. Learn how to mitigate this error by visiting https://remotion.dev/docs/troubleshooting/serialize-defaultprops');
-        }
-        return compositions;
-    };
-    window.getStaticCompositions = () => {
-        var _a;
-        const compositions = getUnevaluatedComps();
-        const inputProps = typeof window === 'undefined' || (0, remotion_1.getRemotionEnvironment)().isPlayer
-            ? {}
-            : (_a = (0, remotion_1.getInputProps)()) !== null && _a !== void 0 ? _a : {};
-        return Promise.all(compositions.map(async (c) => {
-            const handle = (0, remotion_1.delayRender)(`Running calculateMetadata() for composition ${c.id}. If you didn't want to evaluate this composition, use "selectComposition()" instead of "getCompositions()"`);
-            const comp = remotion_1.Internals.resolveVideoConfig({
-                composition: c,
-                editorProps: {},
-                signal: new AbortController().signal,
-                inputProps,
-            });
-            const resolved = await Promise.resolve(comp);
-            (0, remotion_1.continueRender)(handle);
-            const { props, defaultProps, ...data } = resolved;
-            return {
-                ...data,
-                serializedResolvedPropsWithCustomSchema: no_react_1.NoReactInternals.serializeJSONWithDate({
-                    data: props,
-                    indent: undefined,
-                    staticBase: null,
-                }).serializedString,
-                serializedDefaultPropsWithCustomSchema: no_react_1.NoReactInternals.serializeJSONWithDate({
-                    data: defaultProps,
-                    indent: undefined,
-                    staticBase: null,
-                }).serializedString,
-            };
-        }));
-    };
-    window.remotion_getCompositionNames = () => {
-        return getUnevaluatedComps().map((c) => c.id);
-    };
-    window.remotion_calculateComposition = async (compId) => {
-        var _a;
-        const compositions = getUnevaluatedComps();
-        const selectedComp = compositions.find((c) => c.id === compId);
-        if (!selectedComp) {
-            throw new Error(`Could not find composition with ID ${compId}`);
-        }
-        const abortController = new AbortController();
-        const handle = (0, remotion_1.delayRender)(`Running the calculateMetadata() function for composition ${compId}`);
-        const inputProps = typeof window === 'undefined' || (0, remotion_1.getRemotionEnvironment)().isPlayer
-            ? {}
-            : (_a = (0, remotion_1.getInputProps)()) !== null && _a !== void 0 ? _a : {};
-        const prom = await Promise.resolve(remotion_1.Internals.resolveVideoConfig({
-            composition: selectedComp,
-            editorProps: {},
-            signal: abortController.signal,
-            inputProps,
-        }));
-        (0, remotion_1.continueRender)(handle);
-        const { props, defaultProps, ...data } = prom;
-        return {
-            ...data,
-            serializedResolvedPropsWithCustomSchema: no_react_1.NoReactInternals.serializeJSONWithDate({
-                data: props,
-                indent: undefined,
-                staticBase: null,
-            }).serializedString,
-            serializedDefaultPropsWithCustomSchema: no_react_1.NoReactInternals.serializeJSONWithDate({
-                data: defaultProps,
-                indent: undefined,
-                staticBase: null,
-            }).serializedString,
-        };
-    };
-    window.siteVersion = '10';
-    window.remotion_version = remotion_1.VERSION;
-    window.remotion_setBundleMode = exports.setBundleModeAndUpdate;
-}