Skip to main content
MCP Apps SDK
import { App } from "@modelcontextprotocol/ext-apps";

Overview

The ontoolinput notification handler is called when the host sends complete tool arguments. This event arrives after a tool call begins and before the tool result is available, giving your app a window to process or display the finalized input. Like all notification handlers, ontoolinput should be registered before calling connect() to ensure no events are missed during the initialization handshake.
Register handlers before calling connect() to avoid missing notifications during the initialization handshake.

Signature

app.ontoolinput = (params) => void;

Parameters

params.arguments
Record<string, unknown>
Complete tool call arguments as key-value pairs.

Usage

Basic usage

const app = new App({ name: "MyApp", version: "1.0.0" });

app.ontoolinput = (params) => {
  console.log("Tool arguments:", params.arguments);
};

await app.connect();

Rendering tool input in the UI

app.ontoolinput = (params) => {
  const { code, language } = params.arguments as {
    code: string;
    language: string;
  };

  const editor = document.querySelector<HTMLPreElement>("#editor")!;
  editor.textContent = code;
  editor.dataset.language = language;

  highlightCode(editor);
};

Using with the sunpeak framework

The sunpeak framework provides the useToolData hook, which wraps ontoolinput (along with related handlers) into a reactive value for React components. This is the recommended approach when building with sunpeak.
import { useToolData } from "sunpeak/hooks";

function MyComponent() {
  const toolData = useToolData();
  // toolData.input contains the complete tool arguments
}