Shadcn UI MCP Server

Implementation Reference

• src/handlers.ts:77-85 (handler)

  The main handler function for the 'list-blocks' tool. It fetches the list of blocks using fetchAndCacheBlocks and returns their names as JSON.

  export const listBlocks = async () => {
      try {
          const blocks = await fetchAndCacheBlocks();
          const blockNames = blocks.map(block => block.name);
          return createResponse(JSON.stringify(blockNames, null, 2));
      } catch (error) {
          return handleError(error, "Error fetching blocks");
      }
  }

• src/index.ts:76-82 (registration)

  The loop that registers all tools, including 'list-blocks', by calling server.tool with name, schema, and handler.

  for (const [name, definition] of Object.entries(toolDefinitions)) {
      server.tool(
          name,
          definition.toolSchema,
          definition.handler
      );
  }

• src/index.ts:38-42 (registration)

  The tool definition object for 'list-blocks' within toolDefinitions, including description, parameters, schema, and handler reference.

  "list-blocks": {
      description: "Get the list of available shadcn/ui blocks",
      parameters: {},
      toolSchema: {},
      handler: listBlocks

• src/index.ts:40-41 (schema)

  Empty input parameters and toolSchema for 'list-blocks' tool.

  parameters: {},
  toolSchema: {},

• src/helpers.ts:220-243 (helper)

  Core helper function that fetches block data from shadcn/ui block pages, parses them, transforms to ComponentDocResource, and caches them.

  export async function fetchAndCacheBlocks(): Promise<ComponentDocResource[]> {
      const transformBlocks = (blockPages: Block[][]): ComponentDocResource[] => {
          const allBlocks = blockPages.flat();
          
          return allBlocks.map((block: Block) => ({
              name: block.name,
              description: block.description,
              doc: block.doc,
              commands: [{
                  npm: block.command,
                  pnpm: getCliCommand(block.command, 'pnpm'),
                  yarn: getCliCommand(block.command, 'yarn'),
                  bun: getCliCommand(block.command, 'bun')
              }],
              isBlock: true
          }));
      };
  
      return fetchAndCache(
          'blocks',
          async () => Promise.all(BLOCK_PAGES.map(parseBlocksFromPage)),
          transformBlocks
      );
  }