Skip to main content
Glama

License Glama MCP server score

Phonebook turns screenshots your team already has into a Storybook-style component gallery. No new test code, no design tokens to maintain by hand — it renders what's already in your codebase into a static site designers can open without installing anything. Each repo runs Phonebook independently; v1 is single-platform, so one Android repo (or one iOS repo) produces one bundle and one site.

Features

  • Zero new test code — reuses @Preview / #Preview you've already written

  • No SaaS account — self-hosted, runs entirely in your CI or locally

  • MCP-first — a coding agent can check setup, analyze coverage, add missing previews, and build the gallery for you

  • Smart component grouping — component / state cards inferred from preview names, no required annotation

  • Cross-platform — Android (Roborazzi + ComposablePreviewScanner, runs on the JVM, no emulator) and iOS (SnapshotPreviews, runs on a simulator)

  • Version-aware setup — init/doctor resolve library versions against your project's Kotlin version and catch Kotlin/Roborazzi metadata mismatches before they cause opaque compiler crashes

Related MCP server: Pixl

Demo

Watch the Phonebook promo video

Phonebook gallery screenshot

A gallery generated from samples/ios — component / state cards grouped from the app's own #Previews, no extra annotation.

Browse the live gallery →

How it works

  1. phonebook generate runs your platform's preview-rendering engine and harvests the output into a bundle (manifest.json + images/).

  2. phonebook build turns that bundle into a static site — by default it writes index.html directly into the bundle directory (reusing the images already there, no copying), so the site lands at <bundle>/index.html. Pass -o <dir> to instead copy everything into a standalone site directory (for publishing elsewhere, or later merging multiple bundles). Plain HTML/CSS/JS, works from file:// or any static host.

Installation

npm install -g @stag-build/phonebook
brew install stag-build/phonebook/phonebook

Or tap first, then install:

brew tap stag-build/phonebook
brew install phonebook

Formula source: stag-build/homebrew-phonebook.

npx @stag-build/phonebook <cmd>

Most people won't run the CLI directly — Phonebook is built to be driven by a coding agent (Claude Code, Codex, etc.) through its MCP server. The agent adds previews, runs setup checks, and generates the gallery for you; the CLI underneath is the engine it calls.

The server runs via npx @stag-build/phonebook mcp — no install step needed. Pick your client below.

claude mcp add phonebook -- npx -y @stag-build/phonebook mcp

Add to ~/.codex/config.toml:

[mcp_servers.phonebook]
command = "npx"
args = ["-y", "@stag-build/phonebook", "mcp"]

Add to your Claude Desktop config (~/Library/Application Support/Claude/claude_desktop_config.json on macOS):

{
  "mcpServers": {
    "phonebook": {
      "command": "npx",
      "args": ["-y", "@stag-build/phonebook", "mcp"]
    }
  }
}

Add to .cursor/mcp.json (project) or ~/.cursor/mcp.json (global):

{
  "mcpServers": {
    "phonebook": {
      "command": "npx",
      "args": ["-y", "@stag-build/phonebook", "mcp"]
    }
  }
}

Add to .codex/config.toml at your project's workspace root. Xcode's agent runs with a minimal PATH, so the command wraps npx in a shell that adds the usual Homebrew/nvm locations first:

[mcp_servers.phonebook]
command = "/bin/zsh"
args = [
  "-lc",
  "PATH=/opt/homebrew/bin:/usr/local/bin:/usr/bin:/bin:/usr/sbin:/sbin; npx -y @stag-build/phonebook mcp"
]
enabled = true

Add the mcpServers block to ~/Library/Developer/Xcode/CodingAssistant/ClaudeAgentConfig/.claude.json:

{
  "mcpServers": {
    "phonebook": {
      "command": "/bin/zsh",
      "args": [
        "-lc",
        "PATH=/opt/homebrew/bin:/usr/local/bin:/usr/bin:/bin:/usr/sbin:/sbin; npx -y @stag-build/phonebook mcp"
      ]
    }
  }
}

Android Studio (Gemini Agent Mode): not supported yet — its MCP integration only connects to remote httpUrl servers, not local stdio processes like Phonebook's. Use one of the terminal-based clients above (Claude Code, Codex CLI) from the Android repo instead.

