@patternfly/patternfly 6.0.0-alpha.90 → 6.0.0-alpha.92

package/docs/components/Dropdown/deprecated/Dropdown.md

@@ -11,36 +11,36 @@ deprecated: true
 ### Expanded
 
 ```html
-<div class="pf-v5-c-dropdown pf-m-expanded">
+<div class="pf-v6-c-dropdown pf-m-expanded">
   <button
-    class="pf-v5-c-dropdown__toggle"
+    class="pf-v6-c-dropdown__toggle"
     id="dropdown-expanded-button"
     aria-expanded="true"
     type="button"
   >
-    <span class="pf-v5-c-dropdown__toggle-text">Expanded dropdown</span>
-    <span class="pf-v5-c-dropdown__toggle-icon">
+    <span class="pf-v6-c-dropdown__toggle-text">Expanded dropdown</span>
+    <span class="pf-v6-c-dropdown__toggle-icon">
       <i class="fas fa-caret-down" aria-hidden="true"></i>
     </span>
   </button>
   <ul
-    class="pf-v5-c-dropdown__menu"
+    class="pf-v6-c-dropdown__menu"
     aria-labelledby="dropdown-expanded-button"
     role="menu"
   >
     <li role="none">
-      <a class="pf-v5-c-dropdown__menu-item" role="menuitem" href="#">Link</a>
+      <a class="pf-v6-c-dropdown__menu-item" role="menuitem" href="#">Link</a>
     </li>
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
       >Action</button>
     </li>
     <li role="none">
       <a
-        class="pf-v5-c-dropdown__menu-item pf-m-disabled"
+        class="pf-v6-c-dropdown__menu-item pf-m-disabled"
         role="menuitem"
         href="#"
         aria-disabled="true"
@@ -49,16 +49,16 @@ deprecated: true
     </li>
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
         disabled
       >Disabled action</button>
     </li>
-    <li class="pf-v5-c-divider" role="separator"></li>
+    <li class="pf-v6-c-divider" role="separator"></li>
     <li role="none">
       <a
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         href="#"
       >Separated link</a>
@@ -71,37 +71,37 @@ deprecated: true
 ### Collapsed
 
 ```html
-<div class="pf-v5-c-dropdown">
+<div class="pf-v6-c-dropdown">
   <button
-    class="pf-v5-c-dropdown__toggle"
+    class="pf-v6-c-dropdown__toggle"
     id="dropdown-collapsed-button"
     aria-expanded="false"
     type="button"
   >
-    <span class="pf-v5-c-dropdown__toggle-text">Collapsed dropdown</span>
-    <span class="pf-v5-c-dropdown__toggle-icon">
+    <span class="pf-v6-c-dropdown__toggle-text">Collapsed dropdown</span>
+    <span class="pf-v6-c-dropdown__toggle-icon">
       <i class="fas fa-caret-down" aria-hidden="true"></i>
     </span>
   </button>
   <ul
-    class="pf-v5-c-dropdown__menu"
+    class="pf-v6-c-dropdown__menu"
     aria-labelledby="dropdown-collapsed-button"
     hidden
     role="menu"
   >
     <li role="none">
-      <a class="pf-v5-c-dropdown__menu-item" role="menuitem" href="#">Link</a>
+      <a class="pf-v6-c-dropdown__menu-item" role="menuitem" href="#">Link</a>
     </li>
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
       >Action</button>
     </li>
     <li role="none">
       <a
-        class="pf-v5-c-dropdown__menu-item pf-m-disabled"
+        class="pf-v6-c-dropdown__menu-item pf-m-disabled"
         role="menuitem"
         href="#"
         aria-disabled="true"
@@ -110,16 +110,16 @@ deprecated: true
     </li>
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
         disabled
       >Disabled action</button>
     </li>
-    <li class="pf-v5-c-divider" role="separator"></li>
+    <li class="pf-v6-c-divider" role="separator"></li>
     <li role="none">
       <a
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         href="#"
       >Separated link</a>
@@ -132,38 +132,38 @@ deprecated: true
 ### Disabled
 
 ```html
-<div class="pf-v5-c-dropdown">
+<div class="pf-v6-c-dropdown">
   <button
-    class="pf-v5-c-dropdown__toggle"
+    class="pf-v6-c-dropdown__toggle"
     id="dropdown-disabled-button"
     aria-expanded="false"
     type="button"
     disabled
   >
-    <span class="pf-v5-c-dropdown__toggle-text">Disabled dropdown</span>
-    <span class="pf-v5-c-dropdown__toggle-icon">
+    <span class="pf-v6-c-dropdown__toggle-text">Disabled dropdown</span>
+    <span class="pf-v6-c-dropdown__toggle-icon">
       <i class="fas fa-caret-down" aria-hidden="true"></i>
     </span>
   </button>
   <ul
-    class="pf-v5-c-dropdown__menu"
+    class="pf-v6-c-dropdown__menu"
     aria-labelledby="dropdown-disabled-button"
     hidden
     role="menu"
   >
     <li role="none">
-      <a class="pf-v5-c-dropdown__menu-item" role="menuitem" href="#">Link</a>
+      <a class="pf-v6-c-dropdown__menu-item" role="menuitem" href="#">Link</a>
     </li>
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
       >Action</button>
     </li>
     <li role="none">
       <a
-        class="pf-v5-c-dropdown__menu-item pf-m-disabled"
+        class="pf-v6-c-dropdown__menu-item pf-m-disabled"
         role="menuitem"
         href="#"
         aria-disabled="true"
@@ -172,16 +172,16 @@ deprecated: true
     </li>
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
         disabled
       >Disabled action</button>
     </li>
-    <li class="pf-v5-c-divider" role="separator"></li>
+    <li class="pf-v6-c-divider" role="separator"></li>
     <li role="none">
       <a
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         href="#"
       >Separated link</a>
@@ -194,36 +194,36 @@ deprecated: true
 ### Aria disabled items
 
 ```html
-<div class="pf-v5-c-dropdown pf-m-expanded">
+<div class="pf-v6-c-dropdown pf-m-expanded">
   <button
-    class="pf-v5-c-dropdown__toggle"
+    class="pf-v6-c-dropdown__toggle"
     id="dropdown-aria-disabled-items-button"
     aria-expanded="true"
     type="button"
   >
-    <span class="pf-v5-c-dropdown__toggle-text">Expanded dropdown</span>
-    <span class="pf-v5-c-dropdown__toggle-icon">
+    <span class="pf-v6-c-dropdown__toggle-text">Expanded dropdown</span>
+    <span class="pf-v6-c-dropdown__toggle-icon">
       <i class="fas fa-caret-down" aria-hidden="true"></i>
     </span>
   </button>
   <ul
-    class="pf-v5-c-dropdown__menu"
+    class="pf-v6-c-dropdown__menu"
     aria-labelledby="dropdown-aria-disabled-items-button"
     role="menu"
   >
     <li role="none">
-      <a class="pf-v5-c-dropdown__menu-item" role="menuitem" href="#">Link</a>
+      <a class="pf-v6-c-dropdown__menu-item" role="menuitem" href="#">Link</a>
     </li>
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
       >Action</button>
     </li>
     <li role="none">
       <a
-        class="pf-v5-c-dropdown__menu-item pf-m-aria-disabled"
+        class="pf-v6-c-dropdown__menu-item pf-m-aria-disabled"
         role="menuitem"
         href="#"
         aria-disabled="true"
@@ -231,16 +231,16 @@ deprecated: true
     </li>
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item pf-m-aria-disabled"
+        class="pf-v6-c-dropdown__menu-item pf-m-aria-disabled"
         role="menuitem"
         type="button"
         aria-disabled="true"
       >Disabled action</button>
     </li>
-    <li class="pf-v5-c-divider" role="separator"></li>
+    <li class="pf-v6-c-divider" role="separator"></li>
     <li role="none">
       <a
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         href="#"
       >Separated link</a>
@@ -253,9 +253,9 @@ deprecated: true
 ### Kebab
 
 ```html
-<div class="pf-v5-c-dropdown">
+<div class="pf-v6-c-dropdown">
   <button
-    class="pf-v5-c-dropdown__toggle pf-m-plain"
+    class="pf-v6-c-dropdown__toggle pf-m-plain"
     id="dropdown-kebab-disabled-button"
     aria-expanded="false"
     type="button"
@@ -265,24 +265,24 @@ deprecated: true
     <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
   </button>
   <ul
-    class="pf-v5-c-dropdown__menu"
+    class="pf-v6-c-dropdown__menu"
     aria-labelledby="dropdown-kebab-disabled-button"
     hidden
     role="menu"
   >
     <li role="none">
-      <a class="pf-v5-c-dropdown__menu-item" role="menuitem" href="#">Link</a>
+      <a class="pf-v6-c-dropdown__menu-item" role="menuitem" href="#">Link</a>
     </li>
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
       >Action</button>
     </li>
     <li role="none">
       <a
-        class="pf-v5-c-dropdown__menu-item pf-m-disabled"
+        class="pf-v6-c-dropdown__menu-item pf-m-disabled"
         role="menuitem"
         href="#"
         aria-disabled="true"
@@ -291,25 +291,25 @@ deprecated: true
     </li>
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
         disabled
       >Disabled action</button>
     </li>
-    <li class="pf-v5-c-divider" role="separator"></li>
+    <li class="pf-v6-c-divider" role="separator"></li>
     <li role="none">
       <a
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         href="#"
       >Separated link</a>
     </li>
   </ul>
 </div>
-<div class="pf-v5-c-dropdown">
+<div class="pf-v6-c-dropdown">
   <button
-    class="pf-v5-c-dropdown__toggle pf-m-plain"
+    class="pf-v6-c-dropdown__toggle pf-m-plain"
     id="dropdown-kebab-button"
     aria-expanded="false"
     type="button"
@@ -318,24 +318,24 @@ deprecated: true
     <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
   </button>
   <ul
-    class="pf-v5-c-dropdown__menu"
+    class="pf-v6-c-dropdown__menu"
     aria-labelledby="dropdown-kebab-button"
     hidden
     role="menu"
   >
     <li role="none">
-      <a class="pf-v5-c-dropdown__menu-item" role="menuitem" href="#">Link</a>
+      <a class="pf-v6-c-dropdown__menu-item" role="menuitem" href="#">Link</a>
     </li>
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
       >Action</button>
     </li>
     <li role="none">
       <a
-        class="pf-v5-c-dropdown__menu-item pf-m-disabled"
+        class="pf-v6-c-dropdown__menu-item pf-m-disabled"
         role="menuitem"
         href="#"
         aria-disabled="true"
@@ -344,25 +344,25 @@ deprecated: true
     </li>
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
         disabled
       >Disabled action</button>
     </li>
-    <li class="pf-v5-c-divider" role="separator"></li>
+    <li class="pf-v6-c-divider" role="separator"></li>
     <li role="none">
       <a
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         href="#"
       >Separated link</a>
     </li>
   </ul>
 </div>
-<div class="pf-v5-c-dropdown pf-m-expanded">
+<div class="pf-v6-c-dropdown pf-m-expanded">
   <button
-    class="pf-v5-c-dropdown__toggle pf-m-plain"
+    class="pf-v6-c-dropdown__toggle pf-m-plain"
     id="dropdown-kebab-expanded-button"
     aria-expanded="true"
     type="button"
@@ -371,23 +371,23 @@ deprecated: true
     <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
   </button>
   <ul
-    class="pf-v5-c-dropdown__menu"
+    class="pf-v6-c-dropdown__menu"
     aria-labelledby="dropdown-kebab-expanded-button"
     role="menu"
   >
     <li role="none">
-      <a class="pf-v5-c-dropdown__menu-item" role="menuitem" href="#">Link</a>
+      <a class="pf-v6-c-dropdown__menu-item" role="menuitem" href="#">Link</a>
     </li>
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
       >Action</button>
     </li>
     <li role="none">
       <a
-        class="pf-v5-c-dropdown__menu-item pf-m-disabled"
+        class="pf-v6-c-dropdown__menu-item pf-m-disabled"
         role="menuitem"
         href="#"
         aria-disabled="true"
@@ -396,16 +396,16 @@ deprecated: true
     </li>
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
         disabled
       >Disabled action</button>
     </li>
-    <li class="pf-v5-c-divider" role="separator"></li>
+    <li class="pf-v6-c-divider" role="separator"></li>
     <li role="none">
       <a
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         href="#"
       >Separated link</a>
@@ -418,9 +418,9 @@ deprecated: true
 ### Kebab align right
 
 ```html
