Folders and files

Name		Name	Last commit message	Last commit date
Latest commit History 7,685 Commits
.github		.github
.husky		.husky
packages		packages
scripts		scripts
.editorconfig		.editorconfig
.eslintrc-md.json		.eslintrc-md.json
.gitattributes		.gitattributes
.gitignore		.gitignore
.prettierrc		.prettierrc
.yarnrc.yml		.yarnrc.yml
CONTRIBUTING.md		CONTRIBUTING.md
GETTING-STARTED.md		GETTING-STARTED.md
LICENSE		LICENSE
README.md		README.md
babel.config.js		babel.config.js
eslint.config-md.mjs		eslint.config-md.mjs
eslint.config.mjs		eslint.config.mjs
jest.config.ts		jest.config.ts
lerna.json		lerna.json
package.json		package.json
plopfile.mjs		plopfile.mjs
test.setup.ts		test.setup.ts
yarn.lock		yarn.lock

Repository files navigation

PatternFly React

This project provides a set of React components for thePatternFly project.

Community:PatternFly website |Slack |Medium |Mailing list

Using PatternFly 3? Take a look at thePatternFly 3 React component information.

PatternFly React packages

Package link	Description
💙 Core packages
@patternfly/react-core	Core set of components
@patternfly/react-table	Table components
@patternfly/react-charts	Chart components
@patternfly/react-icons	Icon components
@patternfly/react-styles	PatternFly CSS styles
@patternfly/react-tokens	PatternFly CSS variable tokens
💛 Extension packages
@patternfly/react-log-viewer	Virtualized log viewer component
@patternfly/react-catalog-view-extension	Catalog view extension
@patternfly/react-topology	Topology components
📂 Supporting packages
@patternfly/react-docs	Gatsby documentation site for components
@patternfly/react-integration	Cypress integration tests
❌ Deprecated packages
@patternfly/react-virtualized-extension	Table and list row virtualization extension

Setup

Before you begin, check out thisoverview of PatternFly to get familiar with the basic elements of the design system.

Install a package manager

Install a package manager before using the PatternFly libraries.

Start with PatternFly React seed

If you want to start with your existing project, skip toInstall and configure PatternFly React.

PatternFly React seed is an open source build scaffolding utility. It gives developers a jump-start when creating new projects that will use PatternFly.

Fork the project

TypeScript:Fork and clone the PatternFly React Seed project.
#"https://github.com/patternfly/patternfly-react-seed/tree/javascript">Fork and clone the JavaScript branch of the PatternFly React Seed project.
For more information about how to fork and clone a repo,view GitHub Help.

Install the project
Follow the steps outlined in thePatternFly React Seed README to install.

Install and configure PatternFly React

Using npm, run the following command to install:
```
npm install @patternfly/react-core --save
```
OR
Using yarn, run the following command to install:
```
yarn add @patternfly/react-core
```
Once the library is installed, use the specific setup instructions for that library to access the components it contains. These can be found in the readme for eachlibrary.

Contribution guidelines

All React contributors must first bePatternFly community contributors. If you're already a PatternFly community contributor, check out theReact contribution guidelines to make React contributions.