From 787119a20776ec4d081bcf363453f3d9a7a182f0 Mon Sep 17 00:00:00 2001
From: Samuel Valdes Gutierrez <valdesgutierrez@gmail.com>
Date: Mon, 1 Jan 2024 15:52:03 -0300
Subject: [PATCH] adding title prop to OuiIcon component, removing wrapping
 span element in buttonIcon and updating snapshots

Signed-off-by: Samuel Valdes Gutierrez <valdesgutierrez@gmail.com>
---
 .../__snapshots__/skip_link.test.tsx.snap     |    6 -
 .../in_memory_table.test.tsx.snap             |   24 +-
 .../button/__snapshots__/button.test.tsx.snap |   69 +-
 .../button_content.test.tsx.snap              |   46 +-
 src/components/button/button_content.tsx      |    6 +-
 .../__snapshots__/button_empty.test.tsx.snap  |   68 +-
 .../__snapshots__/button_group.test.tsx.snap  | 1152 +++++++----------
 .../card/__snapshots__/card.test.tsx.snap     |    2 -
 .../__snapshots__/card_select.test.tsx.snap   |   16 +-
 .../__snapshots__/control_bar.test.tsx.snap   |   14 -
 .../__snapshots__/data_grid.test.tsx.snap     |  158 +--
 .../__snapshots__/filter_button.test.tsx.snap |   21 +-
 .../__snapshots__/header_link.test.tsx.snap   |    3 -
 .../__snapshots__/header_links.test.tsx.snap  |    1 -
 .../header_section_item_button.test.tsx.snap  |    6 -
 .../markdown_editor.test.tsx.snap             |   60 +-
 .../__snapshots__/confirm_modal.test.tsx.snap |    4 -
 .../notification_event.test.tsx.snap          |   13 +-
 .../__snapshots__/pagination.test.tsx.snap    |    1 -
 .../pagination_button.test.tsx.snap           |    1 -
 .../__snapshots__/side_nav.test.tsx.snap      |   12 +-
 .../table_sort_mobile.test.tsx.snap           |   12 +-
 .../table_pagination.test.tsx.snap            |   22 +-
 23 files changed, 665 insertions(+), 1052 deletions(-)

diff --git a/src/components/accessibility/__snapshots__/skip_link.test.tsx.snap b/src/components/accessibility/__snapshots__/skip_link.test.tsx.snap
index 4deb267d9a..5e3ba6fdaa 100644
--- a/src/components/accessibility/__snapshots__/skip_link.test.tsx.snap
+++ b/src/components/accessibility/__snapshots__/skip_link.test.tsx.snap
@@ -11,7 +11,6 @@ exports[`OuiSkipLink is rendered 1`] = `
   <span
     class="ouiButtonContent ouiButton__content"
   >
-    <span />
     <span
       class="ouiButton__text"
     >
@@ -30,7 +29,6 @@ exports[`OuiSkipLink props onClick is rendered 1`] = `
   <span
     class="ouiButtonContent ouiButton__content"
   >
-    <span />
     <span
       class="ouiButton__text"
     />
@@ -47,7 +45,6 @@ exports[`OuiSkipLink props position absolute is rendered 1`] = `
   <span
     class="ouiButtonContent ouiButton__content"
   >
-    <span />
     <span
       class="ouiButton__text"
     />
@@ -65,7 +62,6 @@ exports[`OuiSkipLink props position fixed is rendered 1`] = `
   <span
     class="ouiButtonContent ouiButton__content"
   >
-    <span />
     <span
       class="ouiButton__text"
     />
@@ -82,7 +78,6 @@ exports[`OuiSkipLink props position static is rendered 1`] = `
   <span
     class="ouiButtonContent ouiButton__content"
   >
-    <span />
     <span
       class="ouiButton__text"
     />
@@ -100,7 +95,6 @@ exports[`OuiSkipLink props tabIndex is rendered 1`] = `
   <span
     class="ouiButtonContent ouiButton__content"
   >
-    <span />
     <span
       class="ouiButton__text"
     />
diff --git a/src/components/basic_table/__snapshots__/in_memory_table.test.tsx.snap b/src/components/basic_table/__snapshots__/in_memory_table.test.tsx.snap
index 417a6fa08e..ac72079baf 100644
--- a/src/components/basic_table/__snapshots__/in_memory_table.test.tsx.snap
+++ b/src/components/basic_table/__snapshots__/in_memory_table.test.tsx.snap
@@ -418,21 +418,19 @@ exports[`OuiInMemoryTable behavior pagination 1`] = `
                                 <span
                                   className="ouiButtonContent ouiButtonContent--iconRight ouiButtonEmpty__content"
                                 >
-                                  <span>
-                                    <OuiIcon
+                                  <OuiIcon
+                                    className="ouiButtonContent__icon"
+                                    color="inherit"
+                                    size="s"
+                                    type="arrowDown"
+                                  >
+                                    <span
                                       className="ouiButtonContent__icon"
                                       color="inherit"
+                                      data-ouiicon-type="arrowDown"
                                       size="s"
-                                      type="arrowDown"
-                                    >
-                                      <span
-                                        className="ouiButtonContent__icon"
-                                        color="inherit"
-                                        data-ouiicon-type="arrowDown"
-                                        size="s"
-                                      />
-                                    </OuiIcon>
-                                  </span>
+                                    />
+                                  </OuiIcon>
                                   <span
                                     className="ouiButtonEmpty__text"
                                   >
@@ -589,7 +587,6 @@ exports[`OuiInMemoryTable behavior pagination 1`] = `
                                           <span
                                             className="ouiButtonContent ouiButtonEmpty__content"
                                           >
-                                            <span />
                                             <span
                                               className="ouiButtonEmpty__text"
                                             >
@@ -673,7 +670,6 @@ exports[`OuiInMemoryTable behavior pagination 1`] = `
                                           <span
                                             className="ouiButtonContent ouiButtonEmpty__content"
                                           >
-                                            <span />
                                             <span
                                               className="ouiButtonEmpty__text"
                                             >
diff --git a/src/components/button/__snapshots__/button.test.tsx.snap b/src/components/button/__snapshots__/button.test.tsx.snap
index 6eea10a277..23d70d6fdb 100644
--- a/src/components/button/__snapshots__/button.test.tsx.snap
+++ b/src/components/button/__snapshots__/button.test.tsx.snap
@@ -10,7 +10,6 @@ exports[`OuiButton is rendered 1`] = `
   <span
     class="ouiButtonContent ouiButton__content"
   >
-    <span />
     <span
       class="ouiButton__text"
     >
@@ -28,7 +27,6 @@ exports[`OuiButton props color accent is rendered 1`] = `
   <span
     class="ouiButtonContent ouiButton__content"
   >
-    <span />
     <span
       class="ouiButton__text"
     />
@@ -44,7 +42,6 @@ exports[`OuiButton props color danger is rendered 1`] = `
   <span
     class="ouiButtonContent ouiButton__content"
   >
-    <span />
     <span
       class="ouiButton__text"
     />
@@ -60,7 +57,6 @@ exports[`OuiButton props color ghost is rendered 1`] = `
   <span
     class="ouiButtonContent ouiButton__content"
   >
-    <span />
     <span
       class="ouiButton__text"
     />
@@ -76,7 +72,6 @@ exports[`OuiButton props color primary is rendered 1`] = `
   <span
     class="ouiButtonContent ouiButton__content"
   >
-    <span />
     <span
       class="ouiButton__text"
     />
@@ -92,7 +87,6 @@ exports[`OuiButton props color secondary is rendered 1`] = `
   <span
     class="ouiButtonContent ouiButton__content"
   >
-    <span />
     <span
       class="ouiButton__text"
     />
@@ -108,7 +102,6 @@ exports[`OuiButton props color success is rendered 1`] = `
   <span
     class="ouiButtonContent ouiButton__content"
   >
-    <span />
     <span
       class="ouiButton__text"
     />
@@ -124,7 +117,6 @@ exports[`OuiButton props color text is rendered 1`] = `
   <span
     class="ouiButtonContent ouiButton__content"
   >
-    <span />
     <span
       class="ouiButton__text"
     />
@@ -140,7 +132,6 @@ exports[`OuiButton props color warning is rendered 1`] = `
   <span
     class="ouiButtonContent ouiButton__content"
   >
-    <span />
     <span
       class="ouiButton__text"
     />
@@ -158,7 +149,6 @@ exports[`OuiButton props contentProps is rendered 1`] = `
     class="ouiButtonContent ouiButton__content testClass1 testClass2"
     data-test-subj="test subject string"
   >
-    <span />
     <span
       class="ouiButton__text"
     >
@@ -176,7 +166,6 @@ exports[`OuiButton props fill is rendered 1`] = `
   <span
     class="ouiButtonContent ouiButton__content"
   >
-    <span />
     <span
       class="ouiButton__text"
     />