-<div class="pf-v5-c-dropdown pf-m-expanded">
+<div class="pf-v6-c-dropdown pf-m-expanded">
   <button
-    class="pf-v5-c-dropdown__toggle pf-m-plain"
+    class="pf-v6-c-dropdown__toggle pf-m-plain"
     id="dropdown-kebab-align-right-button"
     aria-expanded="true"
     type="button"
@@ -429,23 +429,23 @@ deprecated: true
     <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
   </button>
   <ul
-    class="pf-v5-c-dropdown__menu pf-m-align-right"
+    class="pf-v6-c-dropdown__menu pf-m-align-right"
     aria-labelledby="dropdown-kebab-align-right-button"
     role="menu"
   >
     <li role="none">
-      <a class="pf-v5-c-dropdown__menu-item" role="menuitem" href="#">Link</a>
+      <a class="pf-v6-c-dropdown__menu-item" role="menuitem" href="#">Link</a>
     </li>
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
       >Action</button>
     </li>
     <li role="none">
       <a
-        class="pf-v5-c-dropdown__menu-item pf-m-disabled"
+        class="pf-v6-c-dropdown__menu-item pf-m-disabled"
         role="menuitem"
         href="#"
         aria-disabled="true"
@@ -454,16 +454,16 @@ deprecated: true
     </li>
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
         disabled
       >Disabled action</button>
     </li>
-    <li class="pf-v5-c-divider" role="separator"></li>
+    <li class="pf-v6-c-divider" role="separator"></li>
     <li role="none">
       <a
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         href="#"
       >Separated link</a>
@@ -476,36 +476,36 @@ deprecated: true
 ### Align right
 
 ```html
-<div class="pf-v5-c-dropdown pf-m-expanded">
+<div class="pf-v6-c-dropdown pf-m-expanded">
   <button
-    class="pf-v5-c-dropdown__toggle"
+    class="pf-v6-c-dropdown__toggle"
     id="dropdown-align-right-button"
     aria-expanded="true"
     type="button"
   >
-    <span class="pf-v5-c-dropdown__toggle-text">Right</span>
-    <span class="pf-v5-c-dropdown__toggle-icon">
+    <span class="pf-v6-c-dropdown__toggle-text">Right</span>
+    <span class="pf-v6-c-dropdown__toggle-icon">
       <i class="fas fa-caret-down" aria-hidden="true"></i>
     </span>
   </button>
   <ul
-    class="pf-v5-c-dropdown__menu pf-m-align-right"
+    class="pf-v6-c-dropdown__menu pf-m-align-right"
     aria-labelledby="dropdown-align-right-button"
     role="menu"
   >
     <li role="none">
-      <a class="pf-v5-c-dropdown__menu-item" role="menuitem" href="#">Link</a>
+      <a class="pf-v6-c-dropdown__menu-item" role="menuitem" href="#">Link</a>
     </li>
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
       >Action</button>
     </li>
     <li role="none">
       <a
-        class="pf-v5-c-dropdown__menu-item pf-m-disabled"
+        class="pf-v6-c-dropdown__menu-item pf-m-disabled"
         role="menuitem"
         href="#"
         aria-disabled="true"
@@ -514,16 +514,16 @@ deprecated: true
     </li>
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
         disabled
       >Disabled action</button>
     </li>
-    <li class="pf-v5-c-divider" role="separator"></li>
+    <li class="pf-v6-c-divider" role="separator"></li>
     <li role="none">
       <a
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         href="#"
       >Separated link</a>
@@ -536,36 +536,36 @@ deprecated: true
 ### Align on different breakpoint
 
 ```html
-<div class="pf-v5-c-dropdown pf-m-expanded">
+<div class="pf-v6-c-dropdown pf-m-expanded">
   <button
-    class="pf-v5-c-dropdown__toggle"
+    class="pf-v6-c-dropdown__toggle"
     id="dropdown-align-on-different-breakpoint-button"
     aria-expanded="true"
     type="button"
   >
-    <span class="pf-v5-c-dropdown__toggle-text">Dropdown</span>
-    <span class="pf-v5-c-dropdown__toggle-icon">
+    <span class="pf-v6-c-dropdown__toggle-text">Dropdown</span>
+    <span class="pf-v6-c-dropdown__toggle-icon">
       <i class="fas fa-caret-down" aria-hidden="true"></i>
     </span>
   </button>
   <ul
-    class="pf-v5-c-dropdown__menu pf-m-align-right-on-lg pf-m-align-left-on-2xl"
+    class="pf-v6-c-dropdown__menu pf-m-align-right-on-lg pf-m-align-left-on-2xl"
     aria-labelledby="dropdown-align-on-different-breakpoint-button"
     role="menu"
   >
     <li role="none">
-      <a class="pf-v5-c-dropdown__menu-item" role="menuitem" href="#">Link</a>
+      <a class="pf-v6-c-dropdown__menu-item" role="menuitem" href="#">Link</a>
     </li>
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
       >Action</button>
     </li>
     <li role="none">
       <a
-        class="pf-v5-c-dropdown__menu-item pf-m-disabled"
+        class="pf-v6-c-dropdown__menu-item pf-m-disabled"
         role="menuitem"
         href="#"
         aria-disabled="true"
@@ -574,16 +574,16 @@ deprecated: true
     </li>
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
         disabled
       >Disabled action</button>
     </li>
-    <li class="pf-v5-c-divider" role="separator"></li>
+    <li class="pf-v6-c-divider" role="separator"></li>
     <li role="none">
       <a
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         href="#"
       >Separated link</a>
@@ -596,37 +596,37 @@ deprecated: true
 ### Align top
 
 ```html
-<div class="pf-v5-c-dropdown pf-m-top">
+<div class="pf-v6-c-dropdown pf-m-top">
   <button
-    class="pf-v5-c-dropdown__toggle"
+    class="pf-v6-c-dropdown__toggle"
     id="dropdown-align-top-button"
     aria-expanded="false"
     type="button"
   >
-    <span class="pf-v5-c-dropdown__toggle-text">Top</span>
-    <span class="pf-v5-c-dropdown__toggle-icon">
+    <span class="pf-v6-c-dropdown__toggle-text">Top</span>
+    <span class="pf-v6-c-dropdown__toggle-icon">
       <i class="fas fa-caret-down" aria-hidden="true"></i>
     </span>
   </button>
   <ul
-    class="pf-v5-c-dropdown__menu"
+    class="pf-v6-c-dropdown__menu"
     aria-labelledby="dropdown-align-top-button"
     hidden
     role="menu"
   >
     <li role="none">
-      <a class="pf-v5-c-dropdown__menu-item" role="menuitem" href="#">Link</a>
+      <a class="pf-v6-c-dropdown__menu-item" role="menuitem" href="#">Link</a>
     </li>
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
       >Action</button>
     </li>
     <li role="none">
       <a
-        class="pf-v5-c-dropdown__menu-item pf-m-disabled"
+        class="pf-v6-c-dropdown__menu-item pf-m-disabled"
         role="menuitem"
         href="#"
         aria-disabled="true"
@@ -635,52 +635,52 @@ deprecated: true
     </li>
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
         disabled
       >Disabled action</button>
     </li>
-    <li class="pf-v5-c-divider" role="separator"></li>
+    <li class="pf-v6-c-divider" role="separator"></li>
     <li role="none">
       <a
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         href="#"
       >Separated link</a>
     </li>
   </ul>
 </div>
-<div class="pf-v5-c-dropdown pf-m-expanded pf-m-top">
+<div class="pf-v6-c-dropdown pf-m-expanded pf-m-top">
   <button
-    class="pf-v5-c-dropdown__toggle"
+    class="pf-v6-c-dropdown__toggle"
     id="dropdown-align-top-expanded-button"
     aria-expanded="true"
     type="button"
   >
-    <span class="pf-v5-c-dropdown__toggle-text">Top</span>
-    <span class="pf-v5-c-dropdown__toggle-icon">
+    <span class="pf-v6-c-dropdown__toggle-text">Top</span>
+    <span class="pf-v6-c-dropdown__toggle-icon">
       <i class="fas fa-caret-down" aria-hidden="true"></i>
     </span>
   </button>
   <ul
-    class="pf-v5-c-dropdown__menu"
+    class="pf-v6-c-dropdown__menu"
     aria-labelledby="dropdown-align-top-expanded-button"
     role="menu"
   >
     <li role="none">
-      <a class="pf-v5-c-dropdown__menu-item" role="menuitem" href="#">Link</a>
+      <a class="pf-v6-c-dropdown__menu-item" role="menuitem" href="#">Link</a>
     </li>
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
       >Action</button>
     </li>
     <li role="none">
       <a
-        class="pf-v5-c-dropdown__menu-item pf-m-disabled"
+        class="pf-v6-c-dropdown__menu-item pf-m-disabled"
         role="menuitem"
         href="#"
         aria-disabled="true"
@@ -689,16 +689,16 @@ deprecated: true
     </li>
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
         disabled
       >Disabled action</button>
     </li>
-    <li class="pf-v5-c-divider" role="separator"></li>
+    <li class="pf-v6-c-divider" role="separator"></li>
     <li role="none">
       <a
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         href="#"
       >Separated link</a>
@@ -711,38 +711,38 @@ deprecated: true
 ### Plain with text
 
 ```html
-<div class="pf-v5-c-dropdown">
+<div class="pf-v6-c-dropdown">
   <button
-    class="pf-v5-c-dropdown__toggle pf-m-plain pf-m-text"
+    class="pf-v6-c-dropdown__toggle pf-m-plain pf-m-text"
     id="plain-with-text-example-disabled-button"
     aria-expanded="false"
     type="button"
     disabled
   >
-    <span class="pf-v5-c-dropdown__toggle-text">Custom text</span>
-    <span class="pf-v5-c-dropdown__toggle-icon">
+    <span class="pf-v6-c-dropdown__toggle-text">Custom text</span>
+    <span class="pf-v6-c-dropdown__toggle-icon">
       <i class="fas fa-caret-down" aria-hidden="true"></i>
     </span>
   </button>
   <ul
-    class="pf-v5-c-dropdown__menu"
+    class="pf-v6-c-dropdown__menu"
     aria-labelledby="plain-with-text-example-disabled-button"
     hidden
     role="menu"
   >
     <li role="none">
-      <a class="pf-v5-c-dropdown__menu-item" role="menuitem" href="#">Link</a>
+      <a class="pf-v6-c-dropdown__menu-item" role="menuitem" href="#">Link</a>
     </li>
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
       >Action</button>
     </li>
     <li role="none">
       <a
-        class="pf-v5-c-dropdown__menu-item pf-m-disabled"
+        class="pf-v6-c-dropdown__menu-item pf-m-disabled"
         role="menuitem"
         href="#"
         aria-disabled="true"
@@ -751,53 +751,53 @@ deprecated: true
     </li>
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
         disabled
       >Disabled action</button>
     </li>
-    <li class="pf-v5-c-divider" role="separator"></li>
+    <li class="pf-v6-c-divider" role="separator"></li>
     <li role="none">
       <a
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         href="#"
       >Separated link</a>
     </li>
   </ul>
 </div>&nbsp;
-<div class="pf-v5-c-dropdown">
+<div class="pf-v6-c-dropdown">
   <button
-    class="pf-v5-c-dropdown__toggle pf-m-plain pf-m-text"
+    class="pf-v6-c-dropdown__toggle pf-m-plain pf-m-text"
     id="plain-with-text-example-button"
     aria-expanded="false"
     type="button"
   >
