@zohodesk/components 1.6.22 → 1.6.23

package/lib/Tag/__tests__/__snapshots__/Tag.spec.js.snap

@@ -4,7 +4,7 @@ exports[`Tag component Should be render closeTitle 1`] = `
 <DocumentFragment>
   <div
     aria-labelledby="1"
-    class="container effect    medium lgRadius default   "
+    class="container effect medium lgRadius default"
     data-id="tag_Tag"
     data-selector-id="tag"
     data-test-id="tag_Tag"
@@ -17,8 +17,7 @@ exports[`Tag component Should be render closeTitle 1`] = `
     />
     <button
       aria-label="Delete"
-      class="buttonReset close 
-            lgRadiusClose  closedanger "
+      class="buttonReset close lgRadiusClose closedanger"
       data-id="tag_RemoveTag"
       data-test-id="tag_RemoveTag"
       data-title="TagCloseTitle"
@@ -33,7 +32,7 @@ exports[`Tag component Should be render closeTitle 1`] = `
       >
         <i
           aria-hidden="true"
-          class="zd_font_icons  basic icon-close2 fbold  "
+          class="zd_font_icons basic icon-close2 fbold"
           data-id="fontIcon"
           data-selector-id="fontIcon"
           data-test-id="fontIcon"
@@ -49,7 +48,7 @@ exports[`Tag component Should be render dataId when active if false 1`] = `
 <DocumentFragment>
   <div
     aria-labelledby="1"
-    class="container effect    medium lgRadius default   "
+    class="container effect medium lgRadius default"
     data-id="TagdataId_Tag"
     data-selector-id="tag"
     data-test-id="TagdataId_Tag"
@@ -62,8 +61,7 @@ exports[`Tag component Should be render dataId when active if false 1`] = `
     />
     <button
       aria-label="Delete"
-      class="buttonReset close 
-            lgRadiusClose  closedanger "
+      class="buttonReset close lgRadiusClose closedanger"
       data-id="TagdataId_RemoveTag"
       data-test-id="TagdataId_RemoveTag"
       type="button"
@@ -77,7 +75,7 @@ exports[`Tag component Should be render dataId when active if false 1`] = `
       >
         <i
           aria-hidden="true"
-          class="zd_font_icons  basic icon-close2 fbold  "
+          class="zd_font_icons basic icon-close2 fbold"
           data-id="fontIcon"
           data-selector-id="fontIcon"
           data-test-id="fontIcon"
@@ -93,7 +91,7 @@ exports[`Tag component Should be render dataId when active if true 1`] = `
 <DocumentFragment>
   <div
     aria-labelledby="1"
-    class="container effect selected activedefault activemediumEffect  medium lgRadius default   "
+    class="container effect selected activedefault activemediumEffect medium lgRadius default"
     data-id="TagdataId_TagSelected"
     data-selector-id="tag"
     data-test-id="TagdataId_TagSelected"
@@ -106,8 +104,7 @@ exports[`Tag component Should be render dataId when active if true 1`] = `
     />
     <button
       aria-label="Delete"
-      class="buttonReset close activedangerClose
-            lgRadiusClose  closedanger "
+      class="buttonReset close activedangerClose lgRadiusClose closedanger"
       data-id="TagdataId_RemoveTag"
       data-test-id="TagdataId_RemoveTag"
       type="button"
@@ -121,7 +118,7 @@ exports[`Tag component Should be render dataId when active if true 1`] = `
       >
         <i
           aria-hidden="true"
-          class="zd_font_icons  basic icon-close2 fbold  "
+          class="zd_font_icons basic icon-close2 fbold"
           data-id="fontIcon"
           data-selector-id="fontIcon"
           data-test-id="fontIcon"
@@ -137,7 +134,7 @@ exports[`Tag component Should be render disabled is false 1`] = `
 <DocumentFragment>
   <div
     aria-labelledby="1"
-    class="container effect    medium lgRadius default   "
+    class="container effect medium lgRadius default"
     data-id="tag_Tag"
     data-selector-id="tag"
     data-test-id="tag_Tag"
@@ -156,7 +153,7 @@ exports[`Tag component Should be render disabled is true 1`] = `
 <DocumentFragment>
   <div
     aria-labelledby="1"
-    class="container effect    medium lgRadius default disabled  "
+    class="container effect medium lgRadius default disabled"
     data-id="tag_Tag"
     data-selector-id="tag"
     data-test-id="tag_Tag"
@@ -175,7 +172,7 @@ exports[`Tag component Should be render iconName and iconSize 1`] = `
 <DocumentFragment>
   <div
     aria-labelledby="1"
-    class="container effect    medium lgRadius default   "
+    class="container effect medium lgRadius default"
     data-id="tag_Tag"
     data-selector-id="tag"
     data-test-id="tag_Tag"
@@ -183,11 +180,11 @@ exports[`Tag component Should be render iconName and iconSize 1`] = `
   >
     <div
       aria-hidden="true"
-      class="icon "
+      class="icon"
     >
       <i
         aria-hidden="true"
-        class="zd_font_icons  basic icon-androidd   "
+        class="zd_font_icons basic icon-androidd"
         data-id="fontIcon"
         data-selector-id="fontIcon"
         data-test-id="fontIcon"
@@ -207,7 +204,7 @@ exports[`Tag component Should be render imageURL and hasAvatar 1`] = `
 <DocumentFragment>
   <div
     aria-labelledby="1"
-    class="container effect    medium lgRadius default   "
+    class="container effect medium lgRadius default"
     data-id="tag_Tag"
     data-selector-id="tag"
     data-test-id="tag_Tag"
@@ -217,20 +214,20 @@ exports[`Tag component Should be render imageURL and hasAvatar 1`] = `
       class="avatar"
     >
       <div
-        class="avatar small small circle primary black  "
+        class="avatar small small circle primary black"
         data-id="Avatar"
         data-selector-id="avatar"
         data-test-id="Avatar"
       >
         <img
-          class="image animate "
+          class="image animate"
           data-id="Avatar_AvatarImg"
           data-selector-id="avatar_AvatarImg"
           data-test-id="Avatar_AvatarImg"
           src="https://www.w3schools.com/images/w3schools_green.jpg"
         />
         <span
-          class="shadow black "
+          class="shadow black"
         />
       </div>
     </div>
@@ -247,7 +244,7 @@ exports[`Tag component Should be render initial 1`] = `
 <DocumentFragment>
   <div
     aria-labelledby="1"
-    class="container effect    medium lgRadius default   "
+    class="container effect medium lgRadius default"
     data-id="tag_Tag"
     data-selector-id="tag"
     data-test-id="tag_Tag"
@@ -257,7 +254,7 @@ exports[`Tag component Should be render initial 1`] = `
       class="avatar"
     >
       <div
-        class="avatar small small circle primary black border   "
+        class="avatar small small circle primary black border"
         data-id="Avatar"
         data-selector-id="avatar"
         data-test-id="Avatar"
@@ -286,7 +283,7 @@ exports[`Tag component Should be render isReadOnly is true 1`] = `
 <DocumentFragment>
   <div
     aria-labelledby="1"
-    class="container readonly    medium lgRadius default   "
+    class="container readonly medium lgRadius default"
     data-id="tag_Tag"
     data-selector-id="tag"
     data-test-id="tag_Tag"
@@ -305,7 +302,7 @@ exports[`Tag component Should be render needEffect is false 1`] = `
 <DocumentFragment>
   <div
     aria-labelledby="1"
-    class="container readonly    medium lgRadius default   "
+    class="container readonly medium lgRadius default"
     data-id="tag_Tag"
     data-selector-id="tag"
     data-test-id="tag_Tag"
@@ -324,7 +321,7 @@ exports[`Tag component Should be render onSelectTag 1`] = `
 <DocumentFragment>
   <div
     aria-labelledby="1"
-    class="container effect    medium lgRadius default  pointer "
+    class="container effect medium lgRadius default pointer"
     data-id="tag_Tag"
     data-selector-id="tag"
     data-test-id="tag_Tag"
@@ -343,7 +340,7 @@ exports[`Tag component Should be render rounded is false 1`] = `
 <DocumentFragment>
   <div
     aria-labelledby="1"
-    class="container effect    medium smRadius default   "
+    class="container effect medium smRadius default"
     data-id="tag_Tag"
     data-selector-id="tag"
     data-test-id="tag_Tag"
@@ -356,8 +353,7 @@ exports[`Tag component Should be render rounded is false 1`] = `
     />
     <button
       aria-label="Delete"
-      class="buttonReset close 
-            smRadiusClose  closedanger "
+      class="buttonReset close smRadiusClose closedanger"
       data-id="tag_RemoveTag"
       data-test-id="tag_RemoveTag"
       type="button"
@@ -371,7 +367,7 @@ exports[`Tag component Should be render rounded is false 1`] = `
       >
         <i
           aria-hidden="true"
-          class="zd_font_icons  basic icon-close2 fbold  "
+          class="zd_font_icons basic icon-close2 fbold"
           data-id="fontIcon"
           data-selector-id="fontIcon"
           data-test-id="fontIcon"
@@ -387,7 +383,7 @@ exports[`Tag component Should be render text 1`] = `
 <DocumentFragment>
   <div
     aria-labelledby="1"
-    class="container effect    medium lgRadius default   "
+    class="container effect medium lgRadius default"
     data-id="tag_Tag"
     data-selector-id="tag"
     data-test-id="tag_Tag"
