From 653c2c7a75d09a18f6ec4394661beb27575fa413 Mon Sep 17 00:00:00 2001
From: Rhys Sullivan <rhys@rhyssullivan.com>
Date: Thu, 25 Jun 2026 01:34:52 -0700
Subject: [PATCH] Auto-connect stdio MCP servers; store env as connection
 secrets

Adding a stdio MCP server registered an integration but no connection, so
the v1.5 per-connection tool model produced zero tools on a fresh install.
Auto-create the default connection on add (no-auth, or one-shot env values),
declare secret env vars as a stdio_env auth method whose values live on the
connection's secret store, add a boot-time reconcile for pre-existing stdio
integrations, and give the add form a TagInput for declaring env var names.
---
 apps/local/src/executor.ts                    |  21 ++
 e2e/local/fixtures/stdio-mcp-server.mjs       | 104 +++++++++
 e2e/local/stdio-mcp.test.ts                   | 145 ++++++++++++
 packages/core/api/src/integrations/api.ts     |   2 +-
 packages/core/sdk/src/integration.ts          |   7 +-
 packages/plugins/mcp/src/api/group.ts         |   4 +
 packages/plugins/mcp/src/api/handlers.test.ts |   1 +
 packages/plugins/mcp/src/api/handlers.ts      |   2 +
 .../plugins/mcp/src/react/AddMcpSource.tsx    |  59 +----
 .../mcp/src/react/McpAccountsPanel.tsx        |  11 +-
 .../mcp/src/react/auth-method-config.ts       |  27 ++-
 packages/plugins/mcp/src/sdk/plugin.ts        | 207 +++++++++++++++++-
 packages/plugins/mcp/src/sdk/types.ts         |  33 ++-
 .../src/components/add-account-modal.tsx      |  51 ++++-
 packages/react/src/components/tag-input.tsx   | 102 +++++++++
 packages/react/src/lib/auth-placements.tsx    |   9 +-
 .../react/src/lib/shared-auth-method-codec.ts |   9 +-
 17 files changed, 709 insertions(+), 85 deletions(-)
 create mode 100644 e2e/local/fixtures/stdio-mcp-server.mjs
 create mode 100644 e2e/local/stdio-mcp.test.ts
 create mode 100644 packages/react/src/components/tag-input.tsx

diff --git a/apps/local/src/executor.ts b/apps/local/src/executor.ts
index 152b32019..639a1ad43 100644
--- a/apps/local/src/executor.ts
+++ b/apps/local/src/executor.ts
@@ -14,6 +14,7 @@ import {
 } from "@executor-js/sdk";
 import { collectTables } from "@executor-js/api/server";
 import { loadPluginsFromJsonc } from "@executor-js/config";
+import type { McpPluginExtension } from "@executor-js/plugin-mcp";
 
 import executorConfig from "../executor.config";
 import { localDataMigrations } from "./db/data-migrations";
@@ -218,6 +219,26 @@ const createLocalExecutorLayer = () => {
         }
       }
 
+      // Heal stdio MCP integrations added before auto-connect existed (they
+      // landed with zero connections ⇒ zero tools) and move any legacy inline
+      // env into the secret store. No-op on a fresh install; never fails boot.
+      // Local is the only app that enables stdio, so this only runs here.
+      // oxlint-disable-next-line executor/no-double-cast -- typed boundary: the executor IS its own plugin-extension map (executor[pluginId]) but LocalExecutor doesn't surface per-plugin extensions statically
+      const mcpExtension = (executor as unknown as { readonly mcp?: McpPluginExtension }).mcp;
+      if (mcpExtension) {
+        yield* mcpExtension
+          .reconcileStdioConnections()
+          .pipe(
+            Effect.catch(() =>
+              Effect.sync(() =>
+                console.warn(
+                  "[executor] stdio connection reconcile failed; existing stdio servers may show no tools until re-added",
+                ),
+              ),
+            ),
+          );
+      }
+
       return { executor, plugins };
     }),
   );
