@patternfly/react-core 5.0.0-alpha.99 → 5.0.0-prerelease.10

package/src/components/Tabs/__tests__/__snapshots__/Tabs.test.tsx.snap

@@ -6,7 +6,7 @@ exports[`should render accessible tabs 1`] = `
     aria-label="accessible Tabs example"
     class="pf-v5-c-tabs"
     data-ouia-component-id="OUIA-Generated-Tabs-9"
-    data-ouia-component-type="PF4/Tabs"
+    data-ouia-component-type="PF5/Tabs"
     data-ouia-safe="true"
     id="accessibleTabs"
   >
@@ -22,7 +22,7 @@ exports[`should render accessible tabs 1`] = `
           aria-controls="pf-tab-section-0-tab1"
           aria-selected="true"
           class="pf-v5-c-tabs__link"
-          data-ouia-component-type="PF4/TabButton"
+          data-ouia-component-type="PF5/TabButton"
           data-ouia-safe="true"
           href="#/items/1"
           id="pf-tab-0-tab1"
@@ -43,7 +43,7 @@ exports[`should render accessible tabs 1`] = `
           aria-controls="pf-tab-section-1-tab2"
           aria-selected="false"
           class="pf-v5-c-tabs__link"
-          data-ouia-component-type="PF4/TabButton"
+          data-ouia-component-type="PF5/TabButton"
           data-ouia-safe="true"
           href="#/items/2"
           id="pf-tab-1-tab2"
@@ -64,7 +64,7 @@ exports[`should render accessible tabs 1`] = `
           aria-controls="pf-tab-section-2-tab3"
           aria-selected="false"
           class="pf-v5-c-tabs__link"
-          data-ouia-component-type="PF4/TabButton"
+          data-ouia-component-type="PF5/TabButton"
           data-ouia-safe="true"
           href="#/items/3"
           id="pf-tab-2-tab3"
@@ -81,8 +81,8 @@ exports[`should render accessible tabs 1`] = `
   </nav>
   <section
     aria-labelledby="pf-tab-0-tab1"
-    class="pf-c-tab-content"
-    data-ouia-component-type="PF4/TabContent"
+    class="pf-v5-c-tab-content"
+    data-ouia-component-type="PF5/TabContent"
     data-ouia-safe="true"
     id="pf-tab-section-0-tab1"
     role="tabpanel"
@@ -92,8 +92,8 @@ exports[`should render accessible tabs 1`] = `
   </section>
   <section
     aria-labelledby="pf-tab-1-tab2"
-    class="pf-c-tab-content"
-    data-ouia-component-type="PF4/TabContent"
+    class="pf-v5-c-tab-content"
+    data-ouia-component-type="PF5/TabContent"
     data-ouia-safe="true"
     hidden=""
     id="pf-tab-section-1-tab2"
@@ -104,8 +104,8 @@ exports[`should render accessible tabs 1`] = `
   </section>
   <section
     aria-labelledby="pf-tab-2-tab3"
-    class="pf-c-tab-content"
-    data-ouia-component-type="PF4/TabContent"
+    class="pf-v5-c-tab-content"
+    data-ouia-component-type="PF5/TabContent"
     data-ouia-safe="true"
     hidden=""
     id="pf-tab-section-2-tab3"
@@ -122,7 +122,7 @@ exports[`should render box tabs 1`] = `
   <div
     class="pf-v5-c-tabs pf-m-box"
     data-ouia-component-id="OUIA-Generated-Tabs-8"
-    data-ouia-component-type="PF4/Tabs"
+    data-ouia-component-type="PF5/Tabs"
     data-ouia-safe="true"
     id="boxTabs"
   >
@@ -138,7 +138,7 @@ exports[`should render box tabs 1`] = `
           aria-controls="pf-tab-section-0-tab1"
           aria-selected="true"
           class="pf-v5-c-tabs__link"
-          data-ouia-component-type="PF4/TabButton"
+          data-ouia-component-type="PF5/TabButton"
           data-ouia-safe="true"
           id="pf-tab-0-tab1"
           role="tab"
@@ -159,7 +159,7 @@ exports[`should render box tabs 1`] = `
           aria-controls="pf-tab-section-1-tab2"
           aria-selected="false"
           class="pf-v5-c-tabs__link"
-          data-ouia-component-type="PF4/TabButton"
+          data-ouia-component-type="PF5/TabButton"
           data-ouia-safe="true"
           id="pf-tab-1-tab2"
           role="tab"
@@ -180,7 +180,7 @@ exports[`should render box tabs 1`] = `
           aria-controls="pf-tab-section-2-tab3"
           aria-selected="false"
           class="pf-v5-c-tabs__link"
-          data-ouia-component-type="PF4/TabButton"
+          data-ouia-component-type="PF5/TabButton"
           data-ouia-safe="true"
           id="pf-tab-2-tab3"
           role="tab"
@@ -201,7 +201,7 @@ exports[`should render box tabs 1`] = `
           aria-controls="pf-tab-section-3-tab4"
           aria-selected="false"
           class="pf-v5-c-tabs__link"
-          data-ouia-component-type="PF4/TabButton"
+          data-ouia-component-type="PF5/TabButton"
           data-ouia-safe="true"
           id="pf-tab-3-tab4"
           role="tab"
@@ -227,8 +227,8 @@ exports[`should render box tabs 1`] = `
   </div>
   <section
     aria-labelledby="pf-tab-0-tab1"
-    class="pf-c-tab-content"
-    data-ouia-component-type="PF4/TabContent"
+    class="pf-v5-c-tab-content"
+    data-ouia-component-type="PF5/TabContent"
     data-ouia-safe="true"
     id="pf-tab-section-0-tab1"
     role="tabpanel"
@@ -238,8 +238,8 @@ exports[`should render box tabs 1`] = `
   </section>
   <section
     aria-labelledby="pf-tab-1-tab2"