@@ -409,7 +405,7 @@ exports[`Tag component Should be render tooltip 1`] = `
 <DocumentFragment>
   <div
     aria-labelledby="1"
-    class="container effect    medium lgRadius default   "
+    class="container effect medium lgRadius default"
     data-id="tag_Tag"
     data-selector-id="tag"
     data-test-id="tag_Tag"
@@ -429,7 +425,7 @@ exports[`Tag component Should be render with the basic set of default props 1`]
 <DocumentFragment>
   <div
     aria-labelledby="1"
-    class="container effect    medium lgRadius default   "
+    class="container effect medium lgRadius default"
     data-id="tag_Tag"
     data-selector-id="tag"
     data-test-id="tag_Tag"
@@ -448,7 +444,7 @@ exports[`Tag component Should render active - palette danger, size medium , clos
 <DocumentFragment>
   <div
     aria-labelledby="1"
-    class="container effect selected activedanger activemediumEffect  medium lgRadius danger   "
+    class="container effect selected activedanger activemediumEffect medium lgRadius danger"
     data-id="tag_TagSelected"
     data-selector-id="tag"
     data-test-id="tag_TagSelected"
@@ -461,8 +457,7 @@ exports[`Tag component Should render active - palette danger, size medium , clos
     />
     <button
       aria-label="Delete"
-      class="buttonReset close activedangerClose
-            lgRadiusClose  closedanger "
+      class="buttonReset close activedangerClose lgRadiusClose closedanger"
       data-id="tag_RemoveTag"
       data-test-id="tag_RemoveTag"
       type="button"
@@ -476,7 +471,7 @@ exports[`Tag component Should render active - palette danger, size medium , clos
       >
         <i
           aria-hidden="true"
-          class="zd_font_icons  basic icon-close2 fbold  "
+          class="zd_font_icons basic icon-close2 fbold"
           data-id="fontIcon"
           data-selector-id="fontIcon"
           data-test-id="fontIcon"
@@ -492,7 +487,7 @@ exports[`Tag component Should render active - palette danger, size medium , clos
 <DocumentFragment>
   <div
     aria-labelledby="1"
-    class="container effect selected activedanger activemediumEffect  medium lgRadius danger   "
+    class="container effect selected activedanger activemediumEffect medium lgRadius danger"
     data-id="tag_TagSelected"
     data-selector-id="tag"
     data-test-id="tag_TagSelected"
@@ -505,8 +500,7 @@ exports[`Tag component Should render active - palette danger, size medium , clos
     />
     <button
       aria-label="Delete"
-      class="buttonReset close activeprimaryClose
-            lgRadiusClose  closeprimary "
+      class="buttonReset close activeprimaryClose lgRadiusClose closeprimary"
       data-id="tag_RemoveTag"
       data-test-id="tag_RemoveTag"
       type="button"
@@ -520,7 +514,7 @@ exports[`Tag component Should render active - palette danger, size medium , clos
       >
         <i
           aria-hidden="true"
-          class="zd_font_icons  basic icon-close2 fbold  "
+          class="zd_font_icons basic icon-close2 fbold"
           data-id="fontIcon"
           data-selector-id="fontIcon"
           data-test-id="fontIcon"
@@ -536,7 +530,7 @@ exports[`Tag component Should render active - palette danger, size small , close
 <DocumentFragment>
   <div
     aria-labelledby="1"
-    class="container effect selected activedanger activesmallEffect  small lgRadius danger   "
+    class="container effect selected activedanger activesmallEffect small lgRadius danger"
     data-id="tag_TagSelected"
     data-selector-id="tag"
     data-test-id="tag_TagSelected"
@@ -549,8 +543,7 @@ exports[`Tag component Should render active - palette danger, size small , close
     />
     <button
       aria-label="Delete"
-      class="buttonReset close activedangerClose
-            lgRadiusClose  closedanger "
+      class="buttonReset close activedangerClose lgRadiusClose closedanger"
       data-id="tag_RemoveTag"
       data-test-id="tag_RemoveTag"
       type="button"
@@ -564,7 +557,7 @@ exports[`Tag component Should render active - palette danger, size small , close
       >
         <i
           aria-hidden="true"
-          class="zd_font_icons  basic icon-close2 fbold  "
+          class="zd_font_icons basic icon-close2 fbold"
           data-id="fontIcon"
           data-selector-id="fontIcon"
           data-test-id="fontIcon"
@@ -580,7 +573,7 @@ exports[`Tag component Should render active - palette danger, size small , close
 <DocumentFragment>
   <div
     aria-labelledby="1"
-    class="container effect selected activedanger activesmallEffect  small lgRadius danger   "
+    class="container effect selected activedanger activesmallEffect small lgRadius danger"
     data-id="tag_TagSelected"
     data-selector-id="tag"
     data-test-id="tag_TagSelected"
@@ -593,8 +586,7 @@ exports[`Tag component Should render active - palette danger, size small , close
     />
     <button
       aria-label="Delete"
-      class="buttonReset close activeprimaryClose
-            lgRadiusClose  closeprimary "
+      class="buttonReset close activeprimaryClose lgRadiusClose closeprimary"
       data-id="tag_RemoveTag"
       data-test-id="tag_RemoveTag"
       type="button"
@@ -608,7 +600,7 @@ exports[`Tag component Should render active - palette danger, size small , close
       >
         <i
           aria-hidden="true"
-          class="zd_font_icons  basic icon-close2 fbold  "
+          class="zd_font_icons basic icon-close2 fbold"
           data-id="fontIcon"
           data-selector-id="fontIcon"
           data-test-id="fontIcon"
@@ -624,7 +616,7 @@ exports[`Tag component Should render active - palette dark, size medium , closeP
 <DocumentFragment>
   <div
     aria-labelledby="1"
-    class="container effect selected undefined activemediumEffect  medium lgRadius dark   "
+    class="container effect selected activemediumEffect medium lgRadius dark"
     data-id="tag_TagSelected"
     data-selector-id="tag"
     data-test-id="tag_TagSelected"
@@ -637,8 +629,7 @@ exports[`Tag component Should render active - palette dark, size medium , closeP
     />
     <button
       aria-label="Delete"
-      class="buttonReset close activedangerClose
-            lgRadiusClose darkTagClose closedanger "
+      class="buttonReset close activedangerClose lgRadiusClose darkTagClose closedanger"
       data-id="tag_RemoveTag"
       data-test-id="tag_RemoveTag"
       type="button"
@@ -652,7 +643,7 @@ exports[`Tag component Should render active - palette dark, size medium , closeP
       >
         <i
           aria-hidden="true"
-          class="zd_font_icons  basic icon-close2 fbold  "
+          class="zd_font_icons basic icon-close2 fbold"
           data-id="fontIcon"
           data-selector-id="fontIcon"
           data-test-id="fontIcon"
@@ -668,7 +659,7 @@ exports[`Tag component Should render active - palette dark, size medium , closeP
 <DocumentFragment>
   <div
     aria-labelledby="1"
-    class="container effect selected undefined activemediumEffect  medium lgRadius dark   "
+    class="container effect selected activemediumEffect medium lgRadius dark"
     data-id="tag_TagSelected"
     data-selector-id="tag"
     data-test-id="tag_TagSelected"
@@ -681,8 +672,7 @@ exports[`Tag component Should render active - palette dark, size medium , closeP
     />
     <button
       aria-label="Delete"
-      class="buttonReset close activeprimaryClose
-            lgRadiusClose darkTagClose closeprimary "
+      class="buttonReset close activeprimaryClose lgRadiusClose darkTagClose closeprimary"
       data-id="tag_RemoveTag"
       data-test-id="tag_RemoveTag"
       type="button"
@@ -696,7 +686,7 @@ exports[`Tag component Should render active - palette dark, size medium , closeP
       >
         <i
           aria-hidden="true"
-          class="zd_font_icons  basic icon-close2 fbold  "
+          class="zd_font_icons basic icon-close2 fbold"
           data-id="fontIcon"
           data-selector-id="fontIcon"
           data-test-id="fontIcon"
@@ -712,7 +702,7 @@ exports[`Tag component Should render active - palette dark, size small , closePa
 <DocumentFragment>
   <div
     aria-labelledby="1"
-    class="container effect selected undefined activesmallEffect  small lgRadius dark   "
+    class="container effect selected activesmallEffect small lgRadius dark"
     data-id="tag_TagSelected"
     data-selector-id="tag"
     data-test-id="tag_TagSelected"
@@ -725,8 +715,7 @@ exports[`Tag component Should render active - palette dark, size small , closePa
     />
     <button
       aria-label="Delete"
-      class="buttonReset close activedangerClose
-            lgRadiusClose darkTagClose closedanger "
+      class="buttonReset close activedangerClose lgRadiusClose darkTagClose closedanger"
       data-id="tag_RemoveTag"
       data-test-id="tag_RemoveTag"
       type="button"
@@ -740,7 +729,7 @@ exports[`Tag component Should render active - palette dark, size small , closePa
       >
         <i
           aria-hidden="true"
-          class="zd_font_icons  basic icon-close2 fbold  "
+          class="zd_font_icons basic icon-close2 fbold"
           data-id="fontIcon"
           data-selector-id="fontIcon"
           data-test-id="fontIcon"
@@ -756,7 +745,7 @@ exports[`Tag component Should render active - palette dark, size small , closePa
 <DocumentFragment>
   <div
     aria-labelledby="1"
-    class="container effect selected undefined activesmallEffect  small lgRadius dark   "
+    class="container effect selected activesmallEffect small lgRadius dark"
     data-id="tag_TagSelected"
     data-selector-id="tag"
     data-test-id="tag_TagSelected"
@@ -769,8 +758,7 @@ exports[`Tag component Should render active - palette dark, size small , closePa
     />
     <button
       aria-label="Delete"
-      class="buttonReset close activeprimaryClose
-            lgRadiusClose darkTagClose closeprimary "
+      class="buttonReset close activeprimaryClose lgRadiusClose darkTagClose closeprimary"
       data-id="tag_RemoveTag"
       data-test-id="tag_RemoveTag"
       type="button"
@@ -784,7 +772,7 @@ exports[`Tag component Should render active - palette dark, size small , closePa
       >
         <i
           aria-hidden="true"
-          class="zd_font_icons  basic icon-close2 fbold  "
+          class="zd_font_icons basic icon-close2 fbold"
           data-id="fontIcon"
           data-selector-id="fontIcon"
           data-test-id="fontIcon"
@@ -800,7 +788,7 @@ exports[`Tag component Should render active - palette darkPrimaryDotted, size me
 <DocumentFragment>
   <div
     aria-labelledby="1"
-    class="container effect selected undefined activemediumEffect  medium lgRadius darkPrimaryDotted   "
+    class="container effect selected activemediumEffect medium lgRadius darkPrimaryDotted"
     data-id="tag_TagSelected"
     data-selector-id="tag"
     data-test-id="tag_TagSelected"
@@ -813,8 +801,7 @@ exports[`Tag component Should render active - palette darkPrimaryDotted, size me
     />
     <button
       aria-label="Delete"
-      class="buttonReset close activedangerClose
-            lgRadiusClose  closedanger "
+      class="buttonReset close activedangerClose lgRadiusClose closedanger"
       data-id="tag_RemoveTag"
       data-test-id="tag_RemoveTag"
       type="button"
@@ -828,7 +815,7 @@ exports[`Tag component Should render active - palette darkPrimaryDotted, size me
       >
         <i
           aria-hidden="true"
-          class="zd_font_icons  basic icon-close2 fbold  "
+          class="zd_font_icons basic icon-close2 fbold"
           data-id="fontIcon"
           data-selector-id="fontIcon"
           data-test-id="fontIcon"
@@ -844,7 +831,7 @@ exports[`Tag component Should render active - palette darkPrimaryDotted, size me
 <DocumentFragment>
   <div
     aria-labelledby="1"
-    class="container effect selected undefined activemediumEffect  medium lgRadius darkPrimaryDotted   "
+    class="container effect selected activemediumEffect medium lgRadius darkPrimaryDotted"
     data-id="tag_TagSelected"
     data-selector-id="tag"
     data-test-id="tag_TagSelected"
@@ -857,8 +844,7 @@ exports[`Tag component Should render active - palette darkPrimaryDotted, size me
     />
     <button
       aria-label="Delete"
-      class="buttonReset close activeprimaryClose
-            lgRadiusClose  closeprimary "
+      class="buttonReset close activeprimaryClose lgRadiusClose closeprimary"
       data-id="tag_RemoveTag"
       data-test-id="tag_RemoveTag"
       type="button"
@@ -872,7 +858,7 @@ exports[`Tag component Should render active - palette darkPrimaryDotted, size me
       >
         <i
           aria-hidden="true"
-          class="zd_font_icons  basic icon-close2 fbold  "
+          class="zd_font_icons basic icon-close2 fbold"
           data-id="fontIcon"
           data-selector-id="fontIcon"
           data-test-id="fontIcon"
@@ -888,7 +874,7 @@ exports[`Tag component Should render active - palette darkPrimaryDotted, size sm
 <DocumentFragment>
   <div
     aria-labelledby="1"
-    class="container effect selected undefined activesmallEffect  small lgRadius darkPrimaryDotted   "
+    class="container effect selected activesmallEffect small lgRadius darkPrimaryDotted"
     data-id="tag_TagSelected"
     data-selector-id="tag"
     data-test-id="tag_TagSelected"
@@ -901,8 +887,7 @@ exports[`Tag component Should render active - palette darkPrimaryDotted, size sm
     />
     <button
       aria-label="Delete"
-      class="buttonReset close activedangerClose
-            lgRadiusClose  closedanger "
+      class="buttonReset close activedangerClose lgRadiusClose closedanger"
       data-id="tag_RemoveTag"
       data-test-id="tag_RemoveTag"
       type="button"
@@ -916,7 +901,7 @@ exports[`Tag component Should render active - palette darkPrimaryDotted, size sm
       >
         <i
           aria-hidden="true"
-          class="zd_font_icons  basic icon-close2 fbold  "
+          class="zd_font_icons basic icon-close2 fbold"
           data-id="fontIcon"
           data-selector-id="fontIcon"
           data-test-id="fontIcon"
@@ -932,7 +917,7 @@ exports[`Tag component Should render active - palette darkPrimaryDotted, size sm
 <DocumentFragment>
   <div
     aria-labelledby="1"
-    class="container effect selected undefined activesmallEffect  small lgRadius darkPrimaryDotted   "
+    class="container effect selected activesmallEffect small lgRadius darkPrimaryDotted"
     data-id="tag_TagSelected"
     data-selector-id="tag"
     data-test-id="tag_TagSelected"
@@ -945,8 +930,7 @@ exports[`Tag component Should render active - palette darkPrimaryDotted, size sm
     />
     <button
       aria-label="Delete"
-      class="buttonReset close activeprimaryClose
-            lgRadiusClose  closeprimary "
+      class="buttonReset close activeprimaryClose lgRadiusClose closeprimary"
       data-id="tag_RemoveTag"
       data-test-id="tag_RemoveTag"
       type="button"
@@ -960,7 +944,7 @@ exports[`Tag component Should render active - palette darkPrimaryDotted, size sm
       >
         <i
           aria-hidden="true"
-          class="zd_font_icons  basic icon-close2 fbold  "
+          class="zd_font_icons basic icon-close2 fbold"
           data-id="fontIcon"
           data-selector-id="fontIcon"
           data-test-id="fontIcon"
@@ -976,7 +960,7 @@ exports[`Tag component Should render active - palette default, size medium , clo
 <DocumentFragment>
   <div
     aria-labelledby="1"
-    class="container effect selected activedefault activemediumEffect  medium lgRadius default   "
+    class="container effect selected activedefault activemediumEffect medium lgRadius default"
     data-id="tag_TagSelected"
     data-selector-id="tag"
     data-test-id="tag_TagSelected"
@@ -989,8 +973,7 @@ exports[`Tag component Should render active - palette default, size medium , clo
     />
     <button
       aria-label="Delete"
-      class="buttonReset close activedangerClose
-            lgRadiusClose  closedanger "
+      class="buttonReset close activedangerClose lgRadiusClose closedanger"
       data-id="tag_RemoveTag"
       data-test-id="tag_RemoveTag"
       type="button"
@@ -1004,7 +987,7 @@ exports[`Tag component Should render active - palette default, size medium , clo
       >
         <i
           aria-hidden="true"
-          class="zd_font_icons  basic icon-close2 fbold  "
+          class="zd_font_icons basic icon-close2 fbold"
           data-id="fontIcon"
           data-selector-id="fontIcon"
           data-test-id="fontIcon"
@@ -1020,7 +1003,7 @@ exports[`Tag component Should render active - palette default, size medium , clo
 <DocumentFragment>
   <div
     aria-labelledby="1"
-    class="container effect selected activedefault activemediumEffect  medium lgRadius default   "
+    class="container effect selected activedefault activemediumEffect medium lgRadius default"
     data-id="tag_TagSelected"
     data-selector-id="tag"
     data-test-id="tag_TagSelected"
@@ -1033,8 +1016,7 @@ exports[`Tag component Should render active - palette default, size medium , clo
     />
     <button
       aria-label="Delete"
-      class="buttonReset close activeprimaryClose
-            lgRadiusClose  closeprimary "
+      class="buttonReset close activeprimaryClose lgRadiusClose closeprimary"
       data-id="tag_RemoveTag"
       data-test-id="tag_RemoveTag"
       type="button"
@@ -1048,7 +1030,7 @@ exports[`Tag component Should render active - palette default, size medium , clo
       >
         <i
           aria-hidden="true"
-          class="zd_font_icons  basic icon-close2 fbold  "
+          class="zd_font_icons basic icon-close2 fbold"
           data-id="fontIcon"
           data-selector-id="fontIcon"
           data-test-id="fontIcon"
@@ -1064,7 +1046,7 @@ exports[`Tag component Should render active - palette default, size small , clos
 <DocumentFragment>
   <div
     aria-labelledby="1"
-    class="container effect selected activedefault activesmallEffect  small lgRadius default   "
+    class="container effect selected activedefault activesmallEffect small lgRadius default"
     data-id="tag_TagSelected"
     data-selector-id="tag"
     data-test-id="tag_TagSelected"
@@ -1077,8 +1059,7 @@ exports[`Tag component Should render active - palette default, size small , clos
     />
     <button
       aria-label="Delete"
-      class="buttonReset close activedangerClose
-            lgRadiusClose  closedanger "
+      class="buttonReset close activedangerClose lgRadiusClose closedanger"
       data-id="tag_RemoveTag"
       data-test-id="tag_RemoveTag"
       type="button"
@@ -1092,7 +1073,7 @@ exports[`Tag component Should render active - palette default, size small , clos
       >
         <i
           aria-hidden="true"
-          class="zd_font_icons  basic icon-close2 fbold  "
+          class="zd_font_icons basic icon-close2 fbold"
           data-id="fontIcon"
           data-selector-id="fontIcon"
           data-test-id="fontIcon"
@@ -1108,7 +1089,7 @@ exports[`Tag component Should render active - palette default, size small , clos
 <DocumentFragment>
   <div
     aria-labelledby="1"
-    class="container effect selected activedefault activesmallEffect  small lgRadius default   "
+    class="container effect selected activedefault activesmallEffect small lgRadius default"
     data-id="tag_TagSelected"
     data-selector-id="tag"
     data-test-id="tag_TagSelected"
@@ -1121,8 +1102,7 @@ exports[`Tag component Should render active - palette default, size small , clos
     />
     <button
       aria-label="Delete"
-      class="buttonReset close activeprimaryClose
-            lgRadiusClose  closeprimary "
+      class="buttonReset close activeprimaryClose lgRadiusClose closeprimary"
       data-id="tag_RemoveTag"
       data-test-id="tag_RemoveTag"
       type="button"
@@ -1136,7 +1116,7 @@ exports[`Tag component Should render active - palette default, size small , clos
       >
         <i
           aria-hidden="true"
-          class="zd_font_icons  basic icon-close2 fbold  "
+          class="zd_font_icons basic icon-close2 fbold"
           data-id="fontIcon"
           data-selector-id="fontIcon"
           data-test-id="fontIcon"
@@ -1152,7 +1132,7 @@ exports[`Tag component Should render active - palette defaultLink, size medium ,
 <DocumentFragment>
   <div
     aria-labelledby="1"
-    class="container effect selected activedefaultLink activemediumEffect  medium lgRadius defaultLink   "
+    class="container effect selected activedefaultLink activemediumEffect medium lgRadius defaultLink"
     data-id="tag_TagSelected"
     data-selector-id="tag"
     data-test-id="tag_TagSelected"
@@ -1165,8 +1145,7 @@ exports[`Tag component Should render active - palette defaultLink, size medium ,
     />
     <button
       aria-label="Delete"
-      class="buttonReset close activedangerClose
-            lgRadiusClose  closedanger "
+      class="buttonReset close activedangerClose lgRadiusClose closedanger"
       data-id="tag_RemoveTag"
       data-test-id="tag_RemoveTag"
       type="button"
@@ -1180,7 +1159,7 @@ exports[`Tag component Should render active - palette defaultLink, size medium ,
       >
         <i
           aria-hidden="true"
-          class="zd_font_icons  basic icon-close2 fbold  "
+          class="zd_font_icons basic icon-close2 fbold"
           data-id="fontIcon"
           data-selector-id="fontIcon"
           data-test-id="fontIcon"
@@ -1196,7 +1175,7 @@ exports[`Tag component Should render active - palette defaultLink, size medium ,
 <DocumentFragment>
   <div
     aria-labelledby="1"
-    class="container effect selected activedefaultLink activemediumEffect  medium lgRadius defaultLink   "
+    class="container effect selected activedefaultLink activemediumEffect medium lgRadius defaultLink"
     data-id="tag_TagSelected"
     data-selector-id="tag"
     data-test-id="tag_TagSelected"
@@ -1209,8 +1188,7 @@ exports[`Tag component Should render active - palette defaultLink, size medium ,
     />
     <button
       aria-label="Delete"
-      class="buttonReset close activeprimaryClose
-            lgRadiusClose  closeprimary "
+      class="buttonReset close activeprimaryClose lgRadiusClose closeprimary"
       data-id="tag_RemoveTag"
       data-test-id="tag_RemoveTag"
       type="button"
@@ -1224,7 +1202,7 @@ exports[`Tag component Should render active - palette defaultLink, size medium ,
       >
         <i
           aria-hidden="true"
-          class="zd_font_icons  basic icon-close2 fbold  "
+          class="zd_font_icons basic icon-close2 fbold"
           data-id="fontIcon"
           data-selector-id="fontIcon"
           data-test-id="fontIcon"
@@ -1240,7 +1218,7 @@ exports[`Tag component Should render active - palette defaultLink, size small ,
 <DocumentFragment>
   <div
     aria-labelledby="1"
-    class="container effect selected activedefaultLink activesmallEffect  small lgRadius defaultLink   "
+    class="container effect selected activedefaultLink activesmallEffect small lgRadius defaultLink"
     data-id="tag_TagSelected"
     data-selector-id="tag"
     data-test-id="tag_TagSelected"
@@ -1253,8 +1231,7 @@ exports[`Tag component Should render active - palette defaultLink, size small ,
     />
     <button
       aria-label="Delete"
-      class="buttonReset close activedangerClose
-            lgRadiusClose  closedanger "
+      class="buttonReset close activedangerClose lgRadiusClose closedanger"
       data-id="tag_RemoveTag"
       data-test-id="tag_RemoveTag"
       type="button"
@@ -1268,7 +1245,7 @@ exports[`Tag component Should render active - palette defaultLink, size small ,
       >
         <i
           aria-hidden="true"
-          class="zd_font_icons  basic icon-close2 fbold  "
+          class="zd_font_icons basic icon-close2 fbold"
           data-id="fontIcon"
           data-selector-id="fontIcon"
           data-test-id="fontIcon"
@@ -1284,7 +1261,7 @@ exports[`Tag component Should render active - palette defaultLink, size small ,
 <DocumentFragment>
   <div
     aria-labelledby="1"
-    class="container effect selected activedefaultLink activesmallEffect  small lgRadius defaultLink   "
+    class="container effect selected activedefaultLink activesmallEffect small lgRadius defaultLink"
     data-id="tag_TagSelected"
     data-selector-id="tag"
     data-test-id="tag_TagSelected"
@@ -1297,8 +1274,7 @@ exports[`Tag component Should render active - palette defaultLink, size small ,
     />
     <button
       aria-label="Delete"
-      class="buttonReset close activeprimaryClose
-            lgRadiusClose  closeprimary "
+      class="buttonReset close activeprimaryClose lgRadiusClose closeprimary"
       data-id="tag_RemoveTag"
       data-test-id="tag_RemoveTag"
       type="button"
@@ -1312,7 +1288,7 @@ exports[`Tag component Should render active - palette defaultLink, size small ,
       >
         <i
           aria-hidden="true"
-          class="zd_font_icons  basic icon-close2 fbold  "
+          class="zd_font_icons basic icon-close2 fbold"
           data-id="fontIcon"
           data-selector-id="fontIcon"
           data-test-id="fontIcon"
@@ -1328,7 +1304,7 @@ exports[`Tag component Should render active - palette primaryDotted, size medium
 <DocumentFragment>
   <div
     aria-labelledby="1"
-    class="container effect selected activeprimaryDotted activemediumEffect  medium lgRadius primaryDotted   "
+    class="container effect selected activeprimaryDotted activemediumEffect medium lgRadius primaryDotted"
     data-id="tag_TagSelected"
     data-selector-id="tag"
     data-test-id="tag_TagSelected"
@@ -1341,8 +1317,7 @@ exports[`Tag component Should render active - palette primaryDotted, size medium
     />
     <button
       aria-label="Delete"
-      class="buttonReset close activedangerClose
-            lgRadiusClose  closedanger "
+      class="buttonReset close activedangerClose lgRadiusClose closedanger"
       data-id="tag_RemoveTag"
       data-test-id="tag_RemoveTag"
       type="button"
@@ -1356,7 +1331,7 @@ exports[`Tag component Should render active - palette primaryDotted, size medium
       >
         <i
           aria-hidden="true"
-          class="zd_font_icons  basic icon-close2 fbold  "
+          class="zd_font_icons basic icon-close2 fbold"
           data-id="fontIcon"
           data-selector-id="fontIcon"
           data-test-id="fontIcon"
@@ -1372,7 +1347,7 @@ exports[`Tag component Should render active - palette primaryDotted, size medium
 <DocumentFragment>
   <div
     aria-labelledby="1"
-    class="container effect selected activeprimaryDotted activemediumEffect  medium lgRadius primaryDotted   "
+    class="container effect selected activeprimaryDotted activemediumEffect medium lgRadius primaryDotted"
     data-id="tag_TagSelected"
     data-selector-id="tag"
     data-test-id="tag_TagSelected"
@@ -1385,8 +1360,7 @@ exports[`Tag component Should render active - palette primaryDotted, size medium
     />
     <button
       aria-label="Delete"
-      class="buttonReset close activeprimaryClose
-            lgRadiusClose  closeprimary "
+      class="buttonReset close activeprimaryClose lgRadiusClose closeprimary"
       data-id="tag_RemoveTag"
       data-test-id="tag_RemoveTag"
       type="button"
@@ -1400,7 +1374,7 @@ exports[`Tag component Should render active - palette primaryDotted, size medium
       >
         <i
           aria-hidden="true"
-          class="zd_font_icons  basic icon-close2 fbold  "
+          class="zd_font_icons basic icon-close2 fbold"
           data-id="fontIcon"
           data-selector-id="fontIcon"
           data-test-id="fontIcon"
@@ -1416,7 +1390,7 @@ exports[`Tag component Should render active - palette primaryDotted, size small
 <DocumentFragment>
   <div
     aria-labelledby="1"
-    class="container effect selected activeprimaryDotted activesmallEffect  small lgRadius primaryDotted   "
+    class="container effect selected activeprimaryDotted activesmallEffect small lgRadius primaryDotted"
     data-id="tag_TagSelected"
     data-selector-id="tag"
     data-test-id="tag_TagSelected"
@@ -1429,8 +1403,7 @@ exports[`Tag component Should render active - palette primaryDotted, size small
     />
     <button
       aria-label="Delete"
-      class="buttonReset close activedangerClose
-            lgRadiusClose  closedanger "
+      class="buttonReset close activedangerClose lgRadiusClose closedanger"
       data-id="tag_RemoveTag"
       data-test-id="tag_RemoveTag"
       type="button"
@@ -1444,7 +1417,7 @@ exports[`Tag component Should render active - palette primaryDotted, size small
       >
         <i
           aria-hidden="true"
-          class="zd_font_icons  basic icon-close2 fbold  "
+          class="zd_font_icons basic icon-close2 fbold"
           data-id="fontIcon"
           data-selector-id="fontIcon"
           data-test-id="fontIcon"
@@ -1460,7 +1433,7 @@ exports[`Tag component Should render active - palette primaryDotted, size small
 <DocumentFragment>
   <div
     aria-labelledby="1"
-    class="container effect selected activeprimaryDotted activesmallEffect  small lgRadius primaryDotted   "
+    class="container effect selected activeprimaryDotted activesmallEffect small lgRadius primaryDotted"
     data-id="tag_TagSelected"
     data-selector-id="tag"
     data-test-id="tag_TagSelected"
@@ -1473,8 +1446,7 @@ exports[`Tag component Should render active - palette primaryDotted, size small
     />
     <button
       aria-label="Delete"
-      class="buttonReset close activeprimaryClose
-            lgRadiusClose  closeprimary "
+      class="buttonReset close activeprimaryClose lgRadiusClose closeprimary"
       data-id="tag_RemoveTag"
       data-test-id="tag_RemoveTag"
       type="button"
@@ -1488,7 +1460,7 @@ exports[`Tag component Should render active - palette primaryDotted, size small
       >
         <i
           aria-hidden="true"
-          class="zd_font_icons  basic icon-close2 fbold  "
+          class="zd_font_icons basic icon-close2 fbold"
           data-id="fontIcon"
           data-selector-id="fontIcon"
           data-test-id="fontIcon"
@@ -1504,7 +1476,7 @@ exports[`Tag component Should render active - palette pureDarkDotted, size mediu
 <DocumentFragment>
   <div
     aria-labelledby="1"
-    class="container effect selected undefined activemediumEffect  medium lgRadius pureDarkDotted   "
+    class="container effect selected activemediumEffect medium lgRadius pureDarkDotted"
     data-id="tag_TagSelected"
     data-selector-id="tag"
     data-test-id="tag_TagSelected"
@@ -1517,8 +1489,7 @@ exports[`Tag component Should render active - palette pureDarkDotted, size mediu
     />
     <button
       aria-label="Delete"
-      class="buttonReset close activedangerClose
-            lgRadiusClose  closedanger "
+      class="buttonReset close activedangerClose lgRadiusClose closedanger"
       data-id="tag_RemoveTag"
       data-test-id="tag_RemoveTag"
       type="button"
@@ -1532,7 +1503,7 @@ exports[`Tag component Should render active - palette pureDarkDotted, size mediu
       >
         <i
           aria-hidden="true"
-          class="zd_font_icons  basic icon-close2 fbold  "
+          class="zd_font_icons basic icon-close2 fbold"
           data-id="fontIcon"
           data-selector-id="fontIcon"
           data-test-id="fontIcon"
@@ -1548,7 +1519,7 @@ exports[`Tag component Should render active - palette pureDarkDotted, size mediu
 <DocumentFragment>
   <div
     aria-labelledby="1"
-    class="container effect selected undefined activemediumEffect  medium lgRadius pureDarkDotted   "
+    class="container effect selected activemediumEffect medium lgRadius pureDarkDotted"
     data-id="tag_TagSelected"
     data-selector-id="tag"
     data-test-id="tag_TagSelected"
@@ -1561,8 +1532,7 @@ exports[`Tag component Should render active - palette pureDarkDotted, size mediu
     />
     <button
       aria-label="Delete"
-      class="buttonReset close activeprimaryClose
-            lgRadiusClose  closeprimary "
+      class="buttonReset close activeprimaryClose lgRadiusClose closeprimary"
       data-id="tag_RemoveTag"
       data-test-id="tag_RemoveTag"
       type="button"
@@ -1576,7 +1546,7 @@ exports[`Tag component Should render active - palette pureDarkDotted, size mediu
       >
         <i
           aria-hidden="true"
-          class="zd_font_icons  basic icon-close2 fbold  "
+          class="zd_font_icons basic icon-close2 fbold"
           data-id="fontIcon"
           data-selector-id="fontIcon"
           data-test-id="fontIcon"
@@ -1592,7 +1562,7 @@ exports[`Tag component Should render active - palette pureDarkDotted, size small
 <DocumentFragment>
   <div
     aria-labelledby="1"
-    class="container effect selected undefined activesmallEffect  small lgRadius pureDarkDotted   "
+    class="container effect selected activesmallEffect small lgRadius pureDarkDotted"
     data-id="tag_TagSelected"
     data-selector-id="tag"
     data-test-id="tag_TagSelected"
@@ -1605,8 +1575,7 @@ exports[`Tag component Should render active - palette pureDarkDotted, size small
     />
     <button
       aria-label="Delete"
-      class="buttonReset close activedangerClose
-            lgRadiusClose  closedanger "
+      class="buttonReset close activedangerClose lgRadiusClose closedanger"
       data-id="tag_RemoveTag"
       data-test-id="tag_RemoveTag"
       type="button"
@@ -1620,7 +1589,7 @@ exports[`Tag component Should render active - palette pureDarkDotted, size small
       >
         <i
           aria-hidden="true"
-          class="zd_font_icons  basic icon-close2 fbold  "
+          class="zd_font_icons basic icon-close2 fbold"
           data-id="fontIcon"
           data-selector-id="fontIcon"
           data-test-id="fontIcon"
@@ -1636,7 +1605,7 @@ exports[`Tag component Should render active - palette pureDarkDotted, size small
 <DocumentFragment>
   <div
     aria-labelledby="1"
-    class="container effect selected undefined activesmallEffect  small lgRadius pureDarkDotted   "
+    class="container effect selected activesmallEffect small lgRadius pureDarkDotted"
     data-id="tag_TagSelected"
     data-selector-id="tag"
     data-test-id="tag_TagSelected"
@@ -1649,8 +1618,7 @@ exports[`Tag component Should render active - palette pureDarkDotted, size small
     />
     <button
       aria-label="Delete"
-      class="buttonReset close activeprimaryClose
-            lgRadiusClose  closeprimary "
+      class="buttonReset close activeprimaryClose lgRadiusClose closeprimary"
       data-id="tag_RemoveTag"
       data-test-id="tag_RemoveTag"
       type="button"
@@ -1664,7 +1632,7 @@ exports[`Tag component Should render active - palette pureDarkDotted, size small
       >
         <i
           aria-hidden="true"
-          class="zd_font_icons  basic icon-close2 fbold  "
+          class="zd_font_icons basic icon-close2 fbold"
           data-id="fontIcon"
           data-selector-id="fontIcon"
           data-test-id="fontIcon"
@@ -1680,7 +1648,7 @@ exports[`Tag component Should render active - palette pureDotted, size medium ,
 <DocumentFragment>
   <div
     aria-labelledby="1"
-    class="container effect selected activepureDotted activemediumEffect  medium lgRadius pureDotted   "
+    class="container effect selected activepureDotted activemediumEffect medium lgRadius pureDotted"
     data-id="tag_TagSelected"
     data-selector-id="tag"
     data-test-id="tag_TagSelected"
@@ -1693,8 +1661,7 @@ exports[`Tag component Should render active - palette pureDotted, size medium ,
     />
     <button
       aria-label="Delete"
-      class="buttonReset close activedangerClose
-            lgRadiusClose  closedanger "
+      class="buttonReset close activedangerClose lgRadiusClose closedanger"
       data-id="tag_RemoveTag"
       data-test-id="tag_RemoveTag"
       type="button"
@@ -1708,7 +1675,7 @@ exports[`Tag component Should render active - palette pureDotted, size medium ,
       >
         <i
           aria-hidden="true"
-          class="zd_font_icons  basic icon-close2 fbold  "
+          class="zd_font_icons basic icon-close2 fbold"
           data-id="fontIcon"
           data-selector-id="fontIcon"
           data-test-id="fontIcon"
@@ -1724,7 +1691,7 @@ exports[`Tag component Should render active - palette pureDotted, size medium ,
 <DocumentFragment>
   <div
     aria-labelledby="1"
-    class="container effect selected activepureDotted activemediumEffect  medium lgRadius pureDotted   "
+    class="container effect selected activepureDotted activemediumEffect medium lgRadius pureDotted"
     data-id="tag_TagSelected"
     data-selector-id="tag"
     data-test-id="tag_TagSelected"
@@ -1737,8 +1704,7 @@ exports[`Tag component Should render active - palette pureDotted, size medium ,
     />
     <button
       aria-label="Delete"
-      class="buttonReset close activeprimaryClose
-            lgRadiusClose  closeprimary "
+      class="buttonReset close activeprimaryClose lgRadiusClose closeprimary"
       data-id="tag_RemoveTag"
       data-test-id="tag_RemoveTag"
       type="button"
@@ -1752,7 +1718,7 @@ exports[`Tag component Should render active - palette pureDotted, size medium ,
       >
         <i
           aria-hidden="true"
-          class="zd_font_icons  basic icon-close2 fbold  "
+          class="zd_font_icons basic icon-close2 fbold"
           data-id="fontIcon"
           data-selector-id="fontIcon"
           data-test-id="fontIcon"
@@ -1768,7 +1734,7 @@ exports[`Tag component Should render active - palette pureDotted, size small , c
 <DocumentFragment>
   <div
     aria-labelledby="1"
-    class="container effect selected activepureDotted activesmallEffect  small lgRadius pureDotted   "
+    class="container effect selected activepureDotted activesmallEffect small lgRadius pureDotted"
     data-id="tag_TagSelected"
     data-selector-id="tag"
     data-test-id="tag_TagSelected"
@@ -1781,8 +1747,7 @@ exports[`Tag component Should render active - palette pureDotted, size small , c
     />
     <button
       aria-label="Delete"
-      class="buttonReset close activedangerClose
-            lgRadiusClose  closedanger "
+      class="buttonReset close activedangerClose lgRadiusClose closedanger"
       data-id="tag_RemoveTag"
       data-test-id="tag_RemoveTag"
       type="button"
@@ -1796,7 +1761,7 @@ exports[`Tag component Should render active - palette pureDotted, size small , c
       >
         <i
           aria-hidden="true"
-          class="zd_font_icons  basic icon-close2 fbold  "
+          class="zd_font_icons basic icon-close2 fbold"
           data-id="fontIcon"
           data-selector-id="fontIcon"
           data-test-id="fontIcon"
@@ -1812,7 +1777,7 @@ exports[`Tag component Should render active - palette pureDotted, size small , c
 <DocumentFragment>
   <div
     aria-labelledby="1"
-    class="container effect selected activepureDotted activesmallEffect  small lgRadius pureDotted   "
+    class="container effect selected activepureDotted activesmallEffect small lgRadius pureDotted"
     data-id="tag_TagSelected"
     data-selector-id="tag"
     data-test-id="tag_TagSelected"
@@ -1825,8 +1790,7 @@ exports[`Tag component Should render active - palette pureDotted, size small , c
     />
     <button
       aria-label="Delete"
-      class="buttonReset close activeprimaryClose
-            lgRadiusClose  closeprimary "
+      class="buttonReset close activeprimaryClose lgRadiusClose closeprimary"
       data-id="tag_RemoveTag"
       data-test-id="tag_RemoveTag"
       type="button"
@@ -1840,7 +1804,7 @@ exports[`Tag component Should render active - palette pureDotted, size small , c
       >
         <i
           aria-hidden="true"
-          class="zd_font_icons  basic icon-close2 fbold  "
+          class="zd_font_icons basic icon-close2 fbold"
           data-id="fontIcon"
           data-selector-id="fontIcon"
           data-test-id="fontIcon"
@@ -1856,7 +1820,7 @@ exports[`Tag component Should render active - palette secondary, size medium , c
 <DocumentFragment>
   <div
     aria-labelledby="1"
-    class="container effect selected activesecondary activemediumEffect  medium lgRadius secondary   "
+    class="container effect selected activesecondary activemediumEffect medium lgRadius secondary"
     data-id="tag_TagSelected"
     data-selector-id="tag"
     data-test-id="tag_TagSelected"
@@ -1869,8 +1833,7 @@ exports[`Tag component Should render active - palette secondary, size medium , c
     />
     <button
       aria-label="Delete"
-      class="buttonReset close activedangerClose
-            lgRadiusClose  closedanger "
+      class="buttonReset close activedangerClose lgRadiusClose closedanger"
       data-id="tag_RemoveTag"
       data-test-id="tag_RemoveTag"
       type="button"
@@ -1884,7 +1847,7 @@ exports[`Tag component Should render active - palette secondary, size medium , c
       >
         <i
           aria-hidden="true"
-          class="zd_font_icons  basic icon-close2 fbold  "
+          class="zd_font_icons basic icon-close2 fbold"
           data-id="fontIcon"
           data-selector-id="fontIcon"
           data-test-id="fontIcon"
@@ -1900,7 +1863,7 @@ exports[`Tag component Should render active - palette secondary, size medium , c
 <DocumentFragment>
   <div
     aria-labelledby="1"
-    class="container effect selected activesecondary activemediumEffect  medium lgRadius secondary   "
+    class="container effect selected activesecondary activemediumEffect medium lgRadius secondary"
     data-id="tag_TagSelected"
     data-selector-id="tag"
     data-test-id="tag_TagSelected"
@@ -1913,8 +1876,7 @@ exports[`Tag component Should render active - palette secondary, size medium , c
     />
     <button
       aria-label="Delete"
-      class="buttonReset close activeprimaryClose
-            lgRadiusClose  closeprimary "
+      class="buttonReset close activeprimaryClose lgRadiusClose closeprimary"
       data-id="tag_RemoveTag"
       data-test-id="tag_RemoveTag"
       type="button"
@@ -1928,7 +1890,7 @@ exports[`Tag component Should render active - palette secondary, size medium , c
       >
         <i
           aria-hidden="true"
-          class="zd_font_icons  basic icon-close2 fbold  "
+          class="zd_font_icons basic icon-close2 fbold"
           data-id="fontIcon"
           data-selector-id="fontIcon"
           data-test-id="fontIcon"
@@ -1944,7 +1906,7 @@ exports[`Tag component Should render active - palette secondary, size small , cl
 <DocumentFragment>
   <div
     aria-labelledby="1"
-    class="container effect selected activesecondary activesmallEffect  small lgRadius secondary   "
+    class="container effect selected activesecondary activesmallEffect small lgRadius secondary"
     data-id="tag_TagSelected"
     data-selector-id="tag"
     data-test-id="tag_TagSelected"
@@ -1957,8 +1919,7 @@ exports[`Tag component Should render active - palette secondary, size small , cl
     />
     <button
       aria-label="Delete"
-      class="buttonReset close activedangerClose
-            lgRadiusClose  closedanger "
+      class="buttonReset close activedangerClose lgRadiusClose closedanger"
       data-id="tag_RemoveTag"
       data-test-id="tag_RemoveTag"
       type="button"
@@ -1972,7 +1933,7 @@ exports[`Tag component Should render active - palette secondary, size small , cl
       >
         <i
           aria-hidden="true"
-          class="zd_font_icons  basic icon-close2 fbold  "
+          class="zd_font_icons basic icon-close2 fbold"
           data-id="fontIcon"
           data-selector-id="fontIcon"
           data-test-id="fontIcon"
@@ -1988,7 +1949,7 @@ exports[`Tag component Should render active - palette secondary, size small , cl
 <DocumentFragment>
   <div
     aria-labelledby="1"
-    class="container effect selected activesecondary activesmallEffect  small lgRadius secondary   "
+    class="container effect selected activesecondary activesmallEffect small lgRadius secondary"
     data-id="tag_TagSelected"
     data-selector-id="tag"
     data-test-id="tag_TagSelected"
@@ -2001,8 +1962,7 @@ exports[`Tag component Should render active - palette secondary, size small , cl
     />
     <button
       aria-label="Delete"
-      class="buttonReset close activeprimaryClose
-            lgRadiusClose  closeprimary "
+      class="buttonReset close activeprimaryClose lgRadiusClose closeprimary"
       data-id="tag_RemoveTag"
       data-test-id="tag_RemoveTag"
       type="button"
@@ -2016,7 +1976,7 @@ exports[`Tag component Should render active - palette secondary, size small , cl
       >
         <i
           aria-hidden="true"
-          class="zd_font_icons  basic icon-close2 fbold  "
+          class="zd_font_icons basic icon-close2 fbold"
           data-id="fontIcon"
           data-selector-id="fontIcon"
           data-test-id="fontIcon"
@@ -2032,7 +1992,7 @@ exports[`Tag component Should render avatarPalette - danger 1`] = `
 <DocumentFragment>
   <div
     aria-labelledby="1"
-    class="container effect    medium lgRadius danger   "
+    class="container effect medium lgRadius danger"
     data-id="tag_Tag"
     data-selector-id="tag"
     data-test-id="tag_Tag"
@@ -2042,7 +2002,7 @@ exports[`Tag component Should render avatarPalette - danger 1`] = `
       class="avatar"
     >
       <div
-        class="avatar small small circle primary black border   "
+        class="avatar small small circle primary black border"
         data-id="Avatar"
         data-selector-id="avatar"
         data-test-id="Avatar"
@@ -2068,7 +2028,7 @@ exports[`Tag component Should render avatarPalette - dark 1`] = `
 <DocumentFragment>
   <div
     aria-labelledby="1"
-    class="container effect    medium lgRadius dark   "
+    class="container effect medium lgRadius dark"
     data-id="tag_Tag"
     data-selector-id="tag"
     data-test-id="tag_Tag"
@@ -2078,7 +2038,7 @@ exports[`Tag component Should render avatarPalette - dark 1`] = `
       class="avatar"
     >
       <div
-        class="avatar small small circle info white border   "
+        class="avatar small small circle info white border"
         data-id="Avatar"
         data-selector-id="avatar"
         data-test-id="Avatar"
@@ -2104,7 +2064,7 @@ exports[`Tag component Should render avatarPalette - darkPrimaryDotted 1`] = `
 <DocumentFragment>
   <div
     aria-labelledby="1"
-    class="container effect    medium lgRadius darkPrimaryDotted   "
+    class="container effect medium lgRadius darkPrimaryDotted"
     data-id="tag_Tag"
     data-selector-id="tag"
     data-test-id="tag_Tag"
@@ -2114,7 +2074,7 @@ exports[`Tag component Should render avatarPalette - darkPrimaryDotted 1`] = `
       class="avatar"
     >
       <div
-        class="avatar small small circle primary black border   "
+        class="avatar small small circle primary black border"
         data-id="Avatar"
         data-selector-id="avatar"
         data-test-id="Avatar"
@@ -2140,7 +2100,7 @@ exports[`Tag component Should render avatarPalette - default 1`] = `
 <DocumentFragment>
   <div
     aria-labelledby="1"
-    class="container effect    medium lgRadius default   "
+    class="container effect medium lgRadius default"
     data-id="tag_Tag"
     data-selector-id="tag"
     data-test-id="tag_Tag"
@@ -2150,7 +2110,7 @@ exports[`Tag component Should render avatarPalette - default 1`] = `
       class="avatar"
     >
       <div
-        class="avatar small small circle primary black border   "
+        class="avatar small small circle primary black border"
         data-id="Avatar"
         data-selector-id="avatar"
         data-test-id="Avatar"
@@ -2176,7 +2136,7 @@ exports[`Tag component Should render avatarPalette - defaultLink 1`] = `
 <DocumentFragment>
   <div
     aria-labelledby="1"
-    class="container effect    medium lgRadius defaultLink   "
+    class="container effect medium lgRadius defaultLink"
     data-id="tag_Tag"
     data-selector-id="tag"
     data-test-id="tag_Tag"
@@ -2186,7 +2146,7 @@ exports[`Tag component Should render avatarPalette - defaultLink 1`] = `
       class="avatar"
     >
       <div
-        class="avatar small small circle primary black border   "
+        class="avatar small small circle primary black border"
         data-id="Avatar"
         data-selector-id="avatar"
         data-test-id="Avatar"
@@ -2212,7 +2172,7 @@ exports[`Tag component Should render avatarPalette - primaryDotted 1`] = `
 <DocumentFragment>
   <div
     aria-labelledby="1"
-    class="container effect    medium lgRadius primaryDotted   "
+    class="container effect medium lgRadius primaryDotted"
     data-id="tag_Tag"
     data-selector-id="tag"
     data-test-id="tag_Tag"
@@ -2222,7 +2182,7 @@ exports[`Tag component Should render avatarPalette - primaryDotted 1`] = `
       class="avatar"
     >
       <div
-        class="avatar small small circle primary black border   "
+        class="avatar small small circle primary black border"
         data-id="Avatar"
         data-selector-id="avatar"
         data-test-id="Avatar"
@@ -2248,7 +2208,7 @@ exports[`Tag component Should render avatarPalette - pureDarkDotted 1`] = `
 <DocumentFragment>
   <div
     aria-labelledby="1"
-    class="container effect    medium lgRadius pureDarkDotted   "
+    class="container effect medium lgRadius pureDarkDotted"
     data-id="tag_Tag"
     data-selector-id="tag"
     data-test-id="tag_Tag"
@@ -2258,7 +2218,7 @@ exports[`Tag component Should render avatarPalette - pureDarkDotted 1`] = `
       class="avatar"
     >
       <div
-        class="avatar small small circle primary black border   "
+        class="avatar small small circle primary black border"
         data-id="Avatar"
         data-selector-id="avatar"
         data-test-id="Avatar"
@@ -2284,7 +2244,7 @@ exports[`Tag component Should render avatarPalette - pureDotted 1`] = `
 <DocumentFragment>
   <div
     aria-labelledby="1"
-    class="container effect    medium lgRadius pureDotted   "
+    class="container effect medium lgRadius pureDotted"
     data-id="tag_Tag"
     data-selector-id="tag"
     data-test-id="tag_Tag"
@@ -2294,7 +2254,7 @@ exports[`Tag component Should render avatarPalette - pureDotted 1`] = `
       class="avatar"
     >
       <div
-        class="avatar small small circle primary black border   "
+        class="avatar small small circle primary black border"
         data-id="Avatar"
         data-selector-id="avatar"
         data-test-id="Avatar"
@@ -2320,7 +2280,7 @@ exports[`Tag component Should render avatarPalette - secondary 1`] = `
 <DocumentFragment>
   <div
     aria-labelledby="1"
-    class="container effect    medium lgRadius secondary   "
+    class="container effect medium lgRadius secondary"
     data-id="tag_Tag"
     data-selector-id="tag"
     data-test-id="tag_Tag"
@@ -2330,7 +2290,7 @@ exports[`Tag component Should render avatarPalette - secondary 1`] = `
       class="avatar"
     >
       <div
-        class="avatar small small circle primary black border   "
+        class="avatar small small circle primary black border"
         data-id="Avatar"
         data-selector-id="avatar"
         data-test-id="Avatar"
@@ -2356,7 +2316,7 @@ exports[`Tag component Should render closePalette - danger 1`] = `
 <DocumentFragment>
   <div
     aria-labelledby="1"
-    class="container effect selected activedefault activemediumEffect  medium lgRadius default   "
+    class="container effect selected activedefault activemediumEffect medium lgRadius default"
     data-id="tag_TagSelected"
     data-selector-id="tag"
     data-test-id="tag_TagSelected"
@@ -2369,8 +2329,7 @@ exports[`Tag component Should render closePalette - danger 1`] = `
     />
     <button
       aria-label="Delete"
-      class="buttonReset close activedangerClose
-            lgRadiusClose  closedanger "
+      class="buttonReset close activedangerClose lgRadiusClose closedanger"
       data-id="tag_RemoveTag"
       data-test-id="tag_RemoveTag"
       type="button"
@@ -2384,7 +2343,7 @@ exports[`Tag component Should render closePalette - danger 1`] = `
       >
         <i
           aria-hidden="true"
-          class="zd_font_icons  basic icon-close2 fbold  "
+          class="zd_font_icons basic icon-close2 fbold"
           data-id="fontIcon"
           data-selector-id="fontIcon"
           data-test-id="fontIcon"
@@ -2400,7 +2359,7 @@ exports[`Tag component Should render closePalette - primary 1`] = `
 <DocumentFragment>
   <div
     aria-labelledby="1"
-    class="container effect selected activedefault activemediumEffect  medium lgRadius default   "
+    class="container effect selected activedefault activemediumEffect medium lgRadius default"
     data-id="tag_TagSelected"
     data-selector-id="tag"
     data-test-id="tag_TagSelected"
@@ -2413,8 +2372,7 @@ exports[`Tag component Should render closePalette - primary 1`] = `
     />
     <button
       aria-label="Delete"
-      class="buttonReset close activeprimaryClose
-            lgRadiusClose  closeprimary "
+      class="buttonReset close activeprimaryClose lgRadiusClose closeprimary"
       data-id="tag_RemoveTag"
       data-test-id="tag_RemoveTag"
       type="button"
@@ -2428,7 +2386,7 @@ exports[`Tag component Should render closePalette - primary 1`] = `
       >
         <i
           aria-hidden="true"
-          class="zd_font_icons  basic icon-close2 fbold  "
+          class="zd_font_icons basic icon-close2 fbold"
           data-id="fontIcon"
           data-selector-id="fontIcon"
           data-test-id="fontIcon"
@@ -2444,7 +2402,7 @@ exports[`Tag component Should render onRemove - medium 1`] = `
 <DocumentFragment>
   <div
     aria-labelledby="1"
-    class="container effect selected activedefault activemediumEffect  medium lgRadius default   "
+    class="container effect selected activedefault activemediumEffect medium lgRadius default"
     data-id="tag_TagSelected"
     data-selector-id="tag"
     data-test-id="tag_TagSelected"
@@ -2457,8 +2415,7 @@ exports[`Tag component Should render onRemove - medium 1`] = `
     />
     <button
       aria-label="Delete"
-      class="buttonReset close activedangerClose
-            lgRadiusClose  closedanger "
+      class="buttonReset close activedangerClose lgRadiusClose closedanger"
       data-id="tag_RemoveTag"
       data-test-id="tag_RemoveTag"
       type="button"
@@ -2472,7 +2429,7 @@ exports[`Tag component Should render onRemove - medium 1`] = `
       >
         <i
           aria-hidden="true"
-          class="zd_font_icons  basic icon-close2 fbold  "
+          class="zd_font_icons basic icon-close2 fbold"
           data-id="fontIcon"
           data-selector-id="fontIcon"
           data-test-id="fontIcon"
@@ -2488,7 +2445,7 @@ exports[`Tag component Should render onRemove - small 1`] = `
 <DocumentFragment>
   <div
     aria-labelledby="1"
-    class="container effect selected activedefault activesmallEffect  small lgRadius default   "
+    class="container effect selected activedefault activesmallEffect small lgRadius default"
     data-id="tag_TagSelected"
     data-selector-id="tag"
     data-test-id="tag_TagSelected"
@@ -2501,8 +2458,7 @@ exports[`Tag component Should render onRemove - small 1`] = `
     />
     <button
       aria-label="Delete"
-      class="buttonReset close activedangerClose
-            lgRadiusClose  closedanger "
+      class="buttonReset close activedangerClose lgRadiusClose closedanger"
       data-id="tag_RemoveTag"
       data-test-id="tag_RemoveTag"
       type="button"
@@ -2516,7 +2472,7 @@ exports[`Tag component Should render onRemove - small 1`] = `
       >
         <i
           aria-hidden="true"
-          class="zd_font_icons  basic icon-close2 fbold  "
+          class="zd_font_icons basic icon-close2 fbold"
           data-id="fontIcon"
           data-selector-id="fontIcon"
           data-test-id="fontIcon"
@@ -2532,7 +2488,7 @@ exports[`Tag component Should render palette - danger 1`] = `
 <DocumentFragment>
   <div
     aria-labelledby="1"
-    class="container effect selected activedanger   medium lgRadius danger   "
+    class="container effect selected activedanger medium lgRadius danger"
     data-id="tag_TagSelected"
     data-selector-id="tag"
     data-test-id="tag_TagSelected"
@@ -2542,7 +2498,7 @@ exports[`Tag component Should render palette - danger 1`] = `
       class="avatar"
     >
       <div
-        class="avatar small small circle primary black border   "
+        class="avatar small small circle primary black border"
         data-id="Avatar"
         data-selector-id="avatar"
         data-test-id="Avatar"
@@ -2568,7 +2524,7 @@ exports[`Tag component Should render palette - dark 1`] = `
 <DocumentFragment>
   <div
     aria-labelledby="1"
-    class="container effect selected undefined   medium lgRadius dark   "
+    class="container effect selected medium lgRadius dark"
     data-id="tag_TagSelected"
     data-selector-id="tag"
     data-test-id="tag_TagSelected"
@@ -2578,7 +2534,7 @@ exports[`Tag component Should render palette - dark 1`] = `
       class="avatar"
     >
       <div
-        class="avatar small small circle info white border   "
+        class="avatar small small circle info white border"
         data-id="Avatar"
         data-selector-id="avatar"
         data-test-id="Avatar"
@@ -2604,7 +2560,7 @@ exports[`Tag component Should render palette - darkPrimaryDotted 1`] = `
 <DocumentFragment>
   <div
     aria-labelledby="1"
-    class="container effect selected undefined   medium lgRadius darkPrimaryDotted   "
+    class="container effect selected medium lgRadius darkPrimaryDotted"
     data-id="tag_TagSelected"
     data-selector-id="tag"
     data-test-id="tag_TagSelected"
@@ -2614,7 +2570,7 @@ exports[`Tag component Should render palette - darkPrimaryDotted 1`] = `
       class="avatar"
     >
       <div
-        class="avatar small small circle primary black border   "
+        class="avatar small small circle primary black border"
         data-id="Avatar"
         data-selector-id="avatar"
         data-test-id="Avatar"
@@ -2640,7 +2596,7 @@ exports[`Tag component Should render palette - default 1`] = `
 <DocumentFragment>
   <div
     aria-labelledby="1"
-    class="container effect selected activedefault   medium lgRadius default   "
+    class="container effect selected activedefault medium lgRadius default"
     data-id="tag_TagSelected"
     data-selector-id="tag"
     data-test-id="tag_TagSelected"
@@ -2650,7 +2606,7 @@ exports[`Tag component Should render palette - default 1`] = `
       class="avatar"
     >
       <div
-        class="avatar small small circle primary black border   "
+        class="avatar small small circle primary black border"
         data-id="Avatar"
         data-selector-id="avatar"
         data-test-id="Avatar"
@@ -2676,7 +2632,7 @@ exports[`Tag component Should render palette - defaultLink 1`] = `
 <DocumentFragment>
   <div
     aria-labelledby="1"
-    class="container effect selected activedefaultLink   medium lgRadius defaultLink   "
+    class="container effect selected activedefaultLink medium lgRadius defaultLink"
     data-id="tag_TagSelected"
     data-selector-id="tag"
     data-test-id="tag_TagSelected"
@@ -2686,7 +2642,7 @@ exports[`Tag component Should render palette - defaultLink 1`] = `
       class="avatar"
     >
       <div
-        class="avatar small small circle primary black border   "
+        class="avatar small small circle primary black border"
         data-id="Avatar"
         data-selector-id="avatar"
         data-test-id="Avatar"
@@ -2712,7 +2668,7 @@ exports[`Tag component Should render palette - primaryDotted 1`] = `
 <DocumentFragment>
   <div
     aria-labelledby="1"
-    class="container effect selected activeprimaryDotted   medium lgRadius primaryDotted   "
+    class="container effect selected activeprimaryDotted medium lgRadius primaryDotted"
     data-id="tag_TagSelected"
     data-selector-id="tag"
     data-test-id="tag_TagSelected"
@@ -2722,7 +2678,7 @@ exports[`Tag component Should render palette - primaryDotted 1`] = `
       class="avatar"
     >
       <div
-        class="avatar small small circle primary black border   "
+        class="avatar small small circle primary black border"
         data-id="Avatar"
         data-selector-id="avatar"
         data-test-id="Avatar"
@@ -2748,7 +2704,7 @@ exports[`Tag component Should render palette - pureDarkDotted 1`] = `
 <DocumentFragment>
   <div
     aria-labelledby="1"
-    class="container effect selected undefined   medium lgRadius pureDarkDotted   "
+    class="container effect selected medium lgRadius pureDarkDotted"
     data-id="tag_TagSelected"
     data-selector-id="tag"
     data-test-id="tag_TagSelected"
@@ -2758,7 +2714,7 @@ exports[`Tag component Should render palette - pureDarkDotted 1`] = `
       class="avatar"
     >
       <div
-        class="avatar small small circle primary black border   "
+        class="avatar small small circle primary black border"
         data-id="Avatar"
         data-selector-id="avatar"
         data-test-id="Avatar"
@@ -2784,7 +2740,7 @@ exports[`Tag component Should render palette - pureDotted 1`] = `
 <DocumentFragment>
   <div
     aria-labelledby="1"
-    class="container effect selected activepureDotted   medium lgRadius pureDotted   "
+    class="container effect selected activepureDotted medium lgRadius pureDotted"
     data-id="tag_TagSelected"
     data-selector-id="tag"
     data-test-id="tag_TagSelected"
@@ -2794,7 +2750,7 @@ exports[`Tag component Should render palette - pureDotted 1`] = `
       class="avatar"
     >
       <div
-        class="avatar small small circle primary black border   "
+        class="avatar small small circle primary black border"
         data-id="Avatar"
         data-selector-id="avatar"
         data-test-id="Avatar"
@@ -2820,7 +2776,7 @@ exports[`Tag component Should render palette - secondary 1`] = `
 <DocumentFragment>
   <div
     aria-labelledby="1"
-    class="container effect selected activesecondary   medium lgRadius secondary   "
+    class="container effect selected activesecondary medium lgRadius secondary"
     data-id="tag_TagSelected"
     data-selector-id="tag"
     data-test-id="tag_TagSelected"
@@ -2830,7 +2786,7 @@ exports[`Tag component Should render palette - secondary 1`] = `
       class="avatar"
     >
       <div
-        class="avatar small small circle primary black border   "
+        class="avatar small small circle primary black border"
         data-id="Avatar"
         data-selector-id="avatar"
         data-test-id="Avatar"
@@ -2856,7 +2812,7 @@ exports[`Tag component Should render size  - medium 1`] = `
 <DocumentFragment>
   <div
     aria-labelledby="1"
-    class="container effect    medium lgRadius default   "
+    class="container effect medium lgRadius default"
     data-id="tag_Tag"
     data-selector-id="tag"
     data-test-id="tag_Tag"
@@ -2875,7 +2831,7 @@ exports[`Tag component Should render size  - small 1`] = `
 <DocumentFragment>
   <div
     aria-labelledby="1"
-    class="container effect    small lgRadius default   "
+    class="container effect small lgRadius default"
     data-id="tag_Tag"
     data-selector-id="tag"
     data-test-id="tag_Tag"
@@ -2894,7 +2850,7 @@ exports[`Tag component rendering ally clearLabel 1`] = `
 <DocumentFragment>
   <div
     aria-labelledby="1"
-    class="container effect    medium lgRadius default   "
+    class="container effect medium lgRadius default"
     data-id="tag_Tag"
     data-selector-id="tag"
     data-test-id="tag_Tag"
@@ -2907,8 +2863,7 @@ exports[`Tag component rendering ally clearLabel 1`] = `
     />
     <button
       aria-label="TagClearLabel"
-      class="buttonReset close 
-            lgRadiusClose  closedanger "
+      class="buttonReset close lgRadiusClose closedanger"
       data-id="tag_RemoveTag"
       data-test-id="tag_RemoveTag"
       type="button"
@@ -2922,7 +2877,7 @@ exports[`Tag component rendering ally clearLabel 1`] = `
       >
         <i
           aria-hidden="true"
-          class="zd_font_icons  basic icon-close2 fbold  "
+          class="zd_font_icons basic icon-close2 fbold"
           data-id="fontIcon"
           data-selector-id="fontIcon"
           data-test-id="fontIcon"
@@ -2938,7 +2893,7 @@ exports[`Tag component rendering the Custom class 1`] = `
 <DocumentFragment>
   <div
     aria-labelledby="1"
-    class="container effect    medium lgRadius default   customCustomTag"
+    class="container effect medium lgRadius default customCustomTag"
     data-id="tag_Tag"
     data-selector-id="tag"
     data-test-id="tag_Tag"
@@ -2948,7 +2903,7 @@ exports[`Tag component rendering the Custom class 1`] = `
       class="avatar"
     >
       <div
-        class="avatar small small circle primary black border   customCustomAvatar"
+        class="avatar small small circle primary black border customCustomAvatar"
         data-id="Avatar"
         data-selector-id="avatar"
         data-test-id="Avatar"
@@ -2967,7 +2922,7 @@ exports[`Tag component rendering the Custom class 1`] = `
     >
       <i
         aria-hidden="true"
-        class="zd_font_icons  basic icon-androidd   "
+        class="zd_font_icons basic icon-androidd"
         data-id="fontIcon"
         data-selector-id="fontIcon"
         data-test-id="fontIcon"
@@ -2980,8 +2935,7 @@ exports[`Tag component rendering the Custom class 1`] = `
     />
     <button
       aria-label="Delete"
-      class="buttonReset close 
-            lgRadiusClose  closedanger customCustomTagClose"
+      class="buttonReset close lgRadiusClose closedanger customCustomTagClose"
       data-id="tag_RemoveTag"
       data-test-id="tag_RemoveTag"
       type="button"
@@ -2995,7 +2949,7 @@ exports[`Tag component rendering the Custom class 1`] = `
       >
         <i
           aria-hidden="true"
-          class="zd_font_icons  basic icon-close2 fbold  "
+          class="zd_font_icons basic icon-close2 fbold"
           data-id="fontIcon"
           data-selector-id="fontIcon"
           data-test-id="fontIcon"
@@ -3011,7 +2965,7 @@ exports[`Tag component rendering with customAttributes prop 1`] = `
 <DocumentFragment>
   <div
     aria-labelledby="1"
-    class="container effect    medium lgRadius default   "
+    class="container effect medium lgRadius default"
     data-custom-attribute="true"
     data-id="tag_Tag"
     data-selector-id="tag"