Contribute to PatternFly

Thank you for your interest in contributing to PatternFly! We depend on community contributions to help our design system grow and evolve. We encourage everyone, regardless of background, to get involved. Common contributions include (but aren't limited to):

• New feature ideas.
• Bug reports.
• Documentation updates.

This guide outlines the ways that you can contribute to PatternFly's design, code, and documentation to help us stay on top of the latest and greatest solutions.

If you have any ideas that don't fit into the projects outlined in this guide, please reach out to us on Slack.

If you have skills in visual and interaction design, you can contribute to PatternFly's design by taking an existing issue or proposing a new feature, enhancement, or icon. If you are interested in any of these projects, reach out on the patternfly-design Slack channel.

The PatternFly design team is composed of visual and interaction designers who define the look and feel of the PatternFly library. The team follows an agile framework, planning their work in sprints, with a backlog that is tracked and managed via this GitHub project board. This board contains a list issues that are currently unassigned and waiting in the queue. If you see something here that you'd like to work on, leave a comment on the issue and a member of our team will reach out with next steps.

If you have an idea for a new design pattern, a new component type, or an existing feature improvement, we'd love to hear it. Start by opening an issue in the patternfly-design repository. From there, a member of our team will reach out and work with you to plan and design a solution.

We encourage designers to work with the existing PatternFly icon set, which covers most common use cases. If your use case isn't covered, you can propose a new icon.

To contribute a new icon, start by opening an issue in the patternfly-design repository that describes your idea and why it's needed. A member of our team will reach out to you to discuss next steps.

The primary PatternFly libraries include HTML/CSS (commonly called "core") and React. If you're looking to contribute to PatternFly's codebase, these libraries are a good place to start. You can help out by taking existing issues, or creating issues for bugs and other changes.

If you have any questions about these projects, you can reach out to us on our patternfly-core and patternfly-react Slack channels.

To find work that has been approved, but not started, you can view open issues in our patternfly (HTML/CSS) and patternfly-react (React) repositories. If you find an issue that you'd like to work on, leave a comment and someone from our team will reach out to you with next steps.

Be sure to view our detailed contribution instructions for both of these repositories:

• Core contribution guidelines
• React contribution guidelines

If you believe that you've come across a PatternFly bug, alert our team, so that we can resolve the issue. To report a bug, follow these steps:

1. View the documentation for the feature, to confirm that the behavior is not functioning as intended.
2. Search open issues in the patternfly and patternfly-react repositories to see if a related issue already exists.
   • If the bug is present in only the React implementation of PatternFly, create a bug issue in patternfly-react.
   • If the bug can be seen on both the React and HTML/CSS side, create a bug issue in patternfly.
3. Be sure to mention which project the bug was noticed in and if there is a deadline that the fix is needed for.

AI-generated code can be accepted as a contribution to this project as long as the contributor adheres to the following guidance.

When using AI coding assistants (such as GitHub Copilot, ChatGPT, Claude, or other similar tools) to help with development work on PatternFly React, please follow these guidelines to ensure code quality, security, and transparency:

1. Verify and validate AI-generated code.

   • Treat AI-generated code as suggestions, not final code. Review all generated code and modify as appropriate. Thoroughly review and test all code that you intend to integrate into your work.

   • Do not automatically trust the code assistant output. Always apply your own judgment and expertise. AI coding assistants can introduce security vulnerabilities if not used carefully, and AI models can sometimes hallucinate and provide incorrect or non-functional code.

   • Make sure you thoroughly understand any AI-generated code. If the generated code you intend to incorporate in your work is outside your expertise, consult with someone knowledgeable in the area prior to making it available to others.

2. Mark any substantial AI-generated code portions.

   • Nontrivial and substantial AI-generated or AI-assisted content should be "marked", using one of the following approaches:

     • In a commit message, or in a pull request/merge request description field: Identify the code assistant that you used, perhaps elaborating on how it was used. You might also use a trailer like "Assisted-by:" or "Generated-by:". For example:

       Assisted-by: GitHub Copilot Generated-by: ChatGPT for initial component structure

     • In a source file comment: Indicate the use of the code assistant. For example:

       // Generated by GitHub Copilot
       // AI-assisted implementation with human review and modifications

3. Review security: Pay special attention to security implications of AI-generated code, especially when dealing with user input, authentication, or data handling.

4. Test your code: Ensure that AI-generated code is thoroughly tested and meets all existing project standards for testing coverage.

5. Review code style: Verify that AI-generated code follows PatternFly React's coding standards and style guidelines as outlined in this document.

6. Review documentation: If AI assists in generating documentation or comments, review them for accuracy and completeness.

Across our website, you can find PatternFly documentation that explains concepts, provides guidance, and outlines important resources for PatternFly users. Our documentation can always be improved, and we love to hear input from the people who use it.

If you'd like to contribute to documentation, you can refer to our detailed contribution instructions for additional guidance.

Our website documentation is contained in the patternfly-org repository. If you find an issue that you'd like to work on, leave a comment and someone from our team will reach out to you with next steps.

Our design guidelines are found across our component, layout, chart, and pattern web pages. These guides clarify usage details to help designers follow best practices to create strong UI solutions.

If you'd like to contribute to our design guidelines, you can open an issue in patternfly-org to propose a new page or updates to an existing page. From there, our team will work with you to author and publish your new content.