@@ -192,7 +181,6 @@ exports[`OuiButton props fullWidth is rendered 1`] = `
   <span
     class="ouiButtonContent ouiButton__content"
   >
-    <span />
     <span
       class="ouiButton__text"
     />
@@ -210,7 +198,6 @@ exports[`OuiButton props href secures the rel attribute when the target is _blan
   <span
     class="ouiButtonContent ouiButton__content"
   >
-    <span />
     <span
       class="ouiButton__text"
     />
@@ -226,13 +213,11 @@ exports[`OuiButton props iconSide left is rendered 1`] = `
   <span
     class="ouiButtonContent ouiButton__content"
   >
-    <span>
-      <span
-        class="ouiButtonContent__icon"
-        color="inherit"
-        data-ouiicon-type="user"
-      />
-    </span>
+    <span
+      class="ouiButtonContent__icon"
+      color="inherit"
+      data-ouiicon-type="user"
+    />
     <span
       class="ouiButton__text"
     >
@@ -250,13 +235,11 @@ exports[`OuiButton props iconSide right is rendered 1`] = `
   <span
     class="ouiButtonContent ouiButtonContent--iconRight ouiButton__content"
   >
-    <span>
-      <span
-        class="ouiButtonContent__icon"
-        color="inherit"
-        data-ouiicon-type="user"
-      />
-    </span>
+    <span
+      class="ouiButtonContent__icon"
+      color="inherit"
+      data-ouiicon-type="user"
+    />
     <span
       class="ouiButton__text"
     >
@@ -274,13 +257,11 @@ exports[`OuiButton props iconType is rendered 1`] = `
   <span
     class="ouiButtonContent ouiButton__content"
   >
-    <span>
-      <span
-        class="ouiButtonContent__icon"
-        color="inherit"
-        data-ouiicon-type="user"
-      />
-    </span>
+    <span
+      class="ouiButtonContent__icon"
+      color="inherit"
+      data-ouiicon-type="user"
+    />
     <span
       class="ouiButton__text"
     />
@@ -297,7 +278,6 @@ exports[`OuiButton props isDisabled is rendered 1`] = `
   <span
     class="ouiButtonContent ouiButton__content"
   >
-    <span />
     <span
       class="ouiButton__text"
     />
