get_gsap_api_expert
Retrieve expert-level knowledge on any GSAP API element, from basic to expert detail.
Instructions
Deep dive into any GSAP method, plugin, or property with expert-level knowledge
Input Schema
TableJSON Schema
| Name | Required | Description | Default |
|---|---|---|---|
| api_element | Yes | GSAP API element (e.g., "gsap.to", "ScrollTrigger", "SplitText", "drawSVG", "morphSVG") | |
| level | No | Detail level needed | advanced |
Implementation Reference
- index.ts:1581-1696 (handler)The 'get_gsap_api_expert' tool handler - processes requests to look up GSAP API elements (core methods or plugins) from the GSAP_COMPLETE_API database and returns detailed expert-level information including descriptions, syntax, parameters, examples, and performance tips.
case 'get_gsap_api_expert': { const apiElement = args?.api_element as string; const level = args?.level as string || 'advanced'; if (!apiElement) { throw new Error('API element is required'); } const api = apiElement.toLowerCase(); let result = `# 🎯 GSAP API Expert: ${apiElement}\n\n`; // Search through comprehensive API database if (GSAP_COMPLETE_API.CORE_METHODS[api as keyof typeof GSAP_COMPLETE_API.CORE_METHODS]) { const method = GSAP_COMPLETE_API.CORE_METHODS[api as keyof typeof GSAP_COMPLETE_API.CORE_METHODS]; result += `**Type**: Core Animation Method\n`; result += `**Description**: ${method.description}\n`; result += `**Syntax**: \`${method.syntax}\`\n\n`; if ('parameters' in method && method.parameters) { result += `## Parameters\n`; for (const [param, desc] of Object.entries(method.parameters)) { result += `- **${param}**: ${desc}\n`; } result += '\n'; } result += `## Examples\n\n`; for (const [type, example] of Object.entries(method.examples)) { result += `### ${type.charAt(0).toUpperCase() + type.slice(1)}\n`; result += `\`\`\`javascript\n${example}\n\`\`\`\n\n`; } if ('properties' in method && method.properties) { result += `## Animatable Properties\n`; result += `${method.properties.join(', ')}\n\n`; } if ('performance_tips' in method && method.performance_tips) { result += `## Performance Tips\n`; method.performance_tips.forEach((tip: string) => { result += `- ${tip}\n`; }); } } else if (GSAP_COMPLETE_API.PLUGINS[apiElement as keyof typeof GSAP_COMPLETE_API.PLUGINS] || GSAP_COMPLETE_API.PLUGINS[apiElement.replace('Plugin', '') as keyof typeof GSAP_COMPLETE_API.PLUGINS]) { const pluginKey = GSAP_COMPLETE_API.PLUGINS[apiElement as keyof typeof GSAP_COMPLETE_API.PLUGINS] ? apiElement : apiElement.replace('Plugin', ''); const plugin = GSAP_COMPLETE_API.PLUGINS[pluginKey as keyof typeof GSAP_COMPLETE_API.PLUGINS]; result += `**Type**: Plugin (${plugin.category})\n`; result += `**Description**: ${plugin.description}\n\n`; if ('methods' in plugin && plugin.methods) { result += `## Methods\n`; if (typeof plugin.methods === 'object') { for (const [method, desc] of Object.entries(plugin.methods)) { result += `- **${method}**: ${desc}\n`; } } else if (Array.isArray(plugin.methods)) { (plugin.methods as string[]).forEach((method: string) => { result += `- ${method}\n`; }); } result += '\n'; } if ('properties' in plugin && plugin.properties) { result += `## Properties\n`; if (typeof plugin.properties === 'object' && !Array.isArray(plugin.properties)) { for (const [prop, desc] of Object.entries(plugin.properties)) { result += `- **${prop}**: ${desc}\n`; } } else if (Array.isArray(plugin.properties)) { (plugin.properties as string[]).forEach((prop: string) => { result += `- ${prop}\n`; }); } result += '\n'; } if ('examples' in plugin && plugin.examples) { result += `## Examples\n\n`; for (const [name, code] of Object.entries(plugin.examples)) { result += `### ${name.replace(/_/g, ' ').replace(/\b\w/g, l => l.toUpperCase())}\n`; result += `\`\`\`javascript\n${code}\n\`\`\`\n\n`; } } if ('performance_optimization' in plugin && plugin.performance_optimization) { result += `## Performance Optimization\n`; (plugin.performance_optimization as string[]).forEach((tip: string) => { result += `- ${tip}\n`; }); } } else { result += `API element "${apiElement}" not found in the comprehensive database.\n\n`; result += `## Available Core Methods:\n`; result += Object.keys(GSAP_COMPLETE_API.CORE_METHODS).join(', ') + '\n\n'; result += `## Available Plugins:\n`; result += Object.keys(GSAP_COMPLETE_API.PLUGINS).join(', ') + '\n\n'; result += `## Did you mean?\n`; // Simple fuzzy matching const allApis = [...Object.keys(GSAP_COMPLETE_API.CORE_METHODS), ...Object.keys(GSAP_COMPLETE_API.PLUGINS)]; const suggestions = allApis.filter(api => api.toLowerCase().includes(apiElement.toLowerCase()) || apiElement.toLowerCase().includes(api.toLowerCase()) ); if (suggestions.length > 0) { result += `Possible matches: ${suggestions.join(', ')}`; } } return { content: [{ type: 'text', text: result }] }; } - index.ts:1364-1383 (schema)Input schema definition for the 'get_gsap_api_expert' tool, specifying 'api_element' (required string) and 'level' (optional enum: basic/intermediate/advanced/expert) parameters.
{ name: 'get_gsap_api_expert', description: 'Deep dive into any GSAP method, plugin, or property with expert-level knowledge', inputSchema: { type: 'object', properties: { api_element: { type: 'string', description: 'GSAP API element (e.g., "gsap.to", "ScrollTrigger", "SplitText", "drawSVG", "morphSVG")' }, level: { type: 'string', description: 'Detail level needed', enum: ['basic', 'intermediate', 'advanced', 'expert'], default: 'advanced' } }, required: ['api_element'] } }, - index.ts:1335-1479 (registration)Tool registration in the ListToolsRequestSchema handler, where 'get_gsap_api_expert' is listed among the tools with its name, description, and inputSchema.
server.setRequestHandler(ListToolsRequestSchema, async () => { return { tools: [ { name: 'understand_and_create_animation', description: 'The main AI engine - understands any animation request and generates perfect GSAP code with surgical precision', inputSchema: { type: 'object', properties: { request: { type: 'string', description: 'Natural language description of the animation you want (e.g., "fade in cards one by one when scrolling", "create a hero entrance with staggered text")' }, context: { type: 'string', description: 'Development context and requirements', enum: ['react', 'vanilla', 'nextjs', 'vue', 'performance-critical', 'mobile-optimized'], default: 'react' }, complexity: { type: 'string', description: 'Animation complexity level', enum: ['simple', 'intermediate', 'advanced', 'expert'], default: 'intermediate' } }, required: ['request'] } }, { name: 'get_gsap_api_expert', description: 'Deep dive into any GSAP method, plugin, or property with expert-level knowledge', inputSchema: { type: 'object', properties: { api_element: { type: 'string', description: 'GSAP API element (e.g., "gsap.to", "ScrollTrigger", "SplitText", "drawSVG", "morphSVG")' }, level: { type: 'string', description: 'Detail level needed', enum: ['basic', 'intermediate', 'advanced', 'expert'], default: 'advanced' } }, required: ['api_element'] } }, { name: 'generate_complete_setup', description: 'Generate complete GSAP environment setup with all plugins and optimizations', inputSchema: { type: 'object', properties: { framework: { type: 'string', description: 'Target framework', enum: ['react', 'nextjs', 'vue', 'nuxt', 'svelte', 'vanilla'], default: 'react' }, plugins: { type: 'array', description: 'Specific plugins needed', items: { type: 'string', enum: ['ScrollTrigger', 'SplitText', 'DrawSVGPlugin', 'MorphSVGPlugin', 'MotionPathPlugin', 'Draggable', 'InertiaPlugin', 'Flip', 'Observer', 'CustomEase', 'GSDevTools', 'Lenis'] } }, performance_level: { type: 'string', description: 'Performance optimization level', enum: ['basic', 'optimized', '60fps-guaranteed', 'mobile-first'], default: 'optimized' } }, required: ['framework'] } }, { name: 'debug_animation_issue', description: 'Expert debugging for GSAP animation problems with solutions', inputSchema: { type: 'object', properties: { issue: { type: 'string', description: 'Description of the animation problem or unexpected behavior' }, code: { type: 'string', description: 'Problematic animation code (optional but helpful)' }, expected_behavior: { type: 'string', description: 'What should happen vs what is happening' } }, required: ['issue'] } }, { name: 'optimize_for_performance', description: 'Transform any animation into 60fps smoothness with expert optimizations', inputSchema: { type: 'object', properties: { animation_code: { type: 'string', description: 'Existing GSAP animation code to optimize' }, target: { type: 'string', description: 'Optimization target', enum: ['60fps-desktop', 'mobile-smooth', 'battery-efficient', 'memory-optimized'], default: '60fps-desktop' } }, required: ['animation_code'] } }, { name: 'create_production_pattern', description: 'Generate battle-tested, production-ready animation patterns', inputSchema: { type: 'object', properties: { pattern_type: { type: 'string', description: 'Type of production pattern needed', enum: ['hero-section', 'scroll-system', 'text-effects', 'interactive-ui', 'loading-sequence', 'page-transitions', 'micro-interactions', 'data-visualization'] }, industry: { type: 'string', description: 'Industry or use case', enum: ['portfolio', 'ecommerce', 'saas', 'agency', 'blog', 'app', 'game'], default: 'portfolio' } }, required: ['pattern_type'] } } ] }; });