Upgrade to feather-icons v4.28.0

README.md

@@ -6,17 +6,14 @@
 #### What is react-feather?
 react-feather is a collection of simply beautiful open source icons for React.js. Each icon is designed on a 24x24 grid with an emphasis on simplicity, consistency and readability.
 
-[Explore icons](https://bit.dev/feathericons/react-feather) and play with examples.
-<p align="center">
-  <a href="https://bit.dev/feathericons/react-feather"><img src="https://i.imagesup.co/images2/371e9a2b398a5d7cef54a956d959e4534b290a55.gif"></a>
-</p>
-
-#### Based on Feather Icons  ```v4.22.1```
-
-#### Version `2.0.0` adds support for tree-shaking, to help you reduce bundle size.
+#### Based on Feather Icons  ```v4.28.0```
 
 ### Installation
-    npm install react-feather --save
+    yarn add react-feather
+
+  or
+
+    npm i react-feather
 
 ### Usage
 

package.json

@@ -43,15 +43,15 @@
     "@babel/preset-react": "^7.0.0",
     "babel-plugin-transform-object-rest-spread": "^6.26.0",
     "babel-preset-env": "^1.7.0",
-    "concurrently": "^4.1.1",
-    "eslint": "^5.16.0",
-    "eslint-config-airbnb": "^17.1.1",
+    "concurrently": "^5.1.0",
+    "eslint": "^6.8.0",
+    "eslint-config-airbnb": "^18.1.0",
     "eslint-plugin-import": "^2.18.0",
     "eslint-plugin-jsx-a11y": "^6.2.3",
     "eslint-plugin-react": "^7.14.2",
-    "feather-icons": "^4.22.1",
+    "feather-icons": "^4.28.0",
     "prettier-eslint": "^9.0.0",
-    "rollup": "^1.16.4",
+    "rollup": "^2.3.3",
     "rollup-plugin-babel": "^4.3.3",
     "uppercamelcase": "^3.0.0"
   },

src/icons/alert-circle.js

@@ -18,7 +18,7 @@ const AlertCircle = (props) => {
     >
       <circle cx="12" cy="12" r="10" />
       <line x1="12" y1="8" x2="12" y2="12" />
-      <line x1="12" y1="16" x2="12" y2="16" />
+      <line x1="12" y1="16" x2="12.01" y2="16" />
     </svg>
   );
 };

src/icons/alert-octagon.js

@@ -18,7 +18,7 @@ const AlertOctagon = (props) => {
     >
       <polygon points="7.86 2 16.14 2 22 7.86 22 16.14 16.14 22 7.86 22 2 16.14 2 7.86 7.86 2" />
       <line x1="12" y1="8" x2="12" y2="12" />
-      <line x1="12" y1="16" x2="12" y2="16" />
+      <line x1="12" y1="16" x2="12.01" y2="16" />
     </svg>
   );
 };

src/icons/alert-triangle.js

@@ -18,7 +18,7 @@ const AlertTriangle = (props) => {
     >
       <path d="M10.29 3.86L1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0z" />
       <line x1="12" y1="9" x2="12" y2="13" />
-      <line x1="12" y1="17" x2="12" y2="17" />
+      <line x1="12" y1="17" x2="12.01" y2="17" />
     </svg>
   );
 };

src/icons/cast.js

@@ -17,7 +17,7 @@ const Cast = (props) => {
       {...otherProps}
     >
       <path d="M2 16.1A5 5 0 0 1 5.9 20M2 12.05A9 9 0 0 1 9.95 20M2 8V6a2 2 0 0 1 2-2h16a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2h-6" />
-      <line x1="2" y1="20" x2="2" y2="20" />
+      <line x1="2" y1="20" x2="2.01" y2="20" />
     </svg>
   );
 };

src/icons/cloud-snow.js

@@ -17,12 +17,12 @@ const CloudSnow = (props) => {
       {...otherProps}
     >
       <path d="M20 17.58A5 5 0 0 0 18 8h-1.26A8 8 0 1 0 4 16.25" />
-      <line x1="8" y1="16" x2="8" y2="16" />
-      <line x1="8" y1="20" x2="8" y2="20" />
-      <line x1="12" y1="18" x2="12" y2="18" />
-      <line x1="12" y1="22" x2="12" y2="22" />
-      <line x1="16" y1="16" x2="16" y2="16" />
-      <line x1="16" y1="20" x2="16" y2="20" />
+      <line x1="8" y1="16" x2="8.01" y2="16" />
+      <line x1="8" y1="20" x2="8.01" y2="20" />
+      <line x1="12" y1="18" x2="12.01" y2="18" />
+      <line x1="12" y1="22" x2="12.01" y2="22" />
+      <line x1="16" y1="16" x2="16.01" y2="16" />
+      <line x1="16" y1="20" x2="16.01" y2="20" />
     </svg>
   );
 };

