A set of React components for the PatternFly project.
MIT License
642
30
329

PatternFly React

lerna PatternFly 4 npm badge

This project provides a set of React components for the PatternFly project.

Community: PatternFly website | Slack | Medium | Mailing list

Table of contents

  1. PatternFly React packages
  2. Setup
  3. Contribution guidelines
  4. License

Using PatternFly 3? Take a look at the PatternFly 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 UXD supported
  @patternfly/react-log-viewer Virtualized log viewer component
📂 Supporting packages
  @patternfly/react-docs Gatsby documentation site for components
  @patternfly/react-integration Cypress integration tests
👪 Extension packages community supported
  @patternfly/react-catalog-view-extension Catalog view extension
  @patternfly/react-virtualized-extension Table and list row virtualization extension
  @patternfly/react-topology Topology components
  @patternfly/react-console Console components
Deprecated packages
  @patternfly/react-inline-edit-extension Table inline edit extension

Setup

Before you begin, check out this overview 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 to Install 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.

  1. Fork the project
  1. Install the project

    Follow the steps outlined in the PatternFly 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 each library.

Contribution guidelines

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

License

PatternFly React is licensed under the MIT License.

Contributors

patternfly-build
redallen
renovate[bot]
kmcfaul
tlabaj
nicolethoen
boaz0
jeff-phillips-18
dlabrecq
priley86
jschuler
jenny-s51
jessiehuff
evwilkin
karelhala
thatblindgeye
wise-king-sullyman
KKoukiou
dgutride
seanforyou23
DaoDaoNoCode
mturley
dmiller9911
Ron-Lavi
dlabaj
jeffpuzzo
mcoker
jcaianirh
jonkoops
ibolton336
glekner
tompsota
MariaAga
gitdallas
mareklibra
andyyvo
ddonahue007
Dominik-Petrik
TheRealJon
michaelkro
gabipodolnikova
CooperRedhat
AllenBW
bartoval
amarie401
sharvit
dtaylor113
SpyTec
jtomasek
aljesusg
Hyperkid123
suomiy
gefgu
rvsia
josejulio
danseethaler
cdcabrera
jerolimov
kunyan
michpetrov
rhamilto
vojtechszocs
wojta
christianvogt
edonehoo
kev-kim
dabeng
jgiardino
chalettu
christiemolloy
DarrienG
lucasponce
xprazak2
rachael-phillips
samuelatefah
ZitaNemeckova
dependabot[bot]
janwright73
yaacov
gautamkrishnar
bond95
brumik
amirfefer
cben
guillaumevincent
mattnolting
psav
srambach
sjd78
drewamunat2
zanewoodfin
abalakh
chkal
edewit
joeldmyers
LHinson
martinpovolny
mfocko
ohadlevy
shaded-enmity