@rainbow-robotics/muscat-plugin-kit 0.1.2-dev.9 → 0.10.1-dev.0

package/cli/templates/common/assets/icon.svg

@@ -1,3 +1,45 @@
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" width="1em" height="1em" fill="none">
-  <path fill="currentColor" d="M16 3a13 13 0 1 0 0 26 13 13 0 0 0 0-26Zm0 4a3 3 0 0 1 3 3v2.18a3 3 0 0 1 0 5.64V20a3 3 0 1 1-6 0v-2.18a3 3 0 0 1 0-5.64V10a3 3 0 0 1 3-3Z"/>
+<svg width="256" height="256" viewBox="0 0 256 256" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <defs>
+    <linearGradient id="bg" x1="36" y1="28" x2="220" y2="228" gradientUnits="userSpaceOnUse">
+      <stop stop-color="#8B5CF6"/>
+      <stop offset="1" stop-color="#5B21B6"/>
+    </linearGradient>
+    <linearGradient id="grape" x1="92" y1="74" x2="168" y2="178" gradientUnits="userSpaceOnUse">
+      <stop stop-color="#D8B4FE"/>
+      <stop offset="1" stop-color="#A855F7"/>
+    </linearGradient>
+  </defs>
+
+  <rect x="16" y="16" width="224" height="224" rx="52" fill="url(#bg)"/>
+
+  <!-- plugin brackets -->
+  <path d="M72 84H56C47.1634 84 40 91.1634 40 100V116" stroke="white" stroke-width="12" stroke-linecap="round"/>
+  <path d="M184 84H200C208.837 84 216 91.1634 216 100V116" stroke="white" stroke-width="12" stroke-linecap="round"/>
+  <path d="M72 172H56C47.1634 172 40 164.837 40 156V140" stroke="white" stroke-width="12" stroke-linecap="round"/>
+  <path d="M184 172H200C208.837 172 216 164.837 216 156V140" stroke="white" stroke-width="12" stroke-linecap="round"/>
+
+  <!-- grape stem + leaf -->
+  <path d="M128 73C128 59 137 48 151 44" stroke="#F3E8FF" stroke-width="10" stroke-linecap="round"/>
+  <path d="M142 51C151 39 169 39 179 50C165 60 151 62 142 51Z" fill="#C4B5FD"/>
+
+  <!-- muscat grape cluster -->
+  <circle cx="106" cy="91" r="18" fill="url(#grape)"/>
+  <circle cx="132" cy="88" r="18" fill="url(#grape)"/>
+  <circle cx="158" cy="91" r="18" fill="url(#grape)"/>
+  <circle cx="94" cy="119" r="18" fill="url(#grape)"/>
+  <circle cx="120" cy="116" r="18" fill="url(#grape)"/>
+  <circle cx="146" cy="116" r="18" fill="url(#grape)"/>
+  <circle cx="172" cy="119" r="18" fill="url(#grape)"/>
+  <circle cx="107" cy="145" r="18" fill="url(#grape)"/>
+  <circle cx="133" cy="144" r="18" fill="url(#grape)"/>
+  <circle cx="159" cy="145" r="18" fill="url(#grape)"/>
+  <circle cx="120" cy="170" r="18" fill="url(#grape)"/>
+  <circle cx="146" cy="170" r="18" fill="url(#grape)"/>
+  <circle cx="133" cy="193" r="18" fill="url(#grape)"/>
+
+  <!-- center plugin glyph -->
+  <path d="M122 119V109C122 103.477 126.477 99 132 99H136C141.523 99 146 103.477 146 109V119" stroke="white" stroke-width="8" stroke-linecap="round"/>
+  <rect x="116" y="118" width="36" height="34" rx="10" fill="white"/>
+  <path d="M127 152V163" stroke="white" stroke-width="8" stroke-linecap="round"/>
+  <path d="M141 152V163" stroke="white" stroke-width="8" stroke-linecap="round"/>
 </svg>

package/cli/templates/common/manifest.json

@@ -2,24 +2,25 @@
   "id": "__PLUGIN_ID__",
   "name": "__PLUGIN_NAME__",
   "version": "1.0.0",