-    class="pf-c-tab-content"
-    data-ouia-component-type="PF4/TabContent"
+    class="pf-v5-c-tab-content"
+    data-ouia-component-type="PF5/TabContent"
     data-ouia-safe="true"
     hidden=""
     id="pf-tab-section-1-tab2"
@@ -250,8 +250,8 @@ exports[`should render box tabs 1`] = `
   </section>
   <section
     aria-labelledby="pf-tab-2-tab3"
-    class="pf-c-tab-content"
-    data-ouia-component-type="PF4/TabContent"
+    class="pf-v5-c-tab-content"
+    data-ouia-component-type="PF5/TabContent"
     data-ouia-safe="true"
     hidden=""
     id="pf-tab-section-2-tab3"
@@ -262,8 +262,8 @@ exports[`should render box tabs 1`] = `
   </section>
   <section
     aria-labelledby="pf-tab-3-tab4"
-    class="pf-c-tab-content"
-    data-ouia-component-type="PF4/TabContent"
+    class="pf-v5-c-tab-content"
+    data-ouia-component-type="PF5/TabContent"
     data-ouia-safe="true"
     hidden=""
     id="pf-tab-section-3-tab4"
@@ -280,7 +280,7 @@ exports[`should render box tabs of light variant 1`] = `
   <div
     class="pf-v5-c-tabs pf-m-box pf-m-color-scheme--light-300"
     data-ouia-component-id="OUIA-Generated-Tabs-15"
-    data-ouia-component-type="PF4/Tabs"
+    data-ouia-component-type="PF5/Tabs"
     data-ouia-safe="true"
     id="boxLightVariantTabs"
   >
@@ -296,7 +296,7 @@ exports[`should render box tabs of light variant 1`] = `
           aria-controls="pf-tab-section-0-tab1"
           aria-selected="true"
           class="pf-v5-c-tabs__link"
-          data-ouia-component-type="PF4/TabButton"
+          data-ouia-component-type="PF5/TabButton"
           data-ouia-safe="true"
           id="pf-tab-0-tab1"
           role="tab"
@@ -317,7 +317,7 @@ exports[`should render box tabs of light variant 1`] = `
           aria-controls="pf-tab-section-1-tab2"
           aria-selected="false"
           class="pf-v5-c-tabs__link"
-          data-ouia-component-type="PF4/TabButton"
+          data-ouia-component-type="PF5/TabButton"
           data-ouia-safe="true"
           id="pf-tab-1-tab2"
           role="tab"
@@ -338,7 +338,7 @@ exports[`should render box tabs of light variant 1`] = `
           aria-controls="pf-tab-section-2-tab3"
           aria-selected="false"
           class="pf-v5-c-tabs__link"
-          data-ouia-component-type="PF4/TabButton"
+          data-ouia-component-type="PF5/TabButton"
           data-ouia-safe="true"
           id="pf-tab-2-tab3"
           role="tab"
@@ -355,8 +355,8 @@ exports[`should render box tabs of light variant 1`] = `
   </div>
   <section
     aria-labelledby="pf-tab-0-tab1"
-    class="pf-c-tab-content pf-m-light-300"
-    data-ouia-component-type="PF4/TabContent"
+    class="pf-v5-c-tab-content pf-m-light-300"
+    data-ouia-component-type="PF5/TabContent"
     data-ouia-safe="true"
     id="pf-tab-section-0-tab1"
     role="tabpanel"
@@ -366,8 +366,8 @@ exports[`should render box tabs of light variant 1`] = `
   </section>
   <section
     aria-labelledby="pf-tab-1-tab2"
-    class="pf-c-tab-content pf-m-light-300"
-    data-ouia-component-type="PF4/TabContent"
+    class="pf-v5-c-tab-content pf-m-light-300"
+    data-ouia-component-type="PF5/TabContent"
     data-ouia-safe="true"
     hidden=""
     id="pf-tab-section-1-tab2"
@@ -378,8 +378,8 @@ exports[`should render box tabs of light variant 1`] = `
   </section>
   <section
     aria-labelledby="pf-tab-2-tab3"
-    class="pf-c-tab-content pf-m-light-300"
-    data-ouia-component-type="PF4/TabContent"
+    class="pf-v5-c-tab-content pf-m-light-300"
+    data-ouia-component-type="PF5/TabContent"
     data-ouia-safe="true"
     hidden=""
     id="pf-tab-section-2-tab3"
@@ -396,7 +396,7 @@ exports[`should render expandable vertical tabs 1`] = `
   <div
     class="pf-v5-c-tabs pf-m-vertical pf-m-expandable"
     data-ouia-component-id="OUIA-Generated-Tabs-6"
-    data-ouia-component-type="PF4/Tabs"
+    data-ouia-component-type="PF5/Tabs"
     data-ouia-safe="true"
     id="verticalTabs"
   >
@@ -411,7 +411,7 @@ exports[`should render expandable vertical tabs 1`] = `
           aria-labelledby="pf-random-id-0-text pf-random-id-0-button"
           class="pf-v5-c-button pf-m-plain"
           data-ouia-component-id="OUIA-Generated-Button-plain-3"
-          data-ouia-component-type="PF4/Button"
+          data-ouia-component-type="PF5/Button"
           data-ouia-safe="true"
           id="pf-random-id-0-button"
           type="button"
@@ -424,8 +424,10 @@ exports[`should render expandable vertical tabs 1`] = `
               arian-hidden="true"
               class="pf-v5-svg"
               fill="currentColor"
+              height="1em"
               role="img"
               viewBox="0 0 256 512"
