Merge pull request #248 from redallen/fix/react-icons

fix(icons): use @patternfly/react-icons
data-driven-forms · Nov 26, 2019 · 33fe0de · 33fe0de
2 parents 276c82e + 536fe98
commit 33fe0de
Show file tree

Hide file tree

Showing 15 changed files with 26 additions and 139 deletions.
diff --git a/packages/pf4-component-mapper/package.json b/packages/pf4-component-mapper/package.json
@@ -23,6 +23,7 @@
     "@babel/preset-react": "^7.0.0",
     "@data-driven-forms/react-form-renderer": "*",
     "@patternfly/react-core": "^3.104.0",
+    "@patternfly/react-icons": "^3.14.23",
     "@semantic-release/git": "^7.0.5",
     "@semantic-release/npm": "^5.1.1",
     "babel-core": "^7.0.0-bridge.0",
@@ -88,8 +89,8 @@
   },
   "dependencies": {
     "@patternfly/patternfly-next": "^1.0.175",
-    "react-select": "^3.0.4",
-    "react-final-form-arrays": "2.0.3"
+    "react-final-form-arrays": "2.0.3",
+    "react-select": "^3.0.4"
   },
   "postpublish": "export RELEASE_DEMO=true"
 }
diff --git a/packages/pf4-component-mapper/src/form-fields/fieldArray/index.js b/packages/pf4-component-mapper/src/form-fields/fieldArray/index.js
@@ -2,8 +2,8 @@ import React, { Fragment } from 'react';
 import PropTypes from 'prop-types';
 import { Grid, GridItem, Bullseye, FormHelperText } from '@patternfly/react-core';
 
-import CloseIcon from '../../icons/close-icon';
-import AddCircleOIcon from '../../icons/add-circle-o-icon';
+import CloseIcon from '@patternfly/react-icons/dist/js/icons/close-icon';
+import AddCircleOIcon from '@patternfly/react-icons/dist/js/icons/add-circle-o-icon';
 
 import './final-form-array.scss';
 

diff --git a/packages/pf4-component-mapper/src/form-fields/select/clear-indicator.js b/packages/pf4-component-mapper/src/form-fields/select/clear-indicator.js
@@ -2,7 +2,7 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import { Button, ButtonVariant } from '@patternfly/react-core';
 
