overmux 0.0.8 → 0.0.10

package/dist/exports/client.js

@@ -3,7 +3,7 @@ import { a as notificationSchema, c as parseDeepLink, l as resolveOvermuxReturnT
 import { z } from "zod";
 import { QueryClient, QueryClientProvider, useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
 import { Component, createContext, createElement, useCallback, useContext, useEffect, useMemo, useReducer, useRef, useState, useSyncExternalStore } from "react";
-import { formatKeyBinding, keyBindingSchema, matchesKeyBinding, platformBinding } from "@overmux/keybindings";
+import { formatShortcutBinding, keyBindingSchema, keyBindingSequence, matchesKeyBinding, matchesShortcutBindingPrefix, normalizedShortcutBinding, shortcutBindingSchema } from "@overmux/keybindings";
 import { createPortal } from "react-dom";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 //#region src/internal/shared/background-notifications.ts
@@ -320,7 +320,6 @@ const writeClipboardText = async (text) => {
 };
 //#endregion
 //#region src/internal/client/client-definition.ts
-const shortcutBindingSchema = z.union([keyBindingSchema, z.array(keyBindingSchema).min(2)]);
 const commandBindingSchema = z.union([shortcutBindingSchema, z.object({
 	binding: shortcutBindingSchema,
 	when: z.object({ media: z.string().trim().min(1) })
@@ -329,7 +328,6 @@ const chordPrefixSchema = z.object({
 	binding: keyBindingSchema,
 	unmatched: z.literal("replay-to-focused-input")
 });
-const formatShortcutBinding = (binding) => typeof binding === "string" ? formatKeyBinding(binding) : binding.map(formatKeyBinding).join(" ");
 const validateBindings = (bindings) => bindings?.forEach((binding) => commandBindingSchema.parse(binding));
 const defineCommandRegistry = () => (commands) => Object.fromEntries(Object.entries(commands).map(([id, command]) => {
 	validateBindings(command.defaultBindings);
@@ -452,9 +450,95 @@ const useCanonicalInput = (input) => {
 	const key = inputKey(input);
 	return useMemo(() => key ? JSON.parse(key) : void 0, [key]);
 };
-const useResourceById = (id, input, skipped) => {
+const pendingResourceInvalidations = /* @__PURE__ */ new WeakSet();
+const invalidateResource = ({ queryClient, queryKey }) => {
+	const query = queryClient.getQueryCache().find({
+		exact: true,
+		queryKey
+	});
+	if (query && query.state.fetchStatus !== "idle") {
+		pendingResourceInvalidations.add(query);
+		return;
+	}
+	if (query) pendingResourceInvalidations.delete(query);
+	queryClient.invalidateQueries({
+		exact: true,
+		queryKey
+	});
+};
+const flushResourceInvalidation = ({ queryClient, queryKey }) => {
+	const query = queryClient.getQueryCache().find({
+		exact: true,
+		queryKey
+	});
+	if (!query || query.state.fetchStatus !== "idle") return;
+	if (pendingResourceInvalidations.delete(query)) queryClient.invalidateQueries({
+		exact: true,
+		queryKey
+	});
+};
+const useResourceInvalidation = ({ queryKey, skipped }) => {
+	const [id, canonicalInput] = queryKey;
 	const { manifest, overmuxServerApi } = useRuntime();
 	const queryClient = useQueryClient();
+	const invalidate = useCallback(() => invalidateResource({
+		queryClient,
+		queryKey
+	}), [queryClient, queryKey]);
+	useEffect(() => {
+		if (skipped) return;
+		let active = true;
+		const cache = queryClient.getQueryCache();
+		const observedQuery = cache.find({
+			exact: true,
+			queryKey
+		});
+		const unsubscribe = cache.subscribe((event) => {
+			if (event.type === "updated" && event.query === observedQuery && event.query.state.fetchStatus === "idle" && pendingResourceInvalidations.has(event.query)) queueMicrotask(() => {
+				if (active) flushResourceInvalidation({
+					queryClient,
+					queryKey
+				});
+			});
+		});
+		flushResourceInvalidation({
+			queryClient,
+			queryKey
+		});
+		return () => {
+			active = false;
+			unsubscribe();
+		};
+	}, [
+		queryClient,
+		queryKey,
+		skipped
+	]);
+	useEffect(() => {
+		if (skipped || !manifest.resources.includes(id)) return;
+		let active = true;
+		const unsubscribe = overmuxServerApi.subscribeResource({
+			id,
+			input: canonicalInput,
+			onError: () => active && invalidate(),
+			onInvalidate: () => active && invalidate()
+		});
+		return () => {
+			active = false;
+			unsubscribe();
+		};
+	}, [
+		manifest.resources,
+		canonicalInput,
+		id,
+		invalidate,
+		overmuxServerApi,
+		skipped
+	]);
+	return invalidate;
+};
+const useResourceById = (id, input, skipped) => {
+	const { overmuxServerApi } = useRuntime();
 	const canonicalInput = useCanonicalInput(input);
 	const queryKey = useMemo(() => [id, canonicalInput], [canonicalInput, id]);
 	const query = useQuery({
@@ -465,32 +549,10 @@ const useResourceById = (id, input, skipped) => {
 		}),
 		queryKey
 	});
-	useEffect(() => !skipped && manifest.resources.includes(id) ? overmuxServerApi.subscribeResource({
-		id,
-		input: canonicalInput,
-		onError: () => void queryClient.invalidateQueries({
-			exact: true,
-			queryKey
-		}),
-		onInvalidate: () => void queryClient.invalidateQueries({
-			exact: true,
-			queryKey
-		})
-	}) : void 0, [
-		manifest.resources,
-		canonicalInput,
-		id,
-		overmuxServerApi,
-		queryClient,
+	const refetch = useResourceInvalidation({
 		queryKey,
 		skipped
-	]);
-	const refetch = useCallback(() => {
-		queryClient.invalidateQueries({
-			exact: true,
-			queryKey
-		});
-	}, [queryClient, queryKey]);
+	});
 	if (skipped) return;
 	if (query.status === "pending") return {
 		refetch,
@@ -855,12 +917,6 @@ const installDeepLinkNavigation = ({ getInstance, navigate = defaultNavigate })
 };
 //#endregion
 //#region src/internal/client/shortcuts.tsx
-const bindingSequence = (binding) => typeof binding === "string" ? [binding] : [...binding];
-const normalizedBinding = (binding) => bindingSequence(binding).map((key) => platformBinding(key));
-const sequenceMatches = (binding, pending, event) => {
-	const sequence = normalizedBinding(binding);
-	return sequence.length > pending.length && pending.every((key, index) => sequence[index] === key) && matchesKeyBinding(sequence[pending.length], event);
-};
 const isTextInput = (element) => element instanceof HTMLInputElement || element instanceof HTMLSelectElement || element instanceof HTMLTextAreaElement || element instanceof HTMLElement && (element.isContentEditable || element.getAttribute("role") === "textbox");
 const acceptsTextInput = (bindings) => {
 	if (!(document.activeElement instanceof Element)) return false;
@@ -868,7 +924,7 @@ const acceptsTextInput = (bindings) => {
 	if (!terminal) return false;
 	if (terminal.closest("[data-copy-mode]")) return true;
 	return bindings.some((binding) => {
-		const sequence = bindingSequence(binding);
+		const sequence = keyBindingSequence(binding);
 		return sequence.length > 1 || sequence[0]?.startsWith("F") || sequence[0]?.includes("+");
 	});
 };
@@ -966,8 +1022,8 @@ const ShortcutHost = ({ children, definition, registrations, registrationRevisio
 		window.addEventListener("focusin", refreshFocus);
 		return () => window.removeEventListener("focusin", refreshFocus);
 	}, []);
+	const shortcuts = flattenShortcuts(definition, (media) => window.matchMedia(media).matches);
 	useEffect(() => {
-		const shortcuts = flattenShortcuts(definition, (media) => window.matchMedia(media).matches);
 		let pending = [];
 		let pendingEvents = [];
 		let pendingTarget;
@@ -997,7 +1053,11 @@ const ShortcutHost = ({ children, definition, registrations, registrationRevisio
 				clearPending();
 				return;
 			}
-			const matches = shortcuts.flatMap((shortcut) => shortcut.bindings.filter((binding) => sequenceMatches(binding, pending, event) && canRunShortcut(shortcut, event, registrations)).map((binding) => ({
+			const matches = shortcuts.flatMap((shortcut) => shortcut.bindings.filter((binding) => matchesShortcutBindingPrefix({
+				binding,
+				input: event,
+				pending
+			}) && canRunShortcut(shortcut, event, registrations)).map((binding) => ({
 				binding,
 				shortcut
 			})));
@@ -1009,14 +1069,14 @@ const ShortcutHost = ({ children, definition, registrations, registrationRevisio
 				}
 				return;
 			}
-			const complete = matches.find(({ binding }) => normalizedBinding(binding).length === pending.length + 1);
+			const complete = matches.find(({ binding }) => normalizedShortcutBinding(binding).length === pending.length + 1);
 			if (complete) {
 				clearPending();
 				if (runShortcut(complete.shortcut, event, registrations)) event.stopPropagation();
 				return;
 			}
 			if (!pending.length) pendingTarget = definition.chordPrefixes?.some((prefix) => matchesKeyBinding(prefix.binding, event)) ? selectShortcutInputTarget(inputTargets, document.activeElement) : void 0;
-			pending = [...pending, normalizedBinding(matches[0].binding)[pending.length]];
+			pending = [...pending, normalizedShortcutBinding(matches[0].binding)[pending.length]];
 			pendingEvents = [...pendingEvents, event];
 			event.preventDefault();
 			event.stopPropagation();
@@ -1842,6 +1902,118 @@ const OvermuxHost = ({ definition }) => /* @__PURE__ */ jsx(OvermuxThemeScope, {
 	children: location.pathname === "/_overmux/settings" ? /* @__PURE__ */ jsx(HostedSettingsPage, {}) : location.pathname === "/_overmux/logout" ? /* @__PURE__ */ jsx(HostedLogoutPage, {}) : /* @__PURE__ */ jsx(OvermuxRuntime, { definition })
 });
 //#endregion
-export { OvermuxHost, OvermuxPortal, OvermuxThemeScope, createOvermuxHooks, defineCommandRegistry, defineOvermuxClient, disableBackgroundNotifications, enableBackgroundNotifications, formatShortcutBinding, readClipboardText, skipToken, useCommand, useCommands, useShortcutInputTarget, writeClipboardText };
+//#region src/internal/client/native-web-view.tsx
+const command = async (view, input, url) => {
+	try {
+		await view.bridge.command(input);
+	} catch (error) {
+		view.report({
+			url,
+			code: "ERR_DESKTOP_BRIDGE",
+			message: String(error)
+		});
+	}
+};
+const trackBounds = (element, view) => {
+	let previous = "";
+	let frame = 0;
+	const measure = () => {
+		const rect = element.getBoundingClientRect();
+		const visible = !document.hidden && element.checkVisibility({
+			opacityProperty: true,
+			visibilityProperty: true
+		});
+		const bounds = {
+			x: Math.round(rect.x),
+			y: Math.round(rect.y),
+			width: visible ? Math.max(0, Math.round(rect.width)) : 0,
+			height: visible ? Math.max(0, Math.round(rect.height)) : 0
+		};
+		const key = JSON.stringify(bounds);
+		if (key !== previous) {
+			previous = key;
+			view.bridge.setBounds(view.id, bounds);
+		}
+	};
+	const tick = () => {
+		measure();
+		frame = requestAnimationFrame(tick);
+	};
+	tick();
+	document.addEventListener("visibilitychange", measure);
+	return () => {
+		cancelAnimationFrame(frame);
+		document.removeEventListener("visibilitychange", measure);
+	};
+};
+const NativeWebView = ({ url, className, style, fallback, onLoadError, allowedHttpOrigins = [], passthroughBindings = [] }) => {
+	const bridge = typeof window === "undefined" || window.overmuxHost?.version !== 1 || window.overmuxHost.nativeWebView?.version !== 1 ? void 0 : window.overmuxHost.nativeWebView;
+	const element = useRef(null);
+	const mounted = useRef(void 0);
+	const latest = useRef({
+		url,
+		onLoadError
+	});
+	latest.current = {
+		url,
+		onLoadError
+	};
+	const origins = JSON.stringify(allowedHttpOrigins);
+	const bindings = JSON.stringify(passthroughBindings);
+	useEffect(() => {
+		if (!bridge || !element.current) return;
+		const view = {
+			id: crypto.randomUUID(),
+			active: true,
+			bridge,
+			report: (error) => {
+				queueMicrotask(() => {
+					if (view.active) latest.current.onLoadError?.(error);
+				});
+			}
+		};
+		mounted.current = view;
+		const unsubscribe = bridge.onLoadError(({ id, error }) => {
+			if (id === view.id) view.report(error);
+		});
+		command(view, {
+			type: "create",
+			id: view.id
+		}, latest.current.url);
+		const stopTracking = trackBounds(element.current, view);
+		return () => {
+			view.active = false;
+			mounted.current = void 0;
+			stopTracking();
+			unsubscribe();
+			command(view, {
+				type: "destroy",
+				id: view.id
+			}, latest.current.url);
+		};
+	}, [bridge]);
+	useEffect(() => {
+		const view = mounted.current;
+		if (view) command(view, {
+			type: "configure",
+			id: view.id,
+			url,
+			allowedHttpOrigins: JSON.parse(origins),
+			passthroughBindings: JSON.parse(bindings)
+		}, url);
+	}, [
+		bindings,
+		bridge,
+		url,
+		origins
+	]);
+	return bridge ? /* @__PURE__ */ jsx("div", {
+		ref: element,
+		className,
+		style
+	}) : /* @__PURE__ */ jsx(Fragment, { children: fallback });
+};
+//#endregion
+export { NativeWebView, OvermuxHost, OvermuxPortal, OvermuxThemeScope, createOvermuxHooks, defineCommandRegistry, defineOvermuxClient, disableBackgroundNotifications, enableBackgroundNotifications, formatShortcutBinding, readClipboardText, skipToken, useCommand, useCommands, useShortcutInputTarget, writeClipboardText };
 
 //# sourceMappingURL=client.js.map