@@ -314,7 +294,6 @@ exports[`OuiButton props isDisabled renders a button even when href is defined 1
   <span
     class="ouiButtonContent ouiButton__content"
   >
-    <span />
     <span
       class="ouiButton__text"
     />
@@ -331,7 +310,6 @@ exports[`OuiButton props isDisabled renders if passed as disabled 1`] = `
   <span
     class="ouiButtonContent ouiButton__content"
   >
-    <span />
     <span
       class="ouiButton__text"
     />
@@ -348,11 +326,9 @@ exports[`OuiButton props isLoading is rendered 1`] = `
   <span
     class="ouiButtonContent ouiButton__content"
   >
-    <span>
-      <span
-        class="ouiLoadingSpinner ouiLoadingSpinner--medium ouiButtonContent__spinner"
-      />
-    </span>
+    <span
+      class="ouiLoadingSpinner ouiLoadingSpinner--medium ouiButtonContent__spinner"
+    />
     <span
       class="ouiButton__text"
     />
@@ -369,7 +345,6 @@ exports[`OuiButton props isSelected is rendered as false 1`] = `
   <span
     class="ouiButtonContent ouiButton__content"
   >
-    <span />
     <span
       class="ouiButton__text"
     />
@@ -386,7 +361,6 @@ exports[`OuiButton props isSelected is rendered as true 1`] = `
   <span
     class="ouiButtonContent ouiButton__content"
   >
-    <span />
     <span
       class="ouiButton__text"
     />
@@ -403,7 +377,6 @@ exports[`OuiButton props minWidth is rendered 1`] = `
   <span
     class="ouiButtonContent ouiButton__content"
   >
-    <span />
     <span
       class="ouiButton__text"
     />
@@ -419,7 +392,6 @@ exports[`OuiButton props size m is rendered 1`] = `
   <span
     class="ouiButtonContent ouiButton__content"
   >
-    <span />
     <span
       class="ouiButton__text"
     />
@@ -435,7 +407,6 @@ exports[`OuiButton props size s is rendered 1`] = `
   <span
     class="ouiButtonContent ouiButton__content"
   >
-    <span />
     <span
       class="ouiButton__text"
     />
@@ -451,10 +422,6 @@ exports[`OuiButton props textProps is rendered 1`] = `
   <span
     class="ouiButtonContent ouiButton__content"
   >
-    <span
-      aria-label="aria-label"
-      data-test-subj="test subject string"
-    />
     <span
       aria-label="aria-label"
       class="ouiButton__text testClass1 testClass2"
diff --git a/src/components/button/__snapshots__/button_content.test.tsx.snap b/src/components/button/__snapshots__/button_content.test.tsx.snap
index ad55426a38..299c7c9648 100644
--- a/src/components/button/__snapshots__/button_content.test.tsx.snap
+++ b/src/components/button/__snapshots__/button_content.test.tsx.snap
@@ -7,7 +7,6 @@ exports[`OuiButtonContent is rendered 1`] = `
   data-test-subj="test subject string"
 >
   <span />
-  <span />
 </span>
 `;
 
@@ -15,7 +14,6 @@ exports[`OuiButtonContent props children is rendered 1`] = `
 <span
   class="ouiButtonContent"
 >
-  <span />
   <span>
     Content
   </span>
@@ -26,13 +24,11 @@ exports[`OuiButtonContent props iconSide is rendered 1`] = `
 <span
   class="ouiButtonContent ouiButtonContent--iconRight"
 >
-  <span>
-    <span
-      class="ouiButtonContent__icon"
-      color="inherit"
-      data-ouiicon-type="bolt"
-    />
-  </span>
+  <span
+    class="ouiButtonContent__icon"
+    color="inherit"
+    data-ouiicon-type="bolt"
+  />
   <span />
 </span>
 `;
@@ -41,13 +37,11 @@ exports[`OuiButtonContent props iconType is rendered 1`] = `
 <span
   class="ouiButtonContent"
 >
-  <span>
-    <span
-      class="ouiButtonContent__icon"
-      color="inherit"
-      data-ouiicon-type="bolt"
-    />
-  </span>
+  <span
+    class="ouiButtonContent__icon"
+    color="inherit"
+    data-ouiicon-type="bolt"
+  />
   <span />
 </span>
 `;
@@ -56,11 +50,9 @@ exports[`OuiButtonContent props isLoading is rendered 1`] = `
 <span
   class="ouiButtonContent"
 >
-  <span>
-    <span
-      class="ouiLoadingSpinner ouiLoadingSpinner--medium ouiButtonContent__spinner"
-    />
-  </span>
+  <span
+    class="ouiLoadingSpinner ouiLoadingSpinner--medium ouiButtonContent__spinner"
+  />
   <span />
 </span>
 `;
@@ -69,11 +61,9 @@ exports[`OuiButtonContent props isLoading replaces iconType with spinner 1`] = `
 <span
   class="ouiButtonContent"
 >
-  <span>
-    <span
-      class="ouiLoadingSpinner ouiLoadingSpinner--medium ouiButtonContent__spinner"
-    />
-  </span>
+  <span
+    class="ouiLoadingSpinner ouiLoadingSpinner--medium ouiButtonContent__spinner"
+  />
   <span />
 </span>
 `;
@@ -82,10 +72,6 @@ exports[`OuiButtonContent props textProps is rendered 1`] = `
 <span
   class="ouiButtonContent"
 >
-  <span
-    aria-label="aria-label"
-    data-test-subj="test subject string"
-  />
   <span
     aria-label="aria-label"
     class="testClass1 testClass2"
diff --git a/src/components/button/button_content.tsx b/src/components/button/button_content.tsx
index 821753fb7c..c6733888ce 100644
--- a/src/components/button/button_content.tsx
+++ b/src/components/button/button_content.tsx
@@ -91,11 +91,13 @@ export const OuiButtonContent: FunctionComponent<
       <OuiLoadingSpinner className="ouiButtonContent__spinner" size="m" />
     );
   } else if (iconType) {
+    const { title } = { ...textProps };
     buttonIcon = (
       <OuiIcon
         className="ouiButtonContent__icon"
         type={iconType}
         size={iconSize}
+        title={title}
         color="inherit" // forces the icon to inherit its parent color
       />
     );
@@ -109,9 +111,7 @@ export const OuiButtonContent: FunctionComponent<
 
   return (
     <span {...contentProps} className={contentClassNames}>
-      <span {...textProps} className={undefined}>
-        {buttonIcon}
-      </span>
+      {buttonIcon}
       <span {...textProps}>{children}</span>
     </span>
   );
diff --git a/src/components/button/button_empty/__snapshots__/button_empty.test.tsx.snap b/src/components/button/button_empty/__snapshots__/button_empty.test.tsx.snap
index 3b9bc9d3df..9bb95ce7bc 100644
--- a/src/components/button/button_empty/__snapshots__/button_empty.test.tsx.snap
+++ b/src/components/button/button_empty/__snapshots__/button_empty.test.tsx.snap
@@ -10,7 +10,6 @@ exports[`OuiButtonEmpty is rendered 1`] = `
   <span
     class="ouiButtonContent ouiButtonEmpty__content"
   >
-    <span />
     <span
       class="ouiButtonEmpty__text"
     >
@@ -28,7 +27,6 @@ exports[`OuiButtonEmpty props color danger is rendered 1`] = `
   <span
     class="ouiButtonContent ouiButtonEmpty__content"
   >
-    <span />
     <span
       class="ouiButtonEmpty__text"
     />
@@ -44,7 +42,6 @@ exports[`OuiButtonEmpty props color ghost is rendered 1`] = `
   <span
     class="ouiButtonContent ouiButtonEmpty__content"
   >
-    <span />
     <span
       class="ouiButtonEmpty__text"
     />
@@ -60,7 +57,6 @@ exports[`OuiButtonEmpty props color primary is rendered 1`] = `
   <span
     class="ouiButtonContent ouiButtonEmpty__content"
   >
-    <span />
     <span
       class="ouiButtonEmpty__text"
     />
@@ -76,7 +72,6 @@ exports[`OuiButtonEmpty props color success is rendered 1`] = `
   <span
     class="ouiButtonContent ouiButtonEmpty__content"
   >
-    <span />
     <span
       class="ouiButtonEmpty__text"
     />
@@ -92,7 +87,6 @@ exports[`OuiButtonEmpty props color text is rendered 1`] = `
   <span
     class="ouiButtonContent ouiButtonEmpty__content"
   >
-    <span />
     <span
       class="ouiButtonEmpty__text"
     />
@@ -108,7 +102,6 @@ exports[`OuiButtonEmpty props color warning is rendered 1`] = `
   <span
     class="ouiButtonContent ouiButtonEmpty__content"
   >
-    <span />
     <span
       class="ouiButtonEmpty__text"
     />
@@ -126,7 +119,6 @@ exports[`OuiButtonEmpty props contentProps is rendered 1`] = `
     class="ouiButtonContent ouiButtonEmpty__content testClass1 testClass2"
     data-test-subj="test subject string"
   >
-    <span />
     <span
       class="ouiButtonEmpty__text"
     >
@@ -144,7 +136,6 @@ exports[`OuiButtonEmpty props flush both is rendered 1`] = `
   <span
     class="ouiButtonContent ouiButtonEmpty__content"
   >
-    <span />
     <span
       class="ouiButtonEmpty__text"
     />
@@ -160,7 +151,6 @@ exports[`OuiButtonEmpty props flush left is rendered 1`] = `
   <span
     class="ouiButtonContent ouiButtonEmpty__content"
   >
-    <span />
     <span
       class="ouiButtonEmpty__text"
     />
@@ -176,7 +166,6 @@ exports[`OuiButtonEmpty props flush right is rendered 1`] = `
   <span
     class="ouiButtonContent ouiButtonEmpty__content"
   >
-    <span />
     <span
       class="ouiButtonEmpty__text"
     />
@@ -194,7 +183,6 @@ exports[`OuiButtonEmpty props href secures the rel attribute when the target is
   <span
     class="ouiButtonContent ouiButtonEmpty__content"
   >
-    <span />
     <span
       class="ouiButtonEmpty__text"
     />
@@ -210,13 +198,11 @@ exports[`OuiButtonEmpty props iconSide left is rendered 1`] = `
   <span
     class="ouiButtonContent ouiButtonEmpty__content"
   >
-    <span>
-      <span
-        class="ouiButtonContent__icon"
-        color="inherit"
-        data-ouiicon-type="user"
-      />
-    </span>
+    <span
+      class="ouiButtonContent__icon"
+      color="inherit"
+      data-ouiicon-type="user"
+    />
     <span
       class="ouiButtonEmpty__text"
     >
@@ -234,13 +220,11 @@ exports[`OuiButtonEmpty props iconSide right is rendered 1`] = `
   <span
     class="ouiButtonContent ouiButtonContent--iconRight ouiButtonEmpty__content"
   >
-    <span>
-      <span
-        class="ouiButtonContent__icon"
-        color="inherit"
-        data-ouiicon-type="user"
-      />
-    </span>
+    <span
+      class="ouiButtonContent__icon"
+      color="inherit"
+      data-ouiicon-type="user"
+    />
     <span
       class="ouiButtonEmpty__text"
     >
@@ -258,13 +242,11 @@ exports[`OuiButtonEmpty props iconType is rendered 1`] = `
   <span
     class="ouiButtonContent ouiButtonEmpty__content"
   >
-    <span>
-      <span
-        class="ouiButtonContent__icon"
-        color="inherit"
-        data-ouiicon-type="user"
-      />
-    </span>
+    <span
+      class="ouiButtonContent__icon"
+      color="inherit"
+      data-ouiicon-type="user"
+    />
     <span
       class="ouiButtonEmpty__text"
     />
@@ -281,7 +263,6 @@ exports[`OuiButtonEmpty props isDisabled is rendered 1`] = `
   <span
     class="ouiButtonContent ouiButtonEmpty__content"
   >
-    <span />
     <span
       class="ouiButtonEmpty__text"
     />
@@ -298,7 +279,6 @@ exports[`OuiButtonEmpty props isDisabled renders a button even when href is defi
   <span
     class="ouiButtonContent ouiButtonEmpty__content"
   >
-    <span />
     <span
       class="ouiButtonEmpty__text"
     />
@@ -315,7 +295,6 @@ exports[`OuiButtonEmpty props isDisabled renders if passed simply as disabled 1`
   <span
     class="ouiButtonContent ouiButtonEmpty__content"
   >
-    <span />
     <span
       class="ouiButtonEmpty__text"
     />
@@ -332,11 +311,9 @@ exports[`OuiButtonEmpty props isLoading is rendered 1`] = `
   <span
     class="ouiButtonContent ouiButtonEmpty__content"
   >
-    <span>
-      <span
-        class="ouiLoadingSpinner ouiLoadingSpinner--medium ouiButtonContent__spinner"
-      />
-    </span>
+    <span
+      class="ouiLoadingSpinner ouiLoadingSpinner--medium ouiButtonContent__spinner"
+    />
     <span
       class="ouiButtonEmpty__text"
     />
@@ -353,7 +330,6 @@ exports[`OuiButtonEmpty props isSelected is rendered as false 1`] = `
   <span
     class="ouiButtonContent ouiButtonEmpty__content"
   >
-    <span />
     <span
       class="ouiButtonEmpty__text"
     />
@@ -370,7 +346,6 @@ exports[`OuiButtonEmpty props isSelected is rendered as true 1`] = `
   <span
     class="ouiButtonContent ouiButtonEmpty__content"
   >
-    <span />
     <span
       class="ouiButtonEmpty__text"
     />
@@ -386,7 +361,6 @@ exports[`OuiButtonEmpty props size l is rendered 1`] = `
   <span
     class="ouiButtonContent ouiButtonEmpty__content"
   >
-    <span />
     <span
       class="ouiButtonEmpty__text"
     />
@@ -402,7 +376,6 @@ exports[`OuiButtonEmpty props size s is rendered 1`] = `
   <span
     class="ouiButtonContent ouiButtonEmpty__content"
   >
-    <span />
     <span
       class="ouiButtonEmpty__text"
     />
@@ -418,7 +391,6 @@ exports[`OuiButtonEmpty props size xs is rendered 1`] = `
   <span
     class="ouiButtonContent ouiButtonEmpty__content"
   >
-    <span />
     <span
       class="ouiButtonEmpty__text"
     />
@@ -434,10 +406,6 @@ exports[`OuiButtonEmpty props textProps is rendered 1`] = `
   <span
     class="ouiButtonContent ouiButtonEmpty__content"
   >
-    <span
-      aria-label="aria-label"
-      data-test-subj="test subject string"
-    />
     <span
       aria-label="aria-label"
       class="ouiButtonEmpty__text testClass1 testClass2"
diff --git a/src/components/button/button_group/__snapshots__/button_group.test.tsx.snap b/src/components/button/button_group/__snapshots__/button_group.test.tsx.snap
index 1ab242aa03..54c1542442 100644
--- a/src/components/button/button_group/__snapshots__/button_group.test.tsx.snap
+++ b/src/components/button/button_group/__snapshots__/button_group.test.tsx.snap
@@ -23,13 +23,11 @@ exports[`OuiButtonGroup button props buttonSize compressed is rendered for multi
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -47,13 +45,11 @@ exports[`OuiButtonGroup button props buttonSize compressed is rendered for multi
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -72,13 +68,11 @@ exports[`OuiButtonGroup button props buttonSize compressed is rendered for multi
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -111,13 +105,11 @@ exports[`OuiButtonGroup button props buttonSize compressed is rendered for singl
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -139,13 +131,11 @@ exports[`OuiButtonGroup button props buttonSize compressed is rendered for singl
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -171,13 +161,11 @@ exports[`OuiButtonGroup button props buttonSize compressed is rendered for singl
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -212,13 +200,11 @@ exports[`OuiButtonGroup button props buttonSize m is rendered for multi 1`] = `
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -236,13 +222,11 @@ exports[`OuiButtonGroup button props buttonSize m is rendered for multi 1`] = `
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -261,13 +245,11 @@ exports[`OuiButtonGroup button props buttonSize m is rendered for multi 1`] = `
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -300,13 +282,11 @@ exports[`OuiButtonGroup button props buttonSize m is rendered for single 1`] = `
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -328,13 +308,11 @@ exports[`OuiButtonGroup button props buttonSize m is rendered for single 1`] = `
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -360,13 +338,11 @@ exports[`OuiButtonGroup button props buttonSize m is rendered for single 1`] = `
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -401,13 +377,11 @@ exports[`OuiButtonGroup button props buttonSize s is rendered for multi 1`] = `
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -425,13 +399,11 @@ exports[`OuiButtonGroup button props buttonSize s is rendered for multi 1`] = `
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -450,13 +422,11 @@ exports[`OuiButtonGroup button props buttonSize s is rendered for multi 1`] = `
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -489,13 +459,11 @@ exports[`OuiButtonGroup button props buttonSize s is rendered for single 1`] = `
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -517,13 +485,11 @@ exports[`OuiButtonGroup button props buttonSize s is rendered for single 1`] = `
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -549,13 +515,11 @@ exports[`OuiButtonGroup button props buttonSize s is rendered for single 1`] = `
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -590,13 +554,11 @@ exports[`OuiButtonGroup button props color accent is rendered for multi 1`] = `
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -614,13 +576,11 @@ exports[`OuiButtonGroup button props color accent is rendered for multi 1`] = `
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -639,13 +599,11 @@ exports[`OuiButtonGroup button props color accent is rendered for multi 1`] = `
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -678,13 +636,11 @@ exports[`OuiButtonGroup button props color accent is rendered for single 1`] = `
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -706,13 +662,11 @@ exports[`OuiButtonGroup button props color accent is rendered for single 1`] = `
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -738,13 +692,11 @@ exports[`OuiButtonGroup button props color accent is rendered for single 1`] = `
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -779,13 +731,11 @@ exports[`OuiButtonGroup button props color danger is rendered for multi 1`] = `
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -803,13 +753,11 @@ exports[`OuiButtonGroup button props color danger is rendered for multi 1`] = `
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -828,13 +776,11 @@ exports[`OuiButtonGroup button props color danger is rendered for multi 1`] = `
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -867,13 +813,11 @@ exports[`OuiButtonGroup button props color danger is rendered for single 1`] = `
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -895,13 +839,11 @@ exports[`OuiButtonGroup button props color danger is rendered for single 1`] = `
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -927,13 +869,11 @@ exports[`OuiButtonGroup button props color danger is rendered for single 1`] = `
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -968,13 +908,11 @@ exports[`OuiButtonGroup button props color ghost is rendered for multi 1`] = `
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -992,13 +930,11 @@ exports[`OuiButtonGroup button props color ghost is rendered for multi 1`] = `
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -1017,13 +953,11 @@ exports[`OuiButtonGroup button props color ghost is rendered for multi 1`] = `
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -1056,13 +990,11 @@ exports[`OuiButtonGroup button props color ghost is rendered for single 1`] = `
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -1084,13 +1016,11 @@ exports[`OuiButtonGroup button props color ghost is rendered for single 1`] = `
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -1116,13 +1046,11 @@ exports[`OuiButtonGroup button props color ghost is rendered for single 1`] = `
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -1157,13 +1085,11 @@ exports[`OuiButtonGroup button props color primary is rendered for multi 1`] = `
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -1181,13 +1107,11 @@ exports[`OuiButtonGroup button props color primary is rendered for multi 1`] = `
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -1206,13 +1130,11 @@ exports[`OuiButtonGroup button props color primary is rendered for multi 1`] = `
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -1245,13 +1167,11 @@ exports[`OuiButtonGroup button props color primary is rendered for single 1`] =
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -1273,13 +1193,11 @@ exports[`OuiButtonGroup button props color primary is rendered for single 1`] =
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -1305,13 +1223,11 @@ exports[`OuiButtonGroup button props color primary is rendered for single 1`] =
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -1346,13 +1262,11 @@ exports[`OuiButtonGroup button props color secondary is rendered for multi 1`] =
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -1370,13 +1284,11 @@ exports[`OuiButtonGroup button props color secondary is rendered for multi 1`] =
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -1395,13 +1307,11 @@ exports[`OuiButtonGroup button props color secondary is rendered for multi 1`] =
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -1434,13 +1344,11 @@ exports[`OuiButtonGroup button props color secondary is rendered for single 1`]
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -1462,13 +1370,11 @@ exports[`OuiButtonGroup button props color secondary is rendered for single 1`]
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -1494,13 +1400,11 @@ exports[`OuiButtonGroup button props color secondary is rendered for single 1`]
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -1535,13 +1439,11 @@ exports[`OuiButtonGroup button props color success is rendered for multi 1`] = `
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -1559,13 +1461,11 @@ exports[`OuiButtonGroup button props color success is rendered for multi 1`] = `
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -1584,13 +1484,11 @@ exports[`OuiButtonGroup button props color success is rendered for multi 1`] = `
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -1623,13 +1521,11 @@ exports[`OuiButtonGroup button props color success is rendered for single 1`] =
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -1651,13 +1547,11 @@ exports[`OuiButtonGroup button props color success is rendered for single 1`] =
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -1683,13 +1577,11 @@ exports[`OuiButtonGroup button props color success is rendered for single 1`] =
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -1724,13 +1616,11 @@ exports[`OuiButtonGroup button props color text is rendered for multi 1`] = `
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -1748,13 +1638,11 @@ exports[`OuiButtonGroup button props color text is rendered for multi 1`] = `
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -1773,13 +1661,11 @@ exports[`OuiButtonGroup button props color text is rendered for multi 1`] = `
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -1812,13 +1698,11 @@ exports[`OuiButtonGroup button props color text is rendered for single 1`] = `
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -1840,13 +1724,11 @@ exports[`OuiButtonGroup button props color text is rendered for single 1`] = `
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -1872,13 +1754,11 @@ exports[`OuiButtonGroup button props color text is rendered for single 1`] = `
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -1913,13 +1793,11 @@ exports[`OuiButtonGroup button props color warning is rendered for multi 1`] = `
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -1937,13 +1815,11 @@ exports[`OuiButtonGroup button props color warning is rendered for multi 1`] = `
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -1962,13 +1838,11 @@ exports[`OuiButtonGroup button props color warning is rendered for multi 1`] = `
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -2001,13 +1875,11 @@ exports[`OuiButtonGroup button props color warning is rendered for single 1`] =
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -2029,13 +1901,11 @@ exports[`OuiButtonGroup button props color warning is rendered for single 1`] =
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -2061,13 +1931,11 @@ exports[`OuiButtonGroup button props color warning is rendered for single 1`] =
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -2104,13 +1972,11 @@ exports[`OuiButtonGroup button props isDisabled is rendered for multi 1`] = `
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -2129,13 +1995,11 @@ exports[`OuiButtonGroup button props isDisabled is rendered for multi 1`] = `
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -2154,13 +2018,11 @@ exports[`OuiButtonGroup button props isDisabled is rendered for multi 1`] = `
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -2197,13 +2059,11 @@ exports[`OuiButtonGroup button props isDisabled is rendered for single 1`] = `
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -2222,13 +2082,11 @@ exports[`OuiButtonGroup button props isDisabled is rendered for single 1`] = `
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -2247,13 +2105,11 @@ exports[`OuiButtonGroup button props isDisabled is rendered for single 1`] = `
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -2288,13 +2144,11 @@ exports[`OuiButtonGroup button props isFullWidth is rendered for multi 1`] = `
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -2312,13 +2166,11 @@ exports[`OuiButtonGroup button props isFullWidth is rendered for multi 1`] = `
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -2337,13 +2189,11 @@ exports[`OuiButtonGroup button props isFullWidth is rendered for multi 1`] = `
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -2376,13 +2226,11 @@ exports[`OuiButtonGroup button props isFullWidth is rendered for single 1`] = `
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -2404,13 +2252,11 @@ exports[`OuiButtonGroup button props isFullWidth is rendered for single 1`] = `
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -2436,13 +2282,11 @@ exports[`OuiButtonGroup button props isFullWidth is rendered for single 1`] = `
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -2477,13 +2321,11 @@ exports[`OuiButtonGroup button props isIconOnly is rendered for multi 1`] = `
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiScreenReaderOnly"
         >
@@ -2501,13 +2343,11 @@ exports[`OuiButtonGroup button props isIconOnly is rendered for multi 1`] = `
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiScreenReaderOnly"
         >
@@ -2526,13 +2366,11 @@ exports[`OuiButtonGroup button props isIconOnly is rendered for multi 1`] = `
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiScreenReaderOnly"
         >
@@ -2565,13 +2403,11 @@ exports[`OuiButtonGroup button props isIconOnly is rendered for single 1`] = `
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiScreenReaderOnly"
         >
@@ -2593,13 +2429,11 @@ exports[`OuiButtonGroup button props isIconOnly is rendered for single 1`] = `
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiScreenReaderOnly"
         >
@@ -2625,13 +2459,11 @@ exports[`OuiButtonGroup button props isIconOnly is rendered for single 1`] = `
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiScreenReaderOnly"
         >
@@ -2664,13 +2496,11 @@ exports[`OuiButtonGroup button props selection idSelected is rendered for single
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -2693,13 +2523,11 @@ exports[`OuiButtonGroup button props selection idSelected is rendered for single
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -2725,13 +2553,11 @@ exports[`OuiButtonGroup button props selection idSelected is rendered for single
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -2766,13 +2592,11 @@ exports[`OuiButtonGroup button props selection idToSelectedMap is rendered for m
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -2790,13 +2614,11 @@ exports[`OuiButtonGroup button props selection idToSelectedMap is rendered for m
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -2815,13 +2637,11 @@ exports[`OuiButtonGroup button props selection idToSelectedMap is rendered for m
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -2858,13 +2678,11 @@ exports[`OuiButtonGroup type multi is rendered 1`] = `
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -2882,13 +2700,11 @@ exports[`OuiButtonGroup type multi is rendered 1`] = `
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -2907,13 +2723,11 @@ exports[`OuiButtonGroup type multi is rendered 1`] = `
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -2948,13 +2762,11 @@ exports[`OuiButtonGroup type single is rendered 1`] = `
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -2976,13 +2788,11 @@ exports[`OuiButtonGroup type single is rendered 1`] = `
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
@@ -3008,13 +2818,11 @@ exports[`OuiButtonGroup type single is rendered 1`] = `
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="bolt"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="bolt"
+        />
         <span
           class="ouiButton__text ouiButtonGroupButton__textShift"
         >
diff --git a/src/components/card/__snapshots__/card.test.tsx.snap b/src/components/card/__snapshots__/card.test.tsx.snap
index 1f21c5aee1..f159fb3421 100644
--- a/src/components/card/__snapshots__/card.test.tsx.snap
+++ b/src/components/card/__snapshots__/card.test.tsx.snap
@@ -70,7 +70,6 @@ exports[`OuiCard horizontal selectable 1`] = `
     <span
       class="ouiButtonContent ouiButtonEmpty__content"
     >
-      <span />
       <span
         class="ouiButtonEmpty__text"
       >
@@ -786,7 +785,6 @@ exports[`OuiCard props selectable 1`] = `
     <span
       class="ouiButtonContent ouiButtonEmpty__content"
     >
-      <span />
       <span
         class="ouiButtonEmpty__text"
       >
diff --git a/src/components/card/__snapshots__/card_select.test.tsx.snap b/src/components/card/__snapshots__/card_select.test.tsx.snap
index 726ad222bd..74d802652e 100644
--- a/src/components/card/__snapshots__/card_select.test.tsx.snap
+++ b/src/components/card/__snapshots__/card_select.test.tsx.snap
@@ -12,7 +12,6 @@ exports[`OuiCardSelect is rendered 1`] = `
   <span
     class="ouiButtonContent ouiButtonEmpty__content"
   >
-    <span />
     <span
       class="ouiButtonEmpty__text"
     >
@@ -32,7 +31,6 @@ exports[`OuiCardSelect props can override color 1`] = `
   <span
     class="ouiButtonContent ouiButtonEmpty__content"
   >
-    <span />
     <span
       class="ouiButtonEmpty__text"
     >
@@ -52,7 +50,6 @@ exports[`OuiCardSelect props can override text 1`] = `
   <span
     class="ouiButtonContent ouiButtonEmpty__content"
   >
-    <span />
     <span
       class="ouiButtonEmpty__text"
     >
@@ -73,7 +70,6 @@ exports[`OuiCardSelect props isDisabled 1`] = `
   <span
     class="ouiButtonContent ouiButtonEmpty__content"
   >
-    <span />
     <span
       class="ouiButtonEmpty__text"
     >
@@ -93,13 +89,11 @@ exports[`OuiCardSelect props isSelected 1`] = `
   <span
     class="ouiButtonContent ouiButtonEmpty__content"
   >
-    <span>
-      <span
-        class="ouiButtonContent__icon"
-        color="inherit"
-        data-ouiicon-type="check"
-      />
-    </span>
+    <span
+      class="ouiButtonContent__icon"
+      color="inherit"
+      data-ouiicon-type="check"
+    />
     <span
       class="ouiButtonEmpty__text"
     >
diff --git a/src/components/control_bar/__snapshots__/control_bar.test.tsx.snap b/src/components/control_bar/__snapshots__/control_bar.test.tsx.snap
index 7bdb0ed2a1..cadd4fe012 100644
--- a/src/components/control_bar/__snapshots__/control_bar.test.tsx.snap
+++ b/src/components/control_bar/__snapshots__/control_bar.test.tsx.snap
@@ -54,7 +54,6 @@ exports[`OuiControlBar is rendered 1`] = `
       <span
         class="ouiButtonContent ouiButton__content"
       >
-        <span />
         <span
           class="ouiButton__text"
         >
@@ -201,7 +200,6 @@ exports[`OuiControlBar props leftOffset is rendered 1`] = `
                 <span
                   class="ouiButtonContent ouiButton__content"
                 >
-                  <span />
                   <span
                     class="ouiButton__text"
                   >
@@ -362,7 +360,6 @@ exports[`OuiControlBar props leftOffset is rendered 1`] = `
                     <span
                       className="ouiButtonContent ouiButton__content"
                     >
-                      <span />
                       <span
                         className="ouiButton__text"
                       >
@@ -543,7 +540,6 @@ exports[`OuiControlBar props maxHeight is rendered 1`] = `
                 <span
                   class="ouiButtonContent ouiButton__content"
                 >
-                  <span />
                   <span
                     class="ouiButton__text"
                   >
@@ -704,7 +700,6 @@ exports[`OuiControlBar props maxHeight is rendered 1`] = `
                     <span
                       className="ouiButtonContent ouiButton__content"
                     >
-                      <span />
                       <span
                         className="ouiButton__text"
                       >
@@ -884,7 +879,6 @@ exports[`OuiControlBar props mobile is rendered 1`] = `
                 <span
                   class="ouiButtonContent ouiButton__content"
                 >
-                  <span />
                   <span
                     class="ouiButton__text"
                   >
@@ -1045,7 +1039,6 @@ exports[`OuiControlBar props mobile is rendered 1`] = `
                     <span
                       className="ouiButtonContent ouiButton__content"
                     >
-                      <span />
                       <span
                         className="ouiButton__text"
                       >
@@ -1289,7 +1282,6 @@ exports[`OuiControlBar props position is rendered 1`] = `
                 <span
                   className="ouiButtonContent ouiButton__content"
                 >
-                  <span />
                   <span
                     className="ouiButton__text"
                   >
@@ -1454,7 +1446,6 @@ exports[`OuiControlBar props rightOffset is rendered 1`] = `
                 <span
                   class="ouiButtonContent ouiButton__content"
                 >
-                  <span />
                   <span
                     class="ouiButton__text"
                   >
@@ -1615,7 +1606,6 @@ exports[`OuiControlBar props rightOffset is rendered 1`] = `
                     <span
                       className="ouiButtonContent ouiButton__content"
                     >
-                      <span />
                       <span
                         className="ouiButton__text"
                       >
@@ -1795,7 +1785,6 @@ exports[`OuiControlBar props showContent is rendered 1`] = `
                 <span
                   class="ouiButtonContent ouiButton__content"
                 >
-                  <span />
                   <span
                     class="ouiButton__text"
                   >
@@ -1961,7 +1950,6 @@ exports[`OuiControlBar props showContent is rendered 1`] = `
                     <span
                       className="ouiButtonContent ouiButton__content"
                     >
-                      <span />
                       <span
                         className="ouiButton__text"
                       >
@@ -2146,7 +2134,6 @@ exports[`OuiControlBar props size is rendered 1`] = `
                 <span
                   class="ouiButtonContent ouiButton__content"
                 >
-                  <span />
                   <span
                     class="ouiButton__text"
                   >
@@ -2307,7 +2294,6 @@ exports[`OuiControlBar props size is rendered 1`] = `
                     <span
                       className="ouiButtonContent ouiButton__content"
                     >
-                      <span />
                       <span
                         className="ouiButton__text"
                       >
diff --git a/src/components/datagrid/__snapshots__/data_grid.test.tsx.snap b/src/components/datagrid/__snapshots__/data_grid.test.tsx.snap
index 40d25d6717..bb537ef767 100644
--- a/src/components/datagrid/__snapshots__/data_grid.test.tsx.snap
+++ b/src/components/datagrid/__snapshots__/data_grid.test.tsx.snap
@@ -21,13 +21,11 @@ exports[`OuiDataGrid pagination renders 1`] = `
           <span
             class="ouiButtonContent ouiButtonContent--iconRight ouiButtonEmpty__content"
           >
-            <span>
-              <span
-                class="ouiButtonContent__icon"
-                color="inherit"
-                data-ouiicon-type="arrowDown"
-              />
-            </span>
+            <span
+              class="ouiButtonContent__icon"
+              color="inherit"
+              data-ouiicon-type="arrowDown"
+            />
             <span
               class="ouiButtonEmpty__text"
             >
@@ -78,7 +76,6 @@ exports[`OuiDataGrid pagination renders 1`] = `
             <span
               class="ouiButtonContent ouiButtonEmpty__content"
             >
-              <span />
               <span
                 class="ouiButtonEmpty__text"
               >
@@ -102,7 +99,6 @@ exports[`OuiDataGrid pagination renders 1`] = `
             <span
               class="ouiButtonContent ouiButtonEmpty__content"
             >
-              <span />
               <span
                 class="ouiButtonEmpty__text"
               >
@@ -962,13 +958,11 @@ Array [
               <span
                 class="ouiButtonContent ouiButtonEmpty__content"
               >
-                <span>
-                  <span
-                    class="ouiButtonContent__icon"
-                    color="inherit"
-                    data-ouiicon-type="listAdd"
-                  />
-                </span>
+                <span
+                  class="ouiButtonContent__icon"
+                  color="inherit"
+                  data-ouiicon-type="listAdd"
+                />
                 <span
                   class="ouiButtonEmpty__text"
                 >
@@ -993,13 +987,11 @@ Array [
               <span
                 class="ouiButtonContent ouiButtonEmpty__content"
               >
-                <span>
-                  <span
-                    class="ouiButtonContent__icon"
-                    color="inherit"
-                    data-ouiicon-type="tableDensityExpanded"
-                  />
-                </span>
+                <span
+                  class="ouiButtonContent__icon"
+                  color="inherit"
+                  data-ouiicon-type="tableDensityExpanded"
+                />
                 <span
                   class="ouiButtonEmpty__text"
                 >
@@ -1017,13 +1009,11 @@ Array [
           <span
             class="ouiButtonContent ouiButtonEmpty__content"
           >
-            <span>
-              <span
-                class="ouiButtonContent__icon"
-                color="inherit"
-                data-ouiicon-type="fullScreen"
-              />
-            </span>
+            <span
+              class="ouiButtonContent__icon"
+              color="inherit"
+              data-ouiicon-type="fullScreen"
+            />
             <span
               class="ouiButtonEmpty__text"
             >
@@ -1334,13 +1324,11 @@ Array [
               <span
                 class="ouiButtonContent ouiButtonEmpty__content"
               >
-                <span>
-                  <span
-                    class="ouiButtonContent__icon"
-                    color="inherit"
-                    data-ouiicon-type="listAdd"
-                  />
-                </span>
+                <span
+                  class="ouiButtonContent__icon"
+                  color="inherit"
+                  data-ouiicon-type="listAdd"
+                />
                 <span
                   class="ouiButtonEmpty__text"
                 >
@@ -1365,13 +1353,11 @@ Array [
               <span
                 class="ouiButtonContent ouiButtonEmpty__content"
               >
-                <span>
-                  <span
-                    class="ouiButtonContent__icon"
-                    color="inherit"
-                    data-ouiicon-type="tableDensityExpanded"
-                  />
-                </span>
+                <span
+                  class="ouiButtonContent__icon"
+                  color="inherit"
+                  data-ouiicon-type="tableDensityExpanded"
+                />
                 <span
                   class="ouiButtonEmpty__text"
                 >
@@ -1389,13 +1375,11 @@ Array [
           <span
             class="ouiButtonContent ouiButtonEmpty__content"
           >
-            <span>
-              <span
-                class="ouiButtonContent__icon"
-                color="inherit"
-                data-ouiicon-type="fullScreen"
-              />
-            </span>
+            <span
+              class="ouiButtonContent__icon"
+              color="inherit"
+              data-ouiicon-type="fullScreen"
+            />
             <span
               class="ouiButtonEmpty__text"
             >
@@ -2003,13 +1987,11 @@ Array [
               <span
                 class="ouiButtonContent ouiButtonEmpty__content"
               >
-                <span>
-                  <span
-                    class="ouiButtonContent__icon"
-                    color="inherit"
-                    data-ouiicon-type="listAdd"
-                  />
-                </span>
+                <span
+                  class="ouiButtonContent__icon"
+                  color="inherit"
+                  data-ouiicon-type="listAdd"
+                />
                 <span
                   class="ouiButtonEmpty__text"
                 >
@@ -2034,13 +2016,11 @@ Array [
               <span
                 class="ouiButtonContent ouiButtonEmpty__content"
               >
-                <span>
-                  <span
-                    class="ouiButtonContent__icon"
-                    color="inherit"
-                    data-ouiicon-type="tableDensityExpanded"
-                  />
-                </span>
+                <span
+                  class="ouiButtonContent__icon"
+                  color="inherit"
+                  data-ouiicon-type="tableDensityExpanded"
+                />
                 <span
                   class="ouiButtonEmpty__text"
                 >
@@ -2058,13 +2038,11 @@ Array [
           <span
             class="ouiButtonContent ouiButtonEmpty__content"
           >
-            <span>
-              <span
-                class="ouiButtonContent__icon"
-                color="inherit"
-                data-ouiicon-type="fullScreen"
-              />
-            </span>
+            <span
+              class="ouiButtonContent__icon"
+              color="inherit"
+              data-ouiicon-type="fullScreen"
+            />
             <span
               class="ouiButtonEmpty__text"
             >
@@ -2374,13 +2352,11 @@ Array [
               <span
                 class="ouiButtonContent ouiButtonEmpty__content"
               >
-                <span>
-                  <span
-                    class="ouiButtonContent__icon"
-                    color="inherit"
-                    data-ouiicon-type="listAdd"
-                  />
-                </span>
+                <span
+                  class="ouiButtonContent__icon"
+                  color="inherit"
+                  data-ouiicon-type="listAdd"
+                />
                 <span
                   class="ouiButtonEmpty__text"
                 >
@@ -2405,13 +2381,11 @@ Array [
               <span
                 class="ouiButtonContent ouiButtonEmpty__content"
               >
-                <span>
-                  <span
-                    class="ouiButtonContent__icon"
-                    color="inherit"
-                    data-ouiicon-type="tableDensityExpanded"
-                  />
-                </span>
+                <span
+                  class="ouiButtonContent__icon"
+                  color="inherit"
+                  data-ouiicon-type="tableDensityExpanded"
+                />
                 <span
                   class="ouiButtonEmpty__text"
                 >
@@ -2429,13 +2403,11 @@ Array [
           <span
             class="ouiButtonContent ouiButtonEmpty__content"
           >
-            <span>
-              <span
-                class="ouiButtonContent__icon"
-                color="inherit"
-                data-ouiicon-type="fullScreen"
-              />
-            </span>
+            <span
+              class="ouiButtonContent__icon"
+              color="inherit"
+              data-ouiicon-type="fullScreen"
+            />
             <span
               class="ouiButtonEmpty__text"
             >
diff --git a/src/components/filter_group/__snapshots__/filter_button.test.tsx.snap b/src/components/filter_group/__snapshots__/filter_button.test.tsx.snap
index 6f46383929..14bf60b710 100644
--- a/src/components/filter_group/__snapshots__/filter_button.test.tsx.snap
+++ b/src/components/filter_group/__snapshots__/filter_button.test.tsx.snap
@@ -10,7 +10,6 @@ exports[`OuiFilterButton is rendered 1`] = `
   <span
     class="ouiButtonContent ouiButtonContent--iconRight ouiButtonEmpty__content"
   >
-    <span />
     <span
       class="ouiButtonEmpty__text"
     >
@@ -30,7 +29,6 @@ exports[`OuiFilterButton props grow can be turned off 1`] = `
   <span
     class="ouiButtonContent ouiButtonContent--iconRight ouiButtonEmpty__content"
   >
-    <span />
     <span
       class="ouiButtonEmpty__text"
     >
@@ -50,13 +48,11 @@ exports[`OuiFilterButton props iconType and iconSide is rendered 1`] = `
   <span
     class="ouiButtonContent ouiButtonContent--iconRight ouiButtonEmpty__content"
   >
-    <span>
-      <span
-        class="ouiButtonContent__icon"
-        color="inherit"
-        data-ouiicon-type="user"
-      />
-    </span>
+    <span
+      class="ouiButtonContent__icon"
+      color="inherit"
+      data-ouiicon-type="user"
+    />
     <span
       class="ouiButtonEmpty__text"
     >
@@ -77,7 +73,6 @@ exports[`OuiFilterButton props isDisabled is rendered 1`] = `
   <span
     class="ouiButtonContent ouiButtonContent--iconRight ouiButtonEmpty__content"
   >
-    <span />
     <span
       class="ouiButtonEmpty__text"
     >
@@ -97,7 +92,6 @@ exports[`OuiFilterButton props isSelected is rendered 1`] = `
   <span
     class="ouiButtonContent ouiButtonContent--iconRight ouiButtonEmpty__content"
   >
-    <span />
     <span
       class="ouiButtonEmpty__text"
     >
@@ -117,7 +111,6 @@ exports[`OuiFilterButton props numActiveFilters and hasActiveFilters is rendered
   <span
     class="ouiButtonContent ouiButtonContent--iconRight ouiButtonEmpty__content"
   >
-    <span />
     <span
       class="ouiButtonEmpty__text ouiFilterButton__text-hasNotification"
     >
@@ -143,7 +136,6 @@ exports[`OuiFilterButton props numFilters is rendered 1`] = `
   <span
     class="ouiButtonContent ouiButtonContent--iconRight ouiButtonEmpty__content"
   >
-    <span />
     <span
       class="ouiButtonEmpty__text ouiFilterButton__text-hasNotification"
     >
@@ -169,7 +161,6 @@ exports[`OuiFilterButton props type is rendered 1`] = `
   <span
     class="ouiButtonContent ouiButtonContent--iconRight ouiButtonEmpty__content"
   >
-    <span />
     <span
       class="ouiButtonEmpty__text"
     >
@@ -189,7 +180,6 @@ exports[`OuiFilterButton props withNext is rendered 1`] = `
   <span
     class="ouiButtonContent ouiButtonContent--iconRight ouiButtonEmpty__content"
   >
-    <span />
     <span
       class="ouiButtonEmpty__text"
     >
@@ -211,7 +201,6 @@ exports[`OuiFilterButton renders zero properly 1`] = `
   <span
     class="ouiButtonContent ouiButtonContent--iconRight ouiButtonEmpty__content"
   >
-    <span />
     <span
       class="ouiButtonEmpty__text ouiFilterButton__text-hasNotification"
     >
diff --git a/src/components/header/header_links/__snapshots__/header_link.test.tsx.snap b/src/components/header/header_links/__snapshots__/header_link.test.tsx.snap
index 4a20bbdb7a..4ffac40d76 100644
--- a/src/components/header/header_links/__snapshots__/header_link.test.tsx.snap
+++ b/src/components/header/header_links/__snapshots__/header_link.test.tsx.snap
@@ -8,7 +8,6 @@ exports[`OuiHeaderLink can render as specific color 1`] = `
   <span
     class="ouiButtonContent ouiButtonEmpty__content"
   >
-    <span />
     <span
       class="ouiButtonEmpty__text"
     />
@@ -26,7 +25,6 @@ exports[`OuiHeaderLink is rendered 1`] = `
   <span
     class="ouiButtonContent ouiButtonEmpty__content"
   >
-    <span />
     <span
       class="ouiButtonEmpty__text"
     />
@@ -42,7 +40,6 @@ exports[`OuiHeaderLink is rendered as active 1`] = `
   <span
     class="ouiButtonContent ouiButtonEmpty__content"
   >
-    <span />
     <span
       class="ouiButtonEmpty__text"
     />
diff --git a/src/components/header/header_links/__snapshots__/header_links.test.tsx.snap b/src/components/header/header_links/__snapshots__/header_links.test.tsx.snap
index 1cc3062112..ec396ba4cb 100644
--- a/src/components/header/header_links/__snapshots__/header_links.test.tsx.snap
+++ b/src/components/header/header_links/__snapshots__/header_links.test.tsx.snap
@@ -86,7 +86,6 @@ exports[`OuiHeaderLinks popover props is rendered 1`] = `
         <span
           class="ouiButtonContent ouiButtonEmpty__content"
         >
-          <span />
           <span
             class="ouiButtonEmpty__text"
           >
diff --git a/src/components/header/header_section/__snapshots__/header_section_item_button.test.tsx.snap b/src/components/header/header_section/__snapshots__/header_section_item_button.test.tsx.snap
index 1df04f72e9..3e6c08cefc 100644
--- a/src/components/header/header_section/__snapshots__/header_section_item_button.test.tsx.snap
+++ b/src/components/header/header_section/__snapshots__/header_section_item_button.test.tsx.snap
@@ -10,7 +10,6 @@ exports[`OuiHeaderSectionItemButton is rendered 1`] = `
   <span
     class="ouiButtonContent ouiButtonEmpty__content"
   >
-    <span />
     <span
       class="ouiButtonEmpty__text"
     >
@@ -31,7 +30,6 @@ exports[`OuiHeaderSectionItemButton renders a link 1`] = `
   <span
     class="ouiButtonContent ouiButtonEmpty__content"
   >
-    <span />
     <span
       class="ouiButtonEmpty__text"
     >
@@ -51,7 +49,6 @@ exports[`OuiHeaderSectionItemButton renders children 1`] = `
   <span
     class="ouiButtonContent ouiButtonEmpty__content"
   >
-    <span />
     <span
       class="ouiButtonEmpty__text"
     >
@@ -75,7 +72,6 @@ exports[`OuiHeaderSectionItemButton renders notification as a badge 1`] = `
   <span
     class="ouiButtonContent ouiButtonEmpty__content"
   >
-    <span />
     <span
       class="ouiButtonEmpty__text"
     >
@@ -100,7 +96,6 @@ exports[`OuiHeaderSectionItemButton renders notification as a dot 1`] = `
   <span
     class="ouiButtonContent ouiButtonEmpty__content"
   >
-    <span />
     <span
       class="ouiButtonEmpty__text"
     >
@@ -125,7 +120,6 @@ exports[`OuiHeaderSectionItemButton renders notification color 1`] = `
   <span
     class="ouiButtonContent ouiButtonEmpty__content"
   >
-    <span />
     <span
       class="ouiButtonEmpty__text"
     >
diff --git a/src/components/markdown_editor/__snapshots__/markdown_editor.test.tsx.snap b/src/components/markdown_editor/__snapshots__/markdown_editor.test.tsx.snap
index 9209798bad..def0944bf8 100644
--- a/src/components/markdown_editor/__snapshots__/markdown_editor.test.tsx.snap
+++ b/src/components/markdown_editor/__snapshots__/markdown_editor.test.tsx.snap
@@ -172,13 +172,11 @@ exports[`OuiMarkdownEditor is rendered 1`] = `
       <span
         class="ouiButtonContent ouiButtonEmpty__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="eye"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="eye"
+        />
         <span
           class="ouiButtonEmpty__text"
         >
@@ -404,13 +402,11 @@ exports[`OuiMarkdownEditor props autoExpandPreview is rendered with false 1`] =
       <span
         class="ouiButtonContent ouiButtonEmpty__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="eye"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="eye"
+        />
         <span
           class="ouiButtonEmpty__text"
         >
@@ -636,13 +632,11 @@ exports[`OuiMarkdownEditor props height is rendered in full mode 1`] = `
       <span
         class="ouiButtonContent ouiButtonEmpty__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="eye"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="eye"
+        />
         <span
           class="ouiButtonEmpty__text"
         >
@@ -868,13 +862,11 @@ exports[`OuiMarkdownEditor props height is rendered with a custom size 1`] = `
       <span
         class="ouiButtonContent ouiButtonEmpty__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="eye"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="eye"
+        />
         <span
           class="ouiButtonEmpty__text"
         >
@@ -1100,13 +1092,11 @@ exports[`OuiMarkdownEditor props maxHeight is rendered with a custom size 1`] =
       <span
         class="ouiButtonContent ouiButtonEmpty__content"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="eye"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="eye"
+        />
         <span
           class="ouiButtonEmpty__text"
         >
diff --git a/src/components/modal/__snapshots__/confirm_modal.test.tsx.snap b/src/components/modal/__snapshots__/confirm_modal.test.tsx.snap
index 3b43545d1f..0514d28db0 100644
--- a/src/components/modal/__snapshots__/confirm_modal.test.tsx.snap
+++ b/src/components/modal/__snapshots__/confirm_modal.test.tsx.snap
@@ -77,7 +77,6 @@ Array [
             <span
               class="ouiButtonContent ouiButtonEmpty__content"
             >
-              <span />
               <span
                 class="ouiButtonEmpty__text"
               >
@@ -93,7 +92,6 @@ Array [
             <span
               class="ouiButtonContent ouiButton__content"
             >
-              <span />
               <span
                 class="ouiButton__text"
               >
@@ -176,7 +174,6 @@ Array [
             <span
               class="ouiButtonContent ouiButtonEmpty__content"
             >
-              <span />
               <span
                 class="ouiButtonEmpty__text"
               >
@@ -192,7 +189,6 @@ Array [
             <span
               class="ouiButtonContent ouiButton__content"
             >
-              <span />
               <span
                 class="ouiButton__text"
               >
diff --git a/src/components/notification/__snapshots__/notification_event.test.tsx.snap b/src/components/notification/__snapshots__/notification_event.test.tsx.snap
index 497ef7ba10..1ff2373ead 100644
--- a/src/components/notification/__snapshots__/notification_event.test.tsx.snap
+++ b/src/components/notification/__snapshots__/notification_event.test.tsx.snap
@@ -664,7 +664,6 @@ exports[`OuiNotificationEvent props primaryAction is rendered 1`] = `
         <span
           class="ouiButtonContent ouiButtonEmpty__content"
         >
-          <span />
           <span
             class="ouiButtonEmpty__text"
           >
@@ -748,13 +747,11 @@ exports[`OuiNotificationEvent props primaryActionProps is rendered 1`] = `
         <span
           class="ouiButtonContent ouiButtonEmpty__content"
         >
-          <span>
-            <span
-              class="ouiButtonContent__icon"
-              color="inherit"
-              data-ouiicon-type="download"
-            />
-          </span>
+          <span
+            class="ouiButtonContent__icon"
+            color="inherit"
+            data-ouiicon-type="download"
+          />
           <span
             class="ouiButtonEmpty__text"
           >
diff --git a/src/components/pagination/__snapshots__/pagination.test.tsx.snap b/src/components/pagination/__snapshots__/pagination.test.tsx.snap
index e4f0a8b3ae..e84e2f5aca 100644
--- a/src/components/pagination/__snapshots__/pagination.test.tsx.snap
+++ b/src/components/pagination/__snapshots__/pagination.test.tsx.snap
@@ -35,7 +35,6 @@ exports[`OuiPagination is rendered 1`] = `
         <span
           class="ouiButtonContent ouiButtonEmpty__content"
         >
-          <span />
           <span
             class="ouiButtonEmpty__text"
           >
diff --git a/src/components/pagination/__snapshots__/pagination_button.test.tsx.snap b/src/components/pagination/__snapshots__/pagination_button.test.tsx.snap
index ee48d3a0de..5ddec27103 100644
--- a/src/components/pagination/__snapshots__/pagination_button.test.tsx.snap
+++ b/src/components/pagination/__snapshots__/pagination_button.test.tsx.snap
@@ -10,7 +10,6 @@ exports[`OuiPaginationButton is rendered 1`] = `
   <span
     class="ouiButtonContent ouiButtonEmpty__content"
   >
-    <span />
     <span
       class="ouiButtonEmpty__text"
     >
diff --git a/src/components/side_nav/__snapshots__/side_nav.test.tsx.snap b/src/components/side_nav/__snapshots__/side_nav.test.tsx.snap
index ef8223c9ee..6d5257846b 100644
--- a/src/components/side_nav/__snapshots__/side_nav.test.tsx.snap
+++ b/src/components/side_nav/__snapshots__/side_nav.test.tsx.snap
@@ -532,13 +532,11 @@ exports[`OuiSideNav props mobileBreakpoints can be adjusted is rendered 1`] = `
       <span
         class="ouiButtonContent ouiButtonContent--iconRight ouiButtonEmpty__content ouiSideNav__mobileToggleContent"
       >
-        <span>
-          <span
-            class="ouiButtonContent__icon"
-            color="inherit"
-            data-ouiicon-type="apps"
-          />
-        </span>
+        <span
+          class="ouiButtonContent__icon"
+          color="inherit"
+          data-ouiicon-type="apps"
+        />
         <span
           class="ouiButtonEmpty__text ouiSideNav__mobileToggleText"
         />
diff --git a/src/components/table/mobile/__snapshots__/table_sort_mobile.test.tsx.snap b/src/components/table/mobile/__snapshots__/table_sort_mobile.test.tsx.snap
index 3979dfe30e..7e45415d31 100644
--- a/src/components/table/mobile/__snapshots__/table_sort_mobile.test.tsx.snap
+++ b/src/components/table/mobile/__snapshots__/table_sort_mobile.test.tsx.snap
@@ -18,13 +18,11 @@ exports[`OuiTableSortMobile is rendered 1`] = `
         <span
           class="ouiButtonContent ouiButtonContent--iconRight ouiButtonEmpty__content"
         >
-          <span>
-            <span
-              class="ouiButtonContent__icon"
-              color="inherit"
-              data-ouiicon-type="arrowDown"
-            />
-          </span>
+          <span
+            class="ouiButtonContent__icon"
+            color="inherit"
+            data-ouiicon-type="arrowDown"
+          />
           <span
             class="ouiButtonEmpty__text"
           >
diff --git a/src/components/table/table_pagination/__snapshots__/table_pagination.test.tsx.snap b/src/components/table/table_pagination/__snapshots__/table_pagination.test.tsx.snap
index 01ae6d46a3..70aafd549c 100644
--- a/src/components/table/table_pagination/__snapshots__/table_pagination.test.tsx.snap
+++ b/src/components/table/table_pagination/__snapshots__/table_pagination.test.tsx.snap
@@ -21,13 +21,11 @@ exports[`OuiTablePagination is rendered 1`] = `
           <span
             class="ouiButtonContent ouiButtonContent--iconRight ouiButtonEmpty__content"
           >
-            <span>
-              <span
-                class="ouiButtonContent__icon"
-                color="inherit"
-                data-ouiicon-type="arrowDown"
-              />
-            </span>
+            <span
+              class="ouiButtonContent__icon"
+              color="inherit"
+              data-ouiicon-type="arrowDown"
+            />
             <span
               class="ouiButtonEmpty__text"
             >
@@ -75,7 +73,6 @@ exports[`OuiTablePagination is rendered 1`] = `
             <span
               class="ouiButtonContent ouiButtonEmpty__content"
             >
-              <span />
               <span
                 class="ouiButtonEmpty__text"
               >
@@ -98,7 +95,6 @@ exports[`OuiTablePagination is rendered 1`] = `
             <span
               class="ouiButtonContent ouiButtonEmpty__content"
             >
-              <span />
               <span
                 class="ouiButtonEmpty__text"
               >
@@ -119,7 +115,6 @@ exports[`OuiTablePagination is rendered 1`] = `
             <span
               class="ouiButtonContent ouiButtonEmpty__content"
             >
-              <span />
               <span
                 class="ouiButtonEmpty__text"
               >
@@ -140,7 +135,6 @@ exports[`OuiTablePagination is rendered 1`] = `
             <span
               class="ouiButtonContent ouiButtonEmpty__content"
             >
-              <span />
               <span
                 class="ouiButtonEmpty__text"
               >
@@ -161,7 +155,6 @@ exports[`OuiTablePagination is rendered 1`] = `
             <span
               class="ouiButtonContent ouiButtonEmpty__content"
             >
-              <span />
               <span
                 class="ouiButtonEmpty__text"
               >
@@ -233,7 +226,6 @@ exports[`OuiTablePagination is rendered when hiding the per page options 1`] = `
             <span
               class="ouiButtonContent ouiButtonEmpty__content"
             >
-              <span />
               <span
                 class="ouiButtonEmpty__text"
               >
@@ -256,7 +248,6 @@ exports[`OuiTablePagination is rendered when hiding the per page options 1`] = `
             <span
               class="ouiButtonContent ouiButtonEmpty__content"
             >
-              <span />
               <span
                 class="ouiButtonEmpty__text"
               >
@@ -277,7 +268,6 @@ exports[`OuiTablePagination is rendered when hiding the per page options 1`] = `
             <span
               class="ouiButtonContent ouiButtonEmpty__content"
             >
-              <span />
               <span
                 class="ouiButtonEmpty__text"
               >
@@ -298,7 +288,6 @@ exports[`OuiTablePagination is rendered when hiding the per page options 1`] = `
             <span
               class="ouiButtonContent ouiButtonEmpty__content"
             >
-              <span />
               <span
                 class="ouiButtonEmpty__text"
               >
@@ -319,7 +308,6 @@ exports[`OuiTablePagination is rendered when hiding the per page options 1`] = `
             <span
               class="ouiButtonContent ouiButtonEmpty__content"
             >
-              <span />
               <span
                 class="ouiButtonEmpty__text"
               >