@camera.ui/browser 0.0.173 → 0.0.174

package/dist/index.d.ts

@@ -290,8 +290,8 @@ export declare interface CoreManagerInterface {
     getFFmpegPath(): Promise<string>;
     getServerAddresses(): Promise<string[]>;
     getCloudServerId(): Promise<string>;
-    getPlugin(pluginName: string): Promise<PluginInfo | undefined>;
-    getPluginsByInterface(interfaceName: PluginInterface): Promise<PluginInfo[]>;
+    getPlugin(pluginName: string): Promise<HostPluginInfo | undefined>;
+    getPluginsByInterface(interfaceName: PluginInterface): Promise<HostPluginInfo[]>;
 }
 
 export declare interface CoreManagerNamespaces {
@@ -381,6 +381,10 @@ export declare function getSnapshotUrl(cameraId: string): string | undefined;
 
 declare type HiddenCallback = () => void;
 
+declare interface HostPluginInfo extends PluginInfo {
+    running: boolean;
+}
+
 /* Excluded from this release type: HumidityInfoProperties */
 
 /* Excluded from this release type: HumidityProperty */

package/dist/index.js

@@ -459,7 +459,8 @@ function clearSnapshotCache() {
 	timestampCache.clear();
 }
 function useSnapshot(cameraIdOrName) {
-	const { isConnected } = useCameraUi();
+	const cameraUi = useCameraUi();
+	const { isConnected } = cameraUi;
 	const deviceManager = useDeviceManager();
 	const snapshot = shallowRef();
 	const _isLoading = ref(false);
@@ -510,9 +511,9 @@ function useSnapshot(cameraIdOrName) {
 			heldDeviceId = void 0;
 		}
 	}
-	async function loadSnapshot(id) {
+	async function loadSnapshot(id, skipCache = false) {
 		if (!isConnected.value || !id) return;
-		const cached = snapshotCache.get(id);
+		const cached = skipCache ? void 0 : snapshotCache.get(id);
 		if (cached) {
 			snapshot.value = cached;
 			initialLoadDone.value = true;
@@ -585,7 +586,15 @@ function useSnapshot(cameraIdOrName) {
 			snapshot.value = void 0;
 		}
 	}, { immediate: true });
+	const onReconnected = () => {
+		const idOrName = toValue(cameraIdOrName);
+		if (isCameraDisabled(idOrName)) return;
+		const id = typeof idOrName === "string" ? idOrName : idOrName._id;
+		if (id) loadSnapshot(id, true);
+	};
+	cameraUi.on("reconnected", onReconnected);
 	tryOnScopeDispose(() => {
+		cameraUi.off("reconnected", onReconnected);
 		unsubscribe?.();
 		releaseHeldDevice();
 	});
@@ -942,9 +951,16 @@ function useCameraById(cameraIdOrName) {
 }
 //#endregion
 //#region src/composables/usePlugin.ts
+var RETRY_BASE_MS = 2e3;
+var RETRY_MAX_MS = 3e4;
 var pluginCache = createDebouncedCache({ releaseDelay: 1e3 });
 var pendingLoads = /* @__PURE__ */ new Map();
 var instances = /* @__PURE__ */ new Set();
+var reloaders = /* @__PURE__ */ new Map();
+var retryTimers = /* @__PURE__ */ new Map();
+var retryAttempts = /* @__PURE__ */ new Map();
+var statusClient;
+var statusUnsubscribe;
 function clearPluginCache() {
 	pluginCache.clear();
 	pendingLoads.clear();
@@ -952,6 +968,44 @@ function clearPluginCache() {
 		reset();
 	} catch {}
 }
+function notifyReloaders(name) {
+	for (const reload of [...reloaders.get(name) ?? []]) reload();
+}
+function stopRetry(name) {
+	const timer = retryTimers.get(name);
+	if (timer) clearTimeout(timer);
+	retryTimers.delete(name);
+	retryAttempts.delete(name);
+}
+function scheduleRetry(name) {
+	if (retryTimers.has(name)) return;
+	const attempt = retryAttempts.get(name) ?? 0;
+	retryAttempts.set(name, attempt + 1);
+	const timer = setTimeout(() => {
+		retryTimers.delete(name);
+		notifyReloaders(name);
+	}, Math.min(RETRY_BASE_MS * 2 ** attempt, RETRY_MAX_MS));
+	retryTimers.set(name, timer);
+}
+function handleStatusMessage(message) {
+	if (message?.type !== "pluginStatusChanged") return;
+	const { pluginName, running } = message.data;
+	if (!running) pluginCache.forceRelease(pluginName);
+	stopRetry(pluginName);
+	notifyReloaders(pluginName);
+}
+async function ensureStatusSubscription(rpc) {
+	const client = rpc.value;
+	if (!client || client === statusClient) return;
+	statusUnsubscribe?.();
+	statusUnsubscribe = void 0;
+	statusClient = client;
+	try {
+		statusUnsubscribe = await client.subscribe(NamespaceManager.coreManagerNamespaces().coreManagerSubject, handleStatusMessage);
+	} catch {
+		statusClient = void 0;
+	}
+}
 function usePlugin(pluginName) {
 	const { rpc, isConnected } = useCameraUi();
 	const plugin = shallowRef();
@@ -960,6 +1014,7 @@ function usePlugin(pluginName) {
 	const initialLoadDone = ref(false);
 	const error = ref();
 	let currentPluginName;
+	let watchedName;
 	function acquirePlugin(name) {
 		if (pluginCache.has(name)) return pluginCache.acquire(name, () => {
 			throw new Error("Should not create - already cached");
@@ -968,48 +1023,95 @@ function usePlugin(pluginName) {
 	function releasePlugin(name) {
 		pluginCache.release(name);
 	}
-	async function loadPlugin(name) {
+	function watchPlugin(name) {
+		if (watchedName === name) return;
+		if (watchedName) unwatchPlugin(watchedName);
+		const set = reloaders.get(name) ?? /* @__PURE__ */ new Set();
+		set.add(reload);
+		reloaders.set(name, set);
+		watchedName = name;
+	}
+	function unwatchPlugin(name) {
+		const set = reloaders.get(name);
+		if (set) {
+			set.delete(reload);
+			if (set.size === 0) {
+				reloaders.delete(name);
+				stopRetry(name);
+			}
+		}
+		if (watchedName === name) watchedName = void 0;
+	}
+	function reload() {
+		const name = toValue(pluginName);
+		if (name) loadPlugin(name, true);
+	}
+	function markUnavailable(name) {
+		if (currentPluginName) {
+			releasePlugin(currentPluginName);
+			currentPluginName = void 0;
+		}
+		plugin.value = void 0;
+		contract.value = void 0;
+		scheduleRetry(name);
+	}
+	function adopt(name, cached) {
+		currentPluginName = name;
+		plugin.value = cached.proxy;
+		contract.value = cached.contract;
+		error.value = void 0;
+		stopRetry(name);
+	}
+	async function loadPlugin(name, silent = false) {
 		if (!isConnected.value || !name) return;
 		if (currentPluginName && currentPluginName !== name) {
+			unwatchPlugin(currentPluginName);
 			releasePlugin(currentPluginName);
 			plugin.value = void 0;
 			contract.value = void 0;
 			currentPluginName = void 0;
 		}
+		watchPlugin(name);
+		ensureStatusSubscription(rpc);
+		if (currentPluginName === name && !pluginCache.has(name)) {
+			currentPluginName = void 0;
+			plugin.value = void 0;
+			contract.value = void 0;
+		} else if (currentPluginName === name && plugin.value) return;
 		const cached = acquirePlugin(name);
 		if (cached) {
-			currentPluginName = name;
-			plugin.value = cached.proxy;
-			contract.value = cached.contract;
+			adopt(name, cached);
 			initialLoadDone.value = true;
 			return;
 		}
 		const pending = pendingLoads.get(name);
 		if (pending) {
-			_isLoading.value = true;
+			if (!silent) _isLoading.value = true;
 			try {
-				if (await pending && toValue(pluginName) === name) {
+				const result = await pending;
+				if (toValue(pluginName) !== name) return;
+				if (result) {
 					const cachedAfterPending = acquirePlugin(name);
-					if (cachedAfterPending) {
-						currentPluginName = name;
-						plugin.value = cachedAfterPending.proxy;
-						contract.value = cachedAfterPending.contract;
-					}
-				}
+					if (cachedAfterPending) adopt(name, cachedAfterPending);
+				} else markUnavailable(name);
 			} catch (err) {
-				error.value = err instanceof Error ? err : new Error(String(err));
+				if (!silent) error.value = err instanceof Error ? err : new Error(String(err));
+				markUnavailable(name);
 			} finally {
-				_isLoading.value = false;
+				if (!silent) _isLoading.value = false;
 				initialLoadDone.value = true;
 			}
 			return;
 		}
-		_isLoading.value = true;
-		error.value = void 0;
+		if (!silent) {
+			_isLoading.value = true;
+			error.value = void 0;
+		}
 		const loadPromise = rpcCall(rpc, async (client) => {
 			const coreNamespaces = NamespaceManager.coreManagerNamespaces();
 			const pluginInfo = await client.createProxy(coreNamespaces.coreManagerRpc).getPlugin(name);
 			if (!pluginInfo) throw new Error(`Plugin "${name}" not found`);
+			if (pluginInfo.running === false) return;
 			const pluginNamespaces = NamespaceManager.pluginNamespaces(pluginInfo.id);
 			return {
 				proxy: client.createProxy(pluginNamespaces.pluginChildRpc),
@@ -1025,17 +1127,14 @@ function usePlugin(pluginName) {
 					pluginCache.release(name);
 					return;
 				}
-				currentPluginName = name;
-				plugin.value = result.proxy;
-				contract.value = result.contract;
-			}
+				adopt(name, result);
+			} else if (toValue(pluginName) === name) markUnavailable(name);
 		} catch (err) {
-			error.value = err instanceof Error ? err : new Error(String(err));
-			plugin.value = void 0;
-			contract.value = void 0;
+			if (!silent) error.value = err instanceof Error ? err : new Error(String(err));
+			markUnavailable(name);
 		} finally {
 			pendingLoads.delete(name);
-			_isLoading.value = false;
+			if (!silent) _isLoading.value = false;
 			initialLoadDone.value = true;
 		}
 	}
@@ -1072,6 +1171,7 @@ function usePlugin(pluginName) {
 		}
 		if (connected && name && currentClient) await loadPlugin(name);
 		else if ((!connected || !currentClient) && currentPluginName) {
+			unwatchPlugin(currentPluginName);
 			releasePlugin(currentPluginName);
 			plugin.value = void 0;
 			contract.value = void 0;
@@ -1080,7 +1180,9 @@ function usePlugin(pluginName) {
 	}, { immediate: true });
 	tryOnScopeDispose(() => {
 		instances.delete(resetInstance);
+		unwatchPlugin(toValue(pluginName));
 		if (currentPluginName) {
+			unwatchPlugin(currentPluginName);
 			releasePlugin(currentPluginName);
 			plugin.value = void 0;
 			contract.value = void 0;
@@ -2989,17 +3091,18 @@ var StreamConnection = class {
 				}
 			}, STREAM_CONFIG.WEBRTC.WS_CONNECT_TIMEOUT, { immediate: false });
 			const connectTimeout = useTimeoutFn(() => {
-				if (this.webrtcHandler && !this.webrtcHandler.isConnected) if (this.requestedMode.value === "auto") {
-					this.webrtcHandler.close();
-					this.webrtcHandler = void 0;
-					this.activeMode.value = "mse";
-					if (this.mseHandler?.isReady) this.status.value = "connected";
-					else this.startMSE();
-				} else {
-					this.markSourceUndecodable();
-					this.restart();
-				}
-				else if (this.status.value === "connected" && !this.isPlaying.value && !this.abortController.signal.aborted && this.sourceLikelyH265()) this.handleNoFramesWhileConnected();
+				if (this.webrtcHandler && !this.webrtcHandler.isConnected) {
+					if (this.requestedMode.value === "auto") {
+						this.webrtcHandler.close();
+						this.webrtcHandler = void 0;
+						this.activeMode.value = "mse";
+						if (this.mseHandler?.isReady) this.status.value = "connected";
+						else this.startMSE();
+					} else {
+						this.markSourceUndecodable();
+						this.restart();
+					}
+				} else if (this.status.value === "connected" && !this.isPlaying.value && !this.abortController.signal.aborted && this.sourceLikelyH265()) this.handleNoFramesWhileConnected();
 			}, STREAM_CONFIG.WEBRTC.CONNECT_TIMEOUT, { immediate: false });
 			const mseConnectTimeout = useTimeoutFn(() => {
 				if (this.abortController.signal.aborted || this.status.value === "connected" || this.status.value === "closed") return;
@@ -3937,8 +4040,10 @@ function useCuiFullscreen(target, options = {}) {
 		if (!state) return;
 		fsRegistry.delete(el);
 		el.removeAttribute("data-cui-fullscreen");
-		if (state.parent) if (state.next && state.next.parentNode === state.parent) state.parent.insertBefore(el, state.next);
-		else state.parent.appendChild(el);
+		if (state.parent) {
+			if (state.next && state.next.parentNode === state.parent) state.parent.insertBefore(el, state.next);
+			else state.parent.appendChild(el);
+		}
 		state.wrapper.remove();
 		document.body.style.overflow = state.bodyOverflow;
 		document.documentElement.style.overflow = state.htmlOverflow;
@@ -4177,8 +4282,10 @@ function useCameraStream(options) {
 			videoElement.value = video;
 			cached.videoElementRef.value = video;
 			setupCachedStreamWatchers(cached.stream, video, camName);
-			if (shouldAutoStart() && autoStartReady.value && activityModeManager.mode.value === "always-on" && !isCameraDisabled.value) if (cached.stream.activeMode.value !== "mse") attachCachedStream(cached, video, camName);
-			else video.play().catch(() => {});
+			if (shouldAutoStart() && autoStartReady.value && activityModeManager.mode.value === "always-on" && !isCameraDisabled.value) {
+				if (cached.stream.activeMode.value !== "mse") attachCachedStream(cached, video, camName);
+				else video.play().catch(() => {});
+			}
 		} else if (camDevice) {
 			initialized.value = true;
 			registeredCamName = camName;
@@ -4343,14 +4450,18 @@ function useCameraStream(options) {
 	function applyCanvasStyles(canvas) {
 		const style = toValue(options.canvasStyle);
 		const cls = toValue(options.canvasClass);
-		if (style) if (typeof style === "string") canvas.style.cssText += ";" + style;
-		else if (Array.isArray(style)) {
-			for (const s of style) if (typeof s === "string") canvas.style.cssText += ";" + s;
-			else if (s) Object.assign(canvas.style, s);
-		} else Object.assign(canvas.style, style);
-		if (cls) if (typeof cls === "string") canvas.className = cls;
-		else if (Array.isArray(cls)) canvas.className = cls.filter(Boolean).join(" ");
-		else for (const [name, active] of Object.entries(cls)) canvas.classList.toggle(name, !!active);
+		if (style) {
+			if (typeof style === "string") canvas.style.cssText += ";" + style;
+			else if (Array.isArray(style)) {
+				for (const s of style) if (typeof s === "string") canvas.style.cssText += ";" + s;
+				else if (s) Object.assign(canvas.style, s);
+			} else Object.assign(canvas.style, style);
+		}
+		if (cls) {
+			if (typeof cls === "string") canvas.className = cls;
+			else if (Array.isArray(cls)) canvas.className = cls.filter(Boolean).join(" ");
+			else for (const [name, active] of Object.entries(cls)) canvas.classList.toggle(name, !!active);
+		}
 	}
 	if (!isolated && typeof IntersectionObserver !== "undefined") {
 		let visibilityObserver;
@@ -4401,14 +4512,18 @@ function useCameraStream(options) {
 			() => toValue(options.videoClass)
 		], ([video, style, cls]) => {
 			if (!video) return;
-			if (style) if (typeof style === "string") video.style.cssText += ";" + style;
-			else if (Array.isArray(style)) {
-				for (const s of style) if (typeof s === "string") video.style.cssText += ";" + s;
-				else if (s) Object.assign(video.style, s);
-			} else Object.assign(video.style, style);
-			if (cls) if (typeof cls === "string") video.className = cls;
-			else if (Array.isArray(cls)) video.className = cls.filter(Boolean).join(" ");
-			else for (const [name, active] of Object.entries(cls)) video.classList.toggle(name, active);
+			if (style) {
+				if (typeof style === "string") video.style.cssText += ";" + style;
+				else if (Array.isArray(style)) {
+					for (const s of style) if (typeof s === "string") video.style.cssText += ";" + s;
+					else if (s) Object.assign(video.style, s);
+				} else Object.assign(video.style, style);
+			}
+			if (cls) {
+				if (typeof cls === "string") video.className = cls;
+				else if (Array.isArray(cls)) video.className = cls.filter(Boolean).join(" ");
+				else for (const [name, active] of Object.entries(cls)) video.classList.toggle(name, active);
+			}
 		}, { immediate: true });
 		cleanupFns.push(stopVideoStyleWatch);
 	}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@camera.ui/browser",
-  "version": "0.0.173",
+  "version": "0.0.174",
   "description": "camera.ui browser client",
   "author": "seydx (https://github.com/cameraui/clients)",
   "type": "module",
@@ -39,17 +39,17 @@
   "devDependencies": {
     "@camera.ui/logger": "file:../../packages/logger",
     "@camera.ui/rpc": "^1.0.11",
-    "@camera.ui/sdk": "~1.2.30",
+    "@camera.ui/sdk": "~1.2.31",
     "@camera.ui/transport": "file:../../packages/transport",
     "@eneris/push-receiver": "^4.3.1",
-    "@microsoft/api-extractor": "^7.58.12",
+    "@microsoft/api-extractor": "^7.59.0",
     "@stylistic/eslint-plugin": "^5.10.0",
     "@types/webrtc": "^0.0.47",
     "@typescript-eslint/parser": "^8.67.0",
     "@vitejs/plugin-vue": "^6.0.8",
     "@vue/eslint-config-prettier": "^10.2.0",
     "@vue/eslint-config-typescript": "^14.9.0",
-    "@vue/language-core": "^3.3.10",
+    "@vue/language-core": "^3.3.11",
     "@vue/tsconfig": "^0.9.1",
     "@vueuse/core": "^14.4.0",
     "@webgpu/types": "^0.1.72",
@@ -61,11 +61,11 @@
     "typescript": "5.9.3",
     "typescript-eslint": "^8.67.0",
     "unplugin-dts": "^1.0.3",
-    "updates": "^18.0.3",
-    "vite": "^8.2.1",
+    "updates": "^18.0.5",
+    "vite": "^8.2.2",
     "vitest": "^4.1.11",
     "vue": "^3.5.41",
-    "vue-tsc": "^3.3.10"
+    "vue-tsc": "^3.3.11"
   },
   "overrides": {
     "@vue/language-core": "$@vue/language-core"