Shadcn UI MCP Server

Implementation Reference

• src/handlers.ts:102-120 (handler)

  The main handler function for the 'get-block-docs' tool. It fetches block data using getBlockData helper and returns the JSON-serialized documentation if available.

  export const getBlockDocs = async ({block}: {block: string}) => {
      try {
          const { blockData, error } = await getBlockData(block);
          if (error) return createResponse(error, true);
          if (!blockData) return createResponse("Unexpected error: block data missing", true);
  
          if (!blockData.doc) {
              return createResponse(`No documentation found for block '${block}'`, true);
          }
  
          return createResponse(
              `${JSON.stringify(blockData, null, 2)}`,
              false,
              "application/json"
          );
      } catch (error) {
          return handleError(error, "Error fetching block documentation");
      }
  }

• src/index.ts:44-53 (registration)

  The tool definition object in toolDefinitions that registers 'get-block-docs' with its description, parameters, schema, and handler reference. This object is used in the server.tool calls.

  "get-block-docs": {
      description: "Get documentation (code) for a specific shadcn/ui block",
      parameters: {
          block: { type: "string", description: "Name of the block to get documentation for" }
      },
      toolSchema: {
          block: z.string().describe("Name of the block to get documentation for")
      },
      handler: getBlockDocs
  },

• src/index.ts:49-51 (schema)

  Zod schema for input validation of the 'block' parameter.

  toolSchema: {
      block: z.string().describe("Name of the block to get documentation for")
  },

• src/handlers.ts:87-100 (helper)

  Helper function that retrieves or fetches block data from the resource cache, used exclusively by getBlockDocs.

  async function getBlockData(block: string) {
      if (!block) {
          return { error: "Block name is required" };
      }
      let blockData = resourceCache.get(block);
      if (!blockData) {
          await fetchAndCacheBlocks();
          blockData = resourceCache.get(block);
      }
      if (!blockData) {
          return { error: `Block '${block}' not found. Use list-blocks to see available blocks.` };
      }
      return { blockData };
  }

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

  Helper function to fetch and cache block data from shadcn/ui block pages, populating the resourceCache used by getBlockData.

  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
      );
  }