Skip to main content
Glama

MCP Design System Bridge

figma.ts2.97 kB
import { FigmaNode, ReactAssets, FigmaAssets, SyncResult } from '../types/mcp'; export class FigmaAPI { private accessToken: string; private fileId: string; private baseUrl = 'https://api.figma.com/v1'; constructor(accessToken: string, fileId: string) { this.accessToken = accessToken; this.fileId = fileId; } private async request<T>(endpoint: string, options: RequestInit = {}): Promise<T> { const response = await fetch(`${this.baseUrl}${endpoint}`, { ...options, headers: { 'X-Figma-Token': this.accessToken, 'Content-Type': 'application/json', ...options.headers, }, }); if (!response.ok) { throw new Error(`Figma API error: ${response.statusText}`); } return response.json(); } async getNode(nodeId: string): Promise<FigmaNode> { return this.request<FigmaNode>(`/files/${this.fileId}/nodes?ids=${nodeId}`); } async getRemoteAssets(): Promise<FigmaAssets> { const file = await this.request<any>(`/files/${this.fileId}`); return { components: [], tokens: { colors: {}, typography: {}, spacing: {}, shadows: {}, borders: {}, }, icons: [], images: [], }; } async syncComponents(reactComponents: ReactAssets): Promise<SyncResult> { try { // Implementation for syncing React components to Figma return { success: true, changes: [], }; } catch (error) { return { success: false, changes: [], errors: [error as Error], }; } } async syncFromFigma(diff: any): Promise<SyncResult> { try { // Implementation for syncing from Figma to React components return { success: true, changes: [], }; } catch (error) { return { success: false, changes: [], errors: [error as Error], }; } } async createComponent(name: string, properties: Record<string, any>): Promise<string> { // Implementation for creating a new Figma component return ''; } async updateComponent(nodeId: string, properties: Record<string, any>): Promise<void> { // Implementation for updating an existing Figma component } async deleteComponent(nodeId: string): Promise<void> { // Implementation for deleting a Figma component } async getComponentVariants(nodeId: string): Promise<any[]> { // Implementation for getting component variants return []; } async createVariant(nodeId: string, name: string, properties: Record<string, any>): Promise<string> { // Implementation for creating a new variant return ''; } async updateVariant(nodeId: string, variantId: string, properties: Record<string, any>): Promise<void> { // Implementation for updating a variant } async deleteVariant(nodeId: string, variantId: string): Promise<void> { // Implementation for deleting a variant } }

MCP directory API

We provide all the information about MCP servers via our MCP API.

curl -X GET 'https://glama.ai/api/mcp/v1/servers/brunonepomuceno/mcp-design-system-bridge-cursor'

If you have feedback or need assistance with the MCP directory API, please join our Discord server