suada-components 1.9.0 → 1.9.1

package/dist/components/{index-DetZ05pw.js → index-Bs-XxxV4.js}

@@ -81375,7 +81375,7 @@ function requirePlayers () {
 	    canPlay: import_patterns.canPlay.youtube,
 	    lazyPlayer: (0, import_utils.lazy)(() => Promise.resolve().then(function () { return require(
 	      /* webpackChunkName: 'reactPlayerYouTube' */
-	      './YouTube-DC2uZ14c.js'
+	      './YouTube-DeQdfkWm.js'
 	    ); }).then(function (n) { return n.YouTube; }))
 	  },
 	  {
@@ -81384,7 +81384,7 @@ function requirePlayers () {
 	    canPlay: import_patterns.canPlay.soundcloud,
 	    lazyPlayer: (0, import_utils.lazy)(() => Promise.resolve().then(function () { return require(
 	      /* webpackChunkName: 'reactPlayerSoundCloud' */
-	      './SoundCloud-CIWqB-QW.js'
+	      './SoundCloud-BHgTfaW7.js'
 	    ); }).then(function (n) { return n.SoundCloud; }))
 	  },
 	  {
@@ -81393,7 +81393,7 @@ function requirePlayers () {
 	    canPlay: import_patterns.canPlay.vimeo,
 	    lazyPlayer: (0, import_utils.lazy)(() => Promise.resolve().then(function () { return require(
 	      /* webpackChunkName: 'reactPlayerVimeo' */
-	      './Vimeo-DrDJ5O9H.js'
+	      './Vimeo-BUVxWt7t.js'
 	    ); }).then(function (n) { return n.Vimeo; }))
 	  },
 	  {
@@ -81402,7 +81402,7 @@ function requirePlayers () {
 	    canPlay: import_patterns.canPlay.mux,
 	    lazyPlayer: (0, import_utils.lazy)(() => Promise.resolve().then(function () { return require(
 	      /* webpackChunkName: 'reactPlayerMux' */
-	      './Mux-Cosy8sFO.js'
+	      './Mux-D_si09u2.js'
 	    ); }).then(function (n) { return n.Mux; }))
 	  },
 	  {
@@ -81411,7 +81411,7 @@ function requirePlayers () {
 	    canPlay: import_patterns.canPlay.facebook,
 	    lazyPlayer: (0, import_utils.lazy)(() => Promise.resolve().then(function () { return require(
 	      /* webpackChunkName: 'reactPlayerFacebook' */
-	      './Facebook-42iqQU2G.js'
+	      './Facebook-YxZce26V.js'
 	    ); }).then(function (n) { return n.Facebook; }))
 	  },
 	  {
@@ -81420,7 +81420,7 @@ function requirePlayers () {
 	    canPlay: import_patterns.canPlay.streamable,
 	    lazyPlayer: (0, import_utils.lazy)(() => Promise.resolve().then(function () { return require(
 	      /* webpackChunkName: 'reactPlayerStreamable' */
-	      './Streamable-9anYiQtU.js'
+	      './Streamable-DTAzjVwd.js'
 	    ); }).then(function (n) { return n.Streamable; }))
 	  },
 	  {
@@ -81429,7 +81429,7 @@ function requirePlayers () {
 	    canPlay: import_patterns.canPlay.wistia,
 	    lazyPlayer: (0, import_utils.lazy)(() => Promise.resolve().then(function () { return require(
 	      /* webpackChunkName: 'reactPlayerWistia' */
-	      './Wistia-fh9U2CA2.js'
+	      './Wistia-COWrV8QC.js'
 	    ); }).then(function (n) { return n.Wistia; }))
 	  },
 	  {
@@ -81438,7 +81438,7 @@ function requirePlayers () {
 	    canPlay: import_patterns.canPlay.twitch,
 	    lazyPlayer: (0, import_utils.lazy)(() => Promise.resolve().then(function () { return require(
 	      /* webpackChunkName: 'reactPlayerTwitch' */
-	      './Twitch-Dud6e1Rv.js'
+	      './Twitch-CnEk-l9R.js'
 	    ); }).then(function (n) { return n.Twitch; }))
 	  },
 	  {
@@ -81447,7 +81447,7 @@ function requirePlayers () {
 	    canPlay: import_patterns.canPlay.dailymotion,
 	    lazyPlayer: (0, import_utils.lazy)(() => Promise.resolve().then(function () { return require(
 	      /* webpackChunkName: 'reactPlayerDailyMotion' */
-	      './DailyMotion-B7yDPBbg.js'
+	      './DailyMotion-Cr_8IZRR.js'
 	    ); }).then(function (n) { return n.DailyMotion; }))
 	  },
 	  {
@@ -81456,7 +81456,7 @@ function requirePlayers () {
 	    canPlay: import_patterns.canPlay.mixcloud,
 	    lazyPlayer: (0, import_utils.lazy)(() => Promise.resolve().then(function () { return require(
 	      /* webpackChunkName: 'reactPlayerMixcloud' */
-	      './Mixcloud-sBbcL5rG.js'
+	      './Mixcloud-BCT5e47d.js'
 	    ); }).then(function (n) { return n.Mixcloud; }))
 	  },
 	  {
@@ -81465,7 +81465,7 @@ function requirePlayers () {
 	    canPlay: import_patterns.canPlay.vidyard,
 	    lazyPlayer: (0, import_utils.lazy)(() => Promise.resolve().then(function () { return require(
 	      /* webpackChunkName: 'reactPlayerVidyard' */
-	      './Vidyard-BuOu85uS.js'
+	      './Vidyard-Cn_LcGwi.js'
 	    ); }).then(function (n) { return n.Vidyard; }))
 	  },
 	  {
@@ -81474,7 +81474,7 @@ function requirePlayers () {
 	    canPlay: import_patterns.canPlay.kaltura,
 	    lazyPlayer: (0, import_utils.lazy)(() => Promise.resolve().then(function () { return require(
 	      /* webpackChunkName: 'reactPlayerKaltura' */
-	      './Kaltura-Ct6kwbgP.js'
+	      './Kaltura-krSxvIBr.js'
 	    ); }).then(function (n) { return n.Kaltura; }))
 	  },
 	  {
@@ -81486,7 +81486,7 @@ function requirePlayers () {
 	    },
 	    lazyPlayer: (0, import_utils.lazy)(() => Promise.resolve().then(function () { return require(
 	      /* webpackChunkName: 'reactPlayerFilePlayer' */
-	      './FilePlayer-CAnHK0Cd.js'
+	      './FilePlayer-DqqTufgX.js'
 	    ); }).then(function (n) { return n.FilePlayer; }))
 	  }
 	];
@@ -82307,7 +82307,7 @@ function requireReactPlayer () {
 	var import_Player = __toESM(/*@__PURE__*/ requirePlayer());
 	const Preview = (0, import_utils.lazy)(() => Promise.resolve().then(function () { return require(
 	  /* webpackChunkName: 'reactPlayerPreview' */
-	  './Preview-DiVfo6aa.js'
+	  './Preview-CmduMeEZ.js'
 	); }).then(function (n) { return n.Preview; }));
 	const IS_BROWSER = typeof window !== "undefined" && window.document && typeof document !== "undefined";
 	const IS_GLOBAL = typeof commonjsGlobal !== "undefined" && commonjsGlobal.window && commonjsGlobal.window.document;
@@ -88758,247 +88758,6 @@ var useEventListener = function useEventListener(eventName, handler, element, sh
   }, [eventName, element, shouldRun]);
 };
 
-/**
- * Global Picture-in-Picture Manager
- * This module manages PiP state across component unmounts and route changes
- */
-var PictureInPictureManager = /** @class */function () {
-  function PictureInPictureManager() {
-    this.videoElement = null;
-    this.pipContainer = null;
-    this.currentVideoState = null;
-    this.onStateChange = null;
-    // Listen for PiP events globally
-    document.addEventListener('leavepictureinpicture', this.handlePiPExit.bind(this));
-    document.addEventListener('enterpictureinpicture', this.handlePiPEnter.bind(this));
-  }
-  /**
-   * Register a video element for PiP management
-   */
-  PictureInPictureManager.prototype.registerVideo = function (videoElement, url, onStateChange) {
-    this.videoElement = videoElement;
-    this.onStateChange = onStateChange || null;
-    // Store current video state
-    this.currentVideoState = {
-      url: url,
-      currentTime: videoElement.currentTime,
-      isPlaying: !videoElement.paused,
-      volume: videoElement.volume,
-      playbackRate: videoElement.playbackRate
-    };
-    // Add listeners to track state changes
-    videoElement.addEventListener('timeupdate', this.handleTimeUpdate.bind(this));
-    videoElement.addEventListener('play', this.handlePlayStateChange.bind(this));
-    videoElement.addEventListener('pause', this.handlePlayStateChange.bind(this));
-    videoElement.addEventListener('volumechange', this.handleVolumeChange.bind(this));
-    videoElement.addEventListener('ratechange', this.handleRateChange.bind(this));
-  };
-  /**
-   * Unregister the current video element
-   */
-  PictureInPictureManager.prototype.unregisterVideo = function () {
-    if (this.videoElement) {
-      this.videoElement.removeEventListener('timeupdate', this.handleTimeUpdate.bind(this));
-      this.videoElement.removeEventListener('play', this.handlePlayStateChange.bind(this));
-      this.videoElement.removeEventListener('pause', this.handlePlayStateChange.bind(this));
-      this.videoElement.removeEventListener('volumechange', this.handleVolumeChange.bind(this));
-      this.videoElement.removeEventListener('ratechange', this.handleRateChange.bind(this));
-    }
-    this.videoElement = null;
-    this.onStateChange = null;
-  };
-  /**
-   * Create a persistent video element for PiP
-   */
-  PictureInPictureManager.prototype.createPersistentVideo = function (originalVideo) {
-    var persistentVideo = originalVideo.cloneNode(true);
-    // Copy all relevant properties
-    persistentVideo.src = originalVideo.src;
-    persistentVideo.currentTime = originalVideo.currentTime;
-    persistentVideo.volume = originalVideo.volume;
-    persistentVideo.playbackRate = originalVideo.playbackRate;
-    persistentVideo.muted = originalVideo.muted;
-    // Set properties for PiP
-    persistentVideo.style.position = 'fixed';
-    persistentVideo.style.top = '-9999px';
-    persistentVideo.style.left = '-9999px';
-    persistentVideo.style.width = '1px';
-    persistentVideo.style.height = '1px';
-    persistentVideo.style.opacity = '0';
-    persistentVideo.style.pointerEvents = 'none';
-    return persistentVideo;
-  };
-  /**
-   * Enter picture-in-picture mode with persistence
-   */
-  PictureInPictureManager.prototype.enterPiP = function () {
-    return __awaiter(this, void 0, void 0, function () {
-      var persistentVideo_1, error_1;
-      return __generator(this, function (_a) {
-        switch (_a.label) {
-          case 0:
-            if (!this.videoElement || !document.pictureInPictureEnabled) {
-              return [2 /*return*/];
-            }
-            _a.label = 1;
-          case 1:
-            _a.trys.push([1, 6,, 7]);
-            if (!document.pictureInPictureElement) return [3 /*break*/, 3];
-            return [4 /*yield*/, document.exitPictureInPicture()];
-          case 2:
-            _a.sent();
-            _a.label = 3;
-          case 3:
-            // Create a container if it doesn't exist
-            if (!this.pipContainer) {
-              this.pipContainer = document.createElement('div');
-              this.pipContainer.id = 'suada-pip-container';
-              this.pipContainer.style.position = 'fixed';
-              this.pipContainer.style.top = '-9999px';
-              this.pipContainer.style.left = '-9999px';
-              this.pipContainer.style.width = '1px';
-              this.pipContainer.style.height = '1px';
-              this.pipContainer.style.zIndex = '-1';
-              document.body.appendChild(this.pipContainer);
-            }
-            persistentVideo_1 = this.createPersistentVideo(this.videoElement);
-            this.pipContainer.appendChild(persistentVideo_1);
-            // Wait for video to load
-            return [4 /*yield*/, new Promise(function (resolve) {
-              if (persistentVideo_1.readyState >= 2) {
-                resolve();
-              } else {
-                persistentVideo_1.addEventListener('loadedmetadata', function () {
-                  return resolve();
-                }, {
-                  once: true
-                });
-              }
-            })
-            // Enter PiP mode
-            ];
-          case 4:
-            // Wait for video to load
-            _a.sent();
-            // Enter PiP mode
-            return [4 /*yield*/, persistentVideo_1.requestPictureInPicture()
-            // Update the reference to the persistent video
-            ];
-          case 5:
-            // Enter PiP mode
-            _a.sent();
-            // Update the reference to the persistent video
-            this.videoElement = persistentVideo_1;
-            return [3 /*break*/, 7];
-          case 6:
-            error_1 = _a.sent();
-            console.error('Failed to enter picture-in-picture:', error_1);
-            return [3 /*break*/, 7];
-          case 7:
-            return [2 /*return*/];
-        }
-      });
-    });
-  };
-  /**
-   * Exit picture-in-picture mode
-   */
-  PictureInPictureManager.prototype.exitPiP = function () {
-    return __awaiter(this, void 0, void 0, function () {
-      var error_2;
-      return __generator(this, function (_a) {
-        switch (_a.label) {
-          case 0:
-            _a.trys.push([0, 3,, 4]);
-            if (!document.pictureInPictureElement) return [3 /*break*/, 2];
-            return [4 /*yield*/, document.exitPictureInPicture()];
-          case 1:
-            _a.sent();
-            _a.label = 2;
-          case 2:
-            return [3 /*break*/, 4];
-          case 3:
-            error_2 = _a.sent();
-            console.error('Failed to exit picture-in-picture:', error_2);
-            return [3 /*break*/, 4];
-          case 4:
-            return [2 /*return*/];
-        }
-      });
-    });
-  };
-  /**
-   * Check if currently in PiP mode
-   */
-  PictureInPictureManager.prototype.isPiPActive = function () {
-    return !!document.pictureInPictureElement;
-  };
-  /**
-   * Get current video state
-   */
-  PictureInPictureManager.prototype.getCurrentState = function () {
-    return this.currentVideoState;
-  };
-  /**
-   * Restore video state to a new video element
-   */
-  PictureInPictureManager.prototype.restoreStateToVideo = function (videoElement) {
-    if (!this.currentVideoState) return;
-    videoElement.currentTime = this.currentVideoState.currentTime;
-    videoElement.volume = this.currentVideoState.volume;
-    videoElement.playbackRate = this.currentVideoState.playbackRate;
-    if (this.currentVideoState.isPlaying) {
-      videoElement.play()["catch"](console.error);
-    }
-  };
-  PictureInPictureManager.prototype.handleTimeUpdate = function () {
-    if (this.videoElement && this.currentVideoState) {
-      this.currentVideoState.currentTime = this.videoElement.currentTime;
-      this.notifyStateChange();
-    }
-  };
-  PictureInPictureManager.prototype.handlePlayStateChange = function () {
-    if (this.videoElement && this.currentVideoState) {
-      this.currentVideoState.isPlaying = !this.videoElement.paused;
-      this.notifyStateChange();
-    }
-  };
-  PictureInPictureManager.prototype.handleVolumeChange = function () {
-    if (this.videoElement && this.currentVideoState) {
-      this.currentVideoState.volume = this.videoElement.volume;
-      this.notifyStateChange();
-    }
-  };
-  PictureInPictureManager.prototype.handleRateChange = function () {
-    if (this.videoElement && this.currentVideoState) {
-      this.currentVideoState.playbackRate = this.videoElement.playbackRate;
-      this.notifyStateChange();
-    }
-  };
-  PictureInPictureManager.prototype.handlePiPEnter = function () {
-    console.log('Entered picture-in-picture mode');
-  };
-  PictureInPictureManager.prototype.handlePiPExit = function () {
-    console.log('Exited picture-in-picture mode');
-    this.cleanup();
-  };
-  PictureInPictureManager.prototype.notifyStateChange = function () {
-    if (this.onStateChange && this.currentVideoState) {
-      this.onStateChange(this.currentVideoState);
-    }
-  };
-  PictureInPictureManager.prototype.cleanup = function () {
-    // Clean up the persistent container
-    if (this.pipContainer && this.pipContainer.parentNode) {
-      this.pipContainer.parentNode.removeChild(this.pipContainer);
-      this.pipContainer = null;
-    }
-  };
-  return PictureInPictureManager;
-}();
-// Create a singleton instance
-var pipManager = new PictureInPictureManager();
-
 var count = 0;
 var defaultVideoState = {
   muted: false,
@@ -89083,8 +88842,6 @@ function usePlayerControls(_a) {
     };
     var handlePiPLeave = function handlePiPLeave() {
       setIsPiPActive(false);
-      // Also cleanup the PiP manager when PiP exits
-      pipManager.unregisterVideo();
     };
     document.addEventListener('fullscreenchange', handleFullscreenChange);
     document.addEventListener('enterpictureinpicture', handlePiPEnter);
@@ -89108,33 +88865,19 @@ function usePlayerControls(_a) {
   }, [url]); // Re-run when URL changes to ensure proper cleanup and setup
   React.useEffect(function () {
     setStartPlayed(false);
-    // Check if there's an active PiP session and restore state
-    if (pipManager.isPiPActive()) {
-      var savedState_1 = pipManager.getCurrentState();
-      if (savedState_1 && savedState_1.url === url) {
-        setIsPiPActive(true);
-        // Restore video state from PiP manager
-        setVideoState(function (prev) {
-          var _a;
-          return __assign(__assign({}, prev), {
-            volume: savedState_1.volume,
-            playbackRate: savedState_1.playbackRate,
-            played: savedState_1.currentTime / (((_a = videoPlayerRef.current) === null || _a === void 0 ? void 0 : _a.getDuration()) || 1)
-          });
-        });
-        setIsPlaying(savedState_1.isPlaying);
-      }
-    }
-  }, [url, setIsPlaying]);
+  }, [url]);
   // Cleanup effect to handle component unmounting while in PiP mode
   React.useEffect(function () {
+    var currentVideoPlayerRef = videoPlayerRef.current;
     return function () {
-      // Unregister from PiP manager when component unmounts
-      pipManager.unregisterVideo();
       // Check if we're in PiP mode when component unmounts
       if (document.pictureInPictureElement) {
-        // The PiP manager will handle keeping the video alive
-        console.log('Component unmounting while in Picture-in-Picture mode - PiP will persist');
+        // Try to keep the video element alive by cloning it
+        var videoElement = currentVideoPlayerRef === null || currentVideoPlayerRef === void 0 ? void 0 : currentVideoPlayerRef.getInternalPlayer();
+        if (videoElement && videoElement instanceof HTMLVideoElement) {
+          // Create a warning for the user that PiP will exit
+          console.log('Component unmounting while in Picture-in-Picture mode');
+        }
       }
     };
   }, []);
@@ -89308,18 +89051,9 @@ function usePlayerControls(_a) {
     if (videoPlayerRef.current && !startPlayed) {
       videoPlayerRef.current.seekTo(startTime);
       setStartPlayed(true);
-      // Register video with PiP manager when it's ready
-      var videoElement = videoPlayerRef.current.getInternalPlayer();
-      if (videoElement && videoElement instanceof HTMLVideoElement) {
-        // Restore state if there was a previous PiP session
-        var savedState = pipManager.getCurrentState();
-        if (savedState && savedState.url === url && pipManager.isPiPActive()) {
-          pipManager.restoreStateToVideo(videoElement);
-        }
-      }
     }
     setLoading(false);
-  }, [startTime, startPlayed, setLoading, url]);
+  }, [startTime, startPlayed, setLoading]);
   var handleFullScreen = function handleFullScreen() {
     var playerContainer = playerContainerRef.current;
     if (!playerContainer) {
@@ -89342,33 +89076,21 @@ function usePlayerControls(_a) {
       return;
     }
     if (document.pictureInPictureElement) {
-      pipManager.exitPiP()["catch"](function (error) {
+      document.exitPictureInPicture()["catch"](function (error) {
         console.error('Failed to exit picture-in-picture:', error);
       });
     } else {
-      // Register the video with the PiP manager
-      pipManager.registerVideo(videoElement, url, function (state) {
-        // Update local state when PiP video state changes
-        setVideoState(function (prev) {
-          return __assign(__assign({}, prev), {
-            played: state.currentTime / duration,
-            volume: state.volume,
-            playbackRate: state.playbackRate
-          });
-        });
-        setIsPlaying(state.isPlaying);
-      });
       // Ensure the video is playing before entering PiP mode
       if (videoElement.paused && isPlaying) {
         videoElement.play().then(function () {
-          pipManager.enterPiP()["catch"](function (error) {
+          videoElement.requestPictureInPicture()["catch"](function (error) {
             console.error('Failed to enter picture-in-picture:', error);
           });
         })["catch"](function (error) {
           console.error('Failed to play video before PiP:', error);
         });
       } else {
-        pipManager.enterPiP()["catch"](function (error) {
+        videoElement.requestPictureInPicture()["catch"](function (error) {
           console.error('Failed to enter picture-in-picture:', error);
         });
       }
@@ -89746,6 +89468,131 @@ var VideoPlayer = function VideoPlayer(_a) {
   });
 };
 
+var PiPContext = /*#__PURE__*/React.createContext(undefined);
+var PiPProvider = function PiPProvider(_a) {
+  var children = _a.children;
+  var _b = React.useState(false),
+    isPiPActive = _b[0],
+    setIsPiPActive = _b[1];
+  var _c = React.useState(null),
+    pipVideoState = _c[0],
+    setPipVideoState = _c[1];
+  var videoElementRef = React.useRef(null);
+  var updateVideoState = React.useCallback(function (state) {
+    setPipVideoState(function (prev) {
+      return prev ? __assign(__assign({}, prev), state) : null;
+    });
+  }, []);
+  var registerVideoElement = React.useCallback(function (element) {
+    videoElementRef.current = element;
+  }, []);
+  var unregisterVideoElement = React.useCallback(function () {
+    videoElementRef.current = null;
+  }, []);
+  var enterPiP = React.useCallback(function (videoElement, videoState) {
+    return __awaiter(void 0, void 0, void 0, function () {
+      var error_1;
+      return __generator(this, function (_a) {
+        switch (_a.label) {
+          case 0:
+            if (!document.pictureInPictureEnabled) {
+              console.warn('Picture-in-Picture is not supported in this browser');
+              return [2 /*return*/, false];
+            }
+            if (document.pictureInPictureElement) {
+              console.warn('Another video is already in Picture-in-Picture mode');
+              return [2 /*return*/, false];
+            }
+            _a.label = 1;
+          case 1:
+            _a.trys.push([1, 5,, 6]);
+            // Store video state
+            setPipVideoState(videoState);
+            videoElementRef.current = videoElement;
+            if (!(videoElement.paused && videoState.isPlaying)) return [3 /*break*/, 3];
+            return [4 /*yield*/, videoElement.play()];
+          case 2:
+            _a.sent();
+            _a.label = 3;
+          case 3:
+            return [4 /*yield*/, videoElement.requestPictureInPicture()];
+          case 4:
+            _a.sent();
+            return [2 /*return*/, true];
+          case 5:
+            error_1 = _a.sent();
+            console.error('Failed to enter picture-in-picture:', error_1);
+            return [2 /*return*/, false];
+          case 6:
+            return [2 /*return*/];
+        }
+      });
+    });
+  }, []);
+  var exitPiP = React.useCallback(function () {
+    return __awaiter(void 0, void 0, void 0, function () {
+      var error_2;
+      return __generator(this, function (_a) {
+        switch (_a.label) {
+          case 0:
+            _a.trys.push([0, 3,, 4]);
+            if (!document.pictureInPictureElement) return [3 /*break*/, 2];
+            return [4 /*yield*/, document.exitPictureInPicture()];
+          case 1:
+            _a.sent();
+            _a.label = 2;
+          case 2:
+            return [2 /*return*/, true];
+          case 3:
+            error_2 = _a.sent();
+            console.error('Failed to exit picture-in-picture:', error_2);
+            return [2 /*return*/, false];
+          case 4:
+            return [2 /*return*/];
+        }
+      });
+    });
+  }, []);
+  // Listen for PiP events
+  React.useEffect(function () {
+    var handlePiPEnter = function handlePiPEnter() {
+      setIsPiPActive(true);
+    };
+    var handlePiPLeave = function handlePiPLeave() {
+      setIsPiPActive(false);
+      // Keep the video state for potential restoration
+      // but don't clear it immediately
+    };
+    document.addEventListener('enterpictureinpicture', handlePiPEnter);
+    document.addEventListener('leavepictureinpicture', handlePiPLeave);
+    return function () {
+      document.removeEventListener('enterpictureinpicture', handlePiPEnter);
+      document.removeEventListener('leavepictureinpicture', handlePiPLeave);
+    };
+  }, []);
+  var value = {
+    isPiPActive: isPiPActive,
+    pipVideoState: pipVideoState,
+    enterPiP: enterPiP,
+    exitPiP: exitPiP,
+    updateVideoState: updateVideoState,
+    registerVideoElement: registerVideoElement,
+    unregisterVideoElement: unregisterVideoElement
+  };
+  return jsxRuntimeExports.jsx(PiPContext.Provider, {
+    value: value,
+    children: children
+  });
+};
+
+var usePiP = function usePiP() {
+  var context = React.useContext(PiPContext);
+  if (context === undefined) {
+    throw new Error('usePiP must be used within a PiPProvider');
+  }
+  return context;
+};
+
 var Whiteboard = dt.div(templateObject_1$6 || (templateObject_1$6 = __makeTemplateObject(["\n  background-color: #ffffff;\n  padding: 20px;\n  width: 100%;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  min-height: 75vh;\n  border: 1px solid #e7e9ed;\n  border-radius: 4px;\n  flex-direction: column;\n  padding: 40px;\n"], ["\n  background-color: #ffffff;\n  padding: 20px;\n  width: 100%;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  min-height: 75vh;\n  border: 1px solid #e7e9ed;\n  border-radius: 4px;\n  flex-direction: column;\n  padding: 40px;\n"])));
 var CenteredText = dt.div(templateObject_2$4 || (templateObject_2$4 = __makeTemplateObject(["\n  font-weight: 800;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  font-size: 20px;\n  font-family: 'Open Sans', sans-serif;\n  text-align: center;\n  gap: 8px;\n  margin-top: ", ";\n\n  h1 {\n    font-size: 18px;\n    font-weight: 800;\n  }\n\n  h4 {\n    color: #68707a;\n    font-size: 16px;\n    font-weight: 500;\n  }\n"], ["\n  font-weight: 800;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  font-size: 20px;\n  font-family: 'Open Sans', sans-serif;\n  text-align: center;\n  gap: 8px;\n  margin-top: ", ";\n\n  h1 {\n    font-size: 18px;\n    font-weight: 800;\n  }\n\n  h4 {\n    color: #68707a;\n    font-size: 16px;\n    font-weight: 500;\n  }\n"])), function (_a) {
   var marginTop = _a.marginTop;
@@ -95093,6 +94940,7 @@ exports.Loader = Loader;
 exports.NavigationBar = NavigationBar;
 exports.Pagination = Pagination;
 exports.PhoneCountryCode = PhoneCountryCode;
+exports.PiPProvider = PiPProvider;
 exports.RadioButton = RadioButton;
 exports.RangeSlider = RangeSlider;
 exports.SearchInput = SearchInput;
@@ -95110,3 +94958,4 @@ exports.activeTabClassName = activeTabClassName;
 exports.getDefaultExportFromCjs = getDefaultExportFromCjs;
 exports.requirePatterns = requirePatterns;
 exports.requireUtils = requireUtils;
+exports.usePiP = usePiP;