@remotion/renderer 4.0.427 → 4.0.429

package/dist/esm/client.mjs

@@ -1761,23 +1761,54 @@ var experimentalClientSideRenderingOption = {
   id: cliFlag29
 };
 
+// src/options/experimental-visual-mode.tsx
+import { jsx as jsx27, Fragment as Fragment27 } from "react/jsx-runtime";
+var experimentalVisualModeEnabled = false;
+var cliFlag30 = "experimental-visual-mode";
+var experimentalVisualModeOption = {
+  name: "Experimental Visual Mode",
+  cliFlag: cliFlag30,
+  description: () => /* @__PURE__ */ jsx27(Fragment27, {
+    children: "Nothing here yet, but this is our playground for experiments."
+  }),
+  ssrName: null,
+  docLink: "https://www.remotion.dev/docs/config#setexperimentalvisualmode",
+  type: false,
+  getValue: ({ commandLine }) => {
+    if (commandLine[cliFlag30] !== null) {
+      return {
+        value: commandLine[cliFlag30],
+        source: "cli"
+      };
+    }
+    return {
+      value: experimentalVisualModeEnabled,
+      source: "config"
+    };
+  },
+  setConfig(value) {
+    experimentalVisualModeEnabled = value;
+  },
+  id: cliFlag30
+};
+
 // src/options/folder-expiry.tsx
-import { jsx as jsx27, jsxs as jsxs18, Fragment as Fragment27 } from "react/jsx-runtime";
+import { jsx as jsx28, jsxs as jsxs18, Fragment as Fragment28 } from "react/jsx-runtime";
 var enableFolderExpiry = null;
