@remotion/media 4.0.519 → 4.0.521

package/dist/audio/pitch-shift.d.ts

@@ -0,0 +1,23 @@
+import type { AudioBufferSlice } from '../make-iterator-with-priming';
+type PlanarAudio = Float32Array[];
+export declare class StreamingPitchShifter {
+    private readonly numberOfChannels;
+    private readonly stretcher;
+    private readonly resampler;
+    private readonly outputQueue;
+    private totalInputFrames;
+    private totalOutputFrames;
+    constructor({ numberOfChannels, sampleRate, toneFrequency }: {
+        numberOfChannels: number;
+        sampleRate: number;
+        toneFrequency: number;
+    });
+    append(audio: PlanarAudio): PlanarAudio;
+    private takeAvailableOutput;
+    finalize(): Float32Array<ArrayBuffer>[];
+}
+export declare function pitchShiftAudioIterator({ iterator, toneFrequency }: {
+    iterator: AsyncGenerator<AudioBufferSlice, void, unknown>;
+    toneFrequency: number;
+}): AsyncGenerator<AudioBufferSlice, void, unknown>;
+export {};

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

@@ -16,7 +16,7 @@ export declare const anchorToContinuousTime: ({ anchor, unloopedTimeInSeconds, p
     unloopedTimeInSeconds: number;
     playbackRate: number;
 }) => number;
