From 8370bcd064799905b63078fcea98dd0668c68784 Mon Sep 17 00:00:00 2001
From: Kshitij Tandon <tandonks@amazon.com>
Date: Mon, 2 Sep 2024 11:43:29 +0530
Subject: [PATCH] Title changes in Old UI

Signed-off-by: Kshitij Tandon <tandonks@amazon.com>
---
 .../components/ContentPanel/ContentPanel.tsx  |  4 +-
 .../__snapshots__/ContentPanel.test.tsx.snap  | 22 ++---
 .../Aliases/containers/Aliases/Aliases.tsx    |  6 +-
 .../__snapshots__/Aliases.test.tsx.snap       | 10 ++-
 .../containers/ChangePolicy/ChangePolicy.tsx  |  6 +-
 .../__snapshots__/ChangePolicy.test.tsx.snap  | 10 ++-
 .../CreateComposableTemplate.test.tsx.snap    | 63 +++++++------
 .../containers/IndexAlias/IndexAlias.tsx      |  6 +-
 .../TemplateDetail/TemplateDetail.tsx         | 14 ++-
 .../TemplateDetail.test.tsx.snap              | 60 +++++++------
 .../CreateDataStream.test.tsx.snap            | 22 ++---
 .../DataStreamDetail.test.tsx.snap            | 22 ++---
 .../containers/CreateIndex/CreateIndex.tsx    |  6 +-
 .../CreateIndexTemplate.test.tsx.snap         | 13 +--
 .../TemplateDetail/TemplateDetail.tsx         |  4 +-
 .../TemplateDetail.test.tsx.snap              | 12 +--
 .../ConfigurePolicy.test.tsx.snap             | 22 ++---
 .../__snapshots__/DefinePolicy.test.tsx.snap  | 22 ++---
 .../__snapshots__/CreatePolicy.test.tsx.snap  | 88 ++++++++++---------
 .../CreateRollupForm.test.tsx.snap            | 44 +++++-----
 .../CreateTransformForm.test.tsx.snap         | 44 +++++-----
 .../__snapshots__/EditRollup.test.tsx.snap    | 44 +++++-----
 .../__snapshots__/ForceMerge.test.tsx.snap    | 22 ++---
 .../__snapshots__/Indices.test.tsx.snap       | 22 ++---
 .../ManagedIndices.test.tsx.snap              | 22 ++---
 .../__snapshots__/Policies.test.tsx.snap      | 22 ++---
 .../PolicySettings.test.tsx.snap              | 22 ++---
 .../CreateIndexFlyout/CreateIndexFlyout.tsx   |  6 +-
 .../CreateIndexFlyout.test.tsx.snap           | 13 +--
 .../__snapshots__/Reindex.test.tsx.snap       | 44 +++++-----
 .../__snapshots__/Rollover.test.tsx.snap      | 22 ++---
 .../__snapshots__/ShrinkIndex.test.tsx.snap   | 44 +++++-----
 .../__snapshots__/EditTransform.test.tsx.snap | 66 +++++++-------
 .../__snapshots__/PolicyInfo.test.tsx.snap    | 22 ++---
 .../States/__snapshots__/States.test.tsx.snap | 22 ++---
 35 files changed, 496 insertions(+), 397 deletions(-)

