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

package/docs/components/TreeView/examples/TreeView.md

@@ -1,7 +1,7 @@
 ---
 id: Tree view
 section: components
-cssPrefix: pf-v5-c-tree-view
+cssPrefix: pf-v6-c-tree-view
 ---## Examples
 
 ### Default
@@ -3440,38 +3440,38 @@ cssPrefix: pf-v5-c-tree-view
 
 | Attribute | Applied to | Outcome |
 | -- | -- | -- |
-| `role="tree"` | `.pf-v5-c-tree-view__list` | Identifies the `ul` as a tree widget. **Place on the outermost `ul` only** |
-| `role="group"` | `.pf-v5-c-tree-view__list` | Identifies the `ul` element as a container of treeitem elements that form a branch of the tree. **Place on all `ul`s except the first `ul`** |
-| `role="treeitem"` | `.pf-v5-c-tree-view__list-item` | Hides the implicit listitem role of the li element from assistive technologies. |
-| `aria-expanded="false"` | `.pf-v5-c-tree-view__list-item` | For an expandable item, indicates the parent node is closed, i.e., the descendant elements are not visible. |
-| `aria-expanded="true"` | `.pf-v5-c-tree-view__list-item.pf-m-expanded` | Indicates the parent node is open, i.e., the descendant elements are visible. |
-| `tabindex="-1"` | `.pf-v5-c-tree-view__list-item` | Makes the element with the treeitem role focusable without including it in the tab sequence of the page. |
-| `tabindex="0"` | `.pf-v5-c-tree-view__list-item` | Includes the element with the treeitem role in the tab sequence. Only one treeitem in the tree has tabindex="0". When the user moves focus in the tree, the element included in the tab sequence changes to the element with focus. |
-| `aria-label="[button label text]"` | `.pf-v5-c-tree-view__action` | Provides an accessible name for the button when an icon is used instead of text. **Required when icon is used with no supporting text** |
+| `role="tree"` | `.pf-v6-c-tree-view__list` | Identifies the `ul` as a tree widget. **Place on the outermost `ul` only** |
+| `role="group"` | `.pf-v6-c-tree-view__list` | Identifies the `ul` element as a container of treeitem elements that form a branch of the tree. **Place on all `ul`s except the first `ul`** |
+| `role="treeitem"` | `.pf-v6-c-tree-view__list-item` | Hides the implicit listitem role of the li element from assistive technologies. |
+| `aria-expanded="false"` | `.pf-v6-c-tree-view__list-item` | For an expandable item, indicates the parent node is closed, i.e., the descendant elements are not visible. |
+| `aria-expanded="true"` | `.pf-v6-c-tree-view__list-item.pf-m-expanded` | Indicates the parent node is open, i.e., the descendant elements are visible. |
+| `tabindex="-1"` | `.pf-v6-c-tree-view__list-item` | Makes the element with the treeitem role focusable without including it in the tab sequence of the page. |
+| `tabindex="0"` | `.pf-v6-c-tree-view__list-item` | Includes the element with the treeitem role in the tab sequence. Only one treeitem in the tree has tabindex="0". When the user moves focus in the tree, the element included in the tab sequence changes to the element with focus. |
+| `aria-label="[button label text]"` | `.pf-v6-c-tree-view__action` | Provides an accessible name for the button when an icon is used instead of text. **Required when icon is used with no supporting text** |
 
 ### Usage
 
 | Class | Applied | Outcome |
 | -- | -- | -- |
