Skip to main content

Documentation Index

Fetch the complete documentation index at: https://mintlify.com/BaselAshraf81/holystitch/llms.txt

Use this file to discover all available pages before exploring further.

The fetcher module (pipeline/fetcher.ts) retrieves raw screen HTML from a Stitch project using the @google/stitch-sdk. It is only invoked when a projectId is provided to the convert_stitch_to_react tool — if you pass htmlScreens directly, the fetcher is never called.

fetchScreens

async function fetchScreens(
  projectId: string,
  apiKey: string,
  screenIds?: string[]
): Promise<RawScreen[]>
Connects to the Stitch API, retrieves the project’s screens, and returns their HTML content as RawScreen[].

Parameters

projectId
string
required
The Stitch project ID, taken directly from the Stitch project URL. Passed through to stitchApi.project(projectId).
apiKey
string
required
A valid Stitch API key. In the MCP server, this is read from the STITCH_API_KEY environment variable and passed here. Never hardcode API keys — always use the MCP server’s env config block.
screenIds
string[]
Optional list of screen IDs to fetch. When provided, only screens whose id appears in this list are returned. When omitted, all screens in the project are fetched. An empty array is treated the same as omitting the parameter.

Return type: RawScreen[]

interface RawScreen {
  id: string;
  name: string;
  html: string;
}
id
string
The screen’s unique identifier from the Stitch API.
name
string
Human-readable screen name. The fetcher reads screen.data.displayName first, then screen.data.title, and falls back to screen.id if neither field is present.
html
string
Full HTML string for the screen, as returned by screen.getHtml(). This is the raw Stitch export — it includes <head>, font links, Tailwind config scripts, and the full <body>.

SDK usage

The fetcher uses @google/stitch-sdk v0.0.x, which exports two classes:
  • StitchToolClient — low-level transport. Accepts { apiKey } and requires connect() to be called before use.
  • Stitch — high-level domain API. Wraps StitchToolClient and exposes project(id).
const toolClient = new StitchToolClient({ apiKey });
await toolClient.connect();

const stitchApi = new Stitch(toolClient);
const project = stitchApi.project(projectId);
const allScreens = await project.screens();
All screens are fetched in parallel using Promise.all.

Optional SDK dependency

The @google/stitch-sdk package is a runtime-optional dependency. It is dynamically imported inside fetchScreens so that the MCP server starts successfully even if the SDK is not installed — the error only surfaces when you actually call convert_stitch_to_react with a projectId. If the SDK is not installed, you will see:
@google/stitch-sdk is not installed. Run: npm install @google/stitch-sdk
Alternatively, pass htmlScreens directly to skip Stitch API fetching.

Error cases

ConditionError message
@google/stitch-sdk is not installed@google/stitch-sdk is not installed. Run: npm install @google/stitch-sdk
Project has no screensNo screens found in project {projectId}
screenIds provided but none matchNo screens found in project {projectId} matching screen IDs: {ids}
Invalid API key or project IDError propagated from the Stitch SDK (network / auth error)
The STITCH_API_KEY environment variable must be set in your MCP server configuration, not in a shell environment. Shell environment variables are not visible to MCP servers. Set it in the "env" block of your MCP config file.

MCP server configuration

{
  "mcpServers": {
    "holystitch": {
      "command": "node",
      "args": ["/path/to/holystitch/packages/mcp-server/dist/index.js"],
      "env": {
        "STITCH_API_KEY": "your-stitch-api-key"
      }
    }
  }
}

Skipping the fetcher

If you have the HTML already — from a Stitch export, a prior fetch, or a local file — pass it directly via htmlScreens to skip the fetcher entirely. This requires no API key and no SDK installation:
{
  "htmlScreens": [
    {
      "id": "home",
      "name": "Home",
      "html": "<!DOCTYPE html>..."
    }
  ]
}

Build docs developers (and LLMs) love