@jpisnice/shadcn-ui-mcp-server

Instructions

Implementation Reference

• src/tools/components/get-component-demo.ts:4-15 (handler)

  The core handler function that implements the logic for the 'get_component_demo' tool. It dynamically loads the appropriate axios implementation based on the framework and fetches the demo code for the specified shadcn/ui component.

  export async function handleGetComponentDemo({ componentName }: { componentName: string }) {
    try {
      const axios = await getAxiosImplementation();
      const demoCode = await axios.getComponentDemo(componentName);
      return {
        content: [{ type: "text", text: demoCode }]
      };
    } catch (error) {
      logError(`Failed to get demo for component "${componentName}"`, error);
      throw new Error(`Failed to get demo for component "${componentName}": ${error instanceof Error ? error.message : String(error)}`);
    }
  }

• src/tools/components/get-component-demo.ts:17-22 (schema)

  The input schema definition for the 'get_component_demo' tool, specifying the required 'componentName' parameter.

  export const schema = {
    componentName: {
      type: 'string',
      description: 'Name of the shadcn/ui component (e.g., "accordion", "button")'
    }
  }; 

• src/tools/index.ts:17-25 (registration)

  Registration of the tool handler functions in the central tools index, mapping 'get_component_demo' to its handler.

  export const toolHandlers = {
    get_component: handleGetComponent,
    get_component_demo: handleGetComponentDemo,
    list_components: handleListComponents,
    get_component_metadata: handleGetComponentMetadata,
    get_directory_structure: handleGetDirectoryStructure,
    get_block: handleGetBlock,
    list_blocks: handleListBlocks
  };

• src/tools/index.ts:47-55 (registration)

  Tool specification registration including name, description, and input schema for 'get_component_demo', used for MCP tool listing and validation.

  'get_component_demo': {
    name: 'get_component_demo',
    description: 'Get demo code illustrating how a shadcn/ui v4 component should be used',
    inputSchema: {
      type: 'object',
      properties: getComponentDemoSchema,
      required: ['componentName']
    }
  },

• src/server/handler.ts:281-306 (registration)

  The MCP server request handler for calling tools, which dispatches to the registered toolHandlers based on the tool name 'get_component_demo'.

  server.setRequestHandler(CallToolRequestSchema, async (request) => {
    return await handleRequest(
      'call_tool',
      request.params,
      async (validatedParams: any) => {
        const { name, arguments: params } = validatedParams;
        
        if (!name || typeof name !== 'string') {
          throw new Error("Tool name is required");
        }
        
        const handler = toolHandlers[name as keyof typeof toolHandlers];
  
        if (!handler) {
          throw new Error(`Tool not found: ${name}`);
        }
  
        // Execute handler with circuit breaker protection
        const result = await circuitBreakers.external.execute(() => 
          Promise.resolve(handler(params || {}))
        );
        
        return result;
      }
    );
  });