@rainbow-robotics/muscat-plugin-kit 0.1.2-dev.21 → 0.1.2-dev.22

package/cli/src/build.mjs

@@ -9,10 +9,47 @@
 // Muscat/robot and preview-host provide those modules through a sandbox import
 // map, so plugin ZIPs do not carry the UI runtime.
 import { cpSync, copyFileSync, existsSync, mkdirSync, readFileSync, rmSync, writeFileSync } from "node:fs";
-import { resolve } from "node:path";
+import { createRequire } from "node:module";
+import { dirname, resolve } from "node:path";
 import { spawnSync } from "node:child_process";
-import { buildWithFallback } from "./esbuild.mjs";
-import { findPluginRoot, log } from "./util.mjs";
+import { findPluginRoot, hasBin, log } from "./util.mjs";
+
+// Find a usable node binary (for running vite as subprocess).
+function findNodeBin() {
+  if (typeof Bun === "undefined") return process.execPath; // already node
+  for (const c of ["node", "node20", "node18"]) {
+    if (hasBin(c)) return c;
+  }
+  return null;
+}
+
+// Resolve vite bin path from the plugin root, hoisting-aware.
+function findViteBin(pluginRoot) {
+  try {
+    const req = createRequire(resolve(pluginRoot, "package.json"));
+    const vitePkg = req.resolve("vite/package.json");
+    return resolve(dirname(vitePkg), "bin", "vite.js");
+  } catch {
+    return null;
+  }
+}
+
+// Run vite build in the plugin project.
+// Returns true on success, false if vite/node not available.
+function runViteBuild(pluginRoot, { mode = "production" } = {}) {
+  const node = findNodeBin();
+  if (!node) return false;
+  const viteBin = findViteBin(pluginRoot);
+  if (!viteBin || !existsSync(viteBin)) return false;
+
+  log.step(`vite build (mode: ${mode})`);
+  const r = spawnSync(node, [viteBin, "build", "--mode", mode], {
+    cwd: pluginRoot,
+    stdio: "inherit",
+  });
+  if (r.status !== 0) throw new Error("vite build failed");
+  return true;
+}
 
 function isMainBranch() {
   const r = spawnSync("git", ["rev-parse", "--abbrev-ref", "HEAD"], { encoding: "utf8" });
@@ -109,7 +146,7 @@ export async function pinRequirements(root, { stableOnly = false } = {}) {
   if (pinned > 0) writeFileSync(reqPath, out.join("\n"));
 }
 
-const SANDBOX_HTML = `<!doctype html>
+export const SANDBOX_HTML = `<!doctype html>
 <html lang="en">
   <head>
     <meta charset="UTF-8" />
@@ -135,39 +172,16 @@ const SANDBOX_HTML = `<!doctype html>
 </html>
 `;
 
-const HOST_PROVIDED_EXTERNALS = [
-  "@rainbow-robotics/plugin-ui",
-  "@rainbow-robotics/plugin-ui/*",
-  "react",
-  "react/jsx-runtime",
-  "react/jsx-dev-runtime",
-  "react-dom",
-  "react-dom/*",
-];
-
 export async function buildPlugin({ root, minify = false } = {}) {
   const pluginRoot = root ?? findPluginRoot();
-  const entry = resolve(pluginRoot, "ui/content.tsx");
-  if (!existsSync(entry)) {
-    throw new Error(`missing entry: ${entry}`);
-  }
   const distDir = resolve(pluginRoot, "dist");
   rmSync(distDir, { recursive: true, force: true });
   mkdirSync(distDir, { recursive: true });
 
-  log.step("bundling ui/content.tsx → dist/content.js");
-  await buildWithFallback({
-    entryPoints: [entry],
-    outfile: resolve(distDir, "content.js"),
-    bundle: true,
-    format: "esm",
-    jsx: "automatic",
-    minify,
-    loader: { ".tsx": "tsx", ".ts": "ts", ".svg": "dataurl" },
-    define: { "process.env.NODE_ENV": JSON.stringify(minify ? "production" : "development") },
-    external: HOST_PROVIDED_EXTERNALS,
-    logLevel: "warning",
-  });
+  const viteOk = runViteBuild(pluginRoot, { mode: minify ? "production" : "development" });
+  if (!viteOk) {
+    log.warn("vite not found — UI bundle skipped. Install Node.js and run: npm install");
+  }
 
   // Stage distribution files.
   const manifestSrc = resolve(pluginRoot, "manifest.json");

package/cli/src/dev.mjs

@@ -6,7 +6,7 @@ import { log } from "./util.mjs";
 
 export async function runDev(args = []) {
   log.step("starting Socket.IO bridge + dev:ui + dev:back");
-  const bridge = startSocketBridge();
+  const bridge = await startSocketBridge();
   const cleanup = () => bridge.close();
   process.once("SIGINT", cleanup);
   process.once("SIGTERM", cleanup);

package/cli/src/devBack.mjs

@@ -39,19 +39,22 @@ function runPython(root) {
       spawnSync("uv", ["venv", venv, "--python", "3.12", "--seed"], { cwd: root, stdio: "inherit" });
     } else if (hasBin("conda")) {
       spawnSync("conda", ["create", "-p", venv, "python=3.12", "-y", "--quiet"], { cwd: root, stdio: "inherit" });
-    } else if (hasBin("python3.12") || hasBin("python3") || hasBin("python")) {
-      const { cmd, is312 } = detectPythonCmd();
-      if (!is312) log.warn("python3.12 not found; using fallback (robot targets 3.12).");
-      spawnSync(cmd[0], [...cmd.slice(1), "-m", "venv", venv], { cwd: root, stdio: "inherit" });
+    } else if (hasBin("python3.12")) {
+      spawnSync("python3.12", ["-m", "venv", venv], { cwd: root, stdio: "inherit" });
     } else {
-      throw new Error("Python not found (uv / conda / python3 none available). Install Python 3.12 to run the py.");
+      throw new Error(
+        "Python 3.12 not found.\n" +
+        "  The rainbow SDK requires Python >=3.12,<3.13.\n" +
+        "  Install Python 3.12: https://www.python.org/downloads/release/python-3120/\n" +
+        "  Or use uv (recommended): https://docs.astral.sh/uv/getting-started/installation/"
+      );
     }
   }
 
   const reqs = resolve(root, "requirements.txt");
   if (existsSync(reqs)) {
     log.step("pip install -r requirements.txt…");
-    spawnSync(py, ["-m", "pip", "install", "-q", "-r", reqs], { cwd: root, stdio: "inherit" });
+    spawnSync(py, ["-m", "pip", "install", "-q", "--no-cache-dir", "-r", reqs], { cwd: root, stdio: "inherit" });
   }
 
   log.step("pip install -q watchfiles (dev reloader)…");
@@ -61,10 +64,10 @@ function runPython(root) {
   const backEnv = { ...process.env, ...(pluginId ? { RB_PLUGIN_ID: pluginId } : {}) };
   if (pluginId) log.step(`RB_PLUGIN_ID=${pluginId}`);
 
-  log.step("watchfiles → python py/main.py (reload on any .py change in py/)");
+  log.step("watchfiles → py/main.py (reload on any .py change in py/)");
   const child = spawn(
     py,
-    ["-m", "watchfiles", "--filter", "python", "--target-type", "command", "python py/main.py", "py"],
+    ["-m", "watchfiles", "--filter", "python", "--target-type", "command", `${py} py/main.py`, "py"],
     { cwd: root, stdio: "inherit", env: backEnv },
   );
   const cleanup = () => { if (!child.killed) child.kill(); };

package/cli/src/devUi.mjs

@@ -1,38 +1,37 @@
 // muscat-pk dev:ui — preview the plugin inside a mini-Muscat (preview-host).
+// UI bundling: vite build --watch (uses plugin project's own node_modules/vite).
+// Falls back gracefully if Node.js or vite is not available.
 import { spawn, spawnSync } from "node:child_process";
 import { createRequire } from "node:module";
-import { existsSync, mkdirSync } from "node:fs";
+import { copyFileSync, existsSync, mkdirSync, writeFileSync } from "node:fs";
 import { homedir } from "node:os";
 import { dirname, resolve } from "node:path";
-import { buildPlugin } from "./build.mjs";
+import { SANDBOX_HTML } from "./build.mjs";
 import { checkKitUpdate, findPluginRoot, hasBin, kitRoot, log } from "./util.mjs";
 
 const PREVIEW_PKG = "@rainbow-robotics/preview-host";
 const CACHE_DIR = resolve(homedir(), ".muscat-pk");
 const CACHE_ROOT = resolve(CACHE_DIR, "node_modules", "@rainbow-robotics", "preview-host");
 
-/**
- * Resolve preview-host root in order:
- *  1. Standard require (npm/yarn global install)
- *  2. Monorepo sibling (dev workspace)
- *  3. ~/.muscat-pk cache (previous auto-install)
- *  4. Auto-install to ~/.muscat-pk via npm (binary users who have Node.js)
- */
+function findNodeBin() {
+  if (typeof Bun === "undefined") return process.execPath;
+  for (const c of ["node", "node20", "node18"]) {
+    if (hasBin(c)) return c;
+  }
+  return null;
+}
+
 function findPreviewHostRoot() {
-  // 1. npm/yarn 설치 경로
   try {
     const req = createRequire(import.meta.url);
     return dirname(req.resolve(`${PREVIEW_PKG}/package.json`));
   } catch {}
 
-  // 2. 모노레포 sibling
   const sibling = resolve(kitRoot, "../preview-host");
   if (existsSync(resolve(sibling, "package.json"))) return sibling;
 
-  // 3. 캐시
   if (existsSync(resolve(CACHE_ROOT, "package.json"))) return CACHE_ROOT;
 
-  // 4. npm 자동 설치 → 캐시
   if (!hasBin("npm")) {
     throw new Error(
       `preview-host를 찾을 수 없습니다.\n` +
@@ -53,19 +52,78 @@ function findPreviewHostRoot() {
   return CACHE_ROOT;
 }
 
+// Write sandbox.html + copy manifest into dist/ (vite doesn't generate these).
+function stageDevAssets(pluginRoot) {
+  const distDir = resolve(pluginRoot, "dist");
+  mkdirSync(distDir, { recursive: true });
+  writeFileSync(resolve(distDir, "sandbox.html"), SANDBOX_HTML, "utf8");
+  const manifestSrc = resolve(pluginRoot, "manifest.json");
+  if (existsSync(manifestSrc)) copyFileSync(manifestSrc, resolve(distDir, "manifest.json"));
+  return distDir;
+}
+
+// Resolve vite bin path from the plugin root, hoisting-aware.
+function findViteBin(pluginRoot) {
+  try {
+    const req = createRequire(resolve(pluginRoot, "package.json"));
+    const vitePkg = req.resolve("vite/package.json");
+    return resolve(dirname(vitePkg), "bin", "vite.js");
+  } catch {
+    return null;
+  }
+}
+
+// Spawn vite build --watch as a background process.
+// Returns the child process, or null if vite/node not available.
+function spawnViteWatch(pluginRoot, node) {
+  const viteBin = findViteBin(pluginRoot);
+  if (!node || !viteBin || !existsSync(viteBin)) return null;
+
+  log.step("vite build --watch (ui/content.tsx → dist/content.js)");
+  return spawn(node, [viteBin, "build", "--watch", "--mode", "development"], {
+    cwd: pluginRoot,
+    stdio: "inherit",
+  });
+}
+
+// Wait until dist/content.js exists (vite initial build completes).
+function waitForInitialBuild(distDir, timeoutMs = 30_000) {
+  return new Promise((res, rej) => {
+    const contentJs = resolve(distDir, "content.js");
+    const start = Date.now();
+    const check = () => {
+      if (existsSync(contentJs)) return res();
+      if (Date.now() - start > timeoutMs) return rej(new Error("vite initial build timed out"));
+      setTimeout(check, 300);
+    };
+    check();
+  });
+}
+
 export async function runDevUi(args = []) {
   const portIdx = args.indexOf("--port");
   const port = portIdx !== -1 ? args[portIdx + 1] : "4180";
 
   await checkKitUpdate();
-  const { distDir } = await buildPlugin();
+  const pluginRoot = findPluginRoot();
+  const distDir = stageDevAssets(pluginRoot);
+
+  const node = findNodeBin();
+  const viteProc = spawnViteWatch(pluginRoot, node);
+
+  if (viteProc) {
+    log.step("waiting for initial vite build…");
+    await waitForInitialBuild(distDir);
+  } else {
+    log.warn("vite not found — UI will not be bundled. Run `npm install` in the plugin project.");
+  }
 
   const previewRoot = findPreviewHostRoot();
   const serveEntry = resolve(previewRoot, "serve.mjs");
   if (!existsSync(resolve(previewRoot, "dist", "index.html"))) {
     log.step("building preview-host bundle (first run)…");
     await new Promise((res, rej) => {
-      const p = spawn(process.execPath, [resolve(previewRoot, "build.mjs")], {
+      const p = spawn(node ?? process.execPath, [resolve(previewRoot, "build.mjs")], {
         stdio: "inherit",
       });
       p.on("exit", (c) => (c === 0 ? res() : rej(new Error("preview-host build failed"))));
@@ -74,10 +132,17 @@ export async function runDevUi(args = []) {
 
   log.step(`starting preview-host on :${port}`);
   const child = spawn(
-    process.execPath,
+    node ?? process.execPath,
     [serveEntry, "--plugin", distDir, "--port", String(port)],
     { stdio: "inherit" },
   );
+
+  const cleanup = () => {
+    if (viteProc && !viteProc.killed) viteProc.kill();
+    if (!child.killed) child.kill();
+  };
+  process.once("SIGINT", cleanup);
+  process.once("SIGTERM", cleanup);
   child.on("exit", (code) => process.exit(code ?? 0));
 }
 

package/cli/src/new.mjs

@@ -107,9 +107,21 @@ export async function runNew(args) {
   }
   type = TYPES.includes(type) ? type : "python";
 
+  // Auto-detect yarn workspace: if .yarnrc.yml exists anywhere up the tree, default to yarn.
+  function isInsideYarnWorkspace(dir) {
+    let cur = dir;
+    while (true) {
+      if (existsSync(resolve(cur, ".yarnrc.yml"))) return true;
+      const parent = resolve(cur, "..");
+      if (parent === cur) return false;
+      cur = parent;
+    }
+  }
+
   let pm = opts.pm;
   if (!pm && !opts.yes) {
-    pm = await prompt(`Package manager (${PMS.join("/")}) [npm]: `, "npm");
+    const defaultPm = isInsideYarnWorkspace(process.cwd()) ? "yarn" : "npm";
+    pm = await prompt(`Package manager (${PMS.join("/")}) [${defaultPm}]: `, defaultPm);
   }
   pm = PMS.includes(pm) ? pm : "npm";
 

package/cli/src/socketBridge.mjs

@@ -7,22 +7,22 @@ const DEFAULT_ACTION_TIMEOUT_MS = 10_000;
 
 export function startSocketBridge({ port = 10000, host = "0.0.0.0" } = {}) {
   const httpServer = createServer();
-  const io = new Server(httpServer, {
-    cors: { origin: "*" },
-  });
+  const io = new Server(httpServer, { cors: { origin: "*" } });
+
+  // topic → socketId (serve_register로 등록된 queryable)
   const queryables = new Map();
-  const pendingReplies = new Map();
+  // call_id → { timer, resolve } (action → serve_call → serve_reply 대기)
+  const pending = new Map();
 
   function cleanupSocket(socket) {
     for (const [topic, sid] of queryables) {
       if (sid === socket.id) queryables.delete(topic);
     }
-
-    for (const [id, pending] of pendingReplies) {
-      if (pending.sid !== socket.id) continue;
-      clearTimeout(pending.timer);
-      pending.resolve(undefined);
-      pendingReplies.delete(id);
+    for (const [id, p] of pending) {
+      if (p.sid !== socket.id) continue;
+      clearTimeout(p.timer);
+      p.resolve(undefined);
+      pending.delete(id);
     }
   }
 
@@ -38,12 +38,9 @@ export function startSocketBridge({ port = 10000, host = "0.0.0.0" } = {}) {
     });
 
     socket.on("pub", (data = {}) => {
-      const topic = data.topic;
+      const { topic, payload } = data;
       if (!topic) return;
-      io.to(`t:${topic}`).emit("msg", {
-        topic,
-        payload: data.payload,
-      });
+      io.to(`t:${topic}`).emit("msg", { topic, payload });
     });
 
     socket.on("serve_register", (data = {}) => {
@@ -52,71 +49,68 @@ export function startSocketBridge({ port = 10000, host = "0.0.0.0" } = {}) {
     });
 
     socket.on("serve_unregister", (data = {}) => {
-      const topic = data.topic;
-      if (!topic) return;
-      if (queryables.get(topic) === socket.id) queryables.delete(topic);
+      if (queryables.get(data.topic) === socket.id) queryables.delete(data.topic);
     });
 
     socket.on("serve_reply", (data = {}) => {
-      const pending = pendingReplies.get(data.id);
-      if (!pending) return;
-      clearTimeout(pending.timer);
-      pending.resolve(data.payload);
-      pendingReplies.delete(data.id);
+      const p = pending.get(data.id);
+      if (!p) return;
+      clearTimeout(p.timer);
+      p.resolve(data.payload);
+      pending.delete(data.id);
     });
 
     socket.on("action", (data = {}, ack) => {
-      const topic = data.topic;
-      const sid = topic ? queryables.get(topic) : undefined;
-      const target = sid ? io.sockets.sockets.get(sid) : undefined;
-
+      const { topic, payload } = data;
+      const targetSid = queryables.get(topic);
+      const target = targetSid && io.sockets.sockets.get(targetSid);
       if (!target) {
         if (typeof ack === "function") ack(undefined);
         return;
       }
-
       const id = randomUUID();
-      const result = new Promise((resolve) => {
-        const timer = setTimeout(() => {
-          pendingReplies.delete(id);
-          resolve(undefined);
-        }, DEFAULT_ACTION_TIMEOUT_MS);
-
-        pendingReplies.set(id, {
-          sid,
-          timer,
-          resolve,
-        });
-      });
-
-      target.emit("serve_call", {
-        id,
-        topic,
-        payload: data.payload,
-      });
-
-      result.then((payload) => {
-        if (typeof ack === "function") ack(payload);
+      const timer = setTimeout(() => {
+        pending.delete(id);
+        if (typeof ack === "function") ack(undefined);
+      }, DEFAULT_ACTION_TIMEOUT_MS);
+      pending.set(id, {
+        sid: targetSid,
+        timer,
+        resolve: (v) => { if (typeof ack === "function") ack(v); },
       });
+      target.emit("serve_call", { id, topic, payload });
     });
 
     socket.on("disconnect", () => cleanupSocket(socket));
   });
 
-  httpServer.listen(port, host, () => {
-    log.step(`Socket.IO bridge listening on ws://127.0.0.1:${port}`);
-  });
-
-  const close = () => {
-    for (const pending of pendingReplies.values()) {
-      clearTimeout(pending.timer);
-      pending.resolve(undefined);
-    }
-    pendingReplies.clear();
-    queryables.clear();
-    io.close();
-    httpServer.close();
-  };
+  return new Promise((resolve) => {
+    httpServer.once("error", (err) => {
+      if (err.code === "EADDRINUSE") {
+        log.warn(`Socket.IO bridge already running on :${port} — skipping`);
+        io.close();
+        httpServer.close();
+        resolve({ close: () => {} });
+      } else {
+        throw err;
+      }
+    });
 
-  return { close };
+    httpServer.listen(port, host, () => {
+      log.step(`Socket.IO bridge listening on ws://127.0.0.1:${port}`);
+
+      const close = () => {
+        for (const p of pending.values()) {
+          clearTimeout(p.timer);
+          p.resolve(undefined);
+        }
+        pending.clear();
+        queryables.clear();
+        io.close();
+        httpServer.close();
+      };
+
+      resolve({ close });
+    });
+  });
 }

package/cli/templates/common/package.json

@@ -9,7 +9,8 @@
   "devDependencies": {
     "@rainbow-robotics/muscat-plugin-kit": "__RB_VERSION__",
     "@rainbow-robotics/preview-host": "__RB_VERSION__",
+    "@vitejs/plugin-react": "^4.0.0",
     "typescript": "^5.8.0",
-    "vite": "^6.4.1"
+    "vite": "^6.0.0"
   }
 }

package/cli/templates/common/requirements.txt

@@ -1,3 +1,4 @@
-rainbow-rb-sdk==0.0.9.dev40
-rainbow-rb-flat-buffers==0.0.9.dev40
-rainbow-rb-zenoh==0.0.9.dev40
+rainbow-rb-sdk==0.0.9.dev42
+rainbow-rb-flat-buffers==0.0.9.dev42
+rainbow-rb-zenoh==0.0.9.dev42
+requests==2.34.2

package/cli/templates/common/vite.config.ts

@@ -1,29 +1,38 @@
-import { defineConfig } from "vite";
+import { readdirSync } from "fs";
+import { basename, extname, resolve } from "path";
 import react from "@vitejs/plugin-react";
+import { defineConfig } from "vite";
 
 // Plugin UI and React are provided by Muscat/preview-host via import map.
 // They must NOT be bundled into the plugin ZIP.
 const HOST_PROVIDED_EXTERNALS = [
-  "@rainbow-robotics/plugin-ui",
-  /^@rainbow\/plugin-ui\//,
-  "react",
-  "react/jsx-runtime",
-  "react/jsx-dev-runtime",
-  "react-dom",
-  /^react-dom\//,
+  /^@rainbow-robotics\/plugin-ui(\/|$)/,
+  /^react(\/|$)/,
+  /^react-dom(\/|$)/,
 ];
 
+// All top-level .tsx/.ts files in ui/ become separate entry points.
+// Subdirectories (components/, hooks/, etc.) are imported by entries and bundled in.
+const uiEntries = Object.fromEntries(
+  readdirSync("ui")
+    .filter((f) => /\.(tsx?|jsx?)$/.test(f))
+    .map((f) => [basename(f, extname(f)), resolve("ui", f)]),
+);
+
 export default defineConfig({
   plugins: [react()],
   build: {
-    lib: {
-      entry: "ui/content.tsx",
-      formats: ["es"],
-      fileName: "content",
-    },
     outDir: "dist",
+    emptyOutDir: false,
     rollupOptions: {
+      input: uiEntries,
       external: HOST_PROVIDED_EXTERNALS,
+      output: {
+        format: "es",
+        entryFileNames: "[name].js",
+        chunkFileNames: "chunks/[name]-[hash].js",
+        assetFileNames: "assets/[name]-[hash][extname]",
+      },
     },
   },
 });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rainbow-robotics/muscat-plugin-kit",
-  "version": "0.1.2-dev.21",
+  "version": "0.1.2-dev.22",
   "type": "module",
   "engines": {
     "node": ">=20"
@@ -31,7 +31,7 @@
     "@types/react-dom": "^19.0.4"
   },
   "dependencies": {
-    "@rainbow-robotics/preview-host": "0.1.2-dev.21",
+    "@rainbow-robotics/preview-host": "0.1.2-dev.22",
     "socket.io": "^4.8.1"
   },
   "optionalDependencies": {