@tutti-os/browser-node 0.0.1

package/dist/chunk-2GEY55PS.js

@@ -0,0 +1,1179 @@
+import {
+  resolveBrowserSessionPartition
+} from "./chunk-UTXZLRPE.js";
+import {
+  normalizeBrowserComparableUrl,
+  normalizeHostBrowserComparableUrl
+} from "./chunk-LVVPDNEF.js";
+
+// src/react/BrowserNode.tsx
+import {
+  ArrowLeftIcon,
+  ArrowRightIcon,
+  Badge,
+  Button,
+  Input,
+  LaunchIcon,
+  LoadingIcon,
+  RefreshIcon,
+  WarningLinedIcon,
+  ViewportMenuSurface,
+  cn,
+  menuItemClassName
+} from "@tutti-os/ui-system";
+import { useEffect as useEffect3, useRef, useState } from "react";
+
+// src/react/useBrowserNodeController.ts
+import { useEffect, useMemo } from "react";
+import { useExternalStoreSnapshot } from "@tutti-os/ui-react-hooks";
+
+// src/core/nodeController.ts
+var controllerRegistry = /* @__PURE__ */ new Map();
+function acquireBrowserNodeController(input) {
+  const existing = controllerRegistry.get(input.nodeId);
+  const entry = existing ?? createBrowserNodeControllerEntry({
+    defaultUrl: input.defaultUrl,
+    feature: input.feature,
+    navigationPolicy: input.navigationPolicy,
+    nodeId: input.nodeId,
+    profileId: input.profileId ?? null,
+    sessionMode: input.sessionMode ?? "shared",
+    sessionPartition: input.sessionPartition,
+    syncDefaultUrl: input.syncDefaultUrl ?? false
+  });
+  entry.context = {
+    defaultUrl: input.defaultUrl,
+    feature: input.feature,
+    navigationPolicy: input.navigationPolicy,
+    nodeId: input.nodeId,
+    profileId: input.profileId ?? null,
+    sessionMode: input.sessionMode ?? "shared",
+    sessionPartition: input.sessionPartition,
+    syncDefaultUrl: input.syncDefaultUrl ?? false
+  };
+  if (!existing) {
+    controllerRegistry.set(input.nodeId, entry);
+  }
+  reconcileBrowserNodeControllerState(entry, {
+    allowAutoActivate: false,
+    notifyListeners: false
+  });
+  return entry.controller;
+}
+function createBrowserNodeControllerEntry(context) {
+  const runtime = context.feature.runtimeStore.getNodeState(context.nodeId);
+  const displayUrl = resolveBrowserNodeDisplayUrl(runtime, context.defaultUrl);
+  const entry = {
+    connectedRelease: null,
+    controller: null,
+    context,
+    lastColdActivationUrl: resolveInitialLastColdActivationUrl(
+      runtime,
+      context.defaultUrl
+    ),
+    listeners: /* @__PURE__ */ new Set(),
+    pendingColdActivationUrl: null,
+    refCount: 0,
+    runtimeUnsubscribe: null,
+    state: {
+      displayUrl,
+      draftUrl: displayUrl,
+      runtime
+    }
+  };
+  entry.controller = {
+    getState() {
+      return entry.state;
+    },
+    goBack() {
+      return entry.context.feature.hostApi.goBack({
+        nodeId: entry.context.nodeId
+      });
+    },
+    goForward() {
+      return entry.context.feature.hostApi.goForward({
+        nodeId: entry.context.nodeId
+      });
+    },
+    reload() {
+      return entry.context.feature.hostApi.reload({
+        nodeId: entry.context.nodeId
+      });
+    },
+    release() {
+      entry.refCount = Math.max(0, entry.refCount - 1);
+      if (entry.refCount > 0) {
+        return;
+      }
+      entry.connectedRelease?.();
+      entry.connectedRelease = null;
+      entry.runtimeUnsubscribe?.();
+      entry.runtimeUnsubscribe = null;
+      controllerRegistry.delete(entry.context.nodeId);
+    },
+    retain() {
+      entry.refCount += 1;
+      if (entry.refCount > 1) {
+        return;
+      }
+      if (!controllerRegistry.has(entry.context.nodeId)) {
+        controllerRegistry.set(entry.context.nodeId, entry);
+      }
+      entry.connectedRelease = entry.context.feature.connect();
+      entry.runtimeUnsubscribe = entry.context.feature.runtimeStore.subscribe(
+        () => {
+          reconcileBrowserNodeControllerState(entry, {
+            allowAutoActivate: true,
+            notifyListeners: true
+          });
+        }
+      );
+      reconcileBrowserNodeControllerState(entry, {
+        allowAutoActivate: true,
+        notifyListeners: true
+      });
+    },
+    setDraftUrl(nextUrl) {
+      if (entry.state.draftUrl === nextUrl) {
+        return;
+      }
+      entry.state = {
+        ...entry.state,
+        draftUrl: nextUrl
+      };
+      notifyBrowserNodeControllerListeners(entry);
+    },
+    sync() {
+      reconcileBrowserNodeControllerState(entry, {
+        allowAutoActivate: true,
+        notifyListeners: true
+      });
+    },
+    subscribe(listener) {
+      entry.listeners.add(listener);
+      return () => {
+        entry.listeners.delete(listener);
+      };
+    },
+    async submitDraftUrl() {
+      const resolved = entry.context.feature.resolveAddressInput(
+        entry.state.draftUrl
+      );
+      if (!resolved.url) {
+        return;
+      }
+      if (entry.state.draftUrl !== resolved.url) {
+        entry.state = {
+          ...entry.state,
+          draftUrl: resolved.url
+        };
+        notifyBrowserNodeControllerListeners(entry);
+      }
+      await entry.context.feature.hostApi.navigate({
+        navigationPolicy: entry.context.navigationPolicy,
+        nodeId: entry.context.nodeId,
+        url: resolved.url
+      });
+    }
+  };
+  return entry;
+}
+function resolveInitialLastColdActivationUrl(runtime, defaultUrl) {
+  const trimmedUrl = defaultUrl.trim();
+  if (runtime.lifecycle === "cold" || runtime.error !== null || trimmedUrl.length === 0 || trimmedUrl === "about:blank") {
+    return null;
+  }
+  const comparableDefaultUrl = normalizeBrowserComparableUrl(trimmedUrl);
+  const comparableRuntimeUrl = runtime.url ? normalizeBrowserComparableUrl(runtime.url) : null;
+  return comparableDefaultUrl !== null && comparableDefaultUrl === comparableRuntimeUrl ? trimmedUrl : null;
+}
+function notifyBrowserNodeControllerListeners(entry) {
+  for (const listener of entry.listeners) {
+    listener();
+  }
+}
+function resolveBrowserNodeDisplayUrl(runtime, defaultUrl) {
+  const resolvedRuntimeUrl = runtime.url?.trim() ?? "";
+  return resolvedRuntimeUrl.length > 0 ? resolvedRuntimeUrl : defaultUrl;
+}
+function reconcileBrowserNodeControllerState(entry, options) {
+  const runtime = entry.context.feature.runtimeStore.getNodeState(
+    entry.context.nodeId
+  );
+  const displayUrl = resolveBrowserNodeDisplayUrl(
+    runtime,
+    entry.context.defaultUrl
+  );
+  const nextDraftUrl = displayUrl !== entry.state.displayUrl ? displayUrl : entry.state.draftUrl;
+  const changed = entry.state.runtime !== runtime || entry.state.displayUrl !== displayUrl || entry.state.draftUrl !== nextDraftUrl;
+  if (changed) {
+    entry.state = {
+      displayUrl,
+      draftUrl: nextDraftUrl,
+      runtime
+    };
+    if (options.notifyListeners) {
+      notifyBrowserNodeControllerListeners(entry);
+    }
+  }
+  if (options.allowAutoActivate) {
+    void maybeActivateBrowserNodeDefaultUrl(entry).catch(() => void 0);
+  }
+}
+async function maybeActivateBrowserNodeDefaultUrl(entry) {
+  const {
+    defaultUrl,
+    feature,
+    navigationPolicy,
+    nodeId,
+    profileId,
+    sessionMode,
+    sessionPartition,
+    syncDefaultUrl
+  } = entry.context;
+  const trimmedUrl = defaultUrl.trim();
+  const comparableDefaultUrl = normalizeHostBrowserComparableUrl(trimmedUrl);
+  const comparableRuntimeUrl = entry.state.runtime.url ? normalizeHostBrowserComparableUrl(entry.state.runtime.url) : null;
+  const shouldActivateColdNode = entry.state.runtime.lifecycle === "cold";
+  const shouldSyncDefaultUrl = syncDefaultUrl && entry.state.runtime.lifecycle !== "cold" && comparableDefaultUrl !== null && (comparableRuntimeUrl !== comparableDefaultUrl || entry.state.runtime.error !== null) && entry.lastColdActivationUrl !== trimmedUrl;
+  if (trimmedUrl.length === 0 || trimmedUrl === "about:blank" || entry.state.runtime.isLoading || entry.pendingColdActivationUrl === trimmedUrl || !shouldActivateColdNode && !shouldSyncDefaultUrl || shouldActivateColdNode && entry.state.runtime.error !== null && entry.lastColdActivationUrl === trimmedUrl) {
+    return;
+  }
+  entry.pendingColdActivationUrl = trimmedUrl;
+  try {
+    await feature.hostApi.activate({
+      navigationPolicy,
+      nodeId,
+      profileId,
+      sessionMode,
+      sessionPartition,
+      url: trimmedUrl
+    });
+    entry.lastColdActivationUrl = trimmedUrl;
+  } finally {
+    if (entry.pendingColdActivationUrl === trimmedUrl) {
+      entry.pendingColdActivationUrl = null;
+    }
+  }
+}
+
+// src/react/useBrowserNodeController.ts
+function useBrowserNodeController(input) {
+  const controller = useMemo(
+    () => acquireBrowserNodeController({
+      defaultUrl: input.defaultUrl,
+      feature: input.feature,
+      navigationPolicy: input.navigationPolicy,
+      nodeId: input.nodeId,
+      profileId: input.profileId ?? null,
+      sessionMode: input.sessionMode ?? "shared",
+      sessionPartition: input.sessionPartition,
+      syncDefaultUrl: input.syncDefaultUrl ?? false
+    }),
+    [
+      input.defaultUrl,
+      input.feature,
+      input.navigationPolicy,
+      input.nodeId,
+      input.profileId,
+      input.sessionMode,
+      input.sessionPartition,
+      input.syncDefaultUrl
+    ]
+  );
+  useEffect(() => {
+    controller.retain();
+    return () => {
+      controller.release();
+    };
+  }, [controller]);
+  useEffect(() => {
+    controller.sync();
+  }, [
+    controller,
+    input.defaultUrl,
+    input.feature,
+    input.navigationPolicy,
+    input.nodeId,
+    input.profileId,
+    input.sessionMode,
+    input.sessionPartition,
+    input.syncDefaultUrl
+  ]);
+  const state = useExternalStoreSnapshot({
+    getSnapshot() {
+      return controller.getState();
+    },
+    subscribe(listener) {
+      return controller.subscribe(listener);
+    }
+  });
+  return {
+    controller,
+    state
+  };
+}
+
+// src/react/useBrowserNodeWebview.ts
+import { useCallback, useEffect as useEffect2, useMemo as useMemo2 } from "react";
+import { useExternalStoreSnapshot as useExternalStoreSnapshot2 } from "@tutti-os/ui-react-hooks";
+
+// src/core/webviewController.ts
+var browserGuestUnregisterGraceMs = 250;
+var browserNodeInitialWebviewSrc = "about:blank";
+var webviewControllerRegistry = /* @__PURE__ */ new Map();
+var pendingGuestIdsByNodeId = /* @__PURE__ */ new Map();
+var pendingUnregisterTimersByNodeId = /* @__PURE__ */ new Map();
+function acquireBrowserNodeWebviewController(input) {
+  const existing = webviewControllerRegistry.get(input.nodeId);
+  const entry = existing ?? createBrowserNodeWebviewControllerEntry({
+    feature: input.feature,
+    initialUrl: input.initialUrl,
+    lifecycle: input.lifecycle,
+    navigationPolicy: input.navigationPolicy,
+    nodeId: input.nodeId,
+    onGuestInteraction: input.onGuestInteraction,
+    profileId: input.profileId,
+    sessionMode: input.sessionMode,
+    sessionPartition: input.sessionPartition
+  });
+  entry.context = {
+    feature: input.feature,
+    initialUrl: input.initialUrl,
+    lifecycle: input.lifecycle,
+    navigationPolicy: input.navigationPolicy,
+    nodeId: input.nodeId,
+    onGuestInteraction: input.onGuestInteraction,
+    profileId: input.profileId,
+    sessionMode: input.sessionMode,
+    sessionPartition: input.sessionPartition
+  };
+  if (!existing) {
+    webviewControllerRegistry.set(input.nodeId, entry);
+  }
+  return entry.controller;
+}
+function createBrowserNodeWebviewControllerEntry(context) {
+  const state = resolveBrowserNodeWebviewControllerState(context);
+  const entry = {
+    attachedListeners: [],
+    context,
+    controller: null,
+    listeners: /* @__PURE__ */ new Set(),
+    refCount: 0,
+    registeredGuestId: null,
+    registeringGuestId: null,
+    state,
+    webview: null
+  };
+  entry.controller = {
+    dismissDevToolsContextMenu() {
+      setBrowserNodeDevToolsContextMenu(entry, null);
+    },
+    getState() {
+      return entry.state;
+    },
+    async openDevToolsFromContextMenu() {
+      setBrowserNodeDevToolsContextMenu(entry, null);
+      try {
+        await entry.context.feature.hostApi.openDevTools?.({
+          nodeId: entry.context.nodeId
+        });
+      } catch (error) {
+        reportBrowserNodeWebviewDiagnostic(
+          entry,
+          "devtools.open.failed",
+          {
+            error: error instanceof Error ? error.message : String(error),
+            webContentsId: readBrowserNodeWebContentsId(entry.webview),
+            webviewPartition: entry.state.webviewPartition
+          },
+          "warn"
+        );
+        throw error;
+      }
+    },
+    release() {
+      entry.refCount = Math.max(0, entry.refCount - 1);
+      if (entry.refCount > 0) {
+        return;
+      }
+      scheduleBrowserNodeGuestUnregister(entry);
+      detachBrowserNodeWebview(entry);
+      webviewControllerRegistry.delete(entry.context.nodeId);
+    },
+    retain() {
+      entry.refCount += 1;
+      if (entry.refCount > 1) {
+        return;
+      }
+      reconcileBrowserNodeWebviewControllerState(entry, {
+        allowHostEffects: true,
+        notifyListeners: true,
+        rebindWebview: true
+      });
+    },
+    setWebview(element) {
+      if (entry.webview === element) {
+        return;
+      }
+      detachBrowserNodeWebview(entry);
+      entry.webview = element;
+      attachBrowserNodeWebview(entry);
+    },
+    sync() {
+      reconcileBrowserNodeWebviewControllerState(entry, {
+        allowHostEffects: true,
+        notifyListeners: true,
+        rebindWebview: true
+      });
+    },
+    subscribe(listener) {
+      entry.listeners.add(listener);
+      return () => {
+        entry.listeners.delete(listener);
+      };
+    }
+  };
+  return entry;
+}
+function resolveBrowserNodeWebviewControllerState(context) {
+  const webviewPartition = resolveBrowserSessionPartition({
+    profileId: context.profileId,
+    sessionMode: context.sessionMode,
+    sessionPartition: context.sessionPartition
+  });
+  return {
+    devToolsContextMenu: null,
+    shouldRenderWebview: context.lifecycle !== "cold",
+    webviewKey: `${context.nodeId}:${webviewPartition}`,
+    webviewPartition,
+    webviewSrc: browserNodeInitialWebviewSrc
+  };
+}
+function reconcileBrowserNodeWebviewControllerState(entry, options) {
+  const nextState = resolveBrowserNodeWebviewControllerState(entry.context);
+  const changed = entry.state.devToolsContextMenu !== nextState.devToolsContextMenu || entry.state.shouldRenderWebview !== nextState.shouldRenderWebview || entry.state.webviewKey !== nextState.webviewKey || entry.state.webviewPartition !== nextState.webviewPartition || entry.state.webviewSrc !== nextState.webviewSrc;
+  if (options.allowHostEffects) {
+    if (entry.context.lifecycle === "cold") {
+      scheduleBrowserNodeGuestUnregister(entry);
+    } else {
+      clearPendingBrowserNodeGuestUnregister(entry.context.nodeId);
+      void entry.context.feature.hostApi.prepareSession({
+        navigationPolicy: entry.context.navigationPolicy,
+        nodeId: entry.context.nodeId,
+        profileId: entry.context.profileId,
+        sessionMode: entry.context.sessionMode,
+        sessionPartition: entry.context.sessionPartition
+      }).catch(() => void 0);
+    }
+  }
+  if (!changed) {
+    if (options.rebindWebview && entry.webview && entry.attachedListeners.length === 0) {
+      attachBrowserNodeWebview(entry);
+    }
+    return;
+  }
+  entry.state = nextState;
+  detachBrowserNodeWebview(entry);
+  attachBrowserNodeWebview(entry);
+  if (options.notifyListeners) {
+    notifyBrowserNodeWebviewControllerListeners(entry);
+  }
+}
+function setBrowserNodeDevToolsContextMenu(entry, devToolsContextMenu) {
+  if (entry.state.devToolsContextMenu?.x === devToolsContextMenu?.x && entry.state.devToolsContextMenu?.y === devToolsContextMenu?.y) {
+    return;
+  }
+  entry.state = {
+    ...entry.state,
+    devToolsContextMenu
+  };
+  notifyBrowserNodeWebviewControllerListeners(entry);
+}
+function notifyBrowserNodeWebviewControllerListeners(entry) {
+  for (const listener of entry.listeners) {
+    listener();
+  }
+}
+function clearPendingBrowserNodeGuestUnregister(nodeId) {
+  const timerId = pendingUnregisterTimersByNodeId.get(nodeId);
+  if (timerId !== void 0) {
+    globalThis.clearTimeout(timerId);
+    pendingUnregisterTimersByNodeId.delete(nodeId);
+  }
+  pendingGuestIdsByNodeId.delete(nodeId);
+}
+function scheduleBrowserNodeGuestUnregister(entry) {
+  const guestId = entry.registeredGuestId;
+  const nodeId = entry.context.nodeId;
+  entry.registeringGuestId = null;
+  if (guestId === null) {
+    clearPendingBrowserNodeGuestUnregister(nodeId);
+    return;
+  }
+  entry.registeredGuestId = null;
+  clearPendingBrowserNodeGuestUnregister(nodeId);
+  pendingGuestIdsByNodeId.set(nodeId, guestId);
+  const timerId = globalThis.setTimeout(() => {
+    pendingUnregisterTimersByNodeId.delete(nodeId);
+    const pendingGuestId = pendingGuestIdsByNodeId.get(nodeId);
+    pendingGuestIdsByNodeId.delete(nodeId);
+    if (typeof pendingGuestId !== "number" || !Number.isFinite(pendingGuestId)) {
+      return;
+    }
+    void entry.context.feature.hostApi.unregisterGuest({
+      nodeId: entry.context.nodeId,
+      webContentsId: pendingGuestId
+    }).catch(() => void 0);
+  }, browserGuestUnregisterGraceMs);
+  pendingUnregisterTimersByNodeId.set(nodeId, timerId);
+}
+function detachBrowserNodeWebview(entry) {
+  if (!entry.webview) {
+    entry.attachedListeners = [];
+    return;
+  }
+  for (const record of entry.attachedListeners) {
+    entry.webview.removeEventListener(record.event, record.listener);
+  }
+  entry.attachedListeners = [];
+}
+function attachBrowserNodeWebview(entry) {
+  const webview = entry.webview;
+  if (!webview || !entry.state.shouldRenderWebview) {
+    return;
+  }
+  const registerGuest = async () => {
+    const guestId = webview.getWebContentsId?.();
+    if (typeof guestId !== "number" || !Number.isFinite(guestId) || guestId <= 0 || entry.registeredGuestId === guestId || entry.registeringGuestId === guestId) {
+      return;
+    }
+    clearPendingBrowserNodeGuestUnregister(entry.context.nodeId);
+    entry.registeringGuestId = guestId;
+    try {
+      await entry.context.feature.hostApi.registerGuest({
+        navigationPolicy: entry.context.navigationPolicy,
+        nodeId: entry.context.nodeId,
+        profileId: entry.context.profileId,
+        sessionMode: entry.context.sessionMode,
+        sessionPartition: entry.context.sessionPartition,
+        webContentsId: guestId
+      });
+      entry.registeredGuestId = guestId;
+    } finally {
+      if (entry.registeringGuestId === guestId) {
+        entry.registeringGuestId = null;
+      }
+    }
+  };
+  const handleDidAttach = () => {
+    void registerGuest().catch(() => void 0);
+  };
+  const handleDomReady = () => {
+    void registerGuest().catch(() => void 0);
+  };
+  const handleGuestInteraction = () => {
+    entry.context.onGuestInteraction?.();
+  };
+  const handleDevToolsContextMenu = (event) => {
+    const hasNativeContextMenu = entry.context.feature.hostApi.showDevToolsContextMenu !== void 0;
+    const hasInlineContextMenu = entry.context.feature.hostApi.openDevTools !== void 0;
+    if (!hasNativeContextMenu && !hasInlineContextMenu) {
+      return;
+    }
+    event.preventDefault();
+    const point = resolveBrowserNodeContextMenuPoint(event, webview);
+    if (hasNativeContextMenu) {
+      void entry.context.feature.hostApi.showDevToolsContextMenu?.({
+        label: entry.context.feature.i18n.t("actions.openDevTools"),
+        nodeId: entry.context.nodeId,
+        point
+      }).catch((error) => {
+        reportBrowserNodeWebviewDiagnostic(
+          entry,
+          "devtools.native-context-menu.failed",
+          {
+            error: error instanceof Error ? error.message : String(error),
+            webContentsId: readBrowserNodeWebContentsId(webview),
+            webviewPartition: entry.state.webviewPartition
+          },
+          "warn"
+        );
+      });
+      return;
+    }
+    setBrowserNodeDevToolsContextMenu(entry, point);
+  };
+  const records = [
+    { event: "did-attach", listener: handleDidAttach },
+    { event: "dom-ready", listener: handleDomReady },
+    { event: "context-menu", listener: handleDevToolsContextMenu },
+    { event: "contextmenu", listener: handleDevToolsContextMenu },
+    { event: "focus", listener: handleGuestInteraction },
+    { event: "ipc-message", listener: handleGuestInteraction }
+  ];
+  for (const record of records) {
+    webview.addEventListener(record.event, record.listener);
+  }
+  entry.attachedListeners = records;
+}
+function resolveBrowserNodeContextMenuPoint(event, webview) {
+  const eventWithPoint = event;
+  const clientX = readFiniteNumber(eventWithPoint.clientX);
+  const clientY = readFiniteNumber(eventWithPoint.clientY);
+  if (clientX !== null && clientY !== null) {
+    return { x: clientX, y: clientY };
+  }
+  const paramX = readFiniteNumber(eventWithPoint.params?.x);
+  const paramY = readFiniteNumber(eventWithPoint.params?.y);
+  if (paramX !== null && paramY !== null) {
+    return { x: paramX, y: paramY };
+  }
+  const rect = webview.getBoundingClientRect();
+  return {
+    x: rect.left,
+    y: rect.top
+  };
+}
+function readFiniteNumber(value) {
+  return typeof value === "number" && Number.isFinite(value) ? value : null;
+}
+function readBrowserNodeWebContentsId(webview) {
+  const webContentsId = webview?.getWebContentsId?.();
+  return typeof webContentsId === "number" && Number.isFinite(webContentsId) ? webContentsId : null;
+}
+function reportBrowserNodeWebviewDiagnostic(entry, event, details, level = "info") {
+  entry.context.feature.reportDiagnostic?.({
+    details: {
+      ...details,
+      nodeId: entry.context.nodeId
+    },
+    event,
+    level
+  });
+}
+
+// src/react/useBrowserNodeWebview.ts
+function useBrowserNodeWebview({
+  feature,
+  initialUrl,
+  lifecycle,
+  navigationPolicy,
+  nodeId,
+  onGuestInteraction,
+  profileId,
+  sessionMode,
+  sessionPartition
+}) {
+  const controller = useMemo2(
+    () => acquireBrowserNodeWebviewController({
+      feature,
+      initialUrl,
+      lifecycle,
+      navigationPolicy,
+      nodeId,
+      onGuestInteraction,
+      profileId,
+      sessionMode,
+      sessionPartition
+    }),
+    [
+      feature,
+      initialUrl,
+      lifecycle,
+      navigationPolicy,
+      nodeId,
+      onGuestInteraction,
+      profileId,
+      sessionMode,
+      sessionPartition
+    ]
+  );
+  useEffect2(() => {
+    controller.retain();
+    return () => {
+      controller.release();
+    };
+  }, [controller]);
+  useEffect2(() => {
+    controller.sync();
+  }, [
+    controller,
+    initialUrl,
+    lifecycle,
+    navigationPolicy,
+    nodeId,
+    onGuestInteraction,
+    profileId,
+    sessionMode,
+    sessionPartition
+  ]);
+  const state = useExternalStoreSnapshot2({
+    getSnapshot() {
+      return controller.getState();
+    },
+    subscribe(listener) {
+      return controller.subscribe(listener);
+    }
+  });
+  const setWebviewRef = useCallback(
+    (element) => {
+      controller.setWebview(element);
+    },
+    [controller]
+  );
+  const dismissDevToolsContextMenu = useCallback(() => {
+    controller.dismissDevToolsContextMenu();
+  }, [controller]);
+  const openDevToolsFromContextMenu = useCallback(() => {
+    return controller.openDevToolsFromContextMenu();
+  }, [controller]);
+  return {
+    devToolsContextMenu: state.devToolsContextMenu,
+    dismissDevToolsContextMenu,
+    openDevToolsFromContextMenu,
+    shouldRenderWebview: state.shouldRenderWebview,
+    setWebviewRef,
+    webviewKey: state.webviewKey,
+    webviewPartition: state.webviewPartition,
+    webviewSrc: state.webviewSrc
+  };
+}
+
+// src/react/BrowserNode.tsx
+import { jsx, jsxs } from "react/jsx-runtime";
+var browserNodeAllowPopupsAttribute = "true";
+function BrowserNode({
+  defaultUrl,
+  feature,
+  navigationPolicy = null,
+  nodeId,
+  onFocusRequest,
+  onNavigated,
+  profileId = null,
+  sessionMode = "shared",
+  sessionPartition = null,
+  showHeader = true,
+  syncDefaultUrl = false
+}) {
+  const { controller, state } = useBrowserNodeController({
+    defaultUrl,
+    feature,
+    navigationPolicy,
+    nodeId,
+    profileId,
+    sessionMode,
+    sessionPartition,
+    syncDefaultUrl
+  });
+  const runtime = state.runtime;
+  const lastNavigatedUrlRef = useRef(
+    state.runtime.url?.trim() || null
+  );
+  const errorMessage = runtime.error ? formatBrowserNodeErrorMessage(feature, runtime.error) : null;
+  const errorStatus = runtime.error ? formatBrowserNodeErrorStatus(feature, runtime.error) : null;
+  const isShowingLoadError = errorMessage !== null;
+  const openExternalUrl = feature.hostApi.openExternal ? feature.resolveAddressInput(state.displayUrl).url : null;
+  const {
+    devToolsContextMenu,
+    dismissDevToolsContextMenu,
+    openDevToolsFromContextMenu,
+    shouldRenderWebview,
+    setWebviewRef,
+    webviewKey,
+    webviewPartition,
+    webviewSrc
+  } = useBrowserNodeWebview({
+    feature,
+    initialUrl: state.displayUrl,
+    lifecycle: runtime.lifecycle,
+    navigationPolicy,
+    nodeId,
+    onGuestInteraction: onFocusRequest,
+    profileId,
+    sessionMode,
+    sessionPartition
+  });
+  useEffect3(() => {
+    const navigatedUrl = state.runtime.url?.trim() ?? "";
+    if (!onNavigated || state.runtime.isLoading || state.runtime.error || navigatedUrl.length === 0 || navigatedUrl === "about:blank" || lastNavigatedUrlRef.current === navigatedUrl) {
+      return;
+    }
+    lastNavigatedUrlRef.current = navigatedUrl;
+    onNavigated(navigatedUrl);
+  }, [
+    onNavigated,
+    state.runtime.error,
+    state.runtime.isLoading,
+    state.runtime.url
+  ]);
+  return /* @__PURE__ */ jsxs("div", { className: "flex h-full min-h-0 flex-col overflow-hidden bg-[var(--background-panel)]", children: [
+    showHeader ? /* @__PURE__ */ jsx(
+      BrowserNodeHeader,
+      {
+        canGoBack: runtime.canGoBack,
+        canGoForward: runtime.canGoForward,
+        draftUrl: state.draftUrl,
+        feature,
+        isCold: runtime.lifecycle === "cold",
+        isLoading: runtime.isLoading,
+        onDraftUrlChange: (nextUrl) => controller.setDraftUrl(nextUrl),
+        onFocusRequest,
+        onSubmitUrl: () => {
+          void controller.submitDraftUrl().catch(() => void 0);
+        },
+        onOpenExternal: openExternalUrl ? () => {
+          void feature.hostApi.openExternal?.({ url: openExternalUrl }).catch(() => void 0);
+        } : void 0,
+        onGoBack: () => {
+          void controller.goBack().catch(() => void 0);
+        },
+        onGoForward: () => {
+          void controller.goForward().catch(() => void 0);
+        },
+        onReload: () => {
+          void controller.reload().catch(() => void 0);
+        }
+      }
+    ) : null,
+    /* @__PURE__ */ jsxs("div", { className: "relative min-h-0 flex-1 overflow-hidden bg-[var(--background-panel)]", children: [
+      shouldRenderWebview ? /* @__PURE__ */ jsx(
+        "webview",
+        {
+          allowpopups: browserNodeAllowPopupsAttribute,
+          ref: setWebviewRef,
+          className: cn(
+            "absolute inset-0 h-full w-full border-0 bg-[var(--background-panel)]",
+            isShowingLoadError ? "hidden pointer-events-none" : "visible"
+          ),
+          "data-browser-node-webview": "true",
+          partition: webviewPartition,
+          src: webviewSrc
+        },
+        webviewKey
+      ) : null,
+      errorMessage ? /* @__PURE__ */ jsx("div", { className: "absolute inset-0 z-10 flex items-center justify-center bg-[var(--background-panel)] px-8 py-10 text-center", children: /* @__PURE__ */ jsxs(
+        "div",
+        {
+          className: "flex w-full max-w-[440px] flex-col items-center",
+          role: "status",
+          "aria-live": "polite",
+          children: [
+            /* @__PURE__ */ jsx("div", { className: "flex size-11 items-center justify-center rounded-full border border-[color-mix(in_srgb,var(--state-danger)_22%,transparent)] bg-[color-mix(in_srgb,var(--state-danger)_8%,transparent)] text-[var(--state-danger)]", children: /* @__PURE__ */ jsx(WarningLinedIcon, { className: "size-5" }) }),
+            /* @__PURE__ */ jsx("div", { className: "mt-4 text-lg font-semibold text-[var(--text-primary)]", children: feature.i18n.t("loadFailed") }),
+            /* @__PURE__ */ jsx("div", { className: "mt-1 max-w-[360px] text-sm leading-5 text-[var(--text-secondary)]", children: errorMessage }),
+            errorStatus ? /* @__PURE__ */ jsx("div", { className: "mt-4 rounded-full border border-border bg-[var(--transparency-block)] px-2.5 py-1 text-xs font-medium text-[var(--text-secondary)]", children: errorStatus }) : null,
+            openExternalUrl ? /* @__PURE__ */ jsx("div", { className: "mt-5 flex flex-wrap items-center justify-center gap-2", children: /* @__PURE__ */ jsxs(
+              Button,
+              {
+                size: "sm",
+                type: "button",
+                variant: "outline",
+                onClick: () => {
+                  void feature.hostApi.openExternal?.({ url: openExternalUrl }).catch(() => void 0);
+                },
+                children: [
+                  /* @__PURE__ */ jsx(LaunchIcon, { className: "size-3.5" }),
+                  feature.i18n.t("actions.openExternal")
+                ]
+              }
+            ) }) : null
+          ]
+        }
+      ) }) : null,
+      devToolsContextMenu ? /* @__PURE__ */ jsx(
+        ViewportMenuSurface,
+        {
+          open: true,
+          className: "w-44",
+          dismissOnEscape: true,
+          dismissOnPointerDownOutside: true,
+          onDismiss: dismissDevToolsContextMenu,
+          placement: {
+            type: "point",
+            point: devToolsContextMenu,
+            alignX: "start",
+            alignY: "start",
+            estimatedSize: {
+              width: 176,
+              height: 40
+            }
+          },
+          children: /* @__PURE__ */ jsx(
+            "button",
+            {
+              className: cn(menuItemClassName, "w-full"),
+              type: "button",
+              onClick: () => {
+                void openDevToolsFromContextMenu().catch(() => void 0);
+              },
+              children: feature.i18n.t("actions.openDevTools")
+            }
+          )
+        }
+      ) : null
+    ] })
+  ] });
+}
+function BrowserNodeWorkbenchHeader({
+  className,
+  defaultActions,
+  defaultUrl,
+  dragHandleProps,
+  feature,
+  nodeId,
+  onCloseRequest,
+  onFocusRequest
+}) {
+  const { controller, state } = useBrowserNodeController({
+    defaultUrl,
+    feature,
+    nodeId
+  });
+  const runtime = state.runtime;
+  const openExternalUrl = feature.hostApi.openExternal ? feature.resolveAddressInput(state.displayUrl).url : null;
+  return /* @__PURE__ */ jsx(
+    BrowserNodeHeader,
+    {
+      canGoBack: runtime.canGoBack,
+      canGoForward: runtime.canGoForward,
+      className,
+      defaultActions,
+      draftUrl: state.draftUrl,
+      dragHandleProps,
+      feature,
+      isCold: runtime.lifecycle === "cold",
+      isLoading: runtime.isLoading,
+      onCloseRequest,
+      onDraftUrlChange: (nextUrl) => controller.setDraftUrl(nextUrl),
+      onFocusRequest,
+      onSubmitUrl: () => {
+        void controller.submitDraftUrl().catch(() => void 0);
+      },
+      onOpenExternal: openExternalUrl ? () => {
+        void feature.hostApi.openExternal?.({ url: openExternalUrl }).catch(() => void 0);
+      } : void 0,
+      onGoBack: () => {
+        void controller.goBack().catch(() => void 0);
+      },
+      onGoForward: () => {
+        void controller.goForward().catch(() => void 0);
+      },
+      onReload: () => {
+        void controller.reload().catch(() => void 0);
+      },
+      withBorder: false
+    }
+  );
+}
+function BrowserNodeHeader({
+  canGoBack,
+  canGoForward,
+  className,
+  defaultActions,
+  draftUrl,
+  dragHandleProps,
+  feature,
+  isCold = false,
+  isLoading,
+  onCloseRequest,
+  onDraftUrlChange,
+  onFocusRequest,
+  onGoBack,
+  onGoForward,
+  onOpenExternal,
+  onReload,
+  onSubmitUrl,
+  withBorder = true
+}) {
+  const [reloadAnimationKey, setReloadAnimationKey] = useState(0);
+  const handleReload = () => {
+    setReloadAnimationKey((currentKey) => currentKey + 1);
+    onReload();
+  };
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: cn(
+        "flex h-[var(--workbench-header-height,38px)] min-h-[var(--workbench-header-height,38px)] items-center gap-2 bg-[var(--background-panel)] px-2 pl-3",
+        withBorder ? "border-b border-border" : null,
+        className
+      ),
+      "data-browser-node-header": "true",
+      onDoubleClick: (event) => {
+        if (event.target instanceof Element && event.target.closest(".nodrag")) {
+          return;
+        }
+        event.stopPropagation();
+        dragHandleProps?.onDoubleClick?.(event);
+      },
+      children: [
+        /* @__PURE__ */ jsxs("div", { className: "inline-flex items-center gap-1", children: [
+          /* @__PURE__ */ jsx(
+            BrowserNodeHeaderButton,
+            {
+              disabled: !canGoBack,
+              label: feature.i18n.t("actions.back"),
+              onClick: onGoBack,
+              children: /* @__PURE__ */ jsx(ArrowLeftIcon, { className: "size-[15px]" })
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            BrowserNodeHeaderButton,
+            {
+              disabled: !canGoForward,
+              label: feature.i18n.t("actions.forward"),
+              onClick: onGoForward,
+              children: /* @__PURE__ */ jsx(ArrowRightIcon, { className: "size-[15px]" })
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            BrowserNodeHeaderButton,
+            {
+              label: feature.i18n.t("actions.reload"),
+              onClick: handleReload,
+              children: /* @__PURE__ */ jsx(
+                RefreshIcon,
+                {
+                  className: cn(
+                    "size-[15px]",
+                    reloadAnimationKey > 0 && "motion-safe:animate-[spin_520ms_cubic-bezier(0.4,0,0.2,1)_1_reverse]"
+                  )
+                },
+                reloadAnimationKey
+              )
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsx(
+          "div",
+          {
+            ...dragHandleProps,
+            className: "h-full w-8 shrink-0 cursor-grab active:cursor-grabbing",
+            "data-browser-node-drag-gutter": "true",
+            "data-node-drag-handle": "true",
+            "aria-hidden": "true"
+          }
+        ),
+        /* @__PURE__ */ jsxs(
+          "form",
+          {
+            className: "nodrag relative min-w-0 flex-1",
+            onSubmit: (event) => {
+              event.preventDefault();
+              event.stopPropagation();
+              onSubmitUrl();
+            },
+            children: [
+              /* @__PURE__ */ jsx(
+                Input,
+                {
+                  "aria-label": feature.i18n.t("addressLabel"),
+                  className: "pr-8 focus-visible:border-input focus-visible:ring-0 focus-visible:ring-offset-0",
+                  placeholder: feature.i18n.t("addressPlaceholder"),
+                  size: "sm",
+                  value: draftUrl,
+                  onChange: (event) => onDraftUrlChange(event.target.value),
+                  onFocus: onFocusRequest
+                }
+              ),
+              isLoading ? /* @__PURE__ */ jsx(LoadingIcon, { className: "pointer-events-none absolute right-2 top-1/2 z-[1] size-4 -translate-y-1/2 animate-spin text-[var(--text-tertiary)]" }) : null
+            ]
+          }
+        ),
+        onOpenExternal ? /* @__PURE__ */ jsx(
+          BrowserNodeHeaderButton,
+          {
+            label: feature.i18n.t("actions.openExternal"),
+            onClick: onOpenExternal,
+            children: /* @__PURE__ */ jsx(LaunchIcon, { className: "size-[15px]" })
+          }
+        ) : null,
+        defaultActions ? /* @__PURE__ */ jsxs("div", { className: "nodrag flex shrink-0 items-center gap-1.5", children: [
+          isCold ? /* @__PURE__ */ jsx(
+            Badge,
+            {
+              className: "h-[26px] min-w-7 rounded-md text-[10px] font-semibold lowercase tracking-[0.08em]",
+              "aria-label": feature.i18n.t("coldStatus"),
+              children: feature.i18n.t("coldStatus")
+            }
+          ) : null,
+          /* @__PURE__ */ jsx(
+            "span",
+            {
+              className: "contents",
+              onClickCapture: (event) => {
+                if (!onCloseRequest || !(event.target instanceof Element) || !event.target.closest('[data-workbench-action="close"]')) {
+                  return;
+                }
+                onCloseRequest();
+              },
+              children: defaultActions
+            }
+          )
+        ] }) : null
+      ]
+    }
+  );
+}
+function formatBrowserNodeErrorMessage(feature, error) {
+  switch (error.code) {
+    case "invalid-url":
+      return feature.i18n.t("errors.invalidUrl", error.params);
+    case "navigation-failed":
+      if (error.params && error.params.statusCode !== void 0) {
+        return feature.i18n.t(
+          "errors.navigationFailedWithStatus",
+          error.params
+        );
+      }
+      return feature.i18n.t("errors.navigationFailed", error.params);
+    case "unsupported-protocol":
+      return feature.i18n.t("errors.unsupportedProtocol", error.params);
+    case "unsupported-url":
+      return feature.i18n.t("errors.unsupportedUrl", error.params);
+  }
+}
+function formatBrowserNodeErrorStatus(feature, error) {
+  if (error.code !== "navigation-failed" || !error.params) {
+    return null;
+  }
+  const statusCode = error.params.statusCode;
+  if (typeof statusCode === "number") {
+    return feature.i18n.t("errors.statusCode", { statusCode });
+  }
+  const errorCode = error.params.errorCode;
+  if (typeof errorCode === "number") {
+    return feature.i18n.t("errors.errorCode", { errorCode });
+  }
+  return null;
+}
+function BrowserNodeHeaderButton({
+  children,
+  disabled,
+  label,
+  onClick
+}) {
+  return /* @__PURE__ */ jsx(
+    Button,
+    {
+      "aria-label": label,
+      className: "rounded-md",
+      disabled,
+      size: "icon-sm",
+      title: label,
+      type: "button",
+      variant: "chrome",
+      onClick,
+      children
+    }
+  );
+}
+
+export {
+  BrowserNode,
+  BrowserNodeWorkbenchHeader,
+  BrowserNodeHeader
+};
+//# sourceMappingURL=chunk-2GEY55PS.js.map