install-component
Install Shadcn UI components using your preferred runtime (npm, pnpm, yarn, bun) by specifying the component name. Simplify UI management through natural language interactions.
Input Schema
TableJSON Schema
| Name | Required | Description | Default |
|---|---|---|---|
| component | Yes | Name of the component to install | |
| runtime | No | User runtime (npm, pnpm, yarn, bun) |
Implementation Reference
- src/handlers.ts:47-75 (handler)Main handler function for the 'install-component' tool. Validates component and runtime parameters, fetches component data using cached fetch, determines the installation command based on runtime (defaults to npm), and returns it.export const installComponent = async ({component, runtime}: {component: string, runtime?: string}) => { try { if (!component) { return createResponse("Component name is required", true); } if (runtime && !validateRuntime(runtime)) { return createResponse(`Invalid runtime: ${runtime}. Must be one of: npm, pnpm, yarn, bun`, true); } const componentData = await fetchAndCacheComponentData(component); if (!componentData.commands?.[0]) { return createResponse(`No installation command found for component '${component}'`, true); } const commands = componentData.commands[0]; const selectedRuntime = runtime as PackageManager | undefined; const command = selectedRuntime ? commands[selectedRuntime] : commands.npm; if (!command) { return createResponse(`No installation command found for runtime '${runtime}'`, true); } return createResponse(command); } catch (error) { return handleError(error, "Error generating installation command"); } }
- src/index.ts:32-35 (schema)Zod input schema for the 'install-component' tool defining component (required string) and runtime (optional string).toolSchema: { component: z.string().describe("Name of the component to install"), runtime: z.string().describe("User runtime (npm, pnpm, yarn, bun)").optional() },
- src/index.ts:26-36 (registration)Tool definition object in toolDefinitions for 'install-component', including description, JSON Schema parameters, Zod toolSchema, and handler reference."install-component": { description: "Install a shadcn/ui component", parameters: { component: { type: "string", description: "Name of the component to install" }, runtime: { type: "string", description: "User runtime (npm, pnpm, yarn, bun)", optional: true } }, toolSchema: { component: z.string().describe("Name of the component to install"), runtime: z.string().describe("User runtime (npm, pnpm, yarn, bun)").optional() }, handler: installComponent
- src/index.ts:76-82 (registration)Registration loop that calls server.tool() for all tools defined in toolDefinitions, including 'install-component', passing name, schema, and handler.for (const [name, definition] of Object.entries(toolDefinitions)) { server.tool( name, definition.toolSchema, definition.handler ); }