-    <span class="pf-v5-c-dropdown__toggle-text">Custom text</span>
-    <span class="pf-v5-c-dropdown__toggle-icon">
+    <span class="pf-v6-c-dropdown__toggle-text">Custom text</span>
+    <span class="pf-v6-c-dropdown__toggle-icon">
       <i class="fas fa-caret-down" aria-hidden="true"></i>
     </span>
   </button>
   <ul
-    class="pf-v5-c-dropdown__menu"
+    class="pf-v6-c-dropdown__menu"
     aria-labelledby="plain-with-text-example-button"
     hidden
     role="menu"
   >
     <li role="none">
-      <a class="pf-v5-c-dropdown__menu-item" role="menuitem" href="#">Link</a>
+      <a class="pf-v6-c-dropdown__menu-item" role="menuitem" href="#">Link</a>
     </li>
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
       >Action</button>
     </li>
     <li role="none">
       <a
-        class="pf-v5-c-dropdown__menu-item pf-m-disabled"
+        class="pf-v6-c-dropdown__menu-item pf-m-disabled"
         role="menuitem"
         href="#"
         aria-disabled="true"
@@ -806,52 +806,52 @@ deprecated: true
     </li>
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
         disabled
       >Disabled action</button>
     </li>
-    <li class="pf-v5-c-divider" role="separator"></li>
+    <li class="pf-v6-c-divider" role="separator"></li>
     <li role="none">
       <a
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         href="#"
       >Separated link</a>
     </li>
   </ul>
 </div>&nbsp;
-<div class="pf-v5-c-dropdown pf-m-expanded">
+<div class="pf-v6-c-dropdown pf-m-expanded">
   <button
-    class="pf-v5-c-dropdown__toggle pf-m-plain pf-m-text"
+    class="pf-v6-c-dropdown__toggle pf-m-plain pf-m-text"
     id="plain-with-text-example-expanded-button"
     aria-expanded="true"
     type="button"
   >
-    <span class="pf-v5-c-dropdown__toggle-text">Custom text (expanded)</span>
-    <span class="pf-v5-c-dropdown__toggle-icon">
+    <span class="pf-v6-c-dropdown__toggle-text">Custom text (expanded)</span>
+    <span class="pf-v6-c-dropdown__toggle-icon">
       <i class="fas fa-caret-down" aria-hidden="true"></i>
     </span>
   </button>
   <ul
-    class="pf-v5-c-dropdown__menu"
+    class="pf-v6-c-dropdown__menu"
     aria-labelledby="plain-with-text-example-expanded-button"
     role="menu"
   >
     <li role="none">
-      <a class="pf-v5-c-dropdown__menu-item" role="menuitem" href="#">Link</a>
+      <a class="pf-v6-c-dropdown__menu-item" role="menuitem" href="#">Link</a>
     </li>
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
       >Action</button>
     </li>
     <li role="none">
       <a
-        class="pf-v5-c-dropdown__menu-item pf-m-disabled"
+        class="pf-v6-c-dropdown__menu-item pf-m-disabled"
         role="menuitem"
         href="#"
         aria-disabled="true"
@@ -860,16 +860,16 @@ deprecated: true
     </li>
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
         disabled
       >Disabled action</button>
     </li>
-    <li class="pf-v5-c-divider" role="separator"></li>
+    <li class="pf-v6-c-divider" role="separator"></li>
     <li role="none">
       <a
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         href="#"
       >Separated link</a>
@@ -882,56 +882,56 @@ deprecated: true
 ### Badge toggle
 
 ```html
-<div class="pf-v5-c-dropdown pf-m-expanded">
+<div class="pf-v6-c-dropdown pf-m-expanded">
   <button
-    class="pf-v5-c-dropdown__toggle pf-m-plain"
+    class="pf-v6-c-dropdown__toggle pf-m-plain"
     id="dropdown-badge-toggle-button"
     aria-expanded="true"
     type="button"
   >
-    <span class="pf-v5-c-badge pf-m-read">
+    <span class="pf-v6-c-badge pf-m-read">
       5
-      <span class="pf-v5-c-dropdown__toggle-icon">
+      <span class="pf-v6-c-dropdown__toggle-icon">
         <i class="fas fa-caret-down" aria-hidden="true"></i>
       </span>
     </span>
   </button>
   <ul
-    class="pf-v5-c-dropdown__menu"
+    class="pf-v6-c-dropdown__menu"
     aria-labelledby="dropdown-badge-toggle-button"
     role="menu"
   >
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
       >Edit</button>
     </li>
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
       >Deployment</button>
     </li>
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
       >Application</button>
     </li>
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
       >Count</button>
     </li>
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
       >Application 1</button>
@@ -944,26 +944,26 @@ deprecated: true
 ### Menu item icons
 
 ```html
-<div class="pf-v5-c-dropdown pf-m-expanded">
+<div class="pf-v6-c-dropdown pf-m-expanded">
   <button
-    class="pf-v5-c-dropdown__toggle"
+    class="pf-v6-c-dropdown__toggle"
     id="dropdown-menu-item-icons-button"
     aria-expanded="true"
     type="button"
   >
-    <span class="pf-v5-c-dropdown__toggle-text">Expanded dropdown</span>
-    <span class="pf-v5-c-dropdown__toggle-icon">
+    <span class="pf-v6-c-dropdown__toggle-text">Expanded dropdown</span>
+    <span class="pf-v6-c-dropdown__toggle-icon">
       <i class="fas fa-caret-down" aria-hidden="true"></i>
     </span>
   </button>
   <ul
-    class="pf-v5-c-dropdown__menu"
+    class="pf-v6-c-dropdown__menu"
     aria-labelledby="dropdown-menu-item-icons-button"
     role="menu"
   >
     <li role="none">
-      <a class="pf-v5-c-dropdown__menu-item pf-m-icon" role="menuitem" href="#">
-        <span class="pf-v5-c-dropdown__menu-item-icon">
+      <a class="pf-v6-c-dropdown__menu-item pf-m-icon" role="menuitem" href="#">
+        <span class="pf-v6-c-dropdown__menu-item-icon">
           <img src="/assets/images/pf-logo-small.svg" alt="PatternFly logo" />
         </span>
         Link
@@ -971,11 +971,11 @@ deprecated: true
     </li>
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item pf-m-icon"
+        class="pf-v6-c-dropdown__menu-item pf-m-icon"
         role="menuitem"
         type="button"
       >
-        <span class="pf-v5-c-dropdown__menu-item-icon">
+        <span class="pf-v6-c-dropdown__menu-item-icon">
           <i class="fas fa-cog" aria-hidden="true"></i>
         </span>
         Action
@@ -983,7 +983,7 @@ deprecated: true
     </li>
     <li role="none">
       <a
-        class="pf-v5-c-dropdown__menu-item pf-m-disabled"
+        class="pf-v6-c-dropdown__menu-item pf-m-disabled"
         role="menuitem"
         href="#"
         aria-disabled="true"
@@ -992,16 +992,16 @@ deprecated: true
     </li>
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
         disabled
       >Disabled action</button>
     </li>
-    <li class="pf-v5-c-divider" role="separator"></li>
+    <li class="pf-v6-c-divider" role="separator"></li>
     <li role="none">
       <a
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         href="#"
       >Separated link</a>
@@ -1014,15 +1014,15 @@ deprecated: true
 ### Split button (checkbox)
 
 ```html
-<div class="pf-v5-c-dropdown">
-  <div class="pf-v5-c-dropdown__toggle pf-m-disabled pf-m-split-button">
+<div class="pf-v6-c-dropdown">
+  <div class="pf-v6-c-dropdown__toggle pf-m-disabled pf-m-split-button">
     <label
-      class="pf-v5-c-dropdown__toggle-check"
+      class="pf-v6-c-dropdown__toggle-check"
       for="dropdown-split-button-disabled-toggle-check"
     >
-      <div class="pf-v5-c-check pf-m-standalone">
+      <div class="pf-v6-c-check pf-m-standalone">
         <input
-          class="pf-v5-c-check__input"
+          class="pf-v6-c-check__input"
           type="checkbox"
           disabled
           id="dropdown-split-button-disabled-toggle-check"
@@ -1032,7 +1032,7 @@ deprecated: true
     </label>
 
     <button
-      class="pf-v5-c-dropdown__toggle-button"
+      class="pf-v6-c-dropdown__toggle-button"
       type="button"
       aria-expanded="false"
       id="dropdown-split-button-disabled-toggle-button"
@@ -1042,17 +1042,17 @@ deprecated: true
       <i class="fas fa-caret-down" aria-hidden="true"></i>
     </button>
   </div>
-  <ul class="pf-v5-c-dropdown__menu" hidden role="menu">
+  <ul class="pf-v6-c-dropdown__menu" hidden role="menu">
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
       >Actions</button>
     </li>
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
         disabled
@@ -1060,22 +1060,22 @@ deprecated: true
     </li>
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
       >Other action</button>
     </li>
   </ul>
 </div>
-<div class="pf-v5-c-dropdown">
-  <div class="pf-v5-c-dropdown__toggle pf-m-split-button">
+<div class="pf-v6-c-dropdown">
+  <div class="pf-v6-c-dropdown__toggle pf-m-split-button">
     <label
-      class="pf-v5-c-dropdown__toggle-check"
+      class="pf-v6-c-dropdown__toggle-check"
       for="dropdown-split-button-toggle-check"
     >
-      <div class="pf-v5-c-check pf-m-standalone">
+      <div class="pf-v6-c-check pf-m-standalone">
         <input
-          class="pf-v5-c-check__input"
+          class="pf-v6-c-check__input"
           type="checkbox"
           id="dropdown-split-button-toggle-check"
           aria-label="Select all"
@@ -1084,7 +1084,7 @@ deprecated: true
     </label>
 
     <button
-      class="pf-v5-c-dropdown__toggle-button"
+      class="pf-v6-c-dropdown__toggle-button"
       type="button"
       aria-expanded="false"
       id="dropdown-split-button-toggle-button"
@@ -1093,17 +1093,17 @@ deprecated: true
       <i class="fas fa-caret-down" aria-hidden="true"></i>
     </button>
   </div>
-  <ul class="pf-v5-c-dropdown__menu" hidden role="menu">
+  <ul class="pf-v6-c-dropdown__menu" hidden role="menu">
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
       >Actions</button>
     </li>
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
         disabled
@@ -1111,22 +1111,22 @@ deprecated: true
     </li>
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
       >Other action</button>
     </li>
   </ul>
 </div>
-<div class="pf-v5-c-dropdown pf-m-expanded">
-  <div class="pf-v5-c-dropdown__toggle pf-m-split-button">
+<div class="pf-v6-c-dropdown pf-m-expanded">
+  <div class="pf-v6-c-dropdown__toggle pf-m-split-button">
     <label
-      class="pf-v5-c-dropdown__toggle-check"
+      class="pf-v6-c-dropdown__toggle-check"
       for="dropdown-split-button-expanded-toggle-check"
     >
-      <div class="pf-v5-c-check pf-m-standalone">
+      <div class="pf-v6-c-check pf-m-standalone">
         <input
-          class="pf-v5-c-check__input"
+          class="pf-v6-c-check__input"
           type="checkbox"
           id="dropdown-split-button-expanded-toggle-check"
           aria-label="Select all"
@@ -1135,7 +1135,7 @@ deprecated: true
     </label>
 
     <button
-      class="pf-v5-c-dropdown__toggle-button"
+      class="pf-v6-c-dropdown__toggle-button"
       type="button"
       aria-expanded="true"
       id="dropdown-split-button-expanded-toggle-button"
@@ -1144,17 +1144,17 @@ deprecated: true
       <i class="fas fa-caret-down" aria-hidden="true"></i>
     </button>
   </div>
-  <ul class="pf-v5-c-dropdown__menu" role="menu">
+  <ul class="pf-v6-c-dropdown__menu" role="menu">
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
       >Actions</button>
     </li>
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
         disabled
@@ -1162,7 +1162,7 @@ deprecated: true
     </li>
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
       >Other action</button>
@@ -1175,15 +1175,15 @@ deprecated: true
 ### Split button (checkbox with toggle text)
 
 ```html
