@remotion/timeline-utils 4.0.526 → 4.0.528

package/dist/audio-waveform/get-visible-waveform-volume.d.ts

@@ -1,8 +1,6 @@
-import { type TimelineLoopDisplay } from '../loop-display';
 import type { WaveformVolume } from './draw-peaks';
-export declare const getVisibleWaveformVolume: ({ displayDurationInFrames, displayOffsetInFrames, loopDisplay, volume, }: {
+export declare const getVisibleWaveformVolume: ({ displayDurationInFrames, displayOffsetInFrames, volume, }: {
     readonly displayDurationInFrames: number;
     readonly displayOffsetInFrames: number;
-    readonly loopDisplay: TimelineLoopDisplay | undefined;
     readonly volume: WaveformVolume;
 }) => WaveformVolume;

package/dist/audio-waveform/get-visible-waveform-volume.js

@@ -1,8 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.getVisibleWaveformVolume = void 0;
-const loop_display_1 = require("../loop-display");
-const getVisibleWaveformVolume = ({ displayDurationInFrames, displayOffsetInFrames, loopDisplay, volume, }) => {
+const getVisibleWaveformVolume = ({ displayDurationInFrames, displayOffsetInFrames, volume, }) => {
     if (!Array.isArray(volume)) {
         return volume;
     }
@@ -10,27 +9,10 @@ const getVisibleWaveformVolume = ({ displayDurationInFrames, displayOffsetInFram
         displayDurationInFrames <= 0) {
         return [];
     }
-    if (!(0, loop_display_1.shouldTileLoopDisplay)(loopDisplay) ||
-        loopDisplay.durationInFrames <= 0) {
-        const start = Math.max(0, Math.floor(displayOffsetInFrames));
-        const end = Math.min(volume.length, Math.ceil(displayOffsetInFrames + displayDurationInFrames));
-        return volume.slice(start, end);
-    }
-    const segments = (0, loop_display_1.getLoopDisplaySegments)({
-        displayDurationInFrames,
-        displayOffsetInFrames,
-        loopDurationInFrames: loopDisplay.durationInFrames,
-    });
-    const result = [];
-    for (const segment of segments) {
-        const start = Math.max(0, Math.floor(segment.loopOffsetInFrames));
-        const end = Math.min(volume.length, Math.ceil(segment.loopOffsetInFrames + segment.durationInFrames));
-        // Do not `push(...slice)`: Chrome throws RangeError: Invalid array length
-        // once a loop segment is longer than ~65k frames.
-        for (let index = start; index < end; index++) {
-            result.push(volume[index]);
-        }
-    }
-    return result;
+    // Registered curves already cover the visible composition timeline, including
+    // repeat/extend behavior and partial loops introduced by ancestor trimming.
+    const start = Math.max(0, Math.floor(displayOffsetInFrames));
+    const end = Math.min(volume.length, Math.ceil(displayOffsetInFrames + displayDurationInFrames));
+    return volume.slice(start, end);
 };
 exports.getVisibleWaveformVolume = getVisibleWaveformVolume;

package/dist/audio-waveform/slice-visible-waveform-peaks.js

@@ -4,8 +4,7 @@ exports.sliceVisibleWaveformPeaks = void 0;
 const loop_display_1 = require("../loop-display");
 const slice_waveform_peaks_1 = require("./slice-waveform-peaks");
 const sliceVisibleWaveformPeaks = ({ displayDurationInFrames, displayOffsetInFrames, durationInFrames, fps, loopDisplay, peaks, playbackRate, startFrom, waveformSampleRate, }) => {
-    if (!(0, loop_display_1.shouldTileLoopDisplay)(loopDisplay) ||
-        loopDisplay.durationInFrames <= 0) {
+    if (!loopDisplay || loopDisplay.durationInFrames <= 0) {
         return (0, slice_waveform_peaks_1.sliceWaveformPeaks)({
             durationInFrames: Math.min(displayDurationInFrames, Math.max(0, durationInFrames - displayOffsetInFrames)),
             fps,

package/dist/audio-waveform/slice-waveform-peaks.js

@@ -8,8 +8,18 @@ const sliceWaveformPeaks = ({ durationInFrames, fps, peaks, playbackRate, startF
     }
     const startTimeInSeconds = startFrom / fps;
     const durationInSeconds = (durationInFrames / fps) * playbackRate;
-    const startPeakIndex = Math.floor(startTimeInSeconds * waveformSampleRate);
-    const endPeakIndex = Math.ceil((startTimeInSeconds + durationInSeconds) * waveformSampleRate);
+    const start = startTimeInSeconds * waveformSampleRate;
+    const end = (startTimeInSeconds + durationInSeconds) * waveformSampleRate;
+    // Fractional loop periods can round an exact trim boundary a few ULPs past
+    // the next sample. Do not include a peak from outside the trimmed source.
+    const startPeakIndex = Math.floor(start +
+        (Number.isFinite(start)
+            ? Number.EPSILON * Math.max(1, Math.abs(start)) * 4
+            : 0));
+    const endPeakIndex = Math.ceil(end -
+        (Number.isFinite(end)
+            ? Number.EPSILON * Math.max(1, Math.abs(end)) * 4
+            : 0));
     if (!Number.isFinite(startPeakIndex) || !Number.isFinite(endPeakIndex)) {
         return peaks.subarray(Math.max(0, startPeakIndex), Math.min(peaks.length, endPeakIndex));
     }

package/dist/esm/index.mjs

@@ -99,54 +99,10 @@ var drawBars = ({
   }
   ctx.putImageData(imageData, 0, 0);
 };
-// src/loop-display.ts
-var shouldTileLoopDisplay = (loopDisplay) => {
-  return loopDisplay !== undefined && loopDisplay.numberOfTimes > 1;
-};
-var getLoopDisplaySegments = ({
-  displayDurationInFrames,
-  displayOffsetInFrames,
-  loopDurationInFrames
-}) => {
-  if (!Number.isFinite(displayDurationInFrames) || displayDurationInFrames <= 0 || !Number.isFinite(displayOffsetInFrames) || !Number.isFinite(loopDurationInFrames) || loopDurationInFrames <= 0) {
-    return [];
-  }
-  const displayEndInFrames = displayOffsetInFrames + displayDurationInFrames;
-  const firstLoopIndex = Math.floor(displayOffsetInFrames / loopDurationInFrames);
-  const lastLoopIndex = Math.floor(displayEndInFrames / loopDurationInFrames);
-  const segments = [];
-  for (let loopIndex = firstLoopIndex;loopIndex <= lastLoopIndex; loopIndex++) {
-    const loopStartInFrames = loopIndex * loopDurationInFrames;
-    const segmentStart = Math.max(displayOffsetInFrames, loopStartInFrames);
-    const segmentEnd = Math.min(displayEndInFrames, loopStartInFrames + loopDurationInFrames);
-    const durationInFrames = segmentEnd - segmentStart;
-    if (durationInFrames <= 0) {
-      continue;
-    }
-    segments.push({
-      loopIndex,
-      absoluteOffsetInFrames: segmentStart,
-      loopOffsetInFrames: segmentStart - loopStartInFrames,
-      durationInFrames
-    });
-  }
-  return segments;
-};
-var getLoopDisplayWidth = ({
-  visualizationWidth,
-  loopDisplay
-}) => {
-  if (!shouldTileLoopDisplay(loopDisplay)) {
-    return visualizationWidth;
-  }
-  return visualizationWidth / loopDisplay.numberOfTimes;
-};
-
 // src/audio-waveform/get-visible-waveform-volume.ts
 var getVisibleWaveformVolume = ({
   displayDurationInFrames,
   displayOffsetInFrames,
-  loopDisplay,
   volume
 }) => {
   if (!Array.isArray(volume)) {
@@ -155,25 +111,9 @@ var getVisibleWaveformVolume = ({
   if (!Number.isFinite(displayDurationInFrames) || displayDurationInFrames <= 0) {
     return [];
   }
-  if (!shouldTileLoopDisplay(loopDisplay) || loopDisplay.durationInFrames <= 0) {
-    const start = Math.max(0, Math.floor(displayOffsetInFrames));
-    const end = Math.min(volume.length, Math.ceil(displayOffsetInFrames + displayDurationInFrames));
-    return volume.slice(start, end);
-  }
-  const segments = getLoopDisplaySegments({
-    displayDurationInFrames,
-    displayOffsetInFrames,
-    loopDurationInFrames: loopDisplay.durationInFrames
-  });
-  const result = [];
-  for (const segment of segments) {
-    const start = Math.max(0, Math.floor(segment.loopOffsetInFrames));
-    const end = Math.min(volume.length, Math.ceil(segment.loopOffsetInFrames + segment.durationInFrames));
-    for (let index = start;index < end; index++) {
-      result.push(volume[index]);
-    }
-  }
-  return result;
+  const start = Math.max(0, Math.floor(displayOffsetInFrames));
+  const end = Math.min(volume.length, Math.ceil(displayOffsetInFrames + displayDurationInFrames));
+  return volume.slice(start, end);
 };
 // src/audio-waveform/load-waveform-peaks.ts
 import { ALL_FORMATS, AudioSampleSink, Input, UrlSource } from "mediabunny";
@@ -389,6 +329,49 @@ async function loadWaveformPeaks(src, signal, options) {
     input?.dispose();
   }
 }
+// src/loop-display.ts
+var shouldTileLoopDisplay = (loopDisplay) => {
+  return loopDisplay !== undefined && loopDisplay.numberOfTimes > 1;
+};
+var getLoopDisplaySegments = ({
+  displayDurationInFrames,
+  displayOffsetInFrames,
+  loopDurationInFrames
+}) => {
+  if (!Number.isFinite(displayDurationInFrames) || displayDurationInFrames <= 0 || !Number.isFinite(displayOffsetInFrames) || !Number.isFinite(loopDurationInFrames) || loopDurationInFrames <= 0) {
+    return [];
+  }
+  const displayEndInFrames = displayOffsetInFrames + displayDurationInFrames;
+  const firstLoopIndex = Math.floor(displayOffsetInFrames / loopDurationInFrames);
+  const lastLoopIndex = Math.floor(displayEndInFrames / loopDurationInFrames);
+  const segments = [];
+  for (let loopIndex = firstLoopIndex;loopIndex <= lastLoopIndex; loopIndex++) {
+    const loopStartInFrames = loopIndex * loopDurationInFrames;
+    const segmentStart = Math.max(displayOffsetInFrames, loopStartInFrames);
+    const segmentEnd = Math.min(displayEndInFrames, loopStartInFrames + loopDurationInFrames);
+    const durationInFrames = segmentEnd - segmentStart;
+    if (durationInFrames <= 0) {
+      continue;
+    }
+    segments.push({
+      loopIndex,
+      absoluteOffsetInFrames: segmentStart,
+      loopOffsetInFrames: segmentStart - loopStartInFrames,
+      durationInFrames
+    });
+  }
+  return segments;
+};
+var getLoopDisplayWidth = ({
+  visualizationWidth,
+  loopDisplay
+}) => {
+  if (!shouldTileLoopDisplay(loopDisplay)) {
+    return visualizationWidth;
+  }
+  return visualizationWidth / loopDisplay.numberOfTimes;
+};
+
 // src/audio-waveform/slice-waveform-peaks.ts
 var sliceWaveformPeaks = ({
   durationInFrames,
@@ -403,8 +386,10 @@ var sliceWaveformPeaks = ({
   }
   const startTimeInSeconds = startFrom / fps;
   const durationInSeconds = durationInFrames / fps * playbackRate;
-  const startPeakIndex = Math.floor(startTimeInSeconds * waveformSampleRate);
-  const endPeakIndex = Math.ceil((startTimeInSeconds + durationInSeconds) * waveformSampleRate);
+  const start = startTimeInSeconds * waveformSampleRate;
+  const end = (startTimeInSeconds + durationInSeconds) * waveformSampleRate;
+  const startPeakIndex = Math.floor(start + (Number.isFinite(start) ? Number.EPSILON * Math.max(1, Math.abs(start)) * 4 : 0));
+  const endPeakIndex = Math.ceil(end - (Number.isFinite(end) ? Number.EPSILON * Math.max(1, Math.abs(end)) * 4 : 0));
   if (!Number.isFinite(startPeakIndex) || !Number.isFinite(endPeakIndex)) {
     return peaks.subarray(Math.max(0, startPeakIndex), Math.min(peaks.length, endPeakIndex));
   }
@@ -432,7 +417,7 @@ var sliceVisibleWaveformPeaks = ({
   startFrom,
   waveformSampleRate
 }) => {
-  if (!shouldTileLoopDisplay(loopDisplay) || loopDisplay.durationInFrames <= 0) {
+  if (!loopDisplay || loopDisplay.durationInFrames <= 0) {
     return sliceWaveformPeaks({
       durationInFrames: Math.min(displayDurationInFrames, Math.max(0, durationInFrames - displayOffsetInFrames)),
       fps,

package/package.json

@@ -3,7 +3,7 @@
 		"url": "https://github.com/remotion-dev/remotion/tree/main/packages/timeline-utils"
 	},
 	"name": "@remotion/timeline-utils",
-	"version": "4.0.526",
+	"version": "4.0.528",
 	"description": "Internal utilities for rendering Remotion timelines",
 	"main": "dist/index.js",
 	"scripts": {
@@ -22,11 +22,11 @@
 	},
 	"dependencies": {
 		"mediabunny": "1.56.1",
-		"remotion": "4.0.526"
+		"remotion": "4.0.528"
 	},
 	"devDependencies": {
 		"@mediabunny/server": "1.56.1",
-		"@remotion/eslint-config-internal": "4.0.526",
+		"@remotion/eslint-config-internal": "4.0.528",
 		"eslint": "9.19.0",
 		"@typescript/native-preview": "7.0.0-dev.20260217.1"
 	},

package/dist/image-thumbnail/draw-repeating-image-thumbnail.d.ts

@@ -1,10 +0,0 @@
-type ImageWithNaturalDimensions = CanvasImageSource & {
-    readonly naturalWidth: number;
-    readonly naturalHeight: number;
-};
-export declare const drawRepeatingImageThumbnail: ({ canvas, image, offsetInPixels, }: {
-    readonly canvas: HTMLCanvasElement | OffscreenCanvas;
-    readonly image: ImageWithNaturalDimensions;
-    readonly offsetInPixels?: number | undefined;
-}) => void;
-export {};

package/dist/image-thumbnail/draw-repeating-image-thumbnail.js

@@ -1,48 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.drawRepeatingImageThumbnail = void 0;
-const get_scaled_image_thumbnail_dimensions_1 = require("./get-scaled-image-thumbnail-dimensions");
-const createOffscreenCanvas = (width, height) => {
-    if (typeof document !== 'undefined') {
-        const canvas = document.createElement('canvas');
-        canvas.width = width;
-        canvas.height = height;
-        return canvas;
-    }
-    if (typeof OffscreenCanvas !== 'undefined') {
-        return new OffscreenCanvas(width, height);
-    }
-    throw new Error('No canvas implementation available');
-};
-const drawRepeatingImageThumbnail = ({ canvas, image, offsetInPixels = 0, }) => {
-    const ctx = canvas.getContext('2d');
-    if (!ctx) {
-        throw new Error('Failed to get canvas context');
-    }
-    const { width, height } = canvas;
-    if (width === 0 || height === 0) {
-        return;
-    }
-    const { scaledWidth, scaledHeight } = (0, get_scaled_image_thumbnail_dimensions_1.getScaledImageThumbnailDimensions)({
-        naturalWidth: image.naturalWidth,
-        naturalHeight: image.naturalHeight,
-        canvasHeight: height,
-    });
-    if (scaledWidth === 0 || scaledHeight === 0) {
-        return;
-    }
-    const offscreen = createOffscreenCanvas(scaledWidth, scaledHeight);
-    const offCtx = offscreen.getContext('2d');
-    if (!offCtx) {
-        throw new Error('Failed to get offscreen canvas context');
-    }
-    offCtx.drawImage(image, 0, 0, scaledWidth, scaledHeight);
-    const pattern = ctx.createPattern(offscreen, 'repeat-x');
-    if (!pattern) {
-        return;
-    }
-    pattern.setTransform(new DOMMatrix().translate(-offsetInPixels, 0));
-    ctx.fillStyle = pattern;
-    ctx.fillRect(0, 0, width, height);
-};
-exports.drawRepeatingImageThumbnail = drawRepeatingImageThumbnail;

package/dist/image-thumbnail/get-scaled-image-thumbnail-dimensions.d.ts

@@ -1,8 +0,0 @@
-export declare const getScaledImageThumbnailDimensions: ({ naturalWidth, naturalHeight, canvasHeight, }: {
-    readonly naturalWidth: number;
-    readonly naturalHeight: number;
-    readonly canvasHeight: number;
-}) => {
-    scaledWidth: number;
-    scaledHeight: number;
-};

package/dist/image-thumbnail/get-scaled-image-thumbnail-dimensions.js

@@ -1,17 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.getScaledImageThumbnailDimensions = void 0;
-const getScaledImageThumbnailDimensions = ({ naturalWidth, naturalHeight, canvasHeight, }) => {
-    if (naturalWidth === 0 || naturalHeight === 0 || canvasHeight === 0) {
-        return {
-            scaledWidth: 0,
-            scaledHeight: 0,
-        };
-    }
-    const scale = canvasHeight / naturalHeight;
-    return {
-        scaledWidth: naturalWidth * scale,
-        scaledHeight: canvasHeight,
-    };
-};
-exports.getScaledImageThumbnailDimensions = getScaledImageThumbnailDimensions;