Hacktoberfest 2026: le issue che i maintainer hanno segnato per ottobre, aperte e adatte ai principianti. Sfoglia le issue Hacktoberfest

MCP Server: Local PatternFly Component code access

Aperta
  • Qualcosa non va?
#18 8 commenti 0 reazioni 1 assegnatario Vedi su GitHub

I maintainer di solito rispondono entro 1 giorno

@cdcabrera ci sta già lavorando.

Dal 11/3/2026.

  • #19 di @Hyperkid123 — aperta

Valutazione

Questa issue non è ancora stata valutata.

Descrizione

I'd like to discuss an option to create tools that try to directly access the currently installed version of PF and use that as a reference for AI agents to gain exact knowledge of the interface and inner workings of the JS modules.

Dynamic Package Discovery

The MCP server generates a comprehensive map of all available exports from the PatternFly package by analyzing the dist/dynamic/ directory structure. This creates a real-time inventory of:

  • All available components
  • Their exact file paths
  • Export names and types
  • Component interfaces and props

Source Code Analysis

When agent requests information about a specific component (e.g., Breadcrumb, Tabs, Toolbar), the MCP server:

  • Locates the exact TypeScript interface file
  • Reads the source code directly
  • Extracts the complete component interface including:
    • PropTypes and their TypeScript definitions
    • Component implementation details
    • Usage patterns and examples
    • Default props and behavior

Real-Time Accuracy

This approach ensures Claude always has access to:

  • Current version compatibility - Reads from the actually installed PF version
  • Exact interface matching - No guesswork about prop names or types
  • Complete API surface - All props, methods, and component variants
  • TypeScript definitions - Precise type information for better code generation

Examples

Here are a couple of examples of code that were generated using an experimental implementation of these tools. The experiment only considers the reac-core package. Other packages like DataView, Icons, etc. were not added.

Page based on a Figma design

Prompt: Can you help me implement this design using the Patternfly or PF components: https://www.figma.com/design/ay6AYgKYoF0yh1evYctbyP/Workspaces-MVP?node-id=1850-63987&t=69cOkIBIuBuLosN8-4 use the MCP servers to
learn about figma and PF components. This will be a React, create new file don't worry about builds and stuff, this is jsut to test the MPCs. I will validate the output.

Used MCP server:

  • figma MCP

  • browser tools MCP

  • experimental MCP with above described tools

Codesandbox link: https://codesandbox.io/p/sandbox/priceless-bogdan-fgnw9y

Showcase of Form components

Prompt: Can you create me showcase of Form components? Look at waht avaiable form modules we have first

Codesandbox link: https://codesandbox.io/p/devbox/zen-scooby-5mdtr7?workspaceId=ws_LP3UqCqxM8J8SsaHMFRDcN

As request, I'll open PR shortly so we can discuss the code.

cc @nicolethoen

Jira Issue: PF-3126

Lingua principale
TypeScript
Stelle
5
Fork
12
Merge medio
1g 8h
PR unite (30g)
35

Preparare l'ambiente

Come iniziare

  1. Leggi tutta la issue e poi la guida ai contributi del progetto.
  2. Commenta sulla issue per dire che te ne occupi tu — evita che due persone facciano lo stesso lavoro.
  3. Fai un fork del repository e lavora su un branch.
  4. Apri una pull request che faccia riferimento al numero della issue.

Altre issue di patternfly/patternfly-mcp

Tutte le issue di patternfly/patternfly-mcp

Issue simili

Altre issue su TypeScript

Ricevi le nuove issue nella tua casella

Un breve riepilogo di issue GitHub adatte ai principianti.