-<div class="pf-v5-c-dropdown">
-  <div class="pf-v5-c-dropdown__toggle pf-m-split-button">
+<div class="pf-v6-c-dropdown">
+  <div class="pf-v6-c-dropdown__toggle pf-m-split-button">
     <label
-      class="pf-v5-c-dropdown__toggle-check"
+      class="pf-v6-c-dropdown__toggle-check"
       for="dropdown-split-button-text-toggle-check"
     >
-      <div class="pf-v5-c-check pf-m-standalone">
+      <div class="pf-v6-c-check pf-m-standalone">
         <input
-          class="pf-v5-c-check__input"
+          class="pf-v6-c-check__input"
           type="checkbox"
           checked
           id="dropdown-split-button-text-toggle-check"
@@ -1192,14 +1192,14 @@ deprecated: true
         />
       </div>
       <span
-        class="pf-v5-c-dropdown__toggle-text"
+        class="pf-v6-c-dropdown__toggle-text"
         aria-hidden="true"
         id="dropdown-split-button-text-toggle-check-text"
       >10 selected</span>
     </label>
 
     <button
-      class="pf-v5-c-dropdown__toggle-button"
+      class="pf-v6-c-dropdown__toggle-button"
       type="button"
       aria-expanded="false"
       id="dropdown-split-button-text-toggle-button"
@@ -1208,24 +1208,24 @@ deprecated: true
       <i class="fas fa-caret-down" aria-hidden="true"></i>
     </button>
   </div>
-  <ul class="pf-v5-c-dropdown__menu" hidden role="menu">
+  <ul class="pf-v6-c-dropdown__menu" hidden role="menu">
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
       >Select all</button>
     </li>
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
       >Select none</button>
     </li>
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
       >Other action</button>
@@ -1238,24 +1238,24 @@ deprecated: true
 ### Split button (progress checkbox)
 
 ```html
-<div class="pf-v5-c-dropdown">
-  <div class="pf-v5-c-dropdown__toggle pf-m-split-button">
+<div class="pf-v6-c-dropdown">
+  <div class="pf-v6-c-dropdown__toggle pf-m-split-button">
     <label
-      class="pf-v5-c-dropdown__toggle-check"
+      class="pf-v6-c-dropdown__toggle-check"
       for="dropdown-split-button-progress-toggle-check"
     >
-      <div class="pf-v5-c-check pf-m-standalone">
+      <div class="pf-v6-c-check pf-m-standalone">
         <input
-          class="pf-v5-c-check__input"
+          class="pf-v6-c-check__input"
           type="checkbox"
           id="dropdown-split-button-progress-toggle-check"
           aria-label="Select all"
         />
       </div>
-      <span class="pf-v5-c-dropdown__toggle-progress">
-        <svg class="pf-v5-c-spinner" role="progressbar" viewBox="0 0 100 100">
+      <span class="pf-v6-c-dropdown__toggle-progress">
+        <svg class="pf-v6-c-spinner" role="progressbar" viewBox="0 0 100 100">
           <circle
-            class="pf-v5-c-spinner__path"
+            class="pf-v6-c-spinner__path"
             cx="50"
             cy="50"
             r="45"
@@ -1266,7 +1266,7 @@ deprecated: true
     </label>
 
     <button
-      class="pf-v5-c-dropdown__toggle-button"
+      class="pf-v6-c-dropdown__toggle-button"
       type="button"
       aria-expanded="false"
       id="dropdown-split-button-progress-toggle-button"
@@ -1275,17 +1275,17 @@ deprecated: true
       <i class="fas fa-caret-down" aria-hidden="true"></i>
     </button>
   </div>
-  <ul class="pf-v5-c-dropdown__menu" hidden role="menu">
+  <ul class="pf-v6-c-dropdown__menu" hidden role="menu">
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
       >Actions</button>
     </li>
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
         disabled
@@ -1293,32 +1293,32 @@ deprecated: true
     </li>
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
       >Other action</button>
     </li>
   </ul>
 </div>
-<div class="pf-v5-c-dropdown">
-  <div class="pf-v5-c-dropdown__toggle pf-m-split-button">
+<div class="pf-v6-c-dropdown">
+  <div class="pf-v6-c-dropdown__toggle pf-m-split-button">
     <label
-      class="pf-v5-c-dropdown__toggle-check pf-m-in-progress"
+      class="pf-v6-c-dropdown__toggle-check pf-m-in-progress"
       for="dropdown-split-button-in-progress-toggle-check"
     >
-      <div class="pf-v5-c-check pf-m-standalone">
+      <div class="pf-v6-c-check pf-m-standalone">
         <input
-          class="pf-v5-c-check__input"
+          class="pf-v6-c-check__input"
           type="checkbox"
           disabled
           id="dropdown-split-button-in-progress-toggle-check"
           aria-label="Select all"
         />
       </div>
-      <span class="pf-v5-c-dropdown__toggle-progress">
-        <svg class="pf-v5-c-spinner" role="progressbar" viewBox="0 0 100 100">
+      <span class="pf-v6-c-dropdown__toggle-progress">
+        <svg class="pf-v6-c-spinner" role="progressbar" viewBox="0 0 100 100">
           <circle
-            class="pf-v5-c-spinner__path"
+            class="pf-v6-c-spinner__path"
             cx="50"
             cy="50"
             r="45"
@@ -1329,7 +1329,7 @@ deprecated: true
     </label>
 
     <button
-      class="pf-v5-c-dropdown__toggle-button"
+      class="pf-v6-c-dropdown__toggle-button"
       type="button"
       aria-expanded="false"
       id="dropdown-split-button-in-progress-toggle-button"
@@ -1338,17 +1338,17 @@ deprecated: true
       <i class="fas fa-caret-down" aria-hidden="true"></i>
     </button>
   </div>
-  <ul class="pf-v5-c-dropdown__menu" hidden role="menu">
+  <ul class="pf-v6-c-dropdown__menu" hidden role="menu">
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
       >Actions</button>
     </li>
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
         disabled
@@ -1356,22 +1356,22 @@ deprecated: true
     </li>
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
       >Other action</button>
     </li>
   </ul>
 </div>
-<div class="pf-v5-c-dropdown">
-  <div class="pf-v5-c-dropdown__toggle pf-m-split-button">
+<div class="pf-v6-c-dropdown">
+  <div class="pf-v6-c-dropdown__toggle pf-m-split-button">
     <label
-      class="pf-v5-c-dropdown__toggle-check"
+      class="pf-v6-c-dropdown__toggle-check"
       for="dropdown-split-button-progress-text-toggle-check"
     >
-      <div class="pf-v5-c-check pf-m-standalone">
+      <div class="pf-v6-c-check pf-m-standalone">
         <input
-          class="pf-v5-c-check__input"
+          class="pf-v6-c-check__input"
           type="checkbox"
           checked
           id="dropdown-split-button-progress-text-toggle-check"
@@ -1379,10 +1379,10 @@ deprecated: true
           aria-labelledby="dropdown-split-button-progress-text-toggle-check dropdown-split-button-progress-text-toggle-check-text"
         />
       </div>
-      <span class="pf-v5-c-dropdown__toggle-progress">
-        <svg class="pf-v5-c-spinner" role="progressbar" viewBox="0 0 100 100">
+      <span class="pf-v6-c-dropdown__toggle-progress">
+        <svg class="pf-v6-c-spinner" role="progressbar" viewBox="0 0 100 100">
           <circle
-            class="pf-v5-c-spinner__path"
+            class="pf-v6-c-spinner__path"
             cx="50"
             cy="50"
             r="45"
@@ -1391,14 +1391,14 @@ deprecated: true
         </svg>
       </span>
       <span
-        class="pf-v5-c-dropdown__toggle-text"
+        class="pf-v6-c-dropdown__toggle-text"
         aria-hidden="true"
         id="dropdown-split-button-progress-text-toggle-check-text"
       >10 selected</span>
     </label>
 
     <button
-      class="pf-v5-c-dropdown__toggle-button"
+      class="pf-v6-c-dropdown__toggle-button"
       type="button"
       aria-expanded="false"
       id="dropdown-split-button-progress-text-toggle-button"
@@ -1407,39 +1407,39 @@ deprecated: true
       <i class="fas fa-caret-down" aria-hidden="true"></i>
     </button>
   </div>
-  <ul class="pf-v5-c-dropdown__menu" hidden role="menu">
+  <ul class="pf-v6-c-dropdown__menu" hidden role="menu">
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
       >Select all</button>
     </li>
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
       >Select none</button>
     </li>
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
       >Other action</button>
     </li>
   </ul>
 </div>
-<div class="pf-v5-c-dropdown">
-  <div class="pf-v5-c-dropdown__toggle pf-m-split-button">
+<div class="pf-v6-c-dropdown">
+  <div class="pf-v6-c-dropdown__toggle pf-m-split-button">
     <label
-      class="pf-v5-c-dropdown__toggle-check pf-m-in-progress"
+      class="pf-v6-c-dropdown__toggle-check pf-m-in-progress"
       for="dropdown-split-button-in-progress-text-toggle-check"
     >
-      <div class="pf-v5-c-check pf-m-standalone">
+      <div class="pf-v6-c-check pf-m-standalone">
         <input
-          class="pf-v5-c-check__input"
+          class="pf-v6-c-check__input"
           type="checkbox"
           checked
           disabled
@@ -1448,10 +1448,10 @@ deprecated: true
           aria-labelledby="dropdown-split-button-in-progress-text-toggle-check dropdown-split-button-in-progress-text-toggle-check-text"
         />
       </div>
-      <span class="pf-v5-c-dropdown__toggle-progress">
-        <svg class="pf-v5-c-spinner" role="progressbar" viewBox="0 0 100 100">
+      <span class="pf-v6-c-dropdown__toggle-progress">
+        <svg class="pf-v6-c-spinner" role="progressbar" viewBox="0 0 100 100">
           <circle
-            class="pf-v5-c-spinner__path"
+            class="pf-v6-c-spinner__path"
             cx="50"
             cy="50"
             r="45"
@@ -1460,14 +1460,14 @@ deprecated: true
         </svg>
       </span>
       <span
-        class="pf-v5-c-dropdown__toggle-text"
+        class="pf-v6-c-dropdown__toggle-text"
         aria-hidden="true"
         id="dropdown-split-button-in-progress-text-toggle-check-text"
       >10 selected</span>
     </label>
 
     <button
-      class="pf-v5-c-dropdown__toggle-button"
+      class="pf-v6-c-dropdown__toggle-button"
       type="button"
       aria-expanded="false"
       id="dropdown-split-button-in-progress-text-toggle-button"
@@ -1476,24 +1476,24 @@ deprecated: true
       <i class="fas fa-caret-down" aria-hidden="true"></i>
     </button>
   </div>
-  <ul class="pf-v5-c-dropdown__menu" hidden role="menu">
+  <ul class="pf-v6-c-dropdown__menu" hidden role="menu">
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
       >Select all</button>
     </li>
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
       >Select none</button>
     </li>
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
       >Other action</button>
@@ -1506,16 +1506,16 @@ deprecated: true
 ### Split button (action)
 
 ```html
-<div class="pf-v5-c-dropdown">
-  <div class="pf-v5-c-dropdown__toggle pf-m-split-button pf-m-action">
+<div class="pf-v6-c-dropdown">
+  <div class="pf-v6-c-dropdown__toggle pf-m-split-button pf-m-action">
     <button
-      class="pf-v5-c-dropdown__toggle-button"
+      class="pf-v6-c-dropdown__toggle-button"
       type="button"
       aria-label="Dropdown toggle"
     >Action</button>
 
     <button
-      class="pf-v5-c-dropdown__toggle-button"
+      class="pf-v6-c-dropdown__toggle-button"
       type="button"
       aria-expanded="false"
       id="dropdown-split-button-action-toggle-button"
