@remotion/player 4.0.374 → 4.0.376

package/dist/cjs/Player.js

@@ -154,7 +154,7 @@ const PlayerFn = ({ durationInFrames, compositionHeight, compositionWidth, fps,
             mode: 'prevent-media-session',
         });
     }, [passedBrowserMediaControlsBehavior]);
-    return ((0, jsx_runtime_1.jsx)(remotion_1.Internals.IsPlayerContextProvider, { children: (0, jsx_runtime_1.jsx)(SharedPlayerContext_js_1.SharedPlayerContexts, { timelineContext: timelineContextValue, component: component, compositionHeight: compositionHeight, compositionWidth: compositionWidth, durationInFrames: durationInFrames, fps: fps, numberOfSharedAudioTags: numberOfSharedAudioTags, initiallyMuted: initiallyMuted, logLevel: logLevel, audioLatencyHint: audioLatencyHint, volumePersistenceKey: volumePersistenceKey, children: (0, jsx_runtime_1.jsx)(remotion_1.Internals.SetTimelineContext.Provider, { value: setTimelineContextValue, children: (0, jsx_runtime_1.jsx)(EmitterProvider_js_1.PlayerEmitterProvider, { currentPlaybackRate: currentPlaybackRate, children: (0, jsx_runtime_1.jsx)(PlayerUI_js_1.default, { ref: rootRef, posterFillMode: posterFillMode, renderLoading: renderLoading, autoPlay: Boolean(autoPlay), loop: Boolean(loop), controls: Boolean(controls), errorFallback: errorFallback, style: style, inputProps: actualInputProps, allowFullscreen: Boolean(allowFullscreen), moveToBeginningWhenEnded: Boolean(moveToBeginningWhenEnded), clickToPlay: typeof clickToPlay === 'boolean'
+    return ((0, jsx_runtime_1.jsx)(remotion_1.Internals.IsPlayerContextProvider, { children: (0, jsx_runtime_1.jsx)(SharedPlayerContext_js_1.SharedPlayerContexts, { timelineContext: timelineContextValue, component: component, compositionHeight: compositionHeight, compositionWidth: compositionWidth, durationInFrames: durationInFrames, fps: fps, numberOfSharedAudioTags: numberOfSharedAudioTags, initiallyMuted: initiallyMuted, logLevel: logLevel, audioLatencyHint: audioLatencyHint, volumePersistenceKey: volumePersistenceKey, inputProps: actualInputProps, children: (0, jsx_runtime_1.jsx)(remotion_1.Internals.SetTimelineContext.Provider, { value: setTimelineContextValue, children: (0, jsx_runtime_1.jsx)(EmitterProvider_js_1.PlayerEmitterProvider, { currentPlaybackRate: currentPlaybackRate, children: (0, jsx_runtime_1.jsx)(PlayerUI_js_1.default, { ref: rootRef, posterFillMode: posterFillMode, renderLoading: renderLoading, autoPlay: Boolean(autoPlay), loop: Boolean(loop), controls: Boolean(controls), errorFallback: errorFallback, style: style, inputProps: actualInputProps, allowFullscreen: Boolean(allowFullscreen), moveToBeginningWhenEnded: Boolean(moveToBeginningWhenEnded), clickToPlay: typeof clickToPlay === 'boolean'
                             ? clickToPlay
                             : Boolean(controls), showVolumeControls: Boolean(showVolumeControls), doubleClickToFullscreen: Boolean(doubleClickToFullscreen), spaceKeyToPlayOrPause: Boolean(spaceKeyToPlayOrPause), playbackRate: currentPlaybackRate, className: className !== null && className !== void 0 ? className : undefined, showPosterWhenUnplayed: Boolean(showPosterWhenUnplayed), showPosterWhenEnded: Boolean(showPosterWhenEnded), showPosterWhenPaused: Boolean(showPosterWhenPaused), showPosterWhenBuffering: Boolean(showPosterWhenBuffering), showPosterWhenBufferingAndPaused: Boolean(showPosterWhenBufferingAndPaused), renderPoster: renderPoster, inFrame: inFrame !== null && inFrame !== void 0 ? inFrame : null, outFrame: outFrame !== null && outFrame !== void 0 ? outFrame : null, initiallyShowControls: initiallyShowControls !== null && initiallyShowControls !== void 0 ? initiallyShowControls : true, renderFullscreen: renderFullscreenButton !== null && renderFullscreenButton !== void 0 ? renderFullscreenButton : null, renderPlayPauseButton: renderPlayPauseButton !== null && renderPlayPauseButton !== void 0 ? renderPlayPauseButton : null, renderMuteButton: renderMuteButton !== null && renderMuteButton !== void 0 ? renderMuteButton : null, renderVolumeSlider: renderVolumeSlider !== null && renderVolumeSlider !== void 0 ? renderVolumeSlider : null, alwaysShowControls: alwaysShowControls, showPlaybackRateControl: showPlaybackRateControl, bufferStateDelayInMilliseconds: bufferStateDelayInMilliseconds !== null && bufferStateDelayInMilliseconds !== void 0 ? bufferStateDelayInMilliseconds : 300, hideControlsWhenPointerDoesntMove: hideControlsWhenPointerDoesntMove, overflowVisible: overflowVisible, browserMediaControlsBehavior: browserMediaControlsBehavior, overrideInternalClassName: overrideInternalClassName !== null && overrideInternalClassName !== void 0 ? overrideInternalClassName : undefined, noSuspense: Boolean(noSuspense) }) }) }) }) }));
 };

package/dist/cjs/SharedPlayerContext.d.ts

@@ -15,4 +15,5 @@ export declare const SharedPlayerContexts: React.FC<{
     readonly logLevel: LogLevel;
     readonly audioLatencyHint: AudioContextLatencyCategory;
     readonly volumePersistenceKey?: string;
+    readonly inputProps: Record<string, unknown>;
 }>;

package/dist/cjs/SharedPlayerContext.js

@@ -6,7 +6,7 @@ const react_1 = require("react");
 const remotion_1 = require("remotion");
 const volume_persistance_js_1 = require("./volume-persistance.js");
 exports.PLAYER_COMP_ID = 'player-comp';
-const SharedPlayerContexts = ({ children, timelineContext, fps, compositionHeight, compositionWidth, durationInFrames, component, numberOfSharedAudioTags, initiallyMuted, logLevel, audioLatencyHint, volumePersistenceKey, }) => {
+const SharedPlayerContexts = ({ children, timelineContext, fps, compositionHeight, compositionWidth, durationInFrames, component, numberOfSharedAudioTags, initiallyMuted, logLevel, audioLatencyHint, volumePersistenceKey, inputProps, }) => {
     const compositionManagerContext = (0, react_1.useMemo)(() => {
         const context = {
             compositions: [
@@ -25,11 +25,29 @@ const SharedPlayerContexts = ({ children, timelineContext, fps, compositionHeigh
                 },
             ],
             folders: [],
-            currentCompositionMetadata: null,
+            currentCompositionMetadata: {
+                defaultCodec: null,
+                defaultOutName: null,
+                defaultPixelFormat: null,
+                defaultProResProfile: null,
+                defaultVideoImageFormat: null,
+                durationInFrames,
+                fps,
+                height: compositionHeight,
+                width: compositionWidth,
+                props: inputProps,
+            },
             canvasContent: { type: 'composition', compositionId: 'player-comp' },
         };
         return context;
-    }, [component, durationInFrames, compositionHeight, compositionWidth, fps]);
+    }, [
+        component,
+        durationInFrames,
+        compositionHeight,
+        compositionWidth,
+        fps,
+        inputProps,
+    ]);
     const [mediaMuted, setMediaMuted] = (0, react_1.useState)(() => initiallyMuted);
     const [mediaVolume, setMediaVolume] = (0, react_1.useState)(() => (0, volume_persistance_js_1.getPreferredVolume)(volumePersistenceKey !== null && volumePersistenceKey !== void 0 ? volumePersistenceKey : null));
     const mediaVolumeContextValue = (0, react_1.useMemo)(() => {
@@ -63,6 +81,6 @@ const SharedPlayerContexts = ({ children, timelineContext, fps, compositionHeigh
             isReadOnlyStudio: false,
         };
     }, []);
-    return ((0, jsx_runtime_1.jsx)(remotion_1.Internals.RemotionEnvironmentContext.Provider, { value: env, children: (0, jsx_runtime_1.jsx)(remotion_1.Internals.LogLevelContext.Provider, { value: logLevelContext, children: (0, jsx_runtime_1.jsx)(remotion_1.Internals.CanUseRemotionHooksProvider, { children: (0, jsx_runtime_1.jsx)(remotion_1.Internals.TimelineContext.Provider, { value: timelineContext, children: (0, jsx_runtime_1.jsx)(remotion_1.Internals.CompositionManager.Provider, { value: compositionManagerContext, children: (0, jsx_runtime_1.jsx)(remotion_1.Internals.ResolveCompositionConfig, { children: (0, jsx_runtime_1.jsx)(remotion_1.Internals.PrefetchProvider, { children: (0, jsx_runtime_1.jsx)(remotion_1.Internals.DurationsContextProvider, { children: (0, jsx_runtime_1.jsx)(remotion_1.Internals.MediaVolumeContext.Provider, { value: mediaVolumeContextValue, children: (0, jsx_runtime_1.jsx)(remotion_1.Internals.SetMediaVolumeContext.Provider, { value: setMediaVolumeContextValue, children: (0, jsx_runtime_1.jsx)(remotion_1.Internals.SharedAudioContextProvider, { numberOfAudioTags: numberOfSharedAudioTags, audioLatencyHint: audioLatencyHint, children: (0, jsx_runtime_1.jsx)(remotion_1.Internals.BufferingProvider, { children: children }) }) }) }) }) }) }) }) }) }) }) }));
+    return ((0, jsx_runtime_1.jsx)(remotion_1.Internals.RemotionEnvironmentContext.Provider, { value: env, children: (0, jsx_runtime_1.jsx)(remotion_1.Internals.LogLevelContext.Provider, { value: logLevelContext, children: (0, jsx_runtime_1.jsx)(remotion_1.Internals.CanUseRemotionHooksProvider, { children: (0, jsx_runtime_1.jsx)(remotion_1.Internals.TimelineContext.Provider, { value: timelineContext, children: (0, jsx_runtime_1.jsx)(remotion_1.Internals.CompositionManager.Provider, { value: compositionManagerContext, children: (0, jsx_runtime_1.jsx)(remotion_1.Internals.PrefetchProvider, { children: (0, jsx_runtime_1.jsx)(remotion_1.Internals.DurationsContextProvider, { children: (0, jsx_runtime_1.jsx)(remotion_1.Internals.MediaVolumeContext.Provider, { value: mediaVolumeContextValue, children: (0, jsx_runtime_1.jsx)(remotion_1.Internals.SetMediaVolumeContext.Provider, { value: setMediaVolumeContextValue, children: (0, jsx_runtime_1.jsx)(remotion_1.Internals.SharedAudioContextProvider, { numberOfAudioTags: numberOfSharedAudioTags, audioLatencyHint: audioLatencyHint, children: (0, jsx_runtime_1.jsx)(remotion_1.Internals.BufferingProvider, { children: children }) }) }) }) }) }) }) }) }) }) }));
 };
 exports.SharedPlayerContexts = SharedPlayerContexts;

package/dist/cjs/Thumbnail.js

@@ -48,7 +48,7 @@ const ThumbnailFn = ({ frameToDisplay, style, inputProps, compositionHeight, com
     const passedInputProps = (0, react_1.useMemo)(() => {
         return inputProps !== null && inputProps !== void 0 ? inputProps : {};
     }, [inputProps]);
-    return ((0, jsx_runtime_1.jsx)(remotion_1.Internals.IsPlayerContextProvider, { children: (0, jsx_runtime_1.jsx)(SharedPlayerContext_js_1.SharedPlayerContexts, { timelineContext: timelineState, component: Component, compositionHeight: compositionHeight, compositionWidth: compositionWidth, durationInFrames: durationInFrames, fps: fps, numberOfSharedAudioTags: 0, initiallyMuted: true, logLevel: logLevel, audioLatencyHint: "playback", children: (0, jsx_runtime_1.jsx)(emitter_context_js_1.ThumbnailEmitterContext.Provider, { value: emitter, children: (0, jsx_runtime_1.jsx)(ThumbnailUI_js_1.default, { ref: rootRef, className: className, errorFallback: errorFallback, inputProps: passedInputProps, renderLoading: renderLoading, style: style, overflowVisible: overflowVisible, overrideInternalClassName: overrideInternalClassName, noSuspense: Boolean(noSuspense) }) }) }) }));
+    return ((0, jsx_runtime_1.jsx)(remotion_1.Internals.IsPlayerContextProvider, { children: (0, jsx_runtime_1.jsx)(SharedPlayerContext_js_1.SharedPlayerContexts, { timelineContext: timelineState, component: Component, compositionHeight: compositionHeight, compositionWidth: compositionWidth, durationInFrames: durationInFrames, fps: fps, numberOfSharedAudioTags: 0, initiallyMuted: true, logLevel: logLevel, audioLatencyHint: "playback", inputProps: passedInputProps, children: (0, jsx_runtime_1.jsx)(emitter_context_js_1.ThumbnailEmitterContext.Provider, { value: emitter, children: (0, jsx_runtime_1.jsx)(ThumbnailUI_js_1.default, { ref: rootRef, className: className, errorFallback: errorFallback, inputProps: passedInputProps, renderLoading: renderLoading, style: style, overflowVisible: overflowVisible, overrideInternalClassName: overrideInternalClassName, noSuspense: Boolean(noSuspense) }) }) }) }));
 };
 const forward = react_1.forwardRef;
 /*

package/dist/esm/index.mjs

@@ -2889,7 +2889,8 @@ var SharedPlayerContexts = ({
   initiallyMuted,
   logLevel,
   audioLatencyHint,
-  volumePersistenceKey
+  volumePersistenceKey,
+  inputProps
 }) => {
   const compositionManagerContext = useMemo13(() => {
     const context = {
@@ -2909,11 +2910,29 @@ var SharedPlayerContexts = ({
         }
       ],
       folders: [],
-      currentCompositionMetadata: null,
+      currentCompositionMetadata: {
+        defaultCodec: null,
+        defaultOutName: null,
+        defaultPixelFormat: null,
+        defaultProResProfile: null,
+        defaultVideoImageFormat: null,
+        durationInFrames,
+        fps,
+        height: compositionHeight,
+        width: compositionWidth,
+        props: inputProps
+      },
       canvasContent: { type: "composition", compositionId: "player-comp" }
     };
     return context;
-  }, [component, durationInFrames, compositionHeight, compositionWidth, fps]);
+  }, [
+    component,
+    durationInFrames,
+    compositionHeight,
+    compositionWidth,
+    fps,
+    inputProps
+  ]);
   const [mediaMuted, setMediaMuted] = useState12(() => initiallyMuted);
   const [mediaVolume, setMediaVolume] = useState12(() => getPreferredVolume(volumePersistenceKey ?? null));
   const mediaVolumeContextValue = useMemo13(() => {
@@ -2956,19 +2975,17 @@ var SharedPlayerContexts = ({
           value: timelineContext,
           children: /* @__PURE__ */ jsx13(Internals13.CompositionManager.Provider, {
             value: compositionManagerContext,
-            children: /* @__PURE__ */ jsx13(Internals13.ResolveCompositionConfig, {
-              children: /* @__PURE__ */ jsx13(Internals13.PrefetchProvider, {
-                children: /* @__PURE__ */ jsx13(Internals13.DurationsContextProvider, {
-                  children: /* @__PURE__ */ jsx13(Internals13.MediaVolumeContext.Provider, {
-                    value: mediaVolumeContextValue,
-                    children: /* @__PURE__ */ jsx13(Internals13.SetMediaVolumeContext.Provider, {
-                      value: setMediaVolumeContextValue,
-                      children: /* @__PURE__ */ jsx13(Internals13.SharedAudioContextProvider, {
-                        numberOfAudioTags: numberOfSharedAudioTags,
-                        audioLatencyHint,
-                        children: /* @__PURE__ */ jsx13(Internals13.BufferingProvider, {
-                          children
-                        })
+            children: /* @__PURE__ */ jsx13(Internals13.PrefetchProvider, {
+              children: /* @__PURE__ */ jsx13(Internals13.DurationsContextProvider, {
+                children: /* @__PURE__ */ jsx13(Internals13.MediaVolumeContext.Provider, {
+                  value: mediaVolumeContextValue,
+                  children: /* @__PURE__ */ jsx13(Internals13.SetMediaVolumeContext.Provider, {
+                    value: setMediaVolumeContextValue,
+                    children: /* @__PURE__ */ jsx13(Internals13.SharedAudioContextProvider, {
+                      numberOfAudioTags: numberOfSharedAudioTags,
+                      audioLatencyHint,
+                      children: /* @__PURE__ */ jsx13(Internals13.BufferingProvider, {
+                        children
                       })
                     })
                   })
@@ -3283,6 +3300,7 @@ var PlayerFn = ({
       logLevel,
       audioLatencyHint,
       volumePersistenceKey,
+      inputProps: actualInputProps,
       children: /* @__PURE__ */ jsx14(Internals15.SetTimelineContext.Provider, {
         value: setTimelineContextValue,
         children: /* @__PURE__ */ jsx14(PlayerEmitterProvider, {
@@ -3560,6 +3578,7 @@ var ThumbnailFn = ({
       initiallyMuted: true,
       logLevel,
       audioLatencyHint: "playback",
+      inputProps: passedInputProps,
       children: /* @__PURE__ */ jsx16(ThumbnailEmitterContext.Provider, {
         value: emitter,
         children: /* @__PURE__ */ jsx16(ThumbnailUI_default, {

package/package.json

@@ -3,7 +3,7 @@
 		"url": "https://github.com/remotion-dev/remotion/tree/main/packages/player"
 	},
 	"name": "@remotion/player",
-	"version": "4.0.374",
+	"version": "4.0.376",
 	"description": "React component for embedding a Remotion preview into your app",
 	"main": "dist/cjs/index.js",
 	"types": "dist/cjs/index.d.ts",
@@ -35,7 +35,7 @@
 	],
 	"license": "SEE LICENSE IN LICENSE.md",
 	"dependencies": {
-		"remotion": "4.0.374"
+		"remotion": "4.0.376"
 	},
 	"peerDependencies": {
 		"react": ">=16.8.0",
@@ -49,7 +49,7 @@
 		"react-dom": "19.0.0",
 		"webpack": "5.96.1",
 		"zod": "3.22.3",
-		"@remotion/eslint-config-internal": "4.0.374",
+		"@remotion/eslint-config-internal": "4.0.376",
 		"eslint": "9.19.0"
 	},
 	"keywords": [