@remotion/media 4.0.474 → 4.0.476

package/dist/debug-overlay/preview-overlay.d.ts

@@ -77,13 +77,13 @@ export declare const drawPreviewOverlay: ({ context, audioTime, audioContextStat
             destroy: () => void;
             initialFrame: import("mediabunny").WrappedCanvas | null;
             isDestroyed: () => boolean;
-            tryToSatisfySeek: (time: number) => {
+            tryToSatisfySeek: (time: number) => Promise<{
                 type: "not-satisfied";
                 reason: string;
             } | {
                 type: "satisfied";
                 frame: import("mediabunny").WrappedCanvas;
-            };
+            }>;
         } | null;
         drawFrame: (frame: import("mediabunny").WrappedCanvas) => Promise<void>;
         redrawCurrentFrame: () => Promise<void>;

package/dist/esm/index.mjs

@@ -1000,6 +1000,11 @@ var resolveRequestInit = ({
 import { CanvasSink } from "mediabunny";
 import { Internals as Internals4 } from "remotion";
 
+// src/helpers/round-to-4-digits.ts
+var roundTo4Digits = (timestamp) => {
+  return Math.round(timestamp * 1000) / 1000;
+};
+
 // src/canvas-ahead-of-time.ts
 var BUFFER_SIZE = 3;
 var canvasesAheadOfTime = (videoSink, startTimestamp) => {
@@ -1119,11 +1124,6 @@ var makePrewarmedVideoIteratorCache = (videoSink) => {
   };
 };
 
-// src/helpers/round-to-4-digits.ts
-var roundTo4Digits = (timestamp) => {
-  return Math.round(timestamp * 1000) / 1000;
-};
-
 // src/video/video-preview-iterator.ts
 var createVideoIterator = async (timeToSeek, cache) => {
   let destroyed = false;
@@ -1132,7 +1132,28 @@ var createVideoIterator = async (timeToSeek, cache) => {
   const firstAwait = iterator.next();
   const initialFrame = firstAwait && firstAwait.type === "ready" ? firstAwait.frame : await firstAwait.wait();
   let lastReturnedFrame = initialFrame;
+  let peekedFrame = null;
+  const peek = async () => {
+    if (peekedFrame) {
+      return peekedFrame;
+    }
+    const next = iterator.next();
+    if (next.type === "ready") {
+      peekedFrame = next.frame;
+    } else {
+      peekedFrame = await next.wait();
+    }
+    return peekedFrame;
+  };
   const getNextOrNullIfNotAvailable = () => {
+    if (peekedFrame) {
+      const retValue = {
+        type: "got-frame-or-end",
+        frame: peekedFrame
+      };
+      peekedFrame = null;
+      return retValue;
+    }
     const next = iterator.next();
     if (next.type === "pending") {
       return {
@@ -1165,7 +1186,7 @@ var createVideoIterator = async (timeToSeek, cache) => {
       return;
     });
   };
-  const tryToSatisfySeek = (time) => {
+  const tryToSatisfySeek = async (time) => {
     if (lastReturnedFrame) {
       const frameTimestamp = roundTo4Digits(lastReturnedFrame.timestamp);
       if (roundTo4Digits(time) < frameTimestamp) {
@@ -1182,7 +1203,14 @@ var createVideoIterator = async (timeToSeek, cache) => {
           reason: `iterator is too far, most recently returned ${frameTimestamp}`
         };
       }
-      const frameEndTimestamp = roundTo4Digits(lastReturnedFrame.timestamp + lastReturnedFrame.duration);
+      let lastFrameDuration = lastReturnedFrame.duration;
+      if (lastFrameDuration === 0) {
+        const peeked = await peek();
+        if (peeked) {
+          lastFrameDuration = peeked.timestamp - lastReturnedFrame.timestamp;
+        }
+      }
+      const frameEndTimestamp = roundTo4Digits(lastReturnedFrame.timestamp + lastFrameDuration);
       const timestamp = roundTo4Digits(time);
       if (frameTimestamp <= timestamp && frameEndTimestamp > timestamp) {
         return {
@@ -1270,6 +1298,7 @@ var videoIteratorManager = async ({
   let framesRendered = 0;
   let currentDelayHandle = null;
   let lastDrawnFrame = null;
+  let currentSeek = null;
   const clearLastDrawnFrame = () => {
     lastDrawnFrame = null;
   };
@@ -1336,6 +1365,7 @@ var videoIteratorManager = async ({
       videoFrameIterator?.destroy();
       const delayHandle = __using(__stack, delayPlaybackHandleIfNotPremounting(), 0);
       currentDelayHandle = delayHandle;
+      currentSeek = timeToSeek;
       const iterator = await createVideoIterator(timeToSeek, prewarmedVideoIteratorCache);
       videoIteratorsCreated++;
       videoFrameIterator = iterator;
@@ -1362,6 +1392,10 @@ var videoIteratorManager = async ({
     if (!videoFrameIterator) {
       return;
     }
+    if (currentSeek !== null && roundTo4Digits(currentSeek) === roundTo4Digits(newTime)) {
+      return;
+    }
+    currentSeek = newTime;
     if (getIsLooping()) {
       if (getLoopSegmentMediaEndTimestamp() - newTime < 1) {
         prewarmedVideoIteratorCache.prewarmIteratorForLooping({
@@ -1369,7 +1403,7 @@ var videoIteratorManager = async ({
         });
       }
     }
-    const videoSatisfyResult = videoFrameIterator.tryToSatisfySeek(newTime);
+    const videoSatisfyResult = await videoFrameIterator.tryToSatisfySeek(newTime);
     if (videoSatisfyResult.type === "satisfied") {
       await drawFrame(videoSatisfyResult.frame);
       return;
@@ -2166,7 +2200,7 @@ var AudioForPreviewAssertedShowing = ({
   const parentSequence = useContext2(SequenceContext);
   const isPremounting = Boolean(parentSequence?.premounting);
   const isPostmounting = Boolean(parentSequence?.postmounting);
-  const sequenceOffset = ((parentSequence?.cumulatedFrom ?? 0) + (parentSequence?.relativeFrom ?? 0)) / videoConfig.fps;
+  const sequenceOffset = (parentSequence?.absoluteFrom ?? 0) / videoConfig.fps;
   const bufferingContext = useContext2(Internals7.BufferingContextReact);
   if (!bufferingContext) {
     throw new Error("useMediaPlayback must be used inside a <BufferingContext>");
@@ -4581,7 +4615,7 @@ var audioSchema = {
     min: 0.1,
     step: 0.01,
     default: 1,
-    description: "Playback Rate",
+    description: "Playback rate",
     hiddenFromList: false,
     keyframable: false
   },
@@ -4832,7 +4866,7 @@ var VideoForPreviewAssertedShowing = ({
   const parentSequence = useContext4(SequenceContext2);
   const isPremounting = Boolean(parentSequence?.premounting);
   const isPostmounting = Boolean(parentSequence?.postmounting);
-  const sequenceOffset = ((parentSequence?.cumulatedFrom ?? 0) + (parentSequence?.relativeFrom ?? 0)) / videoConfig.fps;
+  const sequenceOffset = (parentSequence?.absoluteFrom ?? 0) / videoConfig.fps;
   const currentTime = frame / videoConfig.fps;
   const currentTimeRef = useRef2(currentTime);
   currentTimeRef.current = currentTime;
@@ -5507,7 +5541,7 @@ var videoSchema = {
     min: 0.1,
     step: 0.01,
     default: 1,
-    description: "Playback Rate",
+    description: "Playback rate",
     hiddenFromList: false,
     keyframable: false
   },

package/dist/index.d.ts

@@ -62,7 +62,7 @@ export declare const experimental_Video: import("react").ComponentType<{
     objectFit: import(".").VideoObjectFit;
     _experimentalInitiallyDrawCachedFrame: boolean;
     effects: import("remotion").EffectsProp;
-}> & Omit<import("react").HTMLAttributes<HTMLElement>, "_experimentalInitiallyDrawCachedFrame" | "audioStreamIndex" | "className" | "credentials" | "debugOverlay" | "delayRenderRetries" | "delayRenderTimeoutInMilliseconds" | "disallowFallbackToOffthreadVideo" | "effects" | "fallbackOffthreadVideoProps" | "headless" | "logLevel" | "loop" | "loopVolumeCurveBehavior" | "muted" | "objectFit" | "onError" | "onVideoFrame" | "playbackRate" | "requestInit" | "showInTimeline" | "src" | "stack" | "style" | "toneFrequency" | "trimAfter" | "trimBefore" | "volume"> & Record<`data-${string}`, string | undefined> & Pick<import("remotion").SequenceProps, "durationInFrames" | "from" | "hidden" | "name">>;
+}> & Omit<import("react").HTMLAttributes<HTMLElement>, "_experimentalInitiallyDrawCachedFrame" | "audioStreamIndex" | "className" | "credentials" | "debugOverlay" | "delayRenderRetries" | "delayRenderTimeoutInMilliseconds" | "disallowFallbackToOffthreadVideo" | "effects" | "fallbackOffthreadVideoProps" | "headless" | "logLevel" | "loop" | "loopVolumeCurveBehavior" | "muted" | "objectFit" | "onError" | "onVideoFrame" | "playbackRate" | "requestInit" | "showInTimeline" | "src" | "stack" | "style" | "toneFrequency" | "trimAfter" | "trimBefore" | "volume"> & Record<`data-${string}`, string | undefined> & Pick<import("remotion").SequenceProps, "durationInFrames" | "from" | "hidden" | "name" | "showInTimeline">>;
 export { AudioForPreview } from './audio/audio-for-preview';
 export { AudioProps, FallbackHtml5AudioProps } from './audio/props';
 export { MediaErrorAction } from './on-error';

package/dist/video/props.d.ts

@@ -64,5 +64,5 @@ export type NativeVideoProps = Omit<React.HTMLAttributes<HTMLElement>, keyof Man
 export type InnerVideoProps = MandatoryVideoProps & OuterVideoProps & Omit<OptionalVideoProps, 'effects'> & NativeVideoProps & {
     effects: EffectDefinitionAndStack<unknown>[];
 };
-export type VideoProps = MandatoryVideoProps & Partial<OuterVideoProps> & Partial<OptionalVideoProps> & NativeVideoProps & Pick<SequenceProps, 'durationInFrames' | 'from' | 'name' | 'hidden'>;
+export type VideoProps = MandatoryVideoProps & Partial<OuterVideoProps> & Partial<OptionalVideoProps> & NativeVideoProps & Pick<SequenceProps, 'durationInFrames' | 'from' | 'name' | 'showInTimeline' | 'hidden'>;
 export {};

package/dist/video/video-preview-iterator.d.ts

@@ -12,12 +12,12 @@ export declare const createVideoIterator: (timeToSeek: number, cache: {
     destroy: () => void;
     initialFrame: WrappedCanvas | null;
     isDestroyed: () => boolean;
-    tryToSatisfySeek: (time: number) => {
+    tryToSatisfySeek: (time: number) => Promise<{
         type: "not-satisfied";
         reason: string;
     } | {
         type: "satisfied";
         frame: WrappedCanvas;
-    };
+    }>;
 }>;
 export type VideoIterator = Awaited<ReturnType<typeof createVideoIterator>>;

package/dist/video/video.d.ts

@@ -32,4 +32,4 @@ export declare const Video: React.ComponentType<{
     objectFit: import("./props").VideoObjectFit;
     _experimentalInitiallyDrawCachedFrame: boolean;
     effects: import("remotion").EffectsProp;
-}> & Omit<React.HTMLAttributes<HTMLElement>, "_experimentalInitiallyDrawCachedFrame" | "audioStreamIndex" | "className" | "credentials" | "debugOverlay" | "delayRenderRetries" | "delayRenderTimeoutInMilliseconds" | "disallowFallbackToOffthreadVideo" | "effects" | "fallbackOffthreadVideoProps" | "headless" | "logLevel" | "loop" | "loopVolumeCurveBehavior" | "muted" | "objectFit" | "onError" | "onVideoFrame" | "playbackRate" | "requestInit" | "showInTimeline" | "src" | "stack" | "style" | "toneFrequency" | "trimAfter" | "trimBefore" | "volume"> & Record<`data-${string}`, string | undefined> & Pick<import("remotion").SequenceProps, "durationInFrames" | "from" | "hidden" | "name">>;
+}> & Omit<React.HTMLAttributes<HTMLElement>, "_experimentalInitiallyDrawCachedFrame" | "audioStreamIndex" | "className" | "credentials" | "debugOverlay" | "delayRenderRetries" | "delayRenderTimeoutInMilliseconds" | "disallowFallbackToOffthreadVideo" | "effects" | "fallbackOffthreadVideoProps" | "headless" | "logLevel" | "loop" | "loopVolumeCurveBehavior" | "muted" | "objectFit" | "onError" | "onVideoFrame" | "playbackRate" | "requestInit" | "showInTimeline" | "src" | "stack" | "style" | "toneFrequency" | "trimAfter" | "trimBefore" | "volume"> & Record<`data-${string}`, string | undefined> & Pick<import("remotion").SequenceProps, "durationInFrames" | "from" | "hidden" | "name" | "showInTimeline">>;

package/dist/video-iterator-manager.d.ts

@@ -27,13 +27,13 @@ export declare const videoIteratorManager: ({ delayPlaybackHandleIfNotPremountin
         destroy: () => void;
         initialFrame: WrappedCanvas | null;
         isDestroyed: () => boolean;
-        tryToSatisfySeek: (time: number) => {
+        tryToSatisfySeek: (time: number) => Promise<{
             type: "not-satisfied";
             reason: string;
         } | {
             type: "satisfied";
             frame: WrappedCanvas;
-        };
+        }>;
     } | null;
     drawFrame: (frame: WrappedCanvas) => Promise<void>;
     redrawCurrentFrame: () => Promise<void>;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@remotion/media",
-	"version": "4.0.474",
+	"version": "4.0.476",
 	"main": "dist/index.js",
 	"types": "dist/index.d.ts",
 	"module": "dist/esm/index.mjs",
@@ -23,7 +23,7 @@
 	},
 	"dependencies": {
 		"mediabunny": "1.45.0",
-		"remotion": "4.0.474",
+		"remotion": "4.0.476",
 		"zod": "4.3.6"
 	},
 	"peerDependencies": {
@@ -31,7 +31,7 @@
 		"react-dom": ">=16.8.0"
 	},
 	"devDependencies": {
-		"@remotion/eslint-config-internal": "4.0.474",
+		"@remotion/eslint-config-internal": "4.0.476",
 		"@vitest/browser-webdriverio": "4.0.9",
 		"eslint": "9.19.0",
 		"react": "19.2.3",