-  "minAppVersion": "2.0.0",
-  "icon": "assets/icon.svg",
+  "minMuscatVersion": "1.0.0",
+  "author": "__PLUGIN_AUTHOR__",
+  "email": "__PLUGIN_EMAIL__",
+  "description": {
+    "ko": "",
+    "en": ""
+  },
+  "icons": "assets/icon.svg",
+  "targetModels": "all",
+  "targetCategorys": "all",
   "contributes": [
-    { "point": "program.panel", "label": "__PLUGIN_NAME__", "icon": "assets/icon.svg" },
-    { "point": "lnb", "label": "__PLUGIN_NAME__", "icon": "assets/icon.svg" },
     {
-      "point": "header.toolbar",
-      "label": "__PLUGIN_NAME__",
+      "point": "toolbar",
       "icon": "assets/icon.svg",
+      "label": { "ko": "__PLUGIN_NAME__", "en": "__PLUGIN_NAME__" },
+      "ui": "content",
       "opens": "popover"
     }
   ],
-  "actions": [
-    {
-      "id": "grip",
-      "topic": "rby2/plugin/__PLUGIN_ID__/grip",
-      "schema": { "width": "number" }
-    }
-  ],
+  "variables": [],
   "runtime": { "type": "__RUNTIME_TYPE__", "entry": "main.py" }
 }

package/cli/templates/common/package.json

@@ -4,12 +4,19 @@
   "private": true,
   "type": "module",
   "dependencies": {
-    "@rainbow-robotics/plugin-ui": "^0.1.0"
+    "@rainbow-robotics/plugin-ui": "__RB_VERSION__"
   },
   "devDependencies": {
-    "@rainbow-robotics/muscat-plugin-kit": "^0.1.0",
-    "@rainbow-robotics/preview-host": "^0.1.0",
+    "@tailwindcss/vite": "^4.1.0",
+    "@rainbow-robotics/muscat-plugin-kit": "__RB_VERSION__",
+    "@rainbow-robotics/preview-host": "__RB_VERSION__",
+    "@types/react": "^19.0.10",
+    "@types/react-dom": "^19.0.4",
+    "@vitejs/plugin-react": "^4.0.0",
+    "react": "^19.0.0",
+    "react-dom": "^19.0.0",
+    "tailwindcss": "^4.1.0",
     "typescript": "^5.8.0",
-    "vite": "^6.4.1"
+    "vite": "^6.0.0"
   }
 }

package/cli/templates/common/py/main.py

