Agent quickstart

Start after your resource and Region already work without AI. The endpoint delegates render calls to the existing app; it does not create a second runtime.

See the result first#

1. Open the Playground and run a manual task.
2. Choose Browser agent, then Enable WebMCP in a browser with the experiment enabled. Follow WebMCP setup if unavailable.
3. Give the displayed prompt to your browser agent. It discovers the tools, proposes a registered intent, and changes the same result panel.
4. Open Inspect to read the request and receipt. Try Analytical workspace and Entire page without disconnecting the agent.

For an MCP client or your own model, use the standalone local example. No model connection is required to build or manually operate the application.

Create the endpoint#

The React tutorial contains the complete People app used here. Finish it first, then add this file next to the tutorial's src/app.ts. Call createPeopleAgentSession(app) only after the host has created the app and mounted people-main. A model cannot supply the app, Region ID, transport, or expiry.

agent.ts

import { createAppToolEndpoint } from '@varendo/agent/app';
import type { createTutorialApp } from './app.js';

type TutorialApp = ReturnType<typeof createTutorialApp>;

export function createPeopleAgentSession(app: TutorialApp) {
  const endpoint = createAppToolEndpoint({
    runtime: app.runtime,
    render: app,
    regionId: 'people-main',
    goalEpoch: crypto.randomUUID(),
    transport: 'mcp',
    expiresAt: Date.now() + 15 * 60_000,
    maxPending: 2,
    maxMilliseconds: 15_000,
    maxInputBytes: 32_000,
    maxOutputBytes: 64_000,
  });
  if (!endpoint.ok) throw new Error(endpoint.diagnostics[0].message);
  return endpoint.value;
}

The code matches the maintained tutorial's src/agent.ts. Its endpoint is a bounded tool session, not a model connection; connect a host-controlled MCP transport separately. Keep app alive for the session. Dispose it from the application owner after clients disconnect.

Pair trusted state#

You choose the Region, expiry, origin, and current authority in host code. These values are never model arguments. A new principal, scope, Region, or goal epoch needs a new pairing. By default, discovery exposes only the mounted resource. A host that routes multiple resources may provide context: {read: () => app.runtime.contexts('people-main')}. The runtime omits denied resources and rejects cross-principal or cross-scope discovery.

Verify these cases#