Then, from a chat in your Android or iOS repo, just ask:

"Use the phonebook MCP and create a catalog for my designer."

The agent figures out the rest — checking setup, filling in missing previews, generating, and building the site. For more targeted asks, it also exposes: check_setup (setup diagnosis, same as phonebook doctor), analyze_coverage (components missing previews or dark variants), get_preview_guidance, run_generate, and run_build.

Quickstart: Android

Run phonebook init first — it detects your project's Kotlin version and prints these instructions with library versions resolved to be compatible with it (e.g. Kotlin 2.0 projects get Roborazzi 1.60.0; Kotlin 2.2+ gets the latest). The versions below are what a current-Kotlin project gets (see samples/android/app/build.gradle.kts for a full working example):

// app/build.gradle.kts
plugins {
    id("io.github.takahirom.roborazzi") // root build.gradle.kts: version "1.72.0" apply false
}

roborazzi {
    generateComposePreviewRobolectricTests {
        enable = true
        packages = listOf("dev.stag.phonebook.sample") // your app's package
    }
}

dependencies {
    testImplementation("org.robolectric:robolectric:4.14.1")
    testImplementation("io.github.takahirom.roborazzi:roborazzi:1.72.0")
    testImplementation("io.github.takahirom.roborazzi:roborazzi-compose:1.72.0")
    testImplementation("io.github.sergio-sastre.ComposablePreviewScanner:android:0.9.3")
    testImplementation("io.github.takahirom.roborazzi:roborazzi-compose-preview-scanner-support:1.72.0")
    testImplementation("androidx.compose.ui:ui-test-junit4") // version from your Compose BOM, or pin one
}

Add a phonebook.config.json next to settings.gradle.kts:

{
  "appName": "My Android App",
  "platform": "android",
  "android": { "modules": [":app"], "variant": "debug" }
}

Then, from the repo containing Phonebook:

npx @stag-build/phonebook generate -C /path/to/your/android/repo
npx @stag-build/phonebook build -C /path/to/your/android/repo

Open phonebook-out/index.html.

Quickstart: iOS

Add the SnapshotPreviews SPM package to your project and a small XCTest target that subclasses SnapshotTest (see samples/ios for a full working example):

// PhonebookSnapshotTests.swift
import Foundation
import SnapshottingTests

final class PhonebookSnapshotTests: SnapshotTest {
    override class func snapshotPreviews() -> [String]? {
        guard let raw = ProcessInfo.processInfo.environment["SNAPSHOTS_ONLY_FILTER"], !raw.isEmpty else {
            return nil // record every #Preview
        }
        return raw.components(separatedBy: "\n")
    }
}

Reading SNAPSHOTS_ONLY_FILTER is what lets phonebook generate --changed (or --files A.swift,B.swift) render only the previews in the files you just edited; with the variable unset, every #Preview is recorded as before.

Add phonebook.config.json next to your .xcodeproj:

{
  "appName": "My iOS App",
  "platform": "ios",
  "ios": {
    "project": "MyApp.xcodeproj",
    "scheme": "MyApp",
    "simulator": "iPhone 17 Pro"
  }
}

Your scheme must build and test the snapshot test target (see PhonebookSample.xcscheme in the sample). Then:

npx @stag-build/phonebook generate -C /path/to/your/ios/repo
npx @stag-build/phonebook build -C /path/to/your/ios/repo

Open phonebook-out/index.html.

Naming convention

Phonebook groups screenshots into component / state cards from your existing preview names — no required annotation. See docs/naming-convention.md for the full rules and examples.

Configuration

phonebook.config.json:

Key

Type

Default

Notes

appName

string

—

Required. Shown in the gallery header.

platform

"android" | "ios"

—

Required.

output

string

"phonebook-out"

Bundle output directory, relative to the config file.

android.modules

string[]

[":app"]

Gradle modules to record.

android.variant

string

"debug"

Build variant; Phonebook runs <module>:recordRoborazzi<Variant>.

ios.project

string

—

Path to .xcodeproj, relative to the config file. One of project/workspace required.

ios.workspace

string

—

Path to .xcworkspace, relative to the config file.

ios.scheme

string

—

Required. Scheme that includes the SnapshotPreviews test target.

ios.simulator

string

"iPhone 17 Pro"