@@ -0,0 +1,125 @@
+"""
+Muscat plugin backend — __PLUGIN_NAME__
+
+On-robot (default):
+  muscat-pk dev:back
+  python main.py
+
+Remote dev (from your laptop):
+  Set env vars before running:
+    MUSCAT_ROBOT_HOST=192.168.1.100
+    MUSCAT_ROBOT_TOKEN=<service token>   (optional; needed only when the robot's login policy is on)
+  Then: muscat-pk dev:back
+
+Handlers:
+  plugin.serve / plugin.subscribe / plugin.publish  -> plugin UI <-> backend only
+  plugin.router.on / subscribe / emit               -> external endpoints
+    (REST / Socket.IO / TCP / MQTT / WebRTC at common/plugin/<plugin_id>/<path>).
+    Needs a robot running rainbow-rb-sdk >= 0.0.9.dev5; older robots have no
+    `plugin.router` (AttributeError). See README "External endpoints".
+"""
+
+import asyncio
+import os
+from typing import Any
+
+from rainbow.rb_sdk import RBManipulateSDK, RBPluginCall
+from rainbow.rb_sdk.rb_sdk_cpp import ConnectOptions
+
+
+PLUGIN_NAME = "__PLUGIN_NAME__"
+
+plugin = RBPluginCall()
+manipulate = RBManipulateSDK()
+
+
+def register_handlers():
+    # Register handlers here — called after connect() so subscriptions survive
+    # session reconnection in remote-dev mode.
+
+    # --- Plugin UI <-> backend (not reachable from outside Muscat) ---
+
+    @plugin.subscribe("event")
+    def on_ui_event(payload: dict[str, Any] | None = None):
+        """Handle messages published from the plugin UI with rb.pub("event", ...)."""
+        print(f"[{PLUGIN_NAME}] event:", payload)
+
+    @plugin.serve("grip")
+    def grip(payload: dict[str, Any] | None = None):
+        """Handle the default UI button: rb.action("grip", { width })."""
+        width = (payload or {}).get("width", 20)
+        print(f"[{PLUGIN_NAME}] grip requested: width={width}")
+        plugin.publish("state", {"ready": True, "last_grip_width": width})
+        return {"ok": True, "width": width}
+
+    @plugin.serve("tool/echo")
+    def echo(payload: dict[str, Any] | None = None):
+        """Small query example callable from the UI with rb.action("tool/echo", ...)."""
+        return {"echo": payload, "plugin": PLUGIN_NAME}
+
+    # --- External endpoints (REST / Socket.IO / TCP / MQTT / WebRTC) ---
+    # Exposed as common/plugin/<plugin_id>/hello, e.g.
+    #   curl -X POST http://<robot>/common/plugin/<plugin_id>/hello \
+    #        -H 'Content-Type: application/json' -d '{"name": "kim"}'
+    # Restrict transports with explicit_routes=["api"] (REST only), etc.
+    # Raise PluginRouteError(403, "msg") to set the response status.
+
+    @plugin.router.on("/hello")
+    def hello(payload: dict[str, Any] | None = None, meta: dict[str, Any] | None = None):
+        """meta = {"transport": "api"|"socket"|"tcp"|"mqtt"|"webrtc", "principal": dict | None}."""
+        name = (payload or {}).get("name", "there")
+        return {"msg": f"hi {name}", "via": (meta or {}).get("transport")}
+
+
+def move_j_example():
+    """
+    Example: use other robot SDKs from the same backend.
+
+    This function is not called automatically. Add safety checks and call it
+    from your own handler when the robot is ready.
+    """
+    return manipulate.move.call_move_j(
+        robot_model="C500920",
+        target={
+            "tar_values": [0, 0, 0, 0, 0, 0, 0],
+            "tar_frame": -1,
+            "tar_unit": 0,
+        },
+    )
+
+
+async def main():
+    robot_host = os.getenv("MUSCAT_ROBOT_HOST")
+    robot_token = os.getenv("MUSCAT_ROBOT_TOKEN", "")  # empty is fine when the login policy is off
+
+    if robot_host:
+        # Remote dev: connect to the robot before registering any handlers.
+        # connect() closes and reopens the Zenoh session, so handlers registered
+        # before this call would be lost.
+        opts = ConnectOptions()
+        opts.token = robot_token
+        opts.host = robot_host
+        manipulate.connect(opts)
+
+    register_handlers()
+
+    plugin.publish("state", {"ready": True, "plugin": PLUGIN_NAME})       # -> plugin UI
+    plugin.router.emit("/state", {"ready": True, "plugin": PLUGIN_NAME})  # -> external subscribers of common/plugin/<plugin_id>/state
+    print(f"[{PLUGIN_NAME}] backend ready")
+
+    try:
+        while True:
+            await asyncio.sleep(1)
+    except (KeyboardInterrupt, asyncio.CancelledError):
+        pass
+    finally:
+        if robot_host:
+            await manipulate.disconnect()
+        print(f"[{PLUGIN_NAME}] stopped")
+
+
+if __name__ == "__main__":
+    try:
+        asyncio.run(main())
+    except KeyboardInterrupt:
+        pass

package/cli/templates/common/requirements.txt

@@ -1,3 +1,4 @@
-rainbow-rb-sdk
-rainbow-rb-flat-buffers
-python-socketio[aiohttp]
+rainbow-rb-sdk==0.10.3
+rainbow-rb-flat-buffers==0.10.3
+rainbow-rb-zenoh==0.10.3
+requests==2.34.2

package/cli/templates/common/tsconfig.json

@@ -9,5 +9,5 @@
     "noEmit": true,
     "lib": ["DOM", "DOM.Iterable", "ESNext"]
   },
-  "include": ["src"]
+  "include": ["ui"]
 }

package/cli/templates/common/ui/content.tsx

