@remotion/media 4.0.496 → 4.0.498

package/dist/audio/audio.d.ts

@@ -1,4 +1,6 @@
 import React from 'react';
+import { type InteractivitySchema } from 'remotion';
+export declare const audioSchema: InteractivitySchema;
 export declare const Audio: React.ComponentType<{
     src: string;
     trimBefore?: number | undefined;

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

@@ -5,6 +5,8 @@ import { type AudioBufferSlice } from './make-iterator-with-priming';
 import type { Nonce } from './nonce-manager';
 import type { SharedAudioContextForMediaPlayer } from './shared-audio-context-for-media-player';
 type ScheduleAudioNode = (node: AudioBufferSourceNode, mediaTimestamp: number, originalUnloopedMediaTimestamp: number, sourceOffsetInSeconds: number, sourceDurationInSeconds: number) => ScheduleAudioNodeResult;
+export declare const MINIMUM_AUDIO_BUFFERING_TIME_SECONDS = 0.1;
+export declare const hasEnoughAudioToStartPlayback: (bufferedDuration: number) => boolean;
 export type AudioIteratorAnchor = {
     unloopedStartInSeconds: number;
     mediaStartInSeconds: number;

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

@@ -68,16 +68,22 @@ export declare const drawPreviewOverlay: ({ context, audioTime, audioContextStat
     videoIteratorManager: {
         startVideoIterator: (timeToSeek: number, nonce: import("../nonce-manager").Nonce) => Promise<void>;
         getVideoIteratorsCreated: () => number;
-        seek: ({ newTime, nonce }: {
+        seek: ({ newTime, nonce, fps, playbackRate, isPlaying, }: {
             newTime: number;
             nonce: import("../nonce-manager").Nonce;
+            fps: number;
+            playbackRate: number;
+            isPlaying: boolean;
         }) => Promise<void>;
         destroy: () => void;
         getVideoFrameIterator: () => {
             destroy: () => void;
             initialFrame: import("mediabunny").WrappedCanvas | null;
             isDestroyed: () => boolean;
-            tryToSatisfySeek: (time: number) => Promise<{
+            tryToSatisfySeek: (time: number, options: {
+                pendingFrameBehavior: "restart-iterator" | "wait";
+                shouldContinue: () => boolean;
+            }) => Promise<{
                 type: "not-satisfied";
                 reason: string;
             } | {

package/dist/esm/index.mjs

@@ -415,6 +415,10 @@ async function* makeLoopingIterator({
 }
 
 // src/audio-iterator-manager.ts
+var MINIMUM_AUDIO_BUFFERING_TIME_SECONDS = 0.1;
+var hasEnoughAudioToStartPlayback = (bufferedDuration) => {
+  return bufferedDuration >= MINIMUM_AUDIO_BUFFERING_TIME_SECONDS;
+};
 var anchorToContinuousTime = ({
   anchor,
   unloopedTimeInSeconds,
@@ -597,7 +601,7 @@ var audioIteratorManager = ({
           onDone();
           return;
         }
-        onScheduled(result.value.timelineTimestamp);
+        onScheduled(result.value.sourceDurationInSeconds);
         notifyNodeScheduled();
         onAudioChunk({
           buffer: result.value,
@@ -679,24 +683,32 @@ var audioIteratorManager = ({
     });
     audioIteratorsCreated++;
     audioBufferIterator = iterator;
-    let chunksScheduled = 0;
+    let bufferedDuration = 0;
+    let hasUnblockedPlayback = false;
+    const unblockPlayback = () => {
+      if (hasUnblockedPlayback) {
+        return;
+      }
+      hasUnblockedPlayback = true;
+      delayHandle.unblock();
+    };
     proceedScheduling({
       iterator,
       nonce,
       getTargetTime,
       playbackRate,
       scheduleAudioNode,
-      onScheduled: () => {
-        chunksScheduled++;
-        if (chunksScheduled === 6) {
-          delayHandle.unblock();
+      onScheduled: (sourceDurationInSeconds) => {
+        bufferedDuration += sourceDurationInSeconds;
+        if (hasEnoughAudioToStartPlayback(bufferedDuration)) {
+          unblockPlayback();
         }
       },
       onDestroyed: () => {
-        delayHandle.unblock();
+        unblockPlayback();
       },
       onDone: () => {
-        delayHandle.unblock();
+        unblockPlayback();
       },
       logLevel,
       currentTime: sharedAudioContext.audioContext.currentTime,
@@ -1265,7 +1277,6 @@ var makePrewarmedVideoIteratorCache = (videoSink) => {
 };
 
 // src/video/video-preview-iterator.ts
-var MAXIMUM_AWAITED_PEEK_DISTANCE_SECONDS = 0.05;
 var createVideoIterator = async (timeToSeek, cache) => {
   let destroyed = false;
   const iterator = cache.makeIteratorOrUsePrewarmed(timeToSeek);
@@ -1303,22 +1314,12 @@ var createVideoIterator = async (timeToSeek, cache) => {
       wait: next.wait
     };
   };
-  const peek = async () => {
-    const peeked = peekIfReady();
-    if (peeked.type === "ready") {
-      return peeked.frame;
-    }
-    return setPeekedFrame(await peeked.wait());
-  };
   const getFrameEndTimestampFromPeek = (frame) => {
     return frame ? roundTo4Digits(frame.timestamp) : Infinity;
   };
-  const getFrameEndTimestamp = async () => {
-    return getFrameEndTimestampFromPeek(await peek());
-  };
-  const getFrameEndTimestampIfCloseEnough = async ({
-    timestamp,
-    frameTimestamp
+  const getFrameEndTimestamp = async ({
+    pendingFrameBehavior,
+    shouldContinue
   }) => {
     const peeked = peekIfReady();
     if (peeked.type === "ready") {
@@ -1327,10 +1328,16 @@ var createVideoIterator = async (timeToSeek, cache) => {
         timestamp: getFrameEndTimestampFromPeek(peeked.frame)
       };
     }
-    if (timestamp - frameTimestamp > MAXIMUM_AWAITED_PEEK_DISTANCE_SECONDS) {
+    if (pendingFrameBehavior === "restart-iterator") {
       return { type: "pending" };
     }
+    if (!shouldContinue()) {
+      return { type: "cancelled" };
+    }
     const awaitedPeeked = setPeekedFrame(await peeked.wait());
+    if (!shouldContinue()) {
+      return { type: "cancelled" };
+    }
     return {
       type: "ready",
       timestamp: getFrameEndTimestampFromPeek(awaitedPeeked)
@@ -1384,7 +1391,13 @@ var createVideoIterator = async (timeToSeek, cache) => {
       return;
     });
   };
-  const tryToSatisfySeek = async (time) => {
+  const tryToSatisfySeek = async (time, options) => {
+    if (!options.shouldContinue()) {
+      return {
+        type: "not-satisfied",
+        reason: "seek was superseded"
+      };
+    }
     const timestamp = roundTo4Digits(time);
     if (lastReturnedFrame) {
       const frameTimestamp = roundTo4Digits(lastReturnedFrame.timestamp);
@@ -1402,8 +1415,23 @@ var createVideoIterator = async (timeToSeek, cache) => {
           reason: `iterator is too far, most recently returned ${frameTimestamp}`
         };
       }
-      const frameEndTimestamp = await getFrameEndTimestamp();
-      if (frameTimestamp <= timestamp && frameEndTimestamp > timestamp) {
+      const frameEndTimestamp = await getFrameEndTimestamp({
+        pendingFrameBehavior: options.pendingFrameBehavior,
+        shouldContinue: options.shouldContinue
+      });
+      if (frameEndTimestamp.type === "cancelled") {
+        return {
+          type: "not-satisfied",
+          reason: "seek was superseded"
+        };
+      }
+      if (frameEndTimestamp.type === "pending") {
+        return {
+          type: "not-satisfied",
+          reason: "iterator did not have next frame ready"
+        };
+      }
+      if (frameTimestamp <= timestamp && frameEndTimestamp.timestamp > timestamp) {
         return {
           type: "satisfied",
           frame: lastReturnedFrame
@@ -1423,6 +1451,12 @@ var createVideoIterator = async (timeToSeek, cache) => {
       };
     }
     while (true) {
+      if (!options.shouldContinue()) {
+        return {
+          type: "not-satisfied",
+          reason: "seek was superseded"
+        };
+      }
       const frame = getNextOrNullIfNotAvailable();
       if (frame.type === "need-to-wait-for-it") {
         return {
@@ -1445,10 +1479,16 @@ var createVideoIterator = async (timeToSeek, cache) => {
           };
         }
         const frameTimestamp = roundTo4Digits(frame.frame.timestamp);
-        const frameEndTimestamp = await getFrameEndTimestampIfCloseEnough({
-          frameTimestamp,
-          timestamp
+        const frameEndTimestamp = await getFrameEndTimestamp({
+          pendingFrameBehavior: options.pendingFrameBehavior,
+          shouldContinue: options.shouldContinue
         });
+        if (frameEndTimestamp.type === "cancelled") {
+          return {
+            type: "not-satisfied",
+            reason: "seek was superseded"
+          };
+        }
         if (frameEndTimestamp.type === "pending") {
           return {
             type: "not-satisfied",
@@ -1478,6 +1518,19 @@ var createVideoIterator = async (timeToSeek, cache) => {
 
 // src/video-iterator-manager.ts
 var { runEffectChain } = Internals4;
+var isSequentialMediaTimeAdvance = ({
+  previousTime,
+  newTime,
+  fps,
+  playbackRate,
+  isPlaying
+}) => {
+  if (!isPlaying || newTime < previousTime) {
+    return false;
+  }
+  const maximumSequentialAdvance = Math.abs(playbackRate) / fps;
+  return roundTo4Digits(newTime - previousTime) <= roundTo4Digits(maximumSequentialAdvance);
+};
 var videoIteratorManager = async ({
   delayPlaybackHandleIfNotPremounting,
   canvas,
@@ -1587,13 +1640,20 @@ var videoIteratorManager = async ({
       __callDispose(__stack, _err, _hasErr);
     }
   };
-  const seek = async ({ newTime, nonce }) => {
+  const seek = async ({
+    newTime,
+    nonce,
+    fps,
+    playbackRate,
+    isPlaying
+  }) => {
     if (!videoFrameIterator) {
       return;
     }
     if (currentSeek !== null && roundTo4Digits(currentSeek) === roundTo4Digits(newTime)) {
       return;
     }
+    const previousTime = currentSeek;
     currentSeek = newTime;
     if (getIsLooping()) {
       if (getLoopSegmentMediaEndTimestamp() - newTime < 1) {
@@ -1602,7 +1662,17 @@ var videoIteratorManager = async ({
         });
       }
     }
-    const videoSatisfyResult = await videoFrameIterator.tryToSatisfySeek(newTime);
+    const pendingFrameBehavior = previousTime !== null && isSequentialMediaTimeAdvance({
+      previousTime,
+      newTime,
+      fps,
+      playbackRate,
+      isPlaying
+    }) ? "wait" : "restart-iterator";
+    const videoSatisfyResult = await videoFrameIterator.tryToSatisfySeek(newTime, {
+      pendingFrameBehavior,
+      shouldContinue: () => !nonce.isStale()
+    });
     if (videoSatisfyResult.type === "satisfied") {
       await drawFrame(videoSatisfyResult.frame);
       return;
@@ -1937,7 +2007,10 @@ class MediaPlayer {
       await Promise.all([
         this.videoIteratorManager?.seek({
           newTime,
-          nonce
+          nonce,
+          fps: this.fps,
+          playbackRate: this.playbackRate,
+          isPlaying: this.playing
         }),
         this.audioIteratorManager?.seek({
           newTime,
@@ -5893,7 +5966,6 @@ var videoSchema = {
   },
   ...Internals22.baseSchema,
   ...Internals22.premountSchema,
-  ...Internals22.premountStyleSchema,
   volume: {
     type: "number",
     min: 0,
@@ -5914,7 +5986,9 @@ var videoSchema = {
   },
   muted: { type: "boolean", default: false, description: "Muted" },
   loop: { type: "boolean", default: false, description: "Loop" },
-  ...Internals22.transformSchema
+  ...Internals22.transformSchema,
+  ...Interactive2.backgroundSchema,
+  ...Interactive2.borderSchema
 };
 var InnerVideo = ({
   src,

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

@@ -12,7 +12,10 @@ export declare const createVideoIterator: (timeToSeek: number, cache: {
     destroy: () => void;
     initialFrame: WrappedCanvas | null;
     isDestroyed: () => boolean;
-    tryToSatisfySeek: (time: number) => Promise<{
+    tryToSatisfySeek: (time: number, options: {
+        pendingFrameBehavior: "restart-iterator" | "wait";
+        shouldContinue: () => boolean;
+    }) => Promise<{
         type: "not-satisfied";
         reason: string;
     } | {

package/dist/video/video.d.ts

@@ -1,4 +1,6 @@
 import React from 'react';
+import { type InteractivitySchema } from 'remotion';
+export declare const videoSchema: InteractivitySchema;
 export declare const Video: React.ComponentType<{
     src: string;
 } & Partial<{

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

@@ -2,6 +2,13 @@ import type { InputVideoTrack, WrappedCanvas } from 'mediabunny';
 import type { EffectChainState, EffectDefinitionAndStack } from 'remotion';
 import type { DelayPlaybackIfNotPremounting } from './delay-playback-if-not-premounting';
 import type { Nonce } from './nonce-manager';
+export declare const isSequentialMediaTimeAdvance: ({ previousTime, newTime, fps, playbackRate, isPlaying, }: {
+    previousTime: number;
+    newTime: number;
+    fps: number;
+    playbackRate: number;
+    isPlaying: boolean;
+}) => boolean;
 export declare const videoIteratorManager: ({ delayPlaybackHandleIfNotPremounting, canvas, context, drawDebugOverlay, logLevel, getOnVideoFrameCallback, videoTrack, getLoopSegmentMediaEndTimestamp, getStartTime, getIsLooping, getEffects, getEffectChainState, }: {
     videoTrack: InputVideoTrack;
     delayPlaybackHandleIfNotPremounting: () => DelayPlaybackIfNotPremounting;
@@ -18,16 +25,22 @@ export declare const videoIteratorManager: ({ delayPlaybackHandleIfNotPremountin
 }) => Promise<{
     startVideoIterator: (timeToSeek: number, nonce: Nonce) => Promise<void>;
     getVideoIteratorsCreated: () => number;
-    seek: ({ newTime, nonce }: {
+    seek: ({ newTime, nonce, fps, playbackRate, isPlaying, }: {
         newTime: number;
         nonce: Nonce;
+        fps: number;
+        playbackRate: number;
+        isPlaying: boolean;
     }) => Promise<void>;
     destroy: () => void;
     getVideoFrameIterator: () => {
         destroy: () => void;
         initialFrame: WrappedCanvas | null;
         isDestroyed: () => boolean;
-        tryToSatisfySeek: (time: number) => Promise<{
+        tryToSatisfySeek: (time: number, options: {
+            pendingFrameBehavior: "restart-iterator" | "wait";
+            shouldContinue: () => boolean;
+        }) => Promise<{
             type: "not-satisfied";
             reason: string;
         } | {

package/package.json

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