@remotion/player 3.1.7 → 3.1.11

package/dist/PlayerUI.js

@@ -119,6 +119,32 @@ const PlayerUI = ({ controls, style, loop, autoPlay, allowFullscreen, inputProps
             document.exitFullscreen();
         }
     }, []);
+    (0, react_1.useEffect)(() => {
+        const { current } = container;
+        if (!current) {
+            return;
+        }
+        const fullscreenChange = () => {
+            var _a;
+            const element = (_a = document.webkitFullscreenElement) !== null && _a !== void 0 ? _a : document.fullscreenElement;
+            if (element && element === container.current) {
+                player.emitter.dispatchFullscreenChangeUpdate({
+                    isFullscreen: true,
+                });
+            }
+            else {
+                player.emitter.dispatchFullscreenChangeUpdate({
+                    isFullscreen: false,
+                });
+            }
+        };
+        current.addEventListener('webkitfullscreenchange', fullscreenChange);
+        current.addEventListener('fullscreenchange', fullscreenChange);
+        return () => {
+            current.removeEventListener('webkitfullscreenchange', fullscreenChange);
+            current.removeEventListener('fullscreenchange', fullscreenChange);
+        };
+    }, [player.emitter]);
     const durationInFrames = (_a = config === null || config === void 0 ? void 0 : config.durationInFrames) !== null && _a !== void 0 ? _a : 1;
     (0, react_1.useImperativeHandle)(ref, () => {
         const methods = {

package/dist/error-boundary.d.ts

@@ -15,5 +15,5 @@ export declare class ErrorBoundary extends React.Component<{
         hasError: Error;
     };
     componentDidCatch(error: Error): void;
-    render(): string | number | boolean | JSX.Element | React.ReactFragment | null | undefined;
+    render(): string | number | boolean | React.ReactFragment | JSX.Element | null | undefined;
 }

package/dist/event-emitter.d.ts

@@ -10,6 +10,9 @@ declare type TimeUpdateEventPayload = {
 declare type RateChangeEventPayload = {
     playbackRate: number;
 };
+declare type FullscreenChangeEventPayload = {
+    isFullscreen: boolean;
+};
 declare type StateEventMap = {
     seeked: SeekPayload;
     pause: undefined;
@@ -18,6 +21,7 @@ declare type StateEventMap = {
     ended: undefined;
     error: ErrorPayload;
     timeupdate: TimeUpdateEventPayload;
+    fullscreenchange: FullscreenChangeEventPayload;
 };
 export declare type EventTypes = keyof StateEventMap;
 export declare type CallbackListener<T extends EventTypes> = (data: {
@@ -38,5 +42,6 @@ export declare class PlayerEmitter {
     dispatchRatechange(playbackRate: number): void;
     dispatchError(error: Error): void;
     dispatchTimeUpdate(event: TimeUpdateEventPayload): void;
+    dispatchFullscreenChangeUpdate(event: FullscreenChangeEventPayload): void;
 }
 export {};

package/dist/event-emitter.js

@@ -11,6 +11,7 @@ class PlayerEmitter {
             ratechange: [],
             seeked: [],
             timeupdate: [],
+            fullscreenchange: [],
         };
     }
     addEventListener(name, callback) {
@@ -51,5 +52,8 @@ class PlayerEmitter {
     dispatchTimeUpdate(event) {
         this.dispatchEvent('timeupdate', event);
     }
+    dispatchFullscreenChangeUpdate(event) {
+        this.dispatchEvent('fullscreenchange', event);
+    }
 }
 exports.PlayerEmitter = PlayerEmitter;

package/dist/utils/browser-supports-fullscreen.d.ts

@@ -0,0 +1,11 @@
+declare global {
+    interface Document {
+        webkitFullscreenEnabled?: boolean;
+        webkitFullscreenElement?: Element;
+        webkitExitFullscreen?: Document['exitFullscreen'];
+    }
+    interface HTMLDivElement {
+        webkitRequestFullScreen: HTMLDivElement['requestFullscreen'];
+    }
+}
+export declare const browserSupportsFullscreen: boolean | undefined;

package/dist/utils/browser-supports-fullscreen.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.browserSupportsFullscreen = void 0;
+exports.browserSupportsFullscreen = typeof document !== 'undefined' &&
+    (document.fullscreenEnabled || document.webkitFullscreenEnabled);

package/dist/utils/use-element-size.d.ts

@@ -3,6 +3,10 @@ export declare type Size = {
     height: number;
     left: number;
     top: number;
+    windowSize: {
+        width: number;
+        height: number;
+    };
 };
 export declare const updateAllElementsSizes: () => void;
 export declare const useElementSize: (ref: React.RefObject<HTMLElement>, options: {

package/dist/utils/use-element-size.js

@@ -36,6 +36,10 @@ const useElementSize = (ref, options) => {
                 height,
                 left: newSize[0].x,
                 top: newSize[0].y,
+                windowSize: {
+                    height: window.innerHeight,
+                    width: window.innerWidth,
+                },
             });
         });
     }, [options.shouldApplyCssTransforms]);
@@ -53,6 +57,10 @@ const useElementSize = (ref, options) => {
             height: rect[0].height,
             left: rect[0].x,
             top: rect[0].y,
+            windowSize: {
+                height: window.innerHeight,
+                width: window.innerWidth,
+            },
         });
     }, [ref]);
     (0, react_1.useEffect)(() => {

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@remotion/player",
-	"version": "3.1.7",
+	"version": "3.1.11",
 	"description": "Remotion Player",
 	"main": "dist/index.js",
 	"sideEffects": false,
@@ -28,7 +28,7 @@
 	],
 	"license": "SEE LICENSE IN LICENSE.md",
 	"dependencies": {
-		"remotion": "3.1.7"
+		"remotion": "3.1.11"
 	},
 	"peerDependencies": {
 		"react": ">=16.8.0",
@@ -63,5 +63,5 @@
 	"publishConfig": {
 		"access": "public"
 	},
-	"gitHead": "599379fef6043a7125d1979766f915580ec1cf77"
+	"gitHead": "bc4184c9faf944a3bac2fd56bdf990cc74e3ec94"
 }