-| `.pf-v5-c-tree-view` | `<div>` | Initiates the tree view container. **Required** |
-| `.pf-v5-c-tree-view__list` | `<ul>` | Initiates a tree view list. **Required** |
-| `.pf-v5-c-tree-view__list-item` | `<li>` | Initiates a tree view list item. **Required** |
-| `.pf-v5-c-tree-view__content` | `<div>` | Initiates a tree view node. **Required** |
-| `.pf-v5-c-tree-view__node` | `<button>`, `<label>` | Initiates a tree view node. **Required** |
-| `.pf-v5-c-tree-view__node-container` | `<span>` | Initiates a tree view node container. **Required for compact variant** |
-| `.pf-v5-c-tree-view__node-content` | `<span>` | Initiates a tree view node content container used to stack elements. |
-| `.pf-v5-c-tree-view__node-count` | `<span>` | Initiates a tree view node count. |
-| `.pf-v5-c-tree-view__node-toggle` | `<span>`, `<button>` | Initiates a tree view toggle. |
-| `.pf-v5-c-tree-view__node-toggle-icon` | `<span>` | Initiates a tree view toggle icon. |
-| `.pf-v5-c-tree-view__node-title` | `<span>` | Initiates a tree view node title. |
-| `.pf-v5-c-tree-view__node-text` | `<span>`, `<button>` | Initiates tree view text. **Note:** Use a `<button>` when the node is expandable and selectable. |
-| `.pf-v5-c-tree-view__node-icon` | `<span>` | Initiates a tree view icon. |
-| `.pf-v5-c-tree-view__node-check` | `<span>` | Initiates a tree view check. |
-| `.pf-v5-c-tree-view__action` | `<div>` | Initiates a tree view action wrapper. |
-| `.pf-v5-c-tree-view__search` | `<div>` | Initiates a tree view search wrapper. |
-| `.pf-m-guides` | `.pf-v5-c-tree-view` | Modifies the tree view to the guides presentation. |
-| `.pf-m-compact` | `.pf-v5-c-tree-view` | Modifies the tree view to the compact presentation. |
-| `.pf-m-no-background` | `.pf-v5-c-tree-view.pf-m-compact` | Modifies the tree view compact variant node containers to have a transparent background. |
-| `.pf-m-current` | `.pf-v5-c-tree-view__node` | Modifies the tree view node to be current. |
-| `.pf-m-selectable` | `.pf-v5-c-tree-view__node` | For use on nodes that are expandable and selectable, when the default click action on the node selects it instead of expanding it. |
-| `.pf-m-truncate` | `.pf-v5-c-tree-view`, `.pf-v5-c-tree-view__node-title`, `.pf-v5-c-tree-view__node-text` | Modifies the tree view title or text to truncate. |
+| `.pf-v6-c-tree-view` | `<div>` | Initiates the tree view container. **Required** |
+| `.pf-v6-c-tree-view__list` | `<ul>` | Initiates a tree view list. **Required** |
+| `.pf-v6-c-tree-view__list-item` | `<li>` | Initiates a tree view list item. **Required** |
+| `.pf-v6-c-tree-view__content` | `<div>` | Initiates a tree view node. **Required** |
+| `.pf-v6-c-tree-view__node` | `<button>`, `<label>` | Initiates a tree view node. **Required** |
+| `.pf-v6-c-tree-view__node-container` | `<span>` | Initiates a tree view node container. **Required for compact variant** |
+| `.pf-v6-c-tree-view__node-content` | `<span>` | Initiates a tree view node content container used to stack elements. |
+| `.pf-v6-c-tree-view__node-count` | `<span>` | Initiates a tree view node count. |
+| `.pf-v6-c-tree-view__node-toggle` | `<span>`, `<button>` | Initiates a tree view toggle. |
+| `.pf-v6-c-tree-view__node-toggle-icon` | `<span>` | Initiates a tree view toggle icon. |
+| `.pf-v6-c-tree-view__node-title` | `<span>` | Initiates a tree view node title. |
+| `.pf-v6-c-tree-view__node-text` | `<span>`, `<button>` | Initiates tree view text. **Note:** Use a `<button>` when the node is expandable and selectable. |
+| `.pf-v6-c-tree-view__node-icon` | `<span>` | Initiates a tree view icon. |
+| `.pf-v6-c-tree-view__node-check` | `<span>` | Initiates a tree view check. |
+| `.pf-v6-c-tree-view__action` | `<div>` | Initiates a tree view action wrapper. |
+| `.pf-v6-c-tree-view__search` | `<div>` | Initiates a tree view search wrapper. |
+| `.pf-m-guides` | `.pf-v6-c-tree-view` | Modifies the tree view to the guides presentation. |
+| `.pf-m-compact` | `.pf-v6-c-tree-view` | Modifies the tree view to the compact presentation. |
+| `.pf-m-no-background` | `.pf-v6-c-tree-view.pf-m-compact` | Modifies the tree view compact variant node containers to have a transparent background. |
+| `.pf-m-current` | `.pf-v6-c-tree-view__node` | Modifies the tree view node to be current. |
+| `.pf-m-selectable` | `.pf-v6-c-tree-view__node` | For use on nodes that are expandable and selectable, when the default click action on the node selects it instead of expanding it. |
+| `.pf-m-truncate` | `.pf-v6-c-tree-view`, `.pf-v6-c-tree-view__node-title`, `.pf-v6-c-tree-view__node-text` | Modifies the tree view title or text to truncate. |

