@remotion/media 4.0.432 → 4.0.433

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

@@ -1,5 +1,5 @@
 import React from 'react';
-import type { LogLevel, LoopVolumeCurveBehavior, VolumeProp } from 'remotion';
+import type { LogLevel, LoopVolumeCurveBehavior, SequenceControls, VolumeProp } from 'remotion';
 import { type MediaOnError } from '../on-error';
 import type { FallbackHtml5AudioProps } from './props';
 type InnerAudioProps = {
@@ -28,5 +28,7 @@ type InnerAudioProps = {
     readonly debugAudioScheduling?: boolean;
     readonly onError?: MediaOnError;
 };
-export declare const AudioForPreview: React.FC<InnerAudioProps>;
+export declare const AudioForPreview: React.FC<InnerAudioProps & {
+    readonly controls: SequenceControls | undefined;
+}>;
 export {};

package/dist/audio/audio.d.ts

@@ -1,3 +1,3 @@
 import React from 'react';
 import type { AudioProps } from './props';
-export declare const Audio: React.FC<AudioProps>;
+export declare const Audio: React.ComponentType<AudioProps>;

package/dist/esm/index.mjs

@@ -428,6 +428,17 @@ function makePredecodingIterator(inner) {
     });
   };
   prefetch();
+  const _return = () => {
+    returned = true;
+    buffer.length = 0;
+    if (waiter) {
+      const w = waiter;
+      waiter = null;
+      w({ value: undefined, done: true });
+    }
+    inner.return(undefined);
+    return Promise.resolve({ value: undefined, done: true });
+  };
   const iterator = {
     next() {
       if (buffer.length > 0) {
@@ -447,17 +458,7 @@ function makePredecodingIterator(inner) {
         prefetch();
       });
     },
-    return() {
-      returned = true;
-      buffer.length = 0;
-      if (waiter) {
-        const w = waiter;
-        waiter = null;
-        w({ value: undefined, done: true });
-      }
-      inner.return(undefined);
-      return Promise.resolve({ value: undefined, done: true });
-    },
+    return: _return,
     throw(e) {
       returned = true;
       buffer.length = 0;
@@ -1879,7 +1880,7 @@ var useCommonEffects = ({
 };
 
 // src/use-media-in-timeline.ts
-import { useContext as useContext2, useEffect, useState } from "react";
+import { useContext as useContext2, useState, useEffect } from "react";
 import { Internals as Internals9, useCurrentFrame } from "remotion";
 var useMediaInTimeline = ({
   volume,
@@ -1941,7 +1942,7 @@ var useMediaInTimeline = ({
         displayName: finalDisplayName,
         rootId,
         showInTimeline: true,
-        nonce,
+        nonce: nonce.get(),
         loopDisplay,
         stack,
         from: 0,
@@ -1961,7 +1962,7 @@ var useMediaInTimeline = ({
       rootId,
       volume: volumes,
       showInTimeline: true,
-      nonce,
+      nonce: nonce.get(),
       startMediaFrom: 0 - startsAt + (trimBefore ?? 0),
       doesVolumeChange,
       loopDisplay: undefined,
@@ -2051,7 +2052,7 @@ var AudioForPreviewAssertedShowing = ({
   const [mediaPlayerReady, setMediaPlayerReady] = useState2(false);
   const [shouldFallbackToNativeAudio, setShouldFallbackToNativeAudio] = useState2(false);
   const [playing] = Timeline.usePlayingState();
-  const timelineContext = useContext3(Internals10.TimelineContext);
+  const timelineContext = Internals10.useTimelineContext();
   const globalPlaybackRate = timelineContext.playbackRate;
   const sharedAudioContext = useContext3(SharedAudioContext);
   const buffer = useBufferState();
@@ -2283,33 +2284,15 @@ var AudioForPreviewAssertedShowing = ({
   }
   return null;
 };
-var audioSchema = {
-  volume: {
-    type: "number",
-    min: 0,
-    max: 20,
-    step: 0.01,
-    default: 1,
-    description: "Volume"
-  },
-  playbackRate: {
-    type: "number",
-    min: 0.1,
-    step: 0.01,
-    default: 1,
-    description: "Playback Rate"
-  },
-  loop: { type: "boolean", default: false, description: "Loop" }
-};
 var AudioForPreview = ({
-  loop: loopProp = false,
+  loop = false,
   src,
   logLevel,
   muted,
   name,
-  volume: volumeProp,
+  volume,
   loopVolumeCurveBehavior,
-  playbackRate: playbackRateProp = 1,
+  playbackRate = 1,
   trimAfter,
   trimBefore,
   showInTimeline,
@@ -2319,19 +2302,9 @@ var AudioForPreview = ({
   audioStreamIndex,
   fallbackHtml5AudioProps,
   debugAudioScheduling,
-  onError
+  onError,
+  controls
 }) => {
-  const schemaInput = useMemo2(() => {
-    return {
-      volume: volumeProp,
-      playbackRate: playbackRateProp,
-      loop: loopProp
-    };
-  }, [volumeProp, playbackRateProp, loopProp]);
-  const {
-    controls,
-    values: { volume, playbackRate, loop }
-  } = Internals10.useSchema(audioSchema, schemaInput);
   const preloadedSrc = usePreload(src);
   const defaultLogLevel = Internals10.useLogLevel();
   const frame = useCurrentFrame2();
@@ -4438,8 +4411,26 @@ var AudioForRendering = ({
 // src/audio/audio.tsx
 import { jsx as jsx3 } from "react/jsx-runtime";
 var { validateMediaProps } = Internals19;
-var Audio = (props) => {
-  const { name, stack, showInTimeline, ...otherProps } = props;
+var audioSchema = {
+  volume: {
+    type: "number",
+    min: 0,
+    max: 20,
+    step: 0.01,
+    default: 1,
+    description: "Volume"
+  },
+  playbackRate: {
+    type: "number",
+    min: 0.1,
+    step: 0.01,
+    default: 1,
+    description: "Playback Rate"
+  },
+  loop: { type: "boolean", default: false, description: "Loop" }
+};
+var AudioInner = (props) => {
+  const { name, stack, showInTimeline, controls, ...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.`);
@@ -4453,9 +4444,11 @@ var Audio = (props) => {
   return /* @__PURE__ */ jsx3(AudioForPreview, {
     name,
     ...otherProps,
-    stack: stack ?? null
+    stack: stack ?? null,
+    controls
   });
 };
+var Audio = Internals19.wrapInSchema(AudioInner, audioSchema);
 Internals19.addSequenceStackTraces(Audio);
 
 // src/video/video.tsx
@@ -4527,7 +4520,7 @@ var VideoForPreviewAssertedShowing = ({
   const [mediaPlayerReady, setMediaPlayerReady] = useState4(false);
   const [shouldFallbackToNativeVideo, setShouldFallbackToNativeVideo] = useState4(false);
   const [playing] = Timeline2.usePlayingState();
-  const timelineContext = useContext5(Internals20.TimelineContext);
+  const timelineContext = Internals20.useTimelineContext();
   const globalPlaybackRate = timelineContext.playbackRate;
   const sharedAudioContext = useContext5(SharedAudioContext2);
   const buffer = useBufferState2();
@@ -4784,44 +4777,15 @@ var VideoForPreviewAssertedShowing = ({
     className: classNameValue
   });
 };
-var videoSchema = {
-  volume: {
-    type: "number",
-    min: 0,
-    max: 20,
-    step: 0.01,
-    default: 1,
-    description: "Volume"
-  },
-  playbackRate: {
-    type: "number",
-    min: 0.1,
-    step: 0.01,
-    default: 1,
-    description: "Playback Rate"
-  },
-  loop: { type: "boolean", default: false, description: "Loop" }
-};
 var VideoForPreview = (props) => {
-  const schemaInput = useMemo4(() => {
-    return {
-      volume: props.volume,
-      playbackRate: props.playbackRate,
-      loop: props.loop
-    };
-  }, [props.volume, props.playbackRate, props.loop]);
-  const {
-    controls,
-    values: { loop, playbackRate, volume }
-  } = Internals20.useSchema(videoSchema, schemaInput);
   const frame = useCurrentFrame4();
   const videoConfig = useVideoConfig3();
   const currentTime = frame / videoConfig.fps;
   const showShow = useMemo4(() => {
     return getTimeInSeconds({
       unloopedTimeInSeconds: currentTime,
-      playbackRate,
-      loop,
+      playbackRate: props.playbackRate,
+      loop: props.loop,
       trimBefore: props.trimBefore,
       trimAfter: props.trimAfter,
       mediaDurationInSeconds: Infinity,
@@ -4831,8 +4795,8 @@ var VideoForPreview = (props) => {
     }) !== null;
   }, [
     currentTime,
-    loop,
-    playbackRate,
+    props.loop,
+    props.playbackRate,
     props.src,
     videoConfig.fps,
     props.trimBefore,
@@ -4843,10 +4807,7 @@ var VideoForPreview = (props) => {
   }
   return /* @__PURE__ */ jsx4(VideoForPreviewAssertedShowing, {
     ...props,
-    volume: volume ?? 1,
-    playbackRate,
-    loop,
-    controls
+    controls: props.controls
   });
 };
 
@@ -5159,6 +5120,52 @@ var VideoForRendering = ({
 // src/video/video.tsx
 import { jsx as jsx6 } from "react/jsx-runtime";
 var { validateMediaTrimProps, resolveTrimProps, validateMediaProps: validateMediaProps2 } = Internals22;
+var videoSchema = {
+  volume: {
+    type: "number",
+    min: 0,
+    max: 20,
+    step: 0.01,
+    default: 1,
+    description: "Volume"
+  },
+  playbackRate: {
+    type: "number",
+    min: 0.1,
+    step: 0.01,
+    default: 1,
+    description: "Playback Rate"
+  },
+  loop: { type: "boolean", default: false, description: "Loop" },
+  "style.translate": {
+    type: "translate",
+    step: 1,
+    default: "0px 0px",
+    description: "Position"
+  },
+  "style.scale": {
+    type: "number",
+    min: 0.05,
+    max: 100,
+    step: 0.01,
+    default: 1,
+    description: "Scale"
+  },
+  "style.rotate": {
+    type: "rotation",
+    step: 1,
+    default: "0deg",
+    description: "Rotation"
+  },
+  "style.opacity": {
+    type: "number",
+    min: 0,
+    max: 1,
+    step: 0.01,
+    default: 1,
+    description: "Opacity"
+  }
+};
 var InnerVideo = ({
   src,
   audioStreamIndex,
@@ -5184,7 +5191,8 @@ var InnerVideo = ({
   debugOverlay,
   debugAudioScheduling,
   headless,
-  onError
+  onError,
+  controls
 }) => {
   const environment = useRemotionEnvironment4();
   if (typeof src !== "string") {
@@ -5251,10 +5259,11 @@ var InnerVideo = ({
     debugOverlay: debugOverlay ?? false,
     debugAudioScheduling: debugAudioScheduling ?? false,
     headless: headless ?? false,
-    onError
+    onError,
+    controls
   });
 };
-var Video = ({
+var VideoInner = ({
   src,
   audioStreamIndex,
   className,
@@ -5279,7 +5288,8 @@ var Video = ({
   debugOverlay,
   debugAudioScheduling,
   headless,
-  onError
+  onError,
+  controls
 }) => {
   const fallbackLogLevel = Internals22.useLogLevel();
   return /* @__PURE__ */ jsx6(InnerVideo, {
@@ -5307,9 +5317,11 @@ var Video = ({
     debugOverlay: debugOverlay ?? false,
     debugAudioScheduling: debugAudioScheduling ?? false,
     headless: headless ?? false,
-    onError
+    onError,
+    controls
   });
 };
+var Video = Internals22.wrapInSchema(VideoInner, videoSchema);
 Internals22.addSequenceStackTraces(Video);
 
 // src/index.ts

package/dist/index.d.ts

@@ -3,11 +3,41 @@ import { Video } from './video/video';
 /**
  * @deprecated Now just `Audio`
  */
-export declare const experimental_Audio: import("react").FC<import(".").AudioProps>;
+export declare const experimental_Audio: import("react").ComponentType<import(".").AudioProps>;
 /**
  * @deprecated Now just `Video`
  */
-export declare const experimental_Video: import("react").FC<import(".").VideoProps>;
+export declare const experimental_Video: import("react").ComponentType<{
+    src: string;
+} & Partial<{
+    trimBefore: number | undefined;
+    trimAfter: number | undefined;
+}> & Partial<{
+    className: string | undefined;
+    volume: import("remotion").VolumeProp;
+    loopVolumeCurveBehavior: import("remotion").LoopVolumeCurveBehavior;
+    name: string | undefined;
+    onVideoFrame: import("remotion").OnVideoFrame | undefined;
+    playbackRate: number;
+    muted: boolean;
+    delayRenderRetries: number | null;
+    delayRenderTimeoutInMilliseconds: number | null;
+    style: import("react").CSSProperties;
+    stack: string | undefined;
+    logLevel: "error" | "info" | "trace" | "verbose" | "warn";
+    loop: boolean;
+    audioStreamIndex: number;
+    disallowFallbackToOffthreadVideo: boolean;
+    fallbackOffthreadVideoProps: import(".").FallbackOffthreadVideoProps;
+    trimAfter: number | undefined;
+    trimBefore: number | undefined;
+    toneFrequency: number;
+    showInTimeline: boolean;
+    debugOverlay: boolean;
+    debugAudioScheduling: boolean;
+    headless: boolean;
+    onError: import("./on-error").MediaOnError | undefined;
+}>>;
 export { AudioForPreview } from './audio/audio-for-preview';
 export { AudioProps, FallbackHtml5AudioProps } from './audio/props';
 export { MediaErrorAction } from './on-error';

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

@@ -1,5 +1,5 @@
 import React from 'react';
-import type { LogLevel, LoopVolumeCurveBehavior, VolumeProp } from 'remotion';
+import type { LogLevel, LoopVolumeCurveBehavior, SequenceControls, VolumeProp } from 'remotion';
 import { type MediaOnError } from '../on-error';
 import type { FallbackOffthreadVideoProps } from './props';
 type VideoForPreviewProps = {
@@ -26,5 +26,7 @@ type VideoForPreviewProps = {
     readonly headless: boolean;
     readonly onError: MediaOnError | undefined;
 };
-export declare const VideoForPreview: React.FC<VideoForPreviewProps>;
+export declare const VideoForPreview: React.FC<VideoForPreviewProps & {
+    readonly controls: SequenceControls | undefined;
+}>;
 export {};

package/dist/video/video.d.ts

@@ -1,3 +1,32 @@
 import React from 'react';
-import type { VideoProps } from './props';
-export declare const Video: React.FC<VideoProps>;
+export declare const Video: React.ComponentType<{
+    src: string;
+} & Partial<{
+    trimBefore: number | undefined;
+    trimAfter: number | undefined;
+}> & Partial<{
+    className: string | undefined;
+    volume: import("remotion").VolumeProp;
+    loopVolumeCurveBehavior: import("remotion").LoopVolumeCurveBehavior;
+    name: string | undefined;
+    onVideoFrame: import("remotion").OnVideoFrame | undefined;
+    playbackRate: number;
+    muted: boolean;
+    delayRenderRetries: number | null;
+    delayRenderTimeoutInMilliseconds: number | null;
+    style: React.CSSProperties;
+    stack: string | undefined;
+    logLevel: "error" | "info" | "trace" | "verbose" | "warn";
+    loop: boolean;
+    audioStreamIndex: number;
+    disallowFallbackToOffthreadVideo: boolean;
+    fallbackOffthreadVideoProps: import("./props").FallbackOffthreadVideoProps;
+    trimAfter: number | undefined;
+    trimBefore: number | undefined;
+    toneFrequency: number;
+    showInTimeline: boolean;
+    debugOverlay: boolean;
+    debugAudioScheduling: boolean;
+    headless: boolean;
+    onError: import("../on-error").MediaOnError | undefined;
+}>>;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@remotion/media",
-	"version": "4.0.432",
+	"version": "4.0.433",
 	"main": "dist/index.js",
 	"types": "dist/index.d.ts",
 	"module": "dist/esm/index.mjs",
@@ -22,8 +22,8 @@
 		"make": "tsgo && bun --env-file=../.env.bundle bundle.ts"
 	},
 	"dependencies": {
-		"mediabunny": "1.35.1",
-		"remotion": "4.0.432",
+		"mediabunny": "1.37.0",
+		"remotion": "4.0.433",
 		"zod": "4.3.6"
 	},
 	"peerDependencies": {
@@ -31,14 +31,14 @@
 		"react-dom": ">=16.8.0"
 	},
 	"devDependencies": {
-		"@remotion/eslint-config-internal": "4.0.432",
+		"@remotion/eslint-config-internal": "4.0.433",
 		"@vitest/browser-webdriverio": "4.0.9",
 		"eslint": "9.19.0",
 		"react": "19.2.3",
 		"react-dom": "19.2.3",
 		"vitest": "4.0.9",
 		"webdriverio": "9.19.2",
-		"@typescript/native-preview": "7.0.0-dev.20260301.1"
+		"@typescript/native-preview": "7.0.0-dev.20260217.1"
 	},
 	"keywords": [],
 	"publishConfig": {