@autobest-ui/agent 1.0.0 → 1.0.1

package/plugins/figma-plugin/manifest.json

@@ -0,0 +1,32 @@
+{
+  "name": "Autobest Figma Plugin",
+  "id": "autobest-figma-plugin",
+  "api": "1.0.0",
+  "main": "code.js",
+  "ui": "ui.html",
+  "editorType": ["figma", "figjam", "dev"],
+  "capabilities": ["inspect"],
+  "documentAccess": "dynamic-page",
+  "networkAccess": {
+    "allowedDomains": ["none"],
+    "devAllowedDomains": [
+      "ws://localhost:3055",
+      "ws://localhost:3056",
+      "ws://localhost:3057",
+      "ws://localhost:3058",
+      "ws://localhost:3059",
+      "ws://localhost:3060",
+      "ws://localhost:3061",
+      "ws://localhost:3062",
+      "ws://localhost:3063",
+      "ws://localhost:3064",
+      "ws://localhost:3065",
+      "ws://localhost:3066",
+      "ws://localhost:3067",
+      "ws://localhost:3068",
+      "ws://localhost:3069",
+      "ws://localhost:3070"
+    ]
+  },
+  "permissions": ["currentuser"]
+}

package/plugins/figma-plugin/scripts/setup.mjs

@@ -0,0 +1,72 @@
+#!/usr/bin/env node
+
+import { cp, mkdir, rm } from "node:fs/promises";
+import os from "node:os";
+import path from "node:path";
+import { fileURLToPath } from "node:url";
+
+const sourceRoot = path.resolve(
+  path.dirname(fileURLToPath(import.meta.url)),
+  "..",
+);
+const agentHome = path.resolve(
+  process.env.AUTOBEST_AGENT_HOME || path.join(os.homedir(), ".autobest-agent"),
+);
+const pluginsRoot = path.join(agentHome, "figma-plugins");
+const installRoot = path.join(pluginsRoot, "figma-plugin");
+const pluginFiles = ["manifest.json", "code.js", "ui.html", "LICENSE"];
+
+function printHelp() {
+  process.stdout.write(`Figma Plugin 安装器
+
+用法：
+  figma-plugin [install]
+  figma-plugin uninstall
+  figma-plugin --help
+`);
+}
+
+function assertSafeInstallRoot() {
+  const expected = path.join(agentHome, "figma-plugins", "figma-plugin");
+  if (
+    installRoot !== expected ||
+    path.basename(installRoot) !== "figma-plugin" ||
+    path.dirname(installRoot) !== pluginsRoot
+  ) {
+    throw new Error(`拒绝操作非预期路径：${installRoot}`);
+  }
+}
+
+async function install() {
+  assertSafeInstallRoot();
+  await mkdir(installRoot, { recursive: true });
+  await Promise.all(
+    pluginFiles.map((file) =>
+      cp(path.join(sourceRoot, file), path.join(installRoot, file), {
+        force: true,
+      }),
+    ),
+  );
+  process.stdout.write(`Figma Plugin 已安装：${installRoot}\n`);
+  process.stdout.write(`请在 Figma 中导入：${path.join(installRoot, "manifest.json")}\n`);
+}
+
+async function uninstall() {
+  assertSafeInstallRoot();
+  await rm(installRoot, { recursive: true, force: true });
+  process.stdout.write(`Figma Plugin 本地文件已卸载：${installRoot}\n`);
+}
+
+const command = process.argv[2] || "install";
+
+if (command === "--help" || command === "-h" || command === "help") {
+  printHelp();
+} else if (command === "install") {
+  await install();
+} else if (command === "uninstall") {
+  await uninstall();
+} else {
+  process.stderr.write(`未知命令：${command}\n\n`);
+  printHelp();
+  process.exitCode = 1;
+}

package/plugins/figma-plugin/scripts/setup.test.mjs

