@primer/mcp 0.3.4 → 0.4.0-rc.5c4b3e004

package/dist/index.js

@@ -1,4 +1,4 @@
-export { s as server } from './server-CaSuVJt0.js';
+export { s as server } from './server-CkSoZOVD.js';
 import '@modelcontextprotocol/sdk/server/mcp.js';
 import 'cheerio';
 import 'zod';

package/dist/{server-CaSuVJt0.js → server-CkSoZOVD.js}

@@ -40,36 +40,63 @@ const components = Object.entries(componentsMetadata.components).map(([id, compo
 function listComponents() {
   return components;
 }
+// Scenario patterns are listed first so name resolution favours them over UI patterns.
 const patterns = [{
+  id: 'copy',
+  name: 'Copy',
+  category: 'scenario'
+}, {
+  id: 'delete',
+  name: 'Delete',
+  category: 'scenario'
+}, {
+  id: 'filter',
+  name: 'Filter',
+  category: 'scenario'
+}, {
+  id: 'search',
+  name: 'Search',
+  category: 'scenario'
+}, {
   id: 'data-visualization',
-  name: 'Data Visualization'
+  name: 'Data Visualization',
+  category: 'ui'
 }, {
   id: 'degraded-experiences',
-  name: 'Degraded Experiences'
+  name: 'Degraded Experiences',
+  category: 'ui'
 }, {
   id: 'empty-states',
-  name: 'Empty States'
+  name: 'Empty States',
+  category: 'ui'
 }, {
   id: 'feature-onboarding',
-  name: 'Feature Onboarding'
+  name: 'Feature Onboarding',
+  category: 'ui'
 }, {
   id: 'forms',
-  name: 'Forms'
+  name: 'Forms',
+  category: 'ui'
 }, {
   id: 'loading',
-  name: 'Loading'
+  name: 'Loading',
+  category: 'ui'
 }, {
   id: 'navigation',
-  name: 'Navigation'
+  name: 'Navigation',
+  category: 'ui'
 }, {
   id: 'notification-messaging',
-  name: 'Notification message'
+  name: 'Notification message',
+  category: 'ui'
 }, {
   id: 'progressive-disclosure',
-  name: 'Progressive disclosure'
+  name: 'Progressive disclosure',
+  category: 'ui'
 }, {
   id: 'saving',
-  name: 'Saving'
+  name: 'Saving',
+  category: 'ui'
 }];
 function listPatterns() {
   return patterns;
@@ -736,7 +763,7 @@ function runStylelint(css) {
   });
 }
 
-var version = "0.3.4";
+var version = "0.4.0";
 var packageJson = {
 	version: version};
 
@@ -1037,25 +1064,31 @@ ${text}`
 // Patterns
 // -----------------------------------------------------------------------------
 server.registerTool('list_patterns', {
-  description: 'List all of the patterns available from Primer React',
+  description: 'List all of the patterns available from Primer React. Scenario patterns describe specific user tasks (copy, delete, filter, search). Prefer a scenario pattern when one fits the task, and fall back to the more generic UI patterns otherwise.',
   annotations: {
     readOnlyHint: true
   }
 }, async () => {
-  const patterns = listPatterns().map(pattern => {
-    return `- ${pattern.name}`;
-  });
+  const all = listPatterns();
+  const scenario = all.filter(pattern => pattern.category === 'scenario').map(pattern => `- ${pattern.name}`);
+  const ui = all.filter(pattern => pattern.category === 'ui').map(pattern => `- ${pattern.name}`);
   return {
     content: [{
       type: 'text',
-      text: `The following patterns are available in the @primer/react in TypeScript projects:
+      text: `The following patterns are available from \`@primer/react\` for use in TypeScript projects. Scenario patterns describe specific user tasks. Prefer a scenario pattern when one fits the task, and fall back to the UI patterns otherwise.
 
-${patterns.join('\n')}`
+## Scenario patterns
+
+${scenario.join('\n')}
+
+## UI patterns
+
+${ui.join('\n')}`
     }]
   };
 });
 server.registerTool('get_pattern', {
-  description: 'Get a specific pattern by name',
+  description: 'Get a specific pattern by name. Scenario patterns describe specific user tasks (copy, delete, filter, search). Prefer a scenario pattern when one fits the task, and fall back to the more generic UI patterns otherwise.',
   inputSchema: {
     name: z.string().describe('The name of the pattern to retrieve')
   },
@@ -1066,9 +1099,8 @@ server.registerTool('get_pattern', {
   name
 }) => {
   const patterns = listPatterns();
-  const match = patterns.find(pattern => {
-    return pattern.name === name;
-  });
+  // Resolve scenario patterns first so a name clash favours the scenario pattern.
+  const match = patterns.find(pattern => pattern.category === 'scenario' && pattern.name === name) ?? patterns.find(pattern => pattern.name === name);
   if (!match) {
     return {
       content: [{
@@ -1077,7 +1109,8 @@ server.registerTool('get_pattern', {
       }]
     };
   }
-  const url = new URL(`/product/ui-patterns/${match.id}`, 'https://primer.style');
+  const basePath = match.category === 'scenario' ? 'scenario-patterns' : 'ui-patterns';
+  const url = new URL(`/product/${basePath}/${match.id}`, 'https://primer.style');
   const response = await fetch(url);
   if (!response.ok) {
     throw new Error(`Failed to fetch ${url} - ${response.statusText}`);

package/dist/stdio.js

@@ -1,5 +1,5 @@
 import { StdioServerTransport } from '@modelcontextprotocol/sdk/server/stdio.js';
-import { s as server } from './server-CaSuVJt0.js';
+import { s as server } from './server-CkSoZOVD.js';
 import '@modelcontextprotocol/sdk/server/mcp.js';
 import 'cheerio';
 import 'zod';

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@primer/mcp",
   "description": "An MCP server that connects AI tools to the Primer Design System",
-  "version": "0.3.4",
+  "version": "0.4.0-rc.5c4b3e004",
   "type": "module",
   "bin": {
     "mcp": "./bin/mcp.js"
@@ -37,7 +37,7 @@
     "@modelcontextprotocol/sdk": "^1.24.0",
     "@primer/octicons": "^19.15.5",
     "@primer/primitives": "10.x || 11.x",
-    "@primer/react": "^38.20.0",
+    "@primer/react": "^38.30.0",
     "cheerio": "^1.0.0",
     "turndown": "^7.2.0",
     "zod": "^4.3.5"

package/src/primer.ts

@@ -40,48 +40,81 @@ function listComponents(): Array<Component> {
 type Pattern = {
   id: string
   name: string
+  // 'scenario' maps to the /product/scenario-patterns/ base path, 'ui' to /product/ui-patterns/
+  category: 'scenario' | 'ui'
 }
 
+// Scenario patterns are listed first so name resolution favours them over UI patterns.
 const patterns: Array<Pattern> = [
+  {
+    id: 'copy',
+    name: 'Copy',
+    category: 'scenario',
+  },
+  {
+    id: 'delete',
+    name: 'Delete',
+    category: 'scenario',
+  },
+  {
+    id: 'filter',
+    name: 'Filter',
+    category: 'scenario',
+  },
+  {
+    id: 'search',
+    name: 'Search',
+    category: 'scenario',
+  },
   {
     id: 'data-visualization',
     name: 'Data Visualization',
+    category: 'ui',
   },
   {
     id: 'degraded-experiences',
     name: 'Degraded Experiences',
+    category: 'ui',
   },
   {
     id: 'empty-states',
     name: 'Empty States',
+    category: 'ui',
   },
   {
     id: 'feature-onboarding',
     name: 'Feature Onboarding',
+    category: 'ui',
   },
   {
     id: 'forms',
     name: 'Forms',
+    category: 'ui',
   },
   {
     id: 'loading',
     name: 'Loading',
+    category: 'ui',
   },
   {
     id: 'navigation',
     name: 'Navigation',
+    category: 'ui',
   },
   {
     id: 'notification-messaging',
     name: 'Notification message',
+    category: 'ui',
   },
   {
     id: 'progressive-disclosure',
     name: 'Progressive disclosure',
+    category: 'ui',
   },
   {
     id: 'saving',
     name: 'Saving',
+    category: 'ui',
   },
 ]
 

package/src/server.ts

@@ -372,18 +372,28 @@ ${text}`,
 // -----------------------------------------------------------------------------
 server.registerTool(
   'list_patterns',
-  {description: 'List all of the patterns available from Primer React', annotations: {readOnlyHint: true}},
+  {
+    description:
+      'List all of the patterns available from Primer React. Scenario patterns describe specific user tasks (copy, delete, filter, search). Prefer a scenario pattern when one fits the task, and fall back to the more generic UI patterns otherwise.',
+    annotations: {readOnlyHint: true},
+  },
   async () => {
-    const patterns = listPatterns().map(pattern => {
-      return `- ${pattern.name}`
-    })
+    const all = listPatterns()
+    const scenario = all.filter(pattern => pattern.category === 'scenario').map(pattern => `- ${pattern.name}`)
+    const ui = all.filter(pattern => pattern.category === 'ui').map(pattern => `- ${pattern.name}`)
     return {
       content: [
         {
           type: 'text',
-          text: `The following patterns are available in the @primer/react in TypeScript projects:
+          text: `The following patterns are available from \`@primer/react\` for use in TypeScript projects. Scenario patterns describe specific user tasks. Prefer a scenario pattern when one fits the task, and fall back to the UI patterns otherwise.
 
-${patterns.join('\n')}`,
+## Scenario patterns
+
+${scenario.join('\n')}
+
+## UI patterns
+
+${ui.join('\n')}`,
         },
       ],
     }
@@ -393,7 +403,8 @@ ${patterns.join('\n')}`,
 server.registerTool(
   'get_pattern',
   {
-    description: 'Get a specific pattern by name',
+    description:
+      'Get a specific pattern by name. Scenario patterns describe specific user tasks (copy, delete, filter, search). Prefer a scenario pattern when one fits the task, and fall back to the more generic UI patterns otherwise.',
     inputSchema: {
       name: z.string().describe('The name of the pattern to retrieve'),
     },
@@ -401,9 +412,10 @@ server.registerTool(
   },
   async ({name}) => {
     const patterns = listPatterns()
-    const match = patterns.find(pattern => {
-      return pattern.name === name
-    })
+    // Resolve scenario patterns first so a name clash favours the scenario pattern.
+    const match =
+      patterns.find(pattern => pattern.category === 'scenario' && pattern.name === name) ??
+      patterns.find(pattern => pattern.name === name)
     if (!match) {
       return {
         content: [
@@ -415,7 +427,8 @@ server.registerTool(
       }
     }
 
-    const url = new URL(`/product/ui-patterns/${match.id}`, 'https://primer.style')
+    const basePath = match.category === 'scenario' ? 'scenario-patterns' : 'ui-patterns'
+    const url = new URL(`/product/${basePath}/${match.id}`, 'https://primer.style')
     const response = await fetch(url)
     if (!response.ok) {
       throw new Error(`Failed to fetch ${url} - ${response.statusText}`)