src/icons/divide-circle.js

@@ -0,0 +1,37 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+
+const DivideCircle = (props) => {
+  const { color, size, ...otherProps } = props;
+  return (
+    <svg
+      xmlns="http://www.w3.org/2000/svg"
+      width={size}
+      height={size}
+      viewBox="0 0 24 24"
+      fill="none"
+      stroke={color}
+      strokeWidth="2"
+      strokeLinecap="round"
+      strokeLinejoin="round"
+      {...otherProps}
+    >
+      <line x1="8" y1="12" x2="16" y2="12" />
+      <line x1="12" y1="16" x2="12" y2="16" />
+      <line x1="12" y1="8" x2="12" y2="8" />
+      <circle cx="12" cy="12" r="10" />
+    </svg>
+  );
+};
+
+DivideCircle.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+DivideCircle.defaultProps = {
+  color: 'currentColor',
+  size: '24',
+};
+
+export default DivideCircle;

src/icons/divide-square.js

@@ -0,0 +1,37 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+
+const DivideSquare = (props) => {
+  const { color, size, ...otherProps } = props;
+  return (
+    <svg
+      xmlns="http://www.w3.org/2000/svg"
+      width={size}
+      height={size}
+      viewBox="0 0 24 24"
+      fill="none"
+      stroke={color}
+      strokeWidth="2"
+      strokeLinecap="round"
+      strokeLinejoin="round"
+      {...otherProps}
+    >
+      <rect x="3" y="3" width="18" height="18" rx="2" ry="2" />
+      <line x1="8" y1="12" x2="16" y2="12" />
+      <line x1="12" y1="16" x2="12" y2="16" />
+      <line x1="12" y1="8" x2="12" y2="8" />
+    </svg>
+  );
+};
+
+DivideSquare.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+DivideSquare.defaultProps = {
+  color: 'currentColor',
+  size: '24',
+};
+
+export default DivideSquare;

src/icons/divide.js

@@ -0,0 +1,36 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+
+const Divide = (props) => {
+  const { color, size, ...otherProps } = props;
+  return (
+    <svg
+      xmlns="http://www.w3.org/2000/svg"
+      width={size}
+      height={size}
+      viewBox="0 0 24 24"
+      fill="none"
+      stroke={color}
+      strokeWidth="2"
+      strokeLinecap="round"
+      strokeLinejoin="round"
+      {...otherProps}
+    >
+      <circle cx="12" cy="6" r="2" />
+      <line x1="5" y1="12" x2="19" y2="12" />
+      <circle cx="12" cy="18" r="2" />
+    </svg>
+  );
+};
+
+Divide.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+Divide.defaultProps = {
+  color: 'currentColor',
+  size: '24',
+};
+
+export default Divide;

src/icons/dribbble.js

@@ -0,0 +1,35 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+
+const Dribbble = (props) => {
+  const { color, size, ...otherProps } = props;
+  return (
+    <svg
+      xmlns="http://www.w3.org/2000/svg"
+      width={size}
+      height={size}
+      viewBox="0 0 24 24"
+      fill="none"
+      stroke={color}
+      strokeWidth="2"
+      strokeLinecap="round"
+      strokeLinejoin="round"
+      {...otherProps}
+    >
+      <circle cx="12" cy="12" r="10" />
+      <path d="M8.56 2.75c4.37 6.03 6.02 9.42 8.03 17.72m2.54-15.38c-3.72 4.35-8.94 5.66-16.88 5.85m19.5 1.9c-3.5-.93-6.63-.82-8.94 0-2.58.92-5.01 2.86-7.44 6.32" />
+    </svg>
+  );
+};
+
+Dribbble.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+Dribbble.defaultProps = {
+  color: 'currentColor',
+  size: '24',
+};
+
+export default Dribbble;

src/icons/hard-drive.js

@@ -18,8 +18,8 @@ const HardDrive = (props) => {
     >
       <line x1="22" y1="12" x2="2" y2="12" />
       <path d="M5.45 5.11L2 12v6a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2v-6l-3.45-6.89A2 2 0 0 0 16.76 4H7.24a2 2 0 0 0-1.79 1.11z" />
-      <line x1="6" y1="16" x2="6" y2="16" />
-      <line x1="10" y1="16" x2="10" y2="16" />
+      <line x1="6" y1="16" x2="6.01" y2="16" />
+      <line x1="10" y1="16" x2="10.01" y2="16" />
     </svg>
   );
 };

src/icons/help-circle.js

@@ -18,7 +18,7 @@ const HelpCircle = (props) => {
     >
       <circle cx="12" cy="12" r="10" />
       <path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3" />
-      <line x1="12" y1="17" x2="12" y2="17" />
+      <line x1="12" y1="17" x2="12.01" y2="17" />
     </svg>
   );
 };

src/icons/info.js

