dsh-deeppilot 0.7.0 → 0.7.1

package/COMPATIBILITY.md

@@ -7,7 +7,7 @@ This file separates tested evidence from intended behavior. Passing unit tests d
 | Component | Baseline | Evidence |
 |---|---|---|
 | Node.js | 22 or newer | package engine and CI |
-| DSH CLI and Host API | the `0.1.5-rc.*` and `0.1.6-*`/`0.1.6` lines, `0.1.5-rc.1` minimum, for plugin `0.7.x` | plugin source typecheck, unit suite (240 tests) and `tsdown` build run against both the `0.1.5-rc.2` and the `0.1.6-alpha.1` package families; bridge and `/phone` protocol tests |
+| DSH CLI and Host API | the `0.1.5-rc.*` and `0.1.6-*`/`0.1.6` lines, `0.1.5-rc.1` minimum, for plugin `0.7.x` | plugin source typecheck, unit suite (265 tests) and `tsdown` build run against the `0.1.5-rc.2`, `0.1.6-alpha.1` and `0.1.6-alpha.2` package families; the `deeppilot/report` contribution registered through both the `0.1.6-alpha.1` and the `0.1.6-alpha.2` `TypertRegistry`; bridge and `/phone` protocol tests |
 | Host OS | macOS, Linux, Windows on packaged amd64/arm64 helper targets | helper checksums plus user-confirmed Windows/Linux Funnel launch and connection; local LAN validation remains part of alpha testing |
 | Remote access | Tailscale Funnel, ports 443/8443/10000 | helper and supervisor tests |
 | iOS | native DeepPilot client, protocol v2 | simulator build and v2 pairing/challenge evidence |
@@ -15,6 +15,7 @@ This file separates tested evidence from intended behavior. Passing unit tests d
 ## Protocol boundary
 
 - Protocol v2 is the only supported wire version. Existing protocol-v1 devices must pair again after upgrading.
+- The pairing QR now encodes a `deeppilot://pair` link, and the settings page shows that same string in one copy field. An app build that predates the link only parses the JSON payload, so it must be updated before pairing against this plugin; a link pasted into an older app is rejected instead of being half-applied. The current app still accepts the JSON payload.
 - Plugin `0.7.x` serves the LAN listener over self-signed TLS only; devices paired over LAN with `0.6.x` or older must pair again so the app receives the certificate fingerprint. The DSH web server no longer carries `/phone` compatibility routes. Funnel pairings are unaffected.
 - Bearer authentication, URL credentials, and first-frame shared tokens are rejected. A supported client registers a P-256 public key through `/phone/pair` and signs each WebSocket challenge.
 - Without a compatible embedded helper, the core bridge and trusted-LAN mode can still run; remote Funnel reports `unavailable`.
@@ -36,6 +37,28 @@ This file separates tested evidence from intended behavior. Passing unit tests d
   from the Cordis context (`sessionController`, `workspaceController`,
   `directoryPickerController`, `sessionProjections`) and the `session/event`
   and `api-session/*` events, all of which kept their `0.1.5-rc` shape.
+- DSH `0.1.6-alpha.2` changed the strict codec shape carried by an
+  `InvocationDescriptor`. Through `0.1.6-alpha.1` a descriptor published the
+  schema value itself and every consumer called `codec.schema.parse(value)`;
+  `alpha.2` instead validates a lazy `create()` factory at registration and the
+  Gateway parses through `codec.create().parse(value)`. A codec carrying only
+  `schema` is rejected by the `alpha.2` registry
+  (`typert: … strict codec has no create() factory`), which aborts plugin
+  activation. One `strictCodec()` helper in `src/report-wire.ts` emits both
+  keys — the same hand-written, dependency-free codec — so a single published
+  package registers and parses on either generation, and
+  `tests/report-wire.test.ts` pins both access paths.
+  The other `alpha.2` Typert change — a contributed schema's materialized
+  `schema` becoming a lazy `create()` factory — does not apply here: this
+  Remote contributes no schemas, which the same test asserts.
+- DSH `0.1.6-alpha.2` made runtime plugin removal real, through both the
+  Plugin Manager and the client entry reconciler. Every long-lived resource is
+  registered through `ctx.effect`, and the settings-page stylesheet stamps
+  `data-plugin="dsh-deeppilot"` so the module system's `removeOwnedStyles()`
+  can delete it; the module system only auto-claims styles present during
+  factory materialization, while this sheet is injected from `apply()`.
+  Without that stamp, disabling the plugin would leave its sheet styling the
+  page.
 - The compatibility facade converts the
   current Session controller's raw event arrays into the stable wrapped
   history entries consumed by the phone bridge. Sessions persisted by earlier

package/README.md

