patternfly-react

This package provides Core PatternFly React components for PatternFly 3.

Prerequisite

Node Environment

This project currently supports Node Active LTS releases. Please stay current with Node Active LTS when developing patternfly-react.

For example, to develop with Node 8, use the following:

nvm install 10
nvm use 10

This project also requires a Yarn version of >=1.6.0. The latest version can be installed here.

Installing

yarn add patternfly-react

or

npm install patternfly-react --save

Usage

import { Alert } from 'patternfly-react';

Styling with LESS:

Example with LESS:

@import "~bootstrap/less/variables";
@import "~patternfly/dist/less/variables";
@import "~patternfly-react/dist/less/patternfly-react.less";

Using patterfly-react Sass files

As an alernative to consuming the patternfly-react.css file (found in dist/css), you can build patternfly-react styles into your css by including the Sass partials from dist/sass. The partial _patternfly-react.scss will pull in all the partials required for the patternfly-react components. When using the patternfly-react Sass files, you MUST include bootstrap and patternfly variables and mixins. An example of the required imports can be found in patternfly-react.scss.

Building

yarn build

Note the build scripts for this are located in the root package.json under yarn build.

Testing

Testing is done at the root of this repo. To only run the patternfly-react tests:

yarn test packages/patternfly-react

Publishing

yarn publish

Storybook UI Development

This project uses React Storybook to test and demo new PaternFly 3React UI components. You can view our current storybook here.

How to use Storybook locally:

yarn install
yarn start

Change Log

All notable changes to this project will be documented in this file. See Conventional Commits for commit guidelines.

2.40.0 (2021-10-18)

Features

