2019.07 release notes (2019-09-10)

Packages released:


  • Adjusted legend position for axis label (#2763)
  • Added new symbol for dash/threshold (#2884)
  • BulletChart: Added new BulletChart type! (#2708)
  • StackChart: Added monthly vertical stack example (#2625)


  • Accordion: Allow JSX elements for content and toggle (#2713)
  • BackgroundImage: Fix bug on non-Chrome browsers regarding filter's width (#2742)
  • ChipGroup: Added defaultIsOpen prop to allow chip group to be initially expanded (#2651)
  • ClipboardCopy: Updated if children change (#2849)
  • Drawer: Expose DrawerContent components and remove panelContent prop (#2733)
  • Dropdown:
    • Added support for dropdown with primary button toggle (#2857)
    • Allow custom dropdown items (#2890)
  • EmptyState: Fixed a bug where the correct size modifier wasn't being passed (#2692)
  • Expandable: Support uncontrolled expandable (#2649)
  • FormGroup: Fixed a bug where className was not being propogated for non-inline forms (#2864)
  • LoginForm: Username input field is now autofocused (#2659)
  • Modal:
    • Added isFooterLeftAligned prop (#2835)
    • Added appendTo prop so component can render in element other than document.body (#2802)
    • FocusTrap works with showClose being false (#2774)
  • Nav: Added dark theme modifier flag (#2856)
  • OptionsMenu: Now uses our Dropdown component and is consistent with it (#2299)
  • Page: Added dark theme modifier flag (#2856)
  • Select:
    • Allow creating new select items (#2820)
    • Added support for toggle icon (#2748)
    • Added direction prop (#2611)
  • Spinner: Added new experimental Spinner component! (#2858)
  • Switch: Changed checked property in DOM (#2749)
  • Tab: Allow JSX elements for Tab title (#2681)
  • TextArea: Support defaultValue attribute for uncontrolled TextArea (#2712)
  • Toolbar: Added new experimental Toolbar component! (#2861)
  • Tooltip:
    • Allow passing properties through to PopoverBase and hence tippy.js (#2769)
    • Added the manual trigger option with the isVisible prop (#2769)
  • Wizard: Added support for in-page rendering (#2830)


  • Added new visibleOn and hiddenOn breakpoint (#2676)


  • Added Path Missing Icon (#2817)
  • Added Azure and OpenStack icons (#2827)
  • Added Ansible Tower icon to custom icons definition (#2735)
  • Publish configs as well with icons (#2701)

Virtualized Extension

  • Debounce resize event to fix inconsistent grid sizing (#2754)


  • AsyncTypeAheadSelect: Forward ref for AsyncTypeAheadSelect (#2760)
  • CatalogTile:
    • Allow JSX element for CatalogTile's icon (#2771)
    • Added iconAlt property to use for alt text for icon image (#2715)
  • DatePicker: Added new date picker components (#1873)
  • HorizontalNavMenu: Allow HorizontalNavMenuItem's title to be a node (#2825)

2019.06 release notes (2019-08-13)

Packages released:


  • Used vars to enable Red Hat fonts. When the pf-m-redhat-font selector is added to the page, the Red Hat font is expected to be used instead of the default Overpass font. This change ensures that charts and its labels use the Red Hat font as expected (#2584)
  • The donut threshold chart used to generate a 'width must be a non-negative' warning when donutWidth values are zero. This change ensures the dynamic chart size is never less than zero (#2590)
  • Fixed missing fill and stroke colors for area and line charts. Set area.style.data.fill to first color scale value in colorTheme function. Set line.style.data.stroke to first color scale value in colorTheme function (#2626)


  • Accordion: Added the html structure of Accordion to React (#2422)
  • Alert: Added default variant for Alert (#2648)
  • Button: Added 'reset' to types (#2622)
  • Checkbox Updated ids so none repeat. Prevents inconsistent checking behavior when labels are clicked for uncontrolled vs. controlled examples (#2663)
  • Drawer: Added the drawer component to experimental (#2633)
  • Dropdown:
    • Automatically focus first dropdown item when DropdownMenu mounts (#2355)
    • This PR adds an aria-label to the "icon only" example of Dropdown (#2517)
    • Fixed missing event passthrough on internal onSelect callback (#2657)
  • Form: Updated Form demo to use check over radio (#2567)
  • Modal: Allows for custom header and/or footer in Modal component Added the showClose prop, defaulted to true. Set to false to hide the close button (#2120)
  • Page:
    • Skip to content should point to primary content container (#2519)
    • Change the defaultManagedSidebarOpen prop name for consistency (#2664)
  • Pagination:
    • When there is 0 items or negative number for pagination show 0th page out of 0 and disable paginating (#2558)
    • Added a demo of table integrated with pagination (#2601)
    • Fixed pagination to update page count (#2639)
    • Added disabled flag for whole component (#2586)
  • Select:
    • Select menu now has consistent, open behavior on empty text input field (#2572)
    • Added a custom callback for the filtering function used in typeahead variants. This replaces the current search entirely, so the function must handle filtering the list of children/options and return the filtered results for the internal state to update (#2434)
    • Added isPlain variation/prop to Select.tsx, snapshot tests, and integration (#2588)
    • This enhancement allows a user to now pass in a user defined object to store additional data besides just the string value to a select option. The object must have a toString function that is responsible for returning the the localized string (#2612)
    • Disabled focus trap on checkbox select with no children. Focus Trap throws exception if no children to ref. In order to avoid this error, render the component with no Focus Trap when no children is passed (#2647)
    • Added disabled flag to select (#2678)
  • Switch: Added aria-labelledby to input (#2468)
  • Topology: Fixed paddings for topology control bar buttons. Removed css settings that override the paddings for the topology control bar buttons (#2635)


  • Added the wrap modifier to react-table through transforms (#2615)
  • Replaced lodash-es with lodash (#2641)

TypeScript conversion


  • Made name column not wrap (#2583)
  • Small adjustment for Stack layout. Updated the doc to correctly read that isFilled is related to the vertical space occupied, not horizontal (#2605)
  • Link to react-tokens page was broken. Updated to point to the Global CSS Variables page (#2453)
  • Added extension notes to Gatsby docs to improve the Gatsby doc for table extensions and add disclaimer about extension status (#2637)
  • Fixed accessibility issues in Accordion, ClipboardCopy, and DataList (#2634)


  • Chore:
    • Added curl command after release (#2547)
    • Invalidate all packages if yarn.lock changes (#2548)
    • Updated release notes to use uls (#2604)

2019.05 release notes (2019-07-24)

Packages released:

Charts (@patternfly/react-charts@4.7.1)

  • Fixed runtime errors related to theme padding (#2430)
  • Added charts to react-integration tests (#2354)
  • Updated chart theme to use pf-core variables (#2439)
  • Removed invalid pf-core var (#2463)
  • Adjusted pf-core vars & added tooltip examples (#2497)
  • Updated pf-core vars (#2480)
  • Provided an accessible title and description (#2500)
  • Added bottom-left legend position (#2442)
  • Tweaked aria title for area chart (#2510)
  • Replaced prop titleComponent by subTitleComponent on donut charts (#2488)
  • Added individual padding vars for donut charts (#2529)
  • Added new mutil-color theme for ordered charts (#2552)
  • Added fixed point notation into percentage donut charts (#2375)
  • Used vars to enable Red Hat fonts (#2584)

Components (@patternfly/react-core@3.75.2)

  • About modal: AboutModal and Modal both now trap focus in the browser (#2428)
  • Accordion: Added prop to heading level of parent component (#2290)
  • Application launcher: Allowed custom icon for application launcher toggle (#2492)
  • Badge: - Temporarily disabled problematic badges (#2530) - Added space between badges in the examples (#2556)
  • Breadcrumb switcher: Fixed Autocomplete camelCase (#2457)
  • Datalist: Added hidden and visible breakpoints (#2251)
  • Dropdown: Provided option to not autofocus on first item (#2473)
  • Empty state: Updated EmptyStateBody to use div instead of p (#2499)
  • Experimental features: Added POC for experimental button and badge (#2363)
  • Gallery: Converted gallery to TypeScript (#2432)
  • Login page: Removed ariaLabel from checkbox (#2455)
  • Modal: Modal now traps screen reader focus (#2406)
  • Options menu: Updated examples to trigger select on the whole item (#2513)
  • Pagination: - Dropdown closes on click outside of menu area (#2235) - Added ability to allow users to enter numbers into the input field (#2417)
  • Select: - Removed ariaLabel from grouped checkbox select (#2456) - Added optional display via children to option (#2419) - Updated typeahead filtered list when children change (#2518)
  • Switch: Added OUIA compatibility to Switch (#2304)
  • Tabs: - Allowed eventKey to accept a string (#2493) - Implemented overflow styles for secondary tabs (#2512)
  • Tooltip: Added support for aria prop from Tippy library (#2539)

TypeScript conversion

Table (@patternfly/react-table@2.14.23)

  • Checked empty array in areAllRowsSelected (#2527)
  • Added exports for compoundExpand (#2554)

Styles (@patternfly/react-styles@3.5.7)

  • Added pickProperties to react-styles utils exports (#2481)


  • Updated link to react-tokens page in the readme (#2453)


  • Build: - Added PR comment on publishing to NPM (#2433) - Added Windows support (#2471)
  • Chore: - Removed tippy-react dependency (#2505) - Updated react-docs to use Red Hat font (#2563)
  • Unit tests: Fixed keyHandler tests in util.test.js (#2489)

2019.04 release notes (2019-07-02)

Packages released:

Charts (@patternfly/react-charts@4.4.7)

  • Added sparkline example and interpolation to area examples (#2373)
  • Fixed themes for bar chart default colors (#2112)
  • DonutThreshold: No longer show static threshold donut tooltips by default (#2270)
  • Added support for legends and grids (#2324)

Components (@patternfly/react-core@3.58.1)

  • About modal: Changed strapline element to paragraph (#2376)
  • Breadcrumb switcher: Disabled autocomplete (#2407)
  • Card: Addedcompacted card variation (#2399)
  • Checkbox: Added 3rd state to checkbox controlled by consumer (#2252)
  • Chip group: Added heading level prop to toolbar chip group label (#2278)
  • Data list: Added DataListRow to imports (#2353)
  • Dropdown: Automatically focused first dropdown item when DropdownMenu (#2355)
  • Expandable: Added button type to the expandable component (#2340)
  • Label: Added TypeScript flag to the label docs (#2343)
  • Notification badge: Added the notification badge component (#2342)
  • Options menu: Added disabled modifier to the toggle (#2401)
  • Page: Added page section main nav type variant (#2268)
  • Radio: Fixed warning from undefined starting params (#2292)
  • Form: - Updated text in form component (#2352) - Wrapped form label text in new element (#2322)
  • Grid: - Removed size props from {...props} (#2404) - Updated grid layout to support new 2xl breakpoint (#2305)
  • Tabs: - Fixed TypeScript errors and revert TabContainer to a component (#2402) - Remove comment from code (#2351) - Made variant prop optional (#2348)

TypeScript conversion

2019.03 release notes (2019-06-11)

Packages released:

Charts (@patternfly/react-charts@4.1.5)

  • Major bump react-charts (#2143)
  • Changed default Chart padding property to show axis
  • Refactored ChartTheme colors and utils for donut utilization theme
  • ChartLegend now defaults to be responsive
  • Aligned label vertically and added donutHeight/Width defaults (#2193)
  • Added examples on how to use VictoryZoomContainer (#1879)
  • Apply defaults to custom legend (#2194)
  • Chart & ChartStack to use ReactNode as children type (#2155)
  • Remove ChartThemeDefinition export from index.ts (#2149)

Components (@patternfly/react-core@3.38.1)

  • About modal: Support isOpen initially set true in about modal. This ensures the about modal container exists on initial load if isOpen is passed true with children contents initially (#2153)
  • Navigation: On NavItems, Maintain className passed to custom NavItems. Keeps classNames set on the child of a custom NavItem (#2134)
  • Pagination: When empty array is sent to pagination now no per page is visible. It is now possible with Per page option to hide by passing empty array of per page options (#2175)
  • Select: Added keyboard interaction to typeahead variants, other variants remained unchanged. Enter, with select closed, toggles open the menu. Focus should now remains on input. Arrow up and down navigates the options with a focus styling. Enter, with select opened, selects the highlighted item (#2013)
  • Tabs: Fixed tabs ref proptype (#2158)

Table (@patternfly/react-table@2.11.1)

  • Added React-Virtualized PF4 tables (#2011)
  • Exported RowWrapper implementation (#2118)
  • Some props of IRow should not required Makes following props of IRow to optional isOpen parent props (#2196)
  • Fixed error Unknown event handler property onCollapse. Removed rows and onCollapse from ...props (#2195)
  • Added support for .pf-m-grid-2xl breakpoint. Added breakpoint to list of available breakpoints and updated snapshot (#2206)
  • Reverted bodywrapper conversion to stateless-function (#2161)

Topology (@patternfly/react-topology)

  • Added @patternfly/react-topology package (#2170)
  • Fixed esm output and converted react-virtualized-extension to TS (#2190)

Styles (@patternfly/react-styles@3.3.3)

  • Changed all the React css imports and added types for them. Instead of using a babel plugin to generate the JS at compile time for our CSS-in-JS solution, we statically generate it beforehand in react-styles (#2085)
  • Bumped jsdom (#2080)
  • Added sideeffects to react-styles (#2207)

TypeScript conversion

2019.02 release notes (2019-06-05)

Packages released:

Components (@patternfly/react-core@3.34.2)

  • About Modal: Provided a way to set the background using props (#1940)
  • Accordion: Added accordion component (#1511)
  • Background Image: Fixed background image spacing issue (#1923)
  • Card: Added card is-hoverable modifier prop (#1852)
  • Checkbox: Set checked value correctly (#1929)
  • Copy to Clipboard: Fixed docs (#1821) - Changed doc text (#1823) - Removed textarea from clipboard copy (#1840)
  • Dropdown: Renamed toggle export (#1861)
  • Grid: Added missing props in d.ts (#1749)
  • Icons: Added font awesome brands icons(#1669)
  • Popover: - Updated Popover max width. We made maxWidth optional (#2110) - Enabled highlighting and selecting text in popover (#1757) - Handled on enter focusing when options are disabled (#2025) - Changed PopoverPosition from a const to an enum. This allows users to specify their choice of a string or object property for the position property value on Popover component. Also adds a test that exercises this method to ensure it doesn't regress going forward (#2113)
  • Select: - Updated the SelectProps interface to avoid a type error when importing react-core into a TypeScript application. I also removed some unnecessary code in a couple of the demo's I followed recently. Copying the code as is was creating an error. I think they were safe deletions but worth double checking (#2107) - Fixed ListGroupItem import (#1867) - Added user personalized icon in Select component (#1768)

Charts @patternfly/react-charts@3.6.4

  • Introduced Donut utilization chart and thresholds (#2064)
  • Added example styles (#1889)
  • Fixed chart font stack to use PatternFly core sans-serif font stack (#1865)
  • Refactored themes for bar chart default colors (#2112)
  • Added default for component props (#2103)


  • Use frontmatter for what props to show in docs (#2072)
  • If you add new imports to your MDX file, rerun yarn develop which now clears the gatsby-mdx cache and lets you be on your merry way (#2059)
  • Hide inherited TypeScript props (#1866)
  • Use MDX for docs (#1753)
  • Reverted bodywrapper conversion to stateless-function (#2161)

TypeScript conversion

Packages released: We are in the process of converting all components to TypeScript to provide better types for consumers. The following components have been converted:

2019.01 release notes (2019-05-02)

We don't have notes for this release yet.