Simulator device name used for -destination.

ios.onlyTesting

string

auto-detected

-only-testing: filter so generate runs just the snapshot class, not the app's whole test suite. Auto-derived from the SnapshotTest subclass; set "" to run everything.

Both generate and build accept -C <dir> (project directory containing phonebook.config.json). generate takes -o <dir> to override the bundle output and --allow-empty to tolerate a run that records no previews. build takes an optional bundle path — with none, it uses the project's bundle directory — and -o <dir> for the site output; without -o, build writes index.html straight into the bundle directory and reuses its images/ in place (no copying), which is what the quickstarts above do. Pass -o <dir> to instead copy the bundle's images into a separate, standalone site directory.

phonebook init and phonebook doctor

phonebook init detects your platform and scaffolds phonebook.config.json plus the dependency/setup snippets — with library versions resolved against your project's Kotlin version and your app package filled in. It never edits your build files for you.

phonebook doctor checks that everything generate needs is wired up: plugin and test dependencies (resolved through Gradle version catalogs when you use them), the scanner's packages value, Kotlin/Roborazzi compatibility, and the toolchain (JDK/Xcode/simulator). Add --deep to also compile the test sources — slower, but authoritative when a static check and reality disagree. On iOS, if SnapshotPreviews is linked but no SnapshotTest subclass exists yet, doctor names the exact target and folder to add it to (parsed from the .pbxproj), so you're never just told to "add the class" with no location.

phonebook init --write-snapshot-class is the one exception to init's hands-off rule: when doctor's iOS check identifies the linking target and that target's source folder is one of Xcode's filesystem-synchronized groups, it writes <folder>/PhonebookSnapshots.swift directly — safe because a synchronized folder is picked up by Xcode automatically, so no project.pbxproj edit is made. It refuses (with the reason) in every other case: no SnapshotPreviews wiring yet, a non-synchronized-group project, or a subclass that already exists.

phonebook mcp runs the MCP server — see "Using it with a coding agent" above for setup and example prompts.

Requirements

Android: JDK 17+. No emulator needed — Roborazzi renders on the JVM via Robolectric, so generate runs on Linux CI.

iOS: macOS with Xcode installed, plus a booted or bootable simulator (generate runs xcodebuild test against a named simulator destination). Requires a macOS runner in CI.

See docs/ci.md for CI recipes and docs/naming-convention.md for the naming rules.

Roadmap

Post-v1 (M5), not yet built:

  • Search and filters in the generated gallery

  • Multi-bundle merge with a side-by-side view (cross-platform sites)

  • Version diffing between two runs (the manifest already carries commit + image hashes to enable this)

  • Additional CI recipe docs

License

MIT — see LICENSE.

Available Tools

5 tools
analyze_coverageA

Scan the codebase for UI components and the previews that cover them, and report what each component is missing: states implied by its parameters, environment objects no preview supplies, dark theme, large text, and localization when the project ships one. Read-only — it reports the gaps, it does not write previews. After editing, pass changed: true (or paths) to hear only about what you touched; the whole project is always scanned either way, so the answers stay correct.

ParametersJSON Schema
NameRequiredDescriptionDefault
dirNoProject directory containing phonebook.config.json.
pathsNoReport only components declared in these files or directories, relative to the project directory. The whole project is still scanned.
changedNoReport only components in files with uncommitted git changes — what you just edited. Ignored outside a git repository. Combined with paths when both are given.

TDQS

A4.5/5.0
Behavior5/5

Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?

With no annotations provided, the description carries the full burden of behavioral disclosure. It explicitly states 'Read-only — it reports the gaps, it does not write previews,' and clarifies that the entire project is scanned even when filters are applied, ensuring the answers stay correct. This is honest and thorough for a read-only tool.

Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.

Conciseness4/5

Is the description appropriately sized, front-loaded, and free of redundancy?

The description is a single, dense paragraph but each sentence serves a purpose: purpose, behavioral safety, and usage guidance. It is front-loaded with the main objective, and the filtering instructions are kept concise. Slightly long but no waste.

Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.

Completeness4/5

Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?

For a read-only tool with 3 optional parameters and no output schema, the description adequately explains what is analyzed, what is reported, and how filters behave. It does not specify the exact return format, but that is a minor gap given the clarity of the rest. The tool is fully callable correctly from the description alone.

Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.

