From 71c84df41dd5a13006ea546b4b6651903a82d524 Mon Sep 17 00:00:00 2001
From: Lee Chase <lee.chase@uk.ibm.com>
Date: Wed, 3 Feb 2021 11:17:11 +0000
Subject: [PATCH 1/4] feat: add icon element classes

---
 packages/icon-build-helpers/src/builders/react/builder.js | 7 ++++---
 1 file changed, 4 insertions(+), 3 deletions(-)

diff --git a/packages/icon-build-helpers/src/builders/react/builder.js b/packages/icon-build-helpers/src/builders/react/builder.js
index 237a56944bad..ab3ae5a04b44 100644
--- a/packages/icon-build-helpers/src/builders/react/builder.js
+++ b/packages/icon-build-helpers/src/builders/react/builder.js
@@ -195,9 +195,10 @@ const didWarnAboutDeprecation = {};`;
  * @param {object} node
  * @returns {string}
  */
-function convertToJSX(node) {
-  const { elem, attrs } = node;
-  return `<${elem} ${formatAttributes(attrs)} />`;
+function convertToJSX(node, index) {
+  const { elem, attrs, className } = node;
+  const _className = className ? className : `ac-${elem}-${index}`;
+  return `<${elem} ${formatAttributes(attrs)} className="${_className}"/>`;
 }
 
 const attributeDenylist = ['data', 'aria'];

From 581e24c51294a4f0362f35d38b7f2f161222543f Mon Sep 17 00:00:00 2001
From: Lee Chase <lee.chase@uk.ibm.com>
Date: Wed, 3 Feb 2021 12:00:30 +0000
Subject: [PATCH 2/4] feat: make adding classes optional

---
 packages/icon-build-helpers/src/builders/react/builder.js   | 6 ++++--
 .../src/builders/react/components/Icon.js                   | 2 ++
 2 files changed, 6 insertions(+), 2 deletions(-)

diff --git a/packages/icon-build-helpers/src/builders/react/builder.js b/packages/icon-build-helpers/src/builders/react/builder.js
index ab3ae5a04b44..05bb5f9f26ed 100644
--- a/packages/icon-build-helpers/src/builders/react/builder.js
+++ b/packages/icon-build-helpers/src/builders/react/builder.js
@@ -197,8 +197,10 @@ const didWarnAboutDeprecation = {};`;
  */
 function convertToJSX(node, index) {
   const { elem, attrs, className } = node;
-  const _className = className ? className : `ac-${elem}-${index}`;
-  return `<${elem} ${formatAttributes(attrs)} className="${_className}"/>`;
+  let _className = className
+    ? `"${className}"`
+    : `{addElementClasses ? "ec-${elem}-${index}" : undefined}`;
+  return `<${elem} ${formatAttributes(attrs)} className=${_className}/>`;
 }
 
 const attributeDenylist = ['data', 'aria'];
diff --git a/packages/icon-build-helpers/src/builders/react/components/Icon.js b/packages/icon-build-helpers/src/builders/react/components/Icon.js
index 11b59c6a24c0..b25ac50dafeb 100644
--- a/packages/icon-build-helpers/src/builders/react/components/Icon.js
+++ b/packages/icon-build-helpers/src/builders/react/components/Icon.js
@@ -35,6 +35,7 @@ const Icon = React.forwardRef(function Icon(
 
 Icon.displayName = 'Icon';
 Icon.propTypes = {
+  addElementClasses: PropTypes.bool,
   'aria-hidden': PropTypes.string,
   'aria-label': PropTypes.string,
   'aria-labelledby': PropTypes.string,
@@ -48,6 +49,7 @@ Icon.propTypes = {
   xmlns: PropTypes.string,
 };
 Icon.defaultProps = {
+  addElementClasses: false,
   xmlns: 'http://www.w3.org/2000/svg',
   preserveAspectRatio: 'xMidYMid meet',
 };

From b2b47a7e96d155cbfbeac97381b04aaa8f3f8da5 Mon Sep 17 00:00:00 2001
From: Lee Chase <lee.chase@uk.ibm.com>
Date: Wed, 3 Feb 2021 12:23:28 +0000
Subject: [PATCH 3/4] fix: rework to always include meta data className

---
 .../icon-build-helpers/src/builders/react/builder.js | 12 +++++++++---
 1 file changed, 9 insertions(+), 3 deletions(-)

diff --git a/packages/icon-build-helpers/src/builders/react/builder.js b/packages/icon-build-helpers/src/builders/react/builder.js
index 05bb5f9f26ed..ce1a460a991f 100644
--- a/packages/icon-build-helpers/src/builders/react/builder.js
+++ b/packages/icon-build-helpers/src/builders/react/builder.js
@@ -197,9 +197,15 @@ const didWarnAboutDeprecation = {};`;
  */
 function convertToJSX(node, index) {
   const { elem, attrs, className } = node;
-  let _className = className
-    ? `"${className}"`
-    : `{addElementClasses ? "ec-${elem}-${index}" : undefined}`;
+  let _className, _classNameWrapped;
+  if (className) {
+    _className = `${className} `;
+    _classNameWrapped = `"${className}"`;
+  }
+  _className = `{addElementClasses ? "${
+    _className || ''
+  }ec-${elem}-${index}" : ${_classNameWrapped}}`;
+
   return `<${elem} ${formatAttributes(attrs)} className=${_className}/>`;
 }
 

From 6363ce53f2704215bd582f5df1f844804f2a2542 Mon Sep 17 00:00:00 2001
From: Lee Chase <lee.chase@uk.ibm.com>
Date: Wed, 3 Feb 2021 15:03:07 +0000
Subject: [PATCH 4/4] chore: correct use of addElementClasses in element

---
 packages/icon-build-helpers/src/builders/react/builder.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/icon-build-helpers/src/builders/react/builder.js b/packages/icon-build-helpers/src/builders/react/builder.js
index ce1a460a991f..77b8dd6aba72 100644
--- a/packages/icon-build-helpers/src/builders/react/builder.js
+++ b/packages/icon-build-helpers/src/builders/react/builder.js
@@ -202,7 +202,7 @@ function convertToJSX(node, index) {
     _className = `${className} `;
     _classNameWrapped = `"${className}"`;
   }
-  _className = `{addElementClasses ? "${
+  _className = `{rest.addElementClasses ? "${
     _className || ''
   }ec-${elem}-${index}" : ${_classNameWrapped}}`;