package/docs/components/Truncate/examples/Truncate.md

@@ -1,19 +1,19 @@
 ---
 id: 'Truncate'
 section: components
-cssPrefix: pf-v5-c-truncate
+cssPrefix: pf-v6-c-truncate
 ---import './Truncate.css'
 
 ## Examples
 
 ### Notes
 
-The truncate component contains two child elements, `.pf-v5-c-truncate__start` and `.pf-v5-c-truncate__end`. If both `start` and `end` are present within `.pf-v5-c-truncate`, trucation will occur in the middle of the string. If only `.pf-v5-c-truncate__start` is present, truncation will occur at the end of the string. If only `.pf-v5-c-truncate__end` is present, truncation will occur at the beginning of the string. A `.pf-v5-c-popover` will be automatically applied to the PatternFly React implementation. `‎` must be included at the end of string to denote the ending punctuation mark. Otherwise it will occur and the beggining of truncation for a `pf-v5-c-truncate__end` element.
+The truncate component contains two child elements, `.pf-v6-c-truncate__start` and `.pf-v6-c-truncate__end`. If both `start` and `end` are present within `.pf-v6-c-truncate`, trucation will occur in the middle of the string. If only `.pf-v6-c-truncate__start` is present, truncation will occur at the end of the string. If only `.pf-v6-c-truncate__end` is present, truncation will occur at the beginning of the string. A `.pf-v6-c-popover` will be automatically applied to the PatternFly React implementation. `‎` must be included at the end of string to denote the ending punctuation mark. Otherwise it will occur and the beggining of truncation for a `pf-v6-c-truncate__end` element.
 
 ### Default
 
 ```html
-<div class="pf-v5-c-truncate--example">
+<div class="pf-v6-c-truncate--example">
   <span class="pf-v6-c-truncate">
     <span
       class="pf-v6-c-truncate__start"
@@ -26,7 +26,7 @@ The truncate component contains two child elements, `.pf-v5-c-truncate__start` a
 ### Middle
 
 ```html
-<div class="pf-v5-c-truncate--example">
+<div class="pf-v6-c-truncate--example">
   <span class="pf-v6-c-truncate">
     <span
       class="pf-v6-c-truncate__start"