+              width="1em"
             >
               <path
                 d="M224.3 273l-136 136c-9.4 9.4-24.6 9.4-33.9 0l-22.6-22.6c-9.4-9.4-9.4-24.6 0-33.9l96.4-96.4-96.4-96.4c-9.4-9.4-9.4-24.6 0-33.9L54.3 103c9.4-9.4 24.6-9.4 33.9 0l136 136c9.5 9.4 9.5 24.6.1 34z"
@@ -433,7 +435,7 @@ exports[`should render expandable vertical tabs 1`] = `
             </svg>
           </span>
           <span
-            class="pf-c-tabs__toggle-text"
+            class="pf-v5-c-tabs__toggle-text"
             id="pf-random-id-0-text"
           >
             toggle
@@ -453,7 +455,7 @@ exports[`should render expandable vertical tabs 1`] = `
           aria-controls="pf-tab-section-0-tab1"
           aria-selected="true"
           class="pf-v5-c-tabs__link"
-          data-ouia-component-type="PF4/TabButton"
+          data-ouia-component-type="PF5/TabButton"
           data-ouia-safe="true"
           id="pf-tab-0-tab1"
           role="tab"
@@ -474,7 +476,7 @@ exports[`should render expandable vertical tabs 1`] = `
           aria-controls="pf-tab-section-1-tab2"
           aria-selected="false"
           class="pf-v5-c-tabs__link"
-          data-ouia-component-type="PF4/TabButton"
+          data-ouia-component-type="PF5/TabButton"
           data-ouia-safe="true"
           id="pf-tab-1-tab2"
           role="tab"
@@ -495,7 +497,7 @@ exports[`should render expandable vertical tabs 1`] = `
           aria-controls="pf-tab-section-2-tab3"
           aria-selected="false"
           class="pf-v5-c-tabs__link"
-          data-ouia-component-type="PF4/TabButton"
+          data-ouia-component-type="PF5/TabButton"
           data-ouia-safe="true"
           id="pf-tab-2-tab3"
           role="tab"
@@ -516,7 +518,7 @@ exports[`should render expandable vertical tabs 1`] = `
           aria-controls="pf-tab-section-3-tab4"
           aria-selected="false"
           class="pf-v5-c-tabs__link"
-          data-ouia-component-type="PF4/TabButton"
+          data-ouia-component-type="PF5/TabButton"
           data-ouia-safe="true"
           id="pf-tab-3-tab4"
           role="tab"
@@ -542,8 +544,8 @@ exports[`should render expandable vertical tabs 1`] = `
   </div>
   <section
     aria-labelledby="pf-tab-0-tab1"
-    class="pf-c-tab-content"
-    data-ouia-component-type="PF4/TabContent"
+    class="pf-v5-c-tab-content"
+    data-ouia-component-type="PF5/TabContent"
     data-ouia-safe="true"
     id="pf-tab-section-0-tab1"
     role="tabpanel"
@@ -553,8 +555,8 @@ exports[`should render expandable vertical tabs 1`] = `
   </section>
   <section
     aria-labelledby="pf-tab-1-tab2"
-    class="pf-c-tab-content"
-    data-ouia-component-type="PF4/TabContent"
+    class="pf-v5-c-tab-content"
+    data-ouia-component-type="PF5/TabContent"
     data-ouia-safe="true"
     hidden=""
     id="pf-tab-section-1-tab2"
@@ -565,8 +567,8 @@ exports[`should render expandable vertical tabs 1`] = `
   </section>
   <section
     aria-labelledby="pf-tab-2-tab3"
-    class="pf-c-tab-content"
-    data-ouia-component-type="PF4/TabContent"
+    class="pf-v5-c-tab-content"
+    data-ouia-component-type="PF5/TabContent"
     data-ouia-safe="true"
     hidden=""
     id="pf-tab-section-2-tab3"
@@ -577,8 +579,8 @@ exports[`should render expandable vertical tabs 1`] = `
   </section>
   <section
     aria-labelledby="pf-tab-3-tab4"
-    class="pf-c-tab-content"
-    data-ouia-component-type="PF4/TabContent"
+    class="pf-v5-c-tab-content"
+    data-ouia-component-type="PF5/TabContent"
     data-ouia-safe="true"
     hidden=""
     id="pf-tab-section-3-tab4"
@@ -595,7 +597,7 @@ exports[`should render filled tabs 1`] = `
   <div
     class="pf-v5-c-tabs pf-m-fill"
     data-ouia-component-id="OUIA-Generated-Tabs-10"
-    data-ouia-component-type="PF4/Tabs"
+    data-ouia-component-type="PF5/Tabs"
     data-ouia-safe="true"
     id="filledTabs"
   >
@@ -611,7 +613,7 @@ exports[`should render filled tabs 1`] = `
           aria-controls="pf-tab-section-0-tab1"
           aria-selected="true"
           class="pf-v5-c-tabs__link"
-          data-ouia-component-type="PF4/TabButton"
+          data-ouia-component-type="PF5/TabButton"
           data-ouia-safe="true"
           id="pf-tab-0-tab1"
           role="tab"
@@ -632,7 +634,7 @@ exports[`should render filled tabs 1`] = `
           aria-controls="pf-tab-section-1-tab2"
           aria-selected="false"
           class="pf-v5-c-tabs__link"
-          data-ouia-component-type="PF4/TabButton"
+          data-ouia-component-type="PF5/TabButton"
           data-ouia-safe="true"
           id="pf-tab-1-tab2"
           role="tab"
