@remotion/webcodecs 4.0.310 → 4.0.312

package/dist/can-copy-video-track.js

@@ -17,12 +17,13 @@ const canCopyVideoTrack = ({ outputContainer, rotationToApply, inputContainer, r
             return false;
         }
     }
+    const needsToBeMultipleOfTwo = inputTrack.codecEnum === 'h264';
     const newDimensions = (0, rotation_1.calculateNewDimensionsFromRotateAndScale)({
         height: inputTrack.height,
         resizeOperation,
         rotation: rotationToApply,
-        videoCodec: inputTrack.codecEnum,
         width: inputTrack.width,
+        needsToBeMultipleOfTwo,
     });
     if (newDimensions.height !== inputTrack.height ||
         newDimensions.width !== inputTrack.width) {

package/dist/can-reencode-video-track.js

@@ -9,7 +9,7 @@ const canReencodeVideoTrack = async ({ videoCodec, track, resizeOperation, rotat
         height: track.displayAspectHeight,
         resizeOperation,
         rotation: rotate ?? 0,
-        videoCodec,
+        needsToBeMultipleOfTwo: videoCodec === 'h264',
         width: track.displayAspectWidth,
     });
     const videoEncoderConfig = await (0, video_encoder_config_1.getVideoEncoderConfig)({

package/dist/create-audio-decoder.d.ts

@@ -6,6 +6,10 @@ export type WebCodecsAudioDecoder = {
     flush: () => Promise<void>;
     waitForQueueToBeLessThan: (items: number) => Promise<void>;
     reset: () => void;
+    checkReset: () => {
+        wasReset: () => boolean;
+    };
+    getMostRecentSampleInput: () => number | null;
 };
 export type CreateAudioDecoderInit = {
     onFrame: (frame: AudioData) => Promise<void> | void;

package/dist/create-audio-decoder.js

@@ -1,6 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.createAudioDecoder = exports.internalCreateAudioDecoder = void 0;
+const flush_pending_1 = require("./flush-pending");
 const get_wave_audio_decoder_1 = require("./get-wave-audio-decoder");
 const io_synchronizer_1 = require("./io-manager/io-synchronizer");
 const internalCreateAudioDecoder = ({ onFrame, onError, controller, config, logLevel, }) => {
@@ -13,6 +14,7 @@ const internalCreateAudioDecoder = ({ onFrame, onError, controller, config, logL
         label: 'Audio decoder',
         controller,
     });
+    let mostRecentSampleReceived = null;
     if (config.codec === 'pcm-s16') {
         return (0, get_wave_audio_decoder_1.getWaveAudioDecoder)({
             onFrame,
@@ -67,6 +69,7 @@ const internalCreateAudioDecoder = ({ onFrame, onError, controller, config, logL
             onError(err);
             return;
         }
+        mostRecentSampleReceived = audioSample.timestamp;
         // Don't flush, it messes up the audio
         const chunk = audioSample instanceof EncodedAudioChunk
             ? audioSample
@@ -81,22 +84,44 @@ const internalCreateAudioDecoder = ({ onFrame, onError, controller, config, logL
             ioSynchronizer.inputItem(chunk.timestamp);
         }
     };
+    let flushPending = null;
+    const lastReset = null;
     return {
         decode,
         close,
-        flush: async () => {
-            // Firefox might throw "Needs to be configured first"
-            try {
-                await audioDecoder.flush();
+        flush: () => {
+            if (flushPending) {
+                throw new Error('Flush already pending');
             }
-            catch { }
-            await ioSynchronizer.waitForQueueSize(0);
+            const pendingFlush = (0, flush_pending_1.makeFlushPending)();
+            flushPending = pendingFlush;
+            Promise.resolve()
+                .then(() => {
+                return audioDecoder.flush();
+            })
+                .catch(() => {
+                // Firefox might throw "Needs to be configured first"
+            })
+                .finally(() => {
+                pendingFlush.resolve();
+                flushPending = null;
+            });
+            return pendingFlush.promise;
         },
         waitForQueueToBeLessThan: ioSynchronizer.waitForQueueSize,
         reset: () => {
             audioDecoder.reset();
             audioDecoder.configure(config);
         },
+        checkReset: () => {
+            const initTime = Date.now();
+            return {
+                wasReset: () => lastReset !== null && lastReset > initTime,
+            };
+        },
+        getMostRecentSampleInput() {
+            return mostRecentSampleReceived;
+        },
     };
 };
 exports.internalCreateAudioDecoder = internalCreateAudioDecoder;

package/dist/create-frames.d.ts

@@ -0,0 +1,8 @@
+export declare const extractFrames: ({ fromSeconds, toSeconds, width, height, src, onFrame, }: {
+    fromSeconds: number;
+    toSeconds: number;
+    width: number;
+    height: number;
+    src: string;
+    onFrame: (frame: VideoFrame) => void;
+}) => Promise<void>;

package/dist/create-frames.js

@@ -0,0 +1,69 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.extractFrames = void 0;
+const media_parser_1 = require("@remotion/media-parser");
+const worker_1 = require("@remotion/media-parser/worker");
+const create_video_decoder_1 = require("./create-video-decoder");
+const extractFrames = async ({ fromSeconds, toSeconds, width, height, src, onFrame, }) => {
+    const controller = (0, media_parser_1.mediaParserController)();
+    controller.seek(fromSeconds);
+    const segmentDuration = toSeconds - fromSeconds;
+    const expectedFrames = [];
+    try {
+        await (0, worker_1.parseMediaOnWebWorker)({
+            src: new URL(src, window.location.href).toString(),
+            acknowledgeRemotionLicense: true,
+            controller,
+            onVideoTrack: ({ track }) => {
+                const aspectRatio = track.width / track.height;
+                const framesFitInWidth = Math.ceil(width / (height * aspectRatio));
+                const timestampTargets = [];
+                for (let i = 0; i < framesFitInWidth; i++) {
+                    timestampTargets.push(fromSeconds +
+                        ((segmentDuration * media_parser_1.WEBCODECS_TIMESCALE) / framesFitInWidth) *
+                            (i + 0.5));
+                }
+                const decoder = (0, create_video_decoder_1.createVideoDecoder)({
+                    onFrame: (frame) => {
+                        if (frame.timestamp >= expectedFrames[0] - 1) {
+                            expectedFrames.shift();
+                            onFrame(frame);
+                        }
+                        frame.close();
+                    },
+                    onError: console.error,
+                    track,
+                });
+                const queued = [];
+                return async (sample) => {
+                    const nextTimestampWeWant = timestampTargets[0];
+                    if (nextTimestampWeWant === undefined) {
+                        throw new Error('this should not happen');
+                    }
+                    if (sample.type === 'key') {
+                        queued.length = 0;
+                    }
+                    queued.push(sample);
+                    if (sample.timestamp > nextTimestampWeWant) {
+                        expectedFrames.push(timestampTargets.shift());
+                        while (queued.length > 0) {
+                            const sam = queued.shift();
+                            await decoder.waitForQueueToBeLessThan(10);
+                            await decoder.decode(sam);
+                        }
+                        if (timestampTargets.length === 0) {
+                            await decoder.flush();
+                            controller.abort();
+                        }
+                    }
+                };
+            },
+        });
+    }
+    catch (e) {
+        if (!(0, media_parser_1.hasBeenAborted)(e)) {
+            throw e;
+        }
+    }
+};
+exports.extractFrames = extractFrames;

package/dist/create-video-decoder.d.ts

@@ -1,11 +1,15 @@
 import type { MediaParserLogLevel } from '@remotion/media-parser';
 import type { WebCodecsController } from './webcodecs-controller';
 export type WebCodecsVideoDecoder = {
-    decode: (videoSample: EncodedVideoChunkInit | EncodedVideoChunk) => void;
+    decode: (videoSample: EncodedVideoChunkInit | EncodedVideoChunk) => Promise<void>;
     close: () => void;
     flush: () => Promise<void>;
     waitForQueueToBeLessThan: (items: number) => Promise<void>;
     reset: () => void;
+    checkReset: () => {
+        wasReset: () => boolean;
+    };
+    getMostRecentSampleInput: () => number | null;
 };
 export declare const internalCreateVideoDecoder: ({ onFrame, onError, controller, config, logLevel, }: {
     onFrame: (frame: VideoFrame) => Promise<void> | void;

package/dist/create-video-decoder.js

@@ -1,13 +1,19 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.createVideoDecoder = exports.internalCreateVideoDecoder = void 0;
+const flush_pending_1 = require("./flush-pending");
 const io_synchronizer_1 = require("./io-manager/io-synchronizer");
 const internalCreateVideoDecoder = ({ onFrame, onError, controller, config, logLevel, }) => {
+    if (controller &&
+        controller._internals._mediaParserController._internals.signal.aborted) {
+        throw new Error('Not creating audio decoder, already aborted');
+    }
     const ioSynchronizer = (0, io_synchronizer_1.makeIoSynchronizer)({
         logLevel,
         label: 'Video decoder',
         controller,
     });
+    let mostRecentSampleReceived = null;
     const videoDecoder = new VideoDecoder({
         async output(frame) {
             try {
@@ -52,28 +58,54 @@ const internalCreateVideoDecoder = ({ onFrame, onError, controller, config, logL
             onError(err);
             return;
         }
+        mostRecentSampleReceived = sample.timestamp;
         const encodedChunk = sample instanceof EncodedVideoChunk
             ? sample
             : new EncodedVideoChunk(sample);
         videoDecoder.decode(encodedChunk);
         ioSynchronizer.inputItem(sample.timestamp);
     };
+    let flushPending = null;
+    let lastReset = null;
     return {
         decode,
         close,
-        flush: async () => {
-            // Firefox might throw "Needs to be configured first"
-            try {
-                await videoDecoder.flush();
+        flush: () => {
+            if (flushPending) {
+                throw new Error('Flush already pending');
             }
-            catch { }
-            await ioSynchronizer.waitForQueueSize(0);
+            const pendingFlush = (0, flush_pending_1.makeFlushPending)();
+            flushPending = pendingFlush;
+            Promise.resolve()
+                .then(() => {
+                return videoDecoder.flush();
+            })
+                .catch(() => {
+                // Firefox might throw "Needs to be configured first"
+            })
+                .finally(() => {
+                pendingFlush.resolve();
+                flushPending = null;
+            });
+            return pendingFlush.promise;
         },
         waitForQueueToBeLessThan: ioSynchronizer.waitForQueueSize,
         reset: () => {
+            lastReset = Date.now();
+            flushPending?.resolve();
+            ioSynchronizer.clearQueue();
             videoDecoder.reset();
             videoDecoder.configure(config);
         },
+        checkReset: () => {
+            const initTime = Date.now();
+            return {
+                wasReset: () => lastReset !== null && lastReset > initTime,
+            };
+        },
+        getMostRecentSampleInput() {
+            return mostRecentSampleReceived;
+        },
     };
 };
 exports.internalCreateVideoDecoder = internalCreateVideoDecoder;

package/dist/esm/index.mjs

@@ -244,9 +244,8 @@ var ensureMultipleOfTwo = ({
 var calculateNewSizeAfterResizing = ({
   dimensions,
   resizeOperation,
-  videoCodec
+  needsToBeMultipleOfTwo
 }) => {
-  const needsToBeMultipleOfTwo = videoCodec === "h264";
   if (resizeOperation === null) {
     return ensureMultipleOfTwo({
       dimensions,
@@ -342,7 +341,7 @@ var calculateNewDimensionsFromRotateAndScale = ({
   height,
   rotation,
   resizeOperation,
-  videoCodec
+  needsToBeMultipleOfTwo
 }) => {
   const { height: newHeight, width: newWidth } = calculateNewDimensionsFromRotate({
     height,
@@ -352,7 +351,7 @@ var calculateNewDimensionsFromRotateAndScale = ({
   return calculateNewSizeAfterResizing({
     dimensions: { height: newHeight, width: newWidth },
     resizeOperation,
-    videoCodec
+    needsToBeMultipleOfTwo
   });
 };
 
@@ -363,7 +362,7 @@ var normalizeVideoRotation = (rotation) => {
 var rotateAndResizeVideoFrame = ({
   frame,
   rotation,
-  videoCodec,
+  needsToBeMultipleOfTwo,
   resizeOperation
 }) => {
   const normalized = (rotation % 360 + 360) % 360;
@@ -377,7 +376,7 @@ var rotateAndResizeVideoFrame = ({
     height: frame.displayHeight,
     width: frame.displayWidth,
     rotation,
-    videoCodec,
+    needsToBeMultipleOfTwo,
     resizeOperation
   });
   if (normalized === 0 && height === frame.displayHeight && width === frame.displayWidth) {
@@ -539,8 +538,9 @@ var makeIoSynchronizer = ({
   let lastOutput = 0;
   let inputsSinceLastOutput = 0;
   let inputs = [];
+  let resolvers = [];
   const getQueuedItems = () => {
-    inputs = inputs.filter((input) => Math.floor(input) > Math.floor(lastOutput));
+    inputs = inputs.filter((input) => Math.floor(input) > Math.floor(lastOutput) + 1);
     return inputs.length;
   };
   const printState = (prefix) => {
@@ -568,8 +568,10 @@ var makeIoSynchronizer = ({
     const on = () => {
       eventEmitter.removeEventListener("output", on);
       resolve();
+      resolvers = resolvers.filter((resolver) => resolver !== resolve);
     };
     eventEmitter.addEventListener("output", on);
+    resolvers.push(resolve);
     return promise;
   };
   const makeErrorBanner = () => {
@@ -609,10 +611,22 @@ var makeIoSynchronizer = ({
       controller._internals._mediaParserController._internals.signal.removeEventListener("abort", clear);
     }
   };
+  const clearQueue = () => {
+    inputs.length = 0;
+    lastInput = 0;
+    lastOutput = 0;
+    inputsSinceLastOutput = 0;
+    resolvers.forEach((resolver) => {
+      return resolver();
+    });
+    resolvers.length = 0;
+    inputs.length = 0;
+  };
   return {
     inputItem,
     onOutput,
-    waitForQueueSize
+    waitForQueueSize,
+    clearQueue
   };
 };
 
@@ -930,12 +944,13 @@ var canCopyVideoTrack = ({
       return false;
     }
   }
+  const needsToBeMultipleOfTwo = inputTrack.codecEnum === "h264";
   const newDimensions = calculateNewDimensionsFromRotateAndScale({
     height: inputTrack.height,
     resizeOperation,
     rotation: rotationToApply,
-    videoCodec: inputTrack.codecEnum,
-    width: inputTrack.width
+    width: inputTrack.width,
+    needsToBeMultipleOfTwo
   });
   if (newDimensions.height !== inputTrack.height || newDimensions.width !== inputTrack.width) {
     return false;
@@ -1416,7 +1431,7 @@ var canReencodeVideoTrack = async ({
     height: track.displayAspectHeight,
     resizeOperation,
     rotation: rotate ?? 0,
-    videoCodec,
+    needsToBeMultipleOfTwo: videoCodec === "h264",
     width: track.displayAspectWidth
   });
   const videoEncoderConfig = await getVideoEncoderConfig({
@@ -4135,6 +4150,16 @@ var convertEncodedChunk = (chunk) => {
   };
 };
 
+// src/flush-pending.ts
+var makeFlushPending = () => {
+  const { promise, resolve, reject } = withResolvers();
+  return {
+    promise,
+    resolve,
+    reject
+  };
+};
+
 // src/get-wave-audio-decoder.ts
 var getBytesPerSample = (sampleFormat) => {
   if (sampleFormat === "s16") {
@@ -4196,16 +4221,25 @@ var getWaveAudioDecoder = ({
       onError(err);
     }
   };
+  let lastReset = null;
+  let mostRecentSampleInput = null;
   return {
     close() {
       return Promise.resolve();
     },
     decode(audioSample) {
+      mostRecentSampleInput = audioSample.timestamp;
       return processSample(audioSample);
     },
     flush: () => Promise.resolve(),
     waitForQueueToBeLessThan: ioSynchronizer.waitForQueueSize,
-    reset: () => {}
+    reset: () => {
+      lastReset = Date.now();
+    },
+    checkReset: () => ({
+      wasReset: () => lastReset !== null && lastReset > Date.now()
+    }),
+    getMostRecentSampleInput: () => mostRecentSampleInput
   };
 };
 
@@ -4225,6 +4259,7 @@ var internalCreateAudioDecoder = ({
     label: "Audio decoder",
     controller
   });
+  let mostRecentSampleReceived = null;
   if (config.codec === "pcm-s16") {
     return getWaveAudioDecoder({
       onFrame,
@@ -4275,25 +4310,45 @@ var internalCreateAudioDecoder = ({
       onError(err);
       return;
     }
+    mostRecentSampleReceived = audioSample.timestamp;
     const chunk = audioSample instanceof EncodedAudioChunk ? audioSample : new EncodedAudioChunk(audioSample);
     audioDecoder.decode(chunk);
     if (chunk.byteLength > 16) {
       ioSynchronizer.inputItem(chunk.timestamp);
     }
   };
+  let flushPending = null;
+  const lastReset = null;
   return {
     decode,
     close,
-    flush: async () => {
-      try {
-        await audioDecoder.flush();
-      } catch {}
-      await ioSynchronizer.waitForQueueSize(0);
+    flush: () => {
+      if (flushPending) {
+        throw new Error("Flush already pending");
+      }
+      const pendingFlush = makeFlushPending();
+      flushPending = pendingFlush;
+      Promise.resolve().then(() => {
+        return audioDecoder.flush();
+      }).catch(() => {}).finally(() => {
+        pendingFlush.resolve();
+        flushPending = null;
+      });
+      return pendingFlush.promise;
     },
     waitForQueueToBeLessThan: ioSynchronizer.waitForQueueSize,
     reset: () => {
       audioDecoder.reset();
       audioDecoder.configure(config);
+    },
+    checkReset: () => {
+      const initTime = Date.now();
+      return {
+        wasReset: () => lastReset !== null && lastReset > initTime
+      };
+    },
+    getMostRecentSampleInput() {
+      return mostRecentSampleReceived;
     }
   };
 };
@@ -4498,7 +4553,8 @@ var reencodeAudioTrack = async ({
     logLevel
   });
   state.addWaitForFinishPromise(async () => {
-    await audioDecoder.waitForQueueToBeLessThan(0);
+    Log.verbose(logLevel, "Waiting for audio decoder to finish");
+    await audioDecoder.flush();
     Log.verbose(logLevel, "Audio decoder finished");
     audioDecoder.close();
     await audioProcessingQueue.ioSynchronizer.waitForQueueSize(0);
@@ -4671,11 +4727,15 @@ var internalCreateVideoDecoder = ({
   config,
   logLevel
 }) => {
+  if (controller && controller._internals._mediaParserController._internals.signal.aborted) {
+    throw new Error("Not creating audio decoder, already aborted");
+  }
   const ioSynchronizer = makeIoSynchronizer({
     logLevel,
     label: "Video decoder",
     controller
   });
+  let mostRecentSampleReceived = null;
   const videoDecoder = new VideoDecoder({
     async output(frame) {
       try {
@@ -4716,23 +4776,46 @@ var internalCreateVideoDecoder = ({
       onError(err);
       return;
     }
+    mostRecentSampleReceived = sample.timestamp;
     const encodedChunk = sample instanceof EncodedVideoChunk ? sample : new EncodedVideoChunk(sample);
     videoDecoder.decode(encodedChunk);
     ioSynchronizer.inputItem(sample.timestamp);
   };
+  let flushPending = null;
+  let lastReset = null;
   return {
     decode,
     close,
-    flush: async () => {
-      try {
-        await videoDecoder.flush();
-      } catch {}
-      await ioSynchronizer.waitForQueueSize(0);
+    flush: () => {
+      if (flushPending) {
+        throw new Error("Flush already pending");
+      }
+      const pendingFlush = makeFlushPending();
+      flushPending = pendingFlush;
+      Promise.resolve().then(() => {
+        return videoDecoder.flush();
+      }).catch(() => {}).finally(() => {
+        pendingFlush.resolve();
+        flushPending = null;
+      });
+      return pendingFlush.promise;
     },
     waitForQueueToBeLessThan: ioSynchronizer.waitForQueueSize,
     reset: () => {
+      lastReset = Date.now();
+      flushPending?.resolve();
+      ioSynchronizer.clearQueue();
       videoDecoder.reset();
       videoDecoder.configure(config);
+    },
+    checkReset: () => {
+      const initTime = Date.now();
+      return {
+        wasReset: () => lastReset !== null && lastReset > initTime
+      };
+    },
+    getMostRecentSampleInput() {
+      return mostRecentSampleReceived;
     }
   };
 };
@@ -4801,7 +4884,7 @@ var onFrame = async ({
     rotation,
     frame: unrotatedFrame,
     resizeOperation,
-    videoCodec: outputCodec
+    needsToBeMultipleOfTwo: outputCodec === "h264"
   });
   if (unrotatedFrame !== rotated) {
     unrotatedFrame.close();
@@ -4989,7 +5072,7 @@ var reencodeVideoTrack = async ({
     width: track.codedWidth,
     height: track.codedHeight,
     rotation,
-    videoCodec: videoOperation.videoCodec,
+    needsToBeMultipleOfTwo: videoOperation.videoCodec === "h264",
     resizeOperation: videoOperation.resize ?? null
   });
   const videoEncoderConfig = await getVideoEncoderConfig({
@@ -5095,7 +5178,7 @@ var reencodeVideoTrack = async ({
   });
   state.addWaitForFinishPromise(async () => {
     Log.verbose(logLevel, "Waiting for video decoder to finish");
-    await videoDecoder.waitForQueueToBeLessThan(0);
+    await videoDecoder.flush();
     videoDecoder.close();
     Log.verbose(logLevel, "Video decoder finished. Waiting for encoder to finish");
     await frameSorter.flush();
@@ -5109,7 +5192,7 @@ var reencodeVideoTrack = async ({
   return async (chunk) => {
     progressTracker.setPossibleLowestTimestamp(Math.min(chunk.timestamp, chunk.decodingTimestamp ?? Infinity));
     await controller._internals._mediaParserController._internals.checkForAbortAndPause();
-    await videoDecoder.waitForQueueToBeLessThan(10);
+    await videoDecoder.waitForQueueToBeLessThan(15);
     if (chunk.type === "key") {
       await videoDecoder.flush();
     }
@@ -5499,6 +5582,118 @@ var convertMedia = async function({
     controller._internals._mediaParserController._internals.signal.removeEventListener("abort", onUserAbort);
   });
 };
+// src/extract-frames.ts
+import {
+  hasBeenAborted,
+  MediaParserAbortError as MediaParserAbortError4,
+  mediaParserController as mediaParserController2,
+  WEBCODECS_TIMESCALE
+} from "@remotion/media-parser";
+import { parseMediaOnWebWorker } from "@remotion/media-parser/worker";
+var internalExtractFrames = ({
+  src,
+  onFrame: onFrame2,
+  signal,
+  timestampsInSeconds,
+  acknowledgeRemotionLicense,
+  logLevel
+}) => {
+  const controller = mediaParserController2();
+  const expectedFrames = [];
+  const resolvers = withResolvers();
+  const abortListener = () => {
+    controller.abort();
+    resolvers.reject(new MediaParserAbortError4("Aborted by user"));
+  };
+  signal?.addEventListener("abort", abortListener, { once: true });
+  let dur = null;
+  parseMediaOnWebWorker({
+    src: new URL(src, window.location.href),
+    acknowledgeRemotionLicense,
+    controller,
+    logLevel,
+    onDurationInSeconds(durationInSeconds) {
+      dur = durationInSeconds;
+    },
+    onVideoTrack: async ({ track }) => {
+      const timestampTargetsUnsorted = typeof timestampsInSeconds === "function" ? await timestampsInSeconds({
+        track,
+        durationInSeconds: dur
+      }) : timestampsInSeconds;
+      const timestampTargets = timestampTargetsUnsorted.sort((a, b) => a - b);
+      controller.seek(timestampTargets[0]);
+      const decoder = createVideoDecoder({
+        onFrame: (frame) => {
+          if (frame.timestamp >= expectedFrames[0] - 1) {
+            expectedFrames.shift();
+            onFrame2(frame);
+          } else {
+            frame.close();
+          }
+        },
+        onError: (e) => {
+          controller.abort();
+          try {
+            decoder.close();
+          } catch {}
+          resolvers.reject(e);
+        },
+        track
+      });
+      const queued = [];
+      const doProcess = async () => {
+        expectedFrames.push(timestampTargets.shift() * WEBCODECS_TIMESCALE);
+        while (queued.length > 0) {
+          const sam = queued.shift();
+          await decoder.waitForQueueToBeLessThan(10);
+          await decoder.decode(sam);
+        }
+      };
+      return async (sample) => {
+        const nextTimestampWeWant = timestampTargets[0];
+        if (sample.type === "key") {
+          queued.length = 0;
+        }
+        queued.push(sample);
+        if (sample.timestamp >= timestampTargets[timestampTargets.length - 1] * WEBCODECS_TIMESCALE) {
+          await doProcess();
+          await decoder.flush();
+          controller.abort();
+          return;
+        }
+        if (nextTimestampWeWant === undefined) {
+          throw new Error("this should not happen");
+        }
+        if (sample.timestamp >= nextTimestampWeWant * WEBCODECS_TIMESCALE) {
+          await doProcess();
+          if (timestampTargets.length === 0) {
+            await decoder.flush();
+            controller.abort();
+          }
+        }
+      };
+    }
+  }).then(() => {
+    resolvers.resolve();
+  }).catch((e) => {
+    if (!hasBeenAborted(e)) {
+      resolvers.reject(e);
+    } else {
+      resolvers.resolve();
+    }
+  }).finally(() => {
+    signal?.removeEventListener("abort", abortListener);
+  });
+  return resolvers.promise;
+};
+var extractFrames = (options) => {
+  return internalExtractFrames({
+    ...options,
+    signal: options.signal ?? null,
+    acknowledgeRemotionLicense: options.acknowledgeRemotionLicense ?? false,
+    logLevel: options.logLevel ?? "info"
+  });
+};
 // src/get-available-audio-codecs.ts
 var getAvailableAudioCodecs = ({
   container
@@ -5529,6 +5724,7 @@ export {
   getAvailableVideoCodecs,
   getAvailableContainers,
   getAvailableAudioCodecs,
+  extractFrames,
   defaultOnVideoTrackHandler,
   defaultOnAudioTrackHandler,
   createVideoEncoder,

package/dist/extract-frames.d.ts

@@ -0,0 +1,13 @@
+import type { MediaParserLogLevel, MediaParserVideoTrack } from '@remotion/media-parser';
+export type ExtractFramesTimestampsInSecondsFn = (options: {
+    track: MediaParserVideoTrack;
+    durationInSeconds: number | null;
+}) => Promise<number[]> | number[];
+export declare const extractFrames: (options: {
+    src: string;
+    timestampsInSeconds: number[] | ExtractFramesTimestampsInSecondsFn;
+    onFrame: (frame: VideoFrame) => void;
+    signal?: AbortSignal;
+    acknowledgeRemotionLicense?: boolean;
+    logLevel?: MediaParserLogLevel;
+}) => Promise<void>;

package/dist/extract-frames.js

@@ -0,0 +1,114 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.extractFrames = void 0;
+const media_parser_1 = require("@remotion/media-parser");
+const worker_1 = require("@remotion/media-parser/worker");
+const create_video_decoder_1 = require("./create-video-decoder");
+const with_resolvers_1 = require("./create/with-resolvers");
+const internalExtractFrames = ({ src, onFrame, signal, timestampsInSeconds, acknowledgeRemotionLicense, logLevel, }) => {
+    const controller = (0, media_parser_1.mediaParserController)();
+    const expectedFrames = [];
+    const resolvers = (0, with_resolvers_1.withResolvers)();
+    const abortListener = () => {
+        controller.abort();
+        resolvers.reject(new media_parser_1.MediaParserAbortError('Aborted by user'));
+    };
+    signal?.addEventListener('abort', abortListener, { once: true });
+    let dur = null;
+    (0, worker_1.parseMediaOnWebWorker)({
+        src: new URL(src, window.location.href),
+        acknowledgeRemotionLicense,
+        controller,
+        logLevel,
+        onDurationInSeconds(durationInSeconds) {
+            dur = durationInSeconds;
+        },
+        onVideoTrack: async ({ track }) => {
+            const timestampTargetsUnsorted = typeof timestampsInSeconds === 'function'
+                ? await timestampsInSeconds({
+                    track,
+                    durationInSeconds: dur,
+                })
+                : timestampsInSeconds;
+            const timestampTargets = timestampTargetsUnsorted.sort((a, b) => a - b);
+            controller.seek(timestampTargets[0]);
+            const decoder = (0, create_video_decoder_1.createVideoDecoder)({
+                onFrame: (frame) => {
+                    if (frame.timestamp >= expectedFrames[0] - 1) {
+                        expectedFrames.shift();
+                        onFrame(frame);
+                    }
+                    else {
+                        frame.close();
+                    }
+                },
+                onError: (e) => {
+                    controller.abort();
+                    try {
+                        decoder.close();
+                    }
+                    catch { }
+                    resolvers.reject(e);
+                },
+                track,
+            });
+            const queued = [];
+            const doProcess = async () => {
+                expectedFrames.push(timestampTargets.shift() * media_parser_1.WEBCODECS_TIMESCALE);
+                while (queued.length > 0) {
+                    const sam = queued.shift();
+                    await decoder.waitForQueueToBeLessThan(10);
+                    await decoder.decode(sam);
+                }
+            };
+            return async (sample) => {
+                const nextTimestampWeWant = timestampTargets[0];
+                if (sample.type === 'key') {
+                    queued.length = 0;
+                }
+                queued.push(sample);
+                if (sample.timestamp >=
+                    timestampTargets[timestampTargets.length - 1] * media_parser_1.WEBCODECS_TIMESCALE) {
+                    await doProcess();
+                    await decoder.flush();
+                    controller.abort();
+                    return;
+                }
+                if (nextTimestampWeWant === undefined) {
+                    throw new Error('this should not happen');
+                }
+                if (sample.timestamp >= nextTimestampWeWant * media_parser_1.WEBCODECS_TIMESCALE) {
+                    await doProcess();
+                    if (timestampTargets.length === 0) {
+                        await decoder.flush();
+                        controller.abort();
+                    }
+                }
+            };
+        },
+    })
+        .then(() => {
+        resolvers.resolve();
+    })
+        .catch((e) => {
+        if (!(0, media_parser_1.hasBeenAborted)(e)) {
+            resolvers.reject(e);
+        }
+        else {
+            resolvers.resolve();
+        }
+    })
+        .finally(() => {
+        signal?.removeEventListener('abort', abortListener);
+    });
+    return resolvers.promise;
+};
+const extractFrames = (options) => {
+    return internalExtractFrames({
+        ...options,
+        signal: options.signal ?? null,
+        acknowledgeRemotionLicense: options.acknowledgeRemotionLicense ?? false,
+        logLevel: options.logLevel ?? 'info',
+    });
+};
+exports.extractFrames = extractFrames;

package/dist/flush-pending.d.ts

@@ -0,0 +1,10 @@
+export type FlushPending = {
+    resolve: (value: void | PromiseLike<void>) => void;
+    reject: (reason?: any) => void;
+    promise: Promise<void>;
+};
+export declare const makeFlushPending: () => {
+    promise: Promise<void>;
+    resolve: (value: void | PromiseLike<void>) => void;
+    reject: (reason?: any) => void;
+};

package/dist/flush-pending.js

@@ -0,0 +1,13 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.makeFlushPending = void 0;
+const with_resolvers_1 = require("./create/with-resolvers");
+const makeFlushPending = () => {
+    const { promise, resolve, reject } = (0, with_resolvers_1.withResolvers)();
+    return {
+        promise,
+        resolve,
+        reject,
+    };
+};
+exports.makeFlushPending = makeFlushPending;

package/dist/get-wave-audio-decoder.js

@@ -56,16 +56,25 @@ const getWaveAudioDecoder = ({ onFrame, config, sampleFormat, ioSynchronizer, on
             onError(err);
         }
     };
+    let lastReset = null;
+    let mostRecentSampleInput = null;
     return {
         close() {
             return Promise.resolve();
         },
         decode(audioSample) {
+            mostRecentSampleInput = audioSample.timestamp;
             return processSample(audioSample);
         },
         flush: () => Promise.resolve(),
         waitForQueueToBeLessThan: ioSynchronizer.waitForQueueSize,
-        reset: () => { },
+        reset: () => {
+            lastReset = Date.now();
+        },
+        checkReset: () => ({
+            wasReset: () => lastReset !== null && lastReset > Date.now(),
+        }),
+        getMostRecentSampleInput: () => mostRecentSampleInput,
     };
 };
 exports.getWaveAudioDecoder = getWaveAudioDecoder;

package/dist/index.d.ts

@@ -13,6 +13,8 @@ export { createVideoDecoder } from './create-video-decoder';
 export type { WebCodecsVideoDecoder } from './create-video-decoder';
 export { defaultOnAudioTrackHandler } from './default-on-audio-track-handler';
 export { defaultOnVideoTrackHandler } from './default-on-video-track-handler';
+export { extractFrames } from './extract-frames';
+export type { ExtractFramesTimestampsInSecondsFn } from './extract-frames';
 export { getAvailableAudioCodecs } from './get-available-audio-codecs';
 export type { ConvertMediaAudioCodec } from './get-available-audio-codecs';
 export { getAvailableContainers } from './get-available-containers';
@@ -29,18 +31,18 @@ export type { WebCodecsVideoEncoder } from './video-encoder';
 export { webcodecsController } from './webcodecs-controller';
 export type { WebCodecsController } from './webcodecs-controller';
 export declare const WebCodecsInternals: {
-    rotateAndResizeVideoFrame: ({ frame, rotation, videoCodec, resizeOperation, }: {
+    rotateAndResizeVideoFrame: ({ frame, rotation, needsToBeMultipleOfTwo, resizeOperation, }: {
         frame: VideoFrame;
         rotation: number;
-        videoCodec: import("./get-available-video-codecs").ConvertMediaVideoCodec;
+        needsToBeMultipleOfTwo: boolean;
         resizeOperation: import("./resizing/mode").ResizeOperation | null;
     }) => VideoFrame;
     normalizeVideoRotation: (rotation: number) => number;
-    calculateNewDimensionsFromDimensions: ({ width, height, rotation, resizeOperation, videoCodec, }: {
+    calculateNewDimensionsFromDimensions: ({ width, height, rotation, resizeOperation, needsToBeMultipleOfTwo, }: {
         width: number;
         height: number;
         rotation: number;
         resizeOperation: import("./resizing/mode").ResizeOperation | null;
-        videoCodec: import("./get-available-video-codecs").ConvertMediaVideoCodec | import("@remotion/media-parser").MediaParserVideoCodec;
+        needsToBeMultipleOfTwo: boolean;
     }) => import("@remotion/media-parser").MediaParserDimensions;
 };

package/dist/index.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.WebCodecsInternals = exports.webcodecsController = exports.createVideoEncoder = exports.getDefaultVideoCodec = exports.getDefaultAudioCodec = exports.getAvailableVideoCodecs = exports.getAvailableContainers = exports.getAvailableAudioCodecs = exports.defaultOnVideoTrackHandler = exports.defaultOnAudioTrackHandler = exports.createVideoDecoder = exports.createAudioDecoder = exports.convertMedia = exports.convertAudioData = exports.canReencodeVideoTrack = exports.canReencodeAudioTrack = exports.canCopyVideoTrack = exports.canCopyAudioTrack = exports.createAudioEncoder = void 0;
+exports.WebCodecsInternals = exports.webcodecsController = exports.createVideoEncoder = exports.getDefaultVideoCodec = exports.getDefaultAudioCodec = exports.getAvailableVideoCodecs = exports.getAvailableContainers = exports.getAvailableAudioCodecs = exports.extractFrames = exports.defaultOnVideoTrackHandler = exports.defaultOnAudioTrackHandler = exports.createVideoDecoder = exports.createAudioDecoder = exports.convertMedia = exports.convertAudioData = exports.canReencodeVideoTrack = exports.canReencodeAudioTrack = exports.canCopyVideoTrack = exports.canCopyAudioTrack = exports.createAudioEncoder = void 0;
 const rotate_and_resize_video_frame_1 = require("./rotate-and-resize-video-frame");
 const rotation_1 = require("./rotation");
 const set_remotion_imported_1 = require("./set-remotion-imported");
@@ -26,6 +26,8 @@ var default_on_audio_track_handler_1 = require("./default-on-audio-track-handler
 Object.defineProperty(exports, "defaultOnAudioTrackHandler", { enumerable: true, get: function () { return default_on_audio_track_handler_1.defaultOnAudioTrackHandler; } });
 var default_on_video_track_handler_1 = require("./default-on-video-track-handler");
 Object.defineProperty(exports, "defaultOnVideoTrackHandler", { enumerable: true, get: function () { return default_on_video_track_handler_1.defaultOnVideoTrackHandler; } });
+var extract_frames_1 = require("./extract-frames");
+Object.defineProperty(exports, "extractFrames", { enumerable: true, get: function () { return extract_frames_1.extractFrames; } });
 var get_available_audio_codecs_1 = require("./get-available-audio-codecs");
 Object.defineProperty(exports, "getAvailableAudioCodecs", { enumerable: true, get: function () { return get_available_audio_codecs_1.getAvailableAudioCodecs; } });
 var get_available_containers_1 = require("./get-available-containers");

package/dist/io-manager/io-synchronizer.d.ts

@@ -8,5 +8,6 @@ export declare const makeIoSynchronizer: ({ logLevel, label, controller, }: {
     inputItem: (timestamp: number) => void;
     onOutput: (timestamp: number) => void;
     waitForQueueSize: (queueSize: number) => Promise<void>;
+    clearQueue: () => void;
 };
 export type IoSynchronizer = ReturnType<typeof makeIoSynchronizer>;

package/dist/io-manager/io-synchronizer.js

@@ -11,8 +11,11 @@ const makeIoSynchronizer = ({ logLevel, label, controller, }) => {
     let lastOutput = 0;
     let inputsSinceLastOutput = 0;
     let inputs = [];
+    let resolvers = [];
     const getQueuedItems = () => {
-        inputs = inputs.filter((input) => Math.floor(input) > Math.floor(lastOutput));
+        inputs = inputs.filter(
+        // In chrome, the last output sometimes shifts the timestamp by 1 macrosecond - allowing this to happen
+        (input) => Math.floor(input) > Math.floor(lastOutput) + 1);
         return inputs.length;
     };
     const printState = (prefix) => {
@@ -40,8 +43,10 @@ const makeIoSynchronizer = ({ logLevel, label, controller, }) => {
         const on = () => {
             eventEmitter.removeEventListener('output', on);
             resolve();
+            resolvers = resolvers.filter((resolver) => resolver !== resolve);
         };
         eventEmitter.addEventListener('output', on);
+        resolvers.push(resolve);
         return promise;
     };
     const makeErrorBanner = () => {
@@ -80,10 +85,22 @@ const makeIoSynchronizer = ({ logLevel, label, controller, }) => {
             controller._internals._mediaParserController._internals.signal.removeEventListener('abort', clear);
         }
     };
+    const clearQueue = () => {
+        inputs.length = 0;
+        lastInput = 0;
+        lastOutput = 0;
+        inputsSinceLastOutput = 0;
+        resolvers.forEach((resolver) => {
+            return resolver();
+        });
+        resolvers.length = 0;
+        inputs.length = 0;
+    };
     return {
         inputItem,
         onOutput,
         waitForQueueSize,
+        clearQueue,
     };
 };
 exports.makeIoSynchronizer = makeIoSynchronizer;

package/dist/on-frame.js

@@ -9,7 +9,7 @@ const onFrame = async ({ frame: unrotatedFrame, onVideoFrame, track, outputCodec
         rotation,
         frame: unrotatedFrame,
         resizeOperation,
-        videoCodec: outputCodec,
+        needsToBeMultipleOfTwo: outputCodec === 'h264',
     });
     if (unrotatedFrame !== rotated) {
         unrotatedFrame.close();

package/dist/processing-queue.d.ts

@@ -13,6 +13,7 @@ export declare function processingQueue<T extends Processable>({ onOutput, logLe
         inputItem: (timestamp: number) => void;
         onOutput: (timestamp: number) => void;
         waitForQueueSize: (queueSize: number) => Promise<void>;
+        clearQueue: () => void;
     };
 };
 export {};

package/dist/reencode-audio-track.js

@@ -145,7 +145,8 @@ const reencodeAudioTrack = async ({ audioOperation, track, logLevel, abortConver
         logLevel,
     });
     state.addWaitForFinishPromise(async () => {
-        await audioDecoder.waitForQueueToBeLessThan(0);
+        log_1.Log.verbose(logLevel, 'Waiting for audio decoder to finish');
+        await audioDecoder.flush();
         log_1.Log.verbose(logLevel, 'Audio decoder finished');
         audioDecoder.close();
         await audioProcessingQueue.ioSynchronizer.waitForQueueSize(0);

package/dist/reencode-video-track.js

@@ -21,7 +21,7 @@ const reencodeVideoTrack = async ({ videoOperation, rotate, track, logLevel, abo
         width: track.codedWidth,
         height: track.codedHeight,
         rotation,
-        videoCodec: videoOperation.videoCodec,
+        needsToBeMultipleOfTwo: videoOperation.videoCodec === 'h264',
         resizeOperation: videoOperation.resize ?? null,
     });
     const videoEncoderConfig = await (0, video_encoder_config_1.getVideoEncoderConfig)({
@@ -127,7 +127,7 @@ const reencodeVideoTrack = async ({ videoOperation, rotate, track, logLevel, abo
     });
     state.addWaitForFinishPromise(async () => {
         log_1.Log.verbose(logLevel, 'Waiting for video decoder to finish');
-        await videoDecoder.waitForQueueToBeLessThan(0);
+        await videoDecoder.flush();
         videoDecoder.close();
         log_1.Log.verbose(logLevel, 'Video decoder finished. Waiting for encoder to finish');
         await frameSorter.flush();
@@ -141,7 +141,7 @@ const reencodeVideoTrack = async ({ videoOperation, rotate, track, logLevel, abo
     return async (chunk) => {
         progressTracker.setPossibleLowestTimestamp(Math.min(chunk.timestamp, chunk.decodingTimestamp ?? Infinity));
         await controller._internals._mediaParserController._internals.checkForAbortAndPause();
-        await videoDecoder.waitForQueueToBeLessThan(10);
+        await videoDecoder.waitForQueueToBeLessThan(15);
         if (chunk.type === 'key') {
             await videoDecoder.flush();
         }

package/dist/resizing/calculate-new-size.d.ts

@@ -1,8 +1,7 @@
-import type { MediaParserDimensions, MediaParserVideoCodec } from '@remotion/media-parser';
-import type { ConvertMediaVideoCodec } from '../get-available-video-codecs';
+import type { MediaParserDimensions } from '@remotion/media-parser';
 import type { ResizeOperation } from './mode';
-export declare const calculateNewSizeAfterResizing: ({ dimensions, resizeOperation, videoCodec, }: {
+export declare const calculateNewSizeAfterResizing: ({ dimensions, resizeOperation, needsToBeMultipleOfTwo, }: {
     dimensions: MediaParserDimensions;
     resizeOperation: ResizeOperation | null;
-    videoCodec: ConvertMediaVideoCodec | MediaParserVideoCodec;
+    needsToBeMultipleOfTwo: boolean;
 }) => MediaParserDimensions;

package/dist/resizing/calculate-new-size.js

@@ -10,8 +10,7 @@ const ensureMultipleOfTwo = ({ dimensions, needsToBeMultipleOfTwo, }) => {
         height: Math.floor(dimensions.height / 2) * 2,
     };
 };
-const calculateNewSizeAfterResizing = ({ dimensions, resizeOperation, videoCodec, }) => {
-    const needsToBeMultipleOfTwo = videoCodec === 'h264';
+const calculateNewSizeAfterResizing = ({ dimensions, resizeOperation, needsToBeMultipleOfTwo, }) => {
     if (resizeOperation === null) {
         return ensureMultipleOfTwo({
             dimensions,

package/dist/rotate-and-resize-video-frame.d.ts

@@ -1,9 +1,8 @@
-import type { ConvertMediaVideoCodec } from './get-available-video-codecs';
 import type { ResizeOperation } from './resizing/mode';
 export declare const normalizeVideoRotation: (rotation: number) => number;
-export declare const rotateAndResizeVideoFrame: ({ frame, rotation, videoCodec, resizeOperation, }: {
+export declare const rotateAndResizeVideoFrame: ({ frame, rotation, needsToBeMultipleOfTwo, resizeOperation, }: {
     frame: VideoFrame;
     rotation: number;
-    videoCodec: ConvertMediaVideoCodec;
+    needsToBeMultipleOfTwo: boolean;
     resizeOperation: ResizeOperation | null;
 }) => VideoFrame;

package/dist/rotate-and-resize-video-frame.js

@@ -6,7 +6,7 @@ const normalizeVideoRotation = (rotation) => {
     return ((rotation % 360) + 360) % 360;
 };
 exports.normalizeVideoRotation = normalizeVideoRotation;
-const rotateAndResizeVideoFrame = ({ frame, rotation, videoCodec, resizeOperation, }) => {
+const rotateAndResizeVideoFrame = ({ frame, rotation, needsToBeMultipleOfTwo, resizeOperation, }) => {
     const normalized = ((rotation % 360) + 360) % 360;
     // No resize, no rotation
     if (normalized === 0 && resizeOperation === null) {
@@ -19,7 +19,7 @@ const rotateAndResizeVideoFrame = ({ frame, rotation, videoCodec, resizeOperatio
         height: frame.displayHeight,
         width: frame.displayWidth,
         rotation,
-        videoCodec,
+        needsToBeMultipleOfTwo,
         resizeOperation,
     });
     // No rotation, and resize turned out to be same dimensions

package/dist/rotation.d.ts

@@ -1,5 +1,4 @@
-import type { MediaParserDimensions, MediaParserVideoCodec } from '@remotion/media-parser';
-import type { ConvertMediaVideoCodec } from './get-available-video-codecs';
+import type { MediaParserDimensions } from '@remotion/media-parser';
 import type { ResizeOperation } from './resizing/mode';
 export declare const calculateNewDimensionsFromRotate: ({ height, width, rotation, }: MediaParserDimensions & {
     rotation: number;
@@ -7,10 +6,10 @@ export declare const calculateNewDimensionsFromRotate: ({ height, width, rotatio
     height: number;
     width: number;
 };
-export declare const calculateNewDimensionsFromRotateAndScale: ({ width, height, rotation, resizeOperation, videoCodec, }: {
+export declare const calculateNewDimensionsFromRotateAndScale: ({ width, height, rotation, resizeOperation, needsToBeMultipleOfTwo, }: {
     width: number;
     height: number;
     rotation: number;
     resizeOperation: ResizeOperation | null;
-    videoCodec: ConvertMediaVideoCodec | MediaParserVideoCodec;
+    needsToBeMultipleOfTwo: boolean;
 }) => MediaParserDimensions;

package/dist/rotation.js

@@ -14,7 +14,7 @@ const calculateNewDimensionsFromRotate = ({ height, width, rotation, }) => {
     };
 };
 exports.calculateNewDimensionsFromRotate = calculateNewDimensionsFromRotate;
-const calculateNewDimensionsFromRotateAndScale = ({ width, height, rotation, resizeOperation, videoCodec, }) => {
+const calculateNewDimensionsFromRotateAndScale = ({ width, height, rotation, resizeOperation, needsToBeMultipleOfTwo, }) => {
     const { height: newHeight, width: newWidth } = (0, exports.calculateNewDimensionsFromRotate)({
         height,
         rotation,
@@ -23,7 +23,7 @@ const calculateNewDimensionsFromRotateAndScale = ({ width, height, rotation, res
     return (0, calculate_new_size_1.calculateNewSizeAfterResizing)({
         dimensions: { height: newHeight, width: newWidth },
         resizeOperation,
-        videoCodec,
+        needsToBeMultipleOfTwo,
     });
 };
 exports.calculateNewDimensionsFromRotateAndScale = calculateNewDimensionsFromRotateAndScale;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@remotion/webcodecs",
-  "version": "4.0.310",
+  "version": "4.0.312",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
   "module": "dist/esm/index.mjs",
@@ -19,17 +19,18 @@
   "author": "Jonny Burger <jonny@remotion.dev>",
   "license": "Remotion License (See https://remotion.dev/docs/webcodecs#license)",
   "dependencies": {
-    "@remotion/media-parser": "4.0.310",
-    "@remotion/licensing": "4.0.310"
+    "@remotion/licensing": "4.0.312",
+    "@remotion/media-parser": "4.0.312"
   },
   "peerDependencies": {},
   "devDependencies": {
     "@types/dom-webcodecs": "0.1.11",
     "playwright": "1.51.1",
+    "vite": "5.4.19",
     "@playwright/test": "1.51.1",
     "eslint": "9.19.0",
-    "@remotion/eslint-config-internal": "4.0.310",
-    "@remotion/example-videos": "4.0.310"
+    "@remotion/example-videos": "4.0.312",
+    "@remotion/eslint-config-internal": "4.0.312"
   },
   "keywords": [],
   "publishConfig": {