feat: Add dynamic MCP tool registration per page

- webmcp.ts: Add tool tracking, unregisterTool(), clearAllTools()
- tools/canvasTools.ts: render_html, render_vue_component
- tools/componentTools.ts: save/load/list/delete_vue_component
- tools/themeTools.ts: get_design_tokens, get_active_theme, set_theme_variable, save_theme
- tools/globalTools.ts: get_current_page, navigate_to, list_available_tools
- toolRegistry.ts: Orchestrates tool registration per page
- App.vue: Initializes WebMCP once, watches route for tool changes
- Canvas.vue: Removed tool registration (now handled by registry)

Tools are now registered when entering a page and unregistered when leaving.
Refresh initializes tools correctly for the current page.

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
2026-02-13 05:42:17 -06:00
parent 3c38b75040
commit acde6b37d6
11 changed files with 759 additions and 325 deletions

View File

@@ -1,7 +1,5 @@
<script setup lang="ts">
import { onMounted, onUnmounted } from 'vue'
import { initWebMCP } from '../services/webmcp'
import { registerCanvasTools } from '../services/canvasTools'
import { renderInlineComponent, type VueComponentDefinition } from '../services/dynamicComponents'
import { useCanvasStore } from '../stores/canvas'
@@ -34,11 +32,8 @@ function handleLoadComponent(e: Event) {
canvasStore.addToHistory({ tool: 'load_vue_component', args: detail, timestamp: Date.now() })
}
onMounted(async () => {
onMounted(() => {
window.addEventListener('load-vue-component', handleLoadComponent)
await initWebMCP()
registerCanvasTools()
})
onUnmounted(() => {