@@ -653,7 +655,7 @@ exports[`should render filled tabs 1`] = `
           aria-controls="pf-tab-section-2-tab3"
           aria-selected="false"
           class="pf-v5-c-tabs__link"
-          data-ouia-component-type="PF4/TabButton"
+          data-ouia-component-type="PF5/TabButton"
           data-ouia-safe="true"
           id="pf-tab-2-tab3"
           role="tab"
@@ -670,8 +672,8 @@ exports[`should render filled tabs 1`] = `
   </div>
   <section
     aria-labelledby="pf-tab-0-tab1"
-    class="pf-c-tab-content"
-    data-ouia-component-type="PF4/TabContent"
+    class="pf-v5-c-tab-content"
+    data-ouia-component-type="PF5/TabContent"
     data-ouia-safe="true"
     id="pf-tab-section-0-tab1"
     role="tabpanel"
@@ -681,8 +683,8 @@ exports[`should render filled tabs 1`] = `
   </section>
   <section
     aria-labelledby="pf-tab-1-tab2"
-    class="pf-c-tab-content"
-    data-ouia-component-type="PF4/TabContent"
+    class="pf-v5-c-tab-content"
+    data-ouia-component-type="PF5/TabContent"
     data-ouia-safe="true"
     hidden=""
     id="pf-tab-section-1-tab2"
@@ -693,8 +695,8 @@ exports[`should render filled tabs 1`] = `
   </section>
   <section
     aria-labelledby="pf-tab-2-tab3"
-    class="pf-c-tab-content"
-    data-ouia-component-type="PF4/TabContent"
+    class="pf-v5-c-tab-content"
+    data-ouia-component-type="PF5/TabContent"
     data-ouia-safe="true"
     hidden=""
     id="pf-tab-section-2-tab3"
@@ -711,7 +713,7 @@ exports[`should render secondary tabs 1`] = `
   <div
     class="pf-v5-c-tabs"
     data-ouia-component-id="OUIA-Generated-Tabs-11"
-    data-ouia-component-type="PF4/Tabs"
+    data-ouia-component-type="PF5/Tabs"
     data-ouia-safe="true"
     id="primarieTabs"
   >
@@ -727,7 +729,7 @@ exports[`should render secondary tabs 1`] = `
           aria-controls="pf-tab-section-0-primarieTabs"
           aria-selected="true"
           class="pf-v5-c-tabs__link"
-          data-ouia-component-type="PF4/TabButton"
+          data-ouia-component-type="PF5/TabButton"
           data-ouia-safe="true"
           id="pf-tab-0-primarieTabs"
           role="tab"
@@ -748,7 +750,7 @@ exports[`should render secondary tabs 1`] = `
           aria-controls="pf-tab-section-1-tab2"
           aria-selected="false"
           class="pf-v5-c-tabs__link"
-          data-ouia-component-type="PF4/TabButton"
+          data-ouia-component-type="PF5/TabButton"
           data-ouia-safe="true"
           id="pf-tab-1-tab2"
           role="tab"
@@ -769,7 +771,7 @@ exports[`should render secondary tabs 1`] = `
           aria-controls="pf-tab-section-2-tab3"
           aria-selected="false"
           class="pf-v5-c-tabs__link"
-          data-ouia-component-type="PF4/TabButton"
+          data-ouia-component-type="PF5/TabButton"
           data-ouia-safe="true"
           id="pf-tab-2-tab3"
           role="tab"
@@ -786,8 +788,8 @@ exports[`should render secondary tabs 1`] = `
   </div>
   <section
     aria-labelledby="pf-tab-0-primarieTabs"
-    class="pf-c-tab-content"
-    data-ouia-component-type="PF4/TabContent"
+    class="pf-v5-c-tab-content"
+    data-ouia-component-type="PF5/TabContent"
     data-ouia-safe="true"
     id="pf-tab-section-0-primarieTabs"
     role="tabpanel"
@@ -796,7 +798,7 @@ exports[`should render secondary tabs 1`] = `
     <div
       class="pf-v5-c-tabs pf-m-secondary"
       data-ouia-component-id="OUIA-Generated-Tabs-12"
-      data-ouia-component-type="PF4/Tabs"
+      data-ouia-component-type="PF5/Tabs"
       data-ouia-safe="true"
       id="secondaryTabs"
     >
@@ -812,7 +814,7 @@ exports[`should render secondary tabs 1`] = `
             aria-controls="pf-tab-section-10-secondary tab1"
             aria-selected="false"
             class="pf-v5-c-tabs__link"
-            data-ouia-component-type="PF4/TabButton"
+            data-ouia-component-type="PF5/TabButton"
             data-ouia-safe="true"
             id="pf-tab-10-secondary tab1"
             role="tab"
@@ -833,7 +835,7 @@ exports[`should render secondary tabs 1`] = `
             aria-controls="pf-tab-section-11-secondary tab2"
             aria-selected="false"
             class="pf-v5-c-tabs__link"
-            data-ouia-component-type="PF4/TabButton"
+            data-ouia-component-type="PF5/TabButton"
             data-ouia-safe="true"
             id="pf-tab-11-secondary tab2"
             role="tab"
@@ -854,7 +856,7 @@ exports[`should render secondary tabs 1`] = `
             aria-controls="pf-tab-section-12-secondary tab3"
             aria-selected="false"
             class="pf-v5-c-tabs__link"
-            data-ouia-component-type="PF4/TabButton"
+            data-ouia-component-type="PF5/TabButton"
             data-ouia-safe="true"
             id="pf-tab-12-secondary tab3"
             role="tab"
@@ -871,8 +873,8 @@ exports[`should render secondary tabs 1`] = `
     </div>
     <section
       aria-labelledby="pf-tab-10-secondary tab1"
-      class="pf-c-tab-content"
-      data-ouia-component-type="PF4/TabContent"
+      class="pf-v5-c-tab-content"
+      data-ouia-component-type="PF5/TabContent"
       data-ouia-safe="true"
       hidden=""
       id="pf-tab-section-10-secondary tab1"
