@remotion/player 4.0.178 → 4.0.179

package/.rollup.cache/Users/jonathanburger/remotion/packages/player/dist/esm/Player.d.ts

@@ -2,58 +2,55 @@ import type { ComponentType } from 'react';
 import React from 'react';
 import type { CompProps } from 'remotion';
 import type { AnyZodObject } from 'zod';
+import type { PlayerRef } from './player-methods.js';
 import type { RenderFullscreenButton, RenderPlayPauseButton } from './PlayerControls.js';
 import type { PosterFillMode, RenderLoading, RenderPoster } from './PlayerUI.js';
-import type { PlayerRef } from './player-methods.js';
 import type { PropsIfHasProps } from './utils/props-if-has-props.js';
 export type ErrorFallback = (info: {
     error: Error;
 }) => React.ReactNode;
 export type PlayerProps<Schema extends AnyZodObject, Props> = {
-    readonly durationInFrames: number;
-    readonly compositionWidth: number;
-    readonly compositionHeight: number;
-    readonly fps: number;
-    readonly showVolumeControls?: boolean;
-    readonly controls?: boolean;
-    readonly errorFallback?: ErrorFallback;
-    readonly style?: React.CSSProperties;
-    readonly loop?: boolean;
-    readonly autoPlay?: boolean;
-    readonly allowFullscreen?: boolean;
-    readonly clickToPlay?: boolean;
-    readonly doubleClickToFullscreen?: boolean;
-    readonly spaceKeyToPlayOrPause?: boolean;
-    readonly numberOfSharedAudioTags?: number;
-    readonly playbackRate?: number;
-    readonly renderLoading?: RenderLoading;
-    readonly moveToBeginningWhenEnded?: boolean;
-    readonly className?: string;
-    readonly initialFrame?: number;
-    readonly renderPoster?: RenderPoster;
-    readonly showPosterWhenPaused?: boolean;
-    readonly showPosterWhenEnded?: boolean;
-    readonly showPosterWhenUnplayed?: boolean;
-    readonly showPosterWhenBuffering?: boolean;
-    readonly inFrame?: number | null;
-    readonly outFrame?: number | null;
-    readonly initiallyShowControls?: number | boolean;
-    readonly renderPlayPauseButton?: RenderPlayPauseButton;
-    readonly renderFullscreenButton?: RenderFullscreenButton;
-    readonly alwaysShowControls?: boolean;
-    readonly schema?: Schema;
-    readonly initiallyMuted?: boolean;
-    readonly showPlaybackRateControl?: boolean | number[];
-    readonly posterFillMode?: PosterFillMode;
-    readonly bufferStateDelayInMilliseconds?: number;
-    readonly hideControlsWhenPointerDoesntMove?: boolean | number;
+    durationInFrames: number;
+    compositionWidth: number;
+    compositionHeight: number;
+    fps: number;
+    showVolumeControls?: boolean;
+    controls?: boolean;
+    errorFallback?: ErrorFallback;
+    style?: React.CSSProperties;
+    loop?: boolean;
+    autoPlay?: boolean;
+    allowFullscreen?: boolean;
+    clickToPlay?: boolean;
+    doubleClickToFullscreen?: boolean;
+    spaceKeyToPlayOrPause?: boolean;
+    numberOfSharedAudioTags?: number;
+    playbackRate?: number;
+    renderLoading?: RenderLoading;
+    moveToBeginningWhenEnded?: boolean;
+    className?: string;
+    initialFrame?: number;
+    renderPoster?: RenderPoster;
+    showPosterWhenPaused?: boolean;
+    showPosterWhenEnded?: boolean;
+    showPosterWhenUnplayed?: boolean;
+    showPosterWhenBuffering?: boolean;
+    inFrame?: number | null;
+    outFrame?: number | null;
+    initiallyShowControls?: number | boolean;
+    renderPlayPauseButton?: RenderPlayPauseButton;
+    renderFullscreenButton?: RenderFullscreenButton;
+    alwaysShowControls?: boolean;
+    schema?: Schema;
+    initiallyMuted?: boolean;
+    showPlaybackRateControl?: boolean | number[];
+    posterFillMode?: PosterFillMode;
+    bufferStateDelayInMilliseconds?: number;
+    hideControlsWhenPointerDoesntMove?: boolean | number;
 } & CompProps<Props> & PropsIfHasProps<Schema, Props>;
 export declare const componentOrNullIfLazy: <Props>(props: CompProps<Props>) => ComponentType<Props> | null;
 /**
- * @description Creates and renders a customizable video player with various interactive controls for a React application.
- * @see [Documentation](https://remotion.dev/docs/player/api)
- * @param {PlayerProps<Schema, Props>} props The properties for configuring the player, including video specifics and UI controls.
- * @param {MutableRefObject<PlayerRef>} ref Reference to the player for controlling playback, volume, and other aspects.
- * @returns {JSX.Element} The rendered video player component.
+ * @description A component which can be rendered in a regular React App (for example: Vite, Next.js) to display a Remotion video.
+ * @see [Documentation](https://www.remotion.dev/docs/player/player)
  */
 export declare const Player: <Schema extends AnyZodObject, Props>(props: PlayerProps<Schema, Props> & React.RefAttributes<PlayerRef>) => React.ReactElement | null;