@@ -0,0 +1,45 @@
+import assert from "node:assert/strict";
+import { execFile } from "node:child_process";
+import { access, mkdtemp, readFile } from "node:fs/promises";
+import os from "node:os";
+import path from "node:path";
+import test from "node:test";
+import { promisify } from "node:util";
+import { fileURLToPath } from "node:url";
+
+const execFileAsync = promisify(execFile);
+const setupPath = fileURLToPath(new URL("./setup.mjs", import.meta.url));
+
+test("installs, updates, and uninstalls the Figma plugin in a stable directory", async () => {
+  const temporaryRoot = await mkdtemp(
+    path.join(os.tmpdir(), "autobest-figma-plugin-"),
+  );
+  const agentHome = path.join(temporaryRoot, "agent-home");
+  const env = { ...process.env, AUTOBEST_AGENT_HOME: agentHome };
+  const installRoot = path.join(
+    agentHome,
+    "figma-plugins",
+    "figma-plugin",
+  );
+
+  const installed = await execFileAsync(process.execPath, [setupPath], { env });
+  assert.match(installed.stdout, /Figma Plugin 已安装/);
+  assert.match(installed.stdout, /manifest\.json/);
+
+  const manifest = JSON.parse(
+    await readFile(path.join(installRoot, "manifest.json"), "utf8"),
+  );
+  assert.equal(manifest.id, "autobest-figma-plugin");
+  await access(path.join(installRoot, "code.js"));
+  await access(path.join(installRoot, "ui.html"));
+  await access(path.join(installRoot, "LICENSE"));
+
+  await execFileAsync(process.execPath, [setupPath, "install"], { env });
+  await execFileAsync(process.execPath, [setupPath, "uninstall"], { env });
+  await assert.rejects(access(installRoot));
+
+  const help = await execFileAsync(process.execPath, [setupPath, "--help"], {
+    env,
+  });
+  assert.match(help.stdout, /figma-plugin uninstall/);
+});

package/plugins/figma-plugin/ui.html

