# shadcn/ui Dependency Resolver MCP for AI Agents MCP

> shadcn/ui Dependency Resolver finds missing React components in your code snippets. It scans JSX to tell you exactly which shadcn packages you need to install so your UI doesn't break when your agent writes code.

## Overview
- **Category:** development
- **Price:** Free
- **Endpoint:** https://edge.vinkius.com/vk_preview_U9irMWgXv28cwSXxmqiAgD6Vnm7Obd7lVDbcbdVU/mcp
- **Tags:** shadcn, ui, react, jsx, dependencies

## Description

Writing frontend code with an AI agent is great until the agent hands you a beautiful piece of JSX that won't actually run. You see a component in your editor, but your project is missing the underlying package and its associated sub-components. This MCP fixes that gap. It looks at any snippet you provide and identifies every required UI element needed to make it work. Instead of manually checking your configuration or hunting through documentation, you just let the tool do the heavy lifting. You can find all these tools in the Vinkius catalog. It's about making sure what your agent writes actually works in your local environment without a dozen errors.

## Tools

### extract_dependencies
Scans your code to find every shadcn/ui package and sub-component you need. It tells you exactly what is missing from your current setup.

### list_all_registry_components
Provides a full list of all shadcn/ui components that can be resolved. Use this to see the scope of supported UI elements.

### validate_component_registry_entry
Checks if a specific string is a valid part of the shadcn/ui registry. It confirms if a component or sub-component exists in the system.

## Prompt Examples

**Prompt:** 
```
Check this snippet for missing parts: <Dialog><DialogContent>Hello</DialogContent></Dialog>
```

**Response:** 
```
The code requires the **dialog** package. It also uses `DialogContent`, which is part of that base component.
```

**Prompt:** 
```
Is <DialogTrigger> a valid shadcn/ui tag?
```

**Response:** 
```
Yes, it is a known sub-component belonging to the **dialog** package.
```

**Prompt:** 
```
List all components you can resolve in this code: <Button><Accordion>...</Accordion></Button>
```

**Response:** 
```
I found two components:
* **button**
* **accordion**
```

## Capabilities

### Identify missing packages
Scans JSX to list every shadcn/ui package you need to install.

### Detect broken sub-components
Finds when you've used a tag like DialogContent without the base component being present.

### Audit registry compatibility
Checks if a specific string matches a known part of the shadcn/ui registry.

### Browse available components
Pulls a full list of everything the resolver can handle.

## Use Cases

### The Broken Dialog Scenario
You ask your agent to build a modal, it gives you code with <DialogContent>, but the app crashes because the dialog package isn't installed. This MCP identifies the missing dependency immediately.

### New Component Verification
You are unsure if a specific tag like AccordionTrigger is part of the standard shadcn/ui registry. Use validate_component_registry_entry to confirm it before you start coding.

## Benefits

- Stop manual package hunting by using extract_dependencies to find every required shadcn/ui piece.
- Prevent runtime errors in your React app by catching missing sub-components before you even run the code.
- Keep your project clean by only installing exactly what your agent's JSX snippets require.
- Verify component names instantly with validate_component_registry_entry to avoid typos in your registry entries.
- Get a full view of supported UI elements using list_all_registry_components.

## How It Works

The bottom line is you stop debugging missing UI dependencies manually.

1. Paste your JSX or TSX snippet into your AI client
2. The MCP analyzes the tags and component names
3. You get a clear list of required packages and any missing sub-components to install

## Frequently Asked Questions

**How does shadcn/ui Dependency Resolver fix my code?**
It scans your JSX snippets to identify exactly which packages and sub-components are required, so you can install them before running the app.

**Can I use this MCP with Cursor or Claude?**
Yes. You can connect it to any MCP-compatible client like Cursor, Claude, or Windsurf to verify your React components.

**Does it work for all React projects?**
It works for any project using shadcn/ui. It specifically looks for dependencies within that registry.

**What happens if a component is missing from the registry?**
The tool will not recognize it as a managed dependency, so you should verify those components manually.

**Do I need to install anything extra to use this?**
No. Once connected via Vinkius, you can start scanning snippets immediately through your AI client.

**What does the `extract_dependencies` tool return?**
It returns a unique list of required components, the total count of detected components, and a list of any missing sub-components found in your snippet.

**How does it identify components?**
The tool scans your JSX for tags starting with an uppercase letter and matches them against a strict registry of shadcn/ui component families.

**Can I verify a specific tag name?**
Yes, you can use the `validate_component_registry_entry` tool to check if a specific string like 'AccordionItem' is recognized as a valid shadcn/ui component.