diff --git a/elastic_eui_95.9.0_vr_option3_02.tgz b/elastic_eui_95.9.0_vr_option3_02.tgz
new file mode 100644
index 0000000000000..ff62c941d562f
Binary files /dev/null and b/elastic_eui_95.9.0_vr_option3_02.tgz differ
diff --git a/package.json b/package.json
index 0d33a390bce5d..f835e7ed1637c 100644
--- a/package.json
+++ b/package.json
@@ -115,7 +115,7 @@
     "@elastic/ecs": "^8.11.1",
     "@elastic/elasticsearch": "^8.15.0",
     "@elastic/ems-client": "8.5.3",
-    "@elastic/eui": "95.7.0",
+    "@elastic/eui": "./elastic_eui_95.9.0_vr_option3_02.tgz",
     "@elastic/filesaver": "1.1.2",
     "@elastic/node-crypto": "1.2.1",
     "@elastic/numeral": "^2.5.1",
diff --git a/packages/core/chrome/core-chrome-browser-internal/src/ui/header/__snapshots__/screen_reader_a11y.test.tsx.snap b/packages/core/chrome/core-chrome-browser-internal/src/ui/header/__snapshots__/screen_reader_a11y.test.tsx.snap
index 66e9717bbc1f4..af2a055abc376 100644
--- a/packages/core/chrome/core-chrome-browser-internal/src/ui/header/__snapshots__/screen_reader_a11y.test.tsx.snap
+++ b/packages/core/chrome/core-chrome-browser-internal/src/ui/header/__snapshots__/screen_reader_a11y.test.tsx.snap
@@ -223,7 +223,6 @@ exports[`ScreenReaderRouteAnnouncements renders 1`] = `
     <EuiScreenReaderOnly>
       <div
         css="unknown styles"
-        key="null"
         tabIndex={-1}
       >
         <Insertion
diff --git a/packages/core/i18n/core-i18n-browser-internal/src/__snapshots__/i18n_service.test.tsx.snap b/packages/core/i18n/core-i18n-browser-internal/src/__snapshots__/i18n_service.test.tsx.snap
index ca90bcbdb67ba..4f04a571c845b 100644
--- a/packages/core/i18n/core-i18n-browser-internal/src/__snapshots__/i18n_service.test.tsx.snap
+++ b/packages/core/i18n/core-i18n-browser-internal/src/__snapshots__/i18n_service.test.tsx.snap
@@ -140,6 +140,7 @@ exports[`#start() returns \`Context\` component 1`] = `
           "euiExternalLinkIcon.newTarget.screenReaderOnlyText": "(opens in a new tab or window)",
           "euiFieldPassword.maskPassword": "Mask password",
           "euiFieldPassword.showPassword": "Show password as plain text. Note: this will visually expose your password on the screen.",
+          "euiFieldSearch.clearSearchButtonLabel": "Clear search input",
           "euiFilePicker.filesSelected": [Function],
           "euiFilePicker.promptText": "Select or drag and drop a file",
           "euiFilePicker.removeSelected": "Remove",
diff --git a/packages/core/i18n/core-i18n-browser-internal/src/i18n_eui_mapping.tsx b/packages/core/i18n/core-i18n-browser-internal/src/i18n_eui_mapping.tsx
index 34e6ef5ab0380..b0ba2dfe7fcf8 100644
--- a/packages/core/i18n/core-i18n-browser-internal/src/i18n_eui_mapping.tsx
+++ b/packages/core/i18n/core-i18n-browser-internal/src/i18n_eui_mapping.tsx
@@ -725,6 +725,10 @@ export const getEuiContextMapping = (): EuiTokensObject => {
     'euiFieldPassword.maskPassword': i18n.translate('core.euiFieldPassword.maskPassword', {
       defaultMessage: 'Mask password',
     }),
+    'euiFieldSearch.clearSearchButtonLabel': i18n.translate(
+      'core.euiFieldSearch.clearSearchButtonLabel',
+      { defaultMessage: 'Clear search input' }
+    ),
     'euiFilePicker.removeSelectedAriaLabel': i18n.translate(
       'core.euiFilePicker.removeSelectedAriaLabel',
       {
diff --git a/packages/kbn-coloring/src/shared_components/coloring/color_ranges/color_ranges_item.tsx b/packages/kbn-coloring/src/shared_components/coloring/color_ranges/color_ranges_item.tsx
index 12c58c0c8763a..c674d512f9f3d 100644
--- a/packages/kbn-coloring/src/shared_components/coloring/color_ranges/color_ranges_item.tsx
+++ b/packages/kbn-coloring/src/shared_components/coloring/color_ranges/color_ranges_item.tsx
@@ -221,7 +221,7 @@ export function ColorRangeItem({
           append={getAppend(rangeType, mode)}
           onBlur={onLeaveFocus}
           data-test-subj={`lnsPalettePanel_dynamicColoring_range_value_${index}`}
-          prepend={<span className="euiFormLabel">{isLast ? '\u2264' : '\u2265'}</span>}
+          prepend={isLast ? '\u2264' : '\u2265'}
           aria-label={i18n.translate('coloring.dynamicColoring.customPalette.rangeAriaLabel', {
             defaultMessage: 'Range {index}',
             values: {
diff --git a/packages/kbn-reporting/public/share/share_context_menu/__snapshots__/screen_capture_panel_content.test.tsx.snap b/packages/kbn-reporting/public/share/share_context_menu/__snapshots__/screen_capture_panel_content.test.tsx.snap
index 82e1787a7e2a5..4060d535bc875 100644
--- a/packages/kbn-reporting/public/share/share_context_menu/__snapshots__/screen_capture_panel_content.test.tsx.snap
+++ b/packages/kbn-reporting/public/share/share_context_menu/__snapshots__/screen_capture_panel_content.test.tsx.snap
@@ -16,7 +16,7 @@ exports[`ScreenCapturePanelContent properly renders a view with "canvas" layout
     class="euiSpacer euiSpacer--s emotion-euiSpacer-s"
   />
   <div
-    class="euiFormRow"
+    class="euiFormRow emotion-euiFormRow"
     id="generated-id-row"
   >
     <div
@@ -29,41 +29,39 @@ exports[`ScreenCapturePanelContent properly renders a view with "canvas" layout
           aria-checked="false"
           aria-describedby="generated-id-help-0"
           aria-labelledby="generated-id"
-          class="euiSwitch__button"
+          class="euiSwitch__button emotion-euiSwitch__button"
           data-test-subj="reportModeToggle"
           id="generated-id"
           role="switch"
           type="button"
         >
           <span
-            class="euiSwitch__body"
+            class="euiSwitch__body emotion-euiSwitch__body-off"
           >
             <span
-              class="euiSwitch__thumb"
-            />
-            <span
-              class="euiSwitch__track"
+              class="euiSwitch__icons emotion-euiSwitch__icons-off-enabled"
             >
               <span
-                class="euiSwitch__icon"
-                data-euiicon-type="cross"
+                data-euiicon-type="check"
               />
               <span
-                class="euiSwitch__icon euiSwitch__icon--checked"
-                data-euiicon-type="check"
+                data-euiicon-type="cross"
               />
             </span>
           </span>
+          <span
+            class="euiSwitch__thumb emotion-euiSwitch__thumb-off"
+          />
         </button>
         <span
-          class="euiSwitch__label"
+          class="euiSwitch__label emotion-euiSwitch__label"
           id="generated-id"
         >
           Full page layout
         </span>
       </div>
       <div
-        class="euiFormHelpText euiFormRow__text"
+        class="euiFormHelpText euiFormRow__text emotion-euiFormHelpText"
         id="generated-id-help-0"
       >
         Remove borders and footer logo
@@ -200,7 +198,7 @@ exports[`ScreenCapturePanelContent properly renders a view with "print" layout o
     class="euiSpacer euiSpacer--s emotion-euiSpacer-s"
   />
   <div
-    class="euiFormRow"
+    class="euiFormRow emotion-euiFormRow"
     id="generated-id-row"
   >
     <div
@@ -213,41 +211,39 @@ exports[`ScreenCapturePanelContent properly renders a view with "print" layout o
           aria-checked="false"
           aria-describedby="generated-id-help-0"
           aria-labelledby="generated-id"
-          class="euiSwitch__button"
+          class="euiSwitch__button emotion-euiSwitch__button"
           data-test-subj="usePrintLayout"
           id="generated-id"
           role="switch"
           type="button"
         >
           <span
-            class="euiSwitch__body"
+            class="euiSwitch__body emotion-euiSwitch__body-off"
           >
             <span
-              class="euiSwitch__thumb"
-            />
-            <span
-              class="euiSwitch__track"
+              class="euiSwitch__icons emotion-euiSwitch__icons-off-enabled"
             >
               <span
-                class="euiSwitch__icon"
-                data-euiicon-type="cross"
+                data-euiicon-type="check"
               />
               <span
-                class="euiSwitch__icon euiSwitch__icon--checked"
-                data-euiicon-type="check"
+                data-euiicon-type="cross"
               />
             </span>
           </span>
+          <span
+            class="euiSwitch__thumb emotion-euiSwitch__thumb-off"
+          />
         </button>
         <span
-          class="euiSwitch__label"
+          class="euiSwitch__label emotion-euiSwitch__label"
           id="generated-id"
         >
           Optimize for printing
         </span>
       </div>
       <div
-        class="euiFormHelpText euiFormRow__text"
+        class="euiFormHelpText euiFormRow__text emotion-euiFormHelpText"
         id="generated-id-help-0"
       >
         Uses multiple pages, showing at most 2 visualizations per page
diff --git a/packages/kbn-search-connectors/components/cron_editor/__snapshots__/cron_editor.test.tsx.snap b/packages/kbn-search-connectors/components/cron_editor/__snapshots__/cron_editor.test.tsx.snap
index 5625124ec3efb..06811b0aac2f3 100644
--- a/packages/kbn-search-connectors/components/cron_editor/__snapshots__/cron_editor.test.tsx.snap
+++ b/packages/kbn-search-connectors/components/cron_editor/__snapshots__/cron_editor.test.tsx.snap
@@ -3,14 +3,14 @@
 exports[`CronEditor is rendered with a DAY frequency 1`] = `
 Array [
   <div
-    class="euiFormRow euiFormRow--fullWidth euiFormRow--hasLabel"
+    class="euiFormRow euiFormRow--hasLabel emotion-euiFormRow-fullWidth"
     id="generated-id-row"
   >
     <div
       class="euiFormRow__labelWrapper"
     >
       <label
-        class="euiFormLabel euiFormRow__label"
+        class="euiFormLabel euiFormRow__label emotion-euiFormLabel"
         for="generated-id"
         id="generated-id-label"
       >
@@ -21,16 +21,20 @@ Array [
       class="euiFormRow__fieldWrapper"
     >
       <div
-        class="euiFormControlLayout euiFormControlLayout--fullWidth euiFormControlLayout--group"
+        class="euiFormControlLayout euiFormControlLayout--group emotion-euiFormControlLayout-fullWidth-group"
       >
-        <label
-          class="euiFormLabel euiFormControlLayout__prepend"
-          for="generated-id"
+        <div
+          class="euiFormControlLayout__prepend emotion-euiFormControlLayout__side-prepend"
         >
-          Every
-        </label>
+          <label
+            class="euiFormLabel emotion-euiFormLabel"
+            for="generated-id"
+          >
+            Every
+          </label>
+        </div>
         <div
-          class="euiFormControlLayout__childrenWrapper"
+          class="euiFormControlLayout__childrenWrapper emotion-euiFormControlLayout__childrenWrapper-inGroup-prependOnly"
           style="--euiFormControlRightIconsCount: 1;"
         >
           <select
@@ -70,10 +74,10 @@ Array [
             </option>
           </select>
           <div
-            class="euiFormControlLayoutIcons euiFormControlLayoutIcons--right euiFormControlLayoutIcons--absolute"
+            class="euiFormControlLayoutIcons emotion-euiFormControlLayoutIcons-absolute-right"
           >
             <span
-              class="euiFormControlLayoutCustomIcon"
+              class="euiFormControlLayoutCustomIcon emotion-euiFormControlLayoutCustomIcon"
             >
               <span
                 aria-hidden="true"
@@ -87,7 +91,7 @@ Array [
     </div>
   </div>,
   <div
-    class="euiFormRow euiFormRow--fullWidth euiFormRow--hasLabel"
+    class="euiFormRow euiFormRow--hasLabel emotion-euiFormRow-fullWidth"
     data-test-subj="cronFrequencyConfiguration"
     id="generated-id-row"
   >
@@ -95,7 +99,7 @@ Array [
       class="euiFormRow__labelWrapper"
     >
       <label
-        class="euiFormLabel euiFormRow__label"
+        class="euiFormLabel euiFormRow__label emotion-euiFormLabel"
         for="generated-id"
         id="generated-id-label"
       >
@@ -113,15 +117,19 @@ Array [
           class="euiFlexItem emotion-euiFlexItem-growZero"
         >
           <div
-            class="euiFormControlLayout euiFormControlLayout--fullWidth euiFormControlLayout--group"
+            class="euiFormControlLayout euiFormControlLayout--group emotion-euiFormControlLayout-fullWidth-group"
           >
-            <label
-              class="euiFormLabel euiFormControlLayout__prepend"
+            <div
+              class="euiFormControlLayout__prepend emotion-euiFormControlLayout__side-prepend"
             >
-              At
-            </label>
+              <label
+                class="euiFormLabel emotion-euiFormLabel"
+              >
+                At
+              </label>
+            </div>
             <div
-              class="euiFormControlLayout__childrenWrapper"
+              class="euiFormControlLayout__childrenWrapper emotion-euiFormControlLayout__childrenWrapper-inGroup-prependOnly"
               style="--euiFormControlRightIconsCount: 1;"
             >
               <select
@@ -251,10 +259,10 @@ Array [
                 </option>
               </select>
               <div
-                class="euiFormControlLayoutIcons euiFormControlLayoutIcons--right euiFormControlLayoutIcons--absolute"
+                class="euiFormControlLayoutIcons emotion-euiFormControlLayoutIcons-absolute-right"
               >
                 <span
-                  class="euiFormControlLayoutCustomIcon"
+                  class="euiFormControlLayoutCustomIcon emotion-euiFormControlLayoutCustomIcon"
                 >
                   <span
                     aria-hidden="true"
@@ -270,15 +278,19 @@ Array [
           class="euiFlexItem emotion-euiFlexItem-grow-1"
         >
           <div
-            class="euiFormControlLayout euiFormControlLayout--fullWidth euiFormControlLayout--group"
+            class="euiFormControlLayout euiFormControlLayout--group emotion-euiFormControlLayout-fullWidth-group"
           >
-            <label
-              class="euiFormLabel euiFormControlLayout__prepend"
+            <div
+              class="euiFormControlLayout__prepend emotion-euiFormControlLayout__side-prepend"
             >
-              :
-            </label>
+              <label
+                class="euiFormLabel emotion-euiFormLabel"
+              >
+                :
+              </label>
+            </div>
             <div
-              class="euiFormControlLayout__childrenWrapper"
+              class="euiFormControlLayout__childrenWrapper emotion-euiFormControlLayout__childrenWrapper-inGroup-prependOnly"
               style="--euiFormControlRightIconsCount: 1;"
             >
               <select
@@ -588,10 +600,10 @@ Array [
                 </option>
               </select>
               <div
-                class="euiFormControlLayoutIcons euiFormControlLayoutIcons--right euiFormControlLayoutIcons--absolute"
+                class="euiFormControlLayoutIcons emotion-euiFormControlLayoutIcons-absolute-right"
               >
                 <span
-                  class="euiFormControlLayoutCustomIcon"
+                  class="euiFormControlLayoutCustomIcon emotion-euiFormControlLayoutCustomIcon"
                 >
                   <span
                     aria-hidden="true"
@@ -612,14 +624,14 @@ Array [
 exports[`CronEditor is rendered with a HOUR frequency 1`] = `
 Array [
   <div
-    class="euiFormRow euiFormRow--fullWidth euiFormRow--hasLabel"
+    class="euiFormRow euiFormRow--hasLabel emotion-euiFormRow-fullWidth"
     id="generated-id-row"
   >
     <div
       class="euiFormRow__labelWrapper"
     >
       <label
-        class="euiFormLabel euiFormRow__label"
+        class="euiFormLabel euiFormRow__label emotion-euiFormLabel"
         for="generated-id"
         id="generated-id-label"
       >
@@ -630,16 +642,20 @@ Array [
       class="euiFormRow__fieldWrapper"
     >
       <div
-        class="euiFormControlLayout euiFormControlLayout--fullWidth euiFormControlLayout--group"
+        class="euiFormControlLayout euiFormControlLayout--group emotion-euiFormControlLayout-fullWidth-group"
       >
-        <label
-          class="euiFormLabel euiFormControlLayout__prepend"
-          for="generated-id"
+        <div
+          class="euiFormControlLayout__prepend emotion-euiFormControlLayout__side-prepend"
         >
-          Every
-        </label>
+          <label
+            class="euiFormLabel emotion-euiFormLabel"
+            for="generated-id"
+          >
+            Every
+          </label>
+        </div>
         <div
-          class="euiFormControlLayout__childrenWrapper"
+          class="euiFormControlLayout__childrenWrapper emotion-euiFormControlLayout__childrenWrapper-inGroup-prependOnly"
           style="--euiFormControlRightIconsCount: 1;"
         >
           <select
@@ -679,10 +695,10 @@ Array [
             </option>
           </select>
           <div
-            class="euiFormControlLayoutIcons euiFormControlLayoutIcons--right euiFormControlLayoutIcons--absolute"
+            class="euiFormControlLayoutIcons emotion-euiFormControlLayoutIcons-absolute-right"
           >
             <span
-              class="euiFormControlLayoutCustomIcon"
+              class="euiFormControlLayoutCustomIcon emotion-euiFormControlLayoutCustomIcon"
             >
               <span
                 aria-hidden="true"
@@ -696,7 +712,7 @@ Array [
     </div>
   </div>,
   <div
-    class="euiFormRow euiFormRow--fullWidth euiFormRow--hasLabel"
+    class="euiFormRow euiFormRow--hasLabel emotion-euiFormRow-fullWidth"
     data-test-subj="cronFrequencyConfiguration"
     id="generated-id-row"
   >
@@ -704,7 +720,7 @@ Array [
       class="euiFormRow__labelWrapper"
     >
       <label
-        class="euiFormLabel euiFormRow__label"
+        class="euiFormLabel euiFormRow__label emotion-euiFormLabel"
         for="generated-id"
         id="generated-id-label"
       >
@@ -715,16 +731,20 @@ Array [
       class="euiFormRow__fieldWrapper"
     >
       <div
-        class="euiFormControlLayout euiFormControlLayout--fullWidth euiFormControlLayout--group"
+        class="euiFormControlLayout euiFormControlLayout--group emotion-euiFormControlLayout-fullWidth-group"
       >
-        <label
-          class="euiFormLabel euiFormControlLayout__prepend"
-          for="generated-id"
+        <div
+          class="euiFormControlLayout__prepend emotion-euiFormControlLayout__side-prepend"
         >
-          At
-        </label>
+          <label
+            class="euiFormLabel emotion-euiFormLabel"
+            for="generated-id"
+          >
+            At
+          </label>
+        </div>
         <div
-          class="euiFormControlLayout__childrenWrapper"
+          class="euiFormControlLayout__childrenWrapper emotion-euiFormControlLayout__childrenWrapper-inGroup-prependOnly"
           style="--euiFormControlRightIconsCount: 1;"
         >
           <select
@@ -1034,10 +1054,10 @@ Array [
             </option>
           </select>
           <div
-            class="euiFormControlLayoutIcons euiFormControlLayoutIcons--right euiFormControlLayoutIcons--absolute"
+            class="euiFormControlLayoutIcons emotion-euiFormControlLayoutIcons-absolute-right"
           >
             <span
-              class="euiFormControlLayoutCustomIcon"
+              class="euiFormControlLayoutCustomIcon emotion-euiFormControlLayoutCustomIcon"
             >
               <span
                 aria-hidden="true"
@@ -1056,14 +1076,14 @@ Array [
 exports[`CronEditor is rendered with a MINUTE frequency 1`] = `
 Array [
   <div
-    class="euiFormRow euiFormRow--fullWidth euiFormRow--hasLabel"
+    class="euiFormRow euiFormRow--hasLabel emotion-euiFormRow-fullWidth"
     id="generated-id-row"
   >
     <div
       class="euiFormRow__labelWrapper"
     >
       <label
-        class="euiFormLabel euiFormRow__label"
+        class="euiFormLabel euiFormRow__label emotion-euiFormLabel"
         for="generated-id"
         id="generated-id-label"
       >
@@ -1074,16 +1094,20 @@ Array [
       class="euiFormRow__fieldWrapper"
     >
       <div
-        class="euiFormControlLayout euiFormControlLayout--fullWidth euiFormControlLayout--group"
+        class="euiFormControlLayout euiFormControlLayout--group emotion-euiFormControlLayout-fullWidth-group"
       >
-        <label
-          class="euiFormLabel euiFormControlLayout__prepend"
-          for="generated-id"
+        <div
+          class="euiFormControlLayout__prepend emotion-euiFormControlLayout__side-prepend"
         >
-          Every
-        </label>
+          <label
+            class="euiFormLabel emotion-euiFormLabel"
+            for="generated-id"
+          >
+            Every
+          </label>
+        </div>
         <div
-          class="euiFormControlLayout__childrenWrapper"
+          class="euiFormControlLayout__childrenWrapper emotion-euiFormControlLayout__childrenWrapper-inGroup-prependOnly"
           style="--euiFormControlRightIconsCount: 1;"
         >
           <select
@@ -1123,10 +1147,10 @@ Array [
             </option>
           </select>
           <div
-            class="euiFormControlLayoutIcons euiFormControlLayoutIcons--right euiFormControlLayoutIcons--absolute"
+            class="euiFormControlLayoutIcons emotion-euiFormControlLayoutIcons-absolute-right"
           >
             <span
-              class="euiFormControlLayoutCustomIcon"
+              class="euiFormControlLayoutCustomIcon emotion-euiFormControlLayoutCustomIcon"
             >
               <span
                 aria-hidden="true"
@@ -1140,7 +1164,7 @@ Array [
     </div>
   </div>,
   <div
-    class="euiFormRow euiFormRow--fullWidth euiFormRow--hasLabel"
+    class="euiFormRow euiFormRow--hasLabel emotion-euiFormRow-fullWidth"
     data-test-subj="cronFrequencyConfiguration"
     id="generated-id-row"
   >
@@ -1148,7 +1172,7 @@ Array [
       class="euiFormRow__labelWrapper"
     >
       <label
-        class="euiFormLabel euiFormRow__label"
+        class="euiFormLabel euiFormRow__label emotion-euiFormLabel"
         for="generated-id"
         id="generated-id-label"
       >
@@ -1159,16 +1183,20 @@ Array [
       class="euiFormRow__fieldWrapper"
     >
       <div
-        class="euiFormControlLayout euiFormControlLayout--fullWidth euiFormControlLayout--group"
+        class="euiFormControlLayout euiFormControlLayout--group emotion-euiFormControlLayout-fullWidth-group"
       >
-        <label
-          class="euiFormLabel euiFormControlLayout__prepend"
-          for="generated-id"
+        <div
+          class="euiFormControlLayout__prepend emotion-euiFormControlLayout__side-prepend"
         >
-          Every
-        </label>
+          <label
+            class="euiFormLabel emotion-euiFormLabel"
+            for="generated-id"
+          >
+            Every
+          </label>
+        </div>
         <div
-          class="euiFormControlLayout__childrenWrapper"
+          class="euiFormControlLayout__childrenWrapper emotion-euiFormControlLayout__childrenWrapper-inGroup"
           style="--euiFormControlRightIconsCount: 1;"
         >
           <select
@@ -1198,10 +1226,10 @@ Array [
             </option>
           </select>
           <div
-            class="euiFormControlLayoutIcons euiFormControlLayoutIcons--right euiFormControlLayoutIcons--absolute"
+            class="euiFormControlLayoutIcons emotion-euiFormControlLayoutIcons-absolute-right"
           >
             <span
-              class="euiFormControlLayoutCustomIcon"
+              class="euiFormControlLayoutCustomIcon emotion-euiFormControlLayoutCustomIcon"
             >
               <span
                 aria-hidden="true"
@@ -1211,12 +1239,16 @@ Array [
             </span>
           </div>
         </div>
-        <label
-          class="euiFormLabel euiFormControlLayout__append"
-          for="generated-id"
+        <div
+          class="euiFormControlLayout__append emotion-euiFormControlLayout__side-append"
         >
-          minutes
-        </label>
+          <label
+            class="euiFormLabel emotion-euiFormLabel"
+            for="generated-id"
+          >
+            minutes
+          </label>
+        </div>
       </div>
     </div>
   </div>,
@@ -1226,14 +1258,14 @@ Array [
 exports[`CronEditor is rendered with a MONTH frequency 1`] = `
 Array [
   <div
-    class="euiFormRow euiFormRow--fullWidth euiFormRow--hasLabel"
+    class="euiFormRow euiFormRow--hasLabel emotion-euiFormRow-fullWidth"
     id="generated-id-row"
   >
     <div
       class="euiFormRow__labelWrapper"
     >
       <label
-        class="euiFormLabel euiFormRow__label"
+        class="euiFormLabel euiFormRow__label emotion-euiFormLabel"
         for="generated-id"
         id="generated-id-label"
       >
@@ -1244,16 +1276,20 @@ Array [
       class="euiFormRow__fieldWrapper"
     >
       <div
-        class="euiFormControlLayout euiFormControlLayout--fullWidth euiFormControlLayout--group"
+        class="euiFormControlLayout euiFormControlLayout--group emotion-euiFormControlLayout-fullWidth-group"
       >
-        <label
-          class="euiFormLabel euiFormControlLayout__prepend"
-          for="generated-id"
+        <div
+          class="euiFormControlLayout__prepend emotion-euiFormControlLayout__side-prepend"
         >
-          Every
-        </label>
+          <label
+            class="euiFormLabel emotion-euiFormLabel"
+            for="generated-id"
+          >
+            Every
+          </label>
+        </div>
         <div
-          class="euiFormControlLayout__childrenWrapper"
+          class="euiFormControlLayout__childrenWrapper emotion-euiFormControlLayout__childrenWrapper-inGroup-prependOnly"
           style="--euiFormControlRightIconsCount: 1;"
         >
           <select
@@ -1293,10 +1329,10 @@ Array [
             </option>
           </select>
           <div
-            class="euiFormControlLayoutIcons euiFormControlLayoutIcons--right euiFormControlLayoutIcons--absolute"
+            class="euiFormControlLayoutIcons emotion-euiFormControlLayoutIcons-absolute-right"
           >
             <span
-              class="euiFormControlLayoutCustomIcon"
+              class="euiFormControlLayoutCustomIcon emotion-euiFormControlLayoutCustomIcon"
             >
               <span
                 aria-hidden="true"
@@ -1310,7 +1346,7 @@ Array [
     </div>
   </div>,
   <div
-    class="euiFormRow euiFormRow--fullWidth euiFormRow--hasLabel"
+    class="euiFormRow euiFormRow--hasLabel emotion-euiFormRow-fullWidth"
     data-test-subj="cronFrequencyConfiguration"
     id="generated-id-row"
   >
@@ -1318,7 +1354,7 @@ Array [
       class="euiFormRow__labelWrapper"
     >
       <label
-        class="euiFormLabel euiFormRow__label"
+        class="euiFormLabel euiFormRow__label emotion-euiFormLabel"
         for="generated-id"
         id="generated-id-label"
       >
@@ -1329,16 +1365,20 @@ Array [
       class="euiFormRow__fieldWrapper"
     >
       <div
-        class="euiFormControlLayout euiFormControlLayout--fullWidth euiFormControlLayout--group"
+        class="euiFormControlLayout euiFormControlLayout--group emotion-euiFormControlLayout-fullWidth-group"
       >
-        <label
-          class="euiFormLabel euiFormControlLayout__prepend"
-          for="generated-id"
+        <div
+          class="euiFormControlLayout__prepend emotion-euiFormControlLayout__side-prepend"
         >
-          On the
-        </label>
+          <label
+            class="euiFormLabel emotion-euiFormLabel"
+            for="generated-id"
+          >
+            On the
+          </label>
+        </div>
         <div
-          class="euiFormControlLayout__childrenWrapper"
+          class="euiFormControlLayout__childrenWrapper emotion-euiFormControlLayout__childrenWrapper-inGroup-prependOnly"
           style="--euiFormControlRightIconsCount: 1;"
         >
           <select
@@ -1503,10 +1543,10 @@ Array [
             </option>
           </select>
           <div
-            class="euiFormControlLayoutIcons euiFormControlLayoutIcons--right euiFormControlLayoutIcons--absolute"
+            class="euiFormControlLayoutIcons emotion-euiFormControlLayoutIcons-absolute-right"
           >
             <span
-              class="euiFormControlLayoutCustomIcon"
+              class="euiFormControlLayoutCustomIcon emotion-euiFormControlLayoutCustomIcon"
             >
               <span
                 aria-hidden="true"
@@ -1520,7 +1560,7 @@ Array [
     </div>
   </div>,
   <div
-    class="euiFormRow euiFormRow--fullWidth euiFormRow--hasLabel"
+    class="euiFormRow euiFormRow--hasLabel emotion-euiFormRow-fullWidth"
     data-test-subj="cronFrequencyConfiguration"
     id="generated-id-row"
   >
@@ -1528,7 +1568,7 @@ Array [
       class="euiFormRow__labelWrapper"
     >
       <label
-        class="euiFormLabel euiFormRow__label"
+        class="euiFormLabel euiFormRow__label emotion-euiFormLabel"
         for="generated-id"
         id="generated-id-label"
       >
@@ -1546,15 +1586,19 @@ Array [
           class="euiFlexItem emotion-euiFlexItem-growZero"
         >
           <div
-            class="euiFormControlLayout euiFormControlLayout--fullWidth euiFormControlLayout--group"
+            class="euiFormControlLayout euiFormControlLayout--group emotion-euiFormControlLayout-fullWidth-group"
           >
-            <label
-              class="euiFormLabel euiFormControlLayout__prepend"
+            <div
+              class="euiFormControlLayout__prepend emotion-euiFormControlLayout__side-prepend"
             >
-              At
-            </label>
+              <label
+                class="euiFormLabel emotion-euiFormLabel"
+              >
+                At
+              </label>
+            </div>
             <div
-              class="euiFormControlLayout__childrenWrapper"
+              class="euiFormControlLayout__childrenWrapper emotion-euiFormControlLayout__childrenWrapper-inGroup-prependOnly"
               style="--euiFormControlRightIconsCount: 1;"
             >
               <select
@@ -1684,10 +1728,10 @@ Array [
                 </option>
               </select>
               <div
-                class="euiFormControlLayoutIcons euiFormControlLayoutIcons--right euiFormControlLayoutIcons--absolute"
+                class="euiFormControlLayoutIcons emotion-euiFormControlLayoutIcons-absolute-right"
               >
                 <span
-                  class="euiFormControlLayoutCustomIcon"
+                  class="euiFormControlLayoutCustomIcon emotion-euiFormControlLayoutCustomIcon"
                 >
                   <span
                     aria-hidden="true"
@@ -1703,15 +1747,19 @@ Array [
           class="euiFlexItem emotion-euiFlexItem-grow-1"
         >
           <div
-            class="euiFormControlLayout euiFormControlLayout--fullWidth euiFormControlLayout--group"
+            class="euiFormControlLayout euiFormControlLayout--group emotion-euiFormControlLayout-fullWidth-group"
           >
-            <label
-              class="euiFormLabel euiFormControlLayout__prepend"
+            <div
+              class="euiFormControlLayout__prepend emotion-euiFormControlLayout__side-prepend"
             >
-              :
-            </label>
+              <label
+                class="euiFormLabel emotion-euiFormLabel"
+              >
+                :
+              </label>
+            </div>
             <div
-              class="euiFormControlLayout__childrenWrapper"
+              class="euiFormControlLayout__childrenWrapper emotion-euiFormControlLayout__childrenWrapper-inGroup-prependOnly"
               style="--euiFormControlRightIconsCount: 1;"
             >
               <select
@@ -2021,10 +2069,10 @@ Array [
                 </option>
               </select>
               <div
-                class="euiFormControlLayoutIcons euiFormControlLayoutIcons--right euiFormControlLayoutIcons--absolute"
+                class="euiFormControlLayoutIcons emotion-euiFormControlLayoutIcons-absolute-right"
               >
                 <span
-                  class="euiFormControlLayoutCustomIcon"
+                  class="euiFormControlLayoutCustomIcon emotion-euiFormControlLayoutCustomIcon"
                 >
                   <span
                     aria-hidden="true"
@@ -2045,14 +2093,14 @@ Array [
 exports[`CronEditor is rendered with a WEEK frequency 1`] = `
 Array [
   <div
-    class="euiFormRow euiFormRow--fullWidth euiFormRow--hasLabel"
+    class="euiFormRow euiFormRow--hasLabel emotion-euiFormRow-fullWidth"
     id="generated-id-row"
   >
     <div
       class="euiFormRow__labelWrapper"
     >
       <label
-        class="euiFormLabel euiFormRow__label"
+        class="euiFormLabel euiFormRow__label emotion-euiFormLabel"
         for="generated-id"
         id="generated-id-label"
       >
@@ -2063,16 +2111,20 @@ Array [
       class="euiFormRow__fieldWrapper"
     >
       <div
-        class="euiFormControlLayout euiFormControlLayout--fullWidth euiFormControlLayout--group"
+        class="euiFormControlLayout euiFormControlLayout--group emotion-euiFormControlLayout-fullWidth-group"
       >
-        <label
-          class="euiFormLabel euiFormControlLayout__prepend"
-          for="generated-id"
+        <div
+          class="euiFormControlLayout__prepend emotion-euiFormControlLayout__side-prepend"
         >
-          Every
-        </label>
+          <label
+            class="euiFormLabel emotion-euiFormLabel"
+            for="generated-id"
+          >
+            Every
+          </label>
+        </div>
         <div
-          class="euiFormControlLayout__childrenWrapper"
+          class="euiFormControlLayout__childrenWrapper emotion-euiFormControlLayout__childrenWrapper-inGroup-prependOnly"
           style="--euiFormControlRightIconsCount: 1;"
         >
           <select
@@ -2112,10 +2164,10 @@ Array [
             </option>
           </select>
           <div
-            class="euiFormControlLayoutIcons euiFormControlLayoutIcons--right euiFormControlLayoutIcons--absolute"
+            class="euiFormControlLayoutIcons emotion-euiFormControlLayoutIcons-absolute-right"
           >
             <span
-              class="euiFormControlLayoutCustomIcon"
+              class="euiFormControlLayoutCustomIcon emotion-euiFormControlLayoutCustomIcon"
             >
               <span
                 aria-hidden="true"
@@ -2129,7 +2181,7 @@ Array [
     </div>
   </div>,
   <div
-    class="euiFormRow euiFormRow--fullWidth euiFormRow--hasLabel"
+    class="euiFormRow euiFormRow--hasLabel emotion-euiFormRow-fullWidth"
     data-test-subj="cronFrequencyConfiguration"
     id="generated-id-row"
   >
@@ -2137,7 +2189,7 @@ Array [
       class="euiFormRow__labelWrapper"
     >
       <label
-        class="euiFormLabel euiFormRow__label"
+        class="euiFormLabel euiFormRow__label emotion-euiFormLabel"
         for="generated-id"
         id="generated-id-label"
       >
@@ -2148,16 +2200,20 @@ Array [
       class="euiFormRow__fieldWrapper"
     >
       <div
-        class="euiFormControlLayout euiFormControlLayout--fullWidth euiFormControlLayout--group"
+        class="euiFormControlLayout euiFormControlLayout--group emotion-euiFormControlLayout-fullWidth-group"
       >
-        <label
-          class="euiFormLabel euiFormControlLayout__prepend"
-          for="generated-id"
+        <div
+          class="euiFormControlLayout__prepend emotion-euiFormControlLayout__side-prepend"
         >
-          On
-        </label>
+          <label
+            class="euiFormLabel emotion-euiFormLabel"
+            for="generated-id"
+          >
+            On
+          </label>
+        </div>
         <div
-          class="euiFormControlLayout__childrenWrapper"
+          class="euiFormControlLayout__childrenWrapper emotion-euiFormControlLayout__childrenWrapper-inGroup-prependOnly"
           style="--euiFormControlRightIconsCount: 1;"
         >
           <select
@@ -2202,10 +2258,10 @@ Array [
             </option>
           </select>
           <div
-            class="euiFormControlLayoutIcons euiFormControlLayoutIcons--right euiFormControlLayoutIcons--absolute"
+            class="euiFormControlLayoutIcons emotion-euiFormControlLayoutIcons-absolute-right"
           >
             <span
-              class="euiFormControlLayoutCustomIcon"
+              class="euiFormControlLayoutCustomIcon emotion-euiFormControlLayoutCustomIcon"
             >
               <span
                 aria-hidden="true"
@@ -2219,7 +2275,7 @@ Array [
     </div>
   </div>,
   <div
-    class="euiFormRow euiFormRow--fullWidth euiFormRow--hasLabel"
+    class="euiFormRow euiFormRow--hasLabel emotion-euiFormRow-fullWidth"
     data-test-subj="cronFrequencyConfiguration"
     id="generated-id-row"
   >
@@ -2227,7 +2283,7 @@ Array [
       class="euiFormRow__labelWrapper"
     >
       <label
-        class="euiFormLabel euiFormRow__label"
+        class="euiFormLabel euiFormRow__label emotion-euiFormLabel"
         for="generated-id"
         id="generated-id-label"
       >
@@ -2245,15 +2301,19 @@ Array [
           class="euiFlexItem emotion-euiFlexItem-growZero"
         >
           <div
-            class="euiFormControlLayout euiFormControlLayout--fullWidth euiFormControlLayout--group"
+            class="euiFormControlLayout euiFormControlLayout--group emotion-euiFormControlLayout-fullWidth-group"
           >
-            <label
-              class="euiFormLabel euiFormControlLayout__prepend"
+            <div
+              class="euiFormControlLayout__prepend emotion-euiFormControlLayout__side-prepend"
             >
-              At
-            </label>
+              <label
+                class="euiFormLabel emotion-euiFormLabel"
+              >
+                At
+              </label>
+            </div>
             <div
-              class="euiFormControlLayout__childrenWrapper"
+              class="euiFormControlLayout__childrenWrapper emotion-euiFormControlLayout__childrenWrapper-inGroup-prependOnly"
               style="--euiFormControlRightIconsCount: 1;"
             >
               <select
@@ -2383,10 +2443,10 @@ Array [
                 </option>
               </select>
               <div
-                class="euiFormControlLayoutIcons euiFormControlLayoutIcons--right euiFormControlLayoutIcons--absolute"
+                class="euiFormControlLayoutIcons emotion-euiFormControlLayoutIcons-absolute-right"
               >
                 <span
-                  class="euiFormControlLayoutCustomIcon"
+                  class="euiFormControlLayoutCustomIcon emotion-euiFormControlLayoutCustomIcon"
                 >
                   <span
                     aria-hidden="true"
@@ -2402,15 +2462,19 @@ Array [
           class="euiFlexItem emotion-euiFlexItem-grow-1"
         >
           <div
-            class="euiFormControlLayout euiFormControlLayout--fullWidth euiFormControlLayout--group"
+            class="euiFormControlLayout euiFormControlLayout--group emotion-euiFormControlLayout-fullWidth-group"
           >
-            <label
-              class="euiFormLabel euiFormControlLayout__prepend"
+            <div
+              class="euiFormControlLayout__prepend emotion-euiFormControlLayout__side-prepend"
             >
-              :
-            </label>
+              <label
+                class="euiFormLabel emotion-euiFormLabel"
+              >
+                :
+              </label>
+            </div>
             <div
-              class="euiFormControlLayout__childrenWrapper"
+              class="euiFormControlLayout__childrenWrapper emotion-euiFormControlLayout__childrenWrapper-inGroup-prependOnly"
               style="--euiFormControlRightIconsCount: 1;"
             >
               <select
@@ -2720,10 +2784,10 @@ Array [
                 </option>
               </select>
               <div
-                class="euiFormControlLayoutIcons euiFormControlLayoutIcons--right euiFormControlLayoutIcons--absolute"
+                class="euiFormControlLayoutIcons emotion-euiFormControlLayoutIcons-absolute-right"
               >
                 <span
-                  class="euiFormControlLayoutCustomIcon"
+                  class="euiFormControlLayoutCustomIcon emotion-euiFormControlLayoutCustomIcon"
                 >
                   <span
                     aria-hidden="true"
@@ -2744,14 +2808,14 @@ Array [
 exports[`CronEditor is rendered with a YEAR frequency 1`] = `
 Array [
   <div
-    class="euiFormRow euiFormRow--fullWidth euiFormRow--hasLabel"
+    class="euiFormRow euiFormRow--hasLabel emotion-euiFormRow-fullWidth"
     id="generated-id-row"
   >
     <div
       class="euiFormRow__labelWrapper"
     >
       <label
-        class="euiFormLabel euiFormRow__label"
+        class="euiFormLabel euiFormRow__label emotion-euiFormLabel"
         for="generated-id"
         id="generated-id-label"
       >
@@ -2762,16 +2826,20 @@ Array [
       class="euiFormRow__fieldWrapper"
     >
       <div
-        class="euiFormControlLayout euiFormControlLayout--fullWidth euiFormControlLayout--group"
+        class="euiFormControlLayout euiFormControlLayout--group emotion-euiFormControlLayout-fullWidth-group"
       >
-        <label
-          class="euiFormLabel euiFormControlLayout__prepend"
-          for="generated-id"
+        <div
+          class="euiFormControlLayout__prepend emotion-euiFormControlLayout__side-prepend"
         >
-          Every
-        </label>
+          <label
+            class="euiFormLabel emotion-euiFormLabel"
+            for="generated-id"
+          >
+            Every
+          </label>
+        </div>
         <div
-          class="euiFormControlLayout__childrenWrapper"
+          class="euiFormControlLayout__childrenWrapper emotion-euiFormControlLayout__childrenWrapper-inGroup-prependOnly"
           style="--euiFormControlRightIconsCount: 1;"
         >
           <select
@@ -2811,10 +2879,10 @@ Array [
             </option>
           </select>
           <div
-            class="euiFormControlLayoutIcons euiFormControlLayoutIcons--right euiFormControlLayoutIcons--absolute"
+            class="euiFormControlLayoutIcons emotion-euiFormControlLayoutIcons-absolute-right"
           >
             <span
-              class="euiFormControlLayoutCustomIcon"
+              class="euiFormControlLayoutCustomIcon emotion-euiFormControlLayoutCustomIcon"
             >
               <span
                 aria-hidden="true"
@@ -2828,7 +2896,7 @@ Array [
     </div>
   </div>,
   <div
-    class="euiFormRow euiFormRow--fullWidth euiFormRow--hasLabel"
+    class="euiFormRow euiFormRow--hasLabel emotion-euiFormRow-fullWidth"
     data-test-subj="cronFrequencyConfiguration"
     id="generated-id-row"
   >
@@ -2836,7 +2904,7 @@ Array [
       class="euiFormRow__labelWrapper"
     >
       <label
-        class="euiFormLabel euiFormRow__label"
+        class="euiFormLabel euiFormRow__label emotion-euiFormLabel"
         for="generated-id"
         id="generated-id-label"
       >
@@ -2847,16 +2915,20 @@ Array [
       class="euiFormRow__fieldWrapper"
     >
       <div
-        class="euiFormControlLayout euiFormControlLayout--fullWidth euiFormControlLayout--group"
+        class="euiFormControlLayout euiFormControlLayout--group emotion-euiFormControlLayout-fullWidth-group"
       >
-        <label
-          class="euiFormLabel euiFormControlLayout__prepend"
-          for="generated-id"
+        <div
+          class="euiFormControlLayout__prepend emotion-euiFormControlLayout__side-prepend"
         >
-          In
-        </label>
+          <label
+            class="euiFormLabel emotion-euiFormLabel"
+            for="generated-id"
+          >
+            In
+          </label>
+        </div>
         <div
-          class="euiFormControlLayout__childrenWrapper"
+          class="euiFormControlLayout__childrenWrapper emotion-euiFormControlLayout__childrenWrapper-inGroup-prependOnly"
           style="--euiFormControlRightIconsCount: 1;"
         >
           <select
@@ -2926,10 +2998,10 @@ Array [
             </option>
           </select>
           <div
-            class="euiFormControlLayoutIcons euiFormControlLayoutIcons--right euiFormControlLayoutIcons--absolute"
+            class="euiFormControlLayoutIcons emotion-euiFormControlLayoutIcons-absolute-right"
           >
             <span
-              class="euiFormControlLayoutCustomIcon"
+              class="euiFormControlLayoutCustomIcon emotion-euiFormControlLayoutCustomIcon"
             >
               <span
                 aria-hidden="true"
@@ -2943,7 +3015,7 @@ Array [
     </div>
   </div>,
   <div
-    class="euiFormRow euiFormRow--fullWidth euiFormRow--hasLabel"
+    class="euiFormRow euiFormRow--hasLabel emotion-euiFormRow-fullWidth"
     data-test-subj="cronFrequencyConfiguration"
     id="generated-id-row"
   >
@@ -2951,7 +3023,7 @@ Array [
       class="euiFormRow__labelWrapper"
     >
       <label
-        class="euiFormLabel euiFormRow__label"
+        class="euiFormLabel euiFormRow__label emotion-euiFormLabel"
         for="generated-id"
         id="generated-id-label"
       >
@@ -2962,16 +3034,20 @@ Array [
       class="euiFormRow__fieldWrapper"
     >
       <div
-        class="euiFormControlLayout euiFormControlLayout--fullWidth euiFormControlLayout--group"
+        class="euiFormControlLayout euiFormControlLayout--group emotion-euiFormControlLayout-fullWidth-group"
       >
-        <label
-          class="euiFormLabel euiFormControlLayout__prepend"
-          for="generated-id"
+        <div
+          class="euiFormControlLayout__prepend emotion-euiFormControlLayout__side-prepend"
         >
-          On the
-        </label>
+          <label
+            class="euiFormLabel emotion-euiFormLabel"
+            for="generated-id"
+          >
+            On the
+          </label>
+        </div>
         <div
-          class="euiFormControlLayout__childrenWrapper"
+          class="euiFormControlLayout__childrenWrapper emotion-euiFormControlLayout__childrenWrapper-inGroup-prependOnly"
           style="--euiFormControlRightIconsCount: 1;"
         >
           <select
@@ -3136,10 +3212,10 @@ Array [
             </option>
           </select>
           <div
-            class="euiFormControlLayoutIcons euiFormControlLayoutIcons--right euiFormControlLayoutIcons--absolute"
+            class="euiFormControlLayoutIcons emotion-euiFormControlLayoutIcons-absolute-right"
           >
             <span
-              class="euiFormControlLayoutCustomIcon"
+              class="euiFormControlLayoutCustomIcon emotion-euiFormControlLayoutCustomIcon"
             >
               <span
                 aria-hidden="true"
@@ -3153,7 +3229,7 @@ Array [
     </div>
   </div>,
   <div
-    class="euiFormRow euiFormRow--fullWidth euiFormRow--hasLabel"
+    class="euiFormRow euiFormRow--hasLabel emotion-euiFormRow-fullWidth"
     data-test-subj="cronFrequencyConfiguration"
     id="generated-id-row"
   >
@@ -3161,7 +3237,7 @@ Array [
       class="euiFormRow__labelWrapper"
     >
       <label
-        class="euiFormLabel euiFormRow__label"
+        class="euiFormLabel euiFormRow__label emotion-euiFormLabel"
         for="generated-id"
         id="generated-id-label"
       >
@@ -3179,15 +3255,19 @@ Array [
           class="euiFlexItem emotion-euiFlexItem-growZero"
         >
           <div
-            class="euiFormControlLayout euiFormControlLayout--fullWidth euiFormControlLayout--group"
+            class="euiFormControlLayout euiFormControlLayout--group emotion-euiFormControlLayout-fullWidth-group"
           >
-            <label
-              class="euiFormLabel euiFormControlLayout__prepend"
+            <div
+              class="euiFormControlLayout__prepend emotion-euiFormControlLayout__side-prepend"
             >
-              At
-            </label>
+              <label
+                class="euiFormLabel emotion-euiFormLabel"
+              >
+                At
+              </label>
+            </div>
             <div
-              class="euiFormControlLayout__childrenWrapper"
+              class="euiFormControlLayout__childrenWrapper emotion-euiFormControlLayout__childrenWrapper-inGroup-prependOnly"
               style="--euiFormControlRightIconsCount: 1;"
             >
               <select
@@ -3317,10 +3397,10 @@ Array [
                 </option>
               </select>
               <div
-                class="euiFormControlLayoutIcons euiFormControlLayoutIcons--right euiFormControlLayoutIcons--absolute"
+                class="euiFormControlLayoutIcons emotion-euiFormControlLayoutIcons-absolute-right"
               >
                 <span
-                  class="euiFormControlLayoutCustomIcon"
+                  class="euiFormControlLayoutCustomIcon emotion-euiFormControlLayoutCustomIcon"
                 >
                   <span
                     aria-hidden="true"
@@ -3336,15 +3416,19 @@ Array [
           class="euiFlexItem emotion-euiFlexItem-grow-1"
         >
           <div
-            class="euiFormControlLayout euiFormControlLayout--fullWidth euiFormControlLayout--group"
+            class="euiFormControlLayout euiFormControlLayout--group emotion-euiFormControlLayout-fullWidth-group"
           >
-            <label
-              class="euiFormLabel euiFormControlLayout__prepend"
+            <div
+              class="euiFormControlLayout__prepend emotion-euiFormControlLayout__side-prepend"
             >
-              :
-            </label>
+              <label
+                class="euiFormLabel emotion-euiFormLabel"
+              >
+                :
+              </label>
+            </div>
             <div
-              class="euiFormControlLayout__childrenWrapper"
+              class="euiFormControlLayout__childrenWrapper emotion-euiFormControlLayout__childrenWrapper-inGroup-prependOnly"
               style="--euiFormControlRightIconsCount: 1;"
             >
               <select
@@ -3654,10 +3738,10 @@ Array [
                 </option>
               </select>
               <div
-                class="euiFormControlLayoutIcons euiFormControlLayoutIcons--right euiFormControlLayoutIcons--absolute"
+                class="euiFormControlLayoutIcons emotion-euiFormControlLayoutIcons-absolute-right"
               >
                 <span
-                  class="euiFormControlLayoutCustomIcon"
+                  class="euiFormControlLayoutCustomIcon emotion-euiFormControlLayoutCustomIcon"
                 >
                   <span
                     aria-hidden="true"
diff --git a/packages/kbn-securitysolution-autocomplete/src/field/__tests__/__snapshots__/index.test.tsx.snap b/packages/kbn-securitysolution-autocomplete/src/field/__tests__/__snapshots__/index.test.tsx.snap
index 1b462f58b2ed4..87aab754d5867 100644
--- a/packages/kbn-securitysolution-autocomplete/src/field/__tests__/__snapshots__/index.test.tsx.snap
+++ b/packages/kbn-securitysolution-autocomplete/src/field/__tests__/__snapshots__/index.test.tsx.snap
@@ -13,10 +13,10 @@ Object {
           class="euiPopover euiInputPopover emotion-euiPopover-block-EuiInputPopover"
         >
           <div
-            class="euiFormControlLayout euiFormControlLayout--fullWidth emotion-euiComboBox__formControlLayout"
+            class="euiFormControlLayout emotion-euiFormControlLayout-fullWidth-euiComboBox__formControlLayout"
           >
             <div
-              class="euiFormControlLayout__childrenWrapper"
+              class="euiFormControlLayout__childrenWrapper emotion-euiFormControlLayout__childrenWrapper"
               style="--euiFormControlRightIconsCount: 2;"
             >
               <div
@@ -39,22 +39,22 @@ Object {
                 />
               </div>
               <div
-                class="euiFormControlLayoutIcons euiFormControlLayoutIcons--right euiFormControlLayoutIcons--absolute"
+                class="euiFormControlLayoutIcons emotion-euiFormControlLayoutIcons-absolute-right"
               >
                 <button
                   aria-label="Clear input"
-                  class="euiFormControlLayoutClearButton"
+                  class="euiFormControlLayoutClearButton emotion-euiFormControlLayoutClearButton"
                   data-test-subj="comboBoxClearButton"
                   type="button"
                 >
                   <span
-                    class="euiFormControlLayoutClearButton__icon"
+                    class="euiFormControlLayoutClearButton__icon emotion-euiFormControlLayoutClearButton__icon-m"
                     data-euiicon-type="cross"
                   />
                 </button>
                 <button
                   aria-label="Open list of options"
-                  class="euiFormControlLayoutCustomIcon euiFormControlLayoutCustomIcon--clickable"
+                  class="euiFormControlLayoutCustomIcon emotion-euiFormControlLayoutCustomIcon-clickable"
                   data-test-subj="comboBoxToggleListButton"
                   tabindex="-1"
                   type="button"
@@ -81,10 +81,10 @@ Object {
         class="euiPopover euiInputPopover emotion-euiPopover-block-EuiInputPopover"
       >
         <div
-          class="euiFormControlLayout euiFormControlLayout--fullWidth emotion-euiComboBox__formControlLayout"
+          class="euiFormControlLayout emotion-euiFormControlLayout-fullWidth-euiComboBox__formControlLayout"
         >
           <div
-            class="euiFormControlLayout__childrenWrapper"
+            class="euiFormControlLayout__childrenWrapper emotion-euiFormControlLayout__childrenWrapper"
             style="--euiFormControlRightIconsCount: 2;"
           >
             <div
@@ -107,22 +107,22 @@ Object {
               />
             </div>
             <div
-              class="euiFormControlLayoutIcons euiFormControlLayoutIcons--right euiFormControlLayoutIcons--absolute"
+              class="euiFormControlLayoutIcons emotion-euiFormControlLayoutIcons-absolute-right"
             >
               <button
                 aria-label="Clear input"
-                class="euiFormControlLayoutClearButton"
+                class="euiFormControlLayoutClearButton emotion-euiFormControlLayoutClearButton"
                 data-test-subj="comboBoxClearButton"
                 type="button"
               >
                 <span
-                  class="euiFormControlLayoutClearButton__icon"
+                  class="euiFormControlLayoutClearButton__icon emotion-euiFormControlLayoutClearButton__icon-m"
                   data-euiicon-type="cross"
                 />
               </button>
               <button
                 aria-label="Open list of options"
-                class="euiFormControlLayoutCustomIcon euiFormControlLayoutCustomIcon--clickable"
+                class="euiFormControlLayoutCustomIcon emotion-euiFormControlLayoutCustomIcon-clickable"
                 data-test-subj="comboBoxToggleListButton"
                 tabindex="-1"
                 type="button"
@@ -206,10 +206,10 @@ Object {
           class="euiPopover euiInputPopover emotion-euiPopover-block-EuiInputPopover"
         >
           <div
-            class="euiFormControlLayout euiFormControlLayout--fullWidth emotion-euiComboBox__formControlLayout"
+            class="euiFormControlLayout euiFormControlLayout-isDisabled emotion-euiFormControlLayout-fullWidth-euiComboBox__formControlLayout"
           >
             <div
-              class="euiFormControlLayout__childrenWrapper"
+              class="euiFormControlLayout__childrenWrapper emotion-euiFormControlLayout__childrenWrapper"
             >
               <div
                 class="euiComboBox__inputWrap euiComboBox__inputWrap--plainText emotion-euiComboBoxInputWrapper-plainText-disabled"
@@ -246,10 +246,10 @@ Object {
         class="euiPopover euiInputPopover emotion-euiPopover-block-EuiInputPopover"
       >
         <div
-          class="euiFormControlLayout euiFormControlLayout--fullWidth emotion-euiComboBox__formControlLayout"
+          class="euiFormControlLayout euiFormControlLayout-isDisabled emotion-euiFormControlLayout-fullWidth-euiComboBox__formControlLayout"
         >
           <div
-            class="euiFormControlLayout__childrenWrapper"
+            class="euiFormControlLayout__childrenWrapper emotion-euiFormControlLayout__childrenWrapper"
           >
             <div
               class="euiComboBox__inputWrap euiComboBox__inputWrap--plainText emotion-euiComboBoxInputWrapper-plainText-disabled"
@@ -343,10 +343,10 @@ Object {
           class="euiPopover euiInputPopover emotion-euiPopover-block-EuiInputPopover"
         >
           <div
-            class="euiFormControlLayout euiFormControlLayout--fullWidth emotion-euiComboBox__formControlLayout"
+            class="euiFormControlLayout emotion-euiFormControlLayout-fullWidth-euiComboBox__formControlLayout"
           >
             <div
-              class="euiFormControlLayout__childrenWrapper"
+              class="euiFormControlLayout__childrenWrapper emotion-euiFormControlLayout__childrenWrapper"
               style="--euiFormControlRightIconsCount: 1;"
             >
               <div
@@ -369,11 +369,11 @@ Object {
                 />
               </div>
               <div
-                class="euiFormControlLayoutIcons euiFormControlLayoutIcons--right euiFormControlLayoutIcons--absolute"
+                class="euiFormControlLayoutIcons emotion-euiFormControlLayoutIcons-absolute-right"
               >
                 <button
                   aria-label="Open list of options"
-                  class="euiFormControlLayoutCustomIcon euiFormControlLayoutCustomIcon--clickable"
+                  class="euiFormControlLayoutCustomIcon emotion-euiFormControlLayoutCustomIcon-clickable"
                   data-test-subj="comboBoxToggleListButton"
                   tabindex="-1"
                   type="button"
@@ -400,10 +400,10 @@ Object {
         class="euiPopover euiInputPopover emotion-euiPopover-block-EuiInputPopover"
       >
         <div
-          class="euiFormControlLayout euiFormControlLayout--fullWidth emotion-euiComboBox__formControlLayout"
+          class="euiFormControlLayout emotion-euiFormControlLayout-fullWidth-euiComboBox__formControlLayout"
         >
           <div
-            class="euiFormControlLayout__childrenWrapper"
+            class="euiFormControlLayout__childrenWrapper emotion-euiFormControlLayout__childrenWrapper"
             style="--euiFormControlRightIconsCount: 1;"
           >
             <div
@@ -426,11 +426,11 @@ Object {
               />
             </div>
             <div
-              class="euiFormControlLayoutIcons euiFormControlLayoutIcons--right euiFormControlLayoutIcons--absolute"
+              class="euiFormControlLayoutIcons emotion-euiFormControlLayoutIcons-absolute-right"
             >
               <button
                 aria-label="Open list of options"
-                class="euiFormControlLayoutCustomIcon euiFormControlLayoutCustomIcon--clickable"
+                class="euiFormControlLayoutCustomIcon emotion-euiFormControlLayoutCustomIcon-clickable"
                 data-test-subj="comboBoxToggleListButton"
                 tabindex="-1"
                 type="button"
@@ -514,10 +514,10 @@ Object {
           class="euiPopover euiInputPopover emotion-euiPopover-block-EuiInputPopover"
         >
           <div
-            class="euiFormControlLayout euiFormControlLayout--fullWidth emotion-euiComboBox__formControlLayout"
+            class="euiFormControlLayout euiFormControlLayout-isDisabled emotion-euiFormControlLayout-fullWidth-euiComboBox__formControlLayout"
           >
             <div
-              class="euiFormControlLayout__childrenWrapper"
+              class="euiFormControlLayout__childrenWrapper emotion-euiFormControlLayout__childrenWrapper"
               style="--euiFormControlRightIconsCount: 1;"
             >
               <div
@@ -541,7 +541,7 @@ Object {
                 />
               </div>
               <div
-                class="euiFormControlLayoutIcons euiFormControlLayoutIcons--right euiFormControlLayoutIcons--absolute"
+                class="euiFormControlLayoutIcons emotion-euiFormControlLayoutIcons-absolute-right-disabled"
               >
                 <span
                   aria-label="Loading"
@@ -564,10 +564,10 @@ Object {
         class="euiPopover euiInputPopover emotion-euiPopover-block-EuiInputPopover"
       >
         <div
-          class="euiFormControlLayout euiFormControlLayout--fullWidth emotion-euiComboBox__formControlLayout"
+          class="euiFormControlLayout euiFormControlLayout-isDisabled emotion-euiFormControlLayout-fullWidth-euiComboBox__formControlLayout"
         >
           <div
-            class="euiFormControlLayout__childrenWrapper"
+            class="euiFormControlLayout__childrenWrapper emotion-euiFormControlLayout__childrenWrapper"
             style="--euiFormControlRightIconsCount: 1;"
           >
             <div
@@ -591,7 +591,7 @@ Object {
               />
             </div>
             <div
-              class="euiFormControlLayoutIcons euiFormControlLayoutIcons--right euiFormControlLayoutIcons--absolute"
+              class="euiFormControlLayoutIcons emotion-euiFormControlLayoutIcons-absolute-right-disabled"
             >
               <span
                 aria-label="Loading"
diff --git a/packages/kbn-securitysolution-exception-list-components/src/list_header/__snapshots__/list_header.test.tsx.snap b/packages/kbn-securitysolution-exception-list-components/src/list_header/__snapshots__/list_header.test.tsx.snap
index 8996152dad75d..4a8527faa5096 100644
--- a/packages/kbn-securitysolution-exception-list-components/src/list_header/__snapshots__/list_header.test.tsx.snap
+++ b/packages/kbn-securitysolution-exception-list-components/src/list_header/__snapshots__/list_header.test.tsx.snap
@@ -274,7 +274,7 @@ Object {
                 id="modalForm_generated-id"
               >
                 <div
-                  class="euiFormRow euiFormRow--fullWidth euiFormRow--hasLabel"
+                  class="euiFormRow euiFormRow--hasLabel emotion-euiFormRow-fullWidth"
                   id="generated-id-row"
                 >
                   <div
@@ -282,7 +282,7 @@ Object {
                   >
                     <label
                       aria-invalid="false"
-                      class="euiFormLabel euiFormRow__label"
+                      class="euiFormLabel euiFormRow__label emotion-euiFormLabel"
                       for="generated-id"
                       id="generated-id-label"
                     >
@@ -293,10 +293,10 @@ Object {
                     class="euiFormRow__fieldWrapper"
                   >
                     <div
-                      class="euiFormControlLayout euiFormControlLayout--fullWidth"
+                      class="euiFormControlLayout emotion-euiFormControlLayout-fullWidth"
                     >
                       <div
-                        class="euiFormControlLayout__childrenWrapper"
+                        class="euiFormControlLayout__childrenWrapper emotion-euiFormControlLayout__childrenWrapper"
                       >
                         <input
                           class="euiFieldText emotion-euiFieldText-fullWidth"
@@ -311,14 +311,14 @@ Object {
                   </div>
                 </div>
                 <div
-                  class="euiFormRow euiFormRow--fullWidth euiFormRow--hasLabel"
+                  class="euiFormRow euiFormRow--hasLabel emotion-euiFormRow-fullWidth"
                   id="generated-id-row"
                 >
                   <div
                     class="euiFormRow__labelWrapper"
                   >
                     <label
-                      class="euiFormLabel euiFormRow__label"
+                      class="euiFormLabel euiFormRow__label emotion-euiFormLabel"
                       for="generated-id"
                       id="generated-id-label"
                     >
@@ -329,10 +329,10 @@ Object {
                     class="euiFormRow__fieldWrapper"
                   >
                     <div
-                      class="euiFormControlLayout euiFormControlLayout--fullWidth euiFormControlLayout--euiTextArea emotion-euiTextArea"
+                      class="euiFormControlLayout euiFormControlLayout--euiTextArea emotion-euiFormControlLayout-fullWidth-euiTextArea"
                     >
                       <div
-                        class="euiFormControlLayout__childrenWrapper"
+                        class="euiFormControlLayout__childrenWrapper emotion-euiFormControlLayout__childrenWrapper"
                       >
                         <textarea
                           class="euiTextArea emotion-euiTextArea-vertical-fullWidth"
diff --git a/packages/kbn-securitysolution-exception-list-components/src/list_header/edit_modal/__snapshots__/edit_modal.test.tsx.snap b/packages/kbn-securitysolution-exception-list-components/src/list_header/edit_modal/__snapshots__/edit_modal.test.tsx.snap
index e4c3f1debc3fb..b333aa10d1872 100644
--- a/packages/kbn-securitysolution-exception-list-components/src/list_header/edit_modal/__snapshots__/edit_modal.test.tsx.snap
+++ b/packages/kbn-securitysolution-exception-list-components/src/list_header/edit_modal/__snapshots__/edit_modal.test.tsx.snap
@@ -54,7 +54,7 @@ Object {
                 id="modalForm_generated-id"
               >
                 <div
-                  class="euiFormRow euiFormRow--fullWidth euiFormRow--hasLabel"
+                  class="euiFormRow euiFormRow--hasLabel emotion-euiFormRow-fullWidth"
                   id="generated-id-row"
                 >
                   <div
@@ -62,7 +62,7 @@ Object {
                   >
                     <label
                       aria-invalid="false"
-                      class="euiFormLabel euiFormRow__label"
+                      class="euiFormLabel euiFormRow__label emotion-euiFormLabel"
                       for="generated-id"
                       id="generated-id-label"
                     >
@@ -73,10 +73,10 @@ Object {
                     class="euiFormRow__fieldWrapper"
                   >
                     <div
-                      class="euiFormControlLayout euiFormControlLayout--fullWidth"
+                      class="euiFormControlLayout emotion-euiFormControlLayout-fullWidth"
                     >
                       <div
-                        class="euiFormControlLayout__childrenWrapper"
+                        class="euiFormControlLayout__childrenWrapper emotion-euiFormControlLayout__childrenWrapper"
                       >
                         <input
                           class="euiFieldText emotion-euiFieldText-fullWidth"
@@ -91,14 +91,14 @@ Object {
                   </div>
                 </div>
                 <div
-                  class="euiFormRow euiFormRow--fullWidth euiFormRow--hasLabel"
+                  class="euiFormRow euiFormRow--hasLabel emotion-euiFormRow-fullWidth"
                   id="generated-id-row"
                 >
                   <div
                     class="euiFormRow__labelWrapper"
                   >
                     <label
-                      class="euiFormLabel euiFormRow__label"
+                      class="euiFormLabel euiFormRow__label emotion-euiFormLabel"
                       for="generated-id"
                       id="generated-id-label"
                     >
@@ -109,10 +109,10 @@ Object {
                     class="euiFormRow__fieldWrapper"
                   >
                     <div
-                      class="euiFormControlLayout euiFormControlLayout--fullWidth euiFormControlLayout--euiTextArea emotion-euiTextArea"
+                      class="euiFormControlLayout euiFormControlLayout--euiTextArea emotion-euiFormControlLayout-fullWidth-euiTextArea"
                     >
                       <div
-                        class="euiFormControlLayout__childrenWrapper"
+                        class="euiFormControlLayout__childrenWrapper emotion-euiFormControlLayout__childrenWrapper"
                       >
                         <textarea
                           class="euiTextArea emotion-euiTextArea-vertical-fullWidth"
diff --git a/packages/kbn-test-jest-helpers/src/testbed/testbed.ts b/packages/kbn-test-jest-helpers/src/testbed/testbed.ts
index 4559924c28aff..52adf2c719ef6 100644
--- a/packages/kbn-test-jest-helpers/src/testbed/testbed.ts
+++ b/packages/kbn-test-jest-helpers/src/testbed/testbed.ts
@@ -231,11 +231,11 @@ export function registerTestBed<T extends string = string, P extends object = an
       ) => {
         let errorMessagesWrappers: ReactWrapper<HTMLAttributes, any, ReactComponent>;
         if (typeof wrapper === 'string') {
-          errorMessagesWrappers = find(wrapper).find('.euiFormErrorText');
+          errorMessagesWrappers = find(wrapper).find('div.euiFormErrorText');
         } else {
           errorMessagesWrappers = wrapper
-            ? wrapper.find('.euiFormErrorText')
-            : component.find('.euiFormErrorText');
+            ? wrapper.find('div.euiFormErrorText')
+            : component.find('div.euiFormErrorText');
         }
         return errorMessagesWrappers.map((err) => err.text());
       };
diff --git a/packages/react/kibana_context/root/root_provider.tsx b/packages/react/kibana_context/root/root_provider.tsx
index f979d0ef49f5d..4fb237ae4624f 100644
--- a/packages/react/kibana_context/root/root_provider.tsx
+++ b/packages/react/kibana_context/root/root_provider.tsx
@@ -47,6 +47,15 @@ export const KibanaRootContextProvider: FC<PropsWithChildren<KibanaRootContextPr
 }) => {
   const hasEuiProvider = useIsNestedEuiProvider();
 
+  const overrides = JSON.parse(localStorage.getItem('kbn-theme-overrides') || '{}');
+  const enhancedProps = {
+    ...props,
+    modify: {
+      ...props.modify,
+      ...overrides,
+    },
+  };
+
   if (hasEuiProvider) {
     emitEuiProviderWarning(
       'KibanaRootContextProvider has likely been nested in this React tree, either by direct reference or by KibanaRenderContextProvider.  The result of this nesting is a nesting of EuiProvider, which has negative effects.  Check your React tree for nested Kibana context providers.'
@@ -54,7 +63,7 @@ export const KibanaRootContextProvider: FC<PropsWithChildren<KibanaRootContextPr
     return <i18n.Context>{children}</i18n.Context>;
   } else {
     return (
-      <KibanaEuiProvider {...props}>
+      <KibanaEuiProvider {...enhancedProps}>
         <i18n.Context>{children}</i18n.Context>
       </KibanaEuiProvider>
     );
diff --git a/src/dev/license_checker/config.ts b/src/dev/license_checker/config.ts
index 0ebeb9f0a518f..78ca2383d61b2 100644
--- a/src/dev/license_checker/config.ts
+++ b/src/dev/license_checker/config.ts
@@ -86,7 +86,7 @@ export const LICENSE_OVERRIDES = {
   'jsts@1.6.2': ['Eclipse Distribution License - v 1.0'], // cf. https://github.com/bjornharrtell/jsts
   '@mapbox/jsonlint-lines-primitives@2.0.2': ['MIT'], // license in readme https://github.com/tmcw/jsonlint
   '@elastic/ems-client@8.5.3': ['Elastic License 2.0'],
-  '@elastic/eui@95.7.0': ['SSPL-1.0 OR Elastic License 2.0'],
+  '@elastic/eui@95.9.0': ['SSPL-1.0 OR Elastic License 2.0'],
   'language-subtag-registry@0.3.21': ['CC-BY-4.0'], // retired ODC‑By license https://github.com/mattcg/language-subtag-registry
   'buffers@0.1.1': ['MIT'], // license in importing module https://www.npmjs.com/package/binary
   '@bufbuild/protobuf@1.2.1': ['Apache-2.0'], // license (Apache-2.0 AND BSD-3-Clause)
diff --git a/src/plugins/controls/public/control_group/control_group.scss b/src/plugins/controls/public/control_group/control_group.scss
index c8042f2629caa..9619e68274e16 100644
--- a/src/plugins/controls/public/control_group/control_group.scss
+++ b/src/plugins/controls/public/control_group/control_group.scss
@@ -90,10 +90,6 @@ $controlMinWidth: $euiSize * 14;
     }
   }
 
-  .controlFrame__labelToolTip {
-    max-width: 40%;
-  }
-
   .controlFrame__formControlLayout {
     width: 100%;
     min-width: $controlMinWidth;
@@ -101,8 +97,7 @@ $controlMinWidth: $euiSize * 14;
 
     .controlFrame__formControlLayoutLabel {
       @include euiTextTruncate;
-      border-radius: $euiBorderRadius;
-      padding-left: 0;
+      padding: 0;
     }
 
     &:not(.controlFrame__formControlLayout-clone) {
@@ -111,12 +106,21 @@ $controlMinWidth: $euiSize * 14;
       }
     }
 
+    // Make sure controls with popover, tooltip, and tour wrappers inherit height correctly
+    [data-euiportal='true'],
+    .euiPopover,
+    .euiToolTipAnchor {
+      height: 100%;
+    }
+
+    .euiFormControlLayout__prepend {
+      padding-left: 0;
+      gap: 0;
+    }
+
     .controlFrame__control {
       height: 100%;
       transition: opacity .1s;
-      background-color: $euiFormBackgroundColor !important;
-
-      @include euiFormControlSideBorderRadius($euiFormControlBorderRadius, $side: 'right', $internal: true);
     }
 
     .controlFrame--controlLoading {
@@ -209,4 +213,4 @@ $controlMinWidth: $euiSize * 14;
       font-weight: $euiFontWeightMedium;
     }
   }
-}
\ No newline at end of file
+}
diff --git a/src/plugins/controls/public/range_slider/components/range_slider.scss b/src/plugins/controls/public/range_slider/components/range_slider.scss
deleted file mode 100644
index 6d8d3f435f197..0000000000000
--- a/src/plugins/controls/public/range_slider/components/range_slider.scss
+++ /dev/null
@@ -1,52 +0,0 @@
-.rangeSliderAnchor__button {
-  .euiFormControlLayout {
-    align-items: center;
-    box-shadow: none;
-    background-color: transparent;
-
-    .euiFormControlLayout__childrenWrapper {
-      background-color: transparent;
-      border-top-left-radius: 0;
-      border-bottom-left-radius: 0;
-      border-top-right-radius: $euiBorderRadius;
-      border-bottom-right-radius: $euiBorderRadius;
-
-      .euiFormControlLayoutDelimited__delimiter, .euiFormControlLayoutIcons--static {
-        height: auto !important;
-      }
-    }
-  }
-
-  .rangeSlider__invalidToken {
-    height: $euiSizeS * 2;
-    padding: 0 $euiSizeS;
-
-    .euiIcon {
-      background-color: transparent;
-      width: $euiSizeS * 2;
-      border-radius: $euiSizeXS;
-      padding: 0 calc($euiSizeXS / 2);
-    }
-  }
-}
-
-.rangeSliderAnchor__fieldNumber {
-  font-weight: $euiFontWeightMedium;
-  box-shadow: none;
-  text-align: center;
-  background-color: transparent;
-
-  &.rangeSliderAnchor__fieldNumber--valid:invalid:not(:focus) {
-    background-image: none; // override the red underline for values between steps
-  }
-
-  &.rangeSliderAnchor__fieldNumber--invalid {
-    color: $euiColorWarningText;
-  }
-
-  &:placeholder-shown, &::placeholder {
-    font-weight: $euiFontWeightRegular;
-    color: $euiTextSubduedColor;
-    text-decoration: none;
-  }
-}
diff --git a/src/plugins/controls/public/range_slider/components/range_slider_control.tsx b/src/plugins/controls/public/range_slider/components/range_slider_control.tsx
index 86bf298da91c7..88195578c52f6 100644
--- a/src/plugins/controls/public/range_slider/components/range_slider_control.tsx
+++ b/src/plugins/controls/public/range_slider/components/range_slider_control.tsx
@@ -9,15 +9,22 @@
 import { debounce } from 'lodash';
 import React, { FC, useState, useMemo, useEffect, useCallback, useRef } from 'react';
 
-import { EuiRangeTick, EuiDualRange, EuiDualRangeProps, EuiToken, EuiToolTip } from '@elastic/eui';
+import {
+  EuiRangeTick,
+  EuiDualRange,
+  EuiDualRangeProps,
+  EuiToken,
+  EuiToolTip,
+  useEuiTheme,
+} from '@elastic/eui';
 
 import { RangeValue } from '../../../common/range_slider/types';
 import { useRangeSlider } from '../embeddable/range_slider_embeddable';
 import { ControlError } from '../../control_group/component/control_error_component';
 
-import './range_slider.scss';
 import { MIN_POPOVER_WIDTH } from '../../constants';
 import { useFieldFormatter } from '../../hooks/use_field_formatter';
+import { rangeSliderControlStyles } from '../../react_controls/controls/data_controls/range_slider/components/range_slider.styles';
 import { RangeSliderStrings } from './range_slider_strings';
 
 export const RangeSliderControl: FC = () => {
@@ -120,6 +127,9 @@ export const RangeSliderControl: FC = () => {
     [isLoading, displayedMin, displayedMax]
   );
 
+  const euiTheme = useEuiTheme();
+  const styles = rangeSliderControlStyles(euiTheme);
+
   const getCommonInputProps = useCallback(
     ({
       inputValue,
@@ -134,23 +144,27 @@ export const RangeSliderControl: FC = () => {
         isInvalid: undefined, // disabling this prop to handle our own validation styling
         placeholder,
         readOnly: false, // overwrites `canOpenPopover` to ensure that the inputs are always clickable
-        className: `rangeSliderAnchor__fieldNumber ${
-          isInvalid
-            ? 'rangeSliderAnchor__fieldNumber--invalid'
-            : 'rangeSliderAnchor__fieldNumber--valid'
-        }`,
+        css: [
+          styles.fieldNumbers.rangeSliderFieldNumber,
+          isInvalid ? styles.fieldNumbers.invalid : styles.fieldNumbers.valid,
+        ],
+        className: 'rangeSliderAnchor__fieldNumber',
         'data-test-subj': `rangeSlider__${testSubj}`,
         value: inputValue === placeholder ? '' : inputValue,
         title: !isInvalid && step ? '' : undefined, // overwrites native number input validation error when the value falls between two steps
       };
     },
-    [isInvalid, step]
+    [isInvalid, step, styles]
   );
 
   return error ? (
     <ControlError error={error} />
   ) : (
-    <span className="rangeSliderAnchor__button" data-test-subj={`range-slider-control-${id}`}>
+    <div
+      css={[styles.rangeSliderControl, isInvalid && styles.invalid]}
+      className="rangeSliderAnchor__button"
+      data-test-subj={`range-slider-control-${id}`}
+    >
       <EuiDualRange
         ref={rangeSliderRef}
         id={id}
@@ -212,6 +226,6 @@ export const RangeSliderControl: FC = () => {
           debouncedOnChange([String(minSelection), String(maxSelection)]);
         }}
       />
-    </span>
+    </div>
   );
 };
diff --git a/src/plugins/controls/public/react_controls/control_group/components/control_panel.scss b/src/plugins/controls/public/react_controls/control_group/components/control_panel.scss
index 5a08475da3414..a66d39e95818a 100644
--- a/src/plugins/controls/public/react_controls/control_group/components/control_panel.scss
+++ b/src/plugins/controls/public/react_controls/control_group/components/control_panel.scss
@@ -4,21 +4,18 @@
   height: $euiButtonHeight;
   box-shadow: none !important;
   background-color: $euiFormBackgroundColor !important;
-
   border-radius: 0 $euiBorderRadius $euiBorderRadius 0 !important;
+
   &--roundedBorders {
     border-radius: $euiBorderRadius !important;
   }
 
   &--labelWrapper {
-    max-width: 40%;
+    height: 100%;
 
     .controlPanel--label {
       @include euiTextTruncate;
-      background-color: transparent;
-      border-radius: $euiBorderRadius;
-      margin-left: 0 !important;
-      padding-left: 0 !important;
+      padding: 0;
     }
   }
 
@@ -35,4 +32,8 @@
       padding-left: $euiSizeM;
     }
   }
-}
\ No newline at end of file
+}
+
+.controlFrame__dragHandle {
+  line-height: 0; // Vertically center the grab handle
+}
diff --git a/src/plugins/controls/public/react_controls/controls/data_controls/range_slider/components/range_slider.scss b/src/plugins/controls/public/react_controls/controls/data_controls/range_slider/components/range_slider.scss
deleted file mode 100644
index 5472ef81dd299..0000000000000
--- a/src/plugins/controls/public/react_controls/controls/data_controls/range_slider/components/range_slider.scss
+++ /dev/null
@@ -1,43 +0,0 @@
-.rangeSliderAnchor__button {
-  .euiFormControlLayout {
-    box-shadow: none;
-    background-color: transparent !important;
-  }
-
-  .rangeSlider__invalidToken {
-    padding: 0 $euiSizeS;
-    display: flex;
-
-    .euiToolTipAnchor {
-      align-self: center;
-    }
-
-    .euiIcon {
-      background-color: transparent;
-      width: $euiSizeS * 2;
-      border-radius: $euiSizeXS;
-      padding: 0 calc($euiSizeXS / 2);
-    }
-  }
-}
-
-.rangeSliderAnchor__fieldNumber {
-  min-width: auto !important;
-  font-weight: $euiFontWeightMedium;
-  height: calc($euiButtonHeight - 3px) !important;
-  background-color: transparent !important;
-
-  &.rangeSliderAnchor__fieldNumber--valid:invalid:not(:focus) {
-    background-image: none; // override the red underline for values between steps
-  }
-
-  &.rangeSliderAnchor__fieldNumber--invalid {
-    color: $euiColorWarningText;
-  }
-
-  &:placeholder-shown, &::placeholder {
-    font-weight: $euiFontWeightRegular;
-    color: $euiTextSubduedColor;
-    text-decoration: none;
-  }
-}
diff --git a/src/plugins/controls/public/react_controls/controls/data_controls/range_slider/components/range_slider.styles.ts b/src/plugins/controls/public/react_controls/controls/data_controls/range_slider/components/range_slider.styles.ts
new file mode 100644
index 0000000000000..c7347afc9608b
--- /dev/null
+++ b/src/plugins/controls/public/react_controls/controls/data_controls/range_slider/components/range_slider.styles.ts
@@ -0,0 +1,88 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+
+import { css } from '@emotion/react';
+
+import { UseEuiTheme } from '@elastic/eui';
+// @ts-ignore - Kibana has trouble reaching into lib/components for types
+import { euiFormControlDefaultShadow } from '@elastic/eui/lib/components/form/form.styles';
+
+export const rangeSliderControlStyles = (euiThemeContext: UseEuiTheme) => {
+  const { euiTheme } = euiThemeContext;
+
+  return {
+    // Wrapper
+    // NOTE: This component is used by a ControlPanel component that already sets its own
+    // EuiFormControlLayout, so unfortunately there is some double nesting going on here
+    // that we need to account for via height inheritence & unsetting EuiDualRange's
+    // form control layout colors/borders
+    rangeSliderControl: css`
+      &,
+      .euiPopover,
+      .euiFormControlLayoutDelimited {
+        height: 100%;
+      }
+
+      .euiFormControlLayout {
+        background-color: transparent;
+        border: none;
+        border-radius: 0;
+      }
+    `,
+    invalid: css`
+      /* EUI CSS util for the generating the underline background-image/gradient */
+      ${euiFormControlDefaultShadow(euiThemeContext, {
+        withBorder: false,
+        withBackgroundColor: false,
+        withBackgroundAnimation: true,
+      })}
+
+      /* Stretch the underline across the entire __childrenWrapper and set it to a custom warning color */
+      background-size: 100% 100%;
+      --euiFormControlStateColor: ${euiTheme.colors.warning};
+
+      /* But restore the danger color for truly invalid inputs (e.g. min larger than max) */
+      &:has(input:invalid) {
+        --euiFormControlStateColor: ${euiTheme.colors.danger};
+      }
+
+      /* Remove the append background so the caution icon looks more natural */
+      .euiFormControlLayout__append {
+        background-color: transparent;
+      }
+    `,
+
+    // Inputs
+    fieldNumbers: {
+      rangeSliderFieldNumber: css`
+        font-weight: ${euiTheme.font.weight.medium};
+        background-color: transparent;
+
+        &:placeholder-shown,
+        &::placeholder {
+          font-weight: ${euiTheme.font.weight.regular};
+          color: ${euiTheme.colors.subduedText};
+        }
+      `,
+      invalid: css`
+        &:not(:invalid) {
+          color: ${euiTheme.colors.warningText};
+        }
+        &:invalid {
+          color: ${euiTheme.colors.dangerText};
+        }
+      `,
+      // unset the red underline for values between steps
+      valid: css`
+        &:invalid:not(:focus) {
+          --euiFormControlStateColor: transparent;
+        }
+      `,
+    },
+  };
+};
diff --git a/src/plugins/controls/public/react_controls/controls/data_controls/range_slider/components/range_slider_control.tsx b/src/plugins/controls/public/react_controls/controls/data_controls/range_slider/components/range_slider_control.tsx
index b653cc9542588..e568807691089 100644
--- a/src/plugins/controls/public/react_controls/controls/data_controls/range_slider/components/range_slider_control.tsx
+++ b/src/plugins/controls/public/react_controls/controls/data_controls/range_slider/components/range_slider_control.tsx
@@ -8,11 +8,18 @@
 
 import React, { FC, useState, useMemo, useEffect, useRef, useCallback } from 'react';
 import { debounce } from 'lodash';
-import { EuiRangeTick, EuiDualRange, EuiDualRangeProps, EuiToken, EuiToolTip } from '@elastic/eui';
+import {
+  EuiRangeTick,
+  EuiDualRange,
+  EuiDualRangeProps,
+  EuiToken,
+  EuiToolTip,
+  useEuiTheme,
+} from '@elastic/eui';
 import { RangeValue } from '../types';
-import './range_slider.scss';
 import { MIN_POPOVER_WIDTH } from '../../../constants';
 import { RangeSliderStrings } from '../range_slider_strings';
+import { rangeSliderControlStyles } from './range_slider.styles';
 
 interface Props {
   fieldFormatter?: (value: string) => string;
@@ -123,6 +130,9 @@ export const RangeSliderControl: FC<Props> = ({
     [isLoading, displayedMin, displayedMax]
   );
 
+  const euiTheme = useEuiTheme();
+  const styles = rangeSliderControlStyles(euiTheme);
+
   const getCommonInputProps = useCallback(
     ({
       inputValue,
@@ -137,17 +147,17 @@ export const RangeSliderControl: FC<Props> = ({
         isInvalid: undefined, // disabling this prop to handle our own validation styling
         placeholder,
         readOnly: false, // overwrites `canOpenPopover` to ensure that the inputs are always clickable
-        className: `rangeSliderAnchor__fieldNumber ${
-          isInvalid
-            ? 'rangeSliderAnchor__fieldNumber--invalid'
-            : 'rangeSliderAnchor__fieldNumber--valid'
-        }`,
+        css: [
+          styles.fieldNumbers.rangeSliderFieldNumber,
+          isInvalid ? styles.fieldNumbers.invalid : styles.fieldNumbers.valid,
+        ],
+        className: 'rangeSliderAnchor__fieldNumber',
         'data-test-subj': `rangeSlider__${testSubj}`,
         value: inputValue === placeholder ? '' : inputValue,
         title: !isInvalid && step ? '' : undefined, // overwrites native number input validation error when the value falls between two steps
       };
     },
-    [isInvalid, step]
+    [isInvalid, step, styles]
   );
 
   const minInputProps = useMemo(() => {
@@ -167,7 +177,11 @@ export const RangeSliderControl: FC<Props> = ({
   }, [getCommonInputProps, max, displayedValue]);
 
   return (
-    <span className="rangeSliderAnchor__button" data-test-subj={`range-slider-control-${uuid}`}>
+    <span
+      css={[styles.rangeSliderControl, isInvalid && styles.invalid]}
+      className="rangeSliderAnchor__button"
+      data-test-subj={`range-slider-control-${uuid}`}
+    >
       <EuiDualRange
         ref={rangeSliderRef}
         id={uuid}
diff --git a/src/plugins/dashboard/public/dashboard_container/embeddable/api/overlays/__snapshots__/save_modal.test.js.snap b/src/plugins/dashboard/public/dashboard_container/embeddable/api/overlays/__snapshots__/save_modal.test.js.snap
index 8c2cd60c2b7c4..d28208dfebc55 100644
--- a/src/plugins/dashboard/public/dashboard_container/embeddable/api/overlays/__snapshots__/save_modal.test.js.snap
+++ b/src/plugins/dashboard/public/dashboard_container/embeddable/api/overlays/__snapshots__/save_modal.test.js.snap
@@ -9,13 +9,7 @@ exports[`renders DashboardSaveModal 1`] = `
   onSave={[Function]}
   options={
     <React.Fragment>
-      <EuiFormRow
-        describedByIds={Array []}
-        display="row"
-        hasChildLabel={true}
-        hasEmptyLabelSpace={false}
-        labelType="label"
-      >
+      <EuiFormRow>
         <EuiFlexGroup
           alignItems="center"
           gutterSize="s"
diff --git a/src/plugins/data_view_field_editor/public/components/field_format_editor/editors/bytes/__snapshots__/bytes.test.tsx.snap b/src/plugins/data_view_field_editor/public/components/field_format_editor/editors/bytes/__snapshots__/bytes.test.tsx.snap
index 0590ab9c7f8d8..e88d4d265f910 100644
--- a/src/plugins/data_view_field_editor/public/components/field_format_editor/editors/bytes/__snapshots__/bytes.test.tsx.snap
+++ b/src/plugins/data_view_field_editor/public/components/field_format_editor/editors/bytes/__snapshots__/bytes.test.tsx.snap
@@ -3,10 +3,6 @@
 exports[`BytesFormatEditor should render normally 1`] = `
 <Fragment>
   <EuiFormRow
-    describedByIds={Array []}
-    display="row"
-    hasChildLabel={true}
-    hasEmptyLabelSpace={false}
     helpText={
       <span>
         <EuiLink
@@ -38,7 +34,6 @@ exports[`BytesFormatEditor should render normally 1`] = `
         }
       />
     }
-    labelType="label"
   >
     <EuiFieldText
       data-test-subj="numberEditorFormatPattern"
diff --git a/src/plugins/data_view_field_editor/public/components/field_format_editor/editors/date/__snapshots__/date.test.tsx.snap b/src/plugins/data_view_field_editor/public/components/field_format_editor/editors/date/__snapshots__/date.test.tsx.snap
index 19edbbf92554a..03386ba76ba9e 100644
--- a/src/plugins/data_view_field_editor/public/components/field_format_editor/editors/date/__snapshots__/date.test.tsx.snap
+++ b/src/plugins/data_view_field_editor/public/components/field_format_editor/editors/date/__snapshots__/date.test.tsx.snap
@@ -3,10 +3,6 @@
 exports[`DateFormatEditor should render normally 1`] = `
 <Fragment>
   <EuiFormRow
-    describedByIds={Array []}
-    display="row"
-    hasChildLabel={true}
-    hasEmptyLabelSpace={false}
     helpText={
       <span>
         <EuiLink
@@ -38,7 +34,6 @@ exports[`DateFormatEditor should render normally 1`] = `
         }
       />
     }
-    labelType="label"
   >
     <EuiFieldText
       data-test-subj="dateEditorPattern"
diff --git a/src/plugins/data_view_field_editor/public/components/field_format_editor/editors/date_nanos/__snapshots__/date_nanos.test.tsx.snap b/src/plugins/data_view_field_editor/public/components/field_format_editor/editors/date_nanos/__snapshots__/date_nanos.test.tsx.snap
index 202006fe612b9..090e3914889f3 100644
--- a/src/plugins/data_view_field_editor/public/components/field_format_editor/editors/date_nanos/__snapshots__/date_nanos.test.tsx.snap
+++ b/src/plugins/data_view_field_editor/public/components/field_format_editor/editors/date_nanos/__snapshots__/date_nanos.test.tsx.snap
@@ -3,10 +3,6 @@
 exports[`DateFormatEditor should render normally 1`] = `
 <Fragment>
   <EuiFormRow
-    describedByIds={Array []}
-    display="row"
-    hasChildLabel={true}
-    hasEmptyLabelSpace={false}
     helpText={
       <span>
         <EuiLink
@@ -38,7 +34,6 @@ exports[`DateFormatEditor should render normally 1`] = `
         }
       />
     }
-    labelType="label"
   >
     <EuiFieldText
       data-test-subj="dateEditorPattern"
diff --git a/src/plugins/data_view_field_editor/public/components/field_format_editor/editors/duration/__snapshots__/duration.test.tsx.snap b/src/plugins/data_view_field_editor/public/components/field_format_editor/editors/duration/__snapshots__/duration.test.tsx.snap
index ce4a3fccfcc3b..6268462588763 100644
--- a/src/plugins/data_view_field_editor/public/components/field_format_editor/editors/duration/__snapshots__/duration.test.tsx.snap
+++ b/src/plugins/data_view_field_editor/public/components/field_format_editor/editors/duration/__snapshots__/duration.test.tsx.snap
@@ -3,10 +3,6 @@
 exports[`DurationFormatEditor should not render show suffix on dynamic output 1`] = `
 <Fragment>
   <EuiFormRow
-    describedByIds={Array []}
-    display="row"
-    hasChildLabel={true}
-    hasEmptyLabelSpace={false}
     isInvalid={false}
     label={
       <Memo(MemoizedFormattedMessage)
@@ -14,7 +10,6 @@ exports[`DurationFormatEditor should not render show suffix on dynamic output 1`
         id="indexPatternFieldEditor.duration.inputFormatLabel"
       />
     }
-    labelType="label"
   >
     <EuiSelect
       data-test-subj="durationEditorInputFormat"
@@ -32,10 +27,6 @@ exports[`DurationFormatEditor should not render show suffix on dynamic output 1`
     />
   </EuiFormRow>
   <EuiFormRow
-    describedByIds={Array []}
-    display="row"
-    hasChildLabel={true}
-    hasEmptyLabelSpace={false}
     isInvalid={false}
     label={
       <Memo(MemoizedFormattedMessage)
@@ -43,7 +34,6 @@ exports[`DurationFormatEditor should not render show suffix on dynamic output 1`
         id="indexPatternFieldEditor.duration.outputFormatLabel"
       />
     }
-    labelType="label"
   >
     <EuiSelect
       data-test-subj="durationEditorOutputFormat"
@@ -65,11 +55,7 @@ exports[`DurationFormatEditor should not render show suffix on dynamic output 1`
     />
   </EuiFormRow>
   <EuiFormRow
-    describedByIds={Array []}
-    display="row"
     error={null}
-    hasChildLabel={true}
-    hasEmptyLabelSpace={false}
     isInvalid={false}
     label={
       <Memo(MemoizedFormattedMessage)
@@ -77,7 +63,6 @@ exports[`DurationFormatEditor should not render show suffix on dynamic output 1`
         id="indexPatternFieldEditor.duration.decimalPlacesLabel"
       />
     }
-    labelType="label"
   >
     <EuiFieldNumber
       isInvalid={false}
@@ -87,13 +72,7 @@ exports[`DurationFormatEditor should not render show suffix on dynamic output 1`
       value={2}
     />
   </EuiFormRow>
-  <EuiFormRow
-    describedByIds={Array []}
-    display="row"
-    hasChildLabel={true}
-    hasEmptyLabelSpace={false}
-    labelType="label"
-  >
+  <EuiFormRow>
     <EuiSwitch
       checked={false}
       disabled={false}
@@ -106,13 +85,7 @@ exports[`DurationFormatEditor should not render show suffix on dynamic output 1`
       onChange={[Function]}
     />
   </EuiFormRow>
-  <EuiFormRow
-    describedByIds={Array []}
-    display="row"
-    hasChildLabel={true}
-    hasEmptyLabelSpace={false}
-    labelType="label"
-  >
+  <EuiFormRow>
     <EuiSwitch
       checked={true}
       disabled={false}
@@ -174,10 +147,6 @@ exports[`DurationFormatEditor should not render show suffix on dynamic output 1`
 exports[`DurationFormatEditor should render human readable output normally 1`] = `
 <Fragment>
   <EuiFormRow
-    describedByIds={Array []}
-    display="row"
-    hasChildLabel={true}
-    hasEmptyLabelSpace={false}
     isInvalid={false}
     label={
       <Memo(MemoizedFormattedMessage)
@@ -185,7 +154,6 @@ exports[`DurationFormatEditor should render human readable output normally 1`] =
         id="indexPatternFieldEditor.duration.inputFormatLabel"
       />
     }
-    labelType="label"
   >
     <EuiSelect
       data-test-subj="durationEditorInputFormat"
@@ -203,10 +171,6 @@ exports[`DurationFormatEditor should render human readable output normally 1`] =
     />
   </EuiFormRow>
   <EuiFormRow
-    describedByIds={Array []}
-    display="row"
-    hasChildLabel={true}
-    hasEmptyLabelSpace={false}
     isInvalid={false}
     label={
       <Memo(MemoizedFormattedMessage)
@@ -214,7 +178,6 @@ exports[`DurationFormatEditor should render human readable output normally 1`] =
         id="indexPatternFieldEditor.duration.outputFormatLabel"
       />
     }
-    labelType="label"
   >
     <EuiSelect
       data-test-subj="durationEditorOutputFormat"
@@ -284,10 +247,6 @@ exports[`DurationFormatEditor should render human readable output normally 1`] =
 exports[`DurationFormatEditor should render non-human readable output normally 1`] = `
 <Fragment>
   <EuiFormRow
-    describedByIds={Array []}
-    display="row"
-    hasChildLabel={true}
-    hasEmptyLabelSpace={false}
     isInvalid={false}
     label={
       <Memo(MemoizedFormattedMessage)
@@ -295,7 +254,6 @@ exports[`DurationFormatEditor should render non-human readable output normally 1
         id="indexPatternFieldEditor.duration.inputFormatLabel"
       />
     }
-    labelType="label"
   >
     <EuiSelect
       data-test-subj="durationEditorInputFormat"
@@ -313,10 +271,6 @@ exports[`DurationFormatEditor should render non-human readable output normally 1
     />
   </EuiFormRow>
   <EuiFormRow
-    describedByIds={Array []}
-    display="row"
-    hasChildLabel={true}
-    hasEmptyLabelSpace={false}
     isInvalid={false}
     label={
       <Memo(MemoizedFormattedMessage)
@@ -324,7 +278,6 @@ exports[`DurationFormatEditor should render non-human readable output normally 1
         id="indexPatternFieldEditor.duration.outputFormatLabel"
       />
     }
-    labelType="label"
   >
     <EuiSelect
       data-test-subj="durationEditorOutputFormat"
@@ -346,11 +299,7 @@ exports[`DurationFormatEditor should render non-human readable output normally 1
     />
   </EuiFormRow>
   <EuiFormRow
-    describedByIds={Array []}
-    display="row"
     error={null}
-    hasChildLabel={true}
-    hasEmptyLabelSpace={false}
     isInvalid={false}
     label={
       <Memo(MemoizedFormattedMessage)
@@ -358,7 +307,6 @@ exports[`DurationFormatEditor should render non-human readable output normally 1
         id="indexPatternFieldEditor.duration.decimalPlacesLabel"
       />
     }
-    labelType="label"
   >
     <EuiFieldNumber
       isInvalid={false}
@@ -368,13 +316,7 @@ exports[`DurationFormatEditor should render non-human readable output normally 1
       value={2}
     />
   </EuiFormRow>
-  <EuiFormRow
-    describedByIds={Array []}
-    display="row"
-    hasChildLabel={true}
-    hasEmptyLabelSpace={false}
-    labelType="label"
-  >
+  <EuiFormRow>
     <EuiSwitch
       checked={false}
       label={
@@ -386,13 +328,7 @@ exports[`DurationFormatEditor should render non-human readable output normally 1
       onChange={[Function]}
     />
   </EuiFormRow>
-  <EuiFormRow
-    describedByIds={Array []}
-    display="row"
-    hasChildLabel={true}
-    hasEmptyLabelSpace={false}
-    labelType="label"
-  >
+  <EuiFormRow>
     <EuiSwitch
       checked={false}
       disabled={true}
@@ -405,13 +341,7 @@ exports[`DurationFormatEditor should render non-human readable output normally 1
       onChange={[Function]}
     />
   </EuiFormRow>
-  <EuiFormRow
-    describedByIds={Array []}
-    display="row"
-    hasChildLabel={true}
-    hasEmptyLabelSpace={false}
-    labelType="label"
-  >
+  <EuiFormRow>
     <EuiSwitch
       checked={true}
       disabled={true}
diff --git a/src/plugins/data_view_field_editor/public/components/field_format_editor/editors/histogram/__snapshots__/histogram.test.tsx.snap b/src/plugins/data_view_field_editor/public/components/field_format_editor/editors/histogram/__snapshots__/histogram.test.tsx.snap
index b62edb730e2b8..44aa7ed49d680 100644
--- a/src/plugins/data_view_field_editor/public/components/field_format_editor/editors/histogram/__snapshots__/histogram.test.tsx.snap
+++ b/src/plugins/data_view_field_editor/public/components/field_format_editor/editors/histogram/__snapshots__/histogram.test.tsx.snap
@@ -3,12 +3,7 @@
 exports[`HistogramFormatEditor should render normally 1`] = `
 <Fragment>
   <EuiFormRow
-    describedByIds={Array []}
-    display="row"
-    hasChildLabel={true}
-    hasEmptyLabelSpace={false}
     label="Aggregated number format"
-    labelType="label"
   >
     <EuiSelect
       onChange={[Function]}
@@ -32,10 +27,6 @@ exports[`HistogramFormatEditor should render normally 1`] = `
     />
   </EuiFormRow>
   <EuiFormRow
-    describedByIds={Array []}
-    display="row"
-    hasChildLabel={true}
-    hasEmptyLabelSpace={false}
     helpText={
       <span>
         <EuiLink
@@ -55,7 +46,6 @@ exports[`HistogramFormatEditor should render normally 1`] = `
     }
     isInvalid={false}
     label="Numeral format pattern (optional)"
-    labelType="label"
   >
     <EuiFieldText
       isInvalid={false}
diff --git a/src/plugins/data_view_field_editor/public/components/field_format_editor/editors/number/__snapshots__/number.test.tsx.snap b/src/plugins/data_view_field_editor/public/components/field_format_editor/editors/number/__snapshots__/number.test.tsx.snap
index 82e4e218e6930..465589a361a18 100644
--- a/src/plugins/data_view_field_editor/public/components/field_format_editor/editors/number/__snapshots__/number.test.tsx.snap
+++ b/src/plugins/data_view_field_editor/public/components/field_format_editor/editors/number/__snapshots__/number.test.tsx.snap
@@ -3,10 +3,6 @@
 exports[`NumberFormatEditor should render normally 1`] = `
 <Fragment>
   <EuiFormRow
-    describedByIds={Array []}
-    display="row"
-    hasChildLabel={true}
-    hasEmptyLabelSpace={false}
     helpText={
       <span>
         <EuiLink
@@ -38,7 +34,6 @@ exports[`NumberFormatEditor should render normally 1`] = `
         }
       />
     }
-    labelType="label"
   >
     <EuiFieldText
       data-test-subj="numberEditorFormatPattern"
diff --git a/src/plugins/data_view_field_editor/public/components/field_format_editor/editors/percent/__snapshots__/percent.test.tsx.snap b/src/plugins/data_view_field_editor/public/components/field_format_editor/editors/percent/__snapshots__/percent.test.tsx.snap
index 91d667564e3d8..4ca8a6725d817 100644
--- a/src/plugins/data_view_field_editor/public/components/field_format_editor/editors/percent/__snapshots__/percent.test.tsx.snap
+++ b/src/plugins/data_view_field_editor/public/components/field_format_editor/editors/percent/__snapshots__/percent.test.tsx.snap
@@ -3,10 +3,6 @@
 exports[`PercentFormatEditor should render normally 1`] = `
 <Fragment>
   <EuiFormRow
-    describedByIds={Array []}
-    display="row"
-    hasChildLabel={true}
-    hasEmptyLabelSpace={false}
     helpText={
       <span>
         <EuiLink
@@ -38,7 +34,6 @@ exports[`PercentFormatEditor should render normally 1`] = `
         }
       />
     }
-    labelType="label"
   >
     <EuiFieldText
       data-test-subj="numberEditorFormatPattern"
diff --git a/src/plugins/data_view_field_editor/public/components/field_format_editor/editors/static_lookup/__snapshots__/static_lookup.test.tsx.snap b/src/plugins/data_view_field_editor/public/components/field_format_editor/editors/static_lookup/__snapshots__/static_lookup.test.tsx.snap
index 5d9a828a606e9..c58a28f6af6de 100644
--- a/src/plugins/data_view_field_editor/public/components/field_format_editor/editors/static_lookup/__snapshots__/static_lookup.test.tsx.snap
+++ b/src/plugins/data_view_field_editor/public/components/field_format_editor/editors/static_lookup/__snapshots__/static_lookup.test.tsx.snap
@@ -84,17 +84,12 @@ exports[`StaticLookupFormatEditor should render multiple lookup entries and unkn
     size="l"
   />
   <EuiFormRow
-    describedByIds={Array []}
-    display="row"
-    hasChildLabel={true}
-    hasEmptyLabelSpace={false}
     label={
       <Memo(MemoizedFormattedMessage)
         defaultMessage="Value for unknown key"
         id="indexPatternFieldEditor.staticLookup.unknownKeyLabel"
       />
     }
-    labelType="label"
   >
     <EuiFieldText
       data-test-subj="staticLookupEditorUnknownValue"
@@ -187,17 +182,12 @@ exports[`StaticLookupFormatEditor should render normally 1`] = `
     size="l"
   />
   <EuiFormRow
-    describedByIds={Array []}
-    display="row"
-    hasChildLabel={true}
-    hasEmptyLabelSpace={false}
     label={
       <Memo(MemoizedFormattedMessage)
         defaultMessage="Value for unknown key"
         id="indexPatternFieldEditor.staticLookup.unknownKeyLabel"
       />
     }
-    labelType="label"
   >
     <EuiFieldText
       data-test-subj="staticLookupEditorUnknownValue"
diff --git a/src/plugins/data_view_field_editor/public/components/field_format_editor/editors/string/__snapshots__/string.test.tsx.snap b/src/plugins/data_view_field_editor/public/components/field_format_editor/editors/string/__snapshots__/string.test.tsx.snap
index 481676266eddd..4e2f160239448 100644
--- a/src/plugins/data_view_field_editor/public/components/field_format_editor/editors/string/__snapshots__/string.test.tsx.snap
+++ b/src/plugins/data_view_field_editor/public/components/field_format_editor/editors/string/__snapshots__/string.test.tsx.snap
@@ -3,10 +3,6 @@
 exports[`StringFormatEditor should render normally 1`] = `
 <Fragment>
   <EuiFormRow
-    describedByIds={Array []}
-    display="row"
-    hasChildLabel={true}
-    hasEmptyLabelSpace={false}
     isInvalid={false}
     label={
       <Memo(MemoizedFormattedMessage)
@@ -14,7 +10,6 @@ exports[`StringFormatEditor should render normally 1`] = `
         id="indexPatternFieldEditor.string.transformLabel"
       />
     }
-    labelType="label"
   >
     <EuiSelect
       data-test-subj="stringEditorTransform"
diff --git a/src/plugins/data_view_field_editor/public/components/field_format_editor/editors/truncate/__snapshots__/truncate.test.tsx.snap b/src/plugins/data_view_field_editor/public/components/field_format_editor/editors/truncate/__snapshots__/truncate.test.tsx.snap
index 672be61a1d71b..08ea21107881f 100644
--- a/src/plugins/data_view_field_editor/public/components/field_format_editor/editors/truncate/__snapshots__/truncate.test.tsx.snap
+++ b/src/plugins/data_view_field_editor/public/components/field_format_editor/editors/truncate/__snapshots__/truncate.test.tsx.snap
@@ -3,10 +3,6 @@
 exports[`TruncateFormatEditor should render normally 1`] = `
 <Fragment>
   <EuiFormRow
-    describedByIds={Array []}
-    display="row"
-    hasChildLabel={true}
-    hasEmptyLabelSpace={false}
     isInvalid={false}
     label={
       <Memo(MemoizedFormattedMessage)
@@ -14,7 +10,6 @@ exports[`TruncateFormatEditor should render normally 1`] = `
         id="indexPatternFieldEditor.truncate.lengthLabel"
       />
     }
-    labelType="label"
   >
     <EuiFieldNumber
       data-test-subj="truncateEditorLength"
diff --git a/src/plugins/data_view_field_editor/public/components/field_format_editor/editors/url/__snapshots__/url.test.tsx.snap b/src/plugins/data_view_field_editor/public/components/field_format_editor/editors/url/__snapshots__/url.test.tsx.snap
index 2968748f1a7b8..1780ae7a8ced8 100644
--- a/src/plugins/data_view_field_editor/public/components/field_format_editor/editors/url/__snapshots__/url.test.tsx.snap
+++ b/src/plugins/data_view_field_editor/public/components/field_format_editor/editors/url/__snapshots__/url.test.tsx.snap
@@ -3,14 +3,14 @@
 exports[`UrlFormatEditor should render normally 1`] = `
 <div>
   <div
-    class="euiFormRow euiFormRow--hasLabel"
+    class="euiFormRow euiFormRow--hasLabel emotion-euiFormRow"
     id="generated-id-row"
   >
     <div
       class="euiFormRow__labelWrapper"
     >
       <label
-        class="euiFormLabel euiFormRow__label"
+        class="euiFormLabel euiFormRow__label emotion-euiFormLabel"
         for="generated-id"
         id="generated-id-label"
       >
@@ -21,10 +21,10 @@ exports[`UrlFormatEditor should render normally 1`] = `
       class="euiFormRow__fieldWrapper"
     >
       <div
-        class="euiFormControlLayout"
+        class="euiFormControlLayout emotion-euiFormControlLayout"
       >
         <div
-          class="euiFormControlLayout__childrenWrapper"
+          class="euiFormControlLayout__childrenWrapper emotion-euiFormControlLayout__childrenWrapper"
           style="--euiFormControlRightIconsCount: 1;"
         >
           <select
@@ -49,10 +49,10 @@ exports[`UrlFormatEditor should render normally 1`] = `
             </option>
           </select>
           <div
-            class="euiFormControlLayoutIcons euiFormControlLayoutIcons--right euiFormControlLayoutIcons--absolute"
+            class="euiFormControlLayoutIcons emotion-euiFormControlLayoutIcons-absolute-right"
           >
             <span
-              class="euiFormControlLayoutCustomIcon"
+              class="euiFormControlLayoutCustomIcon emotion-euiFormControlLayoutCustomIcon"
             >
               <span
                 aria-hidden="true"
@@ -66,14 +66,14 @@ exports[`UrlFormatEditor should render normally 1`] = `
     </div>
   </div>
   <div
-    class="euiFormRow euiFormRow--hasLabel"
+    class="euiFormRow euiFormRow--hasLabel emotion-euiFormRow"
     id="generated-id-row"
   >
     <div
       class="euiFormRow__labelWrapper"
     >
       <label
-        class="euiFormLabel euiFormRow__label"
+        class="euiFormLabel euiFormRow__label emotion-euiFormLabel"
         for="generated-id"
         id="generated-id-label"
       >
@@ -89,33 +89,31 @@ exports[`UrlFormatEditor should render normally 1`] = `
         <button
           aria-checked="false"
           aria-labelledby="generated-id"
-          class="euiSwitch__button"
+          class="euiSwitch__button emotion-euiSwitch__button"
           id="generated-id"
           role="switch"
           type="button"
         >
           <span
-            class="euiSwitch__body"
+            class="euiSwitch__body emotion-euiSwitch__body-off"
           >
             <span
-              class="euiSwitch__thumb"
-            />
-            <span
-              class="euiSwitch__track"
+              class="euiSwitch__icons emotion-euiSwitch__icons-off-enabled"
             >
               <span
-                class="euiSwitch__icon"
-                data-euiicon-type="cross"
+                data-euiicon-type="check"
               />
               <span
-                class="euiSwitch__icon euiSwitch__icon--checked"
-                data-euiicon-type="check"
+                data-euiicon-type="cross"
               />
             </span>
           </span>
+          <span
+            class="euiSwitch__thumb emotion-euiSwitch__thumb-off"
+          />
         </button>
         <span
-          class="euiSwitch__label"
+          class="euiSwitch__label emotion-euiSwitch__label"
           id="generated-id"
         >
           Off
@@ -124,7 +122,7 @@ exports[`UrlFormatEditor should render normally 1`] = `
     </div>
   </div>
   <div
-    class="euiFormRow euiFormRow--hasLabel"
+    class="euiFormRow euiFormRow--hasLabel emotion-euiFormRow"
     id="generated-id-row"
   >
     <div
@@ -132,7 +130,7 @@ exports[`UrlFormatEditor should render normally 1`] = `
     >
       <label
         aria-invalid="false"
-        class="euiFormLabel euiFormRow__label"
+        class="euiFormLabel euiFormRow__label emotion-euiFormLabel"
         for="generated-id"
         id="generated-id-label"
       >
@@ -143,10 +141,10 @@ exports[`UrlFormatEditor should render normally 1`] = `
       class="euiFormRow__fieldWrapper"
     >
       <div
-        class="euiFormControlLayout"
+        class="euiFormControlLayout emotion-euiFormControlLayout"
       >
         <div
-          class="euiFormControlLayout__childrenWrapper"
+          class="euiFormControlLayout__childrenWrapper emotion-euiFormControlLayout__childrenWrapper"
         >
           <input
             aria-describedby="generated-id-help-0"
@@ -159,7 +157,7 @@ exports[`UrlFormatEditor should render normally 1`] = `
         </div>
       </div>
       <div
-        class="euiFormHelpText euiFormRow__text"
+        class="euiFormHelpText euiFormRow__text emotion-euiFormHelpText"
         id="generated-id-help-0"
       >
         <a
@@ -185,7 +183,7 @@ exports[`UrlFormatEditor should render normally 1`] = `
     </div>
   </div>
   <div
-    class="euiFormRow euiFormRow--hasLabel"
+    class="euiFormRow euiFormRow--hasLabel emotion-euiFormRow"
     id="generated-id-row"
   >
     <div
@@ -193,7 +191,7 @@ exports[`UrlFormatEditor should render normally 1`] = `
     >
       <label
         aria-invalid="false"
-        class="euiFormLabel euiFormRow__label"
+        class="euiFormLabel euiFormRow__label emotion-euiFormLabel"
         for="generated-id"
         id="generated-id-label"
       >
@@ -204,10 +202,10 @@ exports[`UrlFormatEditor should render normally 1`] = `
       class="euiFormRow__fieldWrapper"
     >
       <div
-        class="euiFormControlLayout"
+        class="euiFormControlLayout emotion-euiFormControlLayout"
       >
         <div
-          class="euiFormControlLayout__childrenWrapper"
+          class="euiFormControlLayout__childrenWrapper emotion-euiFormControlLayout__childrenWrapper"
         >
           <input
             aria-describedby="generated-id-help-0"
@@ -220,7 +218,7 @@ exports[`UrlFormatEditor should render normally 1`] = `
         </div>
       </div>
       <div
-        class="euiFormHelpText euiFormRow__text"
+        class="euiFormHelpText euiFormRow__text emotion-euiFormHelpText"
         id="generated-id-help-0"
       >
         <a
@@ -246,14 +244,14 @@ exports[`UrlFormatEditor should render normally 1`] = `
     </div>
   </div>
   <div
-    class="euiFormRow euiFormRow--hasLabel"
+    class="euiFormRow euiFormRow--hasLabel emotion-euiFormRow"
     id="generated-id-row"
   >
     <div
       class="euiFormRow__labelWrapper"
     >
       <label
-        class="euiFormLabel euiFormRow__label"
+        class="euiFormLabel euiFormRow__label emotion-euiFormLabel"
         for="generated-id"
         id="generated-id-label"
       >
diff --git a/src/plugins/data_view_field_editor/public/components/field_format_editor/samples/__snapshots__/samples.test.tsx.snap b/src/plugins/data_view_field_editor/public/components/field_format_editor/samples/__snapshots__/samples.test.tsx.snap
index 362de9d97233e..b21b0c0704997 100644
--- a/src/plugins/data_view_field_editor/public/components/field_format_editor/samples/__snapshots__/samples.test.tsx.snap
+++ b/src/plugins/data_view_field_editor/public/components/field_format_editor/samples/__snapshots__/samples.test.tsx.snap
@@ -2,17 +2,12 @@
 
 exports[`FormatEditorSamples should render normally 1`] = `
 <EuiFormRow
-  describedByIds={Array []}
-  display="row"
-  hasChildLabel={true}
-  hasEmptyLabelSpace={false}
   label={
     <Memo(MemoizedFormattedMessage)
       defaultMessage="Samples"
       id="indexPatternFieldEditor.samplesHeader"
     />
   }
-  labelType="label"
 >
   <EuiBasicTable
     className="kbnFieldFormatEditor__samples"
diff --git a/src/plugins/es_ui_shared/public/components/cron_editor/__snapshots__/cron_editor.test.tsx.snap b/src/plugins/es_ui_shared/public/components/cron_editor/__snapshots__/cron_editor.test.tsx.snap
index 2ce85f8c1a74c..c1fbeab0538e5 100644
--- a/src/plugins/es_ui_shared/public/components/cron_editor/__snapshots__/cron_editor.test.tsx.snap
+++ b/src/plugins/es_ui_shared/public/components/cron_editor/__snapshots__/cron_editor.test.tsx.snap
@@ -3,14 +3,14 @@
 exports[`CronEditor is rendered with a DAY frequency 1`] = `
 Array [
   <div
-    class="euiFormRow euiFormRow--fullWidth euiFormRow--hasLabel"
+    class="euiFormRow euiFormRow--hasLabel emotion-euiFormRow-fullWidth"
     id="generated-id-row"
   >
     <div
       class="euiFormRow__labelWrapper"
     >
       <label
-        class="euiFormLabel euiFormRow__label"
+        class="euiFormLabel euiFormRow__label emotion-euiFormLabel"
         for="generated-id"
         id="generated-id-label"
       >
@@ -21,16 +21,20 @@ Array [
       class="euiFormRow__fieldWrapper"
     >
       <div
-        class="euiFormControlLayout euiFormControlLayout--fullWidth euiFormControlLayout--group"
+        class="euiFormControlLayout euiFormControlLayout--group emotion-euiFormControlLayout-fullWidth-group"
       >
-        <label
-          class="euiFormLabel euiFormControlLayout__prepend"
-          for="generated-id"
+        <div
+          class="euiFormControlLayout__prepend emotion-euiFormControlLayout__side-prepend"
         >
-          Every
-        </label>
+          <label
+            class="euiFormLabel emotion-euiFormLabel"
+            for="generated-id"
+          >
+            Every
+          </label>
+        </div>
         <div
-          class="euiFormControlLayout__childrenWrapper"
+          class="euiFormControlLayout__childrenWrapper emotion-euiFormControlLayout__childrenWrapper-inGroup-prependOnly"
           style="--euiFormControlRightIconsCount: 1;"
         >
           <select
@@ -70,10 +74,10 @@ Array [
             </option>
           </select>
           <div
-            class="euiFormControlLayoutIcons euiFormControlLayoutIcons--right euiFormControlLayoutIcons--absolute"
+            class="euiFormControlLayoutIcons emotion-euiFormControlLayoutIcons-absolute-right"
           >
             <span
-              class="euiFormControlLayoutCustomIcon"
+              class="euiFormControlLayoutCustomIcon emotion-euiFormControlLayoutCustomIcon"
             >
               <span
                 aria-hidden="true"
@@ -87,7 +91,7 @@ Array [
     </div>
   </div>,
   <div
-    class="euiFormRow euiFormRow--fullWidth euiFormRow--hasLabel"
+    class="euiFormRow euiFormRow--hasLabel emotion-euiFormRow-fullWidth"
     data-test-subj="cronFrequencyConfiguration"
     id="generated-id-row"
   >
@@ -95,7 +99,7 @@ Array [
       class="euiFormRow__labelWrapper"
     >
       <label
-        class="euiFormLabel euiFormRow__label"
+        class="euiFormLabel euiFormRow__label emotion-euiFormLabel"
         for="generated-id"
         id="generated-id-label"
       >
@@ -113,15 +117,19 @@ Array [
           class="euiFlexItem emotion-euiFlexItem-growZero"
         >
           <div
-            class="euiFormControlLayout euiFormControlLayout--fullWidth euiFormControlLayout--group"
+            class="euiFormControlLayout euiFormControlLayout--group emotion-euiFormControlLayout-fullWidth-group"
           >
-            <label
-              class="euiFormLabel euiFormControlLayout__prepend"
+            <div
+              class="euiFormControlLayout__prepend emotion-euiFormControlLayout__side-prepend"
             >
-              At
-            </label>
+              <label
+                class="euiFormLabel emotion-euiFormLabel"
+              >
+                At
+              </label>
+            </div>
             <div
-              class="euiFormControlLayout__childrenWrapper"
+              class="euiFormControlLayout__childrenWrapper emotion-euiFormControlLayout__childrenWrapper-inGroup-prependOnly"
               style="--euiFormControlRightIconsCount: 1;"
             >
               <select
@@ -251,10 +259,10 @@ Array [
                 </option>
               </select>
               <div
-                class="euiFormControlLayoutIcons euiFormControlLayoutIcons--right euiFormControlLayoutIcons--absolute"
+                class="euiFormControlLayoutIcons emotion-euiFormControlLayoutIcons-absolute-right"
               >
                 <span
-                  class="euiFormControlLayoutCustomIcon"
+                  class="euiFormControlLayoutCustomIcon emotion-euiFormControlLayoutCustomIcon"
                 >
                   <span
                     aria-hidden="true"
@@ -270,15 +278,19 @@ Array [
           class="euiFlexItem emotion-euiFlexItem-grow-1"
         >
           <div
-            class="euiFormControlLayout euiFormControlLayout--fullWidth euiFormControlLayout--group"
+            class="euiFormControlLayout euiFormControlLayout--group emotion-euiFormControlLayout-fullWidth-group"
           >
-            <label
-              class="euiFormLabel euiFormControlLayout__prepend"
+            <div
+              class="euiFormControlLayout__prepend emotion-euiFormControlLayout__side-prepend"
             >
-              :
-            </label>
+              <label
+                class="euiFormLabel emotion-euiFormLabel"
+              >
+                :
+              </label>
+            </div>
             <div
-              class="euiFormControlLayout__childrenWrapper"
+              class="euiFormControlLayout__childrenWrapper emotion-euiFormControlLayout__childrenWrapper-inGroup-prependOnly"
               style="--euiFormControlRightIconsCount: 1;"
             >
               <select
@@ -588,10 +600,10 @@ Array [
                 </option>
               </select>
               <div
-                class="euiFormControlLayoutIcons euiFormControlLayoutIcons--right euiFormControlLayoutIcons--absolute"
+                class="euiFormControlLayoutIcons emotion-euiFormControlLayoutIcons-absolute-right"
               >
                 <span
-                  class="euiFormControlLayoutCustomIcon"
+                  class="euiFormControlLayoutCustomIcon emotion-euiFormControlLayoutCustomIcon"
                 >
                   <span
                     aria-hidden="true"
@@ -612,14 +624,14 @@ Array [
 exports[`CronEditor is rendered with a HOUR frequency 1`] = `
 Array [
   <div
-    class="euiFormRow euiFormRow--fullWidth euiFormRow--hasLabel"
+    class="euiFormRow euiFormRow--hasLabel emotion-euiFormRow-fullWidth"
     id="generated-id-row"
   >
     <div
       class="euiFormRow__labelWrapper"
     >
       <label
-        class="euiFormLabel euiFormRow__label"
+        class="euiFormLabel euiFormRow__label emotion-euiFormLabel"
         for="generated-id"
         id="generated-id-label"
       >
@@ -630,16 +642,20 @@ Array [
       class="euiFormRow__fieldWrapper"
     >
       <div
-        class="euiFormControlLayout euiFormControlLayout--fullWidth euiFormControlLayout--group"
+        class="euiFormControlLayout euiFormControlLayout--group emotion-euiFormControlLayout-fullWidth-group"
       >
-        <label
-          class="euiFormLabel euiFormControlLayout__prepend"
-          for="generated-id"
+        <div
+          class="euiFormControlLayout__prepend emotion-euiFormControlLayout__side-prepend"
         >
-          Every
-        </label>
+          <label
+            class="euiFormLabel emotion-euiFormLabel"
+            for="generated-id"
+          >
+            Every
+          </label>
+        </div>
         <div
-          class="euiFormControlLayout__childrenWrapper"
+          class="euiFormControlLayout__childrenWrapper emotion-euiFormControlLayout__childrenWrapper-inGroup-prependOnly"
           style="--euiFormControlRightIconsCount: 1;"
         >
           <select
@@ -679,10 +695,10 @@ Array [
             </option>
           </select>
           <div
-            class="euiFormControlLayoutIcons euiFormControlLayoutIcons--right euiFormControlLayoutIcons--absolute"
+            class="euiFormControlLayoutIcons emotion-euiFormControlLayoutIcons-absolute-right"
           >
             <span
-              class="euiFormControlLayoutCustomIcon"
+              class="euiFormControlLayoutCustomIcon emotion-euiFormControlLayoutCustomIcon"
             >
               <span
                 aria-hidden="true"
@@ -696,7 +712,7 @@ Array [
     </div>
   </div>,
   <div
-    class="euiFormRow euiFormRow--fullWidth euiFormRow--hasLabel"
+    class="euiFormRow euiFormRow--hasLabel emotion-euiFormRow-fullWidth"
     data-test-subj="cronFrequencyConfiguration"
     id="generated-id-row"
   >
@@ -704,7 +720,7 @@ Array [
       class="euiFormRow__labelWrapper"
     >
       <label
-        class="euiFormLabel euiFormRow__label"
+        class="euiFormLabel euiFormRow__label emotion-euiFormLabel"
         for="generated-id"
         id="generated-id-label"
       >
@@ -715,16 +731,20 @@ Array [
       class="euiFormRow__fieldWrapper"
     >
       <div
-        class="euiFormControlLayout euiFormControlLayout--fullWidth euiFormControlLayout--group"
+        class="euiFormControlLayout euiFormControlLayout--group emotion-euiFormControlLayout-fullWidth-group"
       >
-        <label
-          class="euiFormLabel euiFormControlLayout__prepend"
-          for="generated-id"
+        <div
+          class="euiFormControlLayout__prepend emotion-euiFormControlLayout__side-prepend"
         >
-          At
-        </label>
+          <label
+            class="euiFormLabel emotion-euiFormLabel"
+            for="generated-id"
+          >
+            At
+          </label>
+        </div>
         <div
-          class="euiFormControlLayout__childrenWrapper"
+          class="euiFormControlLayout__childrenWrapper emotion-euiFormControlLayout__childrenWrapper-inGroup-prependOnly"
           style="--euiFormControlRightIconsCount: 1;"
         >
           <select
@@ -1034,10 +1054,10 @@ Array [
             </option>
           </select>
           <div
-            class="euiFormControlLayoutIcons euiFormControlLayoutIcons--right euiFormControlLayoutIcons--absolute"
+            class="euiFormControlLayoutIcons emotion-euiFormControlLayoutIcons-absolute-right"
           >
             <span
-              class="euiFormControlLayoutCustomIcon"
+              class="euiFormControlLayoutCustomIcon emotion-euiFormControlLayoutCustomIcon"
             >
               <span
                 aria-hidden="true"
@@ -1055,14 +1075,14 @@ Array [
 
 exports[`CronEditor is rendered with a MINUTE frequency 1`] = `
 <div
-  class="euiFormRow euiFormRow--fullWidth euiFormRow--hasLabel"
+  class="euiFormRow euiFormRow--hasLabel emotion-euiFormRow-fullWidth"
   id="generated-id-row"
 >
   <div
     class="euiFormRow__labelWrapper"
   >
     <label
-      class="euiFormLabel euiFormRow__label"
+      class="euiFormLabel euiFormRow__label emotion-euiFormLabel"
       for="generated-id"
       id="generated-id-label"
     >
@@ -1073,16 +1093,20 @@ exports[`CronEditor is rendered with a MINUTE frequency 1`] = `
     class="euiFormRow__fieldWrapper"
   >
     <div
-      class="euiFormControlLayout euiFormControlLayout--fullWidth euiFormControlLayout--group"
+      class="euiFormControlLayout euiFormControlLayout--group emotion-euiFormControlLayout-fullWidth-group"
     >
-      <label
-        class="euiFormLabel euiFormControlLayout__prepend"
-        for="generated-id"
+      <div
+        class="euiFormControlLayout__prepend emotion-euiFormControlLayout__side-prepend"
       >
-        Every
-      </label>
+        <label
+          class="euiFormLabel emotion-euiFormLabel"
+          for="generated-id"
+        >
+          Every
+        </label>
+      </div>
       <div
-        class="euiFormControlLayout__childrenWrapper"
+        class="euiFormControlLayout__childrenWrapper emotion-euiFormControlLayout__childrenWrapper-inGroup-prependOnly"
         style="--euiFormControlRightIconsCount: 1;"
       >
         <select
@@ -1122,10 +1146,10 @@ exports[`CronEditor is rendered with a MINUTE frequency 1`] = `
           </option>
         </select>
         <div
-          class="euiFormControlLayoutIcons euiFormControlLayoutIcons--right euiFormControlLayoutIcons--absolute"
+          class="euiFormControlLayoutIcons emotion-euiFormControlLayoutIcons-absolute-right"
         >
           <span
-            class="euiFormControlLayoutCustomIcon"
+            class="euiFormControlLayoutCustomIcon emotion-euiFormControlLayoutCustomIcon"
           >
             <span
               aria-hidden="true"
@@ -1143,14 +1167,14 @@ exports[`CronEditor is rendered with a MINUTE frequency 1`] = `
 exports[`CronEditor is rendered with a MONTH frequency 1`] = `
 Array [
   <div
-    class="euiFormRow euiFormRow--fullWidth euiFormRow--hasLabel"
+    class="euiFormRow euiFormRow--hasLabel emotion-euiFormRow-fullWidth"
     id="generated-id-row"
   >
     <div
       class="euiFormRow__labelWrapper"
     >
       <label
-        class="euiFormLabel euiFormRow__label"
+        class="euiFormLabel euiFormRow__label emotion-euiFormLabel"
         for="generated-id"
         id="generated-id-label"
       >
@@ -1161,16 +1185,20 @@ Array [
       class="euiFormRow__fieldWrapper"
     >
       <div
-        class="euiFormControlLayout euiFormControlLayout--fullWidth euiFormControlLayout--group"
+        class="euiFormControlLayout euiFormControlLayout--group emotion-euiFormControlLayout-fullWidth-group"
       >
-        <label
-          class="euiFormLabel euiFormControlLayout__prepend"
-          for="generated-id"
+        <div
+          class="euiFormControlLayout__prepend emotion-euiFormControlLayout__side-prepend"
         >
-          Every
-        </label>
+          <label
+            class="euiFormLabel emotion-euiFormLabel"
+            for="generated-id"
+          >
+            Every
+          </label>
+        </div>
         <div
-          class="euiFormControlLayout__childrenWrapper"
+          class="euiFormControlLayout__childrenWrapper emotion-euiFormControlLayout__childrenWrapper-inGroup-prependOnly"
           style="--euiFormControlRightIconsCount: 1;"
         >
           <select
@@ -1210,10 +1238,10 @@ Array [
             </option>
           </select>
           <div
-            class="euiFormControlLayoutIcons euiFormControlLayoutIcons--right euiFormControlLayoutIcons--absolute"
+            class="euiFormControlLayoutIcons emotion-euiFormControlLayoutIcons-absolute-right"
           >
             <span
-              class="euiFormControlLayoutCustomIcon"
+              class="euiFormControlLayoutCustomIcon emotion-euiFormControlLayoutCustomIcon"
             >
               <span
                 aria-hidden="true"
@@ -1227,7 +1255,7 @@ Array [
     </div>
   </div>,
   <div
-    class="euiFormRow euiFormRow--fullWidth euiFormRow--hasLabel"
+    class="euiFormRow euiFormRow--hasLabel emotion-euiFormRow-fullWidth"
     data-test-subj="cronFrequencyConfiguration"
     id="generated-id-row"
   >
@@ -1235,7 +1263,7 @@ Array [
       class="euiFormRow__labelWrapper"
     >
       <label
-        class="euiFormLabel euiFormRow__label"
+        class="euiFormLabel euiFormRow__label emotion-euiFormLabel"
         for="generated-id"
         id="generated-id-label"
       >
@@ -1246,16 +1274,20 @@ Array [
       class="euiFormRow__fieldWrapper"
     >
       <div
-        class="euiFormControlLayout euiFormControlLayout--fullWidth euiFormControlLayout--group"
+        class="euiFormControlLayout euiFormControlLayout--group emotion-euiFormControlLayout-fullWidth-group"
       >
-        <label
-          class="euiFormLabel euiFormControlLayout__prepend"
-          for="generated-id"
+        <div
+          class="euiFormControlLayout__prepend emotion-euiFormControlLayout__side-prepend"
         >
-          On the
-        </label>
+          <label
+            class="euiFormLabel emotion-euiFormLabel"
+            for="generated-id"
+          >
+            On the
+          </label>
+        </div>
         <div
-          class="euiFormControlLayout__childrenWrapper"
+          class="euiFormControlLayout__childrenWrapper emotion-euiFormControlLayout__childrenWrapper-inGroup-prependOnly"
           style="--euiFormControlRightIconsCount: 1;"
         >
           <select
@@ -1420,10 +1452,10 @@ Array [
             </option>
           </select>
           <div
-            class="euiFormControlLayoutIcons euiFormControlLayoutIcons--right euiFormControlLayoutIcons--absolute"
+            class="euiFormControlLayoutIcons emotion-euiFormControlLayoutIcons-absolute-right"
           >
             <span
-              class="euiFormControlLayoutCustomIcon"
+              class="euiFormControlLayoutCustomIcon emotion-euiFormControlLayoutCustomIcon"
             >
               <span
                 aria-hidden="true"
@@ -1437,7 +1469,7 @@ Array [
     </div>
   </div>,
   <div
-    class="euiFormRow euiFormRow--fullWidth euiFormRow--hasLabel"
+    class="euiFormRow euiFormRow--hasLabel emotion-euiFormRow-fullWidth"
     data-test-subj="cronFrequencyConfiguration"
     id="generated-id-row"
   >
@@ -1445,7 +1477,7 @@ Array [
       class="euiFormRow__labelWrapper"
     >
       <label
-        class="euiFormLabel euiFormRow__label"
+        class="euiFormLabel euiFormRow__label emotion-euiFormLabel"
         for="generated-id"
         id="generated-id-label"
       >
@@ -1463,15 +1495,19 @@ Array [
           class="euiFlexItem emotion-euiFlexItem-growZero"
         >
           <div
-            class="euiFormControlLayout euiFormControlLayout--fullWidth euiFormControlLayout--group"
+            class="euiFormControlLayout euiFormControlLayout--group emotion-euiFormControlLayout-fullWidth-group"
           >
-            <label
-              class="euiFormLabel euiFormControlLayout__prepend"
+            <div
+              class="euiFormControlLayout__prepend emotion-euiFormControlLayout__side-prepend"
             >
-              At
-            </label>
+              <label
+                class="euiFormLabel emotion-euiFormLabel"
+              >
+                At
+              </label>
+            </div>
             <div
-              class="euiFormControlLayout__childrenWrapper"
+              class="euiFormControlLayout__childrenWrapper emotion-euiFormControlLayout__childrenWrapper-inGroup-prependOnly"
               style="--euiFormControlRightIconsCount: 1;"
             >
               <select
@@ -1601,10 +1637,10 @@ Array [
                 </option>
               </select>
               <div
-                class="euiFormControlLayoutIcons euiFormControlLayoutIcons--right euiFormControlLayoutIcons--absolute"
+                class="euiFormControlLayoutIcons emotion-euiFormControlLayoutIcons-absolute-right"
               >
                 <span
-                  class="euiFormControlLayoutCustomIcon"
+                  class="euiFormControlLayoutCustomIcon emotion-euiFormControlLayoutCustomIcon"
                 >
                   <span
                     aria-hidden="true"
@@ -1620,15 +1656,19 @@ Array [
           class="euiFlexItem emotion-euiFlexItem-grow-1"
         >
           <div
-            class="euiFormControlLayout euiFormControlLayout--fullWidth euiFormControlLayout--group"
+            class="euiFormControlLayout euiFormControlLayout--group emotion-euiFormControlLayout-fullWidth-group"
           >
-            <label
-              class="euiFormLabel euiFormControlLayout__prepend"
+            <div
+              class="euiFormControlLayout__prepend emotion-euiFormControlLayout__side-prepend"
             >
-              :
-            </label>
+              <label
+                class="euiFormLabel emotion-euiFormLabel"
+              >
+                :
+              </label>
+            </div>
             <div
-              class="euiFormControlLayout__childrenWrapper"
+              class="euiFormControlLayout__childrenWrapper emotion-euiFormControlLayout__childrenWrapper-inGroup-prependOnly"
               style="--euiFormControlRightIconsCount: 1;"
             >
               <select
@@ -1938,10 +1978,10 @@ Array [
                 </option>
               </select>
               <div
-                class="euiFormControlLayoutIcons euiFormControlLayoutIcons--right euiFormControlLayoutIcons--absolute"
+                class="euiFormControlLayoutIcons emotion-euiFormControlLayoutIcons-absolute-right"
               >
                 <span
-                  class="euiFormControlLayoutCustomIcon"
+                  class="euiFormControlLayoutCustomIcon emotion-euiFormControlLayoutCustomIcon"
                 >
                   <span
                     aria-hidden="true"
@@ -1962,14 +2002,14 @@ Array [
 exports[`CronEditor is rendered with a WEEK frequency 1`] = `
 Array [
   <div
-    class="euiFormRow euiFormRow--fullWidth euiFormRow--hasLabel"
+    class="euiFormRow euiFormRow--hasLabel emotion-euiFormRow-fullWidth"
     id="generated-id-row"
   >
     <div
       class="euiFormRow__labelWrapper"
     >
       <label
-        class="euiFormLabel euiFormRow__label"
+        class="euiFormLabel euiFormRow__label emotion-euiFormLabel"
         for="generated-id"
         id="generated-id-label"
       >
@@ -1980,16 +2020,20 @@ Array [
       class="euiFormRow__fieldWrapper"
     >
       <div
-        class="euiFormControlLayout euiFormControlLayout--fullWidth euiFormControlLayout--group"
+        class="euiFormControlLayout euiFormControlLayout--group emotion-euiFormControlLayout-fullWidth-group"
       >
-        <label
-          class="euiFormLabel euiFormControlLayout__prepend"
-          for="generated-id"
+        <div
+          class="euiFormControlLayout__prepend emotion-euiFormControlLayout__side-prepend"
         >
-          Every
-        </label>
+          <label
+            class="euiFormLabel emotion-euiFormLabel"
+            for="generated-id"
+          >
+            Every
+          </label>
+        </div>
         <div
-          class="euiFormControlLayout__childrenWrapper"
+          class="euiFormControlLayout__childrenWrapper emotion-euiFormControlLayout__childrenWrapper-inGroup-prependOnly"
           style="--euiFormControlRightIconsCount: 1;"
         >
           <select
@@ -2029,10 +2073,10 @@ Array [
             </option>
           </select>
           <div
-            class="euiFormControlLayoutIcons euiFormControlLayoutIcons--right euiFormControlLayoutIcons--absolute"
+            class="euiFormControlLayoutIcons emotion-euiFormControlLayoutIcons-absolute-right"
           >
             <span
-              class="euiFormControlLayoutCustomIcon"
+              class="euiFormControlLayoutCustomIcon emotion-euiFormControlLayoutCustomIcon"
             >
               <span
                 aria-hidden="true"
@@ -2046,7 +2090,7 @@ Array [
     </div>
   </div>,
   <div
-    class="euiFormRow euiFormRow--fullWidth euiFormRow--hasLabel"
+    class="euiFormRow euiFormRow--hasLabel emotion-euiFormRow-fullWidth"
     data-test-subj="cronFrequencyConfiguration"
     id="generated-id-row"
   >
@@ -2054,7 +2098,7 @@ Array [
       class="euiFormRow__labelWrapper"
     >
       <label
-        class="euiFormLabel euiFormRow__label"
+        class="euiFormLabel euiFormRow__label emotion-euiFormLabel"
         for="generated-id"
         id="generated-id-label"
       >
@@ -2065,16 +2109,20 @@ Array [
       class="euiFormRow__fieldWrapper"
     >
       <div
-        class="euiFormControlLayout euiFormControlLayout--fullWidth euiFormControlLayout--group"
+        class="euiFormControlLayout euiFormControlLayout--group emotion-euiFormControlLayout-fullWidth-group"
       >
-        <label
-          class="euiFormLabel euiFormControlLayout__prepend"
-          for="generated-id"
+        <div
+          class="euiFormControlLayout__prepend emotion-euiFormControlLayout__side-prepend"
         >
-          On
-        </label>
+          <label
+            class="euiFormLabel emotion-euiFormLabel"
+            for="generated-id"
+          >
+            On
+          </label>
+        </div>
         <div
-          class="euiFormControlLayout__childrenWrapper"
+          class="euiFormControlLayout__childrenWrapper emotion-euiFormControlLayout__childrenWrapper-inGroup-prependOnly"
           style="--euiFormControlRightIconsCount: 1;"
         >
           <select
@@ -2119,10 +2167,10 @@ Array [
             </option>
           </select>
           <div
-            class="euiFormControlLayoutIcons euiFormControlLayoutIcons--right euiFormControlLayoutIcons--absolute"
+            class="euiFormControlLayoutIcons emotion-euiFormControlLayoutIcons-absolute-right"
           >
             <span
-              class="euiFormControlLayoutCustomIcon"
+              class="euiFormControlLayoutCustomIcon emotion-euiFormControlLayoutCustomIcon"
             >
               <span
                 aria-hidden="true"
@@ -2136,7 +2184,7 @@ Array [
     </div>
   </div>,
   <div
-    class="euiFormRow euiFormRow--fullWidth euiFormRow--hasLabel"
+    class="euiFormRow euiFormRow--hasLabel emotion-euiFormRow-fullWidth"
     data-test-subj="cronFrequencyConfiguration"
     id="generated-id-row"
   >
@@ -2144,7 +2192,7 @@ Array [
       class="euiFormRow__labelWrapper"
     >
       <label
-        class="euiFormLabel euiFormRow__label"
+        class="euiFormLabel euiFormRow__label emotion-euiFormLabel"
         for="generated-id"
         id="generated-id-label"
       >
@@ -2162,15 +2210,19 @@ Array [
           class="euiFlexItem emotion-euiFlexItem-growZero"
         >
           <div
-            class="euiFormControlLayout euiFormControlLayout--fullWidth euiFormControlLayout--group"
+            class="euiFormControlLayout euiFormControlLayout--group emotion-euiFormControlLayout-fullWidth-group"
           >
-            <label
-              class="euiFormLabel euiFormControlLayout__prepend"
+            <div
+              class="euiFormControlLayout__prepend emotion-euiFormControlLayout__side-prepend"
             >
-              At
-            </label>
+              <label
+                class="euiFormLabel emotion-euiFormLabel"
+              >
+                At
+              </label>
+            </div>
             <div
-              class="euiFormControlLayout__childrenWrapper"
+              class="euiFormControlLayout__childrenWrapper emotion-euiFormControlLayout__childrenWrapper-inGroup-prependOnly"
               style="--euiFormControlRightIconsCount: 1;"
             >
               <select
@@ -2300,10 +2352,10 @@ Array [
                 </option>
               </select>
               <div
-                class="euiFormControlLayoutIcons euiFormControlLayoutIcons--right euiFormControlLayoutIcons--absolute"
+                class="euiFormControlLayoutIcons emotion-euiFormControlLayoutIcons-absolute-right"
               >
                 <span
-                  class="euiFormControlLayoutCustomIcon"
+                  class="euiFormControlLayoutCustomIcon emotion-euiFormControlLayoutCustomIcon"
                 >
                   <span
                     aria-hidden="true"
@@ -2319,15 +2371,19 @@ Array [
           class="euiFlexItem emotion-euiFlexItem-grow-1"
         >
           <div
-            class="euiFormControlLayout euiFormControlLayout--fullWidth euiFormControlLayout--group"
+            class="euiFormControlLayout euiFormControlLayout--group emotion-euiFormControlLayout-fullWidth-group"
           >
-            <label
-              class="euiFormLabel euiFormControlLayout__prepend"
+            <div
+              class="euiFormControlLayout__prepend emotion-euiFormControlLayout__side-prepend"
             >
-              :
-            </label>
+              <label
+                class="euiFormLabel emotion-euiFormLabel"
+              >
+                :
+              </label>
+            </div>
             <div
-              class="euiFormControlLayout__childrenWrapper"
+              class="euiFormControlLayout__childrenWrapper emotion-euiFormControlLayout__childrenWrapper-inGroup-prependOnly"
               style="--euiFormControlRightIconsCount: 1;"
             >
               <select
@@ -2637,10 +2693,10 @@ Array [
                 </option>
               </select>
               <div
-                class="euiFormControlLayoutIcons euiFormControlLayoutIcons--right euiFormControlLayoutIcons--absolute"
+                class="euiFormControlLayoutIcons emotion-euiFormControlLayoutIcons-absolute-right"
               >
                 <span
-                  class="euiFormControlLayoutCustomIcon"
+                  class="euiFormControlLayoutCustomIcon emotion-euiFormControlLayoutCustomIcon"
                 >
                   <span
                     aria-hidden="true"
@@ -2661,14 +2717,14 @@ Array [
 exports[`CronEditor is rendered with a YEAR frequency 1`] = `
 Array [
   <div
-    class="euiFormRow euiFormRow--fullWidth euiFormRow--hasLabel"
+    class="euiFormRow euiFormRow--hasLabel emotion-euiFormRow-fullWidth"
     id="generated-id-row"
   >
     <div
       class="euiFormRow__labelWrapper"
     >
       <label
-        class="euiFormLabel euiFormRow__label"
+        class="euiFormLabel euiFormRow__label emotion-euiFormLabel"
         for="generated-id"
         id="generated-id-label"
       >
@@ -2679,16 +2735,20 @@ Array [
       class="euiFormRow__fieldWrapper"
     >
       <div
-        class="euiFormControlLayout euiFormControlLayout--fullWidth euiFormControlLayout--group"
+        class="euiFormControlLayout euiFormControlLayout--group emotion-euiFormControlLayout-fullWidth-group"
       >
-        <label
-          class="euiFormLabel euiFormControlLayout__prepend"
-          for="generated-id"
+        <div
+          class="euiFormControlLayout__prepend emotion-euiFormControlLayout__side-prepend"
         >
-          Every
-        </label>
+          <label
+            class="euiFormLabel emotion-euiFormLabel"
+            for="generated-id"
+          >
+            Every
+          </label>
+        </div>
         <div
-          class="euiFormControlLayout__childrenWrapper"
+          class="euiFormControlLayout__childrenWrapper emotion-euiFormControlLayout__childrenWrapper-inGroup-prependOnly"
           style="--euiFormControlRightIconsCount: 1;"
         >
           <select
@@ -2728,10 +2788,10 @@ Array [
             </option>
           </select>
           <div
-            class="euiFormControlLayoutIcons euiFormControlLayoutIcons--right euiFormControlLayoutIcons--absolute"
+            class="euiFormControlLayoutIcons emotion-euiFormControlLayoutIcons-absolute-right"
           >
             <span
-              class="euiFormControlLayoutCustomIcon"
+              class="euiFormControlLayoutCustomIcon emotion-euiFormControlLayoutCustomIcon"
             >
               <span
                 aria-hidden="true"
@@ -2745,7 +2805,7 @@ Array [
     </div>
   </div>,
   <div
-    class="euiFormRow euiFormRow--fullWidth euiFormRow--hasLabel"
+    class="euiFormRow euiFormRow--hasLabel emotion-euiFormRow-fullWidth"
     data-test-subj="cronFrequencyConfiguration"
     id="generated-id-row"
   >
@@ -2753,7 +2813,7 @@ Array [
       class="euiFormRow__labelWrapper"
     >
       <label
-        class="euiFormLabel euiFormRow__label"
+        class="euiFormLabel euiFormRow__label emotion-euiFormLabel"
         for="generated-id"
         id="generated-id-label"
       >
@@ -2764,16 +2824,20 @@ Array [
       class="euiFormRow__fieldWrapper"
     >
       <div
-        class="euiFormControlLayout euiFormControlLayout--fullWidth euiFormControlLayout--group"
+        class="euiFormControlLayout euiFormControlLayout--group emotion-euiFormControlLayout-fullWidth-group"
       >
-        <label
-          class="euiFormLabel euiFormControlLayout__prepend"
-          for="generated-id"
+        <div
+          class="euiFormControlLayout__prepend emotion-euiFormControlLayout__side-prepend"
         >
-          In
-        </label>
+          <label
+            class="euiFormLabel emotion-euiFormLabel"
+            for="generated-id"
+          >
+            In
+          </label>
+        </div>
         <div
-          class="euiFormControlLayout__childrenWrapper"
+          class="euiFormControlLayout__childrenWrapper emotion-euiFormControlLayout__childrenWrapper-inGroup-prependOnly"
           style="--euiFormControlRightIconsCount: 1;"
         >
           <select
@@ -2843,10 +2907,10 @@ Array [
             </option>
           </select>
           <div
-            class="euiFormControlLayoutIcons euiFormControlLayoutIcons--right euiFormControlLayoutIcons--absolute"
+            class="euiFormControlLayoutIcons emotion-euiFormControlLayoutIcons-absolute-right"
           >
             <span
-              class="euiFormControlLayoutCustomIcon"
+              class="euiFormControlLayoutCustomIcon emotion-euiFormControlLayoutCustomIcon"
             >
               <span
                 aria-hidden="true"
@@ -2860,7 +2924,7 @@ Array [
     </div>
   </div>,
   <div
-    class="euiFormRow euiFormRow--fullWidth euiFormRow--hasLabel"
+    class="euiFormRow euiFormRow--hasLabel emotion-euiFormRow-fullWidth"
     data-test-subj="cronFrequencyConfiguration"
     id="generated-id-row"
   >
@@ -2868,7 +2932,7 @@ Array [
       class="euiFormRow__labelWrapper"
     >
       <label
-        class="euiFormLabel euiFormRow__label"
+        class="euiFormLabel euiFormRow__label emotion-euiFormLabel"
         for="generated-id"
         id="generated-id-label"
       >
@@ -2879,16 +2943,20 @@ Array [
       class="euiFormRow__fieldWrapper"
     >
       <div
-        class="euiFormControlLayout euiFormControlLayout--fullWidth euiFormControlLayout--group"
+        class="euiFormControlLayout euiFormControlLayout--group emotion-euiFormControlLayout-fullWidth-group"
       >
-        <label
-          class="euiFormLabel euiFormControlLayout__prepend"
-          for="generated-id"
+        <div
+          class="euiFormControlLayout__prepend emotion-euiFormControlLayout__side-prepend"
         >
-          On the
-        </label>
+          <label
+            class="euiFormLabel emotion-euiFormLabel"
+            for="generated-id"
+          >
+            On the
+          </label>
+        </div>
         <div
-          class="euiFormControlLayout__childrenWrapper"
+          class="euiFormControlLayout__childrenWrapper emotion-euiFormControlLayout__childrenWrapper-inGroup-prependOnly"
           style="--euiFormControlRightIconsCount: 1;"
         >
           <select
@@ -3053,10 +3121,10 @@ Array [
             </option>
           </select>
           <div
-            class="euiFormControlLayoutIcons euiFormControlLayoutIcons--right euiFormControlLayoutIcons--absolute"
+            class="euiFormControlLayoutIcons emotion-euiFormControlLayoutIcons-absolute-right"
           >
             <span
-              class="euiFormControlLayoutCustomIcon"
+              class="euiFormControlLayoutCustomIcon emotion-euiFormControlLayoutCustomIcon"
             >
               <span
                 aria-hidden="true"
@@ -3070,7 +3138,7 @@ Array [
     </div>
   </div>,
   <div
-    class="euiFormRow euiFormRow--fullWidth euiFormRow--hasLabel"
+    class="euiFormRow euiFormRow--hasLabel emotion-euiFormRow-fullWidth"
     data-test-subj="cronFrequencyConfiguration"
     id="generated-id-row"
   >
@@ -3078,7 +3146,7 @@ Array [
       class="euiFormRow__labelWrapper"
     >
       <label
-        class="euiFormLabel euiFormRow__label"
+        class="euiFormLabel euiFormRow__label emotion-euiFormLabel"
         for="generated-id"
         id="generated-id-label"
       >
@@ -3096,15 +3164,19 @@ Array [
           class="euiFlexItem emotion-euiFlexItem-growZero"
         >
           <div
-            class="euiFormControlLayout euiFormControlLayout--fullWidth euiFormControlLayout--group"
+            class="euiFormControlLayout euiFormControlLayout--group emotion-euiFormControlLayout-fullWidth-group"
           >
-            <label
-              class="euiFormLabel euiFormControlLayout__prepend"
+            <div
+              class="euiFormControlLayout__prepend emotion-euiFormControlLayout__side-prepend"
             >
-              At
-            </label>
+              <label
+                class="euiFormLabel emotion-euiFormLabel"
+              >
+                At
+              </label>
+            </div>
             <div
-              class="euiFormControlLayout__childrenWrapper"
+              class="euiFormControlLayout__childrenWrapper emotion-euiFormControlLayout__childrenWrapper-inGroup-prependOnly"
               style="--euiFormControlRightIconsCount: 1;"
             >
               <select
@@ -3234,10 +3306,10 @@ Array [
                 </option>
               </select>
               <div
-                class="euiFormControlLayoutIcons euiFormControlLayoutIcons--right euiFormControlLayoutIcons--absolute"
+                class="euiFormControlLayoutIcons emotion-euiFormControlLayoutIcons-absolute-right"
               >
                 <span
-                  class="euiFormControlLayoutCustomIcon"
+                  class="euiFormControlLayoutCustomIcon emotion-euiFormControlLayoutCustomIcon"
                 >
                   <span
                     aria-hidden="true"
@@ -3253,15 +3325,19 @@ Array [
           class="euiFlexItem emotion-euiFlexItem-grow-1"
         >
           <div
-            class="euiFormControlLayout euiFormControlLayout--fullWidth euiFormControlLayout--group"
+            class="euiFormControlLayout euiFormControlLayout--group emotion-euiFormControlLayout-fullWidth-group"
           >
-            <label
-              class="euiFormLabel euiFormControlLayout__prepend"
+            <div
+              class="euiFormControlLayout__prepend emotion-euiFormControlLayout__side-prepend"
             >
-              :
-            </label>
+              <label
+                class="euiFormLabel emotion-euiFormLabel"
+              >
+                :
+              </label>
+            </div>
             <div
-              class="euiFormControlLayout__childrenWrapper"
+              class="euiFormControlLayout__childrenWrapper emotion-euiFormControlLayout__childrenWrapper-inGroup-prependOnly"
               style="--euiFormControlRightIconsCount: 1;"
             >
               <select
@@ -3571,10 +3647,10 @@ Array [
                 </option>
               </select>
               <div
-                class="euiFormControlLayoutIcons euiFormControlLayoutIcons--right euiFormControlLayoutIcons--absolute"
+                class="euiFormControlLayoutIcons emotion-euiFormControlLayoutIcons-absolute-right"
               >
                 <span
-                  class="euiFormControlLayoutCustomIcon"
+                  class="euiFormControlLayoutCustomIcon emotion-euiFormControlLayoutCustomIcon"
                 >
                   <span
                     aria-hidden="true"
diff --git a/src/plugins/home/public/application/components/tutorial/__snapshots__/tutorial.test.js.snap b/src/plugins/home/public/application/components/tutorial/__snapshots__/tutorial.test.js.snap
index 2715a031d446b..2bee09cfbb70e 100644
--- a/src/plugins/home/public/application/components/tutorial/__snapshots__/tutorial.test.js.snap
+++ b/src/plugins/home/public/application/components/tutorial/__snapshots__/tutorial.test.js.snap
@@ -62,13 +62,7 @@ exports[`isCloudEnabled is false should render ON_PREM instructions with instruc
         title="jest test tutorial"
       />
       <EuiSpacer />
-      <EuiFormRow
-        describedByIds={Array []}
-        display="row"
-        hasChildLabel={true}
-        hasEmptyLabelSpace={false}
-        labelType="label"
-      >
+      <EuiFormRow>
         <EuiButtonGroup
           buttonSize="m"
           color="text"
diff --git a/src/plugins/input_control_vis/public/components/editor/__snapshots__/controls_tab.test.tsx.snap b/src/plugins/input_control_vis/public/components/editor/__snapshots__/controls_tab.test.tsx.snap
index 7e76713e5e7a6..be7aa0b09d57a 100644
--- a/src/plugins/input_control_vis/public/components/editor/__snapshots__/controls_tab.test.tsx.snap
+++ b/src/plugins/input_control_vis/public/components/editor/__snapshots__/controls_tab.test.tsx.snap
@@ -129,12 +129,7 @@ exports[`renders ControlsTab 1`] = `
     <EuiFlexGroup>
       <EuiFlexItem>
         <EuiFormRow
-          describedByIds={Array []}
-          display="row"
-          hasChildLabel={true}
-          hasEmptyLabelSpace={false}
           id="selectControlType"
-          labelType="label"
         >
           <EuiSelect
             aria-label="Select control type"
@@ -160,12 +155,7 @@ exports[`renders ControlsTab 1`] = `
         grow={false}
       >
         <EuiFormRow
-          describedByIds={Array []}
-          display="row"
-          hasChildLabel={true}
-          hasEmptyLabelSpace={false}
           id="addControl"
-          labelType="label"
         >
           <EuiButton
             aria-label="Add control"
diff --git a/src/plugins/input_control_vis/public/components/editor/__snapshots__/list_control_editor.test.tsx.snap b/src/plugins/input_control_vis/public/components/editor/__snapshots__/list_control_editor.test.tsx.snap
index d9c0dc1715b1e..c904ef3259f6c 100644
--- a/src/plugins/input_control_vis/public/components/editor/__snapshots__/list_control_editor.test.tsx.snap
+++ b/src/plugins/input_control_vis/public/components/editor/__snapshots__/list_control_editor.test.tsx.snap
@@ -17,10 +17,6 @@ exports[`renders dynamic options should display disabled dynamic options with to
     onChange={[Function]}
   />
   <EuiFormRow
-    describedByIds={Array []}
-    display="row"
-    hasChildLabel={true}
-    hasEmptyLabelSpace={false}
     helpText={
       <Memo(MemoizedFormattedMessage)
         defaultMessage="Allow multiple selection"
@@ -29,7 +25,6 @@ exports[`renders dynamic options should display disabled dynamic options with to
     }
     id="multiselect-0"
     key="multiselect"
-    labelType="label"
   >
     <EuiSwitch
       checked={true}
@@ -44,10 +39,6 @@ exports[`renders dynamic options should display disabled dynamic options with to
     />
   </EuiFormRow>
   <EuiFormRow
-    describedByIds={Array []}
-    display="row"
-    hasChildLabel={true}
-    hasEmptyLabelSpace={false}
     helpText={
       <Memo(MemoizedFormattedMessage)
         defaultMessage="Only available for \\"string\\" fields"
@@ -56,7 +47,6 @@ exports[`renders dynamic options should display disabled dynamic options with to
     }
     id="dynamicOptions-0"
     key="dynamicOptions"
-    labelType="label"
   >
     <EuiSwitch
       checked={true}
@@ -72,10 +62,6 @@ exports[`renders dynamic options should display disabled dynamic options with to
     />
   </EuiFormRow>
   <EuiFormRow
-    describedByIds={Array []}
-    display="row"
-    hasChildLabel={true}
-    hasEmptyLabelSpace={false}
     helpText={
       <Memo(MemoizedFormattedMessage)
         defaultMessage="Number of options"
@@ -90,7 +76,6 @@ exports[`renders dynamic options should display disabled dynamic options with to
         id="inputControl.editor.listControl.sizeLabel"
       />
     }
-    labelType="label"
   >
     <EuiFieldNumber
       data-test-subj="listControlSizeInput"
@@ -119,10 +104,6 @@ exports[`renders dynamic options should display dynamic options for string field
     onChange={[Function]}
   />
   <EuiFormRow
-    describedByIds={Array []}
-    display="row"
-    hasChildLabel={true}
-    hasEmptyLabelSpace={false}
     helpText={
       <Memo(MemoizedFormattedMessage)
         defaultMessage="Allow multiple selection"
@@ -131,7 +112,6 @@ exports[`renders dynamic options should display dynamic options for string field
     }
     id="multiselect-0"
     key="multiselect"
-    labelType="label"
   >
     <EuiSwitch
       checked={true}
@@ -146,10 +126,6 @@ exports[`renders dynamic options should display dynamic options for string field
     />
   </EuiFormRow>
   <EuiFormRow
-    describedByIds={Array []}
-    display="row"
-    hasChildLabel={true}
-    hasEmptyLabelSpace={false}
     helpText={
       <Memo(MemoizedFormattedMessage)
         defaultMessage="Update options in response to user input"
@@ -158,7 +134,6 @@ exports[`renders dynamic options should display dynamic options for string field
     }
     id="dynamicOptions-0"
     key="dynamicOptions"
-    labelType="label"
   >
     <EuiSwitch
       checked={true}
@@ -193,10 +168,6 @@ exports[`renders dynamic options should display size field when dynamic options
     onChange={[Function]}
   />
   <EuiFormRow
-    describedByIds={Array []}
-    display="row"
-    hasChildLabel={true}
-    hasEmptyLabelSpace={false}
     helpText={
       <Memo(MemoizedFormattedMessage)
         defaultMessage="Allow multiple selection"
@@ -205,7 +176,6 @@ exports[`renders dynamic options should display size field when dynamic options
     }
     id="multiselect-0"
     key="multiselect"
-    labelType="label"
   >
     <EuiSwitch
       checked={true}
@@ -220,10 +190,6 @@ exports[`renders dynamic options should display size field when dynamic options
     />
   </EuiFormRow>
   <EuiFormRow
-    describedByIds={Array []}
-    display="row"
-    hasChildLabel={true}
-    hasEmptyLabelSpace={false}
     helpText={
       <Memo(MemoizedFormattedMessage)
         defaultMessage="Update options in response to user input"
@@ -232,7 +198,6 @@ exports[`renders dynamic options should display size field when dynamic options
     }
     id="dynamicOptions-0"
     key="dynamicOptions"
-    labelType="label"
   >
     <EuiSwitch
       checked={false}
@@ -248,10 +213,6 @@ exports[`renders dynamic options should display size field when dynamic options
     />
   </EuiFormRow>
   <EuiFormRow
-    describedByIds={Array []}
-    display="row"
-    hasChildLabel={true}
-    hasEmptyLabelSpace={false}
     helpText={
       <Memo(MemoizedFormattedMessage)
         defaultMessage="Number of options"
@@ -266,7 +227,6 @@ exports[`renders dynamic options should display size field when dynamic options
         id="inputControl.editor.listControl.sizeLabel"
       />
     }
-    labelType="label"
   >
     <EuiFieldNumber
       data-test-subj="listControlSizeInput"
@@ -295,10 +255,6 @@ exports[`renders should display chaining input when parents are provided 1`] = `
     onChange={[Function]}
   />
   <EuiFormRow
-    describedByIds={Array []}
-    display="row"
-    hasChildLabel={true}
-    hasEmptyLabelSpace={false}
     helpText={
       <Memo(MemoizedFormattedMessage)
         defaultMessage="Options are based on the value of parent control. Disabled if parent is not set."
@@ -313,7 +269,6 @@ exports[`renders should display chaining input when parents are provided 1`] = `
         id="inputControl.editor.listControl.parentLabel"
       />
     }
-    labelType="label"
   >
     <EuiSelect
       onChange={[Function]}
@@ -337,10 +292,6 @@ exports[`renders should display chaining input when parents are provided 1`] = `
     />
   </EuiFormRow>
   <EuiFormRow
-    describedByIds={Array []}
-    display="row"
-    hasChildLabel={true}
-    hasEmptyLabelSpace={false}
     helpText={
       <Memo(MemoizedFormattedMessage)
         defaultMessage="Allow multiple selection"
@@ -349,7 +300,6 @@ exports[`renders should display chaining input when parents are provided 1`] = `
     }
     id="multiselect-0"
     key="multiselect"
-    labelType="label"
   >
     <EuiSwitch
       checked={true}
@@ -364,10 +314,6 @@ exports[`renders should display chaining input when parents are provided 1`] = `
     />
   </EuiFormRow>
   <EuiFormRow
-    describedByIds={Array []}
-    display="row"
-    hasChildLabel={true}
-    hasEmptyLabelSpace={false}
     helpText={
       <Memo(MemoizedFormattedMessage)
         defaultMessage="Update options in response to user input"
@@ -376,7 +322,6 @@ exports[`renders should display chaining input when parents are provided 1`] = `
     }
     id="dynamicOptions-0"
     key="dynamicOptions"
-    labelType="label"
   >
     <EuiSwitch
       checked={false}
@@ -392,10 +337,6 @@ exports[`renders should display chaining input when parents are provided 1`] = `
     />
   </EuiFormRow>
   <EuiFormRow
-    describedByIds={Array []}
-    display="row"
-    hasChildLabel={true}
-    hasEmptyLabelSpace={false}
     helpText={
       <Memo(MemoizedFormattedMessage)
         defaultMessage="Number of options"
@@ -410,7 +351,6 @@ exports[`renders should display chaining input when parents are provided 1`] = `
         id="inputControl.editor.listControl.sizeLabel"
       />
     }
-    labelType="label"
   >
     <EuiFieldNumber
       data-test-subj="listControlSizeInput"
diff --git a/src/plugins/input_control_vis/public/components/editor/__snapshots__/options_tab.test.tsx.snap b/src/plugins/input_control_vis/public/components/editor/__snapshots__/options_tab.test.tsx.snap
index e5dd74ebd28ca..eb57ced1b2116 100644
--- a/src/plugins/input_control_vis/public/components/editor/__snapshots__/options_tab.test.tsx.snap
+++ b/src/plugins/input_control_vis/public/components/editor/__snapshots__/options_tab.test.tsx.snap
@@ -3,12 +3,7 @@
 exports[`OptionsTab should renders OptionsTab 1`] = `
 <EuiForm>
   <EuiFormRow
-    describedByIds={Array []}
-    display="row"
-    hasChildLabel={true}
-    hasEmptyLabelSpace={false}
     id="updateFiltersOnChange"
-    labelType="label"
   >
     <EuiSwitch
       checked={false}
@@ -23,12 +18,7 @@ exports[`OptionsTab should renders OptionsTab 1`] = `
     />
   </EuiFormRow>
   <EuiFormRow
-    describedByIds={Array []}
-    display="row"
-    hasChildLabel={true}
-    hasEmptyLabelSpace={false}
     id="useTimeFilter"
-    labelType="label"
   >
     <EuiSwitch
       checked={false}
@@ -43,12 +33,7 @@ exports[`OptionsTab should renders OptionsTab 1`] = `
     />
   </EuiFormRow>
   <EuiFormRow
-    describedByIds={Array []}
-    display="row"
-    hasChildLabel={true}
-    hasEmptyLabelSpace={false}
     id="pinFilters"
-    labelType="label"
   >
     <EuiSwitch
       checked={false}
diff --git a/src/plugins/input_control_vis/public/components/editor/__snapshots__/range_control_editor.test.tsx.snap b/src/plugins/input_control_vis/public/components/editor/__snapshots__/range_control_editor.test.tsx.snap
index 0df9288c72be9..36cd89b71a43a 100644
--- a/src/plugins/input_control_vis/public/components/editor/__snapshots__/range_control_editor.test.tsx.snap
+++ b/src/plugins/input_control_vis/public/components/editor/__snapshots__/range_control_editor.test.tsx.snap
@@ -17,10 +17,6 @@ exports[`renders RangeControlEditor 1`] = `
     onChange={[Function]}
   />
   <EuiFormRow
-    describedByIds={Array []}
-    display="row"
-    hasChildLabel={true}
-    hasEmptyLabelSpace={false}
     id="stepSize-0"
     label={
       <Memo(MemoizedFormattedMessage)
@@ -28,7 +24,6 @@ exports[`renders RangeControlEditor 1`] = `
         id="inputControl.editor.rangeControl.stepSizeLabel"
       />
     }
-    labelType="label"
   >
     <EuiFieldNumber
       data-test-subj="rangeControlSizeInput0"
@@ -37,10 +32,6 @@ exports[`renders RangeControlEditor 1`] = `
     />
   </EuiFormRow>
   <EuiFormRow
-    describedByIds={Array []}
-    display="row"
-    hasChildLabel={true}
-    hasEmptyLabelSpace={false}
     id="decimalPlaces-0"
     label={
       <Memo(MemoizedFormattedMessage)
@@ -48,7 +39,6 @@ exports[`renders RangeControlEditor 1`] = `
         id="inputControl.editor.rangeControl.decimalPlacesLabel"
       />
     }
-    labelType="label"
   >
     <EuiFieldNumber
       data-test-subj="rangeControlDecimalPlacesInput0"
diff --git a/src/plugins/input_control_vis/public/components/vis/__snapshots__/form_row.test.tsx.snap b/src/plugins/input_control_vis/public/components/vis/__snapshots__/form_row.test.tsx.snap
index 950577cf806d2..5424c28c05001 100644
--- a/src/plugins/input_control_vis/public/components/vis/__snapshots__/form_row.test.tsx.snap
+++ b/src/plugins/input_control_vis/public/components/vis/__snapshots__/form_row.test.tsx.snap
@@ -3,10 +3,6 @@
 exports[`renders control with warning 1`] = `
 <EuiFormRow
   data-test-subj="inputControl0"
-  describedByIds={Array []}
-  display="row"
-  hasChildLabel={true}
-  hasEmptyLabelSpace={false}
   id="controlId"
   label={
     <React.Fragment>
@@ -23,7 +19,6 @@ exports[`renders control with warning 1`] = `
       test control
     </React.Fragment>
   }
-  labelType="label"
 >
   <div>
     My Control
@@ -34,13 +29,8 @@ exports[`renders control with warning 1`] = `
 exports[`renders disabled control with tooltip 1`] = `
 <EuiFormRow
   data-test-subj="inputControl0"
-  describedByIds={Array []}
-  display="row"
-  hasChildLabel={true}
-  hasEmptyLabelSpace={false}
   id="controlId"
   label="test control"
-  labelType="label"
 >
   <EuiToolTip
     anchorClassName="eui-displayBlock"
@@ -59,13 +49,8 @@ exports[`renders disabled control with tooltip 1`] = `
 exports[`renders enabled control 1`] = `
 <EuiFormRow
   data-test-subj="inputControl0"
-  describedByIds={Array []}
-  display="row"
-  hasChildLabel={true}
-  hasEmptyLabelSpace={false}
   id="controlId"
   label="test control"
-  labelType="label"
 >
   <div>
     My Control
diff --git a/src/plugins/interactive_setup/public/cluster_address_form.test.tsx b/src/plugins/interactive_setup/public/cluster_address_form.test.tsx
index a532a81deac34..422df0fd2224c 100644
--- a/src/plugins/interactive_setup/public/cluster_address_form.test.tsx
+++ b/src/plugins/interactive_setup/public/cluster_address_form.test.tsx
@@ -15,7 +15,7 @@ import { ClusterAddressForm } from './cluster_address_form';
 import { Providers } from './plugin';
 
 jest.mock('@elastic/eui/lib/services/accessibility/html_id_generator', () => ({
-  htmlIdGenerator: () => () => `id-${Math.random()}`,
+  useGeneratedHtmlId: () => `id-${Math.random()}`,
 }));
 
 describe('ClusterAddressForm', () => {
diff --git a/src/plugins/interactive_setup/public/cluster_configuration_form.test.tsx b/src/plugins/interactive_setup/public/cluster_configuration_form.test.tsx
index 01512cee06cf2..c66fc274899f9 100644
--- a/src/plugins/interactive_setup/public/cluster_configuration_form.test.tsx
+++ b/src/plugins/interactive_setup/public/cluster_configuration_form.test.tsx
@@ -16,6 +16,7 @@ import { Providers } from './plugin';
 
 jest.mock('@elastic/eui/lib/services/accessibility/html_id_generator', () => ({
   htmlIdGenerator: () => () => `id-${Math.random()}`,
+  useGeneratedHtmlId: () => `id-${Math.random()}`,
 }));
 
 describe('ClusterConfigurationForm', () => {
diff --git a/src/plugins/interactive_setup/public/enrollment_token_form.test.tsx b/src/plugins/interactive_setup/public/enrollment_token_form.test.tsx
index 025bfe2630b86..8a13dba3c98de 100644
--- a/src/plugins/interactive_setup/public/enrollment_token_form.test.tsx
+++ b/src/plugins/interactive_setup/public/enrollment_token_form.test.tsx
@@ -17,6 +17,7 @@ import type { EnrollmentToken } from '../common';
 
 jest.mock('@elastic/eui/lib/services/accessibility/html_id_generator', () => ({
   htmlIdGenerator: () => () => `id-${Math.random()}`,
+  useGeneratedHtmlId: () => `id-${Math.random()}`,
 }));
 
 const token: EnrollmentToken = {
diff --git a/src/plugins/interactive_setup/public/verification_code_form.test.tsx b/src/plugins/interactive_setup/public/verification_code_form.test.tsx
index c7329396c0cd1..0394cc3a0ec98 100644
--- a/src/plugins/interactive_setup/public/verification_code_form.test.tsx
+++ b/src/plugins/interactive_setup/public/verification_code_form.test.tsx
@@ -16,6 +16,7 @@ import { VerificationCodeForm } from './verification_code_form';
 
 jest.mock('@elastic/eui/lib/services/accessibility/html_id_generator', () => ({
   htmlIdGenerator: () => () => `id-${Math.random()}`,
+  useGeneratedHtmlId: () => `id-${Math.random()}`,
 }));
 
 describe('VerificationCodeForm', () => {
diff --git a/src/plugins/presentation_util/public/components/saved_object_save_modal_dashboard_selector.tsx b/src/plugins/presentation_util/public/components/saved_object_save_modal_dashboard_selector.tsx
index 8aca5a7965065..6b2b3f503f784 100644
--- a/src/plugins/presentation_util/public/components/saved_object_save_modal_dashboard_selector.tsx
+++ b/src/plugins/presentation_util/public/components/saved_object_save_modal_dashboard_selector.tsx
@@ -20,6 +20,7 @@ import {
   EuiPanel,
   EuiSpacer,
   EuiCheckbox,
+  EuiFormErrorText,
 } from '@elastic/eui';
 
 import DashboardPicker, { DashboardPickerProps } from './dashboard_picker/dashboard_picker';
@@ -86,14 +87,14 @@ export function SaveModalDashboardSelector(props: SaveModalDashboardSelectorProp
                     onChange={onSelectDashboard}
                   />
                   {hasAttemptedSubmit && dashboardOption === 'existing' && !hasSelectedDashboard ? (
-                    <div className="euiFormErrorText euiFormRow__text">
+                    <EuiFormErrorText>
                       {i18n.translate(
                         'presentationUtil.saveModalDashboard.existingDashboardRequiredMessage',
                         {
                           defaultMessage: 'Dashboard is required',
                         }
                       )}
-                    </div>
+                    </EuiFormErrorText>
                   ) : null}
                 </div>
                 <EuiSpacer size="s" />
diff --git a/src/plugins/saved_objects/public/save_modal/__snapshots__/saved_object_save_modal.test.tsx.snap b/src/plugins/saved_objects/public/save_modal/__snapshots__/saved_object_save_modal.test.tsx.snap
index bdd9bc2ba609d..9a26b9bfecc0e 100644
--- a/src/plugins/saved_objects/public/save_modal/__snapshots__/saved_object_save_modal.test.tsx.snap
+++ b/src/plugins/saved_objects/public/save_modal/__snapshots__/saved_object_save_modal.test.tsx.snap
@@ -26,12 +26,8 @@ exports[`SavedObjectSaveModal should render matching snapshot 1`] = `
       onSubmit={[Function]}
     >
       <EuiFormRow
-        describedByIds={Array []}
-        display="row"
         error="A title is required"
         fullWidth={true}
-        hasChildLabel={true}
-        hasEmptyLabelSpace={false}
         isInvalid={false}
         label={
           <Memo(MemoizedFormattedMessage)
@@ -39,7 +35,6 @@ exports[`SavedObjectSaveModal should render matching snapshot 1`] = `
             id="savedObjects.saveModal.titleLabel"
           />
         }
-        labelType="label"
       >
         <EuiFieldText
           data-test-subj="savedObjectTitle"
@@ -55,11 +50,7 @@ exports[`SavedObjectSaveModal should render matching snapshot 1`] = `
         />
       </EuiFormRow>
       <EuiFormRow
-        describedByIds={Array []}
-        display="row"
         fullWidth={true}
-        hasChildLabel={true}
-        hasEmptyLabelSpace={false}
         label={
           <Memo(MemoizedFormattedMessage)
             defaultMessage="Description"
@@ -77,7 +68,6 @@ exports[`SavedObjectSaveModal should render matching snapshot 1`] = `
             />
           </EuiText>
         }
-        labelType="label"
       >
         <EuiTextArea
           data-test-subj="savedObjectDescription"
@@ -150,12 +140,8 @@ exports[`SavedObjectSaveModal should render matching snapshot when custom isVali
       onSubmit={[Function]}
     >
       <EuiFormRow
-        describedByIds={Array []}
-        display="row"
         error="A title is required"
         fullWidth={true}
-        hasChildLabel={true}
-        hasEmptyLabelSpace={false}
         isInvalid={false}
         label={
           <Memo(MemoizedFormattedMessage)
@@ -163,7 +149,6 @@ exports[`SavedObjectSaveModal should render matching snapshot when custom isVali
             id="savedObjects.saveModal.titleLabel"
           />
         }
-        labelType="label"
       >
         <EuiFieldText
           data-test-subj="savedObjectTitle"
@@ -179,11 +164,7 @@ exports[`SavedObjectSaveModal should render matching snapshot when custom isVali
         />
       </EuiFormRow>
       <EuiFormRow
-        describedByIds={Array []}
-        display="row"
         fullWidth={true}
-        hasChildLabel={true}
-        hasEmptyLabelSpace={false}
         label={
           <Memo(MemoizedFormattedMessage)
             defaultMessage="Description"
@@ -201,7 +182,6 @@ exports[`SavedObjectSaveModal should render matching snapshot when custom isVali
             />
           </EuiText>
         }
-        labelType="label"
       >
         <EuiTextArea
           data-test-subj="savedObjectDescription"
@@ -274,12 +254,8 @@ exports[`SavedObjectSaveModal should render matching snapshot when custom isVali
       onSubmit={[Function]}
     >
       <EuiFormRow
-        describedByIds={Array []}
-        display="row"
         error="A title is required"
         fullWidth={true}
-        hasChildLabel={true}
-        hasEmptyLabelSpace={false}
         isInvalid={false}
         label={
           <Memo(MemoizedFormattedMessage)
@@ -287,7 +263,6 @@ exports[`SavedObjectSaveModal should render matching snapshot when custom isVali
             id="savedObjects.saveModal.titleLabel"
           />
         }
-        labelType="label"
       >
         <EuiFieldText
           data-test-subj="savedObjectTitle"
@@ -303,11 +278,7 @@ exports[`SavedObjectSaveModal should render matching snapshot when custom isVali
         />
       </EuiFormRow>
       <EuiFormRow
-        describedByIds={Array []}
-        display="row"
         fullWidth={true}
-        hasChildLabel={true}
-        hasEmptyLabelSpace={false}
         label={
           <Memo(MemoizedFormattedMessage)
             defaultMessage="Description"
@@ -325,7 +296,6 @@ exports[`SavedObjectSaveModal should render matching snapshot when custom isVali
             />
           </EuiText>
         }
-        labelType="label"
       >
         <EuiTextArea
           data-test-subj="savedObjectDescription"
@@ -402,12 +372,8 @@ exports[`SavedObjectSaveModal should render matching snapshot when given options
       >
         <EuiFlexItem>
           <EuiFormRow
-            describedByIds={Array []}
-            display="row"
             error="A title is required"
             fullWidth={true}
-            hasChildLabel={true}
-            hasEmptyLabelSpace={false}
             isInvalid={false}
             label={
               <Memo(MemoizedFormattedMessage)
@@ -415,7 +381,6 @@ exports[`SavedObjectSaveModal should render matching snapshot when given options
                 id="savedObjects.saveModal.titleLabel"
               />
             }
-            labelType="label"
           >
             <EuiFieldText
               data-test-subj="savedObjectTitle"
@@ -431,11 +396,7 @@ exports[`SavedObjectSaveModal should render matching snapshot when given options
             />
           </EuiFormRow>
           <EuiFormRow
-            describedByIds={Array []}
-            display="row"
             fullWidth={true}
-            hasChildLabel={true}
-            hasEmptyLabelSpace={false}
             label={
               <Memo(MemoizedFormattedMessage)
                 defaultMessage="Description"
@@ -453,7 +414,6 @@ exports[`SavedObjectSaveModal should render matching snapshot when given options
                 />
               </EuiText>
             }
-            labelType="label"
           >
             <EuiTextArea
               data-test-subj="savedObjectDescription"
diff --git a/src/plugins/saved_objects_management/public/management_section/objects_table/components/__snapshots__/flyout.test.tsx.snap b/src/plugins/saved_objects_management/public/management_section/objects_table/components/__snapshots__/flyout.test.tsx.snap
index 6f30a6715f023..af21429a9f7bb 100644
--- a/src/plugins/saved_objects_management/public/management_section/objects_table/components/__snapshots__/flyout.test.tsx.snap
+++ b/src/plugins/saved_objects_management/public/management_section/objects_table/components/__snapshots__/flyout.test.tsx.snap
@@ -295,11 +295,7 @@ exports[`Flyout should render import step 1`] = `
   <EuiFlyoutBody>
     <EuiForm>
       <EuiFormRow
-        describedByIds={Array []}
-        display="row"
         fullWidth={true}
-        hasChildLabel={true}
-        hasEmptyLabelSpace={false}
         label={
           <EuiTitle
             size="xs"
@@ -312,7 +308,6 @@ exports[`Flyout should render import step 1`] = `
             </span>
           </EuiTitle>
         }
-        labelType="label"
       >
         <EuiFilePickerClass
           accept=".ndjson"
@@ -327,12 +322,7 @@ exports[`Flyout should render import step 1`] = `
         />
       </EuiFormRow>
       <EuiFormRow
-        describedByIds={Array []}
-        display="row"
         fullWidth={true}
-        hasChildLabel={true}
-        hasEmptyLabelSpace={false}
-        labelType="label"
       >
         <ImportModeControl
           initialValues={
diff --git a/src/plugins/saved_objects_management/public/management_section/objects_table/components/__snapshots__/table.test.tsx.snap b/src/plugins/saved_objects_management/public/management_section/objects_table/components/__snapshots__/table.test.tsx.snap
index 817c6ba6e23a7..7e88de9674cc4 100644
--- a/src/plugins/saved_objects_management/public/management_section/objects_table/components/__snapshots__/table.test.tsx.snap
+++ b/src/plugins/saved_objects_management/public/management_section/objects_table/components/__snapshots__/table.test.tsx.snap
@@ -75,17 +75,12 @@ exports[`Table prevents hidden saved objects from being deleted 1`] = `
           repositionToCrossAxis={true}
         >
           <EuiFormRow
-            describedByIds={Array []}
-            display="row"
-            hasChildLabel={true}
-            hasEmptyLabelSpace={false}
             label={
               <Memo(MemoizedFormattedMessage)
                 defaultMessage="Options"
                 id="savedObjectsManagement.objectsTable.exportObjectsConfirmModal.exportOptionsLabel"
               />
             }
-            labelType="label"
           >
             <EuiSwitch
               checked={true}
@@ -99,13 +94,7 @@ exports[`Table prevents hidden saved objects from being deleted 1`] = `
               onChange={[Function]}
             />
           </EuiFormRow>
-          <EuiFormRow
-            describedByIds={Array []}
-            display="row"
-            hasChildLabel={true}
-            hasEmptyLabelSpace={false}
-            labelType="label"
-          >
+          <EuiFormRow>
             <EuiButton
               fill={true}
               iconType="exportAction"
@@ -307,17 +296,12 @@ exports[`Table should render normally 1`] = `
           repositionToCrossAxis={true}
         >
           <EuiFormRow
-            describedByIds={Array []}
-            display="row"
-            hasChildLabel={true}
-            hasEmptyLabelSpace={false}
             label={
               <Memo(MemoizedFormattedMessage)
                 defaultMessage="Options"
                 id="savedObjectsManagement.objectsTable.exportObjectsConfirmModal.exportOptionsLabel"
               />
             }
-            labelType="label"
           >
             <EuiSwitch
               checked={true}
@@ -331,13 +315,7 @@ exports[`Table should render normally 1`] = `
               onChange={[Function]}
             />
           </EuiFormRow>
-          <EuiFormRow
-            describedByIds={Array []}
-            display="row"
-            hasChildLabel={true}
-            hasEmptyLabelSpace={false}
-            labelType="label"
-          >
+          <EuiFormRow>
             <EuiButton
               fill={true}
               iconType="exportAction"
diff --git a/src/plugins/unified_search/public/query_string_input/language_switcher.tsx b/src/plugins/unified_search/public/query_string_input/language_switcher.tsx
index 7d69bd0c7b6e5..d9968d6fa1223 100644
--- a/src/plugins/unified_search/public/query_string_input/language_switcher.tsx
+++ b/src/plugins/unified_search/public/query_string_input/language_switcher.tsx
@@ -56,7 +56,7 @@ export const QueryLanguageSwitcher = React.memo(function QueryLanguageSwitcher({
       size="m"
       iconType="filter"
       onClick={() => setIsPopoverOpen(!isPopoverOpen)}
-      className="euiFormControlLayout__append kqlQueryBar__languageSwitcherButton"
+      className="kqlQueryBar__languageSwitcherButton"
       data-test-subj={'switchQueryLanguageButton'}
       aria-label={strings.getSwitchLanguageButtonText()}
       disabled={isDisabled}
diff --git a/src/plugins/unified_search/public/query_string_input/query_string_input.tsx b/src/plugins/unified_search/public/query_string_input/query_string_input.tsx
index 2720a13b1ff06..ad789922a6a24 100644
--- a/src/plugins/unified_search/public/query_string_input/query_string_input.tsx
+++ b/src/plugins/unified_search/public/query_string_input/query_string_input.tsx
@@ -14,7 +14,7 @@ import {
   EuiButton,
   EuiFlexGroup,
   EuiFlexItem,
-  EuiIcon,
+  EuiFormControlLayoutIcons,
   EuiIconProps,
   EuiLink,
   EuiOutsideClickDetector,
@@ -851,32 +851,28 @@ export default class QueryStringInputUI extends PureComponent<QueryStringInputPr
               >
                 {this.forwardNewValueIfNeeded(this.getQueryString())}
               </EuiTextArea>
-              {/* EUI TODO: This will need to be fixed before the Emotion conversion */}
               {this.props.iconType ? (
-                <div className="euiFormControlLayoutIcons euiFormControlLayoutIcons--absolute euiFormControlLayoutIcons--left">
-                  <EuiIcon
-                    className="euiFormControlLayoutCustomIcon__icon"
-                    aria-hidden="true"
-                    type={this.props.iconType}
-                  />
-                </div>
+                <EuiFormControlLayoutIcons
+                  side="left"
+                  iconsPosition="absolute"
+                  icon={{ type: this.props.iconType }}
+                  isDisabled={this.props.isDisabled}
+                />
               ) : null}
               {this.props.isClearable && !this.props.isDisabled && this.props.query.query ? (
-                <div className="euiFormControlLayoutIcons euiFormControlLayoutIcons--absolute euiFormControlLayoutIcons--right">
-                  <button
-                    type="button"
-                    className="euiFormControlLayoutClearButton"
-                    title={strings.getQueryBarClearInputLabel()}
-                    onClick={() => {
+                <EuiFormControlLayoutIcons
+                  side="right"
+                  iconsPosition="absolute"
+                  clear={{
+                    onClick: () => {
                       this.onQueryStringChange('');
                       if (this.props.autoSubmit) {
                         this.onSubmit({ query: '', language: this.props.query.language });
                       }
-                    }}
-                  >
-                    <EuiIcon className="euiFormControlLayoutClearButton__icon" type="cross" />
-                  </button>
-                </div>
+                    },
+                    title: strings.getQueryBarClearInputLabel(),
+                  }}
+                />
               ) : null}
             </div>
             <EuiPortal>
diff --git a/src/plugins/vis_default_editor/public/components/controls/__snapshots__/extended_bounds.test.tsx.snap b/src/plugins/vis_default_editor/public/components/controls/__snapshots__/extended_bounds.test.tsx.snap
index 25824c3b59fb0..978010aade41c 100644
--- a/src/plugins/vis_default_editor/public/components/controls/__snapshots__/extended_bounds.test.tsx.snap
+++ b/src/plugins/vis_default_editor/public/components/controls/__snapshots__/extended_bounds.test.tsx.snap
@@ -2,14 +2,9 @@
 
 exports[`ExtendedBoundsParamEditor should be rendered with default set of props 1`] = `
 <EuiFormRow
-  describedByIds={Array []}
-  display="row"
   error="Min should be less than or equal to Max."
   fullWidth={true}
-  hasChildLabel={true}
-  hasEmptyLabelSpace={false}
   isInvalid={false}
-  labelType="label"
 >
   <EuiFlexGroup
     gutterSize="s"
diff --git a/src/plugins/vis_default_editor/public/components/controls/__snapshots__/metric_agg.test.tsx.snap b/src/plugins/vis_default_editor/public/components/controls/__snapshots__/metric_agg.test.tsx.snap
index 2255d942d277e..d105de26bbd0b 100644
--- a/src/plugins/vis_default_editor/public/components/controls/__snapshots__/metric_agg.test.tsx.snap
+++ b/src/plugins/vis_default_editor/public/components/controls/__snapshots__/metric_agg.test.tsx.snap
@@ -2,14 +2,10 @@
 
 exports[`MetricAggParamEditor should be rendered with default set of props 1`] = `
 <EuiFormRow
-  describedByIds={Array []}
   display="rowCompressed"
   fullWidth={true}
-  hasChildLabel={true}
-  hasEmptyLabelSpace={false}
   isInvalid={false}
   label="Metric"
-  labelType="label"
 >
   <EuiSelect
     compressed={true}
diff --git a/src/plugins/vis_default_editor/public/components/controls/__snapshots__/size.test.tsx.snap b/src/plugins/vis_default_editor/public/components/controls/__snapshots__/size.test.tsx.snap
index 011a19b16e674..1b7b0d8f904b4 100644
--- a/src/plugins/vis_default_editor/public/components/controls/__snapshots__/size.test.tsx.snap
+++ b/src/plugins/vis_default_editor/public/components/controls/__snapshots__/size.test.tsx.snap
@@ -2,11 +2,8 @@
 
 exports[`SizeParamEditor should init with the default set of props 1`] = `
 <EuiFormRow
-  describedByIds={Array []}
   display="rowCompressed"
   fullWidth={true}
-  hasChildLabel={true}
-  hasEmptyLabelSpace={false}
   isInvalid={false}
   label={
     <React.Fragment>
@@ -16,7 +13,6 @@ exports[`SizeParamEditor should init with the default set of props 1`] = `
       />
     </React.Fragment>
   }
-  labelType="label"
 >
   <EuiFieldNumber
     compressed={true}
diff --git a/src/plugins/vis_default_editor/public/components/controls/__snapshots__/time_interval.test.tsx.snap b/src/plugins/vis_default_editor/public/components/controls/__snapshots__/time_interval.test.tsx.snap
index 9fdffacb8affe..e06249aed6819 100644
--- a/src/plugins/vis_default_editor/public/components/controls/__snapshots__/time_interval.test.tsx.snap
+++ b/src/plugins/vis_default_editor/public/components/controls/__snapshots__/time_interval.test.tsx.snap
@@ -2,11 +2,8 @@
 
 exports[`TimeIntervalParamEditor should match snapshot 1`] = `
 <EuiFormRow
-  describedByIds={Array []}
   display="rowCompressed"
   fullWidth={true}
-  hasChildLabel={true}
-  hasEmptyLabelSpace={false}
   helpText={
     <React.Fragment>
       <Memo(MemoizedFormattedMessage)
@@ -17,7 +14,6 @@ exports[`TimeIntervalParamEditor should match snapshot 1`] = `
   }
   isInvalid={true}
   label="Minimum interval"
-  labelType="label"
 >
   <EuiComboBox
     async={false}
diff --git a/src/plugins/vis_default_editor/public/components/controls/__snapshots__/top_aggregate.test.tsx.snap b/src/plugins/vis_default_editor/public/components/controls/__snapshots__/top_aggregate.test.tsx.snap
index 07ed8200d4d16..e807a3432e601 100644
--- a/src/plugins/vis_default_editor/public/components/controls/__snapshots__/top_aggregate.test.tsx.snap
+++ b/src/plugins/vis_default_editor/public/components/controls/__snapshots__/top_aggregate.test.tsx.snap
@@ -2,11 +2,8 @@
 
 exports[`TopAggregateParamEditor should init with the default set of props 1`] = `
 <EuiFormRow
-  describedByIds={Array []}
   display="rowCompressed"
   fullWidth={true}
-  hasChildLabel={true}
-  hasEmptyLabelSpace={false}
   isInvalid={false}
   label={
     <React.Fragment>
@@ -22,7 +19,6 @@ exports[`TopAggregateParamEditor should init with the default set of props 1`] =
       />
     </React.Fragment>
   }
-  labelType="label"
 >
   <EuiSelect
     compressed={true}
diff --git a/src/plugins/vis_types/timeseries/public/application/components/splits/__snapshots__/terms.test.js.snap b/src/plugins/vis_types/timeseries/public/application/components/splits/__snapshots__/terms.test.js.snap
index 57176c8cd8b16..dfd92901d64ab 100644
--- a/src/plugins/vis_types/timeseries/public/application/components/splits/__snapshots__/terms.test.js.snap
+++ b/src/plugins/vis_types/timeseries/public/application/components/splits/__snapshots__/terms.test.js.snap
@@ -5,10 +5,6 @@ exports[`src/legacy/core_plugins/metrics/public/components/splits/terms.test.js
   <EuiFlexGroup>
     <EuiFlexItem>
       <EuiFormRow
-        describedByIds={Array []}
-        display="row"
-        hasChildLabel={true}
-        hasEmptyLabelSpace={false}
         id="42"
         label={
           <Memo(MemoizedFormattedMessage)
@@ -16,7 +12,6 @@ exports[`src/legacy/core_plugins/metrics/public/components/splits/terms.test.js
             id="visTypeTimeseries.splits.terms.groupByLabel"
           />
         }
-        labelType="label"
       >
         <GroupBySelect
           onChange={[Function]}
@@ -69,10 +64,6 @@ exports[`src/legacy/core_plugins/metrics/public/components/splits/terms.test.js
   <EuiFlexGroup>
     <EuiFlexItem>
       <EuiFormRow
-        describedByIds={Array []}
-        display="row"
-        hasChildLabel={true}
-        hasEmptyLabelSpace={false}
         id="42"
         label={
           <Memo(MemoizedFormattedMessage)
@@ -80,7 +71,6 @@ exports[`src/legacy/core_plugins/metrics/public/components/splits/terms.test.js
             id="visTypeTimeseries.splits.terms.includeLabel"
           />
         }
-        labelType="label"
       >
         <EuiFieldText
           data-test-subj="groupByInclude"
@@ -91,10 +81,6 @@ exports[`src/legacy/core_plugins/metrics/public/components/splits/terms.test.js
     </EuiFlexItem>
     <EuiFlexItem>
       <EuiFormRow
-        describedByIds={Array []}
-        display="row"
-        hasChildLabel={true}
-        hasEmptyLabelSpace={false}
         id="42"
         label={
           <Memo(MemoizedFormattedMessage)
@@ -102,7 +88,6 @@ exports[`src/legacy/core_plugins/metrics/public/components/splits/terms.test.js
             id="visTypeTimeseries.splits.terms.excludeLabel"
           />
         }
-        labelType="label"
       >
         <EuiFieldText
           data-test-subj="groupByExclude"
@@ -115,10 +100,6 @@ exports[`src/legacy/core_plugins/metrics/public/components/splits/terms.test.js
   <EuiFlexGroup>
     <EuiFlexItem>
       <EuiFormRow
-        describedByIds={Array []}
-        display="row"
-        hasChildLabel={true}
-        hasEmptyLabelSpace={false}
         id="42"
         label={
           <Memo(MemoizedFormattedMessage)
@@ -126,7 +107,6 @@ exports[`src/legacy/core_plugins/metrics/public/components/splits/terms.test.js
             id="visTypeTimeseries.splits.terms.topLabel"
           />
         }
-        labelType="label"
       >
         <EuiFieldNumber
           onChange={[Function]}
@@ -136,10 +116,6 @@ exports[`src/legacy/core_plugins/metrics/public/components/splits/terms.test.js
     </EuiFlexItem>
     <EuiFlexItem>
       <EuiFormRow
-        describedByIds={Array []}
-        display="row"
-        hasChildLabel={true}
-        hasEmptyLabelSpace={false}
         id="42"
         label={
           <Memo(MemoizedFormattedMessage)
@@ -147,7 +123,6 @@ exports[`src/legacy/core_plugins/metrics/public/components/splits/terms.test.js
             id="visTypeTimeseries.splits.terms.orderByLabel"
           />
         }
-        labelType="label"
       >
         <MetricSelect
           additionalOptions={
@@ -188,10 +163,6 @@ exports[`src/legacy/core_plugins/metrics/public/components/splits/terms.test.js
     </EuiFlexItem>
     <EuiFlexItem>
       <EuiFormRow
-        describedByIds={Array []}
-        display="row"
-        hasChildLabel={true}
-        hasEmptyLabelSpace={false}
         id="42"
         label={
           <Memo(MemoizedFormattedMessage)
@@ -199,7 +170,6 @@ exports[`src/legacy/core_plugins/metrics/public/components/splits/terms.test.js
             id="visTypeTimeseries.splits.terms.directionLabel"
           />
         }
-        labelType="label"
       >
         <EuiComboBox
           async={false}
diff --git a/src/plugins/vis_types/xy/public/editor/components/options/metrics_axes/__snapshots__/point_options.test.tsx.snap b/src/plugins/vis_types/xy/public/editor/components/options/metrics_axes/__snapshots__/point_options.test.tsx.snap
index 43b613a9c7f47..2e7b26a71d12f 100644
--- a/src/plugins/vis_types/xy/public/editor/components/options/metrics_axes/__snapshots__/point_options.test.tsx.snap
+++ b/src/plugins/vis_types/xy/public/editor/components/options/metrics_axes/__snapshots__/point_options.test.tsx.snap
@@ -15,13 +15,9 @@ exports[`PointOptions component should init with the default set of props 1`] =
     size="m"
   />
   <EuiFormRow
-    describedByIds={Array []}
     display="rowCompressed"
     fullWidth={true}
-    hasChildLabel={true}
-    hasEmptyLabelSpace={false}
     label="Dots size"
-    labelType="label"
   >
     <EuiRangeClass
       compressed={true}
diff --git a/src/plugins/vis_types/xy/public/editor/components/options/metrics_axes/__snapshots__/y_extents.test.tsx.snap b/src/plugins/vis_types/xy/public/editor/components/options/metrics_axes/__snapshots__/y_extents.test.tsx.snap
index 6d902f55f6720..0f8f7a47cc0b5 100644
--- a/src/plugins/vis_types/xy/public/editor/components/options/metrics_axes/__snapshots__/y_extents.test.tsx.snap
+++ b/src/plugins/vis_types/xy/public/editor/components/options/metrics_axes/__snapshots__/y_extents.test.tsx.snap
@@ -2,14 +2,10 @@
 
 exports[`YExtents component should init with the default set of props 1`] = `
 <EuiFormRow
-  describedByIds={Array []}
   display="rowCompressed"
   error={Array []}
   fullWidth={true}
-  hasChildLabel={true}
-  hasEmptyLabelSpace={false}
   isInvalid={false}
-  labelType="label"
 >
   <EuiFlexGroup
     gutterSize="s"
diff --git a/test/functional/page_objects/time_picker.ts b/test/functional/page_objects/time_picker.ts
index 5ea80ce271263..7546e316ebfd4 100644
--- a/test/functional/page_objects/time_picker.ts
+++ b/test/functional/page_objects/time_picker.ts
@@ -201,7 +201,7 @@ export class TimePickerPageObject extends FtrService {
   }
 
   public async isOff() {
-    return await this.find.existsByCssSelector('.euiAutoRefresh .euiFormControlLayout--readOnly');
+    return await this.find.existsByCssSelector('.euiAutoRefresh .euiFormControlLayout-readOnly');
   }
 
   public async getRefreshConfig(keepQuickSelectOpen = false) {
diff --git a/x-pack/plugins/aiops/public/components/log_rate_analysis/item_filter_popover.tsx b/x-pack/plugins/aiops/public/components/log_rate_analysis/item_filter_popover.tsx
index 9c96de316103b..f88e0f29aee8e 100644
--- a/x-pack/plugins/aiops/public/components/log_rate_analysis/item_filter_popover.tsx
+++ b/x-pack/plugins/aiops/public/components/log_rate_analysis/item_filter_popover.tsx
@@ -156,8 +156,7 @@ export const ItemFilterPopover: FC<ItemFilterPopoverProps> = ({
               data-test-subj={`aiopsFieldSelectorFieldNameListItem${
                 !skippedItems.includes(fieldName) ? ' checked' : ''
               }`}
-              className="euiSwitch--mini"
-              compressed
+              mini
               label={fieldName}
               onChange={(e) => setItemsFilter([fieldName], e.target.checked)}
               checked={!skippedItems.includes(fieldName)}
diff --git a/x-pack/plugins/aiops/public/components/log_rate_analysis/log_rate_analysis_results.tsx b/x-pack/plugins/aiops/public/components/log_rate_analysis/log_rate_analysis_results.tsx
index 91a067d56d4d5..8c2cf12ca376c 100644
--- a/x-pack/plugins/aiops/public/components/log_rate_analysis/log_rate_analysis_results.tsx
+++ b/x-pack/plugins/aiops/public/components/log_rate_analysis/log_rate_analysis_results.tsx
@@ -17,7 +17,6 @@ import {
   EuiEmptyPrompt,
   EuiFlexGroup,
   EuiFlexItem,
-  EuiFormRow,
   EuiSpacer,
   EuiText,
 } from '@elastic/eui';
@@ -428,26 +427,22 @@ export const LogRateAnalysisResults: FC<LogRateAnalysisResultsProps> = ({
         shouldRerunAnalysis={shouldRerunAnalysis}
       >
         <EuiFlexItem grow={false}>
-          <EuiFormRow display="columnCompressedSwitch">
-            <EuiFlexGroup gutterSize="s" alignItems="center">
-              <EuiFlexItem grow={false}>
-                <EuiText size="xs">{groupResultsMessage}</EuiText>
-              </EuiFlexItem>
-              <EuiFlexItem grow={false}>
-                <EuiButtonGroup
-                  data-test-subj={`aiopsLogRateAnalysisGroupSwitch${
-                    groupResults ? ' checked' : ''
-                  }`}
-                  buttonSize="s"
-                  isDisabled={disabledGroupResultsSwitch}
-                  legend="Smart grouping"
-                  options={toggleButtons}
-                  idSelected={toggleIdSelected}
-                  onChange={onGroupResultsToggle}
-                />
-              </EuiFlexItem>
-            </EuiFlexGroup>
-          </EuiFormRow>
+          <EuiFlexGroup gutterSize="s" alignItems="center">
+            <EuiFlexItem grow={false}>
+              <EuiText size="xs">{groupResultsMessage}</EuiText>
+            </EuiFlexItem>
+            <EuiFlexItem grow={false}>
+              <EuiButtonGroup
+                data-test-subj={`aiopsLogRateAnalysisGroupSwitch${groupResults ? ' checked' : ''}`}
+                buttonSize="s"
+                isDisabled={disabledGroupResultsSwitch}
+                legend="Smart grouping"
+                options={toggleButtons}
+                idSelected={toggleIdSelected}
+                onChange={onGroupResultsToggle}
+              />
+            </EuiFlexItem>
+          </EuiFlexGroup>
         </EuiFlexItem>
         <EuiFlexItem grow={false}>
           <FieldFilterPopover
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 0b470ded97634..bf66b5df800ec 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
@@ -210,34 +210,32 @@ exports[`<Settings /> can navigate Autoplay Settings 2`] = `
                   <button
                     aria-checked="false"
                     aria-labelledby="generated-id"
-                    class="euiSwitch__button"
+                    class="euiSwitch__button emotion-euiSwitch__button"
                     id="cycle"
                     name="cycle"
                     role="switch"
                     type="button"
                   >
                     <span
-                      class="euiSwitch__body"
+                      class="euiSwitch__body emotion-euiSwitch__body-off"
                     >
                       <span
-                        class="euiSwitch__thumb"
-                      />
-                      <span
-                        class="euiSwitch__track"
+                        class="euiSwitch__icons emotion-euiSwitch__icons-off-enabled"
                       >
                         <span
-                          class="euiSwitch__icon"
-                          data-euiicon-type="cross"
+                          data-euiicon-type="check"
                         />
                         <span
-                          class="euiSwitch__icon euiSwitch__icon--checked"
-                          data-euiicon-type="check"
+                          data-euiicon-type="cross"
                         />
                       </span>
                     </span>
+                    <span
+                      class="euiSwitch__thumb emotion-euiSwitch__thumb-off"
+                    />
                   </button>
                   <span
-                    class="euiSwitch__label"
+                    class="euiSwitch__label emotion-euiSwitch__label"
                     id="generated-id"
                   >
                     Cycle Slides
@@ -254,14 +252,14 @@ exports[`<Settings /> can navigate Autoplay Settings 2`] = `
                       class="euiFlexItem emotion-euiFlexItem-grow-1"
                     >
                       <div
-                        class="euiFormRow euiFormRow--hasLabel euiFormRow--compressed"
+                        class="euiFormRow euiFormRow--hasLabel emotion-euiFormRow"
                         id="generated-id-row"
                       >
                         <div
                           class="euiFormRow__labelWrapper"
                         >
                           <label
-                            class="euiFormLabel euiFormRow__label"
+                            class="euiFormLabel euiFormRow__label emotion-euiFormLabel"
                             for="generated-id"
                             id="generated-id-label"
                           >
@@ -272,10 +270,10 @@ exports[`<Settings /> can navigate Autoplay Settings 2`] = `
                           class="euiFormRow__fieldWrapper"
                         >
                           <div
-                            class="euiFormControlLayout euiFormControlLayout--compressed"
+                            class="euiFormControlLayout emotion-euiFormControlLayout-compressed"
                           >
                             <div
-                              class="euiFormControlLayout__childrenWrapper"
+                              class="euiFormControlLayout__childrenWrapper emotion-euiFormControlLayout__childrenWrapper"
                             >
                               <input
                                 aria-describedby="generated-id-help-0"
@@ -287,7 +285,7 @@ exports[`<Settings /> can navigate Autoplay Settings 2`] = `
                             </div>
                           </div>
                           <div
-                            class="euiFormHelpText euiFormRow__text"
+                            class="euiFormHelpText euiFormRow__text emotion-euiFormHelpText"
                             id="generated-id-help-0"
                           >
                             Use shorthand notation, like 30s, 10m, or 1h
@@ -299,9 +297,12 @@ exports[`<Settings /> can navigate Autoplay Settings 2`] = `
                       class="euiFlexItem emotion-euiFlexItem-growZero"
                     >
                       <div
-                        class="euiFormRow euiFormRow--hasEmptyLabelSpace euiFormRow--compressed"
+                        class="euiFormRow euiFormRow--hasEmptyLabelSpace emotion-euiFormRow"
                         id="generated-id-row"
                       >
+                        <div
+                          class="euiSpacer euiSpacer--m euiFormRow__labelWrapper emotion-euiSpacer-m"
+                        />
                         <div
                           class="euiFormRow__fieldWrapper"
                         >
@@ -541,7 +542,7 @@ exports[`<Settings /> can navigate Toolbar Settings, closes when activated 2`] =
                 style="padding: 16px;"
               >
                 <div
-                  class="euiFormRow"
+                  class="euiFormRow emotion-euiFormRow"
                   id="generated-id-row"
                 >
                   <div
@@ -554,7 +555,7 @@ exports[`<Settings /> can navigate Toolbar Settings, closes when activated 2`] =
                         aria-checked="false"
                         aria-describedby="generated-id-help-0"
                         aria-labelledby="generated-id"
-                        class="euiSwitch__button"
+                        class="euiSwitch__button emotion-euiSwitch__button"
                         data-test-subj="hideToolbarSwitch"
                         id="generated-id"
                         name="toolbarHide"
@@ -562,34 +563,32 @@ exports[`<Settings /> can navigate Toolbar Settings, closes when activated 2`] =
                         type="button"
                       >
                         <span
-                          class="euiSwitch__body"
+                          class="euiSwitch__body emotion-euiSwitch__body-off"
                         >
                           <span
-                            class="euiSwitch__thumb"
-                          />
-                          <span
-                            class="euiSwitch__track"
+                            class="euiSwitch__icons emotion-euiSwitch__icons-off-enabled"
                           >
                             <span
-                              class="euiSwitch__icon"
-                              data-euiicon-type="cross"
+                              data-euiicon-type="check"
                             />
                             <span
-                              class="euiSwitch__icon euiSwitch__icon--checked"
-                              data-euiicon-type="check"
+                              data-euiicon-type="cross"
                             />
                           </span>
                         </span>
+                        <span
+                          class="euiSwitch__thumb emotion-euiSwitch__thumb-off"
+                        />
                       </button>
                       <span
-                        class="euiSwitch__label"
+                        class="euiSwitch__label emotion-euiSwitch__label"
                         id="generated-id"
                       >
                         Hide Toolbar
                       </span>
                     </div>
                     <div
-                      class="euiFormHelpText euiFormRow__text"
+                      class="euiFormHelpText euiFormRow__text emotion-euiFormHelpText"
                       id="generated-id-help-0"
                     >
                       Hide the toolbar when the mouse is not within the Canvas?
@@ -717,7 +716,7 @@ exports[`<Settings /> can navigate Toolbar Settings, closes when activated 3`] =
                 style="padding: 16px;"
               >
                 <div
-                  class="euiFormRow"
+                  class="euiFormRow emotion-euiFormRow"
                   id="generated-id-row"
                 >
                   <div
@@ -730,7 +729,7 @@ exports[`<Settings /> can navigate Toolbar Settings, closes when activated 3`] =
                         aria-checked="true"
                         aria-describedby="generated-id-help-0"
                         aria-labelledby="generated-id"
-                        class="euiSwitch__button"
+                        class="euiSwitch__button emotion-euiSwitch__button"
                         data-test-subj="hideToolbarSwitch"
                         id="generated-id"
                         name="toolbarHide"
@@ -738,34 +737,32 @@ exports[`<Settings /> can navigate Toolbar Settings, closes when activated 3`] =
                         type="button"
                       >
                         <span
-                          class="euiSwitch__body"
+                          class="euiSwitch__body emotion-euiSwitch__body-on"
                         >
                           <span
-                            class="euiSwitch__thumb"
-                          />
-                          <span
-                            class="euiSwitch__track"
+                            class="euiSwitch__icons emotion-euiSwitch__icons-on-enabled"
                           >
                             <span
-                              class="euiSwitch__icon"
-                              data-euiicon-type="cross"
+                              data-euiicon-type="check"
                             />
                             <span
-                              class="euiSwitch__icon euiSwitch__icon--checked"
-                              data-euiicon-type="check"
+                              data-euiicon-type="cross"
                             />
                           </span>
                         </span>
+                        <span
+                          class="euiSwitch__thumb emotion-euiSwitch__thumb-on"
+                        />
                       </button>
                       <span
-                        class="euiSwitch__label"
+                        class="euiSwitch__label emotion-euiSwitch__label"
                         id="generated-id"
                       >
                         Hide Toolbar
                       </span>
                     </div>
                     <div
-                      class="euiFormHelpText euiFormRow__text"
+                      class="euiFormHelpText euiFormRow__text emotion-euiFormHelpText"
                       id="generated-id-help-0"
                     >
                       Hide the toolbar when the mouse is not within the Canvas?
diff --git a/x-pack/plugins/cases/public/components/configure_cases/field_mapping.tsx b/x-pack/plugins/cases/public/components/configure_cases/field_mapping.tsx
index 0cb6c4334231e..4badff63f3c76 100644
--- a/x-pack/plugins/cases/public/components/configure_cases/field_mapping.tsx
+++ b/x-pack/plugins/cases/public/components/configure_cases/field_mapping.tsx
@@ -6,7 +6,7 @@
  */
 
 import React from 'react';
-import { EuiFlexItem, EuiFlexGroup, useEuiFontSize } from '@elastic/eui';
+import { EuiFlexItem, EuiFlexGroup, EuiFormLabel, useEuiFontSize } from '@elastic/eui';
 import { css } from '@emotion/react';
 
 import { FieldMappingRowStatic } from './field_mapping_row_static';
@@ -32,13 +32,13 @@ const FieldMappingComponent: React.FC<FieldMappingProps> = ({
         {' '}
         <EuiFlexGroup responsive={false}>
           <EuiFlexItem>
-            <span className="euiFormLabel">{i18n.FIELD_MAPPING_FIRST_COL}</span>
+            <EuiFormLabel>{i18n.FIELD_MAPPING_FIRST_COL}</EuiFormLabel>
           </EuiFlexItem>
           <EuiFlexItem data-test-subj="case-configure-field-mappings-second-col-label">
-            <span className="euiFormLabel">{i18n.FIELD_MAPPING_SECOND_COL(actionTypeName)}</span>
+            <EuiFormLabel>{i18n.FIELD_MAPPING_SECOND_COL(actionTypeName)}</EuiFormLabel>
           </EuiFlexItem>
           <EuiFlexItem>
-            <span className="euiFormLabel">{i18n.FIELD_MAPPING_THIRD_COL}</span>
+            <EuiFormLabel>{i18n.FIELD_MAPPING_THIRD_COL}</EuiFormLabel>
           </EuiFlexItem>
         </EuiFlexGroup>
       </EuiFlexItem>
diff --git a/x-pack/plugins/cases/public/components/header_page/editable_title.test.tsx b/x-pack/plugins/cases/public/components/header_page/editable_title.test.tsx
index 50c672564b9d9..2bd3d22dfd675 100644
--- a/x-pack/plugins/cases/public/components/header_page/editable_title.test.tsx
+++ b/x-pack/plugins/cases/public/components/header_page/editable_title.test.tsx
@@ -229,7 +229,7 @@ describe('EditableTitle', () => {
 
     wrapper.find('button[data-test-subj="editable-title-submit-btn"]').simulate('click');
     wrapper.update();
-    expect(wrapper.find('.euiFormErrorText').text()).toBe(
+    expect(wrapper.find('div.euiFormErrorText').text()).toBe(
       'The length of the title is too long. The maximum length is 160 characters.'
     );
 
@@ -256,7 +256,7 @@ describe('EditableTitle', () => {
 
     wrapper.find('button[data-test-subj="editable-title-submit-btn"]').simulate('click');
     wrapper.update();
-    expect(wrapper.find('.euiFormErrorText').text()).toBe('A name is required.');
+    expect(wrapper.find('div.euiFormErrorText').text()).toBe('A name is required.');
 
     expect(submitTitle).not.toHaveBeenCalled();
     expect(
@@ -284,7 +284,7 @@ describe('EditableTitle', () => {
 
     wrapper.find('button[data-test-subj="editable-title-submit-btn"]').simulate('click');
     wrapper.update();
-    expect(wrapper.find('.euiFormErrorText').text()).toBe(
+    expect(wrapper.find('div.euiFormErrorText').text()).toBe(
       'The length of the title is too long. The maximum length is 160 characters.'
     );
 
diff --git a/x-pack/plugins/enterprise_search/public/applications/workplace_search/views/content_sources/components/synchronization/blocked_window_item.test.tsx b/x-pack/plugins/enterprise_search/public/applications/workplace_search/views/content_sources/components/synchronization/blocked_window_item.test.tsx
index e29ea8bbd15f6..0762426bf134b 100644
--- a/x-pack/plugins/enterprise_search/public/applications/workplace_search/views/content_sources/components/synchronization/blocked_window_item.test.tsx
+++ b/x-pack/plugins/enterprise_search/public/applications/workplace_search/views/content_sources/components/synchronization/blocked_window_item.test.tsx
@@ -75,28 +75,29 @@ describe('BlockedWindowItem', () => {
 
   it('handles "start" time change', () => {
     const wrapper = shallow(<BlockedWindowItem {...props} />);
-    const dayRange = wrapper.find(EuiDatePickerRange).dive();
+    const dayRange = wrapper.find(EuiDatePickerRange).dive().childAt(0).dive();
     const rangeDelimiter = dayRange.find(EuiFormControlLayoutDelimited).dive();
 
     rangeDelimiter
+      .find('.euiDatePickerRange__start')
+      .dive()
       .find(EuiDatePicker)
-      .first()
       .simulate('change', moment().utc().set({ hour: 10, minute: 0, seconds: 0 }));
 
-    expect(rangeDelimiter.find(EuiDatePicker)).toHaveLength(2);
     expect(setBlockedTimeWindow).toHaveBeenCalledWith(0, 'start', '10:00:00Z');
   });
 
   it('handles "end" time change', () => {
     const wrapper = shallow(<BlockedWindowItem {...props} />);
-    const dayRange = wrapper.find(EuiDatePickerRange).dive();
+    const dayRange = wrapper.find(EuiDatePickerRange).dive().childAt(0).dive();
     const rangeDelimiter = dayRange.find(EuiFormControlLayoutDelimited).dive();
+
     rangeDelimiter
+      .find('.euiDatePickerRange__end')
+      .dive()
       .find(EuiDatePicker)
-      .last()
       .simulate('change', moment().utc().set({ hour: 12, minute: 0, seconds: 0 }));
 
-    expect(rangeDelimiter.find(EuiDatePicker)).toHaveLength(2);
     expect(setBlockedTimeWindow).toHaveBeenCalledWith(0, 'end', '12:00:00Z');
   });
 });
diff --git a/x-pack/plugins/fleet/public/applications/fleet/sections/settings/components/edit_output_flyout/output_form_secret_form_row.tsx b/x-pack/plugins/fleet/public/applications/fleet/sections/settings/components/edit_output_flyout/output_form_secret_form_row.tsx
index 3614499905b2e..e4898f7837de3 100644
--- a/x-pack/plugins/fleet/public/applications/fleet/sections/settings/components/edit_output_flyout/output_form_secret_form_row.tsx
+++ b/x-pack/plugins/fleet/public/applications/fleet/sections/settings/components/edit_output_flyout/output_form_secret_form_row.tsx
@@ -11,6 +11,7 @@ import {
   EuiFlexGroup,
   EuiFlexItem,
   EuiFormRow,
+  type EuiFormRowProps,
   EuiIcon,
   EuiLink,
   EuiPanel,
@@ -24,7 +25,7 @@ import { i18n } from '@kbn/i18n';
 
 export const SecretFormRow: React.FC<{
   fullWidth?: boolean;
-  children: ConstructorParameters<typeof EuiFormRow>[0]['children'];
+  children: EuiFormRowProps['children'];
   useSecretsStorage: boolean;
   isConvertedToSecret?: boolean;
   onToggleSecretStorage: (secretEnabled: boolean) => void;
diff --git a/x-pack/plugins/lens/public/datasources/form_based/dimension_panel/format_selector.tsx b/x-pack/plugins/lens/public/datasources/form_based/dimension_panel/format_selector.tsx
index 08972b236240d..c94bf1e30bb2e 100644
--- a/x-pack/plugins/lens/public/datasources/form_based/dimension_panel/format_selector.tsx
+++ b/x-pack/plugins/lens/public/datasources/form_based/dimension_panel/format_selector.tsx
@@ -366,7 +366,6 @@ export function FormatSelector(props: FormatSelectorProps) {
           <EuiFormRow
             display="columnCompressed"
             hasEmptyLabelSpace
-            label=" "
             helpText={
               <EuiLink
                 href={docLinks.links.indexPatterns.fieldFormattersNumber}
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 eb9f2e7265f47..a785c5881da8a 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
@@ -175,6 +175,9 @@ exports[`UploadLicense should display an error when ES says license is expired 1
             </ul>
           </div>
         </div>
+        <div
+          class="euiSpacer euiSpacer--m emotion-euiSpacer-m"
+        />
         <div
           class="euiFilePicker emotion-euiFilePicker-fullWidth"
         >
@@ -314,6 +317,9 @@ exports[`UploadLicense should display an error when ES says license is invalid 1
             </ul>
           </div>
         </div>
+        <div
+          class="euiSpacer euiSpacer--m emotion-euiSpacer-m"
+        />
         <div
           class="euiFilePicker emotion-euiFilePicker-fullWidth"
         >
@@ -453,6 +459,9 @@ exports[`UploadLicense should display an error when submitting invalid JSON 1`]
             </ul>
           </div>
         </div>
+        <div
+          class="euiSpacer euiSpacer--m emotion-euiSpacer-m"
+        />
         <div
           class="euiFilePicker emotion-euiFilePicker-fullWidth"
         >
@@ -592,6 +601,9 @@ exports[`UploadLicense should display error when ES returns error 1`] = `
             </ul>
           </div>
         </div>
+        <div
+          class="euiSpacer euiSpacer--m emotion-euiSpacer-m"
+        />
         <div
           class="euiFilePicker emotion-euiFilePicker-fullWidth"
         >
diff --git a/x-pack/plugins/lists/public/exceptions/components/builder/entry_renderer.test.tsx b/x-pack/plugins/lists/public/exceptions/components/builder/entry_renderer.test.tsx
index 0aaa47b4a1265..580a294f64d25 100644
--- a/x-pack/plugins/lists/public/exceptions/components/builder/entry_renderer.test.tsx
+++ b/x-pack/plugins/lists/public/exceptions/components/builder/entry_renderer.test.tsx
@@ -241,7 +241,7 @@ describe('BuilderEntryItem', () => {
 
     await waitFor(() => {
       wrapper.update();
-      expect(wrapper.find('.euiFormHelpText.euiFormRow__text').text()).toMatch(
+      expect(wrapper.find('div.euiFormHelpText.euiFormRow__text').text()).toMatch(
         /This field is defined as different types across the following indices or is unmapped. This can cause unexpected query results./
       );
     });
diff --git a/x-pack/plugins/logstash/public/application/components/pipeline_editor/__snapshots__/flex_item_setting.test.js.snap b/x-pack/plugins/logstash/public/application/components/pipeline_editor/__snapshots__/flex_item_setting.test.js.snap
index e4cd3dc8122ab..73b3957566899 100644
--- a/x-pack/plugins/logstash/public/application/components/pipeline_editor/__snapshots__/flex_item_setting.test.js.snap
+++ b/x-pack/plugins/logstash/public/application/components/pipeline_editor/__snapshots__/flex_item_setting.test.js.snap
@@ -5,12 +5,8 @@ exports[`FlexItemSetting component renders a null label if label/tooltip text no
   grow={false}
 >
   <EuiFormRow
-    describedByIds={Array []}
-    display="row"
-    hasChildLabel={true}
     hasEmptyLabelSpace={true}
     label={null}
-    labelType="label"
   >
     <p>
       The child elements
@@ -24,9 +20,6 @@ exports[`FlexItemSetting component renders component and children as expected 1`
   grow={false}
 >
   <EuiFormRow
-    describedByIds={Array []}
-    display="row"
-    hasChildLabel={true}
     hasEmptyLabelSpace={false}
     label={
       <FormLabelWithIconTip
@@ -34,7 +27,6 @@ exports[`FlexItemSetting component renders component and children as expected 1`
         formRowTooltipText="tooltip text"
       />
     }
-    labelType="label"
   >
     <p>
       The child elements
diff --git a/x-pack/plugins/logstash/public/application/components/pipeline_editor/__snapshots__/pipeline_editor.test.js.snap b/x-pack/plugins/logstash/public/application/components/pipeline_editor/__snapshots__/pipeline_editor.test.js.snap
index aeb95516f3b26..1738f1402df46 100644
--- a/x-pack/plugins/logstash/public/application/components/pipeline_editor/__snapshots__/pipeline_editor.test.js.snap
+++ b/x-pack/plugins/logstash/public/application/components/pipeline_editor/__snapshots__/pipeline_editor.test.js.snap
@@ -27,18 +27,13 @@ exports[`PipelineEditor component includes required error message for falsy pipe
     isInvalid={true}
   >
     <EuiFormRow
-      describedByIds={Array []}
-      display="row"
       fullWidth={true}
-      hasChildLabel={true}
-      hasEmptyLabelSpace={false}
       label={
         <Memo(MemoizedFormattedMessage)
           defaultMessage="Pipeline ID"
           id="xpack.logstash.pipelineEditor.pipelineIdFormRowLabel"
         />
       }
-      labelType="label"
     >
       <EuiFieldText
         data-test-subj="inputId"
@@ -51,18 +46,13 @@ exports[`PipelineEditor component includes required error message for falsy pipe
       />
     </EuiFormRow>
     <EuiFormRow
-      describedByIds={Array []}
-      display="row"
       fullWidth={true}
-      hasChildLabel={true}
-      hasEmptyLabelSpace={false}
       label={
         <Memo(MemoizedFormattedMessage)
           defaultMessage="Description"
           id="xpack.logstash.pipelineEditor.descriptionFormRowLabel"
         />
       }
-      labelType="label"
     >
       <EuiFieldText
         data-test-subj="inputDescription"
@@ -73,18 +63,13 @@ exports[`PipelineEditor component includes required error message for falsy pipe
       />
     </EuiFormRow>
     <EuiFormRow
-      describedByIds={Array []}
-      display="row"
       fullWidth={true}
-      hasChildLabel={true}
-      hasEmptyLabelSpace={false}
       label={
         <Memo(MemoizedFormattedMessage)
           defaultMessage="Pipeline"
           id="xpack.logstash.pipelineEditor.pipelineFormRowLabel"
         />
       }
-      labelType="label"
     >
       <div
         data-test-subj="pipelineField"
@@ -106,10 +91,6 @@ exports[`PipelineEditor component includes required error message for falsy pipe
       </div>
     </EuiFormRow>
     <EuiFormRow
-      describedByIds={Array []}
-      display="row"
-      hasChildLabel={true}
-      hasEmptyLabelSpace={false}
       label={
         <FormLabelWithIconTip
           formRowLabelText="Pipeline workers"
@@ -118,7 +99,6 @@ exports[`PipelineEditor component includes required error message for falsy pipe
 Default value: Number of the host’s CPU cores"
         />
       }
-      labelType="label"
     >
       <EuiFieldNumber
         data-test-subj="inputWorkers"
@@ -309,18 +289,13 @@ exports[`PipelineEditor component invalidates form for invalid pipeline id input
     isInvalid={true}
   >
     <EuiFormRow
-      describedByIds={Array []}
-      display="row"
       fullWidth={true}
-      hasChildLabel={true}
-      hasEmptyLabelSpace={false}
       label={
         <Memo(MemoizedFormattedMessage)
           defaultMessage="Pipeline ID"
           id="xpack.logstash.pipelineEditor.pipelineIdFormRowLabel"
         />
       }
-      labelType="label"
     >
       <EuiFieldText
         data-test-subj="inputId"
@@ -333,18 +308,13 @@ exports[`PipelineEditor component invalidates form for invalid pipeline id input
       />
     </EuiFormRow>
     <EuiFormRow
-      describedByIds={Array []}
-      display="row"
       fullWidth={true}
-      hasChildLabel={true}
-      hasEmptyLabelSpace={false}
       label={
         <Memo(MemoizedFormattedMessage)
           defaultMessage="Description"
           id="xpack.logstash.pipelineEditor.descriptionFormRowLabel"
         />
       }
-      labelType="label"
     >
       <EuiFieldText
         data-test-subj="inputDescription"
@@ -355,18 +325,13 @@ exports[`PipelineEditor component invalidates form for invalid pipeline id input
       />
     </EuiFormRow>
     <EuiFormRow
-      describedByIds={Array []}
-      display="row"
       fullWidth={true}
-      hasChildLabel={true}
-      hasEmptyLabelSpace={false}
       label={
         <Memo(MemoizedFormattedMessage)
           defaultMessage="Pipeline"
           id="xpack.logstash.pipelineEditor.pipelineFormRowLabel"
         />
       }
-      labelType="label"
     >
       <div
         data-test-subj="pipelineField"
@@ -388,10 +353,6 @@ exports[`PipelineEditor component invalidates form for invalid pipeline id input
       </div>
     </EuiFormRow>
     <EuiFormRow
-      describedByIds={Array []}
-      display="row"
-      hasChildLabel={true}
-      hasEmptyLabelSpace={false}
       label={
         <FormLabelWithIconTip
           formRowLabelText="Pipeline workers"
@@ -400,7 +361,6 @@ exports[`PipelineEditor component invalidates form for invalid pipeline id input
 Default value: Number of the host’s CPU cores"
         />
       }
-      labelType="label"
     >
       <EuiFieldNumber
         data-test-subj="inputWorkers"
@@ -591,18 +551,13 @@ exports[`PipelineEditor component invalidates form for pipeline id with spaces 1
     isInvalid={true}
   >
     <EuiFormRow
-      describedByIds={Array []}
-      display="row"
       fullWidth={true}
-      hasChildLabel={true}
-      hasEmptyLabelSpace={false}
       label={
         <Memo(MemoizedFormattedMessage)
           defaultMessage="Pipeline ID"
           id="xpack.logstash.pipelineEditor.pipelineIdFormRowLabel"
         />
       }
-      labelType="label"
     >
       <EuiFieldText
         data-test-subj="inputId"
@@ -615,18 +570,13 @@ exports[`PipelineEditor component invalidates form for pipeline id with spaces 1
       />
     </EuiFormRow>
     <EuiFormRow
-      describedByIds={Array []}
-      display="row"
       fullWidth={true}
-      hasChildLabel={true}
-      hasEmptyLabelSpace={false}
       label={
         <Memo(MemoizedFormattedMessage)
           defaultMessage="Description"
           id="xpack.logstash.pipelineEditor.descriptionFormRowLabel"
         />
       }
-      labelType="label"
     >
       <EuiFieldText
         data-test-subj="inputDescription"
@@ -637,18 +587,13 @@ exports[`PipelineEditor component invalidates form for pipeline id with spaces 1
       />
     </EuiFormRow>
     <EuiFormRow
-      describedByIds={Array []}
-      display="row"
       fullWidth={true}
-      hasChildLabel={true}
-      hasEmptyLabelSpace={false}
       label={
         <Memo(MemoizedFormattedMessage)
           defaultMessage="Pipeline"
           id="xpack.logstash.pipelineEditor.pipelineFormRowLabel"
         />
       }
-      labelType="label"
     >
       <div
         data-test-subj="pipelineField"
@@ -670,10 +615,6 @@ exports[`PipelineEditor component invalidates form for pipeline id with spaces 1
       </div>
     </EuiFormRow>
     <EuiFormRow
-      describedByIds={Array []}
-      display="row"
-      hasChildLabel={true}
-      hasEmptyLabelSpace={false}
       label={
         <FormLabelWithIconTip
           formRowLabelText="Pipeline workers"
@@ -682,7 +623,6 @@ exports[`PipelineEditor component invalidates form for pipeline id with spaces 1
 Default value: Number of the host’s CPU cores"
         />
       }
-      labelType="label"
     >
       <EuiFieldNumber
         data-test-subj="inputWorkers"
@@ -869,18 +809,13 @@ exports[`PipelineEditor component matches snapshot for clone pipeline 1`] = `
     isInvalid={false}
   >
     <EuiFormRow
-      describedByIds={Array []}
-      display="row"
       fullWidth={true}
-      hasChildLabel={true}
-      hasEmptyLabelSpace={false}
       label={
         <Memo(MemoizedFormattedMessage)
           defaultMessage="Description"
           id="xpack.logstash.pipelineEditor.descriptionFormRowLabel"
         />
       }
-      labelType="label"
     >
       <EuiFieldText
         data-test-subj="inputDescription"
@@ -891,18 +826,13 @@ exports[`PipelineEditor component matches snapshot for clone pipeline 1`] = `
       />
     </EuiFormRow>
     <EuiFormRow
-      describedByIds={Array []}
-      display="row"
       fullWidth={true}
-      hasChildLabel={true}
-      hasEmptyLabelSpace={false}
       label={
         <Memo(MemoizedFormattedMessage)
           defaultMessage="Pipeline"
           id="xpack.logstash.pipelineEditor.pipelineFormRowLabel"
         />
       }
-      labelType="label"
     >
       <div
         data-test-subj="pipelineField"
@@ -924,10 +854,6 @@ exports[`PipelineEditor component matches snapshot for clone pipeline 1`] = `
       </div>
     </EuiFormRow>
     <EuiFormRow
-      describedByIds={Array []}
-      display="row"
-      hasChildLabel={true}
-      hasEmptyLabelSpace={false}
       label={
         <FormLabelWithIconTip
           formRowLabelText="Pipeline workers"
@@ -936,7 +862,6 @@ exports[`PipelineEditor component matches snapshot for clone pipeline 1`] = `
 Default value: Number of the host’s CPU cores"
         />
       }
-      labelType="label"
     >
       <EuiFieldNumber
         data-test-subj="inputWorkers"
@@ -1137,18 +1062,13 @@ exports[`PipelineEditor component matches snapshot for create pipeline 1`] = `
     isInvalid={false}
   >
     <EuiFormRow
-      describedByIds={Array []}
-      display="row"
       fullWidth={true}
-      hasChildLabel={true}
-      hasEmptyLabelSpace={false}
       label={
         <Memo(MemoizedFormattedMessage)
           defaultMessage="Pipeline ID"
           id="xpack.logstash.pipelineEditor.pipelineIdFormRowLabel"
         />
       }
-      labelType="label"
     >
       <EuiFieldText
         data-test-subj="inputId"
@@ -1161,18 +1081,13 @@ exports[`PipelineEditor component matches snapshot for create pipeline 1`] = `
       />
     </EuiFormRow>
     <EuiFormRow
-      describedByIds={Array []}
-      display="row"
       fullWidth={true}
-      hasChildLabel={true}
-      hasEmptyLabelSpace={false}
       label={
         <Memo(MemoizedFormattedMessage)
           defaultMessage="Description"
           id="xpack.logstash.pipelineEditor.descriptionFormRowLabel"
         />
       }
-      labelType="label"
     >
       <EuiFieldText
         data-test-subj="inputDescription"
@@ -1183,18 +1098,13 @@ exports[`PipelineEditor component matches snapshot for create pipeline 1`] = `
       />
     </EuiFormRow>
     <EuiFormRow
-      describedByIds={Array []}
-      display="row"
       fullWidth={true}
-      hasChildLabel={true}
-      hasEmptyLabelSpace={false}
       label={
         <Memo(MemoizedFormattedMessage)
           defaultMessage="Pipeline"
           id="xpack.logstash.pipelineEditor.pipelineFormRowLabel"
         />
       }
-      labelType="label"
     >
       <div
         data-test-subj="pipelineField"
@@ -1216,10 +1126,6 @@ exports[`PipelineEditor component matches snapshot for create pipeline 1`] = `
       </div>
     </EuiFormRow>
     <EuiFormRow
-      describedByIds={Array []}
-      display="row"
-      hasChildLabel={true}
-      hasEmptyLabelSpace={false}
       label={
         <FormLabelWithIconTip
           formRowLabelText="Pipeline workers"
@@ -1228,7 +1134,6 @@ exports[`PipelineEditor component matches snapshot for create pipeline 1`] = `
 Default value: Number of the host’s CPU cores"
         />
       }
-      labelType="label"
     >
       <EuiFieldNumber
         data-test-subj="inputWorkers"
@@ -1415,18 +1320,13 @@ exports[`PipelineEditor component matches snapshot for edit pipeline 1`] = `
     isInvalid={false}
   >
     <EuiFormRow
-      describedByIds={Array []}
-      display="row"
       fullWidth={true}
-      hasChildLabel={true}
-      hasEmptyLabelSpace={false}
       label={
         <Memo(MemoizedFormattedMessage)
           defaultMessage="Description"
           id="xpack.logstash.pipelineEditor.descriptionFormRowLabel"
         />
       }
-      labelType="label"
     >
       <EuiFieldText
         data-test-subj="inputDescription"
@@ -1437,18 +1337,13 @@ exports[`PipelineEditor component matches snapshot for edit pipeline 1`] = `
       />
     </EuiFormRow>
     <EuiFormRow
-      describedByIds={Array []}
-      display="row"
       fullWidth={true}
-      hasChildLabel={true}
-      hasEmptyLabelSpace={false}
       label={
         <Memo(MemoizedFormattedMessage)
           defaultMessage="Pipeline"
           id="xpack.logstash.pipelineEditor.pipelineFormRowLabel"
         />
       }
-      labelType="label"
     >
       <div
         data-test-subj="pipelineField"
@@ -1470,10 +1365,6 @@ exports[`PipelineEditor component matches snapshot for edit pipeline 1`] = `
       </div>
     </EuiFormRow>
     <EuiFormRow
-      describedByIds={Array []}
-      display="row"
-      hasChildLabel={true}
-      hasEmptyLabelSpace={false}
       label={
         <FormLabelWithIconTip
           formRowLabelText="Pipeline workers"
@@ -1482,7 +1373,6 @@ exports[`PipelineEditor component matches snapshot for edit pipeline 1`] = `
 Default value: Number of the host’s CPU cores"
         />
       }
-      labelType="label"
     >
       <EuiFieldNumber
         data-test-subj="inputWorkers"
diff --git a/x-pack/plugins/maps/public/classes/layers/wizards/choropleth_layer_wizard/__snapshots__/layer_template.test.tsx.snap b/x-pack/plugins/maps/public/classes/layers/wizards/choropleth_layer_wizard/__snapshots__/layer_template.test.tsx.snap
index 019235b11946e..3cdfc359f5834 100644
--- a/x-pack/plugins/maps/public/classes/layers/wizards/choropleth_layer_wizard/__snapshots__/layer_template.test.tsx.snap
+++ b/x-pack/plugins/maps/public/classes/layers/wizards/choropleth_layer_wizard/__snapshots__/layer_template.test.tsx.snap
@@ -16,13 +16,7 @@ exports[`should render EMS UI when left source is BOUNDARIES_SOURCE.EMS 1`] = `
     <EuiSpacer
       size="m"
     />
-    <EuiFormRow
-      describedByIds={Array []}
-      display="row"
-      hasChildLabel={true}
-      hasEmptyLabelSpace={false}
-      labelType="label"
-    >
+    <EuiFormRow>
       <EuiRadioGroup
         idSelected="EMS"
         onChange={[Function]}
@@ -67,13 +61,7 @@ exports[`should render elasticsearch UI when left source is BOUNDARIES_SOURCE.EL
     <EuiSpacer
       size="m"
     />
-    <EuiFormRow
-      describedByIds={Array []}
-      display="row"
-      hasChildLabel={true}
-      hasEmptyLabelSpace={false}
-      labelType="label"
-    >
+    <EuiFormRow>
       <EuiRadioGroup
         idSelected="ELASTICSEARCH"
         onChange={[Function]}
diff --git a/x-pack/plugins/maps/public/classes/sources/es_geo_grid_source/__snapshots__/resolution_editor.test.tsx.snap b/x-pack/plugins/maps/public/classes/sources/es_geo_grid_source/__snapshots__/resolution_editor.test.tsx.snap
index 073e368293a04..f985c035ffda4 100644
--- a/x-pack/plugins/maps/public/classes/sources/es_geo_grid_source/__snapshots__/resolution_editor.test.tsx.snap
+++ b/x-pack/plugins/maps/public/classes/sources/es_geo_grid_source/__snapshots__/resolution_editor.test.tsx.snap
@@ -3,12 +3,8 @@
 exports[`should render 3 tick slider when renderAs is HEX 1`] = `
 <Fragment>
   <EuiFormRow
-    describedByIds={Array []}
     display="columnCompressed"
-    hasChildLabel={true}
-    hasEmptyLabelSpace={false}
     label="Resolution"
-    labelType="label"
   >
     <EuiRangeClass
       compressed={true}
@@ -44,12 +40,8 @@ exports[`should render 3 tick slider when renderAs is HEX 1`] = `
 exports[`should render 4 tick slider when renderAs is GRID 1`] = `
 <Fragment>
   <EuiFormRow
-    describedByIds={Array []}
     display="columnCompressed"
-    hasChildLabel={true}
-    hasEmptyLabelSpace={false}
     label="Resolution"
-    labelType="label"
   >
     <EuiRangeClass
       compressed={true}
@@ -91,12 +83,8 @@ exports[`should render 4 tick slider when renderAs is GRID 1`] = `
 exports[`should render 4 tick slider when renderAs is HEATMAP 1`] = `
 <Fragment>
   <EuiFormRow
-    describedByIds={Array []}
     display="columnCompressed"
-    hasChildLabel={true}
-    hasEmptyLabelSpace={false}
     label="Resolution"
-    labelType="label"
   >
     <EuiRangeClass
       compressed={true}
@@ -138,12 +126,8 @@ exports[`should render 4 tick slider when renderAs is HEATMAP 1`] = `
 exports[`should render 4 tick slider when renderAs is POINT 1`] = `
 <Fragment>
   <EuiFormRow
-    describedByIds={Array []}
     display="columnCompressed"
-    hasChildLabel={true}
-    hasEmptyLabelSpace={false}
     label="Resolution"
-    labelType="label"
   >
     <EuiRangeClass
       compressed={true}
diff --git a/x-pack/plugins/maps/public/classes/sources/es_search_source/__snapshots__/update_source_editor.test.js.snap b/x-pack/plugins/maps/public/classes/sources/es_search_source/__snapshots__/update_source_editor.test.js.snap
index 1aa0df02fbaee..0c44811feff9c 100644
--- a/x-pack/plugins/maps/public/classes/sources/es_search_source/__snapshots__/update_source_editor.test.js.snap
+++ b/x-pack/plugins/maps/public/classes/sources/es_search_source/__snapshots__/update_source_editor.test.js.snap
@@ -40,12 +40,8 @@ exports[`should enable sort order select when sort field provided 1`] = `
       size="m"
     />
     <EuiFormRow
-      describedByIds={Array []}
       display="columnCompressed"
-      hasChildLabel={true}
-      hasEmptyLabelSpace={false}
       label="Field"
-      labelType="label"
     >
       <SingleFieldSelect
         compressed={true}
@@ -55,12 +51,8 @@ exports[`should enable sort order select when sort field provided 1`] = `
       />
     </EuiFormRow>
     <EuiFormRow
-      describedByIds={Array []}
       display="columnCompressed"
-      hasChildLabel={true}
-      hasEmptyLabelSpace={false}
       label="Order"
-      labelType="label"
     >
       <EuiSelect
         compressed={true}
@@ -142,12 +134,8 @@ exports[`should render update source editor 1`] = `
       size="m"
     />
     <EuiFormRow
-      describedByIds={Array []}
       display="columnCompressed"
-      hasChildLabel={true}
-      hasEmptyLabelSpace={false}
       label="Field"
-      labelType="label"
     >
       <SingleFieldSelect
         compressed={true}
@@ -156,12 +144,8 @@ exports[`should render update source editor 1`] = `
       />
     </EuiFormRow>
     <EuiFormRow
-      describedByIds={Array []}
       display="columnCompressed"
-      hasChildLabel={true}
-      hasEmptyLabelSpace={false}
       label="Order"
-      labelType="label"
     >
       <EuiSelect
         compressed={true}
diff --git a/x-pack/plugins/maps/public/classes/sources/es_search_source/util/__snapshots__/scaling_form.test.tsx.snap b/x-pack/plugins/maps/public/classes/sources/es_search_source/util/__snapshots__/scaling_form.test.tsx.snap
index 0b6f1f3316188..7f1b6c751cd04 100644
--- a/x-pack/plugins/maps/public/classes/sources/es_search_source/util/__snapshots__/scaling_form.test.tsx.snap
+++ b/x-pack/plugins/maps/public/classes/sources/es_search_source/util/__snapshots__/scaling_form.test.tsx.snap
@@ -22,13 +22,7 @@ exports[`scaling form should disable clusters option when clustering is not supp
   <EuiSpacer
     size="m"
   />
-  <EuiFormRow
-    describedByIds={Array []}
-    display="row"
-    hasChildLabel={true}
-    hasEmptyLabelSpace={false}
-    labelType="label"
-  >
+  <EuiFormRow>
     <div>
       <EuiRadio
         checked={false}
@@ -58,13 +52,7 @@ exports[`scaling form should disable clusters option when clustering is not supp
       />
     </div>
   </EuiFormRow>
-  <EuiFormRow
-    describedByIds={Array []}
-    display="row"
-    hasChildLabel={true}
-    hasEmptyLabelSpace={false}
-    labelType="label"
-  >
+  <EuiFormRow>
     <EuiSwitch
       checked={true}
       compressed={true}
@@ -97,13 +85,7 @@ exports[`scaling form should render 1`] = `
   <EuiSpacer
     size="m"
   />
-  <EuiFormRow
-    describedByIds={Array []}
-    display="row"
-    hasChildLabel={true}
-    hasEmptyLabelSpace={false}
-    labelType="label"
-  >
+  <EuiFormRow>
     <div>
       <EuiRadio
         checked={false}
@@ -126,13 +108,7 @@ exports[`scaling form should render 1`] = `
       />
     </div>
   </EuiFormRow>
-  <EuiFormRow
-    describedByIds={Array []}
-    display="row"
-    hasChildLabel={true}
-    hasEmptyLabelSpace={false}
-    labelType="label"
-  >
+  <EuiFormRow>
     <EuiSwitch
       checked={true}
       compressed={true}
diff --git a/x-pack/plugins/maps/public/classes/sources/mvt_single_layer_vector_source/__snapshots__/mvt_single_layer_source_settings.test.tsx.snap b/x-pack/plugins/maps/public/classes/sources/mvt_single_layer_vector_source/__snapshots__/mvt_single_layer_source_settings.test.tsx.snap
index 0a73383f7d1b7..c3062f6c75734 100644
--- a/x-pack/plugins/maps/public/classes/sources/mvt_single_layer_vector_source/__snapshots__/mvt_single_layer_source_settings.test.tsx.snap
+++ b/x-pack/plugins/maps/public/classes/sources/mvt_single_layer_vector_source/__snapshots__/mvt_single_layer_source_settings.test.tsx.snap
@@ -3,12 +3,8 @@
 exports[`should not render fields-editor when there is no layername 1`] = `
 <Fragment>
   <EuiFormRow
-    describedByIds={Array []}
     display="columnCompressed"
-    hasChildLabel={true}
-    hasEmptyLabelSpace={false}
     label="Source layer"
-    labelType="label"
   >
     <EuiFieldText
       compressed={true}
@@ -59,12 +55,8 @@ exports[`should not render fields-editor when there is no layername 1`] = `
 exports[`should render with fields 1`] = `
 <Fragment>
   <EuiFormRow
-    describedByIds={Array []}
     display="columnCompressed"
-    hasChildLabel={true}
-    hasEmptyLabelSpace={false}
     label="Source layer"
-    labelType="label"
   >
     <EuiFieldText
       compressed={true}
@@ -110,10 +102,6 @@ exports[`should render with fields 1`] = `
     }
   />
   <EuiFormRow
-    describedByIds={Array []}
-    display="row"
-    hasChildLabel={true}
-    hasEmptyLabelSpace={false}
     label={
       <EuiToolTip
         anchorClassName="eui-alignMiddle"
@@ -144,7 +132,6 @@ exports[`should render with fields 1`] = `
         </span>
       </EuiToolTip>
     }
-    labelType="label"
   >
     <MVTFieldConfigEditor
       fields={Array []}
@@ -157,12 +144,8 @@ exports[`should render with fields 1`] = `
 exports[`should render without fields 1`] = `
 <Fragment>
   <EuiFormRow
-    describedByIds={Array []}
     display="columnCompressed"
-    hasChildLabel={true}
-    hasEmptyLabelSpace={false}
     label="Source layer"
-    labelType="label"
   >
     <EuiFieldText
       compressed={true}
diff --git a/x-pack/plugins/maps/public/classes/sources/mvt_single_layer_vector_source/__snapshots__/mvt_single_layer_vector_source_editor.test.tsx.snap b/x-pack/plugins/maps/public/classes/sources/mvt_single_layer_vector_source/__snapshots__/mvt_single_layer_vector_source_editor.test.tsx.snap
index d1deee63a4e1b..f3006a0ee2b87 100644
--- a/x-pack/plugins/maps/public/classes/sources/mvt_single_layer_vector_source/__snapshots__/mvt_single_layer_vector_source_editor.test.tsx.snap
+++ b/x-pack/plugins/maps/public/classes/sources/mvt_single_layer_vector_source/__snapshots__/mvt_single_layer_vector_source_editor.test.tsx.snap
@@ -3,13 +3,8 @@
 exports[`should render source creation editor (fields should _not_ be included) 1`] = `
 <EuiPanel>
   <EuiFormRow
-    describedByIds={Array []}
-    display="row"
-    hasChildLabel={true}
-    hasEmptyLabelSpace={false}
     helpText="URL of the .mvt vector tile service. e.g. http://company.com/{z}/{x}/{y}.pbf"
     label="Url"
-    labelType="label"
   >
     <EuiFieldText
       compressed={true}
diff --git a/x-pack/plugins/maps/public/classes/sources/xyz_tms_source/__snapshots__/xyz_tms_editor.test.tsx.snap b/x-pack/plugins/maps/public/classes/sources/xyz_tms_source/__snapshots__/xyz_tms_editor.test.tsx.snap
index 1ace2712d318e..09191eef3a323 100644
--- a/x-pack/plugins/maps/public/classes/sources/xyz_tms_source/__snapshots__/xyz_tms_editor.test.tsx.snap
+++ b/x-pack/plugins/maps/public/classes/sources/xyz_tms_source/__snapshots__/xyz_tms_editor.test.tsx.snap
@@ -3,12 +3,7 @@
 exports[`should render 1`] = `
 <EuiPanel>
   <EuiFormRow
-    describedByIds={Array []}
-    display="row"
-    hasChildLabel={true}
-    hasEmptyLabelSpace={false}
     label="Url"
-    labelType="label"
   >
     <EuiFieldText
       onChange={[Function]}
diff --git a/x-pack/plugins/maps/public/classes/styles/ems/components/__snapshots__/ems_vector_tile_style_editor.test.tsx.snap b/x-pack/plugins/maps/public/classes/styles/ems/components/__snapshots__/ems_vector_tile_style_editor.test.tsx.snap
index dc27dae12c7b6..dff5ed90c6727 100644
--- a/x-pack/plugins/maps/public/classes/styles/ems/components/__snapshots__/ems_vector_tile_style_editor.test.tsx.snap
+++ b/x-pack/plugins/maps/public/classes/styles/ems/components/__snapshots__/ems_vector_tile_style_editor.test.tsx.snap
@@ -2,12 +2,8 @@
 
 exports[`EMSVectorTileStyleEditor is rendered 1`] = `
 <EuiFormRow
-  describedByIds={Array []}
   display="columnCompressed"
-  hasChildLabel={true}
-  hasEmptyLabelSpace={false}
   label="Color blend"
-  labelType="label"
 >
   <EuiColorPicker
     aria-label="Color blend"
diff --git a/x-pack/plugins/maps/public/classes/styles/heatmap/components/__snapshots__/heatmap_style_editor.test.tsx.snap b/x-pack/plugins/maps/public/classes/styles/heatmap/components/__snapshots__/heatmap_style_editor.test.tsx.snap
index 997b558835281..e577f5d52708a 100644
--- a/x-pack/plugins/maps/public/classes/styles/heatmap/components/__snapshots__/heatmap_style_editor.test.tsx.snap
+++ b/x-pack/plugins/maps/public/classes/styles/heatmap/components/__snapshots__/heatmap_style_editor.test.tsx.snap
@@ -2,12 +2,8 @@
 
 exports[`HeatmapStyleEditor is rendered 1`] = `
 <EuiFormRow
-  describedByIds={Array []}
   display="rowCompressed"
-  hasChildLabel={true}
-  hasEmptyLabelSpace={false}
   label="Color range"
-  labelType="label"
 >
   <EuiColorPalettePicker
     compressed={true}
diff --git a/x-pack/plugins/maps/public/classes/styles/vector/components/__snapshots__/vector_style_editor.test.tsx.snap b/x-pack/plugins/maps/public/classes/styles/vector/components/__snapshots__/vector_style_editor.test.tsx.snap
index 5a3ac322de19b..c0ff79d051e62 100644
--- a/x-pack/plugins/maps/public/classes/styles/vector/components/__snapshots__/vector_style_editor.test.tsx.snap
+++ b/x-pack/plugins/maps/public/classes/styles/vector/components/__snapshots__/vector_style_editor.test.tsx.snap
@@ -392,11 +392,7 @@ exports[`should render 1`] = `
     size="m"
   />
   <EuiFormRow
-    describedByIds={Array []}
     display="columnCompressedSwitch"
-    hasChildLabel={true}
-    hasEmptyLabelSpace={false}
-    labelType="label"
   >
     <EuiSwitch
       checked={true}
@@ -745,11 +741,7 @@ exports[`should render with no style fields 1`] = `
     size="m"
   />
   <EuiFormRow
-    describedByIds={Array []}
     display="columnCompressedSwitch"
-    hasChildLabel={true}
-    hasEmptyLabelSpace={false}
-    labelType="label"
   >
     <EuiSwitch
       checked={true}
diff --git a/x-pack/plugins/maps/public/classes/styles/vector/components/label/__snapshots__/label_position_editor.test.tsx.snap b/x-pack/plugins/maps/public/classes/styles/vector/components/label/__snapshots__/label_position_editor.test.tsx.snap
index b5c9d2973d29c..45a3c4f3b07e8 100644
--- a/x-pack/plugins/maps/public/classes/styles/vector/components/label/__snapshots__/label_position_editor.test.tsx.snap
+++ b/x-pack/plugins/maps/public/classes/styles/vector/components/label/__snapshots__/label_position_editor.test.tsx.snap
@@ -2,12 +2,7 @@
 
 exports[`should render 1`] = `
 <EuiFormRow
-  describedByIds={Array []}
-  display="row"
-  hasChildLabel={true}
-  hasEmptyLabelSpace={false}
   label="Label position"
-  labelType="label"
 >
   <EuiSelect
     aria-label="Select label position"
@@ -44,12 +39,7 @@ exports[`should render as disabled when label is not set 1`] = `
   position="top"
 >
   <EuiFormRow
-    describedByIds={Array []}
-    display="row"
-    hasChildLabel={true}
-    hasEmptyLabelSpace={false}
     label="Label position"
-    labelType="label"
   >
     <EuiSelect
       aria-label="Select label position"
@@ -87,12 +77,7 @@ exports[`should render as disabled when label position is disabled 1`] = `
   position="top"
 >
   <EuiFormRow
-    describedByIds={Array []}
-    display="row"
-    hasChildLabel={true}
-    hasEmptyLabelSpace={false}
     label="Label position"
-    labelType="label"
   >
     <EuiSelect
       aria-label="Select label position"
diff --git a/x-pack/plugins/maps/public/classes/styles/vector/components/symbol/__snapshots__/custom_icon_modal.test.tsx.snap b/x-pack/plugins/maps/public/classes/styles/vector/components/symbol/__snapshots__/custom_icon_modal.test.tsx.snap
index 16293d2db5057..cc36577667ed6 100644
--- a/x-pack/plugins/maps/public/classes/styles/vector/components/symbol/__snapshots__/custom_icon_modal.test.tsx.snap
+++ b/x-pack/plugins/maps/public/classes/styles/vector/components/symbol/__snapshots__/custom_icon_modal.test.tsx.snap
@@ -26,14 +26,10 @@ exports[`should render a custom icon modal with an existing icon 1`] = `
       >
         <EuiFormRow
           className="mapsCustomIconForm__image"
-          describedByIds={Array []}
           display="rowCompressed"
           error=""
-          hasChildLabel={true}
-          hasEmptyLabelSpace={false}
           helpText="SVGs without sharp corners and intricate details work best. Modifying the settings under Advanced options may improve rendering."
           isInvalid={false}
-          labelType="label"
         >
           <EuiFilePickerClass
             accept=".svg"
@@ -46,12 +42,8 @@ exports[`should render a custom icon modal with an existing icon 1`] = `
         </EuiFormRow>
         <EuiSpacer />
         <EuiFormRow
-          describedByIds={Array []}
           display="rowCompressed"
-          hasChildLabel={true}
-          hasEmptyLabelSpace={false}
           label="Name"
-          labelType="label"
         >
           <EuiFieldText
             className="mapsCustomIconForm__label"
@@ -88,10 +80,7 @@ exports[`should render a custom icon modal with an existing icon 1`] = `
             </EuiFlexGroup>
             <EuiFormRow
               className="mapsCustomIconForm__cutoff"
-              describedByIds={Array []}
               display="rowCompressed"
-              hasChildLabel={true}
-              hasEmptyLabelSpace={false}
               label={
                 <EuiToolTip
                   content="Adjusts the balance of the signed distance function between the inside (approaching 1) and outside (approaching 0) of the icon."
@@ -109,7 +98,6 @@ exports[`should render a custom icon modal with an existing icon 1`] = `
                   </React.Fragment>
                 </EuiToolTip>
               }
-              labelType="label"
             >
               <ValidatedRange
                 className="mapsCutoffRange"
@@ -125,10 +113,7 @@ exports[`should render a custom icon modal with an existing icon 1`] = `
             </EuiFormRow>
             <EuiFormRow
               className="mapsCustomIconForm__radius"
-              describedByIds={Array []}
               display="rowCompressed"
-              hasChildLabel={true}
-              hasEmptyLabelSpace={false}
               label={
                 <EuiToolTip
                   content="Adjusts the size of the signed distance function around the Alpha threshold as a percent of icon size."
@@ -146,7 +131,6 @@ exports[`should render a custom icon modal with an existing icon 1`] = `
                   </React.Fragment>
                 </EuiToolTip>
               }
-              labelType="label"
             >
               <ValidatedRange
                 className="mapsRadiusRange"
@@ -243,14 +227,10 @@ exports[`should render an empty custom icon modal 1`] = `
       >
         <EuiFormRow
           className="mapsCustomIconForm__image"
-          describedByIds={Array []}
           display="rowCompressed"
           error=""
-          hasChildLabel={true}
-          hasEmptyLabelSpace={false}
           helpText="SVGs without sharp corners and intricate details work best. Modifying the settings under Advanced options may improve rendering."
           isInvalid={false}
-          labelType="label"
         >
           <EuiFilePickerClass
             accept=".svg"
diff --git a/x-pack/plugins/maps/public/components/__snapshots__/geo_index_pattern_select.test.tsx.snap b/x-pack/plugins/maps/public/components/__snapshots__/geo_index_pattern_select.test.tsx.snap
index 2d6abff4f5c74..f398a681960a9 100644
--- a/x-pack/plugins/maps/public/components/__snapshots__/geo_index_pattern_select.test.tsx.snap
+++ b/x-pack/plugins/maps/public/components/__snapshots__/geo_index_pattern_select.test.tsx.snap
@@ -3,14 +3,9 @@
 exports[`should render 1`] = `
 <Fragment>
   <EuiFormRow
-    describedByIds={Array []}
-    display="row"
     error=""
-    hasChildLabel={true}
-    hasEmptyLabelSpace={false}
     isInvalid={false}
     label="Data view"
-    labelType="label"
   >
     <MockIndexPatternSelect
       data-test-subj="mapGeoIndexPatternSelect"
diff --git a/x-pack/plugins/maps/public/components/__snapshots__/validated_number_input.test.tsx.snap b/x-pack/plugins/maps/public/components/__snapshots__/validated_number_input.test.tsx.snap
index 96f13f1dfd574..2e81d9ae2280b 100644
--- a/x-pack/plugins/maps/public/components/__snapshots__/validated_number_input.test.tsx.snap
+++ b/x-pack/plugins/maps/public/components/__snapshots__/validated_number_input.test.tsx.snap
@@ -2,18 +2,13 @@
 
 exports[`should render with error 1`] = `
 <EuiFormRow
-  describedByIds={Array []}
-  display="row"
   error={
     Array [
       "Must be between 0 and 20",
     ]
   }
-  hasChildLabel={true}
-  hasEmptyLabelSpace={false}
   isInvalid={true}
   label="foobar"
-  labelType="label"
 >
   <EuiFieldNumber
     aria-label="foobar number input"
@@ -28,14 +23,9 @@ exports[`should render with error 1`] = `
 
 exports[`should render without error 1`] = `
 <EuiFormRow
-  describedByIds={Array []}
-  display="row"
   error={Array []}
-  hasChildLabel={true}
-  hasEmptyLabelSpace={false}
   isInvalid={false}
   label="foobar"
-  labelType="label"
 >
   <EuiFieldNumber
     aria-label="foobar number input"
diff --git a/x-pack/plugins/maps/public/components/draw_forms/geometry_filter_form/__snapshots__/geometry_filter_form.test.js.snap b/x-pack/plugins/maps/public/components/draw_forms/geometry_filter_form/__snapshots__/geometry_filter_form.test.js.snap
index 6714a7779f908..adcdce0837294 100644
--- a/x-pack/plugins/maps/public/components/draw_forms/geometry_filter_form/__snapshots__/geometry_filter_form.test.js.snap
+++ b/x-pack/plugins/maps/public/components/draw_forms/geometry_filter_form/__snapshots__/geometry_filter_form.test.js.snap
@@ -3,12 +3,8 @@
 exports[`render 1`] = `
 <EuiForm>
   <EuiFormRow
-    describedByIds={Array []}
     display="rowCompressed"
-    hasChildLabel={true}
-    hasEmptyLabelSpace={false}
     label="Geometry label"
-    labelType="label"
   >
     <EuiFieldText
       compressed={true}
@@ -17,12 +13,8 @@ exports[`render 1`] = `
     />
   </EuiFormRow>
   <EuiFormRow
-    describedByIds={Array []}
     display="rowCompressed"
-    hasChildLabel={true}
-    hasEmptyLabelSpace={false}
     label="Spatial relation"
-    labelType="label"
   >
     <EuiSelect
       compressed={true}
@@ -71,12 +63,8 @@ exports[`render 1`] = `
 exports[`should render error message 1`] = `
 <EuiForm>
   <EuiFormRow
-    describedByIds={Array []}
     display="rowCompressed"
-    hasChildLabel={true}
-    hasEmptyLabelSpace={false}
     label="Geometry label"
-    labelType="label"
   >
     <EuiFieldText
       compressed={true}
@@ -85,12 +73,8 @@ exports[`should render error message 1`] = `
     />
   </EuiFormRow>
   <EuiFormRow
-    describedByIds={Array []}
     display="rowCompressed"
-    hasChildLabel={true}
-    hasEmptyLabelSpace={false}
     label="Spatial relation"
-    labelType="label"
   >
     <EuiSelect
       compressed={true}
diff --git a/x-pack/plugins/maps/public/connected_components/edit_layer_panel/layer_settings/__snapshots__/attribution_form_row.test.tsx.snap b/x-pack/plugins/maps/public/connected_components/edit_layer_panel/layer_settings/__snapshots__/attribution_form_row.test.tsx.snap
index 46ddc7f58eb78..f8046be594e6a 100644
--- a/x-pack/plugins/maps/public/connected_components/edit_layer_panel/layer_settings/__snapshots__/attribution_form_row.test.tsx.snap
+++ b/x-pack/plugins/maps/public/connected_components/edit_layer_panel/layer_settings/__snapshots__/attribution_form_row.test.tsx.snap
@@ -7,12 +7,16 @@ exports[`Should render add form row when attribution not provided 1`] = `
   <div
     className="mapAttributionFormRow"
   >
-    <legend
-      className="mapAttributionFormRow__legend"
-      id="mapsLayerSettingsAttributionLegend"
+    <EuiTitle
+      size="xxxs"
     >
-      Attribution
-    </legend>
+      <legend
+        className="mapAttributionFormRow__legend"
+        id="mapsLayerSettingsAttributionLegend"
+      >
+        Attribution
+      </legend>
+    </EuiTitle>
     <div
       className="mapAttributionFormRow__field"
     >
@@ -37,12 +41,16 @@ exports[`Should render edit form row when attribution not provided 1`] = `
   <div
     className="mapAttributionFormRow"
   >
-    <legend
-      className="mapAttributionFormRow__legend"
-      id="mapsLayerSettingsAttributionLegend"
+    <EuiTitle
+      size="xxxs"
     >
-      Attribution
-    </legend>
+      <legend
+        className="mapAttributionFormRow__legend"
+        id="mapsLayerSettingsAttributionLegend"
+      >
+        Attribution
+      </legend>
+    </EuiTitle>
     <div
       className="mapAttributionFormRow__field"
     >
diff --git a/x-pack/plugins/maps/public/connected_components/edit_layer_panel/layer_settings/_attribution_form_row.scss b/x-pack/plugins/maps/public/connected_components/edit_layer_panel/layer_settings/_attribution_form_row.scss
index a8a6264c951ce..e959057138cb4 100644
--- a/x-pack/plugins/maps/public/connected_components/edit_layer_panel/layer_settings/_attribution_form_row.scss
+++ b/x-pack/plugins/maps/public/connected_components/edit_layer_panel/layer_settings/_attribution_form_row.scss
@@ -4,12 +4,12 @@
 }
 
 .mapAttributionFormRow__legend {
-  @include euiFormLabel;
   display: inline-flex;
   width: calc(33% - #{$euiSizeS});
   height: $euiSizeXL;
   align-items: center;
   margin-right: $euiSizeS;
+  font-weight: $euiFontWeightSemiBold;
 }
 
 .mapAttributionFormRow__field {
@@ -24,4 +24,4 @@
   display: flex;
   justify-content: flex-end;
   margin-top: $euiSizeXS;
-}
\ No newline at end of file
+}
diff --git a/x-pack/plugins/maps/public/connected_components/edit_layer_panel/layer_settings/attribution_form_row.tsx b/x-pack/plugins/maps/public/connected_components/edit_layer_panel/layer_settings/attribution_form_row.tsx
index 38ac195904592..b921b2769ef1c 100644
--- a/x-pack/plugins/maps/public/connected_components/edit_layer_panel/layer_settings/attribution_form_row.tsx
+++ b/x-pack/plugins/maps/public/connected_components/edit_layer_panel/layer_settings/attribution_form_row.tsx
@@ -6,7 +6,7 @@
  */
 
 import React from 'react';
-import { EuiButtonEmpty, EuiLink, EuiPanel } from '@elastic/eui';
+import { EuiButtonEmpty, EuiLink, EuiPanel, EuiTitle } from '@elastic/eui';
 import { i18n } from '@kbn/i18n';
 import { Attribution } from '../../../../common/descriptor_types';
 import { ILayer } from '../../../classes/layers/layer';
@@ -25,11 +25,16 @@ export function AttributionFormRow(props: Props) {
     return (
       <fieldset aria-labelledby="mapsLayerSettingsAttributionLegend">
         <div className="mapAttributionFormRow">
-          <legend id="mapsLayerSettingsAttributionLegend" className="mapAttributionFormRow__legend">
-            {i18n.translate('xpack.maps.layerSettings.attributionLegend', {
-              defaultMessage: 'Attribution',
-            })}
-          </legend>
+          <EuiTitle size="xxxs">
+            <legend
+              id="mapsLayerSettingsAttributionLegend"
+              className="mapAttributionFormRow__legend"
+            >
+              {i18n.translate('xpack.maps.layerSettings.attributionLegend', {
+                defaultMessage: 'Attribution',
+              })}
+            </legend>
+          </EuiTitle>
 
           {layerDescriptor.attribution === undefined ? (
             <div className="mapAttributionFormRow__field">
diff --git a/x-pack/plugins/maps/public/connected_components/map_settings_panel/__snapshots__/navigation_panel.test.tsx.snap b/x-pack/plugins/maps/public/connected_components/map_settings_panel/__snapshots__/navigation_panel.test.tsx.snap
index e8145a80ba293..bf3d79c55247a 100644
--- a/x-pack/plugins/maps/public/connected_components/map_settings_panel/__snapshots__/navigation_panel.test.tsx.snap
+++ b/x-pack/plugins/maps/public/connected_components/map_settings_panel/__snapshots__/navigation_panel.test.tsx.snap
@@ -15,13 +15,7 @@ exports[`should render 1`] = `
   <EuiSpacer
     size="m"
   />
-  <EuiFormRow
-    describedByIds={Array []}
-    display="row"
-    hasChildLabel={true}
-    hasEmptyLabelSpace={false}
-    labelType="label"
-  >
+  <EuiFormRow>
     <EuiSwitch
       checked={false}
       compressed={true}
@@ -56,12 +50,7 @@ exports[`should render 1`] = `
     size="m"
   />
   <EuiFormRow
-    describedByIds={Array []}
-    display="row"
-    hasChildLabel={true}
-    hasEmptyLabelSpace={false}
     label="Initial map location"
-    labelType="label"
   >
     <EuiRadioGroup
       idSelected="LAST_SAVED_LOCATION"
@@ -106,13 +95,7 @@ exports[`should render browser location form when initialLocation is BROWSER_LOC
   <EuiSpacer
     size="m"
   />
-  <EuiFormRow
-    describedByIds={Array []}
-    display="row"
-    hasChildLabel={true}
-    hasEmptyLabelSpace={false}
-    labelType="label"
-  >
+  <EuiFormRow>
     <EuiSwitch
       checked={false}
       compressed={true}
@@ -147,12 +130,7 @@ exports[`should render browser location form when initialLocation is BROWSER_LOC
     size="m"
   />
   <EuiFormRow
-    describedByIds={Array []}
-    display="row"
-    hasChildLabel={true}
-    hasEmptyLabelSpace={false}
     label="Initial map location"
-    labelType="label"
   >
     <EuiRadioGroup
       idSelected="BROWSER_LOCATION"
@@ -180,12 +158,8 @@ exports[`should render browser location form when initialLocation is BROWSER_LOC
     />
   </EuiFormRow>
   <EuiFormRow
-    describedByIds={Array []}
     display="columnCompressed"
-    hasChildLabel={true}
-    hasEmptyLabelSpace={false}
     label="Initial zoom"
-    labelType="label"
   >
     <ValidatedRange
       compressed={true}
@@ -216,13 +190,7 @@ exports[`should render fixed location form when initialLocation is FIXED_LOCATIO
   <EuiSpacer
     size="m"
   />
-  <EuiFormRow
-    describedByIds={Array []}
-    display="row"
-    hasChildLabel={true}
-    hasEmptyLabelSpace={false}
-    labelType="label"
-  >
+  <EuiFormRow>
     <EuiSwitch
       checked={false}
       compressed={true}
@@ -257,12 +225,7 @@ exports[`should render fixed location form when initialLocation is FIXED_LOCATIO
     size="m"
   />
   <EuiFormRow
-    describedByIds={Array []}
-    display="row"
-    hasChildLabel={true}
-    hasEmptyLabelSpace={false}
     label="Initial map location"
-    labelType="label"
   >
     <EuiRadioGroup
       idSelected="FIXED_LOCATION"
@@ -290,12 +253,8 @@ exports[`should render fixed location form when initialLocation is FIXED_LOCATIO
     />
   </EuiFormRow>
   <EuiFormRow
-    describedByIds={Array []}
     display="columnCompressed"
-    hasChildLabel={true}
-    hasEmptyLabelSpace={false}
     label="Initial latitude"
-    labelType="label"
   >
     <EuiFieldNumber
       compressed={true}
@@ -304,12 +263,8 @@ exports[`should render fixed location form when initialLocation is FIXED_LOCATIO
     />
   </EuiFormRow>
   <EuiFormRow
-    describedByIds={Array []}
     display="columnCompressed"
-    hasChildLabel={true}
-    hasEmptyLabelSpace={false}
     label="Initial longitude"
-    labelType="label"
   >
     <EuiFieldNumber
       compressed={true}
@@ -318,12 +273,8 @@ exports[`should render fixed location form when initialLocation is FIXED_LOCATIO
     />
   </EuiFormRow>
   <EuiFormRow
-    describedByIds={Array []}
     display="columnCompressed"
-    hasChildLabel={true}
-    hasEmptyLabelSpace={false}
     label="Initial zoom"
-    labelType="label"
   >
     <ValidatedRange
       compressed={true}
diff --git a/x-pack/plugins/maps/public/connected_components/mb_map/tooltip_control/features_tooltip/__snapshots__/footer.test.tsx.snap b/x-pack/plugins/maps/public/connected_components/mb_map/tooltip_control/features_tooltip/__snapshots__/footer.test.tsx.snap
index a4c9135e63370..de90617a18f80 100644
--- a/x-pack/plugins/maps/public/connected_components/mb_map/tooltip_control/features_tooltip/__snapshots__/footer.test.tsx.snap
+++ b/x-pack/plugins/maps/public/connected_components/mb_map/tooltip_control/features_tooltip/__snapshots__/footer.test.tsx.snap
@@ -24,11 +24,7 @@ exports[`Footer multiple features, multiple layers: locked should show paginatio
       key="layerSelect"
     >
       <EuiFormRow
-        describedByIds={Array []}
         display="rowCompressed"
-        hasChildLabel={true}
-        hasEmptyLabelSpace={false}
-        labelType="label"
       >
         <EuiSelect
           aria-label="Filter results by layer"
diff --git a/x-pack/plugins/ml/public/application/components/custom_urls/custom_url_editor/__snapshots__/list.test.tsx.snap b/x-pack/plugins/ml/public/application/components/custom_urls/custom_url_editor/__snapshots__/list.test.tsx.snap
index 563c8e443c509..52a2378435623 100644
--- a/x-pack/plugins/ml/public/application/components/custom_urls/custom_url_editor/__snapshots__/list.test.tsx.snap
+++ b/x-pack/plugins/ml/public/application/components/custom_urls/custom_url_editor/__snapshots__/list.test.tsx.snap
@@ -13,11 +13,7 @@ exports[`CustomUrlList renders a list of custom URLs 1`] = `
     >
       <EuiFormRow
         data-test-subj="mlJobEditCustomUrlItemLabel"
-        describedByIds={Array []}
-        display="row"
         error={Array []}
-        hasChildLabel={true}
-        hasEmptyLabelSpace={false}
         isInvalid={false}
         label={
           <Memo(MemoizedFormattedMessage)
@@ -25,7 +21,6 @@ exports[`CustomUrlList renders a list of custom URLs 1`] = `
             id="xpack.ml.customUrlEditorList.labelLabel"
           />
         }
-        labelType="label"
       >
         <EuiFieldText
           data-test-subj="mlJobEditCustomUrlLabelInput_0"
@@ -37,18 +32,13 @@ exports[`CustomUrlList renders a list of custom URLs 1`] = `
     </EuiFlexItem>
     <EuiFlexItem>
       <EuiFormRow
-        describedByIds={Array []}
-        display="row"
         fullWidth={true}
-        hasChildLabel={true}
-        hasEmptyLabelSpace={false}
         label={
           <Memo(MemoizedFormattedMessage)
             defaultMessage="URL"
             id="xpack.ml.customUrlEditorList.urlLabel"
           />
         }
-        labelType="label"
       >
         <EuiFieldText
           data-test-subj="mlJobEditCustomUrlInput_0"
@@ -63,11 +53,7 @@ exports[`CustomUrlList renders a list of custom URLs 1`] = `
       grow={false}
     >
       <EuiFormRow
-        describedByIds={Array []}
-        display="row"
         error={Array []}
-        hasChildLabel={true}
-        hasEmptyLabelSpace={false}
         isInvalid={false}
         label={
           <Memo(MemoizedFormattedMessage)
@@ -75,7 +61,6 @@ exports[`CustomUrlList renders a list of custom URLs 1`] = `
             id="xpack.ml.customUrlEditorList.timeRangeLabel"
           />
         }
-        labelType="label"
       >
         <EuiFieldText
           isInvalid={false}
@@ -89,11 +74,7 @@ exports[`CustomUrlList renders a list of custom URLs 1`] = `
       grow={false}
     >
       <EuiFormRow
-        describedByIds={Array []}
-        display="row"
-        hasChildLabel={true}
         hasEmptyLabelSpace={true}
-        labelType="label"
       >
         <EuiToolTip
           content={
@@ -121,11 +102,7 @@ exports[`CustomUrlList renders a list of custom URLs 1`] = `
       grow={false}
     >
       <EuiFormRow
-        describedByIds={Array []}
-        display="row"
-        hasChildLabel={true}
         hasEmptyLabelSpace={true}
-        labelType="label"
       >
         <EuiToolTip
           content={
@@ -162,11 +139,7 @@ exports[`CustomUrlList renders a list of custom URLs 1`] = `
     >
       <EuiFormRow
         data-test-subj="mlJobEditCustomUrlItemLabel"
-        describedByIds={Array []}
-        display="row"
         error={Array []}
-        hasChildLabel={true}
-        hasEmptyLabelSpace={false}
         isInvalid={false}
         label={
           <Memo(MemoizedFormattedMessage)
@@ -174,7 +147,6 @@ exports[`CustomUrlList renders a list of custom URLs 1`] = `
             id="xpack.ml.customUrlEditorList.labelLabel"
           />
         }
-        labelType="label"
       >
         <EuiFieldText
           data-test-subj="mlJobEditCustomUrlLabelInput_1"
@@ -186,18 +158,13 @@ exports[`CustomUrlList renders a list of custom URLs 1`] = `
     </EuiFlexItem>
     <EuiFlexItem>
       <EuiFormRow
-        describedByIds={Array []}
-        display="row"
         fullWidth={true}
-        hasChildLabel={true}
-        hasEmptyLabelSpace={false}
         label={
           <Memo(MemoizedFormattedMessage)
             defaultMessage="URL"
             id="xpack.ml.customUrlEditorList.urlLabel"
           />
         }
-        labelType="label"
       >
         <EuiFieldText
           data-test-subj="mlJobEditCustomUrlInput_1"
@@ -212,11 +179,7 @@ exports[`CustomUrlList renders a list of custom URLs 1`] = `
       grow={false}
     >
       <EuiFormRow
-        describedByIds={Array []}
-        display="row"
         error={Array []}
-        hasChildLabel={true}
-        hasEmptyLabelSpace={false}
         isInvalid={false}
         label={
           <Memo(MemoizedFormattedMessage)
@@ -224,7 +187,6 @@ exports[`CustomUrlList renders a list of custom URLs 1`] = `
             id="xpack.ml.customUrlEditorList.timeRangeLabel"
           />
         }
-        labelType="label"
       >
         <EuiFieldText
           isInvalid={false}
@@ -238,11 +200,7 @@ exports[`CustomUrlList renders a list of custom URLs 1`] = `
       grow={false}
     >
       <EuiFormRow
-        describedByIds={Array []}
-        display="row"
-        hasChildLabel={true}
         hasEmptyLabelSpace={true}
-        labelType="label"
       >
         <EuiToolTip
           content={
@@ -270,11 +228,7 @@ exports[`CustomUrlList renders a list of custom URLs 1`] = `
       grow={false}
     >
       <EuiFormRow
-        describedByIds={Array []}
-        display="row"
-        hasChildLabel={true}
         hasEmptyLabelSpace={true}
-        labelType="label"
       >
         <EuiToolTip
           content={
@@ -311,11 +265,7 @@ exports[`CustomUrlList renders a list of custom URLs 1`] = `
     >
       <EuiFormRow
         data-test-subj="mlJobEditCustomUrlItemLabel"
-        describedByIds={Array []}
-        display="row"
         error={Array []}
-        hasChildLabel={true}
-        hasEmptyLabelSpace={false}
         isInvalid={false}
         label={
           <Memo(MemoizedFormattedMessage)
@@ -323,7 +273,6 @@ exports[`CustomUrlList renders a list of custom URLs 1`] = `
             id="xpack.ml.customUrlEditorList.labelLabel"
           />
         }
-        labelType="label"
       >
         <EuiFieldText
           data-test-subj="mlJobEditCustomUrlLabelInput_2"
@@ -335,18 +284,13 @@ exports[`CustomUrlList renders a list of custom URLs 1`] = `
     </EuiFlexItem>
     <EuiFlexItem>
       <EuiFormRow
-        describedByIds={Array []}
-        display="row"
         fullWidth={true}
-        hasChildLabel={true}
-        hasEmptyLabelSpace={false}
         label={
           <Memo(MemoizedFormattedMessage)
             defaultMessage="URL"
             id="xpack.ml.customUrlEditorList.urlLabel"
           />
         }
-        labelType="label"
       >
         <EuiFieldText
           data-test-subj="mlJobEditCustomUrlInput_2"
@@ -361,11 +305,7 @@ exports[`CustomUrlList renders a list of custom URLs 1`] = `
       grow={false}
     >
       <EuiFormRow
-        describedByIds={Array []}
-        display="row"
         error={Array []}
-        hasChildLabel={true}
-        hasEmptyLabelSpace={false}
         isInvalid={false}
         label={
           <Memo(MemoizedFormattedMessage)
@@ -373,7 +313,6 @@ exports[`CustomUrlList renders a list of custom URLs 1`] = `
             id="xpack.ml.customUrlEditorList.timeRangeLabel"
           />
         }
-        labelType="label"
       >
         <EuiFieldText
           isInvalid={false}
@@ -387,11 +326,7 @@ exports[`CustomUrlList renders a list of custom URLs 1`] = `
       grow={false}
     >
       <EuiFormRow
-        describedByIds={Array []}
-        display="row"
-        hasChildLabel={true}
         hasEmptyLabelSpace={true}
-        labelType="label"
       >
         <EuiToolTip
           content={
@@ -419,11 +354,7 @@ exports[`CustomUrlList renders a list of custom URLs 1`] = `
       grow={false}
     >
       <EuiFormRow
-        describedByIds={Array []}
-        display="row"
-        hasChildLabel={true}
         hasEmptyLabelSpace={true}
-        labelType="label"
       >
         <EuiToolTip
           content={
diff --git a/x-pack/plugins/ml/public/application/components/job_selector/job_selector_table/job_selector_table.test.js b/x-pack/plugins/ml/public/application/components/job_selector/job_selector_table/job_selector_table.test.js
index 72d8040980bad..f5395fb852d34 100644
--- a/x-pack/plugins/ml/public/application/components/job_selector/job_selector_table/job_selector_table.test.js
+++ b/x-pack/plugins/ml/public/application/components/job_selector/job_selector_table/job_selector_table.test.js
@@ -113,14 +113,14 @@ describe('JobSelectorTable', () => {
       const singleSelectionProps = { ...props, singleSelection: true };
       const { getByTestId } = render(<JobSelectorTable {...singleSelectionProps} />);
       const radioButton = getByTestId('price-by-day-radio-button');
-      expect(radioButton.firstChild.checked).toEqual(true);
+      expect(radioButton.querySelector('input').checked).toEqual(true);
     });
 
     test('job cannot be selected if it is not a single metric viewer job', () => {
       const timeseriesOnlyProps = { ...props, singleSelection: true, timeseriesOnly: true };
       const { getByTestId } = render(<JobSelectorTable {...timeseriesOnlyProps} />);
       const radioButton = getByTestId('non-timeseries-job-radio-button');
-      expect(radioButton.firstChild.disabled).toEqual(true);
+      expect(radioButton.querySelector('input').disabled).toEqual(true);
     });
   });
 
diff --git a/x-pack/plugins/ml/public/application/components/rule_editor/_rule_editor.scss b/x-pack/plugins/ml/public/application/components/rule_editor/_rule_editor.scss
index 09605c4016565..41f21fc98a381 100644
--- a/x-pack/plugins/ml/public/application/components/rule_editor/_rule_editor.scss
+++ b/x-pack/plugins/ml/public/application/components/rule_editor/_rule_editor.scss
@@ -34,7 +34,7 @@
 
   // SASSTODO: Dangerous EUI overwrite
   .scope-enable-checkbox {
-    .euiCheckbox__input[disabled] ~ .euiCheckbox__label {
+    .euiCheckbox__label {
       color: inherit;
     }
   }
diff --git a/x-pack/plugins/ml/public/application/settings/calendars/edit/calendar_form/__snapshots__/calendar_form.test.js.snap b/x-pack/plugins/ml/public/application/settings/calendars/edit/calendar_form/__snapshots__/calendar_form.test.js.snap
index b6e419a040062..39098fa671fcd 100644
--- a/x-pack/plugins/ml/public/application/settings/calendars/edit/calendar_form/__snapshots__/calendar_form.test.js.snap
+++ b/x-pack/plugins/ml/public/application/settings/calendars/edit/calendar_form/__snapshots__/calendar_form.test.js.snap
@@ -13,15 +13,11 @@ exports[`CalendarForm Renders calendar form 1`] = `
     />
   </MlPageHeader>
   <EuiFormRow
-    describedByIds={Array []}
-    display="row"
     error={
       Array [
         "Use lowercase alphanumerics (a-z and 0-9), hyphens or underscores; must start and end with an alphanumeric character",
       ]
     }
-    hasChildLabel={true}
-    hasEmptyLabelSpace={false}
     isInvalid={true}
     label={
       <Memo(MemoizedFormattedMessage)
@@ -29,7 +25,6 @@ exports[`CalendarForm Renders calendar form 1`] = `
         id="xpack.ml.calendarsEdit.calendarForm.calendarIdLabel"
       />
     }
-    labelType="label"
   >
     <EuiFieldText
       data-test-subj="mlCalendarIdInput"
@@ -40,17 +35,12 @@ exports[`CalendarForm Renders calendar form 1`] = `
     />
   </EuiFormRow>
   <EuiFormRow
-    describedByIds={Array []}
-    display="row"
-    hasChildLabel={true}
-    hasEmptyLabelSpace={false}
     label={
       <Memo(MemoizedFormattedMessage)
         defaultMessage="Description"
         id="xpack.ml.calendarsEdit.calendarForm.descriptionLabel"
       />
     }
-    labelType="label"
   >
     <EuiFieldText
       data-test-subj="mlCalendarDescriptionInput"
@@ -79,17 +69,12 @@ exports[`CalendarForm Renders calendar form 1`] = `
     size="m"
   />
   <EuiFormRow
-    describedByIds={Array []}
-    display="row"
-    hasChildLabel={true}
-    hasEmptyLabelSpace={false}
     label={
       <Memo(MemoizedFormattedMessage)
         defaultMessage="Jobs"
         id="xpack.ml.calendarsEdit.calendarForm.jobsLabel"
       />
     }
-    labelType="label"
   >
     <EuiComboBox
       async={false}
@@ -107,17 +92,12 @@ exports[`CalendarForm Renders calendar form 1`] = `
     />
   </EuiFormRow>
   <EuiFormRow
-    describedByIds={Array []}
-    display="row"
-    hasChildLabel={true}
-    hasEmptyLabelSpace={false}
     label={
       <Memo(MemoizedFormattedMessage)
         defaultMessage="Groups"
         id="xpack.ml.calendarsEdit.calendarForm.groupsLabel"
       />
     }
-    labelType="label"
   >
     <EuiComboBox
       async={false}
@@ -139,18 +119,13 @@ exports[`CalendarForm Renders calendar form 1`] = `
     size="xl"
   />
   <EuiFormRow
-    describedByIds={Array []}
-    display="row"
     fullWidth={true}
-    hasChildLabel={true}
-    hasEmptyLabelSpace={false}
     label={
       <Memo(MemoizedFormattedMessage)
         defaultMessage="Events"
         id="xpack.ml.calendarsEdit.calendarForm.eventsLabel"
       />
     }
-    labelType="label"
   >
     <EventsTable
       canCreateCalendar={true}
diff --git a/x-pack/plugins/ml/public/application/settings/filter_lists/components/add_item_popover/__snapshots__/add_item_popover.test.js.snap b/x-pack/plugins/ml/public/application/settings/filter_lists/components/add_item_popover/__snapshots__/add_item_popover.test.js.snap
index 61cbe9f028874..0713ada7a053b 100644
--- a/x-pack/plugins/ml/public/application/settings/filter_lists/components/add_item_popover/__snapshots__/add_item_popover.test.js.snap
+++ b/x-pack/plugins/ml/public/application/settings/filter_lists/components/add_item_popover/__snapshots__/add_item_popover.test.js.snap
@@ -33,10 +33,6 @@ exports[`AddItemPopover calls addItems with multiple items on clicking Add butto
   >
     <EuiForm>
       <EuiFormRow
-        describedByIds={Array []}
-        display="row"
-        hasChildLabel={true}
-        hasEmptyLabelSpace={false}
         id="filter_list_add_item_input_row"
         label={
           <Memo(MemoizedFormattedMessage)
@@ -44,7 +40,6 @@ exports[`AddItemPopover calls addItems with multiple items on clicking Add butto
             id="xpack.ml.settings.filterLists.addItemPopover.itemsLabel"
           />
         }
-        labelType="label"
       >
         <EuiTextArea
           data-test-subj="mlFilterListAddItemTextArea"
@@ -119,10 +114,6 @@ exports[`AddItemPopover opens the popover onButtonClick 1`] = `
   >
     <EuiForm>
       <EuiFormRow
-        describedByIds={Array []}
-        display="row"
-        hasChildLabel={true}
-        hasEmptyLabelSpace={false}
         id="filter_list_add_item_input_row"
         label={
           <Memo(MemoizedFormattedMessage)
@@ -130,7 +121,6 @@ exports[`AddItemPopover opens the popover onButtonClick 1`] = `
             id="xpack.ml.settings.filterLists.addItemPopover.itemsLabel"
           />
         }
-        labelType="label"
       >
         <EuiTextArea
           data-test-subj="mlFilterListAddItemTextArea"
@@ -205,10 +195,6 @@ exports[`AddItemPopover renders the popover 1`] = `
   >
     <EuiForm>
       <EuiFormRow
-        describedByIds={Array []}
-        display="row"
-        hasChildLabel={true}
-        hasEmptyLabelSpace={false}
         id="filter_list_add_item_input_row"
         label={
           <Memo(MemoizedFormattedMessage)
@@ -216,7 +202,6 @@ exports[`AddItemPopover renders the popover 1`] = `
             id="xpack.ml.settings.filterLists.addItemPopover.itemsLabel"
           />
         }
-        labelType="label"
       >
         <EuiTextArea
           data-test-subj="mlFilterListAddItemTextArea"
diff --git a/x-pack/plugins/ml/public/application/settings/filter_lists/components/edit_description_popover/__snapshots__/edit_description_popover.test.js.snap b/x-pack/plugins/ml/public/application/settings/filter_lists/components/edit_description_popover/__snapshots__/edit_description_popover.test.js.snap
index 57e136cda0ac8..1a8b962c1f146 100644
--- a/x-pack/plugins/ml/public/application/settings/filter_lists/components/edit_description_popover/__snapshots__/edit_description_popover.test.js.snap
+++ b/x-pack/plugins/ml/public/application/settings/filter_lists/components/edit_description_popover/__snapshots__/edit_description_popover.test.js.snap
@@ -34,10 +34,6 @@ exports[`FilterListUsagePopover opens the popover onButtonClick 1`] = `
     >
       <EuiForm>
         <EuiFormRow
-          describedByIds={Array []}
-          display="row"
-          hasChildLabel={true}
-          hasEmptyLabelSpace={false}
           id="filter_list_edit_description_row"
           label={
             <Memo(MemoizedFormattedMessage)
@@ -45,7 +41,6 @@ exports[`FilterListUsagePopover opens the popover onButtonClick 1`] = `
               id="xpack.ml.settings.filterLists.editDescriptionPopover.filterListDescriptionAriaLabel"
             />
           }
-          labelType="label"
         >
           <EuiFieldText
             data-test-subj="mlFilterListDescriptionInput"
@@ -94,10 +89,6 @@ exports[`FilterListUsagePopover renders the popover with a description 1`] = `
     >
       <EuiForm>
         <EuiFormRow
-          describedByIds={Array []}
-          display="row"
-          hasChildLabel={true}
-          hasEmptyLabelSpace={false}
           id="filter_list_edit_description_row"
           label={
             <Memo(MemoizedFormattedMessage)
@@ -105,7 +96,6 @@ exports[`FilterListUsagePopover renders the popover with a description 1`] = `
               id="xpack.ml.settings.filterLists.editDescriptionPopover.filterListDescriptionAriaLabel"
             />
           }
-          labelType="label"
         >
           <EuiFieldText
             data-test-subj="mlFilterListDescriptionInput"
@@ -154,10 +144,6 @@ exports[`FilterListUsagePopover renders the popover with no description 1`] = `
     >
       <EuiForm>
         <EuiFormRow
-          describedByIds={Array []}
-          display="row"
-          hasChildLabel={true}
-          hasEmptyLabelSpace={false}
           id="filter_list_edit_description_row"
           label={
             <Memo(MemoizedFormattedMessage)
@@ -165,7 +151,6 @@ exports[`FilterListUsagePopover renders the popover with no description 1`] = `
               id="xpack.ml.settings.filterLists.editDescriptionPopover.filterListDescriptionAriaLabel"
             />
           }
-          labelType="label"
         >
           <EuiFieldText
             data-test-subj="mlFilterListDescriptionInput"
diff --git a/x-pack/plugins/ml/public/application/settings/filter_lists/edit/__snapshots__/header.test.js.snap b/x-pack/plugins/ml/public/application/settings/filter_lists/edit/__snapshots__/header.test.js.snap
index b9c0464e572b4..87ac86f5c9178 100644
--- a/x-pack/plugins/ml/public/application/settings/filter_lists/edit/__snapshots__/header.test.js.snap
+++ b/x-pack/plugins/ml/public/application/settings/filter_lists/edit/__snapshots__/header.test.js.snap
@@ -46,10 +46,6 @@ exports[`EditFilterListHeader renders the header when creating a new filter list
     size="m"
   />
   <EuiFormRow
-    describedByIds={Array []}
-    display="row"
-    hasChildLabel={true}
-    hasEmptyLabelSpace={false}
     helpText="Use lowercase alphanumerics (a-z and 0-9), hyphens or underscores; must start and end with an alphanumeric character"
     isInvalid={false}
     label={
@@ -58,7 +54,6 @@ exports[`EditFilterListHeader renders the header when creating a new filter list
         id="xpack.ml.settings.filterLists.editFilterHeader.filterListIdAriaLabel"
       />
     }
-    labelType="label"
   >
     <EuiFieldText
       data-test-subj="mlNewFilterListIdInput"
@@ -146,15 +141,11 @@ exports[`EditFilterListHeader renders the header when creating a new filter list
     size="m"
   />
   <EuiFormRow
-    describedByIds={Array []}
-    display="row"
     error={
       Array [
         "Use lowercase alphanumerics (a-z and 0-9), hyphens or underscores; must start and end with an alphanumeric character",
       ]
     }
-    hasChildLabel={true}
-    hasEmptyLabelSpace={false}
     isInvalid={true}
     label={
       <Memo(MemoizedFormattedMessage)
@@ -162,7 +153,6 @@ exports[`EditFilterListHeader renders the header when creating a new filter list
         id="xpack.ml.settings.filterLists.editFilterHeader.filterListIdAriaLabel"
       />
     }
-    labelType="label"
   >
     <EuiFieldText
       data-test-subj="mlNewFilterListIdInput"
diff --git a/x-pack/plugins/monitoring/public/components/metricbeat_migration/flyout/__snapshots__/flyout.test.js.snap b/x-pack/plugins/monitoring/public/components/metricbeat_migration/flyout/__snapshots__/flyout.test.js.snap
index 1a20d0da6b312..2a76325174258 100644
--- a/x-pack/plugins/monitoring/public/components/metricbeat_migration/flyout/__snapshots__/flyout.test.js.snap
+++ b/x-pack/plugins/monitoring/public/components/metricbeat_migration/flyout/__snapshots__/flyout.test.js.snap
@@ -21,15 +21,10 @@ exports[`Flyout apm part one should render normally 1`] = `
   <EuiFlyoutBody>
     <EuiForm>
       <EuiFormRow
-        describedByIds={Array []}
-        display="row"
         fullWidth={true}
-        hasChildLabel={true}
-        hasEmptyLabelSpace={false}
         helpText="Typically a single URL. If multiple URLs, separate with a comma.
                 The running Metricbeat instance must be able to communicate with these Elasticsearch servers."
         label="URL of monitoring cluster"
-        labelType="label"
       >
         <EuiFieldText
           fullWidth={true}
@@ -349,15 +344,10 @@ exports[`Flyout beats part one should render normally 1`] = `
   <EuiFlyoutBody>
     <EuiForm>
       <EuiFormRow
-        describedByIds={Array []}
-        display="row"
         fullWidth={true}
-        hasChildLabel={true}
-        hasEmptyLabelSpace={false}
         helpText="Typically a single URL. If multiple URLs, separate with a comma.
                 The running Metricbeat instance must be able to communicate with these Elasticsearch servers."
         label="URL of monitoring cluster"
-        labelType="label"
       >
         <EuiFieldText
           fullWidth={true}
@@ -719,15 +709,10 @@ exports[`Flyout elasticsearch part one should render normally 1`] = `
   <EuiFlyoutBody>
     <EuiForm>
       <EuiFormRow
-        describedByIds={Array []}
-        display="row"
         fullWidth={true}
-        hasChildLabel={true}
-        hasEmptyLabelSpace={false}
         helpText="Typically a single URL. If multiple URLs, separate with a comma.
                 The running Metricbeat instance must be able to communicate with these Elasticsearch servers."
         label="URL of monitoring cluster"
-        labelType="label"
       >
         <EuiFieldText
           fullWidth={true}
@@ -1050,15 +1035,10 @@ exports[`Flyout kibana part one should render normally 1`] = `
   <EuiFlyoutBody>
     <EuiForm>
       <EuiFormRow
-        describedByIds={Array []}
-        display="row"
         fullWidth={true}
-        hasChildLabel={true}
-        hasEmptyLabelSpace={false}
         helpText="Typically a single URL. If multiple URLs, separate with a comma.
                 The running Metricbeat instance must be able to communicate with these Elasticsearch servers."
         label="URL of monitoring cluster"
-        labelType="label"
       >
         <EuiFieldText
           fullWidth={true}
@@ -1388,15 +1368,10 @@ exports[`Flyout logstash part one should render normally 1`] = `
   <EuiFlyoutBody>
     <EuiForm>
       <EuiFormRow
-        describedByIds={Array []}
-        display="row"
         fullWidth={true}
-        hasChildLabel={true}
-        hasEmptyLabelSpace={false}
         helpText="Typically a single URL. If multiple URLs, separate with a comma.
                 The running Metricbeat instance must be able to communicate with these Elasticsearch servers."
         label="URL of monitoring cluster"
-        labelType="label"
       >
         <EuiFieldText
           fullWidth={true}
diff --git a/x-pack/plugins/observability_solution/uptime/public/legacy_uptime/components/certificates/__snapshots__/cert_search.test.tsx.snap b/x-pack/plugins/observability_solution/uptime/public/legacy_uptime/components/certificates/__snapshots__/cert_search.test.tsx.snap
index 8bb42eaa7a5eb..663ef61fc87db 100644
--- a/x-pack/plugins/observability_solution/uptime/public/legacy_uptime/components/certificates/__snapshots__/cert_search.test.tsx.snap
+++ b/x-pack/plugins/observability_solution/uptime/public/legacy_uptime/components/certificates/__snapshots__/cert_search.test.tsx.snap
@@ -9,17 +9,17 @@ exports[`CertificatesSearch renders expected elements for valid props 1`] = `
   class="c0"
 >
   <div
-    class="euiFormControlLayout euiFormControlLayout--fullWidth"
+    class="euiFormControlLayout emotion-euiFormControlLayout-fullWidth"
   >
     <div
-      class="euiFormControlLayout__childrenWrapper"
+      class="euiFormControlLayout__childrenWrapper emotion-euiFormControlLayout__childrenWrapper"
       style="--euiFormControlLeftIconsCount:1"
     >
       <div
-        class="euiFormControlLayoutIcons euiFormControlLayoutIcons--left euiFormControlLayoutIcons--absolute"
+        class="euiFormControlLayoutIcons emotion-euiFormControlLayoutIcons-absolute-left"
       >
         <span
-          class="euiFormControlLayoutCustomIcon"
+          class="euiFormControlLayoutCustomIcon emotion-euiFormControlLayoutCustomIcon"
         >
           <span
             aria-hidden="true"
diff --git a/x-pack/plugins/observability_solution/uptime/public/legacy_uptime/components/monitor/status_details/__snapshots__/monitor_status.bar.test.tsx.snap b/x-pack/plugins/observability_solution/uptime/public/legacy_uptime/components/monitor/status_details/__snapshots__/monitor_status.bar.test.tsx.snap
index cae02bf400e2d..380070d4d173e 100644
--- a/x-pack/plugins/observability_solution/uptime/public/legacy_uptime/components/monitor/status_details/__snapshots__/monitor_status.bar.test.tsx.snap
+++ b/x-pack/plugins/observability_solution/uptime/public/legacy_uptime/components/monitor/status_details/__snapshots__/monitor_status.bar.test.tsx.snap
@@ -86,34 +86,30 @@ Array [
       class="euiPopover emotion-euiPopover-inline-block"
     >
       <div
-        class="euiFormRow"
+        class="euiFormRow emotion-euiFormRow"
         id="generated-id-row"
       >
         <div
           class="euiFormRow__fieldWrapper"
         >
           <div
-            class="euiSwitch euiSwitch--compressed emotion-euiSwitch"
+            class="euiSwitch emotion-euiSwitch"
           >
             <button
               aria-checked="false"
               aria-label="Enable status alerts"
-              class="euiSwitch__button"
+              class="euiSwitch__button emotion-euiSwitch__button-compressed"
               data-test-subj="uptimeDisplayDefineConnector"
               id="generated-id"
               role="switch"
               type="button"
             >
               <span
-                class="euiSwitch__body"
-              >
-                <span
-                  class="euiSwitch__thumb"
-                />
-                <span
-                  class="euiSwitch__track"
-                />
-              </span>
+                class="euiSwitch__body emotion-euiSwitch__body-off"
+              />
+              <span
+                class="euiSwitch__thumb emotion-euiSwitch__thumb-off"
+              />
             </button>
           </div>
         </div>
diff --git a/x-pack/plugins/remote_clusters/public/application/sections/components/remote_cluster_form/components/connection_mode.tsx b/x-pack/plugins/remote_clusters/public/application/sections/components/remote_cluster_form/components/connection_mode.tsx
index f44f5ffc0cf9c..b51d389b73014 100644
--- a/x-pack/plugins/remote_clusters/public/application/sections/components/remote_cluster_form/components/connection_mode.tsx
+++ b/x-pack/plugins/remote_clusters/public/application/sections/components/remote_cluster_form/components/connection_mode.tsx
@@ -52,7 +52,7 @@ export const ConnectionMode: FunctionComponent<Props> = (props) => {
               id="xpack.remoteClusters.remoteClusterForm.sectionModeDescription"
               defaultMessage="Use seed nodes by default, or switch to proxy mode."
             />
-            <EuiFormRow hasEmptyLabelSpace fullWidth>
+            <EuiFormRow fullWidth>
               <EuiSwitch
                 label={
                   <FormattedMessage
diff --git a/x-pack/plugins/remote_clusters/public/application/sections/components/remote_cluster_form/components/connection_mode_cloud.tsx b/x-pack/plugins/remote_clusters/public/application/sections/components/remote_cluster_form/components/connection_mode_cloud.tsx
index 42dc257b4baf3..b5d27b15de8e2 100644
--- a/x-pack/plugins/remote_clusters/public/application/sections/components/remote_cluster_form/components/connection_mode_cloud.tsx
+++ b/x-pack/plugins/remote_clusters/public/application/sections/components/remote_cluster_form/components/connection_mode_cloud.tsx
@@ -57,7 +57,7 @@ export const ConnectionModeCloud: FunctionComponent<Props> = (props) => {
             id="xpack.remoteClusters.remoteClusterForm.sectionModeCloudDescription"
             defaultMessage="Configure how to connect to the remote cluster."
           />
-          <EuiFormRow hasEmptyLabelSpace fullWidth>
+          <EuiFormRow fullWidth>
             <EuiSwitch
               label={
                 <FormattedMessage
diff --git a/x-pack/plugins/remote_clusters/public/application/sections/components/remote_cluster_form/remote_cluster_form.tsx b/x-pack/plugins/remote_clusters/public/application/sections/components/remote_cluster_form/remote_cluster_form.tsx
index 22415edc091a9..e92c515c4162f 100644
--- a/x-pack/plugins/remote_clusters/public/application/sections/components/remote_cluster_form/remote_cluster_form.tsx
+++ b/x-pack/plugins/remote_clusters/public/application/sections/components/remote_cluster_form/remote_cluster_form.tsx
@@ -287,7 +287,6 @@ export class RemoteClusterForm extends Component<Props, State> {
         <EuiFormRow
           data-test-subj="remoteClusterFormSkipUnavailableFormRow"
           className="remoteClusterSkipIfUnavailableSwitch"
-          hasEmptyLabelSpace
           fullWidth
           helpText={
             skipUnavailable !== defaultClusterValues.skipUnavailable ? (
diff --git a/x-pack/plugins/security/public/authentication/login/components/login_form/__snapshots__/login_form.test.tsx.snap b/x-pack/plugins/security/public/authentication/login/components/login_form/__snapshots__/login_form.test.tsx.snap
index 7cc042c8d61fc..eaee59a36e858 100644
--- a/x-pack/plugins/security/public/authentication/login/components/login_form/__snapshots__/login_form.test.tsx.snap
+++ b/x-pack/plugins/security/public/authentication/login/components/login_form/__snapshots__/login_form.test.tsx.snap
@@ -57,10 +57,6 @@ exports[`LoginForm renders as expected 1`] = `
       onSubmit={[Function]}
     >
       <EuiFormRow
-        describedByIds={Array []}
-        display="row"
-        hasChildLabel={true}
-        hasEmptyLabelSpace={false}
         isInvalid={false}
         label={
           <Memo(MemoizedFormattedMessage)
@@ -68,7 +64,6 @@ exports[`LoginForm renders as expected 1`] = `
             id="xpack.security.login.basicLoginForm.usernameFormRowLabel"
           />
         }
-        labelType="label"
       >
         <EuiFieldText
           aria-required={true}
@@ -84,10 +79,6 @@ exports[`LoginForm renders as expected 1`] = `
         />
       </EuiFormRow>
       <EuiFormRow
-        describedByIds={Array []}
-        display="row"
-        hasChildLabel={true}
-        hasEmptyLabelSpace={false}
         isInvalid={false}
         label={
           <Memo(MemoizedFormattedMessage)
@@ -95,7 +86,6 @@ exports[`LoginForm renders as expected 1`] = `
             id="xpack.security.login.basicLoginForm.passwordFormRowLabel"
           />
         }
-        labelType="label"
       >
         <EuiFieldPassword
           aria-required={true}
diff --git a/x-pack/plugins/security/public/management/roles/edit_role/privileges/es/__snapshots__/elasticsearch_privileges.test.tsx.snap b/x-pack/plugins/security/public/management/roles/edit_role/privileges/es/__snapshots__/elasticsearch_privileges.test.tsx.snap
index ccb8decacd812..38f88b6763b63 100644
--- a/x-pack/plugins/security/public/management/roles/edit_role/privileges/es/__snapshots__/elasticsearch_privileges.test.tsx.snap
+++ b/x-pack/plugins/security/public/management/roles/edit_role/privileges/es/__snapshots__/elasticsearch_privileges.test.tsx.snap
@@ -34,12 +34,8 @@ exports[`it renders correctly in serverless mode 1`] = `
     }
   >
     <EuiFormRow
-      describedByIds={Array []}
-      display="row"
       fullWidth={true}
-      hasChildLabel={true}
       hasEmptyLabelSpace={true}
-      labelType="label"
     >
       <ClusterPrivileges
         builtinClusterPrivileges={
@@ -187,12 +183,8 @@ exports[`it renders without crashing 1`] = `
     }
   >
     <EuiFormRow
-      describedByIds={Array []}
-      display="row"
       fullWidth={true}
-      hasChildLabel={true}
       hasEmptyLabelSpace={true}
-      labelType="label"
     >
       <ClusterPrivileges
         builtinClusterPrivileges={
diff --git a/x-pack/plugins/security/public/management/roles/edit_role/privileges/es/__snapshots__/index_privilege_form.test.tsx.snap b/x-pack/plugins/security/public/management/roles/edit_role/privileges/es/__snapshots__/index_privilege_form.test.tsx.snap
index 5107e8abf2e0b..83670e9f799e7 100644
--- a/x-pack/plugins/security/public/management/roles/edit_role/privileges/es/__snapshots__/index_privilege_form.test.tsx.snap
+++ b/x-pack/plugins/security/public/management/roles/edit_role/privileges/es/__snapshots__/index_privilege_form.test.tsx.snap
@@ -35,11 +35,7 @@ exports[`it renders without crashing 1`] = `
         >
           <EuiFlexItem>
             <EuiFormRow
-              describedByIds={Array []}
-              display="row"
               fullWidth={true}
-              hasChildLabel={true}
-              hasEmptyLabelSpace={false}
               isInvalid={false}
               label={
                 <Memo(MemoizedFormattedMessage)
@@ -47,7 +43,6 @@ exports[`it renders without crashing 1`] = `
                   id="xpack.security.management.editRole.indexPrivilegeForm.indicesFormRowLabel"
                 />
               }
-              labelType="label"
             >
               <EuiComboBox
                 async={false}
@@ -69,11 +64,7 @@ exports[`it renders without crashing 1`] = `
           </EuiFlexItem>
           <EuiFlexItem>
             <EuiFormRow
-              describedByIds={Array []}
-              display="row"
               fullWidth={true}
-              hasChildLabel={true}
-              hasEmptyLabelSpace={false}
               isInvalid={false}
               label={
                 <Memo(MemoizedFormattedMessage)
@@ -81,7 +72,6 @@ exports[`it renders without crashing 1`] = `
                   id="xpack.security.management.editRole.indexPrivilegeForm.privilegesFormRowLabel"
                 />
               }
-              labelType="label"
             >
               <EuiComboBox
                 async={false}
diff --git a/x-pack/plugins/security/public/management/roles/edit_role/privileges/es/__snapshots__/remote_cluster_privileges_form.test.tsx.snap b/x-pack/plugins/security/public/management/roles/edit_role/privileges/es/__snapshots__/remote_cluster_privileges_form.test.tsx.snap
index 2e7355cdceaae..dc799546e533b 100644
--- a/x-pack/plugins/security/public/management/roles/edit_role/privileges/es/__snapshots__/remote_cluster_privileges_form.test.tsx.snap
+++ b/x-pack/plugins/security/public/management/roles/edit_role/privileges/es/__snapshots__/remote_cluster_privileges_form.test.tsx.snap
@@ -32,11 +32,7 @@ exports[`it renders without crashing 1`] = `
         >
           <EuiFlexItem>
             <EuiFormRow
-              describedByIds={Array []}
-              display="row"
               fullWidth={true}
-              hasChildLabel={true}
-              hasEmptyLabelSpace={false}
               isInvalid={false}
               label={
                 <Memo(MemoizedFormattedMessage)
@@ -44,7 +40,6 @@ exports[`it renders without crashing 1`] = `
                   id="xpack.security.management.editRole.remoteClusterPrivilegeForm.clustersFormRowLabel"
                 />
               }
-              labelType="label"
             >
               <RemoteClusterComboBox
                 data-test-subj="remoteClusterClustersInput0"
@@ -67,11 +62,7 @@ exports[`it renders without crashing 1`] = `
           </EuiFlexItem>
           <EuiFlexItem>
             <EuiFormRow
-              describedByIds={Array []}
-              display="row"
               fullWidth={true}
-              hasChildLabel={true}
-              hasEmptyLabelSpace={false}
               isInvalid={false}
               label={
                 <Memo(MemoizedFormattedMessage)
@@ -79,7 +70,6 @@ exports[`it renders without crashing 1`] = `
                   id="xpack.security.management.editRole.remoteClusterPrivilegeForm.privilegesFormRowLabel"
                 />
               }
-              labelType="label"
             >
               <EuiComboBox
                 async={false}
diff --git a/x-pack/plugins/security/public/management/roles/edit_role/privileges/es/index_privilege_form.test.tsx b/x-pack/plugins/security/public/management/roles/edit_role/privileges/es/index_privilege_form.test.tsx
index dc7ebaf3b3069..10e179379c619 100644
--- a/x-pack/plugins/security/public/management/roles/edit_role/privileges/es/index_privilege_form.test.tsx
+++ b/x-pack/plugins/security/public/management/roles/edit_role/privileges/es/index_privilege_form.test.tsx
@@ -425,13 +425,13 @@ describe('field level security', () => {
     const wrapper = mountWithIntl(<IndexPrivilegeForm {...testProps} />);
     expect(wrapper.find('div.indexPrivilegeForm__grantedFieldsRow')).toHaveLength(1);
     expect(wrapper.find('div.indexPrivilegeForm__deniedFieldsRow')).toHaveLength(1);
-    expect(wrapper.find('.euiFormHelpText')).toHaveLength(1);
+    expect(wrapper.find('div.euiFormHelpText')).toHaveLength(1);
   });
 
   test('it does not display a warning when fields are granted', () => {
     const wrapper = mountWithIntl(<IndexPrivilegeForm {...props} />);
     expect(wrapper.find('div.indexPrivilegeForm__grantedFieldsRow')).toHaveLength(1);
     expect(wrapper.find('div.indexPrivilegeForm__deniedFieldsRow')).toHaveLength(1);
-    expect(wrapper.find('.euiFormHelpText')).toHaveLength(0);
+    expect(wrapper.find('div.euiFormHelpText')).toHaveLength(0);
   });
 });
diff --git a/x-pack/plugins/security/public/management/roles/edit_role/privileges/kibana/simple_privilege_section/__snapshots__/simple_privilege_section.test.tsx.snap b/x-pack/plugins/security/public/management/roles/edit_role/privileges/kibana/simple_privilege_section/__snapshots__/simple_privilege_section.test.tsx.snap
index 57a49a3d4eeeb..31716e708e14b 100644
--- a/x-pack/plugins/security/public/management/roles/edit_role/privileges/kibana/simple_privilege_section/__snapshots__/simple_privilege_section.test.tsx.snap
+++ b/x-pack/plugins/security/public/management/roles/edit_role/privileges/kibana/simple_privilege_section/__snapshots__/simple_privilege_section.test.tsx.snap
@@ -20,17 +20,12 @@ exports[`<SimplePrivilegeForm> renders without crashing 1`] = `
     </EuiFlexItem>
     <EuiFlexItem>
       <EuiFormRow
-        describedByIds={Array []}
-        display="row"
-        hasChildLabel={true}
-        hasEmptyLabelSpace={false}
         label={
           <Memo(MemoizedFormattedMessage)
             defaultMessage="Kibana privileges"
             id="xpack.security.management.editRole.simplePrivilegeForm.kibanaPrivilegesTitle"
           />
         }
-        labelType="label"
       >
         <EuiSuperSelect
           compressed={false}
diff --git a/x-pack/plugins/security/public/management/users/edit_user/create_user_page.test.tsx b/x-pack/plugins/security/public/management/users/edit_user/create_user_page.test.tsx
index 7771560826f6f..1dbcd659f25b1 100644
--- a/x-pack/plugins/security/public/management/users/edit_user/create_user_page.test.tsx
+++ b/x-pack/plugins/security/public/management/users/edit_user/create_user_page.test.tsx
@@ -17,6 +17,7 @@ import { Providers } from '../users_management_app';
 
 jest.mock('@elastic/eui/lib/services/accessibility/html_id_generator', () => ({
   htmlIdGenerator: () => () => `id-${Math.random()}`,
+  useGeneratedHtmlId: () => `id-${Math.random()}`,
 }));
 
 describe('CreateUserPage', () => {
diff --git a/x-pack/plugins/security_solution/public/common/components/import_data_modal/__snapshots__/index.test.tsx.snap b/x-pack/plugins/security_solution/public/common/components/import_data_modal/__snapshots__/index.test.tsx.snap
index 1c2e4f3cf3fdd..4ca53999b7459 100644
--- a/x-pack/plugins/security_solution/public/common/components/import_data_modal/__snapshots__/index.test.tsx.snap
+++ b/x-pack/plugins/security_solution/public/common/components/import_data_modal/__snapshots__/index.test.tsx.snap
@@ -97,17 +97,22 @@ Object {
               <div
                 class="euiCheckbox emotion-euiCheckbox"
               >
-                <input
-                  class="euiCheckbox__input"
-                  data-test-subj="importDataModalCheckboxLabel"
-                  id="importDataModalCheckboxLabel"
-                  type="checkbox"
-                />
                 <div
-                  class="euiCheckbox__square"
-                />
+                  class="euiCheckbox__square emotion-euiCheckbox__square-unselected"
+                >
+                  <span
+                    class="emotion-euiCheckbox__icon-check"
+                    data-euiicon-type="empty"
+                  />
+                  <input
+                    class="euiCheckbox__input emotion-euiCheckbox__input"
+                    data-test-subj="importDataModalCheckboxLabel"
+                    id="importDataModalCheckboxLabel"
+                    type="checkbox"
+                  />
+                </div>
                 <label
-                  class="euiCheckbox__label"
+                  class="euiCheckbox__label emotion-euiCheckbox__label"
                   for="importDataModalCheckboxLabel"
                 >
                   checkBoxLabel
@@ -384,17 +389,22 @@ Object {
               <div
                 class="euiCheckbox emotion-euiCheckbox"
               >
-                <input
-                  class="euiCheckbox__input"
-                  data-test-subj="importDataModalCheckboxLabel"
-                  id="importDataModalCheckboxLabel"
-                  type="checkbox"
-                />
                 <div
-                  class="euiCheckbox__square"
-                />
+                  class="euiCheckbox__square emotion-euiCheckbox__square-unselected"
+                >
+                  <span
+                    class="emotion-euiCheckbox__icon-check"
+                    data-euiicon-type="empty"
+                  />
+                  <input
+                    class="euiCheckbox__input emotion-euiCheckbox__input"
+                    data-test-subj="importDataModalCheckboxLabel"
+                    id="importDataModalCheckboxLabel"
+                    type="checkbox"
+                  />
+                </div>
                 <label
-                  class="euiCheckbox__label"
+                  class="euiCheckbox__label emotion-euiCheckbox__label"
                   for="importDataModalCheckboxLabel"
                 >
                   checkBoxLabel
@@ -607,17 +617,22 @@ Object {
               <div
                 class="euiCheckbox emotion-euiCheckbox"
               >
-                <input
-                  class="euiCheckbox__input"
-                  data-test-subj="importDataModalCheckboxLabel"
-                  id="importDataModalCheckboxLabel"
-                  type="checkbox"
-                />
                 <div
-                  class="euiCheckbox__square"
-                />
+                  class="euiCheckbox__square emotion-euiCheckbox__square-unselected"
+                >
+                  <span
+                    class="emotion-euiCheckbox__icon-check"
+                    data-euiicon-type="empty"
+                  />
+                  <input
+                    class="euiCheckbox__input emotion-euiCheckbox__input"
+                    data-test-subj="importDataModalCheckboxLabel"
+                    id="importDataModalCheckboxLabel"
+                    type="checkbox"
+                  />
+                </div>
                 <label
-                  class="euiCheckbox__label"
+                  class="euiCheckbox__label emotion-euiCheckbox__label"
                   for="importDataModalCheckboxLabel"
                 >
                   checkBoxLabel
diff --git a/x-pack/plugins/security_solution/public/detections/components/alerts_kpis/alerts_histogram_panel/index.test.tsx b/x-pack/plugins/security_solution/public/detections/components/alerts_kpis/alerts_histogram_panel/index.test.tsx
index 8a14499740444..b19f8b8ad607a 100644
--- a/x-pack/plugins/security_solution/public/detections/components/alerts_kpis/alerts_histogram_panel/index.test.tsx
+++ b/x-pack/plugins/security_solution/public/detections/components/alerts_kpis/alerts_histogram_panel/index.test.tsx
@@ -215,9 +215,7 @@ describe('AlertsHistogramPanel', () => {
         </TestProviders>
       );
 
-      expect(wrapper.find('label.euiFormControlLayout__prepend').first().text()).toEqual(
-        'Stack by'
-      );
+      expect(wrapper.find('.euiFormControlLayout__prepend').first().text()).toEqual('Stack by');
     });
 
     test('it prepends a custom stack by label when `stackByLabel` is provided', () => {
@@ -229,9 +227,7 @@ describe('AlertsHistogramPanel', () => {
         </TestProviders>
       );
 
-      expect(wrapper.find('label.euiFormControlLayout__prepend').first().text()).toEqual(
-        stackByLabel
-      );
+      expect(wrapper.find('.euiFormControlLayout__prepend').first().text()).toEqual(stackByLabel);
     });
   });
 
diff --git a/x-pack/plugins/security_solution/public/sourcerer/components/timeline_sourcerer.test.tsx b/x-pack/plugins/security_solution/public/sourcerer/components/timeline_sourcerer.test.tsx
index 5da9a145af479..ff86241164631 100644
--- a/x-pack/plugins/security_solution/public/sourcerer/components/timeline_sourcerer.test.tsx
+++ b/x-pack/plugins/security_solution/public/sourcerer/components/timeline_sourcerer.test.tsx
@@ -92,9 +92,9 @@ describe('timeline sourcerer', () => {
 
   it('renders "alerts only" checkbox, unchecked', async () => {
     await waitFor(() => {
-      expect(screen.getByTestId('sourcerer-alert-only-checkbox').parentElement).toHaveTextContent(
-        'Show only detection alerts'
-      );
+      expect(
+        screen.getByTestId('sourcerer-alert-only-checkbox').parentElement?.parentElement
+      ).toHaveTextContent('Show only detection alerts');
       expect(screen.getByTestId('sourcerer-alert-only-checkbox')).not.toBeChecked();
     });
 
diff --git a/x-pack/plugins/security_solution/public/timelines/components/open_timeline/index.test.tsx b/x-pack/plugins/security_solution/public/timelines/components/open_timeline/index.test.tsx
index 68f6071200ec1..812d59cc1296b 100644
--- a/x-pack/plugins/security_solution/public/timelines/components/open_timeline/index.test.tsx
+++ b/x-pack/plugins/security_solution/public/timelines/components/open_timeline/index.test.tsx
@@ -363,7 +363,7 @@ describe('StatefulOpenTimeline', () => {
 
       await waitFor(() => {
         wrapper
-          .find('.euiCheckbox__input')
+          .find('input.euiCheckbox__input')
           .first()
           .simulate('change', { target: { checked: true } });
 
@@ -425,7 +425,7 @@ describe('StatefulOpenTimeline', () => {
 
       await waitFor(() => {
         wrapper
-          .find('.euiCheckbox__input')
+          .find('input.euiCheckbox__input')
           .first()
           .simulate('change', { target: { checked: true } });
 
@@ -637,7 +637,7 @@ describe('StatefulOpenTimeline', () => {
       await waitFor(() => {
         expect(getSelectedItem().length).toEqual(0);
         wrapper
-          .find('.euiCheckbox__input')
+          .find('input.euiCheckbox__input')
           .first()
           .simulate('change', { target: { checked: true } });
         expect(getSelectedItem().length).toEqual(13);
diff --git a/x-pack/plugins/snapshot_restore/public/application/components/policy_form/_policy_form.scss b/x-pack/plugins/snapshot_restore/public/application/components/policy_form/_policy_form.scss
index 389e925f392c2..0f2422a4c54f0 100644
--- a/x-pack/plugins/snapshot_restore/public/application/components/policy_form/_policy_form.scss
+++ b/x-pack/plugins/snapshot_restore/public/application/components/policy_form/_policy_form.scss
@@ -1,13 +1,3 @@
-/*
- * Prevent switch controls from moving around when toggling content
- */
-.snapshotRestore__policyForm__stepSettings {
-  .euiFormRow--hasEmptyLabelSpace {
-    min-height: auto;
-    margin-top: $euiFontSizeXS + $euiSizeS + calc($euiSizeXXL / 4);
-  }
-}
-
 /*
  * Allow toggle mode link in indices field label to be flushed right
  */
diff --git a/x-pack/plugins/snapshot_restore/public/application/components/policy_form/steps/step_settings/fields/include_feature_states_field/include_feature_states_field.tsx b/x-pack/plugins/snapshot_restore/public/application/components/policy_form/steps/step_settings/fields/include_feature_states_field/include_feature_states_field.tsx
index ee69225766f75..97da14324e44d 100644
--- a/x-pack/plugins/snapshot_restore/public/application/components/policy_form/steps/step_settings/fields/include_feature_states_field/include_feature_states_field.tsx
+++ b/x-pack/plugins/snapshot_restore/public/application/components/policy_form/steps/step_settings/fields/include_feature_states_field/include_feature_states_field.tsx
@@ -82,7 +82,7 @@ export const IncludeFeatureStatesField: FunctionComponent<Props> = ({ policy, on
       }
       fullWidth
     >
-      <EuiFormRow hasEmptyLabelSpace fullWidth>
+      <EuiFormRow fullWidth>
         <EuiSwitch
           data-test-subj="featureStatesToggle"
           label={
diff --git a/x-pack/plugins/snapshot_restore/public/application/components/policy_form/steps/step_settings/fields/include_global_state_field/include_global_state_field.tsx b/x-pack/plugins/snapshot_restore/public/application/components/policy_form/steps/step_settings/fields/include_global_state_field/include_global_state_field.tsx
index a30083f05dffd..e91e1c7bbf6b6 100644
--- a/x-pack/plugins/snapshot_restore/public/application/components/policy_form/steps/step_settings/fields/include_global_state_field/include_global_state_field.tsx
+++ b/x-pack/plugins/snapshot_restore/public/application/components/policy_form/steps/step_settings/fields/include_global_state_field/include_global_state_field.tsx
@@ -64,7 +64,7 @@ export const IncludeGlobalStateField: FunctionComponent<Props> = ({ policy, onUp
       }
       fullWidth
     >
-      <EuiFormRow hasEmptyLabelSpace fullWidth>
+      <EuiFormRow fullWidth>
         <EuiSwitch
           data-test-subj="globalStateToggle"
           label={
diff --git a/x-pack/plugins/snapshot_restore/public/application/components/policy_form/steps/step_settings/fields/indices_and_data_streams_field/indices_and_data_streams_field.tsx b/x-pack/plugins/snapshot_restore/public/application/components/policy_form/steps/step_settings/fields/indices_and_data_streams_field/indices_and_data_streams_field.tsx
index 6ffd1b1ec031b..6ad3e1704720f 100644
--- a/x-pack/plugins/snapshot_restore/public/application/components/policy_form/steps/step_settings/fields/indices_and_data_streams_field/indices_and_data_streams_field.tsx
+++ b/x-pack/plugins/snapshot_restore/public/application/components/policy_form/steps/step_settings/fields/indices_and_data_streams_field/indices_and_data_streams_field.tsx
@@ -172,7 +172,7 @@ export const IndicesAndDataStreamsField: FunctionComponent<Props> = ({
       }
       fullWidth
     >
-      <EuiFormRow hasEmptyLabelSpace fullWidth>
+      <EuiFormRow fullWidth>
         <Fragment>
           {isManagedPolicy ? (
             <EuiToolTip
diff --git a/x-pack/plugins/snapshot_restore/public/application/components/policy_form/steps/step_settings/step_settings.tsx b/x-pack/plugins/snapshot_restore/public/application/components/policy_form/steps/step_settings/step_settings.tsx
index e576a6ee090ec..64e08be6d32a5 100644
--- a/x-pack/plugins/snapshot_restore/public/application/components/policy_form/steps/step_settings/step_settings.tsx
+++ b/x-pack/plugins/snapshot_restore/public/application/components/policy_form/steps/step_settings/step_settings.tsx
@@ -71,7 +71,7 @@ export const PolicyStepSettings: React.FunctionComponent<StepProps> = ({
       }
       fullWidth
     >
-      <EuiFormRow hasEmptyLabelSpace fullWidth>
+      <EuiFormRow fullWidth>
         <EuiSwitch
           data-test-subj="ignoreUnavailableIndicesToggle"
           label={
@@ -111,7 +111,7 @@ export const PolicyStepSettings: React.FunctionComponent<StepProps> = ({
       }
       fullWidth
     >
-      <EuiFormRow hasEmptyLabelSpace fullWidth>
+      <EuiFormRow fullWidth>
         <EuiSwitch
           data-test-subj="partialIndicesToggle"
           label={
diff --git a/x-pack/plugins/snapshot_restore/public/application/components/repository_form/step_one.tsx b/x-pack/plugins/snapshot_restore/public/application/components/repository_form/step_one.tsx
index fc35e05f9b1cc..7649471f41a19 100644
--- a/x-pack/plugins/snapshot_restore/public/application/components/repository_form/step_one.tsx
+++ b/x-pack/plugins/snapshot_restore/public/application/components/repository_form/step_one.tsx
@@ -242,7 +242,6 @@ export const RepositoryFormStepOne: React.FunctionComponent<Props> = ({
           />
         </EuiText>
         <EuiFormRow
-          hasEmptyLabelSpace
           describedByIds={['repositoryTypeDescription']}
           fullWidth
           isInvalid={Boolean(hasValidationErrors && validation.errors.type)}
@@ -290,7 +289,7 @@ export const RepositoryFormStepOne: React.FunctionComponent<Props> = ({
       }
       fullWidth
     >
-      <EuiFormRow hasEmptyLabelSpace={true} fullWidth>
+      <EuiFormRow fullWidth>
         <EuiSwitch
           label={
             <FormattedMessage
diff --git a/x-pack/plugins/snapshot_restore/public/application/components/repository_form/type_settings/azure_settings.tsx b/x-pack/plugins/snapshot_restore/public/application/components/repository_form/type_settings/azure_settings.tsx
index 6c0b18ccf2082..da061fa8c2abb 100644
--- a/x-pack/plugins/snapshot_restore/public/application/components/repository_form/type_settings/azure_settings.tsx
+++ b/x-pack/plugins/snapshot_restore/public/application/components/repository_form/type_settings/azure_settings.tsx
@@ -219,7 +219,6 @@ export const AzureSettings: React.FunctionComponent<Props> = ({
         fullWidth
       >
         <EuiFormRow
-          hasEmptyLabelSpace={true}
           fullWidth
           isInvalid={Boolean(hasErrors && settingErrors.compress)}
           error={settingErrors.compress}
@@ -333,7 +332,6 @@ export const AzureSettings: React.FunctionComponent<Props> = ({
         fullWidth
       >
         <EuiFormRow
-          hasEmptyLabelSpace={true}
           fullWidth
           isInvalid={Boolean(hasErrors && settingErrors.readonly)}
           error={settingErrors.readonly}
diff --git a/x-pack/plugins/snapshot_restore/public/application/components/repository_form/type_settings/fs_settings.tsx b/x-pack/plugins/snapshot_restore/public/application/components/repository_form/type_settings/fs_settings.tsx
index bc7aafc781081..8c3111a32abd0 100644
--- a/x-pack/plugins/snapshot_restore/public/application/components/repository_form/type_settings/fs_settings.tsx
+++ b/x-pack/plugins/snapshot_restore/public/application/components/repository_form/type_settings/fs_settings.tsx
@@ -122,7 +122,6 @@ export const FSSettings: React.FunctionComponent<Props> = ({
         fullWidth
       >
         <EuiFormRow
-          hasEmptyLabelSpace={true}
           fullWidth
           isInvalid={Boolean(hasErrors && settingErrors.compress)}
           error={settingErrors.compress}
@@ -190,7 +189,6 @@ export const FSSettings: React.FunctionComponent<Props> = ({
         fullWidth
       >
         <EuiFormRow
-          hasEmptyLabelSpace={true}
           fullWidth
           isInvalid={Boolean(hasErrors && settingErrors.readonly)}
           error={settingErrors.readonly}
diff --git a/x-pack/plugins/snapshot_restore/public/application/components/repository_form/type_settings/gcs_settings.tsx b/x-pack/plugins/snapshot_restore/public/application/components/repository_form/type_settings/gcs_settings.tsx
index 4cacb7e628e07..865a628b984b6 100644
--- a/x-pack/plugins/snapshot_restore/public/application/components/repository_form/type_settings/gcs_settings.tsx
+++ b/x-pack/plugins/snapshot_restore/public/application/components/repository_form/type_settings/gcs_settings.tsx
@@ -207,7 +207,6 @@ export const GCSSettings: React.FunctionComponent<Props> = ({
         fullWidth
       >
         <EuiFormRow
-          hasEmptyLabelSpace={true}
           fullWidth
           isInvalid={Boolean(hasErrors && settingErrors.compress)}
           error={settingErrors.compress}
@@ -275,7 +274,6 @@ export const GCSSettings: React.FunctionComponent<Props> = ({
         fullWidth
       >
         <EuiFormRow
-          hasEmptyLabelSpace={true}
           fullWidth
           isInvalid={Boolean(hasErrors && settingErrors.readonly)}
           error={settingErrors.readonly}
diff --git a/x-pack/plugins/snapshot_restore/public/application/components/repository_form/type_settings/hdfs_settings.tsx b/x-pack/plugins/snapshot_restore/public/application/components/repository_form/type_settings/hdfs_settings.tsx
index c40a9765e56d2..5526b6fe006c0 100644
--- a/x-pack/plugins/snapshot_restore/public/application/components/repository_form/type_settings/hdfs_settings.tsx
+++ b/x-pack/plugins/snapshot_restore/public/application/components/repository_form/type_settings/hdfs_settings.tsx
@@ -181,7 +181,6 @@ export const HDFSSettings: React.FunctionComponent<Props> = ({
         fullWidth
       >
         <EuiFormRow
-          hasEmptyLabelSpace={true}
           fullWidth
           isInvalid={Boolean(hasErrors && settingErrors.loadDefaults)}
           error={settingErrors.loadDefaults}
@@ -225,7 +224,6 @@ export const HDFSSettings: React.FunctionComponent<Props> = ({
         fullWidth
       >
         <EuiFormRow
-          hasEmptyLabelSpace={true}
           fullWidth
           isInvalid={Boolean(hasErrors && settingErrors.compress)}
           error={settingErrors.compress}
@@ -427,7 +425,6 @@ export const HDFSSettings: React.FunctionComponent<Props> = ({
         fullWidth
       >
         <EuiFormRow
-          hasEmptyLabelSpace={true}
           fullWidth
           isInvalid={Boolean(hasErrors && settingErrors.readonly)}
           error={settingErrors.readonly}
diff --git a/x-pack/plugins/snapshot_restore/public/application/components/repository_form/type_settings/s3_settings.tsx b/x-pack/plugins/snapshot_restore/public/application/components/repository_form/type_settings/s3_settings.tsx
index 26cb2a091762a..88398315a327c 100644
--- a/x-pack/plugins/snapshot_restore/public/application/components/repository_form/type_settings/s3_settings.tsx
+++ b/x-pack/plugins/snapshot_restore/public/application/components/repository_form/type_settings/s3_settings.tsx
@@ -242,7 +242,6 @@ export const S3Settings: React.FunctionComponent<Props> = ({
         fullWidth
       >
         <EuiFormRow
-          hasEmptyLabelSpace={true}
           fullWidth
           isInvalid={Boolean(hasErrors && settingErrors.compress)}
           error={settingErrors.compress}
@@ -294,7 +293,6 @@ export const S3Settings: React.FunctionComponent<Props> = ({
         fullWidth
       >
         <EuiFormRow
-          hasEmptyLabelSpace={true}
           fullWidth
           isInvalid={Boolean(hasErrors && settingErrors.serverSideEncryption)}
           error={settingErrors.serverSideEncryption}
@@ -503,7 +501,6 @@ export const S3Settings: React.FunctionComponent<Props> = ({
         fullWidth
       >
         <EuiFormRow
-          hasEmptyLabelSpace={true}
           fullWidth
           isInvalid={Boolean(hasErrors && settingErrors.readonly)}
           error={settingErrors.readonly}
diff --git a/x-pack/plugins/snapshot_restore/public/application/components/restore_snapshot_form/_restore_snapshot_form.scss b/x-pack/plugins/snapshot_restore/public/application/components/restore_snapshot_form/_restore_snapshot_form.scss
index ec680472edf46..cbb0914ac760f 100644
--- a/x-pack/plugins/snapshot_restore/public/application/components/restore_snapshot_form/_restore_snapshot_form.scss
+++ b/x-pack/plugins/snapshot_restore/public/application/components/restore_snapshot_form/_restore_snapshot_form.scss
@@ -1,14 +1,3 @@
-/*
- * Prevent switch controls from moving around when toggling content
- */
-.snapshotRestore__restoreForm__stepLogistics,
-.snapshotRestore__restoreForm__stepSettings {
-  .euiFormRow--hasEmptyLabelSpace {
-    min-height: auto;
-    margin-top: $euiFontSizeXS + $euiSizeS + calc($euiSizeXXL / 4);
-  }
-}
-
 /*
  * Allow toggle mode link in indices field label to be flushed right
  */
diff --git a/x-pack/plugins/snapshot_restore/public/application/components/restore_snapshot_form/steps/step_logistics/step_logistics.tsx b/x-pack/plugins/snapshot_restore/public/application/components/restore_snapshot_form/steps/step_logistics/step_logistics.tsx
index 70f3255bb4d0c..46503c492d034 100644
--- a/x-pack/plugins/snapshot_restore/public/application/components/restore_snapshot_form/steps/step_logistics/step_logistics.tsx
+++ b/x-pack/plugins/snapshot_restore/public/application/components/restore_snapshot_form/steps/step_logistics/step_logistics.tsx
@@ -236,7 +236,7 @@ export const RestoreSnapshotStepLogistics: React.FunctionComponent<StepProps> =
         }
         fullWidth
       >
-        <EuiFormRow hasEmptyLabelSpace fullWidth>
+        <EuiFormRow fullWidth>
           <Fragment>
             <EuiSwitch
               label={
@@ -451,7 +451,7 @@ export const RestoreSnapshotStepLogistics: React.FunctionComponent<StepProps> =
         }
         fullWidth
       >
-        <EuiFormRow hasEmptyLabelSpace fullWidth>
+        <EuiFormRow fullWidth>
           <Fragment>
             <EuiSwitch
               label={
@@ -566,7 +566,7 @@ export const RestoreSnapshotStepLogistics: React.FunctionComponent<StepProps> =
         }
         fullWidth
       >
-        <EuiFormRow hasEmptyLabelSpace={true} fullWidth>
+        <EuiFormRow fullWidth>
           <EuiSwitch
             label={
               <FormattedMessage
@@ -601,7 +601,6 @@ export const RestoreSnapshotStepLogistics: React.FunctionComponent<StepProps> =
         fullWidth
       >
         <EuiFormRow
-          hasEmptyLabelSpace={true}
           fullWidth
           helpText={
             snapshotIncludeGlobalState ? null : (
@@ -660,7 +659,6 @@ export const RestoreSnapshotStepLogistics: React.FunctionComponent<StepProps> =
         fullWidth
       >
         <EuiFormRow
-          hasEmptyLabelSpace={true}
           fullWidth
           helpText={
             snapshotIncludeFeatureStates ? null : (
@@ -732,7 +730,7 @@ export const RestoreSnapshotStepLogistics: React.FunctionComponent<StepProps> =
         }
         fullWidth
       >
-        <EuiFormRow hasEmptyLabelSpace={true} fullWidth>
+        <EuiFormRow fullWidth>
           <EuiSwitch
             label={
               <FormattedMessage
diff --git a/x-pack/plugins/snapshot_restore/public/application/components/restore_snapshot_form/steps/step_settings.tsx b/x-pack/plugins/snapshot_restore/public/application/components/restore_snapshot_form/steps/step_settings.tsx
index 5b1c23551477e..228bf4c90f629 100644
--- a/x-pack/plugins/snapshot_restore/public/application/components/restore_snapshot_form/steps/step_settings.tsx
+++ b/x-pack/plugins/snapshot_restore/public/application/components/restore_snapshot_form/steps/step_settings.tsx
@@ -143,7 +143,7 @@ export const RestoreSnapshotStepSettings: React.FunctionComponent<StepProps> = (
         }
         fullWidth
       >
-        <EuiFormRow hasEmptyLabelSpace fullWidth>
+        <EuiFormRow fullWidth>
           <Fragment>
             <EuiSwitch
               data-test-subj="modifyIndexSettingsSwitch"
@@ -244,7 +244,7 @@ export const RestoreSnapshotStepSettings: React.FunctionComponent<StepProps> = (
         }
         fullWidth
       >
-        <EuiFormRow hasEmptyLabelSpace fullWidth>
+        <EuiFormRow fullWidth>
           <Fragment>
             <EuiSwitch
               label={
diff --git a/x-pack/plugins/spaces/public/management/edit_space/customize_space/__snapshots__/customize_space.test.tsx.snap b/x-pack/plugins/spaces/public/management/edit_space/customize_space/__snapshots__/customize_space.test.tsx.snap
index 66da6992614bc..7eac1c7499919 100644
--- a/x-pack/plugins/spaces/public/management/edit_space/customize_space/__snapshots__/customize_space.test.tsx.snap
+++ b/x-pack/plugins/spaces/public/management/edit_space/customize_space/__snapshots__/customize_space.test.tsx.snap
@@ -21,15 +21,10 @@ exports[`renders correctly 1`] = `
     }
   >
     <EuiFormRow
-      describedByIds={Array []}
-      display="row"
       error="Enter a name."
       fullWidth={true}
-      hasChildLabel={true}
-      hasEmptyLabelSpace={false}
       isInvalid={true}
       label="Name"
-      labelType="label"
     >
       <EuiFieldText
         data-test-subj="addSpaceName"
@@ -42,11 +37,7 @@ exports[`renders correctly 1`] = `
     </EuiFormRow>
     <EuiFormRow
       data-test-subj="optionalDescription"
-      describedByIds={Array []}
-      display="row"
       fullWidth={true}
-      hasChildLabel={true}
-      hasEmptyLabelSpace={false}
       helpText="The description appears on the space selection screen."
       isInvalid={false}
       label="Description"
@@ -61,7 +52,6 @@ exports[`renders correctly 1`] = `
           />
         </EuiText>
       }
-      labelType="label"
     >
       <EuiTextArea
         data-test-subj="descriptionSpaceText"
@@ -74,12 +64,8 @@ exports[`renders correctly 1`] = `
       />
     </EuiFormRow>
     <EuiFormRow
-      describedByIds={Array []}
-      display="row"
       error="Enter a URL identifier."
       fullWidth={true}
-      hasChildLabel={true}
-      hasEmptyLabelSpace={false}
       helpText={
         <Memo(MemoizedFormattedMessage)
           defaultMessage="You can't change the URL identifier once created."
@@ -93,7 +79,6 @@ exports[`renders correctly 1`] = `
           id="xpack.spaces.management.spaceIdentifier.urlIdentifierTitle"
         />
       }
-      labelType="label"
     >
       <EuiFieldText
         data-test-subj="spaceURLDisplay"
diff --git a/x-pack/plugins/spaces/public/management/edit_space/customize_space/__snapshots__/customize_space_avatar.test.tsx.snap b/x-pack/plugins/spaces/public/management/edit_space/customize_space/__snapshots__/customize_space_avatar.test.tsx.snap
index 3d709a5dca45a..1fa4781b80a3b 100644
--- a/x-pack/plugins/spaces/public/management/edit_space/customize_space/__snapshots__/customize_space_avatar.test.tsx.snap
+++ b/x-pack/plugins/spaces/public/management/edit_space/customize_space/__snapshots__/customize_space_avatar.test.tsx.snap
@@ -5,13 +5,8 @@ exports[`renders without crashing 1`] = `
   onSubmit={[Function]}
 >
   <EuiFormRow
-    describedByIds={Array []}
-    display="row"
     fullWidth={true}
-    hasChildLabel={true}
-    hasEmptyLabelSpace={false}
     label="Avatar type"
-    labelType="label"
   >
     <EuiButtonGroup
       buttonSize="m"
@@ -33,16 +28,11 @@ exports[`renders without crashing 1`] = `
     />
   </EuiFormRow>
   <EuiFormRow
-    describedByIds={Array []}
-    display="row"
     error="Enter initials."
     fullWidth={true}
-    hasChildLabel={true}
-    hasEmptyLabelSpace={false}
     helpText="Enter up to two characters."
     isInvalid={true}
     label="Initials"
-    labelType="label"
   >
     <EuiFieldText
       data-test-subj="spaceLetterInitial"
@@ -54,15 +44,10 @@ exports[`renders without crashing 1`] = `
     />
   </EuiFormRow>
   <EuiFormRow
-    describedByIds={Array []}
-    display="row"
     error="Select a background color."
     fullWidth={true}
-    hasChildLabel={true}
-    hasEmptyLabelSpace={false}
     isInvalid={true}
     label="Background color"
-    labelType="label"
   >
     <EuiColorPicker
       color=""
diff --git a/x-pack/plugins/spaces/public/share_saved_objects_to_space/components/share_to_space_form.scss b/x-pack/plugins/spaces/public/share_saved_objects_to_space/components/share_to_space_form.scss
deleted file mode 100644
index 41a9c907de745..0000000000000
--- a/x-pack/plugins/spaces/public/share_saved_objects_to_space/components/share_to_space_form.scss
+++ /dev/null
@@ -1,10 +0,0 @@
-// make icon occupy the same space as an EuiSwitch
-// icon is size m, which is the native $euiSize value
-// see @elastic/eui/src/components/icon/_variables.scss
-.spcShareToSpaceIncludeRelated .euiIcon {
-  margin-right: $euiSwitchWidth - $euiSize;
-}
-
-.spcShareToSpaceIncludeRelated__label {
-  font-size: $euiFontSizeS;
-}
diff --git a/x-pack/plugins/spaces/public/share_saved_objects_to_space/components/share_to_space_form.tsx b/x-pack/plugins/spaces/public/share_saved_objects_to_space/components/share_to_space_form.tsx
index e3bc2dc4d0e5f..75068b2c3ed7a 100644
--- a/x-pack/plugins/spaces/public/share_saved_objects_to_space/components/share_to_space_form.tsx
+++ b/x-pack/plugins/spaces/public/share_saved_objects_to_space/components/share_to_space_form.tsx
@@ -5,8 +5,6 @@
  * 2.0.
  */
 
-import './share_to_space_form.scss';
-
 import { EuiCallOut, EuiFlexItem, EuiLink, EuiSpacer } from '@elastic/eui';
 import React from 'react';
 
diff --git a/x-pack/plugins/stack_connectors/public/connector_types/lib/servicenow/selection_row.tsx b/x-pack/plugins/stack_connectors/public/connector_types/lib/servicenow/selection_row.tsx
index e43ff063b59e3..278467b3de95a 100644
--- a/x-pack/plugins/stack_connectors/public/connector_types/lib/servicenow/selection_row.tsx
+++ b/x-pack/plugins/stack_connectors/public/connector_types/lib/servicenow/selection_row.tsx
@@ -26,7 +26,6 @@ export function ServiceNowSelectableRowIcon({
       color="warning"
       content={connectorDeprecatedMessage}
       data-test-subj={`deprecated-connector-icon-${actionConnector.id}`}
-      anchorClassName={'euiFormControlLayout__prepend'}
     />
   );
 }
diff --git a/x-pack/plugins/stack_connectors/public/connector_types/servicenow_itsm/servicenow_itsm_params.test.tsx b/x-pack/plugins/stack_connectors/public/connector_types/servicenow_itsm/servicenow_itsm_params.test.tsx
index 0d1986ab9ceca..128fd6518277a 100644
--- a/x-pack/plugins/stack_connectors/public/connector_types/servicenow_itsm/servicenow_itsm_params.test.tsx
+++ b/x-pack/plugins/stack_connectors/public/connector_types/servicenow_itsm/servicenow_itsm_params.test.tsx
@@ -377,7 +377,7 @@ describe('ServiceNowITSMParamsFields renders', () => {
 
       const wrapper = mountWithIntl(<ServiceNowITSMParamsFields {...newProps} />);
 
-      expect(wrapper.find('.euiFormErrorText').text()).toBe('correlation_id_error');
+      expect(wrapper.find('div.euiFormErrorText').text()).toBe('correlation_id_error');
     });
 
     it('updates additional fields', async () => {
diff --git a/x-pack/plugins/triggers_actions_ui/public/common/expression_items/value.test.tsx b/x-pack/plugins/triggers_actions_ui/public/common/expression_items/value.test.tsx
index 20171575923ed..98b10999d1754 100644
--- a/x-pack/plugins/triggers_actions_ui/public/common/expression_items/value.test.tsx
+++ b/x-pack/plugins/triggers_actions_ui/public/common/expression_items/value.test.tsx
@@ -22,32 +22,27 @@ describe('value expression', () => {
       />
     );
     expect(wrapper.find('[data-test-subj="valueFieldTitle"]')).toMatchInlineSnapshot(`
-    <ClosablePopoverTitle
-      data-test-subj="valueFieldTitle"
-      onClose={[Function]}
-    >
-      test
-    </ClosablePopoverTitle>
-    `);
+          <ClosablePopoverTitle
+            data-test-subj="valueFieldTitle"
+            onClose={[Function]}
+          >
+            test
+          </ClosablePopoverTitle>
+        `);
     expect(wrapper.find('[data-test-subj="valueFieldNumberForm"]')).toMatchInlineSnapshot(`
-    <EuiFormRow
-      data-test-subj="valueFieldNumberForm"
-      describedByIds={Array []}
-      display="row"
-      error={Array []}
-      hasChildLabel={true}
-      hasEmptyLabelSpace={false}
-      isInvalid={false}
-      labelType="label"
-    >
-      <EuiFieldNumber
-        data-test-subj="valueFieldNumber"
+      <EuiFormRow
+        data-test-subj="valueFieldNumberForm"
+        error={Array []}
         isInvalid={false}
-        min={0}
-        onChange={[Function]}
-        value={1000}
-      />
-    </EuiFormRow>
+      >
+        <EuiFieldNumber
+          data-test-subj="valueFieldNumber"
+          isInvalid={false}
+          min={0}
+          onChange={[Function]}
+          value={1000}
+        />
+      </EuiFormRow>
     `);
   });
 
@@ -61,28 +56,23 @@ describe('value expression', () => {
       />
     );
     expect(wrapper.find('[data-test-subj="valueFieldNumberForm"]')).toMatchInlineSnapshot(`
-    <EuiFormRow
-      data-test-subj="valueFieldNumberForm"
-      describedByIds={Array []}
-      display="row"
-      error={
-        Array [
-          "value is not valid",
-        ]
-      }
-      hasChildLabel={true}
-      hasEmptyLabelSpace={false}
-      isInvalid={true}
-      labelType="label"
-    >
-      <EuiFieldNumber
-        data-test-subj="valueFieldNumber"
+      <EuiFormRow
+        data-test-subj="valueFieldNumberForm"
+        error={
+          Array [
+            "value is not valid",
+          ]
+        }
         isInvalid={true}
-        min={0}
-        onChange={[Function]}
-        value={1000}
-      />
-    </EuiFormRow>
+      >
+        <EuiFieldNumber
+          data-test-subj="valueFieldNumber"
+          isInvalid={true}
+          min={0}
+          onChange={[Function]}
+          value={1000}
+        />
+      </EuiFormRow>
     `);
   });
 
diff --git a/x-pack/test/functional/page_objects/rollup_page.ts b/x-pack/test/functional/page_objects/rollup_page.ts
index 90ba69f5410fb..09115b7a35fdc 100644
--- a/x-pack/test/functional/page_objects/rollup_page.ts
+++ b/x-pack/test/functional/page_objects/rollup_page.ts
@@ -110,7 +110,7 @@ export class RollupPageObject extends FtrService {
 
   async saveJob(startImmediately: boolean) {
     if (startImmediately) {
-      const checkbox = await this.find.byCssSelector('.euiCheckbox');
+      const checkbox = await this.find.byCssSelector('.euiCheckbox__input');
       await checkbox.click();
     }
     await this.testSubjects.click('rollupJobSaveButton');
diff --git a/x-pack/test/security_solution_cypress/cypress/tasks/create_new_rule.ts b/x-pack/test/security_solution_cypress/cypress/tasks/create_new_rule.ts
index 4251ef8ee0ec8..2373d1e285ba7 100644
--- a/x-pack/test/security_solution_cypress/cypress/tasks/create_new_rule.ts
+++ b/x-pack/test/security_solution_cypress/cypress/tasks/create_new_rule.ts
@@ -894,7 +894,7 @@ export const enablesAndPopulatesThresholdSuppression = (
 
   // enables suppression for threshold rule
   cy.get(THRESHOLD_ENABLE_SUPPRESSION_CHECKBOX).should('not.be.checked');
-  cy.get(THRESHOLD_ENABLE_SUPPRESSION_CHECKBOX).siblings('label').click();
+  cy.get(THRESHOLD_ENABLE_SUPPRESSION_CHECKBOX).click();
 
   setAlertSuppressionDuration(interval, timeUnit);
 
@@ -925,11 +925,11 @@ export const selectAlertSuppressionPerInterval = () => {
 };
 
 export const selectAlertSuppressionPerRuleExecution = () => {
-  cy.get(ALERT_SUPPRESSION_DURATION_PER_RULE_EXECUTION).siblings('label').click();
+  cy.get(ALERT_SUPPRESSION_DURATION_PER_RULE_EXECUTION).click();
 };
 
 export const selectDoNotSuppressForMissingFields = () => {
-  cy.get(ALERT_SUPPRESSION_MISSING_FIELDS_DO_NOT_SUPPRESS).siblings('label').click();
+  cy.get(ALERT_SUPPRESSION_MISSING_FIELDS_DO_NOT_SUPPRESS).click();
 };
 
 export const setAlertSuppressionDuration = (interval: number, timeUnit: 's' | 'm' | 'h') => {
diff --git a/x-pack/test/security_solution_endpoint/page_objects/page_utils.ts b/x-pack/test/security_solution_endpoint/page_objects/page_utils.ts
index d43c15c1794f9..132e93ce23cf0 100644
--- a/x-pack/test/security_solution_endpoint/page_objects/page_utils.ts
+++ b/x-pack/test/security_solution_endpoint/page_objects/page_utils.ts
@@ -10,7 +10,6 @@ import { FtrProviderContext } from '../configs/ftr_provider_context';
 
 export function EndpointPageUtils({ getService }: FtrProviderContext) {
   const testSubjects = getService('testSubjects');
-  const find = getService('find');
 
   return {
     /**
@@ -19,15 +18,8 @@ export function EndpointPageUtils({ getService }: FtrProviderContext) {
      * @param euiCheckBoxTestId
      */
     async clickOnEuiCheckbox(euiCheckBoxTestId: string) {
-      // This utility is needed because EuiCheckbox forwards the test subject on to
-      // the actual `<input>` which is not actually visible/accessible on the page.
-      // In order to actually cause the state of the checkbox to change, the `<label>`
-      // must be clicked.
-      const euiCheckboxLabelElement = await find.byXPath(
-        `//input[@data-test-subj='${euiCheckBoxTestId}']/../label`
-      );
-
-      await euiCheckboxLabelElement.click();
+      const euiCheckboxInput = await testSubjects.find(euiCheckBoxTestId);
+      await euiCheckboxInput.click();
     },
 
     /**
diff --git a/yarn.lock b/yarn.lock
index 85c4c519c17a2..7d303a9cacbf0 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -1741,10 +1741,9 @@
   resolved "https://registry.yarnpkg.com/@elastic/eslint-plugin-eui/-/eslint-plugin-eui-0.0.2.tgz#56b9ef03984a05cc213772ae3713ea8ef47b0314"
   integrity sha512-IoxURM5zraoQ7C8f+mJb9HYSENiZGgRVcG4tLQxE61yHNNRDXtGDWTZh8N1KIHcsqN1CEPETjuzBXkJYF/fDiQ==
 
-"@elastic/eui@95.7.0":
-  version "95.7.0"
-  resolved "https://registry.yarnpkg.com/@elastic/eui/-/eui-95.7.0.tgz#50edc43d3aac1a1ea87ec56a04ec0bc91e7e32a1"
-  integrity sha512-T6tihdAtE3JhXaTMHagidXWB5Sv6c++5vHdPj7kyYGjT1fDPpJ/fuTZTfH2GJLc56g63zBdDNMkLnXZYb0ld4Q==
+"@elastic/eui@./elastic_eui_95.9.0_vr_option3_02.tgz":
+  version "95.9.0"
+  resolved "./elastic_eui_95.9.0_vr_option3_02.tgz#1f4c500e86a3ff5bc44c0d0072ae48716121722c"
   dependencies:
     "@hello-pangea/dnd" "^16.6.0"
     "@types/lodash" "^4.14.202"