-import TimesCircleIcon from '../../icons/times-circle-icon';
+import TimesCircleIcon from '@patternfly/react-icons/dist/js/icons/times-circle-icon';
 
 const ClearIndicator = ({
   clearValue,

diff --git a/packages/pf4-component-mapper/src/form-fields/select/dropdown-indicator.js b/packages/pf4-component-mapper/src/form-fields/select/dropdown-indicator.js
@@ -1,8 +1,8 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 
-import CaretDownIcon from '../../icons/caret-down-icon';
-import CircleNotchIcon from '../../icons/circle-notch-icon';
+import CaretDownIcon from '@patternfly/react-icons/dist/js/icons/caret-down-icon';
+import CircleNotchIcon from '@patternfly/react-icons/dist/js/icons/circle-notch-icon';
 
 const DropdownIndicator = ({ selectProps: { isFetching }}) => isFetching ? <CircleNotchIcon className="spinning" /> : <CaretDownIcon />;
 

diff --git a/packages/pf4-component-mapper/src/form-fields/select/multi-value-remove.js b/packages/pf4-component-mapper/src/form-fields/select/multi-value-remove.js
@@ -1,7 +1,7 @@
 import React from 'react';
 import { components } from 'react-select';
 
-import TimesCircleIcon from '../../icons/times-circle-icon';
+import TimesCircleIcon from '@patternfly/react-icons/dist/js/icons/times-circle-icon';
 
 const MultiValueRemove = props => (
   <components.MultiValueRemove { ...props }>

diff --git a/packages/pf4-component-mapper/src/form-fields/select/option.js b/packages/pf4-component-mapper/src/form-fields/select/option.js
@@ -3,7 +3,7 @@ import { components } from 'react-select';
 import PropTypes from 'prop-types';
 import { Checkbox } from '@patternfly/react-core';
 
-import CheckIcon from '../../icons/check-icon';
+import CheckIcon from '@patternfly/react-icons/dist/js/icons/check-icon';
 
 const Option = (props) => (
   <div

diff --git a/packages/pf4-component-mapper/src/icons/add-circle-o-icon.js b/packages/pf4-component-mapper/src/icons/add-circle-o-icon.js
diff --git a/packages/pf4-component-mapper/src/icons/caret-down-icon.js b/packages/pf4-component-mapper/src/icons/caret-down-icon.js
diff --git a/packages/pf4-component-mapper/src/icons/check-icon.js b/packages/pf4-component-mapper/src/icons/check-icon.js
diff --git a/packages/pf4-component-mapper/src/icons/circle-notch-icon.js b/packages/pf4-component-mapper/src/icons/circle-notch-icon.js
diff --git a/packages/pf4-component-mapper/src/icons/close-icon.js b/packages/pf4-component-mapper/src/icons/close-icon.js
diff --git a/packages/pf4-component-mapper/src/icons/times-circle-icon.js b/packages/pf4-component-mapper/src/icons/times-circle-icon.js
diff --git a/packages/pf4-component-mapper/src/tests/field-array/__snapshots__/field-array.test.js.snap b/packages/pf4-component-mapper/src/tests/field-array/__snapshots__/field-array.test.js.snap
@@ -550,29 +550,28 @@ exports[`FieldArray should render array field correctly 1`] = `
                                       >
                                         <AddCircleOIcon
                                           className="ddf-final-form-group-add-icon"
+                                          color="currentColor"
+                                          noVerticalAlign={false}
                                           onClick={[Function]}
+                                          size="sm"
+                                          title={null}
                                         >
                                           <svg
-                                            aria-labelledby="icon-title-25"
+                                            aria-hidden={true}
+                                            aria-labelledby={null}
                                             className="ddf-final-form-group-add-icon"
                                             fill="currentColor"
                                             height="1em"
                                             onClick={[Function]}
                                             role="img"
                                             style={
                                               Object {
-                                                "verticalAlign": "-0.375em",
+                                                "verticalAlign": "-0.125em",
                                               }
                                             }
-                                            tabIndex="0"
                                             viewBox="0 64 1024 1024"
                                             width="1em"
                                           >
-                                            <title
-                                              id="icon-title-25"
-                                            >
-                                              AddCircleOIcon
-                                            </title>
                                             <path
                                               d="M512.059-73.143c-282.338 0-512.059 229.673-512.059 512.025 0 282.238 229.721 511.975 512.059 511.975 282.283 0 511.941-229.735 511.941-511.975 0.005-282.352-229.659-512.025-511.941-512.025zM512.059 826.523c-213.826 0-387.728-173.856-387.728-387.643 0-213.888 173.904-387.691 387.728-387.691 213.717 0 387.671 173.803 387.671 387.691 0.005 213.785-173.957 387.643-387.671 387.643zM726.283 506.777c-3.429 3.477-7.803 5.223-13.138 5.223h-128.005v128.007c0 5.333-1.739 9.71-5.218 13.138s-7.936 5.141-13.351 5.141h-109.143c-5.417 0-9.863-1.714-13.351-5.141-3.481-3.429-5.221-7.808-5.221-13.141v-128.005l-128.007-0.002c-5.333 0-9.71-1.737-13.138-5.218-3.426-3.477-5.141-7.934-5.141-13.351v-109.143c0-5.417 1.714-9.856 5.141-13.351 3.429-3.481 7.808-5.221 13.141-5.221l128.005 0.002v-128.009c0-5.335 1.744-9.707 5.225-13.134 3.477-3.429 7.927-5.145 13.344-5.145h109.143c5.417 0 9.858 1.717 13.351 5.145 3.477 3.429 5.223 7.803 5.223 13.138v128.002h128.007c5.335 0 9.707 1.742 13.134 5.225 3.429 3.477 5.145 7.927 5.145 13.344v109.143c0 5.417-1.717 9.863-5.145 13.351z"
                                               transform="rotate(180 0 512) scale(-1 1)"

diff --git a/packages/pf4-component-mapper/src/tests/field-array/field-array.test.js b/packages/pf4-component-mapper/src/tests/field-array/field-array.test.js
@@ -4,8 +4,8 @@ import toJson from 'enzyme-to-json';
 import FormRenderer, { componentTypes as components } from '@data-driven-forms/react-form-renderer';
 import { TextInput } from '@patternfly/react-core';
 
-import AddCircleOIcon from '../../icons/add-circle-o-icon';
-import CloseIcon from '../../icons/close-icon';
+import AddCircleOIcon from '@patternfly/react-icons/dist/js/icons/add-circle-o-icon';
+import CloseIcon from '@patternfly/react-icons/dist/js/icons/close-icon';
 import { formFieldsMapper, layoutMapper } from '../../index';
 
 describe('FieldArray', () => {

diff --git a/yarn.lock b/yarn.lock
@@ -2333,6 +2333,13 @@
   dependencies:
     "@fortawesome/free-brands-svg-icons" "^5.8.1"
 
+"@patternfly/react-icons@^3.14.23":
+  version "3.14.23"
+  resolved "https://registry.yarnpkg.com/@patternfly/react-icons/-/react-icons-3.14.23.tgz#f371207155d13fcdae07a8b0fe6b7b6cabfa0ef4"
+  integrity sha512-l1ji5Gv4LyrSarGwsEAPG9Nq/8wSCwyvWv7j7R3u1LJy4X27wLc6uorzfToAbdvaBeBjjCEf/UJQZCHHzwIOAw==
+  dependencies:
+    "@fortawesome/free-brands-svg-icons" "^5.8.1"
+
 "@patternfly/react-styles@^3.2.2", "@patternfly/react-styles@^3.6.6":
   version "3.6.6"
   resolved "https://registry.yarnpkg.com/@patternfly/react-styles/-/react-styles-3.6.6.tgz#d4b481fbd34adc28b3129842aea4834c384d4382"