Skip to main content
Glama
captainy7

uikit-registry

by captainy7
OverviewSchemaRelated ServersScoreDiscussions
TypeScript
Local

uikit-registry 🎨

Registry 13 UI library + MCP server untuk AI.
Cari, bandingin, dan dapetin detail komponen UI dari 13 library populer — langsung dari AI agent (OpenCode, Claude, dll).

npm run mcp-server   →   search_component + get_component + compare_components

✨ Fitur

Fitur

Tools MCP

🔍 Cari komponen di semua library

search_component(query)

📦 Ambil detail komponen + source code + props

get_component(library, component)

⚖️ Bandingin komponen antar library

compare_components(component, libraries?)

13 library UI

shadcn, MUI, Chakra, Antd, Mantine, NextUI, Radix, DaisyUI, PrimeReact, Neobrutalism, Aceternity, Magic UI, Origin UI

Props real dari TypeScript .d.ts

MUI ✅, shadcn ✅

0 runtime dependencies

Node.js aja

Related MCP server: MCP Server Starter Template

🚀 Quick Start

1. Clone & Setup

git clone https://github.com/captainy7/uikit-registry.git
cd uikit-registry
npm install
npm run build

2. Jalankan MCP Server

npm run mcp-server

Output:

🔌 uikit-registry MCP server v2 (data: ./data)
   Tools: search_component, get_component, compare_components
   Libraries: 13

3. Daftarin di OpenCode / Claude

Edit ~/.config/opencode/opencode.json:

{
  "mcpServers": {
    "uikit-registry": {
      "command": "node",
      "args": ["/home/satria/Development/uikit-registry/dist/mcp-server.js"],
      "env": {
        "UIKIT_DATA_DIR": "/home/satria/Development/uikit-registry/data"
      }
    }
  }
}

Restart OpenCode, langsung bisa pake tools uikit-registry.

📦 Data

Library

Komponen

Props

Version

shadcn/ui

358

✅ source code + CVA props

—

MUI

131

✅ 14+ props dari .d.ts

v9.1.2

Chakra UI

115

—

v3.36.0

Ant Design

80

—

v6.4.5

Mantine

114

—

v9.4.0

NextUI / Heroui

85

—

v3.2.1

Radix UI

59

—

—

DaisyUI

46

—

v5.5.23

PrimeReact

124

—

—

Aceternity UI

88

—

—

Magic UI

47

—

—

Origin UI

76

—

—

Neobrutalism

16

—

—

Total

1339

—

—

🛠️ Usage Examples (via AI Agent)

Cari komponen:

search_component("button")
→ 11 library punya button

Lihat detail:

get_component("shadcn", "button")
→ import, 4 props (variant, size, className, asChild), source code

Bandingkan:

compare_components("dialog", "shadcn,mui")
→ shadcn: 0 props
→ mui: 20 props (transition, paper, container, backdrop, ...)

📋 Scraping Manual

# Scrape semua library
npm run scrape

# Scrape satu library aja
tsx src/scraper.ts --lib shadcn

# Output: data/{library}/{component}.json
# Index: data/index.json

Scraping otomatis tiap minggu via GitHub Actions (.github/workflows/scrape.yml).

🧪 Tests

npm test
# 125 tests, 0 fail
npm run typecheck
# TypeScript strict, 0 errors

🏗️ Arsitektur

src/
├── scrapers/       # 13 scraper, masing-masing file sendiri
├── mcp/            # MCP server + tools
├── data/           # Data access layer (ComponentStore)
└── shared/         # Types, constants, utils

  • TypeScript strict — semua tipe aman

  • Zero runtime deps — cuma node.js

  • 100% local — gak perlu GitHub API / internet

  • Parallel scraper — 13 library selesai ~1 menit

📄 License

MIT

Available Tools

3 tools
compare_componentsA

Bandingkan komponen yang sama dari dua atau lebih library. Melihat perbedaan props, import path, dan source code.

ParametersJSON Schema
NameRequiredDescriptionDefault
componentYesNama komponen (contoh: button, dialog, card)
librariesNoDaftar library pisah dengan koma (contoh: "shadcn,mui" atau "shadcn,mui,chakra"). Kosongkan untuk membandingkan semua library yang punya komponen ini.

TDQS

A3.8/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 explains what the tool returns (differences in props, import path, source code), but it does not disclose whether the operation is read-only, any side effects, authorization requirements, or performance implications. The description gives moderate transparency but lacks depth.

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 sentence that is concise and to the point. It uses active voice and front-loads the core action. There is no redundant information, and every word contributes to the meaning.

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?

