From f70cb49091fa287433342b173783ae0b5be9a312 Mon Sep 17 00:00:00 2001
From: Claudivan Filho <j.claudivan.filho@gmail.com>
Date: Tue, 11 Sep 2018 14:47:21 -0300
Subject: [PATCH 1/6] Add IconBars component

---
 CHANGELOG.md                        |  2 ++
 react/IconBars.js                   |  3 ++
 react/components/icon/Bars/index.js | 47 +++++++++++++++++++++++++++++
 react/components/icon/README.md     |  5 +++
 4 files changed, 57 insertions(+)
 create mode 100644 react/IconBars.js
 create mode 100644 react/components/icon/Bars/index.js

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 509fe04c9..6dbde646b 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -6,6 +6,8 @@ The format is based on [Keep a Changelog](http://keepachangelog.com/en/1.0.0/)
 and this project adheres to [Semantic Versioning](http://semver.org/spec/v2.0.0.html).
 
 ## [Unreleased]
+### Added
+- `IconBars` component
 
 ### Added
 
diff --git a/react/IconBars.js b/react/IconBars.js
new file mode 100644
index 000000000..c5c17d306
--- /dev/null
+++ b/react/IconBars.js
@@ -0,0 +1,3 @@
+import Bars from './components/icon/Bars/index'
+
+export default Bars
diff --git a/react/components/icon/Bars/index.js b/react/components/icon/Bars/index.js
new file mode 100644
index 000000000..9c3480e88
--- /dev/null
+++ b/react/components/icon/Bars/index.js
@@ -0,0 +1,47 @@
+import React, { PureComponent } from 'react'
+import PropTypes from 'prop-types'
+import { calcIconSize, baseClassname } from '../utils'
+
+const iconBase = {
+  width: 18,
+  height: 12,
+}
+
+class Bars extends PureComponent {
+  render() {
+    const { color, size, block } = this.props
+    const newSize = calcIconSize(iconBase, size)
+
+    return (
+      <svg
+        className={`${baseClassname('bars')} ${block ? 'db' : ''}`}
+        width={newSize.width}
+        height={newSize.height}
+        viewBox="0 0 18 12"
+        fill={color}
+        xmlns="http://www.w3.org/2000/svg"
+      >
+        <path
+          fillRule="evenodd"
+          clipRule="evenodd"
+          d="M0 12H18V10H0V12ZM0 7H18V5H0V7ZM0 0V2H18V0H0Z"
+          fill={color}
+        />
+      </svg>
+    )
+  }
+}
+
+Bars.defaultProps = {
+  color: 'currentColor',
+  size: 20,
+  block: false,
+}
+
+Bars.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.number,
+  block: PropTypes.bool,
+}
+
+export default Bars
diff --git a/react/components/icon/README.md b/react/components/icon/README.md
index 2d8df689f..d36b5ec00 100644
--- a/react/components/icon/README.md
+++ b/react/components/icon/README.md
@@ -4,6 +4,7 @@ Usage: <span className="c-muted-1">`import <IconName> from '@vtex/styleguide/lib
 const ArrowBack = require('./ArrowBack').default
 const ArrowDown = require('./ArrowDown').default
 const ArrowUp = require('./ArrowUp').default
+const Bars = require('./Bars').default
 const CaretDown = require('./CaretDown').default
 const CaretLeft = require('./CaretLeft').default
 const CaretRight = require('./CaretRight').default
@@ -202,6 +203,10 @@ const demoLabel = 'pb3 code c-muted-1 f6'
         <div className={demoLabel}>Warning (solid)</div>
         <Warning solid size={demoSize} />
       </td>
+      <td>
+        <div className={demoLabel}>Bars</div>
+        <Bars size={demoSize} />
+      </td>
       <td />
     </tr>
   </tbody>

From 6470f5fc3f672835cb80ca9f6c9fef2f8c2253c0 Mon Sep 17 00:00:00 2001
From: Claudivan Filho <j.claudivan.filho@gmail.com>
Date: Tue, 11 Sep 2018 15:23:01 -0300
Subject: [PATCH 2/6] Add IconUser component

---
 CHANGELOG.md                        |  2 +-
 react/IconUser.js                   |  3 ++
 react/components/icon/README.md     |  6 ++-
 react/components/icon/User/index.js | 65 +++++++++++++++++++++++++++++
 4 files changed, 74 insertions(+), 2 deletions(-)
 create mode 100644 react/IconUser.js
 create mode 100644 react/components/icon/User/index.js

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 6dbde646b..8969df717 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -7,7 +7,7 @@ and this project adheres to [Semantic Versioning](http://semver.org/spec/v2.0.0.
 
 ## [Unreleased]
 ### Added
-- `IconBars` component
+- `IconBars` and `IconUser` components
 
 ### Added
 
diff --git a/react/IconUser.js b/react/IconUser.js
new file mode 100644
index 000000000..cc4fb110c
--- /dev/null
+++ b/react/IconUser.js
@@ -0,0 +1,3 @@
+import User from './components/icon/User/index'
+
+export default User
diff --git a/react/components/icon/README.md b/react/components/icon/README.md
index d36b5ec00..f7bf62a02 100644
--- a/react/components/icon/README.md
+++ b/react/components/icon/README.md
@@ -31,6 +31,7 @@ const Success = require('./Success').default
 const Upload = require('./Upload').default
 const VisibilityOff = require('./VisibilityOff').default
 const VisibilityOn = require('./VisibilityOn').default
+const User = require('./User').default
 const Warning = require('./Warning').default
 
 const demoSize = 20
@@ -207,7 +208,10 @@ const demoLabel = 'pb3 code c-muted-1 f6'
         <div className={demoLabel}>Bars</div>
         <Bars size={demoSize} />
       </td>
-      <td />
+      <td>
+        <div className={demoLabel}>User</div>
+        <User size={demoSize} />
+      </td>
     </tr>
   </tbody>
 </table>
diff --git a/react/components/icon/User/index.js b/react/components/icon/User/index.js
new file mode 100644
index 000000000..891ac7a71
--- /dev/null
+++ b/react/components/icon/User/index.js
@@ -0,0 +1,65 @@
+import React, { PureComponent } from 'react'
+import PropTypes from 'prop-types'
+import { calcIconSize, baseClassname } from '../utils'
+
+const iconBase = {
+  width: 44,
+  height: 44,
+}
+
+class User extends PureComponent {
+  render() {
+    const { color, size, block } = this.props
+    const newSize = calcIconSize(iconBase, size)
+
+    return (
+      <svg
+        className={`${baseClassname('user')} ${block ? 'db' : ''}`}
+        width={newSize.width}
+        height={newSize.height}
+        viewBox="0 0 44 44"
+        fill="transparent"
+        xmlns="http://www.w3.org/2000/svg"
+      >
+        <path
+          d="M13.3333 6.66667C13.3333 10.3486 10.3486 13.3333 6.66667 13.3333C2.98477 13.3333 0 10.3486 0 6.66667C0 2.98477 2.98477 0 6.66667 0C10.3486 0 13.3333 2.98477 13.3333 6.66667Z"
+          transform="translate(15.333 10)"
+          stroke={color}
+          strokeWidth="3"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M26.416 8.32156C25.2235 5.82988 23.3506 3.72634 21.0134 2.25385C18.6763 0.781363 15.9703 -5.20651e-07 13.208 -5.20651e-07C10.4457 -5.20651e-07 7.7397 0.781363 5.40256 2.25385C3.06542 3.72634 1.19247 5.82988 -1.83105e-07 8.32156"
+          transform="translate(8.79199 28.6678)"
+          stroke={color}
+          strokeWidth="3"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M40 20C40 31.0457 31.0457 40 20 40C8.95431 40 0 31.0457 0 20C0 8.95431 8.95431 0 20 0C31.0457 0 40 8.95431 40 20Z"
+          transform="translate(2 2)"
+          stroke={color}
+          strokeWidth="3"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </svg>
+    )
+  }
+}
+
+User.defaultProps = {
+  color: 'currentColor',
+  size: 20,
+  block: false,
+}
+
+User.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.number,
+  block: PropTypes.bool,
+}
+
+export default User

From 6090aae3ff3d76dbee34b2e3913716e57291dc10 Mon Sep 17 00:00:00 2001
From: Claudivan Filho <j.claudivan.filho@gmail.com>
Date: Tue, 11 Sep 2018 15:53:37 -0300
Subject: [PATCH 3/6] Add IconShoppingCart component

---
 CHANGELOG.md                                |  2 +-
 react/IconShoppingCart.js                   |  3 ++
 react/components/icon/README.md             |  7 ++++
 react/components/icon/ShoppingCart/index.js | 44 +++++++++++++++++++++
 react/components/icon/User/index.js         |  2 +-
 5 files changed, 56 insertions(+), 2 deletions(-)
 create mode 100644 react/IconShoppingCart.js
 create mode 100644 react/components/icon/ShoppingCart/index.js

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 8969df717..17262e28d 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -7,7 +7,7 @@ and this project adheres to [Semantic Versioning](http://semver.org/spec/v2.0.0.
 
 ## [Unreleased]
 ### Added
-- `IconBars` and `IconUser` components
+- `IconBars`, `IconUser` and `IconShoppingCart` components
 
 ### Added
 
diff --git a/react/IconShoppingCart.js b/react/IconShoppingCart.js
new file mode 100644
index 000000000..c58607d73
--- /dev/null
+++ b/react/IconShoppingCart.js
@@ -0,0 +1,3 @@
+import ShoppingCart from './components/icon/ShoppingCart/index'
+
+export default ShoppingCart
diff --git a/react/components/icon/README.md b/react/components/icon/README.md
index f7bf62a02..3cc25c1c3 100644
--- a/react/components/icon/README.md
+++ b/react/components/icon/README.md
@@ -27,6 +27,7 @@ const Link = require('./Link').default
 const Plus = require('./Plus').default
 const Save = require('./Save').default
 const Search = require('./Search').default
+const ShoppingCart = require('./ShoppingCart').default
 const Success = require('./Success').default
 const Upload = require('./Upload').default
 const VisibilityOff = require('./VisibilityOff').default
@@ -213,6 +214,12 @@ const demoLabel = 'pb3 code c-muted-1 f6'
         <User size={demoSize} />
       </td>
     </tr>
+    <tr>
+      <td>
+        <div className={demoLabel}>Shopping Cart</div>
+        <ShoppingCart size={demoSize} />
+      </td>
+    </tr>
   </tbody>
 </table>
 ```
diff --git a/react/components/icon/ShoppingCart/index.js b/react/components/icon/ShoppingCart/index.js
new file mode 100644
index 000000000..c9dd76696
--- /dev/null
+++ b/react/components/icon/ShoppingCart/index.js
@@ -0,0 +1,44 @@
+import React, { PureComponent } from 'react'
+import PropTypes from 'prop-types'
+import { calcIconSize, baseClassname } from '../utils'
+
+const iconBase = {
+  width: 44,
+  height: 44,
+}
+
+class ShoppingCart extends PureComponent {
+  render() {
+    const { color, size, block } = this.props
+    const newSize = calcIconSize(iconBase, size)
+
+    return (
+      <svg
+        className={`${baseClassname('shopping-cart')} ${block ? 'db' : ''}`}
+        width={newSize.width}
+        height={newSize.height}
+        viewBox="0 0 44 44"
+        fill="none"
+        xmlns="http://www.w3.org/2000/svg"
+      >
+        <path d="M0 0H8L10.6667 24H34.6667L40 8H16" transform="translate(2 2)" stroke={color} strokeWidth="3" strokeMiterlimit="10" strokeLinecap="round" strokeLinejoin="round" />
+        <path d="M8 4C8 6.20914 6.20914 8 4 8C1.79086 8 0 6.20914 0 4C0 1.79086 1.79086 0 4 0C6.20914 0 8 1.79086 8 4Z" transform="translate(10 34)" stroke={color} strokeWidth="3" strokeMiterlimit="10" strokeLinecap="round" strokeLinejoin="round" />
+        <path d="M8 4C8 6.20914 6.20914 8 4 8C1.79086 8 0 6.20914 0 4C0 1.79086 1.79086 0 4 0C6.20914 0 8 1.79086 8 4Z" transform="translate(31.3335 34)" stroke={color} strokeWidth="3" strokeMiterlimit="10" strokeLinecap="round" strokeLinejoin="round" />
+      </svg>
+    )
+  }
+}
+
+ShoppingCart.defaultProps = {
+  color: 'currentColor',
+  size: 20,
+  block: false,
+}
+
+ShoppingCart.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.number,
+  block: PropTypes.bool,
+}
+
+export default ShoppingCart
diff --git a/react/components/icon/User/index.js b/react/components/icon/User/index.js
index 891ac7a71..70a77371b 100644
--- a/react/components/icon/User/index.js
+++ b/react/components/icon/User/index.js
@@ -18,7 +18,7 @@ class User extends PureComponent {
         width={newSize.width}
         height={newSize.height}
         viewBox="0 0 44 44"
-        fill="transparent"
+        fill="none"
         xmlns="http://www.w3.org/2000/svg"
       >
         <path

From 2b7cb3284b79b926f7c6f98f75002b9e53c4f830 Mon Sep 17 00:00:00 2001
From: claudivanfilho <j.claudivan.filho@gmail.com>
Date: Fri, 21 Sep 2018 10:35:05 -0300
Subject: [PATCH 4/6] Add solid prop to User and ShoppingCart icon

---
 react/components/icon/README.md             |  8 ++++++
 react/components/icon/ShoppingCart/index.js | 30 ++++++++++++++++++++-
 react/components/icon/User/index.js         | 26 +++++++++++++++++-
 3 files changed, 62 insertions(+), 2 deletions(-)

diff --git a/react/components/icon/README.md b/react/components/icon/README.md
index 3cc25c1c3..1a13a32df 100644
--- a/react/components/icon/README.md
+++ b/react/components/icon/README.md
@@ -215,10 +215,18 @@ const demoLabel = 'pb3 code c-muted-1 f6'
       </td>
     </tr>
     <tr>
+      <td>
+        <div className={demoLabel}>User (solid)</div>
+        <User solid size={demoSize} />
+      </td>
       <td>
         <div className={demoLabel}>Shopping Cart</div>
         <ShoppingCart size={demoSize} />
       </td>
+      <td>
+        <div className={demoLabel}>Shopping Cart (solid)</div>
+        <ShoppingCart solid size={demoSize} />
+      </td>
     </tr>
   </tbody>
 </table>
diff --git a/react/components/icon/ShoppingCart/index.js b/react/components/icon/ShoppingCart/index.js
index c9dd76696..67bd52c63 100644
--- a/react/components/icon/ShoppingCart/index.js
+++ b/react/components/icon/ShoppingCart/index.js
@@ -9,9 +9,35 @@ const iconBase = {
 
 class ShoppingCart extends PureComponent {
   render() {
-    const { color, size, block } = this.props
+    const { color, size, block, solid } = this.props
     const newSize = calcIconSize(iconBase, size)
 
+    if (solid) {
+      return (
+        <svg
+          className={`${baseClassname('shopping-cart')} ${block ? 'db' : ''}`}
+          width={newSize.width}
+          height={newSize.height}
+          viewBox="0 0 32 30"
+          fill="none"
+          xmlns="http://www.w3.org/2000/svg"
+        >
+          <path
+            d="M8 30C9.65685 30 11 28.6569 11 27C11 25.3431 9.65685 24 8 24C6.34315 24 5 25.3431 5 27C5 28.6569 6.34315 30 8 30Z"
+            fill={color}
+          />
+          <path
+            d="M27 30C28.6569 30 30 28.6569 30 27C30 25.3431 28.6569 24 27 24C25.3431 24 24 25.3431 24 27C24 28.6569 25.3431 30 27 30Z"
+            fill={color}
+          />
+          <path
+            d="M28 22H7C6.505 22 6.084 21.638 6.011 21.148L3.139 2H0V0H4C4.495 0 4.916 0.362 4.989 0.852L5.611 5H31C31.3 5 31.583 5.134 31.773 5.366C31.963 5.597 32.039 5.902 31.98 6.196L28.98 21.196C28.887 21.664 28.477 22 28 22Z"
+            fill={color}
+          />
+        </svg>
+      )
+    }
+
     return (
       <svg
         className={`${baseClassname('shopping-cart')} ${block ? 'db' : ''}`}
@@ -33,12 +59,14 @@ ShoppingCart.defaultProps = {
   color: 'currentColor',
   size: 20,
   block: false,
+  solid: false,
 }
 
 ShoppingCart.propTypes = {
   color: PropTypes.string,
   size: PropTypes.number,
   block: PropTypes.bool,
+  solid: PropTypes.bool,
 }
 
 export default ShoppingCart
diff --git a/react/components/icon/User/index.js b/react/components/icon/User/index.js
index 70a77371b..a5319cf5d 100644
--- a/react/components/icon/User/index.js
+++ b/react/components/icon/User/index.js
@@ -9,9 +9,31 @@ const iconBase = {
 
 class User extends PureComponent {
   render() {
-    const { color, size, block } = this.props
+    const { color, size, block, solid } = this.props
     const newSize = calcIconSize(iconBase, size)
 
+    if (solid) {
+      return (
+        <svg
+          className={`${baseClassname('user')} ${block ? 'db' : ''}`}
+          width={newSize.width}
+          height={newSize.height}
+          viewBox="0 0 32 32"
+          fill="none"
+          xmlns="http://www.w3.org/2000/svg"
+        >
+          <path
+            d="M16 0C7.17733 0 0 7.17733 0 16C0 24.8227 7.17733 32 16 32C24.8227 32 32 24.8227 32 16C32 7.17733 24.8227 0 16 0ZM24.9307 25.872C24.0453 23.2413 21.5973 21.3333 18.6667 21.3333H13.3333C10.4027 21.3333 7.95733 23.2427 7.072 25.8733C4.37467 23.432 2.66667 19.916 2.66667 16C2.66667 8.648 8.648 2.66667 16 2.66667C23.352 2.66667 29.3333 8.648 29.3333 16C29.3333 19.9147 27.6267 23.4307 24.9307 25.872Z"
+            fill={color}
+          />
+          <path
+            d="M15.9998 6.66699C13.0545 6.66699 10.6665 9.05499 10.6665 12.0003V13.3337C10.6665 16.279 13.0545 18.667 15.9998 18.667C18.9452 18.667 21.3332 16.279 21.3332 13.3337V12.0003C21.3332 9.05499 18.9452 6.66699 15.9998 6.66699Z"
+            fill={color}
+          />
+        </svg>
+      )
+    }
+
     return (
       <svg
         className={`${baseClassname('user')} ${block ? 'db' : ''}`}
@@ -54,12 +76,14 @@ User.defaultProps = {
   color: 'currentColor',
   size: 20,
   block: false,
+  solid: false,
 }
 
 User.propTypes = {
   color: PropTypes.string,
   size: PropTypes.number,
   block: PropTypes.bool,
+  solid: PropTypes.bool,
 }
 
 export default User

From 04bbf5e971d6c2ede005c5249416f8e3026166e3 Mon Sep 17 00:00:00 2001
From: claudivanfilho <j.claudivan.filho@gmail.com>
Date: Wed, 26 Sep 2018 14:47:52 -0300
Subject: [PATCH 5/6] Update icon/README.md

---
 react/components/icon/README.md | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/react/components/icon/README.md b/react/components/icon/README.md
index 1a13a32df..40a8e009c 100644
--- a/react/components/icon/README.md
+++ b/react/components/icon/README.md
@@ -213,8 +213,6 @@ const demoLabel = 'pb3 code c-muted-1 f6'
         <div className={demoLabel}>User</div>
         <User size={demoSize} />
       </td>
-    </tr>
-    <tr>
       <td>
         <div className={demoLabel}>User (solid)</div>
         <User solid size={demoSize} />
@@ -223,6 +221,8 @@ const demoLabel = 'pb3 code c-muted-1 f6'
         <div className={demoLabel}>Shopping Cart</div>
         <ShoppingCart size={demoSize} />
       </td>
+    </tr>
+    <tr>
       <td>
         <div className={demoLabel}>Shopping Cart (solid)</div>
         <ShoppingCart solid size={demoSize} />

From 144ce7658ba10e7f011b2aa12e05c49d21191d01 Mon Sep 17 00:00:00 2001
From: claudivanfilho <j.claudivan.filho@gmail.com>
Date: Thu, 27 Sep 2018 09:04:16 -0300
Subject: [PATCH 6/6] Use filled icons as default in UserIcon and
 ShoppingCartIcon

---
 react/components/icon/README.md             | 10 ----
 react/components/icon/ShoppingCart/index.js | 47 ++++++-------------
 react/components/icon/User/index.js         | 52 +++------------------
 3 files changed, 20 insertions(+), 89 deletions(-)

diff --git a/react/components/icon/README.md b/react/components/icon/README.md
index 40a8e009c..d0e0d5bc0 100644
--- a/react/components/icon/README.md
+++ b/react/components/icon/README.md
@@ -213,21 +213,11 @@ const demoLabel = 'pb3 code c-muted-1 f6'
         <div className={demoLabel}>User</div>
         <User size={demoSize} />
       </td>
-      <td>
-        <div className={demoLabel}>User (solid)</div>
-        <User solid size={demoSize} />
-      </td>
       <td>
         <div className={demoLabel}>Shopping Cart</div>
         <ShoppingCart size={demoSize} />
       </td>
     </tr>
-    <tr>
-      <td>
-        <div className={demoLabel}>Shopping Cart (solid)</div>
-        <ShoppingCart solid size={demoSize} />
-      </td>
-    </tr>
   </tbody>
 </table>
 ```
diff --git a/react/components/icon/ShoppingCart/index.js b/react/components/icon/ShoppingCart/index.js
index 67bd52c63..d5389444d 100644
--- a/react/components/icon/ShoppingCart/index.js
+++ b/react/components/icon/ShoppingCart/index.js
@@ -9,47 +9,30 @@ const iconBase = {
 
 class ShoppingCart extends PureComponent {
   render() {
-    const { color, size, block, solid } = this.props
+    const { color, size, block } = this.props
     const newSize = calcIconSize(iconBase, size)
 
-    if (solid) {
-      return (
-        <svg
-          className={`${baseClassname('shopping-cart')} ${block ? 'db' : ''}`}
-          width={newSize.width}
-          height={newSize.height}
-          viewBox="0 0 32 30"
-          fill="none"
-          xmlns="http://www.w3.org/2000/svg"
-        >
-          <path
-            d="M8 30C9.65685 30 11 28.6569 11 27C11 25.3431 9.65685 24 8 24C6.34315 24 5 25.3431 5 27C5 28.6569 6.34315 30 8 30Z"
-            fill={color}
-          />
-          <path
-            d="M27 30C28.6569 30 30 28.6569 30 27C30 25.3431 28.6569 24 27 24C25.3431 24 24 25.3431 24 27C24 28.6569 25.3431 30 27 30Z"
-            fill={color}
-          />
-          <path
-            d="M28 22H7C6.505 22 6.084 21.638 6.011 21.148L3.139 2H0V0H4C4.495 0 4.916 0.362 4.989 0.852L5.611 5H31C31.3 5 31.583 5.134 31.773 5.366C31.963 5.597 32.039 5.902 31.98 6.196L28.98 21.196C28.887 21.664 28.477 22 28 22Z"
-            fill={color}
-          />
-        </svg>
-      )
-    }
-
     return (
       <svg
         className={`${baseClassname('shopping-cart')} ${block ? 'db' : ''}`}
         width={newSize.width}
         height={newSize.height}
-        viewBox="0 0 44 44"
+        viewBox="0 0 32 30"
         fill="none"
         xmlns="http://www.w3.org/2000/svg"
       >
-        <path d="M0 0H8L10.6667 24H34.6667L40 8H16" transform="translate(2 2)" stroke={color} strokeWidth="3" strokeMiterlimit="10" strokeLinecap="round" strokeLinejoin="round" />
-        <path d="M8 4C8 6.20914 6.20914 8 4 8C1.79086 8 0 6.20914 0 4C0 1.79086 1.79086 0 4 0C6.20914 0 8 1.79086 8 4Z" transform="translate(10 34)" stroke={color} strokeWidth="3" strokeMiterlimit="10" strokeLinecap="round" strokeLinejoin="round" />
-        <path d="M8 4C8 6.20914 6.20914 8 4 8C1.79086 8 0 6.20914 0 4C0 1.79086 1.79086 0 4 0C6.20914 0 8 1.79086 8 4Z" transform="translate(31.3335 34)" stroke={color} strokeWidth="3" strokeMiterlimit="10" strokeLinecap="round" strokeLinejoin="round" />
+        <path
+          d="M8 30C9.65685 30 11 28.6569 11 27C11 25.3431 9.65685 24 8 24C6.34315 24 5 25.3431 5 27C5 28.6569 6.34315 30 8 30Z"
+          fill={color}
+        />
+        <path
+          d="M27 30C28.6569 30 30 28.6569 30 27C30 25.3431 28.6569 24 27 24C25.3431 24 24 25.3431 24 27C24 28.6569 25.3431 30 27 30Z"
+          fill={color}
+        />
+        <path
+          d="M28 22H7C6.505 22 6.084 21.638 6.011 21.148L3.139 2H0V0H4C4.495 0 4.916 0.362 4.989 0.852L5.611 5H31C31.3 5 31.583 5.134 31.773 5.366C31.963 5.597 32.039 5.902 31.98 6.196L28.98 21.196C28.887 21.664 28.477 22 28 22Z"
+          fill={color}
+        />
       </svg>
     )
   }
@@ -59,14 +42,12 @@ ShoppingCart.defaultProps = {
   color: 'currentColor',
   size: 20,
   block: false,
-  solid: false,
 }
 
 ShoppingCart.propTypes = {
   color: PropTypes.string,
   size: PropTypes.number,
   block: PropTypes.bool,
-  solid: PropTypes.bool,
 }
 
 export default ShoppingCart
diff --git a/react/components/icon/User/index.js b/react/components/icon/User/index.js
index a5319cf5d..cca7df6cb 100644
--- a/react/components/icon/User/index.js
+++ b/react/components/icon/User/index.js
@@ -9,63 +9,25 @@ const iconBase = {
 
 class User extends PureComponent {
   render() {
-    const { color, size, block, solid } = this.props
+    const { color, size, block } = this.props
     const newSize = calcIconSize(iconBase, size)
 
-    if (solid) {
-      return (
-        <svg
-          className={`${baseClassname('user')} ${block ? 'db' : ''}`}
-          width={newSize.width}
-          height={newSize.height}
-          viewBox="0 0 32 32"
-          fill="none"
-          xmlns="http://www.w3.org/2000/svg"
-        >
-          <path
-            d="M16 0C7.17733 0 0 7.17733 0 16C0 24.8227 7.17733 32 16 32C24.8227 32 32 24.8227 32 16C32 7.17733 24.8227 0 16 0ZM24.9307 25.872C24.0453 23.2413 21.5973 21.3333 18.6667 21.3333H13.3333C10.4027 21.3333 7.95733 23.2427 7.072 25.8733C4.37467 23.432 2.66667 19.916 2.66667 16C2.66667 8.648 8.648 2.66667 16 2.66667C23.352 2.66667 29.3333 8.648 29.3333 16C29.3333 19.9147 27.6267 23.4307 24.9307 25.872Z"
-            fill={color}
-          />
-          <path
-            d="M15.9998 6.66699C13.0545 6.66699 10.6665 9.05499 10.6665 12.0003V13.3337C10.6665 16.279 13.0545 18.667 15.9998 18.667C18.9452 18.667 21.3332 16.279 21.3332 13.3337V12.0003C21.3332 9.05499 18.9452 6.66699 15.9998 6.66699Z"
-            fill={color}
-          />
-        </svg>
-      )
-    }
-
     return (
       <svg
         className={`${baseClassname('user')} ${block ? 'db' : ''}`}
         width={newSize.width}
         height={newSize.height}
-        viewBox="0 0 44 44"
+        viewBox="0 0 32 32"
         fill="none"
         xmlns="http://www.w3.org/2000/svg"
       >
         <path
-          d="M13.3333 6.66667C13.3333 10.3486 10.3486 13.3333 6.66667 13.3333C2.98477 13.3333 0 10.3486 0 6.66667C0 2.98477 2.98477 0 6.66667 0C10.3486 0 13.3333 2.98477 13.3333 6.66667Z"
-          transform="translate(15.333 10)"
-          stroke={color}
-          strokeWidth="3"
-          strokeLinecap="round"
-          strokeLinejoin="round"
-        />
-        <path
-          d="M26.416 8.32156C25.2235 5.82988 23.3506 3.72634 21.0134 2.25385C18.6763 0.781363 15.9703 -5.20651e-07 13.208 -5.20651e-07C10.4457 -5.20651e-07 7.7397 0.781363 5.40256 2.25385C3.06542 3.72634 1.19247 5.82988 -1.83105e-07 8.32156"
-          transform="translate(8.79199 28.6678)"
-          stroke={color}
-          strokeWidth="3"
-          strokeLinecap="round"
-          strokeLinejoin="round"
+          d="M16 0C7.17733 0 0 7.17733 0 16C0 24.8227 7.17733 32 16 32C24.8227 32 32 24.8227 32 16C32 7.17733 24.8227 0 16 0ZM24.9307 25.872C24.0453 23.2413 21.5973 21.3333 18.6667 21.3333H13.3333C10.4027 21.3333 7.95733 23.2427 7.072 25.8733C4.37467 23.432 2.66667 19.916 2.66667 16C2.66667 8.648 8.648 2.66667 16 2.66667C23.352 2.66667 29.3333 8.648 29.3333 16C29.3333 19.9147 27.6267 23.4307 24.9307 25.872Z"
+          fill={color}
         />
         <path
-          d="M40 20C40 31.0457 31.0457 40 20 40C8.95431 40 0 31.0457 0 20C0 8.95431 8.95431 0 20 0C31.0457 0 40 8.95431 40 20Z"
-          transform="translate(2 2)"
-          stroke={color}
-          strokeWidth="3"
-          strokeLinecap="round"
-          strokeLinejoin="round"
+          d="M15.9998 6.66699C13.0545 6.66699 10.6665 9.05499 10.6665 12.0003V13.3337C10.6665 16.279 13.0545 18.667 15.9998 18.667C18.9452 18.667 21.3332 16.279 21.3332 13.3337V12.0003C21.3332 9.05499 18.9452 6.66699 15.9998 6.66699Z"
+          fill={color}
         />
       </svg>
     )
@@ -76,14 +38,12 @@ User.defaultProps = {
   color: 'currentColor',
   size: 20,
   block: false,
-  solid: false,
 }
 
 User.propTypes = {
   color: PropTypes.string,
   size: PropTypes.number,
   block: PropTypes.bool,
-  solid: PropTypes.bool,
 }
 
 export default User