@@ -883,8 +885,8 @@ exports[`should render secondary tabs 1`] = `
     </section>
     <section
       aria-labelledby="pf-tab-11-secondary tab2"
-      class="pf-c-tab-content"
-      data-ouia-component-type="PF4/TabContent"
+      class="pf-v5-c-tab-content"
+      data-ouia-component-type="PF5/TabContent"
       data-ouia-safe="true"
       hidden=""
       id="pf-tab-section-11-secondary tab2"
@@ -895,8 +897,8 @@ exports[`should render secondary tabs 1`] = `
     </section>
     <section
       aria-labelledby="pf-tab-12-secondary tab3"
-      class="pf-c-tab-content"
-      data-ouia-component-type="PF4/TabContent"
+      class="pf-v5-c-tab-content"
+      data-ouia-component-type="PF5/TabContent"
       data-ouia-safe="true"
       hidden=""
       id="pf-tab-section-12-secondary tab3"
@@ -908,8 +910,8 @@ exports[`should render secondary tabs 1`] = `
   </section>
   <section
     aria-labelledby="pf-tab-1-tab2"
-    class="pf-c-tab-content"
-    data-ouia-component-type="PF4/TabContent"
+    class="pf-v5-c-tab-content"
+    data-ouia-component-type="PF5/TabContent"
     data-ouia-safe="true"
     hidden=""
     id="pf-tab-section-1-tab2"
@@ -920,8 +922,8 @@ exports[`should render secondary tabs 1`] = `
   </section>
   <section
     aria-labelledby="pf-tab-2-tab3"
-    class="pf-c-tab-content"
-    data-ouia-component-type="PF4/TabContent"
+    class="pf-v5-c-tab-content"
+    data-ouia-component-type="PF5/TabContent"
     data-ouia-safe="true"
     hidden=""
     id="pf-tab-section-2-tab3"
@@ -938,7 +940,7 @@ exports[`should render simple tabs 1`] = `
   <div
     class="pf-v5-c-tabs"
     data-ouia-component-id="OUIA-Generated-Tabs-1"
-    data-ouia-component-type="PF4/Tabs"
+    data-ouia-component-type="PF5/Tabs"
     data-ouia-safe="true"
     id="simpleTabs"
   >
@@ -954,7 +956,7 @@ exports[`should render simple tabs 1`] = `
           aria-controls="pf-tab-section-0-tab1"
           aria-selected="true"
           class="pf-v5-c-tabs__link"
-          data-ouia-component-type="PF4/TabButton"
+          data-ouia-component-type="PF5/TabButton"
           data-ouia-safe="true"
           id="pf-tab-0-tab1"
           role="tab"
@@ -975,7 +977,7 @@ exports[`should render simple tabs 1`] = `
           aria-controls="pf-tab-section-1-tab2"
           aria-selected="false"
           class="pf-v5-c-tabs__link"
-          data-ouia-component-type="PF4/TabButton"
+          data-ouia-component-type="PF5/TabButton"
           data-ouia-safe="true"
           id="pf-tab-1-tab2"
           role="tab"
@@ -996,7 +998,7 @@ exports[`should render simple tabs 1`] = `
           aria-controls="pf-tab-section-2-tab3"
           aria-selected="false"
           class="pf-v5-c-tabs__link"
-          data-ouia-component-type="PF4/TabButton"
+          data-ouia-component-type="PF5/TabButton"
           data-ouia-safe="true"
           id="pf-tab-2-tab3"
           role="tab"
@@ -1017,7 +1019,7 @@ exports[`should render simple tabs 1`] = `
           aria-controls="pf-tab-section-3-tab4"
           aria-selected="false"
           class="pf-v5-c-tabs__link"
-          data-ouia-component-type="PF4/TabButton"
+          data-ouia-component-type="PF5/TabButton"
           data-ouia-safe="true"
           id="pf-tab-3-tab4"
           role="tab"
@@ -1043,8 +1045,8 @@ exports[`should render simple tabs 1`] = `
   </div>
   <section
     aria-labelledby="pf-tab-0-tab1"
-    class="pf-c-tab-content"
-    data-ouia-component-type="PF4/TabContent"
+    class="pf-v5-c-tab-content"
+    data-ouia-component-type="PF5/TabContent"
     data-ouia-safe="true"
     id="pf-tab-section-0-tab1"
     role="tabpanel"
@@ -1054,8 +1056,8 @@ exports[`should render simple tabs 1`] = `
   </section>
   <section
     aria-labelledby="pf-tab-1-tab2"
-    class="pf-c-tab-content"
-    data-ouia-component-type="PF4/TabContent"
+    class="pf-v5-c-tab-content"
+    data-ouia-component-type="PF5/TabContent"
     data-ouia-safe="true"
     hidden=""
     id="pf-tab-section-1-tab2"
@@ -1066,8 +1068,8 @@ exports[`should render simple tabs 1`] = `
   </section>
   <section
     aria-labelledby="pf-tab-2-tab3"
-    class="pf-c-tab-content"
-    data-ouia-component-type="PF4/TabContent"
+    class="pf-v5-c-tab-content"
+    data-ouia-component-type="PF5/TabContent"
     data-ouia-safe="true"
     hidden=""
     id="pf-tab-section-2-tab3"
