@remotion/studio 4.0.372 → 4.0.374

package/dist/esm/{chunk-f8dxt5wd.js → chunk-1bd2r4wv.js}

@@ -17615,7 +17615,7 @@ var loadPlaybackRate = () => {
 
 // src/components/PlaybackRatePersistor.tsx
 var PlaybackRatePersistor = () => {
-  const { setPlaybackRate, playbackRate } = useContext49(Internals40.Timeline.TimelineContext);
+  const { setPlaybackRate, playbackRate } = useContext49(Internals40.TimelineContext);
   useEffect54(() => {
     setPlaybackRate(loadPlaybackRate());
   }, [setPlaybackRate]);
@@ -17924,7 +17924,35 @@ var TimelineZoomControls = () => {
 import ReactDOM8 from "react-dom/client";
 import { Internals as Internals44 } from "remotion";
 import { jsx as jsx176 } from "react/jsx-runtime";
-var compose = ({
+var svgToImageBitmap = (svg) => {
+  const computedStyle = getComputedStyle(svg);
+  const { transform: originalTransform } = computedStyle;
+  svg.style.transform = "none";
+  const svgDimensions = svg.getBoundingClientRect();
+  svg.style.transform = originalTransform;
+  if (svgDimensions.width === 0 || svgDimensions.height === 0) {
+    return Promise.resolve(null);
+  }
+  const svgData = new XMLSerializer().serializeToString(svg);
+  return new Promise((resolve, reject) => {
+    const image = new Image(svgDimensions.width, svgDimensions.height);
+    const url = "data:image/svg+xml;base64," + window.btoa(svgData);
+    image.onload = function() {
+      resolve({
+        image,
+        width: svgDimensions.width,
+        height: svgDimensions.height,
+        left: svgDimensions.left,
+        top: svgDimensions.top
+      });
+    };
+    image.onerror = () => {
+      reject(new Error("Failed to convert SVG to image"));
+    };
+    image.src = url;
+  });
+};
+var compose = async ({
   composables,
   width,
   height
@@ -17935,7 +17963,15 @@ var compose = ({
     throw new Error("Could not get context");
   }
   for (const composable of composables) {
-    context.drawImage(composable, 0, 0);
+    if (composable.type === "canvas") {
+      const boundingClientRect = composable.element.getBoundingClientRect();
+      context.drawImage(composable.element, boundingClientRect.left, boundingClientRect.top);
+    } else if (composable.type === "svg") {
+      const imageBitmap = await svgToImageBitmap(composable.element);
+      if (imageBitmap) {
+        context.drawImage(imageBitmap.image, imageBitmap.left, imageBitmap.top);
+      }
+    }
   }
   return canvas;
 };
@@ -17944,86 +17980,75 @@ var findCanvasElements = (element) => {
   const composables = [];
   Array.from(canvasElements).forEach((canvasElement) => {
     const canvas = canvasElement;
-    composables.push(canvas);
+    composables.push({
+      type: "canvas",
+      element: canvas
+    });
   });
   return composables;
 };
-var waitForReady = (timeoutInMilliseconds) => {
+var findSvgElements = (element) => {
+  const svgElements = element.querySelectorAll("svg");
+  const composables = [];
+  Array.from(svgElements).forEach((svgElement) => {
+    const svg = svgElement;
+    composables.push({
+      type: "svg",
+      element: svg
+    });
+  });
+  return composables;
+};
+var waitForReady = (timeoutInMilliseconds, scope) => {
   const { promise, resolve, reject } = Promise.withResolvers();
   const start = Date.now();
   const interval = setInterval(() => {
-    if (window.remotion_renderReady === true) {
+    if (scope.remotion_renderReady === true) {
       resolve(true);
       clearInterval(interval);
       return;
     }
-    if (window.remotion_cancelledError !== undefined) {
-      reject(window.remotion_cancelledError);
+    if (scope.remotion_cancelledError !== undefined) {
+      reject(scope.remotion_cancelledError);
       clearInterval(interval);
       return;
     }
     if (Date.now() - start > timeoutInMilliseconds + 3000) {
-      reject(new Error(Object.values(window.remotion_delayRenderTimeouts).map((d) => d.label).join(", ")));
+      reject(new Error(Object.values(scope.remotion_delayRenderTimeouts).map((d) => d.label).join(", ")));
       clearInterval(interval);
     }
   }, 50);
   return promise;
 };
-var renderStillOnWeb = async ({
+var COMP_ID = "markup";
+var internalRenderStillOnWeb = async ({
   Component,
   width,
   height,
   fps,
   durationInFrames,
-  frame: frame2
+  frame: frame2,
+  delayRenderTimeoutInMilliseconds,
+  logLevel
 }) => {
   const div = document.createElement("div");
   div.style.display = "flex";
   div.style.backgroundColor = "transparent";
-  div.style.position = "absolute";
+  div.style.position = "fixed";
   div.style.width = `${width}px`;
   div.style.height = `${height}px`;
+  div.style.zIndex = "-9999";
   document.body.appendChild(div);
-  const delayRenderTimeoutInMilliseconds = 1e4;
   if (!ReactDOM8.createRoot) {
     throw new Error("@remotion/web-renderer requires React 18 or higher");
   }
-  const compositionManagerContext = {
-    currentCompositionMetadata: {
-      durationInFrames,
-      fps,
-      height,
-      width,
-      props: {},
-      defaultCodec: null,
-      defaultOutName: null,
-      defaultVideoImageFormat: null,
-      defaultPixelFormat: null,
-      defaultProResProfile: null
-    },
-    folders: [],
-    compositions: [
-      {
-        id: "markup",
-        component: Component,
-        nonce: 0,
-        defaultProps: undefined,
-        folderName: null,
-        parentFolderName: null,
-        schema: null,
-        calculateMetadata: null,
-        durationInFrames,
-        fps,
-        height,
-        width
-      }
-    ],
-    canvasContent: {
-      type: "composition",
-      compositionId: "markup"
-    }
-  };
   const root = ReactDOM8.createRoot(div);
+  const delayRenderScope = {
+    remotion_renderReady: true,
+    remotion_delayRenderTimeouts: {},
+    remotion_puppeteerTimeout: delayRenderTimeoutInMilliseconds,
+    remotion_attempt: 0
+  };
   root.render(/* @__PURE__ */ jsx176(Internals44.RemotionEnvironmentContext, {
     value: {
       isStudio: false,
@@ -18032,54 +18057,80 @@ var renderStillOnWeb = async ({
       isReadOnlyStudio: false,
       isClientSideRendering: true
     },
-    children: /* @__PURE__ */ jsx176(Internals44.RemotionRoot, {
-      audioEnabled: true,
-      videoEnabled: true,
-      logLevel: "info",
-      numberOfAudioTags: 0,
-      onlyRenderComposition: null,
-      currentCompositionMetadata: {
-        props: {},
-        durationInFrames,
-        fps,
-        height,
-        width,
-        defaultCodec: null,
-        defaultOutName: null,
-        defaultVideoImageFormat: null,
-        defaultPixelFormat: null,
-        defaultProResProfile: null
-      },
-      audioLatencyHint: "interactive",
-      children: /* @__PURE__ */ jsx176(Internals44.CanUseRemotionHooks, {
-        value: true,
-        children: /* @__PURE__ */ jsx176(Internals44.CompositionManager.Provider, {
-          value: compositionManagerContext,
-          children: /* @__PURE__ */ jsx176(Component, {})
+    children: /* @__PURE__ */ jsx176(Internals44.DelayRenderContextType.Provider, {
+      value: delayRenderScope,
+      children: /* @__PURE__ */ jsx176(Internals44.CompositionManagerProvider, {
+        initialCanvasContent: {
+          type: "composition",
+          compositionId: COMP_ID
+        },
+        onlyRenderComposition: null,
+        currentCompositionMetadata: {
+          props: {},
+          durationInFrames,
+          fps,
+          height,
+          width,
+          defaultCodec: null,
+          defaultOutName: null,
+          defaultVideoImageFormat: null,
+          defaultPixelFormat: null,
+          defaultProResProfile: null
+        },
+        initialCompositions: [
+          {
+            id: COMP_ID,
+            component: Component,
+            nonce: 0,
+            defaultProps: undefined,
+            folderName: null,
+            parentFolderName: null,
+            schema: null,
+            calculateMetadata: null,
+            durationInFrames,
+            fps,
+            height,
+            width
+          }
+        ],
+        children: /* @__PURE__ */ jsx176(Internals44.RemotionRoot, {
+          audioEnabled: false,
+          videoEnabled: true,
+          logLevel,
+          numberOfAudioTags: 0,
+          audioLatencyHint: "interactive",
+          frameState: {
+            [COMP_ID]: frame2
+          },
+          children: /* @__PURE__ */ jsx176(Internals44.CanUseRemotionHooks, {
+            value: true,
+            children: /* @__PURE__ */ jsx176(Component, {})
+          })
         })
       })
     })
   }));
-  window.remotion_setFrame(frame2, "markup", frame2);
-  await waitForReady(delayRenderTimeoutInMilliseconds);
+  await waitForReady(delayRenderTimeoutInMilliseconds, delayRenderScope);
   const canvasElements = findCanvasElements(div);
-  const composed = compose({
-    composables: canvasElements,
+  const svgElements = findSvgElements(div);
+  const composed = await compose({
+    composables: [...canvasElements, ...svgElements],
     width,
     height
   });
   const imageData = await composed.convertToBlob({
     type: "image/png"
   });
-  const blob = new Blob([imageData], { type: "image/png" });
-  const url = URL.createObjectURL(blob);
-  const a = document.createElement("a");
-  a.href = url;
-  a.download = "composed.png";
-  a.click();
-  URL.revokeObjectURL(url);
   root.unmount();
   div.remove();
+  return imageData;
+};
+var renderStillOnWeb = (options) => {
+  return internalRenderStillOnWeb({
+    ...options,
+    delayRenderTimeoutInMilliseconds: options.delayRenderTimeoutInMilliseconds ?? 30000,
+    logLevel: options.logLevel ?? "info"
+  });
 };
 
 // src/components/WebRender/TriggerWebRender.tsx
@@ -18106,6 +18157,13 @@ var TriggerWebRender = () => {
       fps: video.fps,
       durationInFrames: video.durationInFrames,
       frame: frame2
+    }).then((blob) => {
+      const url = URL.createObjectURL(blob);
+      const a = document.createElement("a");
+      a.href = url;
+      a.download = "composed.png";
+      a.click();
+      URL.revokeObjectURL(url);
     });
   }, [video, frame2]);
   return /* @__PURE__ */ jsx177(Button, {
@@ -18168,7 +18226,7 @@ var padding2 = {
   width: TIMELINE_PADDING
 };
 var PreviewToolbar = ({ readOnlyStudio, bufferStateDelayInMilliseconds }) => {
-  const { playbackRate, setPlaybackRate } = useContext53(Internals46.Timeline.TimelineContext);
+  const { playbackRate, setPlaybackRate } = useContext53(Internals46.TimelineContext);
   const { mediaMuted } = useContext53(Internals46.MediaVolumeContext);
   const { setMediaMuted } = useContext53(Internals46.SetMediaVolumeContext);
   const isVideoComposition = useIsVideoComposition();
@@ -20449,7 +20507,7 @@ import { Internals as Internals52 } from "remotion";
 var lastTimelinePositionWhileScrolling = null;
 var TimelinePlayCursorSyncer = () => {
   const video = Internals52.useVideo();
-  const timelineContext = useContext65(Internals52.Timeline.TimelineContext);
+  const timelineContext = useContext65(Internals52.TimelineContext);
   const timelinePosition = Internals52.Timeline.useTimelinePosition();
   const { canvasContent } = useContext65(Internals52.CompositionManager);
   const { zoom: zoomMap } = useContext65(TimelineZoomCtx);
@@ -20613,7 +20671,7 @@ var getTimelineSequenceLayout = ({
 // src/helpers/use-max-media-duration.ts
 import { getVideoMetadata as getVideoMetadata2 } from "@remotion/media-utils";
 
-// ../../node_modules/.bun/mediabunny@1.24.2/node_modules/mediabunny/dist/modules/src/misc.js
+// ../../node_modules/.bun/mediabunny@1.24.5/node_modules/mediabunny/dist/modules/src/misc.js
 /*!
  * Copyright (c) 2025-present, Vanilagy and contributors
  *
@@ -20965,13 +21023,13 @@ class CallSerializer {
     return this.currentPromise = this.currentPromise.then(fn);
   }
 }
-var isSafariCache = null;
-var isSafari = () => {
-  if (isSafariCache !== null) {
-    return isSafariCache;
+var isWebKitCache = null;
+var isWebKit = () => {
+  if (isWebKitCache !== null) {
+    return isWebKitCache;
   }
-  const result = !!(typeof navigator !== "undefined" && navigator.vendor?.match(/apple/i) && !navigator.userAgent?.match(/crios/i) && !navigator.userAgent?.match(/fxios/i) && !navigator.userAgent?.match(/Opera|OPT\//));
-  isSafariCache = result;
+  const result = !!(typeof navigator !== "undefined" && navigator.vendor?.match(/apple/i));
+  isWebKitCache = result;
   return result;
 };
 var isFirefoxCache = null;
@@ -21002,7 +21060,7 @@ var isNumber = (x) => {
   return typeof x === "number" && !Number.isNaN(x);
 };
 
-// ../../node_modules/.bun/mediabunny@1.24.2/node_modules/mediabunny/dist/modules/src/tags.js
+// ../../node_modules/.bun/mediabunny@1.24.5/node_modules/mediabunny/dist/modules/src/tags.js
 /*!
  * Copyright (c) 2025-present, Vanilagy and contributors
  *
@@ -21045,7 +21103,7 @@ class AttachedFile {
   }
 }
 
-// ../../node_modules/.bun/mediabunny@1.24.2/node_modules/mediabunny/dist/modules/src/codec.js
+// ../../node_modules/.bun/mediabunny@1.24.5/node_modules/mediabunny/dist/modules/src/codec.js
 /*!
  * Copyright (c) 2025-present, Vanilagy and contributors
  *
@@ -21318,7 +21376,7 @@ var parsePcmCodec = (codec) => {
   return { dataType, sampleSize, littleEndian, silentValue };
 };
 
-// ../../node_modules/.bun/mediabunny@1.24.2/node_modules/mediabunny/dist/modules/src/codec-data.js
+// ../../node_modules/.bun/mediabunny@1.24.5/node_modules/mediabunny/dist/modules/src/codec-data.js
 /*!
  * Copyright (c) 2025-present, Vanilagy and contributors
  *
@@ -22478,7 +22536,7 @@ var readVorbisComments = (bytes, metadataTags) => {
   }
 };
 
-// ../../node_modules/.bun/mediabunny@1.24.2/node_modules/mediabunny/dist/modules/src/demuxer.js
+// ../../node_modules/.bun/mediabunny@1.24.5/node_modules/mediabunny/dist/modules/src/demuxer.js
 /*!
  * Copyright (c) 2025-present, Vanilagy and contributors
  *
@@ -22493,7 +22551,7 @@ class Demuxer {
   }
 }
 
-// ../../node_modules/.bun/mediabunny@1.24.2/node_modules/mediabunny/dist/modules/src/custom-coder.js
+// ../../node_modules/.bun/mediabunny@1.24.5/node_modules/mediabunny/dist/modules/src/custom-coder.js
 /*!
  * Copyright (c) 2025-present, Vanilagy and contributors
  *
@@ -22504,7 +22562,7 @@ class Demuxer {
 var customVideoDecoders = [];
 var customAudioDecoders = [];
 
-// ../../node_modules/.bun/mediabunny@1.24.2/node_modules/mediabunny/dist/modules/src/packet.js
+// ../../node_modules/.bun/mediabunny@1.24.5/node_modules/mediabunny/dist/modules/src/packet.js
 /*!
  * Copyright (c) 2025-present, Vanilagy and contributors
  *
@@ -22636,7 +22694,7 @@ class EncodedPacket {
   }
 }
 
-// ../../node_modules/.bun/mediabunny@1.24.2/node_modules/mediabunny/dist/modules/src/sample.js
+// ../../node_modules/.bun/mediabunny@1.24.5/node_modules/mediabunny/dist/modules/src/sample.js
 /*!
  * Copyright (c) 2025-present, Vanilagy and contributors
  *
@@ -23084,7 +23142,7 @@ var validateCropRectangle = (crop, prefix) => {
 };
 var AUDIO_SAMPLE_FORMATS = new Set(["f32", "f32-planar", "s16", "s16-planar", "s32", "s32-planar", "u8", "u8-planar"]);
 
-// ../../node_modules/.bun/mediabunny@1.24.2/node_modules/mediabunny/dist/modules/src/media-sink.js
+// ../../node_modules/.bun/mediabunny@1.24.5/node_modules/mediabunny/dist/modules/src/media-sink.js
 /*!
  * Copyright (c) 2025-present, Vanilagy and contributors
  *
@@ -23678,7 +23736,7 @@ class VideoDecoderWrapper extends DecoderWrapper {
       this.customDecoderCallSerializer.call(() => this.customDecoder.decode(packet)).then(() => this.customDecoderQueueSize--);
     } else {
       assert(this.decoder);
-      if (!isSafari()) {
+      if (!isWebKit()) {
         insertSorted(this.inputTimestamps, packet.timestamp, (x) => x);
       }
       this.decoder.decode(packet.toEncodedVideoChunk());
@@ -23768,7 +23826,7 @@ class VideoDecoderWrapper extends DecoderWrapper {
     });
   }
   sampleHandler(sample) {
-    if (isSafari()) {
+    if (isWebKit()) {
       if (this.sampleQueue.length > 0 && sample.timestamp >= last(this.sampleQueue).timestamp) {
         for (const sample2 of this.sampleQueue) {
           this.finalizeAndEmitSample(sample2);
@@ -23826,7 +23884,7 @@ class VideoDecoderWrapper extends DecoderWrapper {
       this.currentAlphaPacketIndex = 0;
       this.alphaRaslSkipped = false;
     }
-    if (isSafari()) {
+    if (isWebKit()) {
       for (const sample of this.sampleQueue) {
         this.finalizeAndEmitSample(sample);
       }
@@ -24014,7 +24072,7 @@ class VideoSampleSink extends BaseMediaSampleSink {
   }
 }
 
-// ../../node_modules/.bun/mediabunny@1.24.2/node_modules/mediabunny/dist/modules/src/input-track.js
+// ../../node_modules/.bun/mediabunny@1.24.5/node_modules/mediabunny/dist/modules/src/input-track.js
 /*!
  * Copyright (c) 2025-present, Vanilagy and contributors
  *
@@ -24220,7 +24278,7 @@ class InputAudioTrack extends InputTrack {
   }
 }
 
-// ../../node_modules/.bun/mediabunny@1.24.2/node_modules/mediabunny/dist/modules/src/isobmff/isobmff-misc.js
+// ../../node_modules/.bun/mediabunny@1.24.5/node_modules/mediabunny/dist/modules/src/isobmff/isobmff-misc.js
 /*!
  * Copyright (c) 2025-present, Vanilagy and contributors
  *
@@ -24238,7 +24296,7 @@ var buildIsobmffMimeType = (info) => {
   return string;
 };
 
-// ../../node_modules/.bun/mediabunny@1.24.2/node_modules/mediabunny/dist/modules/src/isobmff/isobmff-reader.js
+// ../../node_modules/.bun/mediabunny@1.24.5/node_modules/mediabunny/dist/modules/src/isobmff/isobmff-reader.js
 /*!
  * Copyright (c) 2025-present, Vanilagy and contributors
  *
@@ -24314,7 +24372,7 @@ var readDataBox = (slice) => {
   }
 };
 
-// ../../node_modules/.bun/mediabunny@1.24.2/node_modules/mediabunny/dist/modules/src/isobmff/isobmff-demuxer.js
+// ../../node_modules/.bun/mediabunny@1.24.5/node_modules/mediabunny/dist/modules/src/isobmff/isobmff-demuxer.js
 /*!
  * Copyright (c) 2025-present, Vanilagy and contributors
  *
@@ -26570,7 +26628,7 @@ var sampleTableIsEmpty = (sampleTable) => {
   return sampleTable.sampleSizes.length === 0;
 };
 
-// ../../node_modules/.bun/mediabunny@1.24.2/node_modules/mediabunny/dist/modules/src/matroska/ebml.js
+// ../../node_modules/.bun/mediabunny@1.24.5/node_modules/mediabunny/dist/modules/src/matroska/ebml.js
 /*!
  * Copyright (c) 2025-present, Vanilagy and contributors
  *
@@ -26888,7 +26946,7 @@ function assertDefinedSize(size4) {
   }
 }
 
-// ../../node_modules/.bun/mediabunny@1.24.2/node_modules/mediabunny/dist/modules/src/matroska/matroska-misc.js
+// ../../node_modules/.bun/mediabunny@1.24.5/node_modules/mediabunny/dist/modules/src/matroska/matroska-misc.js
 /*!
  * Copyright (c) 2025-present, Vanilagy and contributors
  *
@@ -26906,7 +26964,7 @@ var buildMatroskaMimeType = (info) => {
   return string;
 };
 
-// ../../node_modules/.bun/mediabunny@1.24.2/node_modules/mediabunny/dist/modules/src/matroska/matroska-demuxer.js
+// ../../node_modules/.bun/mediabunny@1.24.5/node_modules/mediabunny/dist/modules/src/matroska/matroska-demuxer.js
 /*!
  * Copyright (c) 2025-present, Vanilagy and contributors
  *
@@ -27366,10 +27424,10 @@ class MatroskaDemuxer extends Demuxer {
       }
       assert(frameSizes.length === frameCount);
       blocks.splice(blockIndex, 1);
+      const blockDuration = originalBlock.duration || frameCount * (track.defaultDuration ?? 0);
       for (let i = 0;i < frameCount; i++) {
         const frameSize = frameSizes[i];
         const frameData = readBytes(slice, frameSize);
-        const blockDuration = originalBlock.duration || frameCount * (track.defaultDuration ?? 0);
         const frameTimestamp = originalBlock.timestamp + blockDuration * i / frameCount;
         const frameDuration = blockDuration / frameCount;
         blocks.splice(blockIndex + i, 0, {
@@ -28779,7 +28837,7 @@ var sortBlocksByReferences = (blocks) => {
   return result;
 };
 
-// ../../node_modules/.bun/mediabunny@1.24.2/node_modules/mediabunny/dist/modules/shared/mp3-misc.js
+// ../../node_modules/.bun/mediabunny@1.24.5/node_modules/mediabunny/dist/modules/shared/mp3-misc.js
 /*!
  * Copyright (c) 2025-present, Vanilagy and contributors
  *
@@ -29021,7 +29079,7 @@ var decodeSynchsafe = (synchsafed) => {
   return unsynchsafed;
 };
 
-// ../../node_modules/.bun/mediabunny@1.24.2/node_modules/mediabunny/dist/modules/src/id3.js
+// ../../node_modules/.bun/mediabunny@1.24.5/node_modules/mediabunny/dist/modules/src/id3.js
 /*!
  * Copyright (c) 2025-present, Vanilagy and contributors
  *
@@ -29721,7 +29779,7 @@ class Id3V2Reader {
   }
 }
 
-// ../../node_modules/.bun/mediabunny@1.24.2/node_modules/mediabunny/dist/modules/src/mp3/mp3-reader.js
+// ../../node_modules/.bun/mediabunny@1.24.5/node_modules/mediabunny/dist/modules/src/mp3/mp3-reader.js
 /*!
  * Copyright (c) 2025-present, Vanilagy and contributors
  *
@@ -29747,7 +29805,7 @@ var readNextFrameHeader = async (reader, startPos, until) => {
   return null;
 };
 
-// ../../node_modules/.bun/mediabunny@1.24.2/node_modules/mediabunny/dist/modules/src/mp3/mp3-demuxer.js
+// ../../node_modules/.bun/mediabunny@1.24.5/node_modules/mediabunny/dist/modules/src/mp3/mp3-demuxer.js
 /*!
  * Copyright (c) 2025-present, Vanilagy and contributors
  *
@@ -30007,7 +30065,7 @@ class Mp3AudioTrackBacking {
   }
 }
 
-// ../../node_modules/.bun/mediabunny@1.24.2/node_modules/mediabunny/dist/modules/src/ogg/ogg-misc.js
+// ../../node_modules/.bun/mediabunny@1.24.5/node_modules/mediabunny/dist/modules/src/ogg/ogg-misc.js
 /*!
  * Copyright (c) 2025-present, Vanilagy and contributors
  *
@@ -30078,7 +30136,7 @@ var buildOggMimeType = (info) => {
   return string;
 };
 
-// ../../node_modules/.bun/mediabunny@1.24.2/node_modules/mediabunny/dist/modules/src/ogg/ogg-reader.js
+// ../../node_modules/.bun/mediabunny@1.24.5/node_modules/mediabunny/dist/modules/src/ogg/ogg-reader.js
 /*!
  * Copyright (c) 2025-present, Vanilagy and contributors
  *
@@ -30142,7 +30200,7 @@ var findNextPageHeader = (slice, until) => {
   return false;
 };
 
-// ../../node_modules/.bun/mediabunny@1.24.2/node_modules/mediabunny/dist/modules/src/ogg/ogg-demuxer.js
+// ../../node_modules/.bun/mediabunny@1.24.5/node_modules/mediabunny/dist/modules/src/ogg/ogg-demuxer.js
 /*!
  * Copyright (c) 2025-present, Vanilagy and contributors
  *
@@ -30797,7 +30855,7 @@ var findPreviousPacketEndPosition = (pageList, startPage, startSegmentIndex) =>
   return { page: previousPage, segmentIndex: previousPage.lacingValues.length - 1 };
 };
 
-// ../../node_modules/.bun/mediabunny@1.24.2/node_modules/mediabunny/dist/modules/src/wave/wave-demuxer.js
+// ../../node_modules/.bun/mediabunny@1.24.5/node_modules/mediabunny/dist/modules/src/wave/wave-demuxer.js
 /*!
  * Copyright (c) 2025-present, Vanilagy and contributors
  *
@@ -31213,7 +31271,7 @@ class WaveAudioTrackBacking {
   }
 }
 
-// ../../node_modules/.bun/mediabunny@1.24.2/node_modules/mediabunny/dist/modules/src/adts/adts-reader.js
+// ../../node_modules/.bun/mediabunny@1.24.5/node_modules/mediabunny/dist/modules/src/adts/adts-reader.js
 /*!
  * Copyright (c) 2025-present, Vanilagy and contributors
  *
@@ -31274,7 +31332,7 @@ var readFrameHeader2 = (slice) => {
   };
 };
 
-// ../../node_modules/.bun/mediabunny@1.24.2/node_modules/mediabunny/dist/modules/src/adts/adts-demuxer.js
+// ../../node_modules/.bun/mediabunny@1.24.5/node_modules/mediabunny/dist/modules/src/adts/adts-demuxer.js
 /*!
  * Copyright (c) 2025-present, Vanilagy and contributors
  *
@@ -31490,7 +31548,7 @@ class AdtsAudioTrackBacking {
   }
 }
 
-// ../../node_modules/.bun/mediabunny@1.24.2/node_modules/mediabunny/dist/modules/src/flac/flac-misc.js
+// ../../node_modules/.bun/mediabunny@1.24.5/node_modules/mediabunny/dist/modules/src/flac/flac-misc.js
 /*!
  * Copyright (c) 2025-present, Vanilagy and contributors
  *
@@ -31625,7 +31683,7 @@ var calculateCrc8 = (data) => {
   return crc;
 };
 
-// ../../node_modules/.bun/mediabunny@1.24.2/node_modules/mediabunny/dist/modules/src/flac/flac-demuxer.js
+// ../../node_modules/.bun/mediabunny@1.24.5/node_modules/mediabunny/dist/modules/src/flac/flac-demuxer.js
 /*!
  * Copyright (c) 2025-present, Vanilagy and contributors
  *
@@ -31796,14 +31854,25 @@ class FlacDemuxer extends Demuxer {
         }
         slice.skip(-2);
         const lengthIfNextFlacFrameHeaderIsLegit = slice.filePos - startPos;
-        const nextIsLegit = this.readFlacFrameHeader({
+        const nextFrameHeader = this.readFlacFrameHeader({
           slice,
           isFirstPacket: false
         });
-        if (!nextIsLegit) {
+        if (!nextFrameHeader) {
           slice.skip(-1);
           continue;
         }
+        if (this.blockingBit === 0) {
+          if (nextFrameHeader.num - frameHeader.num !== 1) {
+            slice.skip(-1);
+            continue;
+          }
+        } else {
+          if (nextFrameHeader.num - frameHeader.num !== frameHeader.blockSize) {
+            slice.skip(-1);
+            continue;
+          }
+        }
         return {
           num: frameHeader.num,
           blockSize: frameHeader.blockSize,
@@ -31862,6 +31931,9 @@ class FlacDemuxer extends Demuxer {
     if (sampleRate === null) {
       return null;
     }
+    if (sampleRate !== this.audioInfo.sampleRate) {
+      return null;
+    }
     const size4 = slice.filePos - startOffset;
     const crc = readU8(slice);
     slice.skip(-size4);
@@ -32029,7 +32101,7 @@ class FlacAudioTrackBacking {
   }
 }
 
-// ../../node_modules/.bun/mediabunny@1.24.2/node_modules/mediabunny/dist/modules/src/input-format.js
+// ../../node_modules/.bun/mediabunny@1.24.5/node_modules/mediabunny/dist/modules/src/input-format.js
 /*!
  * Copyright (c) 2025-present, Vanilagy and contributors
  *
@@ -32351,7 +32423,7 @@ var ADTS = new AdtsInputFormat;
 var FLAC = new FlacInputFormat;
 var ALL_FORMATS = [MP4, QTFF, MATROSKA, WEBM, WAVE, OGG, FLAC, MP3, ADTS];
 
-// ../../node_modules/.bun/mediabunny@1.24.2/node_modules/mediabunny/dist/modules/src/source.js
+// ../../node_modules/.bun/mediabunny@1.24.5/node_modules/mediabunny/dist/modules/src/source.js
 var nodeAlias = (() => ({}));
 /*!
  * Copyright (c) 2025-present, Vanilagy and contributors
@@ -32469,7 +32541,7 @@ class UrlSource extends Source {
     return this._orchestrator.read(start, end);
   }
   async _runWorker(worker) {
-    while (!worker.aborted) {
+    while (true) {
       const existing = this._existingResponses.get(worker);
       this._existingResponses.delete(worker);
       let abortController = existing?.abortController;
@@ -32518,6 +32590,9 @@ class UrlSource extends Source {
             throw error;
           }
         }
+        if (worker.aborted) {
+          break;
+        }
         const { done, value } = readResult;
         if (done) {
           this._orchestrator.forgetWorker(worker);
@@ -32530,6 +32605,9 @@ class UrlSource extends Source {
         this.onread?.(worker.currentPos, worker.currentPos + value.length);
         this._orchestrator.supplyWorkerData(worker, value);
       }
+      if (worker.aborted) {
+        break;
+      }
     }
     worker.running = false;
   }
@@ -32721,7 +32799,7 @@ class ReadOrchestrator {
       currentPos: startPos,
       targetPos,
       running: false,
-      aborted: false,
+      aborted: this.disposed,
       pendingSlices: [],
       age: this.nextAge++
     };
@@ -32760,9 +32838,7 @@ class ReadOrchestrator {
     });
   }
   supplyWorkerData(worker, bytes) {
-    if (this.disposed) {
-      return;
-    }
+    assert(!worker.aborted);
     const start = worker.currentPos;
     const end = start + bytes.length;
     this.insertIntoCache({
@@ -32889,7 +32965,7 @@ class ReadOrchestrator {
   }
 }
 
-// ../../node_modules/.bun/mediabunny@1.24.2/node_modules/mediabunny/dist/modules/src/input.js
+// ../../node_modules/.bun/mediabunny@1.24.5/node_modules/mediabunny/dist/modules/src/input.js
 /*!
  * Copyright (c) 2025-present, Vanilagy and contributors
  *
@@ -32996,7 +33072,7 @@ class InputDisposedError extends Error {
   }
 }
 
-// ../../node_modules/.bun/mediabunny@1.24.2/node_modules/mediabunny/dist/modules/src/reader.js
+// ../../node_modules/.bun/mediabunny@1.24.5/node_modules/mediabunny/dist/modules/src/reader.js
 /*!
  * Copyright (c) 2025-present, Vanilagy and contributors
  *
@@ -33214,7 +33290,7 @@ var readAscii = (slice, length) => {
   }
   return str;
 };
-// ../../node_modules/.bun/mediabunny@1.24.2/node_modules/mediabunny/dist/modules/src/index.js
+// ../../node_modules/.bun/mediabunny@1.24.5/node_modules/mediabunny/dist/modules/src/index.js
 /*!
  * Copyright (c) 2025-present, Vanilagy and contributors
  *
@@ -33549,7 +33625,7 @@ import { useVideoConfig as useVideoConfig5 } from "remotion";
 async function extractFrames({
   src,
   timestampsInSeconds,
-  onFrame,
+  onVideoSample,
   signal
 }) {
   const input2 = new Input({
@@ -33590,8 +33666,7 @@ async function extractFrames({
       if (!videoSample) {
         continue;
       }
-      const videoFrame = videoSample.toVideoFrame();
-      onFrame(videoFrame);
+      onVideoSample(videoSample);
     }
   } catch (error) {
     if (error instanceof InputDisposedError) {
@@ -33607,11 +33682,15 @@ async function extractFrames({
 }
 
 // src/helpers/frame-database.ts
-var makeFrameDatabaseKey = (src, timestamp) => `${src}|${timestamp}`;
+var KEY_SEPARATOR = "|";
+var makeFrameDatabaseKey = (src, timestamp) => `${src}${KEY_SEPARATOR}${timestamp}`;
+var getFrameDatabaseKeyPrefix = (src) => {
+  return `${src}${KEY_SEPARATOR}`;
+};
 var frameDatabase = new Map;
 var aspectRatioCache = new Map;
 var getTimestampFromFrameDatabaseKey = (key4) => {
-  const split = key4.split("|");
+  const split = key4.split(KEY_SEPARATOR);
   return Number(split[split.length - 1]);
 };
 var getAspectRatioFromCache = (src) => {
@@ -33632,6 +33711,19 @@ var clearOldFrames = () => {
     frameDatabase.delete(key4);
   }
 };
+var clearFramesForSrc = (src) => {
+  const keysToRemove = [];
+  const prefix = getFrameDatabaseKeyPrefix(src);
+  for (const [key4, frame2] of frameDatabase.entries()) {
+    if (key4.startsWith(prefix)) {
+      frame2.frame.close();
+      keysToRemove.push(key4);
+    }
+  }
+  for (const key4 of keysToRemove) {
+    frameDatabase.delete(key4);
+  }
+};
 
 // src/helpers/resize-video-frame.ts
 var calculateNewDimensionsFromScale = ({
@@ -33773,7 +33865,8 @@ var fillWithCachedFrames = ({
   segmentDuration,
   fromSeconds
 }) => {
-  const keys = Array.from(frameDatabase.keys()).filter((k) => k.startsWith(src));
+  const prefix = getFrameDatabaseKeyPrefix(src);
+  const keys = Array.from(frameDatabase.keys()).filter((k) => k.startsWith(prefix));
   const targets = Array.from(filledSlots.keys());
   for (const timestamp of targets) {
     let bestKey;
@@ -33842,6 +33935,11 @@ var TimelineVideoInfo = ({ src, visualizationWidth, startFrom, durationInFrames
   const ref = useRef37(null);
   const [error, setError] = useState67(null);
   const aspectRatio = useRef37(getAspectRatioFromCache(src));
+  useEffect67(() => {
+    return () => {
+      clearFramesForSrc(src);
+    };
+  }, [src]);
   useEffect67(() => {
     if (error) {
       return;
@@ -33903,7 +34001,8 @@ var TimelineVideoInfo = ({ src, visualizationWidth, startFrom, durationInFrames
         return Array.from(filledSlots.keys()).map((timestamp) => timestamp / WEBCODECS_TIMESCALE);
       },
       src,
-      onFrame: (frame2) => {
+      onVideoSample: (sample) => {
+        const frame2 = sample.toVideoFrame();
         const scale = HEIGHT / frame2.displayHeight * window.devicePixelRatio;
         const transformed = resizeVideoFrame({
           frame: frame2,
@@ -42387,23 +42486,28 @@ var Studio = ({ rootComponent, readOnly }) => {
   useLayoutEffect2(() => {
     injectCSS();
   }, []);
-  return /* @__PURE__ */ jsx274(Internals67.RemotionRoot, {
-    audioEnabled: window.remotion_audioEnabled,
-    videoEnabled: window.remotion_videoEnabled,
-    logLevel: window.remotion_logLevel,
-    numberOfAudioTags: window.remotion_numberOfAudioTags,
+  return /* @__PURE__ */ jsx274(Internals67.CompositionManagerProvider, {
     onlyRenderComposition: null,
     currentCompositionMetadata: null,
-    audioLatencyHint: window.remotion_audioLatencyHint ?? "interactive",
-    children: /* @__PURE__ */ jsxs141(EditorContexts, {
-      readOnlyStudio: readOnly,
-      children: [
-        /* @__PURE__ */ jsx274(Editor, {
-          readOnlyStudio: readOnly,
-          Root: rootComponent
-        }),
-        readOnly ? null : createPortal(/* @__PURE__ */ jsx274(ServerDisconnected, {}), getServerDisconnectedDomElement())
-      ]
+    initialCompositions: [],
+    initialCanvasContent: null,
+    children: /* @__PURE__ */ jsx274(Internals67.RemotionRoot, {
+      frameState: null,
+      audioEnabled: window.remotion_audioEnabled,
+      videoEnabled: window.remotion_videoEnabled,
+      logLevel: window.remotion_logLevel,
+      numberOfAudioTags: window.remotion_numberOfAudioTags,
+      audioLatencyHint: window.remotion_audioLatencyHint ?? "interactive",
+      children: /* @__PURE__ */ jsxs141(EditorContexts, {
+        readOnlyStudio: readOnly,
+        children: [
+          /* @__PURE__ */ jsx274(Editor, {
+            readOnlyStudio: readOnly,
+            Root: rootComponent
+          }),
+          readOnly ? null : createPortal(/* @__PURE__ */ jsx274(ServerDisconnected, {}), getServerDisconnectedDomElement())
+        ]
+      })
     })
   });
 };