package/.rollup.cache/Users/jonathanburger/remotion/packages/player/dist/esm/Player.js

@@ -2,9 +2,9 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { forwardRef, useEffect, useImperativeHandle, useLayoutEffect, useMemo, useRef, useState, } from 'react';
 import { Composition, Internals } from 'remotion';
 import { PlayerEmitterProvider } from './EmitterProvider.js';
+import { PLAYER_CSS_CLASSNAME } from './player-css-classname.js';
 import PlayerUI from './PlayerUI.js';
 import { PLAYER_COMP_ID, SharedPlayerContexts } from './SharedPlayerContext.js';
-import { PLAYER_CSS_CLASSNAME } from './player-css-classname.js';
 import { validateInOutFrames } from './utils/validate-in-out-frame.js';
 import { validateInitialFrame } from './utils/validate-initial-frame.js';
 import { validatePlaybackRate } from './utils/validate-playbackrate.js';
@@ -127,7 +127,7 @@ const PlayerFn = ({ durationInFrames, compositionHeight, compositionWidth, fps,
         // eslint-disable-next-line react-hooks/rules-of-hooks
         useLayoutEffect(() => {
             // Inject CSS only on client, and also only after the Player has hydrated
-            Internals.CSSUtils.injectCSS(Internals.CSSUtils.makeDefaultPreviewCSS(`.${PLAYER_CSS_CLASSNAME}`, '#fff'));
+            Internals.CSSUtils.injectCSS(Internals.CSSUtils.makeDefaultCSS(`.${PLAYER_CSS_CLASSNAME}`, '#fff'));
         }, []);
     }
     const actualInputProps = useMemo(() => inputProps !== null && inputProps !== void 0 ? inputProps : {}, [inputProps]);
@@ -137,10 +137,7 @@ const PlayerFn = ({ durationInFrames, compositionHeight, compositionWidth, fps,
 };
 const forward = forwardRef;
 /**
- * @description Creates and renders a customizable video player with various interactive controls for a React application.
- * @see [Documentation](https://remotion.dev/docs/player/api)
- * @param {PlayerProps<Schema, Props>} props The properties for configuring the player, including video specifics and UI controls.
- * @param {MutableRefObject<PlayerRef>} ref Reference to the player for controlling playback, volume, and other aspects.
- * @returns {JSX.Element} The rendered video player component.
+ * @description A component which can be rendered in a regular React App (for example: Vite, Next.js) to display a Remotion video.
+ * @see [Documentation](https://www.remotion.dev/docs/player/player)
  */
 export const Player = forward(PlayerFn);

package/.rollup.cache/Users/jonathanburger/remotion/packages/player/dist/esm/PlayerControls.d.ts

@@ -20,28 +20,28 @@ declare global {
     }
 }
 export declare const Controls: React.FC<{
-    readonly fps: number;
-    readonly durationInFrames: number;
-    readonly showVolumeControls: boolean;
-    readonly player: ReturnType<typeof usePlayer>;
-    readonly onFullscreenButtonClick: MouseEventHandler<HTMLButtonElement>;
-    readonly isFullscreen: boolean;
-    readonly allowFullscreen: boolean;
-    readonly onExitFullscreenButtonClick: MouseEventHandler<HTMLButtonElement>;
-    readonly spaceKeyToPlayOrPause: boolean;
-    readonly onSeekEnd: () => void;
-    readonly onSeekStart: () => void;
-    readonly inFrame: number | null;
-    readonly outFrame: number | null;
-    readonly initiallyShowControls: number | boolean;
-    readonly canvasSize: Size | null;
-    readonly renderPlayPauseButton: RenderPlayPauseButton | null;
-    readonly renderFullscreenButton: RenderFullscreenButton | null;
-    readonly alwaysShowControls: boolean;
-    readonly showPlaybackRateControl: boolean | number[];
-    readonly containerRef: React.RefObject<HTMLDivElement>;
-    readonly buffering: boolean;
-    readonly hideControlsWhenPointerDoesntMove: boolean | number;
-    readonly onPointerUp: React.PointerEventHandler<HTMLDivElement> | undefined;
-    readonly onDoubleClick: MouseEventHandler<HTMLDivElement> | undefined;
+    fps: number;
+    durationInFrames: number;
+    showVolumeControls: boolean;
+    player: ReturnType<typeof usePlayer>;
+    onFullscreenButtonClick: MouseEventHandler<HTMLButtonElement>;
+    isFullscreen: boolean;
+    allowFullscreen: boolean;
+    onExitFullscreenButtonClick: MouseEventHandler<HTMLButtonElement>;
+    spaceKeyToPlayOrPause: boolean;
+    onSeekEnd: () => void;
+    onSeekStart: () => void;
+    inFrame: number | null;
+    outFrame: number | null;
+    initiallyShowControls: number | boolean;
+    canvasSize: Size | null;
+    renderPlayPauseButton: RenderPlayPauseButton | null;
+    renderFullscreenButton: RenderFullscreenButton | null;
+    alwaysShowControls: boolean;
+    showPlaybackRateControl: boolean | number[];
+    containerRef: React.RefObject<HTMLDivElement>;
+    buffering: boolean;
+    hideControlsWhenPointerDoesntMove: boolean | number;
+    onPointerUp: React.PointerEventHandler<HTMLDivElement> | undefined;
+    onDoubleClick: MouseEventHandler<HTMLDivElement> | undefined;
 }>;

package/.rollup.cache/Users/jonathanburger/remotion/packages/player/dist/esm/PlayerControls.js

@@ -2,13 +2,13 @@ import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-run
 import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
 import { Internals } from 'remotion';
 import { DefaultPlayPauseButton } from './DefaultPlayPauseButton.js';
+import { formatTime } from './format-time.js';
+import { FullscreenIcon } from './icons.js';
 import { MediaVolumeSlider } from './MediaVolumeSlider.js';
 import { PlaybackrateControl, playerButtonStyle } from './PlaybackrateControl.js';
 import { PlayerSeekBar } from './PlayerSeekBar.js';
-import { formatTime } from './format-time.js';
-import { FullscreenIcon } from './icons.js';
 import { useHoverState } from './use-hover-state.js';
-import { X_PADDING, useVideoControlsResize, } from './use-video-controls-resize.js';
+import { useVideoControlsResize, X_PADDING, } from './use-video-controls-resize.js';
 const gradientSteps = [
     0, 0.013, 0.049, 0.104, 0.175, 0.259, 0.352, 0.45, 0.55, 0.648, 0.741, 0.825,
     0.896, 0.951, 0.987,

package/.rollup.cache/Users/jonathanburger/remotion/packages/player/dist/esm/PlayerUI.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
-import type { RenderFullscreenButton, RenderPlayPauseButton } from './PlayerControls.js';
 import type { PlayerRef } from './player-methods.js';
+import type { RenderFullscreenButton, RenderPlayPauseButton } from './PlayerControls.js';
 export type ErrorFallback = (info: {
     error: Error;
 }) => React.ReactNode;
@@ -12,35 +12,35 @@ export type RenderLoading = (canvas: {
 export type RenderPoster = RenderLoading;
 export type PosterFillMode = 'player-size' | 'composition-size';
 declare const _default: React.ForwardRefExoticComponent<{
-    readonly controls: boolean;
-    readonly loop: boolean;
-    readonly autoPlay: boolean;
-    readonly allowFullscreen: boolean;
-    readonly inputProps: Record<string, unknown>;
-    readonly showVolumeControls: boolean;
-    readonly style?: React.CSSProperties | undefined;
-    readonly clickToPlay: boolean;
-    readonly doubleClickToFullscreen: boolean;
-    readonly spaceKeyToPlayOrPause: boolean;
-    readonly errorFallback: ErrorFallback;
-    readonly playbackRate: number;
-    readonly renderLoading: RenderLoading | undefined;
-    readonly renderPoster: RenderLoading | undefined;
-    readonly className: string | undefined;
-    readonly moveToBeginningWhenEnded: boolean;
-    readonly showPosterWhenPaused: boolean;
-    readonly showPosterWhenEnded: boolean;
-    readonly showPosterWhenUnplayed: boolean;
-    readonly showPosterWhenBuffering: boolean;
-    readonly inFrame: number | null;
-    readonly outFrame: number | null;
-    readonly initiallyShowControls: number | boolean;
-    readonly renderPlayPauseButton: RenderPlayPauseButton | null;
-    readonly renderFullscreen: RenderFullscreenButton | null;
-    readonly alwaysShowControls: boolean;
-    readonly showPlaybackRateControl: boolean | number[];
-    readonly posterFillMode: PosterFillMode;
-    readonly bufferStateDelayInMilliseconds: number;
-    readonly hideControlsWhenPointerDoesntMove: number | boolean;
+    controls: boolean;
+    loop: boolean;
+    autoPlay: boolean;
+    allowFullscreen: boolean;
+    inputProps: Record<string, unknown>;
+    showVolumeControls: boolean;
+    style?: React.CSSProperties | undefined;
+    clickToPlay: boolean;
+    doubleClickToFullscreen: boolean;
+    spaceKeyToPlayOrPause: boolean;
+    errorFallback: ErrorFallback;
+    playbackRate: number;
+    renderLoading: RenderLoading | undefined;
+    renderPoster: RenderLoading | undefined;
+    className: string | undefined;
+    moveToBeginningWhenEnded: boolean;
+    showPosterWhenPaused: boolean;
+    showPosterWhenEnded: boolean;
+    showPosterWhenUnplayed: boolean;
+    showPosterWhenBuffering: boolean;
+    inFrame: number | null;
+    outFrame: number | null;
+    initiallyShowControls: number | boolean;
+    renderPlayPauseButton: RenderPlayPauseButton | null;
+    renderFullscreen: RenderFullscreenButton | null;
+    alwaysShowControls: boolean;
+    showPlaybackRateControl: boolean | number[];
+    posterFillMode: PosterFillMode;
+    bufferStateDelayInMilliseconds: number;
+    hideControlsWhenPointerDoesntMove: number | boolean;
 } & React.RefAttributes<PlayerRef>>;
 export default _default;

package/.rollup.cache/Users/jonathanburger/remotion/packages/player/dist/esm/PlayerUI.js

@@ -1,10 +1,10 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import React, { Suspense, forwardRef, useCallback, useContext, useEffect, useImperativeHandle, useMemo, useRef, useState, } from 'react';
+import React, { forwardRef, Suspense, useCallback, useContext, useEffect, useImperativeHandle, useMemo, useRef, useState, } from 'react';
 import { Internals } from 'remotion';
-import { Controls } from './PlayerControls.js';
 import { calculateCanvasTransformation, calculateContainerStyle, calculateOuter, calculateOuterStyle, } from './calculate-scale.js';
 import { ErrorBoundary } from './error-boundary.js';
 import { PLAYER_CSS_CLASSNAME } from './player-css-classname.js';
+import { Controls } from './PlayerControls.js';
 import { usePlayback } from './use-playback.js';
 import { usePlayer } from './use-player.js';
 import { IS_NODE } from './utils/is-node.js';
@@ -176,7 +176,6 @@ const PlayerUI = ({ controls, style, loop, autoPlay, allowFullscreen, inputProps
         };
         const onResume = () => {
             requestAnimationFrame(() => {
-                stopped = true;
                 setShowBufferState(false);
                 if (timeout) {
                     clearTimeout(timeout);

package/.rollup.cache/Users/jonathanburger/remotion/packages/player/dist/esm/SharedPlayerContext.d.ts

@@ -3,13 +3,13 @@ import React from 'react';
 import type { TimelineContextValue } from 'remotion';
 export declare const PLAYER_COMP_ID = "player-comp";
 export declare const SharedPlayerContexts: React.FC<{
-    readonly children: React.ReactNode;
-    readonly timelineContext: TimelineContextValue;
-    readonly fps: number;
-    readonly compositionWidth: number;
-    readonly compositionHeight: number;
-    readonly durationInFrames: number;
-    readonly component: LazyExoticComponent<ComponentType<unknown>>;
-    readonly numberOfSharedAudioTags: number;
-    readonly initiallyMuted: boolean;
+    children: React.ReactNode;
+    timelineContext: TimelineContextValue;
+    fps: number;
+    compositionWidth: number;
+    compositionHeight: number;
+    durationInFrames: number;
+    component: LazyExoticComponent<ComponentType<unknown>>;
+    numberOfSharedAudioTags: number;
+    initiallyMuted: boolean;
 }>;

package/.rollup.cache/Users/jonathanburger/remotion/packages/player/dist/esm/index.d.ts

@@ -1,13 +1,12 @@
 /// <reference types="react" />
 import type { CallbackListener, PlayerEventTypes } from './event-emitter.js';
 import { PlayerEmitter } from './event-emitter.js';
-export type { PlayerMethods, PlayerRef, ThumbnailMethods, ThumbnailRef, } from './player-methods.js';
-export { Player } from './Player.js';
-export type { PlayerProps } from './Player.js';
+export { PlayerMethods, PlayerRef, ThumbnailMethods, ThumbnailRef, } from './player-methods.js';
+export { Player, PlayerProps } from './Player.js';
 export type { RenderFullscreenButton, RenderPlayPauseButton, } from './PlayerControls.js';
 export type { ErrorFallback, RenderLoading, RenderPoster } from './PlayerUI.js';
 export { Thumbnail } from './Thumbnail.js';
-export type { Size } from './utils/use-element-size.js';
+export { Size } from './utils/use-element-size.js';
 export type { CallbackListener, PlayerEventTypes as EventTypes };
 export declare const PlayerInternals: {
     PlayerEventEmitterContext: import("react").Context<PlayerEmitter | undefined>;

package/.rollup.cache/Users/jonathanburger/remotion/packages/player/dist/esm/test/test-utils.d.ts

@@ -3,4 +3,4 @@ import type { FC, ReactElement } from 'react';
 declare const HelloWorld: FC;
 declare const customRender: (ui: ReactElement, options?: Omit<RenderOptions, 'queries'>) => import("@testing-library/react").RenderResult<typeof queries, HTMLElement, HTMLElement>;
 export * from '@testing-library/react';
-export { HelloWorld, customRender as render };
+export { customRender as render, HelloWorld };

package/.rollup.cache/Users/jonathanburger/remotion/packages/player/dist/esm/test/test-utils.js

@@ -11,4 +11,4 @@ const AllTheProviders = ({ children }) => {
 };
 const customRender = (ui, options) => render(ui, { wrapper: AllTheProviders, ...options });
 export * from '@testing-library/react';
-export { HelloWorld, customRender as render };
+export { customRender as render, HelloWorld };