# MCP Server

The `@react-spectrum/mcp` package allows you to run [Model Context Protocol (MCP)](https://modelcontextprotocol.io/docs/getting-started/intro) servers for React Spectrum (S2) and React Aria locally. It exposes a set of tools that MCP clients can discover and call to browse the docs.

## Using with an MCP client

Add one or both servers to your MCP client configuration (the exact file and schema may depend on your client).

```js
{
  "mcpServers": {
    "React Spectrum (S2)": {
      "command": "npx",
      "args": ["@react-spectrum/mcp", "s2"]
    },
    "React Aria": {
      "command": "npx",
      "args": ["@react-spectrum/mcp", "react-aria"]
    }
  }
}
```

### Cursor

React Spectrum (S2):

[Add to Cursor](cursor://anysphere.cursor-deeplink/mcp/install?name=React%20Spectrum%20\(S2\)\&config=eyJjb21tYW5kIjoibnB4IEByZWFjdC1zcGVjdHJ1bS9tY3AgczIifQ%3D%3D)

React Aria:

[Add to Cursor](cursor://anysphere.cursor-deeplink/mcp/install?name=React%20Aria\&config=eyJjb21tYW5kIjoibnB4IEByZWFjdC1zcGVjdHJ1bS9tY3AgcmVhY3QtYXJpYSJ9)

Or follow Cursor's MCP install [guide](https://docs.cursor.com/en/context/mcp#installing-mcp-servers) and use the standard config above.

### VS Code

React Spectrum (S2):

[Add to Visual Studio Code](vscode:mcp/install?%7B%22name%22%3A%22React%20Spectrum%20\(S2\)%22%2C%22command%22%3A%22npx%22%2C%22args%22%3A%5B%22%40react-spectrum%2Fmcp%22%2C%22s2%22%5D%7D)

React Aria:

[Add to Visual Studio Code](vscode:mcp/install?%7B%22name%22%3A%22React%20Aria%22%2C%22command%22%3A%22npx%22%2C%22args%22%3A%5B%22%40react-spectrum%2Fmcp%22%2C%22react-aria%22%5D%7D)

Or follow VS Code's MCP install [guide](https://code.visualstudio.com/docs/copilot/chat/mcp-servers#_add-an-mcp-server) and use the standard config above. You can also add servers using the VS Code CLI:

```bash
code --add-mcp '{"name":"React Spectrum (S2)","command":"npx","args":["@react-spectrum/mcp","s2"]}'
```

```bash
code --add-mcp '{"name":"React Aria","command":"npx","args":["@react-spectrum/mcp","react-aria"]}'
```

### Claude Code

Use the Claude Code CLI to add the servers:

```bash
claude mcp add react-spectrum-s2 npx @react-spectrum/mcp s2
```

```bash
claude mcp add react-aria npx @react-spectrum/mcp react-aria
```

For more information, see the [Claude Code MCP documentation](https://docs.claude.com/en/docs/claude-code/mcp).

### Codex

Create or edit the configuration file `~/.codex/config.toml` and add:

```js
[mcp_servers.react-spectrum-s2]
command = "npx"
args = ["@react-spectrum/mcp", "s2"]

[mcp_servers.react-aria]
command = "npx"
args = ["@react-spectrum/mcp", "react-aria"]
```

For more information, see the [Codex MCP documentation](https://github.com/openai/codex/blob/main/docs/config.md#mcp_servers).

### Gemini CLI

Use the Gemini CLI to add the servers:

```bash
gemini mcp add react-spectrum-s2 npx @react-spectrum/mcp s2
```

```bash
gemini mcp add react-aria npx @react-spectrum/mcp react-aria
```

For more information, see the [Gemini CLI MCP documentation](https://github.com/google-gemini/gemini-cli/blob/main/docs/tools/mcp-server.md#how-to-set-up-your-mcp-server).

### Windsurf

Follow the Windsurf MCP [documentation](https://docs.windsurf.com/windsurf/cascade/mcp) and use the standard config above.