@patternfly/patternfly 6.0.0-alpha.98 → 6.0.0-alpha.99

package/docs/components/Page/examples/Page.md

@@ -1,7 +1,7 @@
 ---
 id: Page
 section: components
-cssPrefix: pf-v5-c-page
+cssPrefix: pf-v6-c-page
 wrapperTag: div
 ---import './Page.css'
 
@@ -34,16 +34,16 @@ wrapperTag: div
   <main class="pf-v6-c-page__main" tabindex="-1">
     <section class="pf-v6-c-page__main-section">
       This is a default
-      <code>.pf-v5-c-page__main-section</code>.
+      <code>.pf-v6-c-page__main-section</code>.
     </section>
     <section class="pf-v6-c-page__main-section pf-m-secondary">
       This
-      <code>.pf-v5-c-page__main-section</code> uses
+      <code>.pf-v6-c-page__main-section</code> uses
       <code>.pf-m-secondary</code>.
     </section>
     <section class="pf-v6-c-page__main-section">
       This is a default
-      <code>.pf-v5-c-page__main-section</code>.
+      <code>.pf-v6-c-page__main-section</code>.
     </section>
   </main>
 </div>
@@ -74,16 +74,16 @@ wrapperTag: div
   <main class="pf-v6-c-page__main" tabindex="-1">
     <section class="pf-v6-c-page__main-section">
       This is a default
-      <code>.pf-v5-c-page__main-section</code>.
+      <code>.pf-v6-c-page__main-section</code>.
     </section>
     <section class="pf-v6-c-page__main-section pf-m-secondary">
       This
-      <code>.pf-v5-c-page__main-section</code> uses
+      <code>.pf-v6-c-page__main-section</code> uses
       <code>.pf-m-secondary</code>.
     </section>
     <section class="pf-v6-c-page__main-section">
       This is a default
-      <code>.pf-v5-c-page__main-section</code>.
+      <code>.pf-v6-c-page__main-section</code>.
     </section>
   </main>
 </div>
@@ -188,18 +188,18 @@ wrapperTag: div
   <main class="pf-v6-c-page__main" tabindex="-1">
     <section class="pf-v6-c-page__main-section">
       This
-      <code>.pf-v5-c-page__main-section</code> has default padding.
+      <code>.pf-v6-c-page__main-section</code> has default padding.
     </section>
     <section class="pf-v6-c-page__main-section pf-m-no-padding">
       This
-      <code>.pf-v5-c-page__main-section</code> uses
+      <code>.pf-v6-c-page__main-section</code> uses
       <code>.pf-m-no-padding</code> to remove all padding.
     </section>
     <section
       class="pf-v6-c-page__main-section pf-m-no-padding pf-m-padding-on-md"
     >
       This
-      <code>.pf-v5-c-page__main-section</code> uses
+      <code>.pf-v6-c-page__main-section</code> uses
       <code>.pf-m-no-padding .pf-m-padding-on-md</code> to remove padding up to the
       <code>md</code> breakpoint.
     </section>
@@ -234,25 +234,25 @@ wrapperTag: div
   </div>
   <main class="pf-v6-c-page__main" tabindex="-1">
     <section class="pf-v6-c-page__main-subnav">
-      <code>.pf-v5-c-page__main-subnav</code> for horizontal subnav navigation
+      <code>.pf-v6-c-page__main-subnav</code> for horizontal subnav navigation
     </section>
     <section class="pf-v6-c-page__main-nav">
-      <code>.pf-v5-c-page__main-nav</code> for tertiary navigation
+      <code>.pf-v6-c-page__main-nav</code> for tertiary navigation
     </section>
     <section class="pf-v6-c-page__main-tabs">
-      <code>.pf-v5-c-page__main-tabs</code> for tabs
+      <code>.pf-v6-c-page__main-tabs</code> for tabs
     </section>
     <div class="pf-v6-c-page__main-group">
-      <code>.pf-v5-c-page__main-group</code> for a group of page sections
+      <code>.pf-v6-c-page__main-group</code> for a group of page sections
     </div>
     <section class="pf-v6-c-page__main-breadcrumb">
-      <code>.pf-v5-c-page__main-breadcrumb</code> for breadcrumbs
+      <code>.pf-v6-c-page__main-breadcrumb</code> for breadcrumbs
     </section>
     <section class="pf-v6-c-page__main-section">
-      <code>.pf-v5-c-page__main-section</code> for main sections
+      <code>.pf-v6-c-page__main-section</code> for main sections
     </section>
     <section class="pf-v6-c-page__main-wizard">
-      <code>.pf-v5-c-page__main-wizard</code> for wizards
+      <code>.pf-v6-c-page__main-wizard</code> for wizards
     </section>
   </main>
 </div>
@@ -288,7 +288,7 @@ wrapperTag: div
         <div class="pf-v6-c-card">
           <div class="pf-v6-c-card__body">
             When a width limited page section is wider than the value of
-            <code>--pf-v5-c-page--section--m-limit-width--MaxWidth</code>, the section will be centered in the main section.
+            <code>--pf-v6-c-page--section--m-limit-width--MaxWidth</code>, the section will be centered in the main section.
             <br />
             <br />The content in this example is placed in a card to better illustrate how the section behaves when it is centered. A card is not required to center a page section.
           </div>
@@ -310,44 +310,45 @@ This component provides the basic chrome for a page, including sidebar and main
 
 | Attribute | Applied to | Outcome |
 | -- | -- | -- |
-| `role="main"` | `.pf-v5-c-page__main` | Identifies the element that serves as the main region. |
-| `tabindex="-1"` | `.pf-v5-c-page__main` | Allows the main region to receive programmatic focus. **Required** |
-| `id="[id]"` | `.pf-v5-c-page__main` | Provides a hook for sending focus to new content. **Required** |
-| `tabindex="0"` | `.pf-v5-c-page__main-section.pf-m-overflow-scroll` | If a page section has overflow content that triggers a scrollbar, to ensure that the content is keyboard accessible, the page section must include either a focusable element within the scrollable region or the page section itself must be focusable by adding `tabindex="0"`. |
+| `role="main"` | `.pf-v6-c-page__main` | Identifies the element that serves as the main region. |
+| `tabindex="-1"` | `.pf-v6-c-page__main` | Allows the main region to receive programmatic focus. **Required** |
+| `id="[id]"` | `.pf-v6-c-page__main` | Provides a hook for sending focus to new content. **Required** |
+| `tabindex="0"` | `.pf-v6-c-page__main-section.pf-m-overflow-scroll` | If a page section has overflow content that triggers a scrollbar, to ensure that the content is keyboard accessible, the page section must include either a focusable element within the scrollable region or the page section itself must be focusable by adding `tabindex="0"`. |
 
 ### Usage
 
 | Class | Applied to | Outcome |
 | -- | -- | -- |