-var cliFlag30 = "enable-folder-expiry";
+var cliFlag31 = "enable-folder-expiry";
 var folderExpiryOption = {
   name: "Lambda render expiration",
-  cliFlag: cliFlag30,
+  cliFlag: cliFlag31,
   description: () => {
-    return /* @__PURE__ */ jsxs18(Fragment27, {
+    return /* @__PURE__ */ jsxs18(Fragment28, {
       children: [
         "When deploying sites, enable or disable S3 Lifecycle policies which allow for renders to auto-delete after a certain time. Default is",
         " ",
-        /* @__PURE__ */ jsx27("code", {
+        /* @__PURE__ */ jsx28("code", {
           children: "null"
         }),
         ", which does not change any lifecycle policies of the S3 bucket. See: ",
-        /* @__PURE__ */ jsx27("a", {
+        /* @__PURE__ */ jsx28("a", {
           href: "/docs/lambda/autodelete",
           children: "Lambda autodelete"
         }),
@@ -1789,10 +1820,10 @@ var folderExpiryOption = {
   docLink: "https://www.remotion.dev/docs/lambda/autodelete",
   type: false,
   getValue: ({ commandLine }) => {
-    if (commandLine[cliFlag30] !== undefined) {
+    if (commandLine[cliFlag31] !== undefined) {
       return {
         source: "cli",
-        value: commandLine[cliFlag30]
+        value: commandLine[cliFlag31]
       };
     }
     if (enableFolderExpiry !== null) {
@@ -1809,28 +1840,28 @@ var folderExpiryOption = {
   setConfig: (value) => {
     enableFolderExpiry = value;
   },
-  id: cliFlag30
+  id: cliFlag31
 };
 
 // src/options/for-seamless-aac-concatenation.tsx
-import { jsx as jsx28, jsxs as jsxs19, Fragment as Fragment28 } from "react/jsx-runtime";
+import { jsx as jsx29, jsxs as jsxs19, Fragment as Fragment29 } from "react/jsx-runtime";
 var DEFAULT3 = false;
 var forSeamlessAacConcatenation = DEFAULT3;
-var cliFlag31 = "for-seamless-aac-concatenation";
+var cliFlag32 = "for-seamless-aac-concatenation";
 var forSeamlessAacConcatenationOption = {
   name: "For seamless AAC concatenation",
-  cliFlag: cliFlag31,
-  description: () => /* @__PURE__ */ jsxs19(Fragment28, {
+  cliFlag: cliFlag32,
+  description: () => /* @__PURE__ */ jsxs19(Fragment29, {
     children: [
       "If enabled, the audio is trimmed to the nearest AAC frame, which is required for seamless concatenation of AAC files. This is a requirement if you later want to combine multiple video snippets seamlessly.",
-      /* @__PURE__ */ jsx28("br", {}),
-      /* @__PURE__ */ jsx28("br", {}),
+      /* @__PURE__ */ jsx29("br", {}),
+      /* @__PURE__ */ jsx29("br", {}),
       " This option is used internally. There is currently no documentation yet for to concatenate the audio chunks."
     ]
   }),
   docLink: "https://remotion.dev/docs/renderer",
   getValue: ({ commandLine }) => {
-    if (commandLine[cliFlag31]) {
+    if (commandLine[cliFlag32]) {
       return {
         source: "cli",
         value: true
@@ -1852,26 +1883,26 @@ var forSeamlessAacConcatenationOption = {
   },
   ssrName: "forSeamlessAacConcatenation",
   type: false,
-  id: cliFlag31
+  id: cliFlag32
 };
 
 // src/options/force-new-studio.tsx
-import { jsx as jsx29, Fragment as Fragment29 } from "react/jsx-runtime";
+import { jsx as jsx30, Fragment as Fragment30 } from "react/jsx-runtime";
 var forceNewEnabled = false;
-var cliFlag32 = "force-new";
+var cliFlag33 = "force-new";
 var forceNewStudioOption = {
   name: "Force New Studio",
-  cliFlag: cliFlag32,
-  description: () => /* @__PURE__ */ jsx29(Fragment29, {
+  cliFlag: cliFlag33,
+  description: () => /* @__PURE__ */ jsx30(Fragment30, {
     children: "Forces starting a new Studio instance even if one is already running on the same port for the same project."
   }),
   ssrName: null,
   docLink: "https://www.remotion.dev/docs/config#setforcenewstudioenabled",
   type: false,
   getValue: ({ commandLine }) => {
-    if (commandLine[cliFlag32] !== undefined) {
+    if (commandLine[cliFlag33] !== undefined) {
       return {
-        value: commandLine[cliFlag32],
+        value: commandLine[cliFlag33],
         source: "cli"
       };
     }
@@ -1883,7 +1914,7 @@ var forceNewStudioOption = {
   setConfig(value) {
     forceNewEnabled = value;
   },
-  id: cliFlag32
+  id: cliFlag33
 };
 
 // src/frame-range.ts
@@ -1944,8 +1975,8 @@ var validateFrameRange = (frameRange) => {
 };
 
 // src/options/frames.tsx
-import { jsx as jsx30, jsxs as jsxs20, Fragment as Fragment30 } from "react/jsx-runtime";
-var cliFlag33 = "frames";
+import { jsx as jsx31, jsxs as jsxs20, Fragment as Fragment31 } from "react/jsx-runtime";
+var cliFlag34 = "frames";
 var frameRange = null;
 var parseFrameRangeFromCli = (newFrameRange) => {
   if (typeof newFrameRange === "number") {
@@ -1993,16 +2024,16 @@ var parseFrameRangeFromCli = (newFrameRange) => {
 };
 var framesOption = {
   name: "Frame Range",
-  cliFlag: cliFlag33,
-  description: () => /* @__PURE__ */ jsxs20(Fragment30, {
+  cliFlag: cliFlag34,
+  description: () => /* @__PURE__ */ jsxs20(Fragment31, {
     children: [
       "Render a subset of a video. Pass a single number to render a still, or a range (e.g. ",
-      /* @__PURE__ */ jsx30("code", {
+      /* @__PURE__ */ jsx31("code", {
         children: "0-9"
       }),
       ") to render a subset of frames. Pass",
       " ",
-      /* @__PURE__ */ jsx30("code", {
+      /* @__PURE__ */ jsx31("code", {
         children: "100-"
       }),
       " to render from frame 100 to the end."
@@ -2012,8 +2043,8 @@ var framesOption = {
   docLink: "https://www.remotion.dev/docs/config#setframerange",
   type: null,
   getValue: ({ commandLine }) => {
-    if (commandLine[cliFlag33] !== undefined) {
-      const value = parseFrameRangeFromCli(commandLine[cliFlag33]);
+    if (commandLine[cliFlag34] !== undefined) {
+      const value = parseFrameRangeFromCli(commandLine[cliFlag34]);
       validateFrameRange(value);
       return {
         source: "cli",
@@ -2031,11 +2062,11 @@ var framesOption = {
     }
     frameRange = value;
   },
-  id: cliFlag33
+  id: cliFlag34
 };
 
 // src/options/gl.tsx
-import { jsx as jsx31, jsxs as jsxs21, Fragment as Fragment31 } from "react/jsx-runtime";
+import { jsx as jsx32, jsxs as jsxs21, Fragment as Fragment32 } from "react/jsx-runtime";
 var validOpenGlRenderers = [
   "swangle",
   "angle",
@@ -2050,7 +2081,7 @@ var AngleChangelog = () => {
   return /* @__PURE__ */ jsxs21("details", {
     style: { fontSize: "0.9em", marginBottom: "1em" },
     children: [
-      /* @__PURE__ */ jsx31("summary", {
+      /* @__PURE__ */ jsx32("summary", {
         children: "Changelog"
       }),
       /* @__PURE__ */ jsxs21("ul", {
@@ -2059,12 +2090,12 @@ var AngleChangelog = () => {
             children: [
               "From Remotion v2.6.7 until v3.0.7, the default for Remotion Lambda was",
               " ",
-              /* @__PURE__ */ jsx31("code", {
+              /* @__PURE__ */ jsx32("code", {
                 children: "swiftshader"
               }),
               ", but from v3.0.8 the default is",
               " ",
-              /* @__PURE__ */ jsx31("code", {
+              /* @__PURE__ */ jsx32("code", {
                 children: "swangle"
               }),
               " (Swiftshader on Angle) since Chrome 101 added support for it."
@@ -2073,7 +2104,7 @@ var AngleChangelog = () => {
           /* @__PURE__ */ jsxs21("li", {
             children: [
               "From Remotion v2.4.3 until v2.6.6, the default was ",
-              /* @__PURE__ */ jsx31("code", {
+              /* @__PURE__ */ jsx32("code", {
                 children: "angle"
               }),
               ", however it turns out to have a small memory leak that could crash long Remotion renders."
@@ -2084,53 +2115,53 @@ var AngleChangelog = () => {
     ]
   });
 };
-var cliFlag34 = "gl";
+var cliFlag35 = "gl";
 var glOption = {
-  cliFlag: cliFlag34,
+  cliFlag: cliFlag35,
   docLink: "https://www.remotion.dev/docs/chromium-flags#--gl",
   name: "OpenGL renderer",
   type: "angle",
   ssrName: "gl",
   description: () => {
-    return /* @__PURE__ */ jsxs21(Fragment31, {
+    return /* @__PURE__ */ jsxs21(Fragment32, {
       children: [
-        /* @__PURE__ */ jsx31(AngleChangelog, {}),
+        /* @__PURE__ */ jsx32(AngleChangelog, {}),
         /* @__PURE__ */ jsxs21("p", {
           children: [
             "Select the OpenGL renderer backend for Chromium. ",
-            /* @__PURE__ */ jsx31("br", {}),
+            /* @__PURE__ */ jsx32("br", {}),
             "Accepted values:"
           ]
         }),
         /* @__PURE__ */ jsxs21("ul", {
           children: [
-            /* @__PURE__ */ jsx31("li", {
-              children: /* @__PURE__ */ jsx31("code", {
+            /* @__PURE__ */ jsx32("li", {
+              children: /* @__PURE__ */ jsx32("code", {
                 children: '"angle"'
               })
             }),
-            /* @__PURE__ */ jsx31("li", {
-              children: /* @__PURE__ */ jsx31("code", {
+            /* @__PURE__ */ jsx32("li", {
+              children: /* @__PURE__ */ jsx32("code", {
                 children: '"egl"'
               })
             }),
-            /* @__PURE__ */ jsx31("li", {
-              children: /* @__PURE__ */ jsx31("code", {
+            /* @__PURE__ */ jsx32("li", {
+              children: /* @__PURE__ */ jsx32("code", {
                 children: '"swiftshader"'
               })
             }),
-            /* @__PURE__ */ jsx31("li", {
-              children: /* @__PURE__ */ jsx31("code", {
+            /* @__PURE__ */ jsx32("li", {
+              children: /* @__PURE__ */ jsx32("code", {
                 children: '"swangle"'
               })
             }),
             /* @__PURE__ */ jsxs21("li", {
               children: [
-                /* @__PURE__ */ jsx31("code", {
+                /* @__PURE__ */ jsx32("code", {
                   children: '"vulkan"'
                 }),
                 " (",
-                /* @__PURE__ */ jsx31("em", {
+                /* @__PURE__ */ jsx32("em", {
                   children: "from Remotion v4.0.41"
                 }),
                 ")"
@@ -2138,11 +2169,11 @@ var glOption = {
             }),
             /* @__PURE__ */ jsxs21("li", {
               children: [
-                /* @__PURE__ */ jsx31("code", {
+                /* @__PURE__ */ jsx32("code", {
                   children: '"angle-egl"'
                 }),
                 " (",
-                /* @__PURE__ */ jsx31("em", {
+                /* @__PURE__ */ jsx32("em", {
                   children: "from Remotion v4.0.51"
                 }),
                 ")"
@@ -2153,11 +2184,11 @@ var glOption = {
         /* @__PURE__ */ jsxs21("p", {
           children: [
             "The default is ",
-            /* @__PURE__ */ jsx31("code", {
+            /* @__PURE__ */ jsx32("code", {
               children: "null"
             }),
             ", letting Chrome decide, except on Lambda where the default is ",
-            /* @__PURE__ */ jsx31("code", {
+            /* @__PURE__ */ jsx32("code", {
               children: '"swangle"'
             })
           ]
@@ -2166,10 +2197,10 @@ var glOption = {
     });
   },
   getValue: ({ commandLine }) => {
-    if (commandLine[cliFlag34]) {
-      validateOpenGlRenderer(commandLine[cliFlag34]);
+    if (commandLine[cliFlag35]) {
+      validateOpenGlRenderer(commandLine[cliFlag35]);
       return {
-        value: commandLine[cliFlag34],
+        value: commandLine[cliFlag35],
         source: "cli"
       };
     }
@@ -2188,7 +2219,7 @@ var glOption = {
     validateOpenGlRenderer(value);
     openGlRenderer = value;
   },
-  id: cliFlag34
+  id: cliFlag35
 };
 var validateOpenGlRenderer = (option2) => {
   if (option2 === null) {
@@ -2206,11 +2237,11 @@ var hardwareAccelerationOptions = [
   "if-possible",
   "required"
 ];
-var cliFlag35 = "hardware-acceleration";
+var cliFlag36 = "hardware-acceleration";
 var currentValue = null;
 var hardwareAccelerationOption = {
   name: "Hardware Acceleration",
-  cliFlag: cliFlag35,
+  cliFlag: cliFlag36,
   description: () => `
 			One of
 			${new Intl.ListFormat("en", { type: "disjunction" }).format(hardwareAccelerationOptions.map((a) => JSON.stringify(a)))}
@@ -2222,10 +2253,10 @@ var hardwareAccelerationOption = {
   docLink: "https://www.remotion.dev/docs/encoding",
   type: "disable",
   getValue: ({ commandLine }) => {
-    if (commandLine[cliFlag35] !== undefined) {
-      const value = commandLine[cliFlag35];
+    if (commandLine[cliFlag36] !== undefined) {
+      const value = commandLine[cliFlag36];
       if (!hardwareAccelerationOptions.includes(value)) {
-        throw new Error(`Invalid value for --${cliFlag35}: ${value}`);
+        throw new Error(`Invalid value for --${cliFlag36}: ${value}`);
       }
       return {
         source: "cli",
@@ -2245,32 +2276,32 @@ var hardwareAccelerationOption = {
   },
   setConfig: (value) => {
     if (!hardwareAccelerationOptions.includes(value)) {
-      throw new Error(`Invalid value for --${cliFlag35}: ${value}`);
+      throw new Error(`Invalid value for --${cliFlag36}: ${value}`);
     }
     currentValue = value;
   },
-  id: cliFlag35
+  id: cliFlag36
 };
 
 // src/options/headless.tsx
-import { jsx as jsx32, jsxs as jsxs22, Fragment as Fragment32 } from "react/jsx-runtime";
+import { jsx as jsx33, jsxs as jsxs22, Fragment as Fragment33 } from "react/jsx-runtime";
 var DEFAULT4 = true;
 var headlessMode = DEFAULT4;
-var cliFlag36 = "disable-headless";
+var cliFlag37 = "disable-headless";
 var headlessOption = {
   name: "Disable Headless Mode",
-  cliFlag: cliFlag36,
-  description: () => /* @__PURE__ */ jsxs22(Fragment32, {
+  cliFlag: cliFlag37,
+  description: () => /* @__PURE__ */ jsxs22(Fragment33, {
     children: [
       "Deprecated - will be removed in 5.0.0. With the migration to",
       " ",
-      /* @__PURE__ */ jsx32("a", {
+      /* @__PURE__ */ jsx33("a", {
         href: "/docs/miscellaneous/chrome-headless-shell",
         children: "Chrome Headless Shell"
       }),
       ", this option is not functional anymore.",
-      /* @__PURE__ */ jsx32("br", {}),
-      /* @__PURE__ */ jsx32("br", {}),
+      /* @__PURE__ */ jsx33("br", {}),
+      /* @__PURE__ */ jsx33("br", {}),
       " If disabled, the render will open an actual Chrome window where you can see the render happen. The default is headless mode."
     ]
   }),
@@ -2278,10 +2309,10 @@ var headlessOption = {
   docLink: "https://www.remotion.dev/docs/chromium-flags#--disable-headless",
   type: false,
   getValue: ({ commandLine }) => {
-    if (commandLine[cliFlag36] !== undefined) {
+    if (commandLine[cliFlag37] !== undefined) {
       return {
         source: "cli",
-        value: !commandLine[cliFlag36]
+        value: !commandLine[cliFlag37]
       };
     }
     if (headlessMode !== DEFAULT4) {
@@ -2298,27 +2329,27 @@ var headlessOption = {
   setConfig: (value) => {
     headlessMode = value;
   },
-  id: cliFlag36
+  id: cliFlag37
 };
 
 // src/options/ignore-certificate-errors.tsx
-import { jsx as jsx33, Fragment as Fragment33 } from "react/jsx-runtime";
+import { jsx as jsx34, Fragment as Fragment34 } from "react/jsx-runtime";
 var ignoreCertificateErrors = false;
-var cliFlag37 = "ignore-certificate-errors";
+var cliFlag38 = "ignore-certificate-errors";
 var ignoreCertificateErrorsOption = {
   name: "Ignore certificate errors",
-  cliFlag: cliFlag37,
-  description: () => /* @__PURE__ */ jsx33(Fragment33, {
+  cliFlag: cliFlag38,
+  description: () => /* @__PURE__ */ jsx34(Fragment34, {
     children: "Results in invalid SSL certificates in Chrome, such as self-signed ones, being ignored."
   }),
   ssrName: "ignoreCertificateErrors",
   docLink: "https://www.remotion.dev/docs/chromium-flags#--ignore-certificate-errors",
   type: false,
   getValue: ({ commandLine }) => {
-    if (commandLine[cliFlag37] !== undefined) {
+    if (commandLine[cliFlag38] !== undefined) {
       return {
         source: "cli",
-        value: Boolean(commandLine[cliFlag37])
+        value: Boolean(commandLine[cliFlag38])
       };
     }
     if (ignoreCertificateErrors) {
@@ -2335,23 +2366,23 @@ var ignoreCertificateErrorsOption = {
   setConfig: (value) => {
     ignoreCertificateErrors = value;
   },
-  id: cliFlag37
+  id: cliFlag38
 };
 
 // src/options/image-sequence.tsx
-import { jsx as jsx34, jsxs as jsxs23, Fragment as Fragment34 } from "react/jsx-runtime";
-var cliFlag38 = "sequence";
+import { jsx as jsx35, jsxs as jsxs23, Fragment as Fragment35 } from "react/jsx-runtime";
+var cliFlag39 = "sequence";
 var imageSequence = false;
 var imageSequenceOption = {
   name: "Image Sequence",
-  cliFlag: cliFlag38,
-  description: () => /* @__PURE__ */ jsxs23(Fragment34, {
+  cliFlag: cliFlag39,
+  description: () => /* @__PURE__ */ jsxs23(Fragment35, {
     children: [
       "Pass this flag to output an image sequence instead of a video. The default image format is JPEG. See",
       " ",
-      /* @__PURE__ */ jsx34("a", {
+      /* @__PURE__ */ jsx35("a", {
         href: "/docs/config#setimagesequence",
-        children: /* @__PURE__ */ jsx34("code", {
+        children: /* @__PURE__ */ jsx35("code", {
           children: "setImageSequence()"
         })
       }),
@@ -2362,10 +2393,10 @@ var imageSequenceOption = {
   ssrName: null,
   docLink: "https://www.remotion.dev/docs/config#setimagesequence",
   getValue: ({ commandLine }) => {
-    if (commandLine[cliFlag38] !== undefined) {
+    if (commandLine[cliFlag39] !== undefined) {
       return {
         source: "cli",
-        value: Boolean(commandLine[cliFlag38])
+        value: Boolean(commandLine[cliFlag39])
       };
     }
     return {
@@ -2377,25 +2408,25 @@ var imageSequenceOption = {
     imageSequence = value;
   },
   type: false,
-  id: cliFlag38
+  id: cliFlag39
 };
 
 // src/options/image-sequence-pattern.tsx
-import { jsx as jsx35, jsxs as jsxs24, Fragment as Fragment35 } from "react/jsx-runtime";
-var cliFlag39 = "image-sequence-pattern";
+import { jsx as jsx36, jsxs as jsxs24, Fragment as Fragment36 } from "react/jsx-runtime";
+var cliFlag40 = "image-sequence-pattern";
 var currentImageSequencePattern = null;
 var imageSequencePatternOption = {
   name: "Image Sequence Pattern",
-  cliFlag: cliFlag39,
+  cliFlag: cliFlag40,
   ssrName: "imageSequencePattern",
-  description: () => /* @__PURE__ */ jsxs24(Fragment35, {
+  description: () => /* @__PURE__ */ jsxs24(Fragment36, {
     children: [
       "Pattern for naming image sequence files. Supports ",
-      /* @__PURE__ */ jsx35("code", {
+      /* @__PURE__ */ jsx36("code", {
         children: "[frame]"
       }),
       " for the zero-padded frame number and ",
-      /* @__PURE__ */ jsx35("code", {
+      /* @__PURE__ */ jsx36("code", {
         children: "[ext]"
       }),
       " for the file extension."
@@ -2411,33 +2442,33 @@ var imageSequencePatternOption = {
       };
     }
     return {
-      value: commandLine[cliFlag39],
+      value: commandLine[cliFlag40],
       source: "cli"
     };
   },
   setConfig: (pattern) => {
     currentImageSequencePattern = pattern;
   },
-  id: cliFlag39
+  id: cliFlag40
 };
 
 // src/options/ipv4.tsx
-import { jsx as jsx36, Fragment as Fragment36 } from "react/jsx-runtime";
+import { jsx as jsx37, Fragment as Fragment37 } from "react/jsx-runtime";
 var forceIPv4 = false;
-var cliFlag40 = "ipv4";
+var cliFlag41 = "ipv4";
 var ipv4Option = {
   name: "IPv4",
-  cliFlag: cliFlag40,
-  description: () => /* @__PURE__ */ jsx36(Fragment36, {
+  cliFlag: cliFlag41,
+  description: () => /* @__PURE__ */ jsx37(Fragment37, {
     children: "Forces Remotion to bind to an IPv4 interface for the Studio server."
   }),
   ssrName: null,
   docLink: "https://www.remotion.dev/docs/cli/studio",
   type: false,
   getValue: ({ commandLine }) => {
-    if (commandLine[cliFlag40] !== undefined) {
+    if (commandLine[cliFlag41] !== undefined) {
       return {
-        value: commandLine[cliFlag40],
+        value: commandLine[cliFlag41],
         source: "cli"
       };
     }
@@ -2449,25 +2480,25 @@ var ipv4Option = {
   setConfig(value) {
     forceIPv4 = value;
   },
-  id: cliFlag40
+  id: cliFlag41
 };
 
 // src/options/is-production.tsx
-import { jsx as jsx37, jsxs as jsxs25, Fragment as Fragment37 } from "react/jsx-runtime";
-var cliFlag41 = "is-production";
+import { jsx as jsx38, jsxs as jsxs25, Fragment as Fragment38 } from "react/jsx-runtime";
+var cliFlag42 = "is-production";
 var currentIsProductionKey = null;
 var isProductionOption = {
   name: "Is Production",
-  cliFlag: cliFlag41,
-  description: () => /* @__PURE__ */ jsxs25(Fragment37, {
+  cliFlag: cliFlag42,
+  description: () => /* @__PURE__ */ jsxs25(Fragment38, {
     children: [
       "Pass ",
-      /* @__PURE__ */ jsx37("code", {
+      /* @__PURE__ */ jsx38("code", {
         children: "false"
       }),
       " if this a development render to not count it as a billable render on remotion.pro. Only can be used in conjuction with",
       " ",
-      /* @__PURE__ */ jsx37("code", {
+      /* @__PURE__ */ jsx38("code", {
         children: "licenseKey"
       }),
       "."
@@ -2476,10 +2507,10 @@ var isProductionOption = {
   ssrName: "isProduction",
   docLink: "https://www.remotion.dev/docs/licensing",
   getValue: ({ commandLine }) => {
-    if (commandLine[cliFlag41] !== undefined) {
+    if (commandLine[cliFlag42] !== undefined) {
       return {
         source: "cli",
-        value: commandLine[cliFlag41]
+        value: commandLine[cliFlag42]
       };
     }
     if (currentIsProductionKey !== null) {
@@ -2497,11 +2528,11 @@ var isProductionOption = {
     currentIsProductionKey = value;
   },
   type: false,
-  id: cliFlag41
+  id: cliFlag42
 };
 
 // src/options/jpeg-quality.tsx
-import { jsx as jsx38, Fragment as Fragment38 } from "react/jsx-runtime";
+import { jsx as jsx39, Fragment as Fragment39 } from "react/jsx-runtime";
 var defaultValue = DEFAULT_JPEG_QUALITY;
 var quality = defaultValue;
 var setJpegQuality = (q) => {
@@ -2512,11 +2543,11 @@ var setJpegQuality = (q) => {
   }
   quality = q;
 };
-var cliFlag42 = "jpeg-quality";
+var cliFlag43 = "jpeg-quality";
 var jpegQualityOption = {
   name: "JPEG Quality",
-  cliFlag: cliFlag42,
-  description: () => /* @__PURE__ */ jsx38(Fragment38, {
+  cliFlag: cliFlag43,
+  description: () => /* @__PURE__ */ jsx39(Fragment39, {
     children: "Sets the quality of the generated JPEG images. Must be an integer between 0 and 100. Default: 80."
   }),
   ssrName: "jpegQuality",
@@ -2524,11 +2555,11 @@ var jpegQualityOption = {
   type: 0,
   setConfig: setJpegQuality,
   getValue: ({ commandLine }) => {
-    if (commandLine[cliFlag42] !== undefined) {
-      validateJpegQuality(commandLine[cliFlag42]);
+    if (commandLine[cliFlag43] !== undefined) {
+      validateJpegQuality(commandLine[cliFlag43]);
       return {
         source: "cli",
-        value: commandLine[cliFlag42]
+        value: commandLine[cliFlag43]
       };
     }
     if (quality !== defaultValue) {
@@ -2542,25 +2573,25 @@ var jpegQualityOption = {
       value: defaultValue
     };
   },
-  id: cliFlag42
+  id: cliFlag43
 };
 
 // src/options/keyboard-shortcuts.tsx
-import { jsx as jsx39, Fragment as Fragment39 } from "react/jsx-runtime";
+import { jsx as jsx40, Fragment as Fragment40 } from "react/jsx-runtime";
 var keyboardShortcutsEnabled = true;
-var cliFlag43 = "disable-keyboard-shortcuts";
+var cliFlag44 = "disable-keyboard-shortcuts";
 var keyboardShortcutsOption = {
   name: "Disable or Enable keyboard shortcuts",
-  cliFlag: cliFlag43,
-  description: () => /* @__PURE__ */ jsx39(Fragment39, {
+  cliFlag: cliFlag44,
+  description: () => /* @__PURE__ */ jsx40(Fragment40, {
     children: "Enable or disable keyboard shortcuts in the Remotion Studio."
   }),
   ssrName: null,
   docLink: "https://www.remotion.dev/docs/config#setkeyboardshortcutsenabled",
   type: false,
   getValue: ({ commandLine }) => {
-    if (commandLine[cliFlag43] !== undefined) {
-      keyboardShortcutsEnabled = commandLine[cliFlag43] === false;
+    if (commandLine[cliFlag44] !== undefined) {
+      keyboardShortcutsEnabled = commandLine[cliFlag44] === false;
       return {
         value: keyboardShortcutsEnabled,
         source: "cli"
@@ -2574,42 +2605,42 @@ var keyboardShortcutsOption = {
   setConfig(value) {
     keyboardShortcutsEnabled = value;
   },
-  id: cliFlag43
+  id: cliFlag44
 };
 
 // src/options/latency-hint.tsx
-import { jsx as jsx40, jsxs as jsxs26, Fragment as Fragment40 } from "react/jsx-runtime";
-var cliFlag44 = "audio-latency-hint";
+import { jsx as jsx41, jsxs as jsxs26, Fragment as Fragment41 } from "react/jsx-runtime";
+var cliFlag45 = "audio-latency-hint";
 var value = null;
 var audioLatencyHintOption = {
   name: "Audio Latency Hint",
-  cliFlag: cliFlag44,
-  description: () => /* @__PURE__ */ jsxs26(Fragment40, {
+  cliFlag: cliFlag45,
+  description: () => /* @__PURE__ */ jsxs26(Fragment41, {
     children: [
       "Sets the",
       " ",
-      /* @__PURE__ */ jsx40("a", {
+      /* @__PURE__ */ jsx41("a", {
         href: "https://developer.mozilla.org/en-US/docs/Web/API/AudioContext/AudioContext",
         children: "audio latency"
       }),
       " ",
       "hint for the global ",
-      /* @__PURE__ */ jsx40("code", {
+      /* @__PURE__ */ jsx41("code", {
         children: "AudioContext"
       }),
       " context that Remotion uses to play audio.",
-      /* @__PURE__ */ jsx40("br", {}),
+      /* @__PURE__ */ jsx41("br", {}),
       "Possible values: ",
-      /* @__PURE__ */ jsx40("code", {
+      /* @__PURE__ */ jsx41("code", {
         children: "interactive"
       }),
       ", ",
-      /* @__PURE__ */ jsx40("code", {
+      /* @__PURE__ */ jsx41("code", {
         children: "balanced"
       }),
       ",",
       " ",
-      /* @__PURE__ */ jsx40("code", {
+      /* @__PURE__ */ jsx41("code", {
         children: "playback"
       })
     ]
@@ -2618,7 +2649,7 @@ var audioLatencyHintOption = {
   docLink: "https://www.remotion.dev/docs/renderer/render-media",
   type: "interactive",
   getValue: ({ commandLine }) => {
-    const val = commandLine[cliFlag44];
+    const val = commandLine[cliFlag45];
     if (typeof val !== "undefined") {
       return { value: val, source: "cli" };
     }
@@ -2630,21 +2661,21 @@ var audioLatencyHintOption = {
   setConfig: (profile) => {
     value = profile;
   },
-  id: cliFlag44
+  id: cliFlag45
 };
 
 // src/options/license-key.tsx
-import { jsx as jsx41, jsxs as jsxs27, Fragment as Fragment41 } from "react/jsx-runtime";
+import { jsx as jsx42, jsxs as jsxs27, Fragment as Fragment42 } from "react/jsx-runtime";
 var currentLicenseKey = null;
-var cliFlag45 = "license-key";
+var cliFlag46 = "license-key";
 var licenseKeyOption = {
   name: "License key",
-  cliFlag: cliFlag45,
-  description: () => /* @__PURE__ */ jsxs27(Fragment41, {
+  cliFlag: cliFlag46,
+  description: () => /* @__PURE__ */ jsxs27(Fragment42, {
     children: [
       "License key for sending a usage event using",
       " ",
-      /* @__PURE__ */ jsx41("code", {
+      /* @__PURE__ */ jsx42("code", {
         children: "@remotion/licensing"
       }),
       "."
@@ -2654,10 +2685,10 @@ var licenseKeyOption = {
   docLink: "https://www.remotion.dev/docs/licensing",
   type: null,
   getValue: ({ commandLine }) => {
-    if (commandLine[cliFlag45] !== undefined) {
+    if (commandLine[cliFlag46] !== undefined) {
       return {
         source: "cli",
-        value: commandLine[cliFlag45]
+        value: commandLine[cliFlag46]
       };
     }
     return {
@@ -2668,47 +2699,47 @@ var licenseKeyOption = {
   setConfig: (value2) => {
     currentLicenseKey = value2;
   },
-  id: cliFlag45
+  id: cliFlag46
 };
 
 // src/options/log-level.tsx
-import { jsx as jsx42, jsxs as jsxs28, Fragment as Fragment42 } from "react/jsx-runtime";
+import { jsx as jsx43, jsxs as jsxs28, Fragment as Fragment43 } from "react/jsx-runtime";
 var logLevel = "info";
-var cliFlag46 = "log";
+var cliFlag47 = "log";
 var logLevelOption = {
-  cliFlag: cliFlag46,
+  cliFlag: cliFlag47,
   name: "Log Level",
   ssrName: "logLevel",
-  description: () => /* @__PURE__ */ jsxs28(Fragment42, {
+  description: () => /* @__PURE__ */ jsxs28(Fragment43, {
     children: [
       "One of ",
-      /* @__PURE__ */ jsx42("code", {
+      /* @__PURE__ */ jsx43("code", {
         children: "trace"
       }),
       ", ",
-      /* @__PURE__ */ jsx42("code", {
+      /* @__PURE__ */ jsx43("code", {
         children: "verbose"
       }),
       ", ",
-      /* @__PURE__ */ jsx42("code", {
+      /* @__PURE__ */ jsx43("code", {
         children: "info"
       }),
       ",",
       " ",
-      /* @__PURE__ */ jsx42("code", {
+      /* @__PURE__ */ jsx43("code", {
         children: "warn"
       }),
       ", ",
-      /* @__PURE__ */ jsx42("code", {
+      /* @__PURE__ */ jsx43("code", {
         children: "error"
       }),
       ".",
-      /* @__PURE__ */ jsx42("br", {}),
+      /* @__PURE__ */ jsx43("br", {}),
       " Determines how much info is being logged to the console.",
-      /* @__PURE__ */ jsx42("br", {}),
-      /* @__PURE__ */ jsx42("br", {}),
+      /* @__PURE__ */ jsx43("br", {}),
+      /* @__PURE__ */ jsx43("br", {}),
       " Default ",
-      /* @__PURE__ */ jsx42("code", {
+      /* @__PURE__ */ jsx43("code", {
         children: "info"
       }),
       "."
@@ -2716,11 +2747,11 @@ var logLevelOption = {
   }),
   docLink: "https://www.remotion.dev/docs/troubleshooting/debug-failed-render",
   getValue: ({ commandLine }) => {
-    if (commandLine[cliFlag46]) {
-      if (!isValidLogLevel(commandLine[cliFlag46])) {
+    if (commandLine[cliFlag47]) {
+      if (!isValidLogLevel(commandLine[cliFlag47])) {
         throw new Error(`Invalid \`--log\` value passed. Accepted values: ${logLevels.map((l) => `'${l}'`).join(", ")}.`);
       }
-      return { value: commandLine[cliFlag46], source: "cli" };
+      return { value: commandLine[cliFlag47], source: "cli" };
     }
     if (logLevel !== "info") {
       return { value: logLevel, source: "config" };
@@ -2731,23 +2762,23 @@ var logLevelOption = {
     logLevel = newLogLevel;
   },
   type: "error",
-  id: cliFlag46
+  id: cliFlag47
 };
 
 // src/options/metadata.tsx
-import { jsx as jsx43, jsxs as jsxs29, Fragment as Fragment43 } from "react/jsx-runtime";
+import { jsx as jsx44, jsxs as jsxs29, Fragment as Fragment44 } from "react/jsx-runtime";
 var metadata = {};
-var cliFlag47 = "metadata";
+var cliFlag48 = "metadata";
 var metadataOption = {
   name: "Metadata",
-  cliFlag: cliFlag47,
+  cliFlag: cliFlag48,
   description: (mode) => {
     if (mode === "ssr") {
-      return /* @__PURE__ */ jsxs29(Fragment43, {
+      return /* @__PURE__ */ jsxs29(Fragment44, {
         children: [
           "An object containing metadata to be embedded in the video. See",
           " ",
-          /* @__PURE__ */ jsx43("a", {
+          /* @__PURE__ */ jsx44("a", {
             href: "/docs/metadata",
             children: "here"
           }),
@@ -2755,18 +2786,18 @@ var metadataOption = {
         ]
       });
     }
-    return /* @__PURE__ */ jsxs29(Fragment43, {
+    return /* @__PURE__ */ jsxs29(Fragment44, {
       children: [
         "Metadata to be embedded in the video. See",
         " ",
-        /* @__PURE__ */ jsx43("a", {
+        /* @__PURE__ */ jsx44("a", {
           href: "/docs/metadata",
           children: "here"
         }),
         " for which metadata is accepted.",
-        /* @__PURE__ */ jsx43("br", {}),
+        /* @__PURE__ */ jsx44("br", {}),
         "The parameter must be in the format of ",
-        /* @__PURE__ */ jsx43("code", {
+        /* @__PURE__ */ jsx44("code", {
           children: "--metadata key=value"
         }),
         " ",
@@ -2777,8 +2808,8 @@ var metadataOption = {
   docLink: "https://www.remotion.dev/docs/metadata",
   type: {},
   getValue: ({ commandLine }) => {
-    if (commandLine[cliFlag47] !== undefined) {
-      const val = commandLine[cliFlag47];
+    if (commandLine[cliFlag48] !== undefined) {
+      const val = commandLine[cliFlag48];
       const array = typeof val === "string" ? [val] : val;
       const keyValues = array.map((a) => {
         if (!a.includes("=")) {
@@ -2805,28 +2836,28 @@ var metadataOption = {
     metadata = newMetadata;
   },
   ssrName: "metadata",
-  id: cliFlag47
+  id: cliFlag48
 };
 
 // src/options/mute.tsx
-import { jsx as jsx44, Fragment as Fragment44 } from "react/jsx-runtime";
+import { jsx as jsx45, Fragment as Fragment45 } from "react/jsx-runtime";
 var DEFAULT_MUTED_STATE = false;
 var mutedState = DEFAULT_MUTED_STATE;
-var cliFlag48 = "muted";
+var cliFlag49 = "muted";
 var mutedOption = {
   name: "Muted",
-  cliFlag: cliFlag48,
-  description: () => /* @__PURE__ */ jsx44(Fragment44, {
+  cliFlag: cliFlag49,
+  description: () => /* @__PURE__ */ jsx45(Fragment45, {
     children: "The Audio of the video will be omitted."
   }),
   ssrName: "muted",
   docLink: "https://www.remotion.dev/docs/audio/muting",
   type: false,
   getValue: ({ commandLine }) => {
-    if (commandLine[cliFlag48] !== null) {
+    if (commandLine[cliFlag49] !== null) {
       return {
         source: "cli",
-        value: commandLine[cliFlag48]
+        value: commandLine[cliFlag49]
       };
     }
     if (mutedState !== DEFAULT_MUTED_STATE) {
@@ -2843,17 +2874,17 @@ var mutedOption = {
   setConfig: () => {
     mutedState = true;
   },
-  id: cliFlag48
+  id: cliFlag49
 };
 
 // src/options/no-open.tsx
-import { jsx as jsx45, Fragment as Fragment45 } from "react/jsx-runtime";
+import { jsx as jsx46, Fragment as Fragment46 } from "react/jsx-runtime";
 var shouldOpenBrowser = true;
-var cliFlag49 = "no-open";
+var cliFlag50 = "no-open";
 var noOpenOption = {
   name: "Disable browser auto-open",
-  cliFlag: cliFlag49,
-  description: () => /* @__PURE__ */ jsx45(Fragment45, {
+  cliFlag: cliFlag50,
+  description: () => /* @__PURE__ */ jsx46(Fragment46, {
     children: "If specified, Remotion will not open a browser window when starting the Studio."
   }),
   ssrName: null,
@@ -2872,30 +2903,30 @@ var noOpenOption = {
   setConfig: (shouldOpen) => {
     shouldOpenBrowser = shouldOpen;
   },
-  id: cliFlag49
+  id: cliFlag50
 };
 
 // src/options/number-of-gif-loops.tsx
-import { jsx as jsx46, jsxs as jsxs30, Fragment as Fragment46 } from "react/jsx-runtime";
+import { jsx as jsx47, jsxs as jsxs30, Fragment as Fragment47 } from "react/jsx-runtime";
 var currentLoop = null;
 var validate = (newLoop) => {
   if (newLoop !== null && typeof newLoop !== "number") {
     throw new Error("--number-of-gif-loops flag must be a number.");
   }
 };
-var cliFlag50 = "number-of-gif-loops";
+var cliFlag51 = "number-of-gif-loops";
 var numberOfGifLoopsOption = {
   name: "Number of GIF loops",
-  cliFlag: cliFlag50,
+  cliFlag: cliFlag51,
   description: () => {
-    return /* @__PURE__ */ jsxs30(Fragment46, {
+    return /* @__PURE__ */ jsxs30(Fragment47, {
       children: [
         "Allows you to set the number of loops as follows:",
         /* @__PURE__ */ jsxs30("ul", {
           children: [
             /* @__PURE__ */ jsxs30("li", {
               children: [
-                /* @__PURE__ */ jsx46("code", {
+                /* @__PURE__ */ jsx47("code", {
                   children: "null"
                 }),
                 " (or omitting in the CLI) plays the GIF indefinitely."
@@ -2903,7 +2934,7 @@ var numberOfGifLoopsOption = {
             }),
             /* @__PURE__ */ jsxs30("li", {
               children: [
-                /* @__PURE__ */ jsx46("code", {
+                /* @__PURE__ */ jsx47("code", {
                   children: "0"
                 }),
                 " disables looping"
@@ -2911,7 +2942,7 @@ var numberOfGifLoopsOption = {
             }),
             /* @__PURE__ */ jsxs30("li", {
               children: [
-                /* @__PURE__ */ jsx46("code", {
+                /* @__PURE__ */ jsx47("code", {
                   children: "1"
                 }),
                 " loops the GIF once (plays twice in total)"
@@ -2919,7 +2950,7 @@ var numberOfGifLoopsOption = {
             }),
             /* @__PURE__ */ jsxs30("li", {
               children: [
-                /* @__PURE__ */ jsx46("code", {
+                /* @__PURE__ */ jsx47("code", {
                   children: "2"
                 }),
                 " loops the GIF twice (plays three times in total) and so on."
@@ -2934,10 +2965,10 @@ var numberOfGifLoopsOption = {
   docLink: "https://www.remotion.dev/docs/render-as-gif#changing-the-number-of-loops",
   type: 0,
   getValue: ({ commandLine }) => {
-    if (commandLine[cliFlag50] !== undefined) {
-      validate(commandLine[cliFlag50]);
+    if (commandLine[cliFlag51] !== undefined) {
+      validate(commandLine[cliFlag51]);
       return {
-        value: commandLine[cliFlag50],
+        value: commandLine[cliFlag51],
         source: "cli"
       };
     }
@@ -2956,21 +2987,21 @@ var numberOfGifLoopsOption = {
     validate(newLoop);
     currentLoop = newLoop;
   },
-  id: cliFlag50
+  id: cliFlag51
 };
 
 // src/options/number-of-shared-audio-tags.tsx
-import { jsx as jsx47, jsxs as jsxs31, Fragment as Fragment47 } from "react/jsx-runtime";
+import { jsx as jsx48, jsxs as jsxs31, Fragment as Fragment48 } from "react/jsx-runtime";
 var numberOfSharedAudioTags = 0;
-var cliFlag51 = "number-of-shared-audio-tags";
+var cliFlag52 = "number-of-shared-audio-tags";
 var numberOfSharedAudioTagsOption = {
   name: "Number of shared audio tags",
-  cliFlag: cliFlag51,
-  description: () => /* @__PURE__ */ jsxs31(Fragment47, {
+  cliFlag: cliFlag52,
+  description: () => /* @__PURE__ */ jsxs31(Fragment48, {
     children: [
       "Set number of shared audio tags. See",
       " ",
-      /* @__PURE__ */ jsx47("a", {
+      /* @__PURE__ */ jsx48("a", {
         href: "https://www.remotion.dev/docs/player/autoplay#using-the-numberofsharedaudiotags-prop",
         children: "Using the numberOfSharedAudioTags prop"
       }),
@@ -2982,9 +3013,9 @@ var numberOfSharedAudioTagsOption = {
   docLink: "https://www.remotion.dev/docs/config#setnumberofsharedaudiotags",
   type: 0,
   getValue: ({ commandLine }) => {
-    if (commandLine[cliFlag51] !== undefined) {
+    if (commandLine[cliFlag52] !== undefined) {
       return {
-        value: commandLine[cliFlag51],
+        value: commandLine[cliFlag52],
         source: "cli"
       };
     }
@@ -2996,39 +3027,39 @@ var numberOfSharedAudioTagsOption = {
   setConfig(value2) {
     numberOfSharedAudioTags = value2;
   },
-  id: cliFlag51
+  id: cliFlag52
 };
 
 // src/options/offthreadvideo-cache-size.tsx
-import { jsx as jsx48, jsxs as jsxs32, Fragment as Fragment48 } from "react/jsx-runtime";
+import { jsx as jsx49, jsxs as jsxs32, Fragment as Fragment49 } from "react/jsx-runtime";
 var offthreadVideoCacheSizeInBytes = null;
-var cliFlag52 = "offthreadvideo-cache-size-in-bytes";
+var cliFlag53 = "offthreadvideo-cache-size-in-bytes";
 var offthreadVideoCacheSizeInBytesOption = {
   name: "OffthreadVideo cache size",
-  cliFlag: cliFlag52,
-  description: () => /* @__PURE__ */ jsxs32(Fragment48, {
+  cliFlag: cliFlag53,
+  description: () => /* @__PURE__ */ jsxs32(Fragment49, {
     children: [
       "From v4.0, Remotion has a cache for",
       " ",
-      /* @__PURE__ */ jsx48("a", {
+      /* @__PURE__ */ jsx49("a", {
         href: "https://remotion.dev/docs/offthreadvideo",
-        children: /* @__PURE__ */ jsx48("code", {
+        children: /* @__PURE__ */ jsx49("code", {
           children: "<OffthreadVideo>"
         })
       }),
       " ",
       "frames. The default is ",
-      /* @__PURE__ */ jsx48("code", {
+      /* @__PURE__ */ jsx49("code", {
         children: "null"
       }),
       ", corresponding to half of the system memory available when the render starts.",
-      /* @__PURE__ */ jsx48("br", {}),
+      /* @__PURE__ */ jsx49("br", {}),
       " This option allows to override the size of the cache. The higher it is, the faster the render will be, but the more memory will be used.",
-      /* @__PURE__ */ jsx48("br", {}),
+      /* @__PURE__ */ jsx49("br", {}),
       "The used value will be printed when running in verbose mode.",
-      /* @__PURE__ */ jsx48("br", {}),
+      /* @__PURE__ */ jsx49("br", {}),
       "Default: ",
-      /* @__PURE__ */ jsx48("code", {
+      /* @__PURE__ */ jsx49("code", {
         children: "null"
       })
     ]
@@ -3037,10 +3068,10 @@ var offthreadVideoCacheSizeInBytesOption = {
   docLink: "https://www.remotion.dev/docs/offthreadvideo",
   type: 0,
   getValue: ({ commandLine }) => {
-    if (commandLine[cliFlag52] !== undefined) {
+    if (commandLine[cliFlag53] !== undefined) {
       return {
         source: "cli",
-        value: commandLine[cliFlag52]
+        value: commandLine[cliFlag53]
       };
     }
     if (offthreadVideoCacheSizeInBytes !== null) {
@@ -3057,22 +3088,22 @@ var offthreadVideoCacheSizeInBytesOption = {
   setConfig: (size) => {
     offthreadVideoCacheSizeInBytes = size ?? null;
   },
-  id: cliFlag52
+  id: cliFlag53
 };
 
 // src/options/offthreadvideo-threads.tsx
-import { jsx as jsx49, jsxs as jsxs33, Fragment as Fragment49 } from "react/jsx-runtime";
+import { jsx as jsx50, jsxs as jsxs33, Fragment as Fragment50 } from "react/jsx-runtime";
 var value2 = null;
-var cliFlag53 = "offthreadvideo-video-threads";
+var cliFlag54 = "offthreadvideo-video-threads";
 var offthreadVideoThreadsOption = {
   name: "OffthreadVideo threads",
-  cliFlag: cliFlag53,
-  description: () => /* @__PURE__ */ jsxs33(Fragment49, {
+  cliFlag: cliFlag54,
+  description: () => /* @__PURE__ */ jsxs33(Fragment50, {
     children: [
       "The number of threads that",
-      /* @__PURE__ */ jsx49("a", {
+      /* @__PURE__ */ jsx50("a", {
         href: "https://remotion.dev/docs/offthreadvideo",
-        children: /* @__PURE__ */ jsx49("code", {
+        children: /* @__PURE__ */ jsx50("code", {
           children: "<OffthreadVideo>"
         })
       }),
@@ -3087,10 +3118,10 @@ var offthreadVideoThreadsOption = {
   docLink: "https://www.remotion.dev/docs/offthreadvideo",
   type: 0,
   getValue: ({ commandLine }) => {
-    if (commandLine[cliFlag53] !== undefined) {
+    if (commandLine[cliFlag54] !== undefined) {
       return {
         source: "cli",
-        value: commandLine[cliFlag53]
+        value: commandLine[cliFlag54]
       };
     }
     if (value2 !== null) {
@@ -3107,21 +3138,21 @@ var offthreadVideoThreadsOption = {
   setConfig: (size) => {
     value2 = size ?? null;
   },
-  id: cliFlag53
+  id: cliFlag54
 };
 var DEFAULT_RENDER_FRAMES_OFFTHREAD_VIDEO_THREADS = 2;
 
 // src/options/on-browser-download.tsx
-import { jsx as jsx50, jsxs as jsxs34, Fragment as Fragment50 } from "react/jsx-runtime";
-var cliFlag54 = "on-browser-download";
+import { jsx as jsx51, jsxs as jsxs34, Fragment as Fragment51 } from "react/jsx-runtime";
+var cliFlag55 = "on-browser-download";
 var onBrowserDownloadOption = {
   name: "Browser download callback function",
-  cliFlag: cliFlag54,
-  description: () => /* @__PURE__ */ jsxs34(Fragment50, {
+  cliFlag: cliFlag55,
+  description: () => /* @__PURE__ */ jsxs34(Fragment51, {
     children: [
       "Gets called when no compatible local browser is detected on the system and this API needs to download a browser. Return a callback to observe progress.",
       " ",
-      /* @__PURE__ */ jsx50("a", {
+      /* @__PURE__ */ jsx51("a", {
         href: "/docs/renderer/ensure-browser#onbrowserdownload",
         children: "See here for how to use this option."
       })
@@ -3136,26 +3167,26 @@ var onBrowserDownloadOption = {
   setConfig: () => {
     throw new Error("does not support config file");
   },
-  id: cliFlag54
+  id: cliFlag55
 };
 
 // src/options/out-dir.tsx
-import { jsx as jsx51, jsxs as jsxs35, Fragment as Fragment51 } from "react/jsx-runtime";
-var cliFlag55 = "out-dir";
+import { jsx as jsx52, jsxs as jsxs35, Fragment as Fragment52 } from "react/jsx-runtime";
+var cliFlag56 = "out-dir";
 var currentOutDir = null;
 var outDirOption = {
   name: "Output Directory",
-  cliFlag: cliFlag55,
+  cliFlag: cliFlag56,
   description: () => {
-    return /* @__PURE__ */ jsxs35(Fragment51, {
+    return /* @__PURE__ */ jsxs35(Fragment52, {
       children: [
         "Define the location of the resulting bundle. By default it is a folder called ",
-        /* @__PURE__ */ jsx51("code", {
+        /* @__PURE__ */ jsx52("code", {
           children: "build"
         }),
         ", adjacent to the",
         " ",
-        /* @__PURE__ */ jsx51("a", {
+        /* @__PURE__ */ jsx52("a", {
           href: "/docs/terminology/remotion-root",
           children: "Remotion Root"
         }),
@@ -3166,10 +3197,10 @@ var outDirOption = {
   ssrName: "outDir",
   docLink: "https://www.remotion.dev/docs/cli/bundle#--out-dir",
   getValue: ({ commandLine }) => {
-    if (commandLine[cliFlag55] !== undefined) {
+    if (commandLine[cliFlag56] !== undefined) {
       return {
         source: "cli",
-        value: commandLine[cliFlag55]
+        value: commandLine[cliFlag56]
       };
     }
     if (currentOutDir !== null) {
@@ -3187,7 +3218,7 @@ var outDirOption = {
     currentOutDir = value3;
   },
   type: "",
-  id: cliFlag55
+  id: cliFlag56
 };
 
 // src/validate.ts
@@ -3197,21 +3228,21 @@ var validateDimension = NoReactInternals2.validateDimension;
 var validateDurationInFrames = NoReactInternals2.validateDurationInFrames;
 
 // src/options/override-duration.tsx
-import { jsx as jsx52, Fragment as Fragment52 } from "react/jsx-runtime";
+import { jsx as jsx53, Fragment as Fragment53 } from "react/jsx-runtime";
 var currentDuration = null;
-var cliFlag56 = "duration";
+var cliFlag57 = "duration";
 var overrideDurationOption = {
   name: "Override Duration",
-  cliFlag: cliFlag56,
-  description: () => /* @__PURE__ */ jsx52(Fragment52, {
+  cliFlag: cliFlag57,
+  description: () => /* @__PURE__ */ jsx53(Fragment53, {
     children: "Overrides the duration in frames of the composition."
   }),
   ssrName: null,
   docLink: "https://www.remotion.dev/docs/config#overrideduration",
   type: null,
   getValue: ({ commandLine }) => {
-    if (commandLine[cliFlag56] !== undefined) {
-      const value3 = commandLine[cliFlag56];
+    if (commandLine[cliFlag57] !== undefined) {
+      const value3 = commandLine[cliFlag57];
       validateDurationInFrames(value3, {
         component: "in --duration flag",
         allowFloats: false
@@ -3239,25 +3270,25 @@ var overrideDurationOption = {
     });
     currentDuration = duration;
   },
-  id: cliFlag56
+  id: cliFlag57
 };
 
 // src/options/override-fps.tsx
-import { jsx as jsx53, Fragment as Fragment53 } from "react/jsx-runtime";
+import { jsx as jsx54, Fragment as Fragment54 } from "react/jsx-runtime";
 var currentFps = null;
-var cliFlag57 = "fps";
+var cliFlag58 = "fps";
 var overrideFpsOption = {
   name: "Override FPS",
-  cliFlag: cliFlag57,
-  description: () => /* @__PURE__ */ jsx53(Fragment53, {
+  cliFlag: cliFlag58,
+  description: () => /* @__PURE__ */ jsx54(Fragment54, {
     children: "Overrides the frames per second of the composition."
   }),
   ssrName: null,
   docLink: "https://www.remotion.dev/docs/config#overridefps",
   type: null,
   getValue: ({ commandLine }) => {
-    if (commandLine[cliFlag57] !== undefined) {
-      const value3 = commandLine[cliFlag57];
+    if (commandLine[cliFlag58] !== undefined) {
+      const value3 = commandLine[cliFlag58];
       validateFps(value3, "in --fps flag", false);
       return {
         source: "cli",
@@ -3279,25 +3310,25 @@ var overrideFpsOption = {
     validateFps(fps, "in Config.overrideFps()", false);
     currentFps = fps;
   },
-  id: cliFlag57
+  id: cliFlag58
 };
 
 // src/options/override-height.tsx
-import { jsx as jsx54, Fragment as Fragment54 } from "react/jsx-runtime";
+import { jsx as jsx55, Fragment as Fragment55 } from "react/jsx-runtime";
 var currentHeight = null;
-var cliFlag58 = "height";
+var cliFlag59 = "height";
 var overrideHeightOption = {
   name: "Override Height",
-  cliFlag: cliFlag58,
-  description: () => /* @__PURE__ */ jsx54(Fragment54, {
+  cliFlag: cliFlag59,
+  description: () => /* @__PURE__ */ jsx55(Fragment55, {
     children: "Overrides the height of the composition."
   }),
   ssrName: null,
   docLink: "https://www.remotion.dev/docs/config#overrideheight",
   type: null,
   getValue: ({ commandLine }) => {
-    if (commandLine[cliFlag58] !== undefined) {
-      const value3 = commandLine[cliFlag58];
+    if (commandLine[cliFlag59] !== undefined) {
+      const value3 = commandLine[cliFlag59];
       validateDimension(value3, "height", "in --height flag");
       return {
         source: "cli",
@@ -3319,25 +3350,25 @@ var overrideHeightOption = {
     validateDimension(height, "height", "in Config.overrideHeight()");
     currentHeight = height;
   },
-  id: cliFlag58
+  id: cliFlag59
 };
 
 // src/options/override-width.tsx
-import { jsx as jsx55, Fragment as Fragment55 } from "react/jsx-runtime";
+import { jsx as jsx56, Fragment as Fragment56 } from "react/jsx-runtime";
 var currentWidth = null;
-var cliFlag59 = "width";
+var cliFlag60 = "width";
 var overrideWidthOption = {
   name: "Override Width",
-  cliFlag: cliFlag59,
-  description: () => /* @__PURE__ */ jsx55(Fragment55, {
+  cliFlag: cliFlag60,
+  description: () => /* @__PURE__ */ jsx56(Fragment56, {
     children: "Overrides the width of the composition."
   }),
   ssrName: null,
   docLink: "https://www.remotion.dev/docs/config#overridewidth",
   type: null,
   getValue: ({ commandLine }) => {
-    if (commandLine[cliFlag59] !== undefined) {
-      const value3 = commandLine[cliFlag59];
+    if (commandLine[cliFlag60] !== undefined) {
+      const value3 = commandLine[cliFlag60];
       validateDimension(value3, "width", "in --width flag");
       return {
         source: "cli",
@@ -3359,13 +3390,13 @@ var overrideWidthOption = {
     validateDimension(width, "width", "in Config.overrideWidth()");
     currentWidth = width;
   },
-  id: cliFlag59
+  id: cliFlag60
 };
 
 // src/options/overwrite.tsx
-import { jsx as jsx56, jsxs as jsxs36, Fragment as Fragment56 } from "react/jsx-runtime";
+import { jsx as jsx57, jsxs as jsxs36, Fragment as Fragment57 } from "react/jsx-runtime";
 var shouldOverwrite = null;
-var cliFlag60 = "overwrite";
+var cliFlag61 = "overwrite";
 var validate2 = (value3) => {
   if (typeof value3 !== "boolean") {
     throw new Error(`overwriteExisting must be a boolean but got ${typeof value3} (${value3})`);
@@ -3373,15 +3404,15 @@ var validate2 = (value3) => {
 };
 var overwriteOption = {
   name: "Overwrite output",
-  cliFlag: cliFlag60,
-  description: () => /* @__PURE__ */ jsxs36(Fragment56, {
+  cliFlag: cliFlag61,
+  description: () => /* @__PURE__ */ jsxs36(Fragment57, {
     children: [
       "If set to ",
-      /* @__PURE__ */ jsx56("code", {
+      /* @__PURE__ */ jsx57("code", {
         children: "false"
       }),
       ", will prevent rendering to a path that already exists. Default is ",
-      /* @__PURE__ */ jsx56("code", {
+      /* @__PURE__ */ jsx57("code", {
         children: "true"
       }),
       "."
@@ -3391,11 +3422,11 @@ var overwriteOption = {
   docLink: "https://www.remotion.dev/docs/config#setoverwriteoutput",
   type: false,
   getValue: ({ commandLine }, defaultValue2) => {
-    if (commandLine[cliFlag60] !== undefined) {
-      validate2(commandLine[cliFlag60]);
+    if (commandLine[cliFlag61] !== undefined) {
+      validate2(commandLine[cliFlag61]);
       return {
         source: "cli",
-        value: commandLine[cliFlag60]
+        value: commandLine[cliFlag61]
       };
     }
     if (shouldOverwrite !== null) {
@@ -3413,36 +3444,36 @@ var overwriteOption = {
     validate2(value3);
     shouldOverwrite = value3;
   },
-  id: cliFlag60
+  id: cliFlag61
 };
 
 // src/options/package-manager.tsx
-import { jsx as jsx57, jsxs as jsxs37, Fragment as Fragment57 } from "react/jsx-runtime";
-var cliFlag61 = "package-manager";
+import { jsx as jsx58, jsxs as jsxs37, Fragment as Fragment58 } from "react/jsx-runtime";
+var cliFlag62 = "package-manager";
 var currentPackageManager = null;
 var packageManagerOption = {
   name: "Package Manager",
-  cliFlag: cliFlag61,
+  cliFlag: cliFlag62,
   description: () => {
-    return /* @__PURE__ */ jsxs37(Fragment57, {
+    return /* @__PURE__ */ jsxs37(Fragment58, {
       children: [
         "Forces a specific package manager to be used. By default, Remotion will auto-detect the package manager based on your lockfile.",
-        /* @__PURE__ */ jsx57("br", {}),
+        /* @__PURE__ */ jsx58("br", {}),
         "Acceptable values are ",
-        /* @__PURE__ */ jsx57("code", {
+        /* @__PURE__ */ jsx58("code", {
           children: "npm"
         }),
         ", ",
-        /* @__PURE__ */ jsx57("code", {
+        /* @__PURE__ */ jsx58("code", {
           children: "yarn"
         }),
         ",",
         " ",
-        /* @__PURE__ */ jsx57("code", {
+        /* @__PURE__ */ jsx58("code", {
           children: "pnpm"
         }),
         " and ",
-        /* @__PURE__ */ jsx57("code", {
+        /* @__PURE__ */ jsx58("code", {
           children: "bun"
         }),
         "."
@@ -3452,10 +3483,10 @@ var packageManagerOption = {
   ssrName: "packageManager",
   docLink: "https://www.remotion.dev/docs/cli/upgrade#--package-manager",
   getValue: ({ commandLine }) => {
-    if (commandLine[cliFlag61] !== undefined) {
+    if (commandLine[cliFlag62] !== undefined) {
       return {
         source: "cli",
-        value: commandLine[cliFlag61]
+        value: commandLine[cliFlag62]
       };
     }
     if (currentPackageManager !== null) {
@@ -3473,7 +3504,7 @@ var packageManagerOption = {
     currentPackageManager = value3;
   },
   type: "",
-  id: cliFlag61
+  id: cliFlag62
 };
 
 // src/pixel-format.ts
@@ -3496,17 +3527,17 @@ var validPixelFormatsForCodec = (codec) => {
 };
 
 // src/options/pixel-format.tsx
-import { jsx as jsx58, jsxs as jsxs38, Fragment as Fragment58 } from "react/jsx-runtime";
+import { jsx as jsx59, jsxs as jsxs38, Fragment as Fragment59 } from "react/jsx-runtime";
 var currentPixelFormat = DEFAULT_PIXEL_FORMAT;
-var cliFlag62 = "pixel-format";
+var cliFlag63 = "pixel-format";
 var pixelFormatOption = {
   name: "Pixel format",
-  cliFlag: cliFlag62,
-  description: () => /* @__PURE__ */ jsxs38(Fragment58, {
+  cliFlag: cliFlag63,
+  description: () => /* @__PURE__ */ jsxs38(Fragment59, {
     children: [
       "Sets the pixel format in FFmpeg. See",
       " ",
-      /* @__PURE__ */ jsx58("a", {
+      /* @__PURE__ */ jsx59("a", {
         href: "https://trac.ffmpeg.org/wiki/Chroma%20Subsampling",
         children: "the FFmpeg docs for an explanation"
       }),
@@ -3519,10 +3550,10 @@ var pixelFormatOption = {
   docLink: "https://www.remotion.dev/docs/config#setpixelformat",
   type: DEFAULT_PIXEL_FORMAT,
   getValue: ({ commandLine }) => {
-    if (commandLine[cliFlag62] !== undefined) {
+    if (commandLine[cliFlag63] !== undefined) {
       return {
         source: "cli",
-        value: commandLine[cliFlag62]
+        value: commandLine[cliFlag63]
       };
     }
     if (currentPixelFormat !== DEFAULT_PIXEL_FORMAT) {
@@ -3542,26 +3573,26 @@ var pixelFormatOption = {
     }
     currentPixelFormat = value3;
   },
-  id: cliFlag62
+  id: cliFlag63
 };
 
 // src/options/port.tsx
-import { jsx as jsx59, Fragment as Fragment59 } from "react/jsx-runtime";
-var cliFlag63 = "port";
+import { jsx as jsx60, Fragment as Fragment60 } from "react/jsx-runtime";
+var cliFlag64 = "port";
 var currentPort = null;
 var portOption = {
   name: "Port",
-  cliFlag: cliFlag63,
-  description: () => /* @__PURE__ */ jsx59(Fragment59, {
+  cliFlag: cliFlag64,
+  description: () => /* @__PURE__ */ jsx60(Fragment60, {
     children: "Set a custom HTTP server port for the Studio or the render process. If not defined, Remotion will try to find a free port."
   }),
   ssrName: null,
   docLink: "https://www.remotion.dev/docs/config#setstudioport",
   getValue: ({ commandLine }) => {
-    if (commandLine[cliFlag63] !== undefined) {
+    if (commandLine[cliFlag64] !== undefined) {
       return {
         source: "cli",
-        value: commandLine[cliFlag63]
+        value: commandLine[cliFlag64]
       };
     }
     if (currentPort !== null) {
@@ -3579,25 +3610,25 @@ var portOption = {
     currentPort = value3;
   },
   type: 0,
-  id: cliFlag63
+  id: cliFlag64
 };
 
 // src/options/prefer-lossless.tsx
-import { jsx as jsx60, jsxs as jsxs39, Fragment as Fragment60 } from "react/jsx-runtime";
-var cliFlag64 = "prefer-lossless";
+import { jsx as jsx61, jsxs as jsxs39, Fragment as Fragment61 } from "react/jsx-runtime";
+var cliFlag65 = "prefer-lossless";
 var input = false;
 var preferLosslessAudioOption = {
   name: "Prefer lossless",
-  cliFlag: cliFlag64,
-  description: () => /* @__PURE__ */ jsxs39(Fragment60, {
+  cliFlag: cliFlag65,
+  description: () => /* @__PURE__ */ jsxs39(Fragment61, {
     children: [
       "Uses a lossless audio codec, if one is available for the codec. If you set",
-      /* @__PURE__ */ jsx60("code", {
+      /* @__PURE__ */ jsx61("code", {
         children: "audioCodec"
       }),
       ", it takes priority over",
       " ",
-      /* @__PURE__ */ jsx60("code", {
+      /* @__PURE__ */ jsx61("code", {
         children: "preferLossless"
       }),
       "."
@@ -3607,7 +3638,7 @@ var preferLosslessAudioOption = {
   type: false,
   ssrName: "preferLossless",
   getValue: ({ commandLine }) => {
-    if (commandLine[cliFlag64]) {
+    if (commandLine[cliFlag65]) {
       return { value: true, source: "cli" };
     }
     if (input === true) {
@@ -3618,16 +3649,16 @@ var preferLosslessAudioOption = {
   setConfig: (val) => {
     input = val;
   },
-  id: cliFlag64
+  id: cliFlag65
 };
 
 // src/options/props.tsx
-import { jsx as jsx61, jsxs as jsxs40, Fragment as Fragment61 } from "react/jsx-runtime";
-var cliFlag65 = "props";
+import { jsx as jsx62, jsxs as jsxs40, Fragment as Fragment62 } from "react/jsx-runtime";
+var cliFlag66 = "props";
 var propsOption = {
   name: "Input Props",
-  cliFlag: cliFlag65,
-  description: () => /* @__PURE__ */ jsxs40(Fragment61, {
+  cliFlag: cliFlag66,
+  description: () => /* @__PURE__ */ jsxs40(Fragment62, {
     children: [
       "Input Props to pass to the selected composition of your video. Must be a serialized JSON string (",
       /* @__PURE__ */ jsxs40("code", {
@@ -3640,7 +3671,7 @@ var propsOption = {
         ]
       }),
       ") or a path to a JSON file (",
-      /* @__PURE__ */ jsx61("code", {
+      /* @__PURE__ */ jsx62("code", {
         children: "./path/to/props.json"
       }),
       ")."
@@ -3649,10 +3680,10 @@ var propsOption = {
   ssrName: null,
   docLink: "https://www.remotion.dev/docs/passing-props#passing-input-props-in-the-cli",
   getValue: ({ commandLine }) => {
-    if (commandLine[cliFlag65] !== undefined) {
+    if (commandLine[cliFlag66] !== undefined) {
       return {
         source: "cli",
-        value: commandLine[cliFlag65]
+        value: commandLine[cliFlag66]
       };
     }
     return {
@@ -3664,11 +3695,11 @@ var propsOption = {
     throw new Error("setProps is not supported. Pass --props via the CLI instead.");
   },
   type: "",
-  id: cliFlag65
+  id: cliFlag66
 };
 
 // src/options/prores-profile.tsx
-import { jsx as jsx62, jsxs as jsxs41, Fragment as Fragment62 } from "react/jsx-runtime";
+import { jsx as jsx63, jsxs as jsxs41, Fragment as Fragment63 } from "react/jsx-runtime";
 var validProResProfiles = [
   "4444-xq",
   "4444",
@@ -3678,14 +3709,14 @@ var validProResProfiles = [
   "proxy"
 ];
 var proResProfile;
-var cliFlag66 = "prores-profile";
+var cliFlag67 = "prores-profile";
 var proResProfileOption = {
   name: "ProRes profile",
-  cliFlag: cliFlag66,
-  description: () => /* @__PURE__ */ jsxs41(Fragment62, {
+  cliFlag: cliFlag67,
+  description: () => /* @__PURE__ */ jsxs41(Fragment63, {
     children: [
       "Set the ProRes profile. This option is only valid if the codec has been set to ",
-      /* @__PURE__ */ jsx62("code", {
+      /* @__PURE__ */ jsx63("code", {
         children: "prores"
       }),
       ". Possible values:",
@@ -3693,12 +3724,12 @@ var proResProfileOption = {
       validProResProfiles.map((p) => `"${p}"`).join(", "),
       ". Default:",
       " ",
-      /* @__PURE__ */ jsx62("code", {
+      /* @__PURE__ */ jsx63("code", {
         children: '"hq"'
       }),
       ". See",
       " ",
-      /* @__PURE__ */ jsx62("a", {
+      /* @__PURE__ */ jsx63("a", {
         href: "https://video.stackexchange.com/a/14715",
         children: "here"
       }),
@@ -3709,10 +3740,10 @@ var proResProfileOption = {
   docLink: "https://www.remotion.dev/docs/config#setproresprofile",
   type: undefined,
   getValue: ({ commandLine }) => {
-    if (commandLine[cliFlag66] !== undefined) {
+    if (commandLine[cliFlag67] !== undefined) {
       return {
         source: "cli",
-        value: String(commandLine[cliFlag66])
+        value: String(commandLine[cliFlag67])
       };
     }
     if (proResProfile !== undefined) {
@@ -3729,24 +3760,24 @@ var proResProfileOption = {
   setConfig: (value3) => {
     proResProfile = value3;
   },
-  id: cliFlag66
+  id: cliFlag67
 };
 
 // src/options/public-dir.tsx
-import { jsx as jsx63, jsxs as jsxs42, Fragment as Fragment63 } from "react/jsx-runtime";
-var cliFlag67 = "public-dir";
+import { jsx as jsx64, jsxs as jsxs42, Fragment as Fragment64 } from "react/jsx-runtime";
+var cliFlag68 = "public-dir";
 var currentPublicDir = null;
 var publicDirOption = {
   name: "Public Directory",
-  cliFlag: cliFlag67,
+  cliFlag: cliFlag68,
   description: () => {
-    return /* @__PURE__ */ jsxs42(Fragment63, {
+    return /* @__PURE__ */ jsxs42(Fragment64, {
       children: [
         "Define the location of the",
         " ",
-        /* @__PURE__ */ jsx63("a", {
+        /* @__PURE__ */ jsx64("a", {
           href: "/docs/terminology/public-dir",
-          children: /* @__PURE__ */ jsx63("code", {
+          children: /* @__PURE__ */ jsx64("code", {
             children: "public/ directory"
           })
         }),
@@ -3757,10 +3788,10 @@ var publicDirOption = {
   ssrName: "publicDir",
   docLink: "https://www.remotion.dev/docs/terminology/public-dir",
   getValue: ({ commandLine }) => {
-    if (commandLine[cliFlag67] !== undefined) {
+    if (commandLine[cliFlag68] !== undefined) {
       return {
         source: "cli",
-        value: commandLine[cliFlag67]
+        value: commandLine[cliFlag68]
       };
     }
     if (currentPublicDir !== null) {
@@ -3778,20 +3809,20 @@ var publicDirOption = {
     currentPublicDir = value3;
   },
   type: "",
-  id: cliFlag67
+  id: cliFlag68
 };
 
 // src/options/public-license-key.tsx
-import { jsx as jsx64, jsxs as jsxs43, Fragment as Fragment64 } from "react/jsx-runtime";
-var cliFlag68 = "public-license-key";
+import { jsx as jsx65, jsxs as jsxs43, Fragment as Fragment65 } from "react/jsx-runtime";
+var cliFlag69 = "public-license-key";
 var currentPublicLicenseKey = null;
 var publicLicenseKeyOption = {
   name: "Public License Key",
-  cliFlag: cliFlag68,
-  description: () => /* @__PURE__ */ jsxs43(Fragment64, {
+  cliFlag: cliFlag69,
+  description: () => /* @__PURE__ */ jsxs43(Fragment65, {
     children: [
       'The public license key for your company license, obtained from the "Usage" tab on ',
-      /* @__PURE__ */ jsx64("a", {
+      /* @__PURE__ */ jsx65("a", {
         href: "https://remotion.pro/dashboard",
         children: "remotion.pro"
       }),
@@ -3801,10 +3832,10 @@ var publicLicenseKeyOption = {
   ssrName: "publicLicenseKey",
   docLink: "https://www.remotion.dev/docs/licensing",
   getValue: ({ commandLine }) => {
-    if (commandLine[cliFlag68] !== undefined) {
+    if (commandLine[cliFlag69] !== undefined) {
       return {
         source: "cli",
-        value: commandLine[cliFlag68]
+        value: commandLine[cliFlag69]
       };
     }
     if (currentPublicLicenseKey !== null) {
@@ -3825,29 +3856,29 @@ var publicLicenseKeyOption = {
     currentPublicLicenseKey = value3;
   },
   type: null,
-  id: cliFlag68
+  id: cliFlag69
 };
 
 // src/options/public-path.tsx
-import { jsx as jsx65, jsxs as jsxs44, Fragment as Fragment65 } from "react/jsx-runtime";
-var cliFlag69 = "public-path";
+import { jsx as jsx66, jsxs as jsxs44, Fragment as Fragment66 } from "react/jsx-runtime";
+var cliFlag70 = "public-path";
 var currentPublicPath = null;
 var publicPathOption = {
   name: "Public Path",
-  cliFlag: cliFlag69,
+  cliFlag: cliFlag70,
   description: () => {
-    return /* @__PURE__ */ jsxs44(Fragment65, {
+    return /* @__PURE__ */ jsxs44(Fragment66, {
       children: [
         "The path of the URL where the bundle is going to be hosted. By default it is ",
-        /* @__PURE__ */ jsx65("code", {
+        /* @__PURE__ */ jsx66("code", {
           children: "/"
         }),
         ", meaning that the bundle is going to be hosted at the root of the domain (e.g. ",
-        /* @__PURE__ */ jsx65("code", {
+        /* @__PURE__ */ jsx66("code", {
           children: "https://localhost:3000/"
         }),
         "). If you are deploying to a subdirectory (e.g. ",
-        /* @__PURE__ */ jsx65("code", {
+        /* @__PURE__ */ jsx66("code", {
           children: "/sites/my-site/"
         }),
         "), you should set this to the subdirectory."
@@ -3857,10 +3888,10 @@ var publicPathOption = {
   ssrName: "publicPath",
   docLink: "https://www.remotion.dev/docs/renderer",
   getValue: ({ commandLine }) => {
-    if (commandLine[cliFlag69] !== undefined) {
+    if (commandLine[cliFlag70] !== undefined) {
       return {
         source: "cli",
-        value: commandLine[cliFlag69]
+        value: commandLine[cliFlag70]
       };
     }
     if (currentPublicPath !== null) {
@@ -3878,29 +3909,29 @@ var publicPathOption = {
     currentPublicPath = value3;
   },
   type: "",
-  id: cliFlag69
+  id: cliFlag70
 };
 
 // src/options/repro.tsx
-import { jsx as jsx66, Fragment as Fragment66 } from "react/jsx-runtime";
+import { jsx as jsx67, Fragment as Fragment67 } from "react/jsx-runtime";
 var enableRepro = false;
 var setRepro = (should) => {
   enableRepro = should;
 };
-var cliFlag70 = "repro";
+var cliFlag71 = "repro";
 var reproOption = {
   name: "Create reproduction",
-  cliFlag: cliFlag70,
-  description: () => /* @__PURE__ */ jsx66(Fragment66, {
+  cliFlag: cliFlag71,
+  description: () => /* @__PURE__ */ jsx67(Fragment67, {
     children: "Create a ZIP that you can submit to Remotion if asked for a reproduction."
   }),
   ssrName: "repro",
   docLink: "https://www.remotion.dev/docs/render-media#repro",
   type: false,
   getValue: ({ commandLine }) => {
-    if (commandLine[cliFlag70] !== undefined) {
+    if (commandLine[cliFlag71] !== undefined) {
       return {
-        value: commandLine[cliFlag70],
+        value: commandLine[cliFlag71],
         source: "cli"
       };
     }
@@ -3916,27 +3947,27 @@ var reproOption = {
     };
   },
   setConfig: setRepro,
-  id: cliFlag70
+  id: cliFlag71
 };
 
 // src/options/rspack.tsx
-import { jsx as jsx67, Fragment as Fragment67 } from "react/jsx-runtime";
+import { jsx as jsx68, Fragment as Fragment68 } from "react/jsx-runtime";
 var rspackEnabled = false;
-var cliFlag71 = "experimental-rspack";
+var cliFlag72 = "experimental-rspack";
 var rspackOption = {
   name: "Experimental Rspack",
-  cliFlag: cliFlag71,
-  description: () => /* @__PURE__ */ jsx67(Fragment67, {
+  cliFlag: cliFlag72,
+  description: () => /* @__PURE__ */ jsx68(Fragment68, {
     children: "Uses Rspack instead of Webpack as the bundler for the Studio or bundle."
   }),
   ssrName: null,
   docLink: null,
   type: false,
   getValue: ({ commandLine }) => {
-    if (commandLine[cliFlag71] !== undefined) {
+    if (commandLine[cliFlag72] !== undefined) {
       rspackEnabled = true;
       return {
-        value: commandLine[cliFlag71],
+        value: commandLine[cliFlag72],
         source: "cli"
       };
     }
@@ -3948,21 +3979,21 @@ var rspackOption = {
   setConfig(value3) {
     rspackEnabled = value3;
   },
-  id: cliFlag71
+  id: cliFlag72
 };
 
 // src/options/runs.tsx
-import { jsx as jsx68, jsxs as jsxs45, Fragment as Fragment68 } from "react/jsx-runtime";
+import { jsx as jsx69, jsxs as jsxs45, Fragment as Fragment69 } from "react/jsx-runtime";
 var DEFAULT_RUNS = 3;
 var currentRuns = DEFAULT_RUNS;
-var cliFlag72 = "runs";
+var cliFlag73 = "runs";
 var runsOption = {
   name: "Benchmark runs",
-  cliFlag: cliFlag72,
-  description: () => /* @__PURE__ */ jsxs45(Fragment68, {
+  cliFlag: cliFlag73,
+  description: () => /* @__PURE__ */ jsxs45(Fragment69, {
     children: [
       "Specify how many times the video should be rendered during a benchmark. Default ",
-      /* @__PURE__ */ jsx68("code", {
+      /* @__PURE__ */ jsx69("code", {
         children: DEFAULT_RUNS
       }),
       "."
@@ -3972,10 +4003,10 @@ var runsOption = {
   docLink: "https://www.remotion.dev/docs/cli/benchmark#--runs",
   type: DEFAULT_RUNS,
   getValue: ({ commandLine }) => {
-    if (commandLine[cliFlag72] !== undefined) {
-      const value3 = Number(commandLine[cliFlag72]);
+    if (commandLine[cliFlag73] !== undefined) {
+      const value3 = Number(commandLine[cliFlag73]);
       if (isNaN(value3) || value3 < 1) {
-        throw new Error(`--runs must be a positive number, but got ${commandLine[cliFlag72]}`);
+        throw new Error(`--runs must be a positive number, but got ${commandLine[cliFlag73]}`);
       }
       return { value: value3, source: "cli" };
     }
@@ -3990,13 +4021,13 @@ var runsOption = {
     }
     currentRuns = value3;
   },
-  id: cliFlag72
+  id: cliFlag73
 };
 
 // src/options/scale.tsx
-import { jsx as jsx69, jsxs as jsxs46, Fragment as Fragment69 } from "react/jsx-runtime";
+import { jsx as jsx70, jsxs as jsxs46, Fragment as Fragment70 } from "react/jsx-runtime";
 var currentScale = 1;
-var cliFlag73 = "scale";
+var cliFlag74 = "scale";
 var validateScale = (value3) => {
   if (typeof value3 !== "number") {
     throw new Error("scale must be a number.");
@@ -4004,15 +4035,15 @@ var validateScale = (value3) => {
 };
 var scaleOption = {
   name: "Scale",
-  cliFlag: cliFlag73,
-  description: () => /* @__PURE__ */ jsxs46(Fragment69, {
+  cliFlag: cliFlag74,
+  description: () => /* @__PURE__ */ jsxs46(Fragment70, {
     children: [
       "Scales the output dimensions by a factor. For example, a 1280x720px frame will become a 1920x1080px frame with a scale factor of ",
-      /* @__PURE__ */ jsx69("code", {
+      /* @__PURE__ */ jsx70("code", {
         children: "1.5"
       }),
       ". See ",
-      /* @__PURE__ */ jsx69("a", {
+      /* @__PURE__ */ jsx70("a", {
         href: "https://www.remotion.dev/docs/scaling",
         children: "Scaling"
       }),
@@ -4023,11 +4054,11 @@ var scaleOption = {
   docLink: "https://www.remotion.dev/docs/scaling",
   type: 0,
   getValue: ({ commandLine }) => {
-    if (commandLine[cliFlag73] !== undefined) {
-      validateScale(commandLine[cliFlag73]);
+    if (commandLine[cliFlag74] !== undefined) {
+      validateScale(commandLine[cliFlag74]);
       return {
         source: "cli",
-        value: commandLine[cliFlag73]
+        value: commandLine[cliFlag74]
       };
     }
     if (currentScale !== null) {
@@ -4044,13 +4075,13 @@ var scaleOption = {
   setConfig: (scale) => {
     currentScale = scale;
   },
-  id: cliFlag73
+  id: cliFlag74
 };
 
 // src/options/still-frame.tsx
 import { NoReactInternals as NoReactInternals3 } from "remotion/no-react";
-import { jsx as jsx70, jsxs as jsxs47, Fragment as Fragment70 } from "react/jsx-runtime";
-var cliFlag74 = "frame";
+import { jsx as jsx71, jsxs as jsxs47, Fragment as Fragment71 } from "react/jsx-runtime";
+var cliFlag75 = "frame";
 var currentFrame = null;
 var validate3 = (frame) => {
   NoReactInternals3.validateFrame({
@@ -4061,17 +4092,17 @@ var validate3 = (frame) => {
 };
 var stillFrameOption = {
   name: "Frame",
-  cliFlag: cliFlag74,
-  description: () => /* @__PURE__ */ jsxs47(Fragment70, {
+  cliFlag: cliFlag75,
+  description: () => /* @__PURE__ */ jsxs47(Fragment71, {
     children: [
       "Which frame should be rendered when rendering a still. Default",
       " ",
-      /* @__PURE__ */ jsx70("code", {
+      /* @__PURE__ */ jsx71("code", {
         children: "0"
       }),
       ". From v3.2.27, negative values are allowed, with",
       " ",
-      /* @__PURE__ */ jsx70("code", {
+      /* @__PURE__ */ jsx71("code", {
         children: "-1"
       }),
       " being the last frame."
@@ -4080,8 +4111,8 @@ var stillFrameOption = {
   ssrName: "frame",
   docLink: "https://www.remotion.dev/docs/cli/still#--frame",
   getValue: ({ commandLine }) => {
-    if (commandLine[cliFlag74] !== undefined) {
-      const frame = Number(commandLine[cliFlag74]);
+    if (commandLine[cliFlag75] !== undefined) {
+      const frame = Number(commandLine[cliFlag75]);
       validate3(frame);
       return {
         source: "cli",
@@ -4106,24 +4137,24 @@ var stillFrameOption = {
     currentFrame = value3;
   },
   type: 0,
-  id: cliFlag74
+  id: cliFlag75
 };
 
 // src/options/still-image-format.tsx
-import { jsx as jsx71, jsxs as jsxs48, Fragment as Fragment71 } from "react/jsx-runtime";
+import { jsx as jsx72, jsxs as jsxs48, Fragment as Fragment72 } from "react/jsx-runtime";
 var currentStillImageFormat = null;
-var cliFlag75 = "image-format";
+var cliFlag76 = "image-format";
 var stillImageFormatOption = {
   name: "Still Image Format",
-  cliFlag: cliFlag75,
-  description: () => /* @__PURE__ */ jsxs48(Fragment71, {
+  cliFlag: cliFlag76,
+  description: () => /* @__PURE__ */ jsxs48(Fragment72, {
     children: [
       "The image format to use when rendering a still. Must be one of",
       " ",
       validStillImageFormats.map((f) => `"${f}"`).join(", "),
       ". Default:",
       " ",
-      /* @__PURE__ */ jsx71("code", {
+      /* @__PURE__ */ jsx72("code", {
         children: '"png"'
       }),
       "."
@@ -4133,8 +4164,8 @@ var stillImageFormatOption = {
   docLink: "https://www.remotion.dev/docs/renderer/render-still#imageformat",
   type: null,
   getValue: ({ commandLine }) => {
-    if (commandLine[cliFlag75] !== undefined) {
-      const value3 = commandLine[cliFlag75];
+    if (commandLine[cliFlag76] !== undefined) {
+      const value3 = commandLine[cliFlag76];
       if (!validStillImageFormats.includes(value3)) {
         throw new Error(`Invalid still image format: ${value3}. Must be one of: ${validStillImageFormats.join(", ")}`);
       }
@@ -4172,16 +4203,16 @@ var stillImageFormatOption = {
 
 // src/options/throw-if-site-exists.tsx
 var DEFAULT5 = false;
-var cliFlag76 = "throw-if-site-exists";
+var cliFlag77 = "throw-if-site-exists";
 var throwIfSiteExistsOption = {
-  cliFlag: cliFlag76,
+  cliFlag: cliFlag77,
   description: () => `Prevents accidential update of an existing site. If there are any files in the subfolder where the site should be placed, the function will throw.`,
   docLink: "https://remotion.dev/docs/lambda/deploy-site",
   getValue: ({ commandLine }) => {
-    if (commandLine[cliFlag76]) {
+    if (commandLine[cliFlag77]) {
       return {
         source: "cli",
-        value: commandLine[cliFlag76]
+        value: commandLine[cliFlag77]
       };
     }
     return {
@@ -4195,41 +4226,41 @@ var throwIfSiteExistsOption = {
   },
   ssrName: "throwIfSiteExists",
   type: false,
-  id: cliFlag76
+  id: cliFlag77
 };
 
 // src/options/timeout.tsx
-import { jsx as jsx72, jsxs as jsxs49, Fragment as Fragment72 } from "react/jsx-runtime";
+import { jsx as jsx73, jsxs as jsxs49, Fragment as Fragment73 } from "react/jsx-runtime";
 var currentTimeout = DEFAULT_TIMEOUT;
 var validate4 = (value3) => {
   if (typeof value3 !== "number") {
     throw new Error("--timeout flag / setDelayRenderTimeoutInMilliseconds() must be a number, but got " + JSON.stringify(value3));
   }
 };
-var cliFlag77 = "timeout";
+var cliFlag78 = "timeout";
 var delayRenderTimeoutInMillisecondsOption = {
   name: "delayRender() timeout",
-  cliFlag: cliFlag77,
-  description: () => /* @__PURE__ */ jsxs49(Fragment72, {
+  cliFlag: cliFlag78,
+  description: () => /* @__PURE__ */ jsxs49(Fragment73, {
     children: [
       "A number describing how long the render may take to resolve all",
       " ",
-      /* @__PURE__ */ jsx72("a", {
+      /* @__PURE__ */ jsx73("a", {
         href: "https://remotion.dev/docs/delay-render",
-        children: /* @__PURE__ */ jsx72("code", {
+        children: /* @__PURE__ */ jsx73("code", {
           children: "delayRender()"
         })
       }),
       " ",
       "calls",
       " ",
-      /* @__PURE__ */ jsx72("a", {
+      /* @__PURE__ */ jsx73("a", {
         style: { fontSize: "inherit" },
         href: "https://remotion.dev/docs/timeout",
         children: "before it times out"
       }),
       ". Default: ",
-      /* @__PURE__ */ jsx72("code", {
+      /* @__PURE__ */ jsx73("code", {
         children: "30000"
       })
     ]
@@ -4238,10 +4269,10 @@ var delayRenderTimeoutInMillisecondsOption = {
   docLink: "https://www.remotion.dev/docs/timeout",
   type: 0,
   getValue: ({ commandLine }) => {
-    if (commandLine[cliFlag77] !== undefined) {
+    if (commandLine[cliFlag78] !== undefined) {
       return {
         source: "cli",
-        value: commandLine[cliFlag77]
+        value: commandLine[cliFlag78]
       };
     }
     if (currentTimeout !== null) {
@@ -4260,27 +4291,27 @@ var delayRenderTimeoutInMillisecondsOption = {
     validate4(value3);
     currentTimeout = value3;
   },
-  id: cliFlag77
+  id: cliFlag78
 };
 
 // src/options/user-agent.tsx
-import { jsx as jsx73, Fragment as Fragment73 } from "react/jsx-runtime";
+import { jsx as jsx74, Fragment as Fragment74 } from "react/jsx-runtime";
 var userAgent = null;
-var cliFlag78 = "user-agent";
+var cliFlag79 = "user-agent";
 var userAgentOption = {
   name: "User agent",
-  cliFlag: cliFlag78,
-  description: () => /* @__PURE__ */ jsx73(Fragment73, {
+  cliFlag: cliFlag79,
+  description: () => /* @__PURE__ */ jsx74(Fragment74, {
     children: "Lets you set a custom user agent that the headless Chrome browser assumes."
   }),
   ssrName: "userAgent",
   docLink: "https://www.remotion.dev/docs/chromium-flags#--user-agent",
   type: null,
   getValue: ({ commandLine }) => {
-    if (commandLine[cliFlag78] !== undefined) {
+    if (commandLine[cliFlag79] !== undefined) {
       return {
         source: "cli",
-        value: commandLine[cliFlag78]
+        value: commandLine[cliFlag79]
       };
     }
     if (userAgent !== null) {
@@ -4297,25 +4328,25 @@ var userAgentOption = {
   setConfig: (value3) => {
     userAgent = value3;
   },
-  id: cliFlag78
+  id: cliFlag79
 };
 
 // src/options/version-flag.tsx
-import { jsx as jsx74, Fragment as Fragment74 } from "react/jsx-runtime";
-var cliFlag79 = "version";
+import { jsx as jsx75, Fragment as Fragment75 } from "react/jsx-runtime";
+var cliFlag80 = "version";
 var versionFlagOption = {
   name: "Version",
-  cliFlag: cliFlag79,
-  description: () => /* @__PURE__ */ jsx74(Fragment74, {
+  cliFlag: cliFlag80,
+  description: () => /* @__PURE__ */ jsx75(Fragment75, {
     children: "Install a specific version. Also enables downgrading to an older version."
   }),
   ssrName: null,
   docLink: "https://www.remotion.dev/docs/cli/upgrade#--version",
   getValue: ({ commandLine }) => {
-    if (commandLine[cliFlag79] !== undefined) {
+    if (commandLine[cliFlag80] !== undefined) {
       return {
         source: "cli",
-        value: String(commandLine[cliFlag79])
+        value: String(commandLine[cliFlag80])
       };
     }
     return {
@@ -4327,30 +4358,30 @@ var versionFlagOption = {
     throw new Error("Cannot set version via config file");
   },
   type: "",
-  id: cliFlag79
+  id: cliFlag80
 };
 
 // src/options/video-bitrate.tsx
-import { jsx as jsx75, jsxs as jsxs50, Fragment as Fragment75 } from "react/jsx-runtime";
+import { jsx as jsx76, jsxs as jsxs50, Fragment as Fragment76 } from "react/jsx-runtime";
 var videoBitrate = null;
-var cliFlag80 = "video-bitrate";
+var cliFlag81 = "video-bitrate";
 var videoBitrateOption = {
   name: "Video Bitrate",
-  cliFlag: cliFlag80,
-  description: () => /* @__PURE__ */ jsxs50(Fragment75, {
+  cliFlag: cliFlag81,
+  description: () => /* @__PURE__ */ jsxs50(Fragment76, {
     children: [
       "Specify the target bitrate for the generated video. The syntax for FFmpeg",
       "'",
       "s",
-      /* @__PURE__ */ jsx75("code", {
+      /* @__PURE__ */ jsx76("code", {
         children: "-b:v"
       }),
       " parameter should be used. FFmpeg may encode the video in a way that will not result in the exact video bitrate specified. Example values: ",
-      /* @__PURE__ */ jsx75("code", {
+      /* @__PURE__ */ jsx76("code", {
         children: "512K"
       }),
       " for 512 kbps, ",
-      /* @__PURE__ */ jsx75("code", {
+      /* @__PURE__ */ jsx76("code", {
         children: "1M"
       }),
       " for 1 Mbps."
@@ -4360,10 +4391,10 @@ var videoBitrateOption = {
   docLink: "https://www.remotion.dev/docs/renderer/render-media#videobitrate",
   type: "",
   getValue: ({ commandLine }) => {
-    if (commandLine[cliFlag80] !== undefined) {
+    if (commandLine[cliFlag81] !== undefined) {
       return {
         source: "cli",
-        value: commandLine[cliFlag80]
+        value: commandLine[cliFlag81]
       };
     }
     if (videoBitrate !== null) {
@@ -4380,33 +4411,33 @@ var videoBitrateOption = {
   setConfig: (bitrate) => {
     videoBitrate = bitrate;
   },
-  id: cliFlag80
+  id: cliFlag81
 };
 
 // src/options/video-cache-size.tsx
-import { jsx as jsx76, jsxs as jsxs51, Fragment as Fragment76 } from "react/jsx-runtime";
+import { jsx as jsx77, jsxs as jsxs51, Fragment as Fragment77 } from "react/jsx-runtime";
 var mediaCacheSizeInBytes = null;
-var cliFlag81 = "media-cache-size-in-bytes";
+var cliFlag82 = "media-cache-size-in-bytes";
 var mediaCacheSizeInBytesOption = {
   name: "@remotion/media cache size",
-  cliFlag: cliFlag81,
-  description: () => /* @__PURE__ */ jsxs51(Fragment76, {
+  cliFlag: cliFlag82,
+  description: () => /* @__PURE__ */ jsxs51(Fragment77, {
     children: [
       "Specify the maximum size of the cache that ",
-      /* @__PURE__ */ jsx76("code", {
+      /* @__PURE__ */ jsx77("code", {
         children: "<Video>"
       }),
       " and",
       " ",
-      /* @__PURE__ */ jsx76("code", {
+      /* @__PURE__ */ jsx77("code", {
         children: "<Audio>"
       }),
       " from ",
-      /* @__PURE__ */ jsx76("code", {
+      /* @__PURE__ */ jsx77("code", {
         children: "@remotion/media"
       }),
       " may use combined, in bytes. ",
-      /* @__PURE__ */ jsx76("br", {}),
+      /* @__PURE__ */ jsx77("br", {}),
       "The default is half of the available system memory when the render starts."
     ]
   }),
@@ -4414,10 +4445,10 @@ var mediaCacheSizeInBytesOption = {
   docLink: "https://www.remotion.dev/docs/media/video#setting-the-cache-size",
   type: 0,
   getValue: ({ commandLine }) => {
-    if (commandLine[cliFlag81] !== undefined) {
+    if (commandLine[cliFlag82] !== undefined) {
       return {
         source: "cli",
-        value: commandLine[cliFlag81]
+        value: commandLine[cliFlag82]
       };
     }
     if (mediaCacheSizeInBytes !== null) {
@@ -4434,7 +4465,7 @@ var mediaCacheSizeInBytesOption = {
   setConfig: (size) => {
     mediaCacheSizeInBytes = size ?? null;
   },
-  id: cliFlag81
+  id: cliFlag82
 };
 
 // src/path-normalize.ts
@@ -4553,7 +4584,7 @@ var getExtensionOfFilename = (filename) => {
 };
 
 // src/options/video-codec.tsx
-import { jsx as jsx77, Fragment as Fragment77 } from "react/jsx-runtime";
+import { jsx as jsx78, Fragment as Fragment78 } from "react/jsx-runtime";
 var codec;
 var setCodec = (newCodec) => {
   if (newCodec === undefined) {
@@ -4577,11 +4608,11 @@ var deriveCodecsFromFilename = (extension) => {
     possible: makeFileExtensionMap()[extension] ?? []
   };
 };
-var cliFlag82 = "codec";
+var cliFlag83 = "codec";
 var videoCodecOption = {
   name: "Codec",
-  cliFlag: cliFlag82,
-  description: () => /* @__PURE__ */ jsx77(Fragment77, {
+  cliFlag: cliFlag83,
+  description: () => /* @__PURE__ */ jsx78(Fragment78, {
     children: "H264 works well in most cases, but sometimes it's worth going for a different codec. WebM achieves higher compression but is slower to render. WebM, GIF and ProRes support transparency."
   }),
   ssrName: "codec",
@@ -4604,7 +4635,7 @@ var videoCodecOption = {
     if (derivedDownloadCodecs.possible.length > 0 && derivedOutNameCodecs.possible.length > 0 && derivedDownloadCodecs.possible.join("") !== derivedOutNameCodecs.possible.join("")) {
       throw new TypeError(`The download name is ${downloadName} but the output name is ${outName}. The file extensions must match`);
     }
-    const cliArgument = commandLine[cliFlag82];
+    const cliArgument = commandLine[cliFlag83];
     if (cliArgument) {
       if (derivedDownloadCodecs.possible.length > 0 && derivedDownloadCodecs.possible.indexOf(cliArgument) === -1) {
         throw new TypeError(`The download name is ${downloadName} but --codec=${cliArgument} was passed. The download name implies a codec of ${derivedDownloadCodecs.possible.join(" or ")} which does not align with the --codec flag.`);
@@ -4650,24 +4681,24 @@ var videoCodecOption = {
     return { value: DEFAULT_CODEC, source: "default" };
   },
   setConfig: setCodec,
-  id: cliFlag82
+  id: cliFlag83
 };
 
 // src/options/video-image-format.tsx
-import { jsx as jsx78, jsxs as jsxs52, Fragment as Fragment78 } from "react/jsx-runtime";
+import { jsx as jsx79, jsxs as jsxs52, Fragment as Fragment79 } from "react/jsx-runtime";
 var currentVideoImageFormat = null;
-var cliFlag83 = "image-format";
+var cliFlag84 = "image-format";
 var videoImageFormatOption = {
   name: "Video Image Format",
-  cliFlag: cliFlag83,
-  description: () => /* @__PURE__ */ jsxs52(Fragment78, {
+  cliFlag: cliFlag84,
+  description: () => /* @__PURE__ */ jsxs52(Fragment79, {
     children: [
       "The image format to use when rendering frames for a video. Must be one of",
       " ",
       validVideoImageFormats.map((f) => `"${f}"`).join(", "),
       ". Default:",
       " ",
-      /* @__PURE__ */ jsx78("code", {
+      /* @__PURE__ */ jsx79("code", {
         children: '"jpeg"'
       }),
       ". JPEG is faster, but does not support transparency."
@@ -4677,8 +4708,8 @@ var videoImageFormatOption = {
   docLink: "https://www.remotion.dev/docs/renderer/render-media#imageformat",
   type: null,
   getValue: ({ commandLine }) => {
-    if (commandLine[cliFlag83] !== undefined) {
-      const value3 = commandLine[cliFlag83];
+    if (commandLine[cliFlag84] !== undefined) {
+      const value3 = commandLine[cliFlag84];
       if (!validVideoImageFormats.includes(value3)) {
         throw new Error(`Invalid video image format: ${value3}. Must be one of: ${validVideoImageFormats.join(", ")}`);
       }
@@ -4715,12 +4746,12 @@ var videoImageFormatOption = {
 };
 
 // src/options/webhook-custom-data.tsx
-import { jsxs as jsxs53, Fragment as Fragment79 } from "react/jsx-runtime";
-var cliFlag84 = "webhook-custom-data";
+import { jsxs as jsxs53, Fragment as Fragment80 } from "react/jsx-runtime";
+var cliFlag85 = "webhook-custom-data";
 var webhookCustomDataOption = {
   name: "Webhook custom data",
-  cliFlag: cliFlag84,
-  description: (type) => /* @__PURE__ */ jsxs53(Fragment79, {
+  cliFlag: cliFlag85,
+  description: (type) => /* @__PURE__ */ jsxs53(Fragment80, {
     children: [
       "Pass up to 1,024 bytes of a JSON-serializable object to the webhook. This data will be included in the webhook payload.",
       " ",
@@ -4736,24 +4767,24 @@ var webhookCustomDataOption = {
   setConfig: () => {
     throw new Error("Not implemented");
   },
-  id: cliFlag84
+  id: cliFlag85
 };
 
 // src/options/webpack-poll.tsx
-import { jsx as jsx79, Fragment as Fragment80 } from "react/jsx-runtime";
-var cliFlag85 = "webpack-poll";
+import { jsx as jsx80, Fragment as Fragment81 } from "react/jsx-runtime";
+var cliFlag86 = "webpack-poll";
 var webpackPolling = null;
 var webpackPollOption = {
   name: "Webpack Polling",
-  cliFlag: cliFlag85,
-  description: () => /* @__PURE__ */ jsx79(Fragment80, {
+  cliFlag: cliFlag86,
+  description: () => /* @__PURE__ */ jsx80(Fragment81, {
     children: "Enables Webpack polling instead of the file system event listeners for hot reloading. This is useful if you are inside a virtual machine or have a remote file system. Pass a value in milliseconds."
   }),
   ssrName: null,
   docLink: "https://www.remotion.dev/docs/config#setwebpackpollinginmilliseconds",
   getValue: ({ commandLine }) => {
-    if (commandLine[cliFlag85] !== undefined) {
-      const val = commandLine[cliFlag85];
+    if (commandLine[cliFlag86] !== undefined) {
+      const val = commandLine[cliFlag86];
       if (typeof val !== "number") {
         throw new TypeError(`Webpack polling must be a number, got ${JSON.stringify(val)}`);
       }
@@ -4780,11 +4811,11 @@ var webpackPollOption = {
     webpackPolling = value3;
   },
   type: 0,
-  id: cliFlag85
+  id: cliFlag86
 };
 
 // src/options/x264-preset.tsx
-import { jsx as jsx80, jsxs as jsxs54, Fragment as Fragment81 } from "react/jsx-runtime";
+import { jsx as jsx81, jsxs as jsxs54, Fragment as Fragment82 } from "react/jsx-runtime";
 var x264PresetOptions = [
   "ultrafast",
   "superfast",
@@ -4798,63 +4829,63 @@ var x264PresetOptions = [
   "placebo"
 ];
 var preset = null;
-var cliFlag86 = "x264-preset";
+var cliFlag87 = "x264-preset";
 var DEFAULT_PRESET = "medium";
 var x264Option = {
   name: "x264 Preset",
-  cliFlag: cliFlag86,
-  description: () => /* @__PURE__ */ jsxs54(Fragment81, {
+  cliFlag: cliFlag87,
+  description: () => /* @__PURE__ */ jsxs54(Fragment82, {
     children: [
       "Sets a x264 preset profile. Only applies to videos rendered with",
       " ",
-      /* @__PURE__ */ jsx80("code", {
+      /* @__PURE__ */ jsx81("code", {
         children: "h264"
       }),
       " codec.",
-      /* @__PURE__ */ jsx80("br", {}),
+      /* @__PURE__ */ jsx81("br", {}),
       "Possible values: ",
-      /* @__PURE__ */ jsx80("code", {
+      /* @__PURE__ */ jsx81("code", {
         children: "superfast"
       }),
       ", ",
-      /* @__PURE__ */ jsx80("code", {
+      /* @__PURE__ */ jsx81("code", {
         children: "veryfast"
       }),
       ",",
       " ",
-      /* @__PURE__ */ jsx80("code", {
+      /* @__PURE__ */ jsx81("code", {
         children: "faster"
       }),
       ", ",
-      /* @__PURE__ */ jsx80("code", {
+      /* @__PURE__ */ jsx81("code", {
         children: "fast"
       }),
       ", ",
-      /* @__PURE__ */ jsx80("code", {
+      /* @__PURE__ */ jsx81("code", {
         children: "medium"
       }),
       ",",
       " ",
-      /* @__PURE__ */ jsx80("code", {
+      /* @__PURE__ */ jsx81("code", {
         children: "slow"
       }),
       ", ",
-      /* @__PURE__ */ jsx80("code", {
+      /* @__PURE__ */ jsx81("code", {
         children: "slower"
       }),
       ", ",
-      /* @__PURE__ */ jsx80("code", {
+      /* @__PURE__ */ jsx81("code", {
         children: "veryslow"
       }),
       ",",
       " ",
-      /* @__PURE__ */ jsx80("code", {
+      /* @__PURE__ */ jsx81("code", {
         children: "placebo"
       }),
       ".",
-      /* @__PURE__ */ jsx80("br", {}),
+      /* @__PURE__ */ jsx81("br", {}),
       "Default: ",
-      /* @__PURE__ */ jsx80("code", {
+      /* @__PURE__ */ jsx81("code", {
         children: DEFAULT_PRESET
       })
     ]
@@ -4863,7 +4894,7 @@ var x264Option = {
   docLink: "https://www.remotion.dev/docs/renderer/render-media",
   type: "fast",
   getValue: ({ commandLine }) => {
-    const value3 = commandLine[cliFlag86];
+    const value3 = commandLine[cliFlag87];
     if (typeof value3 !== "undefined") {
       return { value: value3, source: "cli" };
     }
@@ -4875,7 +4906,7 @@ var x264Option = {
   setConfig: (profile) => {
     preset = profile;
   },
-  id: cliFlag86
+  id: cliFlag87
 };
 
 // src/options/index.tsx
@@ -4941,6 +4972,7 @@ var allOptions = {
   isProductionOption,
   askAIOption,
   experimentalClientSideRenderingOption,
+  experimentalVisualModeOption,
   keyboardShortcutsOption,
   framesOption,
   forceNewStudioOption,