@@ -1524,17 +1524,17 @@ deprecated: true
       <i class="fas fa-caret-down" aria-hidden="true"></i>
     </button>
   </div>
-  <ul class="pf-v5-c-dropdown__menu" hidden role="menu">
+  <ul class="pf-v6-c-dropdown__menu" hidden role="menu">
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
       >Actions</button>
     </li>
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
         disabled
@@ -1542,23 +1542,23 @@ deprecated: true
     </li>
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
       >Other action</button>
     </li>
   </ul>
 </div>
-<div class="pf-v5-c-dropdown pf-m-expanded">
-  <div class="pf-v5-c-dropdown__toggle pf-m-split-button pf-m-action">
+<div class="pf-v6-c-dropdown pf-m-expanded">
+  <div class="pf-v6-c-dropdown__toggle pf-m-split-button pf-m-action">
     <button
-      class="pf-v5-c-dropdown__toggle-button"
+      class="pf-v6-c-dropdown__toggle-button"
       type="button"
       aria-label="Dropdown toggle"
     >Action</button>
 
     <button
-      class="pf-v5-c-dropdown__toggle-button"
+      class="pf-v6-c-dropdown__toggle-button"
       type="button"
       aria-expanded="true"
       id="dropdown-split-button-action-expanded-toggle-button"
@@ -1567,17 +1567,17 @@ deprecated: true
       <i class="fas fa-caret-down" aria-hidden="true"></i>
     </button>
   </div>
-  <ul class="pf-v5-c-dropdown__menu" role="menu">
+  <ul class="pf-v6-c-dropdown__menu" role="menu">
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
       >Actions</button>
     </li>
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
         disabled
@@ -1585,17 +1585,17 @@ deprecated: true
     </li>
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
       >Other action</button>
     </li>
   </ul>
 </div>
-<div class="pf-v5-c-dropdown">
-  <div class="pf-v5-c-dropdown__toggle pf-m-split-button pf-m-action">
+<div class="pf-v6-c-dropdown">
+  <div class="pf-v6-c-dropdown__toggle pf-m-split-button pf-m-action">
     <button
-      class="pf-v5-c-dropdown__toggle-button"
+      class="pf-v6-c-dropdown__toggle-button"
       type="button"
       aria-label="Settings"
     >
@@ -1603,7 +1603,7 @@ deprecated: true
     </button>
 
     <button
-      class="pf-v5-c-dropdown__toggle-button"
+      class="pf-v6-c-dropdown__toggle-button"
       type="button"
       aria-expanded="false"
       id="dropdown-split-button-action-icon-toggle-button"
@@ -1612,17 +1612,17 @@ deprecated: true
       <i class="fas fa-caret-down" aria-hidden="true"></i>
     </button>
   </div>
-  <ul class="pf-v5-c-dropdown__menu" hidden role="menu">
+  <ul class="pf-v6-c-dropdown__menu" hidden role="menu">
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
       >Actions</button>
     </li>
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
         disabled
@@ -1630,17 +1630,17 @@ deprecated: true
     </li>
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
       >Other action</button>
     </li>
   </ul>
 </div>
-<div class="pf-v5-c-dropdown pf-m-expanded">
-  <div class="pf-v5-c-dropdown__toggle pf-m-split-button pf-m-action">
+<div class="pf-v6-c-dropdown pf-m-expanded">
+  <div class="pf-v6-c-dropdown__toggle pf-m-split-button pf-m-action">
     <button
-      class="pf-v5-c-dropdown__toggle-button"
+      class="pf-v6-c-dropdown__toggle-button"
       type="button"
       aria-label="Settings"
     >
@@ -1648,7 +1648,7 @@ deprecated: true
     </button>
 
     <button
-      class="pf-v5-c-dropdown__toggle-button"
+      class="pf-v6-c-dropdown__toggle-button"
       type="button"
       aria-expanded="true"
       id="dropdown-split-button-action-icon-expanded-toggle-button"
@@ -1657,14 +1657,14 @@ deprecated: true
       <i class="fas fa-caret-down" aria-hidden="true"></i>
     </button>
   </div>
-  <ul class="pf-v5-c-dropdown__menu" role="menu">
+  <ul class="pf-v6-c-dropdown__menu" role="menu">
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item pf-m-icon"
+        class="pf-v6-c-dropdown__menu-item pf-m-icon"
         role="menuitem"
         type="button"
       >
-        <span class="pf-v5-c-dropdown__menu-item-icon">
+        <span class="pf-v6-c-dropdown__menu-item-icon">
           <i class="fas fa-cog" aria-hidden="true"></i>
         </span>
         Actions
@@ -1672,12 +1672,12 @@ deprecated: true
     </li>
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item pf-m-icon"
+        class="pf-v6-c-dropdown__menu-item pf-m-icon"
         role="menuitem"
         type="button"
         disabled
       >
-        <span class="pf-v5-c-dropdown__menu-item-icon">
+        <span class="pf-v6-c-dropdown__menu-item-icon">
           <i class="fas fa-bell" aria-hidden="true"></i>
         </span>
         Disabled action
@@ -1685,11 +1685,11 @@ deprecated: true
     </li>
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item pf-m-icon"
+        class="pf-v6-c-dropdown__menu-item pf-m-icon"
         role="menuitem"
         type="button"
       >
-        <span class="pf-v5-c-dropdown__menu-item-icon">
+        <span class="pf-v6-c-dropdown__menu-item-icon">
           <i class="fas fa-cubes" aria-hidden="true"></i>
         </span>
         Other action
@@ -1703,18 +1703,18 @@ deprecated: true
 ### Split button, primary (action)
 
 ```html
-<div class="pf-v5-c-dropdown">
+<div class="pf-v6-c-dropdown">
   <div
-    class="pf-v5-c-dropdown__toggle pf-m-primary pf-m-split-button pf-m-action"
+    class="pf-v6-c-dropdown__toggle pf-m-primary pf-m-split-button pf-m-action"
   >
     <button
-      class="pf-v5-c-dropdown__toggle-button"
+      class="pf-v6-c-dropdown__toggle-button"
       type="button"
       aria-label="Dropdown toggle"
     >Action</button>
 
     <button
-      class="pf-v5-c-dropdown__toggle-button"
+      class="pf-v6-c-dropdown__toggle-button"
       type="button"
       aria-expanded="false"
       id="dropdown-split-button-action-primary-toggle-button"
@@ -1723,17 +1723,17 @@ deprecated: true
       <i class="fas fa-caret-down" aria-hidden="true"></i>
     </button>
   </div>
-  <ul class="pf-v5-c-dropdown__menu" hidden role="menu">
+  <ul class="pf-v6-c-dropdown__menu" hidden role="menu">
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
       >Actions</button>
     </li>
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
         disabled
@@ -1741,25 +1741,25 @@ deprecated: true
     </li>
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
       >Other action</button>
     </li>
   </ul>
 </div>
-<div class="pf-v5-c-dropdown pf-m-expanded">
+<div class="pf-v6-c-dropdown pf-m-expanded">
   <div
-    class="pf-v5-c-dropdown__toggle pf-m-primary pf-m-split-button pf-m-action"
+    class="pf-v6-c-dropdown__toggle pf-m-primary pf-m-split-button pf-m-action"
   >
     <button
-      class="pf-v5-c-dropdown__toggle-button"
+      class="pf-v6-c-dropdown__toggle-button"
       type="button"
       aria-label="Dropdown toggle"
     >Action</button>
 
     <button
-      class="pf-v5-c-dropdown__toggle-button"
+      class="pf-v6-c-dropdown__toggle-button"
       type="button"
       aria-expanded="true"
       id="dropdown-split-button-action-primary-expanded-toggle-button"
@@ -1768,17 +1768,17 @@ deprecated: true
       <i class="fas fa-caret-down" aria-hidden="true"></i>
     </button>
   </div>
-  <ul class="pf-v5-c-dropdown__menu" role="menu">
+  <ul class="pf-v6-c-dropdown__menu" role="menu">
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
       >Actions</button>
     </li>
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
         disabled
@@ -1786,19 +1786,19 @@ deprecated: true
     </li>
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
       >Other action</button>
     </li>
   </ul>
 </div>
-<div class="pf-v5-c-dropdown">
+<div class="pf-v6-c-dropdown">
   <div
-    class="pf-v5-c-dropdown__toggle pf-m-primary pf-m-split-button pf-m-action"
+    class="pf-v6-c-dropdown__toggle pf-m-primary pf-m-split-button pf-m-action"
   >
     <button
-      class="pf-v5-c-dropdown__toggle-button"
+      class="pf-v6-c-dropdown__toggle-button"
       type="button"
       aria-label="Settings"
     >
@@ -1806,7 +1806,7 @@ deprecated: true
     </button>
 
     <button
-      class="pf-v5-c-dropdown__toggle-button"
+      class="pf-v6-c-dropdown__toggle-button"
       type="button"
       aria-expanded="false"
       id="dropdown-split-button-action-primary-icon-toggle-button"
@@ -1815,17 +1815,17 @@ deprecated: true
       <i class="fas fa-caret-down" aria-hidden="true"></i>
     </button>
   </div>
-  <ul class="pf-v5-c-dropdown__menu" hidden role="menu">
+  <ul class="pf-v6-c-dropdown__menu" hidden role="menu">
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
       >Actions</button>
     </li>
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
         disabled
@@ -1833,19 +1833,19 @@ deprecated: true
     </li>
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
       >Other action</button>
     </li>
   </ul>
 </div>
-<div class="pf-v5-c-dropdown pf-m-expanded">
+<div class="pf-v6-c-dropdown pf-m-expanded">
   <div
-    class="pf-v5-c-dropdown__toggle pf-m-primary pf-m-split-button pf-m-action"
+    class="pf-v6-c-dropdown__toggle pf-m-primary pf-m-split-button pf-m-action"
   >
     <button
-      class="pf-v5-c-dropdown__toggle-button"
+      class="pf-v6-c-dropdown__toggle-button"
       type="button"
       aria-label="Settings"
     >
@@ -1853,7 +1853,7 @@ deprecated: true
     </button>
 
     <button
-      class="pf-v5-c-dropdown__toggle-button"
+      class="pf-v6-c-dropdown__toggle-button"
       type="button"
       aria-expanded="true"
       id="dropdown-split-button-action-primary-icon-expanded-toggle-button"
@@ -1862,14 +1862,14 @@ deprecated: true
       <i class="fas fa-caret-down" aria-hidden="true"></i>
     </button>
   </div>
-  <ul class="pf-v5-c-dropdown__menu" role="menu">
+  <ul class="pf-v6-c-dropdown__menu" role="menu">
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item pf-m-icon"
+        class="pf-v6-c-dropdown__menu-item pf-m-icon"
         role="menuitem"
         type="button"
       >
-        <span class="pf-v5-c-dropdown__menu-item-icon">
+        <span class="pf-v6-c-dropdown__menu-item-icon">
           <i class="fas fa-cog" aria-hidden="true"></i>
         </span>
         Actions
@@ -1877,12 +1877,12 @@ deprecated: true
     </li>
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item pf-m-icon"
+        class="pf-v6-c-dropdown__menu-item pf-m-icon"
         role="menuitem"
         type="button"
         disabled
       >
-        <span class="pf-v5-c-dropdown__menu-item-icon">
+        <span class="pf-v6-c-dropdown__menu-item-icon">
           <i class="fas fa-bell" aria-hidden="true"></i>
         </span>
         Disabled action
@@ -1890,11 +1890,11 @@ deprecated: true
     </li>
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item pf-m-icon"
+        class="pf-v6-c-dropdown__menu-item pf-m-icon"
         role="menuitem"
         type="button"
       >
-        <span class="pf-v5-c-dropdown__menu-item-icon">
+        <span class="pf-v6-c-dropdown__menu-item-icon">
           <i class="fas fa-cubes" aria-hidden="true"></i>
         </span>
         Other action
@@ -1908,18 +1908,18 @@ deprecated: true
 ### Split button, secondary (action)
 
 ```html
-<div class="pf-v5-c-dropdown">
+<div class="pf-v6-c-dropdown">
   <div
