design-system

1# Project Instructions
2 
3## Best Practices for Using shadcn MCP server
4 
51. **Always Check Registry First**
6   - Before creating custom components, search the registry for existing solutions
7   - Use `mcp_shadcn_search_items_in_registries` to find relevant components
8   - Check `mcp_shadcn_list_items_in_registries` to see all available options
9 
102. **Component Discovery Workflow**
11   - Start with semantic search using `mcp_shadcn_search_items_in_registries`
12   - View detailed component info with `mcp_shadcn_view_items_in_registries`
13   - Get usage examples with `mcp_shadcn_get_item_examples_from_registries`
14   - Use `mcp_shadcn_get_add_command_for_items` to get installation commands
15 
163. **Component Installation**
17   - Use the provided add commands from the registry
18   - Ensure components are properly imported and configured
19   - Do not install example- components directly, use them as reference to create your components.
20   - Follow the component's usage examples for proper implementation
21   - Do not overwrite ui or registry/ui components unless the user has specifically asked for it
22 
23## Quality Assurance
24 
25- Always test registry components after installation
26- Verify imports and dependencies are correct
27- Check that styling integrates with your existing design
28- If using next/image, make sure images.remotePatterns is configured in next.config.ts
29 
30```tsx
31import type { NextConfig } from "next"
32 
33const nextConfig: NextConfig = {
34  images: {
35    domains: ["images.unsplash.com"],
36  },
37}
38 
39export default nextConfig
40```