@@ -1078,8 +1080,8 @@ exports[`should render simple tabs 1`] = `
   </section>
   <section
     aria-labelledby="pf-tab-3-tab4"
-    class="pf-c-tab-content"
-    data-ouia-component-type="PF4/TabContent"
+    class="pf-v5-c-tab-content"
+    data-ouia-component-type="PF5/TabContent"
     data-ouia-safe="true"
     hidden=""
     id="pf-tab-section-3-tab4"
@@ -1096,7 +1098,7 @@ exports[`should render tabs with eventKey Strings 1`] = `
   <div
     class="pf-v5-c-tabs"
     data-ouia-component-id="OUIA-Generated-Tabs-13"
-    data-ouia-component-type="PF4/Tabs"
+    data-ouia-component-type="PF5/Tabs"
     data-ouia-safe="true"
     id="eventKeyTabs"
   >
@@ -1112,7 +1114,7 @@ exports[`should render tabs with eventKey Strings 1`] = `
           aria-controls="pf-tab-section-one-tab1"
           aria-selected="false"
           class="pf-v5-c-tabs__link"
-          data-ouia-component-type="PF4/TabButton"
+          data-ouia-component-type="PF5/TabButton"
           data-ouia-safe="true"
           id="pf-tab-one-tab1"
           role="tab"
@@ -1133,7 +1135,7 @@ exports[`should render tabs with eventKey Strings 1`] = `
           aria-controls="pf-tab-section-two-tab2"
           aria-selected="false"
           class="pf-v5-c-tabs__link"
-          data-ouia-component-type="PF4/TabButton"
+          data-ouia-component-type="PF5/TabButton"
           data-ouia-safe="true"
           id="pf-tab-two-tab2"
           role="tab"
@@ -1154,7 +1156,7 @@ exports[`should render tabs with eventKey Strings 1`] = `
           aria-controls="pf-tab-section-three-tab3"
           aria-selected="false"
           class="pf-v5-c-tabs__link"
-          data-ouia-component-type="PF4/TabButton"
+          data-ouia-component-type="PF5/TabButton"
           data-ouia-safe="true"
           id="pf-tab-three-tab3"
           role="tab"
@@ -1171,8 +1173,8 @@ exports[`should render tabs with eventKey Strings 1`] = `
   </div>
   <section
     aria-labelledby="pf-tab-one-tab1"
-    class="pf-c-tab-content"
-    data-ouia-component-type="PF4/TabContent"
+    class="pf-v5-c-tab-content"
+    data-ouia-component-type="PF5/TabContent"
     data-ouia-safe="true"
     hidden=""
     id="pf-tab-section-one-tab1"
@@ -1183,8 +1185,8 @@ exports[`should render tabs with eventKey Strings 1`] = `
   </section>
   <section
     aria-labelledby="pf-tab-two-tab2"
-    class="pf-c-tab-content"
-    data-ouia-component-type="PF4/TabContent"
+    class="pf-v5-c-tab-content"
+    data-ouia-component-type="PF5/TabContent"
     data-ouia-safe="true"
     hidden=""
     id="pf-tab-section-two-tab2"
@@ -1195,8 +1197,8 @@ exports[`should render tabs with eventKey Strings 1`] = `
   </section>
   <section
     aria-labelledby="pf-tab-three-tab3"
-    class="pf-c-tab-content"
-    data-ouia-component-type="PF4/TabContent"
+    class="pf-v5-c-tab-content"
+    data-ouia-component-type="PF5/TabContent"
     data-ouia-safe="true"
     hidden=""
     id="pf-tab-section-three-tab3"
@@ -1213,7 +1215,7 @@ exports[`should render tabs with no bottom border 1`] = `
   <div
     class="pf-v5-c-tabs pf-m-no-border-bottom"
     data-ouia-component-id="OUIA-Generated-Tabs-16"
-    data-ouia-component-type="PF4/Tabs"
+    data-ouia-component-type="PF5/Tabs"
     data-ouia-safe="true"
     id="noBottomBorderTabs"
   >
@@ -1229,7 +1231,7 @@ exports[`should render tabs with no bottom border 1`] = `
           aria-controls="pf-tab-section-0-tab1"
           aria-selected="true"
           class="pf-v5-c-tabs__link"
-          data-ouia-component-type="PF4/TabButton"
+          data-ouia-component-type="PF5/TabButton"
           data-ouia-safe="true"
           id="pf-tab-0-tab1"
           role="tab"
@@ -1250,7 +1252,7 @@ exports[`should render tabs with no bottom border 1`] = `
           aria-controls="pf-tab-section-1-tab2"
           aria-selected="false"
           class="pf-v5-c-tabs__link"
-          data-ouia-component-type="PF4/TabButton"
+          data-ouia-component-type="PF5/TabButton"
           data-ouia-safe="true"
           id="pf-tab-1-tab2"
           role="tab"
@@ -1271,7 +1273,7 @@ exports[`should render tabs with no bottom border 1`] = `
           aria-controls="pf-tab-section-2-tab3"
           aria-selected="false"
           class="pf-v5-c-tabs__link"
-          data-ouia-component-type="PF4/TabButton"
+          data-ouia-component-type="PF5/TabButton"
           data-ouia-safe="true"
           id="pf-tab-2-tab3"
           role="tab"
@@ -1288,8 +1290,8 @@ exports[`should render tabs with no bottom border 1`] = `
   </div>
   <section
     aria-labelledby="pf-tab-0-tab1"
-    class="pf-c-tab-content"
-    data-ouia-component-type="PF4/TabContent"
+    class="pf-v5-c-tab-content"
+    data-ouia-component-type="PF5/TabContent"
     data-ouia-safe="true"
     id="pf-tab-section-0-tab1"
     role="tabpanel"
@@ -1299,8 +1301,8 @@ exports[`should render tabs with no bottom border 1`] = `
   </section>
   <section
     aria-labelledby="pf-tab-1-tab2"