@@ -0,0 +1,235 @@
+<!doctype html>
+<html>
+  <head>
+    <style>
+      body {
+        font-family: Inter, sans-serif;
+        font-size: 11px;
+        padding: 8px;
+        margin: 0;
+        background: #2c2c2c;
+        color: #fff;
+      }
+      .row {
+        display: flex;
+        align-items: center;
+        gap: 6px;
+      }
+      .port-label {
+        color: #999;
+      }
+      #port-input {
+        width: 60px;
+        padding: 4px 6px;
+        border-radius: 4px;
+        border: 1px solid #444;
+        background: #1e1e1e;
+        color: #fff;
+        font-size: 11px;
+      }
+      #port-input:focus {
+        outline: none;
+        border-color: #0d99ff;
+      }
+      #status-indicator {
+        font-size: 14px;
+        line-height: 1;
+        cursor: pointer;
+        user-select: none;
+        transition: color 0.15s;
+      }
+      #status-indicator.connected {
+        color: #2ecc71;
+      }
+      #status-indicator.disconnected,
+      #status-indicator.connecting {
+        color: #c2410c;
+      }
+      #readonly-badge {
+        color: #999;
+        border: 1px solid #444;
+        border-radius: 4px;
+        padding: 2px 5px;
+        white-space: nowrap;
+      }
+    </style>
+  </head>
+  <body>
+    <div class="row">
+      <span class="port-label">Port:</span>
+      <input
+        type="number"
+        id="port-input"
+        value="3055"
+        min="1024"
+        max="65535"
+        onchange="changePort()"
+      />
+      <span
+        id="status-indicator"
+        class="disconnected"
+        title="Disconnected — click to reconnect"
+        onclick="manualReconnect()"
+        >✓</span
+      >
+      <span
+        id="readonly-badge"
+        hidden
+        title="Dev Mode — the document is read-only, so only get/search/export tools work"
+        >read-only</span
+      >
+    </div>
+
+    <script>
+      const CONFIG = {
+        defaultPort: 3055,
+        reconnectMaxAttempts: 10,
+        reconnectBaseDelay: 1000,
+        reconnectMaxDelay: 30000,
+      };
+
+      let socket = null;
+      let reconnectAttempts = 0;
+      let reconnectTimer = null;
+      const indicator = document.getElementById("status-indicator");
+      const portInput = document.getElementById("port-input");
+
+      function getServerUrl() {
+        const port = parseInt(portInput.value, 10) || CONFIG.defaultPort;
+        return "ws://localhost:" + port;
+      }
+
+      function changePort() {
+        if (socket) {
+          socket.close(1000, "Port changed");
+          socket = null;
+        }
+        if (reconnectTimer) {
+          clearTimeout(reconnectTimer);
+          reconnectTimer = null;
+        }
+        reconnectAttempts = 0;
+        connect();
+      }
+
+      function setStatus(state, tooltip) {
+        indicator.className = state;
+        indicator.title = tooltip;
+      }
+
+      function manualReconnect() {
+        if (reconnectTimer) {
+          clearTimeout(reconnectTimer);
+          reconnectTimer = null;
+        }
+        reconnectAttempts = 0;
+        connect();
+      }
+
+      function connect() {
+        if (socket && socket.readyState === WebSocket.OPEN) return;
+
+        setStatus("connecting", "Connecting to port " + portInput.value + "…");
+
+        try {
+          socket = new WebSocket(getServerUrl());
+
+          socket.onopen = () => {
+            console.log("[UI] Connected to port " + portInput.value);
+            setStatus("connected", "Connected on port " + portInput.value);
+            reconnectAttempts = 0;
+            parent.postMessage(
+              { pluginMessage: { type: "get_handshake_info" } },
+              "*",
+            );
+          };
+
+          socket.onmessage = (event) => {
+            let message;
+            try {
+              message = JSON.parse(event.data);
+            } catch (e) {
+              console.error("[UI] Parse error:", e);
+              return;
+            }
+
+            if (message.type === "handshake_ack") {
+              console.log("[UI] Handshake acknowledged");
+              return;
+            }
+
+            if (message.type === "ping") {
+              socket.send(
+                JSON.stringify({ type: "pong", timestamp: message.timestamp }),
+              );
+              return;
+            }
+
+            if (message.requestId && message.command) {
+              parent.postMessage(
+                {
+                  pluginMessage: {
+                    type: "command",
+                    requestId: message.requestId,
+                    command: message.command,
+                    payload: message.payload || {},
+                  },
+                },
+                "*",
+              );
+            }
+          };
+
+          socket.onclose = (event) => {
+            console.log("[UI] Closed:", event.code);
+            setStatus("disconnected", "Disconnected — click to reconnect");
+            socket = null;
+            if (event.code !== 1000) scheduleReconnect();
+          };
+
+          socket.onerror = (e) => console.error("[UI] Error:", e);
+        } catch (error) {
+          console.error("[UI] Failed:", error);
+          scheduleReconnect();
+        }
+      }
+
+      function scheduleReconnect() {
+        if (reconnectAttempts >= CONFIG.reconnectMaxAttempts) {
+          setStatus("disconnected", "Failed — click to reconnect");
+          return;
+        }
+        const delay = Math.min(
+          CONFIG.reconnectBaseDelay * Math.pow(2, reconnectAttempts),
+          CONFIG.reconnectMaxDelay,
+        );
+        reconnectAttempts++;
+        setStatus("connecting", "Retry in " + delay / 1000 + "s — click to retry now");
+        reconnectTimer = setTimeout(connect, delay);
+      }
+
+      function sendToServer(data) {
+        if (socket && socket.readyState === WebSocket.OPEN) {
+          socket.send(JSON.stringify(data));
+        }
+      }
+
+      window.onmessage = (event) => {
+        const msg = event.data.pluginMessage;
+        if (!msg) return;
+
+        if (msg.type === "handshake_info") {
+          sendToServer({ type: "handshake", payload: msg.payload });
+        } else if (msg.type === "command_response") {
+          sendToServer({ responseTo: msg.requestId, payload: msg.payload });
+        } else if (msg.type === "editor_info") {
+          document.getElementById("readonly-badge").hidden =
+            !msg.payload.readOnly;
+        }
+      };
+
+      parent.postMessage({ pluginMessage: { type: "get_editor_info" } }, "*");
+      connect();
+    </script>
+  </body>
+</html>