@qontinui/ui-bridge 0.2.0 → 0.3.0

package/dist/server/standalone.js

@@ -0,0 +1,719 @@
+'use strict';
+
+// src/server/types.ts
+var UI_BRIDGE_ROUTES = [
+  // Render log
+  { method: "GET", path: "/render-log", handler: "getRenderLog" },
+  { method: "DELETE", path: "/render-log", handler: "clearRenderLog" },
+  { method: "POST", path: "/render-log/snapshot", handler: "captureSnapshot" },
+  { method: "GET", path: "/render-log/path", handler: "getRenderLogPath" },
+  // Control - Elements
+  { method: "GET", path: "/control/elements", handler: "getElements" },
+  { method: "GET", path: "/control/element/:id", handler: "getElement", params: ["id"] },
+  { method: "GET", path: "/control/element/:id/state", handler: "getElementState", params: ["id"] },
+  {
+    method: "POST",
+    path: "/control/element/:id/action",
+    handler: "executeElementAction",
+    params: ["id"],
+    bodyRequired: true
+  },
+  // Control - Components
+  { method: "GET", path: "/control/components", handler: "getComponents" },
+  { method: "GET", path: "/control/component/:id", handler: "getComponent", params: ["id"] },
+  { method: "GET", path: "/control/component/:id/state", handler: "getComponentState", params: ["id"] },
+  {
+    method: "POST",
+    path: "/control/component/:id/action/:actionId",
+    handler: "executeComponentAction",
+    params: ["id", "actionId"],
+    bodyRequired: true
+  },
+  // Find (formerly Discovery)
+  { method: "POST", path: "/control/find", handler: "find" },
+  { method: "POST", path: "/control/discover", handler: "discover" },
+  // @deprecated Use /control/find
+  { method: "GET", path: "/control/snapshot", handler: "getControlSnapshot" },
+  // Workflows
+  { method: "GET", path: "/control/workflows", handler: "getWorkflows" },
+  { method: "POST", path: "/control/workflow/:id/run", handler: "runWorkflow", params: ["id"] },
+  {
+    method: "GET",
+    path: "/control/workflow/:runId/status",
+    handler: "getWorkflowStatus",
+    params: ["runId"]
+  },
+  // Debug
+  { method: "GET", path: "/debug/action-history", handler: "getActionHistory" },
+  { method: "GET", path: "/debug/metrics", handler: "getMetrics" },
+  { method: "POST", path: "/debug/highlight/:id", handler: "highlightElement", params: ["id"] },
+  { method: "GET", path: "/debug/element-tree", handler: "getElementTree" },
+  // AI-native endpoints
+  { method: "POST", path: "/ai/search", handler: "aiSearch", bodyRequired: true },
+  { method: "POST", path: "/ai/execute", handler: "aiExecute", bodyRequired: true },
+  { method: "POST", path: "/ai/assert", handler: "aiAssert", bodyRequired: true },
+  { method: "POST", path: "/ai/assert/batch", handler: "aiAssertBatch", bodyRequired: true },
+  { method: "GET", path: "/ai/snapshot", handler: "getSemanticSnapshot" },
+  { method: "GET", path: "/ai/diff", handler: "getSemanticDiff" },
+  { method: "GET", path: "/ai/summary", handler: "getPageSummary" },
+  { method: "POST", path: "/ai/semantic-search", handler: "aiSemanticSearch", bodyRequired: true }
+];
+
+// src/server/websocket-handler.ts
+function generateId() {
+  return `${Date.now()}-${Math.random().toString(36).slice(2, 11)}`;
+}
+var VERSION = "0.1.0";
+var UIBridgeWSHandler = class {
+  constructor(handlers, options = {}) {
+    this.clients = /* @__PURE__ */ new Map();
+    this.handlers = handlers;
+    this.verbose = options.verbose ?? false;
+    this.log = options.log ?? console.log;
+  }
+  /**
+   * Handle new WebSocket connection
+   */
+  handleConnection(ws) {
+    const clientId = generateId();
+    const client = {
+      id: clientId,
+      ws,
+      subscription: {
+        events: /* @__PURE__ */ new Set(),
+        elementIds: /* @__PURE__ */ new Set(),
+        componentIds: /* @__PURE__ */ new Set()
+      },
+      connectedAt: Date.now()
+    };
+    this.clients.set(clientId, client);
+    if (this.verbose) {
+      this.log(`[WS] Client connected: ${clientId}`);
+    }
+    ws.onmessage = (event) => {
+      this.handleMessage(clientId, event.data);
+    };
+    ws.onclose = () => {
+      this.handleDisconnect(clientId);
+    };
+    this.sendToClient(clientId, {
+      id: generateId(),
+      type: "welcome",
+      timestamp: Date.now(),
+      payload: {
+        version: VERSION,
+        features: {
+          renderLog: true,
+          control: true,
+          debug: true
+        },
+        clientId
+      }
+    });
+    return clientId;
+  }
+  /**
+   * Handle client disconnect
+   */
+  handleDisconnect(clientId) {
+    this.clients.delete(clientId);
+    if (this.verbose) {
+      this.log(`[WS] Client disconnected: ${clientId}`);
+    }
+  }
+  /**
+   * Handle incoming message
+   */
+  async handleMessage(clientId, data) {
+    const client = this.clients.get(clientId);
+    if (!client) return;
+    let message;
+    try {
+      message = JSON.parse(data);
+    } catch (error) {
+      this.sendError(clientId, void 0, "PARSE_ERROR", "Invalid JSON message");
+      return;
+    }
+    if (this.verbose) {
+      this.log(`[WS] ${clientId} -> ${message.type}`);
+    }
+    try {
+      switch (message.type) {
+        case "ping":
+          this.handlePing(clientId, message.id);
+          break;
+        case "subscribe":
+          await this.handleSubscribe(clientId, message);
+          break;
+        case "unsubscribe":
+          await this.handleUnsubscribe(clientId, message);
+          break;
+        case "find":
+          await this.handleFind(clientId, message);
+          break;
+        case "discover":
+          await this.handleFind(clientId, message);
+          break;
+        case "getElement":
+          await this.handleGetElement(clientId, message);
+          break;
+        case "getSnapshot":
+          await this.handleGetSnapshot(clientId, message);
+          break;
+        case "executeAction":
+          await this.handleExecuteAction(clientId, message);
+          break;
+        case "executeComponentAction":
+          await this.handleExecuteComponentAction(clientId, message);
+          break;
+        case "executeWorkflow":
+          await this.handleExecuteWorkflow(clientId, message);
+          break;
+        default:
+          this.sendError(
+            clientId,
+            message.id,
+            "UNKNOWN_MESSAGE",
+            `Unknown message type: ${message.type}`
+          );
+      }
+    } catch (error) {
+      const err = error instanceof Error ? error : new Error(String(error));
+      this.sendError(clientId, message.id, "HANDLER_ERROR", err.message);
+    }
+  }
+  /**
+   * Handle ping message
+   */
+  handlePing(clientId, _requestId) {
+    this.sendToClient(clientId, {
+      id: generateId(),
+      type: "pong",
+      timestamp: Date.now()
+    });
+  }
+  /**
+   * Handle subscribe message
+   */
+  async handleSubscribe(clientId, message) {
+    const client = this.clients.get(clientId);
+    if (!client) return;
+    const { events, elementIds, componentIds } = message.payload;
+    if (events?.length) {
+      for (const event of events) {
+        client.subscription.events.add(event);
+      }
+    }
+    if (elementIds?.length) {
+      for (const id of elementIds) {
+        client.subscription.elementIds.add(id);
+      }
+    }
+    if (componentIds?.length) {
+      for (const id of componentIds) {
+        client.subscription.componentIds.add(id);
+      }
+    }
+    this.sendToClient(clientId, {
+      id: generateId(),
+      type: "subscribed",
+      timestamp: Date.now(),
+      payload: {
+        events: Array.from(client.subscription.events)
+      }
+    });
+  }
+  /**
+   * Handle unsubscribe message
+   */
+  async handleUnsubscribe(clientId, message) {
+    const client = this.clients.get(clientId);
+    if (!client) return;
+    const { events } = message.payload;
+    let removedEvents;
+    if (events?.length) {
+      removedEvents = events.filter((e) => client.subscription.events.has(e));
+      for (const event of events) {
+        client.subscription.events.delete(event);
+      }
+    } else {
+      removedEvents = Array.from(client.subscription.events);
+      client.subscription.events.clear();
+      client.subscription.elementIds.clear();
+      client.subscription.componentIds.clear();
+    }
+    this.sendToClient(clientId, {
+      id: generateId(),
+      type: "unsubscribed",
+      timestamp: Date.now(),
+      payload: {
+        events: removedEvents
+      }
+    });
+  }
+  /**
+   * Handle find message
+   */
+  async handleFind(clientId, message) {
+    const result = await this.handlers.find(message.payload || {});
+    if (result.success && result.data) {
+      this.sendResponse(clientId, message.id, true, { elements: result.data.elements });
+    } else {
+      this.sendResponse(clientId, message.id, false, void 0, result.error);
+    }
+  }
+  /**
+   * Handle getElement message
+   */
+  async handleGetElement(clientId, message) {
+    const { elementId } = message.payload;
+    const result = await this.handlers.getElement(elementId);
+    if (result.success) {
+      this.sendResponse(clientId, message.id, true, { element: result.data });
+    } else {
+      this.sendResponse(clientId, message.id, false, void 0, result.error);
+    }
+  }
+  /**
+   * Handle getSnapshot message
+   */
+  async handleGetSnapshot(clientId, message) {
+    const result = await this.handlers.getControlSnapshot();
+    if (result.success) {
+      this.sendResponse(clientId, message.id, true, result.data);
+    } else {
+      this.sendResponse(clientId, message.id, false, void 0, result.error);
+    }
+  }
+  /**
+   * Handle executeAction message
+   */
+  async handleExecuteAction(clientId, message) {
+    const { elementId, action } = message.payload;
+    const result = await this.handlers.executeElementAction(elementId, action);
+    this.sendResponse(clientId, message.id, result.success, result.data, result.error);
+  }
+  /**
+   * Handle executeComponentAction message
+   */
+  async handleExecuteComponentAction(clientId, message) {
+    const { componentId, action, params } = message.payload;
+    const result = await this.handlers.executeComponentAction(componentId, { action, params });
+    this.sendResponse(clientId, message.id, result.success, result.data, result.error);
+  }
+  /**
+   * Handle executeWorkflow message
+   */
+  async handleExecuteWorkflow(clientId, message) {
+    const { workflowId, params } = message.payload;
+    const result = await this.handlers.runWorkflow(workflowId, { params });
+    this.sendResponse(clientId, message.id, result.success, result.data, result.error);
+  }
+  /**
+   * Broadcast event to all subscribed clients
+   */
+  broadcastEvent(event) {
+    for (const [clientId, client] of this.clients) {
+      if (client.subscription.events.size === 0 || client.subscription.events.has(event.type)) {
+        const eventData = event.data;
+        if (eventData.elementId && client.subscription.elementIds.size > 0 && !client.subscription.elementIds.has(eventData.elementId)) {
+          continue;
+        }
+        if (eventData.componentId && client.subscription.componentIds.size > 0 && !client.subscription.componentIds.has(eventData.componentId)) {
+          continue;
+        }
+        this.sendToClient(clientId, {
+          id: generateId(),
+          type: "event",
+          timestamp: Date.now(),
+          payload: event
+        });
+      }
+    }
+  }
+  /**
+   * Send message to specific client
+   */
+  sendToClient(clientId, message) {
+    const client = this.clients.get(clientId);
+    if (!client || client.ws.readyState !== 1) return;
+    try {
+      client.ws.send(JSON.stringify(message));
+      if (this.verbose && message.type !== "pong") {
+        this.log(`[WS] ${clientId} <- ${message.type}`);
+      }
+    } catch (error) {
+      console.error(`Failed to send message to ${clientId}:`, error);
+    }
+  }
+  /**
+   * Send response message
+   */
+  sendResponse(clientId, requestId, success, data, error) {
+    this.sendToClient(clientId, {
+      id: generateId(),
+      type: "response",
+      timestamp: Date.now(),
+      requestId,
+      payload: {
+        success,
+        data,
+        error
+      }
+    });
+  }
+  /**
+   * Send error message
+   */
+  sendError(clientId, requestId, code, message) {
+    this.sendToClient(clientId, {
+      id: generateId(),
+      type: "error",
+      timestamp: Date.now(),
+      requestId,
+      payload: {
+        code,
+        message
+      }
+    });
+  }
+  /**
+   * Get connected client count
+   */
+  get clientCount() {
+    return this.clients.size;
+  }
+  /**
+   * Get all connected client IDs
+   */
+  get clientIds() {
+    return Array.from(this.clients.keys());
+  }
+  /**
+   * Disconnect all clients
+   */
+  disconnectAll() {
+    for (const [_clientId, client] of this.clients) {
+      try {
+        client.ws.close();
+      } catch {
+      }
+    }
+    this.clients.clear();
+  }
+};
+
+// src/server/standalone.ts
+var DEFAULT_CONFIG = {
+  host: "localhost",
+  port: 9876,
+  websocket: false,
+  websocketPort: 9876,
+  log: console.log
+};
+function wrapError(error, code) {
+  return {
+    success: false,
+    error: typeof error === "string" ? error : error.message,
+    code,
+    timestamp: Date.now()
+  };
+}
+var StandaloneServer = class {
+  constructor(handlers, config = {}) {
+    this.server = null;
+    this.wsServer = null;
+    this.wsHandler = null;
+    this.wsConnections = /* @__PURE__ */ new Set();
+    this.handlers = handlers;
+    this.config = { ...DEFAULT_CONFIG, ...config };
+    if (this.config.websocket) {
+      this.wsHandler = new UIBridgeWSHandler(handlers, {
+        verbose: true,
+        log: this.config.log
+      });
+    }
+  }
+  /**
+   * Start the server
+   */
+  async start() {
+    const http = await import('http');
+    this.server = http.createServer(async (req, res) => {
+      await this.handleRequest(req, res);
+    });
+    if (this.config.websocket && this.wsHandler) {
+      await this.startWebSocketServer();
+    }
+    return new Promise((resolve, reject) => {
+      this.server.listen(this.config.port, this.config.host, () => {
+        this.config.log(
+          `UI Bridge server listening on http://${this.config.host}:${this.config.port}`
+        );
+        if (this.config.websocket) {
+          const wsPort = this.config.websocketPort || this.config.port;
+          this.config.log(
+            `UI Bridge WebSocket server listening on ws://${this.config.host}:${wsPort}`
+          );
+        }
+        resolve();
+      });
+      this.server.on("error", reject);
+    });
+  }
+  /**
+   * Start WebSocket server
+   */
+  async startWebSocketServer() {
+    try {
+      const { WebSocketServer } = await import('ws');
+      const wsPort = this.config.websocketPort || this.config.port;
+      const useSamePort = wsPort === this.config.port;
+      if (useSamePort && this.server) {
+        this.wsServer = new WebSocketServer({ server: this.server });
+      } else {
+        this.wsServer = new WebSocketServer({
+          host: this.config.host,
+          port: wsPort
+        });
+      }
+      const wss = this.wsServer;
+      wss.on("connection", (ws) => {
+        this.wsConnections.add(ws);
+        this.wsHandler.handleConnection(ws);
+        ws.onclose = () => {
+          this.wsConnections.delete(ws);
+        };
+      });
+      wss.on("error", (error) => {
+        this.config.log(`WebSocket server error: ${error.message}`);
+      });
+    } catch (error) {
+      this.config.log(
+        'Warning: WebSocket support requires the "ws" package. Install it with: npm install ws'
+      );
+      this.wsHandler = null;
+    }
+  }
+  /**
+   * Stop the server
+   */
+  async stop() {
+    if (this.wsHandler) {
+      this.wsHandler.disconnectAll();
+    }
+    if (this.wsServer) {
+      const wss = this.wsServer;
+      wss.close();
+      this.wsServer = null;
+    }
+    for (const ws of this.wsConnections) {
+      ws.close();
+    }
+    this.wsConnections.clear();
+    return new Promise((resolve, reject) => {
+      if (!this.server) {
+        resolve();
+        return;
+      }
+      this.server.close((err) => {
+        if (err) reject(err);
+        else resolve();
+      });
+    });
+  }
+  /**
+   * Handle an HTTP request
+   */
+  async handleRequest(req, res) {
+    const url = new URL(req.url || "/", `http://${req.headers.host}`);
+    const method = req.method || "GET";
+    const basePath = this.config.basePath || "/ui-bridge";
+    if (this.config.cors) {
+      res.setHeader("Access-Control-Allow-Origin", "*");
+      res.setHeader("Access-Control-Allow-Methods", "GET, POST, PUT, DELETE, OPTIONS");
+      res.setHeader("Access-Control-Allow-Headers", "Content-Type, Authorization");
+    }
+    if (method === "OPTIONS") {
+      res.writeHead(204);
+      res.end();
+      return;
+    }
+    if (url.pathname === "/health") {
+      this.sendJSON(res, { status: "ok", timestamp: Date.now() });
+      return;
+    }
+    let path = url.pathname;
+    if (path.startsWith(basePath)) {
+      path = path.slice(basePath.length) || "/";
+    }
+    const route = this.findRoute(path, method);
+    if (!route) {
+      this.sendJSON(res, wrapError("Not found", "NOT_FOUND"), 404);
+      return;
+    }
+    try {
+      let body = {};
+      if (method === "POST") {
+        body = await this.parseBody(req);
+      }
+      const params = this.extractParams(path, route.path);
+      const handlerName = route.handler;
+      const handler = this.handlers[handlerName];
+      if (!handler) {
+        this.sendJSON(res, wrapError("Not implemented", "NOT_IMPLEMENTED"), 501);
+        return;
+      }
+      const args = [];
+      if (route.params) {
+        for (const param of route.params) {
+          args.push(params[param]);
+        }
+      }
+      if (method === "POST") {
+        args.push(body);
+      }
+      if (method === "GET") {
+        const query = Object.fromEntries(url.searchParams);
+        if (Object.keys(query).length > 0) {
+          args.push(query);
+        }
+      }
+      const result = await handler(
+        ...args
+      );
+      this.sendJSON(res, result);
+    } catch (error) {
+      this.config.log(`Error handling ${method} ${path}: ${error}`);
+      this.sendJSON(res, wrapError(error, "INTERNAL_ERROR"), 500);
+    }
+  }
+  /**
+   * Find a matching route
+   */
+  findRoute(path, method) {
+    for (const route of UI_BRIDGE_ROUTES) {
+      if (route.method !== method) continue;
+      const routeRegex = route.path.replace(/:[^/]+/g, "([^/]+)").replace(/\//g, "\\/");
+      const regex = new RegExp(`^${routeRegex}$`);
+      if (regex.test(path)) {
+        return route;
+      }
+    }
+    return null;
+  }
+  /**
+   * Extract params from path
+   */
+  extractParams(path, routePath) {
+    const params = {};
+    const routeParts = routePath.split("/");
+    const pathParts = path.split("/");
+    for (let i = 0; i < routeParts.length; i++) {
+      if (routeParts[i].startsWith(":")) {
+        params[routeParts[i].slice(1)] = pathParts[i];
+      }
+    }
+    return params;
+  }
+  /**
+   * Parse request body
+   */
+  parseBody(req) {
+    return new Promise((resolve, reject) => {
+      let data = "";
+      req.on("data", (chunk) => data += chunk);
+      req.on("end", () => {
+        try {
+          resolve(data ? JSON.parse(data) : {});
+        } catch {
+          resolve({});
+        }
+      });
+      req.on("error", reject);
+    });
+  }
+  /**
+   * Send JSON response
+   */
+  sendJSON(res, data, status = 200) {
+    res.writeHead(status, { "Content-Type": "application/json" });
+    res.end(JSON.stringify(data));
+  }
+  /**
+   * Broadcast a message to all WebSocket connections (legacy)
+   */
+  broadcast(message) {
+    const data = JSON.stringify(message);
+    for (const ws of this.wsConnections) {
+      if (ws.readyState === 1) {
+        ws.send(data);
+      }
+    }
+  }
+  /**
+   * Broadcast an event to all subscribed WebSocket clients
+   */
+  broadcastEvent(event) {
+    if (this.wsHandler) {
+      this.wsHandler.broadcastEvent(event);
+    }
+  }
+  /**
+   * Get WebSocket handler for direct access
+   */
+  getWSHandler() {
+    return this.wsHandler;
+  }
+  /**
+   * Get number of connected WebSocket clients
+   */
+  get wsClientCount() {
+    return this.wsHandler?.clientCount ?? 0;
+  }
+  /**
+   * Get the server address
+   */
+  getAddress() {
+    const address = this.server?.address();
+    if (!address || typeof address === "string") return null;
+    return { host: this.config.host, port: address.port };
+  }
+};
+async function createStandaloneServer(handlers, config) {
+  const server = new StandaloneServer(handlers, config);
+  await server.start();
+  return server;
+}
+async function startCLI(handlers, args = process.argv.slice(2)) {
+  const config = {};
+  for (let i = 0; i < args.length; i++) {
+    const arg = args[i];
+    const nextArg = args[i + 1];
+    if (arg === "--port" || arg === "-p") {
+      config.port = parseInt(nextArg);
+      i++;
+    } else if (arg === "--host" || arg === "-h") {
+      config.host = nextArg;
+      i++;
+    } else if (arg === "--cors") {
+      config.cors = true;
+    }
+  }
+  const server = await createStandaloneServer(handlers, config);
+  process.on("SIGINT", async () => {
+    console.log("\nShutting down...");
+    await server.stop();
+    process.exit(0);
+  });
+  process.on("SIGTERM", async () => {
+    await server.stop();
+    process.exit(0);
+  });
+}
+
+exports.StandaloneServer = StandaloneServer;
+exports.createStandaloneServer = createStandaloneServer;
+exports.startCLI = startCLI;
+//# sourceMappingURL=standalone.js.map
+//# sourceMappingURL=standalone.js.map