-| `.pf-v5-c-page` | `<div>` |   Declares the page component. |
-| `.pf-v5-c-page__sidebar` | `<aside>` |   Declares the page sidebar. |
-| `.pf-v5-c-page__sidebar-body` | `<div>` | Creates a wrapper within the sidebar to hold content. **Note: The last/only `.pf-v5-c-page__sidebar-body` element will grow to fill the availble vertical space. You can change this behavior using `.pf-m-fill` and `.pf-m-no-fill`, which are documented below.** |
-| `.pf-v5-c-page__main` | `<main>` |   Declares the main page area. |
-| `.pf-v5-c-page__main-nav` | `<section>` |   Creates a container to nest the navigation component in the main page area. |
-| `.pf-v5-c-page__main-breadcrumb` | `<section>` |   Creates a container to nest the breadcrumb component in the main page area. |
-| `.pf-v5-c-page__main-section` | `<section>` |  Creates a section container in the main page area. **Note: The last/only `.pf-v5-c-page__main-section` element will grow to fill the availble vertical space. You can change this behavior using `.pf-m-fill` and `.pf-m-no-fill`, which are documented below.**  |
-| `.pf-v5-c-page__main-tabs` | `<section>` | Creates a container to nest the tabs component in the main page area. |
-| `.pf-v5-c-page__main-wizard` | `<section>` | Creates a container to nest the wizard component in the main page area. |
-| `.pf-v5-c-page__main-body` | `<div>` | Creates the body section for a page section. **Required when using `.pf-m-limit-width` on `.pf-v5-c-page__main-section`** |
-| `.pf-v5-c-page__main-group` | `<div>` | Creates the group of `.pf-v5-c-page__main-*` sections. Can be used in combination with `.pf-m-sticky-[top/bottom]` to make multiple sections sticky. |
-| `.pf-v5-c-page__drawer` | `<div>` |  Creates a container for the drawer component when placing the main page element in the drawer body. |
-| `.pf-m-expanded` | `.pf-v5-c-page__sidebar` |  Modifies the sidebar for the expanded state. |
-| `.pf-m-collapsed` | `.pf-v5-c-page__sidebar` |  Modifies the sidebar for the collapsed state. |
-| `.pf-m-page-insets` | `.pf-v5-c-page__sidebar-body` |  Modifies a sidebar body padding/inset to visually match padding of page elements. |
-| `.pf-m-inset-none` | `.pf-v5-c-page__sidebar-body` | Removes a sidebar body left/right inset. |
-| `.pf-m-light` | `.pf-v5-c-page__sidebar` |  Modifies the sidebar the light variation. **Note: for use with a light themed nav component** |
-| `.pf-m-light` | `.pf-v5-c-page__main-section` | Modifies a main page section to have a light theme. |
-| `.pf-m-dark-200` | `.pf-v5-c-page__main-section` |  Modifies a main page section to have a dark theme and a dark transparent background. |
-| `.pf-m-dark-100` | `.pf-v5-c-page__main-section` |  Modifies a main page section to have a dark theme and a darker transparent background. |
-| `.pf-m-light-200` | `.pf-v5-c-page__main-wizard` | Modifies a wizard page section to have a light 200 theme. |
-| `.pf-m-padding{-on-[breakpoint]}` | `.pf-v5-c-page__main-section` | Modifies the main page section to add padding back in at an optional [breakpoint](/developer-resources/global-css-variables#breakpoint-variables-and-class-suffixes). Should be used with pf-m-no-padding. |
-| `.pf-m-no-padding{-on-[breakpoint]}` | `.pf-v5-c-page__main-section` | Removes padding from the main page section at an optional [breakpoint](/developer-resources/global-css-variables#breakpoint-variables-and-class-suffixes). |
-| `.pf-m-fill` | `.pf-v5-c-page__main-section`, `.pf-v5-c-page__sidebar-body` | Modifies the element to grow to fill the available space. |
-| `.pf-m-no-fill` | `.pf-v5-c-page__main-section`, `.pf-v5-c-page__sidebar-body` | Modifies the element to not grow to fill the available vertical space. |
-| `.pf-m-limit-width` | `.pf-v5-c-page__main-section` | Modifies a page section to limit the `max-width` of the content inside. |
-| `.pf-m-align-center` | `.pf-v5-c-page__main-section.pf-m-limit-width` | Modifies a page section body to align center. |
-| `.pf-m-sticky-top{-on-[breakpoint]-height}` | `.pf-v5-c-page__main-*` | Modifies a section/group to be sticky to the top of its container at an optional height breakpoint. |
-| `.pf-m-sticky-bottom{-on-[breakpoint]-height}` | `.pf-v5-c-page__main-*` | Modifies a section/group to be sticky to the bottom of its container at an optional height breakpoint. |
-| `.pf-m-shadow-bottom` | `.pf-v5-c-page__main-*` | Modifies a section/group to have a bottom shadow. |
-| `.pf-m-shadow-top` | `.pf-v5-c-page__main-*` | Modifies a section/group to have a top shadow. |
-| `.pf-m-overflow-scroll` | `.pf-v5-c-page__main-*` | Modifies a section/group to show a scrollbar if it has overflow content. |
+| `.pf-v6-c-page` | `<div>` | Declares the page component. |
+| `.pf-v6-c-page__sidebar` | `<aside>` | Declares the page sidebar. |
+| `.pf-v6-c-page__sidebar-body` | `<div>` | Creates a wrapper within the sidebar to hold content. **Note: The last/only `.pf-v6-c-page__sidebar-body` element will grow to fill the availble vertical space. You can change this behavior using `.pf-m-fill` and `.pf-m-no-fill`, which are documented below.** |
+| `.pf-v6-c-page__main` | `<main>` | Declares the main page area. |
+| `.pf-v6-c-page__main-nav` | `<section>` | Creates a container to nest the (deprecated) tertiary navigation component in the main page area. |
+| `.pf-v6-c-page__main-subnav` | `<section>` | Creates a container to nest the horizontal subnav navigation component in the main page area. |
+| `.pf-v6-c-page__main-breadcrumb` | `<section>` | Creates a container to nest the breadcrumb component in the main page area. |
+| `.pf-v6-c-page__main-section` | `<section>` | Creates a section container in the main page area. **Note: The last/only `.pf-v6-c-page__main-section` element will grow to fill the availble vertical space. You can change this behavior using `.pf-m-fill` and `.pf-m-no-fill`, which are documented below.**  |
+| `.pf-v6-c-page__main-tabs` | `<section>` | Creates a container to nest the tabs component in the main page area. |
+| `.pf-v6-c-page__main-wizard` | `<section>` | Creates a container to nest the wizard component in the main page area. |
+| `.pf-v6-c-page__main-body` | `<div>` | Creates the body section for a page section. **Required when using `.pf-m-limit-width` on `.pf-v6-c-page__main-section`** |
+| `.pf-v6-c-page__main-group` | `<div>` | Creates the group of `.pf-v6-c-page__main-*` sections. Can be used in combination with `.pf-m-sticky-[top/bottom]` to make multiple sections sticky. |
+| `.pf-v6-c-page__drawer` | `<div>` | Creates a container for the drawer component when placing the main page element in the drawer body. |
+| `.pf-m-expanded` | `.pf-v6-c-page__sidebar` | Modifies the sidebar for the expanded state. |
+| `.pf-m-collapsed` | `.pf-v6-c-page__sidebar` | Modifies the sidebar for the collapsed state. |
+| `.pf-m-page-insets` | `.pf-v6-c-page__sidebar-body` | Modifies a sidebar body padding/inset to visually match padding of page elements. |
+| `.pf-m-inset-none` | `.pf-v6-c-page__sidebar-body` | Removes a sidebar body left/right inset. |
+| `.pf-m-light` | `.pf-v6-c-page__sidebar` | Modifies the sidebar the light variation. **Note: for use with a light themed nav component** |
+| `.pf-m-light` | `.pf-v6-c-page__main-section` | Modifies a main page section to have a light theme. |
+| `.pf-m-dark-200` | `.pf-v6-c-page__main-section` | Modifies a main page section to have a dark theme and a dark transparent background. |
+| `.pf-m-dark-100` | `.pf-v6-c-page__main-section` | Modifies a main page section to have a dark theme and a darker transparent background. |
+| `.pf-m-light-200` | `.pf-v6-c-page__main-wizard` | Modifies a wizard page section to have a light 200 theme. |
+| `.pf-m-padding{-on-[breakpoint]}` | `.pf-v6-c-page__main-section` | Modifies the main page section to add padding back in at an optional [breakpoint](/developer-resources/global-css-variables#breakpoint-variables-and-class-suffixes). Should be used with pf-m-no-padding. |
+| `.pf-m-no-padding{-on-[breakpoint]}` | `.pf-v6-c-page__main-section` | Removes padding from the main page section at an optional [breakpoint](/developer-resources/global-css-variables#breakpoint-variables-and-class-suffixes). |
+| `.pf-m-fill` | `.pf-v6-c-page__main-section`, `.pf-v6-c-page__sidebar-body` | Modifies the element to grow to fill the available space. |
+| `.pf-m-no-fill` | `.pf-v6-c-page__main-section`, `.pf-v6-c-page__sidebar-body` | Modifies the element to not grow to fill the available vertical space. |
+| `.pf-m-limit-width` | `.pf-v6-c-page__main-section` | Modifies a page section to limit the `max-width` of the content inside. |
+| `.pf-m-align-center` | `.pf-v6-c-page__main-section.pf-m-limit-width` | Modifies a page section body to align center. |
+| `.pf-m-sticky-top{-on-[breakpoint]-height}` | `.pf-v6-c-page__main-*` | Modifies a section/group to be sticky to the top of its container at an optional height breakpoint. |
+| `.pf-m-sticky-bottom{-on-[breakpoint]-height}` | `.pf-v6-c-page__main-*` | Modifies a section/group to be sticky to the bottom of its container at an optional height breakpoint. |
+| `.pf-m-shadow-bottom` | `.pf-v6-c-page__main-*` | Modifies a section/group to have a bottom shadow. |
+| `.pf-m-shadow-top` | `.pf-v6-c-page__main-*` | Modifies a section/group to have a top shadow. |
+| `.pf-m-overflow-scroll` | `.pf-v6-c-page__main-*` | Modifies a section/group to show a scrollbar if it has overflow content. |

package/docs/components/Pagination/examples/Pagination.md

@@ -1,7 +1,7 @@
 ---
 id: Pagination
 section: components
-cssPrefix: pf-v5-c-pagination
+cssPrefix: pf-v6-c-pagination
 ---import './Pagination.css'
 
 ## Examples
@@ -1511,37 +1511,37 @@ cssPrefix: pf-v5-c-pagination
 
 ## Documentation
 
-Note: `<button>` or `<a>` elements can be used in `.pf-v5-c-pagination__nav-page-select`.
+Note: `<button>` or `<a>` elements can be used in `.pf-v6-c-pagination__nav-page-select`.
 
 ### Accessibility
 
 | Attribute | Applied to | Outcome |
 | -- | -- | -- |
-| `aria-label`  | `.pf-v5-c-pagination__nav` |  Provides an accessible name for pagination navigation element. **Required** |
-| `type="number"` | `.pf-v5-c-pagination__nav-page-select` > `.pf-v5-c-form-control` | Defines a field as a number. **Required** |
-| `value` | `.pf-v5-c-pagination__nav-page-select` > `.pf-v5-c-form-control` | Provides initial integer value. **Required** |
-| `min` | `.pf-v5-c-pagination__nav-page-select` > `.pf-v5-c-form-control` | Provides minimum integer value. **Required** |
-| `max` | `.pf-v5-c-pagination__nav-page-select` > `.pf-v5-c-form-control` | Provides max integer value. **Required** |
+| `aria-label`  | `.pf-v6-c-pagination__nav` |  Provides an accessible name for pagination navigation element. **Required** |
+| `type="number"` | `.pf-v6-c-pagination__nav-page-select` > `.pf-v6-c-form-control` | Defines a field as a number. **Required** |
+| `value` | `.pf-v6-c-pagination__nav-page-select` > `.pf-v6-c-form-control` | Provides initial integer value. **Required** |
+| `min` | `.pf-v6-c-pagination__nav-page-select` > `.pf-v6-c-form-control` | Provides minimum integer value. **Required** |
+| `max` | `.pf-v6-c-pagination__nav-page-select` > `.pf-v6-c-form-control` | Provides max integer value. **Required** |
 
 ### Usage
 
 | Class | Applied to | Outcome |
 | -- | -- | -- |
-| `.pf-v5-c-pagination` | `<div>` |  Initiates pagination. |
-| `.pf-v5-c-pagination__current` | `<div>` |  Initiates element to display currently displayed items for use in responsive view. Only needed for default pagination, not `.pf-m-bottom`. |
-| `.pf-v5-c-pagination__total-items` | `<div>` | Initiates element to replace the options menu on summary. |
-| `.pf-v5-c-pagination__nav` | `<nav>` |  Initiates pagination nav. |
-| `.pf-v5-c-pagination__nav-control` | `<div>` |  Initiates pagination nav control. |
-| `.pf-v5-c-pagination__nav-page-select` | `<div>` |  Initiates pagination nav page select. |
-| `.pf-m-display-summary{-on-[breakpoint]}` | `.pf-v5-c-pagination` | Modifies for summary display pagination component styles at optional [breakpoint](/developer-resources/global-css-variables#breakpoint-variables-and-class-suffixes). |
-| `.pf-m-display-full{-on-[breakpoint]}` | `.pf-v5-c-pagination` | Modifies for full display pagination component styles at optional [breakpoint](/developer-resources/global-css-variables#breakpoint-variables-and-class-suffixes). |
-| `.pf-m-bottom` | `.pf-v5-c-pagination` | Modifies for bottom pagination component styles. |
-| `.pf-m-compact` | `.pf-v5-c-pagination` | Modifies for compact pagination component styles. |
-| `.pf-m-static` | `.pf-v5-c-pagination.pf-m-bottom` | Modifies bottom pagination to not be positioned sticky on summary. |
-| `.pf-m-sticky` | `.pf-v5-c-pagination` | Modifies the pagination to be sticky to its container. It will be sticky to the top of the container by default, and sticky to the bottom of the container when applied to `.pf-v5-c-pagination.pf-m-bottom`. |
-| `.pf-m-inset-{none, sm, md, lg, xl, 2xl}{-on-[breakpoint]}` | `.pf-v5-c-pagination` | Modifies pagination horizontal padding at optional [breakpoint](/developer-resources/global-css-variables#breakpoint-variables-and-class-suffixes). |
-| `.pf-m-page-insets` | `.pf-v5-c-pagination` |  Modifies the pagination component padding/inset to visually match padding of page elements. |
-| `.pf-m-first` | `.pf-v5-c-pagination__nav-control` | Indicates the control is for the first page button. |
-| `.pf-m-prev` | `.pf-v5-c-pagination__nav-control` | Indicates the control is for the previous page button. |
-| `.pf-m-next` | `.pf-v5-c-pagination__nav-control` | Indicates the control is for the next page button. |
-| `.pf-m-last` | `.pf-v5-c-pagination__nav-control` | Indicates the control is for the last page button. |
+| `.pf-v6-c-pagination` | `<div>` |  Initiates pagination. |
+| `.pf-v6-c-pagination__current` | `<div>` |  Initiates element to display currently displayed items for use in responsive view. Only needed for default pagination, not `.pf-m-bottom`. |
+| `.pf-v6-c-pagination__total-items` | `<div>` | Initiates element to replace the options menu on summary. |
+| `.pf-v6-c-pagination__nav` | `<nav>` |  Initiates pagination nav. |
+| `.pf-v6-c-pagination__nav-control` | `<div>` |  Initiates pagination nav control. |
+| `.pf-v6-c-pagination__nav-page-select` | `<div>` |  Initiates pagination nav page select. |
+| `.pf-m-display-summary{-on-[breakpoint]}` | `.pf-v6-c-pagination` | Modifies for summary display pagination component styles at optional [breakpoint](/developer-resources/global-css-variables#breakpoint-variables-and-class-suffixes). |
+| `.pf-m-display-full{-on-[breakpoint]}` | `.pf-v6-c-pagination` | Modifies for full display pagination component styles at optional [breakpoint](/developer-resources/global-css-variables#breakpoint-variables-and-class-suffixes). |
+| `.pf-m-bottom` | `.pf-v6-c-pagination` | Modifies for bottom pagination component styles. |
+| `.pf-m-compact` | `.pf-v6-c-pagination` | Modifies for compact pagination component styles. |
+| `.pf-m-static` | `.pf-v6-c-pagination.pf-m-bottom` | Modifies bottom pagination to not be positioned sticky on summary. |
+| `.pf-m-sticky` | `.pf-v6-c-pagination` | Modifies the pagination to be sticky to its container. It will be sticky to the top of the container by default, and sticky to the bottom of the container when applied to `.pf-v6-c-pagination.pf-m-bottom`. |
+| `.pf-m-inset-{none, sm, md, lg, xl, 2xl}{-on-[breakpoint]}` | `.pf-v6-c-pagination` | Modifies pagination horizontal padding at optional [breakpoint](/developer-resources/global-css-variables#breakpoint-variables-and-class-suffixes). |
+| `.pf-m-page-insets` | `.pf-v6-c-pagination` |  Modifies the pagination component padding/inset to visually match padding of page elements. |
+| `.pf-m-first` | `.pf-v6-c-pagination__nav-control` | Indicates the control is for the first page button. |
+| `.pf-m-prev` | `.pf-v6-c-pagination__nav-control` | Indicates the control is for the previous page button. |
+| `.pf-m-next` | `.pf-v6-c-pagination__nav-control` | Indicates the control is for the next page button. |
+| `.pf-m-last` | `.pf-v6-c-pagination__nav-control` | Indicates the control is for the last page button. |

package/docs/components/Panel/examples/Panel.md

@@ -1,7 +1,7 @@
 ---
 id: 'Panel'
 section: components
-cssPrefix: pf-v5-c-panel
+cssPrefix: pf-v6-c-panel
 ---## Examples
 
 ### Basic
@@ -163,12 +163,12 @@ cssPrefix: pf-v5-c-panel
 
 | Class | Applied to | Outcome |
 | -- | -- | -- |
-| `.pf-v5-c-panel` | `<div>` | Initiates the panel. **Required** |
-| `.pf-v5-c-panel__header` | `<div>` | Initiates the panel header. |
-| `.pf-v5-c-panel__main` | `<div>` | Initiates the panel main content. |
-| `.pf-v5-c-panel__main-body` | `<div>` | Initiates a panel content body container. |
-| `.pf-v5-c-panel__footer` | `<div>` | Initiates the panel footer. |
-| `.pf-m-bordered` | `.pf-v5-c-panel` | Modifies the panel for bordered styles. |
-| `.pf-m-raised` | `.pf-v5-c-panel` | Modifies the panel for raised styles. |
-| `.pf-m-scrollable` | `.pf-v5-c-panel` | Modifies the panel for scrollable styles. |
-| `.pf-m-secondary` | `.pf-v5-c-panel` | Modifies the panel for secondary styles. |
+| `.pf-v6-c-panel` | `<div>` | Initiates the panel. **Required** |
+| `.pf-v6-c-panel__header` | `<div>` | Initiates the panel header. |
+| `.pf-v6-c-panel__main` | `<div>` | Initiates the panel main content. |
+| `.pf-v6-c-panel__main-body` | `<div>` | Initiates a panel content body container. |
+| `.pf-v6-c-panel__footer` | `<div>` | Initiates the panel footer. |
+| `.pf-m-bordered` | `.pf-v6-c-panel` | Modifies the panel for bordered styles. |
+| `.pf-m-raised` | `.pf-v6-c-panel` | Modifies the panel for raised styles. |
+| `.pf-m-scrollable` | `.pf-v6-c-panel` | Modifies the panel for scrollable styles. |
+| `.pf-m-secondary` | `.pf-v6-c-panel` | Modifies the panel for secondary styles. |

package/docs/components/Popover/examples/Popover.md

@@ -1,7 +1,7 @@
 ---
 id: Popover
 section: components
-cssPrefix: pf-v5-c-popover
+cssPrefix: pf-v6-c-popover
 ---import './Popover.css'
 
 ## Examples
@@ -646,37 +646,37 @@ A popover is used to provide contextual information for another component on cli
 
 | Attribute | Applies to | Outcome |
 | -- | -- | -- |
-| `role="dialog"` | `.pf-v5-c-popover` | Identifies the element that serves as the popover container. **Required** |
-| `aria-labelledby="[id value of .pf-v5-c-title]"` | `.pf-v5-c-popover` | Gives the popover an accessible name by referring to the element that provides the dialog title. **Required when .pf-v5-c-title is present** |
-| `aria-label="[title of popover]"` | `.pf-v5-c-popover` | Gives the popover an accessible name. **Required when .pf-v5-c-title is *not* present** |
-| `aria-describedby="[id value of applicable content]"` | `.pf-v5-c-popover` | Gives the popover an accessible description by referring to the popover content that describes the primary message or purpose of the dialog. Not used if there is no static text that describes the popover. |
-| `aria-modal="true"` | `.pf-v5-c-popover` | Tells assistive technologies that the windows underneath the current popover are not available for interaction. **Required**|
-| `aria-label="Close"` | `.pf-v5-c-button` | Provides an accessible name for the close button as it uses an icon instead of text. **Required**|
-| `aria-hidden="true"` | Parent element containing the page contents when the popover is open. | Hides main contents of the page from screen readers. The element with `.pf-v5-c-popover` must not be a descendent of the element with `aria-hidden="true"`. For more info, see [trapping focus](/accessibility/product-development-guide#trapping-focus). **Required** |
-| `.pf-v5-screen-reader` | `.pf-v5-c-popover__title-text <span>` | Adds text to be read saying the alert status before the title. If `.pf-v5-c-popover__title-text` is not used to create a title, this must be added within the title. **Required for popovers that are alerts** |
+| `role="dialog"` | `.pf-v6-c-popover` | Identifies the element that serves as the popover container. **Required** |
+| `aria-labelledby="[id value of .pf-v6-c-title]"` | `.pf-v6-c-popover` | Gives the popover an accessible name by referring to the element that provides the dialog title. **Required when .pf-v6-c-title is present** |
+| `aria-label="[title of popover]"` | `.pf-v6-c-popover` | Gives the popover an accessible name. **Required when .pf-v6-c-title is *not* present** |
+| `aria-describedby="[id value of applicable content]"` | `.pf-v6-c-popover` | Gives the popover an accessible description by referring to the popover content that describes the primary message or purpose of the dialog. Not used if there is no static text that describes the popover. |
+| `aria-modal="true"` | `.pf-v6-c-popover` | Tells assistive technologies that the windows underneath the current popover are not available for interaction. **Required**|
+| `aria-label="Close"` | `.pf-v6-c-button` | Provides an accessible name for the close button as it uses an icon instead of text. **Required**|
+| `aria-hidden="true"` | Parent element containing the page contents when the popover is open. | Hides main contents of the page from screen readers. The element with `.pf-v6-c-popover` must not be a descendent of the element with `aria-hidden="true"`. For more info, see [trapping focus](/accessibility/product-development-guide#trapping-focus). **Required** |
+| `.pf-v6-screen-reader` | `.pf-v6-c-popover__title-text <span>` | Adds text to be read saying the alert status before the title. If `.pf-v6-c-popover__title-text` is not used to create a title, this must be added within the title. **Required for popovers that are alerts** |
 
 ### Usage
 
 | Class | Applied to | Outcome |
 | -- | -- | -- |
-| `.pf-v5-c-popover` | `<div>` |  Creates a popover. Always use it with a modifier class that positions the popover relative to the element that triggered it. **Required** |
-| `.pf-v5-c-popover__arrow` | `<div>` |  Creates an arrow pointing towards the element the popover describes. **Required** |
-| `.pf-v5-c-popover__content` | `<div>` |  Creates the content area of the popover. **Required** |
-| `.pf-v5-c-popover__close` | `<div>` |  Positions the close icon in the top-right corner of the popover. **Required if there is a close button** |
-| `.pf-v5-c-popover__header` | `<header>` | Creates the popover header. **Required if there is a title**|
-| `.pf-v5-c-popover__title` | `<div>` | Creates the popover title. |
-| `.pf-v5-c-popover__title-icon` | `<span>` | Creates the popover title icon. |
-| `.pf-v5-c-popover__title-text` | `<h1>`,`<h2>`,`<h3>`,`<h4>`,`<h5>`,`<h6>`,`<span>` | Creates the popover title text. |
-| `.pf-v5-c-popover__body` | `<div>` |  The popover's body text. **Required** |
-| `.pf-v5-c-popover__footer` | `<footer>` | Initiates a popover footer. |
-| `.pf-m-left{-top/bottom}` | `.pf-v5-c-popover` | Positions the popover to the left (or left top/left bottom) of the element. |
-| `.pf-m-right{-top/bottom}` | `.pf-v5-c-popover` | Positions the popover to the right (or right top/right bottom) of the element. |
-| `.pf-m-top{-left/right}` | `.pf-v5-c-popover` | Positions the popover to the top (or top left/top right) of the element. |
-| `.pf-m-bottom{-left/right}` | `.pf-v5-c-popover` | Positions the popover to the bottom (or bottom left/bottom right) of the element. |
-| `.pf-m-no-padding` | `.pf-v5-c-popover` | Removes the outer padding from the popover content. |
-| `.pf-m-width-auto` | `.pf-v5-c-popover` | Allows popover width to be defined by the popover content. |
-| `.pf-m-custom` | `.pf-v5-c-popover` | Modifies for the custom alert state. |
-| `.pf-m-info` | `.pf-v5-c-popover` | Modifies for the info alert state. |
-| `.pf-m-success` | `.pf-v5-c-popover` | Modifies for the success alert state. |
-| `.pf-m-warning` | `.pf-v5-c-popover` | Modifies for the warning alert state. |
-| `.pf-m-danger` | `.pf-v5-c-popover` | Modifies for the danger alert state. |
+| `.pf-v6-c-popover` | `<div>` |  Creates a popover. Always use it with a modifier class that positions the popover relative to the element that triggered it. **Required** |
+| `.pf-v6-c-popover__arrow` | `<div>` |  Creates an arrow pointing towards the element the popover describes. **Required** |
+| `.pf-v6-c-popover__content` | `<div>` |  Creates the content area of the popover. **Required** |
+| `.pf-v6-c-popover__close` | `<div>` |  Positions the close icon in the top-right corner of the popover. **Required if there is a close button** |
+| `.pf-v6-c-popover__header` | `<header>` | Creates the popover header. **Required if there is a title**|
+| `.pf-v6-c-popover__title` | `<div>` | Creates the popover title. |
+| `.pf-v6-c-popover__title-icon` | `<span>` | Creates the popover title icon. |
+| `.pf-v6-c-popover__title-text` | `<h1>`,`<h2>`,`<h3>`,`<h4>`,`<h5>`,`<h6>`,`<span>` | Creates the popover title text. |
+| `.pf-v6-c-popover__body` | `<div>` |  The popover's body text. **Required** |
+| `.pf-v6-c-popover__footer` | `<footer>` | Initiates a popover footer. |
+| `.pf-m-left{-top/bottom}` | `.pf-v6-c-popover` | Positions the popover to the left (or left top/left bottom) of the element. |
+| `.pf-m-right{-top/bottom}` | `.pf-v6-c-popover` | Positions the popover to the right (or right top/right bottom) of the element. |
+| `.pf-m-top{-left/right}` | `.pf-v6-c-popover` | Positions the popover to the top (or top left/top right) of the element. |
+| `.pf-m-bottom{-left/right}` | `.pf-v6-c-popover` | Positions the popover to the bottom (or bottom left/bottom right) of the element. |
+| `.pf-m-no-padding` | `.pf-v6-c-popover` | Removes the outer padding from the popover content. |
+| `.pf-m-width-auto` | `.pf-v6-c-popover` | Allows popover width to be defined by the popover content. |
+| `.pf-m-custom` | `.pf-v6-c-popover` | Modifies for the custom alert state. |
+| `.pf-m-info` | `.pf-v6-c-popover` | Modifies for the info alert state. |
+| `.pf-m-success` | `.pf-v6-c-popover` | Modifies for the success alert state. |
+| `.pf-m-warning` | `.pf-v6-c-popover` | Modifies for the warning alert state. |
+| `.pf-m-danger` | `.pf-v6-c-popover` | Modifies for the danger alert state. |

package/docs/components/Progress/examples/Progress.md

@@ -1,7 +1,7 @@
 ---
 id: Progress
 section: components
-cssPrefix: pf-v5-c-progress
+cssPrefix: pf-v6-c-progress
 ---## Examples
 
 ### Simple
@@ -378,7 +378,7 @@ cssPrefix: pf-v5-c-progress
 <div
   class="pf-v6-c-progress pf-m-outside pf-m-lg"
   id="progress-outside-static-width-4-example"
-  style="--pf-v5-c-progress__measure--m-static-width--MinWidth: 6ch;"
+  style="--pf-v6-c-progress__measure--m-static-width--MinWidth: 6ch;"
 >
   <div class="pf-v6-c-progress__status" aria-hidden="true">
     <span class="pf-v6-c-progress__measure pf-m-static-width">1,000</span>
@@ -399,7 +399,7 @@ cssPrefix: pf-v5-c-progress
 <div
   class="pf-v6-c-progress pf-m-outside pf-m-lg"
   id="progress-outside-static-width-5-example"
-  style="--pf-v5-c-progress__measure--m-static-width--MinWidth: 6ch;"
+  style="--pf-v6-c-progress__measure--m-static-width--MinWidth: 6ch;"
 >
   <div class="pf-v6-c-progress__status" aria-hidden="true">
     <span class="pf-v6-c-progress__measure pf-m-static-width">50,000</span>
@@ -420,7 +420,7 @@ cssPrefix: pf-v5-c-progress
 <div
   class="pf-v6-c-progress pf-m-outside pf-m-lg"
   id="progress-outside-static-width-6-example"
-  style="--pf-v5-c-progress__measure--m-static-width--MinWidth: 6ch;"
+  style="--pf-v6-c-progress__measure--m-static-width--MinWidth: 6ch;"
 >
   <div class="pf-v6-c-progress__status" aria-hidden="true">
     <span class="pf-v6-c-progress__measure pf-m-static-width">100,000</span>
@@ -635,35 +635,35 @@ If this component is describing the loading progress of a particular region of a
 
 | Attribute | Applied to | Outcome |
 | -- | -- | -- |
-| `role="progressbar"` | `.pf-v5-c-progress__bar` |  This role is used for an element that displays the progress status for a task that takes a long time or consists of several steps. |
-| `aria-valuenow=""` | `.pf-v5-c-progress__bar` |  This value needs to be updated as progress continues. |
-| `aria-valuemin="0"` | `.pf-v5-c-progress__bar` |  The minimum value for the progress bar. |
-| `aria-valuemax="100"` | `.pf-v5-c-progress__bar` |  The maximum value for the progress bar. If the progress is only defined using `aria-valuenow` (e.g a percentage), the value should be set to "100". If the progress is defined using `aria-valuetext`, then this value can be a number other than 100. For example, if `aria-valuetext` is "2 of 5 units", then `aria-valuemax` can be "5" and `aria-valuenow` can be "2". |
-| `aria-label="[id of .pf-v5-c-progress__description]"` | `.pf-v5-c-progress__bar` | Provides an accessible name for the progress component. |
-| `aria-labelledby="[id element that labels the progress]"` | `.pf-v5-c-progress__bar` | Provides an accessible name for the progress component. |
-| `aria-describedby="[id of element that describes the progress]"` | `.pf-v5-c-progress__bar` | Provides an accessible description for the progress component. |
-| `aria-valuetext="[loading state]"` | `.pf-v5-c-progress__bar` |  Provide a text string that communicates current status. Only use if the important information about status is included in the text string. Do not use if percentage is the most important value to communicate. Some screen readers will ignore the percentage value determined from `aria-valuenow` when `aria-valuetext` is used. |
-| `aria-hidden="true"` | `.pf-v5-c-progress__status` |  Hides the visible progress bar status from screen readers. This information is communicated by the aria attributes defined on the `.pf-v5-c-progress__bar` element. |
+| `role="progressbar"` | `.pf-v6-c-progress__bar` |  This role is used for an element that displays the progress status for a task that takes a long time or consists of several steps. |
+| `aria-valuenow=""` | `.pf-v6-c-progress__bar` |  This value needs to be updated as progress continues. |
+| `aria-valuemin="0"` | `.pf-v6-c-progress__bar` |  The minimum value for the progress bar. |
+| `aria-valuemax="100"` | `.pf-v6-c-progress__bar` |  The maximum value for the progress bar. If the progress is only defined using `aria-valuenow` (e.g a percentage), the value should be set to "100". If the progress is defined using `aria-valuetext`, then this value can be a number other than 100. For example, if `aria-valuetext` is "2 of 5 units", then `aria-valuemax` can be "5" and `aria-valuenow` can be "2". |
+| `aria-label="[id of .pf-v6-c-progress__description]"` | `.pf-v6-c-progress__bar` | Provides an accessible name for the progress component. |
+| `aria-labelledby="[id element that labels the progress]"` | `.pf-v6-c-progress__bar` | Provides an accessible name for the progress component. |
+| `aria-describedby="[id of element that describes the progress]"` | `.pf-v6-c-progress__bar` | Provides an accessible description for the progress component. |
+| `aria-valuetext="[loading state]"` | `.pf-v6-c-progress__bar` |  Provide a text string that communicates current status. Only use if the important information about status is included in the text string. Do not use if percentage is the most important value to communicate. Some screen readers will ignore the percentage value determined from `aria-valuenow` when `aria-valuetext` is used. |
+| `aria-hidden="true"` | `.pf-v6-c-progress__status` |  Hides the visible progress bar status from screen readers. This information is communicated by the aria attributes defined on the `.pf-v6-c-progress__bar` element. |
 
 ### Usage
 
 | Class | Applied to | Outcome |
 | -- | -- | -- |
-| `.pf-v5-c-progress` | `<div>` |  Initiates a progress component. |
-| `.pf-v5-c-progress__description` | `<div>` |  The description for a progress bar. |
-| `.pf-v5-c-progress__status` | `<div>` |  Displays the % of progress and status icons. |
-| `.pf-v5-c-progress__measure` | `<span>` |  Displays the % complete. |
-| `.pf-v5-c-progress__status-icon` | `<span>` |  Displays the status icon. (optional) |
-| `.pf-v5-c-progress__bar` | `<div>` |  Displays across the entire width and represents the completed state. |
-| `.pf-v5-c-progress__indicator` | `<div>` |  Displays with the `.pf-v5-c-progress__bar` to indicate the progress so far. |
-| `.pf-v5-c-progress__helper-text` | `<div>` |  Displays additional text below the progress bar. (optional) |
-| `.pf-m-lg` | `.pf-v5-c-progress` |  Modifies the progress bar to be larger. |
-| `.pf-m-sm` | `.pf-v5-c-progress` |  Modifies the progress bar to be smaller. |
-| `.pf-m-inside` | `.pf-v5-c-progress` |  Shows the measure within the progress indicator. NOTE: This option requires `.pf-m-lg`.|
-| `.pf-m-outside` | `.pf-v5-c-progress` |  Shows the measure and status icon to the right of the progress bar. |
-| `.pf-m-singleline` | `.pf-v5-c-progress` | Modifies the progress component to exist on one row. If a measure is needed, use with `.pf-m-inside` or `.pf-m-outside`|
-| `.pf-m-success` | `.pf-v5-c-progress` |  Changes the appearance of the progess component to indicate a success state. |
-| `.pf-m-warning` | `.pf-v5-c-progress` |  Changes the appearance of the progess component to indicate a warning state. |
-| `.pf-m-danger` | `.pf-v5-c-progress` |  Changes the appearance of the progess component to indicate a danger (failure) state. |
-| `.pf-m-truncate` | `.pf-v5-c-progress__description` | Modifies the description to display a single line and truncate any overflow text with ellipses. |
-| `.pf-m-static-width` | `.pf-v5-c-progress.pf-m-outside .pf-v5-c-progress__measure` | Modifies the measure element to have a static `min-width` that will hold 0-100%. Overridable by setting `--pf-v5-c-progress__measure--m-static-width--MinWidth`. |
+| `.pf-v6-c-progress` | `<div>` |  Initiates a progress component. |
+| `.pf-v6-c-progress__description` | `<div>` |  The description for a progress bar. |
+| `.pf-v6-c-progress__status` | `<div>` |  Displays the % of progress and status icons. |
+| `.pf-v6-c-progress__measure` | `<span>` |  Displays the % complete. |
+| `.pf-v6-c-progress__status-icon` | `<span>` |  Displays the status icon. (optional) |
+| `.pf-v6-c-progress__bar` | `<div>` |  Displays across the entire width and represents the completed state. |
+| `.pf-v6-c-progress__indicator` | `<div>` |  Displays with the `.pf-v6-c-progress__bar` to indicate the progress so far. |
+| `.pf-v6-c-progress__helper-text` | `<div>` |  Displays additional text below the progress bar. (optional) |
+| `.pf-m-lg` | `.pf-v6-c-progress` |  Modifies the progress bar to be larger. |
+| `.pf-m-sm` | `.pf-v6-c-progress` |  Modifies the progress bar to be smaller. |
+| `.pf-m-inside` | `.pf-v6-c-progress` |  Shows the measure within the progress indicator. NOTE: This option requires `.pf-m-lg`.|
+| `.pf-m-outside` | `.pf-v6-c-progress` |  Shows the measure and status icon to the right of the progress bar. |
+| `.pf-m-singleline` | `.pf-v6-c-progress` | Modifies the progress component to exist on one row. If a measure is needed, use with `.pf-m-inside` or `.pf-m-outside`|
+| `.pf-m-success` | `.pf-v6-c-progress` |  Changes the appearance of the progess component to indicate a success state. |
+| `.pf-m-warning` | `.pf-v6-c-progress` |  Changes the appearance of the progess component to indicate a warning state. |
+| `.pf-m-danger` | `.pf-v6-c-progress` |  Changes the appearance of the progess component to indicate a danger (failure) state. |
+| `.pf-m-truncate` | `.pf-v6-c-progress__description` | Modifies the description to display a single line and truncate any overflow text with ellipses. |
+| `.pf-m-static-width` | `.pf-v6-c-progress.pf-m-outside .pf-v6-c-progress__measure` | Modifies the measure element to have a static `min-width` that will hold 0-100%. Overridable by setting `--pf-v6-c-progress__measure--m-static-width--MinWidth`. |

package/docs/components/ProgressStepper/examples/ProgressStepper.md

@@ -1,7 +1,7 @@
 ---
 id: 'Progress stepper'
 section: components
-cssPrefix: pf-v5-c-progress-stepper
+cssPrefix: pf-v6-c-progress-stepper
 ---## Examples
 
 ### Basic
@@ -918,29 +918,29 @@ Steps can be modified with `.pf-m-success`, `.pf-m-warning`, `.pf-m-danger`, `.p
 
 | Attribute | Applied to | Outcome |
 | -- | -- | -- |
-| `aria-label="[State of the step]"` | `.pf-v5-c-progress-stepper__step` |  Provides an accessible label for the step. |
-| `aria-hidden="true"` | `.pf-v5-c-progress-stepper__step-icon <i>` |  Hides icon for assistive technologies. **Required** |
+| `aria-label="[State of the step]"` | `.pf-v6-c-progress-stepper__step` |  Provides an accessible label for the step. |
+| `aria-hidden="true"` | `.pf-v6-c-progress-stepper__step-icon <i>` |  Hides icon for assistive technologies. **Required** |
 
 ### Usage
 
 | Class | Applied to | Outcome |
 | -- | -- | -- |
-| `.pf-v5-c-progress-stepper` | `<ol>` | Applies default progress stepper styling. **Required** |
-| `.pf-v5-c-progress-stepper__step` | `<li>` | Defines each step of the progress stepper. **Required** |
+| `.pf-v6-c-progress-stepper` | `<ol>` | Applies default progress stepper styling. **Required** |
+| `.pf-v6-c-progress-stepper__step` | `<li>` | Defines each step of the progress stepper. **Required** |
 | `.progress-stepper__step-connector` | `<div>` | Creates the connecting line between steps **Required** |
 | `.progress-stepper__step-icon` | `<span>` | Creates the step node and contains the icon designating the type of step. This element is required, but may be empty if no icon is used for the step. **Required** |
 | `.progress-stepper__step-main` | `<div>` | Contains the main text content of the step. This element is required, but may be empty if title and description are not used. **Required** |
 | `.progress-stepper__step-title` | `<div>`, `<button>` | Contains the title of the step. **Note:** the step title is a `<button>` when it has `.pf-m-help-text` and is used to trigger a popover with help text. |
 | `.progress-stepper__step-description` | `<div>` | Contains the description of the step. |
-| `.pf-m-center`| `.pf-v5-c-progress-stepper` | Modifies to center each step. |
-| `.pf-m-vertical{-on-[breakpoint]}`| `.pf-v5-c-progress-stepper` | Modifies progress stepper vertical layout at optional [breakpoint](/developer-resources/global-css-variables#breakpoint-variables-and-class-suffixes). |
-| `.pf-m-horizontal{-on-[breakpoint]}`| `.pf-v5-c-progress-stepper` | Modifies progress stepper horizontal layout at optional [breakpoint](/developer-resources/global-css-variables#breakpoint-variables-and-class-suffixes). |
-| `.pf-m-compact`| `.pf-v5-c-progress-stepper` | Modifies for compact styling. |
-| `.pf-m-success`| `.pf-v5-c-progress-stepper__step` | Modifies for success styling. |
-| `.pf-m-warning`| `.pf-v5-c-progress-stepper__step` | Modifies for warning styling. |
-| `.pf-m-danger`| `.pf-v5-c-progress-stepper__step` | Modifies for danger styling. |
-| `.pf-m-info`| `.pf-v5-c-progress-stepper__step` | Modifies for info styling. |
-| `.pf-m-custom`| `.pf-v5-c-progress-stepper__step` | Modifies for custom styling. |
-| `.pf-m-current`| `.pf-v5-c-progress-stepper__step` | Modifies styling for the current step. |
-| `.pf-m-pending`| `.pf-v5-c-progress-stepper__step` | Modifies styling for pending steps. |
-| `.pf-m-help-text`| `.pf-v5-c-progress-stepper__step-title` | Modifies styling for steps that have help text. |
+| `.pf-m-center`| `.pf-v6-c-progress-stepper` | Modifies to center each step. |
+| `.pf-m-vertical{-on-[breakpoint]}`| `.pf-v6-c-progress-stepper` | Modifies progress stepper vertical layout at optional [breakpoint](/developer-resources/global-css-variables#breakpoint-variables-and-class-suffixes). |
+| `.pf-m-horizontal{-on-[breakpoint]}`| `.pf-v6-c-progress-stepper` | Modifies progress stepper horizontal layout at optional [breakpoint](/developer-resources/global-css-variables#breakpoint-variables-and-class-suffixes). |
+| `.pf-m-compact`| `.pf-v6-c-progress-stepper` | Modifies for compact styling. |
+| `.pf-m-success`| `.pf-v6-c-progress-stepper__step` | Modifies for success styling. |
+| `.pf-m-warning`| `.pf-v6-c-progress-stepper__step` | Modifies for warning styling. |
+| `.pf-m-danger`| `.pf-v6-c-progress-stepper__step` | Modifies for danger styling. |
+| `.pf-m-info`| `.pf-v6-c-progress-stepper__step` | Modifies for info styling. |
+| `.pf-m-custom`| `.pf-v6-c-progress-stepper__step` | Modifies for custom styling. |
+| `.pf-m-current`| `.pf-v6-c-progress-stepper__step` | Modifies styling for the current step. |
+| `.pf-m-pending`| `.pf-v6-c-progress-stepper__step` | Modifies styling for pending steps. |
+| `.pf-m-help-text`| `.pf-v6-c-progress-stepper__step-title` | Modifies styling for steps that have help text. |

package/docs/components/Radio/examples/Radio.md

@@ -2,7 +2,7 @@
 id: Radio
 section: components
 subsection: forms
-cssPrefix: pf-v5-c-radio
+cssPrefix: pf-v6-c-radio
 ---## Examples
 
 ### Basic
@@ -206,16 +206,16 @@ If you extend this component or modify the styles of this component, then make s
 | Attribute | Applied to | Outcome |
 | -- | -- | -- |
 | `disabled` | `<input type="radio">` | Indicates that the element is unavailable and removes it from keyboard focus. **Required when input is disabled** |
-| `aria-describedby` | `.pf-v5-c-radio__input` |  When using `.pf-v5-c-radio__description` make use of this on the input. |
+| `aria-describedby` | `.pf-v6-c-radio__input` |  When using `.pf-v6-c-radio__description` make use of this on the input. |
 
 ### Usage
 
 | Class | Applied to | Outcome |
 | -- | -- | -- |
-| `.pf-v5-c-radio` | `<div>`, `<label>` |  Initiates the radio component. **Required**  |
-| `.pf-v5-c-radio__input` | `<input type="radio">` |  Initiates a radio input. **Required**  |
-| `.pf-v5-c-radio__label` | `<label>`, `<span>` |  Initiates a label. **Required**  |
-| `.pf-v5-c-radio__description` | `<span>` | Initiates a radio description. |
-| `.pf-v5-c-radio__body` | `<span>` | Initiates a radio body. |
-| `.pf-m-standalone` | `.pf-v5-c-radio` |  Modifies the radio component for use with a standalone `<input type="radio">`. **Required when there is no label** |
-| `.pf-m-disabled` | `.pf-v5-c-radio__label` |  Modifies the radio component for the disabled state. **Required when input is disabled** |
+| `.pf-v6-c-radio` | `<div>`, `<label>` |  Initiates the radio component. **Required**  |
+| `.pf-v6-c-radio__input` | `<input type="radio">` |  Initiates a radio input. **Required**  |
+| `.pf-v6-c-radio__label` | `<label>`, `<span>` |  Initiates a label. **Required**  |
+| `.pf-v6-c-radio__description` | `<span>` | Initiates a radio description. |
+| `.pf-v6-c-radio__body` | `<span>` | Initiates a radio body. |
+| `.pf-m-standalone` | `.pf-v6-c-radio` |  Modifies the radio component for use with a standalone `<input type="radio">`. **Required when there is no label** |
+| `.pf-m-disabled` | `.pf-v6-c-radio__label` |  Modifies the radio component for the disabled state. **Required when input is disabled** |