diff --git a/e2e/local/fixtures/stdio-mcp-server.mjs b/e2e/local/fixtures/stdio-mcp-server.mjs
new file mode 100644
index 000000000..9f57c79a2
--- /dev/null
+++ b/e2e/local/fixtures/stdio-mcp-server.mjs
@@ -0,0 +1,104 @@
+// A zero-dependency MCP server over stdio, for the `local` e2e project.
+//
+// The real `@modelcontextprotocol/sdk` stdio server pulls in the whole SDK and
+// is awkward to resolve from an arbitrary spawn cwd under bun's node_modules
+// layout. The MCP stdio framing is just newline-delimited JSON-RPC, so we hand-
+// roll the three methods a tool-discovery + invoke round-trip needs:
+// `initialize`, `tools/list`, `tools/call` (plus `ping`). This keeps the
+// fixture a single self-contained file the executor server can launch as
+// `node <thisfile>` with nothing to install.
+//
+// It exposes one tool, `echo_tool`, and (when EXECUTOR_E2E_SECRET is set in the
+// child env) a second `whoami` tool that returns that env value — so a scenario
+// can prove a per-connection secret env var actually reached the subprocess.
+
+import { createInterface } from "node:readline";
+
+const send = (message) => {
+  process.stdout.write(`${JSON.stringify(message)}\n`);
+};
+
+const TOOLS = [
+  {
+    name: "echo_tool",
+    description: "Echoes the provided text back",
+    inputSchema: {
+      type: "object",
+      properties: { text: { type: "string" } },
+      required: ["text"],
+    },
+  },
+];
+
+if (process.env.EXECUTOR_E2E_SECRET) {
+  TOOLS.push({
+    name: "whoami",
+    description: "Returns the secret env value the server was launched with",
+    inputSchema: { type: "object", properties: {} },
+  });
+}
+
+const handle = (msg) => {
+  if (msg.method === "initialize") {
+    send({
+      jsonrpc: "2.0",
+      id: msg.id,
+      result: {
+        // Echo the client's protocol version so we never fail version
+        // negotiation against whatever SDK build is on the other end.
+        protocolVersion: msg.params?.protocolVersion ?? "2025-06-18",
+        capabilities: { tools: {} },
+        serverInfo: { name: "executor-e2e-stdio", version: "1.0.0" },
+      },
+    });
+    return;
+  }
+
+  // Notifications carry no id and expect no response.
+  if (msg.id === undefined || msg.id === null) return;
+
+  if (msg.method === "ping") {
+    send({ jsonrpc: "2.0", id: msg.id, result: {} });
+    return;
+  }
+
+  if (msg.method === "tools/list") {
+    send({ jsonrpc: "2.0", id: msg.id, result: { tools: TOOLS } });
+    return;
+  }
+
+  if (msg.method === "tools/call") {
+    const name = msg.params?.name;
+    const text =
+      name === "whoami"
+        ? (process.env.EXECUTOR_E2E_SECRET ?? "")
+        : String(msg.params?.arguments?.text ?? "");
+    send({
+      jsonrpc: "2.0",
+      id: msg.id,
+      result: { content: [{ type: "text", text }] },
+    });
+    return;
+  }
+
+  send({
+    jsonrpc: "2.0",
+    id: msg.id,
+    error: { code: -32601, message: `Method not found: ${msg.method}` },
+  });
+};
+
+const rl = createInterface({ input: process.stdin });
+rl.on("line", (line) => {
+  const trimmed = line.trim();
+  if (!trimmed) return;
+  let msg;
+  // oxlint-disable-next-line executor/no-try-catch-or-throw -- standalone zero-dep fixture: hand-rolled JSON-RPC framing, not product code
+  try {
+    // oxlint-disable-next-line executor/no-json-parse -- standalone zero-dep fixture: hand-rolled JSON-RPC framing, not product code
+    msg = JSON.parse(trimmed);
+  } catch {
+    return;
+  }
+  handle(msg);
+});
diff --git a/e2e/local/stdio-mcp.test.ts b/e2e/local/stdio-mcp.test.ts
new file mode 100644
index 000000000..9a3deb097
--- /dev/null
+++ b/e2e/local/stdio-mcp.test.ts
@@ -0,0 +1,145 @@
+// Repro + regression guard for the user report: "On a totally fresh install
+// (no existing data dir) on macOS, Executor does not detect any tools for a
+// STDIO MCP server."
+//
+// `withLocalServer` boots a real `executor web` on a THROWAWAY data dir (the
+// fresh-install condition) and the `local` app is the only surface that enables
+// stdio MCP (`dangerouslyAllowStdioMCP: true`). We add a stdio MCP server over
+// the bearer-authed API and assert its tools are discoverable — and that the
+// secret env it needs is stored on the connection (the secret store), not in
+// the integration's config blob.
+//
+// The original bug: `mcp.addServer` only registered an INTEGRATION. Per the
+// v1.5 integrations/connections split, tools are produced per-CONNECTION, and a
+// stdio add never created one, so the integration landed with zero connections
+// and zero tools. The fix auto-creates the default connection on add and routes
+// the env values into the connection's secret store.
+import { fileURLToPath } from "node:url";
+
+import { expect } from "@effect/vitest";
+import { Effect } from "effect";
+import { HttpApiClient } from "effect/unstable/httpapi";
+import { FetchHttpClient, HttpClient, HttpClientRequest } from "effect/unstable/http";
+import { composePluginApi } from "@executor-js/api/server";
+import { mcpHttpPlugin } from "@executor-js/plugin-mcp/api";
+import { AuthTemplateSlug, ConnectionName, IntegrationSlug } from "@executor-js/sdk/shared";
+
+import { scenario } from "../src/scenario";
+import { Cli, RunDir } from "../src/services";
+import { withLocalServer } from "./local-server";
+
+const api = composePluginApi([mcpHttpPlugin()] as const);
+
+const FIXTURE = fileURLToPath(new URL("./fixtures/stdio-mcp-server.mjs", import.meta.url));
+
+// The fixture exposes `whoami` ONLY when EXECUTOR_E2E_SECRET is present in its
+// process env. So `whoami` showing up in the discovered tools is direct proof
+// the connection's secret env reached the spawned subprocess.
+const SECRET = "s3cr3t-from-the-vault";
+
+scenario(
+  "Local · a stdio MCP server's tools are detected on a fresh install, with env stored as a secret",
+  { timeout: 180_000 },
+  Effect.gen(function* () {
+    const cli = yield* Cli;
+    const runDir = yield* RunDir;
+
+    yield* withLocalServer(cli, runDir, (server) =>
+      Effect.gen(function* () {
+        const client = yield* HttpApiClient.make(api, {
+          baseUrl: new URL("/api", server.origin).toString(),
+          transformClient: HttpClient.mapRequest((request) =>
+            HttpClientRequest.setHeader(request, "authorization", `Bearer ${server.token}`),
+          ),
+        }).pipe(Effect.provide(FetchHttpClient.layer));
+
+        const slug = "e2e-stdio";
+
+        // Add the stdio server exactly as the desktop/local "Add MCP" flow does,
+        // including a secret env var the server needs.
+        yield* client.mcp.addServer({
+          payload: {
+            transport: "stdio",
+            name: "E2E Stdio",
+            command: "node",
+            args: [FIXTURE],
+            env: { EXECUTOR_E2E_SECRET: SECRET },
+            slug,
+          },
+        });
+
+        // The integration lands in the catalog — the add itself works.
+        const integrations = yield* client.integrations.list();
+        expect(
+          integrations.map((i) => String(i.slug)),
+          "the stdio MCP integration is registered",
+        ).toContain(slug);
+
+        // The add auto-creates the default connection (the v1.5 split makes this
+        // the thing that drives tool discovery). Pre-fix there were zero.
+        const connections = yield* client.connections.list({ query: { integration: slug } });
+        expect(
+          connections.map((c) => String(c.name)),
+          "a default connection was auto-created for the stdio server",
+        ).toContain("default");
+
+        // THE SYMPTOM, fixed: the stdio server's tools are detected. `whoami`
+        // appearing proves the connection's secret env reached the subprocess.
+        const tools = yield* client.tools.list({ query: { integration: slug } });
+        const names = tools.map((t) => t.name);
+        expect(names, "the stdio server's base tool is detected").toContain("echo_tool");
+        expect(
+          names,
+          "the secret env var reached the spawned subprocess (whoami is gated on it)",
+        ).toContain("whoami");
+
+        // "Properly store auth": the secret value is NOT in the integration's
+        // config blob — only the var NAME is declared there; the value lives on
+        // the connection (the secret store).
+        const stored = yield* client.mcp.getServer({ params: { slug } });
+        expect(
+          JSON.stringify(stored?.config ?? {}),
+          "the secret value is not persisted in the integration config",
+        ).not.toContain(SECRET);
+
+        // --- The UI path: DECLARE env var names, then provide the secret value
+        // as a connection credential (what the add form now does). ---
+        const declSlug = "e2e-stdio-decl";
+        yield* client.mcp.addServer({
+          payload: {
+            transport: "stdio",
+            name: "E2E Stdio Declared",
+            command: "node",
+            args: [FIXTURE],
+            envVars: ["EXECUTOR_E2E_SECRET"],
+            slug: declSlug,
+          },
+        });
+
+        // Declaring a secret env var (no value) does NOT auto-connect: the
+        // secret is still missing, so there are no tools until you connect.
+        const beforeConns = yield* client.connections.list({ query: { integration: declSlug } });
+        expect(beforeConns, "no connection until the secret is provided").toHaveLength(0);
+        const beforeTools = yield* client.tools.list({ query: { integration: declSlug } });
+        expect(beforeTools, "no tools until the secret is provided").toHaveLength(0);
+
+        // Provide the secret as the connection credential (the connect step).
+        yield* client.connections.create({
+          payload: {
+            owner: "org",
+            name: ConnectionName.make("default"),
+            integration: IntegrationSlug.make(declSlug),
+            template: AuthTemplateSlug.make("env"),
+            values: { EXECUTOR_E2E_SECRET: SECRET },
+          },
+        });
+
+        const declTools = yield* client.tools.list({ query: { integration: declSlug } });
+        expect(
+          declTools.map((t) => t.name),
+          "connecting with the secret discovers the env-gated tool",
+        ).toContain("whoami");
+      }),
+    );
+  }),
+);
diff --git a/packages/core/api/src/integrations/api.ts b/packages/core/api/src/integrations/api.ts
index c92dc1db3..8302b5f6c 100644
--- a/packages/core/api/src/integrations/api.ts
+++ b/packages/core/api/src/integrations/api.ts
@@ -31,7 +31,7 @@ const IntegrationParams = { slug: IntegrationSlug };
 /** Where a credential value is carried — mirrors the SDK's
  *  `AuthPlacementDescriptor`. */
 const PlacementDescriptor = Schema.Struct({
-  carrier: Schema.Literals(["header", "query"]),
+  carrier: Schema.Literals(["header", "query", "env"]),
   name: Schema.String,
   prefix: Schema.String,
   /** Input variable this placement renders from (absent ⇒ `token`). Without
diff --git a/packages/core/sdk/src/integration.ts b/packages/core/sdk/src/integration.ts
index 11c3de69a..4b1dbc5da 100644
--- a/packages/core/sdk/src/integration.ts
+++ b/packages/core/sdk/src/integration.ts
@@ -24,10 +24,11 @@ export interface IntegrationDisplayDescriptor {
   readonly url?: string;
 }
 
-/** Where a credential value is carried on the outbound request. Mirrors the
- *  client's `Placement`. */
+/** Where a credential value is carried. `header`/`query` place it on an
+ *  outbound HTTP request (mirrors the client's `Placement`); `env` injects it
+ *  as an environment variable for a stdio (subprocess) integration. */
 export interface AuthPlacementDescriptor {
-  readonly carrier: "header" | "query";
+  readonly carrier: "header" | "query" | "env";
   readonly name: string;
   /** Literal prepended to the value (e.g. `"Bearer "`). Empty when bare. */
   readonly prefix: string;
diff --git a/packages/plugins/mcp/src/api/group.ts b/packages/plugins/mcp/src/api/group.ts
index 30a0a20af..324b9d684 100644
--- a/packages/plugins/mcp/src/api/group.ts
+++ b/packages/plugins/mcp/src/api/group.ts
@@ -51,6 +51,10 @@ const AddStdioServerPayload = Schema.Struct({
   description: Schema.optional(Schema.String),
   command: Schema.String,
   args: Schema.optional(Schema.Array(Schema.String)),
+  /** Declare the secret env vars this server needs, by name. Their values are
+   *  supplied as the connection's secrets (the connect step), not here. */
+  envVars: Schema.optional(Schema.Array(Schema.String)),
+  /** One-shot secret env values (programmatic). The UI sends `envVars`. */
   env: Schema.optional(StringMap),
   cwd: Schema.optional(Schema.String),
   slug: Schema.optional(Schema.String),
diff --git a/packages/plugins/mcp/src/api/handlers.test.ts b/packages/plugins/mcp/src/api/handlers.test.ts
index cb02ecbb5..6d9048878 100644
--- a/packages/plugins/mcp/src/api/handlers.test.ts
+++ b/packages/plugins/mcp/src/api/handlers.test.ts
@@ -26,6 +26,7 @@ const failingExtension: McpPluginExtension = {
   probeEndpoint: () => Effect.die(new Error("Not implemented")),
   addServer: () => unused,
   removeServer: () => unused,
+  reconcileStdioConnections: () => unused,
   getServer: () => Effect.succeed(null),
   configureServer: () => unused,
   configureAuth: () => unused,
diff --git a/packages/plugins/mcp/src/api/handlers.ts b/packages/plugins/mcp/src/api/handlers.ts
index 58b057cd9..6ca5c3188 100644
--- a/packages/plugins/mcp/src/api/handlers.ts
+++ b/packages/plugins/mcp/src/api/handlers.ts
@@ -36,6 +36,7 @@ const toServerInput = (
       description?: string;
       command: string;
       args?: readonly string[];
+      envVars?: readonly string[];
       env?: Record<string, string>;
       cwd?: string;
       slug?: string;
@@ -46,6 +47,7 @@ const toServerInput = (
       description: p.description,
       command: p.command,
       args: p.args ? [...p.args] : undefined,
+      envVars: p.envVars ? [...p.envVars] : undefined,
       env: p.env,
       cwd: p.cwd,
       slug: p.slug,
diff --git a/packages/plugins/mcp/src/react/AddMcpSource.tsx b/packages/plugins/mcp/src/react/AddMcpSource.tsx
index b70e2722e..527f62f08 100644
--- a/packages/plugins/mcp/src/react/AddMcpSource.tsx
+++ b/packages/plugins/mcp/src/react/AddMcpSource.tsx
@@ -18,7 +18,7 @@ import {
 import { FloatActions } from "@executor-js/react/components/float-actions";
 import { Input } from "@executor-js/react/components/input";
 import { Spinner } from "@executor-js/react/components/spinner";
-import { Textarea } from "@executor-js/react/components/textarea";
+import { TagInput } from "@executor-js/react/components/tag-input";
 import {
   integrationDisplayNameFromUrl,
   slugifyNamespace,
@@ -48,14 +48,6 @@ import { mcpPresets, type McpPreset } from "../sdk/presets";
 // the user can add alternate methods (e.g. an API key alongside OAuth, or a
 // declared method on a server that advertises none).
 
-const STDIO_ENV_ESCAPE_REPLACEMENTS: Readonly<Record<string, string>> = {
-  "\\": "\\",
-  n: "\n",
-  r: "\r",
-  t: "\t",
-  '"': '"',
-};
-
 // ---------------------------------------------------------------------------
 // Preset lookup
 // ---------------------------------------------------------------------------
@@ -180,7 +172,7 @@ export default function AddMcpSource(props: {
   const [stdioArgs, setStdioArgs] = useState(
     isStdioPreset && preset.args ? preset.args.join(" ") : "",
   );
-  const [stdioEnv, setStdioEnv] = useState("");
+  const [stdioEnvVars, setStdioEnvVars] = useState<string[]>([]);
   const stdioIdentity = useIntegrationIdentity({
     fallbackName: isStdioPreset ? preset.name : stdioCommand,
   });
@@ -352,36 +344,6 @@ export default function AddMcpSource(props: {
     return args;
   };
 
-  const parseStdioEnvValue = (raw: string): string => {
-    const value = raw.trim();
-    if (value.length < 2) return value;
-
-    const quote = value[0];
-    if ((quote !== '"' && quote !== "'") || value[value.length - 1] !== quote) {
-      return value;
-    }
-
-    const inner = value.slice(1, -1);
-    if (quote === "'") return inner;
-
-    return inner.replace(
-      /\\([\\nrt"])/g,
-      (_, escaped: string) => STDIO_ENV_ESCAPE_REPLACEMENTS[escaped] ?? escaped,
-    );
-  };
-
-  const parseStdioEnv = (raw: string): Record<string, string> | undefined => {
-    if (!raw.trim()) return undefined;
-    const env: Record<string, string> = {};
-    for (const line of raw.split("\n")) {
-      const eq = line.indexOf("=");
-      if (eq > 0) {
-        env[line.slice(0, eq).trim()] = parseStdioEnvValue(line.slice(eq + 1));
-      }
-    }
-    return Object.keys(env).length > 0 ? env : undefined;
-  };
-
   const handleAddStdio = useCallback(async () => {
     const cmd = stdioCommand.trim();
     if (!cmd) return;
@@ -396,7 +358,7 @@ export default function AddMcpSource(props: {
         ...(slug ? { slug } : {}),
         command: cmd,
         args: parseStdioArgs(stdioArgs),
-        env: parseStdioEnv(stdioEnv),
+        envVars: stdioEnvVars.length > 0 ? stdioEnvVars : undefined,
       },
       reactivityKeys: integrationWriteKeys,
     });
@@ -406,7 +368,7 @@ export default function AddMcpSource(props: {
       return;
     }
     props.onComplete(exit.value.slug);
-  }, [stdioCommand, stdioArgs, stdioEnv, stdioIdentity, doAddServer, props]);
+  }, [stdioCommand, stdioArgs, stdioEnvVars, stdioIdentity, doAddServer, props]);
 
   // ---- Render ----
 
@@ -548,15 +510,12 @@ export default function AddMcpSource(props: {
 
               <CardStackEntryField
                 label="Environment variables"
-                description="- One per line, KEY=value format."
+                description="- Names only; secret values are entered when you connect."
               >
-                <Textarea
-                  value={stdioEnv}
-                  onChange={(e) => setStdioEnv((e.target as HTMLTextAreaElement).value)}
-                  placeholder={"KEY=value\nANOTHER=value"}
-                  rows={3}
-                  maxRows={10}
-                  className="font-mono text-sm"
+                <TagInput
+                  values={stdioEnvVars}
+                  onChange={setStdioEnvVars}
+                  placeholder="Add an env var, e.g. GITHUB_TOKEN"
                 />
               </CardStackEntryField>
             </CardStackContent>
diff --git a/packages/plugins/mcp/src/react/McpAccountsPanel.tsx b/packages/plugins/mcp/src/react/McpAccountsPanel.tsx
index 4d40a48d8..419f28c38 100644
--- a/packages/plugins/mcp/src/react/McpAccountsPanel.tsx
+++ b/packages/plugins/mcp/src/react/McpAccountsPanel.tsx
@@ -50,13 +50,16 @@ export default function McpAccountsPanel(props: {
   const remote = config !== null && config.transport === "remote" ? config : null;
 
   const existingTemplate = useMemo<readonly McpAuthMethod[]>(
-    () => remote?.authenticationTemplate ?? [],
-    [remote],
+    () => config?.authenticationTemplate ?? [],
+    [config],
   );
 
+  // Stdio servers declare a `stdio_env` / `none` method too, so their
+  // auto-created connection and its env credentials surface here. The endpoint
+  // only feeds remote oauth methods' probe URL; stdio has none.
   const methods = useMemo<readonly AuthMethod[]>(
-    () => (remote ? authMethodsFromConfig(existingTemplate, remote.endpoint) : []),
-    [existingTemplate, remote],
+    () => (config ? authMethodsFromConfig(existingTemplate, remote?.endpoint ?? "") : []),
+    [existingTemplate, config, remote],
   );
 
   const configure = useCallback<ConfigureAuthMethods<McpAuthMethod>>(
diff --git a/packages/plugins/mcp/src/react/auth-method-config.ts b/packages/plugins/mcp/src/react/auth-method-config.ts
index 653e8b573..ae09ba49f 100644
--- a/packages/plugins/mcp/src/react/auth-method-config.ts
+++ b/packages/plugins/mcp/src/react/auth-method-config.ts
@@ -17,7 +17,30 @@ import {
 } from "@executor-js/react/lib/shared-auth-method-codec";
 
 import { wireAuthInputFromShared } from "@executor-js/react/lib/shared-auth-method-codec";
-import type { McpAuthMethod, McpAuthMethodInput, McpCanonicalAuthMethodInput } from "../sdk/types";
+import type {
+  McpAuthMethod,
+  McpAuthMethodInput,
+  McpCanonicalAuthMethodInput,
+  McpStdioEnvMethod,
+} from "../sdk/types";
+
+/** Stdio env method → generic hub `AuthMethod`: one `env`-carrier placement per
+ *  declared var, so the account form collects one secret per env var. Mirrors
+ *  the server's `describeMcpAuthMethods`. */
+const stdioEnvAuthMethod = (method: McpStdioEnvMethod): AuthMethod => ({
+  id: method.slug,
+  label: "Environment variables",
+  kind: "apikey",
+  source: "spec",
+  template: AuthTemplateSlug.make(method.slug),
+  placements: method.vars.map((name) => ({ carrier: "env", name, prefix: "", variable: name })),
+});
+
+/** Stdio env method → editor value (apikey over env placements). */
+const stdioEnvEditorValue = (method: McpStdioEnvMethod): AuthTemplateEditorValue => ({
+  kind: "apikey",
+  placements: method.vars.map((name) => ({ carrier: "env", name, prefix: "", variable: name })),
+});
 
 /** Serialize a canonical method into the wire input union (apikey → the
  *  request-shaped dialect; none/oauth2 pass through). */
@@ -53,6 +76,7 @@ export function editorValueFromMcpAuthMethod(method: McpAuthMethod): AuthTemplat
   if (method.kind === "oauth2") {
     return { kind: "oauth", authorizationUrl: "", tokenUrl: "", scopes: [] };
   }
+  if (method.kind === "stdio_env") return stdioEnvEditorValue(method);
   return editorValueFromSharedMethod(method);
 }
 
@@ -66,6 +90,7 @@ export function authMethodsFromConfig(
 ): AuthMethod[] {
   return methods.map((method: McpAuthMethod): AuthMethod => {
     if (method.kind === "oauth2") return oauthAuthMethod(method.slug, endpoint);
+    if (method.kind === "stdio_env") return stdioEnvAuthMethod(method);
     return authMethodFromSharedTemplate(method);
   });
 }
diff --git a/packages/plugins/mcp/src/sdk/plugin.ts b/packages/plugins/mcp/src/sdk/plugin.ts
index d676efc86..6e1eff1dd 100644
--- a/packages/plugins/mcp/src/sdk/plugin.ts
+++ b/packages/plugins/mcp/src/sdk/plugin.ts
@@ -7,6 +7,8 @@ import * as z from "zod/v4";
 
 import {
   authToolFailure,
+  AuthTemplateSlug,
+  ConnectionName,
   definePlugin,
   IntegrationAlreadyExistsError,
   IntegrationSlug,
@@ -58,7 +60,7 @@ import {
   normalizeMcpAuthMethods,
   parseMcpIntegrationConfig,
   type McpIntegrationConfig as McpIntegrationConfigType,
-  type McpRemoteIntegrationConfig,
+  type McpStdioEnvMethod,
   type McpStdioIntegrationConfig,
 } from "./types";
 
@@ -169,6 +171,13 @@ const McpStdioServerInputSchema = Schema.Struct({
   description: Schema.optional(Schema.String),
   command: Schema.String,
   args: Schema.optional(Schema.Array(Schema.String)),
+  /** DECLARE the secret env vars this server needs, by NAME. Their values are
+   *  supplied as the connection's secret credentials, not here — so the UI
+   *  defines what env vars exist and the connect step provides the secrets. */
+  envVars: Schema.optional(Schema.Array(Schema.String)),
+  /** Provide secret env values directly (programmatic / agent one-shot): the
+   *  add then auto-creates the connection holding them. The UI uses `envVars`
+   *  instead and leaves the values to the connect step. */
   env: Schema.optional(Schema.Record(Schema.String, Schema.String)),
   cwd: Schema.optional(Schema.String),
   slug: Schema.optional(Schema.String),
@@ -295,14 +304,34 @@ const normalizeSlug = (input: McpServerInput): string =>
     command: input.transport === "stdio" ? input.command : undefined,
   });
 
+/** Slug for a stdio server's secret-env auth method (one per integration). */
+const STDIO_ENV_TEMPLATE = "env";
+
+/** The secret env var NAMES a stdio add declares: the explicit `envVars`
+ *  declaration plus the keys of any one-shot `env` values, de-duplicated and
+ *  order-preserving. */
+const stdioEnvVarNames = (input: McpStdioServerInput): readonly string[] => {
+  const names = new Set<string>(input.envVars ?? []);
+  for (const key of Object.keys(input.env ?? {})) names.add(key);
+  return [...names];
+};
+
 const toIntegrationConfig = (input: McpServerInput): McpIntegrationConfigType => {
   if (input.transport === "stdio") {
+    // The config only DECLARES the secret env vars by NAME (a `stdio_env`
+    // method); their values are credentials and live on the connection, never
+    // in this blob. Names come from the explicit `envVars` declaration and/or
+    // the keys of any one-shot `env` values.
+    const vars = stdioEnvVarNames(input);
     return {
       transport: "stdio",
       command: input.command,
       args: input.args ? [...input.args] : undefined,
-      env: input.env,
       cwd: input.cwd,
+      authenticationTemplate:
+        vars.length > 0
+          ? [{ slug: STDIO_ENV_TEMPLATE, kind: "stdio_env", vars }]
+          : [{ slug: "none", kind: "none" }],
     };
   }
   return {
@@ -453,10 +482,10 @@ const makeOAuthProvider = (accessToken: string): OAuthClientProvider => ({
  *  config-driven), so existing connections keep working. Ambiguity across
  *  several methods renders no auth rather than guessing. */
 const selectAuthMethod = (
-  config: McpRemoteIntegrationConfig,
+  config: McpIntegrationConfigType,
   templateSlug: string | null,
 ): McpAuthMethod | undefined => {
-  const methods = config.authenticationTemplate;
+  const methods = config.authenticationTemplate ?? [];
   if (templateSlug !== null) {
     const match = methods.find((method: McpAuthMethod) => method.slug === templateSlug);
     if (match) return match;
@@ -481,11 +510,23 @@ const buildConnectorInput = (
         }),
       );
     }
+    // Secret env lives on the connection: render the bound `stdio_env`
+    // method's vars from the connection's resolved values, layered over any
+    // static (non-credential / legacy-inline) env in the config. A var that
+    // resolved to nothing is skipped rather than injected as empty.
+    const method = selectAuthMethod(config, templateSlug);
+    const env: Record<string, string> = { ...(config.env ?? {}) };
+    if (method?.kind === "stdio_env") {
+      for (const variable of method.vars) {
+        const value = values[variable];
+        if (value != null) env[variable] = value;
+      }
+    }
     return Effect.succeed({
       transport: "stdio" as const,
       command: config.command,
       args: config.args,
-      env: config.env,
+      env: Object.keys(env).length > 0 ? env : undefined,
       cwd: config.cwd,
     } satisfies McpStdioIntegrationConfig);
   }
@@ -534,13 +575,28 @@ const buildConnectorInput = (
 //                          the connect flow probes to confirm and falls back.
 // ---------------------------------------------------------------------------
 
+/** A stdio server's secret env method, projected so the console can render one
+ *  credential input per env var (carrier `env`) and re-create the connection. */
+const describeStdioEnvAuthMethod = (method: McpStdioEnvMethod): AuthMethodDescriptor => ({
+  id: method.slug,
+  label: "Environment variables",
+  kind: "apikey",
+  template: method.slug,
+  placements: method.vars.map((name) => ({ carrier: "env", name, prefix: "", variable: name })),
+});
+
 export const describeMcpAuthMethods = (
   record: IntegrationRecord,
 ): readonly AuthMethodDescriptor[] => {
   const config = parseMcpIntegrationConfig(record.config);
-  if (!config || config.transport === "stdio") return [];
-
-  return config.authenticationTemplate.map((method: McpAuthMethod): AuthMethodDescriptor => {
+  if (!config) return [];
+
+  // Stdio servers declare a single `stdio_env` method (or `none`); remote
+  // servers declare header/query/oauth methods. Both project from the same
+  // optional `authenticationTemplate`.
+  const methods = config.authenticationTemplate ?? [];
+  return methods.map((method: McpAuthMethod): AuthMethodDescriptor => {
+    if (method.kind === "stdio_env") return describeStdioEnvAuthMethod(method);
     if (method.kind === "apikey") return describeApiKeyAuthMethod(method);
     if (method.kind === "oauth2") {
       return {
@@ -548,7 +604,12 @@ export const describeMcpAuthMethods = (
         label: "OAuth",
         kind: "oauth",
         template: method.slug,
-        oauth: { discoveryUrl: config.endpoint, supportsDynamicRegistration: true },
+        // Only remote configs carry an endpoint; stdio never reaches here with
+        // oauth2.
+        oauth: {
+          discoveryUrl: config.transport === "remote" ? config.endpoint : undefined,
+          supportsDynamicRegistration: true,
+        },
       };
     }
     return describeNoneAuthMethod(method.slug);
@@ -777,6 +838,54 @@ export const mcpPlugin = definePlugin((options?: McpPluginOptions) => {
                 attributes: { "mcp.integration.slug": slug },
               }),
             );
+
+          // Auto-create the stdio server's default connection so its tools are
+          // discovered immediately (without it the integration lands with zero
+          // connections and therefore zero tools — the fresh-install "no tools
+          // detected" report). Two cases connect on add:
+          //   • one-shot `env` VALUES were supplied (agent path) → bind them as
+          //     the connection's secrets.
+          //   • the server needs NO secret env at all → a no-auth connection.
+          // When the server only DECLARES env var names (the UI path), the
+          // secrets are still missing, so we leave the connection to the connect
+          // step where the user enters one masked value per declared var.
+          if (input.transport === "stdio") {
+            const hasValues = input.env != null && Object.keys(input.env).length > 0;
+            const declaresSecrets = stdioEnvVarNames(input).length > 0;
+            if (hasValues || !declaresSecrets) {
+              yield* ctx.connections
+                .create({
+                  owner: "org",
+                  name: ConnectionName.make("default"),
+                  integration: slugFrom(slug),
+                  template: AuthTemplateSlug.make(hasValues ? STDIO_ENV_TEMPLATE : "none"),
+                  values: hasValues ? { ...input.env } : {},
+                })
+                .pipe(
+                  // These can't arise right after a successful register with
+                  // valid inputs, but the channel must stay within
+                  // McpExtensionFailure; surface them as a connection error
+                  // rather than swallow a real failure.
+                  Effect.catchTags({
+                    IntegrationNotFoundError: (cause) =>
+                      Effect.fail(
+                        new McpConnectionError({ transport: "stdio", message: cause.message }),
+                      ),
+                    CredentialProviderNotRegisteredError: (cause) =>
+                      Effect.fail(
+                        new McpConnectionError({ transport: "stdio", message: cause.message }),
+                      ),
+                    InvalidConnectionInputError: (cause) =>
+                      Effect.fail(
+                        new McpConnectionError({ transport: "stdio", message: cause.message }),
+                      ),
+                  }),
+                  Effect.withSpan("mcp.plugin.bootstrap_stdio_connection", {
+                    attributes: { "mcp.integration.slug": slug },
+                  }),
+                );
+            }
+          }
           return { slug };
         }).pipe(
           Effect.withSpan("mcp.plugin.add_server", {
@@ -787,6 +896,82 @@ export const mcpPlugin = definePlugin((options?: McpPluginOptions) => {
           }),
         );
 
+      // Heal stdio integrations that pre-date the auto-connect model: before it,
+      // adding a stdio server registered only the integration, so it landed with
+      // zero connections and therefore zero tools (the "no tools detected"
+      // report). For each such integration with no connection, create the
+      // default one — and move any legacy inline `env` (then stored plaintext in
+      // the config blob) into the connection's secret store, rewriting the
+      // config to the canonical shape that only declares the var NAMES.
+      //
+      // Idempotent and order-safe: once a connection exists the integration is
+      // skipped; the secret is persisted (connection.create) BEFORE the config
+      // is stripped, so a failure between the two leaves the env recoverable
+      // (the connection has it, and the still-inline config env also works). A
+      // single bad integration is logged and skipped, never failing the caller.
+      const reconcileStdioConnections = () =>
+        Effect.gen(function* () {
+          const integrations = yield* ctx.core.integrations.list();
+          for (const integration of integrations) {
+            if (integration.kind !== MCP_PLUGIN_ID) continue;
+            yield* Effect.gen(function* () {
+              const record = yield* ctx.core.integrations.get(integration.slug);
+              const config = record ? parseMcpIntegrationConfig(record.config) : null;
+              if (!config || config.transport !== "stdio") return;
+
+              // Only heal LEGACY pre-revamp stdio rows (no declared methods).
+              // A new-shape row declares its auth method and owns its connection
+              // lifecycle: a zero-connection one is INTENTIONAL — it declared
+              // secret env vars (the UI "declare then connect" path) and is
+              // awaiting its secrets. Auto-creating a no-auth connection here
+              // would run a secret-needing server without its secret and clobber
+              // that flow.
+              if (config.authenticationTemplate !== undefined) return;
+
+              const connections = yield* ctx.connections.list({
+                integration: integration.slug,
+              });
+              if (connections.length > 0) return; // already connectable — nothing to heal.
+
+              const inlineEnv = config.env ?? {};
+              const envVars = Object.keys(inlineEnv);
+              const hasEnv = envVars.length > 0;
+
+              yield* ctx.connections.create({
+                owner: "org",
+                name: ConnectionName.make("default"),
+                integration: integration.slug,
+                template: AuthTemplateSlug.make(hasEnv ? STDIO_ENV_TEMPLATE : "none"),
+                values: hasEnv ? { ...inlineEnv } : {},
+              });
+
+              // The secret is now on the connection: canonicalize this legacy
+              // config (declare the var names as a stdio_env method, dropping the
+              // inline plaintext values; or `none` for a no-secret server).
+              const nextConfig: McpIntegrationConfigType = {
+                transport: "stdio",
+                command: config.command,
+                args: config.args,
+                cwd: config.cwd,
+                authenticationTemplate: hasEnv
+                  ? [{ slug: STDIO_ENV_TEMPLATE, kind: "stdio_env", vars: envVars }]
+                  : [{ slug: "none", kind: "none" }],
+              };
+              yield* ctx.core.integrations.update(integration.slug, { config: nextConfig });
+            }).pipe(
+              Effect.catch((cause) =>
+                Effect.logWarning(
+                  `mcp: failed healing stdio connection for "${integration.slug}"`,
+                  cause,
+                ),
+              ),
+              Effect.withSpan("mcp.plugin.reconcile_stdio_connection", {
+                attributes: { "mcp.integration.slug": String(integration.slug) },
+              }),
+            );
+          }
+        }).pipe(Effect.withSpan("mcp.plugin.reconcile_stdio_connections"));
+
       const removeServer = (slug: string) =>
         Effect.gen(function* () {
           const integration = slugFrom(slug);
@@ -918,6 +1103,7 @@ export const mcpPlugin = definePlugin((options?: McpPluginOptions) => {
         probeEndpoint,
         addServer,
         removeServer,
+        reconcileStdioConnections,
         getServer,
         configureServer,
         configureAuth,
@@ -1261,6 +1447,9 @@ export interface McpPluginExtension {
     McpExtensionFailure | IntegrationAlreadyExistsError
   >;
   readonly removeServer: (slug: string) => Effect.Effect<void, McpExtensionFailure>;
+  /** Ensure every stdio integration has its default connection (migrating any
+   *  legacy inline env into the secret store). Idempotent; safe to run at boot. */
+  readonly reconcileStdioConnections: () => Effect.Effect<void, McpExtensionFailure>;
   readonly getServer: (
     slug: string,
   ) => Effect.Effect<
diff --git a/packages/plugins/mcp/src/sdk/types.ts b/packages/plugins/mcp/src/sdk/types.ts
index 9ce33e0ab..838e81e0a 100644
--- a/packages/plugins/mcp/src/sdk/types.ts
+++ b/packages/plugins/mcp/src/sdk/types.ts
@@ -54,7 +54,26 @@ export const McpOAuthMethod = Schema.Struct({
 });
 export type McpOAuthMethod = typeof McpOAuthMethod.Type;
 
-export const McpAuthMethod = Schema.Union([NoneAuthMethod, ApiKeyAuthMethod, McpOAuthMethod]);
+/** Stdio env credential: the named environment variables a stdio server needs
+ *  (often API keys / tokens). A connection supplies one secret value per `var`,
+ *  keyed by the var name; at launch the connector injects them into the
+ *  subprocess env. The VALUES live in the secret store as the connection's
+ *  inputs, never in this config blob — that is the "properly store auth" half
+ *  of the stdio model, mirroring how remote apikey methods keep their secrets
+ *  on the connection rather than the integration. */
+export const McpStdioEnvMethod = Schema.Struct({
+  slug: Schema.String,
+  kind: Schema.Literal("stdio_env"),
+  vars: Schema.Array(Schema.String),
+});
+export type McpStdioEnvMethod = typeof McpStdioEnvMethod.Type;
+
+export const McpAuthMethod = Schema.Union([
+  NoneAuthMethod,
+  ApiKeyAuthMethod,
+  McpOAuthMethod,
+  McpStdioEnvMethod,
+]);
 export type McpAuthMethod = typeof McpAuthMethod.Type;
 
 /** Single-method `auth` shorthand on `addServer` — agent convenience for the
@@ -180,10 +199,20 @@ export const McpStdioIntegrationConfig = Schema.Struct({
   command: Schema.String,
   /** Arguments to the command */
   args: Schema.optional(Schema.Array(Schema.String)),
-  /** Environment variables */
+  /** Static, non-credential environment variables injected verbatim into the
+   *  subprocess. Secret env (API keys / tokens) is NOT stored here — it is
+   *  declared as a `stdio_env` method in `authenticationTemplate` and its
+   *  values live on the connection. Optional + legacy: pre-revamp stdio
+   *  integrations stored their (then-plaintext) env here, so it stays
+   *  decodable. */
   env: Schema.optional(StringMap),
   /** Working directory */
   cwd: Schema.optional(Schema.String),
+  /** Declared auth methods — a single `stdio_env` method naming the secret env
+   *  vars, or `none`. A connection's `template` picks one by slug, exactly as
+   *  for remote servers. Optional so pre-revamp stdio configs (which had no
+   *  methods) still decode; absence is treated as no declared secret env. */
+  authenticationTemplate: Schema.optional(Schema.Array(McpAuthMethod)),
 });
 export type McpStdioIntegrationConfig = typeof McpStdioIntegrationConfig.Type;
 
diff --git a/packages/react/src/components/add-account-modal.tsx b/packages/react/src/components/add-account-modal.tsx
index f7927a230..98d374534 100644
--- a/packages/react/src/components/add-account-modal.tsx
+++ b/packages/react/src/components/add-account-modal.tsx
@@ -147,20 +147,24 @@ function isOnePasswordRegistered(
 function PasteCredentialInputs(props: {
   readonly inputs: readonly CredentialInput[];
   readonly singleInput: boolean;
+  /** Force the per-input label even for a single input (env vars name their
+   *  field rather than relying on a generic "value / token" placeholder). */
+  readonly showLabels?: boolean;
   readonly values: Readonly<Record<string, string>>;
   readonly onChange: (values: Record<string, string>) => void;
 }) {
+  const labelled = props.showLabels || !props.singleInput;
   return (
     <div className="space-y-2">
       {props.inputs.map((input) => (
         <div key={input.variable} className="space-y-1">
-          {!props.singleInput && (
-            <Label className="text-xs text-muted-foreground">{input.label}</Label>
+          {labelled && (
+            <Label className="font-mono text-xs text-muted-foreground">{input.label}</Label>
           )}
           <Input
             type="password"
             autoComplete="new-password"
-            placeholder={props.singleInput ? "paste the value / token" : `paste ${input.label}`}
+            placeholder={labelled ? "secret value" : "paste the value / token"}
             value={props.values[input.variable] ?? ""}
             onChange={(e: React.ChangeEvent<HTMLInputElement>) =>
               props.onChange({
@@ -247,6 +251,13 @@ function OnePasswordItemSelect(props: {
 function CredentialValueFields(props: {
   readonly inputs: readonly CredentialInput[];
   readonly singleInput: boolean;
+  readonly showLabels?: boolean;
+  /** Allow an external provider (1Password) origin. Off for env methods: the
+   *  wire's external `from` is keyed under the canonical `token` variable, but
+   *  an env credential must be keyed under its env var name, so a 1Password
+   *  origin would persist the secret under the wrong key and the subprocess
+   *  would launch without it. Paste stays correctly keyed per variable. */
+  readonly allowExternalProvider?: boolean;
   readonly values: Readonly<Record<string, string>>;
   readonly onValuesChange: (values: Record<string, string>) => void;
   readonly origin: CredentialOrigin;
@@ -255,7 +266,10 @@ function CredentialValueFields(props: {
   readonly onOnePasswordItemIdChange: (value: string) => void;
 }) {
   const providers = useAtomValue(providersAtom);
-  const onePasswordAvailable = props.singleInput && isOnePasswordRegistered(providers);
+  const onePasswordAvailable =
+    props.singleInput &&
+    (props.allowExternalProvider ?? true) &&
+    isOnePasswordRegistered(providers);
 
   return (
     <div className="space-y-3">
@@ -291,6 +305,7 @@ function CredentialValueFields(props: {
         <PasteCredentialInputs
           inputs={props.inputs}
           singleInput={props.singleInput}
+          showLabels={props.showLabels}
           values={props.values}
           onChange={props.onValuesChange}
         />
@@ -793,6 +808,13 @@ export function AddAccountModal(props: {
     }));
   }, [method]);
   const singleInput = credentialInputs.length <= 1;
+  // A stdio env method: every credential is injected as an environment variable
+  // (carrier "env"). These read as named secrets, not an HTTP placement, so we
+  // skip the `KEY=••••••` placement preview and label each field by its var.
+  const isEnvMethod =
+    method != null &&
+    method.placements.length > 0 &&
+    method.placements.every((p) => p.carrier === "env");
   // DCR-capable: the integration advertises dynamic registration (MCP oauth2),
   // OR carries a discovery URL we can probe at connect time. When DCR-capable
   // and not yet fallen back, we skip the app picker entirely (Option A).
@@ -1365,13 +1387,18 @@ export function AddAccountModal(props: {
                       value={methodId}
                       className="mt-0 min-w-0 space-y-5 rounded-md border border-border/60 bg-muted/15 p-4"
                     >
-                      {method?.placements && method.placements.length > 0 ? (
-                        <div className="flex flex-wrap gap-x-3.5 gap-y-1">
-                          {method.placements.map((placement, i: number) => (
-                            <PlacementLine key={i} placement={placement} />
-                          ))}
-                        </div>
-                      ) : null}
+                      {method?.placements && !isEnvMethod
+                        ? (() => {
+                            const shown = method.placements.filter((p) => p.carrier !== "env");
+                            return shown.length > 0 ? (
+                              <div className="flex flex-wrap gap-x-3.5 gap-y-1">
+                                {shown.map((placement, i: number) => (
+                                  <PlacementLine key={i} placement={placement} />
+                                ))}
+                              </div>
+                            ) : null;
+                          })()
+                        : null}
 
                       {!isNoAuth && (
                         <div className="space-y-2">
@@ -1478,6 +1505,8 @@ export function AddAccountModal(props: {
                             <CredentialValueFields
                               inputs={credentialInputs}
                               singleInput={singleInput}
+                              showLabels={isEnvMethod}
+                              allowExternalProvider={!isEnvMethod}
                               values={values}
                               onValuesChange={setValues}
                               origin={credentialOrigin}
diff --git a/packages/react/src/components/tag-input.tsx b/packages/react/src/components/tag-input.tsx
new file mode 100644
index 000000000..4983fdb9c
--- /dev/null
+++ b/packages/react/src/components/tag-input.tsx
@@ -0,0 +1,102 @@
+import * as React from "react";
+import { PlusIcon, XIcon } from "lucide-react";
+
+import { cn } from "../lib/utils";
+import { Badge } from "./badge";
+import { Button } from "./button";
+import { Input } from "./input";
+
+// ---------------------------------------------------------------------------
+// TagInput — type a value and click + (or press Enter) to add it; the added
+// values stack as removable chips BELOW the input. The × removes one,
+// Backspace on an empty field removes the last, and pasting a separated list
+// adds them all. Values are de-duplicated and order-preserving. Used e.g. to
+// declare the env var NAMES a stdio MCP server needs.
+// ---------------------------------------------------------------------------
+
+export function TagInput(props: {
+  readonly values: readonly string[];
+  readonly onChange: (next: string[]) => void;
+  readonly placeholder?: string;
+  readonly className?: string;
+  /** Split pattern for a committed token / paste. Defaults to runs of
+   *  whitespace and commas. */
+  readonly separator?: RegExp;
+}) {
+  const { values, onChange } = props;
+  const [draft, setDraft] = React.useState("");
+  const separator = props.separator ?? /[\s,]+/;
+
+  const commit = (raw: string) => {
+    const tokens = raw
+      .split(separator)
+      .map((s) => s.trim())
+      .filter(Boolean);
+    if (tokens.length === 0) return;
+    const next = [...values];
+    for (const token of tokens) if (!next.includes(token)) next.push(token);
+    onChange(next);
+    setDraft("");
+  };
+
+  return (
+    <div className={cn("space-y-2", props.className)}>
+      <div className="flex items-center gap-2">
+        <Input
+          value={draft}
+          onChange={(e) => setDraft(e.target.value)}
+          onKeyDown={(e) => {
+            if (e.key === "Enter" || e.key === ",") {
+              e.preventDefault();
+              commit(draft);
+            } else if (e.key === "Backspace" && draft === "" && values.length > 0) {
+              onChange(values.slice(0, -1));
+            }
+          }}
+          onPaste={(e) => {
+            const text = e.clipboardData.getData("text");
+            if (separator.test(text)) {
+              e.preventDefault();
+              commit(text);
+            }
+          }}
+          // Don't lose a typed-but-unsubmitted value when focus leaves (e.g. the
+          // user clicks the form's submit instead of + / Enter).
+          onBlur={() => commit(draft)}
+          placeholder={props.placeholder}
+          className="flex-1 font-mono"
+        />
+        <Button
+          type="button"
+          variant="outline"
+          size="icon"
+          aria-label="Add"
+          disabled={draft.trim().length === 0}
+          onClick={() => commit(draft)}
+        >
+          <PlusIcon />
+        </Button>
+      </div>
+
+      {values.length > 0 && (
+        <div className="flex flex-wrap gap-1.5">
+          {values.map((value) => (
+            <Badge key={value} variant="secondary" className="gap-0.5 py-0.5 pr-1 font-mono">
+              {value}
+              <Button
+                type="button"
+                variant="ghost"
+                size="icon-sm"
+                aria-label={`Remove ${value}`}
+                className="size-4 rounded-full hover:bg-transparent hover:text-foreground"
+                onClick={() => onChange(values.filter((v) => v !== value))}
+              >
+                <XIcon />
+              </Button>
+            </Badge>
+          ))}
+        </div>
+      )}
+    </div>
+  );
+}
diff --git a/packages/react/src/lib/auth-placements.tsx b/packages/react/src/lib/auth-placements.tsx
index 99067476c..c4f49d36e 100644
--- a/packages/react/src/lib/auth-placements.tsx
+++ b/packages/react/src/lib/auth-placements.tsx
@@ -18,7 +18,7 @@
 import { AuthTemplateSlug } from "@executor-js/sdk/shared";
 import type { AuthMethodDescriptor } from "@executor-js/sdk/shared";
 
-export type Carrier = "header" | "query";
+export type Carrier = "header" | "query" | "env";
 
 export interface Placement {
   readonly carrier: Carrier;
@@ -87,6 +87,9 @@ export function placementLabel(placement: Placement): string {
   if (placement.carrier === "header") {
     return `${placement.name || "Authorization"} header`;
   }
+  if (placement.carrier === "env") {
+    return `${placement.name || "TOKEN"} env var`;
+  }
   return `${placement.name || "api_key"} query param`;
 }
 
@@ -100,7 +103,9 @@ export function PlacementLine(props: { readonly placement: Placement; readonly m
   const lead =
     placement.carrier === "header"
       ? `${placement.name || "Authorization"}: `
-      : `?${placement.name || "api_key"}=`;
+      : placement.carrier === "env"
+        ? `${placement.name || "TOKEN"}=`
+        : `?${placement.name || "api_key"}=`;
   return (
     <span className="inline-flex items-center font-mono text-xs text-muted-foreground">
       {lead}
diff --git a/packages/react/src/lib/shared-auth-method-codec.ts b/packages/react/src/lib/shared-auth-method-codec.ts
index 7f5c8d885..9f8c21dda 100644
--- a/packages/react/src/lib/shared-auth-method-codec.ts
+++ b/packages/react/src/lib/shared-auth-method-codec.ts
@@ -113,8 +113,13 @@ export const wirePlacementsFromEditor = (
 ): readonly AuthPlacement[] => {
   const variables = assignVariables(placements);
   return placements
-    .filter((p: Placement) => p.name.trim().length > 0 || p.literal !== undefined)
-    .map((p: Placement): AuthPlacement => {
+    .filter(
+      // `env` placements belong to stdio integrations, not the HTTP custom-
+      // method editor this codec serializes; they never reach the wire here.
+      (p: Placement): p is Placement & { readonly carrier: "header" | "query" } =>
+        p.carrier !== "env" && (p.name.trim().length > 0 || p.literal !== undefined),
+    )
+    .map((p): AuthPlacement => {
       const variable = variables.get(p);
       return {
         carrier: p.carrier,