-    class="pf-v5-c-dropdown__toggle pf-m-secondary pf-m-split-button pf-m-action"
+    class="pf-v6-c-dropdown__toggle pf-m-secondary pf-m-split-button pf-m-action"
   >
     <button
-      class="pf-v5-c-dropdown__toggle-button"
+      class="pf-v6-c-dropdown__toggle-button"
       type="button"
       aria-label="Dropdown toggle"
     >Action</button>
 
     <button
-      class="pf-v5-c-dropdown__toggle-button"
+      class="pf-v6-c-dropdown__toggle-button"
       type="button"
       aria-expanded="false"
       id="dropdown-split-button-action-secondary-toggle-button"
@@ -1928,17 +1928,17 @@ deprecated: true
       <i class="fas fa-caret-down" aria-hidden="true"></i>
     </button>
   </div>
-  <ul class="pf-v5-c-dropdown__menu" hidden role="menu">
+  <ul class="pf-v6-c-dropdown__menu" hidden role="menu">
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
       >Actions</button>
     </li>
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
         disabled
@@ -1946,25 +1946,25 @@ deprecated: true
     </li>
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
       >Other action</button>
     </li>
   </ul>
 </div>
-<div class="pf-v5-c-dropdown pf-m-expanded">
+<div class="pf-v6-c-dropdown pf-m-expanded">
   <div
-    class="pf-v5-c-dropdown__toggle pf-m-secondary pf-m-split-button pf-m-action"
+    class="pf-v6-c-dropdown__toggle pf-m-secondary pf-m-split-button pf-m-action"
   >
     <button
-      class="pf-v5-c-dropdown__toggle-button"
+      class="pf-v6-c-dropdown__toggle-button"
       type="button"
       aria-label="Dropdown toggle"
     >Action</button>
 
     <button
-      class="pf-v5-c-dropdown__toggle-button"
+      class="pf-v6-c-dropdown__toggle-button"
       type="button"
       aria-expanded="true"
       id="dropdown-split-button-action-secondary-expanded-toggle-button"
@@ -1973,17 +1973,17 @@ deprecated: true
       <i class="fas fa-caret-down" aria-hidden="true"></i>
     </button>
   </div>
-  <ul class="pf-v5-c-dropdown__menu" role="menu">
+  <ul class="pf-v6-c-dropdown__menu" role="menu">
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
       >Actions</button>
     </li>
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
         disabled
@@ -1991,19 +1991,19 @@ deprecated: true
     </li>
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
       >Other action</button>
     </li>
   </ul>
 </div>
-<div class="pf-v5-c-dropdown">
+<div class="pf-v6-c-dropdown">
   <div
-    class="pf-v5-c-dropdown__toggle pf-m-secondary pf-m-split-button pf-m-action"
+    class="pf-v6-c-dropdown__toggle pf-m-secondary pf-m-split-button pf-m-action"
   >
     <button
-      class="pf-v5-c-dropdown__toggle-button"
+      class="pf-v6-c-dropdown__toggle-button"
       type="button"
       aria-label="Settings"
     >
@@ -2011,7 +2011,7 @@ deprecated: true
     </button>
 
     <button
-      class="pf-v5-c-dropdown__toggle-button"
+      class="pf-v6-c-dropdown__toggle-button"
       type="button"
       aria-expanded="false"
       id="dropdown-split-button-action-secondary-icon-toggle-button"
@@ -2020,17 +2020,17 @@ deprecated: true
       <i class="fas fa-caret-down" aria-hidden="true"></i>
     </button>
   </div>
-  <ul class="pf-v5-c-dropdown__menu" hidden role="menu">
+  <ul class="pf-v6-c-dropdown__menu" hidden role="menu">
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
       >Actions</button>
     </li>
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
         disabled
@@ -2038,19 +2038,19 @@ deprecated: true
     </li>
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
       >Other action</button>
     </li>
   </ul>
 </div>
-<div class="pf-v5-c-dropdown pf-m-expanded">
+<div class="pf-v6-c-dropdown pf-m-expanded">
   <div
-    class="pf-v5-c-dropdown__toggle pf-m-secondary pf-m-split-button pf-m-action"
+    class="pf-v6-c-dropdown__toggle pf-m-secondary pf-m-split-button pf-m-action"
   >
     <button
-      class="pf-v5-c-dropdown__toggle-button"
+      class="pf-v6-c-dropdown__toggle-button"
       type="button"
       aria-label="Settings"
     >
@@ -2058,7 +2058,7 @@ deprecated: true
     </button>
 
     <button
-      class="pf-v5-c-dropdown__toggle-button"
+      class="pf-v6-c-dropdown__toggle-button"
       type="button"
       aria-expanded="true"
       id="dropdown-split-button-action-secondary-icon-expanded-toggle-button"
@@ -2067,14 +2067,14 @@ deprecated: true
       <i class="fas fa-caret-down" aria-hidden="true"></i>
     </button>
   </div>
-  <ul class="pf-v5-c-dropdown__menu" role="menu">
+  <ul class="pf-v6-c-dropdown__menu" role="menu">
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item pf-m-icon"
+        class="pf-v6-c-dropdown__menu-item pf-m-icon"
         role="menuitem"
         type="button"
       >
-        <span class="pf-v5-c-dropdown__menu-item-icon">
+        <span class="pf-v6-c-dropdown__menu-item-icon">
           <i class="fas fa-cog" aria-hidden="true"></i>
         </span>
         Actions
@@ -2082,12 +2082,12 @@ deprecated: true
     </li>
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item pf-m-icon"
+        class="pf-v6-c-dropdown__menu-item pf-m-icon"
         role="menuitem"
         type="button"
         disabled
       >
-        <span class="pf-v5-c-dropdown__menu-item-icon">
+        <span class="pf-v6-c-dropdown__menu-item-icon">
           <i class="fas fa-bell" aria-hidden="true"></i>
         </span>
         Disabled action
@@ -2095,11 +2095,11 @@ deprecated: true
     </li>
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item pf-m-icon"
+        class="pf-v6-c-dropdown__menu-item pf-m-icon"
         role="menuitem"
         type="button"
       >
-        <span class="pf-v5-c-dropdown__menu-item-icon">
+        <span class="pf-v6-c-dropdown__menu-item-icon">
           <i class="fas fa-cubes" aria-hidden="true"></i>
         </span>
         Other action
@@ -2113,65 +2113,65 @@ deprecated: true
 ### With groups
 
 ```html
-<div class="pf-v5-c-dropdown pf-m-expanded">
+<div class="pf-v6-c-dropdown pf-m-expanded">
   <button
-    class="pf-v5-c-dropdown__toggle"
+    class="pf-v6-c-dropdown__toggle"
     id="dropdown-groups-button"
     aria-expanded="true"
     type="button"
   >
-    <span class="pf-v5-c-dropdown__toggle-text">Groups</span>
-    <span class="pf-v5-c-dropdown__toggle-icon">
+    <span class="pf-v6-c-dropdown__toggle-text">Groups</span>
+    <span class="pf-v6-c-dropdown__toggle-icon">
       <i class="fas fa-caret-down" aria-hidden="true"></i>
     </span>
   </button>
-  <div class="pf-v5-c-dropdown__menu" role="menu">
-    <section class="pf-v5-c-dropdown__group">
+  <div class="pf-v6-c-dropdown__menu" role="menu">
+    <section class="pf-v6-c-dropdown__group">
       <ul role="none">
         <li role="none">
-          <a class="pf-v5-c-dropdown__menu-item" role="menuitem" href="#">Link</a>
+          <a class="pf-v6-c-dropdown__menu-item" role="menuitem" href="#">Link</a>
         </li>
         <li role="none">
           <button
-            class="pf-v5-c-dropdown__menu-item"
+            class="pf-v6-c-dropdown__menu-item"
             role="menuitem"
             type="button"
           >Action</button>
         </li>
       </ul>
     </section>
-    <section class="pf-v5-c-dropdown__group">
-      <h1 class="pf-v5-c-dropdown__group-title">Group 2</h1>
+    <section class="pf-v6-c-dropdown__group">
+      <h1 class="pf-v6-c-dropdown__group-title">Group 2</h1>
       <ul role="none">
         <li role="none">
           <a
-            class="pf-v5-c-dropdown__menu-item"
+            class="pf-v6-c-dropdown__menu-item"
             role="menuitem"
             href="#"
           >Group 2 link</a>
         </li>
         <li role="none">
           <button
-            class="pf-v5-c-dropdown__menu-item"
+            class="pf-v6-c-dropdown__menu-item"
             role="menuitem"
             type="button"
           >Group 2 action</button>
         </li>
       </ul>
     </section>
-    <section class="pf-v5-c-dropdown__group">
-      <h1 class="pf-v5-c-dropdown__group-title">Group 3</h1>
+    <section class="pf-v6-c-dropdown__group">
+      <h1 class="pf-v6-c-dropdown__group-title">Group 3</h1>
       <ul role="none">
         <li role="none">
           <a
-            class="pf-v5-c-dropdown__menu-item"
+            class="pf-v6-c-dropdown__menu-item"
             role="menuitem"
             href="#"
           >Group 3 link</a>
         </li>
         <li role="none">
           <button
-            class="pf-v5-c-dropdown__menu-item"
+            class="pf-v6-c-dropdown__menu-item"
             role="menuitem"
             type="button"
           >Group 3 action</button>
@@ -2186,67 +2186,67 @@ deprecated: true
 ### With groups and dividers between groups
 
 ```html
-<div class="pf-v5-c-dropdown pf-m-expanded">
+<div class="pf-v6-c-dropdown pf-m-expanded">
   <button
-    class="pf-v5-c-dropdown__toggle"
+    class="pf-v6-c-dropdown__toggle"
     id="dropdown-groups-and-dividers-between-groups-button"
     aria-expanded="true"
     type="button"
   >
-    <span class="pf-v5-c-dropdown__toggle-text">Groups</span>
-    <span class="pf-v5-c-dropdown__toggle-icon">
+    <span class="pf-v6-c-dropdown__toggle-text">Groups</span>
+    <span class="pf-v6-c-dropdown__toggle-icon">
       <i class="fas fa-caret-down" aria-hidden="true"></i>
     </span>
   </button>
-  <div class="pf-v5-c-dropdown__menu" role="menu">
-    <section class="pf-v5-c-dropdown__group">
+  <div class="pf-v6-c-dropdown__menu" role="menu">
+    <section class="pf-v6-c-dropdown__group">
       <ul role="none">
         <li role="none">
-          <a class="pf-v5-c-dropdown__menu-item" role="menuitem" href="#">Link</a>
+          <a class="pf-v6-c-dropdown__menu-item" role="menuitem" href="#">Link</a>
         </li>
         <li role="none">
           <button
-            class="pf-v5-c-dropdown__menu-item"
+            class="pf-v6-c-dropdown__menu-item"
             role="menuitem"
             type="button"
           >Action</button>
         </li>
       </ul>
     </section>
-    <hr class="pf-v5-c-divider" />
-    <section class="pf-v5-c-dropdown__group">
-      <h1 class="pf-v5-c-dropdown__group-title">Group 2</h1>
+    <hr class="pf-v6-c-divider" />
+    <section class="pf-v6-c-dropdown__group">
+      <h1 class="pf-v6-c-dropdown__group-title">Group 2</h1>
       <ul role="none">
         <li role="none">
           <a
-            class="pf-v5-c-dropdown__menu-item"
+            class="pf-v6-c-dropdown__menu-item"
             role="menuitem"
             href="#"
           >Group 2 link</a>
         </li>
         <li role="none">
           <button
-            class="pf-v5-c-dropdown__menu-item"
+            class="pf-v6-c-dropdown__menu-item"
             role="menuitem"
             type="button"
           >Group 2 action</button>
         </li>
       </ul>
     </section>
-    <hr class="pf-v5-c-divider" />
-    <section class="pf-v5-c-dropdown__group">
-      <h1 class="pf-v5-c-dropdown__group-title">Group 3</h1>
+    <hr class="pf-v6-c-divider" />
+    <section class="pf-v6-c-dropdown__group">
+      <h1 class="pf-v6-c-dropdown__group-title">Group 3</h1>
       <ul role="none">
         <li role="none">
           <a
