suada-components 1.8.0 → 1.9.0

package/dist/components/{DailyMotion-SZKPSpD1.js → DailyMotion-B7yDPBbg.js}

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-XiB9Yp2-.js');
+var index = require('./index-DetZ05pw.js');
 var React = require('react');
 
 function _mergeNamespaces(n, m) {

package/dist/components/{DailyMotion-jrl4eEA1.esm.js → DailyMotion-BmnymjR1.esm.js}

@@ -1,4 +1,4 @@
-import { r as requireUtils, a as requirePatterns, g as getDefaultExportFromCjs } from './index-BTR541gv.esm.js';
+import { r as requireUtils, a as requirePatterns, g as getDefaultExportFromCjs } from './index-DKAGRUEW.esm.js';
 import React__default from 'react';
 
 function _mergeNamespaces(n, m) {

package/dist/components/{Facebook-DS0ye_bL.js → Facebook-42iqQU2G.js}

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-XiB9Yp2-.js');
+var index = require('./index-DetZ05pw.js');
 var React = require('react');
 
 function _mergeNamespaces(n, m) {

package/dist/components/{Facebook-Ha24RKIX.esm.js → Facebook-D9Ak6ZJU.esm.js}

@@ -1,4 +1,4 @@
-import { r as requireUtils, a as requirePatterns, g as getDefaultExportFromCjs } from './index-BTR541gv.esm.js';
+import { r as requireUtils, a as requirePatterns, g as getDefaultExportFromCjs } from './index-DKAGRUEW.esm.js';
 import React__default from 'react';
 
 function _mergeNamespaces(n, m) {

package/dist/components/{FilePlayer-B4_DDZXQ.js → FilePlayer-CAnHK0Cd.js}

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-XiB9Yp2-.js');
+var index = require('./index-DetZ05pw.js');
 var React = require('react');
 
 function _mergeNamespaces(n, m) {

package/dist/components/{FilePlayer-D-n083nK.esm.js → FilePlayer-wg9lyafD.esm.js}

@@ -1,4 +1,4 @@
-import { r as requireUtils, a as requirePatterns, g as getDefaultExportFromCjs } from './index-BTR541gv.esm.js';
+import { r as requireUtils, a as requirePatterns, g as getDefaultExportFromCjs } from './index-DKAGRUEW.esm.js';
 import React__default from 'react';
 
 function _mergeNamespaces(n, m) {

package/dist/components/{Kaltura-DAMolg_c.js → Kaltura-Ct6kwbgP.js}

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-XiB9Yp2-.js');
+var index = require('./index-DetZ05pw.js');
 var React = require('react');
 
 function _mergeNamespaces(n, m) {

package/dist/components/{Kaltura-BlDrsjbp.esm.js → Kaltura-DPaEN-dq.esm.js}

@@ -1,4 +1,4 @@
-import { r as requireUtils, a as requirePatterns, g as getDefaultExportFromCjs } from './index-BTR541gv.esm.js';
+import { r as requireUtils, a as requirePatterns, g as getDefaultExportFromCjs } from './index-DKAGRUEW.esm.js';
 import React__default from 'react';
 
 function _mergeNamespaces(n, m) {

package/dist/components/{Mixcloud-B5AIgf8e.esm.js → Mixcloud-BobSN3YI.esm.js}

@@ -1,4 +1,4 @@
-import { r as requireUtils, a as requirePatterns, g as getDefaultExportFromCjs } from './index-BTR541gv.esm.js';
+import { r as requireUtils, a as requirePatterns, g as getDefaultExportFromCjs } from './index-DKAGRUEW.esm.js';
 import React__default from 'react';
 
 function _mergeNamespaces(n, m) {

package/dist/components/{Mixcloud-C1z9BVJ8.js → Mixcloud-sBbcL5rG.js}

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-XiB9Yp2-.js');
+var index = require('./index-DetZ05pw.js');
 var React = require('react');
 
 function _mergeNamespaces(n, m) {

package/dist/components/{Mux-f77ctQXE.esm.js → Mux-B9YP-rFr.esm.js}

@@ -1,4 +1,4 @@
-import { a as requirePatterns, g as getDefaultExportFromCjs } from './index-BTR541gv.esm.js';
+import { a as requirePatterns, g as getDefaultExportFromCjs } from './index-DKAGRUEW.esm.js';
 import React__default from 'react';
 
 function _mergeNamespaces(n, m) {

package/dist/components/{Mux-Bgsc5vvM.js → Mux-Cosy8sFO.js}

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-XiB9Yp2-.js');
+var index = require('./index-DetZ05pw.js');
 var React = require('react');
 
 function _mergeNamespaces(n, m) {

package/dist/components/{Preview-CKXk6Axz.js → Preview-DiVfo6aa.js}

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-XiB9Yp2-.js');
+var index = require('./index-DetZ05pw.js');
 var React = require('react');
 
 function _mergeNamespaces(n, m) {

package/dist/components/{Preview-DhMMn7e2.esm.js → Preview-XcTlhHT1.esm.js}

@@ -1,4 +1,4 @@
-import { g as getDefaultExportFromCjs } from './index-BTR541gv.esm.js';
+import { g as getDefaultExportFromCjs } from './index-DKAGRUEW.esm.js';
 import React__default from 'react';
 
 function _mergeNamespaces(n, m) {

package/dist/components/{SoundCloud-DyYFhGe5.esm.js → SoundCloud-BTHoyFWT.esm.js}

@@ -1,4 +1,4 @@
-import { r as requireUtils, a as requirePatterns, g as getDefaultExportFromCjs } from './index-BTR541gv.esm.js';
+import { r as requireUtils, a as requirePatterns, g as getDefaultExportFromCjs } from './index-DKAGRUEW.esm.js';
 import React__default from 'react';
 
 function _mergeNamespaces(n, m) {

package/dist/components/{SoundCloud-DHLHmaaB.js → SoundCloud-CIWqB-QW.js}

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-XiB9Yp2-.js');
+var index = require('./index-DetZ05pw.js');
 var React = require('react');
 
 function _mergeNamespaces(n, m) {

package/dist/components/{Streamable-BDhbB3m3.js → Streamable-9anYiQtU.js}

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-XiB9Yp2-.js');
+var index = require('./index-DetZ05pw.js');
 var React = require('react');
 
 function _mergeNamespaces(n, m) {

package/dist/components/{Streamable-BBygdIqb.esm.js → Streamable-DsfQCy3p.esm.js}

@@ -1,4 +1,4 @@
-import { r as requireUtils, a as requirePatterns, g as getDefaultExportFromCjs } from './index-BTR541gv.esm.js';
+import { r as requireUtils, a as requirePatterns, g as getDefaultExportFromCjs } from './index-DKAGRUEW.esm.js';
 import React__default from 'react';
 
 function _mergeNamespaces(n, m) {

package/dist/components/{Twitch-CAbFCb5f.esm.js → Twitch-D1BOr8hj.esm.js}

@@ -1,4 +1,4 @@
-import { r as requireUtils, a as requirePatterns, g as getDefaultExportFromCjs } from './index-BTR541gv.esm.js';
+import { r as requireUtils, a as requirePatterns, g as getDefaultExportFromCjs } from './index-DKAGRUEW.esm.js';
 import React__default from 'react';
 
 function _mergeNamespaces(n, m) {

package/dist/components/{Twitch-ZG7WuoXD.js → Twitch-Dud6e1Rv.js}

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-XiB9Yp2-.js');
+var index = require('./index-DetZ05pw.js');
 var React = require('react');
 
 function _mergeNamespaces(n, m) {

package/dist/components/VideoPlayer/pipManager.d.ts

@@ -0,0 +1,60 @@
+/**
+ * Global Picture-in-Picture Manager
+ * This module manages PiP state across component unmounts and route changes
+ */
+interface PiPVideoState {
+    url: string;
+    currentTime: number;
+    isPlaying: boolean;
+    volume: number;
+    playbackRate: number;
+}
+declare class PictureInPictureManager {
+    private videoElement;
+    private pipContainer;
+    private currentVideoState;
+    private onStateChange;
+    constructor();
+    /**
+     * Register a video element for PiP management
+     */
+    registerVideo(videoElement: HTMLVideoElement, url: string, onStateChange?: (state: PiPVideoState) => void): void;
+    /**
+     * Unregister the current video element
+     */
+    unregisterVideo(): void;
+    /**
+     * Create a persistent video element for PiP
+     */
+    private createPersistentVideo;
+    /**
+     * Enter picture-in-picture mode with persistence
+     */
+    enterPiP(): Promise<void>;
+    /**
+     * Exit picture-in-picture mode
+     */
+    exitPiP(): Promise<void>;
+    /**
+     * Check if currently in PiP mode
+     */
+    isPiPActive(): boolean;
+    /**
+     * Get current video state
+     */
+    getCurrentState(): PiPVideoState | null;
+    /**
+     * Restore video state to a new video element
+     */
+    restoreStateToVideo(videoElement: HTMLVideoElement): void;
+    private handleTimeUpdate;
+    private handlePlayStateChange;
+    private handleVolumeChange;
+    private handleRateChange;
+    private handlePiPEnter;
+    private handlePiPExit;
+    private notifyStateChange;
+    private cleanup;
+}
+export declare const pipManager: PictureInPictureManager;
+export {};

package/dist/components/VideoPlayer/pipManager.js

@@ -0,0 +1,272 @@
+/**
+ * Global Picture-in-Picture Manager
+ * This module manages PiP state across component unmounts and route changes
+ */
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __generator = (this && this.__generator) || function (thisArg, body) {
+    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g = Object.create((typeof Iterator === "function" ? Iterator : Object).prototype);
+    return g.next = verb(0), g["throw"] = verb(1), g["return"] = verb(2), typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
+    function verb(n) { return function (v) { return step([n, v]); }; }
+    function step(op) {
+        if (f) throw new TypeError("Generator is already executing.");
+        while (g && (g = 0, op[0] && (_ = 0)), _) try {
+            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
+            if (y = 0, t) op = [op[0] & 2, t.value];
+            switch (op[0]) {
+                case 0: case 1: t = op; break;
+                case 4: _.label++; return { value: op[1], done: false };
+                case 5: _.label++; y = op[1]; op = [0]; continue;
+                case 7: op = _.ops.pop(); _.trys.pop(); continue;
+                default:
+                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
+                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
+                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
+                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
+                    if (t[2]) _.ops.pop();
+                    _.trys.pop(); continue;
+            }
+            op = body.call(thisArg, _);
+        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
+        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
+    }
+};
+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
+export var pipManager = new PictureInPictureManager();
+//# sourceMappingURL=pipManager.js.map

package/dist/components/VideoPlayer/pipManager.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"pipManager.js","sourceRoot":"","sources":["../../../src/components/VideoPlayer/pipManager.ts"],"names":[],"mappings":"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"}

package/dist/components/VideoPlayer/usePlayerControls.js

@@ -49,6 +49,7 @@ import { useState, useRef, useCallback, useEffect } from 'react';
 import { parseVTT } from './parseVtt';
 import { FormatSecondsToTimeString } from './timeConversion';
 import useEventListener from './useEventListener';
+import { pipManager } from './pipManager';
 var count = 0;
 var defaultVideoState = {
     muted: false,
@@ -105,6 +106,8 @@ function usePlayerControls(_a) {
         };
         var handlePiPLeave = function () {
             setIsPiPActive(false);
+            // Also cleanup the PiP manager when PiP exits
+            pipManager.unregisterVideo();
         };
         document.addEventListener('fullscreenchange', handleFullscreenChange);
         document.addEventListener('enterpictureinpicture', handlePiPEnter);
@@ -128,19 +131,29 @@ function usePlayerControls(_a) {
     }, [url]); // Re-run when URL changes to ensure proper cleanup and setup
     useEffect(function () {
         setStartPlayed(false);
-    }, [url]);
+        // 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]);
     // Cleanup effect to handle component unmounting while in PiP mode
     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) {
-                // 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');
-                }
+                // The PiP manager will handle keeping the video alive
+                console.log('Component unmounting while in Picture-in-Picture mode - PiP will persist');
             }
         };
     }, []);
@@ -275,9 +288,18 @@ 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]);
+    }, [startTime, startPlayed, setLoading, url]);
     var handleFullScreen = function () {
         var playerContainer = playerContainerRef.current;
         if (!playerContainer) {
@@ -301,15 +323,21 @@ function usePlayerControls(_a) {
             return;
         }
         if (document.pictureInPictureElement) {
-            document.exitPictureInPicture().catch(function (error) {
+            pipManager.exitPiP().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 () {
-                    videoElement.requestPictureInPicture().catch(function (error) {
+                    pipManager.enterPiP().catch(function (error) {
                         console.error('Failed to enter picture-in-picture:', error);
                     });
                 }).catch(function (error) {
@@ -317,7 +345,7 @@ function usePlayerControls(_a) {
                 });
             }
             else {
-                videoElement.requestPictureInPicture().catch(function (error) {
+                pipManager.enterPiP().catch(function (error) {
                     console.error('Failed to enter picture-in-picture:', error);
                 });
             }