Code Screenshot Generator

Instructions

Implementation Reference

• src/generator.ts:122-147 (handler)

  Core implementation of the screenshot_from_file tool: reads the specified file, auto-detects language from extension, optionally extracts a line range, and generates a screenshot using the generateScreenshot helper.

  export async function screenshotFromFile(
    options: ScreenshotFromFileOptions
  ): Promise<GenerateScreenshotResult> {
    // Read the file
    const fileContent = await fs.readFile(options.filePath, 'utf-8');
  
    // Detect language from extension
    const ext = path.extname(options.filePath).toLowerCase();
    const language = extensionToLanguage[ext] || 'plaintext';
  
    // Extract lines if specified
    let code = fileContent;
    if (options.startLine !== undefined || options.endLine !== undefined) {
      const lines = fileContent.split('\n');
      const start = (options.startLine || 1) - 1;
      const end = options.endLine || lines.length;
      code = lines.slice(start, end).join('\n');
    }
  
    // Generate screenshot
    return generateScreenshot({
      code,
      language,
      theme: options.theme,
    });
  }

• src/generator.ts:115-120 (schema)

  TypeScript type definition for the input options of the screenshotFromFile handler.

  export interface ScreenshotFromFileOptions {
    filePath: string;
    startLine?: number;
    endLine?: number;
    theme?: string;
  }

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

  MCP tool registration in the listTools response, including name, description, and JSON input schema.

  {
    name: "screenshot_from_file",
    description: "Screenshot code directly from a file path, with optional line range selection. Auto-detects language from file extension.",
    inputSchema: {
      type: "object",
      properties: {
        filePath: {
          type: "string",
          description: "Path to the code file",
        },
        startLine: {
          type: "number",
          description: "Start line number (1-indexed, optional)",
        },
        endLine: {
          type: "number",
          description: "End line number (optional)",
        },
        theme: {
          type: "string",
          description: "Color theme (dracula, nord, monokai, github-light, github-dark)",
          enum: ["dracula", "nord", "monokai", "github-light", "github-dark"],
        },
      },
      required: ["filePath"],
    },

• src/index.ts:186-239 (handler)

  MCP server dispatch handler for screenshot_from_file tool calls: validates arguments, invokes the screenshotFromFile function, and formats the response with image and text.

  if (name === "screenshot_from_file") {
    if (!args) {
      throw new Error("Arguments are required");
    }
  
    try {
      const { filePath, startLine, endLine, theme = "dracula" } = args as {
        filePath: string;
        startLine?: number;
        endLine?: number;
        theme?: string;
      };
  
      if (!filePath) {
        throw new Error("filePath is required");
      }
  
      // Generate the screenshot from file
      const result = await screenshotFromFile({
        filePath,
        startLine,
        endLine,
        theme,
      });
  
      const lineInfo = startLine || endLine
        ? `\nLines: ${startLine || 1}-${endLine || 'end'}`
        : '\nFull file';
  
      return {
        content: [
          {
            type: "text",
            text: `✅ Screenshot from file generated successfully!\n\nFile: ${filePath}${lineInfo}\nSaved to: ${result.path}\n\nTheme: ${theme}\n\nYou can view the image in your file browser.`,
          },
          {
            type: "image",
            data: result.base64,
            mimeType: "image/png",
          },
        ],
      };
    } catch (error) {
      return {
        content: [
          {
            type: "text",
            text: `❌ Error generating screenshot from file: ${error instanceof Error ? error.message : String(error)}`,
          },
        ],
        isError: true,
      };
    }
  }