docs(mcp): use @nuxtjs/mcp-toolkit

docs/nuxt.config.ts

@@ -9,6 +9,7 @@ export default defineNuxtConfig({
     '@nuxt/content',
     '@nuxt/image',
     '@nuxtjs/plausible',
+    '@nuxtjs/mcp-toolkit',
     '@vueuse/nuxt',
     'nuxt-component-meta',
     'nuxt-og-image',
@@ -156,6 +157,7 @@ export default defineNuxtConfig({
   },
 
   experimental: {
+    asyncContext: true,
     defaults: {
       nuxtLink: {
         externalRelAttribute: 'noopener'
@@ -261,5 +263,9 @@ export default defineNuxtConfig({
       'The documentation excludes Nuxt UI v2 content.',
       'The content is automatically generated from the same source as the official documentation.'
     ]
+  },
+  mcp: {
+    name: 'Nuxt UI',
+    browserRedirect: '/docs/getting-started/ai/mcp'
   }
 })

docs/package.json

@@ -16,10 +16,11 @@
     "@iconify-json/lucide": "^1.2.74",
     "@iconify-json/simple-icons": "^1.2.59",
     "@iconify-json/vscode-icons": "^1.2.36",
-    "@modelcontextprotocol/sdk": "^1.22.0",
+    "@modelcontextprotocol/sdk": "^1.23.0",
     "@nuxt/content": "^3.8.2",
     "@nuxt/image": "^2.0.0",
     "@nuxt/ui": "workspace:*",
+    "@nuxtjs/mcp-toolkit": "^0.4.1",
     "@nuxtjs/plausible": "^2.0.1",
     "@octokit/rest": "^22.0.1",
     "@regle/core": "^1.10.2",

docs/server/mcp/prompts/find-component-for-usecase.ts

@@ -0,0 +1,30 @@
+import { z } from 'zod'
+import { queryCollection } from '@nuxt/content/server'
+
+export default defineMcpPrompt({
+  description: 'Find the best Nuxt UI component for a specific use case',
+  inputSchema: {
+    usecase: z.string().describe('Describe what you want to build (e.g., "user login form", "data table", "navigation menu")')
+  },
+  async handler({ usecase }) {
+    const event = useEvent()
+
+    const components = await queryCollection(event, 'docs')
+      .where('path', 'LIKE', '%/components/%')
+      .where('extension', '=', 'md')
+      .select('path', 'title', 'description', 'category')
+      .all()
+
+    return {
+      messages: [
+        {
+          role: 'user' as const,
+          content: {
+            type: 'text' as const,
+            text: `Help me find the best Nuxt UI component for this use case: "${usecase}". Here are all available components: ${JSON.stringify(components, null, 2)}`
+          }
+        }
+      ]
+    }
+  }
+})