MoonUI

MCP Server Integration

Enable AI assistants to perfectly understand and use MoonUI components with intelligent suggestions

AI-NATIVE

Perfect AI Integration

Claude, ChatGPT, and all MCP-enabled AI assistants

200+ Components

Complete component library coverage

Complete Metadata

Props, examples, best practices

Lightning Fast

Instant component suggestions

PRO FEATURES

Pro License Benefits

Automatic Pro component prioritization

Pro Component Priority

AI suggests Pro components first

Pro Component Priority

AI suggests best components first

Smart Pro Prioritization

Upgrade mapping & conversion

What is MCP Server?

Model Context Protocol (MCP) is an open protocol that enables AI assistants to securely communicate with external tools and data sources. MoonUI MCP Server provides complete component intelligence with automatic Pro component prioritization.

200+ Components

Complete coverage of all MoonUI components with rich metadata

Smart AI Tools

Component suggestion, import fixing, code generation, validation

Pro Prioritization

Automatically suggests Pro components for better user experience

Installation

Step 1: Open Claude Desktop Config File

Config File Location
# macOS~/Library/Application Support/Claude/claude_desktop_config.json# Windows%APPDATA%\Claude\claude_desktop_config.json# Linux~/.config/Claude/claude_desktop_config.json

Step 2: Add MCP Server Configuration

claude_desktop_config.json
{
  "mcpServers": {
    "moonui": {
      "command": "npx",
      "args": ["-y", "@moontra/moonui-mcp-server@latest"]
    }
  }
}

Step 3: Restart Claude Desktop

Complete Setup

Fully restart Claude Desktop application for changes to take effect. The MCP server will automatically start when you open Claude.

What's New in v6.0.1

latest

DocsConfig-Driven Registry — Complete Component Data

v6 is a major upgrade: the registry now mirrors MoonUI's authoritative DocsConfig source, so every component ships with full prop tables, code examples, accessibility specs and best practices — no more hardcoded fallbacks or empty fields.

Registry schema v3.0 — full DocsConfig data

installation.manualSetup, usage.basic/pro.code, fullExamples.free/pro, api.components[].props, accessibility, bestPractices, proFeatures, seo

4 new granular tools

get_props, get_examples, get_accessibility, get_installation — return slices instead of the whole entry, keeping LLM context bloat down

Hybrid registry loader (opt-in)

Set MOONUI_REMOTE_REGISTRY=true to pull fresh data from moonui.dev/api/mcp/registry. 3s timeout, 1h tmp cache, embedded fallback — always offline-safe

Sub-component linking + dataQuality field

data-table-bulk-actions.parentComponent === "data-table"; every response carries dataQuality (complete / partial / ast-only) so LLMs know how trustworthy the entry is

Coverage at GA — 155 / 179 components (86.6%) with full props

Examples on 125, accessibility on 124. Components without a DocsConfig fall back to AST data and are flagged dataQuality: "ast-only"

v6.0.1 fix — suggest_component static-registry fallback

Dynamic scan returned empty for end users without the component packages installed; now falls back to the embedded registry so suggestions always work

MCP Server Features

suggest_component

Find the best component using natural language

# Ask AI:"I need a data table with sorting"# MCP suggests:→ DataTable (Pro)→ Table (Free alternative)→ Usage examples→ Import statements

fix_imports

Automatically fix missing or incorrect imports

# Broken code:<Button>Click</Button> // Not imported# MCP fixes:import { Button } from '@moontra/moonui';<Button>Click</Button>

generate_code

Generate custom component code for your needs

# Request:"Generate a login form"# MCP generates:✓ Input validation✓ Error handling✓ TypeScript types✓ Best practices

validate_usage

Validate component usage and suggest improvements

# Validates:✓ Prop types✓ Required props✓ Deprecated APIs✓ Performance✓ Accessibility

theming_helper

Get theming guidance and customization examples

# Theming assistance:✓ Dark mode setup✓ CSS variables✓ Custom colors✓ Theme switchers✓ Best practices

Pro License Benefits

  • Automatic Pro Component Suggestions

    With Pro license, AI always suggests Pro components first

  • Premium Pro Components

    DataTable, Charts, RichTextEditor and more

  • Priority Support

    Get early access to MCP Server updates

Resources

NPM Package

Browse @moontra/moonui-mcp-server package

MCP Protocol

Learn more about Model Context Protocol

Example Projects

Example projects using MCP Server