remotion 4.0.380 → 4.0.381

package/dist/cjs/Composition.js

@@ -101,7 +101,10 @@ const InnerComposition = ({ width, height, fps, durationInFrames, id, defaultPro
         }));
     }, [defaultProps, id]);
     const resolved = (0, ResolveCompositionConfig_js_1.useResolvedVideoConfig)(id);
-    if (environment.isStudio && video && video.component === lazy) {
+    if (environment.isStudio &&
+        video &&
+        video.component === lazy &&
+        video.id === id) {
         const Comp = lazy;
         if (resolved === null ||
             (resolved.type !== 'success' &&
@@ -110,7 +113,10 @@ const InnerComposition = ({ width, height, fps, durationInFrames, id, defaultPro
         }
         return (0, react_dom_1.createPortal)((0, jsx_runtime_1.jsx)(CanUseRemotionHooks_js_1.CanUseRemotionHooksProvider, { children: (0, jsx_runtime_1.jsx)(react_1.Suspense, { fallback: (0, jsx_runtime_1.jsx)(loading_indicator_js_1.Loading, {}), children: (0, jsx_runtime_1.jsx)(Comp, { ...((_b = resolved.result.props) !== null && _b !== void 0 ? _b : {}) }) }) }), (0, portal_node_js_1.portalNode)());
     }
-    if (environment.isRendering && video && video.component === lazy) {
+    if (environment.isRendering &&
+        video &&
+        video.component === lazy &&
+        video.id === id) {
         const Comp = lazy;
         if (resolved === null ||
             (resolved.type !== 'success' &&

package/dist/cjs/RemotionRoot.js

@@ -3,7 +3,6 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.RemotionRootContexts = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = require("react");
-const CompositionManagerContext_js_1 = require("./CompositionManagerContext.js");
 const EditorProps_js_1 = require("./EditorProps.js");
 const SequenceManager_js_1 = require("./SequenceManager.js");
 const TimelineContext_js_1 = require("./TimelineContext.js");
@@ -15,7 +14,6 @@ const prefetch_state_js_1 = require("./prefetch-state.js");
 const use_media_enabled_js_1 = require("./use-media-enabled.js");
 const duration_state_js_1 = require("./video/duration-state.js");
 const RemotionRootContexts = ({ children, numberOfAudioTags, logLevel, audioLatencyHint, videoEnabled, audioEnabled, frameState, }) => {
-    var _a;
     const [fastRefreshes, setFastRefreshes] = (0, react_1.useState)(0);
     const [manualRefreshes, setManualRefreshes] = (0, react_1.useState)(0);
     const nonceContext = (0, react_1.useMemo)(() => {
@@ -47,15 +45,6 @@ const RemotionRootContexts = ({ children, numberOfAudioTags, logLevel, audioLate
     const logging = (0, react_1.useMemo)(() => {
         return { logLevel, mountTime: Date.now() };
     }, [logLevel]);
-    const compositionManager = (0, react_1.useContext)(CompositionManagerContext_js_1.CompositionManager);
-    const composition = (0, react_1.useMemo)(() => {
-        return compositionManager.compositions.find((c) => {
-            var _a;
-            return ((_a = compositionManager.canvasContent) === null || _a === void 0 ? void 0 : _a.type) === 'composition'
-                ? c.id === compositionManager.canvasContent.compositionId
-                : false;
-        });
-    }, [compositionManager.compositions, compositionManager.canvasContent]);
-    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)(shared_audio_tags_js_1.SharedAudioContextProvider, { numberOfAudioTags: numberOfAudioTags, audioLatencyHint: audioLatencyHint, component: (_a = composition === null || composition === void 0 ? void 0 : composition.component) !== null && _a !== void 0 ? _a : null, 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)(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.RemotionRootContexts = RemotionRootContexts;

package/dist/cjs/audio/shared-audio-tags.d.ts

@@ -1,4 +1,4 @@
-import type { AudioHTMLAttributes, ComponentType, LazyExoticComponent } from 'react';
+import type { AudioHTMLAttributes } from 'react';
 import React from 'react';
 import type { SharedElementSourceNode } from './shared-element-source-node.js';
 /**
@@ -42,7 +42,6 @@ export declare const SharedAudioContextProvider: React.FC<{
     readonly numberOfAudioTags: number;
     readonly children: React.ReactNode;
     readonly audioLatencyHint: AudioContextLatencyCategory;
-    readonly component: LazyExoticComponent<ComponentType<Record<string, unknown>>> | ComponentType<Record<string, unknown>> | null;
 }>;
 export declare const useSharedAudio: ({ aud, audioId, premounting, }: {
     aud: AudioHTMLAttributes<HTMLAudioElement>;

package/dist/cjs/audio/shared-audio-tags.js

@@ -74,7 +74,7 @@ const didPropChange = (key, newProp, prevProp) => {
     return true;
 };
 exports.SharedAudioContext = (0, react_1.createContext)(null);
-const SharedAudioContextProvider = ({ children, numberOfAudioTags, audioLatencyHint, component }) => {
+const SharedAudioContextProvider = ({ children, numberOfAudioTags, audioLatencyHint }) => {
     const audios = (0, react_1.useRef)([]);
     const [initialNumberOfAudioTags] = (0, react_1.useState)(numberOfAudioTags);
     if (numberOfAudioTags !== initialNumberOfAudioTags) {
@@ -223,22 +223,6 @@ const SharedAudioContextProvider = ({ children, numberOfAudioTags, audioLatencyH
         updateAudio,
         audioContext,
     ]);
-    // Fixing a bug: In React, if a component is unmounted using useInsertionEffect, then
-    // the cleanup function does sometimes not work properly. That is why when we
-    // are changing the composition, we reset the audio state.
-    // TODO: Possibly this does not save the problem completely, since the
-    // if an audio tag that is inside a sequence will also not be removed
-    // from the shared audios.
-    const resetAudio = (0, react_1.useCallback)(() => {
-        takenAudios.current = new Array(numberOfAudioTags).fill(false);
-        audios.current = [];
-        rerenderAudios();
-    }, [numberOfAudioTags, rerenderAudios]);
-    (0, react_1.useEffect)(() => {
-        return () => {
-            resetAudio();
-        };
-    }, [component, resetAudio]);
     return ((0, jsx_runtime_1.jsxs)(exports.SharedAudioContext.Provider, { value: value, children: [refs.map(({ id, ref }) => {
                 return (
                 // Without preload="metadata", iOS will seek the time internally

package/dist/cjs/internals.d.ts

@@ -152,7 +152,6 @@ export declare const Internals: {
         readonly numberOfAudioTags: number;
         readonly children: React.ReactNode;
         readonly audioLatencyHint: AudioContextLatencyCategory;
-        readonly component: import("react").LazyExoticComponent<import("react").ComponentType<Record<string, unknown>>> | import("react").ComponentType<Record<string, unknown>> | null;
     }>;
     readonly invalidCompositionErrorMessage: string;
     readonly calculateMediaDuration: ({ trimAfter, mediaDurationInFrames, playbackRate, trimBefore, }: {

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.380";
+export declare const VERSION = "4.0.381";

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.380';
+exports.VERSION = '4.0.381';

package/dist/esm/index.mjs

@@ -110,7 +110,7 @@ function truthy(value) {
 }
 
 // src/version.ts
-var VERSION = "4.0.380";
+var VERSION = "4.0.381";
 
 // src/multiple-versions-warning.ts
 var checkMultipleRemotionVersions = () => {
@@ -2974,7 +2974,7 @@ var DurationsContextProvider = ({ children }) => {
 import {
   forwardRef as forwardRef4,
   useContext as useContext25,
-  useEffect as useEffect13,
+  useEffect as useEffect12,
   useImperativeHandle as useImperativeHandle6,
   useMemo as useMemo21,
   useRef as useRef12,
@@ -3004,7 +3004,6 @@ import React15, {
   createRef as createRef2,
   useCallback as useCallback7,
   useContext as useContext16,
-  useEffect as useEffect6,
   useMemo as useMemo15,
   useRef as useRef5,
   useState as useState11
@@ -3152,7 +3151,7 @@ var didPropChange = (key, newProp, prevProp) => {
   return true;
 };
 var SharedAudioContext = createContext16(null);
-var SharedAudioContextProvider = ({ children, numberOfAudioTags, audioLatencyHint, component }) => {
+var SharedAudioContextProvider = ({ children, numberOfAudioTags, audioLatencyHint }) => {
   const audios = useRef5([]);
   const [initialNumberOfAudioTags] = useState11(numberOfAudioTags);
   if (numberOfAudioTags !== initialNumberOfAudioTags) {
@@ -3296,16 +3295,6 @@ var SharedAudioContextProvider = ({ children, numberOfAudioTags, audioLatencyHin
     updateAudio,
     audioContext
   ]);
-  const resetAudio = useCallback7(() => {
-    takenAudios.current = new Array(numberOfAudioTags).fill(false);
-    audios.current = [];
-    rerenderAudios();
-  }, [numberOfAudioTags, rerenderAudios]);
-  useEffect6(() => {
-    return () => {
-      resetAudio();
-    };
-  }, [component, resetAudio]);
   return /* @__PURE__ */ jsxs(SharedAudioContext.Provider, {
     value,
     children: [
@@ -3556,7 +3545,7 @@ var useVolume = ({
 };
 
 // src/use-media-in-timeline.ts
-import { useContext as useContext19, useEffect as useEffect7, useMemo as useMemo16, useState as useState12 } from "react";
+import { useContext as useContext19, useEffect as useEffect6, useMemo as useMemo16, useState as useState12 } from "react";
 
 // src/audio/use-audio-frame.ts
 import { useContext as useContext18 } from "react";
@@ -3654,7 +3643,7 @@ var useBasicMediaInTimeline = ({
       });
     }).join(",");
   }, [duration, startsAt, volume, mediaVolume]);
-  useEffect7(() => {
+  useEffect6(() => {
     if (typeof volume === "number" && volume !== initialVolume) {
       warnOnce2(`Remotion: The ${mediaType} with src ${src} has changed it's volume. Prefer the callback syntax for setting volume to get better timeline display: https://www.remotion.dev/docs/audio/volume`);
     }
@@ -3708,7 +3697,7 @@ var useMediaInTimeline = ({
     trimBefore: undefined,
     playbackRate
   });
-  useEffect7(() => {
+  useEffect6(() => {
     if (!src) {
       throw new Error("No src passed");
     }
@@ -3769,7 +3758,7 @@ var useMediaInTimeline = ({
 import {
   useCallback as useCallback10,
   useContext as useContext22,
-  useEffect as useEffect11,
+  useEffect as useEffect10,
   useLayoutEffect as useLayoutEffect7,
   useRef as useRef11
 } from "react";
@@ -3784,7 +3773,7 @@ import { useContext as useContext21, useMemo as useMemo18 } from "react";
 import React16, {
   useCallback as useCallback8,
   useContext as useContext20,
-  useEffect as useEffect8,
+  useEffect as useEffect7,
   useLayoutEffect as useLayoutEffect6,
   useMemo as useMemo17,
   useRef as useRef8,
@@ -3826,7 +3815,7 @@ var useBufferManager = (logLevel, mountTime) => {
       }
     };
   }, []);
-  useEffect8(() => {
+  useEffect7(() => {
     if (blocks.length > 0) {
       onBufferingCallbacks.forEach((c) => c());
       playbackLogging({
@@ -3865,7 +3854,7 @@ var BufferingProvider = ({ children }) => {
 };
 var useIsPlayerBuffering = (bufferManager) => {
   const [isBuffering, setIsBuffering] = useState13(bufferManager.buffering.current);
-  useEffect8(() => {
+  useEffect7(() => {
     const onBuffer = () => {
       setIsBuffering(true);
     };
@@ -4034,7 +4023,7 @@ var seek = ({
 };
 
 // src/use-media-buffering.ts
-import { useEffect as useEffect9, useState as useState14 } from "react";
+import { useEffect as useEffect8, useState as useState14 } from "react";
 var useMediaBuffering = ({
   element,
   shouldBuffer,
@@ -4046,7 +4035,7 @@ var useMediaBuffering = ({
 }) => {
   const buffer = useBufferState();
   const [isBuffering, setIsBuffering] = useState14(false);
-  useEffect9(() => {
+  useEffect8(() => {
     let cleanupFns = [];
     const { current } = element;
     if (!current) {
@@ -4174,7 +4163,7 @@ var useMediaBuffering = ({
 };
 
 // src/use-request-video-callback-time.ts
-import { useEffect as useEffect10, useRef as useRef10 } from "react";
+import { useEffect as useEffect9, useRef as useRef10 } from "react";
 var useRequestVideoCallbackTime = ({
   mediaRef,
   mediaType,
@@ -4182,7 +4171,7 @@ var useRequestVideoCallbackTime = ({
   onVariableFpsVideoDetected
 }) => {
   const currentTime = useRef10(null);
-  useEffect10(() => {
+  useEffect9(() => {
     const { current } = mediaRef;
     if (current) {
       currentTime.current = {
@@ -4476,7 +4465,7 @@ var useMediaPlayback = ({
     return acceptableTimeshift ?? defaultAcceptableTimeshift;
   })();
   const isPlayerBuffering = useIsPlayerBuffering(buffering);
-  useEffect11(() => {
+  useEffect10(() => {
     if (mediaRef.current?.paused) {
       return;
     }
@@ -4521,7 +4510,7 @@ var useMediaPlayback = ({
       mediaRef.current.playbackRate = playbackRateToSet;
     }
   }, [mediaRef, playbackRate]);
-  useEffect11(() => {
+  useEffect10(() => {
     const tagName = mediaType === "audio" ? "<Html5Audio>" : "<Html5Video>";
     if (!mediaRef.current) {
       throw new Error(`No ${mediaType} ref found`);
@@ -4640,7 +4629,7 @@ var useMediaPlayback = ({
 };
 
 // src/use-media-tag.ts
-import { useContext as useContext23, useEffect as useEffect12 } from "react";
+import { useContext as useContext23, useEffect as useEffect11 } from "react";
 var useMediaTag = ({
   mediaRef,
   id,
@@ -4653,7 +4642,7 @@ var useMediaTag = ({
   const logLevel = useLogLevel();
   const mountTime = useMountTime();
   const env = useRemotionEnvironment();
-  useEffect12(() => {
+  useEffect11(() => {
     const tag = {
       id,
       play: (reason) => {
@@ -4870,7 +4859,7 @@ var AudioForDevelopmentForwardRefFunction = (props, ref) => {
   }, [audioRef]);
   const currentOnDurationCallback = useRef12(onDuration);
   currentOnDurationCallback.current = onDuration;
-  useEffect13(() => {
+  useEffect12(() => {
     const { current } = audioRef;
     if (!current) {
       return;
@@ -4903,7 +4892,7 @@ var AudioForPreview = forwardRef4(AudioForDevelopmentForwardRefFunction);
 import {
   forwardRef as forwardRef5,
   useContext as useContext26,
-  useEffect as useEffect14,
+  useEffect as useEffect13,
   useImperativeHandle as useImperativeHandle7,
   useLayoutEffect as useLayoutEffect8,
   useMemo as useMemo22,
@@ -4951,7 +4940,7 @@ var AudioForRenderingRefForwardingFunction = (props, ref) => {
   useImperativeHandle7(ref, () => {
     return audioRef.current;
   }, []);
-  useEffect14(() => {
+  useEffect13(() => {
     if (!props.src) {
       throw new Error("No src passed");
     }
@@ -5158,11 +5147,11 @@ var Html5Audio = forwardRef6(AudioRefForwardingFunction);
 addSequenceStackTraces(Html5Audio);
 var Audio = Html5Audio;
 // src/Composition.tsx
-import { Suspense, useContext as useContext29, useEffect as useEffect16 } from "react";
+import { Suspense, useContext as useContext29, useEffect as useEffect15 } from "react";
 import { createPortal } from "react-dom";
 
 // src/Folder.tsx
-import { createContext as createContext18, useContext as useContext28, useEffect as useEffect15, useMemo as useMemo23 } from "react";
+import { createContext as createContext18, useContext as useContext28, useEffect as useEffect14, useMemo as useMemo23 } from "react";
 
 // src/validation/validate-folder-name.ts
 var getRegex = () => /^([a-zA-Z0-9-\u4E00-\u9FFF])+$/g;
@@ -5198,7 +5187,7 @@ var Folder = ({ name, children }) => {
       parentName
     };
   }, [name, parentName]);
-  useEffect15(() => {
+  useEffect14(() => {
     registerFolder(name, parentName);
     return () => {
       unregisterFolder(name, parentName);
@@ -5353,7 +5342,7 @@ var validateDefaultAndInputProps = (defaultProps, name, compositionId) => {
 import { jsx as jsx23 } from "react/jsx-runtime";
 var Fallback = () => {
   const { continueRender: continueRender2, delayRender: delayRender2 } = useDelayRender();
-  useEffect16(() => {
+  useEffect15(() => {
     const fallback = delayRender2("Waiting for Root component to unsuspend");
     return () => continueRender2(fallback);
   }, [continueRender2, delayRender2]);
@@ -5391,7 +5380,7 @@ var InnerComposition = ({
     throw new Error("<Composition> mounted inside another composition. See https://remotion.dev/docs/wrong-composition-mount for help.");
   }
   const { folderName, parentName } = useContext29(FolderContext);
-  useEffect16(() => {
+  useEffect15(() => {
     if (!id) {
       throw new Error("No id for composition passed.");
     }
@@ -5430,7 +5419,7 @@ var InnerComposition = ({
     registerComposition,
     unregisterComposition
   ]);
-  useEffect16(() => {
+  useEffect15(() => {
     window.dispatchEvent(new CustomEvent(PROPS_UPDATED_EXTERNALLY, {
       detail: {
         resetUnsaved: id
@@ -5438,7 +5427,7 @@ var InnerComposition = ({
     }));
   }, [defaultProps, id]);
   const resolved = useResolvedVideoConfig(id);
-  if (environment.isStudio && video && video.component === lazy) {
+  if (environment.isStudio && video && video.component === lazy && video.id === id) {
     const Comp = lazy;
     if (resolved === null || resolved.type !== "success" && resolved.type !== "success-and-refreshing") {
       return null;
@@ -5452,7 +5441,7 @@ var InnerComposition = ({
       })
     }), portalNode());
   }
-  if (environment.isRendering && video && video.component === lazy) {
+  if (environment.isRendering && video && video.component === lazy && video.id === id) {
     const Comp = lazy;
     if (resolved === null || resolved.type !== "success" && resolved.type !== "success-and-refreshing") {
       return null;
@@ -6093,7 +6082,7 @@ var waitForRoot = (fn) => {
 };
 
 // src/RemotionRoot.tsx
-import { useContext as useContext32, useEffect as useEffect17, useMemo as useMemo27, useState as useState18 } from "react";
+import { useEffect as useEffect16, useMemo as useMemo27, useState as useState18 } from "react";
 
 // src/use-media-enabled.tsx
 import { createContext as createContext19, useContext as useContext31, useMemo as useMemo26 } from "react";
@@ -6159,7 +6148,7 @@ var RemotionRootContexts = ({
       }
     };
   }, []);
-  useEffect17(() => {
+  useEffect16(() => {
     if (typeof __webpack_module__ !== "undefined") {
       if (__webpack_module__.hot) {
         __webpack_module__.hot.addStatusHandler((status) => {
@@ -6173,10 +6162,6 @@ var RemotionRootContexts = ({
   const logging = useMemo27(() => {
     return { logLevel, mountTime: Date.now() };
   }, [logLevel]);
-  const compositionManager = useContext32(CompositionManager);
-  const composition = useMemo27(() => {
-    return compositionManager.compositions.find((c2) => compositionManager.canvasContent?.type === "composition" ? c2.id === compositionManager.canvasContent.compositionId : false);
-  }, [compositionManager.compositions, compositionManager.canvasContent]);
   return /* @__PURE__ */ jsx28(LogLevelContext.Provider, {
     value: logging,
     children: /* @__PURE__ */ jsx28(NonceContext.Provider, {
@@ -6194,7 +6179,6 @@ var RemotionRootContexts = ({
                   children: /* @__PURE__ */ jsx28(SharedAudioContextProvider, {
                     numberOfAudioTags,
                     audioLatencyHint,
-                    component: composition?.component ?? null,
                     children: /* @__PURE__ */ jsx28(DurationsContextProvider, {
                       children: /* @__PURE__ */ jsx28(BufferingProvider, {
                         children
@@ -6301,8 +6285,8 @@ import { useCallback as useCallback16 } from "react";
 // src/video/OffthreadVideoForRendering.tsx
 import {
   useCallback as useCallback15,
-  useContext as useContext33,
-  useEffect as useEffect18,
+  useContext as useContext32,
+  useEffect as useEffect17,
   useLayoutEffect as useLayoutEffect10,
   useMemo as useMemo28,
   useState as useState19
@@ -6343,9 +6327,9 @@ var OffthreadVideoForRendering = ({
   const frame = useCurrentFrame();
   const volumePropsFrame = useFrameForVolumeProp(loopVolumeCurveBehavior);
   const videoConfig = useUnsafeVideoConfig();
-  const sequenceContext = useContext33(SequenceContext);
+  const sequenceContext = useContext32(SequenceContext);
   const mediaStartsAt = useMediaStartsAt();
-  const { registerRenderAsset, unregisterRenderAsset } = useContext33(RenderAssetManager);
+  const { registerRenderAsset, unregisterRenderAsset } = useContext32(RenderAssetManager);
   if (!src) {
     throw new TypeError("No `src` was passed to <OffthreadVideo>.");
   }
@@ -6364,7 +6348,7 @@ var OffthreadVideoForRendering = ({
     mediaVolume: 1
   });
   warnAboutTooHighVolume(volume);
-  useEffect18(() => {
+  useEffect17(() => {
     if (!src) {
       throw new Error("No src passed");
     }
@@ -6525,8 +6509,8 @@ var OffthreadVideoForRendering = ({
 // src/video/VideoForPreview.tsx
 import {
   forwardRef as forwardRef9,
-  useContext as useContext34,
-  useEffect as useEffect20,
+  useContext as useContext33,
+  useEffect as useEffect19,
   useImperativeHandle as useImperativeHandle10,
   useMemo as useMemo29,
   useRef as useRef16,
@@ -6534,12 +6518,12 @@ import {
 } from "react";
 
 // src/video/emit-video-frame.ts
-import { useEffect as useEffect19 } from "react";
+import { useEffect as useEffect18 } from "react";
 var useEmitVideoFrame = ({
   ref,
   onVideoFrame
 }) => {
-  useEffect19(() => {
+  useEffect18(() => {
     const { current } = ref;
     if (!current) {
       return;
@@ -6565,7 +6549,7 @@ var useEmitVideoFrame = ({
 // src/video/VideoForPreview.tsx
 import { jsx as jsx30 } from "react/jsx-runtime";
 var VideoForDevelopmentRefForwardingFunction = (props2, ref) => {
-  const context = useContext34(SharedAudioContext);
+  const context = useContext33(SharedAudioContext);
   if (!context) {
     throw new Error("SharedAudioContext not found");
   }
@@ -6613,8 +6597,8 @@ var VideoForDevelopmentRefForwardingFunction = (props2, ref) => {
   }
   const volumePropFrame = useFrameForVolumeProp(loopVolumeCurveBehavior ?? "repeat");
   const { fps, durationInFrames } = useVideoConfig();
-  const parentSequence = useContext34(SequenceContext);
-  const { hidden } = useContext34(SequenceVisibilityToggleContext);
+  const parentSequence = useContext33(SequenceContext);
+  const { hidden } = useContext33(SequenceVisibilityToggleContext);
   const logLevel = useLogLevel();
   const mountTime = useMountTime();
   const [timelineId] = useState20(() => String(Math.random()));
@@ -6689,7 +6673,7 @@ var VideoForDevelopmentRefForwardingFunction = (props2, ref) => {
     tag: "video",
     mountTime
   }));
-  useEffect20(() => {
+  useEffect19(() => {
     const { current } = videoRef;
     if (!current) {
       return;
@@ -6720,7 +6704,7 @@ var VideoForDevelopmentRefForwardingFunction = (props2, ref) => {
   const currentOnDurationCallback = useRef16(onDuration);
   currentOnDurationCallback.current = onDuration;
   useEmitVideoFrame({ ref: videoRef, onVideoFrame });
-  useEffect20(() => {
+  useEffect19(() => {
     const { current } = videoRef;
     if (!current) {
       return;
@@ -6737,7 +6721,7 @@ var VideoForDevelopmentRefForwardingFunction = (props2, ref) => {
       current.removeEventListener("loadedmetadata", onLoadedMetadata);
     };
   }, [src]);
-  useEffect20(() => {
+  useEffect19(() => {
     const { current } = videoRef;
     if (!current) {
       return;
@@ -7970,13 +7954,13 @@ var Still = (props2) => {
   return React36.createElement(Composition, newProps);
 };
 // src/video/Video.tsx
-import { forwardRef as forwardRef12, useCallback as useCallback17, useContext as useContext36 } from "react";
+import { forwardRef as forwardRef12, useCallback as useCallback17, useContext as useContext35 } from "react";
 
 // src/video/VideoForRendering.tsx
 import {
   forwardRef as forwardRef11,
-  useContext as useContext35,
-  useEffect as useEffect21,
+  useContext as useContext34,
+  useEffect as useEffect20,
   useImperativeHandle as useImperativeHandle11,
   useLayoutEffect as useLayoutEffect11,
   useMemo as useMemo32,
@@ -8129,13 +8113,13 @@ var VideoForRenderingForwardFunction = ({
   const volumePropsFrame = useFrameForVolumeProp(loopVolumeCurveBehavior ?? "repeat");
   const videoConfig = useUnsafeVideoConfig();
   const videoRef = useRef17(null);
-  const sequenceContext = useContext35(SequenceContext);
+  const sequenceContext = useContext34(SequenceContext);
   const mediaStartsAt = useMediaStartsAt();
   const environment = useRemotionEnvironment();
   const logLevel = useLogLevel();
   const mountTime = useMountTime();
   const { delayRender: delayRender2, continueRender: continueRender2 } = useDelayRender();
-  const { registerRenderAsset, unregisterRenderAsset } = useContext35(RenderAssetManager);
+  const { registerRenderAsset, unregisterRenderAsset } = useContext34(RenderAssetManager);
   const id = useMemo32(() => `video-${random(props2.src ?? "")}-${sequenceContext?.cumulatedFrom}-${sequenceContext?.relativeFrom}-${sequenceContext?.durationInFrames}`, [
     props2.src,
     sequenceContext?.cumulatedFrom,
@@ -8151,7 +8135,7 @@ var VideoForRenderingForwardFunction = ({
     mediaVolume: 1
   });
   warnAboutTooHighVolume(volume);
-  useEffect21(() => {
+  useEffect20(() => {
     if (!props2.src) {
       throw new Error("No src passed");
     }
@@ -8194,7 +8178,7 @@ var VideoForRenderingForwardFunction = ({
   useImperativeHandle11(ref, () => {
     return videoRef.current;
   }, []);
-  useEffect21(() => {
+  useEffect20(() => {
     if (!window.remotion_videoEnabled) {
       return;
     }
@@ -8339,7 +8323,7 @@ var VideoForwardingFunction = (props2, ref) => {
   const { loop, ...propsOtherThanLoop } = props2;
   const { fps } = useVideoConfig();
   const environment = useRemotionEnvironment();
-  const { durations, setDurations } = useContext36(DurationsContext);
+  const { durations, setDurations } = useContext35(DurationsContext);
   if (typeof ref === "string") {
     throw new Error("string refs are not supported");
   }

package/dist/esm/version.mjs

@@ -1,5 +1,5 @@
 // src/version.ts
-var VERSION = "4.0.380";
+var VERSION = "4.0.381";
 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.380",
+	"version": "4.0.381",
 	"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.380",
+		"@remotion/eslint-config-internal": "4.0.381",
 		"eslint": "9.19.0"
 	},
 	"keywords": [