@particle-academy/agent-integrations 0.16.0 → 0.17.0

package/dist/components-shared-whiteboard.js

@@ -1,4 +1,4 @@
-import { ShareControls, AgentCursor, AgentActivityHighlight, AgentPanel } from './chunk-GJSKBUOH.js';
+import { ShareControls, AgentCursor, AgentActivityHighlight, AgentPanel } from './chunk-YEEOTIGY.js';
 import { createSessionDescriptor, attachSseRelay } from './chunk-CPNOF4HI.js';
 import { attachInProcess } from './chunk-AFUULW5E.js';
 import { registerWhiteboardBridge } from './chunk-3QJSOS7G.js';

package/dist/index.cjs

@@ -2940,16 +2940,21 @@ function ShareControls({
   className,
   style
 }) {
-  const [tab, setTab] = react.useState("url");
+  const [tab, setTab] = react.useState("prompt");
   if (!session) {
     return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: ["fai-share fai-share--idle", className ?? ""].filter(Boolean).join(" "), style, children: [
       /* @__PURE__ */ jsxRuntime.jsx("button", { type: "button", className: "fai-share__start", onClick: onStart, children: "Start shared session" }),
-      /* @__PURE__ */ jsxRuntime.jsx("p", { className: "fai-share__hint", children: "Generates a session id + secret token. Share the URL with humans, or hand the JSON config to an MCP-capable agent." })
+      /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "fai-share__hint", children: [
+        "Generates a session id + secret token. Hand the ",
+        /* @__PURE__ */ jsxRuntime.jsx("strong", { children: "Agent prompt" }),
+        " to an AI agent, share the URL with humans, or give the JSON config to an MCP-capable client."
+      ] })
     ] });
   }
   const url = buildShareUrl(session, shareBaseUrl);
   const config = buildShareConfig(session);
   const curl = buildCurlRecipe(session);
+  const prompt = buildAgentPrompt(url);
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: ["fai-share fai-share--active", className ?? ""].filter(Boolean).join(" "), style, children: [
     /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "fai-share__header", children: [
       /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
@@ -2970,11 +2975,20 @@ function ShareControls({
       ] })
     ] }),
     /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "fai-share__tabs", role: "tablist", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(TabButton, { tab: "prompt", active: tab, setTab, children: "Agent prompt" }),
       /* @__PURE__ */ jsxRuntime.jsx(TabButton, { tab: "url", active: tab, setTab, children: "URL" }),
       /* @__PURE__ */ jsxRuntime.jsx(TabButton, { tab: "json", active: tab, setTab, children: "JSON" }),
       /* @__PURE__ */ jsxRuntime.jsx(TabButton, { tab: "curl", active: tab, setTab, children: "cURL recipe" })
     ] }),
     /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "fai-share__panel", children: [
+      tab === "prompt" && /* @__PURE__ */ jsxRuntime.jsx(
+        CopyBox,
+        {
+          label: "Paste this straight into an AI agent \u2014 it connects over MCP, no browser",
+          value: prompt,
+          multiline: true
+        }
+      ),
       tab === "url" && /* @__PURE__ */ jsxRuntime.jsx(CopyBox, { label: "Open this URL in another tab to join the session", value: url }),
       tab === "json" && /* @__PURE__ */ jsxRuntime.jsx(
         CopyBox,
@@ -3025,6 +3039,33 @@ function CopyBox({ label, value, multiline }) {
     ] })
   ] });
 }
+function buildAgentPrompt(url) {
+  return [
+    `You're joining a live Human+ co-browsing session on a web app. This is an MCP`,
+    `(Model Context Protocol) session \u2014 NOT a website to visit. Do NOT open the URL`,
+    `in a browser and do NOT use any browser/Playwright tool. You drive the real,`,
+    `running app through MCP tools while a human watches and can take over.`,
+    ``,
+    `Session link (carries the session id + token \u2014 treat it as a secret):`,
+    `  ${url}`,
+    ``,
+    `Connect by running the relay client as an MCP server (zero install):`,
+    `  npx -y mcp-relay-client "${url}"`,
+    ``,
+    `That exposes the app's own tools (e.g. page_describe, page_read, nav_visit,`,
+    `page_click, page_set_field, page_submit, plus surface tools like whiteboard_*).`,
+    `Then:`,
+    `  1. Call page_describe first to see the current page and its interactive handles.`,
+    `  2. Act only on the STABLE HANDLES the tools return \u2014 never guess DOM selectors.`,
+    `  3. Navigate with nav_visit, type with page_set_field, click with page_click.`,
+    `     Submits and destructive clicks are staged for the human to confirm.`,
+    ``,
+    `If you can't register an MCP server but can run a shell, drive it directly:`,
+    `  curl -O https://raw.githubusercontent.com/Particle-Academy/mcp-relay-client/main/connect.sh`,
+    `  bash connect.sh "${url}" tools`,
+    `  bash connect.sh "${url}" call page_describe '{}'`
+  ].join("\n");
+}
 function buildCurlRecipe(session) {
   const base = typeof window !== "undefined" ? `${window.location.protocol}//${window.location.host}` : "http://localhost";
   const inbox = `${base}/agent-relay/${session.id}/inbox?token=${session.token}`;
@@ -3588,6 +3629,7 @@ exports.WrenchMark = WrenchMark;
 exports.attachInProcess = attachInProcess;
 exports.attachRelay = attachRelay;
 exports.attachSseRelay = attachSseRelay;
+exports.buildAgentPrompt = buildAgentPrompt;
 exports.buildCursorDeeplink = buildCursorDeeplink;
 exports.buildManualConfig = buildManualConfig;
 exports.buildManualConfigSnippet = buildManualConfigSnippet;