Parameters4/5

Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?

Schema coverage is 100%, so the baseline is 3. The description adds valuable context beyond the schema: it explains that paths restrict reporting but not scanning, that changed is ignored outside a git repo, and that both combine when given together. This clarifies edge cases and adds meaning to each parameter.

Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.

Purpose5/5

Does the description clearly state what the tool does and how it differs from similar tools?

The description states a specific verb ('Scan'), resource ('codebase'), and a precise objective: report what each UI component is missing in preview coverage (states, environment objects, dark theme, large text, localization). It clearly distinguishes itself from sibling tools like get_preview_guidance (which presumably offers guidance) and run_build/run_generate/check_setup (which are operational, not analytical).

Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.

Usage Guidelines4/5

Does the description explain when to use this tool, when not to, or what alternatives exist?

The description explains when to use the changed and paths parameters ('After editing, pass changed: true (or paths) to hear only about what you touched'), and notes that the whole project is always scanned regardless. It doesn't explicitly contrast with get_preview_guidance, but the analytical vs. guidance nature is implied, and the filtering usage is well covered.

Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.

check_setupA

Check that the project is correctly set up for phonebook generate (same checks as phonebook doctor): libraries wired, test target present, JDK/Xcode/simulator available.

ParametersJSON Schema
NameRequiredDescriptionDefault
dirNoProject directory containing phonebook.config.json.

TDQS

A4/5.0
Behavior3/5

Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?

With no annotations provided, the description carries the full burden of behavioral disclosure. It does communicate that the tool performs checks, names the checks (libraries, test target, JDK/Xcode/simulator), and implies a read-only nature. However, it does not describe failure behavior, exit codes, output format, or whether the tool attempts any fixes, leaving some behavioral ambiguity.

Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.

Conciseness5/5

Is the description appropriately sized, front-loaded, and free of redundancy?

The description is one tight, well-structured sentence. It front-loads the purpose, gives the equivalence to `phonebook doctor`, and lists the main checks without wasted words.

Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.

Completeness4/5

Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?

For a simple single-parameter check tool with no output schema and no annotations, the description covers the essential context: what is checked and why. It could be slightly more complete by stating what a successful or failed check returns, but the current level is adequate for selection and invocation.

Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.

Parameters3/5

Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?

The single parameter `dir` is fully documented in the schema with a clear description and default value, so schema coverage is 100%. The tool description adds no additional parameter semantics, which is acceptable given the schema already handles it.

Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.

Purpose5/5

Does the description clearly state what the tool does and how it differs from similar tools?

The description uses a specific verb ('Check') and resource ('project setup'), names the exact command it supports (`phonebook generate`), and enumerates the concrete checks performed. It clearly distinguishes itself from generation/build tools like `run_generate` and `run_build`.

Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.

Usage Guidelines4/5

Does the description explain when to use this tool, when not to, or what alternatives exist?

The description clearly implies this is a precondition check for `phonebook generate`, and the reference to `phonebook doctor` provides an equivalence that helps the agent understand behavior. It does not explicitly state 'use before run_generate' or list when not to use it, so it falls just short of full explicit routing guidance.

Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.

get_preview_guidanceA

Return the preview naming convention plus a ready-to-paste preview code template for a component, so any agent writes consistent previews.

ParametersJSON Schema
NameRequiredDescriptionDefault
statesNoState names, e.g. ["Enabled", "Disabled"]
platformYesTarget platform
componentNoComponent name, e.g. "Button"

TDQS

A3.5/5.0
Behavior3/5

Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?

No annotations are present, so the description carries the behavioral disclosure burden. It clearly discloses a non-mutating return ('Return') and the output type (naming convention + template), but it does not describe output format, failure behavior, or prerequisites. For a simple getter this is adequate but incomplete.

Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.

Conciseness5/5

Is the description appropriately sized, front-loaded, and free of redundancy?

One sentence with no filler, and the key deliverable is front-loaded before the outcome clause. Every phrase earns its place.

Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.

Completeness3/5

Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?

Only three parameters with 100% schema coverage reduce the burden on the description. However, with no annotations and no output schema, the description could usefully state how platform, states, and component are handled, or when this guidance should be fetched relative to run_generate and run_build. These are gaps but not fatal ones.

Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.

