remotion 4.0.491 → 4.0.493

package/dist/esm/index.mjs

@@ -729,6 +729,7 @@ var useResolvedVideoConfig = (preferredCompositionId) => {
     if (currentCompositionMetadata) {
       return {
         type: "success",
+        metadataSource: null,
         result: {
           ...currentCompositionMetadata,
           id: composition.id,
@@ -746,6 +747,7 @@ var useResolvedVideoConfig = (preferredCompositionId) => {
       validateDimension(composition.height, "height", `in <Composition id="${composition.id}">`);
       return {
         type: "success",
+        metadataSource: null,
         result: {
           width: composition.width,
           height: composition.height,
@@ -1184,6 +1186,7 @@ var InnerComposition = ({
   }
   const { folderName, parentName } = useContext9(FolderContext);
   const stack = compProps.stack ?? null;
+  const componentFromProps = "component" in compProps ? compProps.component : null;
   useEffect2(() => {
     if (!id) {
       throw new Error("No id for composition passed.");
@@ -1201,6 +1204,7 @@ var InnerComposition = ({
       defaultProps: serializeThenDeserializeInStudio(defaultProps ?? {}),
       nonce: nonce.get(),
       parentFolderName: parentName,
+      componentFromProps,
       schema: schema ?? null,
       calculateMetadata: compProps.calculateMetadata ?? null,
       stack
@@ -1219,6 +1223,7 @@ var InnerComposition = ({
     width,
     nonce,
     parentName,
+    componentFromProps,
     schema,
     compProps.calculateMetadata,
     stack,
@@ -1278,14 +1283,34 @@ var Composition = (props) => {
 };
 
 // src/enable-sequence-stack-traces.ts
+import React9 from "react";
 var componentsToAddStacksTo = [];
+var sequenceComponent = null;
 var getComponentsToAddStacksTo = () => componentsToAddStacksTo;
 var addSequenceStackTraces = (component) => {
   componentsToAddStacksTo.push(component);
 };
+var setSequenceComponent = (component) => {
+  sequenceComponent = component;
+};
+var getSequenceComponent = () => sequenceComponent;
+var getSingleChildComponent = (children) => {
+  const mountedChildren = React9.Children.toArray(children);
+  if (mountedChildren.length !== 1) {
+    return null;
+  }
+  const child = mountedChildren[0];
+  if (!React9.isValidElement(child)) {
+    return null;
+  }
+  if (typeof child.type !== "function" && typeof child.type !== "object") {
+    return null;
+  }
+  return child.type;
+};
 
 // src/version.ts
-var VERSION = "4.0.491";
+var VERSION = "4.0.493";
 
 // src/multiple-versions-warning.ts
 var checkMultipleRemotionVersions = () => {
@@ -1949,9 +1974,9 @@ var PremountContext = createContext14({
 });
 
 // src/SequenceManager.tsx
-import React11, { useCallback as useCallback5, useMemo as useMemo12, useRef as useRef4, useState as useState3 } from "react";
+import React12, { useCallback as useCallback5, useMemo as useMemo12, useRef as useRef4, useState as useState3 } from "react";
 import { jsx as jsx10 } from "react/jsx-runtime";
-var SequenceManager = React11.createContext({
+var SequenceManager = React12.createContext({
   registerSequence: () => {
     throw new Error("SequenceManagerContext not initialized");
   },
@@ -1960,19 +1985,19 @@ var SequenceManager = React11.createContext({
   },
   sequences: []
 });
-var SequenceManagerRefContext = React11.createContext({
+var SequenceManagerRefContext = React12.createContext({
   current: []
 });
 var makeSequencePropsSubscriptionKey = (key) => {
   return `${key.absolutePath}\x00${key.nodePath.join(".")}\x00${key.sequenceKeys.join(".")}\x00${key.effectKeys.map((keys) => keys.join(".")).join(".")}`;
 };
-var VisualModePropStatusesContext = React11.createContext({
+var VisualModePropStatusesContext = React12.createContext({
   propStatuses: {}
 });
-var VisualModePropStatusesRefContext = React11.createContext({
+var VisualModePropStatusesRefContext = React12.createContext({
   current: {}
 });
-var VisualModeDragOverridesContext = React11.createContext({
+var VisualModeDragOverridesContext = React12.createContext({
   getDragOverrides: () => {
     throw new Error("VisualModeDragOverridesContext not initialized");
   },
@@ -1980,7 +2005,7 @@ var VisualModeDragOverridesContext = React11.createContext({
     throw new Error("VisualModeDragOverridesContext not initialized");
   }
 });
-var VisualModeSettersContext = React11.createContext({
+var VisualModeSettersContext = React12.createContext({
   setDragOverrides: () => {
     throw new Error("VisualModeSettersContext not initialized");
   },
@@ -2132,7 +2157,7 @@ var SequenceManagerProvider = ({ children }) => {
 };
 
 // src/series/is-inside-series.tsx
-import React12, { createContext as createContext15 } from "react";
+import React13, { createContext as createContext15 } from "react";
 import { jsx as jsx11 } from "react/jsx-runtime";
 var IsInsideSeriesContext = createContext15(false);
 var IsInsideSeriesContainer = ({ children }) => {
@@ -2148,7 +2173,7 @@ var IsNotInsideSeriesProvider = ({ children }) => {
   });
 };
 var useRequireToBeInsideSeries = () => {
-  const isInsideSeries = React12.useContext(IsInsideSeriesContext);
+  const isInsideSeries = React13.useContext(IsInsideSeriesContext);
   if (!isInsideSeries) {
     throw new Error("This component must be inside a <Series /> component.");
   }
@@ -2158,7 +2183,7 @@ var useRequireToBeInsideSeries = () => {
 var ENABLE_V5_BREAKING_CHANGES = false;
 
 // src/with-interactivity-schema.ts
-import React13, { forwardRef as forwardRef2, useContext as useContext16, useMemo as useMemo13, useState as useState4 } from "react";
+import React14, { forwardRef as forwardRef2, useContext as useContext16, useMemo as useMemo13, useState as useState4 } from "react";
 
 // src/delete-nested-key.ts
 var deleteNestedKey = (obj, keysToRemove) => {
@@ -4262,6 +4287,9 @@ var computeEffectiveSchemaValuesDotNotation = ({
         shouldResortToDefaultValueIfUndefined: false
       });
     }
+    if (field?.type === "asset" && typeof value === "string" && value.startsWith(FILE_TOKEN)) {
+      value = `${window.remotion_staticBase}/${value.slice(FILE_TOKEN.length)}`;
+    }
     if (value === undefined) {
       propsToDelete.add(key);
     }
@@ -4362,7 +4390,7 @@ var withInteractivitySchema = ({
   const Wrapped = forwardRef2((props, ref) => {
     const env = useRemotionEnvironment();
     if (!env.isStudio || env.isReadOnlyStudio || env.isRendering) {
-      return React13.createElement(Component, {
+      return React14.createElement(Component, {
         ...props,
         controls: null,
         ref
@@ -4373,7 +4401,7 @@ var withInteractivitySchema = ({
     const nodePathMapping = useContext16(OverrideIdsToNodePathsGettersContext);
     const frame = useCurrentFrame();
     if (props.controls) {
-      return React13.createElement(Component, {
+      return React14.createElement(Component, {
         ...props,
         ref
       });
@@ -4431,7 +4459,7 @@ var withInteractivitySchema = ({
       schemaKeys: activeKeys,
       propsToDelete
     });
-    return React13.createElement(Component, {
+    return React14.createElement(Component, {
       ...mergedProps,
       controls,
       ref
@@ -4460,6 +4488,7 @@ var RegularSequenceRefForwardingFunction = ({
   _remotionInternalLoopDisplay: loopDisplay,
   _remotionInternalStack: stack,
   _remotionInternalDocumentationLink: documentationLink,
+  _remotionInternalSingleChildComponent: singleChildComponent,
   _remotionInternalPremountDisplay: premountDisplay,
   _remotionInternalPostmountDisplay: postmountDisplay,
   _remotionInternalIsMedia: isMedia,
@@ -4606,7 +4635,8 @@ var RegularSequenceRefForwardingFunction = ({
           getStack: () => stackRef.current,
           refForOutline: refForOutline ?? null,
           isInsideSeries,
-          frozenFrame: registeredFrozenFrame
+          frozenFrame: registeredFrozenFrame,
+          singleChildComponent: singleChildComponent ?? null
         });
       } else {
         registerSequence({
@@ -4636,7 +4666,8 @@ var RegularSequenceRefForwardingFunction = ({
           refForOutline: refForOutline ?? null,
           isInsideSeries,
           frozenFrame: registeredFrozenFrame,
-          frozenMediaFrame
+          frozenMediaFrame,
+          singleChildComponent: singleChildComponent ?? null
         });
       }
       return () => {
@@ -4663,7 +4694,8 @@ var RegularSequenceRefForwardingFunction = ({
       effects: _remotionInternalEffects ?? EMPTY_EFFECTS,
       refForOutline: refForOutline ?? null,
       isInsideSeries,
-      frozenFrame: registeredFrozenFrame
+      frozenFrame: registeredFrozenFrame,
+      singleChildComponent: singleChildComponent ?? null
     });
     return () => {
       unregisterSequence(id);
@@ -4696,7 +4728,8 @@ var RegularSequenceRefForwardingFunction = ({
     registeredFrozenFrame,
     startMediaFrom,
     mediaFrameAtSequenceZero,
-    frozenMediaFrame
+    frozenMediaFrame,
+    singleChildComponent
   ]);
   const endThreshold = Math.ceil(cumulatedFrom + from + durationInFrames - 1);
   const content = absoluteFrame < cumulatedFrom + from ? null : absoluteFrame > endThreshold ? null : children;
@@ -4836,7 +4869,7 @@ import {
 } from "react";
 
 // src/animated-image/canvas.tsx
-import React15, { useCallback as useCallback7, useImperativeHandle, useMemo as useMemo16, useRef as useRef8 } from "react";
+import React16, { useCallback as useCallback7, useImperativeHandle, useMemo as useMemo16, useRef as useRef8 } from "react";
 
 // src/calculate-image-fit.ts
 var calculateImageFit = (fit, imageSize, canvasSize) => {
@@ -5227,7 +5260,7 @@ var CanvasRefForwardingFunction = ({ width, height, fit, className, style, effec
     ...props
   });
 };
-var Canvas = React15.forwardRef(CanvasRefForwardingFunction);
+var Canvas = React16.forwardRef(CanvasRefForwardingFunction);
 
 // src/animated-image/decode-image.ts
 var CACHE_SIZE = 5;
@@ -5397,6 +5430,12 @@ var resolveAnimatedImageSource = (src) => {
 // src/animated-image/AnimatedImage.tsx
 import { jsx as jsx14 } from "react/jsx-runtime";
 var animatedImageSchema = {
+  src: {
+    type: "asset",
+    default: undefined,
+    description: "Source",
+    keyframable: false
+  },
   ...baseSchema,
   playbackRate: {
     type: "number",
@@ -5841,11 +5880,11 @@ var calculateMediaDuration = ({
 };
 
 // src/loop/index.tsx
-import React16, { createContext as createContext18, useMemo as useMemo18 } from "react";
+import React17, { createContext as createContext18, useMemo as useMemo18 } from "react";
 import { jsx as jsx16 } from "react/jsx-runtime";
 var LoopContext = createContext18(null);
 var useLoop = () => {
-  return React16.useContext(LoopContext);
+  return React17.useContext(LoopContext);
 };
 var Loop = ({
   durationInFrames,
@@ -6289,7 +6328,7 @@ var DurationsContextProvider = ({ children }) => {
 
 // src/audio/AudioForPreview.tsx
 import { useCallback as useCallback13 } from "react";
-import React22, {
+import React23, {
   forwardRef as forwardRef5,
   useContext as useContext28,
   useEffect as useEffect14,
@@ -6321,7 +6360,7 @@ var getCrossOriginValue = ({
 import { useContext as useContext21, useLayoutEffect as useLayoutEffect5, useRef as useRef14 } from "react";
 
 // src/audio/shared-audio-tags.tsx
-import React19, {
+import React20, {
   createContext as createContext21,
   createRef as createRef2,
   useCallback as useCallback9,
@@ -6756,7 +6795,7 @@ var SharedAudioTagsContextProvider = ({ children, numberOfAudioTags }) => {
       };
     });
   }, [audioContext, numberOfAudioTags]);
-  const effectToUse = React19.useInsertionEffect ?? React19.useLayoutEffect;
+  const effectToUse = React20.useInsertionEffect ?? React20.useLayoutEffect;
   effectToUse(() => {
     return () => {
       requestAnimationFrame(() => {
@@ -6926,7 +6965,7 @@ var useSharedAudio = ({
     if (tagsCtx && tagsCtx.numberOfAudioTags > 0) {
       return tagsCtx.registerAudio({ aud, audioId, premounting, postmounting });
     }
-    const el = React19.createRef();
+    const el = React20.createRef();
     const mediaElementSourceNode = audioCtx?.audioContext ? makeSharedElementSourceNode({
       audioContext: audioCtx.audioContext,
       ref: el
@@ -6945,7 +6984,7 @@ var useSharedAudio = ({
       }
     };
   });
-  const effectToUse = React19.useInsertionEffect ?? React19.useLayoutEffect;
+  const effectToUse = React20.useInsertionEffect ?? React20.useLayoutEffect;
   if (typeof document !== "undefined") {
     effectToUse(() => {
       if (tagsCtx && tagsCtx.numberOfAudioTags > 0) {
@@ -7450,7 +7489,7 @@ import { useCallback as useCallback11, useMemo as useMemo25, useRef as useRef16
 import { useContext as useContext25, useMemo as useMemo24 } from "react";
 
 // src/buffering.tsx
-import React20, {
+import React21, {
   useCallback as useCallback10,
   useContext as useContext24,
   useEffect as useEffect9,
@@ -7545,7 +7584,7 @@ var useBufferManager = (logLevel, mountTime) => {
     return { addBlock, listenForBuffering, listenForResume, buffering };
   }, [addBlock, buffering, listenForBuffering, listenForResume]);
 };
-var BufferingContextReact = React20.createContext(null);
+var BufferingContextReact = React21.createContext(null);
 var BufferingProvider = ({ children }) => {
   const { logLevel, mountTime } = useContext24(LogLevelContext);
   const bufferManager = useBufferManager(logLevel ?? "info", mountTime);
@@ -7765,9 +7804,9 @@ var getMediaSyncAction = (input) => {
 };
 
 // src/media-tag-current-time-timestamp.ts
-import React21 from "react";
+import React22 from "react";
 var useCurrentTimeOfMediaTagWithUpdateTimeStamp = (mediaRef) => {
-  const lastUpdate = React21.useRef({
+  const lastUpdate = React22.useRef({
     time: mediaRef.current?.currentTime ?? 0,
     lastUpdate: performance.now()
   });
@@ -8545,7 +8584,7 @@ var AudioForDevelopmentForwardRefFunction = (props, ref) => {
     volume: userPreferredVolume,
     shouldUseWebAudioApi: useWebAudioApi ?? false
   });
-  const effectToUse = React22.useInsertionEffect ?? React22.useLayoutEffect;
+  const effectToUse = React23.useInsertionEffect ?? React23.useLayoutEffect;
   effectToUse(() => {
     return () => {
       requestAnimationFrame(() => {
@@ -10187,6 +10226,12 @@ var NativeImgInner = ({
 };
 var CanvasImageWithPrivateProps = CanvasImage;
 var imgSchema = {
+  src: {
+    type: "asset",
+    default: undefined,
+    description: "Source",
+    keyframable: false
+  },
   ...baseSchema,
   ...transformSchema
 };
@@ -10332,7 +10377,7 @@ var Img = withInteractivitySchema({
 });
 addSequenceStackTraces(Img);
 // src/Interactive.tsx
-import React29, { forwardRef as forwardRef12, useCallback as useCallback20, useRef as useRef25 } from "react";
+import React30, { forwardRef as forwardRef12, useCallback as useCallback20, useRef as useRef25 } from "react";
 import { jsx as jsx29 } from "react/jsx-runtime";
 var sourcePathToIdentityPrefix = (packageName) => {
   if (packageName === "remotion") {
@@ -10400,7 +10445,7 @@ var makeInteractiveElement = (tag, displayName) => {
       _remotionInternalStack: stack,
       _remotionInternalDocumentationLink: "https://www.remotion.dev/docs/interactive",
       outlineRef: refForOutline,
-      children: React29.createElement(tag, {
+      children: React30.createElement(tag, {
         ...props2,
         ref: callbackRef
       })
@@ -10468,8 +10513,8 @@ var Interactive = {
 import { createRef as createRef3 } from "react";
 
 // src/CompositionManager.tsx
-import React30 from "react";
-var compositionsRef = React30.createRef();
+import React31 from "react";
+var compositionsRef = React31.createRef();
 
 // src/CompositionManagerProvider.tsx
 import {
@@ -10634,8 +10679,8 @@ var getPreviewDomElement = () => {
 };
 
 // src/max-video-cache-size.ts
-import React31 from "react";
-var MaxMediaCacheSizeContext = React31.createContext(null);
+import React32 from "react";
+var MaxMediaCacheSizeContext = React32.createContext(null);
 
 // src/register-root.ts
 var Root = null;
@@ -10833,7 +10878,46 @@ var validateCalculated = ({
     defaultSampleRate
   };
 };
-var resolveVideoConfig = ({
+var makeVideoConfigWithMetadata = ({
+  calculated,
+  compositionDurationInFrames,
+  compositionFps,
+  compositionHeight,
+  compositionId,
+  compositionWidth,
+  defaultProps,
+  originalProps
+}) => {
+  const data = validateCalculated({
+    calculated,
+    compositionDurationInFrames,
+    compositionFps,
+    compositionHeight,
+    compositionWidth,
+    compositionId
+  });
+  return {
+    metadataSource: {
+      durationInFrames: calculated?.durationInFrames === undefined ? "composition" : "calculate-metadata",
+      fps: calculated?.fps === undefined ? "composition" : "calculate-metadata",
+      height: calculated?.height === undefined ? "composition" : "calculate-metadata",
+      width: calculated?.width === undefined ? "composition" : "calculate-metadata"
+    },
+    videoConfig: {
+      ...data,
+      id: compositionId,
+      defaultProps: serializeThenDeserializeInStudio(defaultProps ?? {}),
+      props: serializeThenDeserializeInStudio(calculated?.props ?? originalProps),
+      defaultCodec: data.defaultCodec ?? null,
+      defaultOutName: data.defaultOutName ?? null,
+      defaultVideoImageFormat: data.defaultVideoImageFormat ?? null,
+      defaultPixelFormat: data.defaultPixelFormat ?? null,
+      defaultProResProfile: data.defaultProResProfile ?? null,
+      defaultSampleRate: data.defaultSampleRate ?? null
+    }
+  };
+};
+var resolveVideoConfigWithMetadata = ({
   calculateMetadata,
   signal,
   defaultProps,
@@ -10853,76 +10937,48 @@ var resolveVideoConfig = ({
   }) : null;
   if (calculatedProm !== null && typeof calculatedProm === "object" && "then" in calculatedProm) {
     return calculatedProm.then((c2) => {
-      const {
-        height,
-        width,
-        durationInFrames,
-        fps,
-        defaultCodec,
-        defaultOutName,
-        defaultVideoImageFormat,
-        defaultPixelFormat,
-        defaultProResProfile,
-        defaultSampleRate
-      } = validateCalculated({
+      return makeVideoConfigWithMetadata({
         calculated: c2,
         compositionDurationInFrames,
         compositionFps,
         compositionHeight,
         compositionWidth,
-        compositionId
+        compositionId,
+        defaultProps,
+        originalProps
       });
-      return {
-        width,
-        height,
-        fps,
-        durationInFrames,
-        id: compositionId,
-        defaultProps: serializeThenDeserializeInStudio(defaultProps),
-        props: serializeThenDeserializeInStudio(c2.props ?? originalProps),
-        defaultCodec: defaultCodec ?? null,
-        defaultOutName: defaultOutName ?? null,
-        defaultVideoImageFormat: defaultVideoImageFormat ?? null,
-        defaultPixelFormat: defaultPixelFormat ?? null,
-        defaultProResProfile: defaultProResProfile ?? null,
-        defaultSampleRate: defaultSampleRate ?? null
-      };
     });
   }
-  const data = validateCalculated({
+  return makeVideoConfigWithMetadata({
     calculated: calculatedProm,
     compositionDurationInFrames,
     compositionFps,
     compositionHeight,
     compositionWidth,
-    compositionId
+    compositionId,
+    defaultProps,
+    originalProps
   });
-  if (calculatedProm === null) {
+};
+var resolveVideoConfig = (params) => {
+  const resolved = resolveVideoConfigWithMetadata(params);
+  if (typeof resolved === "object" && "then" in resolved) {
+    return resolved.then(({ videoConfig }) => videoConfig);
+  }
+  return resolved.videoConfig;
+};
+var resolveVideoConfigWithMetadataOrCatch = (params) => {
+  try {
     return {
-      ...data,
-      id: compositionId,
-      defaultProps: serializeThenDeserializeInStudio(defaultProps ?? {}),
-      props: serializeThenDeserializeInStudio(originalProps),
-      defaultCodec: null,
-      defaultOutName: null,
-      defaultVideoImageFormat: null,
-      defaultPixelFormat: null,
-      defaultProResProfile: null,
-      defaultSampleRate: null
+      type: "success",
+      result: resolveVideoConfigWithMetadata(params)
+    };
+  } catch (err) {
+    return {
+      type: "error",
+      error: err
     };
   }
-  return {
-    ...data,
-    id: compositionId,
-    defaultProps: serializeThenDeserializeInStudio(defaultProps ?? {}),
-    props: serializeThenDeserializeInStudio(calculatedProm.props ?? originalProps),
-    defaultCodec: calculatedProm.defaultCodec ?? null,
-    defaultOutName: calculatedProm.defaultOutName ?? null,
-    defaultVideoImageFormat: calculatedProm.defaultVideoImageFormat ?? null,
-    defaultPixelFormat: calculatedProm.defaultPixelFormat ?? null,
-    defaultProResProfile: calculatedProm.defaultProResProfile ?? null,
-    defaultSampleRate: calculatedProm.defaultSampleRate ?? null
-  };
 };
 var resolveVideoConfigOrCatch = (params) => {
   try {
@@ -10940,8 +10996,8 @@ var resolveVideoConfigOrCatch = (params) => {
 };
 
 // src/sequence-stack-traces.ts
-import React33 from "react";
-var SequenceStackTracesUpdateContext = React33.createContext(() => {});
+import React34 from "react";
+var SequenceStackTracesUpdateContext = React34.createContext(() => {});
 
 // src/setup-env-variables.ts
 var getEnvVariables = () => {
@@ -10971,8 +11027,8 @@ var setupEnvVariables = () => {
 };
 
 // src/use-current-scale.ts
-import React34, { createContext as createContext25 } from "react";
-var CurrentScaleContext = React34.createContext(null);
+import React35, { createContext as createContext25 } from "react";
+var CurrentScaleContext = React35.createContext(null);
 var PreviewSizeContext = createContext25({
   setSize: () => {
     return;
@@ -10997,8 +11053,8 @@ var calculateScale = ({
   return Number(previewSize);
 };
 var useCurrentScale = (options) => {
-  const hasContext = React34.useContext(CurrentScaleContext);
-  const zoomContext = React34.useContext(PreviewSizeContext);
+  const hasContext = React35.useContext(CurrentScaleContext);
+  const zoomContext = React35.useContext(PreviewSizeContext);
   const config = useUnsafeVideoConfig();
   const env = useRemotionEnvironment();
   if (hasContext === null || config === null || zoomContext === null) {
@@ -11028,8 +11084,8 @@ var useCurrentScale = (options) => {
 };
 
 // src/use-pixel-density.ts
-import React35, { useContext as useContext35 } from "react";
-var PixelDensityContext = React35.createContext(null);
+import React36, { useContext as useContext35 } from "react";
+var PixelDensityContext = React36.createContext(null);
 var getBrowserPixelDensity = () => {
   if (typeof window === "undefined") {
     return 1;
@@ -11283,7 +11339,7 @@ var OffthreadVideoForRendering = ({
 };
 
 // src/video/VideoForPreview.tsx
-import React37, {
+import React38, {
   forwardRef as forwardRef13,
   useCallback as useCallback23,
   useContext as useContext37,
@@ -11356,7 +11412,7 @@ var VideoForDevelopmentRefForwardingFunction = (props2, ref) => {
       ref: videoRef
     });
   }, [context.audioContext]);
-  const effectToUse = React37.useInsertionEffect ?? React37.useLayoutEffect;
+  const effectToUse = React38.useInsertionEffect ?? React38.useLayoutEffect;
   effectToUse(() => {
     return () => {
       requestAnimationFrame(() => {
@@ -11772,23 +11828,23 @@ var watchStaticFile = (fileName, callback) => {
 };
 
 // src/wrap-remotion-context.tsx
-import React39, { useMemo as useMemo37 } from "react";
+import React40, { useMemo as useMemo37 } from "react";
 import { jsx as jsx36 } from "react/jsx-runtime";
 function useRemotionContexts() {
-  const compositionManagerCtx = React39.useContext(CompositionManager);
-  const timelineContext = React39.useContext(TimelineContext);
-  const setTimelineContext = React39.useContext(SetTimelineContext);
-  const sequenceContext = React39.useContext(SequenceContext);
-  const nonceContext = React39.useContext(NonceContext);
-  const canUseRemotionHooksContext = React39.useContext(CanUseRemotionHooks);
-  const preloadContext = React39.useContext(PreloadContext);
-  const resolveCompositionContext = React39.useContext(ResolveCompositionContext);
-  const renderAssetManagerContext = React39.useContext(RenderAssetManager);
-  const sequenceManagerContext = React39.useContext(SequenceManager);
-  const sequenceManagerRefContext = React39.useContext(SequenceManagerRefContext);
-  const visualModePropStatusesRefContext = React39.useContext(VisualModePropStatusesRefContext);
-  const bufferManagerContext = React39.useContext(BufferingContextReact);
-  const logLevelContext = React39.useContext(LogLevelContext);
+  const compositionManagerCtx = React40.useContext(CompositionManager);
+  const timelineContext = React40.useContext(TimelineContext);
+  const setTimelineContext = React40.useContext(SetTimelineContext);
+  const sequenceContext = React40.useContext(SequenceContext);
+  const nonceContext = React40.useContext(NonceContext);
+  const canUseRemotionHooksContext = React40.useContext(CanUseRemotionHooks);
+  const preloadContext = React40.useContext(PreloadContext);
+  const resolveCompositionContext = React40.useContext(ResolveCompositionContext);
+  const renderAssetManagerContext = React40.useContext(RenderAssetManager);
+  const sequenceManagerContext = React40.useContext(SequenceManager);
+  const sequenceManagerRefContext = React40.useContext(SequenceManagerRefContext);
+  const visualModePropStatusesRefContext = React40.useContext(VisualModePropStatusesRefContext);
+  const bufferManagerContext = React40.useContext(BufferingContextReact);
+  const logLevelContext = React40.useContext(LogLevelContext);
   return useMemo37(() => ({
     compositionManagerCtx,
     timelineContext,
@@ -11948,6 +12004,7 @@ var Internals = {
   NonceContext,
   resolveVideoConfig,
   resolveVideoConfigOrCatch,
+  resolveVideoConfigWithMetadataOrCatch,
   ResolveCompositionContext,
   useResolvedVideoConfig,
   resolveCompositionsRef,
@@ -11964,6 +12021,8 @@ var Internals = {
   BufferingProvider,
   BufferingContextReact,
   getComponentsToAddStacksTo,
+  getSequenceComponent,
+  getSingleChildComponent,
   CurrentScaleContext,
   PixelDensityContext,
   PreviewSizeContext,
@@ -12021,17 +12080,17 @@ var Internals = {
   fromField
 };
 // src/series/index.tsx
-import React41, {
+import React42, {
   forwardRef as forwardRef14,
   useMemo as useMemo38
 } from "react";
 
 // src/series/flatten-children.tsx
-import React40 from "react";
+import React41 from "react";
 var flattenChildren = (children) => {
-  const childrenArray = React40.Children.toArray(children);
+  const childrenArray = React41.Children.toArray(children);
   return childrenArray.reduce((flatChildren, child) => {
-    if (child.type === React40.Fragment) {
+    if (child.type === React41.Fragment) {
       return flatChildren.concat(flattenChildren(child.props.children));
     }
     flatChildren.push(child);
@@ -12122,7 +12181,7 @@ var SeriesInner = (props2) => {
         index: i,
         childrenLength: flattenedChildren.length
       });
-      return React41.cloneElement(castedElement, {
+      return React42.cloneElement(castedElement, {
         _remotionInternalRender: (resolvedProps, ref) => {
           const durationInFramesProp = resolvedProps.durationInFrames;
           const {
@@ -12276,14 +12335,14 @@ var staticFile = (path) => {
   return preparsed;
 };
 // src/Still.tsx
-import React42 from "react";
+import React43 from "react";
 var Still = (props2) => {
   const newProps = {
     ...props2,
     durationInFrames: 1,
     fps: 1
   };
-  return React42.createElement(Composition, newProps);
+  return React43.createElement(Composition, newProps);
 };
 addSequenceStackTraces(Still);
 // src/video/html5-video.tsx
@@ -12790,6 +12849,7 @@ var Config = new Proxy(proxyObj, {
 });
 Sequence.displayName = "Sequence";
 addSequenceStackTraces(Sequence);
+setSequenceComponent(Sequence);
 addSequenceStackTraces(Composition);
 addSequenceStackTraces(Folder);
 export {