@hyperstream/videoplayer 0.1.7 → 0.1.9

package/dist/index.js

@@ -20560,17 +20560,29 @@ function usePipMonitor({
   const [isPictureInPicture, setIsPictureInPicture] = (0, import_react40.useState)(false);
   const [isSupported, setIsSupported] = (0, import_react40.useState)(false);
   const [canActivate, setCanActivate] = (0, import_react40.useState)(false);
+  const [videoElement, setVideoElement] = (0, import_react40.useState)(null);
   const onEnterPipRef = (0, import_react40.useRef)(onEnterPip);
   const onLeavePipRef = (0, import_react40.useRef)(onLeavePip);
   onEnterPipRef.current = onEnterPip;
   onLeavePipRef.current = onLeavePip;
   (0, import_react40.useEffect)(() => {
-    const video = videoRef.current;
-    const supported = isPipSupported() && video && "requestPictureInPicture" in video;
-    setIsSupported(!!supported);
+    setIsSupported(isPipSupported());
+  }, []);
+  (0, import_react40.useEffect)(() => {
+    if (videoRef.current) {
+      setVideoElement(videoRef.current);
+      return;
+    }
+    const interval = setInterval(() => {
+      if (videoRef.current) {
+        setVideoElement(videoRef.current);
+        clearInterval(interval);
+      }
+    }, 100);
+    return () => clearInterval(interval);
   }, [videoRef]);
   (0, import_react40.useEffect)(() => {
-    const video = videoRef.current;
+    const video = videoElement;
     if (!video || !isSupported || !enabled) return;
     const handleEnterPip = () => {
       var _a;
@@ -20588,9 +20600,9 @@ function usePipMonitor({
       video.removeEventListener("enterpictureinpicture", handleEnterPip);
       video.removeEventListener("leavepictureinpicture", handleLeavePip);
     };
-  }, [videoRef, isSupported, enabled]);
+  }, [videoElement, isSupported, enabled]);
   (0, import_react40.useEffect)(() => {
-    const video = videoRef.current;
+    const video = videoElement;
     if (!video || !isSupported) {
       setCanActivate(false);
       return;
@@ -20609,7 +20621,7 @@ function usePipMonitor({
       video.removeEventListener("loadeddata", updateCanActivate);
       video.removeEventListener("canplay", updateCanActivate);
     };
-  }, [videoRef, isSupported]);
+  }, [videoElement, isSupported]);
   const enterPip = (0, import_react40.useCallback)(() => __async(null, null, function* () {
     const video = videoRef.current;
     if (!video || !canActivate) return;