diff --git a/public/components/ContentPanel/ContentPanel.tsx b/public/components/ContentPanel/ContentPanel.tsx
index 0d7b9354f..5c30772d8 100644
--- a/public/components/ContentPanel/ContentPanel.tsx
+++ b/public/components/ContentPanel/ContentPanel.tsx
@@ -71,12 +71,12 @@ const ContentPanel: React.SFC<ContentPanelProps> = ({
       {title ? (
         <EuiFlexItem>
           {typeof title === "string" ? (
-            <EuiTitle size={titleSize}>
+            <EuiText size="s">
               <h1>
                 {title}
                 <span className="panel-header-count"> {itemCount > 0 ? `(${itemCount})` : null} </span>
               </h1>
-            </EuiTitle>
+            </EuiText>
           ) : (
             title
           )}
diff --git a/public/components/ContentPanel/__snapshots__/ContentPanel.test.tsx.snap b/public/components/ContentPanel/__snapshots__/ContentPanel.test.tsx.snap
index 7ab9e46e5..f78bebca4 100644
--- a/public/components/ContentPanel/__snapshots__/ContentPanel.test.tsx.snap
+++ b/public/components/ContentPanel/__snapshots__/ContentPanel.test.tsx.snap
@@ -12,17 +12,19 @@ exports[`<ContentPanel /> spec renders the component 1`] = `
     <div
       class="euiFlexItem"
     >
-      <h1
-        class="euiTitle euiTitle--large"
+      <div
+        class="euiText euiText--small"
       >
-        Testing
-        <span
-          class="panel-header-count"
-        >
-           
-           
-        </span>
-      </h1>
+        <h1>
+          Testing
+          <span
+            class="panel-header-count"
+          >
+             
+             
+          </span>
+        </h1>
+      </div>
     </div>
     <div
       class="euiFlexItem euiFlexItem--flexGrowZero"
diff --git a/public/pages/Aliases/containers/Aliases/Aliases.tsx b/public/pages/Aliases/containers/Aliases/Aliases.tsx
index 93aad048b..56c8f00b7 100644
--- a/public/pages/Aliases/containers/Aliases/Aliases.tsx
+++ b/public/pages/Aliases/containers/Aliases/Aliases.tsx
@@ -526,9 +526,9 @@ class Aliases extends MDSEnabledComponent<AliasesProps, AliasesState> {
         bodyStyles={{ padding: "initial" }}
         title={
           <>
-            <EuiTitle>
-              <span>Aliases</span>
-            </EuiTitle>
+            <EuiText size="s">
+              <h1>Aliases</h1>
+            </EuiText>
             <EuiCompressedFormRow
               fullWidth
               helpText={
diff --git a/public/pages/Aliases/containers/Aliases/__snapshots__/Aliases.test.tsx.snap b/public/pages/Aliases/containers/Aliases/__snapshots__/Aliases.test.tsx.snap
index 770c519a7..f9bd52208 100644
--- a/public/pages/Aliases/containers/Aliases/__snapshots__/Aliases.test.tsx.snap
+++ b/public/pages/Aliases/containers/Aliases/__snapshots__/Aliases.test.tsx.snap
@@ -12,11 +12,13 @@ exports[`<Aliases /> spec renders the component 1`] = `
     <div
       class="euiFlexItem"
     >
-      <span
-        class="euiTitle euiTitle--medium"
+      <div
+        class="euiText euiText--small"
       >
-        Aliases
-      </span>
+        <h1>
+          Aliases
+        </h1>
+      </div>
       <div
         class="euiFormRow euiFormRow--fullWidth euiFormRow--compressed"
         id="some_html_id-row"
diff --git a/public/pages/ChangePolicy/containers/ChangePolicy/ChangePolicy.tsx b/public/pages/ChangePolicy/containers/ChangePolicy/ChangePolicy.tsx
index c8dc77427..39eb97664 100644
--- a/public/pages/ChangePolicy/containers/ChangePolicy/ChangePolicy.tsx
+++ b/public/pages/ChangePolicy/containers/ChangePolicy/ChangePolicy.tsx
@@ -5,7 +5,7 @@
 
 import React, { Component, useContext } from "react";
 import { RouteComponentProps } from "react-router-dom";
-import { EuiSpacer, EuiTitle, EuiSmallButton, EuiFlexGroup, EuiFlexItem, EuiSmallButtonEmpty } from "@elastic/eui";
+import { EuiSpacer, EuiTitle, EuiSmallButton, EuiFlexGroup, EuiFlexItem, EuiSmallButtonEmpty, EuiText } from "@elastic/eui";
 import { IndexService, ManagedIndexService } from "../../../../services";
 import ChangeManagedIndices from "../../components/ChangeManagedIndices";
 import NewPolicy from "../../components/NewPolicy";
@@ -208,9 +208,9 @@ export class ChangePolicy extends Component<ChangePolicyProps, ChangePolicyState
 
     return !useUpdatedUX ? (
       <div style={{ padding: "0px 25px" }}>
-        <EuiTitle size="l">
+        <EuiText size="s">
           <h1>Change policy</h1>
-        </EuiTitle>
+        </EuiText>
 
         <EuiSpacer />
 
diff --git a/public/pages/ChangePolicy/containers/ChangePolicy/__snapshots__/ChangePolicy.test.tsx.snap b/public/pages/ChangePolicy/containers/ChangePolicy/__snapshots__/ChangePolicy.test.tsx.snap
index 85a3791bb..8cba4876d 100644
--- a/public/pages/ChangePolicy/containers/ChangePolicy/__snapshots__/ChangePolicy.test.tsx.snap
+++ b/public/pages/ChangePolicy/containers/ChangePolicy/__snapshots__/ChangePolicy.test.tsx.snap
@@ -4,11 +4,13 @@ exports[`<ChangePolicy /> spec renders the component 1`] = `
 <div
   style="padding: 0px 25px;"
 >
-  <h1
-    class="euiTitle euiTitle--large"
+  <div
+    class="euiText euiText--small"
   >
-    Change policy
-  </h1>
+    <h1>
+      Change policy
+    </h1>
+  </div>
   <div
     class="euiSpacer euiSpacer--l"
   />
diff --git a/public/pages/CreateComposableTemplate/containers/CreateComposableTemplate/__snapshots__/CreateComposableTemplate.test.tsx.snap b/public/pages/CreateComposableTemplate/containers/CreateComposableTemplate/__snapshots__/CreateComposableTemplate.test.tsx.snap
index f2bb4f1b3..d4b9fdb03 100644
--- a/public/pages/CreateComposableTemplate/containers/CreateComposableTemplate/__snapshots__/CreateComposableTemplate.test.tsx.snap
+++ b/public/pages/CreateComposableTemplate/containers/CreateComposableTemplate/__snapshots__/CreateComposableTemplate.test.tsx.snap
@@ -11,12 +11,15 @@ exports[`<CreateComposableTemplate /> spec it goes to templates page when click
       <div
         class="euiFlexItem"
       >
-        <h1
-          class="euiTitle euiTitle--large"
-          title="good_template"
+        <div
+          class="euiText"
         >
-          good_template
-        </h1>
+          <h1
+            title="good_template"
+          >
+            good_template
+          </h1>
+        </div>
       </div>
       <div
         class="euiFlexItem euiFlexItem--flexGrowZero"
@@ -68,17 +71,19 @@ exports[`<CreateComposableTemplate /> spec it goes to templates page when click
         <div
           class="euiFlexItem"
         >
-          <h1
-            class="euiTitle euiTitle--small"
+          <div
+            class="euiText euiText--small"
           >
-            Define component template
-            <span
-              class="panel-header-count"
-            >
-               
-               
-            </span>
-          </h1>
+            <h1>
+              Define component template
+              <span
+                class="panel-header-count"
+              >
+                 
+                 
+              </span>
+            </h1>
+          </div>
         </div>
       </div>
       <hr
@@ -183,9 +188,11 @@ exports[`<CreateComposableTemplate /> spec it goes to templates page when click
                 for="some_html_id"
               >
                 <div
-                  class="euiTitle euiTitle--small"
+                  class="euiText euiText--small"
                 >
-                  Index alias
+                  <div>
+                    Index alias
+                  </div>
                 </div>
               </label>
             </div>
@@ -269,17 +276,19 @@ exports[`<CreateComposableTemplate /> spec it goes to templates page when click
         <div
           class="euiFlexItem"
         >
-          <h1
-            class="euiTitle euiTitle--small"
+          <div
+            class="euiText euiText--small"
           >
-            Index settings
-            <span
-              class="panel-header-count"
-            >
-               
-               
-            </span>
-          </h1>
+            <h1>
+              Index settings
+              <span
+                class="panel-header-count"
+              >
+                 
+                 
+              </span>
+            </h1>
+          </div>
         </div>
         <div
           class="euiFlexItem euiFlexItem--flexGrowZero"
diff --git a/public/pages/CreateComposableTemplate/containers/IndexAlias/IndexAlias.tsx b/public/pages/CreateComposableTemplate/containers/IndexAlias/IndexAlias.tsx
index 41513df63..092865246 100644
--- a/public/pages/CreateComposableTemplate/containers/IndexAlias/IndexAlias.tsx
+++ b/public/pages/CreateComposableTemplate/containers/IndexAlias/IndexAlias.tsx
@@ -1,5 +1,5 @@
 import React, { useContext } from "react";
-import { EuiSpacer, EuiTitle } from "@elastic/eui";
+import { EuiSpacer, EuiText } from "@elastic/eui";
 import { ContentPanel } from "../../../../components/ContentPanel";
 import AliasSelect from "../../../../components/AliasSelect";
 import CustomFormRow from "../../../../components/CustomFormRow";
@@ -23,9 +23,9 @@ export default function IndexAlias(props: SubDetailProps) {
           <CustomFormRow
             fullWidth
             label={
-              <EuiTitle size="s">
+              <EuiText size="s">
                 <div>Index alias</div>
-              </EuiTitle>
+              </EuiText>
             }
             helpText="Allow the new indexes to be referenced by existing aliases or specify a new alias."
           >
diff --git a/public/pages/CreateComposableTemplate/containers/TemplateDetail/TemplateDetail.tsx b/public/pages/CreateComposableTemplate/containers/TemplateDetail/TemplateDetail.tsx
index 009e6728c..91088211d 100644
--- a/public/pages/CreateComposableTemplate/containers/TemplateDetail/TemplateDetail.tsx
+++ b/public/pages/CreateComposableTemplate/containers/TemplateDetail/TemplateDetail.tsx
@@ -4,7 +4,17 @@
  */
 
 import React, { forwardRef, useContext, useEffect, useImperativeHandle, useRef, Ref, useState } from "react";
-import { EuiSmallButton, EuiSmallButtonEmpty, EuiCodeBlock, EuiFlexGroup, EuiFlexItem, EuiLink, EuiSpacer, EuiText, EuiTitle } from "@elastic/eui";
+import {
+  EuiSmallButton,
+  EuiSmallButtonEmpty,
+  EuiCodeBlock,
+  EuiFlexGroup,
+  EuiFlexItem,
+  EuiLink,
+  EuiSpacer,
+  EuiText,
+  EuiTitle,
+} from "@elastic/eui";
 import { RouteComponentProps } from "react-router-dom";
 import { IComposableTemplate, IComposableTemplateRemote } from "../../../../../models/interfaces";
 import useField from "../../../../lib/field";
@@ -226,7 +236,7 @@ const TemplateDetail = (props: TemplateDetailProps, ref: Ref<IComponentTemplateD
               {useNewUX ? (
                 <></>
               ) : (
-                <EuiTitle size="l">{isEdit ? <h1 title={templateName}>{templateName}</h1> : <h1>Create component template</h1>}</EuiTitle>
+                <EuiText size="l">{isEdit ? <h1 title={templateName}>{templateName}</h1> : <h1>Create component template</h1>}</EuiText>
               )}
               {isEdit ? null : useNewUX ? (
                 <HeaderControl setMountPoint={setAppDescriptionControls} controls={descriptionData} />
diff --git a/public/pages/CreateComposableTemplate/containers/TemplateDetail/__snapshots__/TemplateDetail.test.tsx.snap b/public/pages/CreateComposableTemplate/containers/TemplateDetail/__snapshots__/TemplateDetail.test.tsx.snap
index 491aa488c..1133ecbfb 100644
--- a/public/pages/CreateComposableTemplate/containers/TemplateDetail/__snapshots__/TemplateDetail.test.tsx.snap
+++ b/public/pages/CreateComposableTemplate/containers/TemplateDetail/__snapshots__/TemplateDetail.test.tsx.snap
@@ -8,11 +8,13 @@ exports[`<TemplateDetail /> spec render component 1`] = `
     <div
       class="euiFlexItem"
     >
-      <h1
-        class="euiTitle euiTitle--large"
+      <div
+        class="euiText"
       >
-        Create component template
-      </h1>
+        <h1>
+          Create component template
+        </h1>
+      </div>
       <div
         class="euiFormRow euiFormRow--fullWidth euiFormRow--compressed"
         id="some_html_id-row"
@@ -53,17 +55,19 @@ exports[`<TemplateDetail /> spec render component 1`] = `
       <div
         class="euiFlexItem"
       >
-        <h1
-          class="euiTitle euiTitle--small"
+        <div
+          class="euiText euiText--small"
         >
-          Define component template
-          <span
-            class="panel-header-count"
-          >
-             
-             
-          </span>
-        </h1>
+          <h1>
+            Define component template
+            <span
+              class="panel-header-count"
+            >
+               
+               
+            </span>
+          </h1>
+        </div>
       </div>
     </div>
     <hr
@@ -218,9 +222,11 @@ exports[`<TemplateDetail /> spec render component 1`] = `
               for="some_html_id"
             >
               <div
-                class="euiTitle euiTitle--small"
+                class="euiText euiText--small"
               >
-                Index alias
+                <div>
+                  Index alias
+                </div>
               </div>
             </label>
           </div>
@@ -304,17 +310,19 @@ exports[`<TemplateDetail /> spec render component 1`] = `
       <div
         class="euiFlexItem"
       >
-        <h1
-          class="euiTitle euiTitle--small"
+        <div
+          class="euiText euiText--small"
         >
-          Index settings
-          <span
-            class="panel-header-count"
-          >
-             
-             
-          </span>
-        </h1>
+          <h1>
+            Index settings
+            <span
+              class="panel-header-count"
+            >
+               
+               
+            </span>
+          </h1>
+        </div>
       </div>
       <div
         class="euiFlexItem euiFlexItem--flexGrowZero"
diff --git a/public/pages/CreateDataStream/containers/CreateDataStream/__snapshots__/CreateDataStream.test.tsx.snap b/public/pages/CreateDataStream/containers/CreateDataStream/__snapshots__/CreateDataStream.test.tsx.snap
index f607a6d8f..110c87690 100644
--- a/public/pages/CreateDataStream/containers/CreateDataStream/__snapshots__/CreateDataStream.test.tsx.snap
+++ b/public/pages/CreateDataStream/containers/CreateDataStream/__snapshots__/CreateDataStream.test.tsx.snap
@@ -100,17 +100,19 @@ exports[`<CreateDataStream /> spec it goes to data streams page when click cance
         <div
           class="euiFlexItem"
         >
-          <h1
-            class="euiTitle euiTitle--small"
+          <div
+            class="euiText euiText--small"
           >
-            Define data stream
-            <span
-              class="panel-header-count"
-            >
-               
-               
-            </span>
-          </h1>
+            <h1>
+              Define data stream
+              <span
+                class="panel-header-count"
+              >
+                 
+                 
+              </span>
+            </h1>
+          </div>
         </div>
       </div>
       <hr
diff --git a/public/pages/CreateDataStream/containers/DataStreamDetail/__snapshots__/DataStreamDetail.test.tsx.snap b/public/pages/CreateDataStream/containers/DataStreamDetail/__snapshots__/DataStreamDetail.test.tsx.snap
index 3cf7ebe74..1367d72fe 100644
--- a/public/pages/CreateDataStream/containers/DataStreamDetail/__snapshots__/DataStreamDetail.test.tsx.snap
+++ b/public/pages/CreateDataStream/containers/DataStreamDetail/__snapshots__/DataStreamDetail.test.tsx.snap
@@ -97,17 +97,19 @@ exports[`<DataStreamDetail /> spec render component 1`] = `
       <div
         class="euiFlexItem"
       >
-        <h1
-          class="euiTitle euiTitle--small"
+        <div
+          class="euiText euiText--small"
         >
-          Define data stream
-          <span
-            class="panel-header-count"
-          >
-             
-             
-          </span>
-        </h1>
+          <h1>
+            Define data stream
+            <span
+              class="panel-header-count"
+            >
+               
+               
+            </span>
+          </h1>
+        </div>
       </div>
     </div>
     <hr
diff --git a/public/pages/CreateIndex/containers/CreateIndex/CreateIndex.tsx b/public/pages/CreateIndex/containers/CreateIndex/CreateIndex.tsx
index 968193746..990cdf90a 100644
--- a/public/pages/CreateIndex/containers/CreateIndex/CreateIndex.tsx
+++ b/public/pages/CreateIndex/containers/CreateIndex/CreateIndex.tsx
@@ -4,7 +4,7 @@
  */
 
 import React, { Component, useContext } from "react";
-import { EuiSpacer, EuiTitle } from "@elastic/eui";
+import { EuiSpacer, EuiText, EuiTitle } from "@elastic/eui";
 import { RouteComponentProps } from "react-router-dom";
 import IndexForm from "../IndexForm";
 import { BREADCRUMBS, IndicesUpdateMode, ROUTES } from "../../../../utils/constants";
@@ -59,9 +59,9 @@ export class CreateIndex extends Component<CreateIndexProps> {
       </div>
     ) : (
       <div style={{ padding: "0px 50px" }}>
-        <EuiTitle size="l">
+        <EuiText size="s">
           <h1>{isEdit ? "Edit" : "Create"} index</h1>
-        </EuiTitle>
+        </EuiText>
         <EuiSpacer />
         <IndexForm
           index={this.index}
diff --git a/public/pages/CreateIndexTemplate/containers/CreateIndexTemplate/__snapshots__/CreateIndexTemplate.test.tsx.snap b/public/pages/CreateIndexTemplate/containers/CreateIndexTemplate/__snapshots__/CreateIndexTemplate.test.tsx.snap
index 0859744a4..c65df37a7 100644
--- a/public/pages/CreateIndexTemplate/containers/CreateIndexTemplate/__snapshots__/CreateIndexTemplate.test.tsx.snap
+++ b/public/pages/CreateIndexTemplate/containers/CreateIndexTemplate/__snapshots__/CreateIndexTemplate.test.tsx.snap
@@ -11,12 +11,15 @@ exports[`<CreateIndexTemplate /> spec render template pages 1`] = `
       <div
         class="euiFlexItem"
       >
-        <h1
-          class="euiTitle euiTitle--large"
-          title="good_template"
+        <div
+          class="euiText euiText--small"
         >
-          good_template
-        </h1>
+          <h1
+            title="good_template"
+          >
+            good_template
+          </h1>
+        </div>
       </div>
       <div
         class="euiFlexItem euiFlexItem--flexGrowZero"
diff --git a/public/pages/CreateIndexTemplate/containers/TemplateDetail/TemplateDetail.tsx b/public/pages/CreateIndexTemplate/containers/TemplateDetail/TemplateDetail.tsx
index af6b0d9fd..bbe0f4784 100644
--- a/public/pages/CreateIndexTemplate/containers/TemplateDetail/TemplateDetail.tsx
+++ b/public/pages/CreateIndexTemplate/containers/TemplateDetail/TemplateDetail.tsx
@@ -278,9 +278,9 @@ const TemplateDetail = (props: TemplateDetailProps, ref: Ref<FieldInstance>) =>
       <>
         <EuiFlexGroup alignItems="center">
           <EuiFlexItem>
-            <EuiTitle size="l">
+            <EuiText size="s">
               {isEdit ? <h1 title={values.name}>{templateName}</h1> : <h1>{isEdit ? "Edit" : "Create"} template</h1>}
-            </EuiTitle>
+            </EuiText>
             {isEdit ? null : (
               <CustomFormRow
                 fullWidth
diff --git a/public/pages/CreateIndexTemplate/containers/TemplateDetail/__snapshots__/TemplateDetail.test.tsx.snap b/public/pages/CreateIndexTemplate/containers/TemplateDetail/__snapshots__/TemplateDetail.test.tsx.snap
index 9c1eb6a79..2112aa5fc 100644
--- a/public/pages/CreateIndexTemplate/containers/TemplateDetail/__snapshots__/TemplateDetail.test.tsx.snap
+++ b/public/pages/CreateIndexTemplate/containers/TemplateDetail/__snapshots__/TemplateDetail.test.tsx.snap
@@ -8,12 +8,14 @@ exports[`<TemplateDetail /> spec render component in non-edit-mode 1`] = `
     <div
       class="euiFlexItem"
     >
-      <h1
-        class="euiTitle euiTitle--large"
+      <div
+        class="euiText euiText--small"
       >
-        Create
-         template
-      </h1>
+        <h1>
+          Create
+           template
+        </h1>
+      </div>
       <div
         class="euiFormRow euiFormRow--fullWidth euiFormRow--compressed"
         id="some_html_id-row"
diff --git a/public/pages/CreatePolicy/components/ConfigurePolicy/__snapshots__/ConfigurePolicy.test.tsx.snap b/public/pages/CreatePolicy/components/ConfigurePolicy/__snapshots__/ConfigurePolicy.test.tsx.snap
index 75b67021c..f22a66435 100644
--- a/public/pages/CreatePolicy/components/ConfigurePolicy/__snapshots__/ConfigurePolicy.test.tsx.snap
+++ b/public/pages/CreatePolicy/components/ConfigurePolicy/__snapshots__/ConfigurePolicy.test.tsx.snap
@@ -12,17 +12,19 @@ exports[`<ConfigurePolicy /> spec renders the component 1`] = `
     <div
       class="euiFlexItem"
     >
-      <h1
-        class="euiTitle euiTitle--small"
+      <div
+        class="euiText euiText--small"
       >
-        Name policy
-        <span
-          class="panel-header-count"
-        >
-           
-           
-        </span>
-      </h1>
+        <h1>
+          Name policy
+          <span
+            class="panel-header-count"
+          >
+             
+             
+          </span>
+        </h1>
+      </div>
     </div>
   </div>
   <hr
diff --git a/public/pages/CreatePolicy/components/DefinePolicy/__snapshots__/DefinePolicy.test.tsx.snap b/public/pages/CreatePolicy/components/DefinePolicy/__snapshots__/DefinePolicy.test.tsx.snap
index 57122b9d4..f8ece7161 100644
--- a/public/pages/CreatePolicy/components/DefinePolicy/__snapshots__/DefinePolicy.test.tsx.snap
+++ b/public/pages/CreatePolicy/components/DefinePolicy/__snapshots__/DefinePolicy.test.tsx.snap
@@ -12,17 +12,19 @@ exports[`<DefinePolicy /> spec renders the component 1`] = `
     <div
       class="euiFlexItem"
     >
-      <h1
-        class="euiTitle euiTitle--small"
+      <div
+        class="euiText euiText--small"
       >
-        Define policy
-        <span
-          class="panel-header-count"
-        >
-           
-           
-        </span>
-      </h1>
+        <h1>
+          Define policy
+          <span
+            class="panel-header-count"
+          >
+             
+             
+          </span>
+        </h1>
+      </div>
     </div>
     <div
       class="euiFlexItem euiFlexItem--flexGrowZero"
diff --git a/public/pages/CreatePolicy/containers/CreatePolicy/__snapshots__/CreatePolicy.test.tsx.snap b/public/pages/CreatePolicy/containers/CreatePolicy/__snapshots__/CreatePolicy.test.tsx.snap
index b4be236d8..775d8d838 100644
--- a/public/pages/CreatePolicy/containers/CreatePolicy/__snapshots__/CreatePolicy.test.tsx.snap
+++ b/public/pages/CreatePolicy/containers/CreatePolicy/__snapshots__/CreatePolicy.test.tsx.snap
@@ -24,17 +24,19 @@ exports[`<CreatePolicy /> spec renders the create component 1`] = `
       <div
         class="euiFlexItem"
       >
-        <h1
-          class="euiTitle euiTitle--small"
+        <div
+          class="euiText euiText--small"
         >
-          Name policy
-          <span
-            class="panel-header-count"
-          >
-             
-             
-          </span>
-        </h1>
+          <h1>
+            Name policy
+            <span
+              class="panel-header-count"
+            >
+               
+               
+            </span>
+          </h1>
+        </div>
       </div>
     </div>
     <hr
@@ -115,17 +117,19 @@ exports[`<CreatePolicy /> spec renders the create component 1`] = `
       <div
         class="euiFlexItem"
       >
-        <h1
-          class="euiTitle euiTitle--small"
+        <div
+          class="euiText euiText--small"
         >
-          Define policy
-          <span
-            class="panel-header-count"
-          >
-             
-             
-          </span>
-        </h1>
+          <h1>
+            Define policy
+            <span
+              class="panel-header-count"
+            >
+               
+               
+            </span>
+          </h1>
+        </div>
       </div>
       <div
         class="euiFlexItem euiFlexItem--flexGrowZero"
@@ -367,17 +371,19 @@ exports[`<CreatePolicy /> spec renders the edit component 1`] = `
       <div
         class="euiFlexItem"
       >
-        <h1
-          class="euiTitle euiTitle--small"
+        <div
+          class="euiText euiText--small"
         >
-          Name policy
-          <span
-            class="panel-header-count"
-          >
-             
-             
-          </span>
-        </h1>
+          <h1>
+            Name policy
+            <span
+              class="panel-header-count"
+            >
+               
+               
+            </span>
+          </h1>
+        </div>
       </div>
     </div>
     <hr
@@ -459,17 +465,19 @@ exports[`<CreatePolicy /> spec renders the edit component 1`] = `
       <div
         class="euiFlexItem"
       >
-        <h1
-          class="euiTitle euiTitle--small"
+        <div
+          class="euiText euiText--small"
         >
-          Define policy
-          <span
-            class="panel-header-count"
-          >
-             
-             
-          </span>
-        </h1>
+          <h1>
+            Define policy
+            <span
+              class="panel-header-count"
+            >
+               
+               
+            </span>
+          </h1>
+        </div>
       </div>
       <div
         class="euiFlexItem euiFlexItem--flexGrowZero"
diff --git a/public/pages/CreateRollup/containers/CreateRollupForm/__snapshots__/CreateRollupForm.test.tsx.snap b/public/pages/CreateRollup/containers/CreateRollupForm/__snapshots__/CreateRollupForm.test.tsx.snap
index a0764b936..89f07df44 100644
--- a/public/pages/CreateRollup/containers/CreateRollupForm/__snapshots__/CreateRollupForm.test.tsx.snap
+++ b/public/pages/CreateRollup/containers/CreateRollupForm/__snapshots__/CreateRollupForm.test.tsx.snap
@@ -170,17 +170,19 @@ exports[`<CreateRollupForm /> spec renders the component 1`] = `
               <div
                 class="euiFlexItem"
               >
-                <h1
-                  class="euiTitle euiTitle--small"
+                <div
+                  class="euiText euiText--small"
                 >
-                  Job name and description
-                  <span
-                    class="panel-header-count"
-                  >
-                     
-                     
-                  </span>
-                </h1>
+                  <h1>
+                    Job name and description
+                    <span
+                      class="panel-header-count"
+                    >
+                       
+                       
+                    </span>
+                  </h1>
+                </div>
               </div>
             </div>
             <hr
@@ -305,17 +307,19 @@ exports[`<CreateRollupForm /> spec renders the component 1`] = `
               <div
                 class="euiFlexItem"
               >
-                <h1
-                  class="euiTitle euiTitle--small"
+                <div
+                  class="euiText euiText--small"
                 >
-                  Indices
-                  <span
-                    class="panel-header-count"
-                  >
-                     
-                     
-                  </span>
-                </h1>
+                  <h1>
+                    Indices
+                    <span
+                      class="panel-header-count"
+                    >
+                       
+                       
+                    </span>
+                  </h1>
+                </div>
               </div>
             </div>
             <hr
diff --git a/public/pages/CreateTransform/containers/CreateTransformForm/__snapshots__/CreateTransformForm.test.tsx.snap b/public/pages/CreateTransform/containers/CreateTransformForm/__snapshots__/CreateTransformForm.test.tsx.snap
index 7863547ce..5e01b54e6 100644
--- a/public/pages/CreateTransform/containers/CreateTransformForm/__snapshots__/CreateTransformForm.test.tsx.snap
+++ b/public/pages/CreateTransform/containers/CreateTransformForm/__snapshots__/CreateTransformForm.test.tsx.snap
@@ -172,17 +172,19 @@ exports[`<CreateTransformForm /> spec renders the component 1`] = `
               <div
                 class="euiFlexItem"
               >
-                <h1
-                  class="euiTitle euiTitle--medium"
+                <div
+                  class="euiText euiText--small"
                 >
-                  Job name and description
-                  <span
-                    class="panel-header-count"
-                  >
-                     
-                     
-                  </span>
-                </h1>
+                  <h1>
+                    Job name and description
+                    <span
+                      class="panel-header-count"
+                    >
+                       
+                       
+                    </span>
+                  </h1>
+                </div>
               </div>
             </div>
             <hr
@@ -303,17 +305,19 @@ exports[`<CreateTransformForm /> spec renders the component 1`] = `
                 <div
                   class="euiFlexItem"
                 >
-                  <h1
-                    class="euiTitle euiTitle--medium"
+                  <div
+                    class="euiText euiText--small"
                   >
-                    Indices
-                    <span
-                      class="panel-header-count"
-                    >
-                       
-                       
-                    </span>
-                  </h1>
+                    <h1>
+                      Indices
+                      <span
+                        class="panel-header-count"
+                      >
+                         
+                         
+                      </span>
+                    </h1>
+                  </div>
                 </div>
               </div>
               <hr
diff --git a/public/pages/EditRollup/containers/__snapshots__/EditRollup.test.tsx.snap b/public/pages/EditRollup/containers/__snapshots__/EditRollup.test.tsx.snap
index 78cede257..f01c8ff31 100644
--- a/public/pages/EditRollup/containers/__snapshots__/EditRollup.test.tsx.snap
+++ b/public/pages/EditRollup/containers/__snapshots__/EditRollup.test.tsx.snap
@@ -23,17 +23,19 @@ exports[`<EditRollup /> spec renders the component 1`] = `
       <div
         class="euiFlexItem"
       >
-        <h1
-          class="euiTitle euiTitle--small"
+        <div
+          class="euiText euiText--small"
         >
-          Job name and description
-          <span
-            class="panel-header-count"
-          >
-             
-             
-          </span>
-        </h1>
+          <h1>
+            Job name and description
+            <span
+              class="panel-header-count"
+            >
+               
+               
+            </span>
+          </h1>
+        </div>
       </div>
     </div>
     <hr
@@ -159,17 +161,19 @@ exports[`<EditRollup /> spec renders the component 1`] = `
       <div
         class="euiFlexItem"
       >
-        <h1
-          class="euiTitle euiTitle--small"
+        <div
+          class="euiText euiText--small"
         >
-          Schedule
-          <span
-            class="panel-header-count"
-          >
-             
-             
-          </span>
-        </h1>
+          <h1>
+            Schedule
+            <span
+              class="panel-header-count"
+            >
+               
+               
+            </span>
+          </h1>
+        </div>
       </div>
     </div>
     <hr
diff --git a/public/pages/ForceMerge/container/ForceMerge/__snapshots__/ForceMerge.test.tsx.snap b/public/pages/ForceMerge/container/ForceMerge/__snapshots__/ForceMerge.test.tsx.snap
index 7325372fe..b6442a1bc 100644
--- a/public/pages/ForceMerge/container/ForceMerge/__snapshots__/ForceMerge.test.tsx.snap
+++ b/public/pages/ForceMerge/container/ForceMerge/__snapshots__/ForceMerge.test.tsx.snap
@@ -38,17 +38,19 @@ exports[`<ForceMerge /> spec renders the component 1`] = `
       <div
         class="euiFlexItem"
       >
-        <h1
-          class="euiTitle euiTitle--small"
+        <div
+          class="euiText euiText--small"
         >
-          Configure source index
-          <span
-            class="panel-header-count"
-          >
-             
-             
-          </span>
-        </h1>
+          <h1>
+            Configure source index
+            <span
+              class="panel-header-count"
+            >
+               
+               
+            </span>
+          </h1>
+        </div>
       </div>
     </div>
     <hr
diff --git a/public/pages/Indices/containers/Indices/__snapshots__/Indices.test.tsx.snap b/public/pages/Indices/containers/Indices/__snapshots__/Indices.test.tsx.snap
index 26164b897..025a6e559 100644
--- a/public/pages/Indices/containers/Indices/__snapshots__/Indices.test.tsx.snap
+++ b/public/pages/Indices/containers/Indices/__snapshots__/Indices.test.tsx.snap
@@ -12,17 +12,19 @@ exports[`<Indices /> spec renders the component 1`] = `
     <div
       class="euiFlexItem"
     >
-      <h1
-        class="euiTitle euiTitle--large"
+      <div
+        class="euiText euiText--small"
       >
-        Indexes
-        <span
-          class="panel-header-count"
-        >
-           
-           
-        </span>
-      </h1>
+        <h1>
+          Indexes
+          <span
+            class="panel-header-count"
+          >
+             
+             
+          </span>
+        </h1>
+      </div>
     </div>
     <div
       class="euiFlexItem euiFlexItem--flexGrowZero"
diff --git a/public/pages/ManagedIndices/containers/ManagedIndices/__snapshots__/ManagedIndices.test.tsx.snap b/public/pages/ManagedIndices/containers/ManagedIndices/__snapshots__/ManagedIndices.test.tsx.snap
index bca319af4..53ee3e7cf 100644
--- a/public/pages/ManagedIndices/containers/ManagedIndices/__snapshots__/ManagedIndices.test.tsx.snap
+++ b/public/pages/ManagedIndices/containers/ManagedIndices/__snapshots__/ManagedIndices.test.tsx.snap
@@ -65,17 +65,19 @@ exports[`<ManagedIndices /> spec renders the component 1`] = `
       <div
         class="euiFlexItem"
       >
-        <h1
-          class="euiTitle euiTitle--large"
+        <div
+          class="euiText euiText--small"
         >
-          Policy managed indexes
-          <span
-            class="panel-header-count"
-          >
-             
-             
-          </span>
-        </h1>
+          <h1>
+            Policy managed indexes
+            <span
+              class="panel-header-count"
+            >
+               
+               
+            </span>
+          </h1>
+        </div>
       </div>
       <div
         class="euiFlexItem euiFlexItem--flexGrowZero"
diff --git a/public/pages/Policies/containers/Policies/__snapshots__/Policies.test.tsx.snap b/public/pages/Policies/containers/Policies/__snapshots__/Policies.test.tsx.snap
index 16db51da8..e4d2b024e 100644
--- a/public/pages/Policies/containers/Policies/__snapshots__/Policies.test.tsx.snap
+++ b/public/pages/Policies/containers/Policies/__snapshots__/Policies.test.tsx.snap
@@ -15,17 +15,19 @@ exports[`<IndexPolicies /> spec renders the component 1`] = `
       <div
         class="euiFlexItem"
       >
-        <h1
-          class="euiTitle euiTitle--large"
+        <div
+          class="euiText euiText--small"
         >
-          State management policies
-          <span
-            class="panel-header-count"
-          >
-             
-             
-          </span>
-        </h1>
+          <h1>
+            State management policies
+            <span
+              class="panel-header-count"
+            >
+               
+               
+            </span>
+          </h1>
+        </div>
       </div>
       <div
         class="euiFlexItem euiFlexItem--flexGrowZero"
diff --git a/public/pages/PolicyDetails/components/PolicySettings/__snapshots__/PolicySettings.test.tsx.snap b/public/pages/PolicyDetails/components/PolicySettings/__snapshots__/PolicySettings.test.tsx.snap
index 7f4326ad4..ca6824a68 100644
--- a/public/pages/PolicyDetails/components/PolicySettings/__snapshots__/PolicySettings.test.tsx.snap
+++ b/public/pages/PolicyDetails/components/PolicySettings/__snapshots__/PolicySettings.test.tsx.snap
@@ -12,17 +12,19 @@ exports[`<PolicySettings /> spec renders the component 1`] = `
     <div
       class="euiFlexItem"
     >
-      <h1
-        class="euiTitle euiTitle--small"
+      <div
+        class="euiText euiText--small"
       >
-        Policy settings
-        <span
-          class="panel-header-count"
-        >
-           
-           
-        </span>
-      </h1>
+        <h1>
+          Policy settings
+          <span
+            class="panel-header-count"
+          >
+             
+             
+          </span>
+        </h1>
+      </div>
     </div>
   </div>
   <hr
diff --git a/public/pages/Reindex/components/CreateIndexFlyout/CreateIndexFlyout.tsx b/public/pages/Reindex/components/CreateIndexFlyout/CreateIndexFlyout.tsx
index 9683e5ce8..922b532d5 100644
--- a/public/pages/Reindex/components/CreateIndexFlyout/CreateIndexFlyout.tsx
+++ b/public/pages/Reindex/components/CreateIndexFlyout/CreateIndexFlyout.tsx
@@ -6,7 +6,7 @@
 import React from "react";
 import CreateIndex, { IndexFormProps, IndexForm } from "../../../CreateIndex/containers/IndexForm";
 import { CoreServicesContext } from "../../../../components/core_services";
-import { EuiFlyout, EuiFlyoutBody, EuiFlyoutFooter, EuiFlyoutHeader, EuiTitle } from "@elastic/eui";
+import { EuiFlyout, EuiFlyoutBody, EuiFlyoutFooter, EuiFlyoutHeader, EuiText, EuiTitle } from "@elastic/eui";
 import FlyoutFooter from "../../../VisualCreatePolicy/components/FlyoutFooter";
 
 interface CreateIndexFlyoutProps extends IndexFormProps {
@@ -24,9 +24,9 @@ export default class CreateIndexFlyout extends React.Component<CreateIndexFlyout
     return (
       <EuiFlyout onClose={() => {}} hideCloseButton>
         <EuiFlyoutHeader hasBorder>
-          <EuiTitle size="m">
+          <EuiText size="s">
             <h2 id="flyoutTitle"> Create Index </h2>
-          </EuiTitle>
+          </EuiText>
         </EuiFlyoutHeader>
 
         <EuiFlyoutBody>
diff --git a/public/pages/Reindex/components/CreateIndexFlyout/__snapshots__/CreateIndexFlyout.test.tsx.snap b/public/pages/Reindex/components/CreateIndexFlyout/__snapshots__/CreateIndexFlyout.test.tsx.snap
index fd8f45ac6..dd9737ff7 100644
--- a/public/pages/Reindex/components/CreateIndexFlyout/__snapshots__/CreateIndexFlyout.test.tsx.snap
+++ b/public/pages/Reindex/components/CreateIndexFlyout/__snapshots__/CreateIndexFlyout.test.tsx.snap
@@ -33,12 +33,15 @@ Object {
           <div
             class="euiFlyoutHeader euiFlyoutHeader--hasBorder"
           >
-            <h2
-              class="euiTitle euiTitle--medium"
-              id="flyoutTitle"
+            <div
+              class="euiText euiText--small"
             >
-               Create Index 
-            </h2>
+              <h2
+                id="flyoutTitle"
+              >
+                 Create Index 
+              </h2>
+            </div>
           </div>
           <div
             class="euiFlyoutBody"
diff --git a/public/pages/Reindex/container/Reindex/__snapshots__/Reindex.test.tsx.snap b/public/pages/Reindex/container/Reindex/__snapshots__/Reindex.test.tsx.snap
index 3f8dae5da..29d0b2b86 100644
--- a/public/pages/Reindex/container/Reindex/__snapshots__/Reindex.test.tsx.snap
+++ b/public/pages/Reindex/container/Reindex/__snapshots__/Reindex.test.tsx.snap
@@ -55,17 +55,19 @@ exports[`<Reindex /> spec renders the component 1`] = `
       <div
         class="euiFlexItem"
       >
-        <h1
-          class="euiTitle euiTitle--small"
+        <div
+          class="euiText euiText--small"
         >
-          Configure source index
-          <span
-            class="panel-header-count"
-          >
-             
-             
-          </span>
-        </h1>
+          <h1>
+            Configure source index
+            <span
+              class="panel-header-count"
+            >
+               
+               
+            </span>
+          </h1>
+        </div>
       </div>
     </div>
     <hr
@@ -242,17 +244,19 @@ exports[`<Reindex /> spec renders the component 1`] = `
       <div
         class="euiFlexItem"
       >
-        <h1
-          class="euiTitle euiTitle--small"
+        <div
+          class="euiText euiText--small"
         >
-          Configure destination index
-          <span
-            class="panel-header-count"
-          >
-             
-             
-          </span>
-        </h1>
+          <h1>
+            Configure destination index
+            <span
+              class="panel-header-count"
+            >
+               
+               
+            </span>
+          </h1>
+        </div>
       </div>
     </div>
     <hr
diff --git a/public/pages/Rollover/containers/Rollover/__snapshots__/Rollover.test.tsx.snap b/public/pages/Rollover/containers/Rollover/__snapshots__/Rollover.test.tsx.snap
index 45b190cd0..f225d4269 100644
--- a/public/pages/Rollover/containers/Rollover/__snapshots__/Rollover.test.tsx.snap
+++ b/public/pages/Rollover/containers/Rollover/__snapshots__/Rollover.test.tsx.snap
@@ -36,17 +36,19 @@ exports[`container <Rollover /> spec render the component 1`] = `
       <div
         class="euiFlexItem"
       >
-        <h1
-          class="euiTitle euiTitle--small"
+        <div
+          class="euiText euiText--small"
         >
-          Configure source
-          <span
-            class="panel-header-count"
-          >
-             
-             
-          </span>
-        </h1>
+          <h1>
+            Configure source
+            <span
+              class="panel-header-count"
+            >
+               
+               
+            </span>
+          </h1>
+        </div>
       </div>
     </div>
     <hr
diff --git a/public/pages/ShrinkIndex/container/ShrinkIndex/__snapshots__/ShrinkIndex.test.tsx.snap b/public/pages/ShrinkIndex/container/ShrinkIndex/__snapshots__/ShrinkIndex.test.tsx.snap
index 50367933a..b507aae8f 100644
--- a/public/pages/ShrinkIndex/container/ShrinkIndex/__snapshots__/ShrinkIndex.test.tsx.snap
+++ b/public/pages/ShrinkIndex/container/ShrinkIndex/__snapshots__/ShrinkIndex.test.tsx.snap
@@ -155,17 +155,19 @@ exports[`<Shrink index /> spec renders the component 1`] = `
         <div
           class="euiFlexItem"
         >
-          <h1
-            class="euiTitle euiTitle--small"
+          <div
+            class="euiText euiText--small"
           >
-            Configure target index
-            <span
-              class="panel-header-count"
-            >
-               
-               
-            </span>
-          </h1>
+            <h1>
+              Configure target index
+              <span
+                class="panel-header-count"
+              >
+                 
+                 
+              </span>
+            </h1>
+          </div>
         </div>
       </div>
       <hr
@@ -680,17 +682,19 @@ exports[`<Shrink index /> spec renders the component 1`] = `
                 <div
                   class="euiFlexItem"
                 >
-                  <h1
-                    class="euiTitle euiTitle--small"
+                  <div
+                    class="euiText euiText--small"
                   >
-                    Advanced settings
-                    <span
-                      class="panel-header-count"
-                    >
-                       
-                       
-                    </span>
-                  </h1>
+                    <h1>
+                      Advanced settings
+                      <span
+                        class="panel-header-count"
+                      >
+                         
+                         
+                      </span>
+                    </h1>
+                  </div>
                 </div>
               </div>
             </span>
diff --git a/public/pages/Transforms/containers/Transforms/__snapshots__/EditTransform.test.tsx.snap b/public/pages/Transforms/containers/Transforms/__snapshots__/EditTransform.test.tsx.snap
index 86ee0124e..6f3a79038 100644
--- a/public/pages/Transforms/containers/Transforms/__snapshots__/EditTransform.test.tsx.snap
+++ b/public/pages/Transforms/containers/Transforms/__snapshots__/EditTransform.test.tsx.snap
@@ -23,17 +23,19 @@ exports[`<EditTransform /> spec renders the component 1`] = `
       <div
         class="euiFlexItem"
       >
-        <h1
-          class="euiTitle euiTitle--medium"
+        <div
+          class="euiText euiText--small"
         >
-          Job name and description
-          <span
-            class="panel-header-count"
-          >
-             
-             
-          </span>
-        </h1>
+          <h1>
+            Job name and description
+            <span
+              class="panel-header-count"
+            >
+               
+               
+            </span>
+          </h1>
+        </div>
       </div>
     </div>
     <hr
@@ -159,17 +161,19 @@ exports[`<EditTransform /> spec renders the component 1`] = `
       <div
         class="euiFlexItem"
       >
-        <h1
-          class="euiTitle euiTitle--medium"
+        <div
+          class="euiText euiText--small"
         >
-          Indices
-          <span
-            class="panel-header-count"
-          >
-             
-             
-          </span>
-        </h1>
+          <h1>
+            Indices
+            <span
+              class="panel-header-count"
+            >
+               
+               
+            </span>
+          </h1>
+        </div>
       </div>
     </div>
     <hr
@@ -338,17 +342,19 @@ exports[`<EditTransform /> spec renders the component 1`] = `
       <div
         class="euiFlexItem"
       >
-        <h1
-          class="euiTitle euiTitle--medium"
+        <div
+          class="euiText euiText--small"
         >
-          Schedule
-          <span
-            class="panel-header-count"
-          >
-             
-             
-          </span>
-        </h1>
+          <h1>
+            Schedule
+            <span
+              class="panel-header-count"
+            >
+               
+               
+            </span>
+          </h1>
+        </div>
       </div>
     </div>
     <hr
diff --git a/public/pages/VisualCreatePolicy/components/PolicyInfo/__snapshots__/PolicyInfo.test.tsx.snap b/public/pages/VisualCreatePolicy/components/PolicyInfo/__snapshots__/PolicyInfo.test.tsx.snap
index b0075cd58..77b838383 100644
--- a/public/pages/VisualCreatePolicy/components/PolicyInfo/__snapshots__/PolicyInfo.test.tsx.snap
+++ b/public/pages/VisualCreatePolicy/components/PolicyInfo/__snapshots__/PolicyInfo.test.tsx.snap
@@ -12,17 +12,19 @@ exports[`<PolicyInfo /> spec renders the component 1`] = `
     <div
       class="euiFlexItem"
     >
-      <h1
-        class="euiTitle euiTitle--small"
+      <div
+        class="euiText euiText--small"
       >
-        Policy info
-        <span
-          class="panel-header-count"
-        >
-           
-           
-        </span>
-      </h1>
+        <h1>
+          Policy info
+          <span
+            class="panel-header-count"
+          >
+             
+             
+          </span>
+        </h1>
+      </div>
     </div>
   </div>
   <hr
diff --git a/public/pages/VisualCreatePolicy/components/States/__snapshots__/States.test.tsx.snap b/public/pages/VisualCreatePolicy/components/States/__snapshots__/States.test.tsx.snap
index 6e0e652bc..c6edd3913 100644
--- a/public/pages/VisualCreatePolicy/components/States/__snapshots__/States.test.tsx.snap
+++ b/public/pages/VisualCreatePolicy/components/States/__snapshots__/States.test.tsx.snap
@@ -12,17 +12,19 @@ exports[`<States /> spec renders the component 1`] = `
     <div
       class="euiFlexItem"
     >
-      <h1
-        class="euiTitle euiTitle--small"
+      <div
+        class="euiText euiText--small"
       >
-        States (2)
-        <span
-          class="panel-header-count"
-        >
-           
-           
-        </span>
-      </h1>
+        <h1>
+          States (2)
+          <span
+            class="panel-header-count"
+          >
+             
+             
+          </span>
+        </h1>
+      </div>
       <div
         class="euiText euiText--small"
         style="padding: 5px 0px;"