chore(update): update patternfly-next dependencies

package.json

@@ -158,4 +158,4 @@
   "resolutions": {
     "cssom": "0.3.4"
   }
-}
+}

packages/patternfly-4/react-charts/package.json

@@ -46,7 +46,7 @@
     "victory": "^30.1.0"
   },
   "devDependencies": {
-    "@patternfly/patternfly-next": "1.0.148",
+    "@patternfly/patternfly-next": "1.0.167",
     "css": "^2.2.3",
     "fs-extra": "^6.0.1",
     "glob": "^7.1.2",

packages/patternfly-4/react-core/build/copyStyles.js

@@ -34,6 +34,7 @@ ast.stylesheet.rules = ast.stylesheet.rules.filter(rule => {
 });
 
 copySync(join(pfDir, 'assets/images'), join(stylesDir, 'assets/images'));
+copySync(join(pfDir, 'assets/pficon'), join(stylesDir, 'assets/pficon'));
 copySync(join(pfDir, 'assets/fonts'), join(stylesDir, 'assets/fonts'), {
   filter(src) {
     return !ununsedFontFilesRegExt.test(src);

packages/patternfly-4/react-core/package.json

@@ -27,7 +27,7 @@
   },
   "homepage": "https://github.com/patternfly/patternfly-react#readme",
   "dependencies": {
-    "@patternfly/react-icons": "^2.10.3",
+    "@patternfly/react-icons": "^2.10.2",
     "@patternfly/react-styles": "^2.3.0",
     "@patternfly/react-tokens": "^1.10.1",
     "@tippy.js/react": "^1.1.1",
@@ -42,9 +42,9 @@
   "scripts": {
     "build": "yarn build:babel && yarn build:generate:dts && yarn build:tsd:copy && yarn build:umd",
     "build:babel": "concurrently \"yarn build:babel:cjs\" \"yarn build:babel:esm\"",
-    "build:babel:cjs": "cross-env BABEL_ENV=production:cjs babel src --out-dir dist/js --extensions \".css,.js,jsx,.ts,.tsx\"",
-    "build:babel:esm": "cross-env BABEL_ENV=production:esm babel src --out-dir dist/esm --extensions \".css,.js,jsx,.ts,.tsx\"",
-    "build:umd": "cross-env BABEL_ENV=production:umd babel dist/esm --out-dir dist/umd --plugins transform-es2015-modules-umd --extensions \".css,.js,jsx,.ts,.tsx\"",
+    "build:babel:cjs": "cross-env BABEL_ENV=production:cjs babel src --out-dir dist/js --extensions \".js,jsx,.ts,.tsx\"",
+    "build:babel:esm": "cross-env BABEL_ENV=production:esm babel src --out-dir dist/esm --extensions \".js,jsx,.ts,.tsx\"",
+    "build:umd": "cross-env BABEL_ENV=production:umd babel dist/esm --out-dir dist/umd --plugins transform-es2015-modules-umd --extensions \".js,jsx,.ts,.tsx\"",
     "build:generate:dts": "tsc -p src/tsconfig.dts.json",
     "build:typecheck": "tsc",
     "build:tsd:copy": "node ./scripts/copyTS.js",
@@ -62,7 +62,7 @@
     "@babel/preset-env": "^7.0.0",
     "@babel/preset-react": "^7.0.0",
     "@babel/preset-typescript": "^7.0.0",
-    "@patternfly/patternfly-next": "1.0.148",
+    "@patternfly/patternfly-next": "1.0.167",
     "@types/enzyme": "^3.1.15",
     "@types/jest": "^23.3.10",
     "@types/prop-types": "^15.5.6",

packages/patternfly-4/react-core/src/components/DataList/DataList.js

@@ -1,7 +1,7 @@
 import React from 'react';
 import { css } from '@patternfly/react-styles';
 import PropTypes from 'prop-types';
-import styles from '@patternfly/patternfly-next/components/DataList/styles.css';
+import styles from '@patternfly/patternfly-next/components/DataList/data-list.css';
 import boxShStyles from '@patternfly/patternfly-next//utilities/BoxShadow/box-shadow.css';
 
 const DataList = ({ children, className, 'aria-label': ariaLabel, ...props }) => (

packages/patternfly-4/react-core/src/components/DataList/DataListAction.js

@@ -1,7 +1,7 @@
 import React from 'react';
 import { css } from '@patternfly/react-styles';
 import PropTypes from 'prop-types';
-import styles from '@patternfly/patternfly-next/components/DataList/styles.css';
+import styles from '@patternfly/patternfly-next/components/DataList/data-list.css';
 import { EllipsisVIcon } from '@patternfly/react-icons';
 import { Button } from '../Button';
 

packages/patternfly-4/react-core/src/components/DataList/DataListCell.js

@@ -1,7 +1,7 @@
 import React from 'react';
 import { css, getModifier } from '@patternfly/react-styles';
 import PropTypes from 'prop-types';
-import styles from '@patternfly/patternfly-next/components/DataList/styles.css';
+import styles from '@patternfly/patternfly-next/components/DataList/data-list.css';
 
 const DataListCell = ({ children, className, width, ...props }) => (
   <div

packages/patternfly-4/react-core/src/components/DataList/DataListCheck.js

@@ -1,7 +1,7 @@
 import React from 'react';
 import { css } from '@patternfly/react-styles';
 import PropTypes from 'prop-types';
-import styles from '@patternfly/patternfly-next/components/DataList/styles.css';
+import styles from '@patternfly/patternfly-next/components/DataList/data-list.css';
 import checkboxStyles from '@patternfly/patternfly-next/components/Check/check.css';
 
 const DataListCheck = ({ className, onChange, isValid, isDisabled, isChecked, checked, ...props }) => (

packages/patternfly-4/react-core/src/components/DataList/DataListContent.js

@@ -1,7 +1,7 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import { css } from '@patternfly/react-styles';
-import styles from '@patternfly/patternfly-next/components/DataList/styles.css';
+import styles from '@patternfly/patternfly-next/components/DataList/data-list.css';
 
 const DataListContent = ({ className, children, isHidden, 'aria-label': ariaLabel, ...props }) => (
   <section

packages/patternfly-4/react-core/src/components/DataList/DataListItem.js

@@ -1,7 +1,7 @@
 import React from 'react';
 import { css } from '@patternfly/react-styles';
 import PropTypes from 'prop-types';
-import styles from '@patternfly/patternfly-next/components/DataList/styles.css';
+import styles from '@patternfly/patternfly-next/components/DataList/data-list.css';
 
 const DataListItem = ({ children, className, isExpanded, 'aria-labelledby': ariaLabelledBy, ...props }) => (
   <li

packages/patternfly-4/react-core/src/components/DataList/DataListToggle.js

@@ -2,7 +2,7 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import { css } from '@patternfly/react-styles';
 import { AngleRightIcon } from '@patternfly/react-icons';
-import styles from '@patternfly/patternfly-next/components/DataList/styles.css';
+import styles from '@patternfly/patternfly-next/components/DataList/data-list.css';
 import { Button } from '../Button';
 
 const DataListToggle = ({

packages/patternfly-4/react-core/src/components/Dropdown/__snapshots__/Dropdown.test.js.snap

@@ -24,8 +24,8 @@ exports[`KebabToggle basic 1`] = `
   color: #282d33;
   text-align: left;
   white-space: nowrap;
+  background-color: transparent;
   text-decoration: none;
-  background-color: #ededed;
 }
 .pf-c-dropdown__menu {
   display: block;
@@ -1845,8 +1845,8 @@ exports[`dropdown basic 1`] = `
   color: #282d33;
   text-align: left;
   white-space: nowrap;
+  background-color: transparent;
   text-decoration: none;
-  background-color: #ededed;
 }
 .pf-c-dropdown__menu {
   display: block;

packages/patternfly-4/react-core/src/components/Form/__snapshots__/FormGroup.test.js.snap

@@ -107,7 +107,7 @@ exports[`FormGroup component should render form group invalid variant 1`] = `
 .pf-c-form__helper-text.pf-m-error {
   display: block;
   font-size: 0.875rem;
-  color: #a30000;
+  color: #cc0000;
 }
 .pf-c-form__group {
   display: block;

packages/patternfly-4/react-core/src/components/LoginPage/LoginFooterItem.js

@@ -1,6 +1,4 @@
 import React from 'react';
-import styles from '@patternfly/patternfly-next/components/Login/login.css';
-import { css } from '@patternfly/react-styles';
 import PropTypes from 'prop-types';
 
 const propTypes = {
@@ -26,11 +24,9 @@ const defaultProps = {
 const LoginFooterItem = ({ className, children, href, target, ...props }) => {
   const reactElement = React.isValidElement(children);
   return reactElement ? (
-    React.cloneElement(children, {
-      className: css(styles.loginFooterLink, className)
-    })
+    React.cloneElement(children)
   ) : (
-    <a className={css(styles.loginFooterLink, className)} target={target} href={href} {...props}>
+    <a target={target} href={href} {...props}>
       {children}
     </a>
   );

packages/patternfly-4/react-core/src/components/LoginPage/__snapshots__/LoginFooterItem.test.js.snap

@@ -1,26 +1,11 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`LoginFooterItem  with custom node 1`] = `
-.pf-c-login__footer-link {
-  display: block;
-  color: #ffffff;
-}
+exports[`LoginFooterItem  with custom node 1`] = `<CustomNode />`;
 
-<CustomNode
-  className="pf-c-login__footer-link"
-/>
-`;
-
-exports[`className is added to the root element 1`] = `"pf-c-login__footer-link extra-class"`;
+exports[`className is added to the root element 1`] = `undefined`;
 
 exports[`renders with PatternFly Core styles 1`] = `
-.pf-c-login__footer-link {
-  display: block;
-  color: #ffffff;
-}
-
 <a
-  className="pf-c-login__footer-link"
   href="#"
   target="_self"
 />

packages/patternfly-4/react-core/src/components/LoginPage/__snapshots__/LoginMainBody.test.js.snap

@@ -5,7 +5,9 @@ exports[`className is added to the root element 1`] = `"pf-c-login__main-body ex
 exports[`renders with PatternFly Core styles 1`] = `
 .pf-c-login__main-body {
   display: block;
-  padding: 2rem 3rem 2rem 3rem;
+  padding-right: 2rem;
+  padding-bottom: 2rem;
+  padding-left: 2rem;
 }
 
 <div

packages/patternfly-4/react-core/src/components/LoginPage/__snapshots__/LoginMainFooter.test.js.snap

@@ -4,8 +4,8 @@ exports[`className is added to the root element 1`] = `"pf-c-login__main-footer
 
 exports[`renders with PatternFly Core styles 1`] = `
 .pf-c-login__main-footer {
-  display: block;
-  padding: 2rem 3rem 4rem 3rem;
+  display: flex;
+  flex-wrap: wrap;
 }
 
 <div

packages/patternfly-4/react-core/src/components/LoginPage/__snapshots__/LoginMainHeader.test.js.snap

@@ -5,9 +5,9 @@ exports[`className is added to the root element 1`] = `"pf-c-login__main-header
 exports[`renders with PatternFly Core styles 1`] = `
 .pf-c-login__main-header {
   display: grid;
-  grid-template-columns: auto 1fr;
+  grid-template-columns: 1fr auto;
   align-items: center;
-  padding: 3rem 3rem 1rem 3rem;
+  padding: 3rem 2rem 1rem 2rem;
 }
 
 <header

packages/patternfly-4/react-core/src/components/Modal/ModalBoxCloseButton.js

@@ -1,7 +1,5 @@
 import React from 'react';
-import { css } from '@patternfly/react-styles';
 import PropTypes from 'prop-types';
-import styles from '@patternfly/patternfly-next/components/ModalBox/modal-box.css';
 import { Button } from '../Button';
 import { TimesIcon } from '@patternfly/react-icons';
 
@@ -20,11 +18,11 @@ const defaultProps = {
 };
 
 const ModalBoxCloseButton = ({ className, onClose, ...props }) => (
-  <div {...props} className={css(styles.modalBoxClose, className)}>
-    <Button variant="plain" onClick={onClose} aria-label="Close">
+  <React.Fragment>
+    <Button variant="plain" onClick={onClose} aria-label="Close" {...props}>
       <TimesIcon />
     </Button>
-  </div>
+  </React.Fragment>
 );
 
 ModalBoxCloseButton.propTypes = propTypes;

packages/patternfly-4/react-core/src/components/Modal/ModalBoxHeader.js

@@ -1,7 +1,6 @@
 import React from 'react';
-import { css } from '@patternfly/react-styles';
 import PropTypes from 'prop-types';
-import styles from '@patternfly/patternfly-next/components/ModalBox/modal-box.css';
+import Title from '../Title/Title';
 
 const propTypes = {
   /** content rendered inside the Header */
@@ -18,9 +17,11 @@ const defaultProps = {
 };
 
 const ModalBoxHeader = ({ children, className, ...props }) => (
-  <header {...props} className={css(styles.modalBoxHeader, className)}>
-    <h1 className={css(styles.modalBoxHeaderTitle)}>{children}</h1>
-  </header>
+  <React.Fragment>
+    <Title size="2xl" {...props}>
+      {children}
+    </Title>
+  </React.Fragment>
 );
 
 ModalBoxHeader.propTypes = propTypes;

packages/patternfly-4/react-core/src/components/Modal/__snapshots__/ModalBox.test.js.snap

@@ -6,9 +6,10 @@ exports[`ModalBox Test 1`] = `
   position: relative;
   z-index: 600;
   flex-direction: column;
-  max-width: calc(100% - 1rem - 1rem);
-  min-height: calc(undefined + undefined + undefined + undefined + undefined + undefined + calc(1rem * 4 * 1.5));
+  width: 100%;
+  max-width: calc(100% - undefined - undefined);
   max-height: calc(100vh - 3rem);
+  padding: 2rem 2rem 2rem 2rem;
   background-color: #ffffff;
   border: 1px solid transparent;
   box-shadow: 0 0.1875rem 0.4375rem 0.1875rem rgba(3, 3, 3, 0.13), 0 0.6875rem 1.5rem 1rem rgba(3, 3, 3, 0.12);
@@ -31,9 +32,10 @@ exports[`ModalBox Test isLarge 1`] = `
   position: relative;
   z-index: 600;
   flex-direction: column;
-  max-width: calc(100% - 1rem - 1rem);
-  min-height: calc(undefined + undefined + undefined + undefined + undefined + undefined + calc(1rem * 4 * 1.5));
+  width: 100%;
+  max-width: calc(100% - undefined - undefined);
   max-height: calc(100vh - 3rem);
+  padding: 2rem 2rem 2rem 2rem;
   background-color: #ffffff;
   border: 1px solid transparent;
   box-shadow: 0 0.1875rem 0.4375rem 0.1875rem rgba(3, 3, 3, 0.13), 0 0.6875rem 1.5rem 1rem rgba(3, 3, 3, 0.12);
@@ -56,9 +58,10 @@ exports[`ModalBox Test isOpen 1`] = `
   position: relative;
   z-index: 600;
   flex-direction: column;
-  max-width: calc(100% - 1rem - 1rem);
-  min-height: calc(undefined + undefined + undefined + undefined + undefined + undefined + calc(1rem * 4 * 1.5));
+  width: 100%;
+  max-width: calc(100% - undefined - undefined);
   max-height: calc(100vh - 3rem);
+  padding: 2rem 2rem 2rem 2rem;
   background-color: #ffffff;
   border: 1px solid transparent;
   box-shadow: 0 0.1875rem 0.4375rem 0.1875rem rgba(3, 3, 3, 0.13), 0 0.6875rem 1.5rem 1rem rgba(3, 3, 3, 0.12);

packages/patternfly-4/react-core/src/components/Modal/__snapshots__/ModalBoxBody.test.js.snap

@@ -3,8 +3,8 @@
 exports[`ModalBoxBody Test 1`] = `
 .pf-c-modal-box__body {
   display: block;
-  padding: 0.5rem 2rem 0.5rem 2rem;
-  margin-top: 2rem;
+  min-height: calc(1rem * 1.5);
+  max-height: 22.5rem;
   overflow-x: hidden;
   overflow-y: auto;
   word-break: break-word;

packages/patternfly-4/react-core/src/components/Modal/__snapshots__/ModalBoxCloseButton.test.js.snap

@@ -1,16 +1,7 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`ModalBoxCloseButton Test 1`] = `
-.pf-c-modal-box__close {
-  display: block;
-  position: absolute;
-  top: 0.5rem;
-  right: 1rem;
-}
-
-<div
-  className="pf-c-modal-box__close"
->
+<React.Fragment>
   <Button
     aria-label="Close"
     className=""
@@ -30,5 +21,5 @@ exports[`ModalBoxCloseButton Test 1`] = `
       title={null}
     />
   </Button>
-</div>
+</React.Fragment>
 `;

packages/patternfly-4/react-core/src/components/Modal/__snapshots__/ModalBoxFooter.test.js.snap

@@ -4,7 +4,7 @@ exports[`ModalBoxFooter Test 1`] = `
 .pf-c-modal-box__footer {
   display: flex;
   align-items: center;
-  padding: 2rem 2rem 2rem 2rem;
+  margin-top: 2rem;
 }
 
 <div

packages/patternfly-4/react-core/src/components/Modal/__snapshots__/ModalBoxHeader.test.js.snap

@@ -1,24 +1,13 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`ModalBoxHeader Test 1`] = `
-.pf-c-modal-box__header-title {
-  display: block;
-  font-size: 1.75rem;
-  font-weight: 400;
-  line-height: 1.3;
-}
-.pf-c-modal-box__header {
-  display: block;
-  padding: 2rem 2rem 0.5rem 2rem;
-}
-
-<header
-  className="pf-c-modal-box__header"
->
-  <h1
-    className="pf-c-modal-box__header-title"
+<React.Fragment>
+  <Title
+    className=""
+    headingLevel="h1"
+    size="2xl"
   >
     This is a ModalBox header
-  </h1>
-</header>
+  </Title>
+</React.Fragment>
 `;