Parameters3/5

Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?

Schema description coverage is 100%, so the baseline for this dimension is 3. The description's 'for a component' aligns with the 'component' parameter but adds no value beyond the schema's documented parameters; nothing is said about how states or platform affect the returned template.

Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.

Purpose4/5

Does the description clearly state what the tool does and how it differs from similar tools?

The description uses a specific verb ('Return') and identifies a concrete resource ('preview naming convention plus a ready-to-paste preview code template'), with the desired outcome 'so any agent writes consistent previews.' It clearly separates itself from execution-oriented siblings like run_generate and run_build, though it does not explicitly name them.

Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.

Usage Guidelines3/5

Does the description explain when to use this tool, when not to, or what alternatives exist?

The phrase 'so any agent writes consistent previews' implies this tool should be consulted before writing a preview, but there is no explicit statement of when to use it versus siblings or when not to use it. It lists no alternatives and no exclusion conditions, leaving agents to infer its place in the workflow.

Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.

run_buildA

Build the static gallery site from a bundle, same as phonebook build <bundle>.

ParametersJSON Schema
NameRequiredDescriptionDefault
bundleYesBundle directory produced by run_generate / `phonebook generate`
outputNoSite output directory (default: the bundle directory itself, reusing its images)

TDQS

A3.5/5.0
Behavior2/5

Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?

No annotations are provided, and the description only states the core action; it does not disclose side effects such as writing into the bundle directory, overwriting output, or requirements. The output default noted in the schema is useful but outside the description, so the description itself carries too little behavioral burden.

Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.

Conciseness5/5

Is the description appropriately sized, front-loaded, and free of redundancy?

The description is a single front-loaded sentence with no filler, and the CLI-equivalent note is a compact way to anchor expected behavior. It is appropriately sized for a simple build command.

Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.

Completeness3/5

Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?

For a two-parameter tool with full schema coverage, the inputs are adequately specified, but the missing usage routing and side-effect disclosure leave the agent to infer workflow and safety. With no annotations or output schema, a bit more context would make it complete.

Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.

Parameters3/5

Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?

Schema description coverage is 100%, with both 'bundle' and 'output' documented, so the baseline applies. The description adds no parameter semantics beyond the schema other than echoing 'bundle'.

Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.

Purpose5/5

Does the description clearly state what the tool does and how it differs from similar tools?

Description opens with an explicit verb ('Build') and resource ('static gallery site'), and identifies the input ('from a bundle'), which clearly separates it from the sibling generation/analysis/check tools. The CLI alias reinforces the exact operation without ambiguity.

Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.

Usage Guidelines3/5

Does the description explain when to use this tool, when not to, or what alternatives exist?

The 'from a bundle' wording and the schema's 'produced by run_generate' hint imply a build-after-generate workflow, but the description does not explicitly say when to use this tool versus siblings like run_generate or analyze_coverage. No when-not or alternative conditions are stated.

Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.

run_generateA

Run the platform engine to render all previews and produce a bundle (manifest + images), same as phonebook generate. When previews crash, keeps what rendered and says which previews did not, by file and line. Pass changed or files to render only the previews declared in those files, for a faster loop while iterating.

ParametersJSON Schema
NameRequiredDescriptionDefault
dirNoProject directory containing phonebook.config.json.
filesNoRender only previews declared in these files, relative to the project directory.
changedNoRender only previews declared in files with uncommitted git changes. Ignored outside a git repository.

TDQS

A3.7/5.0
Behavior3/5

Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?

With no annotations provided, the description must carry the full burden of behavioral disclosure. It does disclose crash handling (keeps what rendered, reports failures by file and line) and the bundle output, which is valuable. However, it omits other behavioral traits like side effects, idempotency, and prerequisites, leaving significant gaps.

Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.

Conciseness5/5

Is the description appropriately sized, front-loaded, and free of redundancy?

The description is three sentences with no filler. It front-loads the core purpose, then adds crash behavior and usage tips. Every sentence earns its place and the structure is clean.

Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.

Completeness3/5

Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?

The tool has no output schema and no annotations, so the description should clarify return values and side effects. It mentions the bundle output but does not specify what the tool returns to the agent. It also does not state prerequisites like the config file beyond the dir parameter, leaving completeness gaps.

Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.