-            class="pf-v5-c-dropdown__menu-item"
+            class="pf-v6-c-dropdown__menu-item"
             role="menuitem"
             href="#"
           >Group 3 link</a>
         </li>
         <li role="none">
           <button
-            class="pf-v5-c-dropdown__menu-item"
+            class="pf-v6-c-dropdown__menu-item"
             role="menuitem"
             type="button"
           >Group 3 action</button>
@@ -2261,68 +2261,68 @@ deprecated: true
 ### With groups and dividers between items
 
 ```html
-<div class="pf-v5-c-dropdown pf-m-expanded">
+<div class="pf-v6-c-dropdown pf-m-expanded">
   <button
-    class="pf-v5-c-dropdown__toggle"
+    class="pf-v6-c-dropdown__toggle"
     id="dropdown-groups-and-dividers-between-items-button"
     aria-expanded="true"
     type="button"
   >
-    <span class="pf-v5-c-dropdown__toggle-text">Groups</span>
-    <span class="pf-v5-c-dropdown__toggle-icon">
+    <span class="pf-v6-c-dropdown__toggle-text">Groups</span>
+    <span class="pf-v6-c-dropdown__toggle-icon">
       <i class="fas fa-caret-down" aria-hidden="true"></i>
     </span>
   </button>
-  <div class="pf-v5-c-dropdown__menu" role="menu">
-    <section class="pf-v5-c-dropdown__group">
+  <div class="pf-v6-c-dropdown__menu" role="menu">
+    <section class="pf-v6-c-dropdown__group">
       <ul role="none">
         <li role="none">
-          <a class="pf-v5-c-dropdown__menu-item" role="menuitem" href="#">Link</a>
+          <a class="pf-v6-c-dropdown__menu-item" role="menuitem" href="#">Link</a>
         </li>
-        <li class="pf-v5-c-divider" role="separator"></li>
+        <li class="pf-v6-c-divider" role="separator"></li>
         <li role="none">
           <button
-            class="pf-v5-c-dropdown__menu-item"
+            class="pf-v6-c-dropdown__menu-item"
             role="menuitem"
             type="button"
           >Action</button>
         </li>
       </ul>
     </section>
-    <section class="pf-v5-c-dropdown__group">
-      <h1 class="pf-v5-c-dropdown__group-title">Group 2</h1>
+    <section class="pf-v6-c-dropdown__group">
+      <h1 class="pf-v6-c-dropdown__group-title">Group 2</h1>
       <ul role="none">
         <li role="none">
           <a
-            class="pf-v5-c-dropdown__menu-item"
+            class="pf-v6-c-dropdown__menu-item"
             role="menuitem"
             href="#"
           >Group 2 link</a>
         </li>
-        <li class="pf-v5-c-divider" role="separator"></li>
+        <li class="pf-v6-c-divider" role="separator"></li>
         <li role="none">
           <button
-            class="pf-v5-c-dropdown__menu-item"
+            class="pf-v6-c-dropdown__menu-item"
             role="menuitem"
             type="button"
           >Group 2 action</button>
         </li>
       </ul>
     </section>
-    <section class="pf-v5-c-dropdown__group">
-      <h1 class="pf-v5-c-dropdown__group-title">Group 3</h1>
+    <section class="pf-v6-c-dropdown__group">
+      <h1 class="pf-v6-c-dropdown__group-title">Group 3</h1>
       <ul role="none">
         <li role="none">
           <a
-            class="pf-v5-c-dropdown__menu-item"
+            class="pf-v6-c-dropdown__menu-item"
             role="menuitem"
             href="#"
           >Group 3 link</a>
         </li>
-        <li class="pf-v5-c-divider" role="separator"></li>
+        <li class="pf-v6-c-divider" role="separator"></li>
         <li role="none">
           <button
-            class="pf-v5-c-dropdown__menu-item"
+            class="pf-v6-c-dropdown__menu-item"
             role="menuitem"
             type="button"
           >Group 3 action</button>
@@ -2337,19 +2337,19 @@ deprecated: true
 ### Panel
 
 ```html
-<div class="pf-v5-c-dropdown pf-m-expanded">
+<div class="pf-v6-c-dropdown pf-m-expanded">
   <button
-    class="pf-v5-c-dropdown__toggle"
+    class="pf-v6-c-dropdown__toggle"
     id="dropdown-panel-button"
     aria-expanded="true"
     type="button"
   >
-    <span class="pf-v5-c-dropdown__toggle-text">Expanded dropdown</span>
-    <span class="pf-v5-c-dropdown__toggle-icon">
+    <span class="pf-v6-c-dropdown__toggle-text">Expanded dropdown</span>
+    <span class="pf-v6-c-dropdown__toggle-icon">
       <i class="fas fa-caret-down" aria-hidden="true"></i>
     </span>
   </button>
-  <div class="pf-v5-c-dropdown__menu">[Panel contents here]</div>
+  <div class="pf-v6-c-dropdown__menu">[Panel contents here]</div>
 </div>
 
 ```
@@ -2359,37 +2359,37 @@ The dropdown panel is provided for flexibility in allowing various content withi
 ### Primary toggle
 
 ```html
-<div class="pf-v5-c-dropdown">
+<div class="pf-v6-c-dropdown">
   <button
-    class="pf-v5-c-dropdown__toggle pf-m-primary"
+    class="pf-v6-c-dropdown__toggle pf-m-primary"
     id="dropdown-primary-toggle-button"
     aria-expanded="false"
     type="button"
   >
-    <span class="pf-v5-c-dropdown__toggle-text">Collapsed dropdown</span>
-    <span class="pf-v5-c-dropdown__toggle-icon">
+    <span class="pf-v6-c-dropdown__toggle-text">Collapsed dropdown</span>
+    <span class="pf-v6-c-dropdown__toggle-icon">
       <i class="fas fa-caret-down" aria-hidden="true"></i>
     </span>
   </button>
   <ul
-    class="pf-v5-c-dropdown__menu"
+    class="pf-v6-c-dropdown__menu"
     aria-labelledby="dropdown-primary-toggle-button"
     hidden
     role="menu"
   >
     <li role="none">
-      <a class="pf-v5-c-dropdown__menu-item" role="menuitem" href="#">Link</a>
+      <a class="pf-v6-c-dropdown__menu-item" role="menuitem" href="#">Link</a>
     </li>
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
       >Action</button>
     </li>
     <li role="none">
       <a
-        class="pf-v5-c-dropdown__menu-item pf-m-disabled"
+        class="pf-v6-c-dropdown__menu-item pf-m-disabled"
         role="menuitem"
         href="#"
         aria-disabled="true"
@@ -2398,52 +2398,52 @@ The dropdown panel is provided for flexibility in allowing various content withi
     </li>
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
         disabled
       >Disabled action</button>
     </li>
-    <li class="pf-v5-c-divider" role="separator"></li>
+    <li class="pf-v6-c-divider" role="separator"></li>
     <li role="none">
       <a
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         href="#"
       >Separated link</a>
     </li>
   </ul>
 </div>
-<div class="pf-v5-c-dropdown pf-m-expanded">
+<div class="pf-v6-c-dropdown pf-m-expanded">
   <button
-    class="pf-v5-c-dropdown__toggle pf-m-primary"
+    class="pf-v6-c-dropdown__toggle pf-m-primary"
     id="dropdown-primary-toggle-expanded-button"
     aria-expanded="true"
     type="button"
   >
-    <span class="pf-v5-c-dropdown__toggle-text">Expanded dropdown</span>
-    <span class="pf-v5-c-dropdown__toggle-icon">
+    <span class="pf-v6-c-dropdown__toggle-text">Expanded dropdown</span>
+    <span class="pf-v6-c-dropdown__toggle-icon">
       <i class="fas fa-caret-down" aria-hidden="true"></i>
     </span>
   </button>
   <ul
-    class="pf-v5-c-dropdown__menu"
+    class="pf-v6-c-dropdown__menu"
     aria-labelledby="dropdown-primary-toggle-expanded-button"
     role="menu"
   >
     <li role="none">
-      <a class="pf-v5-c-dropdown__menu-item" role="menuitem" href="#">Link</a>
+      <a class="pf-v6-c-dropdown__menu-item" role="menuitem" href="#">Link</a>
     </li>
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
       >Action</button>
     </li>
     <li role="none">
       <a
-        class="pf-v5-c-dropdown__menu-item pf-m-disabled"
+        class="pf-v6-c-dropdown__menu-item pf-m-disabled"
         role="menuitem"
         href="#"
         aria-disabled="true"
@@ -2452,54 +2452,54 @@ The dropdown panel is provided for flexibility in allowing various content withi
     </li>
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
         disabled
       >Disabled action</button>
     </li>
-    <li class="pf-v5-c-divider" role="separator"></li>
+    <li class="pf-v6-c-divider" role="separator"></li>
     <li role="none">
       <a
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         href="#"
       >Separated link</a>
     </li>
   </ul>
 </div>
-<div class="pf-v5-c-dropdown">
+<div class="pf-v6-c-dropdown">
   <button
-    class="pf-v5-c-dropdown__toggle pf-m-primary"
+    class="pf-v6-c-dropdown__toggle pf-m-primary"
     id="dropdown-primary-toggle-disabled-button"
     aria-expanded="false"
     type="button"
     disabled
   >
-    <span class="pf-v5-c-dropdown__toggle-text">Disabled</span>
-    <span class="pf-v5-c-dropdown__toggle-icon">
+    <span class="pf-v6-c-dropdown__toggle-text">Disabled</span>
+    <span class="pf-v6-c-dropdown__toggle-icon">
       <i class="fas fa-caret-down" aria-hidden="true"></i>
     </span>
   </button>
   <ul
-    class="pf-v5-c-dropdown__menu"
+    class="pf-v6-c-dropdown__menu"
     aria-labelledby="dropdown-primary-toggle-disabled-button"
     hidden
     role="menu"
   >
     <li role="none">
-      <a class="pf-v5-c-dropdown__menu-item" role="menuitem" href="#">Link</a>
+      <a class="pf-v6-c-dropdown__menu-item" role="menuitem" href="#">Link</a>
     </li>
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
       >Action</button>
     </li>
     <li role="none">
       <a
-        class="pf-v5-c-dropdown__menu-item pf-m-disabled"
+        class="pf-v6-c-dropdown__menu-item pf-m-disabled"
         role="menuitem"
         href="#"
         aria-disabled="true"
@@ -2508,16 +2508,16 @@ The dropdown panel is provided for flexibility in allowing various content withi
     </li>
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
         disabled
       >Disabled action</button>
     </li>
-    <li class="pf-v5-c-divider" role="separator"></li>
+    <li class="pf-v6-c-divider" role="separator"></li>
     <li role="none">
       <a
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         href="#"
       >Separated link</a>