@@ -40,7 +40,7 @@ The truncate component contains two child elements, `.pf-v5-c-truncate__start` a
 ### Start
 
 ```html
-<div class="pf-v5-c-truncate--example">
+<div class="pf-v6-c-truncate--example">
   <span class="pf-v6-c-truncate">
     <span
       class="pf-v6-c-truncate__end"
@@ -56,6 +56,6 @@ The truncate component contains two child elements, `.pf-v5-c-truncate__start` a
 
 | Class | Applied | Outcome |
 | -- | -- | -- |
-| `.pf-v5-c-truncate` | `<span>` | Initiates the truncate component. |
-| `.pf-v5-c-truncate__start` | `<span>` | Defines the truncate component starting text. |
-| `.pf-v5-c-truncate__end` | `<span>` | Defines the truncate component ending text. |
+| `.pf-v6-c-truncate` | `<span>` | Initiates the truncate component. |
+| `.pf-v6-c-truncate__start` | `<span>` | Defines the truncate component starting text. |
+| `.pf-v6-c-truncate__end` | `<span>` | Defines the truncate component ending text. |

package/docs/components/Wizard/examples/Wizard.md

@@ -1,7 +1,7 @@
 ---
 id: Wizard
 section: components
-cssPrefix: pf-v5-c-wizard
+cssPrefix: pf-v6-c-wizard
 wrapperTag: div
 ---import './Wizard.css'
 
@@ -543,7 +543,7 @@ wrapperTag: div
             <div class="pf-v6-c-drawer__content">
               <div class="pf-v6-c-wizard__main-body">
                 <button
-                  class="pf-v6-c-button pf-v5-u-hidden pf-m-link pf-m-inline pf-v5-u-float-right pf-v5-u-ml-md"
+                  class="pf-v6-c-button pf-v6-u-hidden pf-m-link pf-m-inline pf-v5-u-float-right pf-v5-u-ml-md"
                   type="button"
                 >Open drawer</button>
                 <form class="pf-v6-c-form pf-m-limit-width" novalidate>
@@ -1352,52 +1352,52 @@ wrapperTag: div
 
 | Attribute | Applied to | Outcome |
 | -- | -- | -- |
-| `aria-expanded="true"` | `.pf-v5-c-wizard__toggle` | Indicates that the steps menu is visible. **Required** |
-| `aria-expanded="false"` | `.pf-v5-c-wizard__toggle` | Indicates that the steps menu is hidden. **Required** |
-| `aria-label="close"` | `.pf-v5-c-wizard__toggle-icon` | Gives the close button an accessible name. **Required** |
-| `aria-hidden="true"` | `.pf-v5-c-wizard__toggle-icon`, `.pf-v5-c-wizard__toggle-divider` | Hides the icon from assistive technologies. **Required** |
-| `aria-label="Steps"` | `.pf-v5-c-wizard__nav` | Gives the steps nav element an accessible name. **Required** |
-| `disabled` | `button.pf-v5-c-wizard__nav-link` | Indicates that the element is disabled. **Required when a nav item is disabled** |
-| `aria-disabled="true"` | `a.pf-v5-c-wizard__nav-link` | Indicates that the element is disabled. **Required for disabled links with `.pf-m-disabled`** |
-| `aria-current="page"` | `.pf-v5-c-wizard__nav-link` | Indicates the current page link. Can only occur once on page. **Required for the current link** |
-| `aria-expanded="true"` | `.pf-v5-c-wizard__nav-link` | Indicates that the link subnav is visible. **Required** |
-| `aria-expanded="false"` | `.pf-v5-c-wizard__nav-link` | Indicates that the link subnav is hidden. **Required** |
-| `tabindex="-1"` | `a.pf-v5-c-wizard__nav-link` | Removes a link from keyboard focus. **Required for disabled links with `.pf-m-disabled`** |
-| `tabindex="0"` | `.pf-v5-c-wizard__main` | If the wizard main section has overflow content that triggers a scrollbar, to ensure that the content is keyboard accessible, the section must include either a focusable element within the scrollable region or the section itself must be focusable by adding `tabindex="0"`. |
+| `aria-expanded="true"` | `.pf-v6-c-wizard__toggle` | Indicates that the steps menu is visible. **Required** |
+| `aria-expanded="false"` | `.pf-v6-c-wizard__toggle` | Indicates that the steps menu is hidden. **Required** |
+| `aria-label="close"` | `.pf-v6-c-wizard__toggle-icon` | Gives the close button an accessible name. **Required** |
+| `aria-hidden="true"` | `.pf-v6-c-wizard__toggle-icon`, `.pf-v6-c-wizard__toggle-divider` | Hides the icon from assistive technologies. **Required** |
+| `aria-label="Steps"` | `.pf-v6-c-wizard__nav` | Gives the steps nav element an accessible name. **Required** |
+| `disabled` | `button.pf-v6-c-wizard__nav-link` | Indicates that the element is disabled. **Required when a nav item is disabled** |
+| `aria-disabled="true"` | `a.pf-v6-c-wizard__nav-link` | Indicates that the element is disabled. **Required for disabled links with `.pf-m-disabled`** |
+| `aria-current="page"` | `.pf-v6-c-wizard__nav-link` | Indicates the current page link. Can only occur once on page. **Required for the current link** |
+| `aria-expanded="true"` | `.pf-v6-c-wizard__nav-link` | Indicates that the link subnav is visible. **Required** |
+| `aria-expanded="false"` | `.pf-v6-c-wizard__nav-link` | Indicates that the link subnav is hidden. **Required** |
+| `tabindex="-1"` | `a.pf-v6-c-wizard__nav-link` | Removes a link from keyboard focus. **Required for disabled links with `.pf-m-disabled`** |
+| `tabindex="0"` | `.pf-v6-c-wizard__main` | If the wizard main section has overflow content that triggers a scrollbar, to ensure that the content is keyboard accessible, the section must include either a focusable element within the scrollable region or the section itself must be focusable by adding `tabindex="0"`. |
 
 ### Usage
 
 | Class | Applied to | Outcome |
 | -- | -- | -- |
-| `.pf-v5-c-wizard` | `<div>` | Initiates the wizard component. **Required** |
-| `.pf-v5-c-wizard__header` | `<header>` | Initiates the header. **Required** when the wizard is in a modal. Not recommended to use when the wizard is placed on a page. |
-| `.pf-v5-c-wizard__close` | `<div>` | Initiates the close button. **Required** |
-| `.pf-v5-c-wizard__title` | `<div>` | Initiates the title container. **Required** |
-| `.pf-v5-c-wizard__title-text` | `<h1>`, `<h2>`, `<h3>`, `<h4>`, `<h5>`, `<h6>`, `<div>` | Initiates the wizard title text. |
-| `.pf-v5-c-wizard__description` | `<div>`, `<p>` | Initiates the description. |
-| `.pf-v5-c-wizard__toggle` | `<button>` | Initiates the mobile steps menu toggle button. **Required** |
-| `.pf-v5-c-wizard__toggle-list` | `<span>` | Initiates the toggle list. **Required** |
-| `.pf-v5-c-wizard__toggle-list-item` | `<span>` | Initiates a toggle list item. **Required** |
-| `.pf-v5-c-wizard__toggle-num` | `<span>` | Initiates the step number. **Required** |
-| `.pf-v5-c-wizard__toggle-separator` | `<i>` | Initiates the separator between steps. |
-| `.pf-v5-c-wizard__toggle-icon` | `<span>` | Initiates the toggle icon wrapper. **Required** |
-| `.pf-v5-c-wizard__outer-wrap` | `<div>` | Initiates the outer wrapper. **Required** |
-| `.pf-v5-c-wizard__inner-wrap` | `<div>` | Initiates the inner wrapper. **Required** |
-| `.pf-v5-c-wizard__nav` | `<nav>` | Initiates the steps nav. **Required** |
-| `.pf-v5-c-wizard__nav-list` | `<ol>` | Initiates a list of steps. **Required** |
-| `.pf-v5-c-wizard__nav-item` | `<li>` | Initiates a step list item. **Required** |
-| `.pf-v5-c-wizard__nav-link` | `<a>`, `<button>` | Initiates a step link. **Required** |
-| `.pf-v5-c-wizard__nav-link-text` | `<span>` | Initiates the link text container. **Required when nav item is expandable** |
-| `.pf-v5-c-wizard__nav-link-toggle` | `<span>` | Initiates the toggle container. **Required when nav item is expandable** |
-| `.pf-v5-c-wizard__nav-link-toggle-icon` | `<span>` | Initiates the toggle icon container. **Required when nav item is expandable** |
-| `.pf-v5-c-wizard__main` | `<main>`, `<div>` | Initiates the main container. **Required** Note: use the `<main>` element when when there are no other `<main>` elements on the page.|
-| `.pf-v5-c-wizard__main-body` | `<div>` | Initiates the main container body section. **Required** |
-| `.pf-v5-c-wizard__footer` | `<footer>` | Initiates the footer. **Required** |
-| `.pf-v5-c-wizard__footer-cancel` | `<div>` | Initiates the cancel button. **Required** |
-| `.pf-m-expanded` | `.pf-v5-c-wizard__toggle`, `.pf-v5-c-wizard__nav` | Modifies the mobile steps toggle and steps menu for the expanded state. |
-| `.pf-m-finished` | `.pf-v5-c-wizard` | Modifies the wizard for the finished state. |
-| `.pf-m-expandable` | `.pf-v5-c-wizard__nav-item` | Modifies a nav item for the expandable state. |
-| `.pf-m-expanded` | `.pf-v5-c-wizard__nav-item` | Modifies a nav item for the expanded state. |
-| `.pf-m-current` | `.pf-v5-c-wizard__nav-link` | Modifies a step link for the current state. **Required** |
-| `.pf-m-disabled` | `.pf-v5-c-wizard__nav-link` | Modifies a step link for the disabled state. |
-| `.pf-m-no-padding` | `.pf-v5-c-wizard__main-body` | Modifies the main container body to remove the padding. |
+| `.pf-v6-c-wizard` | `<div>` | Initiates the wizard component. **Required** |
+| `.pf-v6-c-wizard__header` | `<header>` | Initiates the header. **Required** when the wizard is in a modal. Not recommended to use when the wizard is placed on a page. |
+| `.pf-v6-c-wizard__close` | `<div>` | Initiates the close button. **Required** |
+| `.pf-v6-c-wizard__title` | `<div>` | Initiates the title container. **Required** |
+| `.pf-v6-c-wizard__title-text` | `<h1>`, `<h2>`, `<h3>`, `<h4>`, `<h5>`, `<h6>`, `<div>` | Initiates the wizard title text. |
+| `.pf-v6-c-wizard__description` | `<div>`, `<p>` | Initiates the description. |
+| `.pf-v6-c-wizard__toggle` | `<button>` | Initiates the mobile steps menu toggle button. **Required** |
+| `.pf-v6-c-wizard__toggle-list` | `<span>` | Initiates the toggle list. **Required** |
+| `.pf-v6-c-wizard__toggle-list-item` | `<span>` | Initiates a toggle list item. **Required** |
+| `.pf-v6-c-wizard__toggle-num` | `<span>` | Initiates the step number. **Required** |
+| `.pf-v6-c-wizard__toggle-separator` | `<i>` | Initiates the separator between steps. |
+| `.pf-v6-c-wizard__toggle-icon` | `<span>` | Initiates the toggle icon wrapper. **Required** |
+| `.pf-v6-c-wizard__outer-wrap` | `<div>` | Initiates the outer wrapper. **Required** |
+| `.pf-v6-c-wizard__inner-wrap` | `<div>` | Initiates the inner wrapper. **Required** |
+| `.pf-v6-c-wizard__nav` | `<nav>` | Initiates the steps nav. **Required** |
+| `.pf-v6-c-wizard__nav-list` | `<ol>` | Initiates a list of steps. **Required** |
+| `.pf-v6-c-wizard__nav-item` | `<li>` | Initiates a step list item. **Required** |
+| `.pf-v6-c-wizard__nav-link` | `<a>`, `<button>` | Initiates a step link. **Required** |
+| `.pf-v6-c-wizard__nav-link-text` | `<span>` | Initiates the link text container. **Required when nav item is expandable** |
+| `.pf-v6-c-wizard__nav-link-toggle` | `<span>` | Initiates the toggle container. **Required when nav item is expandable** |
+| `.pf-v6-c-wizard__nav-link-toggle-icon` | `<span>` | Initiates the toggle icon container. **Required when nav item is expandable** |
+| `.pf-v6-c-wizard__main` | `<main>`, `<div>` | Initiates the main container. **Required** Note: use the `<main>` element when when there are no other `<main>` elements on the page.|
+| `.pf-v6-c-wizard__main-body` | `<div>` | Initiates the main container body section. **Required** |
+| `.pf-v6-c-wizard__footer` | `<footer>` | Initiates the footer. **Required** |
+| `.pf-v6-c-wizard__footer-cancel` | `<div>` | Initiates the cancel button. **Required** |
+| `.pf-m-expanded` | `.pf-v6-c-wizard__toggle`, `.pf-v6-c-wizard__nav` | Modifies the mobile steps toggle and steps menu for the expanded state. |
+| `.pf-m-finished` | `.pf-v6-c-wizard` | Modifies the wizard for the finished state. |
+| `.pf-m-expandable` | `.pf-v6-c-wizard__nav-item` | Modifies a nav item for the expandable state. |
+| `.pf-m-expanded` | `.pf-v6-c-wizard__nav-item` | Modifies a nav item for the expanded state. |
+| `.pf-m-current` | `.pf-v6-c-wizard__nav-link` | Modifies a step link for the current state. **Required** |
+| `.pf-m-disabled` | `.pf-v6-c-wizard__nav-link` | Modifies a step link for the disabled state. |
+| `.pf-m-no-padding` | `.pf-v6-c-wizard__main-body` | Modifies the main container body to remove the padding. |

package/docs/demos/Banner/examples/Banner.md

@@ -1,7 +1,7 @@
 ---
 id: 'Banner'
 section: components
-cssPrefix: pf-v5-c-banner
+cssPrefix: pf-v6-c-banner
 wrapperTag: div
 ---## Examples
 

package/docs/demos/Card/examples/Card.md

@@ -1449,9 +1449,10 @@ wrapperTag: div
                     >
                       <thead class="pf-v6-c-table__thead">
                         <tr class="pf-v6-c-table__tr">
-                          <td class="pf-v6-c-table__td" role="cell"></td>
+                          <td class="pf-v6-c-table__td"></td>
 
                           <th class="pf-v6-c-table__th" scope="col">Components</th>
+
                           <th
                             class="pf-v6-c-table__th pf-m-fit-content"
                             scope="col"
@@ -1460,18 +1461,16 @@ wrapperTag: div
                       </thead>
 
                       <tbody class="pf-v6-c-table__tbody pf-m-expanded">
-                        <tr class="pf-v6-c-table__tr">
+                        <tr class="pf-v6-c-table__tr pf-m-expanded">
                           <td
                             class="pf-v6-c-table__td pf-v6-c-table__toggle"
                             role="cell"
                           >
                             <button
-                              class="pf-v6-c-button pf-m-plain pf-m-expanded"
-                              aria-labelledby="status-card-expanded-with-popover-example-popover-table-node1 expandable-toggle1"
-                              id="expandable-toggle1"
-                              aria-label="Details"
-                              aria-controls="status-card-expanded-with-popover-example-popover-table-content1"
+                              class="pf-v6-c-button pf-m-expanded pf-m-plain"
+                              type="button"
                               aria-expanded="true"
+                              aria-label="Toggle row"
                             >
                               <div class="pf-v6-c-table__toggle-icon">
                                 <i class="fas fa-angle-down" aria-hidden="true"></i>
@@ -1542,10 +1541,8 @@ wrapperTag: div
                           >
                             <button
                               class="pf-v6-c-button pf-m-plain"
-                              aria-labelledby="status-card-expanded-with-popover-example-popover-table-node1 expandable-toggle2"
-                              id="expandable-toggle2"
-                              aria-label="Details"
-                              aria-controls="status-card-expanded-with-popover-example-popover-table-content2"
+                              type="button"
+                              aria-label="Toggle row"
                             >
                               <div class="pf-v6-c-table__toggle-icon">
                                 <i class="fas fa-angle-down" aria-hidden="true"></i>
@@ -1602,10 +1599,8 @@ wrapperTag: div
                           >
                             <button
                               class="pf-v6-c-button pf-m-plain"
-                              aria-labelledby="status-card-expanded-with-popover-example-popover-table-node1 expandable-toggle3"
-                              id="expandable-toggle3"
-                              aria-label="Details"
-                              aria-controls="status-card-expanded-with-popover-example-popover-table-content3"
+                              type="button"
+                              aria-label="Toggle row"
                             >
                               <div class="pf-v6-c-table__toggle-icon">
                                 <i class="fas fa-angle-down" aria-hidden="true"></i>
@@ -1660,10 +1655,8 @@ wrapperTag: div
                           >
                             <button
                               class="pf-v6-c-button pf-m-plain"
-                              aria-labelledby="status-card-expanded-with-popover-example-popover-table-node1 expandable-toggle4"
-                              id="expandable-toggle4"
-                              aria-label="Details"
-                              aria-controls="status-card-expanded-with-popover-example-popover-table-content4"
+                              type="button"
+                              aria-label="Toggle row"
                             >
                               <div class="pf-v6-c-table__toggle-icon">
                                 <i class="fas fa-angle-down" aria-hidden="true"></i>