{"_id":"reactbits-dev-mcp-server","_rev":"4-73cfabf03440ad8426d08c3d865464d9","name":"reactbits-dev-mcp-server","dist-tags":{"latest":"1.1.2"},"versions":{"1.0.0":{"name":"reactbits-dev-mcp-server","version":"1.0.0","keywords":["mcp","reactbits","react","components","ui","modelcontextprotocol"],"author":{"name":"ReactBits MCP"},"license":"MIT","_id":"reactbits-dev-mcp-server@1.0.0","maintainers":[{"name":"theceodev","email":"laminobaba@gmail.com"}],"homepage":"https://github.com/reactbits/mcp-server#readme","bugs":{"url":"https://github.com/reactbits/mcp-server/issues"},"bin":{"reactbits-mcp":"dist/index.js"},"dist":{"shasum":"1f73fced06bcfb2dadd39ee046cb79a823833e72","tarball":"https://registry.npmjs.org/reactbits-dev-mcp-server/-/reactbits-dev-mcp-server-1.0.0.tgz","fileCount":33,"integrity":"sha512-uhGMahJjHiFlHmEFXnIuz7/2/TjLndKDDnd1ZwzkpolDE9IGqB+fVx9OINWeuVm2ia9cyYdMOhrMqRhS3dKgtg==","signatures":[{"sig":"MEUCICOnBLoPe2Rpb/YbQhFSWekz8NcnL5hxqgyyw1SVLB6SAiEAk/+jN/q1aK8fbG1t2CjcuyfkCJD0T1Cn9e3gmwRoASk=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":254843},"main":"dist/index.js","type":"module","types":"dist/index.d.ts","engines":{"node":">=18.0.0"},"scripts":{"dev":"tsx watch src/index.ts","test":"node test-list-components.js","build":"tsc","clean":"rm -rf dist","start":"node dist/index.js","prepare":"npm run build","discover":"tsx scripts/discover-components.ts","prepublishOnly":"npm run clean && npm run build && npm run test","update-registry":"tsx scripts/discover-components.ts && tsx scripts/update-service.ts"},"_npmUser":{"name":"theceodev","email":"laminobaba@gmail.com"},"repository":{"url":"git+https://github.com/reactbits/mcp-server.git","type":"git"},"_npmVersion":"10.8.2","description":"MCP server providing access to 135+ animated React components from ReactBits.dev","directories":{},"_nodeVersion":"20.19.2","dependencies":{"tsx":"^4.20.3","axios":"^1.11.0","cheerio":"^1.1.2","typescript":"^5.8.3","@types/node":"^24.1.0","node-html-parser":"^7.0.1","@modelcontextprotocol/sdk":"^1.17.0"},"_hasShrinkwrap":false,"_npmOperationalInternal":{"tmp":"tmp/reactbits-dev-mcp-server_1.0.0_1753620826846_0.24466594955981802","host":"s3://npm-registry-packages-npm-production"}},"1.1.0":{"name":"reactbits-dev-mcp-server","version":"1.1.0","keywords":["mcp","reactbits","react","components","ui","modelcontextprotocol"],"author":{"name":"ReactBits MCP"},"license":"MIT","_id":"reactbits-dev-mcp-server@1.1.0","maintainers":[{"name":"theceodev","email":"laminobaba@gmail.com"}],"homepage":"https://github.com/reactbits/mcp-server#readme","bugs":{"url":"https://github.com/reactbits/mcp-server/issues"},"bin":{"reactbits-dev-mcp":"dist/index.js"},"dist":{"shasum":"d0ed9e776715a4c4b5492ddb15f3811e01726f4e","tarball":"https://registry.npmjs.org/reactbits-dev-mcp-server/-/reactbits-dev-mcp-server-1.1.0.tgz","fileCount":34,"integrity":"sha512-4cX6RsitSxsNFanHZsd/gXt6fgLTsFw64ced1uYfzJe+LWKQcOCf3+M048cwZfI8Sz4tgYcPx86DQXMnYfX/xg==","signatures":[{"sig":"MEUCIQCNv1+BsrcJF7NP9zjxJ5Bc9PTJ3ZQiwzuSxJgG2a6KTQIgUJnEyEGYllbYLrZ57VvIvYBmcavZFSiiOvINhU78g98=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":264455},"main":"dist/index.js","type":"module","types":"dist/index.d.ts","engines":{"node":">=18.0.0"},"scripts":{"dev":"tsx watch src/index.ts","test":"node test-list-components.js","build":"tsc","clean":"rm -rf dist","start":"node dist/index.js","prepare":"npm run build","discover":"tsx scripts/discover-components.ts","prepublishOnly":"npm run clean && npm run build && npm run test","update-registry":"tsx scripts/discover-components.ts && tsx scripts/update-service.ts"},"_npmUser":{"name":"theceodev","email":"laminobaba@gmail.com"},"repository":{"url":"git+https://github.com/reactbits/mcp-server.git","type":"git"},"_npmVersion":"10.8.2","description":"MCP server providing access to 135+ animated React components from ReactBits.dev","directories":{},"_nodeVersion":"20.19.2","dependencies":{"tsx":"^4.20.3","axios":"^1.11.0","cheerio":"^1.1.2","typescript":"^5.8.3","@types/node":"^24.1.0","node-html-parser":"^7.0.1","@modelcontextprotocol/sdk":"^1.17.0"},"_hasShrinkwrap":false,"_npmOperationalInternal":{"tmp":"tmp/reactbits-dev-mcp-server_1.1.0_1753624462484_0.5598690671228059","host":"s3://npm-registry-packages-npm-production"}},"1.1.1":{"name":"reactbits-dev-mcp-server","version":"1.1.1","keywords":["mcp","reactbits","react","components","ui","modelcontextprotocol"],"author":{"name":"ReactBits MCP"},"license":"MIT","_id":"reactbits-dev-mcp-server@1.1.1","maintainers":[{"name":"theceodev","email":"laminobaba@gmail.com"}],"homepage":"https://github.com/reactbits/mcp-server#readme","bugs":{"url":"https://github.com/reactbits/mcp-server/issues"},"bin":{"reactbits-dev-mcp":"dist/index.js"},"dist":{"shasum":"53fd5ac9985f141ec14a34ea9086f0ca1f2b3735","tarball":"https://registry.npmjs.org/reactbits-dev-mcp-server/-/reactbits-dev-mcp-server-1.1.1.tgz","fileCount":35,"integrity":"sha512-vDSC29TeN/80bMYQekBXKRnD+6hkn/JkTtqiapUMtaz8AZR6hbWPN1jFyRYBGX+YTFAlTTxUAJoMPqhE0hDVoA==","signatures":[{"sig":"MEQCIAPxh+atCaTCg3MJVLDP5f0bEbaBdqbp6Hfz/Cn0U11+AiA+aA9chOD54NYSWw0LvUdaWQvJ1OXqhzNqmBfSK4WBIw==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":272287},"main":"dist/index.js","type":"module","types":"dist/index.d.ts","engines":{"node":">=18.0.0"},"scripts":{"dev":"tsx watch src/index.ts","test":"node test-list-components.js","build":"tsc","clean":"rm -rf dist","start":"node dist/index.js","prepare":"npm run build","discover":"tsx scripts/discover-components.ts","prepublishOnly":"npm run clean && npm run build && npm run test","update-registry":"tsx scripts/discover-components.ts && tsx scripts/update-service.ts"},"_npmUser":{"name":"theceodev","email":"laminobaba@gmail.com"},"repository":{"url":"git+https://github.com/reactbits/mcp-server.git","type":"git"},"_npmVersion":"10.8.2","description":"MCP server providing access to 135+ animated React components from ReactBits.dev","directories":{},"_nodeVersion":"20.19.2","dependencies":{"tsx":"^4.20.3","axios":"^1.11.0","cheerio":"^1.1.2","typescript":"^5.8.3","@types/node":"^24.1.0","node-html-parser":"^7.0.1","@modelcontextprotocol/sdk":"^1.17.0"},"_hasShrinkwrap":false,"_npmOperationalInternal":{"tmp":"tmp/reactbits-dev-mcp-server_1.1.1_1753625771473_0.34164073853543875","host":"s3://npm-registry-packages-npm-production"}},"1.1.2":{"name":"reactbits-dev-mcp-server","version":"1.1.2","description":"MCP server providing access to 135+ animated React components from ReactBits.dev","type":"module","main":"dist/index.js","types":"dist/index.d.ts","bin":{"reactbits-dev-mcp":"dist/index.js"},"engines":{"node":">=18.0.0"},"scripts":{"build":"tsc","dev":"tsx watch src/index.ts","start":"node dist/index.js","clean":"rm -rf dist","prepare":"npm run build","test":"npm run build && node test-essential.js","prepublishOnly":"npm run clean && npm run build"},"keywords":["mcp","reactbits","react","components","ui","modelcontextprotocol"],"author":{"name":"ReactBits MCP"},"license":"MIT","repository":{"type":"git","url":"git+https://github.com/ceorkm/reactbits-mcp-server.git"},"bugs":{"url":"https://github.com/ceorkm/reactbits-mcp-server/issues"},"homepage":"https://github.com/ceorkm/reactbits-mcp-server#readme","dependencies":{"@modelcontextprotocol/sdk":"^1.17.0","@types/node":"^24.1.0","axios":"^1.11.0","cheerio":"^1.1.2","node-html-parser":"^7.0.1","tsx":"^4.20.3","typescript":"^5.8.3"},"_id":"reactbits-dev-mcp-server@1.1.2","gitHead":"13f74f62c987d9cc795abe7e0043152e553db02b","_nodeVersion":"20.19.2","_npmVersion":"10.8.2","dist":{"integrity":"sha512-OKyzde7WN2Ppm9qnbomw+1zUhufSPb+xxdcb9+M4lcw9YNXotfRk5efb71CIkXh0B7Q4P3Dwu+1+p3bE6uBqCw==","shasum":"08952c0e1afcac65299048f5adf13b72c39fb93a","tarball":"https://registry.npmjs.org/reactbits-dev-mcp-server/-/reactbits-dev-mcp-server-1.1.2.tgz","fileCount":35,"unpackedSize":272435,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEQCIBdUaP0UJOtfxY+6lecblkSI4lAZcsIipIQIbjCh31yCAiBR27VGzZIZidz8GdGDCepw/mI2uhVoCBG77JCq/sHJqg=="}]},"_npmUser":{"name":"theceodev","email":"laminobaba@gmail.com"},"directories":{},"maintainers":[{"name":"theceodev","email":"laminobaba@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/reactbits-dev-mcp-server_1.1.2_1753627047022_0.8202989917016219"},"_hasShrinkwrap":false}},"time":{"created":"2025-07-27T12:53:46.736Z","modified":"2025-07-27T14:37:27.452Z","1.0.0":"2025-07-27T12:53:47.061Z","1.1.0":"2025-07-27T13:54:22.675Z","1.1.1":"2025-07-27T14:16:11.665Z","1.1.2":"2025-07-27T14:37:27.241Z"},"bugs":{"url":"https://github.com/ceorkm/reactbits-mcp-server/issues"},"author":{"name":"ReactBits MCP"},"license":"MIT","homepage":"https://github.com/ceorkm/reactbits-mcp-server#readme","keywords":["mcp","reactbits","react","components","ui","modelcontextprotocol"],"repository":{"type":"git","url":"git+https://github.com/ceorkm/reactbits-mcp-server.git"},"description":"MCP server providing access to 135+ animated React components from ReactBits.dev","maintainers":[{"name":"theceodev","email":"laminobaba@gmail.com"}],"readme":"# ReactBits MCP Server\n\nA Model Context Protocol (MCP) server that provides AI assistants with access to [ReactBits.dev](https://reactbits.dev) components - a collection of 135+ animated React components for creative developers.\n\n> ⚠️ **Important Note**: Some ReactBits components (buttons, forms, loaders) currently have incomplete implementations. See [Component Quality Status](#component-quality-status) below.\n\n## Features\n\n- 🎨 **Component Discovery**: Browse and search through all ReactBits components\n- 🔍 **Smart Search**: Find components by name, category, or description\n- 💅 **Style Options**: Access both CSS and Tailwind versions of components\n- 📁 **Category Navigation**: Filter components by categories (animations, backgrounds, buttons, etc.)\n- 🚀 **Fast Performance**: Built-in caching for optimal response times\n- 📝 **Demo Generation**: Get usage examples and demo code for any component\n\n## Installation\n\n```bash\n# Install globally\nnpm install -g reactbits-dev-mcp-server\n\n# Or run directly with npx (no installation required)\nnpx reactbits-dev-mcp-server\n\n# Or install as a dependency\nnpm install reactbits-dev-mcp-server\n```\n\n### From Source\n\n```bash\n# Clone the repository\ngit clone https://github.com/yourusername/reactbits-mcp-server\ncd reactbits-mcp-server\n\n# Install dependencies\nnpm install\n\n# Build the project\nnpm run build\n\n# Run the server\nnpm start\n```\n\n## Configuration\n\n### Claude Desktop\n\nAdd to your Claude Desktop configuration:\n\n**macOS**: `~/Library/Application Support/Claude/claude_desktop_config.json`\n**Windows**: `%APPDATA%\\Claude\\claude_desktop_config.json`\n**Linux**: `~/.config/Claude/claude_desktop_config.json`\n\n```json\n{\n  \"mcpServers\": {\n    \"reactbits\": {\n      \"command\": \"npx\",\n      \"args\": [\"reactbits-dev-mcp-server\"],\n      \"env\": {\n        \"GITHUB_TOKEN\": \"your_github_token_here\"\n      }\n    }\n  }\n}\n```\n\n### VS Code (with Continue extension)\n\nAdd to your VS Code settings:\n\n```json\n{\n  \"continue.server\": {\n    \"mcpServers\": {\n      \"reactbits\": {\n        \"command\": \"npx\",\n        \"args\": [\"reactbits-dev-mcp-server\"]\n      }\n    }\n  }\n}\n```\n\n### Cursor\n\nAdd to your Cursor settings or `.cursorrules`:\n\n```json\n{\n  \"mcpServers\": {\n    \"reactbits\": {\n      \"command\": \"npx\",\n      \"args\": [\"reactbits-dev-mcp-server\"],\n      \"env\": {\n        \"GITHUB_TOKEN\": \"your_github_token_here\"\n      }\n    }\n  }\n}\n```\n\n## Quick Start\n\n```bash\n# Clone and install\ngit clone https://github.com/yourusername/reactbits-mcp-server\ncd reactbits-mcp-server\nnpm install\n\n# Build\nnpm run build\n\n# Test locally\nnode test-list-components.js\n```\n\n## Available Tools\n\n### `list_components`\nList all available ReactBits components with optional filtering.\n\n**Parameters:**\n- `category` (optional): Filter by category (e.g., \"animations\", \"backgrounds\", \"buttons\")\n- `style` (optional): Filter by styling method (\"css\", \"tailwind\", \"default\")\n- `limit` (optional): Maximum number of components to return\n\n**Example:**\n```\n\"List all animation components with Tailwind support\"\n```\n\n### `get_component`\nGet the source code for a specific ReactBits component.\n\n**Parameters:**\n- `name` (required): Name of the component (e.g., \"splash-cursor\", \"pixel-card\")\n- `style` (optional): Preferred styling method (\"css\", \"tailwind\", \"default\")\n\n**Example:**\n```\n\"Show me the source code for the splash cursor component\"\n```\n\n### `search_components`\nSearch for ReactBits components by name or description.\n\n**Parameters:**\n- `query` (required): Search query\n- `category` (optional): Filter by category\n- `limit` (optional): Maximum number of results\n\n**Example:**\n```\n\"Find all components related to cards\"\n```\n\n### `get_component_demo`\nGet usage example and demo code for a ReactBits component.\n\n**Parameters:**\n- `name` (required): Name of the component\n\n**Example:**\n```\n\"Show me how to use the glow button component\"\n```\n\n### `list_categories`\nList all available component categories.\n\n**Example:**\n```\n\"What categories of components are available?\"\n```\n\n## Usage Examples\n\n### With AI Assistants\n\nOnce configured, you can ask your AI assistant questions like:\n\n- \"Show me all the background animation components from ReactBits\"\n- \"I need a glowing button component - what's available?\"\n- \"How do I implement the particle background effect?\"\n- \"Find all text animation components that support Tailwind\"\n- \"Show me the code for the glass morphism card component\"\n\n### Component Categories\n\nReactBits components are organized into the following categories:\n\n- **Animations**: Dynamic cursor effects and interactive animations\n- **Backgrounds**: Animated and static background patterns\n- **Buttons**: Interactive button components with various effects\n- **Cards**: Card components with hover effects and animations\n- **Text Animations**: Animated text effects and reveals\n- **Components**: General UI components and layouts\n- **Navigation**: Navigation menus and interfaces\n\n## Development\n\n### Project Structure\n\n```\nreactbits-mcp-server/\n├── src/\n│   ├── index.ts           # Main server entry point\n│   ├── services/\n│   │   └── ReactBitsService.ts   # Component fetching logic\n│   ├── types/\n│   │   └── index.ts       # TypeScript type definitions\n│   └── utils/\n│       └── CacheManager.ts # Caching utility\n├── dist/                  # Compiled output\n├── package.json\n├── tsconfig.json\n└── README.md\n```\n\n### Building\n\n```bash\n# Install dependencies\nnpm install\n\n# Build the project\nnpm run build\n\n# Run in development mode\nnpm run dev\n```\n\n### Testing\n\n```bash\n# Run the MCP inspector for debugging\nnpx @modelcontextprotocol/inspector\n```\n\n## GitHub API Token (Optional but Recommended)\n\nThe server can work without a GitHub token but will be limited to 60 requests per hour. With a token, you get up to 5,000 requests per hour.\n\n### Setting up a GitHub Token\n\n1. Create a GitHub personal access token at https://github.com/settings/tokens\n   - Click \"Generate new token (classic)\"\n   - No special scopes needed (public repository access only)\n   - Copy the generated token\n\n2. Set it as an environment variable:\n\n```bash\n# Option 1: Export in your shell\nexport GITHUB_TOKEN=your_token_here\n\n# Option 2: Create a .env file (copy from .env.example)\ncp .env.example .env\n# Edit .env and add your token\n\n# Option 3: Pass when running the server\nGITHUB_TOKEN=your_token_here npx reactbits-dev-mcp-server\n```\n\n**⚠️ Security Note**: Never commit your GitHub token to version control. Always use environment variables.\n\n## Component Quality Status\n\nBased on comprehensive testing, here's the current quality status of ReactBits components:\n\n### ✅ Excellent Quality (9.0-10/10)\n- **Backgrounds** (9.8/10): Aurora, Beams, Particles, etc. - Production-ready WebGL effects\n- **Animations** (9.5/10): BlobCursor, SplashCursor, Magnet, etc. - Professional animations\n- **Text Animations** (9.0/10): BlurText, CountUp, CircularText, etc. - Complete Framer Motion\n\n### ⚠️ Incomplete Components (2.0/10)\n- **Buttons**: All 8 button components return placeholder code\n- **Forms**: All 3 form components are incomplete  \n- **Loaders**: All 9 loader components are incomplete\n\n### 📦 Dependencies\n\nThe MCP server now includes dependency information for each component:\n- `framer-motion`: Text animations and interactive components\n- `gsap`: Cursor animations and advanced interactions\n- `three.js` / `@react-three/fiber`: 3D backgrounds and effects\n- `ogl`: WebGL rendering (Aurora component)\n\n## Contributing\n\nContributions are welcome! Please feel free to submit a Pull Request. For major changes, please open an issue first to discuss what you would like to change.\n\n1. Fork the repository\n2. Create your feature branch (`git checkout -b feature/amazing-feature`)\n3. Commit your changes (`git commit -m 'Add amazing feature'`)\n4. Push to the branch (`git push origin feature/amazing-feature`)\n5. Open a Pull Request\n\n## License\n\nThis project is licensed under the MIT License - see the LICENSE file for details.\n\n## Acknowledgments\n\n- [ReactBits.dev](https://reactbits.dev) for the amazing component collection\n- [Anthropic](https://anthropic.com) for the Model Context Protocol specification\n- The MCP community for inspiration and examples\n\n## Support\n\n- 🐛 [Report Issues](https://github.com/yourusername/reactbits-mcp-server/issues)\n- 💬 [Discussions](https://github.com/yourusername/reactbits-mcp-server/discussions)\n- 📧 Contact: your-email@example.com","readmeFilename":"README.md"}