@camera.ui/browser 0.0.186 → 0.0.189

package/dist/index.js

@@ -3018,6 +3018,11 @@ async function processWebRTCMessage(handler, msg) {
 //#endregion
 //#region src/streaming/streamConnection.ts
 var log = new Logger("StreamConnection");
+function isVideoInPictureInPicture(video) {
+	if (!video) return false;
+	if (typeof document !== "undefined" && "pictureInPictureElement" in document && document.pictureInPictureElement === video) return true;
+	return video.webkitPresentationMode === "picture-in-picture";
+}
 var StreamConnection = class {
 	status;
 	activeMode;
@@ -3050,6 +3055,7 @@ var StreamConnection = class {
 	abortController = new AbortController();
 	probedSourceId;
 	wasPausedByVisibility = false;
+	disarmPipWatch = null;
 	wsHandle;
 	webrtcHandler;
 	mseHandler;
@@ -3148,12 +3154,18 @@ var StreamConnection = class {
 					log.debug(`onTabPaused — already in ${this.status.value}, skipping stop()`);
 					return;
 				}
+				if (isVideoInPictureInPicture(this.videoElement.value)) {
+					log.debug("onTabPaused — video is in picture-in-picture, keeping the stream");
+					this.watchPipLeave();
+					return;
+				}
 				this.wasPausedByVisibility = true;
 				this.stop();
 				log.debug("onTabPaused — stop() done, wasPausedByVisibility=true");
 			});
 			this.offTabVisible = onTabVisible(() => {
 				log.debug(`onTabVisible fired — wasPausedByVisibility=${this.wasPausedByVisibility}, status=${this.status.value}, isReady=${this.isReady.value}, target=${!!this.target.value}`);
+				this.disarmPipWatch?.();
 				if (!this.wasPausedByVisibility) {
 					log.debug("onTabVisible — not paused by visibility, no-op");
 					return;
@@ -3166,6 +3178,27 @@ var StreamConnection = class {
 			}, { immediate: true });
 		});
 	}
+	watchPipLeave() {
+		if (this.disarmPipWatch) return;
+		const video = this.videoElement.value;
+		if (!video) return;
+		const onLeave = () => {
+			if (isVideoInPictureInPicture(video)) return;
+			this.disarmPipWatch?.();
+			if (typeof document !== "undefined" && document.visibilityState === "visible") return;
+			if (this.status.value === "idle" || this.status.value === "closed") return;
+			log.debug("picture-in-picture closed while tab hidden — stopping the stream");
+			this.wasPausedByVisibility = true;
+			this.stop();
+		};
+		video.addEventListener("leavepictureinpicture", onLeave);
+		video.addEventListener("webkitpresentationmodechanged", onLeave);
+		this.disarmPipWatch = () => {
+			video.removeEventListener("leavepictureinpicture", onLeave);
+			video.removeEventListener("webkitpresentationmodechanged", onLeave);
+			this.disarmPipWatch = null;
+		};
+	}
 	async start() {
 		log.debug(`start() called — status=${this.status.value}, isReady=${this.isReady.value}`);
 		if (this.status.value !== "idle" && this.status.value !== "closed") {
@@ -3308,6 +3341,7 @@ var StreamConnection = class {
 		this.offTabVisible = void 0;
 		this.offTabPaused?.();
 		this.offTabPaused = void 0;
+		this.disarmPipWatch?.();
 		const video = this.videoElement.value;
 		if (video) {
 			if (this.onVideoPauseBound) video.removeEventListener("pause", this.onVideoPauseBound);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@camera.ui/browser",
-  "version": "0.0.186",
+  "version": "0.0.189",
   "description": "camera.ui browser client",
   "author": "seydx (https://github.com/cameraui/clients)",
   "type": "module",
@@ -39,7 +39,7 @@
   "devDependencies": {
     "@camera.ui/logger": "file:../../packages/logger",
     "@camera.ui/rpc": "^1.0.12",
-    "@camera.ui/sdk": "~1.2.36",
+    "@camera.ui/sdk": "~1.2.37",
     "@camera.ui/transport": "file:../../packages/transport",
     "@eneris/push-receiver": "^4.3.1",
     "@microsoft/api-extractor": "^7.59.1",