From d90ac3f8aa017256e01e5ed947e492dea2170396 Mon Sep 17 00:00:00 2001
From: Jen Huang <its.jenetic@gmail.com>
Date: Tue, 14 Aug 2018 08:42:24 -0700
Subject: [PATCH] Upgrade to EUI 3.4.0 (#21870)

* Upgrade to EUI 3.4.0
* Update snapshots
---
 package.json                                  |  2 +-
 .../__snapshots__/list_control.test.js.snap   |  1 +
 .../__snapshots__/add_panel.test.js.snap      |  1 +
 .../saved_objects_installer.test.js.snap      | 87 +++++++++++--------
 .../__snapshots__/header.test.js.snap         | 50 +++--------
 .../__snapshots__/status_message.test.js.snap |  4 +-
 .../__snapshots__/header.test.js.snap         |  3 +-
 .../indexed_fields_table.test.js.snap         |  5 ++
 .../__snapshots__/flyout.test.js.snap         |  2 +
 .../__snapshots__/relationships.test.js.snap  |  5 ++
 .../label_template_flyout.test.js.snap        |  1 +
 .../url_template_flyout.test.js.snap          |  1 +
 .../__snapshots__/help_flyout.test.js.snap    |  1 +
 x-pack/package.json                           |  2 +-
 .../__test__/__snapshots__/List.test.js.snap  | 14 +++
 .../__test__/__snapshots__/List.test.js.snap  | 20 +++++
 .../rule_editor_flyout.test.js.snap           |  4 +
 .../__snapshots__/detail_drawer.test.js.snap  |  5 ++
 .../__snapshots__/no_data.test.js.snap        |  8 +-
 .../__snapshots__/page_loading.test.js.snap   |  4 +-
 x-pack/yarn.lock                              | 11 ++-
 yarn.lock                                     | 11 ++-
 22 files changed, 152 insertions(+), 90 deletions(-)

diff --git a/package.json b/package.json
index 90a38927a401568..acea26b357c65b5 100644
--- a/package.json
+++ b/package.json
@@ -60,7 +60,7 @@
     "url": "https://github.com/elastic/kibana.git"
   },
   "dependencies": {
-    "@elastic/eui": "3.2.1",
+    "@elastic/eui": "3.4.0",
     "@elastic/filesaver": "1.1.2",
     "@elastic/numeral": "2.3.2",
     "@elastic/ui-ace": "0.2.3",
diff --git a/src/core_plugins/input_control_vis/public/components/vis/__snapshots__/list_control.test.js.snap b/src/core_plugins/input_control_vis/public/components/vis/__snapshots__/list_control.test.js.snap
index 3f18713939a0992..f7998d17f9a6748 100644
--- a/src/core_plugins/input_control_vis/public/components/vis/__snapshots__/list_control.test.js.snap
+++ b/src/core_plugins/input_control_vis/public/components/vis/__snapshots__/list_control.test.js.snap
@@ -25,6 +25,7 @@ exports[`renders ListControl 1`] = `
 >
   <EuiComboBox
     data-test-subj="listControlSelect0"
+    fullWidth={false}
     isClearable={true}
     isLoading={false}
     onChange={[Function]}
diff --git a/src/core_plugins/kibana/public/dashboard/top_nav/__snapshots__/add_panel.test.js.snap b/src/core_plugins/kibana/public/dashboard/top_nav/__snapshots__/add_panel.test.js.snap
index a6a9db7abec644e..6ad4e1771bd15d1 100644
--- a/src/core_plugins/kibana/public/dashboard/top_nav/__snapshots__/add_panel.test.js.snap
+++ b/src/core_plugins/kibana/public/dashboard/top_nav/__snapshots__/add_panel.test.js.snap
@@ -6,6 +6,7 @@ exports[`render 1`] = `
   closeButtonAriaLabel="Closes this dialog"
   data-test-subj="dashboardAddPanel"
   hideCloseButton={false}
+  maxWidth={false}
   onClose={[Function]}
   ownFocus={true}
   size="s"
diff --git a/src/core_plugins/kibana/public/home/components/tutorial/__snapshots__/saved_objects_installer.test.js.snap b/src/core_plugins/kibana/public/home/components/tutorial/__snapshots__/saved_objects_installer.test.js.snap
index 11f4b043679a8fa..802135f11e80929 100644
--- a/src/core_plugins/kibana/public/home/components/tutorial/__snapshots__/saved_objects_installer.test.js.snap
+++ b/src/core_plugins/kibana/public/home/components/tutorial/__snapshots__/saved_objects_installer.test.js.snap
@@ -92,12 +92,20 @@ exports[`bulkCreate should display error message when bulkCreate request fails 1
             <span
               className="euiScreenReaderOnly"
             >
-              Step
+              Incomplete
+               Step 
             </span>
           </EuiScreenReaderOnly>
-          <div
-            className="euiStep__circle euiStep__circle--incomplete"
-          />
+          <EuiStepNumber
+            className="euiStep__circle"
+            isHollow={true}
+            number={1}
+            status="incomplete"
+          >
+            <div
+              className="euiStepNumber euiStepNumber--incomplete euiStepNumber-isHollow euiStep__circle"
+            />
+          </EuiStepNumber>
           <EuiTitle
             className="euiStep__title"
             size="s"
@@ -308,51 +316,60 @@ exports[`bulkCreate should display success message when bulkCreate is successful
             <span
               className="euiScreenReaderOnly"
             >
-              Step
+               Step 
             </span>
           </EuiScreenReaderOnly>
-          <div
-            className="euiStep__circle euiStep__circle--complete"
+          <EuiStepNumber
+            className="euiStep__circle"
+            isHollow={false}
+            number={1}
+            status="complete"
           >
-            <EuiIcon
-              className="euiStep__circleIcon"
-              color="ghost"
-              size="m"
-              type="check"
+            <div
+              className="euiStepNumber euiStepNumber--complete euiStep__circle"
             >
-              <check
-                className="euiIcon euiIcon--medium euiIcon--ghost euiStep__circleIcon"
-                focusable="false"
-                height="16"
-                style={null}
-                viewBox="0 0 16 16"
-                width="16"
-                xmlns="http://www.w3.org/2000/svg"
-                xmlnsXlink="http://www.w3.org/1999/xlink"
+              <EuiIcon
+                className="euiStepNumber__icon"
+                size="m"
+                title="complete"
+                type="check"
               >
-                <svg
-                  className="euiIcon euiIcon--medium euiIcon--ghost euiStep__circleIcon"
+                <check
+                  className="euiIcon euiIcon--medium euiStepNumber__icon"
                   focusable="false"
                   height="16"
-                  style={null}
+                  style={
+                    Object {
+                      "fill": undefined,
+                    }
+                  }
+                  title="complete"
                   viewBox="0 0 16 16"
                   width="16"
                   xmlns="http://www.w3.org/2000/svg"
-                  xmlnsXlink="http://www.w3.org/1999/xlink"
                 >
-                  <defs>
+                  <svg
+                    className="euiIcon euiIcon--medium euiStepNumber__icon"
+                    focusable="false"
+                    height="16"
+                    style={
+                      Object {
+                        "fill": undefined,
+                      }
+                    }
+                    title="complete"
+                    viewBox="0 0 16 16"
+                    width="16"
+                    xmlns="http://www.w3.org/2000/svg"
+                  >
                     <path
                       d="M6.5 12a.502.502 0 0 1-.354-.146l-4-4a.502.502 0 0 1 .708-.708L6.5 10.793l6.646-6.647a.502.502 0 0 1 .708.708l-7 7A.502.502 0 0 1 6.5 12"
-                      id="check-a"
                     />
-                  </defs>
-                  <use
-                    xlinkHref="#check-a"
-                  />
-                </svg>
-              </check>
-            </EuiIcon>
-          </div>
+                  </svg>
+                </check>
+              </EuiIcon>
+            </div>
+          </EuiStepNumber>
           <EuiTitle
             className="euiStep__title"
             size="s"
diff --git a/src/core_plugins/kibana/public/management/sections/indices/create_index_pattern_wizard/components/header/__tests__/__snapshots__/header.test.js.snap b/src/core_plugins/kibana/public/management/sections/indices/create_index_pattern_wizard/components/header/__tests__/__snapshots__/header.test.js.snap
index 3f072dcb8bfeb29..71e6009b2c1263b 100644
--- a/src/core_plugins/kibana/public/management/sections/indices/create_index_pattern_wizard/components/header/__tests__/__snapshots__/header.test.js.snap
+++ b/src/core_plugins/kibana/public/management/sections/indices/create_index_pattern_wizard/components/header/__tests__/__snapshots__/header.test.js.snap
@@ -10,9 +10,13 @@ exports[`Header should render normally 1`] = `
   >
     <h1>
       <FormattedMessage
-        defaultMessage="Create index pattern"
+        defaultMessage="Create {indexPatternName}"
         id="kbn.management.createIndexPatternHeader"
-        values={Object {}}
+        values={
+          Object {
+            "indexPatternName": undefined,
+          }
+        }
       />
     </h1>
   </EuiTitle>
@@ -46,23 +50,6 @@ exports[`Header should render normally 1`] = `
         </p>
       </EuiText>
     </EuiFlexItem>
-    <EuiFlexItem
-      component="div"
-      grow={false}
-    >
-      <EuiSwitch
-        checked={true}
-        id="checkboxShowSystemIndices"
-        label={
-          <FormattedMessage
-            defaultMessage="Include system indices"
-            id="kbn.management.createIndexPattern.includeSystemIndicesToggleSwitch"
-            values={Object {}}
-          />
-        }
-        onChange={[Function]}
-      />
-    </EuiFlexItem>
   </EuiFlexGroup>
   <EuiSpacer
     size="m"
@@ -80,9 +67,13 @@ exports[`Header should render without including system indices 1`] = `
   >
     <h1>
       <FormattedMessage
-        defaultMessage="Create index pattern"
+        defaultMessage="Create {indexPatternName}"
         id="kbn.management.createIndexPatternHeader"
-        values={Object {}}
+        values={
+          Object {
+            "indexPatternName": undefined,
+          }
+        }
       />
     </h1>
   </EuiTitle>
@@ -116,23 +107,6 @@ exports[`Header should render without including system indices 1`] = `
         </p>
       </EuiText>
     </EuiFlexItem>
-    <EuiFlexItem
-      component="div"
-      grow={false}
-    >
-      <EuiSwitch
-        checked={false}
-        id="checkboxShowSystemIndices"
-        label={
-          <FormattedMessage
-            defaultMessage="Include system indices"
-            id="kbn.management.createIndexPattern.includeSystemIndicesToggleSwitch"
-            values={Object {}}
-          />
-        }
-        onChange={[Function]}
-      />
-    </EuiFlexItem>
   </EuiFlexGroup>
   <EuiSpacer
     size="m"
diff --git a/src/core_plugins/kibana/public/management/sections/indices/create_index_pattern_wizard/components/step_index_pattern/components/status_message/__tests__/__snapshots__/status_message.test.js.snap b/src/core_plugins/kibana/public/management/sections/indices/create_index_pattern_wizard/components/step_index_pattern/components/status_message/__tests__/__snapshots__/status_message.test.js.snap
index 41d1ee57bea2044..0cdb384b3af2270 100644
--- a/src/core_plugins/kibana/public/management/sections/indices/create_index_pattern_wizard/components/step_index_pattern/components/status_message/__tests__/__snapshots__/status_message.test.js.snap
+++ b/src/core_plugins/kibana/public/management/sections/indices/create_index_pattern_wizard/components/step_index_pattern/components/status_message/__tests__/__snapshots__/status_message.test.js.snap
@@ -174,8 +174,8 @@ exports[`StatusMessage should show that system indices exist 1`] = `
   >
     <span>
       <FormattedMessage
-        defaultMessage="No Elasticsearch indices match your pattern. To view the matching system indices, toggle the switch in the upper right."
-        id="kbn.management.createIndexPattern.step.status.noSystemIndicesWithPromptLabel"
+        defaultMessage="No Elasticsearch indices match your pattern."
+        id="kbn.management.createIndexPattern.step.status.noSystemIndicesLabel"
         values={Object {}}
       />
     </span>
diff --git a/src/core_plugins/kibana/public/management/sections/indices/create_index_pattern_wizard/components/step_time_field/components/header/__tests__/__snapshots__/header.test.js.snap b/src/core_plugins/kibana/public/management/sections/indices/create_index_pattern_wizard/components/step_time_field/components/header/__tests__/__snapshots__/header.test.js.snap
index 414b83eccb77ca2..9abe47d4fe04d71 100644
--- a/src/core_plugins/kibana/public/management/sections/indices/create_index_pattern_wizard/components/step_time_field/components/header/__tests__/__snapshots__/header.test.js.snap
+++ b/src/core_plugins/kibana/public/management/sections/indices/create_index_pattern_wizard/components/step_time_field/components/header/__tests__/__snapshots__/header.test.js.snap
@@ -21,13 +21,14 @@ exports[`Header should render normally 1`] = `
     grow={true}
   >
     <FormattedMessage
-      defaultMessage="You've defined {indexPattern} as your index pattern. Now you can specify some settings before we create it."
+      defaultMessage="You've defined {indexPattern} as your {indexPatternName}. Now you can specify some settings before we create it."
       id="kbn.management.createIndexPattern.stepTimeLabel"
       values={
         Object {
           "indexPattern": <strong>
             ki*
           </strong>,
+          "indexPatternName": undefined,
         }
       }
     />
diff --git a/src/core_plugins/kibana/public/management/sections/indices/edit_index_pattern/indexed_fields_table/__tests__/__snapshots__/indexed_fields_table.test.js.snap b/src/core_plugins/kibana/public/management/sections/indices/edit_index_pattern/indexed_fields_table/__tests__/__snapshots__/indexed_fields_table.test.js.snap
index 45f8b04cbf712e3..277ad1248ff3e8d 100644
--- a/src/core_plugins/kibana/public/management/sections/indices/edit_index_pattern/indexed_fields_table/__tests__/__snapshots__/indexed_fields_table.test.js.snap
+++ b/src/core_plugins/kibana/public/management/sections/indices/edit_index_pattern/indexed_fields_table/__tests__/__snapshots__/indexed_fields_table.test.js.snap
@@ -17,6 +17,7 @@ exports[`IndexedFieldsTable should filter based on the query bar 1`] = `
             "excluded": false,
             "format": undefined,
             "indexPattern": undefined,
+            "info": undefined,
             "name": "Elastic",
             "routes": undefined,
             "searchable": true,
@@ -45,6 +46,7 @@ exports[`IndexedFieldsTable should filter based on the type filter 1`] = `
             "excluded": false,
             "format": undefined,
             "indexPattern": undefined,
+            "info": undefined,
             "name": "timestamp",
             "routes": undefined,
             "type": "date",
@@ -73,6 +75,7 @@ exports[`IndexedFieldsTable should render normally 1`] = `
             "excluded": false,
             "format": undefined,
             "indexPattern": undefined,
+            "info": undefined,
             "name": "Elastic",
             "routes": undefined,
             "searchable": true,
@@ -82,6 +85,7 @@ exports[`IndexedFieldsTable should render normally 1`] = `
             "excluded": false,
             "format": undefined,
             "indexPattern": undefined,
+            "info": undefined,
             "name": "timestamp",
             "routes": undefined,
             "type": "date",
@@ -91,6 +95,7 @@ exports[`IndexedFieldsTable should render normally 1`] = `
             "excluded": false,
             "format": undefined,
             "indexPattern": undefined,
+            "info": undefined,
             "name": "conflictingField",
             "routes": undefined,
             "type": "conflict",
diff --git a/src/core_plugins/kibana/public/management/sections/objects/components/objects_table/components/flyout/__tests__/__snapshots__/flyout.test.js.snap b/src/core_plugins/kibana/public/management/sections/objects/components/objects_table/components/flyout/__tests__/__snapshots__/flyout.test.js.snap
index d7b59820ea9d368..5d9e407c053b3ae 100644
--- a/src/core_plugins/kibana/public/management/sections/objects/components/objects_table/components/flyout/__tests__/__snapshots__/flyout.test.js.snap
+++ b/src/core_plugins/kibana/public/management/sections/objects/components/objects_table/components/flyout/__tests__/__snapshots__/flyout.test.js.snap
@@ -4,6 +4,7 @@ exports[`Flyout conflicts should allow conflict resolution 1`] = `
 <EuiFlyout
   closeButtonAriaLabel="Closes this dialog"
   hideCloseButton={false}
+  maxWidth={false}
   onClose={[MockFunction]}
   ownFocus={false}
   size="m"
@@ -164,6 +165,7 @@ exports[`Flyout should render import step 1`] = `
 <EuiFlyout
   closeButtonAriaLabel="Closes this dialog"
   hideCloseButton={false}
+  maxWidth={false}
   onClose={[MockFunction]}
   ownFocus={false}
   size="m"
diff --git a/src/core_plugins/kibana/public/management/sections/objects/components/objects_table/components/relationships/__tests__/__snapshots__/relationships.test.js.snap b/src/core_plugins/kibana/public/management/sections/objects/components/objects_table/components/relationships/__tests__/__snapshots__/relationships.test.js.snap
index 1d5107b4fdfb39f..a027f233b25ac9f 100644
--- a/src/core_plugins/kibana/public/management/sections/objects/components/objects_table/components/relationships/__tests__/__snapshots__/relationships.test.js.snap
+++ b/src/core_plugins/kibana/public/management/sections/objects/components/objects_table/components/relationships/__tests__/__snapshots__/relationships.test.js.snap
@@ -4,6 +4,7 @@ exports[`Relationships should render dashboards normally 1`] = `
 <EuiFlyout
   closeButtonAriaLabel="Closes this dialog"
   hideCloseButton={false}
+  maxWidth={false}
   onClose={[MockFunction]}
   ownFocus={false}
   size="m"
@@ -108,6 +109,7 @@ exports[`Relationships should render errors 1`] = `
 <EuiFlyout
   closeButtonAriaLabel="Closes this dialog"
   hideCloseButton={false}
+  maxWidth={false}
   onClose={[MockFunction]}
   ownFocus={false}
   size="m"
@@ -150,6 +152,7 @@ exports[`Relationships should render index patterns normally 1`] = `
 <EuiFlyout
   closeButtonAriaLabel="Closes this dialog"
   hideCloseButton={false}
+  maxWidth={false}
   onClose={[MockFunction]}
   ownFocus={false}
   size="m"
@@ -310,6 +313,7 @@ exports[`Relationships should render searches normally 1`] = `
 <EuiFlyout
   closeButtonAriaLabel="Closes this dialog"
   hideCloseButton={false}
+  maxWidth={false}
   onClose={[MockFunction]}
   ownFocus={false}
   size="m"
@@ -468,6 +472,7 @@ exports[`Relationships should render visualizations normally 1`] = `
 <EuiFlyout
   closeButtonAriaLabel="Closes this dialog"
   hideCloseButton={false}
+  maxWidth={false}
   onClose={[MockFunction]}
   ownFocus={false}
   size="m"
diff --git a/src/ui/public/field_editor/components/field_format_editor/editors/url/__snapshots__/label_template_flyout.test.js.snap b/src/ui/public/field_editor/components/field_format_editor/editors/url/__snapshots__/label_template_flyout.test.js.snap
index 791f7b9a40f1b10..2a4c0b1eac04d39 100644
--- a/src/ui/public/field_editor/components/field_format_editor/editors/url/__snapshots__/label_template_flyout.test.js.snap
+++ b/src/ui/public/field_editor/components/field_format_editor/editors/url/__snapshots__/label_template_flyout.test.js.snap
@@ -6,6 +6,7 @@ exports[`LabelTemplateFlyout should render normally 1`] = `
 <EuiFlyout
   closeButtonAriaLabel="Closes this dialog"
   hideCloseButton={false}
+  maxWidth={false}
   onClose={[Function]}
   ownFocus={false}
   size="m"
diff --git a/src/ui/public/field_editor/components/field_format_editor/editors/url/__snapshots__/url_template_flyout.test.js.snap b/src/ui/public/field_editor/components/field_format_editor/editors/url/__snapshots__/url_template_flyout.test.js.snap
index e8ce349b544b89a..f340e6f2bfbe65f 100644
--- a/src/ui/public/field_editor/components/field_format_editor/editors/url/__snapshots__/url_template_flyout.test.js.snap
+++ b/src/ui/public/field_editor/components/field_format_editor/editors/url/__snapshots__/url_template_flyout.test.js.snap
@@ -6,6 +6,7 @@ exports[`UrlTemplateFlyout should render normally 1`] = `
 <EuiFlyout
   closeButtonAriaLabel="Closes this dialog"
   hideCloseButton={false}
+  maxWidth={false}
   onClose={[Function]}
   ownFocus={false}
   size="m"
diff --git a/src/ui/public/field_editor/components/scripting_help/__snapshots__/help_flyout.test.js.snap b/src/ui/public/field_editor/components/scripting_help/__snapshots__/help_flyout.test.js.snap
index 95db3176501fd7d..3e7298b2f083921 100644
--- a/src/ui/public/field_editor/components/scripting_help/__snapshots__/help_flyout.test.js.snap
+++ b/src/ui/public/field_editor/components/scripting_help/__snapshots__/help_flyout.test.js.snap
@@ -5,6 +5,7 @@ exports[`ScriptingHelpFlyout should render normally 1`] = `
   closeButtonAriaLabel="Closes this dialog"
   data-test-subj="scriptedFieldsHelpFlyout"
   hideCloseButton={false}
+  maxWidth={false}
   onClose={[Function]}
   ownFocus={false}
   size="m"
diff --git a/x-pack/package.json b/x-pack/package.json
index cbfe3ce94fa212a..1b5195a7714b22e 100644
--- a/x-pack/package.json
+++ b/x-pack/package.json
@@ -79,7 +79,7 @@
     "yargs": "4.7.1"
   },
   "dependencies": {
-    "@elastic/eui": "3.2.1",
+    "@elastic/eui": "3.4.0",
     "@elastic/node-crypto": "0.1.2",
     "@elastic/node-phantom-simple": "2.2.4",
     "@elastic/numeral": "2.3.2",
diff --git a/x-pack/plugins/apm/public/components/app/ErrorGroupOverview/List/__test__/__snapshots__/List.test.js.snap b/x-pack/plugins/apm/public/components/app/ErrorGroupOverview/List/__test__/__snapshots__/List.test.js.snap
index 9756071da79acb7..56a2847ca482494 100644
--- a/x-pack/plugins/apm/public/components/app/ErrorGroupOverview/List/__test__/__snapshots__/List.test.js.snap
+++ b/x-pack/plugins/apm/public/components/app/ErrorGroupOverview/List/__test__/__snapshots__/List.test.js.snap
@@ -70,6 +70,7 @@ exports[`ErrorGroupOverview -> List should render empty state 1`] = `
         <tr>
           <th
             className="euiTableHeaderCell"
+            data-test-subj="tableHeaderCell_groupId_0"
             scope="col"
             width="96px"
           >
@@ -85,6 +86,7 @@ exports[`ErrorGroupOverview -> List should render empty state 1`] = `
           </th>
           <th
             className="euiTableHeaderCell"
+            data-test-subj="tableHeaderCell_message_1"
             scope="col"
             width="50%"
           >
@@ -100,6 +102,7 @@ exports[`ErrorGroupOverview -> List should render empty state 1`] = `
           </th>
           <th
             className="euiTableHeaderCell"
+            data-test-subj="tableHeaderCell_handled_2"
             scope="col"
           >
             <div
@@ -112,11 +115,13 @@ exports[`ErrorGroupOverview -> List should render empty state 1`] = `
           </th>
           <th
             className="euiTableHeaderCell"
+            data-test-subj="tableHeaderCell_occurrenceCount_3"
             scope="col"
           >
             <button
               aria-label="Sort Occurrences ascending"
               className="euiTableHeaderButton"
+              data-test-subj="tableHeaderSortButton"
               onClick={[Function]}
               type="button"
             >
@@ -133,11 +138,13 @@ exports[`ErrorGroupOverview -> List should render empty state 1`] = `
           </th>
           <th
             className="euiTableHeaderCell"
+            data-test-subj="tableHeaderCell_latestOccurrenceAt_4"
             scope="col"
           >
             <button
               aria-label="Sort Latest occurrence ascending"
               className="euiTableHeaderButton euiTableHeaderButton-isSorted"
+              data-test-subj="tableHeaderSortButton"
               onClick={[Function]}
               type="button"
             >
@@ -367,6 +374,7 @@ exports[`ErrorGroupOverview -> List should render with data 1`] = `
         <tr>
           <th
             className="euiTableHeaderCell"
+            data-test-subj="tableHeaderCell_groupId_0"
             scope="col"
             width="96px"
           >
@@ -382,6 +390,7 @@ exports[`ErrorGroupOverview -> List should render with data 1`] = `
           </th>
           <th
             className="euiTableHeaderCell"
+            data-test-subj="tableHeaderCell_message_1"
             scope="col"
             width="50%"
           >
@@ -397,6 +406,7 @@ exports[`ErrorGroupOverview -> List should render with data 1`] = `
           </th>
           <th
             className="euiTableHeaderCell"
+            data-test-subj="tableHeaderCell_handled_2"
             scope="col"
           >
             <div
@@ -409,11 +419,13 @@ exports[`ErrorGroupOverview -> List should render with data 1`] = `
           </th>
           <th
             className="euiTableHeaderCell"
+            data-test-subj="tableHeaderCell_occurrenceCount_3"
             scope="col"
           >
             <button
               aria-label="Sort Occurrences ascending"
               className="euiTableHeaderButton"
+              data-test-subj="tableHeaderSortButton"
               onClick={[Function]}
               type="button"
             >
@@ -430,11 +442,13 @@ exports[`ErrorGroupOverview -> List should render with data 1`] = `
           </th>
           <th
             className="euiTableHeaderCell"
+            data-test-subj="tableHeaderCell_latestOccurrenceAt_4"
             scope="col"
           >
             <button
               aria-label="Sort Latest occurrence ascending"
               className="euiTableHeaderButton euiTableHeaderButton-isSorted"
+              data-test-subj="tableHeaderSortButton"
               onClick={[Function]}
               type="button"
             >
diff --git a/x-pack/plugins/apm/public/components/app/ServiceOverview/List/__test__/__snapshots__/List.test.js.snap b/x-pack/plugins/apm/public/components/app/ServiceOverview/List/__test__/__snapshots__/List.test.js.snap
index fe0a5b2b21cbab6..f8a651623919760 100644
--- a/x-pack/plugins/apm/public/components/app/ServiceOverview/List/__test__/__snapshots__/List.test.js.snap
+++ b/x-pack/plugins/apm/public/components/app/ServiceOverview/List/__test__/__snapshots__/List.test.js.snap
@@ -70,12 +70,14 @@ exports[`ErrorGroupOverview -> List should render empty state 1`] = `
         <tr>
           <th
             className="euiTableHeaderCell"
+            data-test-subj="tableHeaderCell_serviceName_0"
             scope="col"
             width="50%"
           >
             <button
               aria-label="Sort Name descending"
               className="euiTableHeaderButton euiTableHeaderButton-isSorted"
+              data-test-subj="tableHeaderSortButton"
               onClick={[Function]}
               type="button"
             >
@@ -117,11 +119,13 @@ exports[`ErrorGroupOverview -> List should render empty state 1`] = `
           </th>
           <th
             className="euiTableHeaderCell"
+            data-test-subj="tableHeaderCell_agentName_1"
             scope="col"
           >
             <button
               aria-label="Sort Agent ascending"
               className="euiTableHeaderButton"
+              data-test-subj="tableHeaderSortButton"
               onClick={[Function]}
               type="button"
             >
@@ -138,11 +142,13 @@ exports[`ErrorGroupOverview -> List should render empty state 1`] = `
           </th>
           <th
             className="euiTableHeaderCell"
+            data-test-subj="tableHeaderCell_avgResponseTime_2"
             scope="col"
           >
             <button
               aria-label="Sort Avg. response time ascending"
               className="euiTableHeaderButton"
+              data-test-subj="tableHeaderSortButton"
               onClick={[Function]}
               type="button"
             >
@@ -159,11 +165,13 @@ exports[`ErrorGroupOverview -> List should render empty state 1`] = `
           </th>
           <th
             className="euiTableHeaderCell"
+            data-test-subj="tableHeaderCell_transactionsPerMinute_3"
             scope="col"
           >
             <button
               aria-label="Sort Trans. per minute ascending"
               className="euiTableHeaderButton"
+              data-test-subj="tableHeaderSortButton"
               onClick={[Function]}
               type="button"
             >
@@ -180,11 +188,13 @@ exports[`ErrorGroupOverview -> List should render empty state 1`] = `
           </th>
           <th
             className="euiTableHeaderCell"
+            data-test-subj="tableHeaderCell_errorsPerMinute_4"
             scope="col"
           >
             <button
               aria-label="Sort Errors per minute ascending"
               className="euiTableHeaderButton"
+              data-test-subj="tableHeaderSortButton"
               onClick={[Function]}
               type="button"
             >
@@ -372,12 +382,14 @@ exports[`ErrorGroupOverview -> List should render with data 1`] = `
         <tr>
           <th
             className="euiTableHeaderCell"
+            data-test-subj="tableHeaderCell_serviceName_0"
             scope="col"
             width="50%"
           >
             <button
               aria-label="Sort Name descending"
               className="euiTableHeaderButton euiTableHeaderButton-isSorted"
+              data-test-subj="tableHeaderSortButton"
               onClick={[Function]}
               type="button"
             >
@@ -419,11 +431,13 @@ exports[`ErrorGroupOverview -> List should render with data 1`] = `
           </th>
           <th
             className="euiTableHeaderCell"
+            data-test-subj="tableHeaderCell_agentName_1"
             scope="col"
           >
             <button
               aria-label="Sort Agent ascending"
               className="euiTableHeaderButton"
+              data-test-subj="tableHeaderSortButton"
               onClick={[Function]}
               type="button"
             >
@@ -440,11 +454,13 @@ exports[`ErrorGroupOverview -> List should render with data 1`] = `
           </th>
           <th
             className="euiTableHeaderCell"
+            data-test-subj="tableHeaderCell_avgResponseTime_2"
             scope="col"
           >
             <button
               aria-label="Sort Avg. response time ascending"
               className="euiTableHeaderButton"
+              data-test-subj="tableHeaderSortButton"
               onClick={[Function]}
               type="button"
             >
@@ -461,11 +477,13 @@ exports[`ErrorGroupOverview -> List should render with data 1`] = `
           </th>
           <th
             className="euiTableHeaderCell"
+            data-test-subj="tableHeaderCell_transactionsPerMinute_3"
             scope="col"
           >
             <button
               aria-label="Sort Trans. per minute ascending"
               className="euiTableHeaderButton"
+              data-test-subj="tableHeaderSortButton"
               onClick={[Function]}
               type="button"
             >
@@ -482,11 +500,13 @@ exports[`ErrorGroupOverview -> List should render with data 1`] = `
           </th>
           <th
             className="euiTableHeaderCell"
+            data-test-subj="tableHeaderCell_errorsPerMinute_4"
             scope="col"
           >
             <button
               aria-label="Sort Errors per minute ascending"
               className="euiTableHeaderButton"
+              data-test-subj="tableHeaderSortButton"
               onClick={[Function]}
               type="button"
             >
diff --git a/x-pack/plugins/ml/public/components/rule_editor/__snapshots__/rule_editor_flyout.test.js.snap b/x-pack/plugins/ml/public/components/rule_editor/__snapshots__/rule_editor_flyout.test.js.snap
index 63dd75af73c820c..5b05a0eb0fb11b2 100644
--- a/x-pack/plugins/ml/public/components/rule_editor/__snapshots__/rule_editor_flyout.test.js.snap
+++ b/x-pack/plugins/ml/public/components/rule_editor/__snapshots__/rule_editor_flyout.test.js.snap
@@ -11,6 +11,7 @@ exports[`RuleEditorFlyout renders the flyout after adding a condition to a rule
     className="ml-rule-editor-flyout"
     closeButtonAriaLabel="Closes this dialog"
     hideCloseButton={false}
+    maxWidth={false}
     onClose={[Function]}
     ownFocus={false}
     size="m"
@@ -230,6 +231,7 @@ exports[`RuleEditorFlyout renders the flyout after setting the rule to edit 1`]
     className="ml-rule-editor-flyout"
     closeButtonAriaLabel="Closes this dialog"
     hideCloseButton={false}
+    maxWidth={false}
     onClose={[Function]}
     ownFocus={false}
     size="m"
@@ -463,6 +465,7 @@ exports[`RuleEditorFlyout renders the flyout for creating a rule with conditions
     className="ml-rule-editor-flyout"
     closeButtonAriaLabel="Closes this dialog"
     hideCloseButton={false}
+    maxWidth={false}
     onClose={[Function]}
     ownFocus={false}
     size="m"
@@ -674,6 +677,7 @@ exports[`RuleEditorFlyout renders the select action component for a detector wit
     className="ml-rule-editor-flyout"
     closeButtonAriaLabel="Closes this dialog"
     hideCloseButton={false}
+    maxWidth={false}
     onClose={[Function]}
     ownFocus={false}
     size="m"
diff --git a/x-pack/plugins/monitoring/public/components/logstash/pipeline_viewer/views/__test__/__snapshots__/detail_drawer.test.js.snap b/x-pack/plugins/monitoring/public/components/logstash/pipeline_viewer/views/__test__/__snapshots__/detail_drawer.test.js.snap
index 79ef140a11d66cb..b704a6dbed56555 100644
--- a/x-pack/plugins/monitoring/public/components/logstash/pipeline_viewer/views/__test__/__snapshots__/detail_drawer.test.js.snap
+++ b/x-pack/plugins/monitoring/public/components/logstash/pipeline_viewer/views/__test__/__snapshots__/detail_drawer.test.js.snap
@@ -4,6 +4,7 @@ exports[`DetailDrawer component If vertices shows basic info and no stats for if
 <EuiFlyout
   closeButtonAriaLabel="Closes this dialog"
   hideCloseButton={false}
+  maxWidth={false}
   onClose={[MockFunction]}
   ownFocus={false}
   size="s"
@@ -72,6 +73,7 @@ exports[`DetailDrawer component Plugin vertices Plugin does not have explicit ID
 <EuiFlyout
   closeButtonAriaLabel="Closes this dialog"
   hideCloseButton={false}
+  maxWidth={false}
   onClose={[MockFunction]}
   ownFocus={false}
   size="s"
@@ -362,6 +364,7 @@ exports[`DetailDrawer component Plugin vertices Plugin has explicit ID shows bas
 <EuiFlyout
   closeButtonAriaLabel="Closes this dialog"
   hideCloseButton={false}
+  maxWidth={false}
   onClose={[MockFunction]}
   ownFocus={false}
   size="s"
@@ -648,6 +651,7 @@ exports[`DetailDrawer component Queue vertices shows basic info and no stats for
 <EuiFlyout
   closeButtonAriaLabel="Closes this dialog"
   hideCloseButton={false}
+  maxWidth={false}
   onClose={[MockFunction]}
   ownFocus={false}
   size="s"
@@ -706,6 +710,7 @@ exports[`DetailDrawer component shows vertex title 1`] = `
 <EuiFlyout
   closeButtonAriaLabel="Closes this dialog"
   hideCloseButton={false}
+  maxWidth={false}
   onClose={[MockFunction]}
   ownFocus={false}
   size="s"
diff --git a/x-pack/plugins/monitoring/public/components/no_data/__tests__/__snapshots__/no_data.test.js.snap b/x-pack/plugins/monitoring/public/components/no_data/__tests__/__snapshots__/no_data.test.js.snap
index 50388662b334255..04d00c28f1852c2 100644
--- a/x-pack/plugins/monitoring/public/components/no_data/__tests__/__snapshots__/no_data.test.js.snap
+++ b/x-pack/plugins/monitoring/public/components/no_data/__tests__/__snapshots__/no_data.test.js.snap
@@ -2,10 +2,10 @@
 
 exports[`NoData should show a default message if reason is unknown 1`] = `
 <div
-  class="euiPage euiPage--widthIsNotRestricted"
+  class="euiPage"
 >
   <div
-    class="euiPageBody euiPage--widthIsNotRestricted"
+    class="euiPageBody"
   >
     <div
       class="euiPanel euiPanel--paddingLarge euiPageContent noData__content euiPageContent--verticalCenter euiPageContent--horizontalCenter"
@@ -82,10 +82,10 @@ exports[`NoData should show a default message if reason is unknown 1`] = `
 
 exports[`NoData should show text next to the spinner while checking a setting 1`] = `
 <div
-  class="euiPage euiPage--widthIsNotRestricted"
+  class="euiPage"
 >
   <div
-    class="euiPageBody euiPage--widthIsNotRestricted"
+    class="euiPageBody"
   >
     <div
       class="euiPanel euiPanel--paddingLarge euiPageContent noData__content euiPageContent--verticalCenter euiPageContent--horizontalCenter"
diff --git a/x-pack/plugins/monitoring/public/components/page_loading/__tests__/__snapshots__/page_loading.test.js.snap b/x-pack/plugins/monitoring/public/components/page_loading/__tests__/__snapshots__/page_loading.test.js.snap
index 3f6051ac64d4779..d26d822f2334cbd 100644
--- a/x-pack/plugins/monitoring/public/components/page_loading/__tests__/__snapshots__/page_loading.test.js.snap
+++ b/x-pack/plugins/monitoring/public/components/page_loading/__tests__/__snapshots__/page_loading.test.js.snap
@@ -2,10 +2,10 @@
 
 exports[`PageLoading should show a simple page loading component 1`] = `
 <div
-  class="euiPage euiPage--widthIsNotRestricted"
+  class="euiPage"
 >
   <div
-    class="euiPageBody euiPage--widthIsNotRestricted"
+    class="euiPageBody"
   >
     <div
       class="euiPanel euiPanel--paddingLarge euiPageContent noData__content euiPageContent--verticalCenter euiPageContent--horizontalCenter"
diff --git a/x-pack/yarn.lock b/x-pack/yarn.lock
index d9af2f61c0a4a5e..26f9180e17dea35 100644
--- a/x-pack/yarn.lock
+++ b/x-pack/yarn.lock
@@ -10,9 +10,9 @@
     esutils "^2.0.2"
     js-tokens "^3.0.0"
 
-"@elastic/eui@3.2.1":
-  version "3.2.1"
-  resolved "https://registry.yarnpkg.com/@elastic/eui/-/eui-3.2.1.tgz#43bed65a6751d8d99d59570f7e04292d2f276e5a"
+"@elastic/eui@3.4.0":
+  version "3.4.0"
+  resolved "https://registry.yarnpkg.com/@elastic/eui/-/eui-3.4.0.tgz#8eb661b56fc84a27682e008ef9d6913d1b519c07"
   dependencies:
     classnames "^2.2.5"
     core-js "^2.5.1"
@@ -29,6 +29,7 @@
     react-input-autosize "^2.2.1"
     react-virtualized "^9.18.5"
     react-vis "1.10.2"
+    resize-observer-polyfill "^1.5.0"
     tabbable "^1.1.0"
     uuid "^3.1.0"
 
@@ -6702,6 +6703,10 @@ reselect@3.0.1:
   version "3.0.1"
   resolved "https://registry.yarnpkg.com/reselect/-/reselect-3.0.1.tgz#efdaa98ea7451324d092b2b2163a6a1d7a9a2147"
 
+resize-observer-polyfill@^1.5.0:
+  version "1.5.0"
+  resolved "https://registry.yarnpkg.com/resize-observer-polyfill/-/resize-observer-polyfill-1.5.0.tgz#660ff1d9712a2382baa2cad450a4716209f9ca69"
+
 resolve-cwd@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/resolve-cwd/-/resolve-cwd-2.0.0.tgz#00a9f7387556e27038eae232caa372a6a59b665a"
diff --git a/yarn.lock b/yarn.lock
index f08e41d15f75a21..6018a86d1522a48 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -81,9 +81,9 @@
   version "0.0.0"
   uid ""
 
-"@elastic/eui@3.2.1":
-  version "3.2.1"
-  resolved "https://registry.yarnpkg.com/@elastic/eui/-/eui-3.2.1.tgz#43bed65a6751d8d99d59570f7e04292d2f276e5a"
+"@elastic/eui@3.4.0":
+  version "3.4.0"
+  resolved "https://registry.yarnpkg.com/@elastic/eui/-/eui-3.4.0.tgz#8eb661b56fc84a27682e008ef9d6913d1b519c07"
   dependencies:
     classnames "^2.2.5"
     core-js "^2.5.1"
@@ -100,6 +100,7 @@
     react-input-autosize "^2.2.1"
     react-virtualized "^9.18.5"
     react-vis "1.10.2"
+    resize-observer-polyfill "^1.5.0"
     tabbable "^1.1.0"
     uuid "^3.1.0"
 
@@ -11654,6 +11655,10 @@ resize-observer-polyfill@1.2.1:
   version "1.2.1"
   resolved "https://registry.yarnpkg.com/resize-observer-polyfill/-/resize-observer-polyfill-1.2.1.tgz#55a4ff3e4f212a76470835fb7590dbb62a3e6542"
 
+resize-observer-polyfill@^1.5.0:
+  version "1.5.0"
+  resolved "https://registry.yarnpkg.com/resize-observer-polyfill/-/resize-observer-polyfill-1.5.0.tgz#660ff1d9712a2382baa2cad450a4716209f9ca69"
+
 resolve-cwd@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/resolve-cwd/-/resolve-cwd-2.0.0.tgz#00a9f7387556e27038eae232caa372a6a59b665a"