remotion 4.0.216 → 4.0.218

package/dist/cjs/buffering.d.ts

@@ -23,4 +23,5 @@ export declare const BufferingContextReact: React.Context<BufferManager | null>;
 export declare const BufferingProvider: React.FC<{
     readonly children: React.ReactNode;
 }>;
+export declare const useIsPlayerBuffering: (bufferManager: BufferManager) => boolean;
 export {};

package/dist/cjs/buffering.js

@@ -23,7 +23,7 @@ var __importStar = (this && this.__importStar) || function (mod) {
     return result;
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.BufferingProvider = exports.BufferingContextReact = void 0;
+exports.useIsPlayerBuffering = exports.BufferingProvider = exports.BufferingContextReact = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = __importStar(require("react"));
 const useBufferManager = () => {
@@ -89,3 +89,22 @@ const BufferingProvider = ({ children }) => {
     return ((0, jsx_runtime_1.jsx)(exports.BufferingContextReact.Provider, { value: bufferManager, children: children }));
 };
 exports.BufferingProvider = BufferingProvider;
+const useIsPlayerBuffering = (bufferManager) => {
+    const [isBuffering, setIsBuffering] = (0, react_1.useState)(bufferManager.buffering.current);
+    (0, react_1.useEffect)(() => {
+        const onBuffer = () => {
+            setIsBuffering(true);
+        };
+        const onResume = () => {
+            setIsBuffering(false);
+        };
+        bufferManager.listenForBuffering(onBuffer);
+        bufferManager.listenForResume(onResume);
+        return () => {
+            bufferManager.listenForBuffering(() => undefined);
+            bufferManager.listenForResume(() => undefined);
+        };
+    }, [bufferManager]);
+    return isBuffering;
+};
+exports.useIsPlayerBuffering = useIsPlayerBuffering;

package/dist/cjs/use-media-playback.js

@@ -79,24 +79,18 @@ const useMediaPlayback = ({ mediaRef, src, mediaType, playbackRate: localPlaybac
         }
         return acceptableTimeshift;
     })();
+    const isPlayerBuffering = (0, buffering_js_1.useIsPlayerBuffering)(buffering);
     (0, react_1.useEffect)(() => {
         var _a, _b;
         if (!playing) {
             (_a = mediaRef.current) === null || _a === void 0 ? void 0 : _a.pause();
             return;
         }
-        const isPlayerBuffering = buffering.buffering.current;
         const isMediaTagBufferingOrStalled = isMediaTagBuffering || isBuffering();
         if (isPlayerBuffering && !isMediaTagBufferingOrStalled) {
             (_b = mediaRef.current) === null || _b === void 0 ? void 0 : _b.pause();
         }
-    }, [
-        buffering.buffering,
-        isBuffering,
-        isMediaTagBuffering,
-        mediaRef,
-        playing,
-    ]);
+    }, [isBuffering, isMediaTagBuffering, isPlayerBuffering, mediaRef, playing]);
     (0, react_1.useEffect)(() => {
         var _a;
         const tagName = mediaType === 'audio' ? '<Audio>' : '<Video>';

package/dist/cjs/version.d.ts

@@ -3,4 +3,4 @@
  * @see [Documentation](https://remotion.dev/docs/version)
  * @returns {string} The current version of the remotion package
  */
-export declare const VERSION = "4.0.216";
+export declare const VERSION = "4.0.218";

package/dist/cjs/version.js

@@ -7,4 +7,4 @@ exports.VERSION = void 0;
  * @see [Documentation](https://remotion.dev/docs/version)
  * @returns {string} The current version of the remotion package
  */
-exports.VERSION = '4.0.216';
+exports.VERSION = '4.0.218';

package/dist/cjs/video/OffthreadVideoForRendering.js

@@ -105,6 +105,9 @@ const OffthreadVideoForRendering = ({ onError, volume: volumeProp, playbackRate,
     }, [toneMapped, currentTime, src, transparent]);
     const [imageSrc, setImageSrc] = (0, react_1.useState)(null);
     (0, react_1.useLayoutEffect)(() => {
+        if (!window.remotion_videoEnabled) {
+            return;
+        }
         const cleanup = [];
         setImageSrc(null);
         const controller = new AbortController();
@@ -191,7 +194,7 @@ const OffthreadVideoForRendering = ({ onError, volume: volumeProp, playbackRate,
             onVideoFrame(img);
         }
     }, [onVideoFrame]);
-    if (!imageSrc) {
+    if (!imageSrc || !window.remotion_videoEnabled) {
         return null;
     }
     (0, delay_render_js_1.continueRender)(imageSrc.handle);

package/dist/cjs/video/Video.js

@@ -19,7 +19,7 @@ const VideoForRendering_js_1 = require("./VideoForRendering.js");
 const duration_state_js_1 = require("./duration-state.js");
 const VideoForwardingFunction = (props, ref) => {
     var _a, _b;
-    const { startFrom, endAt, name, pauseWhenBuffering, stack, _remotionInternalNativeLoopPassed, showInTimeline, onAutoPlayError, crossOrigin, ...otherProps } = props;
+    const { startFrom, endAt, name, pauseWhenBuffering, stack, _remotionInternalNativeLoopPassed, showInTimeline, onAutoPlayError, ...otherProps } = props;
     const { loop, _remotionDebugSeeking, ...propsOtherThanLoop } = props;
     const { fps } = (0, use_video_config_js_1.useVideoConfig)();
     const environment = (0, get_remotion_environment_js_1.getRemotionEnvironment)();
@@ -57,7 +57,7 @@ const VideoForwardingFunction = (props, ref) => {
     }
     return ((0, jsx_runtime_1.jsx)(VideoForPreview_js_1.VideoForPreview, { onlyWarnForMediaSeekingError: false, ...otherProps, ref: ref, onVideoFrame: null, 
         // Proposal: Make this default to true in v5
-        pauseWhenBuffering: pauseWhenBuffering !== null && pauseWhenBuffering !== void 0 ? pauseWhenBuffering : false, onDuration: onDuration, _remotionInternalStack: stack !== null && stack !== void 0 ? stack : null, _remotionInternalNativeLoopPassed: _remotionInternalNativeLoopPassed !== null && _remotionInternalNativeLoopPassed !== void 0 ? _remotionInternalNativeLoopPassed : false, _remotionDebugSeeking: _remotionDebugSeeking !== null && _remotionDebugSeeking !== void 0 ? _remotionDebugSeeking : false, showInTimeline: showInTimeline !== null && showInTimeline !== void 0 ? showInTimeline : true, onAutoPlayError: onAutoPlayError !== null && onAutoPlayError !== void 0 ? onAutoPlayError : undefined, crossOrigin: crossOrigin }));
+        pauseWhenBuffering: pauseWhenBuffering !== null && pauseWhenBuffering !== void 0 ? pauseWhenBuffering : false, onDuration: onDuration, _remotionInternalStack: stack !== null && stack !== void 0 ? stack : null, _remotionInternalNativeLoopPassed: _remotionInternalNativeLoopPassed !== null && _remotionInternalNativeLoopPassed !== void 0 ? _remotionInternalNativeLoopPassed : false, _remotionDebugSeeking: _remotionDebugSeeking !== null && _remotionDebugSeeking !== void 0 ? _remotionDebugSeeking : false, showInTimeline: showInTimeline !== null && showInTimeline !== void 0 ? showInTimeline : true, onAutoPlayError: onAutoPlayError !== null && onAutoPlayError !== void 0 ? onAutoPlayError : undefined }));
 };
 /**
  * @description allows you to include a video file in your Remotion project. It wraps the native HTMLVideoElement.

package/dist/cjs/video/VideoForPreview.d.ts

@@ -9,7 +9,7 @@ type VideoForPreviewProps = RemotionVideoProps & {
     readonly _remotionDebugSeeking: boolean;
     readonly showInTimeline: boolean;
     readonly onVideoFrame: null | OnVideoFrame;
-    readonly crossOrigin: '' | 'anonymous' | 'use-credentials' | undefined;
+    readonly crossOrigin?: '' | 'anonymous' | 'use-credentials';
 };
 export declare const VideoForPreview: React.ForwardRefExoticComponent<Omit<VideoForPreviewProps, "ref"> & React.RefAttributes<HTMLVideoElement>>;
 export {};

package/dist/esm/index.mjs

@@ -151,7 +151,7 @@ function truthy(value) {
 }
 
 // src/version.ts
-var VERSION = "4.0.216";
+var VERSION = "4.0.218";
 
 // src/multiple-versions-warning.ts
 var checkMultipleRemotionVersions = () => {
@@ -2373,6 +2373,28 @@ var BufferingProvider = ({ children }) => {
     children
   });
 };
+var useIsPlayerBuffering = (bufferManager) => {
+  const [isBuffering, setIsBuffering] = useState10(bufferManager.buffering.current);
+  useEffect9(() => {
+    const onBuffer = () => {
+      setIsBuffering(true);
+    };
+    const onResume = () => {
+      setIsBuffering(false);
+    };
+    bufferManager.listenForBuffering(onBuffer);
+    bufferManager.listenForResume(onResume);
+    return () => {
+      bufferManager.listenForBuffering(() => {
+        return;
+      });
+      bufferManager.listenForResume(() => {
+        return;
+      });
+    };
+  }, [bufferManager]);
+  return isBuffering;
+};
 
 // src/use-buffer-state.ts
 var useBufferState = () => {
@@ -2922,23 +2944,17 @@ var useMediaPlayback = ({
     }
     return acceptableTimeshift;
   })();
+  const isPlayerBuffering = useIsPlayerBuffering(buffering);
   useEffect12(() => {
     if (!playing) {
       mediaRef.current?.pause();
       return;
     }
-    const isPlayerBuffering = buffering.buffering.current;
     const isMediaTagBufferingOrStalled = isMediaTagBuffering || isBuffering();
     if (isPlayerBuffering && !isMediaTagBufferingOrStalled) {
       mediaRef.current?.pause();
     }
-  }, [
-    buffering.buffering,
-    isBuffering,
-    isMediaTagBuffering,
-    mediaRef,
-    playing
-  ]);
+  }, [isBuffering, isMediaTagBuffering, isPlayerBuffering, mediaRef, playing]);
   useEffect12(() => {
     const tagName = mediaType === "audio" ? "<Audio>" : "<Video>";
     if (!mediaRef.current) {
@@ -5876,6 +5892,9 @@ var OffthreadVideoForRendering = ({
   }, [toneMapped, currentTime, src, transparent]);
   const [imageSrc, setImageSrc] = useState18(null);
   useLayoutEffect6(() => {
+    if (!window.remotion_videoEnabled) {
+      return;
+    }
     const cleanup = [];
     setImageSrc(null);
     const controller = new AbortController;
@@ -5955,7 +5974,7 @@ var OffthreadVideoForRendering = ({
       onVideoFrame(img);
     }
   }, [onVideoFrame]);
-  if (!imageSrc) {
+  if (!imageSrc || !window.remotion_videoEnabled) {
     return null;
   }
   continueRender(imageSrc.handle);
@@ -6545,7 +6564,6 @@ var VideoForwardingFunction = (props2, ref) => {
     _remotionInternalNativeLoopPassed,
     showInTimeline,
     onAutoPlayError,
-    crossOrigin,
     ...otherProps
   } = props2;
   const { loop, _remotionDebugSeeking, ...propsOtherThanLoop } = props2;
@@ -6620,8 +6638,7 @@ var VideoForwardingFunction = (props2, ref) => {
     _remotionInternalNativeLoopPassed: _remotionInternalNativeLoopPassed ?? false,
     _remotionDebugSeeking: _remotionDebugSeeking ?? false,
     showInTimeline: showInTimeline ?? true,
-    onAutoPlayError: onAutoPlayError ?? undefined,
-    crossOrigin
+    onAutoPlayError: onAutoPlayError ?? undefined
   });
 };
 var Video = forwardRef11(VideoForwardingFunction);

package/dist/esm/version.mjs

@@ -1,5 +1,5 @@
 // src/version.ts
-var VERSION = "4.0.216";
+var VERSION = "4.0.218";
 export {
   VERSION
 };

package/package.json

@@ -3,7 +3,7 @@
     "url": "https://github.com/remotion-dev/remotion/tree/main/packages/core"
   },
   "name": "remotion",
-  "version": "4.0.216",
+  "version": "4.0.218",
   "description": "Make videos programmatically",
   "main": "dist/cjs/index.js",
   "types": "dist/cjs/index.d.ts",