diff --git a/package.json b/package.json
index e5b9ca1ef98cc..9a076ee28bc04 100644
--- a/package.json
+++ b/package.json
@@ -86,6 +86,7 @@
     "**/prismjs": "1.23.0",
     "**/react-syntax-highlighter": "^15.3.1",
     "**/react-syntax-highlighter/**/highlight.js": "^10.4.1",
+    "**/refractor": "^3.3.1",
     "**/request": "^2.88.2",
     "**/trim": "1.0.1",
     "**/typescript": "4.1.3",
@@ -102,7 +103,7 @@
     "@elastic/datemath": "link:bazel-bin/packages/elastic-datemath/npm_module",
     "@elastic/elasticsearch": "npm:@elastic/elasticsearch-canary@^8.0.0-canary.4",
     "@elastic/ems-client": "7.13.0",
-    "@elastic/eui": "32.1.0",
+    "@elastic/eui": "33.0.0",
     "@elastic/filesaver": "1.1.2",
     "@elastic/good": "^9.0.1-kibana3",
     "@elastic/maki": "6.3.0",
diff --git a/packages/kbn-crypto/BUILD.bazel b/packages/kbn-crypto/BUILD.bazel
index b1723e4120e79..20793e27de629 100644
--- a/packages/kbn-crypto/BUILD.bazel
+++ b/packages/kbn-crypto/BUILD.bazel
@@ -38,6 +38,7 @@ TYPES_DEPS = [
   "@npm//@types/node",
   "@npm//@types/node-forge",
   "@npm//@types/testing-library__jest-dom",
+  "@npm//resize-observer-polyfill"
 ]
 
 DEPS = SRC_DEPS + TYPES_DEPS
diff --git a/packages/kbn-telemetry-tools/BUILD.bazel b/packages/kbn-telemetry-tools/BUILD.bazel
index 9a6b4a10bd190..d394b0c93d45f 100644
--- a/packages/kbn-telemetry-tools/BUILD.bazel
+++ b/packages/kbn-telemetry-tools/BUILD.bazel
@@ -47,6 +47,7 @@ TYPES_DEPS = [
   "@npm//@types/node",
   "@npm//@types/normalize-path",
   "@npm//@types/testing-library__jest-dom",
+  "@npm//resize-observer-polyfill"
 ]
 
 DEPS = SRC_DEPS + TYPES_DEPS
diff --git a/src/core/public/chrome/ui/header/__snapshots__/collapsible_nav.test.tsx.snap b/src/core/public/chrome/ui/header/__snapshots__/collapsible_nav.test.tsx.snap
index 575a247ffeccb..0f5efe667ec2f 100644
--- a/src/core/public/chrome/ui/header/__snapshots__/collapsible_nav.test.tsx.snap
+++ b/src/core/public/chrome/ui/header/__snapshots__/collapsible_nav.test.tsx.snap
@@ -587,10 +587,12 @@ exports[`CollapsibleNav renders links grouped by category 1`] = `
                             >
                               <EuiIcon
                                 className="euiListGroupItem__icon"
+                                color="inherit"
                                 type="home"
                               >
                                 <span
                                   className="euiListGroupItem__icon"
+                                  color="inherit"
                                   data-euiicon-type="home"
                                 />
                               </EuiIcon>
@@ -1921,6 +1923,7 @@ exports[`CollapsibleNav renders links grouped by category 1`] = `
                                 >
                                   <span
                                     class="euiListGroupItem__icon"
+                                    color="inherit"
                                     data-euiicon-type="lockOpen"
                                   />
                                   <span
@@ -1952,10 +1955,12 @@ exports[`CollapsibleNav renders links grouped by category 1`] = `
                               >
                                 <EuiIcon
                                   className="euiListGroupItem__icon"
+                                  color="inherit"
                                   type="lockOpen"
                                 >
                                   <span
                                     className="euiListGroupItem__icon"
+                                    color="inherit"
                                     data-euiicon-type="lockOpen"
                                   />
                                 </EuiIcon>
@@ -1999,6 +2004,7 @@ exports[`CollapsibleNav renders links grouped by category 1`] = `
                 <EuiButtonContent
                   className="euiButtonEmpty__content"
                   iconSide="left"
+                  iconSize="s"
                   iconType="cross"
                   textProps={
                     Object {
@@ -2011,13 +2017,15 @@ exports[`CollapsibleNav renders links grouped by category 1`] = `
                   >
                     <EuiIcon
                       className="euiButtonContent__icon"
-                      size="m"
+                      color="inherit"
+                      size="s"
                       type="cross"
                     >
                       <span
                         className="euiButtonContent__icon"
+                        color="inherit"
                         data-euiicon-type="cross"
-                        size="m"
+                        size="s"
                       />
                     </EuiIcon>
                     <span
@@ -2854,10 +2862,12 @@ exports[`CollapsibleNav renders the default nav 3`] = `
                             >
                               <EuiIcon
                                 className="euiListGroupItem__icon"
+                                color="inherit"
                                 type="home"
                               >
                                 <span
                                   className="euiListGroupItem__icon"
+                                  color="inherit"
                                   data-euiicon-type="home"
                                 />
                               </EuiIcon>
@@ -3084,6 +3094,7 @@ exports[`CollapsibleNav renders the default nav 3`] = `
                                 >
                                   <span
                                     class="euiListGroupItem__icon"
+                                    color="inherit"
                                     data-euiicon-type="lock"
                                   />
                                   <span
@@ -3115,10 +3126,12 @@ exports[`CollapsibleNav renders the default nav 3`] = `
                               >
                                 <EuiIcon
                                   className="euiListGroupItem__icon"
+                                  color="inherit"
                                   type="lock"
                                 >
                                   <span
                                     className="euiListGroupItem__icon"
+                                    color="inherit"
                                     data-euiicon-type="lock"
                                   />
                                 </EuiIcon>
@@ -3162,6 +3175,7 @@ exports[`CollapsibleNav renders the default nav 3`] = `
                 <EuiButtonContent
                   className="euiButtonEmpty__content"
                   iconSide="left"
+                  iconSize="s"
                   iconType="cross"
                   textProps={
                     Object {
@@ -3174,13 +3188,15 @@ exports[`CollapsibleNav renders the default nav 3`] = `
                   >
                     <EuiIcon
                       className="euiButtonContent__icon"
-                      size="m"
+                      color="inherit"
+                      size="s"
                       type="cross"
                     >
                       <span
                         className="euiButtonContent__icon"
+                        color="inherit"
                         data-euiicon-type="cross"
-                        size="m"
+                        size="s"
                       />
                     </EuiIcon>
                     <span
diff --git a/src/core/public/chrome/ui/header/__snapshots__/header.test.tsx.snap b/src/core/public/chrome/ui/header/__snapshots__/header.test.tsx.snap
index 29407c54e2834..49d2cf0f5f0f5 100644
--- a/src/core/public/chrome/ui/header/__snapshots__/header.test.tsx.snap
+++ b/src/core/public/chrome/ui/header/__snapshots__/header.test.tsx.snap
@@ -4115,6 +4115,7 @@ exports[`Header renders 1`] = `
                                 <EuiButtonContent
                                   className="euiButtonEmpty__content"
                                   iconSide="left"
+                                  iconSize="m"
                                   textProps={
                                     Object {
                                       "className": "euiButtonEmpty__text",
@@ -4297,6 +4298,7 @@ exports[`Header renders 1`] = `
                         <EuiButtonContent
                           className="euiButtonEmpty__content"
                           iconSide="left"
+                          iconSize="m"
                           textProps={
                             Object {
                               "className": "euiButtonEmpty__text",
@@ -5154,10 +5156,12 @@ exports[`Header renders 1`] = `
                                 >
                                   <EuiIcon
                                     className="euiListGroupItem__icon"
+                                    color="inherit"
                                     type="home"
                                   >
                                     <span
                                       className="euiListGroupItem__icon"
+                                      color="inherit"
                                       data-euiicon-type="home"
                                     />
                                   </EuiIcon>
@@ -5469,6 +5473,7 @@ exports[`Header renders 1`] = `
                                     >
                                       <span
                                         class="euiListGroupItem__icon"
+                                        color="inherit"
                                         data-euiicon-type="lock"
                                       />
                                       <span
@@ -5500,10 +5505,12 @@ exports[`Header renders 1`] = `
                                   >
                                     <EuiIcon
                                       className="euiListGroupItem__icon"
+                                      color="inherit"
                                       type="lock"
                                     >
                                       <span
                                         className="euiListGroupItem__icon"
+                                        color="inherit"
                                         data-euiicon-type="lock"
                                       />
                                     </EuiIcon>
@@ -5547,6 +5554,7 @@ exports[`Header renders 1`] = `
                     <EuiButtonContent
                       className="euiButtonEmpty__content"
                       iconSide="left"
+                      iconSize="s"
                       iconType="cross"
                       textProps={
                         Object {
@@ -5559,13 +5567,15 @@ exports[`Header renders 1`] = `
                       >
                         <EuiIcon
                           className="euiButtonContent__icon"
-                          size="m"
+                          color="inherit"
+                          size="s"
                           type="cross"
                         >
                           <span
                             className="euiButtonContent__icon"
+                            color="inherit"
                             data-euiicon-type="cross"
-                            size="m"
+                            size="s"
                           />
                         </EuiIcon>
                         <span
diff --git a/src/core/public/overlays/flyout/__snapshots__/flyout_service.test.tsx.snap b/src/core/public/overlays/flyout/__snapshots__/flyout_service.test.tsx.snap
index 0d10ac47d0b75..f5a1c51ccbe15 100644
--- a/src/core/public/overlays/flyout/__snapshots__/flyout_service.test.tsx.snap
+++ b/src/core/public/overlays/flyout/__snapshots__/flyout_service.test.tsx.snap
@@ -26,7 +26,7 @@ Array [
 ]
 `;
 
-exports[`FlyoutService openFlyout() renders a flyout to the DOM 2`] = `"<div data-eui=\\"EuiFocusTrap\\"><div role=\\"dialog\\" class=\\"euiFlyout euiFlyout--medium euiFlyout--paddingLarge\\" tabindex=\\"0\\"><button class=\\"euiButtonIcon euiButtonIcon--text euiButtonIcon--empty euiButtonIcon--xSmall euiFlyout__closeButton\\" type=\\"button\\" aria-label=\\"Close this dialog\\" data-test-subj=\\"euiFlyoutCloseButton\\"><span data-euiicon-type=\\"cross\\" class=\\"euiButtonIcon__icon\\" aria-hidden=\\"true\\"></span></button><div class=\\"kbnOverlayMountWrapper\\"><span>Flyout content</span></div></div></div>"`;
+exports[`FlyoutService openFlyout() renders a flyout to the DOM 2`] = `"<div data-eui=\\"EuiFocusTrap\\"><div role=\\"dialog\\" class=\\"euiFlyout euiFlyout--medium euiFlyout--paddingLarge\\" tabindex=\\"0\\"><button class=\\"euiButtonIcon euiButtonIcon--text euiButtonIcon--empty euiButtonIcon--xSmall euiFlyout__closeButton\\" type=\\"button\\" aria-label=\\"Close this dialog\\" data-test-subj=\\"euiFlyoutCloseButton\\"><span data-euiicon-type=\\"cross\\" class=\\"euiButtonIcon__icon\\" aria-hidden=\\"true\\" color=\\"inherit\\"></span></button><div class=\\"kbnOverlayMountWrapper\\"><span>Flyout content</span></div></div></div>"`;
 
 exports[`FlyoutService openFlyout() with a currently active flyout replaces the current flyout with a new one 1`] = `
 Array [
@@ -59,4 +59,4 @@ Array [
 ]
 `;
 
-exports[`FlyoutService openFlyout() with a currently active flyout replaces the current flyout with a new one 2`] = `"<div data-eui=\\"EuiFocusTrap\\"><div role=\\"dialog\\" class=\\"euiFlyout euiFlyout--medium euiFlyout--paddingLarge\\" tabindex=\\"0\\"><button class=\\"euiButtonIcon euiButtonIcon--text euiButtonIcon--empty euiButtonIcon--xSmall euiFlyout__closeButton\\" type=\\"button\\" aria-label=\\"Close this dialog\\" data-test-subj=\\"euiFlyoutCloseButton\\"><span data-euiicon-type=\\"cross\\" class=\\"euiButtonIcon__icon\\" aria-hidden=\\"true\\"></span></button><div class=\\"kbnOverlayMountWrapper\\"><span>Flyout content 2</span></div></div></div>"`;
+exports[`FlyoutService openFlyout() with a currently active flyout replaces the current flyout with a new one 2`] = `"<div data-eui=\\"EuiFocusTrap\\"><div role=\\"dialog\\" class=\\"euiFlyout euiFlyout--medium euiFlyout--paddingLarge\\" tabindex=\\"0\\"><button class=\\"euiButtonIcon euiButtonIcon--text euiButtonIcon--empty euiButtonIcon--xSmall euiFlyout__closeButton\\" type=\\"button\\" aria-label=\\"Close this dialog\\" data-test-subj=\\"euiFlyoutCloseButton\\"><span data-euiicon-type=\\"cross\\" class=\\"euiButtonIcon__icon\\" aria-hidden=\\"true\\" color=\\"inherit\\"></span></button><div class=\\"kbnOverlayMountWrapper\\"><span>Flyout content 2</span></div></div></div>"`;
diff --git a/src/core/public/overlays/modal/__snapshots__/modal_service.test.tsx.snap b/src/core/public/overlays/modal/__snapshots__/modal_service.test.tsx.snap
index 19ebb5a9113c3..9c39776fcea5c 100644
--- a/src/core/public/overlays/modal/__snapshots__/modal_service.test.tsx.snap
+++ b/src/core/public/overlays/modal/__snapshots__/modal_service.test.tsx.snap
@@ -29,7 +29,7 @@ Array [
 ]
 `;
 
-exports[`ModalService openConfirm() renders a mountpoint confirm message 2`] = `"<div data-eui=\\"EuiFocusTrap\\"><div class=\\"euiModal euiModal--maxWidth-default euiModal--confirmation\\" tabindex=\\"0\\"><button class=\\"euiButtonIcon euiButtonIcon--text euiButtonIcon--empty euiButtonIcon--xSmall euiModal__closeIcon\\" type=\\"button\\" aria-label=\\"Closes this modal window\\"><span data-euiicon-type=\\"cross\\" class=\\"euiButtonIcon__icon\\" aria-hidden=\\"true\\"></span></button><div class=\\"euiModal__flex\\"><div class=\\"euiModalBody\\"><div class=\\"euiModalBody__overflow\\"><div class=\\"euiText euiText--medium\\" data-test-subj=\\"confirmModalBodyText\\"><div class=\\"kbnOverlayMountWrapper\\"><span>Modal content</span></div></div></div></div><div class=\\"euiModalFooter\\"><button class=\\"euiButtonEmpty euiButtonEmpty--primary\\" type=\\"button\\" data-test-subj=\\"confirmModalCancelButton\\"><span class=\\"euiButtonContent euiButtonEmpty__content\\"><span class=\\"euiButtonEmpty__text\\">Cancel</span></span></button><button class=\\"euiButton euiButton--primary euiButton--fill\\" type=\\"button\\" data-test-subj=\\"confirmModalConfirmButton\\"><span class=\\"euiButtonContent euiButton__content\\"><span class=\\"euiButton__text\\">Confirm</span></span></button></div></div></div></div>"`;
+exports[`ModalService openConfirm() renders a mountpoint confirm message 2`] = `"<div data-eui=\\"EuiFocusTrap\\"><div class=\\"euiModal euiModal--maxWidth-default euiModal--confirmation\\" tabindex=\\"0\\"><button class=\\"euiButtonIcon euiButtonIcon--text euiButtonIcon--empty euiButtonIcon--xSmall euiModal__closeIcon\\" type=\\"button\\" aria-label=\\"Closes this modal window\\"><span data-euiicon-type=\\"cross\\" class=\\"euiButtonIcon__icon\\" aria-hidden=\\"true\\" color=\\"inherit\\"></span></button><div class=\\"euiModal__flex\\"><div class=\\"euiModalBody\\"><div class=\\"euiModalBody__overflow\\"><div class=\\"euiText euiText--medium\\" data-test-subj=\\"confirmModalBodyText\\"><div class=\\"kbnOverlayMountWrapper\\"><span>Modal content</span></div></div></div></div><div class=\\"euiModalFooter\\"><button class=\\"euiButtonEmpty euiButtonEmpty--primary\\" type=\\"button\\" data-test-subj=\\"confirmModalCancelButton\\"><span class=\\"euiButtonContent euiButtonEmpty__content\\"><span class=\\"euiButtonEmpty__text\\">Cancel</span></span></button><button class=\\"euiButton euiButton--primary euiButton--fill\\" type=\\"button\\" data-test-subj=\\"confirmModalConfirmButton\\"><span class=\\"euiButtonContent euiButton__content\\"><span class=\\"euiButton__text\\">Confirm</span></span></button></div></div></div></div>"`;
 
 exports[`ModalService openConfirm() renders a string confirm message 1`] = `
 Array [
@@ -49,7 +49,7 @@ Array [
 ]
 `;
 
-exports[`ModalService openConfirm() renders a string confirm message 2`] = `"<div data-eui=\\"EuiFocusTrap\\"><div class=\\"euiModal euiModal--maxWidth-default euiModal--confirmation\\" tabindex=\\"0\\"><button class=\\"euiButtonIcon euiButtonIcon--text euiButtonIcon--empty euiButtonIcon--xSmall euiModal__closeIcon\\" type=\\"button\\" aria-label=\\"Closes this modal window\\"><span data-euiicon-type=\\"cross\\" class=\\"euiButtonIcon__icon\\" aria-hidden=\\"true\\"></span></button><div class=\\"euiModal__flex\\"><div class=\\"euiModalBody\\"><div class=\\"euiModalBody__overflow\\"><div class=\\"euiText euiText--medium\\" data-test-subj=\\"confirmModalBodyText\\"><p>Some message</p></div></div></div><div class=\\"euiModalFooter\\"><button class=\\"euiButtonEmpty euiButtonEmpty--primary\\" type=\\"button\\" data-test-subj=\\"confirmModalCancelButton\\"><span class=\\"euiButtonContent euiButtonEmpty__content\\"><span class=\\"euiButtonEmpty__text\\">Cancel</span></span></button><button class=\\"euiButton euiButton--primary euiButton--fill\\" type=\\"button\\" data-test-subj=\\"confirmModalConfirmButton\\"><span class=\\"euiButtonContent euiButton__content\\"><span class=\\"euiButton__text\\">Confirm</span></span></button></div></div></div></div>"`;
+exports[`ModalService openConfirm() renders a string confirm message 2`] = `"<div data-eui=\\"EuiFocusTrap\\"><div class=\\"euiModal euiModal--maxWidth-default euiModal--confirmation\\" tabindex=\\"0\\"><button class=\\"euiButtonIcon euiButtonIcon--text euiButtonIcon--empty euiButtonIcon--xSmall euiModal__closeIcon\\" type=\\"button\\" aria-label=\\"Closes this modal window\\"><span data-euiicon-type=\\"cross\\" class=\\"euiButtonIcon__icon\\" aria-hidden=\\"true\\" color=\\"inherit\\"></span></button><div class=\\"euiModal__flex\\"><div class=\\"euiModalBody\\"><div class=\\"euiModalBody__overflow\\"><div class=\\"euiText euiText--medium\\" data-test-subj=\\"confirmModalBodyText\\"><p>Some message</p></div></div></div><div class=\\"euiModalFooter\\"><button class=\\"euiButtonEmpty euiButtonEmpty--primary\\" type=\\"button\\" data-test-subj=\\"confirmModalCancelButton\\"><span class=\\"euiButtonContent euiButtonEmpty__content\\"><span class=\\"euiButtonEmpty__text\\">Cancel</span></span></button><button class=\\"euiButton euiButton--primary euiButton--fill\\" type=\\"button\\" data-test-subj=\\"confirmModalConfirmButton\\"><span class=\\"euiButtonContent euiButton__content\\"><span class=\\"euiButton__text\\">Confirm</span></span></button></div></div></div></div>"`;
 
 exports[`ModalService openConfirm() with a currently active confirm replaces the current confirm with the new one 1`] = `
 Array [
@@ -131,7 +131,7 @@ Array [
 ]
 `;
 
-exports[`ModalService openModal() renders a modal to the DOM 2`] = `"<div data-eui=\\"EuiFocusTrap\\"><div class=\\"euiModal euiModal--maxWidth-default\\" tabindex=\\"0\\"><button class=\\"euiButtonIcon euiButtonIcon--text euiButtonIcon--empty euiButtonIcon--xSmall euiModal__closeIcon\\" type=\\"button\\" aria-label=\\"Closes this modal window\\"><span data-euiicon-type=\\"cross\\" class=\\"euiButtonIcon__icon\\" aria-hidden=\\"true\\"></span></button><div class=\\"euiModal__flex\\"><div class=\\"kbnOverlayMountWrapper\\"><span>Modal content</span></div></div></div></div>"`;
+exports[`ModalService openModal() renders a modal to the DOM 2`] = `"<div data-eui=\\"EuiFocusTrap\\"><div class=\\"euiModal euiModal--maxWidth-default\\" tabindex=\\"0\\"><button class=\\"euiButtonIcon euiButtonIcon--text euiButtonIcon--empty euiButtonIcon--xSmall euiModal__closeIcon\\" type=\\"button\\" aria-label=\\"Closes this modal window\\"><span data-euiicon-type=\\"cross\\" class=\\"euiButtonIcon__icon\\" aria-hidden=\\"true\\" color=\\"inherit\\"></span></button><div class=\\"euiModal__flex\\"><div class=\\"kbnOverlayMountWrapper\\"><span>Modal content</span></div></div></div></div>"`;
 
 exports[`ModalService openModal() with a currently active confirm replaces the current confirm with the new one 1`] = `
 Array [
diff --git a/src/plugins/data/public/utils/table_inspector_view/components/__snapshots__/data_view.test.tsx.snap b/src/plugins/data/public/utils/table_inspector_view/components/__snapshots__/data_view.test.tsx.snap
index 9896a6dbdc7b7..a0a7e54d27532 100644
--- a/src/plugins/data/public/utils/table_inspector_view/components/__snapshots__/data_view.test.tsx.snap
+++ b/src/plugins/data/public/utils/table_inspector_view/components/__snapshots__/data_view.test.tsx.snap
@@ -718,11 +718,13 @@ exports[`Inspector Data View component should render single table without select
                             >
                               <EuiIcon
                                 className="euiButtonContent__icon"
+                                color="inherit"
                                 size="m"
                                 type="arrowDown"
                               >
                                 <span
                                   className="euiButtonContent__icon"
+                                  color="inherit"
                                   data-euiicon-type="arrowDown"
                                   size="m"
                                 />
@@ -996,6 +998,7 @@ exports[`Inspector Data View component should render single table without select
                                         <EuiButtonContent
                                           className="euiButtonEmpty__content"
                                           iconSide="right"
+                                          iconSize="s"
                                           iconType="arrowDown"
                                           textProps={
                                             Object {
@@ -1008,13 +1011,15 @@ exports[`Inspector Data View component should render single table without select
                                           >
                                             <EuiIcon
                                               className="euiButtonContent__icon"
-                                              size="m"
+                                              color="inherit"
+                                              size="s"
                                               type="arrowDown"
                                             >
                                               <span
                                                 className="euiButtonContent__icon"
+                                                color="inherit"
                                                 data-euiicon-type="arrowDown"
-                                                size="m"
+                                                size="s"
                                               />
                                             </EuiIcon>
                                             <span
@@ -1066,7 +1071,6 @@ exports[`Inspector Data View component should render single table without select
                       <tr>
                         <EuiTableHeaderCell
                           align="left"
-                          allowNeutralSort={true}
                           data-test-subj="tableHeaderCell_1_0"
                           isSorted={false}
                           key="_data_h_1_0"
@@ -1091,40 +1095,34 @@ exports[`Inspector Data View component should render single table without select
                               onClick={[Function]}
                               type="button"
                             >
-                              <span
+                              <CellContents
                                 className="euiTableCellContent"
+                                isSorted={false}
+                                showSortMsg={true}
                               >
-                                <EuiInnerText>
-                                  <EuiI18n
-                                    default="{innerText}; Sorted in {ariaSortValue} order"
-                                    token="euiTableHeaderCell.titleTextWithSort"
-                                    values={
-                                      Object {
-                                        "ariaSortValue": "none",
-                                        "innerText": undefined,
-                                      }
-                                    }
-                                  >
-                                    <span
-                                      className="euiTableCellContent__text"
-                                    >
-                                      column1
-                                    </span>
-                                  </EuiI18n>
-                                </EuiInnerText>
-                              </span>
-                              <EuiScreenReaderOnly>
                                 <span
-                                  className="euiScreenReaderOnly"
+                                  className="euiTableCellContent"
                                 >
-                                  <EuiI18n
-                                    default="Click to sort in ascending order"
-                                    token="euiTableHeaderCell.clickForAscending"
-                                  >
-                                    Click to sort in ascending order
-                                  </EuiI18n>
+                                  <EuiInnerText>
+                                    <EuiI18n
+                                      default="{innerText}; {description}"
+                                      token="euiTableHeaderCell.titleTextWithDesc"
+                                      values={
+                                        Object {
+                                          "description": undefined,
+                                          "innerText": undefined,
+                                        }
+                                      }
+                                    >
+                                      <span
+                                        className="euiTableCellContent__text"
+                                      >
+                                        column1
+                                      </span>
+                                    </EuiI18n>
+                                  </EuiInnerText>
                                 </span>
-                              </EuiScreenReaderOnly>
+                              </CellContents>
                             </button>
                           </th>
                         </EuiTableHeaderCell>
@@ -1322,6 +1320,7 @@ exports[`Inspector Data View component should render single table without select
                                     <EuiButtonContent
                                       className="euiButtonEmpty__content"
                                       iconSide="right"
+                                      iconSize="s"
                                       iconType="arrowDown"
                                       textProps={
                                         Object {
@@ -1334,13 +1333,15 @@ exports[`Inspector Data View component should render single table without select
                                       >
                                         <EuiIcon
                                           className="euiButtonContent__icon"
-                                          size="m"
+                                          color="inherit"
+                                          size="s"
                                           type="arrowDown"
                                         >
                                           <span
                                             className="euiButtonContent__icon"
+                                            color="inherit"
                                             data-euiicon-type="arrowDown"
-                                            size="m"
+                                            size="s"
                                           />
                                         </EuiIcon>
                                         <span
@@ -1411,12 +1412,14 @@ exports[`Inspector Data View component should render single table without select
                                       <EuiIcon
                                         aria-hidden="true"
                                         className="euiButtonIcon__icon"
+                                        color="inherit"
                                         size="m"
                                         type="arrowLeft"
                                       >
                                         <span
                                           aria-hidden="true"
                                           className="euiButtonIcon__icon"
+                                          color="inherit"
                                           data-euiicon-type="arrowLeft"
                                           size="m"
                                         />
@@ -1487,6 +1490,7 @@ exports[`Inspector Data View component should render single table without select
                                               <EuiButtonContent
                                                 className="euiButtonEmpty__content"
                                                 iconSide="left"
+                                                iconSize="m"
                                                 textProps={
                                                   Object {
                                                     "className": "euiButtonEmpty__text",
@@ -1543,12 +1547,14 @@ exports[`Inspector Data View component should render single table without select
                                       <EuiIcon
                                         aria-hidden="true"
                                         className="euiButtonIcon__icon"
+                                        color="inherit"
                                         size="m"
                                         type="arrowRight"
                                       >
                                         <span
                                           aria-hidden="true"
                                           className="euiButtonIcon__icon"
+                                          color="inherit"
                                           data-euiicon-type="arrowRight"
                                           size="m"
                                         />
@@ -2038,6 +2044,7 @@ exports[`Inspector Data View component should support multiple datatables 1`] =
                                 <EuiButtonContent
                                   className="euiButtonEmpty__content"
                                   iconSide="right"
+                                  iconSize="m"
                                   iconType="arrowDown"
                                   textProps={
                                     Object {
@@ -2050,11 +2057,13 @@ exports[`Inspector Data View component should support multiple datatables 1`] =
                                   >
                                     <EuiIcon
                                       className="euiButtonContent__icon"
+                                      color="inherit"
                                       size="m"
                                       type="arrowDown"
                                     >
                                       <span
                                         className="euiButtonContent__icon"
+                                        color="inherit"
                                         data-euiicon-type="arrowDown"
                                         size="m"
                                       />
@@ -2247,11 +2256,13 @@ exports[`Inspector Data View component should support multiple datatables 1`] =
                             >
                               <EuiIcon
                                 className="euiButtonContent__icon"
+                                color="inherit"
                                 size="m"
                                 type="arrowDown"
                               >
                                 <span
                                   className="euiButtonContent__icon"
+                                  color="inherit"
                                   data-euiicon-type="arrowDown"
                                   size="m"
                                 />
@@ -2549,6 +2560,7 @@ exports[`Inspector Data View component should support multiple datatables 1`] =
                                         <EuiButtonContent
                                           className="euiButtonEmpty__content"
                                           iconSide="right"
+                                          iconSize="s"
                                           iconType="arrowDown"
                                           textProps={
                                             Object {
@@ -2561,13 +2573,15 @@ exports[`Inspector Data View component should support multiple datatables 1`] =
                                           >
                                             <EuiIcon
                                               className="euiButtonContent__icon"
-                                              size="m"
+                                              color="inherit"
+                                              size="s"
                                               type="arrowDown"
                                             >
                                               <span
                                                 className="euiButtonContent__icon"
+                                                color="inherit"
                                                 data-euiicon-type="arrowDown"
-                                                size="m"
+                                                size="s"
                                               />
                                             </EuiIcon>
                                             <span
@@ -2619,7 +2633,6 @@ exports[`Inspector Data View component should support multiple datatables 1`] =
                       <tr>
                         <EuiTableHeaderCell
                           align="left"
-                          allowNeutralSort={true}
                           data-test-subj="tableHeaderCell_1_0"
                           isSorted={false}
                           key="_data_h_1_0"
@@ -2644,41 +2657,35 @@ exports[`Inspector Data View component should support multiple datatables 1`] =
                               onClick={[Function]}
                               type="button"
                             >
-                              <span
+                              <CellContents
                                 className="euiTableCellContent"
+                                isSorted={false}
+                                showSortMsg={true}
                               >
-                                <EuiInnerText>
-                                  <EuiI18n
-                                    default="{innerText}; Sorted in {ariaSortValue} order"
-                                    token="euiTableHeaderCell.titleTextWithSort"
-                                    values={
-                                      Object {
-                                        "ariaSortValue": "none",
-                                        "innerText": "column1",
-                                      }
-                                    }
-                                  >
-                                    <span
-                                      className="euiTableCellContent__text"
-                                      title="column1"
-                                    >
-                                      column1
-                                    </span>
-                                  </EuiI18n>
-                                </EuiInnerText>
-                              </span>
-                              <EuiScreenReaderOnly>
                                 <span
-                                  className="euiScreenReaderOnly"
+                                  className="euiTableCellContent"
                                 >
-                                  <EuiI18n
-                                    default="Click to sort in ascending order"
-                                    token="euiTableHeaderCell.clickForAscending"
-                                  >
-                                    Click to sort in ascending order
-                                  </EuiI18n>
+                                  <EuiInnerText>
+                                    <EuiI18n
+                                      default="{innerText}; {description}"
+                                      token="euiTableHeaderCell.titleTextWithDesc"
+                                      values={
+                                        Object {
+                                          "description": undefined,
+                                          "innerText": "column1",
+                                        }
+                                      }
+                                    >
+                                      <span
+                                        className="euiTableCellContent__text"
+                                        title="column1"
+                                      >
+                                        column1
+                                      </span>
+                                    </EuiI18n>
+                                  </EuiInnerText>
                                 </span>
-                              </EuiScreenReaderOnly>
+                              </CellContents>
                             </button>
                           </th>
                         </EuiTableHeaderCell>
@@ -2876,6 +2883,7 @@ exports[`Inspector Data View component should support multiple datatables 1`] =
                                     <EuiButtonContent
                                       className="euiButtonEmpty__content"
                                       iconSide="right"
+                                      iconSize="s"
                                       iconType="arrowDown"
                                       textProps={
                                         Object {
@@ -2888,13 +2896,15 @@ exports[`Inspector Data View component should support multiple datatables 1`] =
                                       >
                                         <EuiIcon
                                           className="euiButtonContent__icon"
-                                          size="m"
+                                          color="inherit"
+                                          size="s"
                                           type="arrowDown"
                                         >
                                           <span
                                             className="euiButtonContent__icon"
+                                            color="inherit"
                                             data-euiicon-type="arrowDown"
-                                            size="m"
+                                            size="s"
                                           />
                                         </EuiIcon>
                                         <span
@@ -2965,12 +2975,14 @@ exports[`Inspector Data View component should support multiple datatables 1`] =
                                       <EuiIcon
                                         aria-hidden="true"
                                         className="euiButtonIcon__icon"
+                                        color="inherit"
                                         size="m"
                                         type="arrowLeft"
                                       >
                                         <span
                                           aria-hidden="true"
                                           className="euiButtonIcon__icon"
+                                          color="inherit"
                                           data-euiicon-type="arrowLeft"
                                           size="m"
                                         />
@@ -3041,6 +3053,7 @@ exports[`Inspector Data View component should support multiple datatables 1`] =
                                               <EuiButtonContent
                                                 className="euiButtonEmpty__content"
                                                 iconSide="left"
+                                                iconSize="m"
                                                 textProps={
                                                   Object {
                                                     "className": "euiButtonEmpty__text",
@@ -3097,12 +3110,14 @@ exports[`Inspector Data View component should support multiple datatables 1`] =
                                       <EuiIcon
                                         aria-hidden="true"
                                         className="euiButtonIcon__icon"
+                                        color="inherit"
                                         size="m"
                                         type="arrowRight"
                                       >
                                         <span
                                           aria-hidden="true"
                                           className="euiButtonIcon__icon"
+                                          color="inherit"
                                           data-euiicon-type="arrowRight"
                                           size="m"
                                         />
diff --git a/src/plugins/discover/public/application/components/sidebar/__snapshots__/discover_index_pattern_management.test.tsx.snap b/src/plugins/discover/public/application/components/sidebar/__snapshots__/discover_index_pattern_management.test.tsx.snap
index f94a73ae05a55..913ecda69f663 100644
--- a/src/plugins/discover/public/application/components/sidebar/__snapshots__/discover_index_pattern_management.test.tsx.snap
+++ b/src/plugins/discover/public/application/components/sidebar/__snapshots__/discover_index_pattern_management.test.tsx.snap
@@ -697,12 +697,14 @@ exports[`Discover IndexPattern Management renders correctly 1`] = `
             <EuiIcon
               aria-hidden="true"
               className="euiButtonIcon__icon"
+              color="inherit"
               size="m"
               type="boxesHorizontal"
             >
               <span
                 aria-hidden="true"
                 className="euiButtonIcon__icon"
+                color="inherit"
                 data-euiicon-type="boxesHorizontal"
                 size="m"
               />
diff --git a/src/plugins/home/public/application/components/tutorial/instruction.js b/src/plugins/home/public/application/components/tutorial/instruction.js
index 5f1a81efba7f7..42c22b057b1e2 100644
--- a/src/plugins/home/public/application/components/tutorial/instruction.js
+++ b/src/plugins/home/public/application/components/tutorial/instruction.js
@@ -60,7 +60,7 @@ export function Instruction({ commands, paramValues, textPost, textPre, replaceT
     commandBlock = (
       <div>
         <EuiSpacer size="m" />
-        <EuiCodeBlock language="sh">{cmdText}</EuiCodeBlock>
+        <EuiCodeBlock language="bash">{cmdText}</EuiCodeBlock>
       </div>
     );
   }
diff --git a/src/plugins/index_pattern_field_editor/public/components/field_format_editor/editors/url/__snapshots__/url.test.tsx.snap b/src/plugins/index_pattern_field_editor/public/components/field_format_editor/editors/url/__snapshots__/url.test.tsx.snap
index bc5efb8f5eda4..40170c39942e5 100644
--- a/src/plugins/index_pattern_field_editor/public/components/field_format_editor/editors/url/__snapshots__/url.test.tsx.snap
+++ b/src/plugins/index_pattern_field_editor/public/components/field_format_editor/editors/url/__snapshots__/url.test.tsx.snap
@@ -306,7 +306,7 @@ exports[`UrlFormatEditor should render normally 1`] = `
                   role="columnheader"
                   scope="col"
                 >
-                  <div
+                  <span
                     class="euiTableCellContent"
                   >
                     <span
@@ -315,7 +315,7 @@ exports[`UrlFormatEditor should render normally 1`] = `
                     >
                       Input
                     </span>
-                  </div>
+                  </span>
                 </th>
                 <th
                   class="euiTableHeaderCell"
@@ -323,7 +323,7 @@ exports[`UrlFormatEditor should render normally 1`] = `
                   role="columnheader"
                   scope="col"
                 >
-                  <div
+                  <span
                     class="euiTableCellContent"
                   >
                     <span
@@ -332,7 +332,7 @@ exports[`UrlFormatEditor should render normally 1`] = `
                     >
                       Output
                     </span>
-                  </div>
+                  </span>
                 </th>
               </tr>
             </thead>
diff --git a/src/plugins/index_pattern_management/public/components/field_editor/components/scripting_call_outs/__snapshots__/warning_call_out.test.tsx.snap b/src/plugins/index_pattern_management/public/components/field_editor/components/scripting_call_outs/__snapshots__/warning_call_out.test.tsx.snap
index 31c01b1c45e25..e74bb671e7f4e 100644
--- a/src/plugins/index_pattern_management/public/components/field_editor/components/scripting_call_outs/__snapshots__/warning_call_out.test.tsx.snap
+++ b/src/plugins/index_pattern_management/public/components/field_editor/components/scripting_call_outs/__snapshots__/warning_call_out.test.tsx.snap
@@ -112,12 +112,14 @@ exports[`ScriptingWarningCallOut should render normally 1`] = `
         <EuiIcon
           aria-hidden="true"
           className="euiCallOutHeader__icon"
+          color="inherit"
           size="m"
           type="alert"
         >
           <span
             aria-hidden="true"
             className="euiCallOutHeader__icon"
+            color="inherit"
             data-euiicon-type="alert"
             size="m"
           />
diff --git a/src/plugins/inspector/public/ui/__snapshots__/inspector_panel.test.tsx.snap b/src/plugins/inspector/public/ui/__snapshots__/inspector_panel.test.tsx.snap
index d15afad53f2b6..5ad8205365146 100644
--- a/src/plugins/inspector/public/ui/__snapshots__/inspector_panel.test.tsx.snap
+++ b/src/plugins/inspector/public/ui/__snapshots__/inspector_panel.test.tsx.snap
@@ -268,6 +268,7 @@ exports[`InspectorPanel should render as expected 1`] = `
                             <EuiButtonContent
                               className="euiButtonEmpty__content"
                               iconSide="right"
+                              iconSize="m"
                               iconType="arrowDown"
                               textProps={
                                 Object {
@@ -280,11 +281,13 @@ exports[`InspectorPanel should render as expected 1`] = `
                               >
                                 <EuiIcon
                                   className="euiButtonContent__icon"
+                                  color="inherit"
                                   size="m"
                                   type="arrowDown"
                                 >
                                   <span
                                     className="euiButtonContent__icon"
+                                    color="inherit"
                                     data-euiicon-type="arrowDown"
                                     size="m"
                                   />
diff --git a/src/plugins/saved_objects_management/public/management_section/object_view/components/__snapshots__/header.test.tsx.snap b/src/plugins/saved_objects_management/public/management_section/object_view/components/__snapshots__/header.test.tsx.snap
index ecda9b438eae2..81e74038af079 100644
--- a/src/plugins/saved_objects_management/public/management_section/object_view/components/__snapshots__/header.test.tsx.snap
+++ b/src/plugins/saved_objects_management/public/management_section/object_view/components/__snapshots__/header.test.tsx.snap
@@ -95,11 +95,13 @@ exports[`Intro component renders correctly 1`] = `
                           >
                             <EuiIcon
                               className="euiButtonContent__icon"
+                              color="inherit"
                               size="m"
                               type="eye"
                             >
                               <span
                                 className="euiButtonContent__icon"
+                                color="inherit"
                                 data-euiicon-type="eye"
                                 size="m"
                               />
@@ -178,11 +180,13 @@ exports[`Intro component renders correctly 1`] = `
                           >
                             <EuiIcon
                               className="euiButtonContent__icon"
+                              color="inherit"
                               size="m"
                               type="trash"
                             >
                               <span
                                 className="euiButtonContent__icon"
+                                color="inherit"
                                 data-euiicon-type="trash"
                                 size="m"
                               />
diff --git a/src/plugins/saved_objects_management/public/management_section/object_view/components/__snapshots__/intro.test.tsx.snap b/src/plugins/saved_objects_management/public/management_section/object_view/components/__snapshots__/intro.test.tsx.snap
index 1877769d94af2..5239a92543539 100644
--- a/src/plugins/saved_objects_management/public/management_section/object_view/components/__snapshots__/intro.test.tsx.snap
+++ b/src/plugins/saved_objects_management/public/management_section/object_view/components/__snapshots__/intro.test.tsx.snap
@@ -22,12 +22,14 @@ exports[`Intro component renders correctly 1`] = `
         <EuiIcon
           aria-hidden="true"
           className="euiCallOutHeader__icon"
+          color="inherit"
           size="m"
           type="alert"
         >
           <span
             aria-hidden="true"
             className="euiCallOutHeader__icon"
+            color="inherit"
             data-euiicon-type="alert"
             size="m"
           />
diff --git a/src/plugins/saved_objects_management/public/management_section/object_view/components/__snapshots__/not_found_errors.test.tsx.snap b/src/plugins/saved_objects_management/public/management_section/object_view/components/__snapshots__/not_found_errors.test.tsx.snap
index 9e738296277cc..bddfe000008d4 100644
--- a/src/plugins/saved_objects_management/public/management_section/object_view/components/__snapshots__/not_found_errors.test.tsx.snap
+++ b/src/plugins/saved_objects_management/public/management_section/object_view/components/__snapshots__/not_found_errors.test.tsx.snap
@@ -24,12 +24,14 @@ exports[`NotFoundErrors component renders correctly for index-pattern type 1`] =
         <EuiIcon
           aria-hidden="true"
           className="euiCallOutHeader__icon"
+          color="inherit"
           size="m"
           type="alert"
         >
           <span
             aria-hidden="true"
             className="euiCallOutHeader__icon"
+            color="inherit"
             data-euiicon-type="alert"
             size="m"
           />
@@ -101,12 +103,14 @@ exports[`NotFoundErrors component renders correctly for index-pattern-field type
         <EuiIcon
           aria-hidden="true"
           className="euiCallOutHeader__icon"
+          color="inherit"
           size="m"
           type="alert"
         >
           <span
             aria-hidden="true"
             className="euiCallOutHeader__icon"
+            color="inherit"
             data-euiicon-type="alert"
             size="m"
           />
@@ -178,12 +182,14 @@ exports[`NotFoundErrors component renders correctly for search type 1`] = `
         <EuiIcon
           aria-hidden="true"
           className="euiCallOutHeader__icon"
+          color="inherit"
           size="m"
           type="alert"
         >
           <span
             aria-hidden="true"
             className="euiCallOutHeader__icon"
+            color="inherit"
             data-euiicon-type="alert"
             size="m"
           />
@@ -255,12 +261,14 @@ exports[`NotFoundErrors component renders correctly for unknown type 1`] = `
         <EuiIcon
           aria-hidden="true"
           className="euiCallOutHeader__icon"
+          color="inherit"
           size="m"
           type="alert"
         >
           <span
             aria-hidden="true"
             className="euiCallOutHeader__icon"
+            color="inherit"
             data-euiicon-type="alert"
             size="m"
           />
diff --git a/src/plugins/vis_type_vega/public/components/vega_vis_component.tsx b/src/plugins/vis_type_vega/public/components/vega_vis_component.tsx
index 9fc22f7bc2ef3..c9d89abcf265c 100644
--- a/src/plugins/vis_type_vega/public/components/vega_vis_component.tsx
+++ b/src/plugins/vis_type_vega/public/components/vega_vis_component.tsx
@@ -6,7 +6,7 @@
  * Side Public License, v 1.
  */
 
-import React, { useEffect, useMemo, useRef } from 'react';
+import React, { useEffect, useCallback, useRef } from 'react';
 import { EuiResizeObserver } from '@elastic/eui';
 import { throttle } from 'lodash';
 
@@ -48,7 +48,7 @@ const VegaVisComponent = ({ visData, fireEvent, renderComplete, deps }: VegaVisC
     }
   }, [visData, renderComplete]);
 
-  const updateChartSize = useMemo(
+  const updateChartSize = useCallback(
     () =>
       throttle(() => {
         if (visController.current) {
diff --git a/test/functional/services/data_grid.ts b/test/functional/services/data_grid.ts
index f66b0fe5b9e79..f2079c02ef5b5 100644
--- a/test/functional/services/data_grid.ts
+++ b/test/functional/services/data_grid.ts
@@ -200,7 +200,7 @@ export class DataGridService extends FtrService {
     });
   }
 
-  public async clickDocSortAsc(field?: string, sortText = 'Sort New-Old') {
+  public async clickDocSortAsc(field?: string, sortText = 'Sort Old-New') {
     if (field) {
       await this.openColMenuByField(field);
     } else {
@@ -209,7 +209,7 @@ export class DataGridService extends FtrService {
     await this.find.clickByButtonText(sortText);
   }
 
-  public async clickDocSortDesc(field?: string, sortText = 'Sort Old-New') {
+  public async clickDocSortDesc(field?: string, sortText = 'Sort New-Old') {
     if (field) {
       await this.openColMenuByField(field);
     } else {
diff --git a/test/tsconfig.json b/test/tsconfig.json
index c68e15b2419a1..86b97da699ae1 100644
--- a/test/tsconfig.json
+++ b/test/tsconfig.json
@@ -2,7 +2,7 @@
   "extends": "../tsconfig.base.json",
   "compilerOptions": {
     "incremental": false,
-    "types": ["node"]
+    "types": ["node", "resize-observer-polyfill"]
   },
   "include": [
     "**/*",
diff --git a/tsconfig.base.json b/tsconfig.base.json
index da4de5ef3712b..eca78e492ff5e 100644
--- a/tsconfig.base.json
+++ b/tsconfig.base.json
@@ -54,7 +54,8 @@
       "jest",
       "flot",
       "jest-styled-components",
-      "@testing-library/jest-dom"
+      "@testing-library/jest-dom",
+      "resize-observer-polyfill"
     ]
   }
 }
diff --git a/x-pack/plugins/apm/public/components/app/error_group_overview/List/__snapshots__/List.test.tsx.snap b/x-pack/plugins/apm/public/components/app/error_group_overview/List/__snapshots__/List.test.tsx.snap
index 58d5287e084ca..92337a97573e4 100644
--- a/x-pack/plugins/apm/public/components/app/error_group_overview/List/__snapshots__/List.test.tsx.snap
+++ b/x-pack/plugins/apm/public/components/app/error_group_overview/List/__snapshots__/List.test.tsx.snap
@@ -37,8 +37,9 @@ exports[`ErrorGroupOverview -> List should render empty state 1`] = `
                   >
                     <span
                       className="euiButtonContent__icon"
+                      color="inherit"
                       data-euiicon-type="arrowDown"
-                      size="m"
+                      size="s"
                     />
                     <span
                       className="euiButtonEmpty__text"
@@ -74,7 +75,7 @@ exports[`ErrorGroupOverview -> List should render empty state 1`] = `
               }
             }
           >
-            <div
+            <span
               className="euiTableCellContent"
             >
               <span
@@ -101,7 +102,7 @@ exports[`ErrorGroupOverview -> List should render empty state 1`] = `
                   />
                 </span>
               </span>
-            </div>
+            </span>
           </th>
           <th
             className="euiTableHeaderCell"
@@ -114,7 +115,7 @@ exports[`ErrorGroupOverview -> List should render empty state 1`] = `
               }
             }
           >
-            <div
+            <span
               className="euiTableCellContent"
             >
               <span
@@ -123,7 +124,7 @@ exports[`ErrorGroupOverview -> List should render empty state 1`] = `
               >
                 Type
               </span>
-            </div>
+            </span>
           </th>
           <th
             className="euiTableHeaderCell"
@@ -136,7 +137,7 @@ exports[`ErrorGroupOverview -> List should render empty state 1`] = `
               }
             }
           >
-            <div
+            <span
               className="euiTableCellContent"
             >
               <span
@@ -145,7 +146,7 @@ exports[`ErrorGroupOverview -> List should render empty state 1`] = `
               >
                 Error message and culprit
               </span>
-            </div>
+            </span>
           </th>
           <td
             className="euiTableHeaderCell"
@@ -158,13 +159,13 @@ exports[`ErrorGroupOverview -> List should render empty state 1`] = `
               }
             }
           >
-            <div
+            <span
               className="euiTableCellContent euiTableCellContent--alignRight"
             >
               <span
                 className="euiTableCellContent__text"
               />
-            </div>
+            </span>
           </td>
           <th
             aria-live="polite"
@@ -190,7 +191,7 @@ exports[`ErrorGroupOverview -> List should render empty state 1`] = `
               >
                 <span
                   className="euiTableCellContent__text"
-                  title="Occurrences; Sorted in descending order"
+                  title="Occurrences"
                 >
                   Occurrences
                 </span>
@@ -200,11 +201,6 @@ exports[`ErrorGroupOverview -> List should render empty state 1`] = `
                   size="m"
                 />
               </span>
-              <span
-                className="euiScreenReaderOnly"
-              >
-                Click to sort in ascending order
-              </span>
             </button>
           </th>
           <th
@@ -236,11 +232,6 @@ exports[`ErrorGroupOverview -> List should render empty state 1`] = `
                   Latest occurrence
                 </span>
               </span>
-              <span
-                className="euiScreenReaderOnly"
-              >
-                Click to sort in ascending order
-              </span>
             </button>
           </th>
         </tr>
@@ -343,8 +334,9 @@ exports[`ErrorGroupOverview -> List should render with data 1`] = `
                   >
                     <span
                       className="euiButtonContent__icon"
+                      color="inherit"
                       data-euiicon-type="arrowDown"
-                      size="m"
+                      size="s"
                     />
                     <span
                       className="euiButtonEmpty__text"
@@ -380,7 +372,7 @@ exports[`ErrorGroupOverview -> List should render with data 1`] = `
               }
             }
           >
-            <div
+            <span
               className="euiTableCellContent"
             >
               <span
@@ -407,7 +399,7 @@ exports[`ErrorGroupOverview -> List should render with data 1`] = `
                   />
                 </span>
               </span>
-            </div>
+            </span>
           </th>
           <th
             className="euiTableHeaderCell"
@@ -420,7 +412,7 @@ exports[`ErrorGroupOverview -> List should render with data 1`] = `
               }
             }
           >
-            <div
+            <span
               className="euiTableCellContent"
             >
               <span
@@ -429,7 +421,7 @@ exports[`ErrorGroupOverview -> List should render with data 1`] = `
               >
                 Type
               </span>
-            </div>
+            </span>
           </th>
           <th
             className="euiTableHeaderCell"
@@ -442,7 +434,7 @@ exports[`ErrorGroupOverview -> List should render with data 1`] = `
               }
             }
           >
-            <div
+            <span
               className="euiTableCellContent"
             >
               <span
@@ -451,7 +443,7 @@ exports[`ErrorGroupOverview -> List should render with data 1`] = `
               >
                 Error message and culprit
               </span>
-            </div>
+            </span>
           </th>
           <td
             className="euiTableHeaderCell"
@@ -464,13 +456,13 @@ exports[`ErrorGroupOverview -> List should render with data 1`] = `
               }
             }
           >
-            <div
+            <span
               className="euiTableCellContent euiTableCellContent--alignRight"
             >
               <span
                 className="euiTableCellContent__text"
               />
-            </div>
+            </span>
           </td>
           <th
             aria-live="polite"
@@ -496,7 +488,7 @@ exports[`ErrorGroupOverview -> List should render with data 1`] = `
               >
                 <span
                   className="euiTableCellContent__text"
-                  title="Occurrences; Sorted in descending order"
+                  title="Occurrences"
                 >
                   Occurrences
                 </span>
@@ -506,11 +498,6 @@ exports[`ErrorGroupOverview -> List should render with data 1`] = `
                   size="m"
                 />
               </span>
-              <span
-                className="euiScreenReaderOnly"
-              >
-                Click to sort in ascending order
-              </span>
             </button>
           </th>
           <th
@@ -542,11 +529,6 @@ exports[`ErrorGroupOverview -> List should render with data 1`] = `
                   Latest occurrence
                 </span>
               </span>
-              <span
-                className="euiScreenReaderOnly"
-              >
-                Click to sort in ascending order
-              </span>
             </button>
           </th>
         </tr>
@@ -1314,6 +1296,7 @@ exports[`ErrorGroupOverview -> List should render with data 1`] = `
             <span
               aria-hidden="true"
               className="euiButtonIcon__icon"
+              color="inherit"
               data-euiicon-type="arrowLeft"
               size="m"
             />
@@ -1357,6 +1340,7 @@ exports[`ErrorGroupOverview -> List should render with data 1`] = `
             <span
               aria-hidden="true"
               className="euiButtonIcon__icon"
+              color="inherit"
               data-euiicon-type="arrowRight"
               size="m"
             />
diff --git a/x-pack/plugins/apm/public/components/app/service_inventory/ServiceList/service_list.test.tsx b/x-pack/plugins/apm/public/components/app/service_inventory/ServiceList/service_list.test.tsx
index 323138bca139e..e09ddac525db0 100644
--- a/x-pack/plugins/apm/public/components/app/service_inventory/ServiceList/service_list.test.tsx
+++ b/x-pack/plugins/apm/public/components/app/service_inventory/ServiceList/service_list.test.tsx
@@ -82,9 +82,7 @@ describe('ServiceList', () => {
         wrapper: Wrapper,
       });
 
-      expect(
-        await findByTitle('Throughput; Sorted in descending order')
-      ).toBeInTheDocument();
+      expect(await findByTitle('Throughput')).toBeInTheDocument();
     });
   });
 
@@ -100,9 +98,7 @@ describe('ServiceList', () => {
         { wrapper: Wrapper }
       );
 
-      expect(
-        await findByTitle('Health; Sorted in descending order')
-      ).toBeInTheDocument();
+      expect(await findByTitle('Health')).toBeInTheDocument();
     });
   });
 });
diff --git a/x-pack/plugins/apm/public/components/shared/TransactionActionMenu/__snapshots__/TransactionActionMenu.test.tsx.snap b/x-pack/plugins/apm/public/components/shared/TransactionActionMenu/__snapshots__/TransactionActionMenu.test.tsx.snap
index ea33fb3c3df08..220e1155cc4b7 100644
--- a/x-pack/plugins/apm/public/components/shared/TransactionActionMenu/__snapshots__/TransactionActionMenu.test.tsx.snap
+++ b/x-pack/plugins/apm/public/components/shared/TransactionActionMenu/__snapshots__/TransactionActionMenu.test.tsx.snap
@@ -18,6 +18,7 @@ exports[`TransactionActionMenu component matches the snapshot 1`] = `
         >
           <span
             class="euiButtonContent__icon"
+            color="inherit"
             data-euiicon-type="arrowDown"
           />
           <span
diff --git a/x-pack/plugins/canvas/canvas_plugin_src/renderers/filters/time_filter/components/__stories__/__snapshots__/time_filter.stories.storyshot b/x-pack/plugins/canvas/canvas_plugin_src/renderers/filters/time_filter/components/__stories__/__snapshots__/time_filter.stories.storyshot
index 0a6e0ce5f4ae0..422a61d4ef03e 100644
--- a/x-pack/plugins/canvas/canvas_plugin_src/renderers/filters/time_filter/components/__stories__/__snapshots__/time_filter.stories.storyshot
+++ b/x-pack/plugins/canvas/canvas_plugin_src/renderers/filters/time_filter/components/__stories__/__snapshots__/time_filter.stories.storyshot
@@ -39,8 +39,9 @@ exports[`Storyshots renderers/TimeFilter default 1`] = `
                 >
                   <span
                     className="euiButtonContent__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
-                    size="m"
+                    size="s"
                   />
                   <span
                     className="euiButtonEmpty__text euiQuickSelectPopover__buttonText"
@@ -120,8 +121,9 @@ exports[`Storyshots renderers/TimeFilter with absolute time bounds 1`] = `
                 >
                   <span
                     className="euiButtonContent__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
-                    size="m"
+                    size="s"
                   />
                   <span
                     className="euiButtonEmpty__text euiQuickSelectPopover__buttonText"
@@ -231,8 +233,9 @@ exports[`Storyshots renderers/TimeFilter with commonlyUsedRanges 1`] = `
                 >
                   <span
                     className="euiButtonContent__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
-                    size="m"
+                    size="s"
                   />
                   <span
                     className="euiButtonEmpty__text euiQuickSelectPopover__buttonText"
@@ -312,8 +315,9 @@ exports[`Storyshots renderers/TimeFilter with dateFormat 1`] = `
                 >
                   <span
                     className="euiButtonContent__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
-                    size="m"
+                    size="s"
                   />
                   <span
                     className="euiButtonEmpty__text euiQuickSelectPopover__buttonText"
@@ -393,8 +397,9 @@ exports[`Storyshots renderers/TimeFilter with relative time bounds 1`] = `
                 >
                   <span
                     className="euiButtonContent__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
-                    size="m"
+                    size="s"
                   />
                   <span
                     className="euiButtonEmpty__text euiQuickSelectPopover__buttonText"
diff --git a/x-pack/plugins/canvas/public/components/asset_manager/__stories__/__snapshots__/asset.stories.storyshot b/x-pack/plugins/canvas/public/components/asset_manager/__stories__/__snapshots__/asset.stories.storyshot
index 62cdbc8a578e6..138f8a2af68f0 100644
--- a/x-pack/plugins/canvas/public/components/asset_manager/__stories__/__snapshots__/asset.stories.storyshot
+++ b/x-pack/plugins/canvas/public/components/asset_manager/__stories__/__snapshots__/asset.stories.storyshot
@@ -79,6 +79,7 @@ exports[`Storyshots components/Assets/Asset airplane 1`] = `
               <span
                 aria-hidden="true"
                 className="euiButtonIcon__icon"
+                color="inherit"
                 data-euiicon-type="vector"
                 size="m"
               />
@@ -110,6 +111,7 @@ exports[`Storyshots components/Assets/Asset airplane 1`] = `
                 <span
                   aria-hidden="true"
                   className="euiButtonIcon__icon"
+                  color="inherit"
                   data-euiicon-type="sortDown"
                   size="m"
                 />
@@ -142,6 +144,7 @@ exports[`Storyshots components/Assets/Asset airplane 1`] = `
                 <span
                   aria-hidden="true"
                   className="euiButtonIcon__icon"
+                  color="inherit"
                   data-euiicon-type="copyClipboard"
                   size="m"
                 />
@@ -170,6 +173,7 @@ exports[`Storyshots components/Assets/Asset airplane 1`] = `
               <span
                 aria-hidden="true"
                 className="euiButtonIcon__icon"
+                color="inherit"
                 data-euiicon-type="trash"
                 size="m"
               />
@@ -261,6 +265,7 @@ exports[`Storyshots components/Assets/Asset marker 1`] = `
               <span
                 aria-hidden="true"
                 className="euiButtonIcon__icon"
+                color="inherit"
                 data-euiicon-type="vector"
                 size="m"
               />
@@ -292,6 +297,7 @@ exports[`Storyshots components/Assets/Asset marker 1`] = `
                 <span
                   aria-hidden="true"
                   className="euiButtonIcon__icon"
+                  color="inherit"
                   data-euiicon-type="sortDown"
                   size="m"
                 />
@@ -324,6 +330,7 @@ exports[`Storyshots components/Assets/Asset marker 1`] = `
                 <span
                   aria-hidden="true"
                   className="euiButtonIcon__icon"
+                  color="inherit"
                   data-euiicon-type="copyClipboard"
                   size="m"
                 />
@@ -352,6 +359,7 @@ exports[`Storyshots components/Assets/Asset marker 1`] = `
               <span
                 aria-hidden="true"
                 className="euiButtonIcon__icon"
+                color="inherit"
                 data-euiicon-type="trash"
                 size="m"
               />
diff --git a/x-pack/plugins/canvas/public/components/asset_manager/__stories__/__snapshots__/asset_manager.stories.storyshot b/x-pack/plugins/canvas/public/components/asset_manager/__stories__/__snapshots__/asset_manager.stories.storyshot
index 91c7fe3dbe04b..34b6b333f3ef5 100644
--- a/x-pack/plugins/canvas/public/components/asset_manager/__stories__/__snapshots__/asset_manager.stories.storyshot
+++ b/x-pack/plugins/canvas/public/components/asset_manager/__stories__/__snapshots__/asset_manager.stories.storyshot
@@ -24,6 +24,7 @@ exports[`Storyshots components/Assets/AssetManager no assets 1`] = `
       <span
         aria-hidden="true"
         className="euiButtonIcon__icon"
+        color="inherit"
         data-euiicon-type="cross"
         size="m"
       />
@@ -213,6 +214,7 @@ exports[`Storyshots components/Assets/AssetManager two assets 1`] = `
       <span
         aria-hidden="true"
         className="euiButtonIcon__icon"
+        color="inherit"
         data-euiicon-type="cross"
         size="m"
       />
@@ -366,6 +368,7 @@ exports[`Storyshots components/Assets/AssetManager two assets 1`] = `
                         <span
                           aria-hidden="true"
                           className="euiButtonIcon__icon"
+                          color="inherit"
                           data-euiicon-type="vector"
                           size="m"
                         />
@@ -397,6 +400,7 @@ exports[`Storyshots components/Assets/AssetManager two assets 1`] = `
                           <span
                             aria-hidden="true"
                             className="euiButtonIcon__icon"
+                            color="inherit"
                             data-euiicon-type="sortDown"
                             size="m"
                           />
@@ -429,6 +433,7 @@ exports[`Storyshots components/Assets/AssetManager two assets 1`] = `
                           <span
                             aria-hidden="true"
                             className="euiButtonIcon__icon"
+                            color="inherit"
                             data-euiicon-type="copyClipboard"
                             size="m"
                           />
@@ -457,6 +462,7 @@ exports[`Storyshots components/Assets/AssetManager two assets 1`] = `
                         <span
                           aria-hidden="true"
                           className="euiButtonIcon__icon"
+                          color="inherit"
                           data-euiicon-type="trash"
                           size="m"
                         />
@@ -537,6 +543,7 @@ exports[`Storyshots components/Assets/AssetManager two assets 1`] = `
                         <span
                           aria-hidden="true"
                           className="euiButtonIcon__icon"
+                          color="inherit"
                           data-euiicon-type="vector"
                           size="m"
                         />
@@ -568,6 +575,7 @@ exports[`Storyshots components/Assets/AssetManager two assets 1`] = `
                           <span
                             aria-hidden="true"
                             className="euiButtonIcon__icon"
+                            color="inherit"
                             data-euiicon-type="sortDown"
                             size="m"
                           />
@@ -600,6 +608,7 @@ exports[`Storyshots components/Assets/AssetManager two assets 1`] = `
                           <span
                             aria-hidden="true"
                             className="euiButtonIcon__icon"
+                            color="inherit"
                             data-euiicon-type="copyClipboard"
                             size="m"
                           />
@@ -628,6 +637,7 @@ exports[`Storyshots components/Assets/AssetManager two assets 1`] = `
                         <span
                           aria-hidden="true"
                           className="euiButtonIcon__icon"
+                          color="inherit"
                           data-euiicon-type="trash"
                           size="m"
                         />
diff --git a/x-pack/plugins/canvas/public/components/color_manager/__stories__/__snapshots__/color_manager.stories.storyshot b/x-pack/plugins/canvas/public/components/color_manager/__stories__/__snapshots__/color_manager.stories.storyshot
index d390615693e13..fd127b589dfe2 100644
--- a/x-pack/plugins/canvas/public/components/color_manager/__stories__/__snapshots__/color_manager.stories.storyshot
+++ b/x-pack/plugins/canvas/public/components/color_manager/__stories__/__snapshots__/color_manager.stories.storyshot
@@ -391,6 +391,7 @@ exports[`Storyshots components/Color/ColorManager interactive 1`] = `
         <span
           aria-hidden="true"
           className="euiButtonIcon__icon"
+          color="inherit"
           data-euiicon-type="plusInCircle"
           size="m"
         />
@@ -405,6 +406,7 @@ exports[`Storyshots components/Color/ColorManager interactive 1`] = `
         <span
           aria-hidden="true"
           className="euiButtonIcon__icon"
+          color="inherit"
           data-euiicon-type="minusInCircle"
           size="m"
         />
@@ -801,6 +803,7 @@ Array [
         <span
           aria-hidden="true"
           className="euiButtonIcon__icon"
+          color="inherit"
           data-euiicon-type="plusInCircle"
           size="m"
         />
@@ -815,6 +818,7 @@ Array [
         <span
           aria-hidden="true"
           className="euiButtonIcon__icon"
+          color="inherit"
           data-euiicon-type="minusInCircle"
           size="m"
         />
@@ -880,6 +884,7 @@ Array [
         <span
           aria-hidden="true"
           className="euiButtonIcon__icon"
+          color="inherit"
           data-euiicon-type="plusInCircle"
           size="m"
         />
@@ -894,6 +899,7 @@ Array [
         <span
           aria-hidden="true"
           className="euiButtonIcon__icon"
+          color="inherit"
           data-euiicon-type="minusInCircle"
           size="m"
         />
@@ -959,6 +965,7 @@ Array [
         <span
           aria-hidden="true"
           className="euiButtonIcon__icon"
+          color="inherit"
           data-euiicon-type="plusInCircle"
           size="m"
         />
@@ -973,6 +980,7 @@ Array [
         <span
           aria-hidden="true"
           className="euiButtonIcon__icon"
+          color="inherit"
           data-euiicon-type="minusInCircle"
           size="m"
         />
diff --git a/x-pack/plugins/canvas/public/components/color_picker/__stories__/__snapshots__/color_picker.stories.storyshot b/x-pack/plugins/canvas/public/components/color_picker/__stories__/__snapshots__/color_picker.stories.storyshot
index 9402b3ce2f349..3842247a2ce98 100644
--- a/x-pack/plugins/canvas/public/components/color_picker/__stories__/__snapshots__/color_picker.stories.storyshot
+++ b/x-pack/plugins/canvas/public/components/color_picker/__stories__/__snapshots__/color_picker.stories.storyshot
@@ -234,6 +234,7 @@ exports[`Storyshots components/Color/ColorPicker interactive 1`] = `
           <span
             aria-hidden="true"
             className="euiButtonIcon__icon"
+            color="inherit"
             data-euiicon-type="plusInCircle"
             size="m"
           />
@@ -248,6 +249,7 @@ exports[`Storyshots components/Color/ColorPicker interactive 1`] = `
           <span
             aria-hidden="true"
             className="euiButtonIcon__icon"
+            color="inherit"
             data-euiicon-type="minusInCircle"
             size="m"
           />
@@ -521,6 +523,7 @@ exports[`Storyshots components/Color/ColorPicker six colors 1`] = `
         <span
           aria-hidden="true"
           className="euiButtonIcon__icon"
+          color="inherit"
           data-euiicon-type="plusInCircle"
           size="m"
         />
@@ -535,6 +538,7 @@ exports[`Storyshots components/Color/ColorPicker six colors 1`] = `
         <span
           aria-hidden="true"
           className="euiButtonIcon__icon"
+          color="inherit"
           data-euiicon-type="minusInCircle"
           size="m"
         />
@@ -781,6 +785,7 @@ exports[`Storyshots components/Color/ColorPicker six colors, value missing 1`] =
         <span
           aria-hidden="true"
           className="euiButtonIcon__icon"
+          color="inherit"
           data-euiicon-type="plusInCircle"
           size="m"
         />
@@ -795,6 +800,7 @@ exports[`Storyshots components/Color/ColorPicker six colors, value missing 1`] =
         <span
           aria-hidden="true"
           className="euiButtonIcon__icon"
+          color="inherit"
           data-euiicon-type="minusInCircle"
           size="m"
         />
@@ -963,6 +969,7 @@ exports[`Storyshots components/Color/ColorPicker three colors 1`] = `
         <span
           aria-hidden="true"
           className="euiButtonIcon__icon"
+          color="inherit"
           data-euiicon-type="plusInCircle"
           size="m"
         />
@@ -977,6 +984,7 @@ exports[`Storyshots components/Color/ColorPicker three colors 1`] = `
         <span
           aria-hidden="true"
           className="euiButtonIcon__icon"
+          color="inherit"
           data-euiicon-type="minusInCircle"
           size="m"
         />
diff --git a/x-pack/plugins/canvas/public/components/custom_element_modal/__stories__/__snapshots__/custom_element_modal.stories.storyshot b/x-pack/plugins/canvas/public/components/custom_element_modal/__stories__/__snapshots__/custom_element_modal.stories.storyshot
index f59abc4fec6f9..18f86aca24302 100644
--- a/x-pack/plugins/canvas/public/components/custom_element_modal/__stories__/__snapshots__/custom_element_modal.stories.storyshot
+++ b/x-pack/plugins/canvas/public/components/custom_element_modal/__stories__/__snapshots__/custom_element_modal.stories.storyshot
@@ -25,6 +25,7 @@ exports[`Storyshots components/Elements/CustomElementModal with description 1`]
       <span
         aria-hidden="true"
         className="euiButtonIcon__icon"
+        color="inherit"
         data-euiicon-type="cross"
         size="m"
       />
@@ -333,6 +334,7 @@ exports[`Storyshots components/Elements/CustomElementModal with image 1`] = `
       <span
         aria-hidden="true"
         className="euiButtonIcon__icon"
+        color="inherit"
         data-euiicon-type="cross"
         size="m"
       />
@@ -638,6 +640,7 @@ exports[`Storyshots components/Elements/CustomElementModal with name 1`] = `
       <span
         aria-hidden="true"
         className="euiButtonIcon__icon"
+        color="inherit"
         data-euiicon-type="cross"
         size="m"
       />
@@ -938,6 +941,7 @@ exports[`Storyshots components/Elements/CustomElementModal with title 1`] = `
       <span
         aria-hidden="true"
         className="euiButtonIcon__icon"
+        color="inherit"
         data-euiicon-type="cross"
         size="m"
       />
diff --git a/x-pack/plugins/canvas/public/components/datasource/__stories__/__snapshots__/datasource_component.stories.storyshot b/x-pack/plugins/canvas/public/components/datasource/__stories__/__snapshots__/datasource_component.stories.storyshot
index e41e6fa83bfe1..6d170d78dd01d 100644
--- a/x-pack/plugins/canvas/public/components/datasource/__stories__/__snapshots__/datasource_component.stories.storyshot
+++ b/x-pack/plugins/canvas/public/components/datasource/__stories__/__snapshots__/datasource_component.stories.storyshot
@@ -15,6 +15,7 @@ exports[`Storyshots components/datasource/DatasourceComponent datasource with ex
     >
       <span
         className="euiButtonContent__icon"
+        color="inherit"
         data-euiicon-type="arrowRight"
         size="m"
       />
@@ -61,6 +62,7 @@ exports[`Storyshots components/datasource/DatasourceComponent simple datasource
     >
       <span
         className="euiButtonContent__icon"
+        color="inherit"
         data-euiicon-type="arrowRight"
         size="m"
       />
diff --git a/x-pack/plugins/canvas/public/components/keyboard_shortcuts_doc/__stories__/__snapshots__/keyboard_shortcuts_doc.stories.storyshot b/x-pack/plugins/canvas/public/components/keyboard_shortcuts_doc/__stories__/__snapshots__/keyboard_shortcuts_doc.stories.storyshot
index 0dfb322ff7c24..5e833944046a4 100644
--- a/x-pack/plugins/canvas/public/components/keyboard_shortcuts_doc/__stories__/__snapshots__/keyboard_shortcuts_doc.stories.storyshot
+++ b/x-pack/plugins/canvas/public/components/keyboard_shortcuts_doc/__stories__/__snapshots__/keyboard_shortcuts_doc.stories.storyshot
@@ -20,6 +20,7 @@ exports[`Storyshots components/KeyboardShortcutsDoc default 1`] = `
       <span
         aria-hidden="true"
         className="euiButtonIcon__icon"
+        color="inherit"
         data-euiicon-type="cross"
         size="m"
       />
diff --git a/x-pack/plugins/canvas/public/components/saved_elements_modal/__stories__/__snapshots__/element_controls.stories.storyshot b/x-pack/plugins/canvas/public/components/saved_elements_modal/__stories__/__snapshots__/element_controls.stories.storyshot
index 91f13e2584efa..e70905298a58c 100644
--- a/x-pack/plugins/canvas/public/components/saved_elements_modal/__stories__/__snapshots__/element_controls.stories.storyshot
+++ b/x-pack/plugins/canvas/public/components/saved_elements_modal/__stories__/__snapshots__/element_controls.stories.storyshot
@@ -33,6 +33,7 @@ exports[`Storyshots components/SavedElementsModal/ElementControls has two button
           <span
             aria-hidden="true"
             className="euiButtonIcon__icon"
+            color="inherit"
             data-euiicon-type="pencil"
             size="m"
           />
@@ -61,6 +62,7 @@ exports[`Storyshots components/SavedElementsModal/ElementControls has two button
           <span
             aria-hidden="true"
             className="euiButtonIcon__icon"
+            color="inherit"
             data-euiicon-type="trash"
             size="m"
           />
diff --git a/x-pack/plugins/canvas/public/components/saved_elements_modal/__stories__/__snapshots__/element_grid.stories.storyshot b/x-pack/plugins/canvas/public/components/saved_elements_modal/__stories__/__snapshots__/element_grid.stories.storyshot
index a0e12d4338e95..e0ed2934f44b6 100644
--- a/x-pack/plugins/canvas/public/components/saved_elements_modal/__stories__/__snapshots__/element_grid.stories.storyshot
+++ b/x-pack/plugins/canvas/public/components/saved_elements_modal/__stories__/__snapshots__/element_grid.stories.storyshot
@@ -84,6 +84,7 @@ exports[`Storyshots components/SavedElementsModal/ElementGrid default 1`] = `
               <span
                 aria-hidden="true"
                 className="euiButtonIcon__icon"
+                color="inherit"
                 data-euiicon-type="pencil"
                 size="m"
               />
@@ -112,6 +113,7 @@ exports[`Storyshots components/SavedElementsModal/ElementGrid default 1`] = `
               <span
                 aria-hidden="true"
                 className="euiButtonIcon__icon"
+                color="inherit"
                 data-euiicon-type="trash"
                 size="m"
               />
@@ -193,6 +195,7 @@ exports[`Storyshots components/SavedElementsModal/ElementGrid default 1`] = `
               <span
                 aria-hidden="true"
                 className="euiButtonIcon__icon"
+                color="inherit"
                 data-euiicon-type="pencil"
                 size="m"
               />
@@ -221,6 +224,7 @@ exports[`Storyshots components/SavedElementsModal/ElementGrid default 1`] = `
               <span
                 aria-hidden="true"
                 className="euiButtonIcon__icon"
+                color="inherit"
                 data-euiicon-type="trash"
                 size="m"
               />
@@ -302,6 +306,7 @@ exports[`Storyshots components/SavedElementsModal/ElementGrid default 1`] = `
               <span
                 aria-hidden="true"
                 className="euiButtonIcon__icon"
+                color="inherit"
                 data-euiicon-type="pencil"
                 size="m"
               />
@@ -330,6 +335,7 @@ exports[`Storyshots components/SavedElementsModal/ElementGrid default 1`] = `
               <span
                 aria-hidden="true"
                 className="euiButtonIcon__icon"
+                color="inherit"
                 data-euiicon-type="trash"
                 size="m"
               />
diff --git a/x-pack/plugins/canvas/public/components/saved_elements_modal/__stories__/__snapshots__/saved_elements_modal.stories.storyshot b/x-pack/plugins/canvas/public/components/saved_elements_modal/__stories__/__snapshots__/saved_elements_modal.stories.storyshot
index 82806426ff26e..bbf8b5dcca896 100644
--- a/x-pack/plugins/canvas/public/components/saved_elements_modal/__stories__/__snapshots__/saved_elements_modal.stories.storyshot
+++ b/x-pack/plugins/canvas/public/components/saved_elements_modal/__stories__/__snapshots__/saved_elements_modal.stories.storyshot
@@ -24,6 +24,7 @@ exports[`Storyshots components/SavedElementsModal no custom elements 1`] = `
       <span
         aria-hidden="true"
         className="euiButtonIcon__icon"
+        color="inherit"
         data-euiicon-type="cross"
         size="m"
       />
@@ -172,6 +173,7 @@ exports[`Storyshots components/SavedElementsModal with custom elements 1`] = `
       <span
         aria-hidden="true"
         className="euiButtonIcon__icon"
+        color="inherit"
         data-euiicon-type="cross"
         size="m"
       />
@@ -308,6 +310,7 @@ exports[`Storyshots components/SavedElementsModal with custom elements 1`] = `
                       <span
                         aria-hidden="true"
                         className="euiButtonIcon__icon"
+                        color="inherit"
                         data-euiicon-type="pencil"
                         size="m"
                       />
@@ -336,6 +339,7 @@ exports[`Storyshots components/SavedElementsModal with custom elements 1`] = `
                       <span
                         aria-hidden="true"
                         className="euiButtonIcon__icon"
+                        color="inherit"
                         data-euiicon-type="trash"
                         size="m"
                       />
@@ -417,6 +421,7 @@ exports[`Storyshots components/SavedElementsModal with custom elements 1`] = `
                       <span
                         aria-hidden="true"
                         className="euiButtonIcon__icon"
+                        color="inherit"
                         data-euiicon-type="pencil"
                         size="m"
                       />
@@ -445,6 +450,7 @@ exports[`Storyshots components/SavedElementsModal with custom elements 1`] = `
                       <span
                         aria-hidden="true"
                         className="euiButtonIcon__icon"
+                        color="inherit"
                         data-euiicon-type="trash"
                         size="m"
                       />
@@ -526,6 +532,7 @@ exports[`Storyshots components/SavedElementsModal with custom elements 1`] = `
                       <span
                         aria-hidden="true"
                         className="euiButtonIcon__icon"
+                        color="inherit"
                         data-euiicon-type="pencil"
                         size="m"
                       />
@@ -554,6 +561,7 @@ exports[`Storyshots components/SavedElementsModal with custom elements 1`] = `
                       <span
                         aria-hidden="true"
                         className="euiButtonIcon__icon"
+                        color="inherit"
                         data-euiicon-type="trash"
                         size="m"
                       />
@@ -620,6 +628,7 @@ exports[`Storyshots components/SavedElementsModal with text filter 1`] = `
       <span
         aria-hidden="true"
         className="euiButtonIcon__icon"
+        color="inherit"
         data-euiicon-type="cross"
         size="m"
       />
@@ -771,6 +780,7 @@ exports[`Storyshots components/SavedElementsModal with text filter 1`] = `
                       <span
                         aria-hidden="true"
                         className="euiButtonIcon__icon"
+                        color="inherit"
                         data-euiicon-type="pencil"
                         size="m"
                       />
@@ -799,6 +809,7 @@ exports[`Storyshots components/SavedElementsModal with text filter 1`] = `
                       <span
                         aria-hidden="true"
                         className="euiButtonIcon__icon"
+                        color="inherit"
                         data-euiicon-type="trash"
                         size="m"
                       />
diff --git a/x-pack/plugins/canvas/public/components/sidebar_header/__stories__/__snapshots__/sidebar_header.stories.storyshot b/x-pack/plugins/canvas/public/components/sidebar_header/__stories__/__snapshots__/sidebar_header.stories.storyshot
index 47ba90a5118f4..e01f34abeb9f0 100644
--- a/x-pack/plugins/canvas/public/components/sidebar_header/__stories__/__snapshots__/sidebar_header.stories.storyshot
+++ b/x-pack/plugins/canvas/public/components/sidebar_header/__stories__/__snapshots__/sidebar_header.stories.storyshot
@@ -71,6 +71,7 @@ exports[`Storyshots components/Sidebar/SidebarHeader with layer controls 1`] = `
               <span
                 aria-hidden="true"
                 className="euiButtonIcon__icon"
+                color="inherit"
                 data-euiicon-type="sortUp"
                 size="m"
               />
@@ -98,6 +99,7 @@ exports[`Storyshots components/Sidebar/SidebarHeader with layer controls 1`] = `
               <span
                 aria-hidden="true"
                 className="euiButtonIcon__icon"
+                color="inherit"
                 data-euiicon-type="arrowUp"
                 size="m"
               />
@@ -125,6 +127,7 @@ exports[`Storyshots components/Sidebar/SidebarHeader with layer controls 1`] = `
               <span
                 aria-hidden="true"
                 className="euiButtonIcon__icon"
+                color="inherit"
                 data-euiicon-type="arrowDown"
                 size="m"
               />
@@ -152,6 +155,7 @@ exports[`Storyshots components/Sidebar/SidebarHeader with layer controls 1`] = `
               <span
                 aria-hidden="true"
                 className="euiButtonIcon__icon"
+                color="inherit"
                 data-euiicon-type="sortDown"
                 size="m"
               />
diff --git a/x-pack/plugins/canvas/public/components/text_style_picker/__stories__/__snapshots__/text_style_picker.stories.storyshot b/x-pack/plugins/canvas/public/components/text_style_picker/__stories__/__snapshots__/text_style_picker.stories.storyshot
index b61f3f7f5a1e9..1b60db12f0311 100644
--- a/x-pack/plugins/canvas/public/components/text_style_picker/__stories__/__snapshots__/text_style_picker.stories.storyshot
+++ b/x-pack/plugins/canvas/public/components/text_style_picker/__stories__/__snapshots__/text_style_picker.stories.storyshot
@@ -241,6 +241,7 @@ exports[`Storyshots components/TextStylePicker default 1`] = `
               >
                 <span
                   className="euiButtonContent__icon"
+                  color="inherit"
                   data-euiicon-type="editorBold"
                   size="m"
                 />
@@ -270,6 +271,7 @@ exports[`Storyshots components/TextStylePicker default 1`] = `
               >
                 <span
                   className="euiButtonContent__icon"
+                  color="inherit"
                   data-euiicon-type="editorItalic"
                   size="m"
                 />
@@ -299,6 +301,7 @@ exports[`Storyshots components/TextStylePicker default 1`] = `
               >
                 <span
                   className="euiButtonContent__icon"
+                  color="inherit"
                   data-euiicon-type="editorUnderline"
                   size="m"
                 />
@@ -343,6 +346,7 @@ exports[`Storyshots components/TextStylePicker default 1`] = `
               >
                 <span
                   className="euiButtonContent__icon"
+                  color="inherit"
                   data-euiicon-type="editorAlignLeft"
                   size="m"
                 />
@@ -379,6 +383,7 @@ exports[`Storyshots components/TextStylePicker default 1`] = `
               >
                 <span
                   className="euiButtonContent__icon"
+                  color="inherit"
                   data-euiicon-type="editorAlignCenter"
                   size="m"
                 />
@@ -415,6 +420,7 @@ exports[`Storyshots components/TextStylePicker default 1`] = `
               >
                 <span
                   className="euiButtonContent__icon"
+                  color="inherit"
                   data-euiicon-type="editorAlignRight"
                   size="m"
                 />
@@ -684,6 +690,7 @@ exports[`Storyshots components/TextStylePicker interactive 1`] = `
               >
                 <span
                   className="euiButtonContent__icon"
+                  color="inherit"
                   data-euiicon-type="editorBold"
                   size="m"
                 />
@@ -713,6 +720,7 @@ exports[`Storyshots components/TextStylePicker interactive 1`] = `
               >
                 <span
                   className="euiButtonContent__icon"
+                  color="inherit"
                   data-euiicon-type="editorItalic"
                   size="m"
                 />
@@ -742,6 +750,7 @@ exports[`Storyshots components/TextStylePicker interactive 1`] = `
               >
                 <span
                   className="euiButtonContent__icon"
+                  color="inherit"
                   data-euiicon-type="editorUnderline"
                   size="m"
                 />
@@ -786,6 +795,7 @@ exports[`Storyshots components/TextStylePicker interactive 1`] = `
               >
                 <span
                   className="euiButtonContent__icon"
+                  color="inherit"
                   data-euiicon-type="editorAlignLeft"
                   size="m"
                 />
@@ -822,6 +832,7 @@ exports[`Storyshots components/TextStylePicker interactive 1`] = `
               >
                 <span
                   className="euiButtonContent__icon"
+                  color="inherit"
                   data-euiicon-type="editorAlignCenter"
                   size="m"
                 />
@@ -858,6 +869,7 @@ exports[`Storyshots components/TextStylePicker interactive 1`] = `
               >
                 <span
                   className="euiButtonContent__icon"
+                  color="inherit"
                   data-euiicon-type="editorAlignRight"
                   size="m"
                 />
diff --git a/x-pack/plugins/canvas/public/components/toolbar/__stories__/__snapshots__/toolbar.stories.storyshot b/x-pack/plugins/canvas/public/components/toolbar/__stories__/__snapshots__/toolbar.stories.storyshot
index 1ab597ae35ca2..1bb277ac90558 100644
--- a/x-pack/plugins/canvas/public/components/toolbar/__stories__/__snapshots__/toolbar.stories.storyshot
+++ b/x-pack/plugins/canvas/public/components/toolbar/__stories__/__snapshots__/toolbar.stories.storyshot
@@ -24,6 +24,7 @@ exports[`Storyshots components/Toolbar element selected 1`] = `
           >
             <span
               className="euiButtonContent__icon"
+              color="inherit"
               data-euiicon-type="grid"
               size="m"
             />
@@ -51,6 +52,7 @@ exports[`Storyshots components/Toolbar element selected 1`] = `
           <span
             aria-hidden="true"
             className="euiButtonIcon__icon"
+            color="inherit"
             data-euiicon-type="arrowLeft"
             size="m"
           />
@@ -89,6 +91,7 @@ exports[`Storyshots components/Toolbar element selected 1`] = `
           <span
             aria-hidden="true"
             className="euiButtonIcon__icon"
+            color="inherit"
             data-euiicon-type="arrowRight"
             size="m"
           />
@@ -112,6 +115,7 @@ exports[`Storyshots components/Toolbar element selected 1`] = `
           >
             <span
               className="euiButtonContent__icon"
+              color="inherit"
               data-euiicon-type="editorCodeBlock"
               size="m"
             />
@@ -152,6 +156,7 @@ exports[`Storyshots components/Toolbar no element selected 1`] = `
           >
             <span
               className="euiButtonContent__icon"
+              color="inherit"
               data-euiicon-type="grid"
               size="m"
             />
@@ -179,6 +184,7 @@ exports[`Storyshots components/Toolbar no element selected 1`] = `
           <span
             aria-hidden="true"
             className="euiButtonIcon__icon"
+            color="inherit"
             data-euiicon-type="arrowLeft"
             size="m"
           />
@@ -217,6 +223,7 @@ exports[`Storyshots components/Toolbar no element selected 1`] = `
           <span
             aria-hidden="true"
             className="euiButtonIcon__icon"
+            color="inherit"
             data-euiicon-type="arrowRight"
             size="m"
           />
diff --git a/x-pack/plugins/canvas/public/components/var_config/__stories__/__snapshots__/delete_var.stories.storyshot b/x-pack/plugins/canvas/public/components/var_config/__stories__/__snapshots__/delete_var.stories.storyshot
index 6634c0b9feee8..a83682140693d 100644
--- a/x-pack/plugins/canvas/public/components/var_config/__stories__/__snapshots__/delete_var.stories.storyshot
+++ b/x-pack/plugins/canvas/public/components/var_config/__stories__/__snapshots__/delete_var.stories.storyshot
@@ -77,6 +77,7 @@ Array [
             >
               <span
                 className="euiButtonContent__icon"
+                color="inherit"
                 data-euiicon-type="trash"
                 size="m"
               />
diff --git a/x-pack/plugins/canvas/public/components/var_config/__stories__/__snapshots__/edit_var.stories.storyshot b/x-pack/plugins/canvas/public/components/var_config/__stories__/__snapshots__/edit_var.stories.storyshot
index 82f5f8b7e23cd..056b98012f342 100644
--- a/x-pack/plugins/canvas/public/components/var_config/__stories__/__snapshots__/edit_var.stories.storyshot
+++ b/x-pack/plugins/canvas/public/components/var_config/__stories__/__snapshots__/edit_var.stories.storyshot
@@ -44,6 +44,7 @@ Array [
           <span
             aria-hidden="true"
             className="euiCallOutHeader__icon"
+            color="inherit"
             data-euiicon-type="alert"
             size="m"
           />
@@ -250,6 +251,7 @@ Array [
             >
               <span
                 className="euiButtonContent__icon"
+                color="inherit"
                 data-euiicon-type="save"
                 size="m"
               />
@@ -331,6 +333,7 @@ Array [
           <span
             aria-hidden="true"
             className="euiCallOutHeader__icon"
+            color="inherit"
             data-euiicon-type="alert"
             size="m"
           />
@@ -476,6 +479,7 @@ Array [
             >
               <span
                 className="euiButtonContent__icon"
+                color="inherit"
                 data-euiicon-type="save"
                 size="m"
               />
@@ -557,6 +561,7 @@ Array [
           <span
             aria-hidden="true"
             className="euiCallOutHeader__icon"
+            color="inherit"
             data-euiicon-type="alert"
             size="m"
           />
@@ -702,6 +707,7 @@ Array [
             >
               <span
                 className="euiButtonContent__icon"
+                color="inherit"
                 data-euiicon-type="save"
                 size="m"
               />
@@ -904,6 +910,7 @@ Array [
             >
               <span
                 className="euiButtonContent__icon"
+                color="inherit"
                 data-euiicon-type="save"
                 size="m"
               />
diff --git a/x-pack/plugins/canvas/public/components/var_config/__stories__/__snapshots__/var_config.stories.storyshot b/x-pack/plugins/canvas/public/components/var_config/__stories__/__snapshots__/var_config.stories.storyshot
index ca56d812b104d..5d8efeafef69c 100644
--- a/x-pack/plugins/canvas/public/components/var_config/__stories__/__snapshots__/var_config.stories.storyshot
+++ b/x-pack/plugins/canvas/public/components/var_config/__stories__/__snapshots__/var_config.stories.storyshot
@@ -69,6 +69,7 @@ exports[`Storyshots components/Variables/VarConfig default 1`] = `
               <span
                 aria-hidden="true"
                 className="euiButtonIcon__icon"
+                color="inherit"
                 data-euiicon-type="plusInCircle"
                 size="m"
               />
diff --git a/x-pack/plugins/canvas/public/components/workpad_header/element_menu/__stories__/__snapshots__/element_menu.stories.storyshot b/x-pack/plugins/canvas/public/components/workpad_header/element_menu/__stories__/__snapshots__/element_menu.stories.storyshot
index f3a29f6bb1814..371a5133fe88e 100644
--- a/x-pack/plugins/canvas/public/components/workpad_header/element_menu/__stories__/__snapshots__/element_menu.stories.storyshot
+++ b/x-pack/plugins/canvas/public/components/workpad_header/element_menu/__stories__/__snapshots__/element_menu.stories.storyshot
@@ -25,6 +25,7 @@ exports[`Storyshots components/WorkpadHeader/ElementMenu default 1`] = `
       >
         <span
           className="euiButtonContent__icon"
+          color="inherit"
           data-euiicon-type="plusInCircle"
           size="m"
         />
diff --git a/x-pack/plugins/canvas/public/components/workpad_templates/examples/__snapshots__/workpad_templates.stories.storyshot b/x-pack/plugins/canvas/public/components/workpad_templates/examples/__snapshots__/workpad_templates.stories.storyshot
index dbb78a1b99f20..cab6e8fd9b5f5 100644
--- a/x-pack/plugins/canvas/public/components/workpad_templates/examples/__snapshots__/workpad_templates.stories.storyshot
+++ b/x-pack/plugins/canvas/public/components/workpad_templates/examples/__snapshots__/workpad_templates.stories.storyshot
@@ -69,6 +69,7 @@ exports[`Storyshots components/WorkpadTemplates default 1`] = `
               >
                 <span
                   className="euiButtonContent__icon"
+                  color="inherit"
                   data-euiicon-type="arrowDown"
                   size="m"
                 />
@@ -130,8 +131,9 @@ exports[`Storyshots components/WorkpadTemplates default 1`] = `
                     >
                       <span
                         className="euiButtonContent__icon"
+                        color="inherit"
                         data-euiicon-type="arrowDown"
-                        size="m"
+                        size="s"
                       />
                       <span
                         className="euiButtonEmpty__text"
@@ -180,7 +182,6 @@ exports[`Storyshots components/WorkpadTemplates default 1`] = `
                 >
                   <span
                     className="euiTableCellContent__text"
-                    title="; Sorted in ascending order"
                   >
                     Template name
                   </span>
@@ -190,11 +191,6 @@ exports[`Storyshots components/WorkpadTemplates default 1`] = `
                     size="m"
                   />
                 </span>
-                <span
-                  className="euiScreenReaderOnly"
-                >
-                  Click to sort in descending order
-                </span>
               </button>
             </th>
             <th
@@ -208,7 +204,7 @@ exports[`Storyshots components/WorkpadTemplates default 1`] = `
                 }
               }
             >
-              <div
+              <span
                 className="euiTableCellContent"
               >
                 <span
@@ -216,7 +212,7 @@ exports[`Storyshots components/WorkpadTemplates default 1`] = `
                 >
                   Description
                 </span>
-              </div>
+              </span>
             </th>
             <th
               className="euiTableHeaderCell"
@@ -229,7 +225,7 @@ exports[`Storyshots components/WorkpadTemplates default 1`] = `
                 }
               }
             >
-              <div
+              <span
                 className="euiTableCellContent"
               >
                 <span
@@ -237,7 +233,7 @@ exports[`Storyshots components/WorkpadTemplates default 1`] = `
                 >
                   Tags
                 </span>
-              </div>
+              </span>
             </th>
           </tr>
         </thead>
@@ -513,6 +509,7 @@ exports[`Storyshots components/WorkpadTemplates default 1`] = `
           <span
             aria-hidden="true"
             className="euiButtonIcon__icon"
+            color="inherit"
             data-euiicon-type="arrowLeft"
             size="m"
           />
@@ -555,6 +552,7 @@ exports[`Storyshots components/WorkpadTemplates default 1`] = `
           <span
             aria-hidden="true"
             className="euiButtonIcon__icon"
+            color="inherit"
             data-euiicon-type="arrowRight"
             size="m"
           />
diff --git a/x-pack/plugins/canvas/shareable_runtime/api/__snapshots__/shareable.test.tsx.snap b/x-pack/plugins/canvas/shareable_runtime/api/__snapshots__/shareable.test.tsx.snap
index 3bad27aab0cf5..1955af55e9853 100644
--- a/x-pack/plugins/canvas/shareable_runtime/api/__snapshots__/shareable.test.tsx.snap
+++ b/x-pack/plugins/canvas/shareable_runtime/api/__snapshots__/shareable.test.tsx.snap
@@ -9,7 +9,7 @@ exports[`Canvas Shareable Workpad API Placed successfully with default propertie
 </style><div class=\\"content\\"><div class=\\"renderContainer\\"><div data-renderer=\\"markdown\\" class=\\"render\\"><div>markdown mock</div></div></div></div></div></div></div></div></div></div><div class=\\"root\\" style=\\"height: 48px;\\"><div class=\\"root\\"><div class=\\"slideContainer\\"><div class=\\"root\\" style=\\"height: 100px; width: 150px;\\"><div class=\\"preview\\" style=\\"height: 720px; width: 1080px; transform: scale3d(0.1388888888888889, 0.1388888888888889, 1);\\"><div id=\\"page-7186b301-f8a7-4c65-8b89-38d68d31cfc4\\" class=\\"root\\" style=\\"height: 720px; width: 1080px; background: rgb(119, 119, 119);\\"><div class=\\"canvasPositionable canvasInteractable\\" style=\\"width: 1082px; height: 205.37748344370857px; margin-left: -541px; margin-top: -102.68874172185429px; position: absolute; transform: matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,540,367,1,1);\\"><div class=\\"root\\"><div class=\\"container s2042575598\\" style=\\"overflow: hidden;\\"><style type=\\"text/css\\">.s2042575598 .canvasRenderEl h1 {
  font-size: 150px; text-align: center; color: #d3d3d3;
 }
-</style><div class=\\"content\\"><div class=\\"renderContainer\\"><div data-renderer=\\"markdown\\" class=\\"render\\"><div>markdown mock</div></div></div></div></div></div></div></div></div></div></div></div><div class=\\"bar\\" style=\\"bottom: 0px;\\"><div class=\\"euiFlexGroup euiFlexGroup--directionRow euiFlexGroup--responsive\\"><div class=\\"euiFlexItem title\\"><div class=\\"euiFlexGroup euiFlexGroup--gutterSmall euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--responsive\\"><div class=\\"euiFlexItem euiFlexItem--flexGrowZero\\" style=\\"flex-shrink: 0;\\"><a class=\\"euiLink euiLink--primary\\" href=\\"https://www.elastic.co\\" rel=\\"\\" title=\\"Powered by Elastic.co\\"><span data-euiicon-type=\\"logoElastic\\"></span></a></div><div class=\\"euiFlexItem euiFlexItem--flexGrowZero\\" style=\\"min-width: 0; cursor: default;\\"><div class=\\"euiText euiText--small\\"><div class=\\"euiTextColor euiTextColor--ghost\\"><div class=\\"eui-textTruncate\\">My Canvas Workpad</div></div></div></div></div></div><div class=\\"euiFlexItem euiFlexItem--flexGrowZero\\"><div class=\\"euiFlexGroup euiFlexGroup--gutterSmall euiFlexGroup--directionRow euiFlexGroup--responsive\\"><div class=\\"euiFlexGroup euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--responsive\\" style=\\"margin: 0px 12px;\\"><div class=\\"euiFlexItem euiFlexItem--flexGrowZero\\"><button disabled=\\"\\" class=\\"euiButtonIcon euiButtonIcon--ghost euiButtonIcon--empty euiButtonIcon--xSmall\\" type=\\"button\\" data-test-subj=\\"pageControlsPrevPage\\" aria-label=\\"Previous Page\\"><span data-euiicon-type=\\"arrowLeft\\" class=\\"euiButtonIcon__icon\\" aria-hidden=\\"true\\"></span></button></div><div class=\\"euiFlexItem euiFlexItem--flexGrowZero\\"><button class=\\"euiButtonEmpty euiButtonEmpty--ghost euiButtonEmpty--small\\" type=\\"button\\" data-test-subj=\\"pageControlsCurrentPage\\"><span class=\\"euiButtonContent euiButtonEmpty__content\\"><span class=\\"euiButtonEmpty__text\\"><div class=\\"euiText euiText--small\\"><div class=\\"euiTextColor euiTextColor--ghost\\">Page 1</div></div></span></span></button></div><div class=\\"euiFlexItem euiFlexItem--flexGrowZero\\"><button disabled=\\"\\" class=\\"euiButtonIcon euiButtonIcon--ghost euiButtonIcon--empty euiButtonIcon--xSmall\\" type=\\"button\\" data-test-subj=\\"pageControlsNextPage\\" aria-label=\\"Next Page\\"><span data-euiicon-type=\\"arrowRight\\" class=\\"euiButtonIcon__icon\\" aria-hidden=\\"true\\"></span></button></div></div><div class=\\"euiFlexGroup euiFlexGroup--alignItemsFlexEnd euiFlexGroup--justifyContentCenter euiFlexGroup--directionColumn euiFlexGroup--responsive\\"><div class=\\"euiFlexItem euiFlexItem--flexGrowZero\\"><div class=\\"euiPopover euiPopover--anchorUpRight\\" id=\\"settings\\"><div class=\\"euiPopover__anchor\\"><button class=\\"euiButtonIcon euiButtonIcon--ghost euiButtonIcon--empty euiButtonIcon--xSmall\\" type=\\"button\\" aria-label=\\"Settings\\"><span data-euiicon-type=\\"gear\\" class=\\"euiButtonIcon__icon\\" aria-hidden=\\"true\\"></span></button></div></div></div></div></div></div></div></div></div></div></div>"
+</style><div class=\\"content\\"><div class=\\"renderContainer\\"><div data-renderer=\\"markdown\\" class=\\"render\\"><div>markdown mock</div></div></div></div></div></div></div></div></div></div></div></div><div class=\\"bar\\" style=\\"bottom: 0px;\\"><div class=\\"euiFlexGroup euiFlexGroup--directionRow euiFlexGroup--responsive\\"><div class=\\"euiFlexItem title\\"><div class=\\"euiFlexGroup euiFlexGroup--gutterSmall euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--responsive\\"><div class=\\"euiFlexItem euiFlexItem--flexGrowZero\\" style=\\"flex-shrink: 0;\\"><a class=\\"euiLink euiLink--primary\\" href=\\"https://www.elastic.co\\" rel=\\"\\" title=\\"Powered by Elastic.co\\"><span data-euiicon-type=\\"logoElastic\\"></span></a></div><div class=\\"euiFlexItem euiFlexItem--flexGrowZero\\" style=\\"min-width: 0; cursor: default;\\"><div class=\\"euiText euiText--small\\"><div class=\\"euiTextColor euiTextColor--ghost\\"><div class=\\"eui-textTruncate\\">My Canvas Workpad</div></div></div></div></div></div><div class=\\"euiFlexItem euiFlexItem--flexGrowZero\\"><div class=\\"euiFlexGroup euiFlexGroup--gutterSmall euiFlexGroup--directionRow euiFlexGroup--responsive\\"><div class=\\"euiFlexGroup euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--responsive\\" style=\\"margin: 0px 12px;\\"><div class=\\"euiFlexItem euiFlexItem--flexGrowZero\\"><button disabled=\\"\\" class=\\"euiButtonIcon euiButtonIcon--ghost euiButtonIcon--empty euiButtonIcon--xSmall\\" type=\\"button\\" data-test-subj=\\"pageControlsPrevPage\\" aria-label=\\"Previous Page\\"><span data-euiicon-type=\\"arrowLeft\\" class=\\"euiButtonIcon__icon\\" aria-hidden=\\"true\\" color=\\"inherit\\"></span></button></div><div class=\\"euiFlexItem euiFlexItem--flexGrowZero\\"><button class=\\"euiButtonEmpty euiButtonEmpty--ghost euiButtonEmpty--small\\" type=\\"button\\" data-test-subj=\\"pageControlsCurrentPage\\"><span class=\\"euiButtonContent euiButtonEmpty__content\\"><span class=\\"euiButtonEmpty__text\\"><div class=\\"euiText euiText--small\\"><div class=\\"euiTextColor euiTextColor--ghost\\">Page 1</div></div></span></span></button></div><div class=\\"euiFlexItem euiFlexItem--flexGrowZero\\"><button disabled=\\"\\" class=\\"euiButtonIcon euiButtonIcon--ghost euiButtonIcon--empty euiButtonIcon--xSmall\\" type=\\"button\\" data-test-subj=\\"pageControlsNextPage\\" aria-label=\\"Next Page\\"><span data-euiicon-type=\\"arrowRight\\" class=\\"euiButtonIcon__icon\\" aria-hidden=\\"true\\" color=\\"inherit\\"></span></button></div></div><div class=\\"euiFlexGroup euiFlexGroup--alignItemsFlexEnd euiFlexGroup--justifyContentCenter euiFlexGroup--directionColumn euiFlexGroup--responsive\\"><div class=\\"euiFlexItem euiFlexItem--flexGrowZero\\"><div class=\\"euiPopover euiPopover--anchorUpRight\\" id=\\"settings\\"><div class=\\"euiPopover__anchor\\"><button class=\\"euiButtonIcon euiButtonIcon--ghost euiButtonIcon--empty euiButtonIcon--xSmall\\" type=\\"button\\" aria-label=\\"Settings\\"><span data-euiicon-type=\\"gear\\" class=\\"euiButtonIcon__icon\\" aria-hidden=\\"true\\" color=\\"inherit\\"></span></button></div></div></div></div></div></div></div></div></div></div></div>"
 `;
 
 exports[`Canvas Shareable Workpad API Placed successfully with height specified 1`] = `"<div kbn-canvas-shareable=\\"canvas\\" kbn-canvas-height=\\"350\\" kbn-canvas-url=\\"workpad.json\\"></div>"`;
@@ -21,7 +21,7 @@ exports[`Canvas Shareable Workpad API Placed successfully with height specified
 </style><div class=\\"content\\"><div class=\\"renderContainer\\"><div data-renderer=\\"markdown\\" class=\\"render\\"><div>markdown mock</div></div></div></div></div></div></div></div></div></div><div class=\\"root\\" style=\\"height: 48px;\\"><div class=\\"root\\"><div class=\\"slideContainer\\"><div class=\\"root\\" style=\\"height: 100px; width: 150px;\\"><div class=\\"preview\\" style=\\"height: 720px; width: 1080px; transform: scale3d(0.1388888888888889, 0.1388888888888889, 1);\\"><div id=\\"page-7186b301-f8a7-4c65-8b89-38d68d31cfc4\\" class=\\"root\\" style=\\"height: 720px; width: 1080px; background: rgb(119, 119, 119);\\"><div class=\\"canvasPositionable canvasInteractable\\" style=\\"width: 1082px; height: 205.37748344370857px; margin-left: -541px; margin-top: -102.68874172185429px; position: absolute; transform: matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,540,367,1,1);\\"><div class=\\"root\\"><div class=\\"container s2042575598\\" style=\\"overflow: hidden;\\"><style type=\\"text/css\\">.s2042575598 .canvasRenderEl h1 {
  font-size: 150px; text-align: center; color: #d3d3d3;
 }
-</style><div class=\\"content\\"><div class=\\"renderContainer\\"><div data-renderer=\\"markdown\\" class=\\"render\\"><div>markdown mock</div></div></div></div></div></div></div></div></div></div></div></div><div class=\\"bar\\" style=\\"bottom: 0px;\\"><div class=\\"euiFlexGroup euiFlexGroup--directionRow euiFlexGroup--responsive\\"><div class=\\"euiFlexItem title\\"><div class=\\"euiFlexGroup euiFlexGroup--gutterSmall euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--responsive\\"><div class=\\"euiFlexItem euiFlexItem--flexGrowZero\\" style=\\"flex-shrink: 0;\\"><a class=\\"euiLink euiLink--primary\\" href=\\"https://www.elastic.co\\" rel=\\"\\" title=\\"Powered by Elastic.co\\"><span data-euiicon-type=\\"logoElastic\\"></span></a></div><div class=\\"euiFlexItem euiFlexItem--flexGrowZero\\" style=\\"min-width: 0; cursor: default;\\"><div class=\\"euiText euiText--small\\"><div class=\\"euiTextColor euiTextColor--ghost\\"><div class=\\"eui-textTruncate\\">My Canvas Workpad</div></div></div></div></div></div><div class=\\"euiFlexItem euiFlexItem--flexGrowZero\\"><div class=\\"euiFlexGroup euiFlexGroup--gutterSmall euiFlexGroup--directionRow euiFlexGroup--responsive\\"><div class=\\"euiFlexGroup euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--responsive\\" style=\\"margin: 0px 12px;\\"><div class=\\"euiFlexItem euiFlexItem--flexGrowZero\\"><button disabled=\\"\\" class=\\"euiButtonIcon euiButtonIcon--ghost euiButtonIcon--empty euiButtonIcon--xSmall\\" type=\\"button\\" data-test-subj=\\"pageControlsPrevPage\\" aria-label=\\"Previous Page\\"><span data-euiicon-type=\\"arrowLeft\\" class=\\"euiButtonIcon__icon\\" aria-hidden=\\"true\\"></span></button></div><div class=\\"euiFlexItem euiFlexItem--flexGrowZero\\"><button class=\\"euiButtonEmpty euiButtonEmpty--ghost euiButtonEmpty--small\\" type=\\"button\\" data-test-subj=\\"pageControlsCurrentPage\\"><span class=\\"euiButtonContent euiButtonEmpty__content\\"><span class=\\"euiButtonEmpty__text\\"><div class=\\"euiText euiText--small\\"><div class=\\"euiTextColor euiTextColor--ghost\\">Page 1</div></div></span></span></button></div><div class=\\"euiFlexItem euiFlexItem--flexGrowZero\\"><button disabled=\\"\\" class=\\"euiButtonIcon euiButtonIcon--ghost euiButtonIcon--empty euiButtonIcon--xSmall\\" type=\\"button\\" data-test-subj=\\"pageControlsNextPage\\" aria-label=\\"Next Page\\"><span data-euiicon-type=\\"arrowRight\\" class=\\"euiButtonIcon__icon\\" aria-hidden=\\"true\\"></span></button></div></div><div class=\\"euiFlexGroup euiFlexGroup--alignItemsFlexEnd euiFlexGroup--justifyContentCenter euiFlexGroup--directionColumn euiFlexGroup--responsive\\"><div class=\\"euiFlexItem euiFlexItem--flexGrowZero\\"><div class=\\"euiPopover euiPopover--anchorUpRight\\" id=\\"settings\\"><div class=\\"euiPopover__anchor\\"><button class=\\"euiButtonIcon euiButtonIcon--ghost euiButtonIcon--empty euiButtonIcon--xSmall\\" type=\\"button\\" aria-label=\\"Settings\\"><span data-euiicon-type=\\"gear\\" class=\\"euiButtonIcon__icon\\" aria-hidden=\\"true\\"></span></button></div></div></div></div></div></div></div></div></div></div></div>"
+</style><div class=\\"content\\"><div class=\\"renderContainer\\"><div data-renderer=\\"markdown\\" class=\\"render\\"><div>markdown mock</div></div></div></div></div></div></div></div></div></div></div></div><div class=\\"bar\\" style=\\"bottom: 0px;\\"><div class=\\"euiFlexGroup euiFlexGroup--directionRow euiFlexGroup--responsive\\"><div class=\\"euiFlexItem title\\"><div class=\\"euiFlexGroup euiFlexGroup--gutterSmall euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--responsive\\"><div class=\\"euiFlexItem euiFlexItem--flexGrowZero\\" style=\\"flex-shrink: 0;\\"><a class=\\"euiLink euiLink--primary\\" href=\\"https://www.elastic.co\\" rel=\\"\\" title=\\"Powered by Elastic.co\\"><span data-euiicon-type=\\"logoElastic\\"></span></a></div><div class=\\"euiFlexItem euiFlexItem--flexGrowZero\\" style=\\"min-width: 0; cursor: default;\\"><div class=\\"euiText euiText--small\\"><div class=\\"euiTextColor euiTextColor--ghost\\"><div class=\\"eui-textTruncate\\">My Canvas Workpad</div></div></div></div></div></div><div class=\\"euiFlexItem euiFlexItem--flexGrowZero\\"><div class=\\"euiFlexGroup euiFlexGroup--gutterSmall euiFlexGroup--directionRow euiFlexGroup--responsive\\"><div class=\\"euiFlexGroup euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--responsive\\" style=\\"margin: 0px 12px;\\"><div class=\\"euiFlexItem euiFlexItem--flexGrowZero\\"><button disabled=\\"\\" class=\\"euiButtonIcon euiButtonIcon--ghost euiButtonIcon--empty euiButtonIcon--xSmall\\" type=\\"button\\" data-test-subj=\\"pageControlsPrevPage\\" aria-label=\\"Previous Page\\"><span data-euiicon-type=\\"arrowLeft\\" class=\\"euiButtonIcon__icon\\" aria-hidden=\\"true\\" color=\\"inherit\\"></span></button></div><div class=\\"euiFlexItem euiFlexItem--flexGrowZero\\"><button class=\\"euiButtonEmpty euiButtonEmpty--ghost euiButtonEmpty--small\\" type=\\"button\\" data-test-subj=\\"pageControlsCurrentPage\\"><span class=\\"euiButtonContent euiButtonEmpty__content\\"><span class=\\"euiButtonEmpty__text\\"><div class=\\"euiText euiText--small\\"><div class=\\"euiTextColor euiTextColor--ghost\\">Page 1</div></div></span></span></button></div><div class=\\"euiFlexItem euiFlexItem--flexGrowZero\\"><button disabled=\\"\\" class=\\"euiButtonIcon euiButtonIcon--ghost euiButtonIcon--empty euiButtonIcon--xSmall\\" type=\\"button\\" data-test-subj=\\"pageControlsNextPage\\" aria-label=\\"Next Page\\"><span data-euiicon-type=\\"arrowRight\\" class=\\"euiButtonIcon__icon\\" aria-hidden=\\"true\\" color=\\"inherit\\"></span></button></div></div><div class=\\"euiFlexGroup euiFlexGroup--alignItemsFlexEnd euiFlexGroup--justifyContentCenter euiFlexGroup--directionColumn euiFlexGroup--responsive\\"><div class=\\"euiFlexItem euiFlexItem--flexGrowZero\\"><div class=\\"euiPopover euiPopover--anchorUpRight\\" id=\\"settings\\"><div class=\\"euiPopover__anchor\\"><button class=\\"euiButtonIcon euiButtonIcon--ghost euiButtonIcon--empty euiButtonIcon--xSmall\\" type=\\"button\\" aria-label=\\"Settings\\"><span data-euiicon-type=\\"gear\\" class=\\"euiButtonIcon__icon\\" aria-hidden=\\"true\\" color=\\"inherit\\"></span></button></div></div></div></div></div></div></div></div></div></div></div>"
 `;
 
 exports[`Canvas Shareable Workpad API Placed successfully with page specified 1`] = `"<div kbn-canvas-shareable=\\"canvas\\" kbn-canvas-page=\\"0\\" kbn-canvas-url=\\"workpad.json\\"></div>"`;
@@ -33,7 +33,7 @@ exports[`Canvas Shareable Workpad API Placed successfully with page specified 2`
 </style><div class=\\"content\\"><div class=\\"renderContainer\\"><div data-renderer=\\"markdown\\" class=\\"render\\"><div>markdown mock</div></div></div></div></div></div></div></div></div></div><div class=\\"root\\" style=\\"height: 48px;\\"><div class=\\"root\\"><div class=\\"slideContainer\\"><div class=\\"root\\" style=\\"height: 100px; width: 150px;\\"><div class=\\"preview\\" style=\\"height: 720px; width: 1080px; transform: scale3d(0.1388888888888889, 0.1388888888888889, 1);\\"><div id=\\"page-7186b301-f8a7-4c65-8b89-38d68d31cfc4\\" class=\\"root\\" style=\\"height: 720px; width: 1080px; background: rgb(119, 119, 119);\\"><div class=\\"canvasPositionable canvasInteractable\\" style=\\"width: 1082px; height: 205.37748344370857px; margin-left: -541px; margin-top: -102.68874172185429px; position: absolute; transform: matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,540,367,1,1);\\"><div class=\\"root\\"><div class=\\"container s2042575598\\" style=\\"overflow: hidden;\\"><style type=\\"text/css\\">.s2042575598 .canvasRenderEl h1 {
  font-size: 150px; text-align: center; color: #d3d3d3;
 }
-</style><div class=\\"content\\"><div class=\\"renderContainer\\"><div data-renderer=\\"markdown\\" class=\\"render\\"><div>markdown mock</div></div></div></div></div></div></div></div></div></div></div></div><div class=\\"bar\\" style=\\"bottom: 0px;\\"><div class=\\"euiFlexGroup euiFlexGroup--directionRow euiFlexGroup--responsive\\"><div class=\\"euiFlexItem title\\"><div class=\\"euiFlexGroup euiFlexGroup--gutterSmall euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--responsive\\"><div class=\\"euiFlexItem euiFlexItem--flexGrowZero\\" style=\\"flex-shrink: 0;\\"><a class=\\"euiLink euiLink--primary\\" href=\\"https://www.elastic.co\\" rel=\\"\\" title=\\"Powered by Elastic.co\\"><span data-euiicon-type=\\"logoElastic\\"></span></a></div><div class=\\"euiFlexItem euiFlexItem--flexGrowZero\\" style=\\"min-width: 0; cursor: default;\\"><div class=\\"euiText euiText--small\\"><div class=\\"euiTextColor euiTextColor--ghost\\"><div class=\\"eui-textTruncate\\">My Canvas Workpad</div></div></div></div></div></div><div class=\\"euiFlexItem euiFlexItem--flexGrowZero\\"><div class=\\"euiFlexGroup euiFlexGroup--gutterSmall euiFlexGroup--directionRow euiFlexGroup--responsive\\"><div class=\\"euiFlexGroup euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--responsive\\" style=\\"margin: 0px 12px;\\"><div class=\\"euiFlexItem euiFlexItem--flexGrowZero\\"><button disabled=\\"\\" class=\\"euiButtonIcon euiButtonIcon--ghost euiButtonIcon--empty euiButtonIcon--xSmall\\" type=\\"button\\" data-test-subj=\\"pageControlsPrevPage\\" aria-label=\\"Previous Page\\"><span data-euiicon-type=\\"arrowLeft\\" class=\\"euiButtonIcon__icon\\" aria-hidden=\\"true\\"></span></button></div><div class=\\"euiFlexItem euiFlexItem--flexGrowZero\\"><button class=\\"euiButtonEmpty euiButtonEmpty--ghost euiButtonEmpty--small\\" type=\\"button\\" data-test-subj=\\"pageControlsCurrentPage\\"><span class=\\"euiButtonContent euiButtonEmpty__content\\"><span class=\\"euiButtonEmpty__text\\"><div class=\\"euiText euiText--small\\"><div class=\\"euiTextColor euiTextColor--ghost\\">Page 1</div></div></span></span></button></div><div class=\\"euiFlexItem euiFlexItem--flexGrowZero\\"><button disabled=\\"\\" class=\\"euiButtonIcon euiButtonIcon--ghost euiButtonIcon--empty euiButtonIcon--xSmall\\" type=\\"button\\" data-test-subj=\\"pageControlsNextPage\\" aria-label=\\"Next Page\\"><span data-euiicon-type=\\"arrowRight\\" class=\\"euiButtonIcon__icon\\" aria-hidden=\\"true\\"></span></button></div></div><div class=\\"euiFlexGroup euiFlexGroup--alignItemsFlexEnd euiFlexGroup--justifyContentCenter euiFlexGroup--directionColumn euiFlexGroup--responsive\\"><div class=\\"euiFlexItem euiFlexItem--flexGrowZero\\"><div class=\\"euiPopover euiPopover--anchorUpRight\\" id=\\"settings\\"><div class=\\"euiPopover__anchor\\"><button class=\\"euiButtonIcon euiButtonIcon--ghost euiButtonIcon--empty euiButtonIcon--xSmall\\" type=\\"button\\" aria-label=\\"Settings\\"><span data-euiicon-type=\\"gear\\" class=\\"euiButtonIcon__icon\\" aria-hidden=\\"true\\"></span></button></div></div></div></div></div></div></div></div></div></div></div>"
+</style><div class=\\"content\\"><div class=\\"renderContainer\\"><div data-renderer=\\"markdown\\" class=\\"render\\"><div>markdown mock</div></div></div></div></div></div></div></div></div></div></div></div><div class=\\"bar\\" style=\\"bottom: 0px;\\"><div class=\\"euiFlexGroup euiFlexGroup--directionRow euiFlexGroup--responsive\\"><div class=\\"euiFlexItem title\\"><div class=\\"euiFlexGroup euiFlexGroup--gutterSmall euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--responsive\\"><div class=\\"euiFlexItem euiFlexItem--flexGrowZero\\" style=\\"flex-shrink: 0;\\"><a class=\\"euiLink euiLink--primary\\" href=\\"https://www.elastic.co\\" rel=\\"\\" title=\\"Powered by Elastic.co\\"><span data-euiicon-type=\\"logoElastic\\"></span></a></div><div class=\\"euiFlexItem euiFlexItem--flexGrowZero\\" style=\\"min-width: 0; cursor: default;\\"><div class=\\"euiText euiText--small\\"><div class=\\"euiTextColor euiTextColor--ghost\\"><div class=\\"eui-textTruncate\\">My Canvas Workpad</div></div></div></div></div></div><div class=\\"euiFlexItem euiFlexItem--flexGrowZero\\"><div class=\\"euiFlexGroup euiFlexGroup--gutterSmall euiFlexGroup--directionRow euiFlexGroup--responsive\\"><div class=\\"euiFlexGroup euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--responsive\\" style=\\"margin: 0px 12px;\\"><div class=\\"euiFlexItem euiFlexItem--flexGrowZero\\"><button disabled=\\"\\" class=\\"euiButtonIcon euiButtonIcon--ghost euiButtonIcon--empty euiButtonIcon--xSmall\\" type=\\"button\\" data-test-subj=\\"pageControlsPrevPage\\" aria-label=\\"Previous Page\\"><span data-euiicon-type=\\"arrowLeft\\" class=\\"euiButtonIcon__icon\\" aria-hidden=\\"true\\" color=\\"inherit\\"></span></button></div><div class=\\"euiFlexItem euiFlexItem--flexGrowZero\\"><button class=\\"euiButtonEmpty euiButtonEmpty--ghost euiButtonEmpty--small\\" type=\\"button\\" data-test-subj=\\"pageControlsCurrentPage\\"><span class=\\"euiButtonContent euiButtonEmpty__content\\"><span class=\\"euiButtonEmpty__text\\"><div class=\\"euiText euiText--small\\"><div class=\\"euiTextColor euiTextColor--ghost\\">Page 1</div></div></span></span></button></div><div class=\\"euiFlexItem euiFlexItem--flexGrowZero\\"><button disabled=\\"\\" class=\\"euiButtonIcon euiButtonIcon--ghost euiButtonIcon--empty euiButtonIcon--xSmall\\" type=\\"button\\" data-test-subj=\\"pageControlsNextPage\\" aria-label=\\"Next Page\\"><span data-euiicon-type=\\"arrowRight\\" class=\\"euiButtonIcon__icon\\" aria-hidden=\\"true\\" color=\\"inherit\\"></span></button></div></div><div class=\\"euiFlexGroup euiFlexGroup--alignItemsFlexEnd euiFlexGroup--justifyContentCenter euiFlexGroup--directionColumn euiFlexGroup--responsive\\"><div class=\\"euiFlexItem euiFlexItem--flexGrowZero\\"><div class=\\"euiPopover euiPopover--anchorUpRight\\" id=\\"settings\\"><div class=\\"euiPopover__anchor\\"><button class=\\"euiButtonIcon euiButtonIcon--ghost euiButtonIcon--empty euiButtonIcon--xSmall\\" type=\\"button\\" aria-label=\\"Settings\\"><span data-euiicon-type=\\"gear\\" class=\\"euiButtonIcon__icon\\" aria-hidden=\\"true\\" color=\\"inherit\\"></span></button></div></div></div></div></div></div></div></div></div></div></div>"
 `;
 
 exports[`Canvas Shareable Workpad API Placed successfully with width and height specified 1`] = `"<div kbn-canvas-shareable=\\"canvas\\" kbn-canvas-width=\\"350\\" kbn-canvas-height=\\"350\\" kbn-canvas-url=\\"workpad.json\\"></div>"`;
@@ -45,7 +45,7 @@ exports[`Canvas Shareable Workpad API Placed successfully with width and height
 </style><div class=\\"content\\"><div class=\\"renderContainer\\"><div data-renderer=\\"markdown\\" class=\\"render\\"><div>markdown mock</div></div></div></div></div></div></div></div></div></div><div class=\\"root\\" style=\\"height: 48px;\\"><div class=\\"root\\"><div class=\\"slideContainer\\"><div class=\\"root\\" style=\\"height: 100px; width: 150px;\\"><div class=\\"preview\\" style=\\"height: 720px; width: 1080px; transform: scale3d(0.1388888888888889, 0.1388888888888889, 1);\\"><div id=\\"page-7186b301-f8a7-4c65-8b89-38d68d31cfc4\\" class=\\"root\\" style=\\"height: 720px; width: 1080px; background: rgb(119, 119, 119);\\"><div class=\\"canvasPositionable canvasInteractable\\" style=\\"width: 1082px; height: 205.37748344370857px; margin-left: -541px; margin-top: -102.68874172185429px; position: absolute; transform: matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,540,367,1,1);\\"><div class=\\"root\\"><div class=\\"container s2042575598\\" style=\\"overflow: hidden;\\"><style type=\\"text/css\\">.s2042575598 .canvasRenderEl h1 {
  font-size: 150px; text-align: center; color: #d3d3d3;
 }
-</style><div class=\\"content\\"><div class=\\"renderContainer\\"><div data-renderer=\\"markdown\\" class=\\"render\\"><div>markdown mock</div></div></div></div></div></div></div></div></div></div></div></div><div class=\\"bar\\" style=\\"bottom: 0px;\\"><div class=\\"euiFlexGroup euiFlexGroup--directionRow euiFlexGroup--responsive\\"><div class=\\"euiFlexItem title\\"><div class=\\"euiFlexGroup euiFlexGroup--gutterSmall euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--responsive\\"><div class=\\"euiFlexItem euiFlexItem--flexGrowZero\\" style=\\"flex-shrink: 0;\\"><a class=\\"euiLink euiLink--primary\\" href=\\"https://www.elastic.co\\" rel=\\"\\" title=\\"Powered by Elastic.co\\"><span data-euiicon-type=\\"logoElastic\\"></span></a></div><div class=\\"euiFlexItem euiFlexItem--flexGrowZero\\" style=\\"min-width: 0; cursor: default;\\"><div class=\\"euiText euiText--small\\"><div class=\\"euiTextColor euiTextColor--ghost\\"><div class=\\"eui-textTruncate\\">My Canvas Workpad</div></div></div></div></div></div><div class=\\"euiFlexItem euiFlexItem--flexGrowZero\\"><div class=\\"euiFlexGroup euiFlexGroup--gutterSmall euiFlexGroup--directionRow euiFlexGroup--responsive\\"><div class=\\"euiFlexGroup euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--responsive\\" style=\\"margin: 0px 12px;\\"><div class=\\"euiFlexItem euiFlexItem--flexGrowZero\\"><button disabled=\\"\\" class=\\"euiButtonIcon euiButtonIcon--ghost euiButtonIcon--empty euiButtonIcon--xSmall\\" type=\\"button\\" data-test-subj=\\"pageControlsPrevPage\\" aria-label=\\"Previous Page\\"><span data-euiicon-type=\\"arrowLeft\\" class=\\"euiButtonIcon__icon\\" aria-hidden=\\"true\\"></span></button></div><div class=\\"euiFlexItem euiFlexItem--flexGrowZero\\"><button class=\\"euiButtonEmpty euiButtonEmpty--ghost euiButtonEmpty--small\\" type=\\"button\\" data-test-subj=\\"pageControlsCurrentPage\\"><span class=\\"euiButtonContent euiButtonEmpty__content\\"><span class=\\"euiButtonEmpty__text\\"><div class=\\"euiText euiText--small\\"><div class=\\"euiTextColor euiTextColor--ghost\\">Page 1</div></div></span></span></button></div><div class=\\"euiFlexItem euiFlexItem--flexGrowZero\\"><button disabled=\\"\\" class=\\"euiButtonIcon euiButtonIcon--ghost euiButtonIcon--empty euiButtonIcon--xSmall\\" type=\\"button\\" data-test-subj=\\"pageControlsNextPage\\" aria-label=\\"Next Page\\"><span data-euiicon-type=\\"arrowRight\\" class=\\"euiButtonIcon__icon\\" aria-hidden=\\"true\\"></span></button></div></div><div class=\\"euiFlexGroup euiFlexGroup--alignItemsFlexEnd euiFlexGroup--justifyContentCenter euiFlexGroup--directionColumn euiFlexGroup--responsive\\"><div class=\\"euiFlexItem euiFlexItem--flexGrowZero\\"><div class=\\"euiPopover euiPopover--anchorUpRight\\" id=\\"settings\\"><div class=\\"euiPopover__anchor\\"><button class=\\"euiButtonIcon euiButtonIcon--ghost euiButtonIcon--empty euiButtonIcon--xSmall\\" type=\\"button\\" aria-label=\\"Settings\\"><span data-euiicon-type=\\"gear\\" class=\\"euiButtonIcon__icon\\" aria-hidden=\\"true\\"></span></button></div></div></div></div></div></div></div></div></div></div></div>"
+</style><div class=\\"content\\"><div class=\\"renderContainer\\"><div data-renderer=\\"markdown\\" class=\\"render\\"><div>markdown mock</div></div></div></div></div></div></div></div></div></div></div></div><div class=\\"bar\\" style=\\"bottom: 0px;\\"><div class=\\"euiFlexGroup euiFlexGroup--directionRow euiFlexGroup--responsive\\"><div class=\\"euiFlexItem title\\"><div class=\\"euiFlexGroup euiFlexGroup--gutterSmall euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--responsive\\"><div class=\\"euiFlexItem euiFlexItem--flexGrowZero\\" style=\\"flex-shrink: 0;\\"><a class=\\"euiLink euiLink--primary\\" href=\\"https://www.elastic.co\\" rel=\\"\\" title=\\"Powered by Elastic.co\\"><span data-euiicon-type=\\"logoElastic\\"></span></a></div><div class=\\"euiFlexItem euiFlexItem--flexGrowZero\\" style=\\"min-width: 0; cursor: default;\\"><div class=\\"euiText euiText--small\\"><div class=\\"euiTextColor euiTextColor--ghost\\"><div class=\\"eui-textTruncate\\">My Canvas Workpad</div></div></div></div></div></div><div class=\\"euiFlexItem euiFlexItem--flexGrowZero\\"><div class=\\"euiFlexGroup euiFlexGroup--gutterSmall euiFlexGroup--directionRow euiFlexGroup--responsive\\"><div class=\\"euiFlexGroup euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--responsive\\" style=\\"margin: 0px 12px;\\"><div class=\\"euiFlexItem euiFlexItem--flexGrowZero\\"><button disabled=\\"\\" class=\\"euiButtonIcon euiButtonIcon--ghost euiButtonIcon--empty euiButtonIcon--xSmall\\" type=\\"button\\" data-test-subj=\\"pageControlsPrevPage\\" aria-label=\\"Previous Page\\"><span data-euiicon-type=\\"arrowLeft\\" class=\\"euiButtonIcon__icon\\" aria-hidden=\\"true\\" color=\\"inherit\\"></span></button></div><div class=\\"euiFlexItem euiFlexItem--flexGrowZero\\"><button class=\\"euiButtonEmpty euiButtonEmpty--ghost euiButtonEmpty--small\\" type=\\"button\\" data-test-subj=\\"pageControlsCurrentPage\\"><span class=\\"euiButtonContent euiButtonEmpty__content\\"><span class=\\"euiButtonEmpty__text\\"><div class=\\"euiText euiText--small\\"><div class=\\"euiTextColor euiTextColor--ghost\\">Page 1</div></div></span></span></button></div><div class=\\"euiFlexItem euiFlexItem--flexGrowZero\\"><button disabled=\\"\\" class=\\"euiButtonIcon euiButtonIcon--ghost euiButtonIcon--empty euiButtonIcon--xSmall\\" type=\\"button\\" data-test-subj=\\"pageControlsNextPage\\" aria-label=\\"Next Page\\"><span data-euiicon-type=\\"arrowRight\\" class=\\"euiButtonIcon__icon\\" aria-hidden=\\"true\\" color=\\"inherit\\"></span></button></div></div><div class=\\"euiFlexGroup euiFlexGroup--alignItemsFlexEnd euiFlexGroup--justifyContentCenter euiFlexGroup--directionColumn euiFlexGroup--responsive\\"><div class=\\"euiFlexItem euiFlexItem--flexGrowZero\\"><div class=\\"euiPopover euiPopover--anchorUpRight\\" id=\\"settings\\"><div class=\\"euiPopover__anchor\\"><button class=\\"euiButtonIcon euiButtonIcon--ghost euiButtonIcon--empty euiButtonIcon--xSmall\\" type=\\"button\\" aria-label=\\"Settings\\"><span data-euiicon-type=\\"gear\\" class=\\"euiButtonIcon__icon\\" aria-hidden=\\"true\\" color=\\"inherit\\"></span></button></div></div></div></div></div></div></div></div></div></div></div>"
 `;
 
 exports[`Canvas Shareable Workpad API Placed successfully with width specified 1`] = `"<div kbn-canvas-shareable=\\"canvas\\" kbn-canvas-width=\\"400\\" kbn-canvas-url=\\"workpad.json\\"></div>"`;
@@ -57,5 +57,5 @@ exports[`Canvas Shareable Workpad API Placed successfully with width specified 2
 </style><div class=\\"content\\"><div class=\\"renderContainer\\"><div data-renderer=\\"markdown\\" class=\\"render\\"><div>markdown mock</div></div></div></div></div></div></div></div></div></div><div class=\\"root\\" style=\\"height: 48px;\\"><div class=\\"root\\"><div class=\\"slideContainer\\"><div class=\\"root\\" style=\\"height: 100px; width: 150px;\\"><div class=\\"preview\\" style=\\"height: 720px; width: 1080px; transform: scale3d(0.1388888888888889, 0.1388888888888889, 1);\\"><div id=\\"page-7186b301-f8a7-4c65-8b89-38d68d31cfc4\\" class=\\"root\\" style=\\"height: 720px; width: 1080px; background: rgb(119, 119, 119);\\"><div class=\\"canvasPositionable canvasInteractable\\" style=\\"width: 1082px; height: 205.37748344370857px; margin-left: -541px; margin-top: -102.68874172185429px; position: absolute; transform: matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,540,367,1,1);\\"><div class=\\"root\\"><div class=\\"container s2042575598\\" style=\\"overflow: hidden;\\"><style type=\\"text/css\\">.s2042575598 .canvasRenderEl h1 {
  font-size: 150px; text-align: center; color: #d3d3d3;
 }
-</style><div class=\\"content\\"><div class=\\"renderContainer\\"><div data-renderer=\\"markdown\\" class=\\"render\\"><div>markdown mock</div></div></div></div></div></div></div></div></div></div></div></div><div class=\\"bar\\" style=\\"bottom: 0px;\\"><div class=\\"euiFlexGroup euiFlexGroup--directionRow euiFlexGroup--responsive\\"><div class=\\"euiFlexItem title\\"><div class=\\"euiFlexGroup euiFlexGroup--gutterSmall euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--responsive\\"><div class=\\"euiFlexItem euiFlexItem--flexGrowZero\\" style=\\"flex-shrink: 0;\\"><a class=\\"euiLink euiLink--primary\\" href=\\"https://www.elastic.co\\" rel=\\"\\" title=\\"Powered by Elastic.co\\"><span data-euiicon-type=\\"logoElastic\\"></span></a></div><div class=\\"euiFlexItem euiFlexItem--flexGrowZero\\" style=\\"min-width: 0; cursor: default;\\"><div class=\\"euiText euiText--small\\"><div class=\\"euiTextColor euiTextColor--ghost\\"><div class=\\"eui-textTruncate\\">My Canvas Workpad</div></div></div></div></div></div><div class=\\"euiFlexItem euiFlexItem--flexGrowZero\\"><div class=\\"euiFlexGroup euiFlexGroup--gutterSmall euiFlexGroup--directionRow euiFlexGroup--responsive\\"><div class=\\"euiFlexGroup euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--responsive\\" style=\\"margin: 0px 12px;\\"><div class=\\"euiFlexItem euiFlexItem--flexGrowZero\\"><button disabled=\\"\\" class=\\"euiButtonIcon euiButtonIcon--ghost euiButtonIcon--empty euiButtonIcon--xSmall\\" type=\\"button\\" data-test-subj=\\"pageControlsPrevPage\\" aria-label=\\"Previous Page\\"><span data-euiicon-type=\\"arrowLeft\\" class=\\"euiButtonIcon__icon\\" aria-hidden=\\"true\\"></span></button></div><div class=\\"euiFlexItem euiFlexItem--flexGrowZero\\"><button class=\\"euiButtonEmpty euiButtonEmpty--ghost euiButtonEmpty--small\\" type=\\"button\\" data-test-subj=\\"pageControlsCurrentPage\\"><span class=\\"euiButtonContent euiButtonEmpty__content\\"><span class=\\"euiButtonEmpty__text\\"><div class=\\"euiText euiText--small\\"><div class=\\"euiTextColor euiTextColor--ghost\\">Page 1</div></div></span></span></button></div><div class=\\"euiFlexItem euiFlexItem--flexGrowZero\\"><button disabled=\\"\\" class=\\"euiButtonIcon euiButtonIcon--ghost euiButtonIcon--empty euiButtonIcon--xSmall\\" type=\\"button\\" data-test-subj=\\"pageControlsNextPage\\" aria-label=\\"Next Page\\"><span data-euiicon-type=\\"arrowRight\\" class=\\"euiButtonIcon__icon\\" aria-hidden=\\"true\\"></span></button></div></div><div class=\\"euiFlexGroup euiFlexGroup--alignItemsFlexEnd euiFlexGroup--justifyContentCenter euiFlexGroup--directionColumn euiFlexGroup--responsive\\"><div class=\\"euiFlexItem euiFlexItem--flexGrowZero\\"><div class=\\"euiPopover euiPopover--anchorUpRight\\" id=\\"settings\\"><div class=\\"euiPopover__anchor\\"><button class=\\"euiButtonIcon euiButtonIcon--ghost euiButtonIcon--empty euiButtonIcon--xSmall\\" type=\\"button\\" aria-label=\\"Settings\\"><span data-euiicon-type=\\"gear\\" class=\\"euiButtonIcon__icon\\" aria-hidden=\\"true\\"></span></button></div></div></div></div></div></div></div></div></div></div></div>"
+</style><div class=\\"content\\"><div class=\\"renderContainer\\"><div data-renderer=\\"markdown\\" class=\\"render\\"><div>markdown mock</div></div></div></div></div></div></div></div></div></div></div></div><div class=\\"bar\\" style=\\"bottom: 0px;\\"><div class=\\"euiFlexGroup euiFlexGroup--directionRow euiFlexGroup--responsive\\"><div class=\\"euiFlexItem title\\"><div class=\\"euiFlexGroup euiFlexGroup--gutterSmall euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--responsive\\"><div class=\\"euiFlexItem euiFlexItem--flexGrowZero\\" style=\\"flex-shrink: 0;\\"><a class=\\"euiLink euiLink--primary\\" href=\\"https://www.elastic.co\\" rel=\\"\\" title=\\"Powered by Elastic.co\\"><span data-euiicon-type=\\"logoElastic\\"></span></a></div><div class=\\"euiFlexItem euiFlexItem--flexGrowZero\\" style=\\"min-width: 0; cursor: default;\\"><div class=\\"euiText euiText--small\\"><div class=\\"euiTextColor euiTextColor--ghost\\"><div class=\\"eui-textTruncate\\">My Canvas Workpad</div></div></div></div></div></div><div class=\\"euiFlexItem euiFlexItem--flexGrowZero\\"><div class=\\"euiFlexGroup euiFlexGroup--gutterSmall euiFlexGroup--directionRow euiFlexGroup--responsive\\"><div class=\\"euiFlexGroup euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--responsive\\" style=\\"margin: 0px 12px;\\"><div class=\\"euiFlexItem euiFlexItem--flexGrowZero\\"><button disabled=\\"\\" class=\\"euiButtonIcon euiButtonIcon--ghost euiButtonIcon--empty euiButtonIcon--xSmall\\" type=\\"button\\" data-test-subj=\\"pageControlsPrevPage\\" aria-label=\\"Previous Page\\"><span data-euiicon-type=\\"arrowLeft\\" class=\\"euiButtonIcon__icon\\" aria-hidden=\\"true\\" color=\\"inherit\\"></span></button></div><div class=\\"euiFlexItem euiFlexItem--flexGrowZero\\"><button class=\\"euiButtonEmpty euiButtonEmpty--ghost euiButtonEmpty--small\\" type=\\"button\\" data-test-subj=\\"pageControlsCurrentPage\\"><span class=\\"euiButtonContent euiButtonEmpty__content\\"><span class=\\"euiButtonEmpty__text\\"><div class=\\"euiText euiText--small\\"><div class=\\"euiTextColor euiTextColor--ghost\\">Page 1</div></div></span></span></button></div><div class=\\"euiFlexItem euiFlexItem--flexGrowZero\\"><button disabled=\\"\\" class=\\"euiButtonIcon euiButtonIcon--ghost euiButtonIcon--empty euiButtonIcon--xSmall\\" type=\\"button\\" data-test-subj=\\"pageControlsNextPage\\" aria-label=\\"Next Page\\"><span data-euiicon-type=\\"arrowRight\\" class=\\"euiButtonIcon__icon\\" aria-hidden=\\"true\\" color=\\"inherit\\"></span></button></div></div><div class=\\"euiFlexGroup euiFlexGroup--alignItemsFlexEnd euiFlexGroup--justifyContentCenter euiFlexGroup--directionColumn euiFlexGroup--responsive\\"><div class=\\"euiFlexItem euiFlexItem--flexGrowZero\\"><div class=\\"euiPopover euiPopover--anchorUpRight\\" id=\\"settings\\"><div class=\\"euiPopover__anchor\\"><button class=\\"euiButtonIcon euiButtonIcon--ghost euiButtonIcon--empty euiButtonIcon--xSmall\\" type=\\"button\\" aria-label=\\"Settings\\"><span data-euiicon-type=\\"gear\\" class=\\"euiButtonIcon__icon\\" aria-hidden=\\"true\\" color=\\"inherit\\"></span></button></div></div></div></div></div></div></div></div></div></div></div>"
 `;
diff --git a/x-pack/plugins/canvas/shareable_runtime/components/__stories__/__snapshots__/canvas.stories.storyshot b/x-pack/plugins/canvas/shareable_runtime/components/__stories__/__snapshots__/canvas.stories.storyshot
index 3432e479bff97..d23371d0c3499 100644
--- a/x-pack/plugins/canvas/shareable_runtime/components/__stories__/__snapshots__/canvas.stories.storyshot
+++ b/x-pack/plugins/canvas/shareable_runtime/components/__stories__/__snapshots__/canvas.stories.storyshot
@@ -1383,6 +1383,7 @@ exports[`Storyshots shareables/Canvas component 1`] = `
                     <span
                       aria-hidden="true"
                       className="euiButtonIcon__icon"
+                      color="inherit"
                       data-euiicon-type="arrowLeft"
                       size="m"
                     />
@@ -1433,6 +1434,7 @@ exports[`Storyshots shareables/Canvas component 1`] = `
                     <span
                       aria-hidden="true"
                       className="euiButtonIcon__icon"
+                      color="inherit"
                       data-euiicon-type="arrowRight"
                       size="m"
                     />
@@ -1462,6 +1464,7 @@ exports[`Storyshots shareables/Canvas component 1`] = `
                         <span
                           aria-hidden="true"
                           className="euiButtonIcon__icon"
+                          color="inherit"
                           data-euiicon-type="gear"
                           size="m"
                         />
@@ -2862,6 +2865,7 @@ exports[`Storyshots shareables/Canvas contextual: austin 1`] = `
                     <span
                       aria-hidden="true"
                       className="euiButtonIcon__icon"
+                      color="inherit"
                       data-euiicon-type="arrowLeft"
                       size="m"
                     />
@@ -2912,6 +2916,7 @@ exports[`Storyshots shareables/Canvas contextual: austin 1`] = `
                     <span
                       aria-hidden="true"
                       className="euiButtonIcon__icon"
+                      color="inherit"
                       data-euiicon-type="arrowRight"
                       size="m"
                     />
@@ -2941,6 +2946,7 @@ exports[`Storyshots shareables/Canvas contextual: austin 1`] = `
                         <span
                           aria-hidden="true"
                           className="euiButtonIcon__icon"
+                          color="inherit"
                           data-euiicon-type="gear"
                           size="m"
                         />
@@ -3157,6 +3163,7 @@ exports[`Storyshots shareables/Canvas contextual: hello 1`] = `
                     <span
                       aria-hidden="true"
                       className="euiButtonIcon__icon"
+                      color="inherit"
                       data-euiicon-type="arrowLeft"
                       size="m"
                     />
@@ -3206,6 +3213,7 @@ exports[`Storyshots shareables/Canvas contextual: hello 1`] = `
                     <span
                       aria-hidden="true"
                       className="euiButtonIcon__icon"
+                      color="inherit"
                       data-euiicon-type="arrowRight"
                       size="m"
                     />
@@ -3235,6 +3243,7 @@ exports[`Storyshots shareables/Canvas contextual: hello 1`] = `
                         <span
                           aria-hidden="true"
                           className="euiButtonIcon__icon"
+                          color="inherit"
                           data-euiicon-type="gear"
                           size="m"
                         />
diff --git a/x-pack/plugins/canvas/shareable_runtime/components/footer/__stories__/__snapshots__/footer.stories.storyshot b/x-pack/plugins/canvas/shareable_runtime/components/footer/__stories__/__snapshots__/footer.stories.storyshot
index 2748e2ce5dd7a..57af8bcb4fecf 100644
--- a/x-pack/plugins/canvas/shareable_runtime/components/footer/__stories__/__snapshots__/footer.stories.storyshot
+++ b/x-pack/plugins/canvas/shareable_runtime/components/footer/__stories__/__snapshots__/footer.stories.storyshot
@@ -1336,6 +1336,7 @@ exports[`Storyshots shareables/Footer contextual: austin 1`] = `
                   <span
                     aria-hidden="true"
                     className="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="arrowLeft"
                     size="m"
                   />
@@ -1386,6 +1387,7 @@ exports[`Storyshots shareables/Footer contextual: austin 1`] = `
                   <span
                     aria-hidden="true"
                     className="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="arrowRight"
                     size="m"
                   />
@@ -1415,6 +1417,7 @@ exports[`Storyshots shareables/Footer contextual: austin 1`] = `
                       <span
                         aria-hidden="true"
                         className="euiButtonIcon__icon"
+                        color="inherit"
                         data-euiicon-type="gear"
                         size="m"
                       />
@@ -1585,6 +1588,7 @@ exports[`Storyshots shareables/Footer contextual: hello 1`] = `
                   <span
                     aria-hidden="true"
                     className="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="arrowLeft"
                     size="m"
                   />
@@ -1634,6 +1638,7 @@ exports[`Storyshots shareables/Footer contextual: hello 1`] = `
                   <span
                     aria-hidden="true"
                     className="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="arrowRight"
                     size="m"
                   />
@@ -1663,6 +1668,7 @@ exports[`Storyshots shareables/Footer contextual: hello 1`] = `
                       <span
                         aria-hidden="true"
                         className="euiButtonIcon__icon"
+                        color="inherit"
                         data-euiicon-type="gear"
                         size="m"
                       />
diff --git a/x-pack/plugins/canvas/shareable_runtime/components/footer/__stories__/__snapshots__/page_controls.stories.storyshot b/x-pack/plugins/canvas/shareable_runtime/components/footer/__stories__/__snapshots__/page_controls.stories.storyshot
index 1b703a8a031f4..81b0ee9cca832 100644
--- a/x-pack/plugins/canvas/shareable_runtime/components/footer/__stories__/__snapshots__/page_controls.stories.storyshot
+++ b/x-pack/plugins/canvas/shareable_runtime/components/footer/__stories__/__snapshots__/page_controls.stories.storyshot
@@ -31,6 +31,7 @@ exports[`Storyshots shareables/Footer/PageControls component 1`] = `
         <span
           aria-hidden="true"
           className="euiButtonIcon__icon"
+          color="inherit"
           data-euiicon-type="arrowLeft"
           size="m"
         />
@@ -81,6 +82,7 @@ exports[`Storyshots shareables/Footer/PageControls component 1`] = `
         <span
           aria-hidden="true"
           className="euiButtonIcon__icon"
+          color="inherit"
           data-euiicon-type="arrowRight"
           size="m"
         />
@@ -126,6 +128,7 @@ exports[`Storyshots shareables/Footer/PageControls contextual: austin 1`] = `
         <span
           aria-hidden="true"
           className="euiButtonIcon__icon"
+          color="inherit"
           data-euiicon-type="arrowLeft"
           size="m"
         />
@@ -176,6 +179,7 @@ exports[`Storyshots shareables/Footer/PageControls contextual: austin 1`] = `
         <span
           aria-hidden="true"
           className="euiButtonIcon__icon"
+          color="inherit"
           data-euiicon-type="arrowRight"
           size="m"
         />
@@ -221,6 +225,7 @@ exports[`Storyshots shareables/Footer/PageControls contextual: hello 1`] = `
         <span
           aria-hidden="true"
           className="euiButtonIcon__icon"
+          color="inherit"
           data-euiicon-type="arrowLeft"
           size="m"
         />
@@ -271,6 +276,7 @@ exports[`Storyshots shareables/Footer/PageControls contextual: hello 1`] = `
         <span
           aria-hidden="true"
           className="euiButtonIcon__icon"
+          color="inherit"
           data-euiicon-type="arrowRight"
           size="m"
         />
diff --git a/x-pack/plugins/canvas/shareable_runtime/components/footer/settings/__snapshots__/settings.test.tsx.snap b/x-pack/plugins/canvas/shareable_runtime/components/footer/settings/__snapshots__/settings.test.tsx.snap
index eb8b648e4969a..621a6bb211fe9 100644
--- a/x-pack/plugins/canvas/shareable_runtime/components/footer/settings/__snapshots__/settings.test.tsx.snap
+++ b/x-pack/plugins/canvas/shareable_runtime/components/footer/settings/__snapshots__/settings.test.tsx.snap
@@ -53,6 +53,7 @@ exports[`<Settings /> can navigate Autoplay Settings 1`] = `
                   >
                     <span
                       class="euiContextMenu__icon"
+                      color="inherit"
                       data-euiicon-type="play"
                     />
                     <span
@@ -75,6 +76,7 @@ exports[`<Settings /> can navigate Autoplay Settings 1`] = `
                   >
                     <span
                       class="euiContextMenu__icon"
+                      color="inherit"
                       data-euiicon-type="boxesHorizontal"
                     />
                     <span
@@ -151,6 +153,7 @@ exports[`<Settings /> can navigate Autoplay Settings 2`] = `
                   >
                     <span
                       class="euiContextMenu__icon"
+                      color="inherit"
                       data-euiicon-type="play"
                     />
                     <span
@@ -173,6 +176,7 @@ exports[`<Settings /> can navigate Autoplay Settings 2`] = `
                   >
                     <span
                       class="euiContextMenu__icon"
+                      color="inherit"
                       data-euiicon-type="boxesHorizontal"
                     />
                     <span
@@ -401,6 +405,7 @@ exports[`<Settings /> can navigate Toolbar Settings, closes when activated 1`] =
                   >
                     <span
                       class="euiContextMenu__icon"
+                      color="inherit"
                       data-euiicon-type="play"
                     />
                     <span
@@ -423,6 +428,7 @@ exports[`<Settings /> can navigate Toolbar Settings, closes when activated 1`] =
                   >
                     <span
                       class="euiContextMenu__icon"
+                      color="inherit"
                       data-euiicon-type="boxesHorizontal"
                     />
                     <span
@@ -499,6 +505,7 @@ exports[`<Settings /> can navigate Toolbar Settings, closes when activated 2`] =
                   >
                     <span
                       class="euiContextMenu__icon"
+                      color="inherit"
                       data-euiicon-type="play"
                     />
                     <span
@@ -521,6 +528,7 @@ exports[`<Settings /> can navigate Toolbar Settings, closes when activated 2`] =
                   >
                     <span
                       class="euiContextMenu__icon"
+                      color="inherit"
                       data-euiicon-type="boxesHorizontal"
                     />
                     <span
@@ -632,4 +640,4 @@ exports[`<Settings /> can navigate Toolbar Settings, closes when activated 2`] =
 </div>
 `;
 
-exports[`<Settings /> can navigate Toolbar Settings, closes when activated 3`] = `"<div><div data-eui=\\"EuiFocusTrap\\"><div class=\\"euiPanel euiPanel--borderRadiusMedium euiPanel--plain euiPanel--noShadow euiPopover__panel euiPopover__panel--top\\" tabindex=\\"0\\" aria-live=\\"off\\" role=\\"dialog\\" aria-modal=\\"true\\" aria-describedby=\\"generated-id\\" style=\\"top: -16px; left: -22px; z-index: 2000;\\"><div class=\\"euiPopover__panelArrow euiPopover__panelArrow--top\\" style=\\"left: 10px; top: 0px;\\"></div><p id=\\"generated-id\\" class=\\"euiScreenReaderOnly\\">You are in a dialog. To close this dialog, hit escape.</p><div><div class=\\"euiContextMenu\\" style=\\"height: 0px;\\"><div class=\\"euiContextMenuPanel euiContextMenu__panel euiContextMenuPanel-txOutLeft\\" tabindex=\\"0\\"><div class=\\"euiContextMenuPanelTitle\\"><span class=\\"euiContextMenu__itemLayout\\">Settings</span></div><div><div><button class=\\"euiContextMenuItem\\" type=\\"button\\"><span class=\\"euiContextMenu__itemLayout\\"><span data-euiicon-type=\\"play\\" class=\\"euiContextMenu__icon\\"></span><span class=\\"euiContextMenuItem__text\\">Auto Play</span><span data-euiicon-type=\\"arrowRight\\" class=\\"euiContextMenu__arrow\\"></span></span></button><button class=\\"euiContextMenuItem\\" type=\\"button\\"><span class=\\"euiContextMenu__itemLayout\\"><span data-euiicon-type=\\"boxesHorizontal\\" class=\\"euiContextMenu__icon\\"></span><span class=\\"euiContextMenuItem__text\\">Toolbar</span><span data-euiicon-type=\\"arrowRight\\" class=\\"euiContextMenu__arrow\\"></span></span></button></div></div></div><div class=\\"euiContextMenuPanel euiContextMenu__panel euiContextMenuPanel-txInLeft\\" tabindex=\\"0\\"><button class=\\"euiContextMenuPanelTitle\\" type=\\"button\\" data-test-subj=\\"contextMenuPanelTitleButton\\"><span class=\\"euiContextMenu__itemLayout\\"><span data-euiicon-type=\\"arrowLeft\\" class=\\"euiContextMenu__icon\\"></span><span class=\\"euiContextMenu__text\\">Toolbar</span></span></button><div><div><div style=\\"padding: 16px;\\"><div class=\\"euiFormRow\\" id=\\"generated-id-row\\"><div class=\\"euiFormRow__fieldWrapper\\"><div class=\\"euiSwitch\\"><button id=\\"generated-id\\" aria-checked=\\"true\\" class=\\"euiSwitch__button\\" role=\\"switch\\" type=\\"button\\" aria-labelledby=\\"generated-id\\" data-test-subj=\\"hideToolbarSwitch\\" name=\\"toolbarHide\\" aria-describedby=\\"generated-id-help\\"><span class=\\"euiSwitch__body\\"><span class=\\"euiSwitch__thumb\\"></span><span class=\\"euiSwitch__track\\"><span data-euiicon-type=\\"cross\\" class=\\"euiSwitch__icon\\"></span><span data-euiicon-type=\\"check\\" class=\\"euiSwitch__icon euiSwitch__icon--checked\\"></span></span></span></button><span class=\\"euiSwitch__label\\" id=\\"generated-id\\">Hide Toolbar</span></div><div class=\\"euiFormHelpText euiFormRow__text\\" id=\\"generated-id-help\\">Hide the toolbar when the mouse is not within the Canvas?</div></div></div></div></div></div></div></div></div></div></div></div>"`;
+exports[`<Settings /> can navigate Toolbar Settings, closes when activated 3`] = `"<div><div data-eui=\\"EuiFocusTrap\\"><div class=\\"euiPanel euiPanel--borderRadiusMedium euiPanel--plain euiPanel--noShadow euiPopover__panel euiPopover__panel--top\\" tabindex=\\"0\\" aria-live=\\"off\\" role=\\"dialog\\" aria-modal=\\"true\\" aria-describedby=\\"generated-id\\" style=\\"top: -16px; left: -22px; z-index: 2000;\\"><div class=\\"euiPopover__panelArrow euiPopover__panelArrow--top\\" style=\\"left: 10px; top: 0px;\\"></div><p id=\\"generated-id\\" class=\\"euiScreenReaderOnly\\">You are in a dialog. To close this dialog, hit escape.</p><div><div class=\\"euiContextMenu\\" style=\\"height: 0px;\\"><div class=\\"euiContextMenuPanel euiContextMenu__panel euiContextMenuPanel-txOutLeft\\" tabindex=\\"0\\"><div class=\\"euiContextMenuPanelTitle\\"><span class=\\"euiContextMenu__itemLayout\\">Settings</span></div><div><div><button class=\\"euiContextMenuItem\\" type=\\"button\\"><span class=\\"euiContextMenu__itemLayout\\"><span data-euiicon-type=\\"play\\" class=\\"euiContextMenu__icon\\" color=\\"inherit\\"></span><span class=\\"euiContextMenuItem__text\\">Auto Play</span><span data-euiicon-type=\\"arrowRight\\" class=\\"euiContextMenu__arrow\\"></span></span></button><button class=\\"euiContextMenuItem\\" type=\\"button\\"><span class=\\"euiContextMenu__itemLayout\\"><span data-euiicon-type=\\"boxesHorizontal\\" class=\\"euiContextMenu__icon\\" color=\\"inherit\\"></span><span class=\\"euiContextMenuItem__text\\">Toolbar</span><span data-euiicon-type=\\"arrowRight\\" class=\\"euiContextMenu__arrow\\"></span></span></button></div></div></div><div class=\\"euiContextMenuPanel euiContextMenu__panel euiContextMenuPanel-txInLeft\\" tabindex=\\"0\\"><button class=\\"euiContextMenuPanelTitle\\" type=\\"button\\" data-test-subj=\\"contextMenuPanelTitleButton\\"><span class=\\"euiContextMenu__itemLayout\\"><span data-euiicon-type=\\"arrowLeft\\" class=\\"euiContextMenu__icon\\"></span><span class=\\"euiContextMenu__text\\">Toolbar</span></span></button><div><div><div style=\\"padding: 16px;\\"><div class=\\"euiFormRow\\" id=\\"generated-id-row\\"><div class=\\"euiFormRow__fieldWrapper\\"><div class=\\"euiSwitch\\"><button id=\\"generated-id\\" aria-checked=\\"true\\" class=\\"euiSwitch__button\\" role=\\"switch\\" type=\\"button\\" aria-labelledby=\\"generated-id\\" data-test-subj=\\"hideToolbarSwitch\\" name=\\"toolbarHide\\" aria-describedby=\\"generated-id-help\\"><span class=\\"euiSwitch__body\\"><span class=\\"euiSwitch__thumb\\"></span><span class=\\"euiSwitch__track\\"><span data-euiicon-type=\\"cross\\" class=\\"euiSwitch__icon\\"></span><span data-euiicon-type=\\"check\\" class=\\"euiSwitch__icon euiSwitch__icon--checked\\"></span></span></span></button><span class=\\"euiSwitch__label\\" id=\\"generated-id\\">Hide Toolbar</span></div><div class=\\"euiFormHelpText euiFormRow__text\\" id=\\"generated-id-help\\">Hide the toolbar when the mouse is not within the Canvas?</div></div></div></div></div></div></div></div></div></div></div></div>"`;
diff --git a/x-pack/plugins/canvas/shareable_runtime/components/footer/settings/__stories__/__snapshots__/settings.stories.storyshot b/x-pack/plugins/canvas/shareable_runtime/components/footer/settings/__stories__/__snapshots__/settings.stories.storyshot
index a522684a978cf..94e871f736fdb 100644
--- a/x-pack/plugins/canvas/shareable_runtime/components/footer/settings/__stories__/__snapshots__/settings.stories.storyshot
+++ b/x-pack/plugins/canvas/shareable_runtime/components/footer/settings/__stories__/__snapshots__/settings.stories.storyshot
@@ -37,6 +37,7 @@ exports[`Storyshots shareables/Footer/Settings component 1`] = `
             <span
               aria-hidden="true"
               className="euiButtonIcon__icon"
+              color="inherit"
               data-euiicon-type="gear"
               size="m"
             />
@@ -85,6 +86,7 @@ exports[`Storyshots shareables/Footer/Settings contextual 1`] = `
             <span
               aria-hidden="true"
               className="euiButtonIcon__icon"
+              color="inherit"
               data-euiicon-type="gear"
               size="m"
             />
diff --git a/x-pack/plugins/data_enhanced/public/search/sessions_mgmt/components/table/table.test.tsx b/x-pack/plugins/data_enhanced/public/search/sessions_mgmt/components/table/table.test.tsx
index 4d97092209c67..42ff270ed44a0 100644
--- a/x-pack/plugins/data_enhanced/public/search/sessions_mgmt/components/table/table.test.tsx
+++ b/x-pack/plugins/data_enhanced/public/search/sessions_mgmt/components/table/table.test.tsx
@@ -97,11 +97,11 @@ describe('Background Search Session Management Table', () => {
 
       expect(table.find('thead th').map((node) => node.text())).toMatchInlineSnapshot(`
         Array [
-          "AppClick to sort in ascending order",
-          "NameClick to sort in ascending order",
-          "StatusClick to sort in ascending order",
-          "CreatedClick to unsort",
-          "ExpirationClick to sort in ascending order",
+          "App",
+          "Name",
+          "Status",
+          "Created",
+          "Expiration",
         ]
       `);
     });
diff --git a/x-pack/plugins/index_lifecycle_management/__jest__/__snapshots__/extend_index_management.test.tsx.snap b/x-pack/plugins/index_lifecycle_management/__jest__/__snapshots__/extend_index_management.test.tsx.snap
index 69d8eee8d9124..6254a6512efb5 100644
--- a/x-pack/plugins/index_lifecycle_management/__jest__/__snapshots__/extend_index_management.test.tsx.snap
+++ b/x-pack/plugins/index_lifecycle_management/__jest__/__snapshots__/extend_index_management.test.tsx.snap
@@ -289,12 +289,14 @@ exports[`extend index management ilm summary extension should return extension w
         <EuiIcon
           aria-hidden="true"
           className="euiCallOutHeader__icon"
+          color="inherit"
           size="m"
           type="cross"
         >
           <span
             aria-hidden="true"
             className="euiCallOutHeader__icon"
+            color="inherit"
             data-euiicon-type="cross"
             size="m"
           />
@@ -367,6 +369,7 @@ exports[`extend index management ilm summary extension should return extension w
                     <EuiButtonContent
                       className="euiButtonEmpty__content"
                       iconSide="left"
+                      iconSize="m"
                       textProps={
                         Object {
                           "className": "euiButtonEmpty__text",
diff --git a/x-pack/plugins/index_lifecycle_management/__jest__/__snapshots__/policy_table.test.tsx.snap b/x-pack/plugins/index_lifecycle_management/__jest__/__snapshots__/policy_table.test.tsx.snap
index 98e0e7e41b236..8d839e196916b 100644
--- a/x-pack/plugins/index_lifecycle_management/__jest__/__snapshots__/policy_table.test.tsx.snap
+++ b/x-pack/plugins/index_lifecycle_management/__jest__/__snapshots__/policy_table.test.tsx.snap
@@ -98,6 +98,7 @@ exports[`policy table should show empty state when there are not any policies 1`
         >
           <span
             class="euiButtonContent__icon"
+            color="inherit"
             data-euiicon-type="plusInCircle"
           />
           <span
diff --git a/x-pack/plugins/infra/public/components/auto_sizer.tsx b/x-pack/plugins/infra/public/components/auto_sizer.tsx
index f8d79ea70e12c..81cce22dad6fd 100644
--- a/x-pack/plugins/infra/public/components/auto_sizer.tsx
+++ b/x-pack/plugins/infra/public/components/auto_sizer.tsx
@@ -56,7 +56,7 @@ export class AutoSizer extends React.PureComponent<AutoSizerProps, AutoSizerStat
     if (this.props.detectAnyWindowResize) {
       window.addEventListener('resize', this.updateMeasurement);
     }
-    this.resizeObserver = new ResizeObserver((entries) => {
+    this.resizeObserver = new ResizeObserver((entries: ResizeObserverEntry[]) => {
       entries.forEach((entry) => {
         if (entry.target === this.element) {
           this.measure(entry);
diff --git a/x-pack/plugins/license_management/__jest__/__snapshots__/upload_license.test.tsx.snap b/x-pack/plugins/license_management/__jest__/__snapshots__/upload_license.test.tsx.snap
index c785ed7c99bda..9f89179d207e0 100644
--- a/x-pack/plugins/license_management/__jest__/__snapshots__/upload_license.test.tsx.snap
+++ b/x-pack/plugins/license_management/__jest__/__snapshots__/upload_license.test.tsx.snap
@@ -348,6 +348,7 @@ exports[`UploadLicense should display a modal when license requires acknowledgem
                                     <span
                                       aria-hidden="true"
                                       class="euiButtonIcon__icon"
+                                      color="inherit"
                                       data-euiicon-type="cross"
                                     />
                                   </button>
@@ -463,12 +464,14 @@ exports[`UploadLicense should display a modal when license requires acknowledgem
                                       <EuiIcon
                                         aria-hidden="true"
                                         className="euiButtonIcon__icon"
+                                        color="inherit"
                                         size="m"
                                         type="cross"
                                       >
                                         <span
                                           aria-hidden="true"
                                           className="euiButtonIcon__icon"
+                                          color="inherit"
                                           data-euiicon-type="cross"
                                           size="m"
                                         />
@@ -561,6 +564,7 @@ exports[`UploadLicense should display a modal when license requires acknowledgem
                                           <EuiButtonContent
                                             className="euiButtonEmpty__content"
                                             iconSide="left"
+                                            iconSize="m"
                                             textProps={
                                               Object {
                                                 "className": "euiButtonEmpty__text",
@@ -836,6 +840,7 @@ exports[`UploadLicense should display a modal when license requires acknowledgem
                                   <EuiButtonContent
                                     className="euiButtonEmpty__content"
                                     iconSide="left"
+                                    iconSize="m"
                                     textProps={
                                       Object {
                                         "className": "euiButtonEmpty__text",
@@ -1565,6 +1570,7 @@ exports[`UploadLicense should display an error when ES says license is expired 1
                                   <EuiButtonContent
                                     className="euiButtonEmpty__content"
                                     iconSide="left"
+                                    iconSize="m"
                                     textProps={
                                       Object {
                                         "className": "euiButtonEmpty__text",
@@ -2294,6 +2300,7 @@ exports[`UploadLicense should display an error when ES says license is invalid 1
                                   <EuiButtonContent
                                     className="euiButtonEmpty__content"
                                     iconSide="left"
+                                    iconSize="m"
                                     textProps={
                                       Object {
                                         "className": "euiButtonEmpty__text",
@@ -3023,6 +3030,7 @@ exports[`UploadLicense should display an error when submitting invalid JSON 1`]
                                   <EuiButtonContent
                                     className="euiButtonEmpty__content"
                                     iconSide="left"
+                                    iconSize="m"
                                     textProps={
                                       Object {
                                         "className": "euiButtonEmpty__text",
@@ -3752,6 +3760,7 @@ exports[`UploadLicense should display error when ES returns error 1`] = `
                                   <EuiButtonContent
                                     className="euiButtonEmpty__content"
                                     iconSide="left"
+                                    iconSize="m"
                                     textProps={
                                       Object {
                                         "className": "euiButtonEmpty__text",
diff --git a/x-pack/plugins/ml/public/embeddables/anomaly_charts/embeddable_anomaly_charts_container.tsx b/x-pack/plugins/ml/public/embeddables/anomaly_charts/embeddable_anomaly_charts_container.tsx
index 7731d9e822e3a..2cba62bee7e3e 100644
--- a/x-pack/plugins/ml/public/embeddables/anomaly_charts/embeddable_anomaly_charts_container.tsx
+++ b/x-pack/plugins/ml/public/embeddables/anomaly_charts/embeddable_anomaly_charts_container.tsx
@@ -98,9 +98,11 @@ export const EmbeddableAnomalyChartsContainer: FC<EmbeddableAnomalyChartsContain
   );
   const resizeHandler = useCallback(
     throttle((e: { width: number; height: number }) => {
-      setChartWidth(e.width);
+      if (Math.abs(chartWidth - e.width) > 20) {
+        setChartWidth(e.width);
+      }
     }, RESIZE_THROTTLE_TIME_MS),
-    []
+    [chartWidth]
   );
 
   if (error) {
@@ -146,7 +148,7 @@ export const EmbeddableAnomalyChartsContainer: FC<EmbeddableAnomalyChartsContain
           id={`mlAnomalyExplorerEmbeddableWrapper-${id}`}
           style={{
             width: '100%',
-            overflowY: 'auto',
+            overflowY: 'hidden',
             overflowX: 'hidden',
             padding: '8px',
           }}
diff --git a/x-pack/plugins/monitoring/public/components/elasticsearch/nodes/__snapshots__/cells.test.js.snap b/x-pack/plugins/monitoring/public/components/elasticsearch/nodes/__snapshots__/cells.test.js.snap
index 7a18ca31830a2..ce94dd2a61a80 100644
--- a/x-pack/plugins/monitoring/public/components/elasticsearch/nodes/__snapshots__/cells.test.js.snap
+++ b/x-pack/plugins/monitoring/public/components/elasticsearch/nodes/__snapshots__/cells.test.js.snap
@@ -41,6 +41,7 @@ exports[`Node Listing Metric Cell should format a non-percentage metric 1`] = `
               <span
                 aria-hidden="true"
                 class="euiButtonIcon__icon"
+                color="inherit"
                 data-euiicon-type="sortDown"
               />
             </button>
@@ -94,6 +95,7 @@ exports[`Node Listing Metric Cell should format a percentage metric 1`] = `
               <span
                 aria-hidden="true"
                 class="euiButtonIcon__icon"
+                color="inherit"
                 data-euiicon-type="sortDown"
               />
             </button>
diff --git a/x-pack/plugins/reporting/public/components/__snapshots__/report_listing.test.tsx.snap b/x-pack/plugins/reporting/public/components/__snapshots__/report_listing.test.tsx.snap
index 670d16ec11548..93df3c8d99935 100644
--- a/x-pack/plugins/reporting/public/components/__snapshots__/report_listing.test.tsx.snap
+++ b/x-pack/plugins/reporting/public/components/__snapshots__/report_listing.test.tsx.snap
@@ -220,18 +220,34 @@ Array [
                         }
                       }
                     >
-                      <div
+                      <CellContents
                         className="euiTableCellContent"
+                        showSortMsg={false}
                       >
-                        <EuiInnerText>
-                          <span
-                            className="euiTableCellContent__text"
-                            title="Report"
-                          >
-                            Report
-                          </span>
-                        </EuiInnerText>
-                      </div>
+                        <span
+                          className="euiTableCellContent"
+                        >
+                          <EuiInnerText>
+                            <EuiI18n
+                              default="{innerText}; {description}"
+                              token="euiTableHeaderCell.titleTextWithDesc"
+                              values={
+                                Object {
+                                  "description": undefined,
+                                  "innerText": "Report",
+                                }
+                              }
+                            >
+                              <span
+                                className="euiTableCellContent__text"
+                                title="Report"
+                              >
+                                Report
+                              </span>
+                            </EuiI18n>
+                          </EuiInnerText>
+                        </span>
+                      </CellContents>
                     </th>
                   </EuiTableHeaderCell>
                   <EuiTableHeaderCell
@@ -250,18 +266,34 @@ Array [
                         }
                       }
                     >
-                      <div
+                      <CellContents
                         className="euiTableCellContent"
+                        showSortMsg={false}
                       >
-                        <EuiInnerText>
-                          <span
-                            className="euiTableCellContent__text"
-                            title="Created at"
-                          >
-                            Created at
-                          </span>
-                        </EuiInnerText>
-                      </div>
+                        <span
+                          className="euiTableCellContent"
+                        >
+                          <EuiInnerText>
+                            <EuiI18n
+                              default="{innerText}; {description}"
+                              token="euiTableHeaderCell.titleTextWithDesc"
+                              values={
+                                Object {
+                                  "description": undefined,
+                                  "innerText": "Created at",
+                                }
+                              }
+                            >
+                              <span
+                                className="euiTableCellContent__text"
+                                title="Created at"
+                              >
+                                Created at
+                              </span>
+                            </EuiI18n>
+                          </EuiInnerText>
+                        </span>
+                      </CellContents>
                     </th>
                   </EuiTableHeaderCell>
                   <EuiTableHeaderCell
@@ -280,18 +312,34 @@ Array [
                         }
                       }
                     >
-                      <div
+                      <CellContents
                         className="euiTableCellContent"
+                        showSortMsg={false}
                       >
-                        <EuiInnerText>
-                          <span
-                            className="euiTableCellContent__text"
-                            title="Status"
-                          >
-                            Status
-                          </span>
-                        </EuiInnerText>
-                      </div>
+                        <span
+                          className="euiTableCellContent"
+                        >
+                          <EuiInnerText>
+                            <EuiI18n
+                              default="{innerText}; {description}"
+                              token="euiTableHeaderCell.titleTextWithDesc"
+                              values={
+                                Object {
+                                  "description": undefined,
+                                  "innerText": "Status",
+                                }
+                              }
+                            >
+                              <span
+                                className="euiTableCellContent__text"
+                                title="Status"
+                              >
+                                Status
+                              </span>
+                            </EuiI18n>
+                          </EuiInnerText>
+                        </span>
+                      </CellContents>
                     </th>
                   </EuiTableHeaderCell>
                   <EuiTableHeaderCell
@@ -308,18 +356,34 @@ Array [
                         }
                       }
                     >
-                      <div
+                      <CellContents
                         className="euiTableCellContent euiTableCellContent--alignRight"
+                        showSortMsg={false}
                       >
-                        <EuiInnerText>
-                          <span
-                            className="euiTableCellContent__text"
-                            title="Actions"
-                          >
-                            Actions
-                          </span>
-                        </EuiInnerText>
-                      </div>
+                        <span
+                          className="euiTableCellContent euiTableCellContent--alignRight"
+                        >
+                          <EuiInnerText>
+                            <EuiI18n
+                              default="{innerText}; {description}"
+                              token="euiTableHeaderCell.titleTextWithDesc"
+                              values={
+                                Object {
+                                  "description": undefined,
+                                  "innerText": "Actions",
+                                }
+                              }
+                            >
+                              <span
+                                className="euiTableCellContent__text"
+                                title="Actions"
+                              >
+                                Actions
+                              </span>
+                            </EuiI18n>
+                          </EuiInnerText>
+                        </span>
+                      </CellContents>
                     </th>
                   </EuiTableHeaderCell>
                 </tr>
@@ -530,18 +594,34 @@ Array [
                       }
                     }
                   >
-                    <div
+                    <CellContents
                       className="euiTableCellContent"
+                      showSortMsg={false}
                     >
-                      <EuiInnerText>
-                        <span
-                          className="euiTableCellContent__text"
-                          title="Report"
-                        >
-                          Report
-                        </span>
-                      </EuiInnerText>
-                    </div>
+                      <span
+                        className="euiTableCellContent"
+                      >
+                        <EuiInnerText>
+                          <EuiI18n
+                            default="{innerText}; {description}"
+                            token="euiTableHeaderCell.titleTextWithDesc"
+                            values={
+                              Object {
+                                "description": undefined,
+                                "innerText": "Report",
+                              }
+                            }
+                          >
+                            <span
+                              className="euiTableCellContent__text"
+                              title="Report"
+                            >
+                              Report
+                            </span>
+                          </EuiI18n>
+                        </EuiInnerText>
+                      </span>
+                    </CellContents>
                   </th>
                 </EuiTableHeaderCell>
                 <EuiTableHeaderCell
@@ -560,18 +640,34 @@ Array [
                       }
                     }
                   >
-                    <div
+                    <CellContents
                       className="euiTableCellContent"
+                      showSortMsg={false}
                     >
-                      <EuiInnerText>
-                        <span
-                          className="euiTableCellContent__text"
-                          title="Created at"
-                        >
-                          Created at
-                        </span>
-                      </EuiInnerText>
-                    </div>
+                      <span
+                        className="euiTableCellContent"
+                      >
+                        <EuiInnerText>
+                          <EuiI18n
+                            default="{innerText}; {description}"
+                            token="euiTableHeaderCell.titleTextWithDesc"
+                            values={
+                              Object {
+                                "description": undefined,
+                                "innerText": "Created at",
+                              }
+                            }
+                          >
+                            <span
+                              className="euiTableCellContent__text"
+                              title="Created at"
+                            >
+                              Created at
+                            </span>
+                          </EuiI18n>
+                        </EuiInnerText>
+                      </span>
+                    </CellContents>
                   </th>
                 </EuiTableHeaderCell>
                 <EuiTableHeaderCell
@@ -590,18 +686,34 @@ Array [
                       }
                     }
                   >
-                    <div
+                    <CellContents
                       className="euiTableCellContent"
+                      showSortMsg={false}
                     >
-                      <EuiInnerText>
-                        <span
-                          className="euiTableCellContent__text"
-                          title="Status"
-                        >
-                          Status
-                        </span>
-                      </EuiInnerText>
-                    </div>
+                      <span
+                        className="euiTableCellContent"
+                      >
+                        <EuiInnerText>
+                          <EuiI18n
+                            default="{innerText}; {description}"
+                            token="euiTableHeaderCell.titleTextWithDesc"
+                            values={
+                              Object {
+                                "description": undefined,
+                                "innerText": "Status",
+                              }
+                            }
+                          >
+                            <span
+                              className="euiTableCellContent__text"
+                              title="Status"
+                            >
+                              Status
+                            </span>
+                          </EuiI18n>
+                        </EuiInnerText>
+                      </span>
+                    </CellContents>
                   </th>
                 </EuiTableHeaderCell>
                 <EuiTableHeaderCell
@@ -618,18 +730,34 @@ Array [
                       }
                     }
                   >
-                    <div
+                    <CellContents
                       className="euiTableCellContent euiTableCellContent--alignRight"
+                      showSortMsg={false}
                     >
-                      <EuiInnerText>
-                        <span
-                          className="euiTableCellContent__text"
-                          title="Actions"
-                        >
-                          Actions
-                        </span>
-                      </EuiInnerText>
-                    </div>
+                      <span
+                        className="euiTableCellContent euiTableCellContent--alignRight"
+                      >
+                        <EuiInnerText>
+                          <EuiI18n
+                            default="{innerText}; {description}"
+                            token="euiTableHeaderCell.titleTextWithDesc"
+                            values={
+                              Object {
+                                "description": undefined,
+                                "innerText": "Actions",
+                              }
+                            }
+                          >
+                            <span
+                              className="euiTableCellContent__text"
+                              title="Actions"
+                            >
+                              Actions
+                            </span>
+                          </EuiI18n>
+                        </EuiInnerText>
+                      </span>
+                    </CellContents>
                   </th>
                 </EuiTableHeaderCell>
               </tr>
diff --git a/x-pack/plugins/reporting/public/components/buttons/__snapshots__/report_info_button.test.tsx.snap b/x-pack/plugins/reporting/public/components/buttons/__snapshots__/report_info_button.test.tsx.snap
index fa8899a22ac74..8c95363a843ec 100644
--- a/x-pack/plugins/reporting/public/components/buttons/__snapshots__/report_info_button.test.tsx.snap
+++ b/x-pack/plugins/reporting/public/components/buttons/__snapshots__/report_info_button.test.tsx.snap
@@ -12,12 +12,14 @@ exports[`ReportInfoButton handles button click flyout on click 1`] = `
   <EuiIcon
     aria-hidden="true"
     className="euiButtonIcon__icon"
+    color="inherit"
     size="m"
     type="iInCircle"
   >
     <span
       aria-hidden="true"
       className="euiButtonIcon__icon"
+      color="inherit"
       data-euiicon-type="iInCircle"
       size="m"
     />
@@ -86,12 +88,14 @@ Array [
                 <EuiIcon
                   aria-hidden="true"
                   className="euiButtonIcon__icon"
+                  color="inherit"
                   size="m"
                   type="cross"
                 >
                   <span
                     aria-hidden="true"
                     className="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="cross"
                     size="m"
                   />
@@ -172,12 +176,14 @@ Array [
           <EuiIcon
             aria-hidden="true"
             className="euiButtonIcon__icon"
+            color="inherit"
             size="m"
             type="cross"
           >
             <span
               aria-hidden="true"
               className="euiButtonIcon__icon"
+              color="inherit"
               data-euiicon-type="cross"
               size="m"
             />
@@ -289,12 +295,14 @@ Array [
                 <EuiIcon
                   aria-hidden="true"
                   className="euiButtonIcon__icon"
+                  color="inherit"
                   size="m"
                   type="cross"
                 >
                   <span
                     aria-hidden="true"
                     className="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="cross"
                     size="m"
                   />
@@ -373,12 +381,14 @@ Array [
           <EuiIcon
             aria-hidden="true"
             className="euiButtonIcon__icon"
+            color="inherit"
             size="m"
             type="cross"
           >
             <span
               aria-hidden="true"
               className="euiButtonIcon__icon"
+              color="inherit"
               data-euiicon-type="cross"
               size="m"
             />
diff --git a/x-pack/plugins/security_solution/cypress/integration/timelines/flyout_button.spec.ts b/x-pack/plugins/security_solution/cypress/integration/timelines/flyout_button.spec.ts
index 1fbd9990a76bd..c7ec17d027e80 100644
--- a/x-pack/plugins/security_solution/cypress/integration/timelines/flyout_button.spec.ts
+++ b/x-pack/plugins/security_solution/cypress/integration/timelines/flyout_button.spec.ts
@@ -61,7 +61,7 @@ describe('timeline flyout button', () => {
 
   it('the `(+)` button popover menu owns focus', () => {
     cy.get(TIMELINE_SETTINGS_ICON).filter(':visible').click({ force: true });
-    cy.get(CREATE_NEW_TIMELINE).closest('.euiPanel').should('have.focus');
+    cy.get(CREATE_NEW_TIMELINE).should('have.focus');
     cy.get('body').type('{esc}');
     cy.get(CREATE_NEW_TIMELINE).should('not.be.visible');
   });
diff --git a/x-pack/plugins/security_solution/cypress/integration/urls/state.spec.ts b/x-pack/plugins/security_solution/cypress/integration/urls/state.spec.ts
index 016197f0c7470..48dc6faf8524e 100644
--- a/x-pack/plugins/security_solution/cypress/integration/urls/state.spec.ts
+++ b/x-pack/plugins/security_solution/cypress/integration/urls/state.spec.ts
@@ -74,6 +74,7 @@ describe('url state', () => {
     waitForIpsTableToBeLoaded();
     setEndDate(ABSOLUTE_DATE.newEndTimeTyped);
     updateDates();
+    cy.wait(300);
 
     let startDate: string;
     let endDate: string;
diff --git a/x-pack/plugins/security_solution/cypress/tasks/timeline.ts b/x-pack/plugins/security_solution/cypress/tasks/timeline.ts
index b1e09c63dc91d..587e4ec45b8c7 100644
--- a/x-pack/plugins/security_solution/cypress/tasks/timeline.ts
+++ b/x-pack/plugins/security_solution/cypress/tasks/timeline.ts
@@ -140,6 +140,7 @@ export const addFilter = (filter: TimelineFilter): Cypress.Chainable<JQuery<HTML
 
 export const addDataProvider = (filter: TimelineFilter): Cypress.Chainable<JQuery<HTMLElement>> => {
   cy.get(TIMELINE_ADD_FIELD_BUTTON).click();
+  cy.wait(300);
   cy.get(TIMELINE_DATA_PROVIDER_FIELD).type(`${filter.field}{downarrow}{enter}`);
   cy.get(TIMELINE_DATA_PROVIDER_OPERATOR).type(filter.operator);
   cy.get(COMBO_BOX).contains(filter.operator).click();
diff --git a/x-pack/plugins/security_solution/public/hosts/components/hosts_table/index.test.tsx b/x-pack/plugins/security_solution/public/hosts/components/hosts_table/index.test.tsx
index 0808238151e03..b1a0d13ed554b 100644
--- a/x-pack/plugins/security_solution/public/hosts/components/hosts_table/index.test.tsx
+++ b/x-pack/plugins/security_solution/public/hosts/components/hosts_table/index.test.tsx
@@ -94,9 +94,7 @@ describe('Hosts Table', () => {
           sortField: 'lastSeen',
           limit: 10,
         });
-        expect(wrapper.find('.euiTable thead tr th button').at(1).text()).toEqual(
-          'Last seen Click to sort in ascending order'
-        );
+        expect(wrapper.find('.euiTable thead tr th button').at(1).text()).toEqual('Last seen ');
         expect(wrapper.find('.euiTable thead tr th button').at(1).find('svg')).toBeTruthy();
       });
 
@@ -111,9 +109,7 @@ describe('Hosts Table', () => {
           sortField: 'hostName',
           limit: 10,
         });
-        expect(wrapper.find('.euiTable thead tr th button').first().text()).toEqual(
-          'Host nameClick to sort in descending order'
-        );
+        expect(wrapper.find('.euiTable thead tr th button').first().text()).toEqual('Host name');
       });
     });
   });
diff --git a/x-pack/plugins/security_solution/public/management/pages/trusted_apps/view/__snapshots__/trusted_app_deletion_dialog.test.tsx.snap b/x-pack/plugins/security_solution/public/management/pages/trusted_apps/view/__snapshots__/trusted_app_deletion_dialog.test.tsx.snap
index 0a1b1d2552302..5ab58914ff8b1 100644
--- a/x-pack/plugins/security_solution/public/management/pages/trusted_apps/view/__snapshots__/trusted_app_deletion_dialog.test.tsx.snap
+++ b/x-pack/plugins/security_solution/public/management/pages/trusted_apps/view/__snapshots__/trusted_app_deletion_dialog.test.tsx.snap
@@ -29,6 +29,7 @@ exports[`TrustedAppDeletionDialog renders correctly when deletion failed 1`] = `
           <span
             aria-hidden="true"
             class="euiButtonIcon__icon"
+            color="inherit"
             data-euiicon-type="cross"
           />
         </button>
@@ -130,6 +131,7 @@ exports[`TrustedAppDeletionDialog renders correctly when deletion is in progress
           <span
             aria-hidden="true"
             class="euiButtonIcon__icon"
+            color="inherit"
             data-euiicon-type="cross"
           />
         </button>
@@ -236,6 +238,7 @@ exports[`TrustedAppDeletionDialog renders correctly when dialog started 1`] = `
           <span
             aria-hidden="true"
             class="euiButtonIcon__icon"
+            color="inherit"
             data-euiicon-type="cross"
           />
         </button>
diff --git a/x-pack/plugins/security_solution/public/management/pages/trusted_apps/view/components/trusted_apps_grid/__snapshots__/index.test.tsx.snap b/x-pack/plugins/security_solution/public/management/pages/trusted_apps/view/components/trusted_apps_grid/__snapshots__/index.test.tsx.snap
index 8d9623c720488..7e89c9723c9dd 100644
--- a/x-pack/plugins/security_solution/public/management/pages/trusted_apps/view/components/trusted_apps_grid/__snapshots__/index.test.tsx.snap
+++ b/x-pack/plugins/security_solution/public/management/pages/trusted_apps/view/components/trusted_apps_grid/__snapshots__/index.test.tsx.snap
@@ -189,6 +189,7 @@ exports[`TrustedAppsGrid renders correctly when failed loading data for the seco
                   >
                     <span
                       class="euiButtonContent__icon"
+                      color="inherit"
                       data-euiicon-type="arrowDown"
                     />
                     <span
@@ -219,6 +220,7 @@ exports[`TrustedAppsGrid renders correctly when failed loading data for the seco
                 <span
                   aria-hidden="true"
                   class="euiButtonIcon__icon"
+                  color="inherit"
                   data-euiicon-type="arrowLeft"
                 />
               </button>
@@ -363,6 +365,7 @@ exports[`TrustedAppsGrid renders correctly when failed loading data for the seco
                 <span
                   aria-hidden="true"
                   class="euiButtonIcon__icon"
+                  color="inherit"
                   data-euiicon-type="arrowRight"
                 />
               </button>
@@ -582,7 +585,7 @@ exports[`TrustedAppsGrid renders correctly when loaded data 1`] = `
                                       scope="col"
                                       style="width: 30%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -591,7 +594,7 @@ exports[`TrustedAppsGrid renders correctly when loaded data 1`] = `
                                         >
                                           Field
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                     <th
                                       class="euiTableHeaderCell"
@@ -600,7 +603,7 @@ exports[`TrustedAppsGrid renders correctly when loaded data 1`] = `
                                       scope="col"
                                       style="width: 20%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -609,7 +612,7 @@ exports[`TrustedAppsGrid renders correctly when loaded data 1`] = `
                                         >
                                           Operator
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                     <th
                                       class="euiTableHeaderCell"
@@ -618,7 +621,7 @@ exports[`TrustedAppsGrid renders correctly when loaded data 1`] = `
                                       scope="col"
                                       style="width: 60%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -627,7 +630,7 @@ exports[`TrustedAppsGrid renders correctly when loaded data 1`] = `
                                         >
                                           Value
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                   </tr>
                                 </thead>
@@ -871,7 +874,7 @@ exports[`TrustedAppsGrid renders correctly when loaded data 1`] = `
                                       scope="col"
                                       style="width: 30%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -880,7 +883,7 @@ exports[`TrustedAppsGrid renders correctly when loaded data 1`] = `
                                         >
                                           Field
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                     <th
                                       class="euiTableHeaderCell"
@@ -889,7 +892,7 @@ exports[`TrustedAppsGrid renders correctly when loaded data 1`] = `
                                       scope="col"
                                       style="width: 20%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -898,7 +901,7 @@ exports[`TrustedAppsGrid renders correctly when loaded data 1`] = `
                                         >
                                           Operator
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                     <th
                                       class="euiTableHeaderCell"
@@ -907,7 +910,7 @@ exports[`TrustedAppsGrid renders correctly when loaded data 1`] = `
                                       scope="col"
                                       style="width: 60%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -916,7 +919,7 @@ exports[`TrustedAppsGrid renders correctly when loaded data 1`] = `
                                         >
                                           Value
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                   </tr>
                                 </thead>
@@ -1160,7 +1163,7 @@ exports[`TrustedAppsGrid renders correctly when loaded data 1`] = `
                                       scope="col"
                                       style="width: 30%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -1169,7 +1172,7 @@ exports[`TrustedAppsGrid renders correctly when loaded data 1`] = `
                                         >
                                           Field
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                     <th
                                       class="euiTableHeaderCell"
@@ -1178,7 +1181,7 @@ exports[`TrustedAppsGrid renders correctly when loaded data 1`] = `
                                       scope="col"
                                       style="width: 20%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -1187,7 +1190,7 @@ exports[`TrustedAppsGrid renders correctly when loaded data 1`] = `
                                         >
                                           Operator
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                     <th
                                       class="euiTableHeaderCell"
@@ -1196,7 +1199,7 @@ exports[`TrustedAppsGrid renders correctly when loaded data 1`] = `
                                       scope="col"
                                       style="width: 60%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -1205,7 +1208,7 @@ exports[`TrustedAppsGrid renders correctly when loaded data 1`] = `
                                         >
                                           Value
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                   </tr>
                                 </thead>
@@ -1449,7 +1452,7 @@ exports[`TrustedAppsGrid renders correctly when loaded data 1`] = `
                                       scope="col"
                                       style="width: 30%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -1458,7 +1461,7 @@ exports[`TrustedAppsGrid renders correctly when loaded data 1`] = `
                                         >
                                           Field
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                     <th
                                       class="euiTableHeaderCell"
@@ -1467,7 +1470,7 @@ exports[`TrustedAppsGrid renders correctly when loaded data 1`] = `
                                       scope="col"
                                       style="width: 20%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -1476,7 +1479,7 @@ exports[`TrustedAppsGrid renders correctly when loaded data 1`] = `
                                         >
                                           Operator
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                     <th
                                       class="euiTableHeaderCell"
@@ -1485,7 +1488,7 @@ exports[`TrustedAppsGrid renders correctly when loaded data 1`] = `
                                       scope="col"
                                       style="width: 60%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -1494,7 +1497,7 @@ exports[`TrustedAppsGrid renders correctly when loaded data 1`] = `
                                         >
                                           Value
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                   </tr>
                                 </thead>
@@ -1738,7 +1741,7 @@ exports[`TrustedAppsGrid renders correctly when loaded data 1`] = `
                                       scope="col"
                                       style="width: 30%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -1747,7 +1750,7 @@ exports[`TrustedAppsGrid renders correctly when loaded data 1`] = `
                                         >
                                           Field
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                     <th
                                       class="euiTableHeaderCell"
@@ -1756,7 +1759,7 @@ exports[`TrustedAppsGrid renders correctly when loaded data 1`] = `
                                       scope="col"
                                       style="width: 20%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -1765,7 +1768,7 @@ exports[`TrustedAppsGrid renders correctly when loaded data 1`] = `
                                         >
                                           Operator
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                     <th
                                       class="euiTableHeaderCell"
@@ -1774,7 +1777,7 @@ exports[`TrustedAppsGrid renders correctly when loaded data 1`] = `
                                       scope="col"
                                       style="width: 60%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -1783,7 +1786,7 @@ exports[`TrustedAppsGrid renders correctly when loaded data 1`] = `
                                         >
                                           Value
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                   </tr>
                                 </thead>
@@ -2027,7 +2030,7 @@ exports[`TrustedAppsGrid renders correctly when loaded data 1`] = `
                                       scope="col"
                                       style="width: 30%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -2036,7 +2039,7 @@ exports[`TrustedAppsGrid renders correctly when loaded data 1`] = `
                                         >
                                           Field
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                     <th
                                       class="euiTableHeaderCell"
@@ -2045,7 +2048,7 @@ exports[`TrustedAppsGrid renders correctly when loaded data 1`] = `
                                       scope="col"
                                       style="width: 20%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -2054,7 +2057,7 @@ exports[`TrustedAppsGrid renders correctly when loaded data 1`] = `
                                         >
                                           Operator
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                     <th
                                       class="euiTableHeaderCell"
@@ -2063,7 +2066,7 @@ exports[`TrustedAppsGrid renders correctly when loaded data 1`] = `
                                       scope="col"
                                       style="width: 60%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -2072,7 +2075,7 @@ exports[`TrustedAppsGrid renders correctly when loaded data 1`] = `
                                         >
                                           Value
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                   </tr>
                                 </thead>
@@ -2316,7 +2319,7 @@ exports[`TrustedAppsGrid renders correctly when loaded data 1`] = `
                                       scope="col"
                                       style="width: 30%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -2325,7 +2328,7 @@ exports[`TrustedAppsGrid renders correctly when loaded data 1`] = `
                                         >
                                           Field
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                     <th
                                       class="euiTableHeaderCell"
@@ -2334,7 +2337,7 @@ exports[`TrustedAppsGrid renders correctly when loaded data 1`] = `
                                       scope="col"
                                       style="width: 20%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -2343,7 +2346,7 @@ exports[`TrustedAppsGrid renders correctly when loaded data 1`] = `
                                         >
                                           Operator
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                     <th
                                       class="euiTableHeaderCell"
@@ -2352,7 +2355,7 @@ exports[`TrustedAppsGrid renders correctly when loaded data 1`] = `
                                       scope="col"
                                       style="width: 60%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -2361,7 +2364,7 @@ exports[`TrustedAppsGrid renders correctly when loaded data 1`] = `
                                         >
                                           Value
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                   </tr>
                                 </thead>
@@ -2605,7 +2608,7 @@ exports[`TrustedAppsGrid renders correctly when loaded data 1`] = `
                                       scope="col"
                                       style="width: 30%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -2614,7 +2617,7 @@ exports[`TrustedAppsGrid renders correctly when loaded data 1`] = `
                                         >
                                           Field
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                     <th
                                       class="euiTableHeaderCell"
@@ -2623,7 +2626,7 @@ exports[`TrustedAppsGrid renders correctly when loaded data 1`] = `
                                       scope="col"
                                       style="width: 20%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -2632,7 +2635,7 @@ exports[`TrustedAppsGrid renders correctly when loaded data 1`] = `
                                         >
                                           Operator
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                     <th
                                       class="euiTableHeaderCell"
@@ -2641,7 +2644,7 @@ exports[`TrustedAppsGrid renders correctly when loaded data 1`] = `
                                       scope="col"
                                       style="width: 60%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -2650,7 +2653,7 @@ exports[`TrustedAppsGrid renders correctly when loaded data 1`] = `
                                         >
                                           Value
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                   </tr>
                                 </thead>
@@ -2894,7 +2897,7 @@ exports[`TrustedAppsGrid renders correctly when loaded data 1`] = `
                                       scope="col"
                                       style="width: 30%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -2903,7 +2906,7 @@ exports[`TrustedAppsGrid renders correctly when loaded data 1`] = `
                                         >
                                           Field
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                     <th
                                       class="euiTableHeaderCell"
@@ -2912,7 +2915,7 @@ exports[`TrustedAppsGrid renders correctly when loaded data 1`] = `
                                       scope="col"
                                       style="width: 20%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -2921,7 +2924,7 @@ exports[`TrustedAppsGrid renders correctly when loaded data 1`] = `
                                         >
                                           Operator
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                     <th
                                       class="euiTableHeaderCell"
@@ -2930,7 +2933,7 @@ exports[`TrustedAppsGrid renders correctly when loaded data 1`] = `
                                       scope="col"
                                       style="width: 60%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -2939,7 +2942,7 @@ exports[`TrustedAppsGrid renders correctly when loaded data 1`] = `
                                         >
                                           Value
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                   </tr>
                                 </thead>
@@ -3183,7 +3186,7 @@ exports[`TrustedAppsGrid renders correctly when loaded data 1`] = `
                                       scope="col"
                                       style="width: 30%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -3192,7 +3195,7 @@ exports[`TrustedAppsGrid renders correctly when loaded data 1`] = `
                                         >
                                           Field
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                     <th
                                       class="euiTableHeaderCell"
@@ -3201,7 +3204,7 @@ exports[`TrustedAppsGrid renders correctly when loaded data 1`] = `
                                       scope="col"
                                       style="width: 20%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -3210,7 +3213,7 @@ exports[`TrustedAppsGrid renders correctly when loaded data 1`] = `
                                         >
                                           Operator
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                     <th
                                       class="euiTableHeaderCell"
@@ -3219,7 +3222,7 @@ exports[`TrustedAppsGrid renders correctly when loaded data 1`] = `
                                       scope="col"
                                       style="width: 60%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -3228,7 +3231,7 @@ exports[`TrustedAppsGrid renders correctly when loaded data 1`] = `
                                         >
                                           Value
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                   </tr>
                                 </thead>
@@ -3341,6 +3344,7 @@ exports[`TrustedAppsGrid renders correctly when loaded data 1`] = `
                   >
                     <span
                       class="euiButtonContent__icon"
+                      color="inherit"
                       data-euiicon-type="arrowDown"
                     />
                     <span
@@ -3371,6 +3375,7 @@ exports[`TrustedAppsGrid renders correctly when loaded data 1`] = `
                 <span
                   aria-hidden="true"
                   class="euiButtonIcon__icon"
+                  color="inherit"
                   data-euiicon-type="arrowLeft"
                 />
               </button>
@@ -3515,6 +3520,7 @@ exports[`TrustedAppsGrid renders correctly when loaded data 1`] = `
                 <span
                   aria-hidden="true"
                   class="euiButtonIcon__icon"
+                  color="inherit"
                   data-euiicon-type="arrowRight"
                 />
               </button>
@@ -3777,7 +3783,7 @@ exports[`TrustedAppsGrid renders correctly when loading data for the second time
                                       scope="col"
                                       style="width: 30%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -3786,7 +3792,7 @@ exports[`TrustedAppsGrid renders correctly when loading data for the second time
                                         >
                                           Field
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                     <th
                                       class="euiTableHeaderCell"
@@ -3795,7 +3801,7 @@ exports[`TrustedAppsGrid renders correctly when loading data for the second time
                                       scope="col"
                                       style="width: 20%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -3804,7 +3810,7 @@ exports[`TrustedAppsGrid renders correctly when loading data for the second time
                                         >
                                           Operator
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                     <th
                                       class="euiTableHeaderCell"
@@ -3813,7 +3819,7 @@ exports[`TrustedAppsGrid renders correctly when loading data for the second time
                                       scope="col"
                                       style="width: 60%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -3822,7 +3828,7 @@ exports[`TrustedAppsGrid renders correctly when loading data for the second time
                                         >
                                           Value
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                   </tr>
                                 </thead>
@@ -4066,7 +4072,7 @@ exports[`TrustedAppsGrid renders correctly when loading data for the second time
                                       scope="col"
                                       style="width: 30%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -4075,7 +4081,7 @@ exports[`TrustedAppsGrid renders correctly when loading data for the second time
                                         >
                                           Field
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                     <th
                                       class="euiTableHeaderCell"
@@ -4084,7 +4090,7 @@ exports[`TrustedAppsGrid renders correctly when loading data for the second time
                                       scope="col"
                                       style="width: 20%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -4093,7 +4099,7 @@ exports[`TrustedAppsGrid renders correctly when loading data for the second time
                                         >
                                           Operator
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                     <th
                                       class="euiTableHeaderCell"
@@ -4102,7 +4108,7 @@ exports[`TrustedAppsGrid renders correctly when loading data for the second time
                                       scope="col"
                                       style="width: 60%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -4111,7 +4117,7 @@ exports[`TrustedAppsGrid renders correctly when loading data for the second time
                                         >
                                           Value
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                   </tr>
                                 </thead>
@@ -4355,7 +4361,7 @@ exports[`TrustedAppsGrid renders correctly when loading data for the second time
                                       scope="col"
                                       style="width: 30%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -4364,7 +4370,7 @@ exports[`TrustedAppsGrid renders correctly when loading data for the second time
                                         >
                                           Field
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                     <th
                                       class="euiTableHeaderCell"
@@ -4373,7 +4379,7 @@ exports[`TrustedAppsGrid renders correctly when loading data for the second time
                                       scope="col"
                                       style="width: 20%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -4382,7 +4388,7 @@ exports[`TrustedAppsGrid renders correctly when loading data for the second time
                                         >
                                           Operator
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                     <th
                                       class="euiTableHeaderCell"
@@ -4391,7 +4397,7 @@ exports[`TrustedAppsGrid renders correctly when loading data for the second time
                                       scope="col"
                                       style="width: 60%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -4400,7 +4406,7 @@ exports[`TrustedAppsGrid renders correctly when loading data for the second time
                                         >
                                           Value
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                   </tr>
                                 </thead>
@@ -4644,7 +4650,7 @@ exports[`TrustedAppsGrid renders correctly when loading data for the second time
                                       scope="col"
                                       style="width: 30%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -4653,7 +4659,7 @@ exports[`TrustedAppsGrid renders correctly when loading data for the second time
                                         >
                                           Field
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                     <th
                                       class="euiTableHeaderCell"
@@ -4662,7 +4668,7 @@ exports[`TrustedAppsGrid renders correctly when loading data for the second time
                                       scope="col"
                                       style="width: 20%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -4671,7 +4677,7 @@ exports[`TrustedAppsGrid renders correctly when loading data for the second time
                                         >
                                           Operator
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                     <th
                                       class="euiTableHeaderCell"
@@ -4680,7 +4686,7 @@ exports[`TrustedAppsGrid renders correctly when loading data for the second time
                                       scope="col"
                                       style="width: 60%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -4689,7 +4695,7 @@ exports[`TrustedAppsGrid renders correctly when loading data for the second time
                                         >
                                           Value
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                   </tr>
                                 </thead>
@@ -4933,7 +4939,7 @@ exports[`TrustedAppsGrid renders correctly when loading data for the second time
                                       scope="col"
                                       style="width: 30%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -4942,7 +4948,7 @@ exports[`TrustedAppsGrid renders correctly when loading data for the second time
                                         >
                                           Field
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                     <th
                                       class="euiTableHeaderCell"
@@ -4951,7 +4957,7 @@ exports[`TrustedAppsGrid renders correctly when loading data for the second time
                                       scope="col"
                                       style="width: 20%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -4960,7 +4966,7 @@ exports[`TrustedAppsGrid renders correctly when loading data for the second time
                                         >
                                           Operator
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                     <th
                                       class="euiTableHeaderCell"
@@ -4969,7 +4975,7 @@ exports[`TrustedAppsGrid renders correctly when loading data for the second time
                                       scope="col"
                                       style="width: 60%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -4978,7 +4984,7 @@ exports[`TrustedAppsGrid renders correctly when loading data for the second time
                                         >
                                           Value
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                   </tr>
                                 </thead>
@@ -5222,7 +5228,7 @@ exports[`TrustedAppsGrid renders correctly when loading data for the second time
                                       scope="col"
                                       style="width: 30%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -5231,7 +5237,7 @@ exports[`TrustedAppsGrid renders correctly when loading data for the second time
                                         >
                                           Field
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                     <th
                                       class="euiTableHeaderCell"
@@ -5240,7 +5246,7 @@ exports[`TrustedAppsGrid renders correctly when loading data for the second time
                                       scope="col"
                                       style="width: 20%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -5249,7 +5255,7 @@ exports[`TrustedAppsGrid renders correctly when loading data for the second time
                                         >
                                           Operator
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                     <th
                                       class="euiTableHeaderCell"
@@ -5258,7 +5264,7 @@ exports[`TrustedAppsGrid renders correctly when loading data for the second time
                                       scope="col"
                                       style="width: 60%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -5267,7 +5273,7 @@ exports[`TrustedAppsGrid renders correctly when loading data for the second time
                                         >
                                           Value
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                   </tr>
                                 </thead>
@@ -5511,7 +5517,7 @@ exports[`TrustedAppsGrid renders correctly when loading data for the second time
                                       scope="col"
                                       style="width: 30%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -5520,7 +5526,7 @@ exports[`TrustedAppsGrid renders correctly when loading data for the second time
                                         >
                                           Field
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                     <th
                                       class="euiTableHeaderCell"
@@ -5529,7 +5535,7 @@ exports[`TrustedAppsGrid renders correctly when loading data for the second time
                                       scope="col"
                                       style="width: 20%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -5538,7 +5544,7 @@ exports[`TrustedAppsGrid renders correctly when loading data for the second time
                                         >
                                           Operator
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                     <th
                                       class="euiTableHeaderCell"
@@ -5547,7 +5553,7 @@ exports[`TrustedAppsGrid renders correctly when loading data for the second time
                                       scope="col"
                                       style="width: 60%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -5556,7 +5562,7 @@ exports[`TrustedAppsGrid renders correctly when loading data for the second time
                                         >
                                           Value
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                   </tr>
                                 </thead>
@@ -5800,7 +5806,7 @@ exports[`TrustedAppsGrid renders correctly when loading data for the second time
                                       scope="col"
                                       style="width: 30%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -5809,7 +5815,7 @@ exports[`TrustedAppsGrid renders correctly when loading data for the second time
                                         >
                                           Field
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                     <th
                                       class="euiTableHeaderCell"
@@ -5818,7 +5824,7 @@ exports[`TrustedAppsGrid renders correctly when loading data for the second time
                                       scope="col"
                                       style="width: 20%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -5827,7 +5833,7 @@ exports[`TrustedAppsGrid renders correctly when loading data for the second time
                                         >
                                           Operator
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                     <th
                                       class="euiTableHeaderCell"
@@ -5836,7 +5842,7 @@ exports[`TrustedAppsGrid renders correctly when loading data for the second time
                                       scope="col"
                                       style="width: 60%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -5845,7 +5851,7 @@ exports[`TrustedAppsGrid renders correctly when loading data for the second time
                                         >
                                           Value
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                   </tr>
                                 </thead>
@@ -6089,7 +6095,7 @@ exports[`TrustedAppsGrid renders correctly when loading data for the second time
                                       scope="col"
                                       style="width: 30%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -6098,7 +6104,7 @@ exports[`TrustedAppsGrid renders correctly when loading data for the second time
                                         >
                                           Field
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                     <th
                                       class="euiTableHeaderCell"
@@ -6107,7 +6113,7 @@ exports[`TrustedAppsGrid renders correctly when loading data for the second time
                                       scope="col"
                                       style="width: 20%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -6116,7 +6122,7 @@ exports[`TrustedAppsGrid renders correctly when loading data for the second time
                                         >
                                           Operator
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                     <th
                                       class="euiTableHeaderCell"
@@ -6125,7 +6131,7 @@ exports[`TrustedAppsGrid renders correctly when loading data for the second time
                                       scope="col"
                                       style="width: 60%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -6134,7 +6140,7 @@ exports[`TrustedAppsGrid renders correctly when loading data for the second time
                                         >
                                           Value
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                   </tr>
                                 </thead>
@@ -6378,7 +6384,7 @@ exports[`TrustedAppsGrid renders correctly when loading data for the second time
                                       scope="col"
                                       style="width: 30%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -6387,7 +6393,7 @@ exports[`TrustedAppsGrid renders correctly when loading data for the second time
                                         >
                                           Field
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                     <th
                                       class="euiTableHeaderCell"
@@ -6396,7 +6402,7 @@ exports[`TrustedAppsGrid renders correctly when loading data for the second time
                                       scope="col"
                                       style="width: 20%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -6405,7 +6411,7 @@ exports[`TrustedAppsGrid renders correctly when loading data for the second time
                                         >
                                           Operator
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                     <th
                                       class="euiTableHeaderCell"
@@ -6414,7 +6420,7 @@ exports[`TrustedAppsGrid renders correctly when loading data for the second time
                                       scope="col"
                                       style="width: 60%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -6423,7 +6429,7 @@ exports[`TrustedAppsGrid renders correctly when loading data for the second time
                                         >
                                           Value
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                   </tr>
                                 </thead>
@@ -6536,6 +6542,7 @@ exports[`TrustedAppsGrid renders correctly when loading data for the second time
                   >
                     <span
                       class="euiButtonContent__icon"
+                      color="inherit"
                       data-euiicon-type="arrowDown"
                     />
                     <span
@@ -6566,6 +6573,7 @@ exports[`TrustedAppsGrid renders correctly when loading data for the second time
                 <span
                   aria-hidden="true"
                   class="euiButtonIcon__icon"
+                  color="inherit"
                   data-euiicon-type="arrowLeft"
                 />
               </button>
@@ -6710,6 +6718,7 @@ exports[`TrustedAppsGrid renders correctly when loading data for the second time
                 <span
                   aria-hidden="true"
                   class="euiButtonIcon__icon"
+                  color="inherit"
                   data-euiicon-type="arrowRight"
                 />
               </button>
@@ -6929,7 +6938,7 @@ exports[`TrustedAppsGrid renders correctly when new page and page size set (not
                                       scope="col"
                                       style="width: 30%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -6938,7 +6947,7 @@ exports[`TrustedAppsGrid renders correctly when new page and page size set (not
                                         >
                                           Field
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                     <th
                                       class="euiTableHeaderCell"
@@ -6947,7 +6956,7 @@ exports[`TrustedAppsGrid renders correctly when new page and page size set (not
                                       scope="col"
                                       style="width: 20%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -6956,7 +6965,7 @@ exports[`TrustedAppsGrid renders correctly when new page and page size set (not
                                         >
                                           Operator
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                     <th
                                       class="euiTableHeaderCell"
@@ -6965,7 +6974,7 @@ exports[`TrustedAppsGrid renders correctly when new page and page size set (not
                                       scope="col"
                                       style="width: 60%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -6974,7 +6983,7 @@ exports[`TrustedAppsGrid renders correctly when new page and page size set (not
                                         >
                                           Value
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                   </tr>
                                 </thead>
@@ -7218,7 +7227,7 @@ exports[`TrustedAppsGrid renders correctly when new page and page size set (not
                                       scope="col"
                                       style="width: 30%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -7227,7 +7236,7 @@ exports[`TrustedAppsGrid renders correctly when new page and page size set (not
                                         >
                                           Field
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                     <th
                                       class="euiTableHeaderCell"
@@ -7236,7 +7245,7 @@ exports[`TrustedAppsGrid renders correctly when new page and page size set (not
                                       scope="col"
                                       style="width: 20%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -7245,7 +7254,7 @@ exports[`TrustedAppsGrid renders correctly when new page and page size set (not
                                         >
                                           Operator
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                     <th
                                       class="euiTableHeaderCell"
@@ -7254,7 +7263,7 @@ exports[`TrustedAppsGrid renders correctly when new page and page size set (not
                                       scope="col"
                                       style="width: 60%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -7263,7 +7272,7 @@ exports[`TrustedAppsGrid renders correctly when new page and page size set (not
                                         >
                                           Value
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                   </tr>
                                 </thead>
@@ -7507,7 +7516,7 @@ exports[`TrustedAppsGrid renders correctly when new page and page size set (not
                                       scope="col"
                                       style="width: 30%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -7516,7 +7525,7 @@ exports[`TrustedAppsGrid renders correctly when new page and page size set (not
                                         >
                                           Field
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                     <th
                                       class="euiTableHeaderCell"
@@ -7525,7 +7534,7 @@ exports[`TrustedAppsGrid renders correctly when new page and page size set (not
                                       scope="col"
                                       style="width: 20%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -7534,7 +7543,7 @@ exports[`TrustedAppsGrid renders correctly when new page and page size set (not
                                         >
                                           Operator
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                     <th
                                       class="euiTableHeaderCell"
@@ -7543,7 +7552,7 @@ exports[`TrustedAppsGrid renders correctly when new page and page size set (not
                                       scope="col"
                                       style="width: 60%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -7552,7 +7561,7 @@ exports[`TrustedAppsGrid renders correctly when new page and page size set (not
                                         >
                                           Value
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                   </tr>
                                 </thead>
@@ -7796,7 +7805,7 @@ exports[`TrustedAppsGrid renders correctly when new page and page size set (not
                                       scope="col"
                                       style="width: 30%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -7805,7 +7814,7 @@ exports[`TrustedAppsGrid renders correctly when new page and page size set (not
                                         >
                                           Field
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                     <th
                                       class="euiTableHeaderCell"
@@ -7814,7 +7823,7 @@ exports[`TrustedAppsGrid renders correctly when new page and page size set (not
                                       scope="col"
                                       style="width: 20%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -7823,7 +7832,7 @@ exports[`TrustedAppsGrid renders correctly when new page and page size set (not
                                         >
                                           Operator
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                     <th
                                       class="euiTableHeaderCell"
@@ -7832,7 +7841,7 @@ exports[`TrustedAppsGrid renders correctly when new page and page size set (not
                                       scope="col"
                                       style="width: 60%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -7841,7 +7850,7 @@ exports[`TrustedAppsGrid renders correctly when new page and page size set (not
                                         >
                                           Value
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                   </tr>
                                 </thead>
@@ -8085,7 +8094,7 @@ exports[`TrustedAppsGrid renders correctly when new page and page size set (not
                                       scope="col"
                                       style="width: 30%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -8094,7 +8103,7 @@ exports[`TrustedAppsGrid renders correctly when new page and page size set (not
                                         >
                                           Field
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                     <th
                                       class="euiTableHeaderCell"
@@ -8103,7 +8112,7 @@ exports[`TrustedAppsGrid renders correctly when new page and page size set (not
                                       scope="col"
                                       style="width: 20%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -8112,7 +8121,7 @@ exports[`TrustedAppsGrid renders correctly when new page and page size set (not
                                         >
                                           Operator
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                     <th
                                       class="euiTableHeaderCell"
@@ -8121,7 +8130,7 @@ exports[`TrustedAppsGrid renders correctly when new page and page size set (not
                                       scope="col"
                                       style="width: 60%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -8130,7 +8139,7 @@ exports[`TrustedAppsGrid renders correctly when new page and page size set (not
                                         >
                                           Value
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                   </tr>
                                 </thead>
@@ -8374,7 +8383,7 @@ exports[`TrustedAppsGrid renders correctly when new page and page size set (not
                                       scope="col"
                                       style="width: 30%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -8383,7 +8392,7 @@ exports[`TrustedAppsGrid renders correctly when new page and page size set (not
                                         >
                                           Field
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                     <th
                                       class="euiTableHeaderCell"
@@ -8392,7 +8401,7 @@ exports[`TrustedAppsGrid renders correctly when new page and page size set (not
                                       scope="col"
                                       style="width: 20%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -8401,7 +8410,7 @@ exports[`TrustedAppsGrid renders correctly when new page and page size set (not
                                         >
                                           Operator
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                     <th
                                       class="euiTableHeaderCell"
@@ -8410,7 +8419,7 @@ exports[`TrustedAppsGrid renders correctly when new page and page size set (not
                                       scope="col"
                                       style="width: 60%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -8419,7 +8428,7 @@ exports[`TrustedAppsGrid renders correctly when new page and page size set (not
                                         >
                                           Value
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                   </tr>
                                 </thead>
@@ -8663,7 +8672,7 @@ exports[`TrustedAppsGrid renders correctly when new page and page size set (not
                                       scope="col"
                                       style="width: 30%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -8672,7 +8681,7 @@ exports[`TrustedAppsGrid renders correctly when new page and page size set (not
                                         >
                                           Field
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                     <th
                                       class="euiTableHeaderCell"
@@ -8681,7 +8690,7 @@ exports[`TrustedAppsGrid renders correctly when new page and page size set (not
                                       scope="col"
                                       style="width: 20%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -8690,7 +8699,7 @@ exports[`TrustedAppsGrid renders correctly when new page and page size set (not
                                         >
                                           Operator
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                     <th
                                       class="euiTableHeaderCell"
@@ -8699,7 +8708,7 @@ exports[`TrustedAppsGrid renders correctly when new page and page size set (not
                                       scope="col"
                                       style="width: 60%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -8708,7 +8717,7 @@ exports[`TrustedAppsGrid renders correctly when new page and page size set (not
                                         >
                                           Value
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                   </tr>
                                 </thead>
@@ -8952,7 +8961,7 @@ exports[`TrustedAppsGrid renders correctly when new page and page size set (not
                                       scope="col"
                                       style="width: 30%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -8961,7 +8970,7 @@ exports[`TrustedAppsGrid renders correctly when new page and page size set (not
                                         >
                                           Field
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                     <th
                                       class="euiTableHeaderCell"
@@ -8970,7 +8979,7 @@ exports[`TrustedAppsGrid renders correctly when new page and page size set (not
                                       scope="col"
                                       style="width: 20%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -8979,7 +8988,7 @@ exports[`TrustedAppsGrid renders correctly when new page and page size set (not
                                         >
                                           Operator
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                     <th
                                       class="euiTableHeaderCell"
@@ -8988,7 +8997,7 @@ exports[`TrustedAppsGrid renders correctly when new page and page size set (not
                                       scope="col"
                                       style="width: 60%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -8997,7 +9006,7 @@ exports[`TrustedAppsGrid renders correctly when new page and page size set (not
                                         >
                                           Value
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                   </tr>
                                 </thead>
@@ -9241,7 +9250,7 @@ exports[`TrustedAppsGrid renders correctly when new page and page size set (not
                                       scope="col"
                                       style="width: 30%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -9250,7 +9259,7 @@ exports[`TrustedAppsGrid renders correctly when new page and page size set (not
                                         >
                                           Field
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                     <th
                                       class="euiTableHeaderCell"
@@ -9259,7 +9268,7 @@ exports[`TrustedAppsGrid renders correctly when new page and page size set (not
                                       scope="col"
                                       style="width: 20%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -9268,7 +9277,7 @@ exports[`TrustedAppsGrid renders correctly when new page and page size set (not
                                         >
                                           Operator
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                     <th
                                       class="euiTableHeaderCell"
@@ -9277,7 +9286,7 @@ exports[`TrustedAppsGrid renders correctly when new page and page size set (not
                                       scope="col"
                                       style="width: 60%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -9286,7 +9295,7 @@ exports[`TrustedAppsGrid renders correctly when new page and page size set (not
                                         >
                                           Value
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                   </tr>
                                 </thead>
@@ -9530,7 +9539,7 @@ exports[`TrustedAppsGrid renders correctly when new page and page size set (not
                                       scope="col"
                                       style="width: 30%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -9539,7 +9548,7 @@ exports[`TrustedAppsGrid renders correctly when new page and page size set (not
                                         >
                                           Field
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                     <th
                                       class="euiTableHeaderCell"
@@ -9548,7 +9557,7 @@ exports[`TrustedAppsGrid renders correctly when new page and page size set (not
                                       scope="col"
                                       style="width: 20%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -9557,7 +9566,7 @@ exports[`TrustedAppsGrid renders correctly when new page and page size set (not
                                         >
                                           Operator
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                     <th
                                       class="euiTableHeaderCell"
@@ -9566,7 +9575,7 @@ exports[`TrustedAppsGrid renders correctly when new page and page size set (not
                                       scope="col"
                                       style="width: 60%;"
                                     >
-                                      <div
+                                      <span
                                         class="euiTableCellContent"
                                       >
                                         <span
@@ -9575,7 +9584,7 @@ exports[`TrustedAppsGrid renders correctly when new page and page size set (not
                                         >
                                           Value
                                         </span>
-                                      </div>
+                                      </span>
                                     </th>
                                   </tr>
                                 </thead>
@@ -9688,6 +9697,7 @@ exports[`TrustedAppsGrid renders correctly when new page and page size set (not
                   >
                     <span
                       class="euiButtonContent__icon"
+                      color="inherit"
                       data-euiicon-type="arrowDown"
                     />
                     <span
@@ -9717,6 +9727,7 @@ exports[`TrustedAppsGrid renders correctly when new page and page size set (not
                 <span
                   aria-hidden="true"
                   class="euiButtonIcon__icon"
+                  color="inherit"
                   data-euiicon-type="arrowLeft"
                 />
               </button>
@@ -9815,6 +9826,7 @@ exports[`TrustedAppsGrid renders correctly when new page and page size set (not
                 <span
                   aria-hidden="true"
                   class="euiButtonIcon__icon"
+                  color="inherit"
                   data-euiicon-type="arrowRight"
                 />
               </button>
diff --git a/x-pack/plugins/security_solution/public/management/pages/trusted_apps/view/components/trusted_apps_list/__snapshots__/index.test.tsx.snap b/x-pack/plugins/security_solution/public/management/pages/trusted_apps/view/components/trusted_apps_list/__snapshots__/index.test.tsx.snap
index c4f2a74ea173d..2bb498ee2d463 100644
--- a/x-pack/plugins/security_solution/public/management/pages/trusted_apps/view/components/trusted_apps_list/__snapshots__/index.test.tsx.snap
+++ b/x-pack/plugins/security_solution/public/management/pages/trusted_apps/view/components/trusted_apps_list/__snapshots__/index.test.tsx.snap
@@ -37,7 +37,7 @@ exports[`TrustedAppsList renders correctly initially 1`] = `
               role="columnheader"
               scope="col"
             >
-              <div
+              <span
                 class="euiTableCellContent"
               >
                 <span
@@ -46,7 +46,7 @@ exports[`TrustedAppsList renders correctly initially 1`] = `
                 >
                   Name
                 </span>
-              </div>
+              </span>
             </th>
             <th
               class="euiTableHeaderCell"
@@ -54,7 +54,7 @@ exports[`TrustedAppsList renders correctly initially 1`] = `
               role="columnheader"
               scope="col"
             >
-              <div
+              <span
                 class="euiTableCellContent"
               >
                 <span
@@ -63,7 +63,7 @@ exports[`TrustedAppsList renders correctly initially 1`] = `
                 >
                   OS
                 </span>
-              </div>
+              </span>
             </th>
             <th
               class="euiTableHeaderCell"
@@ -71,7 +71,7 @@ exports[`TrustedAppsList renders correctly initially 1`] = `
               role="columnheader"
               scope="col"
             >
-              <div
+              <span
                 class="euiTableCellContent"
               >
                 <span
@@ -80,7 +80,7 @@ exports[`TrustedAppsList renders correctly initially 1`] = `
                 >
                   Date Created
                 </span>
-              </div>
+              </span>
             </th>
             <th
               class="euiTableHeaderCell"
@@ -88,7 +88,7 @@ exports[`TrustedAppsList renders correctly initially 1`] = `
               role="columnheader"
               scope="col"
             >
-              <div
+              <span
                 class="euiTableCellContent"
               >
                 <span
@@ -97,14 +97,14 @@ exports[`TrustedAppsList renders correctly initially 1`] = `
                 >
                   Created By
                 </span>
-              </div>
+              </span>
             </th>
             <th
               class="euiTableHeaderCell"
               role="columnheader"
               scope="col"
             >
-              <div
+              <span
                 class="euiTableCellContent euiTableCellContent--alignRight"
               >
                 <span
@@ -113,7 +113,7 @@ exports[`TrustedAppsList renders correctly initially 1`] = `
                 >
                   Actions
                 </span>
-              </div>
+              </span>
             </th>
             <td
               class="euiTableHeaderCell"
@@ -122,13 +122,13 @@ exports[`TrustedAppsList renders correctly initially 1`] = `
               scope="col"
               style="width: 40px;"
             >
-              <div
+              <span
                 class="euiTableCellContent euiTableCellContent--alignRight"
               >
                 <span
                   class="euiTableCellContent__text"
                 />
-              </div>
+              </span>
             </td>
           </tr>
         </thead>
@@ -195,7 +195,7 @@ exports[`TrustedAppsList renders correctly when failed loading data for the firs
               role="columnheader"
               scope="col"
             >
-              <div
+              <span
                 class="euiTableCellContent"
               >
                 <span
@@ -204,7 +204,7 @@ exports[`TrustedAppsList renders correctly when failed loading data for the firs
                 >
                   Name
                 </span>
-              </div>
+              </span>
             </th>
             <th
               class="euiTableHeaderCell"
@@ -212,7 +212,7 @@ exports[`TrustedAppsList renders correctly when failed loading data for the firs
               role="columnheader"
               scope="col"
             >
-              <div
+              <span
                 class="euiTableCellContent"
               >
                 <span
@@ -221,7 +221,7 @@ exports[`TrustedAppsList renders correctly when failed loading data for the firs
                 >
                   OS
                 </span>
-              </div>
+              </span>
             </th>
             <th
               class="euiTableHeaderCell"
@@ -229,7 +229,7 @@ exports[`TrustedAppsList renders correctly when failed loading data for the firs
               role="columnheader"
               scope="col"
             >
-              <div
+              <span
                 class="euiTableCellContent"
               >
                 <span
@@ -238,7 +238,7 @@ exports[`TrustedAppsList renders correctly when failed loading data for the firs
                 >
                   Date Created
                 </span>
-              </div>
+              </span>
             </th>
             <th
               class="euiTableHeaderCell"
@@ -246,7 +246,7 @@ exports[`TrustedAppsList renders correctly when failed loading data for the firs
               role="columnheader"
               scope="col"
             >
-              <div
+              <span
                 class="euiTableCellContent"
               >
                 <span
@@ -255,14 +255,14 @@ exports[`TrustedAppsList renders correctly when failed loading data for the firs
                 >
                   Created By
                 </span>
-              </div>
+              </span>
             </th>
             <th
               class="euiTableHeaderCell"
               role="columnheader"
               scope="col"
             >
-              <div
+              <span
                 class="euiTableCellContent euiTableCellContent--alignRight"
               >
                 <span
@@ -271,7 +271,7 @@ exports[`TrustedAppsList renders correctly when failed loading data for the firs
                 >
                   Actions
                 </span>
-              </div>
+              </span>
             </th>
             <td
               class="euiTableHeaderCell"
@@ -280,13 +280,13 @@ exports[`TrustedAppsList renders correctly when failed loading data for the firs
               scope="col"
               style="width: 40px;"
             >
-              <div
+              <span
                 class="euiTableCellContent euiTableCellContent--alignRight"
               >
                 <span
                   class="euiTableCellContent__text"
                 />
-              </div>
+              </span>
             </td>
           </tr>
         </thead>
@@ -358,7 +358,7 @@ exports[`TrustedAppsList renders correctly when failed loading data for the seco
               role="columnheader"
               scope="col"
             >
-              <div
+              <span
                 class="euiTableCellContent"
               >
                 <span
@@ -367,7 +367,7 @@ exports[`TrustedAppsList renders correctly when failed loading data for the seco
                 >
                   Name
                 </span>
-              </div>
+              </span>
             </th>
             <th
               class="euiTableHeaderCell"
@@ -375,7 +375,7 @@ exports[`TrustedAppsList renders correctly when failed loading data for the seco
               role="columnheader"
               scope="col"
             >
-              <div
+              <span
                 class="euiTableCellContent"
               >
                 <span
@@ -384,7 +384,7 @@ exports[`TrustedAppsList renders correctly when failed loading data for the seco
                 >
                   OS
                 </span>
-              </div>
+              </span>
             </th>
             <th
               class="euiTableHeaderCell"
@@ -392,7 +392,7 @@ exports[`TrustedAppsList renders correctly when failed loading data for the seco
               role="columnheader"
               scope="col"
             >
-              <div
+              <span
                 class="euiTableCellContent"
               >
                 <span
@@ -401,7 +401,7 @@ exports[`TrustedAppsList renders correctly when failed loading data for the seco
                 >
                   Date Created
                 </span>
-              </div>
+              </span>
             </th>
             <th
               class="euiTableHeaderCell"
@@ -409,7 +409,7 @@ exports[`TrustedAppsList renders correctly when failed loading data for the seco
               role="columnheader"
               scope="col"
             >
-              <div
+              <span
                 class="euiTableCellContent"
               >
                 <span
@@ -418,14 +418,14 @@ exports[`TrustedAppsList renders correctly when failed loading data for the seco
                 >
                   Created By
                 </span>
-              </div>
+              </span>
             </th>
             <th
               class="euiTableHeaderCell"
               role="columnheader"
               scope="col"
             >
-              <div
+              <span
                 class="euiTableCellContent euiTableCellContent--alignRight"
               >
                 <span
@@ -434,7 +434,7 @@ exports[`TrustedAppsList renders correctly when failed loading data for the seco
                 >
                   Actions
                 </span>
-              </div>
+              </span>
             </th>
             <td
               class="euiTableHeaderCell"
@@ -443,13 +443,13 @@ exports[`TrustedAppsList renders correctly when failed loading data for the seco
               scope="col"
               style="width: 40px;"
             >
-              <div
+              <span
                 class="euiTableCellContent euiTableCellContent--alignRight"
               >
                 <span
                   class="euiTableCellContent__text"
                 />
-              </div>
+              </span>
             </td>
           </tr>
         </thead>
@@ -533,7 +533,7 @@ exports[`TrustedAppsList renders correctly when item details expanded 1`] = `
               role="columnheader"
               scope="col"
             >
-              <div
+              <span
                 class="euiTableCellContent"
               >
                 <span
@@ -542,7 +542,7 @@ exports[`TrustedAppsList renders correctly when item details expanded 1`] = `
                 >
                   Name
                 </span>
-              </div>
+              </span>
             </th>
             <th
               class="euiTableHeaderCell"
@@ -550,7 +550,7 @@ exports[`TrustedAppsList renders correctly when item details expanded 1`] = `
               role="columnheader"
               scope="col"
             >
-              <div
+              <span
                 class="euiTableCellContent"
               >
                 <span
@@ -559,7 +559,7 @@ exports[`TrustedAppsList renders correctly when item details expanded 1`] = `
                 >
                   OS
                 </span>
-              </div>
+              </span>
             </th>
             <th
               class="euiTableHeaderCell"
@@ -567,7 +567,7 @@ exports[`TrustedAppsList renders correctly when item details expanded 1`] = `
               role="columnheader"
               scope="col"
             >
-              <div
+              <span
                 class="euiTableCellContent"
               >
                 <span
@@ -576,7 +576,7 @@ exports[`TrustedAppsList renders correctly when item details expanded 1`] = `
                 >
                   Date Created
                 </span>
-              </div>
+              </span>
             </th>
             <th
               class="euiTableHeaderCell"
@@ -584,7 +584,7 @@ exports[`TrustedAppsList renders correctly when item details expanded 1`] = `
               role="columnheader"
               scope="col"
             >
-              <div
+              <span
                 class="euiTableCellContent"
               >
                 <span
@@ -593,14 +593,14 @@ exports[`TrustedAppsList renders correctly when item details expanded 1`] = `
                 >
                   Created By
                 </span>
-              </div>
+              </span>
             </th>
             <th
               class="euiTableHeaderCell"
               role="columnheader"
               scope="col"
             >
-              <div
+              <span
                 class="euiTableCellContent euiTableCellContent--alignRight"
               >
                 <span
@@ -609,7 +609,7 @@ exports[`TrustedAppsList renders correctly when item details expanded 1`] = `
                 >
                   Actions
                 </span>
-              </div>
+              </span>
             </th>
             <td
               class="euiTableHeaderCell"
@@ -618,13 +618,13 @@ exports[`TrustedAppsList renders correctly when item details expanded 1`] = `
               scope="col"
               style="width: 40px;"
             >
-              <div
+              <span
                 class="euiTableCellContent euiTableCellContent--alignRight"
               >
                 <span
                   class="euiTableCellContent__text"
                 />
-              </div>
+              </span>
             </td>
           </tr>
         </thead>
@@ -726,6 +726,7 @@ exports[`TrustedAppsList renders correctly when item details expanded 1`] = `
                     <span
                       aria-hidden="true"
                       class="euiButtonIcon__icon"
+                      color="inherit"
                       data-euiicon-type="trash"
                     />
                   </button>
@@ -754,6 +755,7 @@ exports[`TrustedAppsList renders correctly when item details expanded 1`] = `
                   <span
                     aria-hidden="true"
                     class="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="arrowUp"
                   />
                 </button>
@@ -931,7 +933,7 @@ exports[`TrustedAppsList renders correctly when item details expanded 1`] = `
                                             scope="col"
                                             style="width: 30%;"
                                           >
-                                            <div
+                                            <span
                                               class="euiTableCellContent"
                                             >
                                               <span
@@ -939,7 +941,7 @@ exports[`TrustedAppsList renders correctly when item details expanded 1`] = `
                                               >
                                                 Field
                                               </span>
-                                            </div>
+                                            </span>
                                           </th>
                                           <th
                                             class="euiTableHeaderCell"
@@ -948,7 +950,7 @@ exports[`TrustedAppsList renders correctly when item details expanded 1`] = `
                                             scope="col"
                                             style="width: 20%;"
                                           >
-                                            <div
+                                            <span
                                               class="euiTableCellContent"
                                             >
                                               <span
@@ -956,7 +958,7 @@ exports[`TrustedAppsList renders correctly when item details expanded 1`] = `
                                               >
                                                 Operator
                                               </span>
-                                            </div>
+                                            </span>
                                           </th>
                                           <th
                                             class="euiTableHeaderCell"
@@ -965,7 +967,7 @@ exports[`TrustedAppsList renders correctly when item details expanded 1`] = `
                                             scope="col"
                                             style="width: 60%;"
                                           >
-                                            <div
+                                            <span
                                               class="euiTableCellContent"
                                             >
                                               <span
@@ -973,7 +975,7 @@ exports[`TrustedAppsList renders correctly when item details expanded 1`] = `
                                               >
                                                 Value
                                               </span>
-                                            </div>
+                                            </span>
                                           </th>
                                         </tr>
                                       </thead>
@@ -1157,6 +1159,7 @@ exports[`TrustedAppsList renders correctly when item details expanded 1`] = `
                     <span
                       aria-hidden="true"
                       class="euiButtonIcon__icon"
+                      color="inherit"
                       data-euiicon-type="trash"
                     />
                   </button>
@@ -1185,6 +1188,7 @@ exports[`TrustedAppsList renders correctly when item details expanded 1`] = `
                   <span
                     aria-hidden="true"
                     class="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
                   />
                 </button>
@@ -1287,6 +1291,7 @@ exports[`TrustedAppsList renders correctly when item details expanded 1`] = `
                     <span
                       aria-hidden="true"
                       class="euiButtonIcon__icon"
+                      color="inherit"
                       data-euiicon-type="trash"
                     />
                   </button>
@@ -1315,6 +1320,7 @@ exports[`TrustedAppsList renders correctly when item details expanded 1`] = `
                   <span
                     aria-hidden="true"
                     class="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
                   />
                 </button>
@@ -1417,6 +1423,7 @@ exports[`TrustedAppsList renders correctly when item details expanded 1`] = `
                     <span
                       aria-hidden="true"
                       class="euiButtonIcon__icon"
+                      color="inherit"
                       data-euiicon-type="trash"
                     />
                   </button>
@@ -1445,6 +1452,7 @@ exports[`TrustedAppsList renders correctly when item details expanded 1`] = `
                   <span
                     aria-hidden="true"
                     class="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
                   />
                 </button>
@@ -1547,6 +1555,7 @@ exports[`TrustedAppsList renders correctly when item details expanded 1`] = `
                     <span
                       aria-hidden="true"
                       class="euiButtonIcon__icon"
+                      color="inherit"
                       data-euiicon-type="trash"
                     />
                   </button>
@@ -1575,6 +1584,7 @@ exports[`TrustedAppsList renders correctly when item details expanded 1`] = `
                   <span
                     aria-hidden="true"
                     class="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
                   />
                 </button>
@@ -1677,6 +1687,7 @@ exports[`TrustedAppsList renders correctly when item details expanded 1`] = `
                     <span
                       aria-hidden="true"
                       class="euiButtonIcon__icon"
+                      color="inherit"
                       data-euiicon-type="trash"
                     />
                   </button>
@@ -1705,6 +1716,7 @@ exports[`TrustedAppsList renders correctly when item details expanded 1`] = `
                   <span
                     aria-hidden="true"
                     class="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
                   />
                 </button>
@@ -1807,6 +1819,7 @@ exports[`TrustedAppsList renders correctly when item details expanded 1`] = `
                     <span
                       aria-hidden="true"
                       class="euiButtonIcon__icon"
+                      color="inherit"
                       data-euiicon-type="trash"
                     />
                   </button>
@@ -1835,6 +1848,7 @@ exports[`TrustedAppsList renders correctly when item details expanded 1`] = `
                   <span
                     aria-hidden="true"
                     class="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
                   />
                 </button>
@@ -1937,6 +1951,7 @@ exports[`TrustedAppsList renders correctly when item details expanded 1`] = `
                     <span
                       aria-hidden="true"
                       class="euiButtonIcon__icon"
+                      color="inherit"
                       data-euiicon-type="trash"
                     />
                   </button>
@@ -1965,6 +1980,7 @@ exports[`TrustedAppsList renders correctly when item details expanded 1`] = `
                   <span
                     aria-hidden="true"
                     class="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
                   />
                 </button>
@@ -2067,6 +2083,7 @@ exports[`TrustedAppsList renders correctly when item details expanded 1`] = `
                     <span
                       aria-hidden="true"
                       class="euiButtonIcon__icon"
+                      color="inherit"
                       data-euiicon-type="trash"
                     />
                   </button>
@@ -2095,6 +2112,7 @@ exports[`TrustedAppsList renders correctly when item details expanded 1`] = `
                   <span
                     aria-hidden="true"
                     class="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
                   />
                 </button>
@@ -2197,6 +2215,7 @@ exports[`TrustedAppsList renders correctly when item details expanded 1`] = `
                     <span
                       aria-hidden="true"
                       class="euiButtonIcon__icon"
+                      color="inherit"
                       data-euiicon-type="trash"
                     />
                   </button>
@@ -2225,6 +2244,7 @@ exports[`TrustedAppsList renders correctly when item details expanded 1`] = `
                   <span
                     aria-hidden="true"
                     class="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
                   />
                 </button>
@@ -2327,6 +2347,7 @@ exports[`TrustedAppsList renders correctly when item details expanded 1`] = `
                     <span
                       aria-hidden="true"
                       class="euiButtonIcon__icon"
+                      color="inherit"
                       data-euiicon-type="trash"
                     />
                   </button>
@@ -2355,6 +2376,7 @@ exports[`TrustedAppsList renders correctly when item details expanded 1`] = `
                   <span
                     aria-hidden="true"
                     class="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
                   />
                 </button>
@@ -2457,6 +2479,7 @@ exports[`TrustedAppsList renders correctly when item details expanded 1`] = `
                     <span
                       aria-hidden="true"
                       class="euiButtonIcon__icon"
+                      color="inherit"
                       data-euiicon-type="trash"
                     />
                   </button>
@@ -2485,6 +2508,7 @@ exports[`TrustedAppsList renders correctly when item details expanded 1`] = `
                   <span
                     aria-hidden="true"
                     class="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
                   />
                 </button>
@@ -2587,6 +2611,7 @@ exports[`TrustedAppsList renders correctly when item details expanded 1`] = `
                     <span
                       aria-hidden="true"
                       class="euiButtonIcon__icon"
+                      color="inherit"
                       data-euiicon-type="trash"
                     />
                   </button>
@@ -2615,6 +2640,7 @@ exports[`TrustedAppsList renders correctly when item details expanded 1`] = `
                   <span
                     aria-hidden="true"
                     class="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
                   />
                 </button>
@@ -2717,6 +2743,7 @@ exports[`TrustedAppsList renders correctly when item details expanded 1`] = `
                     <span
                       aria-hidden="true"
                       class="euiButtonIcon__icon"
+                      color="inherit"
                       data-euiicon-type="trash"
                     />
                   </button>
@@ -2745,6 +2772,7 @@ exports[`TrustedAppsList renders correctly when item details expanded 1`] = `
                   <span
                     aria-hidden="true"
                     class="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
                   />
                 </button>
@@ -2847,6 +2875,7 @@ exports[`TrustedAppsList renders correctly when item details expanded 1`] = `
                     <span
                       aria-hidden="true"
                       class="euiButtonIcon__icon"
+                      color="inherit"
                       data-euiicon-type="trash"
                     />
                   </button>
@@ -2875,6 +2904,7 @@ exports[`TrustedAppsList renders correctly when item details expanded 1`] = `
                   <span
                     aria-hidden="true"
                     class="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
                   />
                 </button>
@@ -2977,6 +3007,7 @@ exports[`TrustedAppsList renders correctly when item details expanded 1`] = `
                     <span
                       aria-hidden="true"
                       class="euiButtonIcon__icon"
+                      color="inherit"
                       data-euiicon-type="trash"
                     />
                   </button>
@@ -3005,6 +3036,7 @@ exports[`TrustedAppsList renders correctly when item details expanded 1`] = `
                   <span
                     aria-hidden="true"
                     class="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
                   />
                 </button>
@@ -3107,6 +3139,7 @@ exports[`TrustedAppsList renders correctly when item details expanded 1`] = `
                     <span
                       aria-hidden="true"
                       class="euiButtonIcon__icon"
+                      color="inherit"
                       data-euiicon-type="trash"
                     />
                   </button>
@@ -3135,6 +3168,7 @@ exports[`TrustedAppsList renders correctly when item details expanded 1`] = `
                   <span
                     aria-hidden="true"
                     class="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
                   />
                 </button>
@@ -3237,6 +3271,7 @@ exports[`TrustedAppsList renders correctly when item details expanded 1`] = `
                     <span
                       aria-hidden="true"
                       class="euiButtonIcon__icon"
+                      color="inherit"
                       data-euiicon-type="trash"
                     />
                   </button>
@@ -3265,6 +3300,7 @@ exports[`TrustedAppsList renders correctly when item details expanded 1`] = `
                   <span
                     aria-hidden="true"
                     class="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
                   />
                 </button>
@@ -3367,6 +3403,7 @@ exports[`TrustedAppsList renders correctly when item details expanded 1`] = `
                     <span
                       aria-hidden="true"
                       class="euiButtonIcon__icon"
+                      color="inherit"
                       data-euiicon-type="trash"
                     />
                   </button>
@@ -3395,6 +3432,7 @@ exports[`TrustedAppsList renders correctly when item details expanded 1`] = `
                   <span
                     aria-hidden="true"
                     class="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
                   />
                 </button>
@@ -3497,6 +3535,7 @@ exports[`TrustedAppsList renders correctly when item details expanded 1`] = `
                     <span
                       aria-hidden="true"
                       class="euiButtonIcon__icon"
+                      color="inherit"
                       data-euiicon-type="trash"
                     />
                   </button>
@@ -3525,6 +3564,7 @@ exports[`TrustedAppsList renders correctly when item details expanded 1`] = `
                   <span
                     aria-hidden="true"
                     class="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
                   />
                 </button>
@@ -3560,6 +3600,7 @@ exports[`TrustedAppsList renders correctly when item details expanded 1`] = `
                 >
                   <span
                     class="euiButtonContent__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
                   />
                   <span
@@ -3590,6 +3631,7 @@ exports[`TrustedAppsList renders correctly when item details expanded 1`] = `
               <span
                 aria-hidden="true"
                 class="euiButtonIcon__icon"
+                color="inherit"
                 data-euiicon-type="arrowLeft"
               />
             </button>
@@ -3747,6 +3789,7 @@ exports[`TrustedAppsList renders correctly when item details expanded 1`] = `
               <span
                 aria-hidden="true"
                 class="euiButtonIcon__icon"
+                color="inherit"
                 data-euiicon-type="arrowRight"
               />
             </a>
@@ -3795,7 +3838,7 @@ exports[`TrustedAppsList renders correctly when loaded data 1`] = `
               role="columnheader"
               scope="col"
             >
-              <div
+              <span
                 class="euiTableCellContent"
               >
                 <span
@@ -3804,7 +3847,7 @@ exports[`TrustedAppsList renders correctly when loaded data 1`] = `
                 >
                   Name
                 </span>
-              </div>
+              </span>
             </th>
             <th
               class="euiTableHeaderCell"
@@ -3812,7 +3855,7 @@ exports[`TrustedAppsList renders correctly when loaded data 1`] = `
               role="columnheader"
               scope="col"
             >
-              <div
+              <span
                 class="euiTableCellContent"
               >
                 <span
@@ -3821,7 +3864,7 @@ exports[`TrustedAppsList renders correctly when loaded data 1`] = `
                 >
                   OS
                 </span>
-              </div>
+              </span>
             </th>
             <th
               class="euiTableHeaderCell"
@@ -3829,7 +3872,7 @@ exports[`TrustedAppsList renders correctly when loaded data 1`] = `
               role="columnheader"
               scope="col"
             >
-              <div
+              <span
                 class="euiTableCellContent"
               >
                 <span
@@ -3838,7 +3881,7 @@ exports[`TrustedAppsList renders correctly when loaded data 1`] = `
                 >
                   Date Created
                 </span>
-              </div>
+              </span>
             </th>
             <th
               class="euiTableHeaderCell"
@@ -3846,7 +3889,7 @@ exports[`TrustedAppsList renders correctly when loaded data 1`] = `
               role="columnheader"
               scope="col"
             >
-              <div
+              <span
                 class="euiTableCellContent"
               >
                 <span
@@ -3855,14 +3898,14 @@ exports[`TrustedAppsList renders correctly when loaded data 1`] = `
                 >
                   Created By
                 </span>
-              </div>
+              </span>
             </th>
             <th
               class="euiTableHeaderCell"
               role="columnheader"
               scope="col"
             >
-              <div
+              <span
                 class="euiTableCellContent euiTableCellContent--alignRight"
               >
                 <span
@@ -3871,7 +3914,7 @@ exports[`TrustedAppsList renders correctly when loaded data 1`] = `
                 >
                   Actions
                 </span>
-              </div>
+              </span>
             </th>
             <td
               class="euiTableHeaderCell"
@@ -3880,13 +3923,13 @@ exports[`TrustedAppsList renders correctly when loaded data 1`] = `
               scope="col"
               style="width: 40px;"
             >
-              <div
+              <span
                 class="euiTableCellContent euiTableCellContent--alignRight"
               >
                 <span
                   class="euiTableCellContent__text"
                 />
-              </div>
+              </span>
             </td>
           </tr>
         </thead>
@@ -3987,6 +4030,7 @@ exports[`TrustedAppsList renders correctly when loaded data 1`] = `
                     <span
                       aria-hidden="true"
                       class="euiButtonIcon__icon"
+                      color="inherit"
                       data-euiicon-type="trash"
                     />
                   </button>
@@ -4015,6 +4059,7 @@ exports[`TrustedAppsList renders correctly when loaded data 1`] = `
                   <span
                     aria-hidden="true"
                     class="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
                   />
                 </button>
@@ -4117,6 +4162,7 @@ exports[`TrustedAppsList renders correctly when loaded data 1`] = `
                     <span
                       aria-hidden="true"
                       class="euiButtonIcon__icon"
+                      color="inherit"
                       data-euiicon-type="trash"
                     />
                   </button>
@@ -4145,6 +4191,7 @@ exports[`TrustedAppsList renders correctly when loaded data 1`] = `
                   <span
                     aria-hidden="true"
                     class="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
                   />
                 </button>
@@ -4247,6 +4294,7 @@ exports[`TrustedAppsList renders correctly when loaded data 1`] = `
                     <span
                       aria-hidden="true"
                       class="euiButtonIcon__icon"
+                      color="inherit"
                       data-euiicon-type="trash"
                     />
                   </button>
@@ -4275,6 +4323,7 @@ exports[`TrustedAppsList renders correctly when loaded data 1`] = `
                   <span
                     aria-hidden="true"
                     class="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
                   />
                 </button>
@@ -4377,6 +4426,7 @@ exports[`TrustedAppsList renders correctly when loaded data 1`] = `
                     <span
                       aria-hidden="true"
                       class="euiButtonIcon__icon"
+                      color="inherit"
                       data-euiicon-type="trash"
                     />
                   </button>
@@ -4405,6 +4455,7 @@ exports[`TrustedAppsList renders correctly when loaded data 1`] = `
                   <span
                     aria-hidden="true"
                     class="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
                   />
                 </button>
@@ -4507,6 +4558,7 @@ exports[`TrustedAppsList renders correctly when loaded data 1`] = `
                     <span
                       aria-hidden="true"
                       class="euiButtonIcon__icon"
+                      color="inherit"
                       data-euiicon-type="trash"
                     />
                   </button>
@@ -4535,6 +4587,7 @@ exports[`TrustedAppsList renders correctly when loaded data 1`] = `
                   <span
                     aria-hidden="true"
                     class="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
                   />
                 </button>
@@ -4637,6 +4690,7 @@ exports[`TrustedAppsList renders correctly when loaded data 1`] = `
                     <span
                       aria-hidden="true"
                       class="euiButtonIcon__icon"
+                      color="inherit"
                       data-euiicon-type="trash"
                     />
                   </button>
@@ -4665,6 +4719,7 @@ exports[`TrustedAppsList renders correctly when loaded data 1`] = `
                   <span
                     aria-hidden="true"
                     class="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
                   />
                 </button>
@@ -4767,6 +4822,7 @@ exports[`TrustedAppsList renders correctly when loaded data 1`] = `
                     <span
                       aria-hidden="true"
                       class="euiButtonIcon__icon"
+                      color="inherit"
                       data-euiicon-type="trash"
                     />
                   </button>
@@ -4795,6 +4851,7 @@ exports[`TrustedAppsList renders correctly when loaded data 1`] = `
                   <span
                     aria-hidden="true"
                     class="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
                   />
                 </button>
@@ -4897,6 +4954,7 @@ exports[`TrustedAppsList renders correctly when loaded data 1`] = `
                     <span
                       aria-hidden="true"
                       class="euiButtonIcon__icon"
+                      color="inherit"
                       data-euiicon-type="trash"
                     />
                   </button>
@@ -4925,6 +4983,7 @@ exports[`TrustedAppsList renders correctly when loaded data 1`] = `
                   <span
                     aria-hidden="true"
                     class="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
                   />
                 </button>
@@ -5027,6 +5086,7 @@ exports[`TrustedAppsList renders correctly when loaded data 1`] = `
                     <span
                       aria-hidden="true"
                       class="euiButtonIcon__icon"
+                      color="inherit"
                       data-euiicon-type="trash"
                     />
                   </button>
@@ -5055,6 +5115,7 @@ exports[`TrustedAppsList renders correctly when loaded data 1`] = `
                   <span
                     aria-hidden="true"
                     class="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
                   />
                 </button>
@@ -5157,6 +5218,7 @@ exports[`TrustedAppsList renders correctly when loaded data 1`] = `
                     <span
                       aria-hidden="true"
                       class="euiButtonIcon__icon"
+                      color="inherit"
                       data-euiicon-type="trash"
                     />
                   </button>
@@ -5185,6 +5247,7 @@ exports[`TrustedAppsList renders correctly when loaded data 1`] = `
                   <span
                     aria-hidden="true"
                     class="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
                   />
                 </button>
@@ -5287,6 +5350,7 @@ exports[`TrustedAppsList renders correctly when loaded data 1`] = `
                     <span
                       aria-hidden="true"
                       class="euiButtonIcon__icon"
+                      color="inherit"
                       data-euiicon-type="trash"
                     />
                   </button>
@@ -5315,6 +5379,7 @@ exports[`TrustedAppsList renders correctly when loaded data 1`] = `
                   <span
                     aria-hidden="true"
                     class="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
                   />
                 </button>
@@ -5417,6 +5482,7 @@ exports[`TrustedAppsList renders correctly when loaded data 1`] = `
                     <span
                       aria-hidden="true"
                       class="euiButtonIcon__icon"
+                      color="inherit"
                       data-euiicon-type="trash"
                     />
                   </button>
@@ -5445,6 +5511,7 @@ exports[`TrustedAppsList renders correctly when loaded data 1`] = `
                   <span
                     aria-hidden="true"
                     class="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
                   />
                 </button>
@@ -5547,6 +5614,7 @@ exports[`TrustedAppsList renders correctly when loaded data 1`] = `
                     <span
                       aria-hidden="true"
                       class="euiButtonIcon__icon"
+                      color="inherit"
                       data-euiicon-type="trash"
                     />
                   </button>
@@ -5575,6 +5643,7 @@ exports[`TrustedAppsList renders correctly when loaded data 1`] = `
                   <span
                     aria-hidden="true"
                     class="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
                   />
                 </button>
@@ -5677,6 +5746,7 @@ exports[`TrustedAppsList renders correctly when loaded data 1`] = `
                     <span
                       aria-hidden="true"
                       class="euiButtonIcon__icon"
+                      color="inherit"
                       data-euiicon-type="trash"
                     />
                   </button>
@@ -5705,6 +5775,7 @@ exports[`TrustedAppsList renders correctly when loaded data 1`] = `
                   <span
                     aria-hidden="true"
                     class="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
                   />
                 </button>
@@ -5807,6 +5878,7 @@ exports[`TrustedAppsList renders correctly when loaded data 1`] = `
                     <span
                       aria-hidden="true"
                       class="euiButtonIcon__icon"
+                      color="inherit"
                       data-euiicon-type="trash"
                     />
                   </button>
@@ -5835,6 +5907,7 @@ exports[`TrustedAppsList renders correctly when loaded data 1`] = `
                   <span
                     aria-hidden="true"
                     class="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
                   />
                 </button>
@@ -5937,6 +6010,7 @@ exports[`TrustedAppsList renders correctly when loaded data 1`] = `
                     <span
                       aria-hidden="true"
                       class="euiButtonIcon__icon"
+                      color="inherit"
                       data-euiicon-type="trash"
                     />
                   </button>
@@ -5965,6 +6039,7 @@ exports[`TrustedAppsList renders correctly when loaded data 1`] = `
                   <span
                     aria-hidden="true"
                     class="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
                   />
                 </button>
@@ -6067,6 +6142,7 @@ exports[`TrustedAppsList renders correctly when loaded data 1`] = `
                     <span
                       aria-hidden="true"
                       class="euiButtonIcon__icon"
+                      color="inherit"
                       data-euiicon-type="trash"
                     />
                   </button>
@@ -6095,6 +6171,7 @@ exports[`TrustedAppsList renders correctly when loaded data 1`] = `
                   <span
                     aria-hidden="true"
                     class="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
                   />
                 </button>
@@ -6197,6 +6274,7 @@ exports[`TrustedAppsList renders correctly when loaded data 1`] = `
                     <span
                       aria-hidden="true"
                       class="euiButtonIcon__icon"
+                      color="inherit"
                       data-euiicon-type="trash"
                     />
                   </button>
@@ -6225,6 +6303,7 @@ exports[`TrustedAppsList renders correctly when loaded data 1`] = `
                   <span
                     aria-hidden="true"
                     class="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
                   />
                 </button>
@@ -6327,6 +6406,7 @@ exports[`TrustedAppsList renders correctly when loaded data 1`] = `
                     <span
                       aria-hidden="true"
                       class="euiButtonIcon__icon"
+                      color="inherit"
                       data-euiicon-type="trash"
                     />
                   </button>
@@ -6355,6 +6435,7 @@ exports[`TrustedAppsList renders correctly when loaded data 1`] = `
                   <span
                     aria-hidden="true"
                     class="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
                   />
                 </button>
@@ -6457,6 +6538,7 @@ exports[`TrustedAppsList renders correctly when loaded data 1`] = `
                     <span
                       aria-hidden="true"
                       class="euiButtonIcon__icon"
+                      color="inherit"
                       data-euiicon-type="trash"
                     />
                   </button>
@@ -6485,6 +6567,7 @@ exports[`TrustedAppsList renders correctly when loaded data 1`] = `
                   <span
                     aria-hidden="true"
                     class="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
                   />
                 </button>
@@ -6520,6 +6603,7 @@ exports[`TrustedAppsList renders correctly when loaded data 1`] = `
                 >
                   <span
                     class="euiButtonContent__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
                   />
                   <span
@@ -6550,6 +6634,7 @@ exports[`TrustedAppsList renders correctly when loaded data 1`] = `
               <span
                 aria-hidden="true"
                 class="euiButtonIcon__icon"
+                color="inherit"
                 data-euiicon-type="arrowLeft"
               />
             </button>
@@ -6707,6 +6792,7 @@ exports[`TrustedAppsList renders correctly when loaded data 1`] = `
               <span
                 aria-hidden="true"
                 class="euiButtonIcon__icon"
+                color="inherit"
                 data-euiicon-type="arrowRight"
               />
             </a>
@@ -6755,7 +6841,7 @@ exports[`TrustedAppsList renders correctly when loading data for the first time
               role="columnheader"
               scope="col"
             >
-              <div
+              <span
                 class="euiTableCellContent"
               >
                 <span
@@ -6764,7 +6850,7 @@ exports[`TrustedAppsList renders correctly when loading data for the first time
                 >
                   Name
                 </span>
-              </div>
+              </span>
             </th>
             <th
               class="euiTableHeaderCell"
@@ -6772,7 +6858,7 @@ exports[`TrustedAppsList renders correctly when loading data for the first time
               role="columnheader"
               scope="col"
             >
-              <div
+              <span
                 class="euiTableCellContent"
               >
                 <span
@@ -6781,7 +6867,7 @@ exports[`TrustedAppsList renders correctly when loading data for the first time
                 >
                   OS
                 </span>
-              </div>
+              </span>
             </th>
             <th
               class="euiTableHeaderCell"
@@ -6789,7 +6875,7 @@ exports[`TrustedAppsList renders correctly when loading data for the first time
               role="columnheader"
               scope="col"
             >
-              <div
+              <span
                 class="euiTableCellContent"
               >
                 <span
@@ -6798,7 +6884,7 @@ exports[`TrustedAppsList renders correctly when loading data for the first time
                 >
                   Date Created
                 </span>
-              </div>
+              </span>
             </th>
             <th
               class="euiTableHeaderCell"
@@ -6806,7 +6892,7 @@ exports[`TrustedAppsList renders correctly when loading data for the first time
               role="columnheader"
               scope="col"
             >
-              <div
+              <span
                 class="euiTableCellContent"
               >
                 <span
@@ -6815,14 +6901,14 @@ exports[`TrustedAppsList renders correctly when loading data for the first time
                 >
                   Created By
                 </span>
-              </div>
+              </span>
             </th>
             <th
               class="euiTableHeaderCell"
               role="columnheader"
               scope="col"
             >
-              <div
+              <span
                 class="euiTableCellContent euiTableCellContent--alignRight"
               >
                 <span
@@ -6831,7 +6917,7 @@ exports[`TrustedAppsList renders correctly when loading data for the first time
                 >
                   Actions
                 </span>
-              </div>
+              </span>
             </th>
             <td
               class="euiTableHeaderCell"
@@ -6840,13 +6926,13 @@ exports[`TrustedAppsList renders correctly when loading data for the first time
               scope="col"
               style="width: 40px;"
             >
-              <div
+              <span
                 class="euiTableCellContent euiTableCellContent--alignRight"
               >
                 <span
                   class="euiTableCellContent__text"
                 />
-              </div>
+              </span>
             </td>
           </tr>
         </thead>
@@ -6913,7 +6999,7 @@ exports[`TrustedAppsList renders correctly when loading data for the second time
               role="columnheader"
               scope="col"
             >
-              <div
+              <span
                 class="euiTableCellContent"
               >
                 <span
@@ -6922,7 +7008,7 @@ exports[`TrustedAppsList renders correctly when loading data for the second time
                 >
                   Name
                 </span>
-              </div>
+              </span>
             </th>
             <th
               class="euiTableHeaderCell"
@@ -6930,7 +7016,7 @@ exports[`TrustedAppsList renders correctly when loading data for the second time
               role="columnheader"
               scope="col"
             >
-              <div
+              <span
                 class="euiTableCellContent"
               >
                 <span
@@ -6939,7 +7025,7 @@ exports[`TrustedAppsList renders correctly when loading data for the second time
                 >
                   OS
                 </span>
-              </div>
+              </span>
             </th>
             <th
               class="euiTableHeaderCell"
@@ -6947,7 +7033,7 @@ exports[`TrustedAppsList renders correctly when loading data for the second time
               role="columnheader"
               scope="col"
             >
-              <div
+              <span
                 class="euiTableCellContent"
               >
                 <span
@@ -6956,7 +7042,7 @@ exports[`TrustedAppsList renders correctly when loading data for the second time
                 >
                   Date Created
                 </span>
-              </div>
+              </span>
             </th>
             <th
               class="euiTableHeaderCell"
@@ -6964,7 +7050,7 @@ exports[`TrustedAppsList renders correctly when loading data for the second time
               role="columnheader"
               scope="col"
             >
-              <div
+              <span
                 class="euiTableCellContent"
               >
                 <span
@@ -6973,14 +7059,14 @@ exports[`TrustedAppsList renders correctly when loading data for the second time
                 >
                   Created By
                 </span>
-              </div>
+              </span>
             </th>
             <th
               class="euiTableHeaderCell"
               role="columnheader"
               scope="col"
             >
-              <div
+              <span
                 class="euiTableCellContent euiTableCellContent--alignRight"
               >
                 <span
@@ -6989,7 +7075,7 @@ exports[`TrustedAppsList renders correctly when loading data for the second time
                 >
                   Actions
                 </span>
-              </div>
+              </span>
             </th>
             <td
               class="euiTableHeaderCell"
@@ -6998,13 +7084,13 @@ exports[`TrustedAppsList renders correctly when loading data for the second time
               scope="col"
               style="width: 40px;"
             >
-              <div
+              <span
                 class="euiTableCellContent euiTableCellContent--alignRight"
               >
                 <span
                   class="euiTableCellContent__text"
                 />
-              </div>
+              </span>
             </td>
           </tr>
         </thead>
@@ -7105,6 +7191,7 @@ exports[`TrustedAppsList renders correctly when loading data for the second time
                     <span
                       aria-hidden="true"
                       class="euiButtonIcon__icon"
+                      color="inherit"
                       data-euiicon-type="trash"
                     />
                   </button>
@@ -7133,6 +7220,7 @@ exports[`TrustedAppsList renders correctly when loading data for the second time
                   <span
                     aria-hidden="true"
                     class="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
                   />
                 </button>
@@ -7235,6 +7323,7 @@ exports[`TrustedAppsList renders correctly when loading data for the second time
                     <span
                       aria-hidden="true"
                       class="euiButtonIcon__icon"
+                      color="inherit"
                       data-euiicon-type="trash"
                     />
                   </button>
@@ -7263,6 +7352,7 @@ exports[`TrustedAppsList renders correctly when loading data for the second time
                   <span
                     aria-hidden="true"
                     class="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
                   />
                 </button>
@@ -7365,6 +7455,7 @@ exports[`TrustedAppsList renders correctly when loading data for the second time
                     <span
                       aria-hidden="true"
                       class="euiButtonIcon__icon"
+                      color="inherit"
                       data-euiicon-type="trash"
                     />
                   </button>
@@ -7393,6 +7484,7 @@ exports[`TrustedAppsList renders correctly when loading data for the second time
                   <span
                     aria-hidden="true"
                     class="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
                   />
                 </button>
@@ -7495,6 +7587,7 @@ exports[`TrustedAppsList renders correctly when loading data for the second time
                     <span
                       aria-hidden="true"
                       class="euiButtonIcon__icon"
+                      color="inherit"
                       data-euiicon-type="trash"
                     />
                   </button>
@@ -7523,6 +7616,7 @@ exports[`TrustedAppsList renders correctly when loading data for the second time
                   <span
                     aria-hidden="true"
                     class="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
                   />
                 </button>
@@ -7625,6 +7719,7 @@ exports[`TrustedAppsList renders correctly when loading data for the second time
                     <span
                       aria-hidden="true"
                       class="euiButtonIcon__icon"
+                      color="inherit"
                       data-euiicon-type="trash"
                     />
                   </button>
@@ -7653,6 +7748,7 @@ exports[`TrustedAppsList renders correctly when loading data for the second time
                   <span
                     aria-hidden="true"
                     class="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
                   />
                 </button>
@@ -7755,6 +7851,7 @@ exports[`TrustedAppsList renders correctly when loading data for the second time
                     <span
                       aria-hidden="true"
                       class="euiButtonIcon__icon"
+                      color="inherit"
                       data-euiicon-type="trash"
                     />
                   </button>
@@ -7783,6 +7880,7 @@ exports[`TrustedAppsList renders correctly when loading data for the second time
                   <span
                     aria-hidden="true"
                     class="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
                   />
                 </button>
@@ -7885,6 +7983,7 @@ exports[`TrustedAppsList renders correctly when loading data for the second time
                     <span
                       aria-hidden="true"
                       class="euiButtonIcon__icon"
+                      color="inherit"
                       data-euiicon-type="trash"
                     />
                   </button>
@@ -7913,6 +8012,7 @@ exports[`TrustedAppsList renders correctly when loading data for the second time
                   <span
                     aria-hidden="true"
                     class="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
                   />
                 </button>
@@ -8015,6 +8115,7 @@ exports[`TrustedAppsList renders correctly when loading data for the second time
                     <span
                       aria-hidden="true"
                       class="euiButtonIcon__icon"
+                      color="inherit"
                       data-euiicon-type="trash"
                     />
                   </button>
@@ -8043,6 +8144,7 @@ exports[`TrustedAppsList renders correctly when loading data for the second time
                   <span
                     aria-hidden="true"
                     class="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
                   />
                 </button>
@@ -8145,6 +8247,7 @@ exports[`TrustedAppsList renders correctly when loading data for the second time
                     <span
                       aria-hidden="true"
                       class="euiButtonIcon__icon"
+                      color="inherit"
                       data-euiicon-type="trash"
                     />
                   </button>
@@ -8173,6 +8276,7 @@ exports[`TrustedAppsList renders correctly when loading data for the second time
                   <span
                     aria-hidden="true"
                     class="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
                   />
                 </button>
@@ -8275,6 +8379,7 @@ exports[`TrustedAppsList renders correctly when loading data for the second time
                     <span
                       aria-hidden="true"
                       class="euiButtonIcon__icon"
+                      color="inherit"
                       data-euiicon-type="trash"
                     />
                   </button>
@@ -8303,6 +8408,7 @@ exports[`TrustedAppsList renders correctly when loading data for the second time
                   <span
                     aria-hidden="true"
                     class="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
                   />
                 </button>
@@ -8405,6 +8511,7 @@ exports[`TrustedAppsList renders correctly when loading data for the second time
                     <span
                       aria-hidden="true"
                       class="euiButtonIcon__icon"
+                      color="inherit"
                       data-euiicon-type="trash"
                     />
                   </button>
@@ -8433,6 +8540,7 @@ exports[`TrustedAppsList renders correctly when loading data for the second time
                   <span
                     aria-hidden="true"
                     class="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
                   />
                 </button>
@@ -8535,6 +8643,7 @@ exports[`TrustedAppsList renders correctly when loading data for the second time
                     <span
                       aria-hidden="true"
                       class="euiButtonIcon__icon"
+                      color="inherit"
                       data-euiicon-type="trash"
                     />
                   </button>
@@ -8563,6 +8672,7 @@ exports[`TrustedAppsList renders correctly when loading data for the second time
                   <span
                     aria-hidden="true"
                     class="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
                   />
                 </button>
@@ -8665,6 +8775,7 @@ exports[`TrustedAppsList renders correctly when loading data for the second time
                     <span
                       aria-hidden="true"
                       class="euiButtonIcon__icon"
+                      color="inherit"
                       data-euiicon-type="trash"
                     />
                   </button>
@@ -8693,6 +8804,7 @@ exports[`TrustedAppsList renders correctly when loading data for the second time
                   <span
                     aria-hidden="true"
                     class="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
                   />
                 </button>
@@ -8795,6 +8907,7 @@ exports[`TrustedAppsList renders correctly when loading data for the second time
                     <span
                       aria-hidden="true"
                       class="euiButtonIcon__icon"
+                      color="inherit"
                       data-euiicon-type="trash"
                     />
                   </button>
@@ -8823,6 +8936,7 @@ exports[`TrustedAppsList renders correctly when loading data for the second time
                   <span
                     aria-hidden="true"
                     class="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
                   />
                 </button>
@@ -8925,6 +9039,7 @@ exports[`TrustedAppsList renders correctly when loading data for the second time
                     <span
                       aria-hidden="true"
                       class="euiButtonIcon__icon"
+                      color="inherit"
                       data-euiicon-type="trash"
                     />
                   </button>
@@ -8953,6 +9068,7 @@ exports[`TrustedAppsList renders correctly when loading data for the second time
                   <span
                     aria-hidden="true"
                     class="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
                   />
                 </button>
@@ -9055,6 +9171,7 @@ exports[`TrustedAppsList renders correctly when loading data for the second time
                     <span
                       aria-hidden="true"
                       class="euiButtonIcon__icon"
+                      color="inherit"
                       data-euiicon-type="trash"
                     />
                   </button>
@@ -9083,6 +9200,7 @@ exports[`TrustedAppsList renders correctly when loading data for the second time
                   <span
                     aria-hidden="true"
                     class="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
                   />
                 </button>
@@ -9185,6 +9303,7 @@ exports[`TrustedAppsList renders correctly when loading data for the second time
                     <span
                       aria-hidden="true"
                       class="euiButtonIcon__icon"
+                      color="inherit"
                       data-euiicon-type="trash"
                     />
                   </button>
@@ -9213,6 +9332,7 @@ exports[`TrustedAppsList renders correctly when loading data for the second time
                   <span
                     aria-hidden="true"
                     class="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
                   />
                 </button>
@@ -9315,6 +9435,7 @@ exports[`TrustedAppsList renders correctly when loading data for the second time
                     <span
                       aria-hidden="true"
                       class="euiButtonIcon__icon"
+                      color="inherit"
                       data-euiicon-type="trash"
                     />
                   </button>
@@ -9343,6 +9464,7 @@ exports[`TrustedAppsList renders correctly when loading data for the second time
                   <span
                     aria-hidden="true"
                     class="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
                   />
                 </button>
@@ -9445,6 +9567,7 @@ exports[`TrustedAppsList renders correctly when loading data for the second time
                     <span
                       aria-hidden="true"
                       class="euiButtonIcon__icon"
+                      color="inherit"
                       data-euiicon-type="trash"
                     />
                   </button>
@@ -9473,6 +9596,7 @@ exports[`TrustedAppsList renders correctly when loading data for the second time
                   <span
                     aria-hidden="true"
                     class="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
                   />
                 </button>
@@ -9575,6 +9699,7 @@ exports[`TrustedAppsList renders correctly when loading data for the second time
                     <span
                       aria-hidden="true"
                       class="euiButtonIcon__icon"
+                      color="inherit"
                       data-euiicon-type="trash"
                     />
                   </button>
@@ -9603,6 +9728,7 @@ exports[`TrustedAppsList renders correctly when loading data for the second time
                   <span
                     aria-hidden="true"
                     class="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
                   />
                 </button>
@@ -9638,6 +9764,7 @@ exports[`TrustedAppsList renders correctly when loading data for the second time
                 >
                   <span
                     class="euiButtonContent__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
                   />
                   <span
@@ -9668,6 +9795,7 @@ exports[`TrustedAppsList renders correctly when loading data for the second time
               <span
                 aria-hidden="true"
                 class="euiButtonIcon__icon"
+                color="inherit"
                 data-euiicon-type="arrowLeft"
               />
             </button>
@@ -9825,6 +9953,7 @@ exports[`TrustedAppsList renders correctly when loading data for the second time
               <span
                 aria-hidden="true"
                 class="euiButtonIcon__icon"
+                color="inherit"
                 data-euiicon-type="arrowRight"
               />
             </a>
@@ -9873,7 +10002,7 @@ exports[`TrustedAppsList renders correctly when new page and page size set (not
               role="columnheader"
               scope="col"
             >
-              <div
+              <span
                 class="euiTableCellContent"
               >
                 <span
@@ -9882,7 +10011,7 @@ exports[`TrustedAppsList renders correctly when new page and page size set (not
                 >
                   Name
                 </span>
-              </div>
+              </span>
             </th>
             <th
               class="euiTableHeaderCell"
@@ -9890,7 +10019,7 @@ exports[`TrustedAppsList renders correctly when new page and page size set (not
               role="columnheader"
               scope="col"
             >
-              <div
+              <span
                 class="euiTableCellContent"
               >
                 <span
@@ -9899,7 +10028,7 @@ exports[`TrustedAppsList renders correctly when new page and page size set (not
                 >
                   OS
                 </span>
-              </div>
+              </span>
             </th>
             <th
               class="euiTableHeaderCell"
@@ -9907,7 +10036,7 @@ exports[`TrustedAppsList renders correctly when new page and page size set (not
               role="columnheader"
               scope="col"
             >
-              <div
+              <span
                 class="euiTableCellContent"
               >
                 <span
@@ -9916,7 +10045,7 @@ exports[`TrustedAppsList renders correctly when new page and page size set (not
                 >
                   Date Created
                 </span>
-              </div>
+              </span>
             </th>
             <th
               class="euiTableHeaderCell"
@@ -9924,7 +10053,7 @@ exports[`TrustedAppsList renders correctly when new page and page size set (not
               role="columnheader"
               scope="col"
             >
-              <div
+              <span
                 class="euiTableCellContent"
               >
                 <span
@@ -9933,14 +10062,14 @@ exports[`TrustedAppsList renders correctly when new page and page size set (not
                 >
                   Created By
                 </span>
-              </div>
+              </span>
             </th>
             <th
               class="euiTableHeaderCell"
               role="columnheader"
               scope="col"
             >
-              <div
+              <span
                 class="euiTableCellContent euiTableCellContent--alignRight"
               >
                 <span
@@ -9949,7 +10078,7 @@ exports[`TrustedAppsList renders correctly when new page and page size set (not
                 >
                   Actions
                 </span>
-              </div>
+              </span>
             </th>
             <td
               class="euiTableHeaderCell"
@@ -9958,13 +10087,13 @@ exports[`TrustedAppsList renders correctly when new page and page size set (not
               scope="col"
               style="width: 40px;"
             >
-              <div
+              <span
                 class="euiTableCellContent euiTableCellContent--alignRight"
               >
                 <span
                   class="euiTableCellContent__text"
                 />
-              </div>
+              </span>
             </td>
           </tr>
         </thead>
@@ -10065,6 +10194,7 @@ exports[`TrustedAppsList renders correctly when new page and page size set (not
                     <span
                       aria-hidden="true"
                       class="euiButtonIcon__icon"
+                      color="inherit"
                       data-euiicon-type="trash"
                     />
                   </button>
@@ -10093,6 +10223,7 @@ exports[`TrustedAppsList renders correctly when new page and page size set (not
                   <span
                     aria-hidden="true"
                     class="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
                   />
                 </button>
@@ -10195,6 +10326,7 @@ exports[`TrustedAppsList renders correctly when new page and page size set (not
                     <span
                       aria-hidden="true"
                       class="euiButtonIcon__icon"
+                      color="inherit"
                       data-euiicon-type="trash"
                     />
                   </button>
@@ -10223,6 +10355,7 @@ exports[`TrustedAppsList renders correctly when new page and page size set (not
                   <span
                     aria-hidden="true"
                     class="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
                   />
                 </button>
@@ -10325,6 +10458,7 @@ exports[`TrustedAppsList renders correctly when new page and page size set (not
                     <span
                       aria-hidden="true"
                       class="euiButtonIcon__icon"
+                      color="inherit"
                       data-euiicon-type="trash"
                     />
                   </button>
@@ -10353,6 +10487,7 @@ exports[`TrustedAppsList renders correctly when new page and page size set (not
                   <span
                     aria-hidden="true"
                     class="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
                   />
                 </button>
@@ -10455,6 +10590,7 @@ exports[`TrustedAppsList renders correctly when new page and page size set (not
                     <span
                       aria-hidden="true"
                       class="euiButtonIcon__icon"
+                      color="inherit"
                       data-euiicon-type="trash"
                     />
                   </button>
@@ -10483,6 +10619,7 @@ exports[`TrustedAppsList renders correctly when new page and page size set (not
                   <span
                     aria-hidden="true"
                     class="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
                   />
                 </button>
@@ -10585,6 +10722,7 @@ exports[`TrustedAppsList renders correctly when new page and page size set (not
                     <span
                       aria-hidden="true"
                       class="euiButtonIcon__icon"
+                      color="inherit"
                       data-euiicon-type="trash"
                     />
                   </button>
@@ -10613,6 +10751,7 @@ exports[`TrustedAppsList renders correctly when new page and page size set (not
                   <span
                     aria-hidden="true"
                     class="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
                   />
                 </button>
@@ -10715,6 +10854,7 @@ exports[`TrustedAppsList renders correctly when new page and page size set (not
                     <span
                       aria-hidden="true"
                       class="euiButtonIcon__icon"
+                      color="inherit"
                       data-euiicon-type="trash"
                     />
                   </button>
@@ -10743,6 +10883,7 @@ exports[`TrustedAppsList renders correctly when new page and page size set (not
                   <span
                     aria-hidden="true"
                     class="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
                   />
                 </button>
@@ -10845,6 +10986,7 @@ exports[`TrustedAppsList renders correctly when new page and page size set (not
                     <span
                       aria-hidden="true"
                       class="euiButtonIcon__icon"
+                      color="inherit"
                       data-euiicon-type="trash"
                     />
                   </button>
@@ -10873,6 +11015,7 @@ exports[`TrustedAppsList renders correctly when new page and page size set (not
                   <span
                     aria-hidden="true"
                     class="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
                   />
                 </button>
@@ -10975,6 +11118,7 @@ exports[`TrustedAppsList renders correctly when new page and page size set (not
                     <span
                       aria-hidden="true"
                       class="euiButtonIcon__icon"
+                      color="inherit"
                       data-euiicon-type="trash"
                     />
                   </button>
@@ -11003,6 +11147,7 @@ exports[`TrustedAppsList renders correctly when new page and page size set (not
                   <span
                     aria-hidden="true"
                     class="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
                   />
                 </button>
@@ -11105,6 +11250,7 @@ exports[`TrustedAppsList renders correctly when new page and page size set (not
                     <span
                       aria-hidden="true"
                       class="euiButtonIcon__icon"
+                      color="inherit"
                       data-euiicon-type="trash"
                     />
                   </button>
@@ -11133,6 +11279,7 @@ exports[`TrustedAppsList renders correctly when new page and page size set (not
                   <span
                     aria-hidden="true"
                     class="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
                   />
                 </button>
@@ -11235,6 +11382,7 @@ exports[`TrustedAppsList renders correctly when new page and page size set (not
                     <span
                       aria-hidden="true"
                       class="euiButtonIcon__icon"
+                      color="inherit"
                       data-euiicon-type="trash"
                     />
                   </button>
@@ -11263,6 +11411,7 @@ exports[`TrustedAppsList renders correctly when new page and page size set (not
                   <span
                     aria-hidden="true"
                     class="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
                   />
                 </button>
@@ -11365,6 +11514,7 @@ exports[`TrustedAppsList renders correctly when new page and page size set (not
                     <span
                       aria-hidden="true"
                       class="euiButtonIcon__icon"
+                      color="inherit"
                       data-euiicon-type="trash"
                     />
                   </button>
@@ -11393,6 +11543,7 @@ exports[`TrustedAppsList renders correctly when new page and page size set (not
                   <span
                     aria-hidden="true"
                     class="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
                   />
                 </button>
@@ -11495,6 +11646,7 @@ exports[`TrustedAppsList renders correctly when new page and page size set (not
                     <span
                       aria-hidden="true"
                       class="euiButtonIcon__icon"
+                      color="inherit"
                       data-euiicon-type="trash"
                     />
                   </button>
@@ -11523,6 +11675,7 @@ exports[`TrustedAppsList renders correctly when new page and page size set (not
                   <span
                     aria-hidden="true"
                     class="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
                   />
                 </button>
@@ -11625,6 +11778,7 @@ exports[`TrustedAppsList renders correctly when new page and page size set (not
                     <span
                       aria-hidden="true"
                       class="euiButtonIcon__icon"
+                      color="inherit"
                       data-euiicon-type="trash"
                     />
                   </button>
@@ -11653,6 +11807,7 @@ exports[`TrustedAppsList renders correctly when new page and page size set (not
                   <span
                     aria-hidden="true"
                     class="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
                   />
                 </button>
@@ -11755,6 +11910,7 @@ exports[`TrustedAppsList renders correctly when new page and page size set (not
                     <span
                       aria-hidden="true"
                       class="euiButtonIcon__icon"
+                      color="inherit"
                       data-euiicon-type="trash"
                     />
                   </button>
@@ -11783,6 +11939,7 @@ exports[`TrustedAppsList renders correctly when new page and page size set (not
                   <span
                     aria-hidden="true"
                     class="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
                   />
                 </button>
@@ -11885,6 +12042,7 @@ exports[`TrustedAppsList renders correctly when new page and page size set (not
                     <span
                       aria-hidden="true"
                       class="euiButtonIcon__icon"
+                      color="inherit"
                       data-euiicon-type="trash"
                     />
                   </button>
@@ -11913,6 +12071,7 @@ exports[`TrustedAppsList renders correctly when new page and page size set (not
                   <span
                     aria-hidden="true"
                     class="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
                   />
                 </button>
@@ -12015,6 +12174,7 @@ exports[`TrustedAppsList renders correctly when new page and page size set (not
                     <span
                       aria-hidden="true"
                       class="euiButtonIcon__icon"
+                      color="inherit"
                       data-euiicon-type="trash"
                     />
                   </button>
@@ -12043,6 +12203,7 @@ exports[`TrustedAppsList renders correctly when new page and page size set (not
                   <span
                     aria-hidden="true"
                     class="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
                   />
                 </button>
@@ -12145,6 +12306,7 @@ exports[`TrustedAppsList renders correctly when new page and page size set (not
                     <span
                       aria-hidden="true"
                       class="euiButtonIcon__icon"
+                      color="inherit"
                       data-euiicon-type="trash"
                     />
                   </button>
@@ -12173,6 +12335,7 @@ exports[`TrustedAppsList renders correctly when new page and page size set (not
                   <span
                     aria-hidden="true"
                     class="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
                   />
                 </button>
@@ -12275,6 +12438,7 @@ exports[`TrustedAppsList renders correctly when new page and page size set (not
                     <span
                       aria-hidden="true"
                       class="euiButtonIcon__icon"
+                      color="inherit"
                       data-euiicon-type="trash"
                     />
                   </button>
@@ -12303,6 +12467,7 @@ exports[`TrustedAppsList renders correctly when new page and page size set (not
                   <span
                     aria-hidden="true"
                     class="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
                   />
                 </button>
@@ -12405,6 +12570,7 @@ exports[`TrustedAppsList renders correctly when new page and page size set (not
                     <span
                       aria-hidden="true"
                       class="euiButtonIcon__icon"
+                      color="inherit"
                       data-euiicon-type="trash"
                     />
                   </button>
@@ -12433,6 +12599,7 @@ exports[`TrustedAppsList renders correctly when new page and page size set (not
                   <span
                     aria-hidden="true"
                     class="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
                   />
                 </button>
@@ -12535,6 +12702,7 @@ exports[`TrustedAppsList renders correctly when new page and page size set (not
                     <span
                       aria-hidden="true"
                       class="euiButtonIcon__icon"
+                      color="inherit"
                       data-euiicon-type="trash"
                     />
                   </button>
@@ -12563,6 +12731,7 @@ exports[`TrustedAppsList renders correctly when new page and page size set (not
                   <span
                     aria-hidden="true"
                     class="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
                   />
                 </button>
@@ -12598,6 +12767,7 @@ exports[`TrustedAppsList renders correctly when new page and page size set (not
                 >
                   <span
                     class="euiButtonContent__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
                   />
                   <span
@@ -12629,6 +12799,7 @@ exports[`TrustedAppsList renders correctly when new page and page size set (not
               <span
                 aria-hidden="true"
                 class="euiButtonIcon__icon"
+                color="inherit"
                 data-euiicon-type="arrowLeft"
               />
             </a>
@@ -12736,6 +12907,7 @@ exports[`TrustedAppsList renders correctly when new page and page size set (not
               <span
                 aria-hidden="true"
                 class="euiButtonIcon__icon"
+                color="inherit"
                 data-euiicon-type="arrowRight"
               />
             </a>
diff --git a/x-pack/plugins/security_solution/public/network/components/network_top_countries_table/index.test.tsx b/x-pack/plugins/security_solution/public/network/components/network_top_countries_table/index.test.tsx
index c9ce204a52538..1501f56882290 100644
--- a/x-pack/plugins/security_solution/public/network/components/network_top_countries_table/index.test.tsx
+++ b/x-pack/plugins/security_solution/public/network/components/network_top_countries_table/index.test.tsx
@@ -128,12 +128,8 @@ describe('NetworkTopCountries Table Component', () => {
         direction: 'asc',
         field: 'bytes_out',
       });
-      expect(wrapper.find('.euiTable thead tr th button').first().text()).toEqual(
-        'Bytes inClick to sort in ascending order'
-      );
-      expect(wrapper.find('.euiTable thead tr th button').at(1).text()).toEqual(
-        'Bytes outClick to sort in descending order'
-      );
+      expect(wrapper.find('.euiTable thead tr th button').first().text()).toEqual('Bytes in');
+      expect(wrapper.find('.euiTable thead tr th button').at(1).text()).toEqual('Bytes out');
       expect(wrapper.find('.euiTable thead tr th button').at(1).find('svg')).toBeTruthy();
     });
   });
diff --git a/x-pack/plugins/security_solution/public/network/components/network_top_n_flow_table/index.test.tsx b/x-pack/plugins/security_solution/public/network/components/network_top_n_flow_table/index.test.tsx
index a05277cd0513d..cd8c8c6543299 100644
--- a/x-pack/plugins/security_solution/public/network/components/network_top_n_flow_table/index.test.tsx
+++ b/x-pack/plugins/security_solution/public/network/components/network_top_n_flow_table/index.test.tsx
@@ -114,12 +114,8 @@ describe('NetworkTopNFlow Table Component', () => {
         direction: 'asc',
         field: 'bytes_out',
       });
-      expect(wrapper.find('.euiTable thead tr th button').first().text()).toEqual(
-        'Bytes inClick to sort in ascending order'
-      );
-      expect(wrapper.find('.euiTable thead tr th button').at(1).text()).toEqual(
-        'Bytes outClick to sort in descending order'
-      );
+      expect(wrapper.find('.euiTable thead tr th button').first().text()).toEqual('Bytes in');
+      expect(wrapper.find('.euiTable thead tr th button').at(1).text()).toEqual('Bytes out');
       expect(wrapper.find('.euiTable thead tr th button').at(1).find('svg')).toBeTruthy();
     });
   });
diff --git a/x-pack/plugins/security_solution/public/network/components/tls_table/index.test.tsx b/x-pack/plugins/security_solution/public/network/components/tls_table/index.test.tsx
index 09b1afc5611b0..4b6c31f5b6176 100644
--- a/x-pack/plugins/security_solution/public/network/components/tls_table/index.test.tsx
+++ b/x-pack/plugins/security_solution/public/network/components/tls_table/index.test.tsx
@@ -90,7 +90,7 @@ describe('Tls Table Component', () => {
       });
 
       expect(wrapper.find('.euiTable thead tr th button').first().text()).toEqual(
-        'SHA1 fingerprintClick to sort in descending order'
+        'SHA1 fingerprint'
       );
     });
   });
diff --git a/x-pack/plugins/security_solution/public/network/components/users_table/index.test.tsx b/x-pack/plugins/security_solution/public/network/components/users_table/index.test.tsx
index e551dbb640751..4b613e79a1d1a 100644
--- a/x-pack/plugins/security_solution/public/network/components/users_table/index.test.tsx
+++ b/x-pack/plugins/security_solution/public/network/components/users_table/index.test.tsx
@@ -92,9 +92,7 @@ describe('Users Table Component', () => {
         direction: 'desc',
         field: 'name',
       });
-      expect(wrapper.find('.euiTable thead tr th button').first().text()).toEqual(
-        'UserClick to sort in ascending order'
-      );
+      expect(wrapper.find('.euiTable thead tr th button').first().text()).toEqual('User');
     });
   });
 });
diff --git a/x-pack/plugins/security_solution/public/timelines/components/side_panel/__snapshots__/index.test.tsx.snap b/x-pack/plugins/security_solution/public/timelines/components/side_panel/__snapshots__/index.test.tsx.snap
index 50970304953ca..b74a3e1860b17 100644
--- a/x-pack/plugins/security_solution/public/timelines/components/side_panel/__snapshots__/index.test.tsx.snap
+++ b/x-pack/plugins/security_solution/public/timelines/components/side_panel/__snapshots__/index.test.tsx.snap
@@ -103,12 +103,14 @@ exports[`Details Panel Component DetailsPanel:EventDetails: rendering it should
                     <EuiIcon
                       aria-hidden="true"
                       className="euiButtonIcon__icon"
+                      color="inherit"
                       size="m"
                       type="cross"
                     >
                       <span
                         aria-hidden="true"
                         className="euiButtonIcon__icon"
+                        color="inherit"
                         data-euiicon-type="cross"
                         size="m"
                       />
@@ -319,12 +321,14 @@ Array [
                   <EuiIcon
                     aria-hidden="true"
                     className="euiButtonIcon__icon"
+                    color="inherit"
                     size="m"
                     type="cross"
                   >
                     <span
                       aria-hidden="true"
                       className="euiButtonIcon__icon"
+                      color="inherit"
                       data-euiicon-type="cross"
                       size="m"
                     />
@@ -589,12 +593,14 @@ Array [
                 <EuiIcon
                   aria-hidden="true"
                   className="euiButtonIcon__icon"
+                  color="inherit"
                   size="m"
                   type="cross"
                 >
                   <span
                     aria-hidden="true"
                     className="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="cross"
                     size="m"
                   />
@@ -842,12 +848,14 @@ Array [
           <EuiIcon
             aria-hidden="true"
             className="euiButtonIcon__icon"
+            color="inherit"
             size="m"
             type="cross"
           >
             <span
               aria-hidden="true"
               className="euiButtonIcon__icon"
+              color="inherit"
               data-euiicon-type="cross"
               size="m"
             />
diff --git a/x-pack/plugins/security_solution/public/timelines/components/timeline/data_providers/add_data_provider_popover.tsx b/x-pack/plugins/security_solution/public/timelines/components/timeline/data_providers/add_data_provider_popover.tsx
index abc750fd4b42a..77b776e3a801d 100644
--- a/x-pack/plugins/security_solution/public/timelines/components/timeline/data_providers/add_data_provider_popover.tsx
+++ b/x-pack/plugins/security_solution/public/timelines/components/timeline/data_providers/add_data_provider_popover.tsx
@@ -201,7 +201,6 @@ const AddDataProviderPopoverComponent: React.FC<AddDataProviderPopoverProps> = (
       closePopover={handleClosePopover}
       anchorPosition="downLeft"
       panelPaddingSize="none"
-      ownFocus={true}
       repositionOnScroll
     >
       {content}
diff --git a/x-pack/plugins/uptime/public/components/certificates/__snapshots__/fingerprint_col.test.tsx.snap b/x-pack/plugins/uptime/public/components/certificates/__snapshots__/fingerprint_col.test.tsx.snap
index ebcced7a6cffb..33969b3d83bcb 100644
--- a/x-pack/plugins/uptime/public/components/certificates/__snapshots__/fingerprint_col.test.tsx.snap
+++ b/x-pack/plugins/uptime/public/components/certificates/__snapshots__/fingerprint_col.test.tsx.snap
@@ -44,6 +44,7 @@ exports[`FingerprintCol renders expected elements for valid props 1`] = `
         <span
           aria-hidden="true"
           class="euiButtonIcon__icon"
+          color="inherit"
           data-euiicon-type="copy"
         />
       </button>
@@ -83,6 +84,7 @@ exports[`FingerprintCol renders expected elements for valid props 1`] = `
         <span
           aria-hidden="true"
           class="euiButtonIcon__icon"
+          color="inherit"
           data-euiicon-type="copy"
         />
       </button>
diff --git a/x-pack/plugins/uptime/public/components/common/__snapshots__/uptime_date_picker.test.tsx.snap b/x-pack/plugins/uptime/public/components/common/__snapshots__/uptime_date_picker.test.tsx.snap
index bfe83cfc13347..d513c0212da75 100644
--- a/x-pack/plugins/uptime/public/components/common/__snapshots__/uptime_date_picker.test.tsx.snap
+++ b/x-pack/plugins/uptime/public/components/common/__snapshots__/uptime_date_picker.test.tsx.snap
@@ -27,6 +27,7 @@ exports[`UptimeDatePicker component renders properly with mock data 1`] = `
             >
               <span
                 class="euiButtonContent__icon"
+                color="inherit"
                 data-euiicon-type="arrowDown"
               />
               <span
@@ -77,6 +78,7 @@ exports[`UptimeDatePicker component renders properly with mock data 1`] = `
         >
           <span
             class="euiButtonContent__icon"
+            color="inherit"
             data-euiicon-type="refresh"
           />
           <span
diff --git a/x-pack/plugins/uptime/public/components/monitor/ml/__snapshots__/license_info.test.tsx.snap b/x-pack/plugins/uptime/public/components/monitor/ml/__snapshots__/license_info.test.tsx.snap
index edf89caaff557..b1d2e53997e36 100644
--- a/x-pack/plugins/uptime/public/components/monitor/ml/__snapshots__/license_info.test.tsx.snap
+++ b/x-pack/plugins/uptime/public/components/monitor/ml/__snapshots__/license_info.test.tsx.snap
@@ -12,6 +12,7 @@ Array [
       <span
         aria-hidden="true"
         class="euiCallOutHeader__icon"
+        color="inherit"
         data-euiicon-type="help"
       />
       <span
diff --git a/x-pack/plugins/uptime/public/components/monitor/ml/__snapshots__/ml_flyout.test.tsx.snap b/x-pack/plugins/uptime/public/components/monitor/ml/__snapshots__/ml_flyout.test.tsx.snap
index 39987678a5343..e41366fadef84 100644
--- a/x-pack/plugins/uptime/public/components/monitor/ml/__snapshots__/ml_flyout.test.tsx.snap
+++ b/x-pack/plugins/uptime/public/components/monitor/ml/__snapshots__/ml_flyout.test.tsx.snap
@@ -98,6 +98,7 @@ exports[`ML Flyout component shows license info if no ml available 1`] = `
       <span
         aria-hidden="true"
         class="euiButtonIcon__icon"
+        color="inherit"
         data-euiicon-type="cross"
       />
     </button>
@@ -132,6 +133,7 @@ exports[`ML Flyout component shows license info if no ml available 1`] = `
               <span
                 aria-hidden="true"
                 class="euiCallOutHeader__icon"
+                color="inherit"
                 data-euiicon-type="help"
               />
               <span
diff --git a/x-pack/plugins/uptime/public/components/monitor/status_details/availability_reporting/__snapshots__/availability_reporting.test.tsx.snap b/x-pack/plugins/uptime/public/components/monitor/status_details/availability_reporting/__snapshots__/availability_reporting.test.tsx.snap
index f76f37a6e7fa7..5a660c7cb764f 100644
--- a/x-pack/plugins/uptime/public/components/monitor/status_details/availability_reporting/__snapshots__/availability_reporting.test.tsx.snap
+++ b/x-pack/plugins/uptime/public/components/monitor/status_details/availability_reporting/__snapshots__/availability_reporting.test.tsx.snap
@@ -41,7 +41,7 @@ Array [
               role="columnheader"
               scope="col"
             >
-              <div
+              <span
                 class="euiTableCellContent"
               >
                 <span
@@ -49,7 +49,7 @@ Array [
                 >
                   Location
                 </span>
-              </div>
+              </span>
             </th>
             <th
               class="euiTableHeaderCell"
@@ -57,7 +57,7 @@ Array [
               role="columnheader"
               scope="col"
             >
-              <div
+              <span
                 class="euiTableCellContent euiTableCellContent--alignRight"
               >
                 <span
@@ -65,7 +65,7 @@ Array [
                 >
                   Availability
                 </span>
-              </div>
+              </span>
             </th>
             <th
               class="euiTableHeaderCell"
@@ -73,7 +73,7 @@ Array [
               role="columnheader"
               scope="col"
             >
-              <div
+              <span
                 class="euiTableCellContent euiTableCellContent--alignRight"
               >
                 <span
@@ -81,7 +81,7 @@ Array [
                 >
                   Last check
                 </span>
-              </div>
+              </span>
             </th>
           </tr>
         </thead>
diff --git a/x-pack/plugins/uptime/public/components/monitor/status_details/availability_reporting/__snapshots__/location_status_tags.test.tsx.snap b/x-pack/plugins/uptime/public/components/monitor/status_details/availability_reporting/__snapshots__/location_status_tags.test.tsx.snap
index 44a2021cce611..fefcb2d3c84e1 100644
--- a/x-pack/plugins/uptime/public/components/monitor/status_details/availability_reporting/__snapshots__/location_status_tags.test.tsx.snap
+++ b/x-pack/plugins/uptime/public/components/monitor/status_details/availability_reporting/__snapshots__/location_status_tags.test.tsx.snap
@@ -78,7 +78,7 @@ exports[`LocationStatusTags component renders when all locations are down 1`] =
               role="columnheader"
               scope="col"
             >
-              <div
+              <span
                 class="euiTableCellContent"
               >
                 <span
@@ -86,7 +86,7 @@ exports[`LocationStatusTags component renders when all locations are down 1`] =
                 >
                   Location
                 </span>
-              </div>
+              </span>
             </th>
             <th
               class="euiTableHeaderCell"
@@ -94,7 +94,7 @@ exports[`LocationStatusTags component renders when all locations are down 1`] =
               role="columnheader"
               scope="col"
             >
-              <div
+              <span
                 class="euiTableCellContent euiTableCellContent--alignRight"
               >
                 <span
@@ -102,7 +102,7 @@ exports[`LocationStatusTags component renders when all locations are down 1`] =
                 >
                   Availability
                 </span>
-              </div>
+              </span>
             </th>
             <th
               class="euiTableHeaderCell"
@@ -110,7 +110,7 @@ exports[`LocationStatusTags component renders when all locations are down 1`] =
               role="columnheader"
               scope="col"
             >
-              <div
+              <span
                 class="euiTableCellContent euiTableCellContent--alignRight"
               >
                 <span
@@ -118,7 +118,7 @@ exports[`LocationStatusTags component renders when all locations are down 1`] =
                 >
                   Last check
                 </span>
-              </div>
+              </span>
             </th>
           </tr>
         </thead>
@@ -316,7 +316,7 @@ exports[`LocationStatusTags component renders when all locations are up 1`] = `
               role="columnheader"
               scope="col"
             >
-              <div
+              <span
                 class="euiTableCellContent"
               >
                 <span
@@ -324,7 +324,7 @@ exports[`LocationStatusTags component renders when all locations are up 1`] = `
                 >
                   Location
                 </span>
-              </div>
+              </span>
             </th>
             <th
               class="euiTableHeaderCell"
@@ -332,7 +332,7 @@ exports[`LocationStatusTags component renders when all locations are up 1`] = `
               role="columnheader"
               scope="col"
             >
-              <div
+              <span
                 class="euiTableCellContent euiTableCellContent--alignRight"
               >
                 <span
@@ -340,7 +340,7 @@ exports[`LocationStatusTags component renders when all locations are up 1`] = `
                 >
                   Availability
                 </span>
-              </div>
+              </span>
             </th>
             <th
               class="euiTableHeaderCell"
@@ -348,7 +348,7 @@ exports[`LocationStatusTags component renders when all locations are up 1`] = `
               role="columnheader"
               scope="col"
             >
-              <div
+              <span
                 class="euiTableCellContent euiTableCellContent--alignRight"
               >
                 <span
@@ -356,7 +356,7 @@ exports[`LocationStatusTags component renders when all locations are up 1`] = `
                 >
                   Last check
                 </span>
-              </div>
+              </span>
             </th>
           </tr>
         </thead>
@@ -554,7 +554,7 @@ exports[`LocationStatusTags component renders when there are many location 1`] =
               role="columnheader"
               scope="col"
             >
-              <div
+              <span
                 class="euiTableCellContent"
               >
                 <span
@@ -562,7 +562,7 @@ exports[`LocationStatusTags component renders when there are many location 1`] =
                 >
                   Location
                 </span>
-              </div>
+              </span>
             </th>
             <th
               class="euiTableHeaderCell"
@@ -570,7 +570,7 @@ exports[`LocationStatusTags component renders when there are many location 1`] =
               role="columnheader"
               scope="col"
             >
-              <div
+              <span
                 class="euiTableCellContent euiTableCellContent--alignRight"
               >
                 <span
@@ -578,7 +578,7 @@ exports[`LocationStatusTags component renders when there are many location 1`] =
                 >
                   Availability
                 </span>
-              </div>
+              </span>
             </th>
             <th
               class="euiTableHeaderCell"
@@ -586,7 +586,7 @@ exports[`LocationStatusTags component renders when there are many location 1`] =
               role="columnheader"
               scope="col"
             >
-              <div
+              <span
                 class="euiTableCellContent euiTableCellContent--alignRight"
               >
                 <span
@@ -594,7 +594,7 @@ exports[`LocationStatusTags component renders when there are many location 1`] =
                 >
                   Last check
                 </span>
-              </div>
+              </span>
             </th>
           </tr>
         </thead>
@@ -983,6 +983,7 @@ exports[`LocationStatusTags component renders when there are many location 1`] =
               <span
                 aria-hidden="true"
                 class="euiButtonIcon__icon"
+                color="inherit"
                 data-euiicon-type="arrowLeft"
               />
             </button>
@@ -1046,6 +1047,7 @@ exports[`LocationStatusTags component renders when there are many location 1`] =
               <span
                 aria-hidden="true"
                 class="euiButtonIcon__icon"
+                color="inherit"
                 data-euiicon-type="arrowRight"
               />
             </a>
diff --git a/x-pack/plugins/uptime/public/components/overview/monitor_list/__snapshots__/monitor_list.test.tsx.snap b/x-pack/plugins/uptime/public/components/overview/monitor_list/__snapshots__/monitor_list.test.tsx.snap
index dc125ec4b8466..115dab1095dc1 100644
--- a/x-pack/plugins/uptime/public/components/overview/monitor_list/__snapshots__/monitor_list.test.tsx.snap
+++ b/x-pack/plugins/uptime/public/components/overview/monitor_list/__snapshots__/monitor_list.test.tsx.snap
@@ -969,7 +969,7 @@ exports[`MonitorList component renders the monitor list 1`] = `
               role="columnheader"
               scope="col"
             >
-              <div
+              <span
                 class="euiTableCellContent"
               >
                 <span
@@ -977,7 +977,7 @@ exports[`MonitorList component renders the monitor list 1`] = `
                 >
                   Status
                 </span>
-              </div>
+              </span>
             </th>
             <th
               class="euiTableHeaderCell euiTableHeaderCell--hideForMobile"
@@ -985,7 +985,7 @@ exports[`MonitorList component renders the monitor list 1`] = `
               role="columnheader"
               scope="col"
             >
-              <div
+              <span
                 class="euiTableCellContent"
               >
                 <span
@@ -993,7 +993,7 @@ exports[`MonitorList component renders the monitor list 1`] = `
                 >
                   Name
                 </span>
-              </div>
+              </span>
             </th>
             <th
               class="euiTableHeaderCell"
@@ -1002,7 +1002,7 @@ exports[`MonitorList component renders the monitor list 1`] = `
               scope="col"
               style="width:30%"
             >
-              <div
+              <span
                 class="euiTableCellContent"
               >
                 <span
@@ -1010,7 +1010,7 @@ exports[`MonitorList component renders the monitor list 1`] = `
                 >
                   Url
                 </span>
-              </div>
+              </span>
             </th>
             <th
               class="euiTableHeaderCell"
@@ -1019,7 +1019,7 @@ exports[`MonitorList component renders the monitor list 1`] = `
               scope="col"
               style="width:12%"
             >
-              <div
+              <span
                 class="euiTableCellContent"
               >
                 <span
@@ -1027,7 +1027,7 @@ exports[`MonitorList component renders the monitor list 1`] = `
                 >
                   Tags
                 </span>
-              </div>
+              </span>
             </th>
             <th
               class="euiTableHeaderCell"
@@ -1035,7 +1035,7 @@ exports[`MonitorList component renders the monitor list 1`] = `
               role="columnheader"
               scope="col"
             >
-              <div
+              <span
                 class="euiTableCellContent"
               >
                 <span
@@ -1043,7 +1043,7 @@ exports[`MonitorList component renders the monitor list 1`] = `
                 >
                   TLS Certificate
                 </span>
-              </div>
+              </span>
             </th>
             <th
               class="euiTableHeaderCell euiTableHeaderCell--hideForMobile"
@@ -1051,7 +1051,7 @@ exports[`MonitorList component renders the monitor list 1`] = `
               role="columnheader"
               scope="col"
             >
-              <div
+              <span
                 class="euiTableCellContent euiTableCellContent--alignCenter"
               >
                 <span
@@ -1059,7 +1059,7 @@ exports[`MonitorList component renders the monitor list 1`] = `
                 >
                   Downtime history
                 </span>
-              </div>
+              </span>
             </th>
             <th
               class="euiTableHeaderCell"
@@ -1068,7 +1068,7 @@ exports[`MonitorList component renders the monitor list 1`] = `
               scope="col"
               style="width:100px"
             >
-              <div
+              <span
                 class="euiTableCellContent euiTableCellContent--alignCenter"
               >
                 <span
@@ -1076,7 +1076,7 @@ exports[`MonitorList component renders the monitor list 1`] = `
                 >
                   Status alert
                 </span>
-              </div>
+              </span>
             </th>
             <td
               class="euiTableHeaderCell"
@@ -1085,13 +1085,13 @@ exports[`MonitorList component renders the monitor list 1`] = `
               scope="col"
               style="width:40px"
             >
-              <div
+              <span
                 class="euiTableCellContent euiTableCellContent--alignRight"
               >
                 <span
                   class="euiTableCellContent__text"
                 />
-              </div>
+              </span>
             </td>
           </tr>
         </thead>
@@ -1342,6 +1342,7 @@ exports[`MonitorList component renders the monitor list 1`] = `
                   <span
                     aria-hidden="true"
                     class="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
                   />
                 </button>
@@ -1594,6 +1595,7 @@ exports[`MonitorList component renders the monitor list 1`] = `
                   <span
                     aria-hidden="true"
                     class="euiButtonIcon__icon"
+                    color="inherit"
                     data-euiicon-type="arrowDown"
                   />
                 </button>
@@ -1629,6 +1631,7 @@ exports[`MonitorList component renders the monitor list 1`] = `
             >
               <span
                 class="euiButtonContent__icon"
+                color="inherit"
                 data-euiicon-type="arrowDown"
               />
               <span
@@ -1660,6 +1663,7 @@ exports[`MonitorList component renders the monitor list 1`] = `
             <span
               aria-hidden="true"
               class="euiButtonIcon__icon"
+              color="inherit"
               data-euiicon-type="arrowLeft"
             />
           </button>
@@ -1677,6 +1681,7 @@ exports[`MonitorList component renders the monitor list 1`] = `
             <span
               aria-hidden="true"
               class="euiButtonIcon__icon"
+              color="inherit"
               data-euiicon-type="arrowRight"
             />
           </button>
diff --git a/x-pack/test/functional/services/ml/dashboard_embeddables.ts b/x-pack/test/functional/services/ml/dashboard_embeddables.ts
index 03b69854744d4..c4fa9f643e69e 100644
--- a/x-pack/test/functional/services/ml/dashboard_embeddables.ts
+++ b/x-pack/test/functional/services/ml/dashboard_embeddables.ts
@@ -78,7 +78,7 @@ export function MachineLearningDashboardEmbeddablesProvider(
     },
 
     async assertAnomalyChartsSeverityThresholdControlExists() {
-      await retry.tryForTime(60 * 1000, async () => {
+      await retry.tryForTime(3 * 60 * 1000, async () => {
         await testSubjects.existOrFail(`mlAnomalySeverityThresholdControls`);
       });
     },
diff --git a/yarn.lock b/yarn.lock
index 1e0f9a8821d1f..254dbe0adfa80 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -1444,10 +1444,10 @@
   resolved "https://registry.yarnpkg.com/@elastic/eslint-plugin-eui/-/eslint-plugin-eui-0.0.2.tgz#56b9ef03984a05cc213772ae3713ea8ef47b0314"
   integrity sha512-IoxURM5zraoQ7C8f+mJb9HYSENiZGgRVcG4tLQxE61yHNNRDXtGDWTZh8N1KIHcsqN1CEPETjuzBXkJYF/fDiQ==
 
-"@elastic/eui@32.1.0":
-  version "32.1.0"
-  resolved "https://registry.yarnpkg.com/@elastic/eui/-/eui-32.1.0.tgz#065a91162962e187f42365557684db8b54b37407"
-  integrity sha512-a1Q70lwFO2MrFTITRWmApZUbQKhkUrKeXrvCdQoUCP4+ZiFsdk80R6ruXVW3kgrULCOtDKJQS1Bt9pfl+13sJw==
+"@elastic/eui@33.0.0":
+  version "33.0.0"
+  resolved "https://registry.yarnpkg.com/@elastic/eui/-/eui-33.0.0.tgz#525cf5ea6e6ab16c32bb09766e9c23806640240f"
+  integrity sha512-BQ6GJxKVaOF7Fm+IvH2iFeeGnepzygDr4xmmZ8PH2BEfrtkxzGP9YDpqmr/Drg5beVynJ3+72k1AEQT/JE6NTw==
   dependencies:
     "@types/chroma-js" "^2.0.0"
     "@types/lodash" "^4.14.160"
@@ -1456,10 +1456,11 @@
     "@types/react-input-autosize" "^2.2.0"
     "@types/react-virtualized-auto-sizer" "^1.0.0"
     "@types/react-window" "^1.8.2"
+    "@types/refractor" "^3.0.0"
+    "@types/resize-observer-browser" "^0.1.5"
     "@types/vfile-message" "^2.0.0"
     chroma-js "^2.1.0"
     classnames "^2.2.6"
-    highlight.js "^9.18.5"
     lodash "^4.17.21"
     numeral "^2.0.6"
     prop-types "^15.6.0"
@@ -1471,11 +1472,11 @@
     react-is "~16.3.0"
     react-virtualized-auto-sizer "^1.0.2"
     react-window "^1.8.5"
+    refractor "^3.3.1"
     rehype-raw "^5.0.0"
     rehype-react "^6.0.0"
     rehype-stringify "^8.0.0"
     remark-emoji "^2.1.0"
-    remark-highlight.js "^6.0.0"
     remark-parse "^8.0.3"
     remark-rehype "^8.0.0"
     tabbable "^3.0.0"
@@ -5614,6 +5615,11 @@
   dependencies:
     pretty-ms "*"
 
+"@types/prismjs@*":
+  version "1.16.3"
+  resolved "https://registry.yarnpkg.com/@types/prismjs/-/prismjs-1.16.3.tgz#73ae78b3e339777a1a1b7a8df89dcd6b8fe750c5"
+  integrity sha512-7lbX0Odbg9rnzXRdYdgPQZFkjd38QHpD6tvWxbLi6VXGQbXr054doixIS+TwftHP6afffA1zxCZrIcJRS/MkYQ==
+
 "@types/prop-types@*":
   version "15.7.1"
   resolved "https://registry.yarnpkg.com/@types/prop-types/-/prop-types-15.7.1.tgz#f1a11e7babb0c3cad68100be381d1e064c68f1f6"
@@ -5810,6 +5816,13 @@
   dependencies:
     redux "^4.0.0"
 
+"@types/refractor@^3.0.0":
+  version "3.0.0"
+  resolved "https://registry.yarnpkg.com/@types/refractor/-/refractor-3.0.0.tgz#c535cfad1c54cf377ae2984f6cf6e9627a36ea66"
+  integrity sha512-jkCqkTpxMXXfN03Xpzj+mBMxo9IxG616SV2U42iwHkBGq/f8RrX3DCzLayIqUV+MAIBCUvl5xPnjqpUtZRnMqA==
+  dependencies:
+    "@types/prismjs" "*"
+
 "@types/request@^2.48.2":
   version "2.48.2"
   resolved "https://registry.yarnpkg.com/@types/request/-/request-2.48.2.tgz#936374cbe1179d7ed529fc02543deb4597450fed"
@@ -5820,6 +5833,11 @@
     "@types/tough-cookie" "*"
     form-data "^2.5.0"
 
+"@types/resize-observer-browser@^0.1.5":
+  version "0.1.5"
+  resolved "https://registry.yarnpkg.com/@types/resize-observer-browser/-/resize-observer-browser-0.1.5.tgz#36d897708172ac2380cd486da7a3daf1161c1e23"
+  integrity sha512-8k/67Z95Goa6Lznuykxkfhq9YU3l1Qe6LNZmwde1u7802a3x8v44oq0j91DICclxatTr0rNnhXx7+VTIetSrSQ==
+
 "@types/responselike@*", "@types/responselike@^1.0.0":
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/@types/responselike/-/responselike-1.0.0.tgz#251f4fe7d154d2bad125abe1b429b23afd262e29"
@@ -15286,11 +15304,6 @@ highlight.js@^10.1.1, highlight.js@^10.4.1, highlight.js@~10.4.0:
   resolved "https://registry.yarnpkg.com/highlight.js/-/highlight.js-10.4.1.tgz#d48fbcf4a9971c4361b3f95f302747afe19dbad0"
   integrity sha512-yR5lWvNz7c85OhVAEAeFhVCc/GV4C30Fjzc/rCP0aCWzc1UUOPUk55dK/qdwTZHBvMZo+eZ2jpk62ndX/xMFlg==
 
-highlight.js@^9.18.5:
-  version "9.18.5"
-  resolved "https://registry.yarnpkg.com/highlight.js/-/highlight.js-9.18.5.tgz#d18a359867f378c138d6819edfc2a8acd5f29825"
-  integrity sha512-a5bFyofd/BHCX52/8i8uJkjr9DYwXIPnM/plwI6W7ezItLGqzt7X2G2nXuYSfsIJdkwwj/g9DG1LkcGJI/dDoA==
-
 history-extra@^5.0.1:
   version "5.0.1"
   resolved "https://registry.yarnpkg.com/history-extra/-/history-extra-5.0.1.tgz#95a2e59dda526c4241d0ae1b124a77a5e4675ce8"
@@ -18674,7 +18687,7 @@ lowercase-keys@^2.0.0:
   resolved "https://registry.yarnpkg.com/lowercase-keys/-/lowercase-keys-2.0.0.tgz#2603e78b7b4b0006cbca2fbcc8a3202558ac9479"
   integrity sha512-tqNXrS78oMOE73NMxK4EMLQsQowWf8jKooH9g7xPavRT706R6bkQJ6DY2Te7QukaZsulxa30wQ7bk0pm4XiHmA==
 
-lowlight@^1.14.0, lowlight@^1.2.0:
+lowlight@^1.14.0:
   version "1.17.0"
   resolved "https://registry.yarnpkg.com/lowlight/-/lowlight-1.17.0.tgz#a1143b2fba8239df8cd5893f9fe97aaf8465af4a"
   integrity sha512-vmtBgYKD+QVNy7tIa7ulz5d//Il9R4MooOVh4nkOf9R9Cb/Dk5TXMSTieg/vDulkBkIWj59/BIlyFQxT9X1oAQ==
@@ -22109,7 +22122,7 @@ printj@~1.1.0:
   resolved "https://registry.yarnpkg.com/printj/-/printj-1.1.2.tgz#d90deb2975a8b9f600fb3a1c94e3f4c53c78a222"
   integrity sha512-zA2SmoLaxZyArQTOPj5LXecR+RagfPSU5Kw1qP+jkWeNlrq+eJZyY2oS68SU1Z/7/myXM4lo9716laOFAVStCQ==
 
-prismjs@1.23.0, prismjs@^1.22.0, prismjs@~1.22.0:
+prismjs@1.23.0, prismjs@^1.22.0, prismjs@~1.23.0:
   version "1.23.0"
   resolved "https://registry.yarnpkg.com/prismjs/-/prismjs-1.23.0.tgz#d3b3967f7d72440690497652a9d40ff046067f33"
   integrity sha512-c29LVsqOaLbBHuIbsTxaKENh1N2EQBOHaWv7gkHN4dgRbxSREqDnDbtFJYdpPauS4YCplMSNCABQ6Eeor69bAA==
@@ -23710,14 +23723,14 @@ reflect.ownkeys@^0.2.0:
   resolved "https://registry.yarnpkg.com/reflect.ownkeys/-/reflect.ownkeys-0.2.0.tgz#749aceec7f3fdf8b63f927a04809e90c5c0b3460"
   integrity sha1-dJrO7H8/34tj+SegSAnpDFwLNGA=
 
-refractor@^3.2.0:
-  version "3.2.0"
-  resolved "https://registry.yarnpkg.com/refractor/-/refractor-3.2.0.tgz#bc46f7cfbb6adbf45cd304e8e299b7fa854804e0"
-  integrity sha512-hSo+EyMIZTLBvNNgIU5lW4yjCzNYMZ4dcEhBq/3nReGfqzd2JfVhdlPDfU9rEsgcAyWx+OimIIUoL4ZU7NtYHQ==
+refractor@^3.2.0, refractor@^3.3.1:
+  version "3.3.1"
+  resolved "https://registry.yarnpkg.com/refractor/-/refractor-3.3.1.tgz#ebbc04b427ea81dc25ad333f7f67a0b5f4f0be3a"
+  integrity sha512-vaN6R56kLMuBszHSWlwTpcZ8KTMG6aUCok4GrxYDT20UIOXxOc5o6oDc8tNTzSlH3m2sI+Eu9Jo2kVdDcUTWYw==
   dependencies:
     hastscript "^6.0.0"
     parse-entities "^2.0.0"
-    prismjs "~1.22.0"
+    prismjs "~1.23.0"
 
 regedit@^3.0.3:
   version "3.0.3"
@@ -23911,14 +23924,6 @@ remark-footnotes@2.0.0:
   resolved "https://registry.yarnpkg.com/remark-footnotes/-/remark-footnotes-2.0.0.tgz#9001c4c2ffebba55695d2dd80ffb8b82f7e6303f"
   integrity sha512-3Clt8ZMH75Ayjp9q4CorNeyjwIxHFcTkaektplKGl2A1jNGEUey8cKL0ZC5vJwfcD5GFGsNLImLG/NGzWIzoMQ==
 
-remark-highlight.js@^6.0.0:
-  version "6.0.0"
-  resolved "https://registry.yarnpkg.com/remark-highlight.js/-/remark-highlight.js-6.0.0.tgz#cb05387ddddeb078f0b61ce6299f6323f05098fc"
-  integrity sha512-eNHP/ezuDKoeh3KV+rWLeBVzU3SYVt0uu1tHdsCB6TUJYHwTNMJWZ5+nU+2fJHQXb+7PtpfGXVtFS9zk/W6qdw==
-  dependencies:
-    lowlight "^1.2.0"
-    unist-util-visit "^2.0.0"
-
 remark-mdx@1.6.22:
   version "1.6.22"
   resolved "https://registry.yarnpkg.com/remark-mdx/-/remark-mdx-1.6.22.tgz#06a8dab07dcfdd57f3373af7f86bd0e992108bbd"