@@ -0,0 +1,216 @@
+import { useMemo, useState } from "react";
+import {
+  RBCheckBox,
+  RBLabelButton,
+  RBRadioBox,
+  RBSelectBox,
+  RBSlider,
+  RBSwitch,
+  RBTextArea,
+  RBTextField,
+  RBTextInput,
+  Option
+} from "@rainbow-robotics/plugin-ui/react";
+import { useRb } from "@rainbow-robotics/plugin-ui/sdk";
+
+type RunMode = "inspect" | "assist" | "auto";
+
+const MODE_OPTIONS: Array<{ label: string; value: RunMode }> = [
+  { label: "Inspect", value: "inspect" },
+  { label: "Assist", value: "assist" },
+  { label: "Auto", value: "auto" },
+];
+
+const TASK_OPTIONS = [
+  { label: "Publish status", value: "publish" },
+  { label: "Run grip action", value: "grip" },
+  { label: "Save snapshot", value: "snapshot" },
+];
+
+// Export your UI as the default. The host mounts it (dev: with HMR).
+export default function App() {
+  const rb = useRb();
+  const [targetName, setTargetName] = useState("demo_target");
+  const [gripType, setGripType] = useState<string>();
+  const [gripWidth, setGripWidth] = useState(24);
+  const [speed, setSpeed] = useState(45);
+  const [mode, setMode] = useState<RunMode>("assist");
+  const [enabled, setEnabled] = useState(true);
+  const [tasks, setTasks] = useState<Array<string>>(["publish", "grip"]);
+  const [memo, setMemo] = useState("Use this area for operator notes.");
+
+  const payload = useMemo(
+    () => ({
+      targetName,
+      gripWidth,
+      speed,
+      mode,
+      enabled,
+      tasks,
+      memo,
+    }),
+    [targetName, gripWidth, speed, mode, enabled, tasks, memo],
+  );
+
+  const showRequestError = (error: unknown) => {
+    const message = error instanceof Error ? error.message : "Request failed";
+    rb.toast({ type: "danger", message });
+  };
+
+  const runAction = async () => {
+    try {
+      await rb.action("grip", payload);
+      rb.toast({ type: "success", message: `Sent ${targetName}` });
+    } catch (error) {
+      showRequestError(error);
+    }
+  };
+
+  const publishPreview = async () => {
+    try {
+      const isConfirm = await rb.confirm({
+        message: "Are you sure publish?",
+        buttonText: { yes: "confirm", no: "cancel" },
+      });
+
+      if (isConfirm) {
+        await rb.pub("event", payload);
+      }
+    } catch (error) {
+      showRequestError(error);
+    }
+  };
+
+  return (
+    <div className="max-h-[70vh] w-[420px] p-4 max-w-full overflow-y-auto bg-bg-elevated text-fg-default">
+      <div className="flex flex-col gap-5">
+        <header>
+          <div className="flex items-center justify-between gap-12">
+            <div>
+              <h2 className="typo-heading-xs-semibold">Demo Control</h2>
+              <p className="typo-body-xs2-normal text-fg-subtle">
+                Input patterns for Muscat plugin UIs
+              </p>
+            </div>
+            <RBSwitch
+              checked={enabled}
+              onCheckedChange={(next: boolean) => {
+                setEnabled(next);
+                rb.toast({message: next ? "Plugin enabled" : "Plugin paused"});
+              }}
+            />
+          </div>
+        </header>
+
+        <section className="flex flex-col gap-4">
+          <RBTextField
+            label="Target name"
+            required
+            helperText="Used as the backend action target."
+          >
+            <RBTextInput
+              name="targetName"
+              value={targetName}
+              placeholder="target id"
+              handleChange={(value) => setTargetName(String(value))}
+            />
+          </RBTextField>
+
+          <RBTextField label="Select Grip">
+            <RBSelectBox  className="w-full" value={gripType} handleChange={setGripType}>
+              <Option value="A">A Grip</Option>
+              <Option value="B">B Grip</Option>
+            </RBSelectBox>
+          </RBTextField>
+
+          <div className="flex gap-4">
+            <RBTextField className="flex-1" label="Grip width" helperText="0-100 mm">
+              <RBTextInput
+                className="w-full"
+                name="gripWidth"
+                type="number"
+                value={gripWidth}
+                validate={(value: number) =>
+                  Math.max(0, Math.min(100, Number(value) || 0))
+                }
+                handleChange={(value) => setGripWidth(Number(value) || 0)}
+              />
+            </RBTextField>
+
+            <RBTextField className="flex-1" label="Speed" helperText={`${speed}%`}>
+              <div className="flex items-center px-2">
+                <RBSlider
+                  value={[speed]}
+                  min={0}
+                  max={100}
+                  step={5}
+                  onValueChange={(values: number[]) =>
+                    setSpeed(values[0] ?? 0)
+                  }
+                />
+              </div>
+            </RBTextField>
+          </div>
+        </section>
+
+        <section className="mb-4">
+          <RBTextField label="Run mode">
+            <div className="flex justify-between border-1 border-border-subtle rounded-sm p-2">
+            {MODE_OPTIONS.map((item) => (
+              <RBRadioBox
+                key={item.value}
+                name="mode"
+                checkValue={item.value}
+                value={mode}
+                handleChange={(value) => setMode(value as RunMode)}
+              >
+                {item.label}
+              </RBRadioBox>
+            ))}
+          </div>
+          </RBTextField>
+        </section>
+
+        <section className="mb-4">
+          <RBTextField label="Tasks">
+            <div className="flex justify-between border-1 border-border-subtle rounded-sm p-2">
+              {TASK_OPTIONS.map((item) => (
+                <RBCheckBox
+                  key={item.value}
+                  name="tasks"
+                  checkValue={item.value}
+                  value={tasks}
+                  handleChange={(value) =>
+                    setTasks(Array.isArray(value) ? value.map(String) : [])
+                  }
+                >
+                  {item.label}
+                </RBCheckBox>
+              ))}
+            </div>
+          </RBTextField>
+          
+        </section>
+
+        <RBTextField label="Memo">
+          <RBTextArea
+            name="memo"
+            value={memo}
+            maxLength={120}
+            rows={4}
+            handleChange={setMemo}
+          />
+        </RBTextField>
+
+        <footer className="grid grid-cols-2 gap-8 pt-4">
+          <RBLabelButton variant="outlined" onClick={publishPreview}>
+            Publish
+          </RBLabelButton>
+          <RBLabelButton onClick={runAction} disabled={!enabled}>
+            Run Action
+          </RBLabelButton>
+        </footer>
+      </div>
+    </div>
+  );
+}

