diff --git a/public/components/common/__test__/__snapshots__/flyout.test.tsx.snap b/public/components/common/__test__/__snapshots__/flyout.test.tsx.snap
index 733aed3c..b8adebe6 100644
--- a/public/components/common/__test__/__snapshots__/flyout.test.tsx.snap
+++ b/public/components/common/__test__/__snapshots__/flyout.test.tsx.snap
@@ -53,7 +53,11 @@ exports[`Flyout component Renders flyout component 1`] = `
viewBox="0 0 16 16"
width="16"
xmlns="http://www.w3.org/2000/svg"
- />
+ >
+
+
+ >
+
+
@@ -405,7 +413,11 @@ exports[`Flyout component Renders flyout component 1`] = `
viewBox="0 0 16 16"
width="16"
xmlns="http://www.w3.org/2000/svg"
- />
+ >
+
+
@@ -643,7 +655,11 @@ exports[`Flyout component Renders flyout component 1`] = `
viewBox="0 0 16 16"
width="16"
xmlns="http://www.w3.org/2000/svg"
- />
+ >
+
+
@@ -669,7 +685,11 @@ exports[`Flyout component Renders flyout component 1`] = `
viewBox="0 0 16 16"
width="16"
xmlns="http://www.w3.org/2000/svg"
- />
+ >
+
+
@@ -811,7 +831,11 @@ exports[`Flyout component Renders flyout component 1`] = `
viewBox="0 0 16 16"
width="16"
xmlns="http://www.w3.org/2000/svg"
- />
+ >
+
+
+ >
+
+
@@ -1163,7 +1191,11 @@ exports[`Flyout component Renders flyout component 1`] = `
viewBox="0 0 16 16"
width="16"
xmlns="http://www.w3.org/2000/svg"
- />
+ >
+
+
@@ -1401,7 +1433,11 @@ exports[`Flyout component Renders flyout component 1`] = `
viewBox="0 0 16 16"
width="16"
xmlns="http://www.w3.org/2000/svg"
- />
+ >
+
+
@@ -1427,7 +1463,11 @@ exports[`Flyout component Renders flyout component 1`] = `
viewBox="0 0 16 16"
width="16"
xmlns="http://www.w3.org/2000/svg"
- />
+ >
+
+
@@ -1501,7 +1541,11 @@ exports[`Flyout component Renders flyout component 1`] = `
viewBox="0 0 16 16"
width="16"
xmlns="http://www.w3.org/2000/svg"
- />
+ >
+
+
+ >
+
+
@@ -1853,7 +1901,11 @@ exports[`Flyout component Renders flyout component 1`] = `
viewBox="0 0 16 16"
width="16"
xmlns="http://www.w3.org/2000/svg"
- />
+ >
+
+
@@ -2091,7 +2143,11 @@ exports[`Flyout component Renders flyout component 1`] = `
viewBox="0 0 16 16"
width="16"
xmlns="http://www.w3.org/2000/svg"
- />
+ >
+
+
@@ -2117,7 +2173,11 @@ exports[`Flyout component Renders flyout component 1`] = `
viewBox="0 0 16 16"
width="16"
xmlns="http://www.w3.org/2000/svg"
- />
+ >
+
+
@@ -2191,7 +2251,11 @@ exports[`Flyout component Renders flyout component 1`] = `
viewBox="0 0 16 16"
width="16"
xmlns="http://www.w3.org/2000/svg"
- />
+ >
+
+
+ >
+
+
@@ -2543,7 +2611,11 @@ exports[`Flyout component Renders flyout component 1`] = `
viewBox="0 0 16 16"
width="16"
xmlns="http://www.w3.org/2000/svg"
- />
+ >
+
+
@@ -2781,7 +2853,11 @@ exports[`Flyout component Renders flyout component 1`] = `
viewBox="0 0 16 16"
width="16"
xmlns="http://www.w3.org/2000/svg"
- />
+ >
+
+
@@ -2807,7 +2883,11 @@ exports[`Flyout component Renders flyout component 1`] = `
viewBox="0 0 16 16"
width="16"
xmlns="http://www.w3.org/2000/svg"
- />
+ >
+
+
@@ -2869,7 +2949,11 @@ exports[`Flyout component Renders flyout component 1`] = `
viewBox="0 0 16 16"
width="16"
xmlns="http://www.w3.org/2000/svg"
- />
+ >
+
+
+ >
+
+
@@ -3221,7 +3309,11 @@ exports[`Flyout component Renders flyout component 1`] = `
viewBox="0 0 16 16"
width="16"
xmlns="http://www.w3.org/2000/svg"
- />
+ >
+
+
@@ -3459,7 +3551,11 @@ exports[`Flyout component Renders flyout component 1`] = `
viewBox="0 0 16 16"
width="16"
xmlns="http://www.w3.org/2000/svg"
- />
+ >
+
+
@@ -3485,7 +3581,11 @@ exports[`Flyout component Renders flyout component 1`] = `
viewBox="0 0 16 16"
width="16"
xmlns="http://www.w3.org/2000/svg"
- />
+ >
+
+
@@ -3583,7 +3683,7 @@ exports[`Flyout component Renders flyout component 1`] = `
size="m"
type="cross"
>
-
-
+ >
+
+
+
@@ -3662,7 +3766,7 @@ exports[`Flyout component Renders flyout component 1`] = `
size="s"
type="popout"
>
-
-
+ >
+
+
+
-
-
+ >
+
+
+
@@ -4453,7 +4565,7 @@ exports[`Flyout component Renders flyout component 1`] = `
size="m"
type="copy"
>
-
-
+ >
+
+
+
@@ -4504,7 +4620,7 @@ exports[`Flyout component Renders flyout component 1`] = `
size="s"
type="popout"
>
-
-
+ >
+
+
+
-
-
+ >
+
+
+
-
-
+ >
+
+
+
-
-
+ >
+
+
+
-
-
+ >
+
+
+
@@ -1695,7 +1699,7 @@ exports[`Result component Renders result component 1`] = `
tabIndex={0}
type="questionInCircle"
>
-
-
+ >
+
+
+
@@ -1997,7 +2005,7 @@ exports[`Result component Renders result component 1`] = `
tabIndex={0}
type="questionInCircle"
>
-
-
+ >
+
+
+
@@ -2286,7 +2298,7 @@ exports[`Result component Renders result component 1`] = `
tabIndex={0}
type="questionInCircle"
>
-
-
+ >
+
+
+
@@ -2562,7 +2578,7 @@ exports[`Result component Renders result component 1`] = `
tabIndex={0}
type="questionInCircle"
>
-
-
+ >
+
+
+
@@ -2838,7 +2858,7 @@ exports[`Result component Renders result component 1`] = `
tabIndex={0}
type="questionInCircle"
>
-
-
+ >
+
+
+
@@ -3114,7 +3138,7 @@ exports[`Result component Renders result component 1`] = `
tabIndex={0}
type="questionInCircle"
>
-
-
+ >
+
+
+
@@ -3403,7 +3431,7 @@ exports[`Result component Renders result component 1`] = `
tabIndex={0}
type="questionInCircle"
>
-
-
+ >
+
+
+
@@ -3679,7 +3711,7 @@ exports[`Result component Renders result component 1`] = `
tabIndex={0}
type="questionInCircle"
>
-
-
+ >
+
+
+
@@ -3968,7 +4004,7 @@ exports[`Result component Renders result component 1`] = `
tabIndex={0}
type="questionInCircle"
>
-
-
+ >
+
+
+
@@ -4727,7 +4767,7 @@ exports[`Result component Renders result component 1`] = `
tabIndex={0}
type="questionInCircle"
>
-
-
+ >
+
+
+
@@ -5016,7 +5060,7 @@ exports[`Result component Renders result component 1`] = `
tabIndex={0}
type="questionInCircle"
>
-
-
+ >
+
+
+
@@ -5318,7 +5366,7 @@ exports[`Result component Renders result component 1`] = `
tabIndex={0}
type="questionInCircle"
>
-
-
+ >
+
+
+
@@ -5607,7 +5659,7 @@ exports[`Result component Renders result component 1`] = `
tabIndex={0}
type="questionInCircle"
>
-
-
+ >
+
+
+
@@ -5883,7 +5939,7 @@ exports[`Result component Renders result component 1`] = `
tabIndex={0}
type="questionInCircle"
>
-
-
+ >
+
+
+
@@ -6159,7 +6219,7 @@ exports[`Result component Renders result component 1`] = `
tabIndex={0}
type="questionInCircle"
>
-
-
+ >
+
+
+
@@ -6435,7 +6499,7 @@ exports[`Result component Renders result component 1`] = `
tabIndex={0}
type="questionInCircle"
>
-
-
+ >
+
+
+
@@ -6724,7 +6792,7 @@ exports[`Result component Renders result component 1`] = `
tabIndex={0}
type="questionInCircle"
>
-
-
+ >
+
+
+
@@ -7000,7 +7072,7 @@ exports[`Result component Renders result component 1`] = `
tabIndex={0}
type="questionInCircle"
>
-
-
+ >
+
+
+
@@ -7289,7 +7365,7 @@ exports[`Result component Renders result component 1`] = `
tabIndex={0}
type="questionInCircle"
>
-
-
+ >
+
+
+
diff --git a/public/components/query_compare/search_result/result_components/__test__/__snapshots__/result_grid.test.tsx.snap b/public/components/query_compare/search_result/result_components/__test__/__snapshots__/result_grid.test.tsx.snap
index db2892a5..f1db78e1 100644
--- a/public/components/query_compare/search_result/result_components/__test__/__snapshots__/result_grid.test.tsx.snap
+++ b/public/components/query_compare/search_result/result_components/__test__/__snapshots__/result_grid.test.tsx.snap
@@ -276,7 +276,7 @@ exports[`Result grid component Renders result grid component 1`] = `
-
-
+ >
+
+
+
Up
1
@@ -504,7 +508,7 @@ exports[`Result grid component Renders result grid component 1`] = `
-
-
+ >
+
+
+
Down
1
@@ -745,7 +753,7 @@ exports[`Result grid component Renders result grid component 1`] = `
-
-
+ >
+
+
+
Up
7
@@ -973,7 +985,7 @@ exports[`Result grid component Renders result grid component 1`] = `
-
-
+ >
+
+
+
Up
96
@@ -1233,7 +1249,7 @@ exports[`Result grid component Renders result grid component 1`] = `
tabIndex={0}
type="questionInCircle"
>
-
-
+ >
+
+
+
@@ -1509,7 +1529,7 @@ exports[`Result grid component Renders result grid component 1`] = `
tabIndex={0}
type="questionInCircle"
>
-
-
+ >
+
+
+
@@ -1785,7 +1809,7 @@ exports[`Result grid component Renders result grid component 1`] = `
tabIndex={0}
type="questionInCircle"
>
-
-
+ >
+
+
+
@@ -2074,7 +2102,7 @@ exports[`Result grid component Renders result grid component 1`] = `
tabIndex={0}
type="questionInCircle"
>
-
-
+ >
+
+
+
@@ -2350,7 +2382,7 @@ exports[`Result grid component Renders result grid component 1`] = `
tabIndex={0}
type="questionInCircle"
>
-
-
+ >
+
+
+
@@ -2639,7 +2675,7 @@ exports[`Result grid component Renders result grid component 1`] = `
tabIndex={0}
type="questionInCircle"
>
-
-
+ >
+
+
+
diff --git a/public/components/query_compare/search_result/search_components/__tests__/__snapshots__/search_bar.test.tsx.snap b/public/components/query_compare/search_result/search_components/__tests__/__snapshots__/search_bar.test.tsx.snap
index c71b9236..0d2662e7 100644
--- a/public/components/query_compare/search_result/search_components/__tests__/__snapshots__/search_bar.test.tsx.snap
+++ b/public/components/query_compare/search_result/search_components/__tests__/__snapshots__/search_bar.test.tsx.snap
@@ -91,7 +91,7 @@ exports[`Search bar component Renders search bar component 1`] = `
size="m"
type="search"
>
-
-
+ >
+
+
+
@@ -135,7 +139,7 @@ exports[`Search bar component Renders search bar component 1`] = `
className="euiFormControlLayoutClearButton__icon"
type="cross"
>
-
-
+ >
+
+
+
diff --git a/public/components/query_compare/search_result/search_components/__tests__/__snapshots__/search_config.test.tsx.snap b/public/components/query_compare/search_result/search_components/__tests__/__snapshots__/search_config.test.tsx.snap
index 5f19165d..6905c8f8 100644
--- a/public/components/query_compare/search_result/search_components/__tests__/__snapshots__/search_config.test.tsx.snap
+++ b/public/components/query_compare/search_result/search_components/__tests__/__snapshots__/search_config.test.tsx.snap
@@ -170,7 +170,7 @@ exports[`Flyout component Renders flyout component 1`] = `
size="m"
type="arrowDown"
>
-
-
+ >
+
+
+
@@ -429,7 +433,7 @@ exports[`Flyout component Renders flyout component 1`] = `
size="m"
type="arrowDown"
>
-
-
+ >
+
+
+
diff --git a/public/components/query_compare/search_result/search_components/__tests__/__snapshots__/search_configs.test.tsx.snap b/public/components/query_compare/search_result/search_components/__tests__/__snapshots__/search_configs.test.tsx.snap
index fa240b20..6492d9f6 100644
--- a/public/components/query_compare/search_result/search_components/__tests__/__snapshots__/search_configs.test.tsx.snap
+++ b/public/components/query_compare/search_result/search_components/__tests__/__snapshots__/search_configs.test.tsx.snap
@@ -218,7 +218,7 @@ exports[`Flyout component Renders flyout component 1`] = `
size="m"
type="arrowDown"
>
-
-
+ >
+
+
+
@@ -477,7 +481,7 @@ exports[`Flyout component Renders flyout component 1`] = `
size="m"
type="arrowDown"
>
-
-
+ >
+
+
+
@@ -969,7 +977,7 @@ exports[`Flyout component Renders flyout component 1`] = `
size="m"
type="arrowDown"
>
-
-
+ >
+
+
+
@@ -1228,7 +1240,7 @@ exports[`Flyout component Renders flyout component 1`] = `
size="m"
type="arrowDown"
>
-
-
+ >
+
+
+