@remotion/media 4.0.445 → 4.0.446

package/dist/audio/props.d.ts

@@ -9,6 +9,14 @@ export type FallbackHtml5AudioProps = {
 };
 export type AudioProps = {
     src: string;
+    /**
+     * When set, `<Audio>` applies timing via an inner `<Sequence layout="none">` that is hidden from the timeline (`showInTimeline={false}`) so the clip still appears once as media.
+     */
+    from?: number;
+    /**
+     * When set with `from`, bounds the clip in frames. Defaults to `Infinity` like `<Sequence>`.
+     */
+    durationInFrames?: number;
     trimBefore?: number;
     trimAfter?: number;
     volume?: VolumeProp;

package/dist/draw-with-object-fit.d.ts

@@ -0,0 +1,14 @@
+export type ObjectFitValue = 'fill' | 'contain' | 'cover' | 'none' | 'scale-down';
+/**
+ * Draws a source image onto a canvas context with the specified object-fit behavior.
+ * This implements object-fit at the canvas drawing level, which is more reliable
+ * than CSS object-fit on canvas elements.
+ */
+export declare const drawWithObjectFit: (ctx: CanvasRenderingContext2D | OffscreenCanvasRenderingContext2D, source: CanvasImageSource, options: {
+    sourceWidth: number;
+    sourceHeight: number;
+    destWidth: number;
+    destHeight: number;
+    fit: ObjectFitValue;
+}) => void;
+export declare const parseObjectFit: (value: string | undefined) => ObjectFitValue | null;

package/dist/esm/index.mjs

@@ -37,7 +37,7 @@ var __callDispose = (stack, error, hasError) => {
 };
 
 // src/audio/audio.tsx
-import { Internals as Internals19, useRemotionEnvironment as useRemotionEnvironment2 } from "remotion";
+import { Internals as Internals19, Sequence, useRemotionEnvironment as useRemotionEnvironment2 } from "remotion";
 
 // src/audio/audio-for-preview.tsx
 import { useContext as useContext3, useEffect as useEffect2, useMemo as useMemo2, useRef, useState as useState2 } from "react";
@@ -4469,29 +4469,40 @@ var audioSchema = {
   loop: { type: "boolean", default: false, description: "Loop" }
 };
 var AudioInner = (props) => {
-  const { name, stack, showInTimeline, controls, ...otherProps } = props;
+  const {
+    name,
+    stack,
+    showInTimeline,
+    controls,
+    from,
+    durationInFrames,
+    ...otherProps
+  } = props;
   const environment = useRemotionEnvironment2();
   if (typeof props.src !== "string") {
     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");
-  if (environment.isRendering) {
-    return /* @__PURE__ */ jsx3(AudioForRendering, {
+  return /* @__PURE__ */ jsx3(Sequence, {
+    layout: "none",
+    from: from ?? 0,
+    durationInFrames: durationInFrames ?? Infinity,
+    showInTimeline: false,
+    children: environment.isRendering ? /* @__PURE__ */ jsx3(AudioForRendering, {
       ...otherProps
-    });
-  }
-  return /* @__PURE__ */ jsx3(AudioForPreview, {
-    name,
-    ...otherProps,
-    stack: stack ?? null,
-    controls
+    }) : /* @__PURE__ */ jsx3(AudioForPreview, {
+      name,
+      ...otherProps,
+      stack: stack ?? null,
+      controls
+    })
   });
 };
 var Audio = Internals19.wrapInSchema(AudioInner, audioSchema);
 Internals19.addSequenceStackTraces(Audio);
 
 // src/video/video.tsx
-import { Internals as Internals23, useRemotionEnvironment as useRemotionEnvironment4 } from "remotion";
+import { Internals as Internals23, Sequence as Sequence2, useRemotionEnvironment as useRemotionEnvironment4 } from "remotion";
 
 // src/video/video-for-preview.tsx
 import {
@@ -5375,38 +5386,46 @@ var VideoInner = ({
   onError,
   credentials,
   controls,
-  objectFit
+  objectFit,
+  from,
+  durationInFrames
 }) => {
   const fallbackLogLevel = Internals23.useLogLevel();
-  return /* @__PURE__ */ jsx6(InnerVideo, {
-    audioStreamIndex: audioStreamIndex ?? 0,
-    className,
-    delayRenderRetries: delayRenderRetries ?? null,
-    delayRenderTimeoutInMilliseconds: delayRenderTimeoutInMilliseconds ?? null,
-    disallowFallbackToOffthreadVideo: disallowFallbackToOffthreadVideo ?? false,
-    fallbackOffthreadVideoProps: fallbackOffthreadVideoProps ?? {},
-    logLevel: logLevel ?? fallbackLogLevel,
-    loop: loop ?? false,
-    loopVolumeCurveBehavior: loopVolumeCurveBehavior ?? "repeat",
-    muted: muted ?? false,
-    name,
-    onVideoFrame,
-    playbackRate: playbackRate ?? 1,
-    showInTimeline: showInTimeline ?? true,
-    src,
-    style: style ?? {},
-    trimAfter,
-    trimBefore,
-    volume: volume ?? 1,
-    toneFrequency: toneFrequency ?? 1,
-    stack,
-    debugOverlay: debugOverlay ?? false,
-    debugAudioScheduling: debugAudioScheduling ?? false,
-    headless: headless ?? false,
-    onError,
-    credentials,
-    controls,
-    objectFit: objectFit ?? "contain"
+  return /* @__PURE__ */ jsx6(Sequence2, {
+    layout: "none",
+    from: from ?? 0,
+    durationInFrames: durationInFrames ?? Infinity,
+    showInTimeline: false,
+    children: /* @__PURE__ */ jsx6(InnerVideo, {
+      audioStreamIndex: audioStreamIndex ?? 0,
+      className,
+      delayRenderRetries: delayRenderRetries ?? null,
+      delayRenderTimeoutInMilliseconds: delayRenderTimeoutInMilliseconds ?? null,
+      disallowFallbackToOffthreadVideo: disallowFallbackToOffthreadVideo ?? false,
+      fallbackOffthreadVideoProps: fallbackOffthreadVideoProps ?? {},
+      logLevel: logLevel ?? fallbackLogLevel,
+      loop: loop ?? false,
+      loopVolumeCurveBehavior: loopVolumeCurveBehavior ?? "repeat",
+      muted: muted ?? false,
+      name,
+      onVideoFrame,
+      playbackRate: playbackRate ?? 1,
+      showInTimeline: showInTimeline ?? true,
+      src,
+      style: style ?? {},
+      trimAfter,
+      trimBefore,
+      volume: volume ?? 1,
+      toneFrequency: toneFrequency ?? 1,
+      stack,
+      debugOverlay: debugOverlay ?? false,
+      debugAudioScheduling: debugAudioScheduling ?? false,
+      headless: headless ?? false,
+      onError,
+      credentials,
+      controls,
+      objectFit: objectFit ?? "contain"
+    })
   });
 };
 var Video = Internals23.wrapInSchema(VideoInner, videoSchema);

package/dist/index.d.ts

@@ -39,7 +39,10 @@ export declare const experimental_Video: import("react").ComponentType<{
     onError: import("./on-error").MediaOnError | undefined;
     credentials: RequestCredentials | undefined;
     objectFit: import(".").VideoObjectFit;
-}>>;
+}> & {
+    from?: number | undefined;
+    durationInFrames?: number | undefined;
+}>;
 export { AudioForPreview } from './audio/audio-for-preview';
 export { AudioProps, FallbackHtml5AudioProps } from './audio/props';
 export { MediaErrorAction } from './on-error';

package/dist/video/props.d.ts

@@ -53,5 +53,14 @@ type OptionalVideoProps = {
     objectFit: VideoObjectFit;
 };
 export type InnerVideoProps = MandatoryVideoProps & OuterVideoProps & OptionalVideoProps;
-export type VideoProps = MandatoryVideoProps & Partial<OuterVideoProps> & Partial<OptionalVideoProps>;
+export type VideoProps = MandatoryVideoProps & Partial<OuterVideoProps> & Partial<OptionalVideoProps> & {
+    /**
+     * When set, `<Video>` applies timing via an inner `<Sequence layout="none">` that is hidden from the timeline (`showInTimeline={false}`) so the clip still appears once as media.
+     */
+    from?: number;
+    /**
+     * Bounds the clip in frames together with `from`. Defaults to `Infinity` like `<Sequence>`.
+     */
+    durationInFrames?: number;
+};
 export {};

package/dist/video/video.d.ts

@@ -31,4 +31,7 @@ export declare const Video: React.ComponentType<{
     onError: import("../on-error").MediaOnError | undefined;
     credentials: RequestCredentials | undefined;
     objectFit: import("./props").VideoObjectFit;
-}>>;
+}> & {
+    from?: number | undefined;
+    durationInFrames?: number | undefined;
+}>;

package/package.json

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

package/dist/calculate-playbacktime.d.ts

@@ -1,5 +0,0 @@
-export declare const calculatePlaybackTime: ({ audioSyncAnchor, currentTime, playbackRate, }: {
-    audioSyncAnchor: number;
-    currentTime: number;
-    playbackRate: number;
-}) => number;