package/cli/templates/common/ui/style.css

@@ -0,0 +1,6 @@
+@layer theme, utilities;
+
+@import "tailwindcss/theme.css" layer(theme);
+@import "tailwindcss/utilities.css" layer(utilities);
+
+@source "./**/*.{ts,tsx}";

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

@@ -1,29 +1,10 @@
 import { defineConfig } from "vite";
-import react from "@vitejs/plugin-react";
-
-// 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\//,
-];
+import tailwindcss from "@tailwindcss/vite";
+import { muscat } from "@rainbow-robotics/muscat-plugin-kit/vite";
 
+// The muscat() preset wires react-refresh, ui/ entry discovery, and marks the
+// host-provided runtime (plugin-ui, react) as external. Add your own plugins or
+// overrides here as needed.
 export default defineConfig({
-  plugins: [react()],
-  build: {
-    lib: {
-      entry: "src/content.tsx",
-      formats: ["es"],
-      fileName: "content",
-    },
-    outDir: "dist",
-    rollupOptions: {
-      external: HOST_PROVIDED_EXTERNALS,
-    },
-  },
+  plugins: [tailwindcss(), muscat()],
 });

package/cli/templates/cpp/cpp/CMakeLists.txt

@@ -0,0 +1,14 @@
+cmake_minimum_required(VERSION 3.16)
+project(__PLUGIN_SLUG__ CXX)
+
+set(CMAKE_CXX_STANDARD 20)
+set(CMAKE_CXX_STANDARD_REQUIRED ON)
+
+# Rainbow Robotics C++ SDK — provided by the apt package rainbow-rb-sdk-dev
+# (pre-installed in the muscat-pk dev container). The version here is the one the
+# dev container installs; change it with `muscat-pk sdk update <version>`.
+find_package(rb_sdk 0.10.3 EXACT REQUIRED)
+
+# The executable name must match runtime.entry in manifest.json.
+add_executable(__PLUGIN_SLUG__ main.cpp)
+target_link_libraries(__PLUGIN_SLUG__ PRIVATE rb_sdk::rb_sdk)