-export declare const audioIteratorManager: ({ audioTrack, delayPlaybackHandleIfNotPremounting, sharedAudioContext, getSequenceEndTimestamp, getSequenceDurationInSeconds, getMediaEndTimestamp, getStartTime, initialMuted, initialVolume, drawDebugOverlay, }: {
+export declare const audioIteratorManager: ({ audioTrack, delayPlaybackHandleIfNotPremounting, sharedAudioContext, getSequenceEndTimestamp, getSequenceDurationInSeconds, getMediaEndTimestamp, getStartTime, initialMuted, initialVolume, toneFrequency, drawDebugOverlay, }: {
     audioTrack: InputAudioTrack;
     delayPlaybackHandleIfNotPremounting: () => DelayPlaybackIfNotPremounting;
     sharedAudioContext: SharedAudioContextForMediaPlayer;
@@ -26,6 +26,7 @@ export declare const audioIteratorManager: ({ audioTrack, delayPlaybackHandleIfN
     getStartTime: () => number;
     initialMuted: boolean;
     initialVolume: number;
+    toneFrequency: number;
     drawDebugOverlay: () => void;
 }) => {
     startAudioIterator: ({ nonce, playbackRate, startFromSecond, unloopedStartFromSecond, scheduleAudioNode, getTargetTime, logLevel, loop, unscheduleAudioNode, getAudioContextCurrentTimeMockedInTest, }: {
@@ -74,6 +75,7 @@ export declare const audioIteratorManager: ({ audioTrack, delayPlaybackHandleIfN
     getTotalAudioScheduledInSeconds: () => number;
     setMuted: (newMuted: boolean) => void;
     setVolume: (volume: number) => void;
+    setToneFrequency: (newToneFrequency: number) => void;
     scheduleAudioChunk: ({ buffer, mediaTimestamp, originalUnloopedMediaTimestamp, sourceOffsetInSeconds, sourceDurationInSeconds, playbackRate, scheduleAudioNode, logLevel, }: {
         buffer: AudioBuffer;
         mediaTimestamp: number;

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

@@ -53,6 +53,7 @@ export declare const drawPreviewOverlay: ({ context, audioTime, audioContextStat
         getTotalAudioScheduledInSeconds: () => number;
         setMuted: (newMuted: boolean) => void;
         setVolume: (volume: number) => void;
+        setToneFrequency: (newToneFrequency: number) => void;
         scheduleAudioChunk: ({ buffer, mediaTimestamp, originalUnloopedMediaTimestamp, sourceOffsetInSeconds, sourceDurationInSeconds, playbackRate, scheduleAudioNode, logLevel, }: {
             buffer: AudioBuffer;
             mediaTimestamp: number;

package/dist/esm/index.mjs

@@ -75,6 +75,19 @@ var getLoopDisplay = ({
   };
 };
 
+// src/validate-tone-frequency.ts
+var validateToneFrequency = ({
+  toneFrequency,
+  component
+}) => {
+  if (toneFrequency === undefined) {
+    return;
+  }
+  if (typeof toneFrequency !== "number" || !Number.isFinite(toneFrequency) || toneFrequency < 0.01 || toneFrequency > 2) {
+    throw new TypeError(`The \`toneFrequency\` prop of <${component}> must be a finite number between 0.01 and 2, but got ${String(toneFrequency)}.`);
+  }
+};
+
 // src/audio/audio-for-preview.tsx
 import { useContext as useContext2, useEffect, useMemo, useRef, useState } from "react";
 import {
@@ -248,6 +261,455 @@ var getTrimStartForAudioNode = ({
   return sourceStartOffsetInSeconds + offsetBecauseOfTrim + offsetBecauseOfTooLate;
 };
 
+// src/audio/pitch-shift.ts
+var REFERENCE_SAMPLE_RATE = 48000;
+var REFERENCE_HOP_SIZE = 512;
+var makePlanarAudio = (numberOfChannels, length) => {
+  return new Array(numberOfChannels).fill(null).map(() => new Float32Array(length));
+};
+var ensurePlanarCapacity = ({
+  buffers,
+  requiredLength
+}) => {
+  if (buffers[0].length >= requiredLength) {
+    return buffers;
+  }
+  let newLength = buffers[0].length;
+  while (newLength < requiredLength) {
+    newLength *= 2;
+  }
+  return buffers.map((buffer) => {
+    const expanded = new Float32Array(newLength);
+    expanded.set(buffer);
+    return expanded;
+  });
+};
+
+class PlanarAudioQueue {
+  chunks = [];
+  length = 0;
+  push(audio) {
+    if (audio[0].length === 0) {
+      return;
+    }
+    this.chunks.push(audio);
+    this.length += audio[0].length;
+  }
+  take(numberOfFrames, numberOfChannels) {
+    const framesToTake = Math.min(numberOfFrames, this.length);
+    const result = makePlanarAudio(numberOfChannels, framesToTake);
+    let written = 0;
+    while (written < framesToTake) {
+      const first = this.chunks[0];
+      const available = first[0].length;
+      const count = Math.min(available, framesToTake - written);
+      for (let channel = 0;channel < numberOfChannels; channel++) {
+        result[channel].set(first[channel].subarray(0, count), written);
+      }
+      if (count === available) {
+        this.chunks.shift();
+      } else {
+        this.chunks[0] = first.map((channel) => channel.subarray(count));
+      }
+      written += count;
+      this.length -= count;
+    }
+    return result;
+  }
+  getLength() {
+    return this.length;
+  }
+}
+
+class StreamingTimeStretcher {
+  numberOfChannels;
+  factor;
+  hopSize;
+  windowSize;
+  searchRadius;
+  analysisHop;
+  input;
+  inputLength = 0;
+  output;
+  outputLength = 0;
+  analysisPosition = 0;
+  synthesisPosition = 0;
+  initialized = false;
+  finalized = false;
+  totalInputFrames = 0;
+  totalOutputFrames = 0;
+  constructor({
+    numberOfChannels,
+    sampleRate,
+    factor
+  }) {
+    this.numberOfChannels = numberOfChannels;
+    this.factor = factor;
+    this.hopSize = Math.max(32, Math.round(REFERENCE_HOP_SIZE * sampleRate / REFERENCE_SAMPLE_RATE));
+    this.windowSize = this.hopSize * 2;
+    this.searchRadius = this.hopSize;
+    this.analysisHop = this.hopSize / factor;
+    this.input = makePlanarAudio(numberOfChannels, 65536);
+    this.output = makePlanarAudio(numberOfChannels, 65536);
+  }
+  append(audio) {
+    if (this.finalized) {
+      throw new Error("Cannot append audio after the time stretcher was finalized.");
+    }
+    const { length } = audio[0];
+    this.input = ensurePlanarCapacity({
+      buffers: this.input,
+      requiredLength: this.inputLength + length
+    });
+    for (let channel = 0;channel < this.numberOfChannels; channel++) {
+      this.input[channel].set(audio[channel], this.inputLength);
+    }
+    this.inputLength += length;
+    this.totalInputFrames += length;
+    this.process();
+    return this.drainFinalizedOutput();
+  }
+  findBestAnalysisPosition({
+    expectedPosition,
+    nextSynthesisPosition
+  }) {
+    const minimum = Math.max(0, Math.floor(expectedPosition - this.searchRadius));
+    const maximum = Math.min(this.inputLength - this.windowSize, Math.ceil(expectedPosition + this.searchRadius));
+    let bestPosition = minimum;
+    let bestCorrelation = -Infinity;
+    for (let candidate = minimum;candidate <= maximum; candidate += 4) {
+      let dotProduct = 0;
+      let previousEnergy = 0;
+      let candidateEnergy = 0;
+      for (let channel = 0;channel < this.numberOfChannels; channel++) {
+        const previous = this.output[channel];
+        const incoming = this.input[channel];
+        for (let frame = 0;frame < this.hopSize; frame += 2) {
+          const previousValue = previous[nextSynthesisPosition + frame];
+          const candidateValue = incoming[candidate + frame];
+          dotProduct += previousValue * candidateValue;
+          previousEnergy += previousValue * previousValue;
+          candidateEnergy += candidateValue * candidateValue;
+        }
+      }
+      const correlation = dotProduct / (Math.sqrt(previousEnergy * candidateEnergy) || Number.EPSILON);
+      if (correlation > bestCorrelation) {
+        bestCorrelation = correlation;
+        bestPosition = candidate;
+      }
+    }
+    const fineMinimum = Math.max(minimum, bestPosition - 4);
+    const fineMaximum = Math.min(maximum, bestPosition + 4);
+    for (let candidate = fineMinimum;candidate <= fineMaximum; candidate++) {
+      let dotProduct = 0;
+      let previousEnergy = 0;
+      let candidateEnergy = 0;
+      for (let channel = 0;channel < this.numberOfChannels; channel++) {
+        const previous = this.output[channel];
+        const incoming = this.input[channel];
+        for (let frame = 0;frame < this.hopSize; frame++) {
+          const previousValue = previous[nextSynthesisPosition + frame];
+          const candidateValue = incoming[candidate + frame];
+          dotProduct += previousValue * candidateValue;
+          previousEnergy += previousValue * previousValue;
+          candidateEnergy += candidateValue * candidateValue;
+        }
+      }
+      const correlation = dotProduct / (Math.sqrt(previousEnergy * candidateEnergy) || Number.EPSILON);
+      if (correlation > bestCorrelation) {
+        bestCorrelation = correlation;
+        bestPosition = candidate;
+      }
+    }
+    return bestPosition;
+  }
+  process() {
+    if (!this.initialized) {
+      if (this.inputLength < this.windowSize + this.searchRadius) {
+        return;
+      }
+      for (let channel = 0;channel < this.numberOfChannels; channel++) {
+        this.output[channel].set(this.input[channel].subarray(0, this.windowSize));
+      }
+      this.outputLength = this.windowSize;
+      this.initialized = true;
+    }
+    while (true) {
+      const expectedPosition = this.analysisPosition + this.analysisHop;
+      if (expectedPosition + this.searchRadius + this.windowSize > this.inputLength) {
+        break;
+      }
+      const nextSynthesisPosition = this.synthesisPosition + this.hopSize;
+      this.output = ensurePlanarCapacity({
+        buffers: this.output,
+        requiredLength: nextSynthesisPosition + this.windowSize
+      });
+      const bestPosition = this.findBestAnalysisPosition({
+        expectedPosition,
+        nextSynthesisPosition
+      });
+      for (let channel = 0;channel < this.numberOfChannels; channel++) {
+        for (let frame = 0;frame < this.hopSize; frame++) {
+          const fadeIn = 0.5 - 0.5 * Math.cos(Math.PI * (frame + 1) / (this.hopSize + 1));
+          const outputIndex = nextSynthesisPosition + frame;
+          this.output[channel][outputIndex] = this.output[channel][outputIndex] * (1 - fadeIn) + this.input[channel][bestPosition + frame] * fadeIn;
+        }
+        this.output[channel].set(this.input[channel].subarray(bestPosition + this.hopSize, bestPosition + this.windowSize), nextSynthesisPosition + this.hopSize);
+      }
+      this.analysisPosition = expectedPosition;
+      this.synthesisPosition = nextSynthesisPosition;
+      this.outputLength = nextSynthesisPosition + this.windowSize;
+    }
+  }
+  drainFinalizedOutput() {
+    if (!this.initialized) {
+      return makePlanarAudio(this.numberOfChannels, 0);
+    }
+    const finalizedLength = Math.max(0, this.synthesisPosition + this.hopSize);
+    const result = this.output.map((channel) => channel.slice(0, finalizedLength));
+    this.totalOutputFrames += finalizedLength;
+    for (let channel = 0;channel < this.numberOfChannels; channel++) {
+      this.output[channel].copyWithin(0, finalizedLength, this.outputLength);
+    }
+    this.outputLength -= finalizedLength;
+    this.synthesisPosition -= finalizedLength;
+    const inputFramesToDiscard = Math.max(0, Math.floor(this.analysisPosition) - this.searchRadius);
+    for (let channel = 0;channel < this.numberOfChannels; channel++) {
+      this.input[channel].copyWithin(0, inputFramesToDiscard, this.inputLength);
+    }
+    this.inputLength -= inputFramesToDiscard;
+    this.analysisPosition -= inputFramesToDiscard;
+    return result;
+  }
+  finalize() {
+    if (this.finalized) {
+      throw new Error("The time stretcher has already been finalized.");
+    }
+    this.finalized = true;
+    const targetLength = Math.round(this.totalInputFrames * this.factor);
+    const padding = makePlanarAudio(this.numberOfChannels, this.windowSize + this.searchRadius * 2);
+    this.input = ensurePlanarCapacity({
+      buffers: this.input,
+      requiredLength: this.inputLength + padding[0].length
+    });
+    for (let channel = 0;channel < this.numberOfChannels; channel++) {
+      this.input[channel].set(padding[channel], this.inputLength);
+    }
+    this.inputLength += padding[0].length;
+    this.process();
+    const finalized = this.drainFinalizedOutput();
+    const remaining = Math.max(0, targetLength - this.totalOutputFrames + finalized[0].length);
+    if (finalized[0].length >= remaining) {
+      return finalized.map((channel) => channel.slice(0, remaining));
+    }
+    const result = makePlanarAudio(this.numberOfChannels, remaining);
+    for (let channel = 0;channel < this.numberOfChannels; channel++) {
+      result[channel].set(finalized[channel]);
+    }
+    return result;
+  }
+}
+
+class StreamingLinearResampler {
+  numberOfChannels;
+  step;
+  input;
+  inputLength = 0;
+  position = 0;
+  constructor({
+    numberOfChannels,
+    step
+  }) {
+    this.numberOfChannels = numberOfChannels;
+    this.step = step;
+    this.input = makePlanarAudio(numberOfChannels, 65536);
+  }
+  append(audio) {
+    this.input = ensurePlanarCapacity({
+      buffers: this.input,
+      requiredLength: this.inputLength + audio[0].length
+    });
+    for (let channel = 0;channel < this.numberOfChannels; channel++) {
+      this.input[channel].set(audio[channel], this.inputLength);
+    }
+    this.inputLength += audio[0].length;
+    return this.process(false);
+  }
+  process(finalizing) {
+    const outputLength = Math.max(0, Math.floor((this.inputLength - (finalizing ? 0 : 1) - this.position) / this.step) + 1);
+    const result = makePlanarAudio(this.numberOfChannels, outputLength);
+    for (let outputFrame = 0;outputFrame < outputLength; outputFrame++) {
+      const leftIndex = Math.floor(this.position);
+      const rightIndex = Math.min(leftIndex + 1, this.inputLength - 1);
+      const fraction = this.position - leftIndex;
+      for (let channel = 0;channel < this.numberOfChannels; channel++) {
+        const left = this.input[channel][leftIndex];
+        const right = this.input[channel][rightIndex];
+        result[channel][outputFrame] = left + (right - left) * fraction;
+      }
+      this.position += this.step;
+    }
+    const discard = Math.min(Math.floor(this.position), this.inputLength);
+    for (let channel = 0;channel < this.numberOfChannels; channel++) {
+      this.input[channel].copyWithin(0, discard, this.inputLength);
+    }
+    this.inputLength -= discard;
+    this.position -= discard;
+    return result;
+  }
+  finalize() {
+    return this.process(true);
+  }
+}
+
+class StreamingPitchShifter {
+  numberOfChannels;
+  stretcher;
+  resampler;
+  outputQueue = new PlanarAudioQueue;
+  totalInputFrames = 0;
+  totalOutputFrames = 0;
+  constructor({
+    numberOfChannels,
+    sampleRate,
+    toneFrequency
+  }) {
+    this.numberOfChannels = numberOfChannels;
+    this.stretcher = new StreamingTimeStretcher({
+      numberOfChannels,
+      sampleRate,
+      factor: toneFrequency
+    });
+    this.resampler = new StreamingLinearResampler({
+      numberOfChannels,
+      step: toneFrequency
+    });
+  }
+  append(audio) {
+    this.totalInputFrames += audio[0].length;
+    const stretched = this.stretcher.append(audio);
+    this.outputQueue.push(this.resampler.append(stretched));
+    return this.takeAvailableOutput();
+  }
+  takeAvailableOutput() {
+    const availableInputFrames = this.totalInputFrames - this.totalOutputFrames;
+    const framesToTake = Math.min(availableInputFrames, this.outputQueue.getLength());
+    const result = this.outputQueue.take(framesToTake, this.numberOfChannels);
+    this.totalOutputFrames += framesToTake;
+    return result;
+  }
+  finalize() {
+    this.outputQueue.push(this.resampler.append(this.stretcher.finalize()));
+    this.outputQueue.push(this.resampler.finalize());
+    const remaining = this.totalInputFrames - this.totalOutputFrames;
+    const available = this.outputQueue.take(Math.min(remaining, this.outputQueue.getLength()), this.numberOfChannels);
+    const result = makePlanarAudio(this.numberOfChannels, remaining);
+    for (let channel = 0;channel < this.numberOfChannels; channel++) {
+      result[channel].set(available[channel]);
+    }
+    this.totalOutputFrames += remaining;
+    return result;
+  }
+}
+var getPlanarSlice = (slice) => {
+  const { buffer } = slice.buffer;
+  const startFrame = Math.max(0, Math.round(slice.sourceOffsetInSeconds * buffer.sampleRate));
+  const numberOfFrames = Math.min(buffer.length - startFrame, Math.round(slice.sourceDurationInSeconds * buffer.sampleRate));
+  return new Array(buffer.numberOfChannels).fill(null).map((_, channel) => buffer.getChannelData(channel).slice(startFrame, startFrame + numberOfFrames));
+};
+var makeAudioBufferSlice = ({
+  audio,
+  timelineTimestamp,
+  sampleRate
+}) => {
+  const buffer = new AudioBuffer({
+    length: audio[0].length,
+    numberOfChannels: audio.length,
+    sampleRate
+  });
+  for (let channel = 0;channel < audio.length; channel++) {
+    buffer.copyToChannel(new Float32Array(audio[channel]), channel);
+  }
+  const duration = audio[0].length / sampleRate;
+  return {
+    buffer: { buffer, timestamp: timelineTimestamp, duration },
+    timelineTimestamp,
+    sourceOffsetInSeconds: 0,
+    sourceDurationInSeconds: duration
+  };
+};
+async function* pitchShiftAudioIterator({
+  iterator,
+  toneFrequency
+}) {
+  if (toneFrequency === 1) {
+    yield* iterator;
+    return;
+  }
+  let shifter = null;
+  let sampleRate = 0;
+  let numberOfChannels = 0;
+  let segmentStart = 0;
+  let segmentInputFrames = 0;
+  let segmentOutputFrames = 0;
+  const flush = () => {
+    if (!shifter) {
+      return null;
+    }
+    const audio = shifter.finalize();
+    const slice = audio[0].length === 0 ? null : makeAudioBufferSlice({
+      audio,
+      timelineTimestamp: segmentStart + segmentOutputFrames / sampleRate,
+      sampleRate
+    });
+    shifter = null;
+    return slice;
+  };
+  for await (const slice of iterator) {
+    const planar = getPlanarSlice(slice);
+    if (planar[0].length === 0) {
+      continue;
+    }
+    const nextSampleRate = slice.buffer.buffer.sampleRate;
+    const nextNumberOfChannels = slice.buffer.buffer.numberOfChannels;
+    const expectedTimestamp = segmentStart + segmentInputFrames / sampleRate;
+    const startsNewSegment = !shifter || nextSampleRate !== sampleRate || nextNumberOfChannels !== numberOfChannels || Math.abs(slice.timelineTimestamp - expectedTimestamp) > 1.5 / nextSampleRate;
+    if (startsNewSegment) {
+      const previousSegmentFinalSlice = flush();
+      if (previousSegmentFinalSlice) {
+        yield previousSegmentFinalSlice;
+      }
+      sampleRate = nextSampleRate;
+      numberOfChannels = nextNumberOfChannels;
+      segmentStart = slice.timelineTimestamp;
+      segmentInputFrames = 0;
+      segmentOutputFrames = 0;
+      shifter = new StreamingPitchShifter({
+        numberOfChannels,
+        sampleRate,
+        toneFrequency
+      });
+    }
+    if (!shifter) {
+      throw new Error("Pitch shifter was not initialized.");
+    }
+    segmentInputFrames += planar[0].length;
+    const output = shifter.append(planar);
+    if (output[0].length > 0) {
+      yield makeAudioBufferSlice({
+        audio: output,
+        timelineTimestamp: segmentStart + segmentOutputFrames / sampleRate,
+        sampleRate
+      });
+      segmentOutputFrames += output[0].length;
+    }
+  }
+  const finalSlice = flush();
+  if (finalSlice) {
+    yield finalSlice;
+  }
+}
+
 // src/audio/sort-by-priority.ts
 class StaleWaiterError extends Error {
   constructor() {
@@ -436,10 +898,12 @@ var audioIteratorManager = ({
   getStartTime,
   initialMuted,
   initialVolume,
+  toneFrequency,
   drawDebugOverlay
 }) => {
   let muted = initialMuted;
   let currentVolume = Math.max(0, initialVolume);
+  let currentToneFrequency = toneFrequency;
   let currentSeek = null;
   const gainNode = sharedAudioContext.audioContext.createGain();
   gainNode.gain.value = muted ? 0 : currentVolume;
@@ -651,7 +1115,7 @@ var audioIteratorManager = ({
       mediaStartInSeconds: startFromSecond
     };
     const maximumContinuousTimestamp = startFromSecond + getSequenceDurationInSeconds() * playbackRate;
-    const source = loop ? makeLoopingIterator({
+    const unshiftedSource = loop ? makeLoopingIterator({
       audioSink,
       seekTimeInSeconds: startFromSecond,
       loopStartInSeconds: getStartTime(),
@@ -662,6 +1126,10 @@ var audioIteratorManager = ({
       timeToSeek: startFromSecond,
       maximumTimestamp
     });
+    const source = pitchShiftAudioIterator({
+      iterator: unshiftedSource,
+      toneFrequency: currentToneFrequency
+    });
     const iterator = makeAudioIterator({
       startFromSecond,
       iterator: source,
@@ -796,6 +1264,9 @@ var audioIteratorManager = ({
       currentVolume = Math.max(0, volume);
       gainNode.gain.value = muted ? 0 : currentVolume;
     },
+    setToneFrequency: (newToneFrequency) => {
+      currentToneFrequency = newToneFrequency;
+    },
     scheduleAudioChunk,
     waitForNScheduledNodes
   };
@@ -1749,6 +2220,7 @@ class MediaPlayer {
   src;
   logLevel;
   playbackRate;
+  toneFrequency;
   globalPlaybackRate;
   audioStreamIndex;
   sharedAudioContext;
@@ -1779,6 +2251,7 @@ class MediaPlayer {
     trimBefore,
     trimAfter,
     playbackRate,
+    toneFrequency,
     globalPlaybackRate,
     audioStreamIndex,
     fps,
@@ -1801,6 +2274,7 @@ class MediaPlayer {
     this.logLevel = logLevel;
     this.sharedAudioContext = sharedAudioContext;
     this.playbackRate = playbackRate;
+    this.toneFrequency = toneFrequency;
     this.globalPlaybackRate = globalPlaybackRate;
     this.loop = loop;
     this.trimBefore = trimBefore;
@@ -1974,6 +2448,7 @@ class MediaPlayer {
             getStartTime: () => this.getStartTime(),
             initialMuted,
             initialVolume,
+            toneFrequency: this.toneFrequency,
             drawDebugOverlay: this.drawDebugOverlay,
             getSequenceDurationInSeconds: () => this.getSequenceDurationInSeconds()
           });
@@ -2132,6 +2607,17 @@ class MediaPlayer {
       await this.seekTo(unloopedTimeInSeconds);
     }
   }
+  async setToneFrequency(toneFrequency, unloopedTimeInSeconds) {
+    if (this.toneFrequency !== toneFrequency) {
+      this.toneFrequency = toneFrequency;
+      if (!this.audioIteratorManager) {
+        return;
+      }
+      this.audioIteratorManager.setToneFrequency(toneFrequency);
+      this.audioIteratorManager.destroyIterator();
+      await this.seekTo(unloopedTimeInSeconds);
+    }
+  }
   async setGlobalPlaybackRate(rate, unloopedTimeInSeconds) {
     const previousRate = this.globalPlaybackRate;
     if (previousRate !== rate) {
@@ -2319,6 +2805,7 @@ var useCommonEffects = ({
   effectiveMuted,
   userPreferredVolume,
   playbackRate,
+  toneFrequency,
   globalPlaybackRate,
   fps,
   sequenceOffset,
@@ -2394,6 +2881,13 @@ var useCommonEffects = ({
     }
     mediaPlayer.setPlaybackRate(playbackRate, currentTimeRef.current);
   }, [playbackRate, mediaPlayerReady, mediaPlayerRef, currentTimeRef]);
+  useLayoutEffect(() => {
+    const mediaPlayer = mediaPlayerRef.current;
+    if (!mediaPlayer || !mediaPlayerReady) {
+      return;
+    }
+    mediaPlayer.setToneFrequency(toneFrequency, currentTimeRef.current);
+  }, [toneFrequency, mediaPlayerReady, mediaPlayerRef, currentTimeRef]);
   useLayoutEffect(() => {
     const mediaPlayer = mediaPlayerRef.current;
     if (!mediaPlayer || !mediaPlayerReady) {
@@ -2456,7 +2950,6 @@ var useCommonEffects = ({
 import { jsx } from "react/jsx-runtime";
 var {
   useUnsafeVideoConfig,
-  Timeline,
   SharedAudioContext,
   usePlayerMutedState,
   useMediaVolumeState,
@@ -2464,7 +2957,9 @@ var {
   evaluateVolume,
   warnAboutTooHighVolume,
   usePreload,
-  SequenceContext
+  SequenceContext,
+  usePlaying,
+  useBuffering
 } = Internals9;
 var AudioForPreviewAssertedShowing = ({
   src,
@@ -2494,10 +2989,11 @@ var AudioForPreviewAssertedShowing = ({
   const mediaPlayerRef = useRef(null);
   const initialTrimBeforeRef = useRef(trimBefore);
   const initialTrimAfterRef = useRef(trimAfter);
+  const initialToneFrequencyRef = useRef(toneFrequency ?? 1);
   const [initialRequestInit] = useState(requestInit);
   const [mediaPlayerReady, setMediaPlayerReady] = useState(false);
   const [shouldFallbackToNativeAudio, setShouldFallbackToNativeAudio] = useState(false);
-  const [playing] = Timeline.usePlayingState();
+  const playing = usePlaying();
   const { playbackRate: globalPlaybackRate } = Internals9.usePlaybackRate();
   const sharedAudioContext = useContext2(SharedAudioContext);
   const buffer = useBufferState();
@@ -2524,12 +3020,8 @@ var AudioForPreviewAssertedShowing = ({
   const isPremounting = Boolean(parentSequence?.premounting);
   const isPostmounting = Boolean(parentSequence?.postmounting);
   const sequenceOffset = (parentSequence?.absoluteFrom ?? 0) / videoConfig.fps;
-  const bufferingContext = useContext2(Internals9.BufferingContextReact);
-  if (!bufferingContext) {
-    throw new Error("useMediaPlayback must be used inside a <BufferingContext>");
-  }
   const effectiveMuted = muted || playerMuted || userPreferredVolume <= 0;
-  const isPlayerBuffering = Internals9.useIsPlayerBuffering(bufferingContext);
+  const isPlayerBuffering = useBuffering();
   const initialPlaying = useRef(playing && !isPlayerBuffering);
   const initialIsPremounting = useRef(isPremounting);
   const initialIsPostmounting = useRef(isPostmounting);
@@ -2551,6 +3043,7 @@ var AudioForPreviewAssertedShowing = ({
     effectiveMuted,
     userPreferredVolume,
     playbackRate,
+    toneFrequency: toneFrequency ?? 1,
     globalPlaybackRate,
     fps: videoConfig.fps,
     sequenceOffset,
@@ -2594,6 +3087,7 @@ var AudioForPreviewAssertedShowing = ({
         fps: videoConfig.fps,
         canvas: null,
         playbackRate: initialPlaybackRate.current,
+        toneFrequency: initialToneFrequencyRef.current,
         audioStreamIndex: audioStreamIndex ?? null,
         debugOverlay: false,
         bufferState: buffer,
@@ -3582,6 +4076,10 @@ var makeKeyframeBank = async ({
   };
   const ensureEnoughFramesForTimestamp = async (timestampInSeconds, logLevel, fps) => {
     while (!hasDecodedEnoughForTimestamp(timestampInSeconds)) {
+      deleteFramesBeforeTimestamp({
+        logLevel: parentLogLevel,
+        timestampInSeconds: timestampInSeconds - getSafeWindowOfMonotonicity(fps)
+      });
       const sample = await sampleIterator.next();
       if (sample.value) {
         addFrame(sample.value, logLevel);
@@ -5201,6 +5699,7 @@ var { validateMediaProps } = Internals19;
 var audioSchema = {
   src: {
     type: "asset",
+    assetType: "audio",
     default: undefined,
     description: "Source",
     keyframable: false
@@ -5225,6 +5724,16 @@ var audioSchema = {
     hiddenFromList: false,
     keyframable: false
   },
+  toneFrequency: {
+    type: "number",
+    min: 0.01,
+    max: 2,
+    step: 0.01,
+    default: 1,
+    description: "Pitch",
+    hiddenFromList: false,
+    keyframable: false
+  },
   muted: { type: "boolean", default: false, description: "Muted" },
   loop: { type: "boolean", default: false, description: "Loop" }
 };
@@ -5306,6 +5815,10 @@ var AudioInner = (props) => {
     throw new TypeError(`The \`<Audio>\` tag requires a string for \`src\`, but got ${JSON.stringify(props.src)} instead.`);
   }
   validateMediaProps({ playbackRate: props.playbackRate, volume: props.volume }, "Audio");
+  validateToneFrequency({
+    toneFrequency: props.toneFrequency,
+    component: "Audio"
+  });
   if (sequenceDurationInFrames === 0) {
     return null;
   }
@@ -5459,7 +5972,6 @@ var warnAboutObjectFitInStyleOrClassName = ({
 import { jsx as jsx4 } from "react/jsx-runtime";
 var {
   useUnsafeVideoConfig: useUnsafeVideoConfig2,
-  Timeline: Timeline2,
   SharedAudioContext: SharedAudioContext2,
   usePlayerMutedState: usePlayerMutedState2,
   useMediaVolumeState: useMediaVolumeState2,
@@ -5468,12 +5980,15 @@ var {
   warnAboutTooHighVolume: warnAboutTooHighVolume2,
   usePreload: usePreload2,
   SequenceContext: SequenceContext2,
-  useEffectChainState
+  useEffectChainState,
+  usePlaying: usePlaying2,
+  useBuffering: useBuffering2
 } = Internals22;
 var VideoForPreviewAssertedShowing = ({
   src: unpreloadedSrc,
   style,
   playbackRate,
+  toneFrequency,
   logLevel,
   className,
   muted,
@@ -5511,7 +6026,7 @@ var VideoForPreviewAssertedShowing = ({
   const [initialRequestInit] = useState4(requestInit);
   const [mediaPlayerReady, setMediaPlayerReady] = useState4(false);
   const [shouldFallbackToNativeVideo, setShouldFallbackToNativeVideo] = useState4(false);
-  const [playing] = Timeline2.usePlayingState();
+  const playing = usePlaying2();
   const { playbackRate: globalPlaybackRate } = Internals22.usePlaybackRate();
   const sharedAudioContext = useContext4(SharedAudioContext2);
   const buffer = useBufferState2();
@@ -5549,17 +6064,14 @@ var VideoForPreviewAssertedShowing = ({
   const currentTimeRef = useRef2(currentTime);
   currentTimeRef.current = currentTime;
   const preloadedSrc = usePreload2(src);
-  const buffering = useContext4(Internals22.BufferingContextReact);
-  if (!buffering) {
-    throw new Error("useMediaPlayback must be used inside a <BufferingContext>");
-  }
   const effectiveMuted = muted || playerMuted || userPreferredVolume <= 0;
-  const isPlayerBuffering = Internals22.useIsPlayerBuffering(buffering);
+  const isPlayerBuffering = useBuffering2();
   const initialPlaying = useRef2(playing && !isPlayerBuffering);
   const initialIsPremounting = useRef2(isPremounting);
   const initialIsPostmounting = useRef2(isPostmounting);
   const initialGlobalPlaybackRate = useRef2(globalPlaybackRate);
   const initialPlaybackRate = useRef2(playbackRate);
+  const initialToneFrequency = useRef2(toneFrequency);
   const initialMuted = useRef2(effectiveMuted);
   const initialVolume = useRef2(userPreferredVolume);
   const initialSequenceDuration = useRef2(videoConfig.durationInFrames);
@@ -5620,6 +6132,7 @@ var VideoForPreviewAssertedShowing = ({
         trimBefore: initialTrimBeforeRef.current,
         fps: videoConfig.fps,
         playbackRate: initialPlaybackRate.current,
+        toneFrequency: initialToneFrequency.current,
         audioStreamIndex,
         debugOverlay,
         bufferState: buffer,
@@ -5751,6 +6264,7 @@ var VideoForPreviewAssertedShowing = ({
     effectiveMuted,
     userPreferredVolume,
     playbackRate,
+    toneFrequency,
     globalPlaybackRate,
     fps: videoConfig.fps,
     sequenceOffset,
@@ -5801,6 +6315,7 @@ var VideoForPreviewAssertedShowing = ({
       trimAfter,
       trimBefore,
       playbackRate,
+      toneFrequency,
       loopVolumeCurveBehavior,
       name: "<Html5Video> (fallback)",
       loop,
@@ -6226,6 +6741,7 @@ var {
 var videoSchema = {
   src: {
     type: "asset",
+    assetType: "video",
     default: undefined,
     description: "Source",
     keyframable: false
@@ -6250,6 +6766,16 @@ var videoSchema = {
     hiddenFromList: false,
     keyframable: false
   },
+  toneFrequency: {
+    type: "number",
+    min: 0.01,
+    max: 2,
+    step: 0.01,
+    default: 1,
+    description: "Pitch",
+    hiddenFromList: false,
+    keyframable: false
+  },
   muted: { type: "boolean", default: false, description: "Muted" },
   loop: { type: "boolean", default: false, description: "Loop" },
   ...Internals24.transformSchema,
@@ -6309,6 +6835,7 @@ var InnerVideo = ({
     trimAfter
   });
   validateMediaProps2({ playbackRate, volume }, "Video");
+  validateToneFrequency({ toneFrequency, component: "Video" });
   if (environment.isRendering) {
     return /* @__PURE__ */ jsx6(VideoForRendering, {
       ...props,
@@ -6350,6 +6877,7 @@ var InnerVideo = ({
     muted,
     onVideoFrame,
     playbackRate,
+    toneFrequency: toneFrequency ?? 1,
     src,
     style,
     volume,

package/dist/media-player.d.ts

@@ -26,6 +26,7 @@ export declare class MediaPlayer {
     private src;
     private logLevel;
     private playbackRate;
+    private toneFrequency;
     private globalPlaybackRate;
     private audioStreamIndex;
     private sharedAudioContext;
@@ -47,7 +48,7 @@ export declare class MediaPlayer {
     private initializationPromise;
     private premountAwareDelayPlayback;
     private seekPromiseChain;
-    constructor({ canvas, src, logLevel, sharedAudioContext, loop, trimBefore, trimAfter, playbackRate, globalPlaybackRate, audioStreamIndex, fps, debugOverlay, bufferState, isPremounting, isPostmounting, durationInFrames, onVideoFrameCallback, playing, sequenceOffset, credentials, requestInit, tagType, getEffects, getEffectChainState }: {
+    constructor({ canvas, src, logLevel, sharedAudioContext, loop, trimBefore, trimAfter, playbackRate, toneFrequency, globalPlaybackRate, audioStreamIndex, fps, debugOverlay, bufferState, isPremounting, isPostmounting, durationInFrames, onVideoFrameCallback, playing, sequenceOffset, credentials, requestInit, tagType, getEffects, getEffectChainState }: {
         canvas: HTMLCanvasElement | OffscreenCanvas | null;
         src: string;
         logLevel: LogLevel;
@@ -56,6 +57,7 @@ export declare class MediaPlayer {
         trimBefore: number | undefined;
         trimAfter: number | undefined;
         playbackRate: number;
+        toneFrequency: number;
         globalPlaybackRate: number;
         audioStreamIndex: number | null;
         fps: number;
@@ -98,6 +100,7 @@ export declare class MediaPlayer {
     setTrimAfter(trimAfter: number | undefined, unloopedTimeInSeconds: number): Promise<void>;
     setDebugOverlay(debugOverlay: boolean): void;
     setPlaybackRate(rate: number, unloopedTimeInSeconds: number): Promise<void>;
+    setToneFrequency(toneFrequency: number, unloopedTimeInSeconds: number): Promise<void>;
     setGlobalPlaybackRate(rate: number, unloopedTimeInSeconds: number): Promise<void>;
     setFps(fps: number, unloopedTimeInSeconds: number): Promise<void>;
     setIsPremounting(isPremounting: boolean): void;

package/dist/use-common-effects.d.ts

@@ -1,6 +1,6 @@
 import type React from 'react';
 import type { MediaPlayer } from './media-player';
-export declare const useCommonEffects: ({ mediaPlayerRef, mediaPlayerReady, currentTimeRef, playing, isPlayerBuffering, frame, trimBefore, trimAfter, effectiveMuted, userPreferredVolume, playbackRate, globalPlaybackRate, fps, sequenceOffset, loop, durationInFrames, isPremounting, isPostmounting, currentTime, logLevel, label, }: {
+export declare const useCommonEffects: ({ mediaPlayerRef, mediaPlayerReady, currentTimeRef, playing, isPlayerBuffering, frame, trimBefore, trimAfter, effectiveMuted, userPreferredVolume, playbackRate, toneFrequency, globalPlaybackRate, fps, sequenceOffset, loop, durationInFrames, isPremounting, isPostmounting, currentTime, logLevel, label, }: {
     readonly mediaPlayerRef: React.RefObject<MediaPlayer | null>;
     readonly mediaPlayerReady: boolean;
     readonly currentTimeRef: React.RefObject<number>;
@@ -12,6 +12,7 @@ export declare const useCommonEffects: ({ mediaPlayerRef, mediaPlayerReady, curr
     readonly effectiveMuted: boolean;
     readonly userPreferredVolume: number;
     readonly playbackRate: number;
+    readonly toneFrequency: number;
     readonly globalPlaybackRate: number;
     readonly fps: number;
     readonly sequenceOffset: number;

package/dist/validate-tone-frequency.d.ts

@@ -0,0 +1,4 @@
+export declare const validateToneFrequency: ({ toneFrequency, component, }: {
+    toneFrequency: number | undefined;
+    component: "Audio" | "Video";
+}) => void;

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

@@ -7,6 +7,7 @@ type VideoForPreviewProps = NativeVideoProps & {
     readonly src: string;
     readonly style: React.CSSProperties | undefined;
     readonly playbackRate: number;
+    readonly toneFrequency: number;
     readonly logLevel: LogLevel;
     readonly className: string | undefined;
     readonly muted: boolean;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@remotion/media",
-	"version": "4.0.519",
+	"version": "4.0.521",
 	"main": "dist/index.js",
 	"types": "dist/index.d.ts",
 	"module": "dist/esm/index.mjs",
@@ -22,17 +22,17 @@
 		"make": "tsgo && bun --env-file=../.env.bundle bundle.ts"
 	},
 	"dependencies": {
-		"mediabunny": "1.55.1",
-		"remotion": "4.0.519",
-		"zod": "4.4.3"
+		"mediabunny": "1.55.5",
+		"remotion": "4.0.521",
+		"zod": "4.5.4"
 	},
 	"peerDependencies": {
 		"react": ">=16.8.0",
 		"react-dom": ">=16.8.0"
 	},
 	"devDependencies": {
-		"@remotion/eslint-config-internal": "4.0.519",
-		"@remotion/player": "4.0.519",
+		"@remotion/eslint-config-internal": "4.0.521",
+		"@remotion/player": "4.0.521",
 		"@vitest/browser-webdriverio": "4.0.9",
 		"eslint": "9.19.0",
 		"react": "19.2.3",