@@ -58,8 +58,12 @@ dsh web
 ```
 
 After DSH restarts, open **Settings → DeepPilot**, enable the connection, show
-the pairing QR code, and scan it in the DeepPilot app. The same panel also
-shows a copyable pairing code for Simulator or manual entry.
+the pairing QR code, and scan it in the DeepPilot app. Below the QR code the same
+panel shows one copyable piece of pairing info (address, single-use code and
+certificate fingerprint) that can be pasted into the app in one step — useful for
+Simulator or when the camera is unavailable. Switching between the LAN and
+public address issues a matching new QR code and string immediately, with the
+panel staying open.
 
 LAN access is enabled by default on the plugin's independent TCP port `3098`
 and is TLS-only. The plugin generates a self-signed certificate on first start

package/README.zh-CN.md

@@ -54,7 +54,9 @@ dsh web
 ```
 
 DSH 重启后，打开 **设置 → DeepPilot**，启用连接并显示配对二维码，然后在
-DeepPilot App 中扫码。同一面板也会显示可复制的配对码，供模拟器或手动输入使用。
+DeepPilot App 中扫码。二维码下方同时显示一段可复制的「配对信息」（含地址、一次性配对码
+与证书指纹），在 App 里粘贴一次即可完成配对，适合模拟器或相机不可用时使用；在「内网 /
+公网」之间切换会立即为所选地址生成新的二维码与配对信息，面板保持展开。
 
 局域网连接默认使用插件独立的 TCP `3098` 端口，且只提供 TLS。插件首次启动时生成
 自签证书（私钥位于 `$DSH_HOME/deeppilot/lan-tls/`），配对二维码携带其公钥指纹，

package/lib/client.js

@@ -286,6 +286,35 @@ window.__ModuleLoader__.load({
 			if (!Array.isArray(value) || value.some((scope) => typeof scope !== "string" || !DEVICE_SCOPES.includes(scope))) reject("scopes");
 			return normalizeDeviceScopes(value);
 		} };
