remotion 4.0.373 → 4.0.375

package/dist/cjs/RemotionRoot.js

@@ -5,7 +5,6 @@ const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = require("react");
 const EditorProps_js_1 = require("./EditorProps.js");
 const RenderAssetManager_js_1 = require("./RenderAssetManager.js");
-const ResolveCompositionConfig_js_1 = require("./ResolveCompositionConfig.js");
 const SequenceManager_js_1 = require("./SequenceManager.js");
 const TimelineContext_js_1 = require("./TimelineContext.js");
 const shared_audio_tags_js_1 = require("./audio/shared-audio-tags.js");
@@ -47,6 +46,6 @@ const RemotionRoot = ({ children, numberOfAudioTags, logLevel, audioLatencyHint,
     const logging = (0, react_1.useMemo)(() => {
         return { logLevel, mountTime: Date.now() };
     }, [logLevel]);
-    return ((0, jsx_runtime_1.jsx)(log_level_context_js_1.LogLevelContext.Provider, { value: logging, children: (0, jsx_runtime_1.jsx)(nonce_js_1.NonceContext.Provider, { value: nonceContext, children: (0, jsx_runtime_1.jsx)(nonce_js_1.SetNonceContext.Provider, { value: setNonceContext, children: (0, jsx_runtime_1.jsx)(TimelineContext_js_1.TimelineContextProvider, { frameState: frameState, children: (0, jsx_runtime_1.jsx)(use_media_enabled_js_1.MediaEnabledProvider, { videoEnabled: videoEnabled, audioEnabled: audioEnabled, children: (0, jsx_runtime_1.jsx)(EditorProps_js_1.EditorPropsProvider, { children: (0, jsx_runtime_1.jsx)(prefetch_state_js_1.PrefetchProvider, { children: (0, jsx_runtime_1.jsx)(SequenceManager_js_1.SequenceManagerProvider, { children: (0, jsx_runtime_1.jsx)(RenderAssetManager_js_1.RenderAssetManagerProvider, { children: (0, jsx_runtime_1.jsx)(ResolveCompositionConfig_js_1.ResolveCompositionConfig, { children: (0, jsx_runtime_1.jsx)(shared_audio_tags_js_1.SharedAudioContextProvider, { numberOfAudioTags: numberOfAudioTags, audioLatencyHint: audioLatencyHint, children: (0, jsx_runtime_1.jsx)(duration_state_js_1.DurationsContextProvider, { children: (0, jsx_runtime_1.jsx)(buffering_js_1.BufferingProvider, { children: children }) }) }) }) }) }) }) }) }) }) }) }) }));
+    return ((0, jsx_runtime_1.jsx)(log_level_context_js_1.LogLevelContext.Provider, { value: logging, children: (0, jsx_runtime_1.jsx)(nonce_js_1.NonceContext.Provider, { value: nonceContext, children: (0, jsx_runtime_1.jsx)(nonce_js_1.SetNonceContext.Provider, { value: setNonceContext, children: (0, jsx_runtime_1.jsx)(TimelineContext_js_1.TimelineContextProvider, { frameState: frameState, children: (0, jsx_runtime_1.jsx)(use_media_enabled_js_1.MediaEnabledProvider, { videoEnabled: videoEnabled, audioEnabled: audioEnabled, children: (0, jsx_runtime_1.jsx)(EditorProps_js_1.EditorPropsProvider, { children: (0, jsx_runtime_1.jsx)(prefetch_state_js_1.PrefetchProvider, { children: (0, jsx_runtime_1.jsx)(SequenceManager_js_1.SequenceManagerProvider, { children: (0, jsx_runtime_1.jsx)(RenderAssetManager_js_1.RenderAssetManagerProvider, { children: (0, jsx_runtime_1.jsx)(shared_audio_tags_js_1.SharedAudioContextProvider, { numberOfAudioTags: numberOfAudioTags, audioLatencyHint: audioLatencyHint, children: (0, jsx_runtime_1.jsx)(duration_state_js_1.DurationsContextProvider, { children: (0, jsx_runtime_1.jsx)(buffering_js_1.BufferingProvider, { children: children }) }) }) }) }) }) }) }) }) }) }) }));
 };
 exports.RemotionRoot = RemotionRoot;

package/dist/cjs/ResolveCompositionConfig.d.ts

@@ -21,7 +21,7 @@ type VideoConfigState = {
 };
 export declare const needsResolution: (composition: AnyComposition) => boolean;
 export declare const PROPS_UPDATED_EXTERNALLY = "remotion.propsUpdatedExternally";
-export declare const ResolveCompositionConfig: React.FC<PropsWithChildren<{
+export declare const ResolveCompositionConfigInStudio: React.FC<PropsWithChildren<{
     children: React.ReactNode;
 }>>;
 export declare const useResolvedVideoConfig: (preferredCompositionId: string | null) => VideoConfigState | null;

package/dist/cjs/ResolveCompositionConfig.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.useResolvedVideoConfig = exports.ResolveCompositionConfig = exports.PROPS_UPDATED_EXTERNALLY = exports.needsResolution = exports.resolveCompositionsRef = exports.ResolveCompositionContext = void 0;
+exports.useResolvedVideoConfig = exports.ResolveCompositionConfigInStudio = exports.PROPS_UPDATED_EXTERNALLY = exports.needsResolution = exports.resolveCompositionsRef = exports.ResolveCompositionContext = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = require("react");
 const CompositionManagerContext_js_1 = require("./CompositionManagerContext.js");
@@ -19,7 +19,7 @@ const needsResolution = (composition) => {
 };
 exports.needsResolution = needsResolution;
 exports.PROPS_UPDATED_EXTERNALLY = 'remotion.propsUpdatedExternally';
-const ResolveCompositionConfig = ({ children }) => {
+const ResolveCompositionConfigInStudio = ({ children }) => {
     const [currentRenderModalComposition, setCurrentRenderModalComposition] = (0, react_1.useState)(null);
     const { compositions, canvasContent, currentCompositionMetadata } = (0, react_1.useContext)(CompositionManagerContext_js_1.CompositionManager);
     const { fastRefreshes, manualRefreshes } = (0, react_1.useContext)(nonce_js_1.NonceContext);
@@ -286,7 +286,7 @@ const ResolveCompositionConfig = ({ children }) => {
     }, [compositions, resolvedConfigs]);
     return ((0, jsx_runtime_1.jsx)(exports.ResolveCompositionContext.Provider, { value: resolvedConfigsIncludingStaticOnes, children: children }));
 };
-exports.ResolveCompositionConfig = ResolveCompositionConfig;
+exports.ResolveCompositionConfigInStudio = ResolveCompositionConfigInStudio;
 const useResolvedVideoConfig = (preferredCompositionId) => {
     const context = (0, react_1.useContext)(exports.ResolveCompositionContext);
     const { props: allEditorProps } = (0, react_1.useContext)(EditorProps_js_1.EditorPropsContext);
@@ -334,7 +334,11 @@ const useResolvedVideoConfig = (preferredCompositionId) => {
                     props: {
                         ...((_c = composition.defaultProps) !== null && _c !== void 0 ? _c : {}),
                         ...(selectedEditorProps !== null && selectedEditorProps !== void 0 ? selectedEditorProps : {}),
-                        ...(typeof window === 'undefined' || env.isPlayer
+                        ...(typeof window === 'undefined' ||
+                            env.isPlayer ||
+                            // In tests, we don't set window.remotion_inputProps,
+                            // otherwise it should be available here
+                            !window.remotion_inputProps
                             ? {}
                             : ((_d = (0, input_props_js_1.getInputProps)()) !== null && _d !== void 0 ? _d : {})),
                     },
@@ -346,6 +350,10 @@ const useResolvedVideoConfig = (preferredCompositionId) => {
                 },
             };
         }
+        // Could be the case in selectComposition()
+        if (!context) {
+            return null;
+        }
         if (!context[composition.id]) {
             return null;
         }

package/dist/cjs/cancel-render.d.ts

@@ -1 +1,8 @@
+import type { DelayRenderScope } from './delay-render.js';
+/**
+ * Internal function that accepts scope as parameter.
+ * This allows useDelayRender to control its own scope source.
+ * @private
+ */
+export declare function cancelRenderInternal(scope: DelayRenderScope | undefined, err: unknown): never;
 export declare function cancelRender(err: unknown): never;

package/dist/cjs/cancel-render.js

@@ -1,5 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.cancelRenderInternal = cancelRenderInternal;
 exports.cancelRender = cancelRender;
 const isErrorLike = (err) => {
     if (err instanceof Error) {
@@ -29,11 +30,12 @@ const isErrorLike = (err) => {
     }
     return true;
 };
-/*
- * @description When you invoke this function, Remotion will stop rendering all the frames without any retries.
- * @see [Documentation](https://remotion.dev/docs/cancel-render)
+/**
+ * Internal function that accepts scope as parameter.
+ * This allows useDelayRender to control its own scope source.
+ * @private
  */
-function cancelRender(err) {
+function cancelRenderInternal(scope, err) {
     let error;
     if (isErrorLike(err)) {
         error = err;
@@ -47,6 +49,15 @@ function cancelRender(err) {
     else {
         error = Error('Rendering was cancelled');
     }
-    window.remotion_cancelledError = error.stack;
+    if (scope) {
+        scope.remotion_cancelledError = error.stack;
+    }
     throw error;
 }
+/*
+ * @description When you invoke this function, Remotion will stop rendering all the frames without any retries.
+ * @see [Documentation](https://remotion.dev/docs/cancel-render)
+ */
+function cancelRender(err) {
+    return cancelRenderInternal(typeof window !== 'undefined' ? window : undefined, err);
+}

package/dist/cjs/config/input-props.js

@@ -29,6 +29,10 @@ const getInputProps = () => {
     if (override) {
         return override;
     }
+    if (typeof window === 'undefined' ||
+        typeof window.remotion_inputProps === 'undefined') {
+        throw new Error('Cannot call `getInputProps()` - window.remotion_inputProps is not set. This API is only available if you are in the Studio, or while you are rendering server-side.');
+    }
     const param = window.remotion_inputProps;
     if (!param) {
         return {};

package/dist/cjs/delay-render.d.ts

@@ -1,3 +1,4 @@
+import type { LogLevel } from './log.js';
 import type { RemotionEnvironment } from './remotion-environment-context.js';
 export type DelayRenderScope = {
     remotion_renderReady: boolean;
@@ -10,6 +11,7 @@ export type DelayRenderScope = {
     };
     remotion_puppeteerTimeout: number;
     remotion_attempt: number;
+    remotion_cancelledError?: string;
 };
 export declare const DELAY_RENDER_CALLSTACK_TOKEN = "The delayRender was called:";
 export declare const DELAY_RENDER_RETRIES_LEFT = "Retries left: ";
@@ -24,11 +26,21 @@ export type DelayRenderOptions = {
  * This allows useDelayRender to control its own environment source.
  * @private
  */
-export declare const delayRenderInternal: (scope: DelayRenderScope | undefined, environment: RemotionEnvironment, label?: string, options?: DelayRenderOptions) => number;
+export declare const delayRenderInternal: ({ scope, environment, label, options, }: {
+    scope: DelayRenderScope | undefined;
+    environment: RemotionEnvironment;
+    label: string | null;
+    options: DelayRenderOptions;
+}) => number;
 export declare const delayRender: (label?: string, options?: DelayRenderOptions) => number;
 /**
  * Internal function that accepts environment as parameter.
  * @private
  */
-export declare const continueRenderInternal: (scope: DelayRenderScope | undefined, handle: number, environment: RemotionEnvironment) => void;
+export declare const continueRenderInternal: ({ scope, handle, environment, logLevel, }: {
+    scope: DelayRenderScope | undefined;
+    handle: number;
+    environment: RemotionEnvironment;
+    logLevel: LogLevel;
+}) => void;
 export declare const continueRender: (handle: number) => void;

package/dist/cjs/delay-render.js

@@ -22,9 +22,9 @@ const defaultTimeout = 30000;
  * This allows useDelayRender to control its own environment source.
  * @private
  */
-const delayRenderInternal = (scope, environment, label, options) => {
+const delayRenderInternal = ({ scope, environment, label, options, }) => {
     var _a, _b, _c, _d, _e;
-    if (typeof label !== 'string' && typeof label !== 'undefined') {
+    if (typeof label !== 'string' && label !== null) {
         throw new Error('The label parameter of delayRender() must be a string or undefined, got: ' +
             JSON.stringify(label));
     }
@@ -52,7 +52,7 @@ const delayRenderInternal = (scope, environment, label, options) => {
                     ]
                         .filter(truthy_js_1.truthy)
                         .join(' ');
-                    (0, cancel_render_js_1.cancelRender)(Error(message));
+                    (0, cancel_render_js_1.cancelRenderInternal)(scope, Error(message));
                 }, timeoutToUse),
             };
         }
@@ -68,14 +68,19 @@ exports.delayRenderInternal = delayRenderInternal;
  * @see [Documentation](https://remotion.dev/docs/delay-render)
  */
 const delayRender = (label, options) => {
-    return (0, exports.delayRenderInternal)(typeof window !== 'undefined' ? window : undefined, (0, get_remotion_environment_js_1.getRemotionEnvironment)(), label, options);
+    return (0, exports.delayRenderInternal)({
+        scope: typeof window !== 'undefined' ? window : undefined,
+        environment: (0, get_remotion_environment_js_1.getRemotionEnvironment)(),
+        label: label !== null && label !== void 0 ? label : null,
+        options: options !== null && options !== void 0 ? options : {},
+    });
 };
 exports.delayRender = delayRender;
 /**
  * Internal function that accepts environment as parameter.
  * @private
  */
-const continueRenderInternal = (scope, handle, environment) => {
+const continueRenderInternal = ({ scope, handle, environment, logLevel, }) => {
     if (typeof handle === 'undefined') {
         throw new TypeError('The continueRender() method must be called with a parameter that is the return value of delayRender(). No value was passed.');
     }
@@ -98,9 +103,7 @@ const continueRenderInternal = (scope, handle, environment) => {
                 ]
                     .filter(truthy_js_1.truthy)
                     .join(' ');
-                log_js_1.Log.verbose(
-                // TODO: Scope logLevel
-                { logLevel: window.remotion_logLevel, tag: 'delayRender()' }, message);
+                log_js_1.Log.verbose({ logLevel, tag: 'delayRender()' }, message);
                 delete scope.remotion_delayRenderTimeouts[handle];
             }
             return false;
@@ -117,6 +120,14 @@ exports.continueRenderInternal = continueRenderInternal;
  * @see [Documentation](https://remotion.dev/docs/continue-render)
  */
 const continueRender = (handle) => {
-    (0, exports.continueRenderInternal)(typeof window !== 'undefined' ? window : undefined, handle, (0, get_remotion_environment_js_1.getRemotionEnvironment)());
+    var _a;
+    (0, exports.continueRenderInternal)({
+        scope: typeof window !== 'undefined' ? window : undefined,
+        handle,
+        environment: (0, get_remotion_environment_js_1.getRemotionEnvironment)(),
+        logLevel: typeof window !== 'undefined'
+            ? ((_a = window.remotion_logLevel) !== null && _a !== void 0 ? _a : 'info')
+            : 'info',
+    });
 };
 exports.continueRender = continueRender;

package/dist/cjs/internals.d.ts

@@ -215,7 +215,7 @@ export declare const Internals: {
         setCurrentRenderModalComposition: (compositionId: string | null) => void;
         reloadCurrentlySelectedComposition: () => void;
     } | null>;
-    readonly ResolveCompositionConfig: import("react").FC<import("react").PropsWithChildren<{
+    readonly ResolveCompositionConfigInStudio: import("react").FC<import("react").PropsWithChildren<{
         children: React.ReactNode;
     }>>;
     readonly REMOTION_STUDIO_CONTAINER_ELEMENT: "__remotion-studio-container";

package/dist/cjs/internals.js

@@ -153,7 +153,7 @@ exports.Internals = {
     resolveVideoConfig: resolve_video_config_js_1.resolveVideoConfig,
     useResolvedVideoConfig: ResolveCompositionConfig_js_1.useResolvedVideoConfig,
     resolveCompositionsRef: ResolveCompositionConfig_js_1.resolveCompositionsRef,
-    ResolveCompositionConfig: ResolveCompositionConfig_js_1.ResolveCompositionConfig,
+    ResolveCompositionConfigInStudio: ResolveCompositionConfig_js_1.ResolveCompositionConfigInStudio,
     REMOTION_STUDIO_CONTAINER_ELEMENT: get_preview_dom_element_js_1.REMOTION_STUDIO_CONTAINER_ELEMENT,
     RenderAssetManager: RenderAssetManager_js_1.RenderAssetManager,
     persistCurrentFrame: timeline_position_state_js_1.persistCurrentFrame,

package/dist/cjs/use-delay-render.d.ts

@@ -1,9 +1,11 @@
 import type { DelayRenderOptions, DelayRenderScope } from './delay-render.js';
 type DelayRenderFn = (label?: string, options?: DelayRenderOptions) => number;
 type ContinueRenderFn = (handle: number) => void;
+type CancelRenderFn = (err: unknown) => never;
 export declare const DelayRenderContextType: import("react").Context<DelayRenderScope | null>;
 export declare const useDelayRender: () => {
     delayRender: DelayRenderFn;
     continueRender: ContinueRenderFn;
+    cancelRender: CancelRenderFn;
 };
 export {};

package/dist/cjs/use-delay-render.js

@@ -2,18 +2,34 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.useDelayRender = exports.DelayRenderContextType = void 0;
 const react_1 = require("react");
+const cancel_render_js_1 = require("./cancel-render.js");
 const delay_render_js_1 = require("./delay-render.js");
+const log_level_context_js_1 = require("./log-level-context.js");
 const use_remotion_environment_js_1 = require("./use-remotion-environment.js");
 exports.DelayRenderContextType = (0, react_1.createContext)(null);
 const useDelayRender = () => {
     const environment = (0, use_remotion_environment_js_1.useRemotionEnvironment)();
     const scope = (0, react_1.useContext)(exports.DelayRenderContextType);
+    const logLevel = (0, log_level_context_js_1.useLogLevel)();
     const delayRender = (0, react_1.useCallback)((label, options) => {
-        return (0, delay_render_js_1.delayRenderInternal)(scope !== null && scope !== void 0 ? scope : (typeof window !== 'undefined' ? window : undefined), environment, label, options);
+        return (0, delay_render_js_1.delayRenderInternal)({
+            scope: scope !== null && scope !== void 0 ? scope : (typeof window !== 'undefined' ? window : undefined),
+            environment,
+            label: label !== null && label !== void 0 ? label : null,
+            options: options !== null && options !== void 0 ? options : {},
+        });
     }, [environment, scope]);
     const continueRender = (0, react_1.useCallback)((handle) => {
-        (0, delay_render_js_1.continueRenderInternal)(scope !== null && scope !== void 0 ? scope : (typeof window !== 'undefined' ? window : undefined), handle, environment);
-    }, [environment, scope]);
-    return { delayRender, continueRender };
+        (0, delay_render_js_1.continueRenderInternal)({
+            scope: scope !== null && scope !== void 0 ? scope : (typeof window !== 'undefined' ? window : undefined),
+            handle,
+            environment,
+            logLevel,
+        });
+    }, [environment, logLevel, scope]);
+    const cancelRender = (0, react_1.useCallback)((err) => {
+        return (0, cancel_render_js_1.cancelRenderInternal)(scope !== null && scope !== void 0 ? scope : (typeof window !== 'undefined' ? window : undefined), err);
+    }, [scope]);
+    return { delayRender, continueRender, cancelRender };
 };
 exports.useDelayRender = useDelayRender;

package/dist/cjs/version.d.ts

@@ -3,4 +3,4 @@
  * @see [Documentation](https://remotion.dev/docs/version)
  * @returns {string} The current version of the remotion package
  */
-export declare const VERSION = "4.0.373";
+export declare const VERSION = "4.0.375";

package/dist/cjs/version.js

@@ -7,4 +7,4 @@ exports.VERSION = void 0;
  * @see [Documentation](https://remotion.dev/docs/version)
  * @returns {string} The current version of the remotion package
  */
-exports.VERSION = '4.0.373';
+exports.VERSION = '4.0.375';

package/dist/esm/index.mjs

@@ -110,7 +110,7 @@ function truthy(value) {
 }
 
 // src/version.ts
-var VERSION = "4.0.373";
+var VERSION = "4.0.375";
 
 // src/multiple-versions-warning.ts
 var checkMultipleRemotionVersions = () => {
@@ -149,7 +149,7 @@ var Null = () => {
 // src/Sequence.tsx
 import {
   forwardRef as forwardRef2,
-  useContext as useContext12,
+  useContext as useContext13,
   useEffect as useEffect3,
   useMemo as useMemo10,
   useState as useState6
@@ -308,7 +308,7 @@ var SequenceManagerProvider = ({ children }) => {
 
 // src/TimelineContext.tsx
 import {
-  createContext as createContext9,
+  createContext as createContext10,
   useLayoutEffect,
   useMemo as useMemo7,
   useRef as useRef2,
@@ -586,6 +586,9 @@ var getInputProps = () => {
   if (override) {
     return override;
   }
+  if (typeof window === "undefined" || typeof window.remotion_inputProps === "undefined") {
+    throw new Error("Cannot call `getInputProps()` - window.remotion_inputProps is not set. This API is only available if you are in the Studio, or while you are rendering server-side.");
+  }
   const param = window.remotion_inputProps;
   if (!param) {
     return {};
@@ -854,7 +857,7 @@ var needsResolution = (composition) => {
   return Boolean(composition.calculateMetadata);
 };
 var PROPS_UPDATED_EXTERNALLY = "remotion.propsUpdatedExternally";
-var ResolveCompositionConfig = ({ children }) => {
+var ResolveCompositionConfigInStudio = ({ children }) => {
   const [currentRenderModalComposition, setCurrentRenderModalComposition] = useState4(null);
   const { compositions, canvasContent, currentCompositionMetadata } = useContext4(CompositionManager);
   const { fastRefreshes, manualRefreshes } = useContext4(NonceContext);
@@ -1151,7 +1154,7 @@ var useResolvedVideoConfig = (preferredCompositionId) => {
           props: {
             ...composition.defaultProps ?? {},
             ...selectedEditorProps ?? {},
-            ...typeof window === "undefined" || env.isPlayer ? {} : getInputProps() ?? {}
+            ...typeof window === "undefined" || env.isPlayer || !window.remotion_inputProps ? {} : getInputProps() ?? {}
           },
           defaultCodec: null,
           defaultOutName: null,
@@ -1161,6 +1164,9 @@ var useResolvedVideoConfig = (preferredCompositionId) => {
         }
       };
     }
+    if (!context) {
+      return null;
+    }
     if (!context[composition.id]) {
       return null;
     }
@@ -1248,7 +1254,7 @@ var usePlayingState = () => {
 };
 
 // src/use-delay-render.tsx
-import { createContext as createContext8, useCallback as useCallback4, useContext as useContext7 } from "react";
+import { createContext as createContext9, useCallback as useCallback4, useContext as useContext8 } from "react";
 
 // src/cancel-render.ts
 var isErrorLike = (err) => {
@@ -1275,7 +1281,7 @@ var isErrorLike = (err) => {
   }
   return true;
 };
-function cancelRender(err) {
+function cancelRenderInternal(scope, err) {
   let error;
   if (isErrorLike(err)) {
     error = err;
@@ -1287,9 +1293,14 @@ function cancelRender(err) {
   } else {
     error = Error("Rendering was cancelled");
   }
-  window.remotion_cancelledError = error.stack;
+  if (scope) {
+    scope.remotion_cancelledError = error.stack;
+  }
   throw error;
 }
+function cancelRender(err) {
+  return cancelRenderInternal(typeof window !== "undefined" ? window : undefined, err);
+}
 
 // src/log.ts
 var logLevels = ["trace", "verbose", "info", "warn", "error"];
@@ -1357,8 +1368,13 @@ var DELAY_RENDER_RETRIES_LEFT = "Retries left: ";
 var DELAY_RENDER_RETRY_TOKEN = "- Rendering the frame will be retried.";
 var DELAY_RENDER_CLEAR_TOKEN = "handle was cleared after";
 var defaultTimeout = 30000;
-var delayRenderInternal = (scope, environment, label, options) => {
-  if (typeof label !== "string" && typeof label !== "undefined") {
+var delayRenderInternal = ({
+  scope,
+  environment,
+  label,
+  options
+}) => {
+  if (typeof label !== "string" && label !== null) {
     throw new Error("The label parameter of delayRender() must be a string or undefined, got: " + JSON.stringify(label));
   }
   const handle = Math.random();
@@ -1381,7 +1397,7 @@ var delayRenderInternal = (scope, environment, label, options) => {
             DELAY_RENDER_CALLSTACK_TOKEN,
             called
           ].filter(truthy).join(" ");
-          cancelRender(Error(message));
+          cancelRenderInternal(scope, Error(message));
         }, timeoutToUse)
       };
     }
@@ -1392,9 +1408,19 @@ var delayRenderInternal = (scope, environment, label, options) => {
   return handle;
 };
 var delayRender = (label, options) => {
-  return delayRenderInternal(typeof window !== "undefined" ? window : undefined, getRemotionEnvironment(), label, options);
+  return delayRenderInternal({
+    scope: typeof window !== "undefined" ? window : undefined,
+    environment: getRemotionEnvironment(),
+    label: label ?? null,
+    options: options ?? {}
+  });
 };
-var continueRenderInternal = (scope, handle, environment) => {
+var continueRenderInternal = ({
+  scope,
+  handle,
+  environment,
+  logLevel
+}) => {
   if (typeof handle === "undefined") {
     throw new TypeError("The continueRender() method must be called with a parameter that is the return value of delayRender(). No value was passed.");
   }
@@ -1414,7 +1440,7 @@ var continueRenderInternal = (scope, handle, environment) => {
           DELAY_RENDER_CLEAR_TOKEN,
           `${Date.now() - startTime}ms`
         ].filter(truthy).join(" ");
-        Log.verbose({ logLevel: window.remotion_logLevel, tag: "delayRender()" }, message);
+        Log.verbose({ logLevel, tag: "delayRender()" }, message);
         delete scope.remotion_delayRenderTimeouts[handle];
       }
       return false;
@@ -1426,26 +1452,67 @@ var continueRenderInternal = (scope, handle, environment) => {
   }
 };
 var continueRender = (handle) => {
-  continueRenderInternal(typeof window !== "undefined" ? window : undefined, handle, getRemotionEnvironment());
+  continueRenderInternal({
+    scope: typeof window !== "undefined" ? window : undefined,
+    handle,
+    environment: getRemotionEnvironment(),
+    logLevel: typeof window !== "undefined" ? window.remotion_logLevel ?? "info" : "info"
+  });
+};
+
+// src/log-level-context.tsx
+import { createContext as createContext8 } from "react";
+import * as React6 from "react";
+var LogLevelContext = createContext8({
+  logLevel: "info",
+  mountTime: 0
+});
+var useLogLevel = () => {
+  const { logLevel } = React6.useContext(LogLevelContext);
+  if (logLevel === null) {
+    throw new Error("useLogLevel must be used within a LogLevelProvider");
+  }
+  return logLevel;
+};
+var useMountTime = () => {
+  const { mountTime } = React6.useContext(LogLevelContext);
+  if (mountTime === null) {
+    throw new Error("useMountTime must be used within a LogLevelProvider");
+  }
+  return mountTime;
 };
 
 // src/use-delay-render.tsx
-var DelayRenderContextType = createContext8(null);
+var DelayRenderContextType = createContext9(null);
 var useDelayRender = () => {
   const environment = useRemotionEnvironment();
-  const scope = useContext7(DelayRenderContextType);
+  const scope = useContext8(DelayRenderContextType);
+  const logLevel = useLogLevel();
   const delayRender2 = useCallback4((label, options) => {
-    return delayRenderInternal(scope ?? (typeof window !== "undefined" ? window : undefined), environment, label, options);
+    return delayRenderInternal({
+      scope: scope ?? (typeof window !== "undefined" ? window : undefined),
+      environment,
+      label: label ?? null,
+      options: options ?? {}
+    });
   }, [environment, scope]);
   const continueRender2 = useCallback4((handle) => {
-    continueRenderInternal(scope ?? (typeof window !== "undefined" ? window : undefined), handle, environment);
-  }, [environment, scope]);
-  return { delayRender: delayRender2, continueRender: continueRender2 };
+    continueRenderInternal({
+      scope: scope ?? (typeof window !== "undefined" ? window : undefined),
+      handle,
+      environment,
+      logLevel
+    });
+  }, [environment, logLevel, scope]);
+  const cancelRender2 = useCallback4((err) => {
+    return cancelRenderInternal(scope ?? (typeof window !== "undefined" ? window : undefined), err);
+  }, [scope]);
+  return { delayRender: delayRender2, continueRender: continueRender2, cancelRender: cancelRender2 };
 };
 
 // src/TimelineContext.tsx
 import { jsx as jsx6 } from "react/jsx-runtime";
-var SetTimelineContext = createContext9({
+var SetTimelineContext = createContext10({
   setFrame: () => {
     throw new Error("default");
   },
@@ -1453,7 +1520,7 @@ var SetTimelineContext = createContext9({
     throw new Error("default");
   }
 });
-var TimelineContext = createContext9({
+var TimelineContext = createContext10({
   frame: {},
   playing: false,
   playbackRate: 1,
@@ -1528,12 +1595,12 @@ var TimelineContextProvider = ({ children, frameState }) => {
 };
 
 // src/use-video-config.ts
-import { useContext as useContext9 } from "react";
+import { useContext as useContext10 } from "react";
 
 // src/CanUseRemotionHooks.tsx
-import { createContext as createContext10 } from "react";
+import { createContext as createContext11 } from "react";
 import { jsx as jsx7 } from "react/jsx-runtime";
-var CanUseRemotionHooks = createContext10(false);
+var CanUseRemotionHooks = createContext11(false);
 var CanUseRemotionHooksProvider = ({ children }) => {
   return /* @__PURE__ */ jsx7(CanUseRemotionHooks.Provider, {
     value: true,
@@ -1542,9 +1609,9 @@ var CanUseRemotionHooksProvider = ({ children }) => {
 };
 
 // src/use-unsafe-video-config.ts
-import { useContext as useContext8, useMemo as useMemo8 } from "react";
+import { useContext as useContext9, useMemo as useMemo8 } from "react";
 var useUnsafeVideoConfig = () => {
-  const context = useContext8(SequenceContext);
+  const context = useContext9(SequenceContext);
   const ctxWidth = context?.width ?? null;
   const ctxHeight = context?.height ?? null;
   const ctxDuration = context?.durationInFrames ?? null;
@@ -1587,7 +1654,7 @@ var useUnsafeVideoConfig = () => {
 // src/use-video-config.ts
 var useVideoConfig = () => {
   const videoConfig = useUnsafeVideoConfig();
-  const context = useContext9(CanUseRemotionHooks);
+  const context = useContext10(CanUseRemotionHooks);
   const isPlayer = useIsPlayer();
   if (!videoConfig) {
     if (typeof window !== "undefined" && window.remotion_isPlayer || isPlayer) {
@@ -1606,12 +1673,12 @@ var useVideoConfig = () => {
 };
 
 // src/freeze.tsx
-import { useContext as useContext11, useMemo as useMemo9 } from "react";
+import { useContext as useContext12, useMemo as useMemo9 } from "react";
 
 // src/use-current-frame.ts
-import { useContext as useContext10 } from "react";
+import { useContext as useContext11 } from "react";
 var useCurrentFrame = () => {
-  const canUseRemotionHooks = useContext10(CanUseRemotionHooks);
+  const canUseRemotionHooks = useContext11(CanUseRemotionHooks);
   const env = useRemotionEnvironment();
   if (!canUseRemotionHooks) {
     if (env.isPlayer) {
@@ -1620,7 +1687,7 @@ var useCurrentFrame = () => {
     throw new Error(`useCurrentFrame() can only be called inside a component that was registered as a composition. See https://www.remotion.dev/docs/the-fundamentals#defining-compositions`);
   }
   const frame = useTimelinePosition();
-  const context = useContext10(SequenceContext);
+  const context = useContext11(SequenceContext);
   const contextOffset = context ? context.cumulatedFrom + context.relativeFrom : 0;
   return frame - contextOffset;
 };
@@ -1654,8 +1721,8 @@ var Freeze = ({
       return active(frame);
     }
   }, [active, frame]);
-  const timelineContext = useContext11(TimelineContext);
-  const sequenceContext = useContext11(SequenceContext);
+  const timelineContext = useContext12(TimelineContext);
+  const sequenceContext = useContext12(SequenceContext);
   const relativeFrom = sequenceContext?.relativeFrom ?? 0;
   const timelineValue = useMemo9(() => {
     if (!isActive) {
@@ -1712,8 +1779,8 @@ var RegularSequenceRefForwardingFunction = ({
 }, ref) => {
   const { layout = "absolute-fill" } = other;
   const [id] = useState6(() => String(Math.random()));
-  const parentSequence = useContext12(SequenceContext);
-  const { rootId } = useContext12(TimelineContext);
+  const parentSequence = useContext13(SequenceContext);
+  const { rootId } = useContext13(TimelineContext);
   const cumulatedFrom = parentSequence ? parentSequence.cumulatedFrom + parentSequence.relativeFrom : 0;
   const nonce = useNonce();
   if (layout !== "absolute-fill" && layout !== "none") {
@@ -1738,8 +1805,8 @@ var RegularSequenceRefForwardingFunction = ({
   const videoConfig = useVideoConfig();
   const parentSequenceDuration = parentSequence ? Math.min(parentSequence.durationInFrames - from, durationInFrames) : durationInFrames;
   const actualDurationInFrames = Math.max(0, Math.min(videoConfig.durationInFrames - from, parentSequenceDuration));
-  const { registerSequence, unregisterSequence } = useContext12(SequenceManager);
-  const { hidden } = useContext12(SequenceVisibilityToggleContext);
+  const { registerSequence, unregisterSequence } = useContext13(SequenceManager);
+  const { hidden } = useContext13(SequenceVisibilityToggleContext);
   const premounting = useMemo10(() => {
     return parentSequence?.premounting || Boolean(other._remotionInternalIsPremounting);
   }, [other._remotionInternalIsPremounting, parentSequence?.premounting]);
@@ -1926,7 +1993,7 @@ import {
 } from "react";
 
 // src/animated-image/canvas.tsx
-import React10, { useCallback as useCallback5, useImperativeHandle as useImperativeHandle3, useRef as useRef3 } from "react";
+import React11, { useCallback as useCallback5, useImperativeHandle as useImperativeHandle3, useRef as useRef3 } from "react";
 import { jsx as jsx10 } from "react/jsx-runtime";
 var calcArgs = (fit, frameSize, canvasSize) => {
   switch (fit) {
@@ -2023,7 +2090,7 @@ var CanvasRefForwardingFunction = ({ width, height, fit, className, style }, ref
     style
   });
 };
-var Canvas = React10.forwardRef(CanvasRefForwardingFunction);
+var Canvas = React11.forwardRef(CanvasRefForwardingFunction);
 
 // src/animated-image/decode-image.ts
 var CACHE_SIZE = 5;
@@ -2285,11 +2352,11 @@ var AnimatedImage = forwardRef3(({
   });
 });
 // src/Artifact.tsx
-import { useContext as useContext13, useEffect as useEffect5, useState as useState9 } from "react";
+import { useContext as useContext14, useEffect as useEffect5, useState as useState9 } from "react";
 
 // src/RenderAssetManager.tsx
 import {
-  createContext as createContext11,
+  createContext as createContext12,
   useCallback as useCallback6,
   useLayoutEffect as useLayoutEffect3,
   useMemo as useMemo11,
@@ -2329,7 +2396,7 @@ var validateRenderAsset = (artifact) => {
 
 // src/RenderAssetManager.tsx
 import { jsx as jsx12 } from "react/jsx-runtime";
-var RenderAssetManager = createContext11({
+var RenderAssetManager = createContext12({
   registerRenderAsset: () => {
     return;
   },
@@ -2375,7 +2442,7 @@ var RenderAssetManagerProvider = ({ children }) => {
 // src/Artifact.tsx
 var ArtifactThumbnail = Symbol("Thumbnail");
 var Artifact = ({ filename, content, downloadBehavior }) => {
-  const { registerRenderAsset, unregisterRenderAsset } = useContext13(RenderAssetManager);
+  const { registerRenderAsset, unregisterRenderAsset } = useContext14(RenderAssetManager);
   const env = useRemotionEnvironment();
   const frame = useCurrentFrame();
   const [id] = useState9(() => {
@@ -2464,11 +2531,11 @@ var calculateMediaDuration = ({
 };
 
 // src/loop/index.tsx
-import React11, { createContext as createContext12, useMemo as useMemo12 } from "react";
+import React12, { createContext as createContext13, useMemo as useMemo12 } from "react";
 import { jsx as jsx13 } from "react/jsx-runtime";
-var LoopContext = createContext12(null);
+var LoopContext = createContext13(null);
 var useLoop = () => {
-  return React11.useContext(LoopContext);
+  return React12.useContext(LoopContext);
 };
 var Loop = ({ durationInFrames, times = Infinity, children, name, ...props }) => {
   const currentFrame = useCurrentFrame();
@@ -2522,7 +2589,7 @@ var Loop = ({ durationInFrames, times = Infinity, children, name, ...props }) =>
 Loop.useLoop = useLoop;
 
 // src/prefetch.ts
-import { useContext as useContext14 } from "react";
+import { useContext as useContext15 } from "react";
 
 // src/playback-logging.ts
 var playbackLogging = ({
@@ -2536,9 +2603,9 @@ var playbackLogging = ({
 };
 
 // src/prefetch-state.tsx
-import { createContext as createContext13, useEffect as useEffect6, useState as useState10 } from "react";
+import { createContext as createContext14, useEffect as useEffect6, useState as useState10 } from "react";
 import { jsx as jsx14 } from "react/jsx-runtime";
-var PreloadContext = createContext13({});
+var PreloadContext = createContext14({});
 var preloads = {};
 var updaters = [];
 var setPreloads = (updater) => {
@@ -2578,7 +2645,7 @@ var getSrcWithoutHash = (src) => {
   return src.slice(0, hashIndex);
 };
 var usePreload = (src) => {
-  const preloads2 = useContext14(PreloadContext);
+  const preloads2 = useContext15(PreloadContext);
   const hashFragmentIndex = removeAndGetHashFragment(src);
   const withoutHashFragment = getSrcWithoutHash(src);
   if (!preloads2[withoutHashFragment]) {
@@ -2851,7 +2918,7 @@ var resolveTrimProps = ({
 };
 
 // src/video/duration-state.tsx
-import { createContext as createContext14, useMemo as useMemo13, useReducer } from "react";
+import { createContext as createContext15, useMemo as useMemo13, useReducer } from "react";
 import { jsx as jsx15 } from "react/jsx-runtime";
 var durationReducer = (state, action) => {
   switch (action.type) {
@@ -2869,7 +2936,7 @@ var durationReducer = (state, action) => {
       return state;
   }
 };
-var DurationsContext = createContext14({
+var DurationsContext = createContext15({
   durations: {},
   setDurations: () => {
     throw new Error("context missing");
@@ -2914,28 +2981,6 @@ var getCrossOriginValue = ({
   return;
 };
 
-// src/log-level-context.tsx
-import { createContext as createContext15 } from "react";
-import * as React14 from "react";
-var LogLevelContext = createContext15({
-  logLevel: "info",
-  mountTime: 0
-});
-var useLogLevel = () => {
-  const { logLevel } = React14.useContext(LogLevelContext);
-  if (logLevel === null) {
-    throw new Error("useLogLevel must be used within a LogLevelProvider");
-  }
-  return logLevel;
-};
-var useMountTime = () => {
-  const { mountTime } = React14.useContext(LogLevelContext);
-  if (mountTime === null) {
-    throw new Error("useMountTime must be used within a LogLevelProvider");
-  }
-  return mountTime;
-};
-
 // src/use-amplification.ts
 import { useContext as useContext17, useLayoutEffect as useLayoutEffect4, useRef as useRef7 } from "react";
 
@@ -6123,14 +6168,12 @@ var RemotionRoot = ({
               children: /* @__PURE__ */ jsx28(PrefetchProvider, {
                 children: /* @__PURE__ */ jsx28(SequenceManagerProvider, {
                   children: /* @__PURE__ */ jsx28(RenderAssetManagerProvider, {
-                    children: /* @__PURE__ */ jsx28(ResolveCompositionConfig, {
-                      children: /* @__PURE__ */ jsx28(SharedAudioContextProvider, {
-                        numberOfAudioTags,
-                        audioLatencyHint,
-                        children: /* @__PURE__ */ jsx28(DurationsContextProvider, {
-                          children: /* @__PURE__ */ jsx28(BufferingProvider, {
-                            children
-                          })
+                    children: /* @__PURE__ */ jsx28(SharedAudioContextProvider, {
+                      numberOfAudioTags,
+                      audioLatencyHint,
+                      children: /* @__PURE__ */ jsx28(DurationsContextProvider, {
+                        children: /* @__PURE__ */ jsx28(BufferingProvider, {
+                          children
                         })
                       })
                     })
@@ -7042,7 +7085,7 @@ var Internals = {
   resolveVideoConfig,
   useResolvedVideoConfig,
   resolveCompositionsRef,
-  ResolveCompositionConfig,
+  ResolveCompositionConfigInStudio,
   REMOTION_STUDIO_CONTAINER_ELEMENT,
   RenderAssetManager,
   persistCurrentFrame,

package/dist/esm/version.mjs

@@ -1,5 +1,5 @@
 // src/version.ts
-var VERSION = "4.0.373";
+var VERSION = "4.0.375";
 export {
   VERSION
 };

package/package.json

@@ -3,7 +3,7 @@
 		"url": "https://github.com/remotion-dev/remotion/tree/main/packages/core"
 	},
 	"name": "remotion",
-	"version": "4.0.373",
+	"version": "4.0.375",
 	"description": "Make videos programmatically",
 	"main": "dist/cjs/index.js",
 	"types": "dist/cjs/index.d.ts",
@@ -34,7 +34,7 @@
 		"react-dom": "19.0.0",
 		"webpack": "5.96.1",
 		"zod": "3.22.3",
-		"@remotion/eslint-config-internal": "4.0.373",
+		"@remotion/eslint-config-internal": "4.0.375",
 		"eslint": "9.19.0"
 	},
 	"keywords": [