@@ -2530,37 +2530,37 @@ The dropdown panel is provided for flexibility in allowing various content withi
 ### Secondary toggle
 
 ```html
-<div class="pf-v5-c-dropdown">
+<div class="pf-v6-c-dropdown">
   <button
-    class="pf-v5-c-dropdown__toggle pf-m-secondary"
+    class="pf-v6-c-dropdown__toggle pf-m-secondary"
     id="dropdown-secondary-toggle-button"
     aria-expanded="false"
     type="button"
   >
-    <span class="pf-v5-c-dropdown__toggle-text">Collapsed dropdown</span>
-    <span class="pf-v5-c-dropdown__toggle-icon">
+    <span class="pf-v6-c-dropdown__toggle-text">Collapsed dropdown</span>
+    <span class="pf-v6-c-dropdown__toggle-icon">
       <i class="fas fa-caret-down" aria-hidden="true"></i>
     </span>
   </button>
   <ul
-    class="pf-v5-c-dropdown__menu"
+    class="pf-v6-c-dropdown__menu"
     aria-labelledby="dropdown-secondary-toggle-button"
     hidden
     role="menu"
   >
     <li role="none">
-      <a class="pf-v5-c-dropdown__menu-item" role="menuitem" href="#">Link</a>
+      <a class="pf-v6-c-dropdown__menu-item" role="menuitem" href="#">Link</a>
     </li>
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
       >Action</button>
     </li>
     <li role="none">
       <a
-        class="pf-v5-c-dropdown__menu-item pf-m-disabled"
+        class="pf-v6-c-dropdown__menu-item pf-m-disabled"
         role="menuitem"
         href="#"
         aria-disabled="true"
@@ -2569,52 +2569,52 @@ The dropdown panel is provided for flexibility in allowing various content withi
     </li>
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
         disabled
       >Disabled action</button>
     </li>
-    <li class="pf-v5-c-divider" role="separator"></li>
+    <li class="pf-v6-c-divider" role="separator"></li>
     <li role="none">
       <a
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         href="#"
       >Separated link</a>
     </li>
   </ul>
 </div>
-<div class="pf-v5-c-dropdown pf-m-expanded">
+<div class="pf-v6-c-dropdown pf-m-expanded">
   <button
-    class="pf-v5-c-dropdown__toggle pf-m-secondary"
+    class="pf-v6-c-dropdown__toggle pf-m-secondary"
     id="dropdown-secondary-toggle-expanded-button"
     aria-expanded="true"
     type="button"
   >
-    <span class="pf-v5-c-dropdown__toggle-text">Expanded dropdown</span>
-    <span class="pf-v5-c-dropdown__toggle-icon">
+    <span class="pf-v6-c-dropdown__toggle-text">Expanded dropdown</span>
+    <span class="pf-v6-c-dropdown__toggle-icon">
       <i class="fas fa-caret-down" aria-hidden="true"></i>
     </span>
   </button>
   <ul
-    class="pf-v5-c-dropdown__menu"
+    class="pf-v6-c-dropdown__menu"
     aria-labelledby="dropdown-secondary-toggle-expanded-button"
     role="menu"
   >
     <li role="none">
-      <a class="pf-v5-c-dropdown__menu-item" role="menuitem" href="#">Link</a>
+      <a class="pf-v6-c-dropdown__menu-item" role="menuitem" href="#">Link</a>
     </li>
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
       >Action</button>
     </li>
     <li role="none">
       <a
-        class="pf-v5-c-dropdown__menu-item pf-m-disabled"
+        class="pf-v6-c-dropdown__menu-item pf-m-disabled"
         role="menuitem"
         href="#"
         aria-disabled="true"
@@ -2623,54 +2623,54 @@ The dropdown panel is provided for flexibility in allowing various content withi
     </li>
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
         disabled
       >Disabled action</button>
     </li>
-    <li class="pf-v5-c-divider" role="separator"></li>
+    <li class="pf-v6-c-divider" role="separator"></li>
     <li role="none">
       <a
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         href="#"
       >Separated link</a>
     </li>
   </ul>
 </div>
-<div class="pf-v5-c-dropdown">
+<div class="pf-v6-c-dropdown">
   <button
-    class="pf-v5-c-dropdown__toggle pf-m-secondary"
+    class="pf-v6-c-dropdown__toggle pf-m-secondary"
     id="dropdown-secondary-toggle-disabled-button"
     aria-expanded="false"
     type="button"
     disabled
   >
-    <span class="pf-v5-c-dropdown__toggle-text">Disabled</span>
-    <span class="pf-v5-c-dropdown__toggle-icon">
+    <span class="pf-v6-c-dropdown__toggle-text">Disabled</span>
+    <span class="pf-v6-c-dropdown__toggle-icon">
       <i class="fas fa-caret-down" aria-hidden="true"></i>
     </span>
   </button>
   <ul
-    class="pf-v5-c-dropdown__menu"
+    class="pf-v6-c-dropdown__menu"
     aria-labelledby="dropdown-secondary-toggle-disabled-button"
     hidden
     role="menu"
   >
     <li role="none">
-      <a class="pf-v5-c-dropdown__menu-item" role="menuitem" href="#">Link</a>
+      <a class="pf-v6-c-dropdown__menu-item" role="menuitem" href="#">Link</a>
     </li>
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
       >Action</button>
     </li>
     <li role="none">
       <a
-        class="pf-v5-c-dropdown__menu-item pf-m-disabled"
+        class="pf-v6-c-dropdown__menu-item pf-m-disabled"
         role="menuitem"
         href="#"
         aria-disabled="true"
@@ -2679,16 +2679,16 @@ The dropdown panel is provided for flexibility in allowing various content withi
     </li>
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         type="button"
         disabled
       >Disabled action</button>
     </li>
-    <li class="pf-v5-c-divider" role="separator"></li>
+    <li class="pf-v6-c-divider" role="separator"></li>
     <li role="none">
       <a
-        class="pf-v5-c-dropdown__menu-item"
+        class="pf-v6-c-dropdown__menu-item"
         role="menuitem"
         href="#"
       >Separated link</a>
@@ -2701,52 +2701,52 @@ The dropdown panel is provided for flexibility in allowing various content withi
 ### Dropdown with image and text
 
 ```html
-<div class="pf-v5-c-dropdown pf-m-expanded">
+<div class="pf-v6-c-dropdown pf-m-expanded">
   <button
-    class="pf-v5-c-dropdown__toggle"
+    class="pf-v6-c-dropdown__toggle"
     id="dropdown-with-image-and-text-example-button"
     aria-expanded="true"
     type="button"
   >
-    <span class="pf-v5-c-dropdown__toggle-image">
+    <span class="pf-v6-c-dropdown__toggle-image">
       <img
-        class="pf-v5-c-avatar"
+        class="pf-v6-c-avatar"
         alt="Avatar image"
         src="/assets/images/img_avatar-light.svg"
       />
     </span>
-    <span class="pf-v5-c-dropdown__toggle-text">Ned Username</span>
-    <span class="pf-v5-c-dropdown__toggle-icon">
+    <span class="pf-v6-c-dropdown__toggle-text">Ned Username</span>
+    <span class="pf-v6-c-dropdown__toggle-icon">
       <i class="fas fa-caret-down" aria-hidden="true"></i>
     </span>
   </button>
-  <div class="pf-v5-c-dropdown__menu" role="menu">
-    <section class="pf-v5-c-dropdown__group">
-      <div class="pf-v5-c-dropdown__menu-item pf-m-text" role="menuitem">Text</div>
+  <div class="pf-v6-c-dropdown__menu" role="menu">
+    <section class="pf-v6-c-dropdown__group">
+      <div class="pf-v6-c-dropdown__menu-item pf-m-text" role="menuitem">Text</div>
       <div
-        class="pf-v5-c-dropdown__menu-item pf-m-text"
+        class="pf-v6-c-dropdown__menu-item pf-m-text"
         role="menuitem"
       >More text</div>
     </section>
-    <hr class="pf-v5-c-divider" />
-    <section class="pf-v5-c-dropdown__group">
+    <hr class="pf-v6-c-divider" />
+    <section class="pf-v6-c-dropdown__group">
       <ul role="none">
         <li role="none">
           <a
-            class="pf-v5-c-dropdown__menu-item"
+            class="pf-v6-c-dropdown__menu-item"
             role="menuitem"
             href="#"
           >My profile</a>
         </li>
         <li role="none">
           <a
-            class="pf-v5-c-dropdown__menu-item"
+            class="pf-v6-c-dropdown__menu-item"
             role="menuitem"
             href="#"
           >User management</a>
         </li>
         <li role="none">
-          <a class="pf-v5-c-dropdown__menu-item" role="menuitem" href="#">Logout</a>
+          <a class="pf-v6-c-dropdown__menu-item" role="menuitem" href="#">Logout</a>
         </li>
       </ul>
     </section>
@@ -2758,97 +2758,97 @@ The dropdown panel is provided for flexibility in allowing various content withi
 ### Dropdown with description
 
 ```html
-<div class="pf-v5-c-dropdown pf-m-expanded">
+<div class="pf-v6-c-dropdown pf-m-expanded">
   <button
-    class="pf-v5-c-dropdown__toggle"
+    class="pf-v6-c-dropdown__toggle"
     id="dropdown-with-description-button"
     aria-expanded="true"
     type="button"
   >
-    <span class="pf-v5-c-dropdown__toggle-text">Expanded dropdown</span>
-    <span class="pf-v5-c-dropdown__toggle-icon">
+    <span class="pf-v6-c-dropdown__toggle-text">Expanded dropdown</span>
+    <span class="pf-v6-c-dropdown__toggle-icon">
       <i class="fas fa-caret-down" aria-hidden="true"></i>
     </span>
   </button>
   <ul
-    class="pf-v5-c-dropdown__menu"
+    class="pf-v6-c-dropdown__menu"
     aria-labelledby="dropdown-with-description-button"
     role="menu"
   >
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item pf-m-description"
+        class="pf-v6-c-dropdown__menu-item pf-m-description"
         role="menuitem"
         type="button"
       >
-        <div class="pf-v5-c-dropdown__menu-item-main">Menu item default</div>
+        <div class="pf-v6-c-dropdown__menu-item-main">Menu item default</div>
         <div
-          class="pf-v5-c-dropdown__menu-item-description"
+          class="pf-v6-c-dropdown__menu-item-description"
         >This is a description</div>
       </button>
     </li>
 
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item pf-m-description"
+        class="pf-v6-c-dropdown__menu-item pf-m-description"
         role="menuitem"
         type="button"
       >
         <div
-          class="pf-v5-c-dropdown__menu-item-main"
+          class="pf-v6-c-dropdown__menu-item-main"
         >Menu item with long description</div>
         <div
-          class="pf-v5-c-dropdown__menu-item-description"
+          class="pf-v6-c-dropdown__menu-item-description"
         >This is a really long description that describes the menu item.</div>
       </button>
     </li>
 
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item pf-m-description"
+        class="pf-v6-c-dropdown__menu-item pf-m-description"
         role="menuitem"
         type="button"
         disabled
       >
-        <div class="pf-v5-c-dropdown__menu-item-main">Menu item disabled</div>
+        <div class="pf-v6-c-dropdown__menu-item-main">Menu item disabled</div>
         <div
-          class="pf-v5-c-dropdown__menu-item-description"
+          class="pf-v6-c-dropdown__menu-item-description"
         >This is a description</div>
       </button>
     </li>
 
     <li role="none">
       <a
-        class="pf-v5-c-dropdown__menu-item pf-m-icon pf-m-description"
+        class="pf-v6-c-dropdown__menu-item pf-m-icon pf-m-description"
         role="menuitem"
         href="#"
       >
-        <div class="pf-v5-c-dropdown__menu-item-main">
-          <span class="pf-v5-c-dropdown__menu-item-icon">
+        <div class="pf-v6-c-dropdown__menu-item-main">
+          <span class="pf-v6-c-dropdown__menu-item-icon">
             <img src="/assets/images/pf-logo-small.svg" alt="PatternFly logo" />
           </span>
           Link
         </div>
         <div
-          class="pf-v5-c-dropdown__menu-item-description"
+          class="pf-v6-c-dropdown__menu-item-description"
         >This is a description</div>
       </a>
     </li>
 
     <li role="none">
       <button
-        class="pf-v5-c-dropdown__menu-item pf-m-icon pf-m-description"
+        class="pf-v6-c-dropdown__menu-item pf-m-icon pf-m-description"
         role="menuitem"
         type="button"
       >
-        <div class="pf-v5-c-dropdown__menu-item-main">
-          <span class="pf-v5-c-dropdown__menu-item-icon">
+        <div class="pf-v6-c-dropdown__menu-item-main">
+          <span class="pf-v6-c-dropdown__menu-item-icon">
             <i class="fas fa-cog" aria-hidden="true"></i>
           </span>
           Action
         </div>
         <div
-          class="pf-v5-c-dropdown__menu-item-description"
+          class="pf-v6-c-dropdown__menu-item-description"
         >This is a description</div>
       </button>
     </li>