@patternfly/patternfly-doc-core 1.16.1 → 1.18.0

package/src/pages/api/index.ts

@@ -98,6 +98,36 @@ export const GET: APIRoute = async () =>
             example: ['alert', 'button', 'card'],
           },
         },
+        {
+          path: '/api/{version}/{section}/names',
+          method: 'GET',
+          description: 'Get component names that have props data',
+          parameters: [
+            {
+              name: 'version',
+              in: 'path',
+              required: true,
+              type: 'string',
+              example: 'v6',
+            },
+            {
+              name: 'section',
+              in: 'path',
+              required: true,
+              type: 'string',
+              example: 'components',
+            }
+          ],
+          returns: {
+            type: 'array',
+            items: 'string',
+            description: 'All component names with props data',
+            example: [
+              'Alert',
+              'AlertGroup'
+            ],
+          },
+        },
         {
           path: '/api/{version}/{section}/{page}',
           method: 'GET',
@@ -132,6 +162,46 @@ export const GET: APIRoute = async () =>
             example: ['react', 'react-demos', 'html'],
           },
         },
+        {
+          path: '/api/{version}/{section}/{page}/props',
+          method: 'GET',
+          description: 'Get props for a specific component',
+          parameters: [
+            {
+              name: 'version',
+              in: 'path',
+              required: true,
+              type: 'string',
+              example: 'v6',
+            },
+            {
+              name: 'section',
+              in: 'path',
+              required: true,
+              type: 'string',
+              example: 'components',
+            },
+            {
+              name: 'page',
+              in: 'path',
+              required: true,
+              type: 'string',
+              example: 'alert',
+            },
+          ],
+          returns: {
+            type: 'array',
+            items: 'object',
+            description: 'Props for a specific component',
+            example: [
+              {
+                name: 'actionClose',
+                type: 'React.ReactNode',
+                description: 'Close button; use the alert action close button component.',
+              },
+            ],
+          },
+        },
         {
           path: '/api/{version}/{section}/{page}/{tab}',
           method: 'GET',

package/src/pages/api/openapi.json.ts

@@ -23,7 +23,7 @@ export const GET: APIRoute = async ({ url }) => {
     const details = error instanceof Error ? error.message : String(error)
     return createJsonResponse(
       { error: 'Failed to load API index', details },
-      500
+      500,
     )
   }
 
@@ -103,7 +103,8 @@ export const GET: APIRoute = async ({ url }) => {
       '/openapi.json': {
         get: {
           summary: 'Get OpenAPI specification',
-          description: 'Returns the complete OpenAPI 3.0 specification for this API',
+          description:
+            'Returns the complete OpenAPI 3.0 specification for this API',
           operationId: 'getOpenApiSpec',
           responses: {
             '200': {
@@ -234,6 +235,70 @@ export const GET: APIRoute = async ({ url }) => {
           },
         },
       },
+      '/{version}/{section}/names': {
+        get: {
+          summary: 'Get component names',
+          description: 'Returns the component names that have props data',
+          operationId: 'getNames',
+          parameters: [
+            {
+              name: 'version',
+              in: 'path',
+              required: true,
+              description: 'Documentation version',
+              schema: {
+                type: 'string',
+                enum: versions,
+              },
+              example: 'v6',
+            },
+            {
+              name: 'section',
+              in: 'path',
+              required: true,
+              description: 'Documentation section',
+              schema: {
+                type: 'string',
+              },
+              example: 'components',
+            },
+          ],
+          responses: {
+            '200': {
+              description: 'Component names with props data',
+              content: {
+                'application/json': {
+                  schema: {
+                    type: 'array',
+                    items: {
+                      type: 'string'
+                    },
+                  },
+                  example: [
+                    'Alert',
+                    'AlertGroup'
+                  ],
+                },
+              },
+            },
+            '404': {
+              description: 'Props not found',
+              content: {
+                'application/json': {
+                  schema: {
+                    type: 'object',
+                    properties: {
+                      error: {
+                        type: 'string',
+                      },
+                    },
+                  },
+                },
+              },
+            },
+          },
+        },
+      },
       '/{version}/{section}/{page}': {
         get: {
           summary: 'List tabs for a page',
@@ -306,6 +371,102 @@ export const GET: APIRoute = async ({ url }) => {
           },
         },
       },
+      '/{version}/{section}/{page}/props': {
+        get: {
+          summary: 'Get component props',
+          description: 'Returns the props for the specified component',
+          operationId: 'getProps',
+          parameters: [
+            {
+              name: 'version',
+              in: 'path',
+              required: true,
+              description: 'Documentation version',
+              schema: {
+                type: 'string',
+                enum: versions,
+              },
+              example: 'v6',
+            },
+            {
+              name: 'section',
+              in: 'path',
+              required: true,
+              description: 'Documentation section',
+              schema: {
+                type: 'string',
+              },
+              example: 'components',
+            },
+            {
+              name: 'page',
+              in: 'path',
+              required: true,
+              description: 'Page ID (kebab-cased)',
+              schema: {
+                type: 'string',
+              },
+              example: 'alert',
+            },
+          ],
+          responses: {
+            '200': {
+              description: 'Props for the specified component',
+              content: {
+                'application/json': {
+                  schema: {
+                    type: 'array',
+                    items: {
+                      type: 'object',
+                      properties: {
+                        name: { type: 'string' },
+                        type: { type: 'string' },
+                        description: { type: 'string' },
+                        defaultValue: { type: 'string' },
+                      },
+                    },
+                  },
+                  example: [
+                    {
+                      name: 'actionClose',
+                      type: 'React.ReactNode',
+                      description:
+                        'Close button; use the alert action close button component.',
+                    },
+                    {
+                      name: 'actionLinks',
+                      type: 'React.ReactNode',
+                      description:
+                        'Action links; use a single alert action link component or multiple wrapped in an array\nor React fragment.',
+                    },
+                    {
+                      name: 'children',
+                      type: 'React.ReactNode',
+                      description: 'Content rendered inside the alert.',
+                      defaultValue: "''",
+                    },
+                  ],
+                },
+              },
+            },
+            '404': {
+              description: 'Props not found',
+              content: {
+                'application/json': {
+                  schema: {
+                    type: 'object',
+                    properties: {
+                      error: {
+                        type: 'string',
+                      },
+                    },
+                  },
+                },
+              },
+            },
+          },
+        },
+      },
       '/{version}/{section}/{page}/{tab}': {
         get: {
           summary: 'Validate and redirect to text endpoint',
@@ -357,7 +518,8 @@ export const GET: APIRoute = async ({ url }) => {
           ],
           responses: {
             '302': {
-              description: 'Redirects to /{version}/{section}/{page}/{tab}/text',
+              description:
+                'Redirects to /{version}/{section}/{page}/{tab}/text',
             },
             '404': {
               description: 'Tab not found',
@@ -554,8 +716,7 @@ export const GET: APIRoute = async ({ url }) => {
       '/{version}/{section}/{page}/{tab}/examples/{example}': {
         get: {
           summary: 'Get example code',
-          description:
-            'Returns the raw source code for a specific example',
+          description: 'Returns the raw source code for a specific example',
           operationId: 'getExampleCode',
           parameters: [
             {
@@ -619,7 +780,7 @@ export const GET: APIRoute = async ({ url }) => {
                     type: 'string',
                   },
                   example:
-                    'import React from \'react\';\nimport { Alert } from \'@patternfly/react-core\';\n\nexport const AlertBasic = () => <Alert title="Basic alert" />;',
+                    "import React from 'react';\nimport { Alert } from '@patternfly/react-core';\n\nexport const AlertBasic = () => <Alert title=\"Basic alert\" />;",
                 },
               },
             },
@@ -641,6 +802,252 @@ export const GET: APIRoute = async ({ url }) => {
           },
         },
       },
+      '/{version}/tokens': {
+        get: {
+          summary: 'List token categories',
+          description:
+            'Returns an alphabetically sorted array of available design token categories from @patternfly/react-tokens. Categories are determined by token name prefixes (e.g., c_, t_, chart_). Optimized for MCP/LLM consumption.',
+          operationId: 'getTokenCategories',
+          parameters: [
+            {
+              name: 'version',
+              in: 'path',
+              required: true,
+              description: 'Documentation version',
+              schema: {
+                type: 'string',
+                enum: versions,
+              },
+              example: 'v6',
+            },
+          ],
+          responses: {
+            '200': {
+              description: 'List of token categories',
+              content: {
+                'application/json': {
+                  schema: {
+                    type: 'array',
+                    items: {
+                      type: 'string',
+                    },
+                  },
+                  example: ['c', 'chart', 'global', 'hidden', 'l', 't'],
+                },
+              },
+            },
+            '404': {
+              description: 'Version not found',
+              content: {
+                'application/json': {
+                  schema: {
+                    type: 'object',
+                    properties: {
+                      error: {
+                        type: 'string',
+                      },
+                    },
+                  },
+                },
+              },
+            },
+          },
+        },
+      },
+      '/{version}/tokens/{category}': {
+        get: {
+          summary: 'Get tokens for a category',
+          description:
+            'Returns design tokens for a specific category with optional filtering. Each token includes name (CSS variable name), value (resolved value), and var (CSS var() reference). Use the filter query parameter for case-insensitive substring matching to minimize response size.',
+          operationId: 'getTokensByCategory',
+          parameters: [
+            {
+              name: 'version',
+              in: 'path',
+              required: true,
+              description: 'Documentation version',
+              schema: {
+                type: 'string',
+                enum: versions,
+              },
+              example: 'v6',
+            },
+            {
+              name: 'category',
+              in: 'path',
+              required: true,
+              description: 'Token category (e.g., c, t, chart)',
+              schema: {
+                type: 'string',
+              },
+              example: 'c',
+            },
+            {
+              name: 'filter',
+              in: 'query',
+              required: false,
+              description: 'Case-insensitive substring filter to match against token names',
+              schema: {
+                type: 'string',
+              },
+              example: 'alert',
+            },
+          ],
+          responses: {
+            '200': {
+              description: 'Array of tokens matching the criteria',
+              content: {
+                'application/json': {
+                  schema: {
+                    type: 'array',
+                    items: {
+                      type: 'object',
+                      properties: {
+                        name: {
+                          type: 'string',
+                          description: 'CSS variable name',
+                        },
+                        value: {
+                          type: 'string',
+                          description: 'Resolved CSS value',
+                        },
+                        var: {
+                          type: 'string',
+                          description: 'CSS var() reference',
+                        },
+                      },
+                      required: ['name', 'value', 'var'],
+                    },
+                  },
+                  example: [
+                    {
+                      name: '--pf-v6-c-alert--Color',
+                      value: '#000',
+                      var: 'var(--pf-v6-c-alert--Color)',
+                    },
+                  ],
+                },
+              },
+            },
+            '404': {
+              description: 'Category not found',
+              content: {
+                'application/json': {
+                  schema: {
+                    type: 'object',
+                    properties: {
+                      error: {
+                        type: 'string',
+                      },
+                      validCategories: {
+                        type: 'array',
+                        items: {
+                          type: 'string',
+                        },
+                      },
+                    },
+                  },
+                },
+              },
+            },
+          },
+        },
+      },
+      '/{version}/tokens/all': {
+        get: {
+          summary: 'Get all tokens grouped by category',
+          description:
+            'Returns all design tokens organized by category with optional filtering. Use the filter query parameter to minimize response size for MCP/LLM consumption. Empty categories are excluded from filtered results.',
+          operationId: 'getAllTokens',
+          parameters: [
+            {
+              name: 'version',
+              in: 'path',
+              required: true,
+              description: 'Documentation version',
+              schema: {
+                type: 'string',
+                enum: versions,
+              },
+              example: 'v6',
+            },
+            {
+              name: 'filter',
+              in: 'query',
+              required: false,
+              description: 'Case-insensitive substring filter to match against token names across all categories',
+              schema: {
+                type: 'string',
+              },
+              example: 'color',
+            },
+          ],
+          responses: {
+            '200': {
+              description: 'Object with category keys and token arrays as values',
+              content: {
+                'application/json': {
+                  schema: {
+                    type: 'object',
+                    additionalProperties: {
+                      type: 'array',
+                      items: {
+                        type: 'object',
+                        properties: {
+                          name: {
+                            type: 'string',
+                            description: 'CSS variable name',
+                          },
+                          value: {
+                            type: 'string',
+                            description: 'Resolved CSS value',
+                          },
+                          var: {
+                            type: 'string',
+                            description: 'CSS var() reference',
+                          },
+                        },
+                        required: ['name', 'value', 'var'],
+                      },
+                    },
+                  },
+                  example: {
+                    c: [
+                      {
+                        name: '--pf-v6-c-alert--Color',
+                        value: '#000',
+                        var: 'var(--pf-v6-c-alert--Color)',
+                      },
+                    ],
+                    t: [
+                      {
+                        name: '--pf-v6-t-global--Color',
+                        value: '#333',
+                        var: 'var(--pf-v6-t-global--Color)',
+                      },
+                    ],
+                  },
+                },
+              },
+            },
+            '404': {
+              description: 'Version not found',
+              content: {
+                'application/json': {
+                  schema: {
+                    type: 'object',
+                    properties: {
+                      error: {
+                        type: 'string',
+                      },
+                    },
+                  },
+                },
+              },
+            },
+          },
+        },
+      },
     },
     tags: [
       {

package/src/utils/tokens.ts

@@ -0,0 +1,123 @@
+import * as allTokens from '@patternfly/react-tokens'
+
+export interface Token {
+  name: string
+  value: string
+  var: string
+}
+
+export interface TokensByCategory {
+  [category: string]: Token[]
+}
+
+let cachedTokens: Token[] | null = null
+let cachedCategories: string[] | null = null
+let cachedTokensByCategory: TokensByCategory | null = null
+
+function getCategoryFromTokenName(tokenName: string): string {
+  const nameWithoutPfPrefix = tokenName.replace(/^--pf-/, '')
+  const parts = nameWithoutPfPrefix.split(/-+/)
+  if (/^v\d+/.test(parts[0])) {
+    return parts[1]
+  }
+
+  return parts[0]
+}
+
+export function getAllTokens(): Token[] {
+  if (cachedTokens) {
+    return cachedTokens
+  }
+
+  const tokens: Token[] = []
+
+  // eslint-disable-next-line @typescript-eslint/no-unused-vars
+  for (const [_exportName, tokenValue] of Object.entries(allTokens)) {
+    if (typeof tokenValue === 'object' && tokenValue !== null) {
+      const token = tokenValue as Token
+
+      if (token.name && token.value && token.var) {
+        tokens.push({
+          name: token.name,
+          value: token.value,
+          var: token.var,
+        })
+      }
+    }
+  }
+
+  cachedTokens = tokens
+  return tokens
+}
+
+export function getTokenCategories(): string[] {
+  if (cachedCategories) {
+    return cachedCategories
+  }
+
+  const tokens = getAllTokens()
+  const categorySet = new Set<string>()
+
+  for (const token of tokens) {
+    const category = getCategoryFromTokenName(token.name)
+    categorySet.add(category)
+  }
+
+  cachedCategories = Array.from(categorySet).sort()
+  return cachedCategories
+}
+
+export function getTokensByCategory(): TokensByCategory {
+  if (cachedTokensByCategory) {
+    return cachedTokensByCategory
+  }
+
+  const tokens = getAllTokens()
+  const byCategory: TokensByCategory = {}
+
+  for (const token of tokens) {
+    const category = getCategoryFromTokenName(token.name)
+    if (!byCategory[category]) {
+      byCategory[category] = []
+    }
+    byCategory[category].push(token)
+  }
+
+  cachedTokensByCategory = byCategory
+  return byCategory
+}
+
+export function getTokensForCategory(category: string): Token[] | undefined {
+  const byCategory = getTokensByCategory()
+  return byCategory[category]
+}
+
+export function filterTokens(tokens: Token[], filter: string): Token[] {
+  if (!filter) {
+    return tokens
+  }
+
+  const lowerFilter = filter.toLowerCase()
+  return tokens.filter((token) =>
+    token.name.toLowerCase().includes(lowerFilter),
+  )
+}
+
+export function filterTokensByCategory(
+  byCategory: TokensByCategory,
+  filter: string,
+): TokensByCategory {
+  if (!filter) {
+    return byCategory
+  }
+
+  const filtered: TokensByCategory = {}
+  for (const [category, tokens] of Object.entries(byCategory)) {
+    const filteredTokens = filterTokens(tokens, filter)
+    if (filteredTokens.length > 0) {
+      filtered[category] = filteredTokens
+    }
+  }
+
+  return filtered
+}