package/cli/templates/cpp/cpp/main.cpp

@@ -0,0 +1,73 @@
+// __PLUGIN_NAME__ — C++ plugin back end.
+//
+// The Rainbow Robotics C++ SDK (apt: rainbow-rb-sdk-dev) is installed in the
+// dev container and linked via CMake (rb_sdk::rb_sdk). Headers live under
+// <rainbow/rb_sdk/...>:
+//   - plugin/rb_plugin.hpp               rb_plugin::RBPluginCall — plugin UI <-> backend
+//                                        (serve/subscribe/publish) and external endpoints (router)
+//   - manipulate/rb_manipulate_sdk.hpp   RBManipulateSDK — control the robot
+//   - program/plugin_program_context.hpp rb_plugin::PluginProgramContext —
+//                                        program.panel commands (done/pause/stop,
+//                                        program variables)
+
+#include <rainbow/rb_sdk/manipulate/rb_manipulate_sdk.hpp>
+#include <rainbow/rb_sdk/plugin/rb_plugin.hpp>
+
+#include <nlohmann/json.hpp>
+
+#include <chrono>
+#include <cstdlib>
+#include <iostream>
+#include <string>
+#include <thread>
+
+using nlohmann::json;
+using rb_plugin::RBPluginCall;
+
+int main() {
+  const std::string name = "__PLUGIN_NAME__";
+
+  // Remote dev: connect before registering handlers (connect() reopens the session).
+  RBManipulateSDK manipulate;
+  const char* host = std::getenv("MUSCAT_ROBOT_HOST");
+  const char* token = std::getenv("MUSCAT_ROBOT_TOKEN");  // optional: needed only when the login policy is on
+  if (host) manipulate.connect({.token = token ? token : "", .host = host});
+
+  // plugin id comes from RB_PLUGIN_ID.
+  auto plugin = RBPluginCall::get_instance(RBPluginCall::resolve_plugin_id(std::nullopt));
+
+  // --- Plugin UI <-> backend (not reachable from outside Muscat) ---
+
+  // UI: await rb.action("grip", { width })
+  plugin->serve("grip", [&](const json& payload) {
+    const int width = payload.is_object() ? payload.value("width", 20) : 20;
+    std::cout << "[" << name << "] grip requested: width=" << width << std::endl;
+    plugin->publish("state", {{"ready", true}, {"last_grip_width", width}});  // -> rb.sub("state")
+    return json{{"ok", true}, {"width", width}};
+  });
+
+  // UI: rb.pub("event", ...)
+  auto event_sub = plugin->subscribe("event", [&](const std::string&, const json& payload) {
+    std::cout << "[" << name << "] event: " << payload.dump() << std::endl;
+  });
+
+  // --- External endpoints (REST / Socket.IO / TCP / MQTT / WebRTC) ---
+  //   curl -X POST http://<robot>/common/plugin/<plugin_id>/hello -d '{"name":"kim"}'
+  plugin->router().on("/hello", [](const json& payload, const json& meta) {
+    const std::string who = payload.is_object() ? payload.value("name", std::string("there")) : "there";
+    return json{{"msg", "hi " + who}, {"via", meta.value("transport", std::string())}};
+  });
+
+  // Example: robot control (not called automatically — add safety checks first).
+  //   IPC::MoveInput_TargetT t; t.tar_values = {0, 0, 0, 0, 0, 0, 0}; t.tar_frame = -1; t.tar_unit = 0;
+  //   manipulate.move.call_move_j("C500920", t);
+
+  plugin->publish("state", {{"ready", true}, {"plugin", name}});
+  std::cout << "[" << name << "] backend ready" << std::endl;
+
+  // Keep the process alive.
+  while (true) {
+    std::this_thread::sleep_for(std::chrono::seconds(1));
+  }
+  return 0;
+}