@khmuhtadin/pi-stitch-mcp

Pi extension that bridges pi to the Google Stitch remote MCP server. Design-to-code: generate Flutter, React, SwiftUI components from Figma designs.

Packages

Package details

extension

Install @khmuhtadin/pi-stitch-mcp from npm and Pi will load the resources declared by the package manifest.

$ pi install npm:@khmuhtadin/pi-stitch-mcp
Package
@khmuhtadin/pi-stitch-mcp
Version
0.1.0
Published
Jun 22, 2026
Downloads
105/mo · 9/wk
Author
khmuhtadin
License
MIT
Types
extension
Size
11.9 KB
Dependencies
1 dependency · 2 peers
Pi manifest JSON
{
  "extensions": [
    "./index.ts"
  ]
}

Security note

Pi packages can execute code and influence agent behavior. Review the source before installing third-party packages.

README

pi Stitch MCP Extension

A pi package that bridges pi to the Google Stitch remote MCP server (https://stitch.googleapis.com/mcp). Stitch is Google's design-to-code platform — generate pixel-perfect Flutter, React (JSX), and SwiftUI components from Figma designs.

It exposes a small, generic bridge instead of registering dozens of Stitch tools by default. This keeps pi's tool list compact while still allowing the model to discover and call any Stitch MCP tool.

Installation

pi install npm:@khmuhtadin/pi-stitch-mcp

Prerequisites

You need a Google Stitch API key. Set it via:

export GOOGLE_STITCH_API_KEY="your-api-key-here"

Or inside pi:

/stitch-mcp-set-key your-api-key-here

Registered tools

  • stitch_mcp_list_tools — list tools exposed by the Stitch MCP server.
  • stitch_mcp_call_tool — call any Stitch MCP tool by name with JSON arguments.

Slash commands

  • /stitch-mcp-set-key <key> — set the Google Stitch API key in memory (not persisted across restarts; use GOOGLE_STITCH_API_KEY env var for persistence).
  • /stitch-mcp-register [tool1,tool2|*] — optional: register selected MCP tools as native pi tools with a stitch_ prefix.
  • /stitch-mcp-reset — reset the connection.

Configuration

Optional environment variables:

  • GOOGLE_STITCH_API_KEY — your Google Stitch API key (recommended).
  • STITCH_MCP_URL — defaults to https://stitch.googleapis.com/mcp.
  • STITCH_MCP_TIMEOUT_MS — defaults to 30000.

Development

npm install
npm run typecheck
npm pack --dry-run

License

MIT