-    class="pf-c-tab-content"
-    data-ouia-component-type="PF4/TabContent"
+    class="pf-v5-c-tab-content"
+    data-ouia-component-type="PF5/TabContent"
     data-ouia-safe="true"
     hidden=""
     id="pf-tab-section-1-tab2"
@@ -1311,8 +1313,8 @@ exports[`should render tabs with no bottom border 1`] = `
   </section>
   <section
     aria-labelledby="pf-tab-2-tab3"
-    class="pf-c-tab-content"
-    data-ouia-component-type="PF4/TabContent"
+    class="pf-v5-c-tab-content"
+    data-ouia-component-type="PF5/TabContent"
     data-ouia-safe="true"
     hidden=""
     id="pf-tab-section-2-tab3"
@@ -1329,7 +1331,7 @@ exports[`should render tabs with separate content 1`] = `
   <div
     class="pf-v5-c-tabs"
     data-ouia-component-id="OUIA-Generated-Tabs-14"
-    data-ouia-component-type="PF4/Tabs"
+    data-ouia-component-type="PF5/Tabs"
     data-ouia-safe="true"
     id="separateTabs"
   >
@@ -1345,7 +1347,7 @@ exports[`should render tabs with separate content 1`] = `
           aria-controls="refTab1Section"
           aria-selected="true"
           class="pf-v5-c-tabs__link"
-          data-ouia-component-type="PF4/TabButton"
+          data-ouia-component-type="PF5/TabButton"
           data-ouia-safe="true"
           id="pf-tab-0-separateTabs"
           role="tab"
@@ -1366,7 +1368,7 @@ exports[`should render tabs with separate content 1`] = `
           aria-controls="refTab2Section"
           aria-selected="false"
           class="pf-v5-c-tabs__link"
-          data-ouia-component-type="PF4/TabButton"
+          data-ouia-component-type="PF5/TabButton"
           data-ouia-safe="true"
           id="pf-tab-1-separateTabs"
           role="tab"
@@ -1387,7 +1389,7 @@ exports[`should render tabs with separate content 1`] = `
           aria-controls="refTab3Section"
           aria-selected="false"
           class="pf-v5-c-tabs__link"
-          data-ouia-component-type="PF4/TabButton"
+          data-ouia-component-type="PF5/TabButton"
           data-ouia-safe="true"
           id="pf-tab-2-separateTabs"
           role="tab"
@@ -1405,8 +1407,8 @@ exports[`should render tabs with separate content 1`] = `
   <div>
     <section
       aria-label="Tab item 1"
-      class="pf-c-tab-content"
-      data-ouia-component-type="PF4/TabContent"
+      class="pf-v5-c-tab-content"
+      data-ouia-component-type="PF5/TabContent"
       data-ouia-safe="true"
       id="refTab1Section"
       role="tabpanel"
@@ -1416,8 +1418,8 @@ exports[`should render tabs with separate content 1`] = `
     </section>
     <section
       aria-label="Tab item 2"
-      class="pf-c-tab-content"
-      data-ouia-component-type="PF4/TabContent"
+      class="pf-v5-c-tab-content"
+      data-ouia-component-type="PF5/TabContent"
       data-ouia-safe="true"
       hidden=""
       id="refTab2Section"
@@ -1432,8 +1434,8 @@ exports[`should render tabs with separate content 1`] = `
     </section>
     <section
       aria-label="Tab item 3"
-      class="pf-c-tab-content"
-      data-ouia-component-type="PF4/TabContent"
+      class="pf-v5-c-tab-content"
+      data-ouia-component-type="PF5/TabContent"
       data-ouia-safe="true"
       hidden=""
       id="refTab3Section"
@@ -1455,7 +1457,7 @@ exports[`should render uncontrolled tabs 1`] = `
   <div
     class="pf-v5-c-tabs"
     data-ouia-component-id="OUIA-Generated-Tabs-4"
-    data-ouia-component-type="PF4/Tabs"
+    data-ouia-component-type="PF5/Tabs"
     data-ouia-safe="true"
   >
     <ul
@@ -1470,7 +1472,7 @@ exports[`should render uncontrolled tabs 1`] = `
           aria-controls="pf-tab-section-0-tab1"
           aria-selected="true"
           class="pf-v5-c-tabs__link"
-          data-ouia-component-type="PF4/TabButton"
+          data-ouia-component-type="PF5/TabButton"
           data-ouia-safe="true"
           id="pf-tab-0-tab1"
           role="tab"
@@ -1491,7 +1493,7 @@ exports[`should render uncontrolled tabs 1`] = `
           aria-controls="pf-tab-section-1-tab2"
           aria-selected="false"
           class="pf-v5-c-tabs__link"
-          data-ouia-component-type="PF4/TabButton"
+          data-ouia-component-type="PF5/TabButton"
           data-ouia-safe="true"
           id="pf-tab-1-tab2"
           role="tab"
@@ -1512,7 +1514,7 @@ exports[`should render uncontrolled tabs 1`] = `
           aria-controls="pf-tab-section-2-tab3"
           aria-selected="false"
           class="pf-v5-c-tabs__link"
-          data-ouia-component-type="PF4/TabButton"
+          data-ouia-component-type="PF5/TabButton"
           data-ouia-safe="true"
           id="pf-tab-2-tab3"
           role="tab"
@@ -1533,7 +1535,7 @@ exports[`should render uncontrolled tabs 1`] = `
           aria-controls="pf-tab-section-3-tab4"
           aria-selected="false"
           class="pf-v5-c-tabs__link"
-          data-ouia-component-type="PF4/TabButton"
+          data-ouia-component-type="PF5/TabButton"
           data-ouia-safe="true"
           id="pf-tab-3-tab4"
           role="tab"
@@ -1559,8 +1561,8 @@ exports[`should render uncontrolled tabs 1`] = `
   </div>
   <section
     aria-labelledby="pf-tab-0-tab1"