Given no output schema, the description explains the return value adequately by listing what differences are shown (props, import path, source code). It covers the essential information for a comparison tool. However, it could be slightly more comprehensive by including an example or note about the optional libraries parameter.

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 parameters having descriptions in the schema. The description adds no new meaning beyond the schema; it uses the same terms. The baseline score of 3 is appropriate since the schema already adequately documents the parameters.

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 clearly states the tool's purpose: comparing the same component across two or more libraries. It specifies the aspects compared (props, import path, source code), distinguishing it from sibling tools like get_component (which presumably fetches a single component) and search_component (which searches for components). The verb 'compare' and resource 'components' are specific and unambiguous.

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 description implies the tool should be used when one needs to compare a component across different libraries, but it does not explicitly state when to use it vs. alternatives. No exclusions or prerequisites are mentioned. With sibling tools like get_component and search_component, the usage context is somewhat clear but not articulated.

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

get_componentA

Ambil detail komponen dari library tertentu. Dapat source code (shadcn) atau props + contoh (MUI, Chakra, dll).

ParametersJSON Schema
NameRequiredDescriptionDefault
libraryYesLibrary UI: mui, chakra, shadcn, antd, mantine, nextui, radix, daisyui, primereact, neobrutalism, aceternity, magic-ui, origin-ui
componentYesNama komponen (contoh: button, dialog, pagination)

TDQS

A4/5.0
Behavior3/5

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

No annotations are provided, so the description carries full burden. It hints at differencing output based on library (source code vs props+examples), but does not disclose response format, side effects, prerequisites, or error handling. Adequate but not detailed.

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?

Two concise sentences with no wasted words. The key information is front-loaded and efficient.

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?

No output schema exists, so the description should explain return values. It partially does by distinguishing output types per library, but lacks details on structure, errors, or edge cases. For a simple 2-parameter tool, it is fairly complete.

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% with clear parameter descriptions. The description adds value by explaining that for shadcn it returns source code, while for other libraries it returns props+examples, which enriches the semantic understanding beyond the schema.

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 clearly states the verb 'Ambil' (get) and resource 'detail komponen' from a specific library. It distinguishes the type of details by library (source code for shadcn, props+examples for others), which helps differentiate from sibling tools like compare_components and search_component.

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 description implies usage for getting component details from a specific library, but does not explicitly state when to use this tool versus the siblings. No exclusions or alternative guidance is provided.

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

search_componentA

Cari komponen UI di semua library. Return daftar library yg punya komponen itu.

ParametersJSON Schema
NameRequiredDescriptionDefault
queryYesNama komponen yg dicari (contoh: button, dialog, pagination, card, modal, table, form, input, select, navbar, sidebar, dll)
libraryNoFilter hasil hanya dari library tertentu (contoh: shadcn, mui)

TDQS

A4.2/5.0
Behavior3/5

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

No annotations are provided, so the description carries the full burden. It states the return is a list of libraries, but doesn't specify search behavior like case sensitivity, partial matching, or result limits. Adequate but not detailed.

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 extremely concise: two sentences clearly stating purpose and return value. No unnecessary information.

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 search tool with 2 parameters and no output schema, the description is largely complete. It explains what it does and what it returns, though it lacks notes on empty results or errors.

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% with good descriptions for both parameters (query with examples, library filter). The tool description adds that the result is a list of libraries, complementing the schema well.

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 ('Cari' meaning search) and resource ('komponen UI'), and clearly distinguishes from siblings (compare_components, get_component) by stating it searches across all libraries and returns a list of libraries.

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 states when to use this tool (to find which libraries have a UI component), but lacks explicit exclusions or alternatives. However, the sibling tools provide context for differentiation.

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. Dates show when Glama detected each change.

  1. 3 tool updatesv2.0.0
    • First observedcompare_components
    • First observedget_component
    • First observedsearch_component
Install Server
RayrunBuild, deploy, and operate MCP servers without becoming an infrastructure team.ray.runAd

TDQS

A4.2/5.0
Disambiguation5/5

Each tool has a distinct purpose: search finds components across libraries, get retrieves details from a specific library, compare contrasts same component across libraries. No overlap.

Naming Consistency5/5

All tool names follow a consistent verb_noun pattern (compare_components, get_component, search_component) with snake_case.

Tool Count5/5

Three tools is appropriate for a focused UI component registry, covering search, retrieval, and comparison without unnecessary bloat.

Completeness4/5

Covers core operations well, but a tool to list all libraries or components directly might be missing; however, search can approximate this.

Resources

Unclaimed servers have limited discoverability.

Looking for Admin?

If you are the server author, to access and configure the admin panel.

Related MCP Connectors

Related MCP Servers

Latest Blog Posts

MCP directory API

We provide all the information about MCP servers via our MCP API.

curl -X GET 'https://glama.ai/api/mcp/v1/servers/captainy7/uikit-registry'

If you have feedback or need assistance with the MCP directory API, please join our Discord server