+		const booleanSchema = { parse(value) {
+			if (typeof value !== "boolean") reject("boolean");
+			return value;
+		} };
+		/**
+		* One strict boundary codec carrying both generation shapes of the supported
+		* `0.1.x` host family.
+		*
+		* Through `0.1.6-alpha.1` a descriptor published the schema value itself and
+		* every consumer parsed through `codec.schema.parse(value)`. `0.1.6-alpha.2`
+		* switched to a lazily materialized process-realm factory: `TypertRegistry`
+		* now rejects a strict codec without `create()`, and the Gateway parses
+		* through `codec.create().parse(value)`.
+		*
+		* Publishing both keys — `create()` returning the same hand-written,
+		* dependency-free codec — keeps one package valid across the entire declared
+		* peer range instead of forking the wire contract per host generation. The
+		* cast is required because each generation's `TypertCodec` declares only its
+		* own key, so a fresh object literal carrying both fails excess-property
+		* checking against either one.
+		*/
+		function strictCodec(typeSymbol, schema) {
+			return {
+				mode: "strict",
+				typeSymbol,
+				schema,
+				create: () => schema
+			};
+		}
 		const REPORT_REMOTE_CONTRIBUTION = {
 			package: REPORT_REMOTE_PACKAGE,
 			descriptors: [
@@ -296,11 +325,7 @@ window.__ModuleLoader__.load({
 					method: "report",
 					invocation: { kind: "direct" },
 					parameters: [],
-					result: {
-						mode: "strict",
-						typeSymbol: `${REPORT_REMOTE_PACKAGE}#DeepPilotReport`,
-						schema: reportSchema
-					}
+					result: strictCodec(`${REPORT_REMOTE_PACKAGE}#DeepPilotReport`, reportSchema)
 				},
 				{
 					id: `${REPORT_REMOTE_PACKAGE}#${BEGIN_PAIRING_ENDPOINT}`,
@@ -309,11 +334,7 @@ window.__ModuleLoader__.load({
 					method: "beginPairing",
 					invocation: { kind: "direct" },
 					parameters: [],
-					result: {
-						mode: "strict",
-						typeSymbol: `${REPORT_REMOTE_PACKAGE}#PairingGrantSnapshot`,
-						schema: pairingGrantSchema
-					}
+					result: strictCodec(`${REPORT_REMOTE_PACKAGE}#PairingGrantSnapshot`, pairingGrantSchema)
 				},
 				{
 					id: `${REPORT_REMOTE_PACKAGE}#${REVOKE_DEVICE_ENDPOINT}`,
@@ -325,20 +346,9 @@ window.__ModuleLoader__.load({
 						name: "deviceId",
 						wire: "deviceId",
 						source: "json",
-						codec: {
-							mode: "strict",
-							typeSymbol: `${REPORT_REMOTE_PACKAGE}#DeviceId`,
-							schema: deviceIdSchema
-						}
+						codec: strictCodec(`${REPORT_REMOTE_PACKAGE}#DeviceId`, deviceIdSchema)
 					}],
-					result: {
-						mode: "strict",
-						typeSymbol: `${REPORT_REMOTE_PACKAGE}#Boolean`,
-						schema: { parse(value) {
-							if (typeof value !== "boolean") reject("boolean");
-							return value;
-						} }
-					}
+					result: strictCodec(`${REPORT_REMOTE_PACKAGE}#Boolean`, booleanSchema)
 				},
 				{
 					id: `${REPORT_REMOTE_PACKAGE}#${SET_DEVICE_SCOPES_ENDPOINT}`,
@@ -350,26 +360,14 @@ window.__ModuleLoader__.load({
 						name: "deviceId",
 						wire: "deviceId",
 						source: "json",
-						codec: {
-							mode: "strict",
-							typeSymbol: `${REPORT_REMOTE_PACKAGE}#DeviceId`,
-							schema: deviceIdSchema
-						}
+						codec: strictCodec(`${REPORT_REMOTE_PACKAGE}#DeviceId`, deviceIdSchema)
 					}, {
 						name: "scopes",
 						wire: "scopes",
 						source: "json",
-						codec: {
-							mode: "strict",
-							typeSymbol: `${REPORT_REMOTE_PACKAGE}#DeviceScopes`,
-							schema: scopesSchema
-						}
+						codec: strictCodec(`${REPORT_REMOTE_PACKAGE}#DeviceScopes`, scopesSchema)
 					}],
-					result: {
-						mode: "strict",
-						typeSymbol: `${REPORT_REMOTE_PACKAGE}#DeviceScopes`,
-						schema: scopesSchema
-					}
+					result: strictCodec(`${REPORT_REMOTE_PACKAGE}#DeviceScopes`, scopesSchema)
 				},
 				{
 					id: `${REPORT_REMOTE_PACKAGE}#deeppilot/testRelay`,
@@ -378,11 +376,7 @@ window.__ModuleLoader__.load({
 					method: "testRelay",
 					invocation: { kind: "direct" },
 					parameters: [],
-					result: {
-						mode: "strict",
-						typeSymbol: `${REPORT_REMOTE_PACKAGE}#RelayTestResult`,
-						schema: relayTestSchema
-					}
+					result: strictCodec(`${REPORT_REMOTE_PACKAGE}#RelayTestResult`, relayTestSchema)
 				},
 				{
 					id: `${REPORT_REMOTE_PACKAGE}#deeppilot/testPush`,
@@ -391,11 +385,7 @@ window.__ModuleLoader__.load({
 					method: "testPush",
 					invocation: { kind: "direct" },
 					parameters: [],
-					result: {
-						mode: "strict",
-						typeSymbol: `${REPORT_REMOTE_PACKAGE}#PushTestResult`,
-						schema: pushTestSchema
-					}
+					result: strictCodec(`${REPORT_REMOTE_PACKAGE}#PushTestResult`, pushTestSchema)
 				}
 			]
 		};
@@ -506,14 +496,13 @@ window.__ModuleLoader__.load({
 				"pair.qrShow": "显示二维码",
 				"pair.qrHide": "隐藏二维码",
 				"pair.qrGenerating": "生成中…",
-				"pair.qrAutoHidden": "配对二维码已自动隐藏",
+				"pair.qrExpired": "配对码已过期，请重新显示二维码",
 				"pair.qrFailed": "二维码生成失败：",
-				"pair.codeLabel": "配对码（模拟器可手动输入）",
-				"pair.codeCopyDone": "配对码已复制",
-				"pair.codeCopyFailed": "配对码复制失败：",
-				"pair.publicCopyDone": "连接地址已复制",
-				"pair.publicCopyFailed": "复制失败：",
-				"pair.qrHint": "二维码包含{kind}地址、一次性配对码以及（内网时）证书指纹；配对码 5 分钟后失效，二维码将在 60 秒后自动隐藏。",
+				"pair.qrRetry": "重试",
+				"pair.infoLabel": "配对信息（复制一次，粘贴到 App 即可）",
+				"pair.infoCopyDone": "配对信息已复制",
+				"pair.infoCopyFailed": "配对信息复制失败：",
+				"pair.qrHint": "二维码与下面的「配对信息」内容相同：包含{kind}地址、一次性配对码、证书指纹（内网时）与主机标识。在局域网与公网之间切换会立即生成对应的新配对信息，配对码 5 分钟后失效。",
 				"advanced.summary": "高级信息",
 				"advanced.protocolVersion": "协议版本",
 				"advanced.serverVersion": "服务器版本",
@@ -690,14 +679,13 @@ window.__ModuleLoader__.load({
 				"pair.qrShow": "Show QR code",
 				"pair.qrHide": "Hide QR code",
 				"pair.qrGenerating": "Generating…",
-				"pair.qrAutoHidden": "Pairing QR auto-hidden",
+				"pair.qrExpired": "Pairing code expired — show the QR code again",
 				"pair.qrFailed": "QR generation failed: ",
-				"pair.codeLabel": "Pairing code (enter manually in Simulator)",
-				"pair.codeCopyDone": "Pairing code copied",
-				"pair.codeCopyFailed": "Failed to copy pairing code: ",
-				"pair.publicCopyDone": "Connection address copied",
-				"pair.publicCopyFailed": "Copy failed: ",
-				"pair.qrHint": "The QR contains a {kind} address, a single-use pairing code and, for LAN, the certificate fingerprint. The code expires after 5 minutes; the QR auto-hides after 60 seconds.",
+				"pair.qrRetry": "Retry",
+				"pair.infoLabel": "Pairing info (copy once, paste it in the app)",
+				"pair.infoCopyDone": "Pairing info copied",
+				"pair.infoCopyFailed": "Failed to copy pairing info: ",
+				"pair.qrHint": "The QR code and the pairing info below carry the same {kind} address, single-use code, certificate fingerprint (for LAN) and host identity. Switching between LAN and public issues a matching new string immediately; the code expires after 5 minutes.",
 				"advanced.summary": "Advanced info",
 				"advanced.protocolVersion": "Protocol version",
 				"advanced.serverVersion": "Server version",
@@ -948,11 +936,29 @@ window.__ModuleLoader__.load({
 			".pbb-versionFooter a{color:var(--dsw-alias-state-success-primary,#22a06b);text-decoration:none}",
 			".pbb-versionFooter a:hover{text-decoration:underline;text-underline-offset:2px}"
 		].join("\n");
+		/**
+		* Client bundle id, identical to the `window.__ModuleLoader__.load({ id })`
+		* identity emitted by tsdown.config.ts. DSH's module system owns style
+		* teardown by package id, so this tag must carry the same value.
+		*/
+		const PLUGIN_ID = "dsh-deeppilot";
+		/**
+		* Claim this plugin's page stylesheet against DSH's style ownership.
+		*
+		* `ClientModuleSystem` tags untagged `<style>` elements only during factory
+		* materialization; this sheet is injected from `apply()`, which runs after
+		* that point, so it would never be attributed to us. Stamping `data-plugin`
+		* ourselves lets the module system's `removeOwnedStyles(id)` delete the sheet
+		* when the plugin is unloaded at runtime — the Plugin Manager and the client
+		* entry reconciler both support live removal from 0.1.6-alpha.2 on, and an
+		* orphaned sheet would otherwise keep styling a page we no longer own.
+		*/
 		function injectCss() {
 			if (typeof document === "undefined") return;
 			const id = "dsh-deeppilot/page.css";
 			if (document.querySelector("style[data-plugin-css=\"" + id + "\"]") !== null) return;
 			const tag = document.createElement("style");
+			tag.setAttribute("data-plugin", PLUGIN_ID);
 			tag.setAttribute("data-plugin-css", id);
 			tag.textContent = CSS;
 			document.head.appendChild(tag);
@@ -3361,7 +3367,6 @@ window.__ModuleLoader__.load({
 				return SvgRenderer.render(data, opts);
 			});
 		})))(), 1);
-		const PAIRING_QR_TYPE = "deeppilot-pairing";
 		/** `sha256:` + base64url(SHA-256(SubjectPublicKeyInfo DER)) of the LAN certificate. */
 		const LAN_TLS_FINGERPRINT_PATTERN = /^sha256:[A-Za-z0-9_-]{43}$/;
 		function isLanTlsFingerprint(value) {
@@ -3400,23 +3405,105 @@ window.__ModuleLoader__.load({
 				return false;
 			}
 		}
-		/** Encode a short-lived, single-use pairing grant without URL credentials. */
-		function encodePairingQRPayload(host, grant, tlsFingerprint) {
-			const normalizedHost = host.trim();
-			if (!validTargetHost(normalizedHost)) throw new TypeError("pairing QR requires a valid HTTPS/WSS host");
+		/**
+		* One copyable string carrying everything the app needs to pair: host, the
+		* single-use code, the LAN certificate pin and the host audience.
+		*
+		* Users copy this once instead of moving three separate values, and the app
+		* accepts it from the paste field, a deep link and (from this version on) the
+		* QR code. Field names are short because the whole string ends up in a QR code
+		* and in a text field: `h` host, `c` code, `f` fingerprint, `a` audience,
+		* `e` expiry in milliseconds.
+		*/
+		function encodePairingLink(host, grant, tlsFingerprint) {
+			assertPairingInput(host, grant, tlsFingerprint);
+			const params = new URLSearchParams();
+			params.set("h", host.trim());
+			params.set("c", grant.code.trim());
+			if (tlsFingerprint !== void 0) params.set("f", tlsFingerprint);
+			params.set("a", grant.audience);
+			params.set("e", String(grant.expiresAt));
+			return `${PAIRING_LINK_PREFIX}?${params.toString()}`;
+		}
+		/** `deeppilot://pair` — the deep-link route the iOS app parses. */
+		const PAIRING_LINK_PREFIX = "deeppilot://pair";
+		function assertPairingInput(host, grant, tlsFingerprint) {
+			if (!validTargetHost(host.trim())) throw new TypeError("pairing QR requires a valid HTTPS/WSS host");
 			if (grant.code.trim().length < 32 || !Number.isInteger(grant.expiresAt) || grant.expiresAt <= Date.now()) throw new TypeError("pairing grant is invalid or expired");
 			if (!grant.audience.startsWith("deeppilot:")) throw new TypeError("pairing audience is invalid");
 			if (tlsFingerprint !== void 0 && !isLanTlsFingerprint(tlsFingerprint)) throw new TypeError("pairing TLS fingerprint is invalid");
-			const payload = {
-				v: 2,
-				type: PAIRING_QR_TYPE,
-				host: normalizedHost,
-				code: grant.code.trim(),
-				expiresAt: grant.expiresAt,
-				audience: grant.audience,
-				...tlsFingerprint !== void 0 ? { tlsFingerprint } : {}
+		}
+		//#endregion
+		//#region src/client/pairing-panel.ts
+		const initialPairingPanelState = {
+			target: null,
+			busy: false,
+			grant: null,
+			link: null,
+			qrDataURL: null,
+			message: "",
+			notice: "",
+			requestId: 0
+		};
+		function pairingPanelReduce(state, action) {
+			switch (action.type) {
+				case "show": return {
+					target: action.target,
+					busy: true,
+					grant: null,
+					link: null,
+					qrDataURL: null,
+					message: "",
+					notice: "",
+					requestId: action.requestId
+				};
+				case "issued":
+					if (action.requestId !== state.requestId) return state;
+					return {
+						...state,
+						busy: false,
+						grant: action.grant,
+						link: action.link,
+						qrDataURL: action.qrDataURL
+					};
+				case "failed":
+					if (action.requestId !== state.requestId) return state;
+					return {
+						...state,
+						busy: false,
+						grant: null,
+						link: null,
+						qrDataURL: null,
+						message: action.message
+					};
+				case "notice": return {
+					...state,
+					notice: action.message
+				};
+				case "dismissNotice": return state.notice === "" ? state : {
+					...state,
+					notice: ""
+				};
+				case "close": return {
+					...initialPairingPanelState,
+					requestId: state.requestId + 1,
+					message: action.message ?? ""
+				};
+			}
+		}
+		function pairingPanelView(state) {
+			const open = state.target !== null;
+			return {
+				open,
+				busy: state.busy,
+				failed: open && !state.busy && state.grant === null,
+				action: state.busy ? "pair.qrGenerating" : state.target === null ? "pair.qrShow" : "pair.qrHide",
+				target: state.target,
+				link: state.link,
+				qrDataURL: state.qrDataURL,
+				message: state.message,
+				notice: state.notice
 			};
-			return JSON.stringify(payload);
 		}
 		function normalizeFunnelConnectionLimit(value) {
 			return typeof value === "number" && Number.isInteger(value) && value >= 1 && value <= 16 ? value : 8;
@@ -3519,16 +3606,13 @@ window.__ModuleLoader__.load({
 		};
 		/** Slot component: hooks come from the slot renderer, named use<Key>. */
 		function DeepPilotSettingsPage(props) {
-			const [addressMessage, setAddressMessage] = (0, react.useState)("");
 			const [remoteLimitDraft, setRemoteLimitDraft] = (0, react.useState)(String(8));
 			const [remoteLimitMessage, setRemoteLimitMessage] = (0, react.useState)("");
 			const [localPortDraft, setLocalPortDraft] = (0, react.useState)(String(DEFAULT_LOCAL_PORT));
 			const [localPortMessage, setLocalPortMessage] = (0, react.useState)("");
 			const [selectedPairingHost, setSelectedPairingHost] = (0, react.useState)(null);
-			const [qrDataURL, setQRDataURL] = (0, react.useState)(null);
-			const [pairingGrant, setPairingGrant] = (0, react.useState)(null);
-			const [qrBusy, setQRBusy] = (0, react.useState)(false);
-			const [qrMessage, setQRMessage] = (0, react.useState)("");
+			const [pairingPanel, dispatchPairingPanel] = (0, react.useReducer)(pairingPanelReduce, initialPairingPanelState);
+			const qrRequestId = (0, react.useRef)(0);
 			const [relayTestBusy, setRelayTestBusy] = (0, react.useState)(false);
 			const [relayTestResult, setRelayTestResult] = (0, react.useState)(null);
 			const [relayTestError, setRelayTestError] = (0, react.useState)("");
@@ -3575,11 +3659,6 @@ window.__ModuleLoader__.load({
 					setRelayTestBusy(false);
 				});
 			};
-			(0, react.useEffect)(() => {
-				if (!addressMessage) return;
-				const timer = globalThis.setTimeout(() => setAddressMessage(""), 2500);
-				return () => globalThis.clearTimeout(timer);
-			}, [addressMessage]);
 			(0, react.useEffect)(() => {
 				if (!remoteLimitMessage) return;
 				const timer = globalThis.setTimeout(() => setRemoteLimitMessage(""), 4e3);
@@ -3591,19 +3670,21 @@ window.__ModuleLoader__.load({
 				return () => globalThis.clearTimeout(timer);
 			}, [localPortMessage]);
 			(0, react.useEffect)(() => {
-				if (qrDataURL === null) return;
+				if (pairingPanel.grant === null) return;
+				const remaining = Math.max(0, pairingPanel.grant.expiresAt - Date.now());
 				const timer = globalThis.setTimeout(() => {
-					setQRDataURL(null);
-					setPairingGrant(null);
-					setQRMessage(translateWith(props.t, "pair.qrAutoHidden"));
-				}, 1728e5);
+					dispatchPairingPanel({
+						type: "close",
+						message: translateWith(props.t, "pair.qrExpired")
+					});
+				}, remaining);
 				return () => globalThis.clearTimeout(timer);
-			}, [qrDataURL]);
+			}, [pairingPanel.grant]);
 			(0, react.useEffect)(() => {
-				if (!qrMessage) return;
-				const timer = globalThis.setTimeout(() => setQRMessage(""), 2500);
+				if (!pairingPanel.notice) return;
+				const timer = globalThis.setTimeout(() => dispatchPairingPanel({ type: "dismissNotice" }), 2500);
 				return () => globalThis.clearTimeout(timer);
-			}, [qrMessage]);
+			}, [pairingPanel.notice]);
 			const diag = [];
 			let report = null;
 			let enabled = true;
@@ -3705,50 +3786,75 @@ window.__ModuleLoader__.load({
 			};
 			const pairingTargets = report === null ? [] : selectPairingTargets(report.local, report.remote);
 			const pairingTarget = pairingTargets.find(({ host }) => host === selectedPairingHost) ?? pairingTargets[0] ?? null;
-			(0, react.useEffect)(() => {
-				setQRDataURL(null);
-				setPairingGrant(null);
-			}, [pairingTarget?.host]);
-			const copyRemoteURL = (url) => {
-				setAddressMessage("");
-				writeClipboard(props.t, url).then(() => {
-					setAddressMessage(translateWith(props.t, "pair.publicCopyDone"));
-				}, (error) => {
-					setAddressMessage(translateWith(props.t, "pair.publicCopyFailed") + (error instanceof Error ? error.message : String(error)));
+			const panel = pairingPanelView(pairingPanel);
+			/**
+			* Issue a grant and render the panel for one explicit target.
+			*
+			* The target is a parameter rather than component state on purpose: a click
+			* handler must not depend on whether React has already re-rendered with the
+			* newly selected host. A grant is bound to the host it was issued for, so
+			* switching between LAN and public always mints a fresh one.
+			*/
+			const showPairingQR = (target) => {
+				if (typeof props.beginPairing !== "function") return;
+				const requestId = qrRequestId.current + 1;
+				qrRequestId.current = requestId;
+				dispatchPairingPanel({
+					type: "show",
+					target,
+					requestId
 				});
-			};
-			const showPairingQR = () => {
-				if (typeof props.beginPairing !== "function" || pairingTarget === null) return;
-				setQRBusy(true);
-				setQRMessage("");
-				setQRDataURL(null);
-				setPairingGrant(null);
-				props.beginPairing().then(async (grant) => ({
-					grant,
-					svg: await import_browser.toString(encodePairingQRPayload(pairingTarget.host, grant, pairingTarget.tlsFingerprint), {
-						type: "svg",
-						errorCorrectionLevel: "M",
-						margin: 2,
-						width: 512
-					})
-				})).then(({ grant, svg }) => {
-					setPairingGrant(grant);
-					setQRDataURL("data:image/svg+xml;charset=utf-8," + encodeURIComponent(svg));
+				props.beginPairing().then(async (grant) => {
+					const link = encodePairingLink(target.host, grant, target.tlsFingerprint);
+					return {
+						grant,
+						link,
+						svg: await import_browser.toString(link, {
+							type: "svg",
+							errorCorrectionLevel: "M",
+							margin: 2,
+							width: 512
+						})
+					};
+				}).then(({ grant, link, svg }) => {
+					if (qrRequestId.current !== requestId) return;
+					dispatchPairingPanel({
+						type: "issued",
+						requestId,
+						grant,
+						link,
+						qrDataURL: "data:image/svg+xml;charset=utf-8," + encodeURIComponent(svg)
+					});
 				}, (error) => {
-					setQRMessage(translateWith(props.t, "pair.qrFailed") + (error instanceof Error ? error.message : String(error)));
-				}).finally(() => setQRBusy(false));
+					if (qrRequestId.current !== requestId) return;
+					dispatchPairingPanel({
+						type: "failed",
+						requestId,
+						message: translateWith(props.t, "pair.qrFailed") + (error instanceof Error ? error.message : String(error))
+					});
+				});
 			};
 			const hidePairingQR = () => {
-				setQRDataURL(null);
-				setPairingGrant(null);
+				qrRequestId.current += 1;
+				dispatchPairingPanel({ type: "close" });
 			};
-			const copyPairingCode = () => {
-				if (pairingGrant === null) return;
-				setQRMessage("");
-				writeClipboard(props.t, pairingGrant.code).then(() => {
-					setQRMessage(translateWith(props.t, "pair.codeCopyDone"));
+			const copyPairingInfo = () => {
+				const link = pairingPanel.link;
+				if (link === null) return;
+				dispatchPairingPanel({
+					type: "notice",
+					message: ""
+				});
+				writeClipboard(props.t, link).then(() => {
+					dispatchPairingPanel({
+						type: "notice",
+						message: translateWith(props.t, "pair.infoCopyDone")
+					});
 				}, (error) => {
-					setQRMessage(translateWith(props.t, "pair.codeCopyFailed") + (error instanceof Error ? error.message : String(error)));
+					dispatchPairingPanel({
+						type: "notice",
+						message: translateWith(props.t, "pair.infoCopyFailed") + (error instanceof Error ? error.message : String(error))
+					});
 				});
 			};
 			const primaryRows = [];
@@ -3906,36 +4012,36 @@ window.__ModuleLoader__.load({
 			}, translateWith(props.t, "help.funnelDocs"))))))), report === null ? null : (0, react.createElement)("div", { className: "pbb-card" }, (0, react.createElement)("div", { className: "pbb-field" }, (0, react.createElement)("div", { className: "pbb-row" }, (0, react.createElement)("span", { className: "pbb-label" }, translateWith(props.t, "pair.qrPanelTitle")), pairingTarget === null ? (0, react.createElement)("span", { className: "pbb-value pbb-bad" }, translateWith(props.t, "pair.noAddress")) : (0, react.createElement)("span", { className: "pbb-tokenActions" }, (0, react.createElement)("span", { className: "pbb-badge" }, pairingTarget.kind === "public" ? translateWith(props.t, "pair.kind.public") : translateWith(props.t, "pair.kind.lan")), (0, react.createElement)("button", {
 				type: "button",
 				className: "pbb-action",
-				disabled: qrBusy || !report.pairingReady,
+				disabled: panel.busy || !report.pairingReady,
 				onClick: () => {
-					if (qrDataURL === null) showPairingQR();
-					else hidePairingQR();
+					if (panel.open) hidePairingQR();
+					else showPairingQR(pairingTarget);
 				}
-			}, qrBusy ? translateWith(props.t, "pair.qrGenerating") : qrDataURL === null ? translateWith(props.t, "pair.qrShow") : translateWith(props.t, "pair.qrHide")))), pairingTarget === null ? (0, react.createElement)("p", { className: "pbb-diag pbb-diagBad" }, translateWith(props.t, "pair.noAddressHelp")) : null, pairingTargets.length < 2 ? null : (0, react.createElement)("div", { className: "pbb-targetList" }, pairingTargets.map((target) => (0, react.createElement)("button", {
+			}, translateWith(props.t, panel.action)))), pairingTarget === null ? (0, react.createElement)("p", { className: "pbb-diag pbb-diagBad" }, translateWith(props.t, "pair.noAddressHelp")) : null, pairingTargets.length < 2 ? null : (0, react.createElement)("div", { className: "pbb-targetList" }, pairingTargets.map((target) => (0, react.createElement)("button", {
 				type: "button",
 				key: target.host,
 				className: "pbb-action" + (target.host === pairingTarget?.host ? " pbb-actionSelected" : ""),
+				disabled: panel.busy,
 				onClick: () => {
 					setSelectedPairingHost(target.host);
-					hidePairingQR();
+					if (panel.open) showPairingQR(target);
+					else hidePairingQR();
 				}
-			}, (target.kind === "public" ? translateWith(props.t, "pair.kind.public") : translateWith(props.t, "pair.kind.lan")) + " · " + target.host))), qrMessage ? (0, react.createElement)("p", { className: "pbb-diag" }, qrMessage) : null, pairingTarget === null || qrDataURL === null || pairingGrant === null ? null : (0, react.createElement)("div", { className: "pbb-qrPanel" }, (0, react.createElement)("img", {
-				className: "pbb-qrImage",
-				src: qrDataURL,
-				alt: translateWith(props.t, "pair.qrAlt")
-			}), (0, react.createElement)("div", { className: "pbb-pairCodeBlock" }, (0, react.createElement)("span", { className: "pbb-pairCodeLabel" }, translateWith(props.t, "pair.codeLabel")), (0, react.createElement)("div", { className: "pbb-pairCodeRow" }, (0, react.createElement)("code", { className: "pbb-pairCode" }, pairingGrant.code), (0, react.createElement)("button", {
+			}, (target.kind === "public" ? translateWith(props.t, "pair.kind.public") : translateWith(props.t, "pair.kind.lan")) + " · " + target.host))), panel.message ? (0, react.createElement)("p", { className: "pbb-diag pbb-diagBad" }, panel.message) : null, panel.notice ? (0, react.createElement)("p", { className: "pbb-diag" }, panel.notice) : null, panel.failed && pairingTarget !== null ? (0, react.createElement)("div", { className: "pbb-rowAction" }, (0, react.createElement)("button", {
 				type: "button",
 				className: "pbb-action",
-				onClick: copyPairingCode
-			}, translateWith(props.t, "panel.tokenAction.copy")))), (0, react.createElement)("div", { className: "pbb-row" }, (0, react.createElement)("code", { className: "pbb-token" }, pairingTarget.host), (0, react.createElement)("button", {
-				type: "button",
-				className: "pbb-action",
-				onClick: () => copyRemoteURL(pairingTarget.host)
-			}, translateWith(props.t, "panel.tokenAction.copy"))), addressMessage ? (0, react.createElement)("p", { className: "pbb-diag" }, addressMessage) : null, pairingTarget.tlsFingerprint === void 0 ? null : (0, react.createElement)("div", { className: "pbb-row" }, (0, react.createElement)("code", { className: "pbb-token" }, pairingTarget.tlsFingerprint), (0, react.createElement)("button", {
+				disabled: panel.busy || !report.pairingReady,
+				onClick: () => showPairingQR(pairingTarget)
+			}, translateWith(props.t, "pair.qrRetry"))) : null, panel.open ? (0, react.createElement)("div", { className: "pbb-qrPanel" }, panel.qrDataURL === null ? (0, react.createElement)("p", { className: "pbb-diag" }, translateWith(props.t, "pair.qrGenerating")) : (0, react.createElement)("img", {
+				className: "pbb-qrImage",
+				src: panel.qrDataURL,
+				alt: translateWith(props.t, "pair.qrAlt")
+			}), panel.link === null ? null : (0, react.createElement)("div", { className: "pbb-pairCodeBlock" }, (0, react.createElement)("span", { className: "pbb-pairCodeLabel" }, translateWith(props.t, "pair.infoLabel")), (0, react.createElement)("div", { className: "pbb-pairCodeRow" }, (0, react.createElement)("code", { className: "pbb-pairCode" }, panel.link), (0, react.createElement)("button", {
 				type: "button",
 				className: "pbb-action",
-				onClick: () => copyRemoteURL(pairingTarget.tlsFingerprint ?? "")
-			}, translateWith(props.t, "panel.tokenAction.copy"))), (0, react.createElement)("p", { className: "pbb-qrHint" }, translateWith(props.t, "pair.qrHint", { kind: pairingTarget.kind === "public" ? translateWith(props.t, "pair.kind.public") : translateWith(props.t, "pair.kind.lan") }))))), (0, react.createElement)("div", { className: "pbb-card" }, (0, react.createElement)("div", { className: "pbb-field" }, primaryRows, advancedRows.length > 0 ? (0, react.createElement)("details", { className: "pbb-help" }, (0, react.createElement)("summary", null, translateWith(props.t, "advanced.summary")), (0, react.createElement)("div", { className: "pbb-helpBody" }, advancedRows)) : null)), (0, react.createElement)("div", { className: "pbb-card" }, (0, react.createElement)("div", { className: "pbb-field" }, (0, react.createElement)("div", { className: "pbb-row" }, (0, react.createElement)("span", { className: "pbb-label" }, translateWith(props.t, "push.relayTitle")), (0, react.createElement)("span", { className: "pbb-tokenActions" }, (0, react.createElement)("button", {
+				onClick: copyPairingInfo,
+				"data-testid": "pairingInfoCopy"
+			}, translateWith(props.t, "panel.tokenAction.copy")))), (0, react.createElement)("p", { className: "pbb-qrHint" }, translateWith(props.t, "pair.qrHint", { kind: panel.target?.kind === "public" ? translateWith(props.t, "pair.kind.public") : translateWith(props.t, "pair.kind.lan") }))) : null)), (0, react.createElement)("div", { className: "pbb-card" }, (0, react.createElement)("div", { className: "pbb-field" }, primaryRows, advancedRows.length > 0 ? (0, react.createElement)("details", { className: "pbb-help" }, (0, react.createElement)("summary", null, translateWith(props.t, "advanced.summary")), (0, react.createElement)("div", { className: "pbb-helpBody" }, advancedRows)) : null)), (0, react.createElement)("div", { className: "pbb-card" }, (0, react.createElement)("div", { className: "pbb-field" }, (0, react.createElement)("div", { className: "pbb-row" }, (0, react.createElement)("span", { className: "pbb-label" }, translateWith(props.t, "push.relayTitle")), (0, react.createElement)("span", { className: "pbb-tokenActions" }, (0, react.createElement)("button", {
 				type: "button",
 				className: "pbb-action",
 				disabled: relayTestBusy,