@remotion/media 4.0.491 → 4.0.493

package/dist/esm/index.mjs

@@ -4876,6 +4876,12 @@ var AudioForRendering = ({
 import { jsx as jsx3 } from "react/jsx-runtime";
 var { validateMediaProps } = Internals17;
 var audioSchema = {
+  src: {
+    type: "asset",
+    default: undefined,
+    description: "Source",
+    keyframable: false
+  },
   ...Internals17.baseSchema,
   volume: {
     type: "number",
@@ -4990,13 +4996,34 @@ var Audio = Interactive.withSchema({
 // src/video/video.tsx
 import React6, { useMemo as useMemo6, useState as useState6 } from "react";
 import {
-  Internals as Internals21,
+  Internals as Internals22,
   Interactive as Interactive2,
   Sequence as Sequence2,
   useRemotionEnvironment as useRemotionEnvironment4,
   useVideoConfig as useVideoConfig5
 } from "remotion";
 
+// src/video/get-video-sequence-duration.ts
+import { Internals as Internals18 } from "remotion";
+var getVideoSequenceDuration = ({
+  durationInFrames,
+  loop,
+  playbackRate,
+  trimAfter,
+  trimBefore
+}) => {
+  if (loop || trimAfter === undefined) {
+    return durationInFrames;
+  }
+  const trimmedDuration = Internals18.calculateMediaDuration({
+    trimAfter,
+    trimBefore,
+    playbackRate,
+    mediaDurationInFrames: Infinity
+  });
+  return Math.min(durationInFrames ?? Infinity, trimmedDuration);
+};
+
 // src/video/video-for-preview.tsx
 import {
   useCallback,
@@ -5009,7 +5036,7 @@ import {
 } from "react";
 import {
   Html5Video,
-  Internals as Internals19,
+  Internals as Internals20,
   useBufferState as useBufferState2,
   useCurrentFrame as useCurrentFrame3,
   useVideoConfig as useVideoConfig3
@@ -5052,7 +5079,7 @@ var getCachedVideoFrame = (src) => {
 };
 
 // src/video/warn-object-fit-css.ts
-import { Internals as Internals18 } from "remotion";
+import { Internals as Internals19 } from "remotion";
 var OBJECT_FIT_CLASS_PATTERN = /\bobject-(contain|cover|fill|none|scale-down)\b/;
 var warnedStyle = false;
 var warnedClassName = false;
@@ -5063,11 +5090,11 @@ var warnAboutObjectFitInStyleOrClassName = ({
 }) => {
   if (!warnedStyle && style?.objectFit) {
     warnedStyle = true;
-    Internals18.Log.warn({ logLevel, tag: "@remotion/media" }, "Use the `objectFit` prop instead of the `style` prop.");
+    Internals19.Log.warn({ logLevel, tag: "@remotion/media" }, "Use the `objectFit` prop instead of the `style` prop.");
   }
   if (!warnedClassName && className && OBJECT_FIT_CLASS_PATTERN.test(className)) {
     warnedClassName = true;
-    Internals18.Log.warn({ logLevel, tag: "@remotion/media" }, "Use the `objectFit` prop instead of `object-*` CSS class names.");
+    Internals19.Log.warn({ logLevel, tag: "@remotion/media" }, "Use the `objectFit` prop instead of `object-*` CSS class names.");
   }
 };
 
@@ -5085,7 +5112,7 @@ var {
   usePreload: usePreload2,
   SequenceContext: SequenceContext2,
   useEffectChainState
-} = Internals19;
+} = Internals20;
 var VideoForPreviewAssertedShowing = ({
   src: unpreloadedSrc,
   style,
@@ -5128,7 +5155,7 @@ var VideoForPreviewAssertedShowing = ({
   const [mediaPlayerReady, setMediaPlayerReady] = useState4(false);
   const [shouldFallbackToNativeVideo, setShouldFallbackToNativeVideo] = useState4(false);
   const [playing] = Timeline2.usePlayingState();
-  const { playbackRate: globalPlaybackRate } = Internals19.usePlaybackRate();
+  const { playbackRate: globalPlaybackRate } = Internals20.usePlaybackRate();
   const sharedAudioContext = useContext4(SharedAudioContext2);
   const buffer = useBufferState2();
   const canvasRefCallback = useCallback((canvas) => {
@@ -5165,12 +5192,12 @@ var VideoForPreviewAssertedShowing = ({
   const currentTimeRef = useRef2(currentTime);
   currentTimeRef.current = currentTime;
   const preloadedSrc = usePreload2(src);
-  const buffering = useContext4(Internals19.BufferingContextReact);
+  const buffering = useContext4(Internals20.BufferingContextReact);
   if (!buffering) {
     throw new Error("useMediaPlayback must be used inside a <BufferingContext>");
   }
   const effectiveMuted = muted || playerMuted || userPreferredVolume <= 0;
-  const isPlayerBuffering = Internals19.useIsPlayerBuffering(buffering);
+  const isPlayerBuffering = Internals20.useIsPlayerBuffering(buffering);
   const initialPlaying = useRef2(playing && !isPlayerBuffering);
   const initialIsPremounting = useRef2(isPremounting);
   const initialIsPostmounting = useRef2(isPostmounting);
@@ -5268,7 +5295,7 @@ var VideoForPreviewAssertedShowing = ({
           if (action === "fail") {
             throw errorToUse;
           }
-          Internals19.Log.warn({ logLevel, tag: "@remotion/media" }, fallbackMessage);
+          Internals20.Log.warn({ logLevel, tag: "@remotion/media" }, fallbackMessage);
           setShouldFallbackToNativeVideo(true);
         };
         if (result.type === "unknown-container-format") {
@@ -5310,7 +5337,7 @@ var VideoForPreviewAssertedShowing = ({
         if (action === "fail") {
           throw errorToUse;
         }
-        Internals19.Log.error({ logLevel, tag: "@remotion/media" }, "[VideoForPreview] Failed to initialize MediaPlayer", errorToUse);
+        Internals20.Log.error({ logLevel, tag: "@remotion/media" }, "[VideoForPreview] Failed to initialize MediaPlayer", errorToUse);
         setShouldFallbackToNativeVideo(true);
       });
     } catch (error) {
@@ -5324,12 +5351,12 @@ var VideoForPreviewAssertedShowing = ({
       if (action === "fail") {
         throw errorToUse;
       }
-      Internals19.Log.error({ logLevel, tag: "@remotion/media" }, "[VideoForPreview] MediaPlayer initialization failed", errorToUse);
+      Internals20.Log.error({ logLevel, tag: "@remotion/media" }, "[VideoForPreview] MediaPlayer initialization failed", errorToUse);
       setShouldFallbackToNativeVideo(true);
     }
     return () => {
       if (mediaPlayerRef.current) {
-        Internals19.Log.trace({ logLevel, tag: "@remotion/media" }, `[VideoForPreview] Disposing MediaPlayer`);
+        Internals20.Log.trace({ logLevel, tag: "@remotion/media" }, `[VideoForPreview] Disposing MediaPlayer`);
         mediaPlayerRef.current.dispose();
         mediaPlayerRef.current = null;
       }
@@ -5353,7 +5380,7 @@ var VideoForPreviewAssertedShowing = ({
   ]);
   warnAboutObjectFitInStyleOrClassName({ style, className, logLevel });
   const classNameValue = useMemo4(() => {
-    return [Internals19.OBJECTFIT_CONTAIN_CLASS_NAME, className].filter(Internals19.truthy).join(" ");
+    return [Internals20.OBJECTFIT_CONTAIN_CLASS_NAME, className].filter(Internals20.truthy).join(" ");
   }, [className]);
   useCommonEffects({
     mediaPlayerRef,
@@ -5477,7 +5504,7 @@ import {
   useState as useState5
 } from "react";
 import {
-  Internals as Internals20,
+  Internals as Internals21,
   Loop,
   random as random2,
   useCurrentFrame as useCurrentFrame4,
@@ -5518,11 +5545,11 @@ var VideoForRendering = ({
     throw new TypeError("No `src` was passed to <Video>.");
   }
   const frame = useCurrentFrame4();
-  const absoluteFrame = Internals20.useTimelinePosition();
+  const absoluteFrame = Internals21.useTimelinePosition();
   const { fps } = useVideoConfig4();
-  const { registerRenderAsset, unregisterRenderAsset } = useContext5(Internals20.RenderAssetManager);
-  const startsAt = Internals20.useMediaStartsAt();
-  const sequenceContext = useContext5(Internals20.SequenceContext);
+  const { registerRenderAsset, unregisterRenderAsset } = useContext5(Internals21.RenderAssetManager);
+  const startsAt = Internals21.useMediaStartsAt();
+  const sequenceContext = useContext5(Internals21.SequenceContext);
   const id = useMemo5(() => `media-video-${random2(src)}-${sequenceContext?.cumulatedFrom}-${sequenceContext?.relativeFrom}-${sequenceContext?.durationInFrames}`, [
     src,
     sequenceContext?.cumulatedFrom,
@@ -5534,10 +5561,10 @@ var VideoForRendering = ({
   const canvasRef = useRef3(null);
   const [replaceWithOffthreadVideo, setReplaceWithOffthreadVideo] = useState5(false);
   const [initialRequestInit] = useState5(requestInit);
-  const audioEnabled = Internals20.useAudioEnabled();
-  const videoEnabled = Internals20.useVideoEnabled();
+  const audioEnabled = Internals21.useAudioEnabled();
+  const videoEnabled = Internals21.useVideoEnabled();
   const maxCacheSize = useMaxMediaCacheSize(logLevel);
-  const effectChainState = Internals20.useEffectChainState();
+  const effectChainState = Internals21.useEffectChainState();
   const [error, setError] = useState5(null);
   if (error) {
     throw error;
@@ -5602,7 +5629,7 @@ var VideoForRendering = ({
           return;
         }
         if (window.remotion_isMainTab) {
-          Internals20.Log.warn({ logLevel, tag: "@remotion/media" }, fallbackMessage);
+          Internals21.Log.warn({ logLevel, tag: "@remotion/media" }, fallbackMessage);
         }
         setReplaceWithOffthreadVideo({
           durationInSeconds: mediaDurationInSeconds
@@ -5646,7 +5673,7 @@ var VideoForRendering = ({
           context.canvas.style.aspectRatio = `${context.canvas.width} / ${context.canvas.height}`;
           context.drawImage(imageBitmap, 0, 0);
           if (effects.length > 0) {
-            const completed = await Internals20.runEffectChain({
+            const completed = await Internals21.runEffectChain({
               state: effectChainState.get(imageBitmap.width, imageBitmap.height),
               source: context.canvas,
               effects,
@@ -5677,12 +5704,12 @@ var VideoForRendering = ({
         frame,
         startsAt
       });
-      const volume = Internals20.evaluateVolume({
+      const volume = Internals21.evaluateVolume({
         volume: volumeProp,
         frame: volumePropsFrame,
         mediaVolume: 1
       });
-      Internals20.warnAboutTooHighVolume(volume);
+      Internals21.warnAboutTooHighVolume(volume);
       if (audio && volume > 0) {
         applyVolume(audio.data, volume);
         registerRenderAsset({
@@ -5743,7 +5770,7 @@ var VideoForRendering = ({
   ]);
   warnAboutObjectFitInStyleOrClassName({ style, className, logLevel });
   const classNameValue = useMemo5(() => {
-    return [Internals20.OBJECTFIT_CONTAIN_CLASS_NAME, className].filter(Internals20.truthy).join(" ");
+    return [Internals21.OBJECTFIT_CONTAIN_CLASS_NAME, className].filter(Internals21.truthy).join(" ");
   }, [className]);
   const styleWithObjectFit = useMemo5(() => {
     return {
@@ -5752,7 +5779,7 @@ var VideoForRendering = ({
     };
   }, [objectFitProp, style]);
   if (replaceWithOffthreadVideo) {
-    const fallback = /* @__PURE__ */ jsx5(Internals20.InnerOffthreadVideo, {
+    const fallback = /* @__PURE__ */ jsx5(Internals21.InnerOffthreadVideo, {
       ...props,
       src,
       playbackRate: playbackRate ?? 1,
@@ -5794,7 +5821,7 @@ var VideoForRendering = ({
       }
       return /* @__PURE__ */ jsx5(Loop, {
         layout: "none",
-        durationInFrames: Internals20.calculateMediaDuration({
+        durationInFrames: Internals21.calculateMediaDuration({
           trimAfter: trimAfterValue,
           mediaDurationInFrames: replaceWithOffthreadVideo.durationInSeconds * fps,
           playbackRate,
@@ -5818,9 +5845,15 @@ var VideoForRendering = ({
 
 // src/video/video.tsx
 import { jsx as jsx6 } from "react/jsx-runtime";
-var { validateMediaTrimProps, resolveTrimProps, validateMediaProps: validateMediaProps2 } = Internals21;
+var { validateMediaTrimProps, resolveTrimProps, validateMediaProps: validateMediaProps2 } = Internals22;
 var videoSchema = {
-  ...Internals21.baseSchema,
+  src: {
+    type: "asset",
+    default: undefined,
+    description: "Source",
+    keyframable: false
+  },
+  ...Internals22.baseSchema,
   volume: {
     type: "number",
     min: 0,
@@ -5839,8 +5872,9 @@ var videoSchema = {
     hiddenFromList: false,
     keyframable: false
   },
+  muted: { type: "boolean", default: false, description: "Muted" },
   loop: { type: "boolean", default: false, description: "Loop" },
-  ...Internals21.transformSchema
+  ...Internals22.transformSchema
 };
 var InnerVideo = ({
   src,
@@ -5992,12 +6026,19 @@ var VideoInner = ({
   hidden,
   ...props
 }) => {
-  const fallbackLogLevel = Internals21.useLogLevel();
-  const [mediaVolume] = Internals21.useMediaVolumeState();
-  const mediaStartsAt = Internals21.useMediaStartsAt();
+  const fallbackLogLevel = Internals22.useLogLevel();
+  const [mediaVolume] = Internals22.useMediaVolumeState();
+  const mediaStartsAt = Internals22.useMediaStartsAt();
   const videoConfig = useVideoConfig5();
   const sequenceDurationInFrames = Math.min(durationInFrames ?? Infinity, Math.max(0, videoConfig.durationInFrames - (from ?? 0)));
-  const basicInfo = Internals21.useBasicMediaInTimeline({
+  const videoSequenceDuration = getVideoSequenceDuration({
+    durationInFrames,
+    loop: loop ?? false,
+    playbackRate: playbackRate ?? 1,
+    trimAfter,
+    trimBefore
+  });
+  const basicInfo = Internals22.useBasicMediaInTimeline({
     src,
     volume,
     playbackRate: playbackRate ?? 1,
@@ -6032,11 +6073,11 @@ var VideoInner = ({
     type: "video",
     data: basicInfo
   }), [basicInfo]);
-  const memoizedEffects = Internals21.useMemoizedEffects({
+  const memoizedEffects = Internals22.useMemoizedEffects({
     effects: effects ?? [],
     overrideId: controls?.overrideId ?? null
   });
-  const memoizedEffectDefinitions = Internals21.useMemoizedEffectDefinitions(effects ?? []);
+  const memoizedEffectDefinitions = Internals22.useMemoizedEffectDefinitions(effects ?? []);
   const refForOutline = React6.useRef(null);
   if (sequenceDurationInFrames === 0) {
     return null;
@@ -6044,7 +6085,7 @@ var VideoInner = ({
   return /* @__PURE__ */ jsx6(Sequence2, {
     layout: "none",
     from: from ?? 0,
-    durationInFrames: basicInfo.duration,
+    durationInFrames: videoSequenceDuration,
     freeze,
     _remotionInternalStack: stack,
     _remotionInternalIsMedia: isMedia,

package/dist/video/get-video-sequence-duration.d.ts

@@ -0,0 +1,7 @@
+export declare const getVideoSequenceDuration: ({ durationInFrames, loop, playbackRate, trimAfter, trimBefore, }: {
+    readonly durationInFrames: number | undefined;
+    readonly loop: boolean;
+    readonly playbackRate: number;
+    readonly trimAfter: number | undefined;
+    readonly trimBefore: number | undefined;
+}) => number | undefined;

package/package.json

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