@nativedesktop/react 0.4.40 → 0.4.41

package/dist/index.js

@@ -595,7 +595,7 @@ var widgetEvents = {
   tabview: [{ name: "selectionChanged", handler: "onSelectionChanged", payload: "index" }, { name: "dragStarted", handler: "onDragStarted", payload: "text" }, { name: "dragEnded", handler: "onDragEnded", payload: "none" }, { name: "dragOver", handler: "onDragOver", payload: "dragPoint" }, { name: "dropped", handler: "onDropped", payload: "dragPoint" }],
   grid: [{ name: "dragStarted", handler: "onDragStarted", payload: "text" }, { name: "dragEnded", handler: "onDragEnded", payload: "none" }, { name: "dragOver", handler: "onDragOver", payload: "dragPoint" }, { name: "dropped", handler: "onDropped", payload: "dragPoint" }],
   listview: [{ name: "rowActivated", handler: "onRowActivated", payload: "index" }, { name: "dragStarted", handler: "onDragStarted", payload: "text" }, { name: "dragEnded", handler: "onDragEnded", payload: "none" }, { name: "dragOver", handler: "onDragOver", payload: "dragPoint" }, { name: "dropped", handler: "onDropped", payload: "dragPoint" }],
-  webview: [{ name: "navigate", handler: "onNavigate", payload: "text" }, { name: "titleChanged", handler: "onTitleChanged", payload: "text" }, { name: "loadingChanged", handler: "onLoadingChanged", payload: "checked" }, { name: "backAvailable", handler: "onBackAvailable", payload: "checked" }, { name: "forwardAvailable", handler: "onForwardAvailable", payload: "checked" }, { name: "loadProgress", handler: "onLoadProgress", payload: "value" }, { name: "loadFailed", handler: "onLoadFailed", payload: "data" }, { name: "newWindow", handler: "onNewWindow", payload: "text" }, { name: "browserCommand", handler: "onBrowserCommand", payload: "text" }, { name: "downloadRequested", handler: "onDownloadRequested", payload: "data" }, { name: "downloadUpdated", handler: "onDownloadUpdated", payload: "data" }, { name: "javaScriptResult", handler: "onJavaScriptResult", payload: "data" }, { name: "scriptMessage", handler: "onScriptMessage", payload: "data" }, { name: "schemeRequest", handler: "onSchemeRequest", payload: "data" }, { name: "cookiesResult", handler: "onCookiesResult", payload: "data" }, { name: "cookiesChanged", handler: "onCookiesChanged", payload: "data" }, { name: "faviconChanged", handler: "onFaviconChanged", payload: "data" }, { name: "findResult", handler: "onFindResult", payload: "data" }, { name: "securityChanged", handler: "onSecurityChanged", payload: "data" }, { name: "linkHover", handler: "onLinkHover", payload: "text" }, { name: "contextMenu", handler: "onContextMenu", payload: "data" }, { name: "contextMenuItemClicked", handler: "onContextMenuItemClicked", payload: "data" }, { name: "sessionSaved", handler: "onSessionSaved", payload: "data" }, { name: "audioStateChanged", handler: "onAudioStateChanged", payload: "data" }, { name: "extensionsList", handler: "onExtensionsList", payload: "data" }, { name: "extensionActions", handler: "onExtensionActions", payload: "data" }, { name: "extensionsChanged", handler: "onExtensionsChanged", payload: "data" }, { name: "chromeDialog", handler: "onChromeDialog", payload: "data" }, { name: "permissionRequest", handler: "onPermissionRequest", payload: "data" }, { name: "permissionRequestDismissed", handler: "onPermissionRequestDismissed", payload: "data" }, { name: "zoomChanged", handler: "onZoomChanged", payload: "data" }, { name: "dragStarted", handler: "onDragStarted", payload: "text" }, { name: "dragEnded", handler: "onDragEnded", payload: "none" }, { name: "dragOver", handler: "onDragOver", payload: "dragPoint" }, { name: "dropped", handler: "onDropped", payload: "dragPoint" }],
+  webview: [{ name: "navigate", handler: "onNavigate", payload: "text" }, { name: "titleChanged", handler: "onTitleChanged", payload: "text" }, { name: "loadingChanged", handler: "onLoadingChanged", payload: "checked" }, { name: "focusChanged", handler: "onFocusChanged", payload: "checked" }, { name: "backAvailable", handler: "onBackAvailable", payload: "checked" }, { name: "forwardAvailable", handler: "onForwardAvailable", payload: "checked" }, { name: "loadProgress", handler: "onLoadProgress", payload: "value" }, { name: "loadFailed", handler: "onLoadFailed", payload: "data" }, { name: "newWindow", handler: "onNewWindow", payload: "text" }, { name: "browserCommand", handler: "onBrowserCommand", payload: "text" }, { name: "downloadRequested", handler: "onDownloadRequested", payload: "data" }, { name: "downloadUpdated", handler: "onDownloadUpdated", payload: "data" }, { name: "javaScriptResult", handler: "onJavaScriptResult", payload: "data" }, { name: "scriptMessage", handler: "onScriptMessage", payload: "data" }, { name: "schemeRequest", handler: "onSchemeRequest", payload: "data" }, { name: "cookiesResult", handler: "onCookiesResult", payload: "data" }, { name: "cookiesChanged", handler: "onCookiesChanged", payload: "data" }, { name: "faviconChanged", handler: "onFaviconChanged", payload: "data" }, { name: "findResult", handler: "onFindResult", payload: "data" }, { name: "securityChanged", handler: "onSecurityChanged", payload: "data" }, { name: "linkHover", handler: "onLinkHover", payload: "text" }, { name: "contextMenu", handler: "onContextMenu", payload: "data" }, { name: "contextMenuItemClicked", handler: "onContextMenuItemClicked", payload: "data" }, { name: "sessionSaved", handler: "onSessionSaved", payload: "data" }, { name: "audioStateChanged", handler: "onAudioStateChanged", payload: "data" }, { name: "extensionsList", handler: "onExtensionsList", payload: "data" }, { name: "extensionActions", handler: "onExtensionActions", payload: "data" }, { name: "extensionsChanged", handler: "onExtensionsChanged", payload: "data" }, { name: "chromeDialog", handler: "onChromeDialog", payload: "data" }, { name: "permissionRequest", handler: "onPermissionRequest", payload: "data" }, { name: "permissionRequestDismissed", handler: "onPermissionRequestDismissed", payload: "data" }, { name: "zoomChanged", handler: "onZoomChanged", payload: "data" }, { name: "dragStarted", handler: "onDragStarted", payload: "text" }, { name: "dragEnded", handler: "onDragEnded", payload: "none" }, { name: "dragOver", handler: "onDragOver", payload: "dragPoint" }, { name: "dropped", handler: "onDropped", payload: "dragPoint" }],
   nativeview: [{ name: "nativeEvent", handler: "onNativeEvent", payload: "data" }, { name: "dragStarted", handler: "onDragStarted", payload: "text" }, { name: "dragEnded", handler: "onDragEnded", payload: "none" }, { name: "dragOver", handler: "onDragOver", payload: "dragPoint" }, { name: "dropped", handler: "onDropped", payload: "dragPoint" }],
   splitview: [{ name: "revealChanged", handler: "onRevealChanged", payload: "checked" }, { name: "dragStarted", handler: "onDragStarted", payload: "text" }, { name: "dragEnded", handler: "onDragEnded", payload: "none" }, { name: "dragOver", handler: "onDragOver", payload: "dragPoint" }, { name: "dropped", handler: "onDropped", payload: "dragPoint" }],
   headerbar: [{ name: "back", handler: "onBack", payload: "none" }, { name: "forward", handler: "onForward", payload: "none" }, { name: "dragStarted", handler: "onDragStarted", payload: "text" }, { name: "dragEnded", handler: "onDragEnded", payload: "none" }, { name: "dragOver", handler: "onDragOver", payload: "dragPoint" }, { name: "dropped", handler: "onDropped", payload: "dragPoint" }],
@@ -672,7 +672,7 @@ var handlerPropNames = {
   tabview: ["onSelectionChanged", "onDragStarted", "onDragEnded", "onDragOver", "onDropped"],
   grid: ["onDragStarted", "onDragEnded", "onDragOver", "onDropped"],
   listview: ["onRowActivated", "onDragStarted", "onDragEnded", "onDragOver", "onDropped"],
-  webview: ["onNavigate", "onTitleChanged", "onLoadingChanged", "onBackAvailable", "onForwardAvailable", "onLoadProgress", "onLoadFailed", "onNewWindow", "onBrowserCommand", "onDownloadRequested", "onDownloadUpdated", "onJavaScriptResult", "onScriptMessage", "onSchemeRequest", "onCookiesResult", "onCookiesChanged", "onFaviconChanged", "onFindResult", "onSecurityChanged", "onLinkHover", "onContextMenu", "onContextMenuItemClicked", "onSessionSaved", "onAudioStateChanged", "onExtensionsList", "onExtensionActions", "onExtensionsChanged", "onChromeDialog", "onPermissionRequest", "onPermissionRequestDismissed", "onZoomChanged", "onDragStarted", "onDragEnded", "onDragOver", "onDropped"],
+  webview: ["onNavigate", "onTitleChanged", "onLoadingChanged", "onFocusChanged", "onBackAvailable", "onForwardAvailable", "onLoadProgress", "onLoadFailed", "onNewWindow", "onBrowserCommand", "onDownloadRequested", "onDownloadUpdated", "onJavaScriptResult", "onScriptMessage", "onSchemeRequest", "onCookiesResult", "onCookiesChanged", "onFaviconChanged", "onFindResult", "onSecurityChanged", "onLinkHover", "onContextMenu", "onContextMenuItemClicked", "onSessionSaved", "onAudioStateChanged", "onExtensionsList", "onExtensionActions", "onExtensionsChanged", "onChromeDialog", "onPermissionRequest", "onPermissionRequestDismissed", "onZoomChanged", "onDragStarted", "onDragEnded", "onDragOver", "onDropped"],
   nativeview: ["onNativeEvent", "onDragStarted", "onDragEnded", "onDragOver", "onDropped"],
   splitview: ["onRevealChanged", "onDragStarted", "onDragEnded", "onDragOver", "onDropped"],
   headerbar: ["onBack", "onForward", "onDragStarted", "onDragEnded", "onDragOver", "onDropped"],
@@ -909,6 +909,10 @@ class Batch {
     return this.ops.length;
   }
 }
+var removalListeners = new Set;
+function onNodeRemoved(listener) {
+  removalListeners.add(listener);
+}
 
 class NodeRegistry {
   byId = new Map;
@@ -919,7 +923,10 @@ class NodeRegistry {
     return this.byId.get(id);
   }
   unregister(id) {
-    this.byId.delete(id);
+    if (!this.byId.delete(id))
+      return;
+    for (const listener of removalListeners)
+      listener(id);
   }
 }
 
@@ -1400,7 +1407,9 @@ var hostConfig = {
   hideTextInstance() {},
   unhideTextInstance() {},
   getPublicInstance: (i) => i,
-  detachDeletedInstance() {},
+  detachDeletedInstance(inst) {
+    registry.unregister(inst.id);
+  },
   maySuspendCommit: () => false,
   preloadInstance: () => true,
   startSuspendingCommit() {},
@@ -1445,6 +1454,13 @@ function dispatchSystemEvent(channel, data) {
     globalThis.__nd_app_active = true;
   else if (channel === "app.deactivate")
     globalThis.__nd_app_active = false;
+  else if (channel === "webview.engine") {
+    const d = data;
+    globalThis.__nd_webview_engine = {
+      engine: d?.engine === "chromium" ? "chromium" : "system",
+      style: d?.style === "chrome" || d?.style === "alloy" ? d.style : null
+    };
+  }
   for (const handler of registry2().get(channel) ?? [])
     handler(data);
   if (channel === "notification.click") {
@@ -1553,6 +1569,12 @@ var system = {
   }
 };
 var webviewEngine = {
+  active() {
+    return globalThis.__nd_webview_engine?.engine ?? "system";
+  },
+  cefStyle() {
+    return globalThis.__nd_webview_engine?.style ?? null;
+  },
   async registerScheme(scheme, options = {}) {
     await call("webviewEngine.registerScheme", {
       scheme,
@@ -1951,13 +1973,56 @@ var seq2 = 0;
 function nextId(prefix) {
   return `${prefix}${++seq2}`;
 }
-function executeJavaScript(node, code, world) {
-  const id = nextId("js");
+var inFlight = new Map;
+onNodeRemoved((nodeId) => {
+  const calls = inFlight.get(nodeId);
+  if (!calls)
+    return;
+  inFlight.delete(nodeId);
+  for (const [id, reject2] of calls)
+    reject2(new Error(`the <webview> was removed before request ${id} was answered`));
+});
+function request(node, pending, prefix, command, args) {
+  const id = nextId(prefix);
   return new Promise((resolve2, reject2) => {
-    pendingEvals.set(id, { resolve: resolve2, reject: reject2 });
-    sendCommand(node, "executeJavaScript", world ? { id, code, world } : { id, code });
+    if (!registry.get(node.id)) {
+      reject2(new Error(`${command}: the <webview> is no longer mounted`));
+      return;
+    }
+    let calls = inFlight.get(node.id);
+    if (!calls)
+      inFlight.set(node.id, calls = new Map);
+    const forget = () => {
+      pending.delete(id);
+      calls.delete(id);
+      if (calls.size === 0 && inFlight.get(node.id) === calls)
+        inFlight.delete(node.id);
+    };
+    pending.set(id, {
+      resolve: (value) => {
+        forget();
+        resolve2(value);
+      },
+      reject: (reason) => {
+        forget();
+        reject2(reason);
+      }
+    });
+    calls.set(id, (reason) => {
+      forget();
+      reject2(reason);
+    });
+    try {
+      sendCommand(node, command, { id, ...args });
+    } catch (error) {
+      forget();
+      reject2(error);
+    }
   });
 }
+function executeJavaScript(node, code, world) {
+  return request(node, pendingEvals, "js", "executeJavaScript", world ? { code, world } : { code });
+}
 function onJavaScriptResult(e) {
   const result = e.data;
   const call2 = pendingEvals.get(result.id);
@@ -1970,11 +2035,7 @@ function onJavaScriptResult(e) {
     call2.reject(new Error(result.error ?? "executeJavaScript failed"));
 }
 function getCookies(node, url) {
-  const id = nextId("ck");
-  return new Promise((resolve2, reject2) => {
-    pendingCookies.set(id, { resolve: resolve2, reject: reject2 });
-    sendCommand(node, "getCookies", url ? { id, url } : { id });
-  });
+  return request(node, pendingCookies, "ck", "getCookies", url ? { url } : {});
 }
 function onCookiesResult(e) {
   const result = e.data;
@@ -1988,11 +2049,7 @@ function onCookiesResult(e) {
     call2.reject(new Error(result.error ?? "getCookies failed"));
 }
 function saveSession(node) {
-  const id = nextId("ss");
-  return new Promise((resolve2, reject2) => {
-    pendingSessions.set(id, { resolve: resolve2, reject: reject2 });
-    sendCommand(node, "saveSession", { id });
-  });
+  return request(node, pendingSessions, "ss", "saveSession", {});
 }
 function onSessionSaved(e) {
   const result = e.data;
@@ -2003,11 +2060,7 @@ function onSessionSaved(e) {
   call2.resolve(result.state ?? "");
 }
 function listExtensions(node) {
-  const id = nextId("ext");
-  return new Promise((resolve2, reject2) => {
-    pendingExtensions.set(id, { resolve: resolve2, reject: reject2 });
-    sendCommand(node, "listExtensions", { id });
-  });
+  return request(node, pendingExtensions, "ext", "listExtensions", {});
 }
 function onExtensionsList(e) {
   const result = e.data;
@@ -2030,20 +2083,12 @@ function setExtensionEnabled(node, extensionId, enabled) {
   return extensionMutation(node, "setExtensionEnabled", { extensionId, enabled });
 }
 function extensionMutation(node, command, args) {
-  const id = nextId("ext");
-  return new Promise((resolve2, reject2) => {
-    pendingExtensions.set(id, { resolve: resolve2, reject: reject2 });
-    sendCommand(node, command, { id, ...args });
-  });
+  return request(node, pendingExtensions, "ext", command, args);
 }
 var extensionsWatchers = [];
 function watchExtensions(node, listener) {
-  const id = nextId("ext");
-  return new Promise((resolve2, reject2) => {
-    pendingWatches.set(id, { resolve: resolve2, reject: reject2 });
-    extensionsWatchers.push(listener);
-    sendCommand(node, "watchExtensions", { id });
-  });
+  extensionsWatchers.push(listener);
+  return request(node, pendingWatches, "ext", "watchExtensions", {});
 }
 function onExtensionsChanged(e) {
   const result = e.data;
@@ -2062,18 +2107,10 @@ function onExtensionsChanged(e) {
     listener({ reason: result.reason ?? "" });
 }
 function readExtensionAction(node) {
-  const id = nextId("ext");
-  return new Promise((resolve2, reject2) => {
-    pendingActionState.set(id, { resolve: resolve2, reject: reject2 });
-    sendCommand(node, "readExtensionAction", { id });
-  });
+  return request(node, pendingActionState, "ext", "readExtensionAction", {});
 }
 function listExtensionActions(node) {
-  const id = nextId("ext");
-  return new Promise((resolve2, reject2) => {
-    pendingActions.set(id, { resolve: resolve2, reject: reject2 });
-    sendCommand(node, "listExtensionActions", { id });
-  });
+  return request(node, pendingActions, "ext", "listExtensionActions", {});
 }
 function onExtensionActions(e) {
   const result = e.data;

package/dist/packages/react/src/generated/intrinsics.d.ts

@@ -952,6 +952,9 @@ export declare namespace JSX {
             onLoadingChanged?: (e: {
                 checked: boolean;
             }) => void;
+            onFocusChanged?: (e: {
+                checked: boolean;
+            }) => void;
             onBackAvailable?: (e: {
                 checked: boolean;
             }) => void;

package/dist/packages/react/src/host-config.d.ts

@@ -55,7 +55,7 @@ export declare const hostConfig: {
     hideTextInstance(): void;
     unhideTextInstance(): void;
     getPublicInstance: (i: Instance) => Instance;
-    detachDeletedInstance(): void;
+    detachDeletedInstance(inst: Instance): void;
     maySuspendCommit: () => boolean;
     preloadInstance: () => boolean;
     startSuspendingCommit(): void;

package/dist/packages/react/src/ops.d.ts

@@ -12,6 +12,7 @@ export interface NodeRecord {
     props: Record<string, unknown>;
     handlers: Record<string, Handler>;
 }
+export declare function onNodeRemoved(listener: (id: number) => void): void;
 export declare class NodeRegistry {
     private byId;
     register(rec: NodeRecord): void;

package/dist/packages/react/src/system.d.ts

@@ -3,6 +3,10 @@ declare global {
     var __nd_system_events: Map<string, Set<SystemEventHandler>> | undefined;
     var __nd_notification_data: Map<string, unknown> | undefined;
     var __nd_app_active: boolean | undefined;
+    var __nd_webview_engine: {
+        engine: WebviewEngineName;
+        style: CefStyle;
+    } | undefined;
 }
 /** Wired up by renderer.ts from `ndp.onSystemEvent()` — not part of the public API. */
 export declare function dispatchSystemEvent(channel: string, data: unknown): void;
@@ -141,8 +145,29 @@ export interface RegisterSchemeOptions {
      */
     secure?: boolean;
 }
+/** Which web engine the host actually started. */
+export type WebviewEngineName = "chromium" | "system";
+/** CEF's browser style, or null when the host is not running CEF at all. */
+export type CefStyle = "chrome" | "alloy" | null;
 /** Engine-level `<webview>` configuration. `core:webview` is default-granted. */
 export declare const webviewEngine: {
+    /**
+     * Which engine this host actually started, synchronously. Asking for
+     * `chromium` is not the same as getting it: a host with no usable CEF
+     * distribution falls back to the system engine, and before this the only
+     * way to tell was to read `navigator.userAgent` out of a live view.
+     *
+     * Backed by the host's `webview.engine` stream, replayed right after the
+     * handshake like `app.isActive()`, so it is correct from the first render.
+     * "system" against a host that predates the stream.
+     */
+    active(): WebviewEngineName;
+    /**
+     * CEF's browser style: "chrome" (Chromium's own browser runtime, which is
+     * what runs the extension system) or "alloy". Null whenever `active()` is
+     * not "chromium".
+     */
+    cefStyle(): CefStyle;
     /**
      * Registers a custom URI scheme (`crx`, `app`, …) with the web engine.
      * Requests for it arrive as the `schemeRequest` event on the `<webview>`

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nativedesktop/react",
-  "version": "0.4.40",
+  "version": "0.4.41",
   "type": "module",
   "license": "MIT",
   "homepage": "https://github.com/FormalSnake/NativeDesktop#readme",