@remotion/player 4.0.289 → 4.0.290

package/dist/cjs/Player.d.ts

@@ -38,6 +38,7 @@ export type PlayerProps<Schema extends AnyZodObject, Props extends Record<string
     readonly showPosterWhenEnded?: boolean;
     readonly showPosterWhenUnplayed?: boolean;
     readonly showPosterWhenBuffering?: boolean;
+    readonly showPosterWhenBufferingAndPaused?: boolean;
     readonly inFrame?: number | null;
     readonly outFrame?: number | null;
     readonly initiallyShowControls?: number | boolean;

package/dist/cjs/Player.js

@@ -23,7 +23,7 @@ const componentOrNullIfLazy = (props) => {
     return null;
 };
 exports.componentOrNullIfLazy = componentOrNullIfLazy;
-const PlayerFn = ({ durationInFrames, compositionHeight, compositionWidth, fps, inputProps, style, controls = false, loop = false, autoPlay = false, showVolumeControls = true, allowFullscreen = true, clickToPlay, doubleClickToFullscreen = false, spaceKeyToPlayOrPause = true, moveToBeginningWhenEnded = true, numberOfSharedAudioTags = 5, errorFallback = () => '⚠️', playbackRate = 1, renderLoading, className, showPosterWhenUnplayed, showPosterWhenEnded, showPosterWhenPaused, showPosterWhenBuffering, initialFrame, renderPoster, inFrame, outFrame, initiallyShowControls, renderFullscreenButton, renderPlayPauseButton, renderVolumeSlider, alwaysShowControls = false, initiallyMuted = false, showPlaybackRateControl = false, posterFillMode = 'player-size', bufferStateDelayInMilliseconds, hideControlsWhenPointerDoesntMove = true, overflowVisible = false, renderMuteButton, browserMediaControlsBehavior: passedBrowserMediaControlsBehavior, overrideInternalClassName, logLevel = 'info', noSuspense, acknowledgeRemotionLicense, ...componentProps }, ref) => {
+const PlayerFn = ({ durationInFrames, compositionHeight, compositionWidth, fps, inputProps, style, controls = false, loop = false, autoPlay = false, showVolumeControls = true, allowFullscreen = true, clickToPlay, doubleClickToFullscreen = false, spaceKeyToPlayOrPause = true, moveToBeginningWhenEnded = true, numberOfSharedAudioTags = 5, errorFallback = () => '⚠️', playbackRate = 1, renderLoading, className, showPosterWhenUnplayed, showPosterWhenEnded, showPosterWhenPaused, showPosterWhenBuffering, showPosterWhenBufferingAndPaused, initialFrame, renderPoster, inFrame, outFrame, initiallyShowControls, renderFullscreenButton, renderPlayPauseButton, renderVolumeSlider, alwaysShowControls = false, initiallyMuted = false, showPlaybackRateControl = false, posterFillMode = 'player-size', bufferStateDelayInMilliseconds, hideControlsWhenPointerDoesntMove = true, overflowVisible = false, renderMuteButton, browserMediaControlsBehavior: passedBrowserMediaControlsBehavior, overrideInternalClassName, logLevel = 'info', noSuspense, acknowledgeRemotionLicense, ...componentProps }, ref) => {
     if (typeof window !== 'undefined') {
         // eslint-disable-next-line react-hooks/rules-of-hooks
         (0, react_1.useLayoutEffect)(() => {
@@ -159,7 +159,7 @@ const PlayerFn = ({ durationInFrames, compositionHeight, compositionWidth, fps,
     }, [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, children: (0, jsx_runtime_1.jsx)(remotion_1.Internals.Timeline.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), 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) }) }) }) }) }));