-    class="pf-c-tab-content"
-    data-ouia-component-type="PF4/TabContent"
+    class="pf-v5-c-tab-content"
+    data-ouia-component-type="PF5/TabContent"
     data-ouia-safe="true"
     id="pf-tab-section-0-tab1"
     role="tabpanel"
@@ -1570,8 +1572,8 @@ exports[`should render uncontrolled tabs 1`] = `
   </section>
   <section
     aria-labelledby="pf-tab-1-tab2"
-    class="pf-c-tab-content"
-    data-ouia-component-type="PF4/TabContent"
+    class="pf-v5-c-tab-content"
+    data-ouia-component-type="PF5/TabContent"
     data-ouia-safe="true"
     hidden=""
     id="pf-tab-section-1-tab2"
@@ -1582,8 +1584,8 @@ exports[`should render uncontrolled tabs 1`] = `
   </section>
   <section
     aria-labelledby="pf-tab-2-tab3"
-    class="pf-c-tab-content"
-    data-ouia-component-type="PF4/TabContent"
+    class="pf-v5-c-tab-content"
+    data-ouia-component-type="PF5/TabContent"
     data-ouia-safe="true"
     hidden=""
     id="pf-tab-section-2-tab3"
@@ -1594,8 +1596,8 @@ exports[`should render uncontrolled tabs 1`] = `
   </section>
   <section
     aria-labelledby="pf-tab-3-tab4"
-    class="pf-c-tab-content"
-    data-ouia-component-type="PF4/TabContent"
+    class="pf-v5-c-tab-content"
+    data-ouia-component-type="PF5/TabContent"
     data-ouia-safe="true"
     hidden=""
     id="pf-tab-section-3-tab4"
@@ -1612,7 +1614,7 @@ exports[`should render vertical tabs 1`] = `
   <div
     class="pf-v5-c-tabs pf-m-vertical"
     data-ouia-component-id="OUIA-Generated-Tabs-5"
-    data-ouia-component-type="PF4/Tabs"
+    data-ouia-component-type="PF5/Tabs"
     data-ouia-safe="true"
     id="verticalTabs"
   >
@@ -1628,7 +1630,7 @@ exports[`should render vertical tabs 1`] = `
           aria-controls="pf-tab-section-0-tab1"
           aria-selected="true"
           class="pf-v5-c-tabs__link"
-          data-ouia-component-type="PF4/TabButton"
+          data-ouia-component-type="PF5/TabButton"
           data-ouia-safe="true"
           id="pf-tab-0-tab1"
           role="tab"
@@ -1649,7 +1651,7 @@ exports[`should render vertical tabs 1`] = `
           aria-controls="pf-tab-section-1-tab2"
           aria-selected="false"
           class="pf-v5-c-tabs__link"
-          data-ouia-component-type="PF4/TabButton"
+          data-ouia-component-type="PF5/TabButton"
           data-ouia-safe="true"
           id="pf-tab-1-tab2"
           role="tab"
@@ -1670,7 +1672,7 @@ exports[`should render vertical tabs 1`] = `
           aria-controls="pf-tab-section-2-tab3"
           aria-selected="false"
           class="pf-v5-c-tabs__link"
-          data-ouia-component-type="PF4/TabButton"
+          data-ouia-component-type="PF5/TabButton"
           data-ouia-safe="true"
           id="pf-tab-2-tab3"
           role="tab"
@@ -1691,7 +1693,7 @@ exports[`should render vertical tabs 1`] = `
           aria-controls="pf-tab-section-3-tab4"
           aria-selected="false"
           class="pf-v5-c-tabs__link"
-          data-ouia-component-type="PF4/TabButton"
+          data-ouia-component-type="PF5/TabButton"
           data-ouia-safe="true"
           id="pf-tab-3-tab4"
           role="tab"
@@ -1717,8 +1719,8 @@ exports[`should render vertical tabs 1`] = `
   </div>
   <section
     aria-labelledby="pf-tab-0-tab1"
-    class="pf-c-tab-content"
-    data-ouia-component-type="PF4/TabContent"
+    class="pf-v5-c-tab-content"
+    data-ouia-component-type="PF5/TabContent"
     data-ouia-safe="true"
     id="pf-tab-section-0-tab1"
     role="tabpanel"
@@ -1728,8 +1730,8 @@ exports[`should render vertical tabs 1`] = `
   </section>
   <section
     aria-labelledby="pf-tab-1-tab2"
-    class="pf-c-tab-content"
-    data-ouia-component-type="PF4/TabContent"
+    class="pf-v5-c-tab-content"
+    data-ouia-component-type="PF5/TabContent"
     data-ouia-safe="true"
     hidden=""
     id="pf-tab-section-1-tab2"
@@ -1740,8 +1742,8 @@ exports[`should render vertical tabs 1`] = `
   </section>
   <section
     aria-labelledby="pf-tab-2-tab3"
-    class="pf-c-tab-content"
-    data-ouia-component-type="PF4/TabContent"
+    class="pf-v5-c-tab-content"
+    data-ouia-component-type="PF5/TabContent"
     data-ouia-safe="true"
     hidden=""
     id="pf-tab-section-2-tab3"
@@ -1752,8 +1754,8 @@ exports[`should render vertical tabs 1`] = `
   </section>
   <section
     aria-labelledby="pf-tab-3-tab4"
-    class="pf-c-tab-content"
-    data-ouia-component-type="PF4/TabContent"
+    class="pf-v5-c-tab-content"
+    data-ouia-component-type="PF5/TabContent"
     data-ouia-safe="true"
     hidden=""
     id="pf-tab-section-3-tab4"