From 42257e666950c4d3a031a983e87a7e8cd739a994 Mon Sep 17 00:00:00 2001
From: nicolethoen <nthoen@redhat.com>
Date: Wed, 3 May 2023 22:05:01 -0400
Subject: [PATCH 1/5] fix(Wizard): update close button and title structures

---
 .../src/components/Wizard/WizardHeader.tsx    |  15 +-
 .../components/Wizard/WizardHeader.tsx        |  14 +-
 .../__snapshots__/WizardBody.test.tsx.snap    |   4 +-
 .../__snapshots__/WizardFooter.test.tsx.snap  |   2 +-
 .../WizardFooterInternal.test.tsx.snap        |  10 +-
 .../__snapshots__/WizardHeader.test.tsx.snap  |  21 +-
 .../__snapshots__/WizardNav.test.tsx.snap     |   4 +-
 .../__snapshots__/WizardNavItem.test.tsx.snap |   4 +-
 .../__snapshots__/WizardToggle.test.tsx.snap  |  20 +-
 .../__snapshots__/Wizard.test.tsx.snap        | 298 +++++++++---------
 .../cypress/integration/wizard.spec.ts        |   2 +-
 .../integration/wizarddeprecated.spec.ts      |   4 +-
 12 files changed, 203 insertions(+), 195 deletions(-)