Parameters3/5

Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?

All three parameters are fully described in the schema (100% coverage), so the description adds little beyond what is already structured. It mentions passing files or changed but does not elaborate on their semantics beyond the schema's descriptions.

Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.

Purpose4/5

Does the description clearly state what the tool does and how it differs from similar tools?

The description clearly states the tool runs the platform engine to render previews and produce a bundle, referencing 'phonebook generate' for familiarity. It does not explicitly distinguish from sibling tools like run_build, but the core action is unambiguous and specific.

Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.

Usage Guidelines4/5

Does the description explain when to use this tool, when not to, or what alternatives exist?

It provides clear guidance on using the files and changed parameters to limit rendering to specific files for a faster iteration loop. However, it does not mention when to use this tool over siblings or any exclusions, so it falls short of a 5.

Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.

Tool Schema Changelog

Recent tool additions, removals, and schema changes observed during successful MCP inspections.

  1. 2 tool updatesv0.1.7
    • Changedanalyze_coverage2 fields changed
      • addedInput schema / properties / changed
        Added value: +{
        +  "description": "Report only components in files with uncommitted git changes — what you just edited. Ignored outside a git repository. Combined with paths when both are given.",
        +  "type": "boolean"
        +}
      • addedInput schema / properties / paths
        Added value: +{
        +  "description": "Report only components declared in these files or directories, relative to the project directory. The whole project is still scanned.",
        +  "items": {
        +    "type": "string"
        +  },
        +  "type": "array"
        +}
    • Changedrun_generate2 fields changed
      • addedInput schema / properties / changed
        Added value: +{
        +  "description": "Render only previews declared in files with uncommitted git changes. Ignored outside a git repository.",
        +  "type": "boolean"
        +}
      • addedInput schema / properties / files
        Added value: +{
        +  "description": "Render only previews declared in these files, relative to the project directory.",
        +  "items": {
        +    "type": "string"
        +  },
        +  "type": "array"
        +}
  2. 5 tool updatesv0.1.2
    • First observedanalyze_coverage
    • First observedcheck_setup
    • First observedget_preview_guidance
    • First observedrun_build
    • First observedrun_generate

TDQS

A4/5.0

Scored across 5 tools

Disambiguation5/5

Each tool addresses a distinct step in the preview workflow: guidance, setup, coverage analysis, generation, and building. The only adjacent pair (run_generate and run_build) is clearly separated by bundle output versus static-site output.

Naming Consistency4/5

Most names are imperative snake_case with a clear object (get_preview_guidance, analyze_coverage, check_setup). run_build and run_generate are a minor deviation because they use a run_ prefix around CLI command names rather than a pure verb_noun structure.

Tool Count5/5

Five tools is well-scoped for a focused preview-generation workflow. Each tool earns its place by covering a separate phase from setup to final build, with no redundant or padding tools.

Completeness5/5

The tool set covers the full core loop: check setup, get authoring guidance, analyze coverage gaps, generate previews, and build the gallery site. The absence of a write-preview tool is fine because editing code happens outside the server, and the guidance plus coverage tools support that workflow.

Maintenance

ActivityActive
ResponsivenessNo issues

Related MCP Connectors

Related MCP Servers

  • A
    license
    A
    quality
    A
    maintenance
    Enables AI agents to render and screenshot isolated UI components instantly across multiple browsers without a dev server or Storybook.
    22
    660 npm
    1
    MIT
  • A
    license
    A
    quality
    C
    maintenance
    Turns AI coding hosts into a guided mobile-UI design tool with design interviews, token contracts, linters, and local browser preview.
    8
    7 npm
    MIT
  • A
    license
    A
    quality
    C
    maintenance
    Enables AI assistants to build, drive, and observe Android/KMM apps end-to-end through ADB and Gradle, with tools for UI automation, error capture, and testing.
    33
    31 npm
    MIT
  • F
    license
    Not graded
    quality
    B
    maintenance
    Enables AI coding agents to inspect a project's design tokens and component catalog, audit React/Tailwind files against seven static UI quality rules, score overall UI health, and apply auto-fixes that are re-audited and reverted on regression. It works both locally over filesystem access and remotely on raw TSX/JSX or CSS snippets passed directly as strings.
    -