openclaw-navigator 1.0.0

package/cli.mjs

@@ -0,0 +1,306 @@
+#!/usr/bin/env node
+
+/**
+ * openclaw-navigator
+ *
+ * Standalone CLI to pair the Navigator macOS browser with an OpenClaw gateway.
+ * Zero dependencies — pure Node.js.
+ *
+ * Usage:
+ *   npx openclaw-navigator
+ *   npx openclaw-navigator --port 18789
+ *   npx openclaw-navigator --url http://192.168.1.50:18789
+ */
+
+import { createInterface } from "node:readline";
+import { execSync, spawn } from "node:child_process";
+import { networkInterfaces, hostname, userInfo } from "node:os";
+
+// ── Colors (ANSI) ──────────────────────────────────────────────────────────
+
+const RESET = "\x1b[0m";
+const BOLD = "\x1b[1m";
+const DIM = "\x1b[2m";
+const GREEN = "\x1b[32m";
+const YELLOW = "\x1b[33m";
+const RED = "\x1b[31m";
+const CYAN = "\x1b[36m";
+const MAGENTA = "\x1b[35m";
+
+const ok = (msg) => console.log(`${GREEN}✓${RESET} ${msg}`);
+const warn = (msg) => console.log(`${YELLOW}⚠${RESET} ${msg}`);
+const fail = (msg) => console.error(`${RED}✗${RESET} ${msg}`);
+const info = (msg) => console.log(`${DIM}${msg}${RESET}`);
+const heading = (msg) => console.log(`\n${BOLD}${MAGENTA}${msg}${RESET}`);
+
+// ── Helpers ────────────────────────────────────────────────────────────────
+
+function getLocalIP() {
+  const ifaces = networkInterfaces();
+  for (const entries of Object.values(ifaces)) {
+    if (!entries) continue;
+    for (const e of entries) {
+      if (e.family === "IPv4" && !e.internal) return e.address;
+    }
+  }
+  return null;
+}
+
+function getTailscaleIP() {
+  const ifaces = networkInterfaces();
+  for (const entries of Object.values(ifaces)) {
+    if (!entries) continue;
+    for (const e of entries) {
+      if (e.family !== "IPv4" || e.internal) continue;
+      const [a, b] = e.address.split(".").map(Number);
+      if (a === 100 && b >= 64 && b <= 127) return e.address;
+    }
+  }
+  return null;
+}
+
+function commandExists(cmd) {
+  try {
+    execSync(`which ${cmd}`, { stdio: "ignore" });
+    return true;
+  } catch {
+    return false;
+  }
+}
+
+async function ask(question, options) {
+  const rl = createInterface({ input: process.stdin, output: process.stdout });
+  return new Promise((resolve) => {
+    if (options) {
+      console.log(`\n${BOLD}${question}${RESET}`);
+      options.forEach((opt, i) => {
+        console.log(`  ${CYAN}${i + 1}${RESET}) ${opt.label}${opt.hint ? `  ${DIM}${opt.hint}${RESET}` : ""}`);
+      });
+      rl.question(`\n${DIM}Enter choice [1-${options.length}]:${RESET} `, (answer) => {
+        rl.close();
+        const idx = parseInt(answer, 10) - 1;
+        resolve(options[idx]?.value ?? options[0]?.value);
+      });
+    } else {
+      rl.question(`${question} `, (answer) => {
+        rl.close();
+        resolve(answer.trim());
+      });
+    }
+  });
+}
+
+async function checkGateway(baseURL) {
+  try {
+    const resp = await fetch(`${baseURL}/navigator/status`, {
+      signal: AbortSignal.timeout(5000),
+    });
+    if (!resp.ok) return false;
+    const json = await resp.json();
+    return json.ok === true;
+  } catch {
+    return false;
+  }
+}
+
+async function generateToken(baseURL, displayName) {
+  try {
+    const resp = await fetch(`${baseURL}/navigator/pair`, {
+      method: "POST",
+      headers: { "Content-Type": "application/json" },
+      body: JSON.stringify({ displayName }),
+      signal: AbortSignal.timeout(5000),
+    });
+    if (!resp.ok) return null;
+    return await resp.json();
+  } catch {
+    return null;
+  }
+}
+
+function startCloudflaredTunnel(port) {
+  return new Promise((resolve) => {
+    const child = spawn("cloudflared", ["tunnel", "--url", `http://localhost:${port}`], {
+      stdio: ["ignore", "pipe", "pipe"],
+    });
+
+    let done = false;
+    const timeout = setTimeout(() => {
+      if (!done) { done = true; child.kill(); resolve(null); }
+    }, 30_000);
+
+    const onData = (data) => {
+      const match = data.toString().match(/https?:\/\/[a-z0-9-]+\.trycloudflare\.com/);
+      if (match && !done) {
+        done = true;
+        clearTimeout(timeout);
+        child.unref();
+        resolve(match[0]);
+      }
+    };
+
+    child.stdout?.on("data", onData);
+    child.stderr?.on("data", onData);
+    child.on("error", () => { if (!done) { done = true; clearTimeout(timeout); resolve(null); } });
+  });
+}
+
+// ── Connection Box ─────────────────────────────────────────────────────────
+
+function showConnectionBox(gatewayURL, token, deepLink, method) {
+  const w = 58;
+  const bar = "═".repeat(w);
+  const pad = (s) => s + " ".repeat(Math.max(0, w - s.length));
+
+  console.log("");
+  console.log(`${MAGENTA}╔${bar}╗${RESET}`);
+  console.log(`${MAGENTA}║${RESET} ${BOLD}🧭 Navigator Connection Info${RESET}${" ".repeat(w - 30)}${MAGENTA}║${RESET}`);
+  console.log(`${MAGENTA}║${RESET} ${DIM}Method: ${method}${RESET}${" ".repeat(Math.max(0, w - 9 - method.length))}${MAGENTA}║${RESET}`);
+  console.log(`${MAGENTA}╠${bar}╣${RESET}`);
+  console.log(`${MAGENTA}║${RESET}${" ".repeat(w)}${MAGENTA}║${RESET}`);
+  console.log(`${MAGENTA}║${RESET} ${pad(`URL:   ${gatewayURL}`)}${MAGENTA}║${RESET}`);
+  console.log(`${MAGENTA}║${RESET} ${pad(`Token: ${token}`)}${MAGENTA}║${RESET}`);
+  console.log(`${MAGENTA}║${RESET}${" ".repeat(w)}${MAGENTA}║${RESET}`);
+  console.log(`${MAGENTA}╠${bar}╣${RESET}`);
+  console.log(`${MAGENTA}║${RESET} ${DIM}Deep link (paste in Navigator address bar):${RESET}${" ".repeat(Math.max(0, w - 44))}${MAGENTA}║${RESET}`);
+  console.log(`${MAGENTA}╚${bar}╝${RESET}`);
+  console.log("");
+  console.log(`  ${CYAN}${deepLink}${RESET}`);
+  console.log("");
+  console.log(`${DIM}  Paste URL + Token into Navigator > Settings > OpenClaw${RESET}`);
+  console.log(`${DIM}  Or paste the deep link into the address bar and press Enter.${RESET}`);
+  console.log("");
+}
+
+// ── Main ───────────────────────────────────────────────────────────────────
+
+async function main() {
+  // Parse args
+  const args = process.argv.slice(2);
+  let port = 18789;
+  let explicitURL = null;
+
+  for (let i = 0; i < args.length; i++) {
+    if (args[i] === "--port" && args[i + 1]) port = parseInt(args[i + 1], 10);
+    if (args[i] === "--url" && args[i + 1]) explicitURL = args[i + 1];
+    if (args[i] === "--help" || args[i] === "-h") {
+      console.log(`
+${BOLD}openclaw-navigator${RESET} — Connect Navigator browser to OpenClaw
+
+${BOLD}Usage:${RESET}
+  npx openclaw-navigator
+  npx openclaw-navigator --port 18789
+  npx openclaw-navigator --url http://192.168.1.50:18789
+
+${BOLD}Options:${RESET}
+  --port <port>   Gateway port (default: 18789)
+  --url <url>     Explicit gateway HTTP base URL
+  --help          Show this help
+`);
+      process.exit(0);
+    }
+  }
+
+  const baseURL = explicitURL ?? `http://127.0.0.1:${port}`;
+
+  heading("🧭 Navigator Setup");
+  info("Connect the Navigator browser to this OpenClaw gateway\n");
+
+  // ── Step 1: Check gateway ───────────────────────────────────────────────
+  process.stdout.write(`${DIM}Checking gateway at ${baseURL}...${RESET}`);
+  const running = await checkGateway(baseURL);
+
+  if (!running) {
+    process.stdout.write("\r" + " ".repeat(60) + "\r");
+    fail(`Gateway not reachable at ${baseURL}/navigator/status`);
+    console.log("");
+    console.log("  Make sure the gateway is running:");
+    console.log(`  ${CYAN}openclaw gateway --allow-unconfigured${RESET}`);
+    console.log("");
+    process.exit(1);
+  }
+
+  process.stdout.write("\r" + " ".repeat(60) + "\r");
+  ok(`Gateway running at ${baseURL}`);
+
+  // ── Step 2: Choose connection method ────────────────────────────────────
+  const hasCloudflared = commandExists("cloudflared");
+  const tailscaleIP = getTailscaleIP();
+  const localIP = getLocalIP();
+
+  const methods = [];
+  if (hasCloudflared) methods.push({ value: "cloudflare", label: "Cloudflare Tunnel (recommended)", hint: "works anywhere" });
+  if (tailscaleIP) methods.push({ value: "tailscale", label: "Tailscale", hint: tailscaleIP });
+  methods.push({ value: "ssh", label: "SSH Tunnel", hint: "run SSH on your Mac" });
+  if (localIP) methods.push({ value: "lan", label: "Direct LAN", hint: localIP });
+
+  const method = await ask("How will Navigator connect to this machine?", methods);
+
+  // ── Step 3: Resolve gateway URL ─────────────────────────────────────────
+  let gatewayURL;
+
+  switch (method) {
+    case "cloudflare": {
+      process.stdout.write(`\n${DIM}Starting Cloudflare tunnel...${RESET}`);
+      const tunnelURL = await startCloudflaredTunnel(port);
+      if (!tunnelURL) {
+        process.stdout.write("\r" + " ".repeat(60) + "\r");
+        fail("Failed to start tunnel. Install: brew install cloudflare/cloudflare/cloudflared");
+        process.exit(1);
+      }
+      process.stdout.write("\r" + " ".repeat(60) + "\r");
+      ok(`Tunnel active: ${tunnelURL}`);
+      gatewayURL = tunnelURL.replace(/^https:\/\//, "wss://").replace(/^http:\/\//, "ws://");
+      break;
+    }
+    case "tailscale": {
+      gatewayURL = `ws://${tailscaleIP}:${port}`;
+      ok(`Using Tailscale: ${tailscaleIP}:${port}`);
+      break;
+    }
+    case "ssh": {
+      gatewayURL = `ws://127.0.0.1:${port}`;
+      console.log("");
+      console.log(`${BOLD}Run this on your Mac:${RESET}`);
+      console.log(`  ${CYAN}ssh -L ${port}:127.0.0.1:${port} ${userInfo().username}@${hostname()}${RESET}`);
+      console.log(`${DIM}Keep SSH open while using Navigator.${RESET}`);
+      break;
+    }
+    case "lan": {
+      gatewayURL = `ws://${localIP}:${port}`;
+      ok(`Using LAN: ${localIP}:${port}`);
+      warn("Make sure gateway is bound to LAN (--bind lan) and both machines are on the same network.");
+      break;
+    }
+  }
+
+  // ── Step 4: Generate pairing token ──────────────────────────────────────
+  const displayName = hostname().replace(/\.local$/, "");
+  process.stdout.write(`\n${DIM}Generating pairing token...${RESET}`);
+  const pairing = await generateToken(baseURL, displayName);
+
+  if (!pairing?.token) {
+    process.stdout.write("\r" + " ".repeat(60) + "\r");
+    fail("Failed to generate pairing token from /navigator/pair");
+    process.exit(1);
+  }
+
+  process.stdout.write("\r" + " ".repeat(60) + "\r");
+  ok("Pairing token generated");
+
+  // ── Step 5: Show result ─────────────────────────────────────────────────
+  const deepLink = `navigator://connect?url=${encodeURIComponent(gatewayURL)}&token=${pairing.token}&name=${encodeURIComponent(displayName)}`;
+
+  showConnectionBox(gatewayURL, pairing.token, deepLink, method);
+
+  // Keep tunnel alive if cloudflare
+  if (method === "cloudflare") {
+    console.log(`${YELLOW}Tunnel is running. Press Ctrl+C to stop.${RESET}\n`);
+    await new Promise(() => {}); // wait forever
+  }
+}
+
+main().catch((err) => {
+  fail(err.message || String(err));
+  process.exit(1);
+});

package/package.json

@@ -0,0 +1,23 @@
+{
+  "name": "openclaw-navigator",
+  "version": "1.0.0",
+  "description": "Connect the Navigator browser to your OpenClaw gateway",
+  "license": "MIT",
+  "bin": {
+    "openclaw-navigator": "cli.mjs"
+  },
+  "files": [
+    "cli.mjs"
+  ],
+  "type": "module",
+  "engines": {
+    "node": ">=18.0.0"
+  },
+  "keywords": [
+    "openclaw",
+    "navigator",
+    "browser",
+    "gateway",
+    "setup"
+  ]
+}