@@ -18,7 +18,7 @@ const Info = (props) => {
     >
       <circle cx="12" cy="12" r="10" />
       <line x1="12" y1="16" x2="12" y2="12" />
-      <line x1="12" y1="8" x2="12" y2="8" />
+      <line x1="12" y1="8" x2="12.01" y2="8" />
     </svg>
   );
 };

src/icons/instagram.js

@@ -18,7 +18,7 @@ const Instagram = (props) => {
     >
       <rect x="2" y="2" width="20" height="20" rx="5" ry="5" />
       <path d="M16 11.37A4 4 0 1 1 12.63 8 4 4 0 0 1 16 11.37z" />
-      <line x1="17.5" y1="6.5" x2="17.5" y2="6.5" />
+      <line x1="17.5" y1="6.5" x2="17.51" y2="6.5" />
     </svg>
   );
 };

src/icons/list.js

@@ -19,9 +19,9 @@ const List = (props) => {
       <line x1="8" y1="6" x2="21" y2="6" />
       <line x1="8" y1="12" x2="21" y2="12" />
       <line x1="8" y1="18" x2="21" y2="18" />
-      <line x1="3" y1="6" x2="3" y2="6" />
-      <line x1="3" y1="12" x2="3" y2="12" />
-      <line x1="3" y1="18" x2="3" y2="18" />
+      <line x1="3" y1="6" x2="3.01" y2="6" />
+      <line x1="3" y1="12" x2="3.01" y2="12" />
+      <line x1="3" y1="18" x2="3.01" y2="18" />
     </svg>
   );
 };

src/icons/server.js

@@ -18,8 +18,8 @@ const Server = (props) => {
     >
       <rect x="2" y="2" width="20" height="8" rx="2" ry="2" />
       <rect x="2" y="14" width="20" height="8" rx="2" ry="2" />
-      <line x1="6" y1="6" x2="6" y2="6" />
-      <line x1="6" y1="18" x2="6" y2="18" />
+      <line x1="6" y1="6" x2="6.01" y2="6" />
+      <line x1="6" y1="18" x2="6.01" y2="18" />
     </svg>
   );
 };

src/icons/smartphone.js

@@ -17,7 +17,7 @@ const Smartphone = (props) => {
       {...otherProps}
     >
       <rect x="5" y="2" width="14" height="20" rx="2" ry="2" />
-      <line x1="12" y1="18" x2="12" y2="18" />
+      <line x1="12" y1="18" x2="12.01" y2="18" />
     </svg>
   );
 };

src/icons/speaker.js

@@ -18,7 +18,7 @@ const Speaker = (props) => {
     >
       <rect x="4" y="2" width="16" height="20" rx="2" ry="2" />
       <circle cx="12" cy="14" r="4" />
-      <line x1="12" y1="6" x2="12" y2="6" />
+      <line x1="12" y1="6" x2="12.01" y2="6" />
     </svg>
   );
 };

src/icons/tablet.js

@@ -16,8 +16,8 @@ const Tablet = (props) => {
       strokeLinejoin="round"
       {...otherProps}
     >
-      <rect x="4" y="2" width="16" height="20" rx="2" ry="2" transform="rotate(180 12 12)" />
-      <line x1="12" y1="18" x2="12" y2="18" />
+      <rect x="4" y="2" width="16" height="20" rx="2" ry="2" />
+      <line x1="12" y1="18" x2="12.01" y2="18" />
     </svg>
   );
 };

src/icons/tag.js

@@ -17,7 +17,7 @@ const Tag = (props) => {
       {...otherProps}
     >
       <path d="M20.59 13.41l-7.17 7.17a2 2 0 0 1-2.83 0L2 12V2h10l8.59 8.59a2 2 0 0 1 0 2.82z" />
-      <line x1="7" y1="7" x2="7" y2="7" />
+      <line x1="7" y1="7" x2="7.01" y2="7" />
     </svg>
   );
 };

src/icons/tool.js

@@ -0,0 +1,34 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+
+const Tool = (props) => {
+  const { color, size, ...otherProps } = props;
+  return (
+    <svg
+      xmlns="http://www.w3.org/2000/svg"
+      width={size}
+      height={size}
+      viewBox="0 0 24 24"
+      fill="none"
+      stroke={color}
+      strokeWidth="2"
+      strokeLinecap="round"
+      strokeLinejoin="round"
+      {...otherProps}
+    >
+      <path d="M14.7 6.3a1 1 0 0 0 0 1.4l1.6 1.6a1 1 0 0 0 1.4 0l3.77-3.77a6 6 0 0 1-7.94 7.94l-6.91 6.91a2.12 2.12 0 0 1-3-3l6.91-6.91a6 6 0 0 1 7.94-7.94l-3.76 3.76z" />
+    </svg>
+  );
+};
+
+Tool.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+Tool.defaultProps = {
+  color: 'currentColor',
+  size: '24',
+};
+
+export default Tool;