park-ui-mcp-server

yeshsurya/park-ui-mcp-server

3.1

If you are the rightful owner of park-ui-mcp-server and would like to certify it and/or have it hosted online, please leave a comment on the right or send an email to dayong@mcphub.com.

The Park UI MCP Server is a Model Context Protocol server designed to provide AI assistants with access to Park UI components, APIs, examples, and documentation across React, Vue, and Solid frameworks.

Tools
6
Resources
0
Prompts
0

Park UI MCP Server

A Model Context Protocol (MCP) server for Park UI component library, providing AI assistants with access to Park UI components, APIs, examples, and documentation across React, Vue, and Solid frameworks.

Features

  • Component Information: Get detailed docs for all 50+ Park UI components
  • Multi-framework Support: React, Vue, and Solid examples and setup
  • Installation Guides: Step-by-step installation instructions
  • Code Examples: Real-world patterns and use cases
  • Documentation Search: Find relevant docs and examples
  • Theme Customization: Theming and styling guides

Installation

npm install -g park-ui-mcp-server

Or run directly:

npx park-ui-mcp-server

Usage

Basic Usage

park-ui-mcp-server

With GitHub API Token

park-ui-mcp-server --github-api-key YOUR_TOKEN
# or
park-ui-mcp-server -g YOUR_TOKEN

Environment Variables

export GITHUB_PERSONAL_ACCESS_TOKEN=your_token_here
export LOG_LEVEL=debug
park-ui-mcp-server

Available Tools

Component Tools

  • get_parkui_component - Get component info and examples
  • list_parkui_components - List all available components
  • get_parkui_installation - Installation instructions

Example Tools

  • get_parkui_example - Get specific example patterns
  • search_parkui_examples - Search examples and snippets

Documentation Tools

  • get_parkui_docs - Get documentation for topics

Available Prompts

  • component_usage - Usage examples for components
  • installation_guide - Installation help
  • theming_tutorial - Theming and customization
  • migration_guide - Migration from other libraries
  • performance_optimization - Performance tips

Available Resources

  • get_parkui_components - Component list
  • parkui_getting_started - Getting started guide
  • parkui_theming_guide - Theming documentation

Example Queries

// Get button component info
{
  "tool": "get_parkui_component",
  "params": { 
    "componentName": "button",
    "framework": "react"
  }
}

// Search for form examples
{
  "tool": "search_parkui_examples", 
  "params": {
    "query": "form validation",
    "framework": "vue"
  }
}

// Get installation guide
{
  "tool": "get_parkui_installation",
  "params": {
    "componentName": "input",
    "framework": "solid"
  }
}

Framework Support

React

  • React 18+
  • Next.js 13+
  • Vite, CRA

Vue

  • Vue 3+
  • Nuxt 3+
  • Composition API

Solid

  • SolidJS 1.6+
  • SolidStart
  • Full reactivity

Configuration

The server can be configured via command line arguments or environment variables:

  • --github-api-key, -g: GitHub API token for enhanced rate limits
  • --help, -h: Show help information
  • --version, -v: Show version

Development

# Clone and install
git clone https://github.com/park-ui/park-ui-mcp-server
cd park-ui-mcp-server
npm install

# Build
npm run build

# Run in development  
npm run dev

# Test
npm test

Architecture

The server follows MCP best practices:

  • Tools: Interactive functionality for AI assistants
  • Resources: Static content (guides, component lists)
  • Prompts: Structured templates for common tasks
  • Caching: Intelligent caching for performance
  • Error Handling: Robust error handling and validation
  • Logging: Comprehensive logging with levels

Contributing

  1. Fork the repository
  2. Create a feature branch
  3. Make your changes
  4. Add tests
  5. Submit a pull request

License

MIT - see file

Links

Support