@remotion/player 4.0.179 → 4.0.180

package/dist/cjs/Player.d.ts

@@ -9,7 +9,7 @@ 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> = {
+export type PlayerProps<Schema extends AnyZodObject, Props extends Record<string, unknown>> = {
     readonly durationInFrames: number;
     readonly compositionWidth: number;
     readonly compositionHeight: number;
@@ -49,6 +49,7 @@ export type PlayerProps<Schema extends AnyZodObject, Props> = {
     readonly hideControlsWhenPointerDoesntMove?: boolean | number;
     readonly overflowVisible?: boolean;
 } & CompProps<Props> & PropsIfHasProps<Schema, Props>;
+export type PlayerPropsWithoutZod<Props extends Record<string, unknown>> = PlayerProps<AnyZodObject, 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.
@@ -57,4 +58,4 @@ export declare const componentOrNullIfLazy: <Props>(props: CompProps<Props>) =>
  * @param {MutableRefObject<PlayerRef>} ref Reference to the player for controlling playback, volume, and other aspects.
  * @returns {JSX.Element} The rendered video player component.
  */
-export declare const Player: <Schema extends AnyZodObject, Props>(props: PlayerProps<Schema, Props> & React.RefAttributes<PlayerRef>) => React.ReactElement | null;
+export declare const Player: <Schema extends AnyZodObject, Props extends Record<string, unknown>>(props: PlayerProps<Schema, Props> & React.RefAttributes<PlayerRef>) => React.ReactElement | null;

package/dist/cjs/PlayerControls.d.ts

@@ -9,16 +9,6 @@ export type RenderPlayPauseButton = (props: {
 export type RenderFullscreenButton = (props: {
     isFullscreen: boolean;
 }) => ReactNode;
-declare global {
-    interface Document {
-        webkitFullscreenEnabled?: boolean;
-        webkitFullscreenElement?: Element;
-        webkitExitFullscreen?: Document['exitFullscreen'];
-    }
-    interface HTMLDivElement {
-        webkitRequestFullScreen: HTMLDivElement['requestFullscreen'];
-    }
-}
 export declare const Controls: React.FC<{
     readonly fps: number;
     readonly durationInFrames: number;

package/dist/cjs/PlayerControls.js

@@ -117,7 +117,9 @@ const Controls = ({ durationInFrames, isFullscreen, fps, player, showVolumeContr
         var _a;
         // Must be handled client-side to avoid SSR hydration mismatch
         setSupportsFullscreen((_a = (typeof document !== 'undefined' &&
-            (document.fullscreenEnabled || document.webkitFullscreenEnabled))) !== null && _a !== void 0 ? _a : false);
+            (document.fullscreenEnabled ||
+                // @ts-expect-error Types not defined
+                document.webkitFullscreenEnabled))) !== null && _a !== void 0 ? _a : false);
     }, []);
     (0, react_1.useEffect)(() => {
         if (shouldShowInitially === false) {

package/dist/cjs/PlayerUI.js

@@ -57,7 +57,9 @@ const PlayerUI = ({ controls, style, loop, autoPlay, allowFullscreen, inputProps
         if (typeof document === 'undefined') {
             return false;
         }
-        return Boolean(document.fullscreenEnabled || document.webkitFullscreenEnabled);
+        return Boolean(document.fullscreenEnabled ||
+            // @ts-expect-error Types not defined
+            document.webkitFullscreenEnabled);
     }, []);
     const player = (0, use_player_js_1.usePlayer)();
     (0, use_playback_js_1.usePlayback)({
@@ -81,6 +83,7 @@ const PlayerUI = ({ controls, style, loop, autoPlay, allowFullscreen, inputProps
         }
         const onFullscreenChange = () => {
             setIsFullscreen(document.fullscreenElement === current ||
+                // @ts-expect-error Types not defined
                 document.webkitFullscreenElement === current);
         };
         document.addEventListener('fullscreenchange', onFullscreenChange);
@@ -108,7 +111,9 @@ const PlayerUI = ({ controls, style, loop, autoPlay, allowFullscreen, inputProps
         if (!container.current) {
             throw new Error('No player ref found');
         }
+        // @ts-expect-error Types not defined
         if (container.current.webkitRequestFullScreen) {
+            // @ts-expect-error Types not defined
             container.current.webkitRequestFullScreen();
         }
         else {
@@ -116,7 +121,9 @@ const PlayerUI = ({ controls, style, loop, autoPlay, allowFullscreen, inputProps
         }
     }, [allowFullscreen, supportsFullScreen]);
     const exitFullscreen = (0, react_1.useCallback)(() => {
+        // @ts-expect-error Types not defined
         if (document.webkitExitFullscreen) {
+            // @ts-expect-error Types not defined
             document.webkitExitFullscreen();
         }
         else {
@@ -130,7 +137,11 @@ const PlayerUI = ({ controls, style, loop, autoPlay, allowFullscreen, inputProps
         }
         const fullscreenChange = () => {
             var _a;
-            const element = (_a = document.webkitFullscreenElement) !== null && _a !== void 0 ? _a : document.fullscreenElement;
+            const element = 
+            // @ts-expect-error Types not defined
+            (_a = document.webkitFullscreenElement) !== null && _a !== void 0 ? _a : 
+            // defined
+            document.fullscreenElement;
             if (element && element === container.current) {
                 player.emitter.dispatchFullscreenChange({
                     isFullscreen: true,

package/dist/cjs/Thumbnail.d.ts

@@ -4,21 +4,21 @@ import type { AnyZodObject } from 'zod';
 import type { ThumbnailMethods } from './player-methods.js';
 import type { ErrorFallback, RenderLoading } from './PlayerUI.js';
 import type { PropsIfHasProps } from './utils/props-if-has-props.js';
-type ThumbnailProps<Schema extends AnyZodObject, Props extends Record<string, unknown>> = PropsIfHasProps<Schema, Props> & CompProps<Props> & {
-    frameToDisplay: number;
-    style?: CSSProperties;
-    durationInFrames: number;
-    compositionWidth: number;
-    compositionHeight: number;
-    fps: number;
-    overflowVisible?: boolean;
-    errorFallback?: ErrorFallback;
-    renderLoading?: RenderLoading;
-    className?: string;
+export type ThumbnailProps<Schema extends AnyZodObject, Props extends Record<string, unknown>> = PropsIfHasProps<Schema, Props> & CompProps<Props> & {
+    readonly frameToDisplay: number;
+    readonly style?: CSSProperties;
+    readonly durationInFrames: number;
+    readonly compositionWidth: number;
+    readonly compositionHeight: number;
+    readonly fps: number;
+    readonly overflowVisible?: boolean;
+    readonly errorFallback?: ErrorFallback;
+    readonly renderLoading?: RenderLoading;
+    readonly className?: string;
 };
+export type ThumbnailPropsWithoutZod<Props extends Record<string, unknown>> = ThumbnailProps<AnyZodObject, Props>;
 /**
  * @description A component which can be rendered in a regular React App (for example: Next.js, Vite) to display a single frame of a video.
  * @see [Documentation](https://www.remotion.dev/docs/player/thumbnail)
  */
 export declare const Thumbnail: <Schema extends AnyZodObject, Props extends Record<string, unknown>>(props: ThumbnailProps<Schema, Props> & import("react").RefAttributes<ThumbnailMethods>) => React.ReactElement | null;
-export {};

package/dist/cjs/index.d.ts

@@ -3,10 +3,11 @@ 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 type { PlayerProps, PlayerPropsWithoutZod } 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 { ThumbnailProps, ThumbnailPropsWithoutZod } from './Thumbnail.js';
 export type { Size } from './utils/use-element-size.js';
 export type { CallbackListener, PlayerEventTypes as EventTypes };
 export declare const PlayerInternals: {
@@ -19,7 +20,7 @@ export declare const PlayerInternals: {
         isFirstFrame: boolean;
         emitter: PlayerEmitter;
         playing: boolean;
-        play: (e?: import("react").SyntheticEvent<Element, Event> | PointerEvent | undefined) => void;
+        play: (e?: PointerEvent | import("react").SyntheticEvent<Element, Event> | undefined) => void;
         pause: () => void;
         pauseAndReturnToPlayStart: () => void;
         seek: (newFrame: number) => void;

package/package.json

@@ -3,7 +3,7 @@
     "url": "https://github.com/remotion-dev/remotion/tree/main/packages/player"
   },
   "name": "@remotion/player",
-  "version": "4.0.179",
+  "version": "4.0.180",
   "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.179"
+    "remotion": "4.0.180"
   },
   "peerDependencies": {
     "react": ">=16.8.0",