+                            : 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) }) }) }) }) }));
 };
 const forward = react_1.forwardRef;
 /*

package/dist/cjs/PlayerUI.d.ts

@@ -35,6 +35,7 @@ declare const _default: React.ForwardRefExoticComponent<{
     readonly showPosterWhenEnded: boolean;
     readonly showPosterWhenUnplayed: boolean;
     readonly showPosterWhenBuffering: boolean;
+    readonly showPosterWhenBufferingAndPaused: boolean;
     readonly inFrame: number | null;
     readonly outFrame: number | null;
     readonly initiallyShowControls: number | boolean;

package/dist/cjs/PlayerUI.js

@@ -51,7 +51,7 @@ if (reactVersion === '0') {
     throw new Error(`Version ${reactVersion} of "react" is not supported by Remotion`);
 }
 const doesReactVersionSupportSuspense = parseInt(reactVersion, 10) >= 18;
-const PlayerUI = ({ controls, style, loop, autoPlay, allowFullscreen, inputProps, clickToPlay, showVolumeControls, doubleClickToFullscreen, spaceKeyToPlayOrPause, errorFallback, playbackRate, renderLoading, renderPoster, className, moveToBeginningWhenEnded, showPosterWhenUnplayed, showPosterWhenEnded, showPosterWhenPaused, showPosterWhenBuffering, inFrame, outFrame, initiallyShowControls, renderFullscreen: renderFullscreenButton, renderPlayPauseButton, renderMuteButton, renderVolumeSlider, alwaysShowControls, showPlaybackRateControl, posterFillMode, bufferStateDelayInMilliseconds, hideControlsWhenPointerDoesntMove, overflowVisible, browserMediaControlsBehavior, overrideInternalClassName, noSuspense, }, ref) => {
+const PlayerUI = ({ controls, style, loop, autoPlay, allowFullscreen, inputProps, clickToPlay, showVolumeControls, doubleClickToFullscreen, spaceKeyToPlayOrPause, errorFallback, playbackRate, renderLoading, renderPoster, className, moveToBeginningWhenEnded, showPosterWhenUnplayed, showPosterWhenEnded, showPosterWhenPaused, showPosterWhenBuffering, showPosterWhenBufferingAndPaused, inFrame, outFrame, initiallyShowControls, renderFullscreen: renderFullscreenButton, renderPlayPauseButton, renderMuteButton, renderVolumeSlider, alwaysShowControls, showPlaybackRateControl, posterFillMode, bufferStateDelayInMilliseconds, hideControlsWhenPointerDoesntMove, overflowVisible, browserMediaControlsBehavior, overrideInternalClassName, noSuspense, }, ref) => {
     var _a, _b, _c;
     const config = remotion_1.Internals.useUnsafeVideoConfig();
     const video = remotion_1.Internals.useVideo();
@@ -426,6 +426,9 @@ const PlayerUI = ({ controls, style, loop, autoPlay, allowFullscreen, inputProps
             showPosterWhenEnded && player.isLastFrame && !player.isPlaying(),
             showPosterWhenUnplayed && !player.hasPlayed && !player.isPlaying(),
             showPosterWhenBuffering && showBufferIndicator && player.isPlaying(),
+            showPosterWhenBufferingAndPaused &&
+                showBufferIndicator &&
+                !player.isPlaying(),
         ].some(Boolean);
     const { left, top, width, height, ...outerWithoutScale } = outer;
     const content = ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)("div", { style: outer, onPointerDown: clickToPlay ? handlePointerDown : undefined, onDoubleClick: doubleClickToFullscreen ? handleDoubleClick : undefined, children: [(0, jsx_runtime_1.jsxs)("div", { style: containerStyle, className: (0, player_css_classname_js_1.playerCssClassname)(overrideInternalClassName), children: [VideoComponent ? ((0, jsx_runtime_1.jsx)(error_boundary_js_1.ErrorBoundary, { onError: onError, errorFallback: errorFallback, children: (0, jsx_runtime_1.jsx)(remotion_1.Internals.CurrentScaleContext.Provider, { value: currentScale, children: (0, jsx_runtime_1.jsx)(VideoComponent, { ...((_c = video === null || video === void 0 ? void 0 : video.props) !== null && _c !== void 0 ? _c : {}), ...(inputProps !== null && inputProps !== void 0 ? inputProps : {}) }) }) })) : null, shouldShowPoster && posterFillMode === 'composition-size' ? ((0, jsx_runtime_1.jsx)("div", { style: {

package/dist/esm/index.mjs

@@ -2384,6 +2384,7 @@ var PlayerUI = ({
   showPosterWhenEnded,
   showPosterWhenPaused,
   showPosterWhenBuffering,
+  showPosterWhenBufferingAndPaused,
   inFrame,
   outFrame,
   initiallyShowControls,
@@ -2741,7 +2742,8 @@ var PlayerUI = ({
     showPosterWhenPaused && !player.isPlaying() && !seeking,
     showPosterWhenEnded && player.isLastFrame && !player.isPlaying(),
     showPosterWhenUnplayed && !player.hasPlayed && !player.isPlaying(),
-    showPosterWhenBuffering && showBufferIndicator && player.isPlaying()
+    showPosterWhenBuffering && showBufferIndicator && player.isPlaying(),
+    showPosterWhenBufferingAndPaused && showBufferIndicator && !player.isPlaying()
   ].some(Boolean);
   const { left, top, width, height, ...outerWithoutScale } = outer;
   const content = /* @__PURE__ */ jsxs9(Fragment3, {
@@ -3106,6 +3108,7 @@ var PlayerFn = ({
   showPosterWhenEnded,
   showPosterWhenPaused,
   showPosterWhenBuffering,
+  showPosterWhenBufferingAndPaused,
   initialFrame,
   renderPoster,
   inFrame,
@@ -3286,6 +3289,7 @@ var PlayerFn = ({
             showPosterWhenEnded: Boolean(showPosterWhenEnded),
             showPosterWhenPaused: Boolean(showPosterWhenPaused),
             showPosterWhenBuffering: Boolean(showPosterWhenBuffering),
+            showPosterWhenBufferingAndPaused: Boolean(showPosterWhenBufferingAndPaused),
             renderPoster,
             inFrame: inFrame ?? null,
             outFrame: outFrame ?? null,

package/package.json

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