@patternfly/patternfly 6.0.0-alpha.225 → 6.0.0-alpha.227

package/components/ExpandableSection/expandable-section.css

@@ -27,7 +27,6 @@
   display: flex;
   flex-direction: column;
   gap: var(--pf-v6-c-expandable-section--Gap);
-  align-items: start;
 }
 .pf-v6-c-expandable-section.pf-m-expanded {
   --pf-v6-c-expandable-section__toggle-icon--Rotate: var(--pf-v6-c-expandable-section--m-expanded__toggle-icon--Rotate);

package/components/ExpandableSection/expandable-section.scss

@@ -41,7 +41,6 @@
   display: flex;
   flex-direction: column;
   gap: var(--#{$expandable-section}--Gap);
-  align-items: start;
 
   &.pf-m-expanded {
     --#{$expandable-section}__toggle-icon--Rotate: var(--#{$expandable-section}--m-expanded__toggle-icon--Rotate);

package/components/Table/table.css

@@ -300,6 +300,11 @@
 .pf-v6-c-table thead:where(.pf-v6-c-table__thead) {
   --pf-v6-c-table--cell--FontSize: var(--pf-v6-c-table__thead--cell--FontSize);
   --pf-v6-c-table--cell--FontWeight: var(--pf-v6-c-table__thead--cell--FontWeight);
+  --pf-v6-c-table--cell--MinWidth: var(--pf-v6-c-table--m-truncate--cell--MinWidth);
+  --pf-v6-c-table--cell--MaxWidth: var(--pf-v6-c-table--m-truncate--cell--MaxWidth);
+  --pf-v6-c-table--cell--Overflow: hidden;
+  --pf-v6-c-table--cell--TextOverflow: ellipsis;
+  --pf-v6-c-table--cell--WhiteSpace: nowrap;
 }
 .pf-v6-c-table thead:where(.pf-v6-c-table__thead).pf-m-nested-column-header button:where(.pf-v6-c-button) {
   outline-offset: var(--pf-v6-c-table__thead--m-nested-column-header--button--OutlineOffset);
@@ -326,40 +331,6 @@
 .pf-v6-c-table :where(.pf-v6-c-table__th, .pf-v6-c-table__td).pf-m-help {
   min-width: var(--pf-v6-c-table__th--m-help--MinWidth);
 }
-.pf-v6-c-table > thead, .pf-v6-c-table :where([class*=pf-v6-c-table]).pf-m-truncate, :where(.pf-v6-c-table) > :is(thead, tbody).pf-m-truncate {
-  --pf-v6-c-table--cell--MinWidth: var(--pf-v6-c-table--m-truncate--cell--MinWidth);
-  --pf-v6-c-table--cell--MaxWidth: var(--pf-v6-c-table--m-truncate--cell--MaxWidth);
-  --pf-v6-c-table--cell--Overflow: hidden;
-  --pf-v6-c-table--cell--TextOverflow: ellipsis;
-  --pf-v6-c-table--cell--WhiteSpace: nowrap;
-}
-
-.pf-v6-c-table :where([class*=pf-v6-c-table]).pf-m-wrap, :where(.pf-v6-c-table) > :is(thead, tbody).pf-m-wrap {
-  --pf-v6-c-table--cell--MinWidth: 0;
-  --pf-v6-c-table--cell--MaxWidth: none;
-  --pf-v6-c-table--cell--Overflow: visible;
-  --pf-v6-c-table--cell--TextOverflow: clip;
-  --pf-v6-c-table--cell--WhiteSpace: normal;
-}
-.pf-v6-c-table :where([class*=pf-v6-c-table]).pf-m-nowrap, :where(.pf-v6-c-table) > :is(thead, tbody).pf-m-nowrap {
-  --pf-v6-c-table--cell--MinWidth: 0;
-  --pf-v6-c-table--cell--MaxWidth: none;
-  --pf-v6-c-table--cell--Overflow: visible;
-  --pf-v6-c-table--cell--TextOverflow: clip;
-  --pf-v6-c-table--cell--WhiteSpace: nowrap;
-}
-.pf-v6-c-table :where([class*=pf-v6-c-table]) .pf-v6-c-table__icon, .pf-v6-c-table :where([class*=pf-v6-c-table]).pf-m-fit-content, :where(.pf-v6-c-table) > :is(thead, tbody) .pf-v6-c-table__icon, :where(.pf-v6-c-table) > :is(thead, tbody).pf-m-fit-content {
-  --pf-v6-c-table--cell--MinWidth: fit-content;
-  --pf-v6-c-table--cell--MaxWidth: none;
-  --pf-v6-c-table--cell--Width: 1%;
-  --pf-v6-c-table--cell--Overflow: visible;
-  --pf-v6-c-table--cell--TextOverflow: clip;
-  --pf-v6-c-table--cell--WhiteSpace: nowrap;
-}
-.pf-v6-c-table :where([class*=pf-v6-c-table]).pf-m-break-word, :where(.pf-v6-c-table) > :is(thead, tbody).pf-m-break-word {
-  --pf-v6-c-table--cell--WordBreak: break-word;
-  --pf-v6-c-table--cell--WhiteSpace: normal;
-}
 .pf-v6-c-table.pf-m-no-border-rows > tbody:where(.pf-v6-c-table__tbody) {
   --pf-v6-c-table__tr--BorderBlockEndWidth: 0;
   --pf-v6-c-table__tbody--BorderBlockEndWidth: 0;
@@ -423,6 +394,40 @@
   --pf-v6-c-table__sort-indicator--MarginInlineStart: 0;
 }
 
+[class*=pf-v6-c-table].pf-m-truncate {
+  --pf-v6-c-table--cell--MinWidth: var(--pf-v6-c-table--m-truncate--cell--MinWidth);
+  --pf-v6-c-table--cell--MaxWidth: var(--pf-v6-c-table--m-truncate--cell--MaxWidth);
+  --pf-v6-c-table--cell--Overflow: hidden;
+  --pf-v6-c-table--cell--TextOverflow: ellipsis;
+  --pf-v6-c-table--cell--WhiteSpace: nowrap;
+}
+[class*=pf-v6-c-table].pf-m-wrap {
+  --pf-v6-c-table--cell--MinWidth: 0;
+  --pf-v6-c-table--cell--MaxWidth: none;
+  --pf-v6-c-table--cell--Overflow: visible;
+  --pf-v6-c-table--cell--TextOverflow: clip;
+  --pf-v6-c-table--cell--WhiteSpace: normal;
+}
+[class*=pf-v6-c-table].pf-m-nowrap {
+  --pf-v6-c-table--cell--MinWidth: 0;
+  --pf-v6-c-table--cell--MaxWidth: none;
+  --pf-v6-c-table--cell--Overflow: visible;
+  --pf-v6-c-table--cell--TextOverflow: clip;
+  --pf-v6-c-table--cell--WhiteSpace: nowrap;
+}
+[class*=pf-v6-c-table] .pf-v6-c-table__icon, [class*=pf-v6-c-table].pf-m-fit-content {
+  --pf-v6-c-table--cell--MinWidth: fit-content;
+  --pf-v6-c-table--cell--MaxWidth: none;
+  --pf-v6-c-table--cell--Width: 1%;
+  --pf-v6-c-table--cell--Overflow: visible;
+  --pf-v6-c-table--cell--TextOverflow: clip;
+  --pf-v6-c-table--cell--WhiteSpace: nowrap;
+}
+[class*=pf-v6-c-table].pf-m-break-word {
+  --pf-v6-c-table--cell--WordBreak: break-word;
+  --pf-v6-c-table--cell--WhiteSpace: normal;
+}
+
 .pf-v6-c-table__text {
   --pf-v6-c-table--cell--MaxWidth: 100%;
   position: relative;

package/components/Table/table.scss

@@ -400,6 +400,11 @@
   thead:where(.#{$table}__thead) {
     --#{$table}--cell--FontSize: var(--#{$table}__thead--cell--FontSize);
     --#{$table}--cell--FontWeight: var(--#{$table}__thead--cell--FontWeight);
+    --#{$table}--cell--MinWidth: var(--#{$table}--m-truncate--cell--MinWidth);
+    --#{$table}--cell--MaxWidth: var(--#{$table}--m-truncate--cell--MaxWidth);
+    --#{$table}--cell--Overflow: hidden;
+    --#{$table}--cell--TextOverflow: ellipsis;
+    --#{$table}--cell--WhiteSpace: nowrap;
 
     // stylelint-disable
     &.pf-m-nested-column-header {
@@ -464,50 +469,6 @@
     }
   }
 
-  // - Table truncate - Table wrap - Table nowrap - Table fit content - Table wrap - Table break word
-  :where([class*='#{$table}']),
-  :where(&) > :is(thead, tbody) {
-    @at-root .#{$table} > thead,
-    &.pf-m-truncate {
-      --#{$table}--cell--MinWidth: var(--#{$table}--m-truncate--cell--MinWidth);
-      --#{$table}--cell--MaxWidth: var(--#{$table}--m-truncate--cell--MaxWidth);
-      --#{$table}--cell--Overflow: hidden;
-      --#{$table}--cell--TextOverflow: ellipsis;
-      --#{$table}--cell--WhiteSpace: nowrap;
-    }
-
-    &.pf-m-wrap {
-      --#{$table}--cell--MinWidth: 0;
-      --#{$table}--cell--MaxWidth: none;
-      --#{$table}--cell--Overflow: visible;
-      --#{$table}--cell--TextOverflow: clip;
-      --#{$table}--cell--WhiteSpace: normal;
-    }
-
-    &.pf-m-nowrap {
-      --#{$table}--cell--MinWidth: 0;
-      --#{$table}--cell--MaxWidth: none;
-      --#{$table}--cell--Overflow: visible;
-      --#{$table}--cell--TextOverflow: clip;
-      --#{$table}--cell--WhiteSpace: nowrap;
-    }
-
-    .#{$table}__icon,
-    &.pf-m-fit-content {
-      --#{$table}--cell--MinWidth: fit-content;
-      --#{$table}--cell--MaxWidth: none;
-      --#{$table}--cell--Width: 1%;
-      --#{$table}--cell--Overflow: visible;
-      --#{$table}--cell--TextOverflow: clip;
-      --#{$table}--cell--WhiteSpace: nowrap;
-    }
-
-    &.pf-m-break-word {
-      --#{$table}--cell--WordBreak: break-word;
-      --#{$table}--cell--WhiteSpace: normal;
-    }
-  }
-
   // stylelint-disable selector-no-qualifying-type, selector-max-compound-selectors
   &.pf-m-no-border-rows > tbody:where(.#{$table}__tbody) {
     --#{$table}__tr--BorderBlockEndWidth: 0;
@@ -599,6 +560,48 @@
   }
 }
 
+// - Table truncate - Table wrap - Table nowrap - Table fit content - Table wrap - Table break word
+[class*='#{$table}'] {
+  &.pf-m-truncate {
+    --#{$table}--cell--MinWidth: var(--#{$table}--m-truncate--cell--MinWidth);
+    --#{$table}--cell--MaxWidth: var(--#{$table}--m-truncate--cell--MaxWidth);
+    --#{$table}--cell--Overflow: hidden;
+    --#{$table}--cell--TextOverflow: ellipsis;
+    --#{$table}--cell--WhiteSpace: nowrap;
+  }
+
+  &.pf-m-wrap {
+    --#{$table}--cell--MinWidth: 0;
+    --#{$table}--cell--MaxWidth: none;
+    --#{$table}--cell--Overflow: visible;
+    --#{$table}--cell--TextOverflow: clip;
+    --#{$table}--cell--WhiteSpace: normal;
+  }
+
+  &.pf-m-nowrap {
+    --#{$table}--cell--MinWidth: 0;
+    --#{$table}--cell--MaxWidth: none;
+    --#{$table}--cell--Overflow: visible;
+    --#{$table}--cell--TextOverflow: clip;
+    --#{$table}--cell--WhiteSpace: nowrap;
+  }
+
+  .#{$table}__icon,
+  &.pf-m-fit-content {
+    --#{$table}--cell--MinWidth: fit-content;
+    --#{$table}--cell--MaxWidth: none;
+    --#{$table}--cell--Width: 1%;
+    --#{$table}--cell--Overflow: visible;
+    --#{$table}--cell--TextOverflow: clip;
+    --#{$table}--cell--WhiteSpace: nowrap;
+  }
+
+  &.pf-m-break-word {
+    --#{$table}--cell--WordBreak: break-word;
+    --#{$table}--cell--WhiteSpace: normal;
+  }
+}
+
 // - Table text
 .#{$table}__text {
   --#{$table}--cell--MaxWidth: 100%;
@@ -947,7 +950,7 @@
   }
 
   @at-root :not(.#{$table}__control-row) ~ .#{$table}__expandable-row {
-    > .#{$table}__th, 
+    > .#{$table}__th,
     > .#{$table}__td {
       padding-block-start: 0;
     }

package/components/_index.css

@@ -6118,7 +6118,6 @@ ul) {
   display: flex;
   flex-direction: column;
   gap: var(--pf-v6-c-expandable-section--Gap);
-  align-items: start;
 }
 .pf-v6-c-expandable-section.pf-m-expanded {
   --pf-v6-c-expandable-section__toggle-icon--Rotate: var(--pf-v6-c-expandable-section--m-expanded__toggle-icon--Rotate);
@@ -16388,6 +16387,11 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
 .pf-v6-c-table thead:where(.pf-v6-c-table__thead) {
   --pf-v6-c-table--cell--FontSize: var(--pf-v6-c-table__thead--cell--FontSize);
   --pf-v6-c-table--cell--FontWeight: var(--pf-v6-c-table__thead--cell--FontWeight);
+  --pf-v6-c-table--cell--MinWidth: var(--pf-v6-c-table--m-truncate--cell--MinWidth);
+  --pf-v6-c-table--cell--MaxWidth: var(--pf-v6-c-table--m-truncate--cell--MaxWidth);
+  --pf-v6-c-table--cell--Overflow: hidden;
+  --pf-v6-c-table--cell--TextOverflow: ellipsis;
+  --pf-v6-c-table--cell--WhiteSpace: nowrap;
 }
 .pf-v6-c-table thead:where(.pf-v6-c-table__thead).pf-m-nested-column-header button:where(.pf-v6-c-button) {
   outline-offset: var(--pf-v6-c-table__thead--m-nested-column-header--button--OutlineOffset);
@@ -16414,40 +16418,6 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
 .pf-v6-c-table :where(.pf-v6-c-table__th, .pf-v6-c-table__td).pf-m-help {
   min-width: var(--pf-v6-c-table__th--m-help--MinWidth);
 }
-.pf-v6-c-table > thead, .pf-v6-c-table :where([class*=pf-v6-c-table]).pf-m-truncate, :where(.pf-v6-c-table) > :is(thead, tbody).pf-m-truncate {
-  --pf-v6-c-table--cell--MinWidth: var(--pf-v6-c-table--m-truncate--cell--MinWidth);
-  --pf-v6-c-table--cell--MaxWidth: var(--pf-v6-c-table--m-truncate--cell--MaxWidth);
-  --pf-v6-c-table--cell--Overflow: hidden;
-  --pf-v6-c-table--cell--TextOverflow: ellipsis;
-  --pf-v6-c-table--cell--WhiteSpace: nowrap;
-}
-
-.pf-v6-c-table :where([class*=pf-v6-c-table]).pf-m-wrap, :where(.pf-v6-c-table) > :is(thead, tbody).pf-m-wrap {
-  --pf-v6-c-table--cell--MinWidth: 0;
-  --pf-v6-c-table--cell--MaxWidth: none;
-  --pf-v6-c-table--cell--Overflow: visible;
-  --pf-v6-c-table--cell--TextOverflow: clip;
-  --pf-v6-c-table--cell--WhiteSpace: normal;
-}
-.pf-v6-c-table :where([class*=pf-v6-c-table]).pf-m-nowrap, :where(.pf-v6-c-table) > :is(thead, tbody).pf-m-nowrap {
-  --pf-v6-c-table--cell--MinWidth: 0;
-  --pf-v6-c-table--cell--MaxWidth: none;
-  --pf-v6-c-table--cell--Overflow: visible;
-  --pf-v6-c-table--cell--TextOverflow: clip;
-  --pf-v6-c-table--cell--WhiteSpace: nowrap;
-}
-.pf-v6-c-table :where([class*=pf-v6-c-table]) .pf-v6-c-table__icon, .pf-v6-c-table :where([class*=pf-v6-c-table]).pf-m-fit-content, :where(.pf-v6-c-table) > :is(thead, tbody) .pf-v6-c-table__icon, :where(.pf-v6-c-table) > :is(thead, tbody).pf-m-fit-content {
-  --pf-v6-c-table--cell--MinWidth: fit-content;
-  --pf-v6-c-table--cell--MaxWidth: none;
-  --pf-v6-c-table--cell--Width: 1%;
-  --pf-v6-c-table--cell--Overflow: visible;
-  --pf-v6-c-table--cell--TextOverflow: clip;
-  --pf-v6-c-table--cell--WhiteSpace: nowrap;
-}
-.pf-v6-c-table :where([class*=pf-v6-c-table]).pf-m-break-word, :where(.pf-v6-c-table) > :is(thead, tbody).pf-m-break-word {
-  --pf-v6-c-table--cell--WordBreak: break-word;
-  --pf-v6-c-table--cell--WhiteSpace: normal;
-}
 .pf-v6-c-table.pf-m-no-border-rows > tbody:where(.pf-v6-c-table__tbody) {
   --pf-v6-c-table__tr--BorderBlockEndWidth: 0;
   --pf-v6-c-table__tbody--BorderBlockEndWidth: 0;
@@ -16511,6 +16481,40 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
   --pf-v6-c-table__sort-indicator--MarginInlineStart: 0;
 }
 
+[class*=pf-v6-c-table].pf-m-truncate {
+  --pf-v6-c-table--cell--MinWidth: var(--pf-v6-c-table--m-truncate--cell--MinWidth);
+  --pf-v6-c-table--cell--MaxWidth: var(--pf-v6-c-table--m-truncate--cell--MaxWidth);
+  --pf-v6-c-table--cell--Overflow: hidden;
+  --pf-v6-c-table--cell--TextOverflow: ellipsis;
+  --pf-v6-c-table--cell--WhiteSpace: nowrap;
+}
+[class*=pf-v6-c-table].pf-m-wrap {
+  --pf-v6-c-table--cell--MinWidth: 0;
+  --pf-v6-c-table--cell--MaxWidth: none;
+  --pf-v6-c-table--cell--Overflow: visible;
+  --pf-v6-c-table--cell--TextOverflow: clip;
+  --pf-v6-c-table--cell--WhiteSpace: normal;
+}
+[class*=pf-v6-c-table].pf-m-nowrap {
+  --pf-v6-c-table--cell--MinWidth: 0;
+  --pf-v6-c-table--cell--MaxWidth: none;
+  --pf-v6-c-table--cell--Overflow: visible;
+  --pf-v6-c-table--cell--TextOverflow: clip;
+  --pf-v6-c-table--cell--WhiteSpace: nowrap;
+}
+[class*=pf-v6-c-table] .pf-v6-c-table__icon, [class*=pf-v6-c-table].pf-m-fit-content {
+  --pf-v6-c-table--cell--MinWidth: fit-content;
+  --pf-v6-c-table--cell--MaxWidth: none;
+  --pf-v6-c-table--cell--Width: 1%;
+  --pf-v6-c-table--cell--Overflow: visible;
+  --pf-v6-c-table--cell--TextOverflow: clip;
+  --pf-v6-c-table--cell--WhiteSpace: nowrap;
+}
+[class*=pf-v6-c-table].pf-m-break-word {
+  --pf-v6-c-table--cell--WordBreak: break-word;
+  --pf-v6-c-table--cell--WhiteSpace: normal;
+}
+
 .pf-v6-c-table__text {
   --pf-v6-c-table--cell--MaxWidth: 100%;
   position: relative;

package/docs/components/Check/examples/Check.md

@@ -8,7 +8,7 @@ cssPrefix: pf-v6-c-check
 ### Basic
 
 ```html
-<div class="pf-v6-c-check" id="basic-example-example">
+<div class="pf-v6-c-check">
   <input
     class="pf-v6-c-check__input"
     type="checkbox"
@@ -23,7 +23,7 @@ cssPrefix: pf-v6-c-check
 ### Required
 
 ```html
-<div class="pf-v6-c-check" id="check-required-example">
+<div class="pf-v6-c-check">
   <input
     class="pf-v6-c-check__input"
     type="checkbox"
@@ -41,7 +41,7 @@ cssPrefix: pf-v6-c-check
 ### Checked
 
 ```html
-<div class="pf-v6-c-check" id="check-checked-example">
+<div class="pf-v6-c-check">
   <input
     class="pf-v6-c-check__input"
     type="checkbox"
@@ -60,11 +60,7 @@ cssPrefix: pf-v6-c-check
 ### Label wrapping input
 
 ```html
-<label
-  class="pf-v6-c-check"
-  id="check-label-wrapping-input-example"
-  for="check-label-wrapping-input-example-input"
->
+<label class="pf-v6-c-check" for="check-label-wrapping-input-example-input">
   <input
     class="pf-v6-c-check__input"
     type="checkbox"
@@ -79,7 +75,7 @@ cssPrefix: pf-v6-c-check
 ### Reversed
 
 ```html
-<div class="pf-v6-c-check" id="check-reversed-example">
+<div class="pf-v6-c-check">
   <label
     class="pf-v6-c-check__label"
     for="check-reversed-example-input"
@@ -97,7 +93,7 @@ cssPrefix: pf-v6-c-check
 ### Disabled
 
 ```html
-<div class="pf-v6-c-check" id="check-disabled-example">
+<div class="pf-v6-c-check">
   <input
     class="pf-v6-c-check__input"
     type="checkbox"
@@ -110,7 +106,7 @@ cssPrefix: pf-v6-c-check
     for="check-disabled-example-input"
   >Check disabled</label>
 </div>
-<div class="pf-v6-c-check" id="check-disabled-checked-example">
+<div class="pf-v6-c-check">
   <input
     class="pf-v6-c-check__input"
     type="checkbox"
@@ -130,7 +126,7 @@ cssPrefix: pf-v6-c-check
 ### With description
 
 ```html
-<div class="pf-v6-c-check" id="check-with-example-description-example">
+<div class="pf-v6-c-check">
   <input
     class="pf-v6-c-check__input"
     type="checkbox"
@@ -153,7 +149,7 @@ cssPrefix: pf-v6-c-check
 ### With body
 
 ```html
-<div class="pf-v6-c-check" id="check-with-example-body-example">
+<div class="pf-v6-c-check">
   <input
     class="pf-v6-c-check__input"
     type="checkbox"
@@ -172,7 +168,7 @@ cssPrefix: pf-v6-c-check
 ### With description and body
 
 ```html
-<div class="pf-v6-c-check" id="check-with-example-description-body-example">
+<div class="pf-v6-c-check">
   <input
     class="pf-v6-c-check__input"
     type="checkbox"
@@ -198,7 +194,6 @@ cssPrefix: pf-v6-c-check
 ```html
 <label
   class="pf-v6-c-check pf-m-standalone"
-  id="standalone-input-example"
   for="standalone-input-example-input"
 >
   <input

package/docs/components/DataList/examples/DataList.md

@@ -129,7 +129,6 @@ When a list item includes more than one block of content, it can be difficult fo
         <div class="pf-v6-c-data-list__check">
           <label
             class="pf-v6-c-check pf-m-standalone"
-            id="data-list-checkboxes-actions-addl-cells-item-1&quot;"
             for="data-list-checkboxes-actions-addl-cells-item-1&quot;-input"
           >
             <input
@@ -188,7 +187,6 @@ When a list item includes more than one block of content, it can be difficult fo
         <div class="pf-v6-c-data-list__check">
           <label
             class="pf-v6-c-check pf-m-standalone"
-            id="data-list-checkboxes-actions-addl-cells-item-2&quot;"
             for="data-list-checkboxes-actions-addl-cells-item-2&quot;-input"
           >
             <input
@@ -248,7 +246,6 @@ When a list item includes more than one block of content, it can be difficult fo
         <div class="pf-v6-c-data-list__check">
           <label
             class="pf-v6-c-check pf-m-standalone"
-            id="data-list-checkboxes-actions-addl-cells-item-3&quot;"
             for="data-list-checkboxes-actions-addl-cells-item-3&quot;-input"
           >
             <input
@@ -1111,7 +1108,6 @@ When a list item includes more than one block of content, it can be difficult fo
         <div class="pf-v6-c-data-list__check">
           <label
             class="pf-v6-c-check pf-m-standalone"
-            id="data-list-compact-item-1&quot;"
             for="data-list-compact-item-1&quot;-input"
           >
             <input
@@ -1168,7 +1164,6 @@ When a list item includes more than one block of content, it can be difficult fo
         <div class="pf-v6-c-data-list__check">
           <label
             class="pf-v6-c-check pf-m-standalone"
-            id="data-list-compact-item-2&quot;"
             for="data-list-compact-item-2&quot;-input"
           >
             <input
@@ -1226,7 +1221,6 @@ When a list item includes more than one block of content, it can be difficult fo
         <div class="pf-v6-c-data-list__check">
           <label
             class="pf-v6-c-check pf-m-standalone"
-            id="data-list-compact-item-3&quot;"
             for="data-list-compact-item-3&quot;-input"
           >
             <input
@@ -1328,7 +1322,6 @@ When a list item includes more than one block of content, it can be difficult fo
         <div class="pf-v6-c-data-list__check">
           <label
             class="pf-v6-c-check pf-m-standalone"
-            id="data-list-default-fitting-item-1&quot;"
             for="data-list-default-fitting-item-1&quot;-input"
           >
             <input
@@ -1374,7 +1367,6 @@ When a list item includes more than one block of content, it can be difficult fo
         <div class="pf-v6-c-data-list__check">
           <label
             class="pf-v6-c-check pf-m-standalone"
-            id="data-list-flex-modifiers-item-1&quot;"
             for="data-list-flex-modifiers-item-1&quot;-input"
           >
             <input
@@ -1453,7 +1445,6 @@ When a list item includes more than one block of content, it can be difficult fo
         <div class="pf-v6-c-data-list__check">
           <label
             class="pf-v6-c-check pf-m-standalone"
-            id="data-list-flex-modifiers-2-item-1&quot;"
             for="data-list-flex-modifiers-2-item-1&quot;-input"
           >
             <input
@@ -1826,7 +1817,6 @@ When a list item includes more than one block of content, it can be difficult fo
         <div class="pf-v6-c-data-list__check">
           <label
             class="pf-v6-c-check pf-m-standalone"
-            id="data-list-draggable-item-1&quot;"
             for="data-list-draggable-item-1&quot;-input"
           >
             <input
@@ -1872,7 +1862,6 @@ When a list item includes more than one block of content, it can be difficult fo
         <div class="pf-v6-c-data-list__check">
           <label
             class="pf-v6-c-check pf-m-standalone"
-            id="data-list-draggable-item-2&quot;"
             for="data-list-draggable-item-2&quot;-input"
           >
             <input
@@ -1919,7 +1908,6 @@ When a list item includes more than one block of content, it can be difficult fo
         <div class="pf-v6-c-data-list__check">
           <label
             class="pf-v6-c-check pf-m-standalone"
-            id="data-list-draggable-item-3&quot;"
             for="data-list-draggable-item-3&quot;-input"
           >
             <input
@@ -1965,7 +1953,6 @@ When a list item includes more than one block of content, it can be difficult fo
         <div class="pf-v6-c-data-list__check">
           <label
             class="pf-v6-c-check pf-m-standalone"
-            id="data-list-draggable-item-4&quot;"
             for="data-list-draggable-item-4&quot;-input"
           >
             <input

package/docs/components/InlineEdit/examples/InlineEdit.md

@@ -470,7 +470,12 @@ Inline edit **action-group** contains save and cancel actions and is only visibl
     <caption class="pf-v6-c-table__caption">This is the table caption</caption>
 
     <thead class="pf-v6-c-table__thead">
-      <tr class="pf-v6-c-table__tr" role="row">
+      <tr
+        class="pf-v6-c-table__tr"
+        role&#x26;#x3D;&#x26;quot;row&#x26;quot;
+        [object
+        Object]
+      >
         <th class="pf-v6-c-table__th" role="columnheader">Text input</th>
 
         <th class="pf-v6-c-table__th" role="columnheader">Disabled text input</th>
@@ -481,14 +486,31 @@ Inline edit **action-group** contains save and cancel actions and is only visibl
 
         <th class="pf-v6-c-table__th" role="columnheader">Number</th>
 
-        <td class="pf-v6-c-table__td"></td>
+        <th
+          class="pf-v6-c-table__th pf-v6-c-table__cell-empty"
+          role="columnheader"
+          scope="col"
+        >
+          <span class="pf-v6-screen-reader">Actions</span>
+        </th>
 
-        <td class="pf-v6-c-table__td"></td>
+        <th
+          class="pf-v6-c-table__th pf-v6-c-table__cell-empty"
+          role="columnheader"
+          scope="col"
+        >
+          <span class="pf-v6-screen-reader">Actions</span>
+        </th>
       </tr>
     </thead>
 
     <tbody class="pf-v6-c-table__tbody" role="rowgroup">
-      <tr class="pf-v6-c-table__tr pf-m-inline-editable" role="row">
+      <tr
+        class="pf-v6-c-table__tr pf-m-inline-editable"
+        role&#x26;#x3D;&#x26;quot;row&#x26;quot;
+        [object
+        Object]
+      >
         <th
           class="pf-v6-c-table__th"
           role="columnheader"
@@ -663,7 +685,7 @@ Inline edit **action-group** contains save and cancel actions and is only visibl
           </div>
         </td>
 
-        <td class="pf-v6-c-table__td pf-v6-c-table__action" role="cell">
+        <td class="pf-v6-c-table__td pf-v6-c-table__action">
           <button
             class="pf-v6-c-menu-toggle pf-m-plain"
             type="button"
@@ -677,7 +699,12 @@ Inline edit **action-group** contains save and cancel actions and is only visibl
         </td>
       </tr>
 
-      <tr class="pf-v6-c-table__tr" role="row">
+      <tr
+        class="pf-v6-c-table__tr"
+        role&#x26;#x3D;&#x26;quot;row&#x26;quot;
+        [object
+        Object]
+      >
         <th
           class="pf-v6-c-table__th"
           role="columnheader"
@@ -852,7 +879,7 @@ Inline edit **action-group** contains save and cancel actions and is only visibl
           </div>
         </td>
 
-        <td class="pf-v6-c-table__td pf-v6-c-table__action" role="cell">
+        <td class="pf-v6-c-table__td pf-v6-c-table__action">
           <button
             class="pf-v6-c-menu-toggle pf-m-plain"
             type="button"

package/docs/components/Menu/examples/Menu.md

@@ -173,10 +173,7 @@ cssPrefix: pf-v6-c-menu
         >
           <span class="pf-v6-c-menu__item-main">
             <span class="pf-v6-c-menu__item-check">
-              <div
-                class="pf-v6-c-check pf-m-standalone"
-                id="with-checkbox-example-check-1"
-              >
+              <div class="pf-v6-c-check pf-m-standalone">
                 <input
                   class="pf-v6-c-check__input"
                   type="checkbox"
@@ -197,10 +194,7 @@ cssPrefix: pf-v6-c-menu
         >
           <span class="pf-v6-c-menu__item-main">
             <span class="pf-v6-c-menu__item-check">
-              <div
-                class="pf-v6-c-check pf-m-standalone"
-                id="with-checkbox-example-check-2"
-              >
+              <div class="pf-v6-c-check pf-m-standalone">
                 <input
                   class="pf-v6-c-check__input"
                   type="checkbox"
@@ -221,10 +215,7 @@ cssPrefix: pf-v6-c-menu
         >
           <span class="pf-v6-c-menu__item-main">
             <span class="pf-v6-c-menu__item-check">
-              <div
-                class="pf-v6-c-check pf-m-standalone"
-                id="with-checkbox-example-check-3"
-              >
+              <div class="pf-v6-c-check pf-m-standalone">
                 <input
                   class="pf-v6-c-check__input"
                   type="checkbox"

package/docs/components/MultipleFileUpload/examples/MultipleFileUpload.md

@@ -148,7 +148,7 @@ cssPrefix: pf-v6-c-multiple-file-upload
           <span class="pf-v6-c-button__text">
             <div class="pf-v6-c-multiple-file-upload__status-progress">
               <div class="pf-v6-c-multiple-file-upload__status-progress-icon">
-                <i class="pf-v6-pficon pf-v6-pficon-in-progress"></i>
+                <i class="fas fa-spinner" aria-hidden="true"></i>
               </div>
               <div
                 class="pf-v6-c-multiple-file-upload__status-progress-text"
@@ -359,7 +359,7 @@ cssPrefix: pf-v6-c-multiple-file-upload
           <span class="pf-v6-c-button__text">
             <div class="pf-v6-c-multiple-file-upload__status-progress">
               <div class="pf-v6-c-multiple-file-upload__status-progress-icon">
-                <i class="pf-v6-pficon pf-v6-pficon-in-progress"></i>
+                <i class="fas fa-spinner" aria-hidden="true"></i>
               </div>
               <div
                 class="pf-v6-c-multiple-file-upload__status-progress-text"
@@ -570,7 +570,7 @@ cssPrefix: pf-v6-c-multiple-file-upload
           <span class="pf-v6-c-button__text">
             <div class="pf-v6-c-multiple-file-upload__status-progress">
               <div class="pf-v6-c-multiple-file-upload__status-progress-icon">
-                <i class="pf-v6-pficon pf-v6-pficon-in-progress"></i>
+                <i class="fas fa-spinner" aria-hidden="true"></i>
               </div>
               <div
                 class="pf-v6-c-multiple-file-upload__status-progress-text"