diff --git a/packages/react-core/src/components/Wizard/WizardHeader.tsx b/packages/react-core/src/components/Wizard/WizardHeader.tsx
index b197e6faa86..3d1daf80bcd 100644
--- a/packages/react-core/src/components/Wizard/WizardHeader.tsx
+++ b/packages/react-core/src/components/Wizard/WizardHeader.tsx
@@ -36,14 +36,15 @@ export const WizardHeader: React.FunctionComponent<WizardHeaderProps> = ({
 }: WizardHeaderProps) => (
   <div className={css(styles.wizardHeader)}>
     {!isCloseHidden && (
-      <Button variant="plain" className={css(styles.wizardClose)} aria-label={closeButtonAriaLabel} onClick={onClose}>
-        <TimesIcon aria-hidden="true" />
-      </Button>
+      <div className={css(styles.wizardClose)}>
+        <Button variant="plain" aria-label={closeButtonAriaLabel} onClick={onClose}>
+          <TimesIcon aria-hidden="true" />
+        </Button>
+      </div>
     )}
-
-    <Title headingLevel="h2" size="3xl" className={css(styles.wizardTitle)} aria-label={title} id={titleId}>
-      {title || <>&nbsp;</>}
-    </Title>
+    <div className={css(styles.wizardTitle)}>
+      <h2 className={css(styles.wizardTitleText)}>{title || <>&nbsp;</>}</h2>
+    </div>
 
     {description && (
       <Component className={css(styles.wizardDescription)} id={descriptionId}>
diff --git a/packages/react-core/src/deprecated/components/Wizard/WizardHeader.tsx b/packages/react-core/src/deprecated/components/Wizard/WizardHeader.tsx
index a41307fcb4f..72264f394b0 100644
--- a/packages/react-core/src/deprecated/components/Wizard/WizardHeader.tsx
+++ b/packages/react-core/src/deprecated/components/Wizard/WizardHeader.tsx
@@ -36,13 +36,15 @@ export const WizardHeader: React.FunctionComponent<WizardHeaderProps> = ({
 }: WizardHeaderProps) => (
   <div className={css(styles.wizardHeader)}>
     {!hideClose && (
-      <Button variant="plain" className={css(styles.wizardClose)} aria-label={closeButtonAriaLabel} onClick={onClose}>
-        <TimesIcon aria-hidden="true" />
-      </Button>
+      <div className={css(styles.wizardClose)}>
+        <Button variant="plain" aria-label={closeButtonAriaLabel} onClick={onClose}>
+          <TimesIcon aria-hidden="true" />
+        </Button>
+      </div>
     )}
-    <Title headingLevel="h2" size="3xl" className={css(styles.wizardTitle)} aria-label={title} id={titleId}>
-      {title || <>&nbsp;</>}
-    </Title>
+    <div className={css(styles.wizardTitle)}>
+      <h2 className={css(styles.wizardTitleText)}>{title || <>&nbsp;</>}</h2>
+    </div>
     {description && (
       <Component className={css(styles.wizardDescription)} id={descriptionId}>
         {description}
diff --git a/packages/react-core/src/deprecated/components/Wizard/__tests__/Generated/__snapshots__/WizardBody.test.tsx.snap b/packages/react-core/src/deprecated/components/Wizard/__tests__/Generated/__snapshots__/WizardBody.test.tsx.snap
index 0aac52d258c..5f65ee15ccf 100644
--- a/packages/react-core/src/deprecated/components/Wizard/__tests__/Generated/__snapshots__/WizardBody.test.tsx.snap
+++ b/packages/react-core/src/deprecated/components/Wizard/__tests__/Generated/__snapshots__/WizardBody.test.tsx.snap
@@ -3,10 +3,10 @@
 exports[`WizardBody should match snapshot (auto-generated) 1`] = `
 <DocumentFragment>
   <div
-    class="pf-v5-c-wizard__main"
+    class="pf-c-wizard__main"
   >
     <div
-      class="pf-v5-c-wizard__main-body"
+      class="pf-c-wizard__main-body"
     >
       any
     </div>
diff --git a/packages/react-core/src/deprecated/components/Wizard/__tests__/Generated/__snapshots__/WizardFooter.test.tsx.snap b/packages/react-core/src/deprecated/components/Wizard/__tests__/Generated/__snapshots__/WizardFooter.test.tsx.snap
index 0f1112c6911..758f6a43176 100644
--- a/packages/react-core/src/deprecated/components/Wizard/__tests__/Generated/__snapshots__/WizardFooter.test.tsx.snap
+++ b/packages/react-core/src/deprecated/components/Wizard/__tests__/Generated/__snapshots__/WizardFooter.test.tsx.snap
@@ -3,7 +3,7 @@
 exports[`WizardFooter should match snapshot (auto-generated) 1`] = `
 <DocumentFragment>
   <footer
-    class="pf-v5-c-wizard__footer"
+    class="pf-c-wizard__footer"
   >
     any
   </footer>
diff --git a/packages/react-core/src/deprecated/components/Wizard/__tests__/Generated/__snapshots__/WizardFooterInternal.test.tsx.snap b/packages/react-core/src/deprecated/components/Wizard/__tests__/Generated/__snapshots__/WizardFooterInternal.test.tsx.snap
index 6e7d65c6f2f..16c22891d0e 100644
--- a/packages/react-core/src/deprecated/components/Wizard/__tests__/Generated/__snapshots__/WizardFooterInternal.test.tsx.snap
+++ b/packages/react-core/src/deprecated/components/Wizard/__tests__/Generated/__snapshots__/WizardFooterInternal.test.tsx.snap
@@ -3,11 +3,11 @@
 exports[`WizardFooterInternal should match snapshot (auto-generated) 1`] = `
 <DocumentFragment>
   <footer
-    class="pf-v5-c-wizard__footer"
+    class="pf-c-wizard__footer"
   >
     <button
       aria-disabled="true"
-      class="pf-v5-c-button pf-m-secondary pf-m-disabled"
+      class="pf-c-button pf-m-secondary pf-m-disabled"
       data-ouia-component-id="OUIA-Generated-Button-secondary-1"
       data-ouia-component-type="PF4/Button"
       data-ouia-safe="true"
@@ -20,7 +20,7 @@ exports[`WizardFooterInternal should match snapshot (auto-generated) 1`] = `
     </button>
     <button
       aria-disabled="false"
-      class="pf-v5-c-button pf-m-primary"
+      class="pf-c-button pf-m-primary"
       data-ouia-component-id="OUIA-Generated-Button-primary-1"
       data-ouia-component-type="PF4/Button"
       data-ouia-safe="true"
@@ -31,11 +31,11 @@ exports[`WizardFooterInternal should match snapshot (auto-generated) 1`] = `
       </div>
     </button>
     <div
-      class="pf-v5-c-wizard__footer-cancel"
+      class="pf-c-wizard__footer-cancel"
     >
       <button
         aria-disabled="false"
-        class="pf-v5-c-button pf-m-link"
+        class="pf-c-button pf-m-link"
         data-ouia-component-id="OUIA-Generated-Button-link-1"
         data-ouia-component-type="PF4/Button"
         data-ouia-safe="true"
diff --git a/packages/react-core/src/deprecated/components/Wizard/__tests__/Generated/__snapshots__/WizardHeader.test.tsx.snap b/packages/react-core/src/deprecated/components/Wizard/__tests__/Generated/__snapshots__/WizardHeader.test.tsx.snap
index 90195641ea6..88cf2d48017 100644
--- a/packages/react-core/src/deprecated/components/Wizard/__tests__/Generated/__snapshots__/WizardHeader.test.tsx.snap
+++ b/packages/react-core/src/deprecated/components/Wizard/__tests__/Generated/__snapshots__/WizardHeader.test.tsx.snap
@@ -3,20 +3,19 @@
 exports[`WizardHeader should match snapshot (auto-generated) 1`] = `
 <DocumentFragment>
   <div
-    class="pf-v5-c-wizard__header"
+    class="pf-c-wizard__header"
   >
-    <h2
-      aria-label="string"
-      class="pf-v5-c-title pf-m-3xl pf-v5-c-wizard__title"
-      data-ouia-component-id="OUIA-Generated-Title-1"
-      data-ouia-component-type="PF4/Title"
-      data-ouia-safe="true"
-      id="string"
+    <div
+      class="pf-c-wizard__title"
     >
-      string
-    </h2>
+      <h2
+        class="pf-c-wizard__title-text"
+      >
+        string
+      </h2>
+    </div>
     <p
-      class="pf-v5-c-wizard__description"
+      class="pf-c-wizard__description"
       id="string"
     />
     <div>
diff --git a/packages/react-core/src/deprecated/components/Wizard/__tests__/Generated/__snapshots__/WizardNav.test.tsx.snap b/packages/react-core/src/deprecated/components/Wizard/__tests__/Generated/__snapshots__/WizardNav.test.tsx.snap
index cc036e4a8cb..fc27edf7ffe 100644
--- a/packages/react-core/src/deprecated/components/Wizard/__tests__/Generated/__snapshots__/WizardNav.test.tsx.snap
+++ b/packages/react-core/src/deprecated/components/Wizard/__tests__/Generated/__snapshots__/WizardNav.test.tsx.snap
@@ -5,13 +5,13 @@ exports[`WizardNav should match snapshot (auto-generated) 1`] = `
   <nav
     aria-label="string"
     aria-labelledby="string"
-    class="pf-v5-c-wizard__nav"
+    class="pf-c-wizard__nav"
     data-ouia-component-id="OUIA-Generated-WizardNav-1"
     data-ouia-component-type="PF4/WizardNav"
     data-ouia-safe="true"
   >
     <ol
-      class="pf-v5-c-wizard__nav-list"
+      class="pf-c-wizard__nav-list"
       role="list"
     >
       any
diff --git a/packages/react-core/src/deprecated/components/Wizard/__tests__/Generated/__snapshots__/WizardNavItem.test.tsx.snap b/packages/react-core/src/deprecated/components/Wizard/__tests__/Generated/__snapshots__/WizardNavItem.test.tsx.snap
index 1d8b0c43acf..f00d3a101aa 100644
--- a/packages/react-core/src/deprecated/components/Wizard/__tests__/Generated/__snapshots__/WizardNavItem.test.tsx.snap
+++ b/packages/react-core/src/deprecated/components/Wizard/__tests__/Generated/__snapshots__/WizardNavItem.test.tsx.snap
@@ -3,11 +3,11 @@
 exports[`WizardNavItem should match snapshot (auto-generated) 1`] = `
 <DocumentFragment>
   <li
-    class="pf-v5-c-wizard__nav-item"
+    class="pf-c-wizard__nav-item"
   >
     <button
       aria-current="false"
-      class="pf-v5-c-wizard__nav-link"
+      class="pf-c-wizard__nav-link"
       data-ouia-component-id="OUIA-Generated-WizardNavItem-1"
       data-ouia-component-type="PF4/WizardNavItem"
       data-ouia-safe="true"
diff --git a/packages/react-core/src/deprecated/components/Wizard/__tests__/Generated/__snapshots__/WizardToggle.test.tsx.snap b/packages/react-core/src/deprecated/components/Wizard/__tests__/Generated/__snapshots__/WizardToggle.test.tsx.snap
index 0f4f41947c6..029509fe32f 100644
--- a/packages/react-core/src/deprecated/components/Wizard/__tests__/Generated/__snapshots__/WizardToggle.test.tsx.snap
+++ b/packages/react-core/src/deprecated/components/Wizard/__tests__/Generated/__snapshots__/WizardToggle.test.tsx.snap
@@ -5,26 +5,26 @@ exports[`WizardToggle should match snapshot (auto-generated) 1`] = `
   <button
     aria-expanded="true"
     aria-label="'Wizard Toggle'"
-    class="pf-v5-c-wizard__toggle pf-m-expanded"
+    class="pf-c-wizard__toggle pf-m-expanded"
   >
     <span
-      class="pf-v5-c-wizard__toggle-list"
+      class="pf-c-wizard__toggle-list"
     >
       <span
-        class="pf-v5-c-wizard__toggle-list-item"
+        class="pf-c-wizard__toggle-list-item"
       >
         <span
-          class="pf-v5-c-wizard__toggle-num"
+          class="pf-c-wizard__toggle-num"
         />
          
       </span>
     </span>
     <span
-      class="pf-v5-c-wizard__toggle-icon"
+      class="pf-c-wizard__toggle-icon"
     >
       <svg
         aria-hidden="true"
-        class="pf-v5-svg"
+        class="pf-svg"
         fill="currentColor"
         role="img"
         viewBox="0 0 320 512"
@@ -36,16 +36,16 @@ exports[`WizardToggle should match snapshot (auto-generated) 1`] = `
     </span>
   </button>
   <div
-    class="pf-v5-c-wizard__outer-wrap"
+    class="pf-c-wizard__outer-wrap"
   >
     <div
-      class="pf-v5-c-wizard__inner-wrap"
+      class="pf-c-wizard__inner-wrap"
     >
       <div
-        class="pf-v5-c-wizard__main"
+        class="pf-c-wizard__main"
       >
         <div
-          class="pf-v5-c-wizard__main-body"
+          class="pf-c-wizard__main-body"
         />
       </div>
     </div>
diff --git a/packages/react-core/src/deprecated/components/Wizard/__tests__/__snapshots__/Wizard.test.tsx.snap b/packages/react-core/src/deprecated/components/Wizard/__tests__/__snapshots__/Wizard.test.tsx.snap
index c7146b126cb..8eb711df4ea 100644
--- a/packages/react-core/src/deprecated/components/Wizard/__tests__/__snapshots__/Wizard.test.tsx.snap
+++ b/packages/react-core/src/deprecated/components/Wizard/__tests__/__snapshots__/Wizard.test.tsx.snap
@@ -3,44 +3,47 @@
 exports[`Wizard Expandable Nav Wizard should match snapshot 1`] = `
 <DocumentFragment>
   <div
-    class="pf-v5-c-wizard"
+    class="pf-c-wizard"
   >
     <div
-      class="pf-v5-c-wizard__header"
+      class="pf-c-wizard__header"
     >
-      <button
-        aria-disabled="false"
-        aria-label="Close"
-        class="pf-v5-c-button pf-m-plain pf-v5-c-wizard__close"
-        data-ouia-component-id="OUIA-Generated-Button-plain-2"
-        data-ouia-component-type="PF4/Button"
-        data-ouia-safe="true"
-        type="button"
+      <div
+        class="pf-c-wizard__close"
       >
-        <svg
-          aria-hidden="true"
-          class="pf-v5-svg"
-          fill="currentColor"
-          role="img"
-          viewBox="0 0 352 512"
+        <button
+          aria-disabled="false"
+          aria-label="Close"
+          class="pf-c-button pf-m-plain"
+          data-ouia-component-id="OUIA-Generated-Button-plain-2"
+          data-ouia-component-type="PF4/Button"
+          data-ouia-safe="true"
+          type="button"
         >
-          <path
-            d="M242.72 256l100.07-100.07c12.28-12.28 12.28-32.19 0-44.48l-22.24-22.24c-12.28-12.28-32.19-12.28-44.48 0L176 189.28 75.93 89.21c-12.28-12.28-32.19-12.28-44.48 0L9.21 111.45c-12.28 12.28-12.28 32.19 0 44.48L109.28 256 9.21 356.07c-12.28 12.28-12.28 32.19 0 44.48l22.24 22.24c12.28 12.28 32.2 12.28 44.48 0L176 322.72l100.07 100.07c12.28 12.28 32.2 12.28 44.48 0l22.24-22.24c12.28-12.28 12.28-32.19 0-44.48L242.72 256z"
-          />
-        </svg>
-      </button>
-      <h2
-        aria-label="Wizard title"
-        class="pf-v5-c-title pf-m-3xl pf-v5-c-wizard__title"
-        data-ouia-component-id="OUIA-Generated-Title-2"
-        data-ouia-component-type="PF4/Title"
-        data-ouia-safe="true"
-        id="pf-wizard-title-1"
+          <svg
+            aria-hidden="true"
+            class="pf-svg"
+            fill="currentColor"
+            role="img"
+            viewBox="0 0 352 512"
+          >
+            <path
+              d="M242.72 256l100.07-100.07c12.28-12.28 12.28-32.19 0-44.48l-22.24-22.24c-12.28-12.28-32.19-12.28-44.48 0L176 189.28 75.93 89.21c-12.28-12.28-32.19-12.28-44.48 0L9.21 111.45c-12.28 12.28-12.28 32.19 0 44.48L109.28 256 9.21 356.07c-12.28 12.28-12.28 32.19 0 44.48l22.24 22.24c12.28 12.28 32.2 12.28 44.48 0L176 322.72l100.07 100.07c12.28 12.28 32.2 12.28 44.48 0l22.24-22.24c12.28-12.28 12.28-32.19 0-44.48L242.72 256z"
+            />
+          </svg>
+        </button>
+      </div>
+      <div
+        class="pf-c-wizard__title"
       >
-        Wizard title
-      </h2>
+        <h2
+          class="pf-c-wizard__title-text"
+        >
+          Wizard title
+        </h2>
+      </div>
       <p
-        class="pf-v5-c-wizard__description"
+        class="pf-c-wizard__description"
         id="pf-wizard-description-1"
       >
         Description here
@@ -49,16 +52,16 @@ exports[`Wizard Expandable Nav Wizard should match snapshot 1`] = `
     <button
       aria-expanded="false"
       aria-label="Wizard Toggle"
-      class="pf-v5-c-wizard__toggle"
+      class="pf-c-wizard__toggle"
     >
       <span
-        class="pf-v5-c-wizard__toggle-list"
+        class="pf-c-wizard__toggle-list"
       >
         <span
-          class="pf-v5-c-wizard__toggle-list-item"
+          class="pf-c-wizard__toggle-list-item"
         >
           <span
-            class="pf-v5-c-wizard__toggle-num"
+            class="pf-c-wizard__toggle-num"
           >
             1
           </span>
@@ -66,11 +69,11 @@ exports[`Wizard Expandable Nav Wizard should match snapshot 1`] = `
         </span>
       </span>
       <span
-        class="pf-v5-c-wizard__toggle-icon"
+        class="pf-c-wizard__toggle-icon"
       >
         <svg
           aria-hidden="true"
-          class="pf-v5-svg"
+          class="pf-svg"
           fill="currentColor"
           role="img"
           viewBox="0 0 320 512"
@@ -82,28 +85,28 @@ exports[`Wizard Expandable Nav Wizard should match snapshot 1`] = `
       </span>
     </button>
     <div
-      class="pf-v5-c-wizard__outer-wrap"
+      class="pf-c-wizard__outer-wrap"
     >
       <div
-        class="pf-v5-c-wizard__inner-wrap"
+        class="pf-c-wizard__inner-wrap"
       >
         <nav
           aria-labelledby="pf-wizard-title-1"
-          class="pf-v5-c-wizard__nav"
+          class="pf-c-wizard__nav"
           data-ouia-component-id="OUIA-Generated-WizardNav-3"
           data-ouia-component-type="PF4/WizardNav"
           data-ouia-safe="true"
         >
           <ol
-            class="pf-v5-c-wizard__nav-list"
+            class="pf-c-wizard__nav-list"
             role="list"
           >
             <li
-              class="pf-v5-c-wizard__nav-item"
+              class="pf-c-wizard__nav-item"
             >
               <button
                 aria-current="step"
-                class="pf-v5-c-wizard__nav-link pf-m-current"
+                class="pf-c-wizard__nav-link pf-m-current"
                 data-ouia-component-id="OUIA-Generated-WizardNavItem-7"
                 data-ouia-component-type="PF4/WizardNavItem"
                 data-ouia-safe="true"
@@ -113,31 +116,31 @@ exports[`Wizard Expandable Nav Wizard should match snapshot 1`] = `
               </button>
             </li>
             <li
-              class="pf-v5-c-wizard__nav-item pf-m-expandable"
+              class="pf-c-wizard__nav-item pf-m-expandable"
             >
               <button
                 aria-current="false"
                 aria-expanded="false"
-                class="pf-v5-c-wizard__nav-link"
+                class="pf-c-wizard__nav-link"
                 data-ouia-component-id="OUIA-Generated-WizardNavItem-8"
                 data-ouia-component-type="PF4/WizardNavItem"
                 data-ouia-safe="true"
                 type="button"
               >
                 <span
-                  class="pf-v5-c-wizard__nav-link-text"
+                  class="pf-c-wizard__nav-link-text"
                 >
                   B
                 </span>
                 <span
-                  class="pf-v5-c-wizard__nav-link-toggle"
+                  class="pf-c-wizard__nav-link-toggle"
                 >
                   <span
-                    class="pf-v5-c-wizard__nav-link-toggle-icon"
+                    class="pf-c-wizard__nav-link-toggle-icon"
                   >
                     <svg
                       aria-hidden="true"
-                      class="pf-v5-svg"
+                      class="pf-svg"
                       fill="currentColor"
                       role="img"
                       viewBox="0 0 256 512"
@@ -150,15 +153,15 @@ exports[`Wizard Expandable Nav Wizard should match snapshot 1`] = `
                 </span>
               </button>
               <ol
-                class="pf-v5-c-wizard__nav-list"
+                class="pf-c-wizard__nav-list"
                 role="list"
               >
                 <li
-                  class="pf-v5-c-wizard__nav-item"
+                  class="pf-c-wizard__nav-item"
                 >
                   <button
                     aria-current="false"
-                    class="pf-v5-c-wizard__nav-link"
+                    class="pf-c-wizard__nav-link"
                     data-ouia-component-id="OUIA-Generated-WizardNavItem-9"
                     data-ouia-component-type="PF4/WizardNavItem"
                     data-ouia-safe="true"
@@ -168,11 +171,11 @@ exports[`Wizard Expandable Nav Wizard should match snapshot 1`] = `
                   </button>
                 </li>
                 <li
-                  class="pf-v5-c-wizard__nav-item"
+                  class="pf-c-wizard__nav-item"
                 >
                   <button
                     aria-current="false"
-                    class="pf-v5-c-wizard__nav-link"
+                    class="pf-c-wizard__nav-link"
                     data-ouia-component-id="OUIA-Generated-WizardNavItem-10"
                     data-ouia-component-type="PF4/WizardNavItem"
                     data-ouia-safe="true"
@@ -184,11 +187,11 @@ exports[`Wizard Expandable Nav Wizard should match snapshot 1`] = `
               </ol>
             </li>
             <li
-              class="pf-v5-c-wizard__nav-item"
+              class="pf-c-wizard__nav-item"
             >
               <button
                 aria-current="false"
-                class="pf-v5-c-wizard__nav-link"
+                class="pf-c-wizard__nav-link"
                 data-ouia-component-id="OUIA-Generated-WizardNavItem-11"
                 data-ouia-component-type="PF4/WizardNavItem"
                 data-ouia-safe="true"
@@ -198,11 +201,11 @@ exports[`Wizard Expandable Nav Wizard should match snapshot 1`] = `
               </button>
             </li>
             <li
-              class="pf-v5-c-wizard__nav-item"
+              class="pf-c-wizard__nav-item"
             >
               <button
                 aria-current="false"
-                class="pf-v5-c-wizard__nav-link"
+                class="pf-c-wizard__nav-link"
                 data-ouia-component-id="OUIA-Generated-WizardNavItem-12"
                 data-ouia-component-type="PF4/WizardNavItem"
                 data-ouia-safe="true"
@@ -214,10 +217,10 @@ exports[`Wizard Expandable Nav Wizard should match snapshot 1`] = `
           </ol>
         </nav>
         <div
-          class="pf-v5-c-wizard__main"
+          class="pf-c-wizard__main"
         >
           <div
-            class="pf-v5-c-wizard__main-body"
+            class="pf-c-wizard__main-body"
           >
             <p>
               Step 1
@@ -226,11 +229,11 @@ exports[`Wizard Expandable Nav Wizard should match snapshot 1`] = `
         </div>
       </div>
       <footer
-        class="pf-v5-c-wizard__footer"
+        class="pf-c-wizard__footer"
       >
         <button
           aria-disabled="true"
-          class="pf-v5-c-button pf-m-secondary pf-m-disabled"
+          class="pf-c-button pf-m-secondary pf-m-disabled"
           data-ouia-component-id="OUIA-Generated-Button-secondary-2"
           data-ouia-component-type="PF4/Button"
           data-ouia-safe="true"
@@ -241,7 +244,7 @@ exports[`Wizard Expandable Nav Wizard should match snapshot 1`] = `
         </button>
         <button
           aria-disabled="false"
-          class="pf-v5-c-button pf-m-primary"
+          class="pf-c-button pf-m-primary"
           data-ouia-component-id="OUIA-Generated-Button-primary-2"
           data-ouia-component-type="PF4/Button"
           data-ouia-safe="true"
@@ -250,11 +253,11 @@ exports[`Wizard Expandable Nav Wizard should match snapshot 1`] = `
           Next
         </button>
         <div
-          class="pf-v5-c-wizard__footer-cancel"
+          class="pf-c-wizard__footer-cancel"
         >
           <button
             aria-disabled="false"
-            class="pf-v5-c-button pf-m-link"
+            class="pf-c-button pf-m-link"
             data-ouia-component-id="OUIA-Generated-Button-link-2"
             data-ouia-component-type="PF4/Button"
             data-ouia-safe="true"
@@ -272,44 +275,47 @@ exports[`Wizard Expandable Nav Wizard should match snapshot 1`] = `
 exports[`Wizard Wizard should match snapshot 1`] = `
 <DocumentFragment>
   <div
-    class="pf-v5-c-wizard"
+    class="pf-c-wizard"
   >
     <div
-      class="pf-v5-c-wizard__header"
+      class="pf-c-wizard__header"
     >
-      <button
-        aria-disabled="false"
-        aria-label="Close"
-        class="pf-v5-c-button pf-m-plain pf-v5-c-wizard__close"
-        data-ouia-component-id="OUIA-Generated-Button-plain-1"
-        data-ouia-component-type="PF4/Button"
-        data-ouia-safe="true"
-        type="button"
+      <div
+        class="pf-c-wizard__close"
       >
-        <svg
-          aria-hidden="true"
-          class="pf-v5-svg"
-          fill="currentColor"
-          role="img"
-          viewBox="0 0 352 512"
+        <button
+          aria-disabled="false"
+          aria-label="Close"
+          class="pf-c-button pf-m-plain"
+          data-ouia-component-id="OUIA-Generated-Button-plain-1"
+          data-ouia-component-type="PF4/Button"
+          data-ouia-safe="true"
+          type="button"
         >
-          <path
-            d="M242.72 256l100.07-100.07c12.28-12.28 12.28-32.19 0-44.48l-22.24-22.24c-12.28-12.28-32.19-12.28-44.48 0L176 189.28 75.93 89.21c-12.28-12.28-32.19-12.28-44.48 0L9.21 111.45c-12.28 12.28-12.28 32.19 0 44.48L109.28 256 9.21 356.07c-12.28 12.28-12.28 32.19 0 44.48l22.24 22.24c12.28 12.28 32.2 12.28 44.48 0L176 322.72l100.07 100.07c12.28 12.28 32.2 12.28 44.48 0l22.24-22.24c12.28-12.28 12.28-32.19 0-44.48L242.72 256z"
-          />
-        </svg>
-      </button>
-      <h2
-        aria-label="Wizard title"
-        class="pf-v5-c-title pf-m-3xl pf-v5-c-wizard__title"
-        data-ouia-component-id="OUIA-Generated-Title-1"
-        data-ouia-component-type="PF4/Title"
-        data-ouia-safe="true"
-        id="pf-wizard-title-0"
+          <svg
+            aria-hidden="true"
+            class="pf-svg"
+            fill="currentColor"
+            role="img"
+            viewBox="0 0 352 512"
+          >
+            <path
+              d="M242.72 256l100.07-100.07c12.28-12.28 12.28-32.19 0-44.48l-22.24-22.24c-12.28-12.28-32.19-12.28-44.48 0L176 189.28 75.93 89.21c-12.28-12.28-32.19-12.28-44.48 0L9.21 111.45c-12.28 12.28-12.28 32.19 0 44.48L109.28 256 9.21 356.07c-12.28 12.28-12.28 32.19 0 44.48l22.24 22.24c12.28 12.28 32.2 12.28 44.48 0L176 322.72l100.07 100.07c12.28 12.28 32.2 12.28 44.48 0l22.24-22.24c12.28-12.28 12.28-32.19 0-44.48L242.72 256z"
+            />
+          </svg>
+        </button>
+      </div>
+      <div
+        class="pf-c-wizard__title"
       >
-        Wizard title
-      </h2>
+        <h2
+          class="pf-c-wizard__title-text"
+        >
+          Wizard title
+        </h2>
+      </div>
       <p
-        class="pf-v5-c-wizard__description"
+        class="pf-c-wizard__description"
         id="pf-wizard-description-0"
       >
         Description here
@@ -318,16 +324,16 @@ exports[`Wizard Wizard should match snapshot 1`] = `
     <button
       aria-expanded="false"
       aria-label="Wizard Toggle"
-      class="pf-v5-c-wizard__toggle"
+      class="pf-c-wizard__toggle"
     >
       <span
-        class="pf-v5-c-wizard__toggle-list"
+        class="pf-c-wizard__toggle-list"
       >
         <span
-          class="pf-v5-c-wizard__toggle-list-item"
+          class="pf-c-wizard__toggle-list-item"
         >
           <span
-            class="pf-v5-c-wizard__toggle-num"
+            class="pf-c-wizard__toggle-num"
           >
             1
           </span>
@@ -335,11 +341,11 @@ exports[`Wizard Wizard should match snapshot 1`] = `
         </span>
       </span>
       <span
-        class="pf-v5-c-wizard__toggle-icon"
+        class="pf-c-wizard__toggle-icon"
       >
         <svg
           aria-hidden="true"
-          class="pf-v5-svg"
+          class="pf-svg"
           fill="currentColor"
           role="img"
           viewBox="0 0 320 512"
@@ -351,28 +357,28 @@ exports[`Wizard Wizard should match snapshot 1`] = `
       </span>
     </button>
     <div
-      class="pf-v5-c-wizard__outer-wrap"
+      class="pf-c-wizard__outer-wrap"
     >
       <div
-        class="pf-v5-c-wizard__inner-wrap"
+        class="pf-c-wizard__inner-wrap"
       >
         <nav
           aria-labelledby="pf-wizard-title-0"
-          class="pf-v5-c-wizard__nav"
+          class="pf-c-wizard__nav"
           data-ouia-component-id="OUIA-Generated-WizardNav-1"
           data-ouia-component-type="PF4/WizardNav"
           data-ouia-safe="true"
         >
           <ol
-            class="pf-v5-c-wizard__nav-list"
+            class="pf-c-wizard__nav-list"
             role="list"
           >
             <li
-              class="pf-v5-c-wizard__nav-item"
+              class="pf-c-wizard__nav-item"
             >
               <button
                 aria-current="step"
-                class="pf-v5-c-wizard__nav-link pf-m-current"
+                class="pf-c-wizard__nav-link pf-m-current"
                 data-ouia-component-id="OUIA-Generated-WizardNavItem-1"
                 data-ouia-component-type="PF4/WizardNavItem"
                 data-ouia-safe="true"
@@ -383,11 +389,11 @@ exports[`Wizard Wizard should match snapshot 1`] = `
               </button>
             </li>
             <li
-              class="pf-v5-c-wizard__nav-item"
+              class="pf-c-wizard__nav-item"
             >
               <button
                 aria-current="false"
-                class="pf-v5-c-wizard__nav-link"
+                class="pf-c-wizard__nav-link"
                 data-ouia-component-id="OUIA-Generated-WizardNavItem-2"
                 data-ouia-component-type="PF4/WizardNavItem"
                 data-ouia-safe="true"
@@ -397,15 +403,15 @@ exports[`Wizard Wizard should match snapshot 1`] = `
                 B
               </button>
               <ol
-                class="pf-v5-c-wizard__nav-list"
+                class="pf-c-wizard__nav-list"
                 role="list"
               >
                 <li
-                  class="pf-v5-c-wizard__nav-item"
+                  class="pf-c-wizard__nav-item"
                 >
                   <button
                     aria-current="false"
-                    class="pf-v5-c-wizard__nav-link"
+                    class="pf-c-wizard__nav-link"
                     data-ouia-component-id="OUIA-Generated-WizardNavItem-3"
                     data-ouia-component-type="PF4/WizardNavItem"
                     data-ouia-safe="true"
@@ -416,11 +422,11 @@ exports[`Wizard Wizard should match snapshot 1`] = `
                   </button>
                 </li>
                 <li
-                  class="pf-v5-c-wizard__nav-item"
+                  class="pf-c-wizard__nav-item"
                 >
                   <button
                     aria-current="false"
-                    class="pf-v5-c-wizard__nav-link"
+                    class="pf-c-wizard__nav-link"
                     data-ouia-component-id="OUIA-Generated-WizardNavItem-4"
                     data-ouia-component-type="PF4/WizardNavItem"
                     data-ouia-safe="true"
@@ -433,11 +439,11 @@ exports[`Wizard Wizard should match snapshot 1`] = `
               </ol>
             </li>
             <li
-              class="pf-v5-c-wizard__nav-item"
+              class="pf-c-wizard__nav-item"
             >
               <button
                 aria-current="false"
-                class="pf-v5-c-wizard__nav-link"
+                class="pf-c-wizard__nav-link"
                 data-ouia-component-id="OUIA-Generated-WizardNavItem-5"
                 data-ouia-component-type="PF4/WizardNavItem"
                 data-ouia-safe="true"
@@ -448,11 +454,11 @@ exports[`Wizard Wizard should match snapshot 1`] = `
               </button>
             </li>
             <li
-              class="pf-v5-c-wizard__nav-item"
+              class="pf-c-wizard__nav-item"
             >
               <button
                 aria-current="false"
-                class="pf-v5-c-wizard__nav-link"
+                class="pf-c-wizard__nav-link"
                 data-ouia-component-id="OUIA-Generated-WizardNavItem-6"
                 data-ouia-component-type="PF4/WizardNavItem"
                 data-ouia-safe="true"
@@ -465,10 +471,10 @@ exports[`Wizard Wizard should match snapshot 1`] = `
           </ol>
         </nav>
         <div
-          class="pf-v5-c-wizard__main"
+          class="pf-c-wizard__main"
         >
           <div
-            class="pf-v5-c-wizard__main-body"
+            class="pf-c-wizard__main-body"
           >
             <p>
               Step 1
@@ -477,11 +483,11 @@ exports[`Wizard Wizard should match snapshot 1`] = `
         </div>
       </div>
       <footer
-        class="pf-v5-c-wizard__footer"
+        class="pf-c-wizard__footer"
       >
         <button
           aria-disabled="true"
-          class="pf-v5-c-button pf-m-secondary pf-m-disabled"
+          class="pf-c-button pf-m-secondary pf-m-disabled"
           data-ouia-component-id="OUIA-Generated-Button-secondary-1"
           data-ouia-component-type="PF4/Button"
           data-ouia-safe="true"
@@ -492,7 +498,7 @@ exports[`Wizard Wizard should match snapshot 1`] = `
         </button>
         <button
           aria-disabled="false"
-          class="pf-v5-c-button pf-m-primary"
+          class="pf-c-button pf-m-primary"
           data-ouia-component-id="OUIA-Generated-Button-primary-1"
           data-ouia-component-type="PF4/Button"
           data-ouia-safe="true"
@@ -501,11 +507,11 @@ exports[`Wizard Wizard should match snapshot 1`] = `
           Next
         </button>
         <div
-          class="pf-v5-c-wizard__footer-cancel"
+          class="pf-c-wizard__footer-cancel"
         >
           <button
             aria-disabled="false"
-            class="pf-v5-c-button pf-m-link"
+            class="pf-c-button pf-m-link"
             data-ouia-component-id="OUIA-Generated-Button-link-1"
             data-ouia-component-type="PF4/Button"
             data-ouia-safe="true"
@@ -523,22 +529,22 @@ exports[`Wizard Wizard should match snapshot 1`] = `
 exports[`Wizard bare wiz 1`] = `
 <DocumentFragment>
   <div
-    class="pf-v5-c-wizard"
+    class="pf-c-wizard"
     id="inPageWizWithAnchorsId"
   >
     <button
       aria-expanded="false"
       aria-label="Wizard Toggle"
-      class="pf-v5-c-wizard__toggle"
+      class="pf-c-wizard__toggle"
     >
       <span
-        class="pf-v5-c-wizard__toggle-list"
+        class="pf-c-wizard__toggle-list"
       >
         <span
-          class="pf-v5-c-wizard__toggle-list-item"
+          class="pf-c-wizard__toggle-list-item"
         >
           <span
-            class="pf-v5-c-wizard__toggle-num"
+            class="pf-c-wizard__toggle-num"
           >
             1
           </span>
@@ -546,11 +552,11 @@ exports[`Wizard bare wiz 1`] = `
         </span>
       </span>
       <span
-        class="pf-v5-c-wizard__toggle-icon"
+        class="pf-c-wizard__toggle-icon"
       >
         <svg
           aria-hidden="true"
-          class="pf-v5-svg"
+          class="pf-svg"
           fill="currentColor"
           role="img"
           viewBox="0 0 320 512"
@@ -562,27 +568,27 @@ exports[`Wizard bare wiz 1`] = `
       </span>
     </button>
     <div
-      class="pf-v5-c-wizard__outer-wrap"
+      class="pf-c-wizard__outer-wrap"
     >
       <div
-        class="pf-v5-c-wizard__inner-wrap"
+        class="pf-c-wizard__inner-wrap"
       >
         <nav
-          class="pf-v5-c-wizard__nav"
+          class="pf-c-wizard__nav"
           data-ouia-component-id="OUIA-Generated-WizardNav-5"
           data-ouia-component-type="PF4/WizardNav"
           data-ouia-safe="true"
         >
           <ol
-            class="pf-v5-c-wizard__nav-list"
+            class="pf-c-wizard__nav-list"
             role="list"
           >
             <li
-              class="pf-v5-c-wizard__nav-item"
+              class="pf-c-wizard__nav-item"
             >
               <button
                 aria-current="step"
-                class="pf-v5-c-wizard__nav-link pf-m-current"
+                class="pf-c-wizard__nav-link pf-m-current"
                 data-ouia-component-id="OUIA-Generated-WizardNavItem-13"
                 data-ouia-component-type="PF4/WizardNavItem"
                 data-ouia-safe="true"
@@ -594,10 +600,10 @@ exports[`Wizard bare wiz 1`] = `
           </ol>
         </nav>
         <div
-          class="pf-v5-c-wizard__main"
+          class="pf-c-wizard__main"
         >
           <div
-            class="pf-v5-c-wizard__main-body"
+            class="pf-c-wizard__main-body"
           >
             <p>
               Step 1
@@ -606,11 +612,11 @@ exports[`Wizard bare wiz 1`] = `
         </div>
       </div>
       <footer
-        class="pf-v5-c-wizard__footer"
+        class="pf-c-wizard__footer"
       >
         <button
           aria-disabled="true"
-          class="pf-v5-c-button pf-m-secondary pf-m-disabled"
+          class="pf-c-button pf-m-secondary pf-m-disabled"
           data-ouia-component-id="OUIA-Generated-Button-secondary-3"
           data-ouia-component-type="PF4/Button"
           data-ouia-safe="true"
@@ -621,7 +627,7 @@ exports[`Wizard bare wiz 1`] = `
         </button>
         <button
           aria-disabled="false"
-          class="pf-v5-c-button pf-m-primary"
+          class="pf-c-button pf-m-primary"
           data-ouia-component-id="OUIA-Generated-Button-primary-3"
           data-ouia-component-type="PF4/Button"
           data-ouia-safe="true"
@@ -630,11 +636,11 @@ exports[`Wizard bare wiz 1`] = `
           Next
         </button>
         <div
-          class="pf-v5-c-wizard__footer-cancel"
+          class="pf-c-wizard__footer-cancel"
         >
           <button
             aria-disabled="false"
-            class="pf-v5-c-button pf-m-link"
+            class="pf-c-button pf-m-link"
             data-ouia-component-id="OUIA-Generated-Button-link-3"
             data-ouia-component-type="PF4/Button"
             data-ouia-safe="true"
diff --git a/packages/react-integration/cypress/integration/wizard.spec.ts b/packages/react-integration/cypress/integration/wizard.spec.ts
index ee28e64e6a9..dd2b3dc0ca5 100644
--- a/packages/react-integration/cypress/integration/wizard.spec.ts
+++ b/packages/react-integration/cypress/integration/wizard.spec.ts
@@ -13,7 +13,7 @@ describe('Wizard Demo Test', () => {
   it('Verify wizard in modal sends focus to the new content', () => {
     cy.get('#launchWiz').click();
     cy.get('#modalWizId.pf-v5-c-wizard').should('exist');
-    cy.focused().should('have.class', 'pf-v5-c-wizard__close');
+    cy.focused().should('have.class', 'pf-v5-c-button');
     cy.focused().click();
   });
 
diff --git a/packages/react-integration/cypress/integration/wizarddeprecated.spec.ts b/packages/react-integration/cypress/integration/wizarddeprecated.spec.ts
index 07d831fed44..75c0d7ec77c 100644
--- a/packages/react-integration/cypress/integration/wizarddeprecated.spec.ts
+++ b/packages/react-integration/cypress/integration/wizarddeprecated.spec.ts
@@ -13,7 +13,7 @@ describe('Wizard Deprecated Demo Test', () => {
   it('Verify wizard in modal sends focus to the new content', () => {
     cy.get('#launchWiz').click();
     cy.get('#modalWizId.pf-v5-c-wizard').should('exist');
-    cy.focused().should('have.class', 'pf-v5-c-wizard__close');
+    cy.focused().should('have.class', 'pf-v5-c-button');
     cy.focused().click();
   });
 
@@ -38,6 +38,6 @@ describe('Wizard Deprecated Demo Test', () => {
     cy.get('#wizard-correct-role .pf-v5-c-wizard__main button').click();
     // Within a modal, wizard body uses the <main> element and should not have a role applied
     cy.get('#wizard-correct-role .pf-v5-c-wizard__main').should('not.have.attr', 'role');
-    cy.get('#wizard-correct-role .pf-v5-c-wizard__close').click();
+    cy.get('#wizard-correct-role .pf-v5-c-wizard__close button').click();
   });
 });

From 5ce9595b6e90b1063ab9482b780da372e3ad7dbd Mon Sep 17 00:00:00 2001
From: nicolethoen <nthoen@redhat.com>
Date: Wed, 3 May 2023 22:29:39 -0400
Subject: [PATCH 2/5] fix linting

---
 packages/react-core/src/components/Wizard/WizardHeader.tsx     | 3 +--
 .../src/deprecated/components/Wizard/WizardHeader.tsx          | 3 +--
 .../Generated/__snapshots__/WizardHeader.test.tsx.snap         | 1 +
 .../Wizard/__tests__/__snapshots__/Wizard.test.tsx.snap        | 2 ++
 4 files changed, 5 insertions(+), 4 deletions(-)

diff --git a/packages/react-core/src/components/Wizard/WizardHeader.tsx b/packages/react-core/src/components/Wizard/WizardHeader.tsx
index 3d1daf80bcd..102f9b00373 100644
--- a/packages/react-core/src/components/Wizard/WizardHeader.tsx
+++ b/packages/react-core/src/components/Wizard/WizardHeader.tsx
@@ -2,7 +2,6 @@ import * as React from 'react';
 import styles from '@patternfly/react-styles/css/components/Wizard/wizard';
 import { css } from '@patternfly/react-styles';
 import { Button } from '../Button';
-import { Title } from '../Title';
 import TimesIcon from '@patternfly/react-icons/dist/esm/icons/times-icon';
 
 export interface WizardHeaderProps {
@@ -43,7 +42,7 @@ export const WizardHeader: React.FunctionComponent<WizardHeaderProps> = ({
       </div>
     )}
     <div className={css(styles.wizardTitle)}>
-      <h2 className={css(styles.wizardTitleText)}>{title || <>&nbsp;</>}</h2>
+      <h2 className={css(styles.wizardTitleText)} id={titleId}>{title || <>&nbsp;</>}</h2>
     </div>
 
     {description && (
diff --git a/packages/react-core/src/deprecated/components/Wizard/WizardHeader.tsx b/packages/react-core/src/deprecated/components/Wizard/WizardHeader.tsx
index 72264f394b0..c408696c67c 100644
--- a/packages/react-core/src/deprecated/components/Wizard/WizardHeader.tsx
+++ b/packages/react-core/src/deprecated/components/Wizard/WizardHeader.tsx
@@ -2,7 +2,6 @@ import * as React from 'react';
 import styles from '@patternfly/react-styles/css/components/Wizard/wizard';
 import { css } from '@patternfly/react-styles';
 import { Button } from '../../../components/Button';
-import { Title } from '../../../components/Title';
 import TimesIcon from '@patternfly/react-icons/dist/esm/icons/times-icon';
 
 export interface WizardHeaderProps {
@@ -43,7 +42,7 @@ export const WizardHeader: React.FunctionComponent<WizardHeaderProps> = ({
       </div>
     )}
     <div className={css(styles.wizardTitle)}>
-      <h2 className={css(styles.wizardTitleText)}>{title || <>&nbsp;</>}</h2>
+      <h2 className={css(styles.wizardTitleText)} id={titleId}>{title || <>&nbsp;</>}</h2>
     </div>
     {description && (
       <Component className={css(styles.wizardDescription)} id={descriptionId}>
diff --git a/packages/react-core/src/deprecated/components/Wizard/__tests__/Generated/__snapshots__/WizardHeader.test.tsx.snap b/packages/react-core/src/deprecated/components/Wizard/__tests__/Generated/__snapshots__/WizardHeader.test.tsx.snap
index 88cf2d48017..9059796342a 100644
--- a/packages/react-core/src/deprecated/components/Wizard/__tests__/Generated/__snapshots__/WizardHeader.test.tsx.snap
+++ b/packages/react-core/src/deprecated/components/Wizard/__tests__/Generated/__snapshots__/WizardHeader.test.tsx.snap
@@ -10,6 +10,7 @@ exports[`WizardHeader should match snapshot (auto-generated) 1`] = `
     >
       <h2
         class="pf-c-wizard__title-text"
+        id="string"
       >
         string
       </h2>
diff --git a/packages/react-core/src/deprecated/components/Wizard/__tests__/__snapshots__/Wizard.test.tsx.snap b/packages/react-core/src/deprecated/components/Wizard/__tests__/__snapshots__/Wizard.test.tsx.snap
index 8eb711df4ea..c69b9aea624 100644
--- a/packages/react-core/src/deprecated/components/Wizard/__tests__/__snapshots__/Wizard.test.tsx.snap
+++ b/packages/react-core/src/deprecated/components/Wizard/__tests__/__snapshots__/Wizard.test.tsx.snap
@@ -38,6 +38,7 @@ exports[`Wizard Expandable Nav Wizard should match snapshot 1`] = `
       >
         <h2
           class="pf-c-wizard__title-text"
+          id="pf-wizard-title-1"
         >
           Wizard title
         </h2>
@@ -310,6 +311,7 @@ exports[`Wizard Wizard should match snapshot 1`] = `
       >
         <h2
           class="pf-c-wizard__title-text"
+          id="pf-wizard-title-0"
         >
           Wizard title
         </h2>

From 40050c8dc66e012d0abf3d4795137bf5d30fa34a Mon Sep 17 00:00:00 2001
From: nicolethoen <nthoen@redhat.com>
Date: Fri, 5 May 2023 16:03:10 -0400
Subject: [PATCH 3/5] fix snapshots

---
 .../__snapshots__/WizardBody.test.tsx.snap    |   4 +-
 .../__snapshots__/WizardFooter.test.tsx.snap  |   2 +-
 .../WizardFooterInternal.test.tsx.snap        |  10 +-
 .../__snapshots__/WizardHeader.test.tsx.snap  |   8 +-
 .../__snapshots__/WizardNav.test.tsx.snap     |   4 +-
 .../__snapshots__/WizardNavItem.test.tsx.snap |   4 +-
 .../__snapshots__/WizardToggle.test.tsx.snap  |  20 +-
 .../__snapshots__/Wizard.test.tsx.snap        | 200 +++++++++---------
 8 files changed, 126 insertions(+), 126 deletions(-)

diff --git a/packages/react-core/src/deprecated/components/Wizard/__tests__/Generated/__snapshots__/WizardBody.test.tsx.snap b/packages/react-core/src/deprecated/components/Wizard/__tests__/Generated/__snapshots__/WizardBody.test.tsx.snap
index 5f65ee15ccf..0aac52d258c 100644
--- a/packages/react-core/src/deprecated/components/Wizard/__tests__/Generated/__snapshots__/WizardBody.test.tsx.snap
+++ b/packages/react-core/src/deprecated/components/Wizard/__tests__/Generated/__snapshots__/WizardBody.test.tsx.snap
@@ -3,10 +3,10 @@
 exports[`WizardBody should match snapshot (auto-generated) 1`] = `
 <DocumentFragment>
   <div
-    class="pf-c-wizard__main"
+    class="pf-v5-c-wizard__main"
   >
     <div
-      class="pf-c-wizard__main-body"
+      class="pf-v5-c-wizard__main-body"
     >
       any
     </div>
diff --git a/packages/react-core/src/deprecated/components/Wizard/__tests__/Generated/__snapshots__/WizardFooter.test.tsx.snap b/packages/react-core/src/deprecated/components/Wizard/__tests__/Generated/__snapshots__/WizardFooter.test.tsx.snap
index 758f6a43176..0f1112c6911 100644
--- a/packages/react-core/src/deprecated/components/Wizard/__tests__/Generated/__snapshots__/WizardFooter.test.tsx.snap
+++ b/packages/react-core/src/deprecated/components/Wizard/__tests__/Generated/__snapshots__/WizardFooter.test.tsx.snap
@@ -3,7 +3,7 @@
 exports[`WizardFooter should match snapshot (auto-generated) 1`] = `
 <DocumentFragment>
   <footer
-    class="pf-c-wizard__footer"
+    class="pf-v5-c-wizard__footer"
   >
     any
   </footer>
diff --git a/packages/react-core/src/deprecated/components/Wizard/__tests__/Generated/__snapshots__/WizardFooterInternal.test.tsx.snap b/packages/react-core/src/deprecated/components/Wizard/__tests__/Generated/__snapshots__/WizardFooterInternal.test.tsx.snap
index 16c22891d0e..6e7d65c6f2f 100644
--- a/packages/react-core/src/deprecated/components/Wizard/__tests__/Generated/__snapshots__/WizardFooterInternal.test.tsx.snap
+++ b/packages/react-core/src/deprecated/components/Wizard/__tests__/Generated/__snapshots__/WizardFooterInternal.test.tsx.snap
@@ -3,11 +3,11 @@
 exports[`WizardFooterInternal should match snapshot (auto-generated) 1`] = `
 <DocumentFragment>
   <footer
-    class="pf-c-wizard__footer"
+    class="pf-v5-c-wizard__footer"
   >
     <button
       aria-disabled="true"
-      class="pf-c-button pf-m-secondary pf-m-disabled"
+      class="pf-v5-c-button pf-m-secondary pf-m-disabled"
       data-ouia-component-id="OUIA-Generated-Button-secondary-1"
       data-ouia-component-type="PF4/Button"
       data-ouia-safe="true"
@@ -20,7 +20,7 @@ exports[`WizardFooterInternal should match snapshot (auto-generated) 1`] = `
     </button>
     <button
       aria-disabled="false"
-      class="pf-c-button pf-m-primary"
+      class="pf-v5-c-button pf-m-primary"
       data-ouia-component-id="OUIA-Generated-Button-primary-1"
       data-ouia-component-type="PF4/Button"
       data-ouia-safe="true"
@@ -31,11 +31,11 @@ exports[`WizardFooterInternal should match snapshot (auto-generated) 1`] = `
       </div>
     </button>
     <div
-      class="pf-c-wizard__footer-cancel"
+      class="pf-v5-c-wizard__footer-cancel"
     >
       <button
         aria-disabled="false"
-        class="pf-c-button pf-m-link"
+        class="pf-v5-c-button pf-m-link"
         data-ouia-component-id="OUIA-Generated-Button-link-1"
         data-ouia-component-type="PF4/Button"
         data-ouia-safe="true"
diff --git a/packages/react-core/src/deprecated/components/Wizard/__tests__/Generated/__snapshots__/WizardHeader.test.tsx.snap b/packages/react-core/src/deprecated/components/Wizard/__tests__/Generated/__snapshots__/WizardHeader.test.tsx.snap
index 9059796342a..8564708cc3f 100644
--- a/packages/react-core/src/deprecated/components/Wizard/__tests__/Generated/__snapshots__/WizardHeader.test.tsx.snap
+++ b/packages/react-core/src/deprecated/components/Wizard/__tests__/Generated/__snapshots__/WizardHeader.test.tsx.snap
@@ -3,20 +3,20 @@
 exports[`WizardHeader should match snapshot (auto-generated) 1`] = `
 <DocumentFragment>
   <div
-    class="pf-c-wizard__header"
+    class="pf-v5-c-wizard__header"
   >
     <div
-      class="pf-c-wizard__title"
+      class="pf-v5-c-wizard__title"
     >
       <h2
-        class="pf-c-wizard__title-text"
+        class="pf-v5-c-wizard__title-text"
         id="string"
       >
         string
       </h2>
     </div>
     <p
-      class="pf-c-wizard__description"
+      class="pf-v5-c-wizard__description"
       id="string"
     />
     <div>
diff --git a/packages/react-core/src/deprecated/components/Wizard/__tests__/Generated/__snapshots__/WizardNav.test.tsx.snap b/packages/react-core/src/deprecated/components/Wizard/__tests__/Generated/__snapshots__/WizardNav.test.tsx.snap
index fc27edf7ffe..cc036e4a8cb 100644
--- a/packages/react-core/src/deprecated/components/Wizard/__tests__/Generated/__snapshots__/WizardNav.test.tsx.snap
+++ b/packages/react-core/src/deprecated/components/Wizard/__tests__/Generated/__snapshots__/WizardNav.test.tsx.snap
@@ -5,13 +5,13 @@ exports[`WizardNav should match snapshot (auto-generated) 1`] = `
   <nav
     aria-label="string"
     aria-labelledby="string"
-    class="pf-c-wizard__nav"
+    class="pf-v5-c-wizard__nav"
     data-ouia-component-id="OUIA-Generated-WizardNav-1"
     data-ouia-component-type="PF4/WizardNav"
     data-ouia-safe="true"
   >
     <ol
-      class="pf-c-wizard__nav-list"
+      class="pf-v5-c-wizard__nav-list"
       role="list"
     >
       any
diff --git a/packages/react-core/src/deprecated/components/Wizard/__tests__/Generated/__snapshots__/WizardNavItem.test.tsx.snap b/packages/react-core/src/deprecated/components/Wizard/__tests__/Generated/__snapshots__/WizardNavItem.test.tsx.snap
index f00d3a101aa..1d8b0c43acf 100644
--- a/packages/react-core/src/deprecated/components/Wizard/__tests__/Generated/__snapshots__/WizardNavItem.test.tsx.snap
+++ b/packages/react-core/src/deprecated/components/Wizard/__tests__/Generated/__snapshots__/WizardNavItem.test.tsx.snap
@@ -3,11 +3,11 @@
 exports[`WizardNavItem should match snapshot (auto-generated) 1`] = `
 <DocumentFragment>
   <li
-    class="pf-c-wizard__nav-item"
+    class="pf-v5-c-wizard__nav-item"
   >
     <button
       aria-current="false"
-      class="pf-c-wizard__nav-link"
+      class="pf-v5-c-wizard__nav-link"
       data-ouia-component-id="OUIA-Generated-WizardNavItem-1"
       data-ouia-component-type="PF4/WizardNavItem"
       data-ouia-safe="true"
diff --git a/packages/react-core/src/deprecated/components/Wizard/__tests__/Generated/__snapshots__/WizardToggle.test.tsx.snap b/packages/react-core/src/deprecated/components/Wizard/__tests__/Generated/__snapshots__/WizardToggle.test.tsx.snap
index 029509fe32f..0f4f41947c6 100644
--- a/packages/react-core/src/deprecated/components/Wizard/__tests__/Generated/__snapshots__/WizardToggle.test.tsx.snap
+++ b/packages/react-core/src/deprecated/components/Wizard/__tests__/Generated/__snapshots__/WizardToggle.test.tsx.snap
@@ -5,26 +5,26 @@ exports[`WizardToggle should match snapshot (auto-generated) 1`] = `
   <button
     aria-expanded="true"
     aria-label="'Wizard Toggle'"
-    class="pf-c-wizard__toggle pf-m-expanded"
+    class="pf-v5-c-wizard__toggle pf-m-expanded"
   >
     <span
-      class="pf-c-wizard__toggle-list"
+      class="pf-v5-c-wizard__toggle-list"
     >
       <span
-        class="pf-c-wizard__toggle-list-item"
+        class="pf-v5-c-wizard__toggle-list-item"
       >
         <span
-          class="pf-c-wizard__toggle-num"
+          class="pf-v5-c-wizard__toggle-num"
         />
          
       </span>
     </span>
     <span
-      class="pf-c-wizard__toggle-icon"
+      class="pf-v5-c-wizard__toggle-icon"
     >
       <svg
         aria-hidden="true"
-        class="pf-svg"
+        class="pf-v5-svg"
         fill="currentColor"
         role="img"
         viewBox="0 0 320 512"
@@ -36,16 +36,16 @@ exports[`WizardToggle should match snapshot (auto-generated) 1`] = `
     </span>
   </button>
   <div
-    class="pf-c-wizard__outer-wrap"
+    class="pf-v5-c-wizard__outer-wrap"
   >
     <div
-      class="pf-c-wizard__inner-wrap"
+      class="pf-v5-c-wizard__inner-wrap"
     >
       <div
-        class="pf-c-wizard__main"
+        class="pf-v5-c-wizard__main"
       >
         <div
-          class="pf-c-wizard__main-body"
+          class="pf-v5-c-wizard__main-body"
         />
       </div>
     </div>
diff --git a/packages/react-core/src/deprecated/components/Wizard/__tests__/__snapshots__/Wizard.test.tsx.snap b/packages/react-core/src/deprecated/components/Wizard/__tests__/__snapshots__/Wizard.test.tsx.snap
index c69b9aea624..e0351bde263 100644
--- a/packages/react-core/src/deprecated/components/Wizard/__tests__/__snapshots__/Wizard.test.tsx.snap
+++ b/packages/react-core/src/deprecated/components/Wizard/__tests__/__snapshots__/Wizard.test.tsx.snap
@@ -3,18 +3,18 @@
 exports[`Wizard Expandable Nav Wizard should match snapshot 1`] = `
 <DocumentFragment>
   <div
-    class="pf-c-wizard"
+    class="pf-v5-c-wizard"
   >
     <div
-      class="pf-c-wizard__header"
+      class="pf-v5-c-wizard__header"
     >
       <div
-        class="pf-c-wizard__close"
+        class="pf-v5-c-wizard__close"
       >
         <button
           aria-disabled="false"
           aria-label="Close"
-          class="pf-c-button pf-m-plain"
+          class="pf-v5-c-button pf-m-plain"
           data-ouia-component-id="OUIA-Generated-Button-plain-2"
           data-ouia-component-type="PF4/Button"
           data-ouia-safe="true"
@@ -22,7 +22,7 @@ exports[`Wizard Expandable Nav Wizard should match snapshot 1`] = `
         >
           <svg
             aria-hidden="true"
-            class="pf-svg"
+            class="pf-v5-svg"
             fill="currentColor"
             role="img"
             viewBox="0 0 352 512"
@@ -34,17 +34,17 @@ exports[`Wizard Expandable Nav Wizard should match snapshot 1`] = `
         </button>
       </div>
       <div
-        class="pf-c-wizard__title"
+        class="pf-v5-c-wizard__title"
       >
         <h2
-          class="pf-c-wizard__title-text"
+          class="pf-v5-c-wizard__title-text"
           id="pf-wizard-title-1"
         >
           Wizard title
         </h2>
       </div>
       <p
-        class="pf-c-wizard__description"
+        class="pf-v5-c-wizard__description"
         id="pf-wizard-description-1"
       >
         Description here
@@ -53,16 +53,16 @@ exports[`Wizard Expandable Nav Wizard should match snapshot 1`] = `
     <button
       aria-expanded="false"
       aria-label="Wizard Toggle"
-      class="pf-c-wizard__toggle"
+      class="pf-v5-c-wizard__toggle"
     >
       <span
-        class="pf-c-wizard__toggle-list"
+        class="pf-v5-c-wizard__toggle-list"
       >
         <span
-          class="pf-c-wizard__toggle-list-item"
+          class="pf-v5-c-wizard__toggle-list-item"
         >
           <span
-            class="pf-c-wizard__toggle-num"
+            class="pf-v5-c-wizard__toggle-num"
           >
             1
           </span>
@@ -70,11 +70,11 @@ exports[`Wizard Expandable Nav Wizard should match snapshot 1`] = `
         </span>
       </span>
       <span
-        class="pf-c-wizard__toggle-icon"
+        class="pf-v5-c-wizard__toggle-icon"
       >
         <svg
           aria-hidden="true"
-          class="pf-svg"
+          class="pf-v5-svg"
           fill="currentColor"
           role="img"
           viewBox="0 0 320 512"
@@ -86,28 +86,28 @@ exports[`Wizard Expandable Nav Wizard should match snapshot 1`] = `
       </span>
     </button>
     <div
-      class="pf-c-wizard__outer-wrap"
+      class="pf-v5-c-wizard__outer-wrap"
     >
       <div
-        class="pf-c-wizard__inner-wrap"
+        class="pf-v5-c-wizard__inner-wrap"
       >
         <nav
           aria-labelledby="pf-wizard-title-1"
-          class="pf-c-wizard__nav"
+          class="pf-v5-c-wizard__nav"
           data-ouia-component-id="OUIA-Generated-WizardNav-3"
           data-ouia-component-type="PF4/WizardNav"
           data-ouia-safe="true"
         >
           <ol
-            class="pf-c-wizard__nav-list"
+            class="pf-v5-c-wizard__nav-list"
             role="list"
           >
             <li
-              class="pf-c-wizard__nav-item"
+              class="pf-v5-c-wizard__nav-item"
             >
               <button
                 aria-current="step"
-                class="pf-c-wizard__nav-link pf-m-current"
+                class="pf-v5-c-wizard__nav-link pf-m-current"
                 data-ouia-component-id="OUIA-Generated-WizardNavItem-7"
                 data-ouia-component-type="PF4/WizardNavItem"
                 data-ouia-safe="true"
@@ -117,31 +117,31 @@ exports[`Wizard Expandable Nav Wizard should match snapshot 1`] = `
               </button>
             </li>
             <li
-              class="pf-c-wizard__nav-item pf-m-expandable"
+              class="pf-v5-c-wizard__nav-item pf-m-expandable"
             >
               <button
                 aria-current="false"
                 aria-expanded="false"
-                class="pf-c-wizard__nav-link"
+                class="pf-v5-c-wizard__nav-link"
                 data-ouia-component-id="OUIA-Generated-WizardNavItem-8"
                 data-ouia-component-type="PF4/WizardNavItem"
                 data-ouia-safe="true"
                 type="button"
               >
                 <span
-                  class="pf-c-wizard__nav-link-text"
+                  class="pf-v5-c-wizard__nav-link-text"
                 >
                   B
                 </span>
                 <span
-                  class="pf-c-wizard__nav-link-toggle"
+                  class="pf-v5-c-wizard__nav-link-toggle"
                 >
                   <span
-                    class="pf-c-wizard__nav-link-toggle-icon"
+                    class="pf-v5-c-wizard__nav-link-toggle-icon"
                   >
                     <svg
                       aria-hidden="true"
-                      class="pf-svg"
+                      class="pf-v5-svg"
                       fill="currentColor"
                       role="img"
                       viewBox="0 0 256 512"
@@ -154,15 +154,15 @@ exports[`Wizard Expandable Nav Wizard should match snapshot 1`] = `
                 </span>
               </button>
               <ol
-                class="pf-c-wizard__nav-list"
+                class="pf-v5-c-wizard__nav-list"
                 role="list"
               >
                 <li
-                  class="pf-c-wizard__nav-item"
+                  class="pf-v5-c-wizard__nav-item"
                 >
                   <button
                     aria-current="false"
-                    class="pf-c-wizard__nav-link"
+                    class="pf-v5-c-wizard__nav-link"
                     data-ouia-component-id="OUIA-Generated-WizardNavItem-9"
                     data-ouia-component-type="PF4/WizardNavItem"
                     data-ouia-safe="true"
@@ -172,11 +172,11 @@ exports[`Wizard Expandable Nav Wizard should match snapshot 1`] = `
                   </button>
                 </li>
                 <li
-                  class="pf-c-wizard__nav-item"
+                  class="pf-v5-c-wizard__nav-item"
                 >
                   <button
                     aria-current="false"
-                    class="pf-c-wizard__nav-link"
+                    class="pf-v5-c-wizard__nav-link"
                     data-ouia-component-id="OUIA-Generated-WizardNavItem-10"
                     data-ouia-component-type="PF4/WizardNavItem"
                     data-ouia-safe="true"
@@ -188,11 +188,11 @@ exports[`Wizard Expandable Nav Wizard should match snapshot 1`] = `
               </ol>
             </li>
             <li
-              class="pf-c-wizard__nav-item"
+              class="pf-v5-c-wizard__nav-item"
             >
               <button
                 aria-current="false"
-                class="pf-c-wizard__nav-link"
+                class="pf-v5-c-wizard__nav-link"
                 data-ouia-component-id="OUIA-Generated-WizardNavItem-11"
                 data-ouia-component-type="PF4/WizardNavItem"
                 data-ouia-safe="true"
@@ -202,11 +202,11 @@ exports[`Wizard Expandable Nav Wizard should match snapshot 1`] = `
               </button>
             </li>
             <li
-              class="pf-c-wizard__nav-item"
+              class="pf-v5-c-wizard__nav-item"
             >
               <button
                 aria-current="false"
-                class="pf-c-wizard__nav-link"
+                class="pf-v5-c-wizard__nav-link"
                 data-ouia-component-id="OUIA-Generated-WizardNavItem-12"
                 data-ouia-component-type="PF4/WizardNavItem"
                 data-ouia-safe="true"
@@ -218,10 +218,10 @@ exports[`Wizard Expandable Nav Wizard should match snapshot 1`] = `
           </ol>
         </nav>
         <div
-          class="pf-c-wizard__main"
+          class="pf-v5-c-wizard__main"
         >
           <div
-            class="pf-c-wizard__main-body"
+            class="pf-v5-c-wizard__main-body"
           >
             <p>
               Step 1
@@ -230,11 +230,11 @@ exports[`Wizard Expandable Nav Wizard should match snapshot 1`] = `
         </div>
       </div>
       <footer
-        class="pf-c-wizard__footer"
+        class="pf-v5-c-wizard__footer"
       >
         <button
           aria-disabled="true"
-          class="pf-c-button pf-m-secondary pf-m-disabled"
+          class="pf-v5-c-button pf-m-secondary pf-m-disabled"
           data-ouia-component-id="OUIA-Generated-Button-secondary-2"
           data-ouia-component-type="PF4/Button"
           data-ouia-safe="true"
@@ -245,7 +245,7 @@ exports[`Wizard Expandable Nav Wizard should match snapshot 1`] = `
         </button>
         <button
           aria-disabled="false"
-          class="pf-c-button pf-m-primary"
+          class="pf-v5-c-button pf-m-primary"
           data-ouia-component-id="OUIA-Generated-Button-primary-2"
           data-ouia-component-type="PF4/Button"
           data-ouia-safe="true"
@@ -254,11 +254,11 @@ exports[`Wizard Expandable Nav Wizard should match snapshot 1`] = `
           Next
         </button>
         <div
-          class="pf-c-wizard__footer-cancel"
+          class="pf-v5-c-wizard__footer-cancel"
         >
           <button
             aria-disabled="false"
-            class="pf-c-button pf-m-link"
+            class="pf-v5-c-button pf-m-link"
             data-ouia-component-id="OUIA-Generated-Button-link-2"
             data-ouia-component-type="PF4/Button"
             data-ouia-safe="true"
@@ -276,18 +276,18 @@ exports[`Wizard Expandable Nav Wizard should match snapshot 1`] = `
 exports[`Wizard Wizard should match snapshot 1`] = `
 <DocumentFragment>
   <div
-    class="pf-c-wizard"
+    class="pf-v5-c-wizard"
   >
     <div
-      class="pf-c-wizard__header"
+      class="pf-v5-c-wizard__header"
     >
       <div
-        class="pf-c-wizard__close"
+        class="pf-v5-c-wizard__close"
       >
         <button
           aria-disabled="false"
           aria-label="Close"
-          class="pf-c-button pf-m-plain"
+          class="pf-v5-c-button pf-m-plain"
           data-ouia-component-id="OUIA-Generated-Button-plain-1"
           data-ouia-component-type="PF4/Button"
           data-ouia-safe="true"
@@ -295,7 +295,7 @@ exports[`Wizard Wizard should match snapshot 1`] = `
         >
           <svg
             aria-hidden="true"
-            class="pf-svg"
+            class="pf-v5-svg"
             fill="currentColor"
             role="img"
             viewBox="0 0 352 512"
@@ -307,17 +307,17 @@ exports[`Wizard Wizard should match snapshot 1`] = `
         </button>
       </div>
       <div
-        class="pf-c-wizard__title"
+        class="pf-v5-c-wizard__title"
       >
         <h2
-          class="pf-c-wizard__title-text"
+          class="pf-v5-c-wizard__title-text"
           id="pf-wizard-title-0"
         >
           Wizard title
         </h2>
       </div>
       <p
-        class="pf-c-wizard__description"
+        class="pf-v5-c-wizard__description"
         id="pf-wizard-description-0"
       >
         Description here
@@ -326,16 +326,16 @@ exports[`Wizard Wizard should match snapshot 1`] = `
     <button
       aria-expanded="false"
       aria-label="Wizard Toggle"
-      class="pf-c-wizard__toggle"
+      class="pf-v5-c-wizard__toggle"
     >
       <span
-        class="pf-c-wizard__toggle-list"
+        class="pf-v5-c-wizard__toggle-list"
       >
         <span
-          class="pf-c-wizard__toggle-list-item"
+          class="pf-v5-c-wizard__toggle-list-item"
         >
           <span
-            class="pf-c-wizard__toggle-num"
+            class="pf-v5-c-wizard__toggle-num"
           >
             1
           </span>
@@ -343,11 +343,11 @@ exports[`Wizard Wizard should match snapshot 1`] = `
         </span>
       </span>
       <span
-        class="pf-c-wizard__toggle-icon"
+        class="pf-v5-c-wizard__toggle-icon"
       >
         <svg
           aria-hidden="true"
-          class="pf-svg"
+          class="pf-v5-svg"
           fill="currentColor"
           role="img"
           viewBox="0 0 320 512"
@@ -359,28 +359,28 @@ exports[`Wizard Wizard should match snapshot 1`] = `
       </span>
     </button>
     <div
-      class="pf-c-wizard__outer-wrap"
+      class="pf-v5-c-wizard__outer-wrap"
     >
       <div
-        class="pf-c-wizard__inner-wrap"
+        class="pf-v5-c-wizard__inner-wrap"
       >
         <nav
           aria-labelledby="pf-wizard-title-0"
-          class="pf-c-wizard__nav"
+          class="pf-v5-c-wizard__nav"
           data-ouia-component-id="OUIA-Generated-WizardNav-1"
           data-ouia-component-type="PF4/WizardNav"
           data-ouia-safe="true"
         >
           <ol
-            class="pf-c-wizard__nav-list"
+            class="pf-v5-c-wizard__nav-list"
             role="list"
           >
             <li
-              class="pf-c-wizard__nav-item"
+              class="pf-v5-c-wizard__nav-item"
             >
               <button
                 aria-current="step"
-                class="pf-c-wizard__nav-link pf-m-current"
+                class="pf-v5-c-wizard__nav-link pf-m-current"
                 data-ouia-component-id="OUIA-Generated-WizardNavItem-1"
                 data-ouia-component-type="PF4/WizardNavItem"
                 data-ouia-safe="true"
@@ -391,11 +391,11 @@ exports[`Wizard Wizard should match snapshot 1`] = `
               </button>
             </li>
             <li
-              class="pf-c-wizard__nav-item"
+              class="pf-v5-c-wizard__nav-item"
             >
               <button
                 aria-current="false"
-                class="pf-c-wizard__nav-link"
+                class="pf-v5-c-wizard__nav-link"
                 data-ouia-component-id="OUIA-Generated-WizardNavItem-2"
                 data-ouia-component-type="PF4/WizardNavItem"
                 data-ouia-safe="true"
@@ -405,15 +405,15 @@ exports[`Wizard Wizard should match snapshot 1`] = `
                 B
               </button>
               <ol
-                class="pf-c-wizard__nav-list"
+                class="pf-v5-c-wizard__nav-list"
                 role="list"
               >
                 <li
-                  class="pf-c-wizard__nav-item"
+                  class="pf-v5-c-wizard__nav-item"
                 >
                   <button
                     aria-current="false"
-                    class="pf-c-wizard__nav-link"
+                    class="pf-v5-c-wizard__nav-link"
                     data-ouia-component-id="OUIA-Generated-WizardNavItem-3"
                     data-ouia-component-type="PF4/WizardNavItem"
                     data-ouia-safe="true"
@@ -424,11 +424,11 @@ exports[`Wizard Wizard should match snapshot 1`] = `
                   </button>
                 </li>
                 <li
-                  class="pf-c-wizard__nav-item"
+                  class="pf-v5-c-wizard__nav-item"
                 >
                   <button
                     aria-current="false"
-                    class="pf-c-wizard__nav-link"
+                    class="pf-v5-c-wizard__nav-link"
                     data-ouia-component-id="OUIA-Generated-WizardNavItem-4"
                     data-ouia-component-type="PF4/WizardNavItem"
                     data-ouia-safe="true"
@@ -441,11 +441,11 @@ exports[`Wizard Wizard should match snapshot 1`] = `
               </ol>
             </li>
             <li
-              class="pf-c-wizard__nav-item"
+              class="pf-v5-c-wizard__nav-item"
             >
               <button
                 aria-current="false"
-                class="pf-c-wizard__nav-link"
+                class="pf-v5-c-wizard__nav-link"
                 data-ouia-component-id="OUIA-Generated-WizardNavItem-5"
                 data-ouia-component-type="PF4/WizardNavItem"
                 data-ouia-safe="true"
@@ -456,11 +456,11 @@ exports[`Wizard Wizard should match snapshot 1`] = `
               </button>
             </li>
             <li
-              class="pf-c-wizard__nav-item"
+              class="pf-v5-c-wizard__nav-item"
             >
               <button
                 aria-current="false"
-                class="pf-c-wizard__nav-link"
+                class="pf-v5-c-wizard__nav-link"
                 data-ouia-component-id="OUIA-Generated-WizardNavItem-6"
                 data-ouia-component-type="PF4/WizardNavItem"
                 data-ouia-safe="true"
@@ -473,10 +473,10 @@ exports[`Wizard Wizard should match snapshot 1`] = `
           </ol>
         </nav>
         <div
-          class="pf-c-wizard__main"
+          class="pf-v5-c-wizard__main"
         >
           <div
-            class="pf-c-wizard__main-body"
+            class="pf-v5-c-wizard__main-body"
           >
             <p>
               Step 1
@@ -485,11 +485,11 @@ exports[`Wizard Wizard should match snapshot 1`] = `
         </div>
       </div>
       <footer
-        class="pf-c-wizard__footer"
+        class="pf-v5-c-wizard__footer"
       >
         <button
           aria-disabled="true"
-          class="pf-c-button pf-m-secondary pf-m-disabled"
+          class="pf-v5-c-button pf-m-secondary pf-m-disabled"
           data-ouia-component-id="OUIA-Generated-Button-secondary-1"
           data-ouia-component-type="PF4/Button"
           data-ouia-safe="true"
@@ -500,7 +500,7 @@ exports[`Wizard Wizard should match snapshot 1`] = `
         </button>
         <button
           aria-disabled="false"
-          class="pf-c-button pf-m-primary"
+          class="pf-v5-c-button pf-m-primary"
           data-ouia-component-id="OUIA-Generated-Button-primary-1"
           data-ouia-component-type="PF4/Button"
           data-ouia-safe="true"
@@ -509,11 +509,11 @@ exports[`Wizard Wizard should match snapshot 1`] = `
           Next
         </button>
         <div
-          class="pf-c-wizard__footer-cancel"
+          class="pf-v5-c-wizard__footer-cancel"
         >
           <button
             aria-disabled="false"
-            class="pf-c-button pf-m-link"
+            class="pf-v5-c-button pf-m-link"
             data-ouia-component-id="OUIA-Generated-Button-link-1"
             data-ouia-component-type="PF4/Button"
             data-ouia-safe="true"
@@ -531,22 +531,22 @@ exports[`Wizard Wizard should match snapshot 1`] = `
 exports[`Wizard bare wiz 1`] = `
 <DocumentFragment>
   <div
-    class="pf-c-wizard"
+    class="pf-v5-c-wizard"
     id="inPageWizWithAnchorsId"
   >
     <button
       aria-expanded="false"
       aria-label="Wizard Toggle"
-      class="pf-c-wizard__toggle"
+      class="pf-v5-c-wizard__toggle"
     >
       <span
-        class="pf-c-wizard__toggle-list"
+        class="pf-v5-c-wizard__toggle-list"
       >
         <span
-          class="pf-c-wizard__toggle-list-item"
+          class="pf-v5-c-wizard__toggle-list-item"
         >
           <span
-            class="pf-c-wizard__toggle-num"
+            class="pf-v5-c-wizard__toggle-num"
           >
             1
           </span>
@@ -554,11 +554,11 @@ exports[`Wizard bare wiz 1`] = `
         </span>
       </span>
       <span
-        class="pf-c-wizard__toggle-icon"
+        class="pf-v5-c-wizard__toggle-icon"
       >
         <svg
           aria-hidden="true"
-          class="pf-svg"
+          class="pf-v5-svg"
           fill="currentColor"
           role="img"
           viewBox="0 0 320 512"
@@ -570,27 +570,27 @@ exports[`Wizard bare wiz 1`] = `
       </span>
     </button>
     <div
-      class="pf-c-wizard__outer-wrap"
+      class="pf-v5-c-wizard__outer-wrap"
     >
       <div
-        class="pf-c-wizard__inner-wrap"
+        class="pf-v5-c-wizard__inner-wrap"
       >
         <nav
-          class="pf-c-wizard__nav"
+          class="pf-v5-c-wizard__nav"
           data-ouia-component-id="OUIA-Generated-WizardNav-5"
           data-ouia-component-type="PF4/WizardNav"
           data-ouia-safe="true"
         >
           <ol
-            class="pf-c-wizard__nav-list"
+            class="pf-v5-c-wizard__nav-list"
             role="list"
           >
             <li
-              class="pf-c-wizard__nav-item"
+              class="pf-v5-c-wizard__nav-item"
             >
               <button
                 aria-current="step"
-                class="pf-c-wizard__nav-link pf-m-current"
+                class="pf-v5-c-wizard__nav-link pf-m-current"
                 data-ouia-component-id="OUIA-Generated-WizardNavItem-13"
                 data-ouia-component-type="PF4/WizardNavItem"
                 data-ouia-safe="true"
@@ -602,10 +602,10 @@ exports[`Wizard bare wiz 1`] = `
           </ol>
         </nav>
         <div
-          class="pf-c-wizard__main"
+          class="pf-v5-c-wizard__main"
         >
           <div
-            class="pf-c-wizard__main-body"
+            class="pf-v5-c-wizard__main-body"
           >
             <p>
               Step 1
@@ -614,11 +614,11 @@ exports[`Wizard bare wiz 1`] = `
         </div>
       </div>
       <footer
-        class="pf-c-wizard__footer"
+        class="pf-v5-c-wizard__footer"
       >
         <button
           aria-disabled="true"
-          class="pf-c-button pf-m-secondary pf-m-disabled"
+          class="pf-v5-c-button pf-m-secondary pf-m-disabled"
           data-ouia-component-id="OUIA-Generated-Button-secondary-3"
           data-ouia-component-type="PF4/Button"
           data-ouia-safe="true"
@@ -629,7 +629,7 @@ exports[`Wizard bare wiz 1`] = `
         </button>
         <button
           aria-disabled="false"
-          class="pf-c-button pf-m-primary"
+          class="pf-v5-c-button pf-m-primary"
           data-ouia-component-id="OUIA-Generated-Button-primary-3"
           data-ouia-component-type="PF4/Button"
           data-ouia-safe="true"
@@ -638,11 +638,11 @@ exports[`Wizard bare wiz 1`] = `
           Next
         </button>
         <div
-          class="pf-c-wizard__footer-cancel"
+          class="pf-v5-c-wizard__footer-cancel"
         >
           <button
             aria-disabled="false"
-            class="pf-c-button pf-m-link"
+            class="pf-v5-c-button pf-m-link"
             data-ouia-component-id="OUIA-Generated-Button-link-3"
             data-ouia-component-type="PF4/Button"
             data-ouia-safe="true"

From fa80fea3031b7692c7eb8eb241b550bce0574813 Mon Sep 17 00:00:00 2001
From: nicolethoen <nthoen@redhat.com>
Date: Fri, 5 May 2023 16:25:07 -0400
Subject: [PATCH 4/5] change default description element

---
 packages/react-core/src/components/Wizard/WizardHeader.tsx      | 2 +-
 .../src/deprecated/components/Wizard/WizardHeader.tsx           | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/packages/react-core/src/components/Wizard/WizardHeader.tsx b/packages/react-core/src/components/Wizard/WizardHeader.tsx
index 102f9b00373..5fc3799aab2 100644
--- a/packages/react-core/src/components/Wizard/WizardHeader.tsx
+++ b/packages/react-core/src/components/Wizard/WizardHeader.tsx
@@ -30,7 +30,7 @@ export const WizardHeader: React.FunctionComponent<WizardHeaderProps> = ({
   isCloseHidden,
   closeButtonAriaLabel,
   titleId,
-  descriptionComponent: Component = 'p',
+  descriptionComponent: Component = 'div',
   descriptionId
 }: WizardHeaderProps) => (
   <div className={css(styles.wizardHeader)}>
diff --git a/packages/react-core/src/deprecated/components/Wizard/WizardHeader.tsx b/packages/react-core/src/deprecated/components/Wizard/WizardHeader.tsx
index c408696c67c..374b4d1e021 100644
--- a/packages/react-core/src/deprecated/components/Wizard/WizardHeader.tsx
+++ b/packages/react-core/src/deprecated/components/Wizard/WizardHeader.tsx
@@ -30,7 +30,7 @@ export const WizardHeader: React.FunctionComponent<WizardHeaderProps> = ({
   hideClose,
   closeButtonAriaLabel,
   titleId,
-  descriptionComponent: Component = 'p',
+  descriptionComponent: Component = 'div',
   descriptionId
 }: WizardHeaderProps) => (
   <div className={css(styles.wizardHeader)}>

From 4420e31f3ddddb1fb734fe64058249d79276b651 Mon Sep 17 00:00:00 2001
From: nicolethoen <nthoen@redhat.com>
Date: Sat, 6 May 2023 10:38:50 -0400
Subject: [PATCH 5/5] fix snapshots

---
 .../Generated/__snapshots__/WizardHeader.test.tsx.snap | 10 +++++-----
 1 file changed, 5 insertions(+), 5 deletions(-)

diff --git a/packages/react-core/src/deprecated/components/Wizard/__tests__/Generated/__snapshots__/WizardHeader.test.tsx.snap b/packages/react-core/src/deprecated/components/Wizard/__tests__/Generated/__snapshots__/WizardHeader.test.tsx.snap
index 8564708cc3f..75eb2b39e36 100644
--- a/packages/react-core/src/deprecated/components/Wizard/__tests__/Generated/__snapshots__/WizardHeader.test.tsx.snap
+++ b/packages/react-core/src/deprecated/components/Wizard/__tests__/Generated/__snapshots__/WizardHeader.test.tsx.snap
@@ -15,14 +15,14 @@ exports[`WizardHeader should match snapshot (auto-generated) 1`] = `
         string
       </h2>
     </div>
-    <p
+    <div
       class="pf-v5-c-wizard__description"
       id="string"
-    />
-    <div>
-      ReactNode
+    >
+      <div>
+        ReactNode
+      </div>
     </div>
-    <p />
   </div>
 </DocumentFragment>
 `;