• patternfly-react: minor bump (#6473) (8046195)

2.39.18 (2021-10-14)

Bug Fixes

• pf3: replace recompose with react-recompose (#6429) (69ed2b2)

2.39.17 (2020-09-29)

Bug Fixes

• Do not handle modified clicks on VerticalNav links (#4747) (679a1fe)

2.39.16 (2020-05-20)

Bug Fixes

• patternfly-react: remove side effects (#4273) (7ba1ed4)

2.39.15 (2020-03-03)

Note: Version bump only for package patternfly-react

2.39.14 (2020-02-06)

Bug Fixes

• Slider: Add limit for lowest possible value of slider (#3660) (124210a), closes #3187

2.39.13 (2020-01-14)

Bug Fixes

• datetimepicker: try using toLocaleTimeString (#3506) (93fc971)

2.39.12 (2020-01-09)

Note: Version bump only for package patternfly-react

2.39.11 (2020-01-06)

Note: Version bump only for package patternfly-react

2.39.10 (2019-12-16)

Note: Version bump only for package patternfly-react

2.39.9 (2019-11-19)

Bug Fixes

• DonutChart: Put back secondary title when showing percentage (#3299) (592ef2d)

2.39.8 (2019-11-15)

Bug Fixes

• DateTimePicker: Properly import formatTime to DateTimePicker (#3303) (4b5b538)

2.39.7 (2019-11-05)

Note: Version bump only for package patternfly-react

2.39.6 (2019-10-21)

Note: Version bump only for package patternfly-react

2.39.5 (2019-10-16)

Bug Fixes

• Cards: refactor sub-component references (#2935) (17a51ff), closes patternfly/patternfly-react#2931

2.39.4 (2019-10-02)

Note: Version bump only for package patternfly-react

2.39.3 (2019-09-25)

Bug Fixes

• storybook: change addWithInfo to add (#3003) (1ec7263)

2.39.2 (2019-09-25)

Note: Version bump only for package patternfly-react

2.39.1 (2019-09-24)

Bug Fixes

• HorizontalNavMenuItem: Fix onItemClick PropType. (#2984) (90e1792)

2.39.0 (2019-09-19)

Features

• DateTimePicker: Add DateTimePicker component (#1420) (69107e1)

2.38.2 (2019-09-17)

Bug Fixes

• LoginPage: Add attributes to the submit button (#2682) (26320f3)

2.38.1 (2019-09-09)

Bug Fixes

• HorizontalNavMenuItem: Allow HorizontalNavMenuItem's title to be a node. (#2825) (78adfa4)

2.38.0 (2019-09-06)

Features

• component: Add Date Picker component (#1873) (5f6b467)

2.37.1 (2019-08-30)

Note: Version bump only for package patternfly-react

2.37.0 (2019-08-26)

Features

• AsyncTypeAheadSelect: pass reference to inner component (#2760) (5f99560)

2.36.10 (2019-08-26)

Note: Version bump only for package patternfly-react

2.36.9 (2019-08-12)

Bug Fixes

• ExpandCollapse: Add onToggle callback so that state of the component can be controlled externally (#2628) (d97dcfc), closes #2610

2.36.8 (2019-08-05)

Bug Fixes

• react-virtualized: move react-virtualized to peerDependency (#2643) (8c3c3ed)

2.36.7 (2019-07-24)

Bug Fixes

• Donut Chart: Add fixed point notation into percentage donut charts (#2375) (937d2d7)

2.36.6 (2019-07-09)

Bug Fixes

• pf3-react: add .css back to LESS import (#2491) (c577d2b)

2.36.5 (2019-07-09)

Bug Fixes

• BreadCrumbSwitcher: Fix Autocomplete camelCase (#2457) (eb3e23a)

2.36.4 (2019-07-08)

Bug Fixes

• build: make pf3/pf4 build on windows (#2471) (5bbc4a2)

2.36.3 (2019-07-01)

Bug Fixes

• BreadCrumbSwitcher: disable autocomplete (#2407) (16e4504)

2.36.2 (2019-06-19)

Note: Version bump only for package patternfly-react

2.36.1 (2019-06-10)

Note: Version bump only for package patternfly-react

2.36.0 (2019-06-05)

Features

• react-styles: move react styles (#2085) (81d1ed2)
• VictoryZoomContainer: Give examples of Victory Zoom component to allow zo… (#1879) (235c174), closes #1715

2.35.1 (2019-05-31)

Note: Version bump only for package patternfly-react

2.35.0 (2019-05-31)

Features

• component: Add Time Picker component (#1875) (00996e9)

2.34.4 (2019-05-29)

Bug Fixes

• index.js: [PF3] Export BreadcrumbSwitcher from patternfly-react index (#2097) (132ccf8)

2.34.3 (2019-05-20)

Bug Fixes

• HorizontalNav: Horizontal nav is not exported for build. (#2041) (2b04c04), closes #2040

2.34.2 (2019-05-17)

Note: Version bump only for package patternfly-react

2.34.1 (2019-05-15)

Bug Fixes

• DualList: add callbacks to Controlled Dual List methods (#1901) (16ac9c2)

2.34.0 (2019-05-15)

Bug Fixes

• DualList: The component shouldn't count, toggle or filter hidden items. (#1930) (85ab2c9)

Features

• LoginPage: support array of alerts (#1974) (a149e52)

2.33.0 (2019-05-13)

Features

• Paginator: Add disableNext,disablePrev Props (#1928) (b0fb965)

2.32.4 (2019-05-08)

Bug Fixes

• DualList: Distinguish between default hidden item to hidden by filterItems that were defaultly set to hidden, shouldn't be modified by the components filter. (#1911) (4d2c0ac)

2.32.3 (2019-05-07)

Bug Fixes

• React Icons documentation: fix React Icons documentation link to all Patternfly React Icons. (#1868) (54d5404), closes #1841

2.32.2 (2019-05-03)

Bug Fixes

• ClickboardCopy: update imports and clean up (#1876) (7a85bfb)
• DualList: fix hidden selects input values to update properly (#1900) (e9c0928)
• DualList: Hide dropdown when no menu items are provided (#1909) (8ed397e)

2.32.1 (2019-04-15)

Bug Fixes

• Update React with changes from core (#1703) (a219cae), closes #1680 #1684 #1684

2.32.0 (2019-03-29)

Bug Fixes

• DataList: set width and isExpanded to optional in d.ts (#1627) (0aa174d)

Features

• BreadcrumbSwitcher: creating a BreadcrumbSwitcher component (#1109) (6ba853f)

2.31.1 (2019-03-20)

Bug Fixes

• VerticalNav: fix attributes for secondary items (#1574) (7d130de)

2.31.0 (2019-03-19)

Features

• ModalPattern: Add ModalPattern and StatefulModalPattern components (#343) (6c3cfac)

2.30.6 (2019-03-13)

Note: Version bump only for package patternfly-react

2.30.5 (2019-03-12)

Note: Version bump only for package patternfly-react

2.30.4 (2019-03-11)

Bug Fixes

• build: Support running the test suite under Windows (#1255) [ci skip] (851756e)
• tsconfig: avatar tsx change (#1535) (8107f5c)

2.30.3 (2019-03-08)

Bug Fixes

• TypeAheadSelect: Fix input height overflow issue without breaking IE11 compatibility (#1369) (0b2905b), closes #1362 #413

2.30.2 (2019-03-08)

Note: Version bump only for package patternfly-react

2.30.1 (2019-03-08)

Note: Version bump only for package patternfly-react

2.30.0 (2019-03-07)

Bug Fixes

• navExpand: remove defaultExpand in favor of just using isExpanded (#1490) (9aafabd)

Features

• VerticalNav: add id, data-id to secondary items (#1495) (8847a65)

2.29.17 (2019-03-05)

Bug Fixes

• TypeAhead: upgrade typeahead to v3.4.1fix #1491 (#1493) (e1a27ef)

2.29.16 (2019-03-04)

Bug Fixes

• LoginPage: remove inputs errors (#1278) (cf789ed)

2.29.15 (2019-02-20)

Note: Version bump only for package patternfly-react

2.29.14 (2019-02-20)

Bug Fixes

• login: Add union types for backgroundImgSrc (#1373) (79b4f20)

2.29.13 (2019-02-15)

Note: Version bump only for package patternfly-react

2.29.12 (2019-02-13)

Bug Fixes

• Login card page: Submit is disabled when input is empty (#1188) (b984fbb)

2.29.11 (2019-02-08)

Note: Version bump only for package patternfly-react

2.29.9 (2019-02-01)

Bug Fixes

• build: Support running npm scripts under Windows (#1251) (df0c275)

2.29.8 (2019-01-25)

Bug Fixes

• Slider: Update state when properties are updated. (#1223) (033a38b)

2.29.7 (2019-01-21)

Bug Fixes

• MessageDialog: conflict between footer and primaryAction props (#1134) (83baeb9)

2.29.6 (2019-01-17)

Bug Fixes

• DualList: fix hidden inputs (#1207) (84942ff)

2.29.5 (2019-01-15)

Note: Version bump only for package patternfly-react

2.29.4 (2019-01-15)

Bug Fixes

• DualList: refactor helpers functions signatures (#1190) (378e44e)

2.29.3 (2019-01-15)

Bug Fixes

• DualList: de-Select items after the transition between lists. (#1178) (91c33bf)

2.29.2 (2019-01-15)

Bug Fixes

• Login Page: fix settings visibility (#1171) (3f79c48)

2.29.1 (2019-01-09)

Note: Version bump only for package patternfly-react

2.29.0 (2019-01-03)

Bug Fixes

• DualList: Adding hidden HTML select inputs to reflect the selector items. (#1095) (59ca4e9)

Features

• ListViewItem: Add initialExpand prop to ListViewItem (#1114) (15ac1b7)

2.28.2 (2018-12-19)

Bug Fixes

• DualList: Add item disability functionality. (#1071) (ddc0e8e)
• DualList: Adding debounce for filter changes (#1078) (7f4c438)
• pf3: fix usage of noop in BulletChart (#1083) (c73490d)
• SocialLoginPage: fix the props provided in SocialLoginPage test. (#1069) (c6c17ac), closes #1068

2.28.0 (2018-12-18)

Features

• BulletChart: Add Thresholds to Legend (#1074) (49c3b94)

2.27.0 (2018-12-18)

Features

• Overlay: Export the Overlay component from react-bootstrap (#1070) (03788f4)

2.26.2 (2018-12-17)

Bug Fixes

• BulletChart: Fix for duplicate key warning on ranges (#1073) (70f8d36)

2.26.1 (2018-12-13)

Note: Version bump only for package patternfly-react

2.26.0 (2018-12-13)

Features

• BulletChart: Allow for custom values (non-percent) and legend text (#1040) (685b400)

2.25.5 (2018-12-11)

Bug Fixes

• BulletChart: Cannot set text property for custom axis tic mark (#1029) (7e58ebf)

2.25.4 (2018-12-07)

Bug Fixes

• LoginPage: add LoginPageCard inner components documentation. (#994) (c00d355)

2.25.3 (2018-11-30)

Bug Fixes

• LoadingState: Add LoadingState component to exports (#881) (#980) (fb1e0e6)

2.25.2 (2018-11-30)

Bug Fixes

• LoadingState: Add LoadingState component to exports (#881) (#980) (fb1e0e6)

2.25.1 (2018-11-27)

Bug Fixes

• Slider: Call onSlide on slide event (#828) (7638f80)

2.25.0 (2018-11-27)

Bug Fixes

• LoginPage: Add submit error callback handling (#952) (44aab83)

Features

• LoadingState: Add LoadingState component (#881) (#886) (d48d45f)

2.24.6 (2018-11-20)

Bug Fixes

• LoginPage: improve form's error style and behavior (#942) (c828b04)

2.24.5 (2018-11-20)

Bug Fixes

• less: convert less variables from scss (#948) (2b5bb71)
• LoginPage: improve the submit UX (#944) (769b67b)

2.24.4 (2018-11-20)

Bug Fixes

• LoginPage: improve the submit UX (#944) (769b67b)

2.24.3 (2018-11-19)

Bug Fixes

• CardDropdownButton: Allow props to be passed (#932) (2ee5117)
• LoginPage: Improve inputs validation. (#936) (60c1067)

2.24.2 (2018-11-19)

Bug Fixes

• CardDropdownButton: Allow props to be passed (#932) (2ee5117)
• LoginPage: Improve inputs validation. (#936) (60c1067)

2.24.1 (2018-11-19)

Bug Fixes

• LoginPage: Fix background-image style (#937) (3307e9b)

2.24.0 (2018-11-15)

Features

• HintBlock: Add the HintBlock component (#922) (92559e6)

2.23.3 (2018-11-15)

Bug Fixes

• subcomponents: Make all subcomponents avaliable from base component (#916) (4c4989b)

2.23.2 (2018-11-14)

Note: Version bump only for package patternfly-react

2.23.1 (2018-11-13)

Bug Fixes

• LoginPage: small fixes. (#911) (55ec079)

2.23.0 (2018-11-13)

Features

• DesktopViewer: introduce DesktopViewer component (#607) (f001ef5)

2.22.5 (2018-11-06)

Bug Fixes

• ModelessOverlay: allow vertical scrolling (#796) (93ed571)

2.22.4 (2018-11-06)

Bug Fixes

• DropdownKebab: Allow title attribute (#885) (be38223)

2.22.3 (2018-11-06)

Bug Fixes

• modal transition: Reduce translate3d (right offset) positioning for right-side-modal-pf to 25% (#878) (5512ff3)

2.22.2 (2018-11-06)

Bug Fixes

• modal transition: Reduce translate3d (right offset) positioning for right-side-modal-pf to 25% (#878) (5512ff3)

2.22.1 (2018-10-30)

Bug Fixes

• Extensions: Fix patternfly-react imports to pull from the default component file. (#860) (bb1afd3)

2.22.0 (2018-10-29)

Features

• helpers: Add exported helpers object containing all helper functions. (#842) (7e42a8b)

2.21.5 (2018-10-24)

Bug Fixes

• ExpandCollapse: Fix to export ALIGN_LEFT and ALIGN_CENTER constants (#826) (94e956a)

2.21.4 (2018-10-18)

Bug Fixes

• Wizard.Pattern: allow disabling cancel button (#801) (8c0cd77)

2.21.3 (2018-10-17)

Bug Fixes

• ModelessOverlay: Fix for animation on open in Firefox browser (#776) (469ab3a), closes #774

2.21.2 (2018-10-16)

Bug Fixes

• Storybook: Fix horizontal masthead examples using iconImg instead of titleImg (#768) (e4af9cf), closes #767

2.21.1 (2018-10-15)

Bug Fixes

• Masthead: fix issue with navbar title not displaying (#758) (e724561)

2.21.0 (2018-10-15)

Features

• ExpandCollapse: introduce ExpandCollapse component (#613) (31eac90)

2.20.3 (2018-10-08)

Note: Version bump only for package patternfly-react

2.20.2 (2018-10-08)

Note: Version bump only for package patternfly-react

2.20.1 (2018-10-08)

Bug Fixes

• Fix #704 (#705) (0b99407)

2.20.0 (2018-10-05)

Features

• a11y: add basic a11y checks with react-axe (#712) (a6458a0), closes #603