WebForge MCP Server

Instructions

Implementation Reference

• src/tools/palettes.ts:59-111 (handler)

  The getPaletteDetails function implements the core logic for webforge_get_palette_details. It validates the palette_id parameter, queries the Supabase database for the design_palettes table, and returns formatted palette details including colors, typography, and border radius.

  export async function getPaletteDetails(paletteId: string): Promise<PaletteDetailsResponse> {
    try {
      if (!paletteId) {
        throw new Error('Palette ID is required');
      }
  
      const client = supabase.getAnonClient();
      
      const { data, error } = await client
        .from('design_palettes')
        .select('*')
        .eq('id', paletteId)
        .single();
  
      if (error) {
        if (error.code === 'PGRST116') {
          throw new Error(`Palette with ID '${paletteId}' not found`);
        }
        supabase.log(`Error fetching palette details: ${error.message}`, 'error');
        throw new Error(`Failed to fetch palette details: ${error.message}`);
      }
  
      if (!data) {
        throw new Error(`Palette with ID '${paletteId}' not found`);
      }
  
      const palette = data as DesignPalette;
  
      supabase.log(`Retrieved details for palette: ${palette.name}`);
  
      return {
        id: palette.id,
        name: palette.name,
        category: palette.category,
        mood: palette.mood || [],
        industries: palette.industries || [],
        colors: {
          primaryLight: palette.primary_light,
          primaryDark: palette.primary_dark,
          accentLight: palette.accent_light
        },
        typography: {
          heading: palette.heading_font,
          body: palette.body_font
        },
        borderRadius: palette.border_radius
      };
  
    } catch (error) {
      supabase.log(`Error in getPaletteDetails: ${error}`, 'error');
      throw error;
    }
  }

• src/types.ts:174-190 (schema)

  PaletteDetailsResponse interface defines the output schema for the webforge_get_palette_details tool, specifying the structure of palette details returned including id, name, category, mood, industries, colors, typography, and borderRadius.

  export interface PaletteDetailsResponse {
    id: string;
    name: string;
    category: string;
    mood: string[];
    industries: string[];
    colors: {
      primaryLight: string;
      primaryDark: string;
      accentLight: string;
    };
    typography: {
      heading: string;
      body: string;
    };
    borderRadius: string;
  }

• src/types.ts:114-127 (schema)

  DesignPalette interface defines the database model for palettes, matching the Supabase table schema with fields for palette metadata and styling properties.

  export interface DesignPalette {
    id: string;
    name: string;
    mood: string[];
    industries: string[];
    category: string;
    primary_light: string;
    primary_dark: string;
    accent_light: string;
    heading_font: string;
    body_font: string;
    border_radius: string;
    created_at?: string;
  }

• src/index.ts:88-102 (registration)

  Tool schema registration for webforge_get_palette_details in the MCP server, defining the tool's name, description, and input schema requiring a palette_id parameter.

  {
    name: 'webforge_get_palette_details',
    description: 'Get complete details for a specific color palette including all colors',
    inputSchema: {
      type: 'object',
      properties: {
        palette_id: {
          type: 'string',
          description: 'Palette ID (e.g., "P01", "P02")',
        },
      },
      required: ['palette_id'],
      additionalProperties: false,
    },
  },

• src/index.ts:287-298 (registration)

  Tool handler registration in the switch statement that routes webforge_get_palette_details calls to the getPaletteDetails function, extracts the palette_id argument, and returns the result as JSON.

  case 'webforge_get_palette_details': {
    const { palette_id } = args as { palette_id: string };
    const result = await getPaletteDetails(palette_id);
    return {
      content: [
        {
          type: 'text',
          text: JSON.stringify(result, null, 2),
        },
      ],
    };
  }