@patternfly/patternfly 5.1.0-prerelease.1 → 5.1.0-prerelease.10

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

@@ -10,6 +10,7 @@ cssPrefix: pf-v5-c-progress-stepper
 <ol class="pf-v5-c-progress-stepper" role="list">
   <li
     class="pf-v5-c-progress-stepper__step pf-m-success"
+    role="listitem"
     aria-label="completed step,"
   >
     <div class="pf-v5-c-progress-stepper__step-connector">
@@ -23,6 +24,7 @@ cssPrefix: pf-v5-c-progress-stepper
   </li>
   <li
     class="pf-v5-c-progress-stepper__step pf-m-current pf-m-info"
+    role="listitem"
     aria-label="current step,in process step,"
   >
     <div class="pf-v5-c-progress-stepper__step-connector">
@@ -36,6 +38,7 @@ cssPrefix: pf-v5-c-progress-stepper
   </li>
   <li
     class="pf-v5-c-progress-stepper__step pf-m-pending"
+    role="listitem"
     aria-label="pending step,"
   >
     <div class="pf-v5-c-progress-stepper__step-connector">
@@ -55,6 +58,7 @@ cssPrefix: pf-v5-c-progress-stepper
 <ol class="pf-v5-c-progress-stepper" role="list">
   <li
     class="pf-v5-c-progress-stepper__step pf-m-success"
+    role="listitem"
     aria-label="completed step,"
   >
     <div class="pf-v5-c-progress-stepper__step-connector">
@@ -71,6 +75,7 @@ cssPrefix: pf-v5-c-progress-stepper
   </li>
   <li
     class="pf-v5-c-progress-stepper__step pf-m-current pf-m-info"
+    role="listitem"
     aria-label="current step,in process step,"
   >
     <div class="pf-v5-c-progress-stepper__step-connector">
@@ -87,6 +92,7 @@ cssPrefix: pf-v5-c-progress-stepper
   </li>
   <li
     class="pf-v5-c-progress-stepper__step pf-m-pending"
+    role="listitem"
     aria-label="pending step,"
   >
     <div class="pf-v5-c-progress-stepper__step-connector">
@@ -112,6 +118,7 @@ cssPrefix: pf-v5-c-progress-stepper
 >
   <li
     class="pf-v5-c-progress-stepper__step pf-m-success"
+    role="listitem"
     aria-label="completed step,"
   >
     <div class="pf-v5-c-progress-stepper__step-connector">
@@ -128,6 +135,7 @@ cssPrefix: pf-v5-c-progress-stepper
   </li>
   <li
     class="pf-v5-c-progress-stepper__step pf-m-current pf-m-info"
+    role="listitem"
     aria-label="current step,in process step,"
   >
     <div class="pf-v5-c-progress-stepper__step-connector">
@@ -144,6 +152,7 @@ cssPrefix: pf-v5-c-progress-stepper
   </li>
   <li
     class="pf-v5-c-progress-stepper__step pf-m-pending"
+    role="listitem"
     aria-label="pending step,"
   >
     <div class="pf-v5-c-progress-stepper__step-connector">
@@ -166,6 +175,7 @@ cssPrefix: pf-v5-c-progress-stepper
 <ol class="pf-v5-c-progress-stepper pf-m-center" role="list">
   <li
     class="pf-v5-c-progress-stepper__step pf-m-success"
+    role="listitem"
     aria-label="completed step,"
   >
     <div class="pf-v5-c-progress-stepper__step-connector">
@@ -182,6 +192,7 @@ cssPrefix: pf-v5-c-progress-stepper
   </li>
   <li
     class="pf-v5-c-progress-stepper__step pf-m-current pf-m-info"
+    role="listitem"
     aria-label="current step,in process step,"
   >
     <div class="pf-v5-c-progress-stepper__step-connector">
@@ -198,6 +209,7 @@ cssPrefix: pf-v5-c-progress-stepper
   </li>
   <li
     class="pf-v5-c-progress-stepper__step pf-m-pending"
+    role="listitem"
     aria-label="pending step,"
   >
     <div class="pf-v5-c-progress-stepper__step-connector">
@@ -220,6 +232,7 @@ cssPrefix: pf-v5-c-progress-stepper
 <ol class="pf-v5-c-progress-stepper pf-m-center pf-m-vertical" role="list">
   <li
     class="pf-v5-c-progress-stepper__step pf-m-success"
+    role="listitem"
     aria-label="completed step,"
   >
     <div class="pf-v5-c-progress-stepper__step-connector">
@@ -236,6 +249,7 @@ cssPrefix: pf-v5-c-progress-stepper
   </li>
   <li
     class="pf-v5-c-progress-stepper__step pf-m-current pf-m-info"
+    role="listitem"
     aria-label="current step,in process step,"
   >
     <div class="pf-v5-c-progress-stepper__step-connector">
@@ -252,6 +266,7 @@ cssPrefix: pf-v5-c-progress-stepper
   </li>
   <li
     class="pf-v5-c-progress-stepper__step pf-m-pending"
+    role="listitem"
     aria-label="pending step,"
   >
     <div class="pf-v5-c-progress-stepper__step-connector">
@@ -274,6 +289,7 @@ cssPrefix: pf-v5-c-progress-stepper
 <ol class="pf-v5-c-progress-stepper pf-m-vertical" role="list">
   <li
     class="pf-v5-c-progress-stepper__step pf-m-success"
+    role="listitem"
     aria-label="completed step,"
   >
     <div class="pf-v5-c-progress-stepper__step-connector">
@@ -290,6 +306,7 @@ cssPrefix: pf-v5-c-progress-stepper
   </li>
   <li
     class="pf-v5-c-progress-stepper__step pf-m-current pf-m-info"
+    role="listitem"
     aria-label="current step,in process step,"
   >
     <div class="pf-v5-c-progress-stepper__step-connector">
@@ -306,6 +323,7 @@ cssPrefix: pf-v5-c-progress-stepper
   </li>
   <li
     class="pf-v5-c-progress-stepper__step pf-m-pending"
+    role="listitem"
     aria-label="pending step,"
   >
     <div class="pf-v5-c-progress-stepper__step-connector">
@@ -328,6 +346,7 @@ cssPrefix: pf-v5-c-progress-stepper
 <ol class="pf-v5-c-progress-stepper pf-m-compact" role="list">
   <li
     class="pf-v5-c-progress-stepper__step pf-m-success"
+    role="listitem"
     aria-label="completed step,"
   >
     <div class="pf-v5-c-progress-stepper__step-connector">
@@ -344,6 +363,7 @@ cssPrefix: pf-v5-c-progress-stepper
   </li>
   <li
     class="pf-v5-c-progress-stepper__step pf-m-current pf-m-info"
+    role="listitem"
     aria-label="current step,in process step,"
   >
     <div class="pf-v5-c-progress-stepper__step-connector">
@@ -360,6 +380,7 @@ cssPrefix: pf-v5-c-progress-stepper
   </li>
   <li
     class="pf-v5-c-progress-stepper__step pf-m-pending"
+    role="listitem"
     aria-label="pending step,"
   >
     <div class="pf-v5-c-progress-stepper__step-connector">
@@ -382,6 +403,7 @@ cssPrefix: pf-v5-c-progress-stepper
 <ol class="pf-v5-c-progress-stepper pf-m-vertical pf-m-compact" role="list">
   <li
     class="pf-v5-c-progress-stepper__step pf-m-success"
+    role="listitem"
     aria-label="completed step,"
   >
     <div class="pf-v5-c-progress-stepper__step-connector">
@@ -398,6 +420,7 @@ cssPrefix: pf-v5-c-progress-stepper
   </li>
   <li
     class="pf-v5-c-progress-stepper__step pf-m-current pf-m-info"
+    role="listitem"
     aria-label="current step,in process step,"
   >
     <div class="pf-v5-c-progress-stepper__step-connector">
@@ -414,6 +437,7 @@ cssPrefix: pf-v5-c-progress-stepper
   </li>
   <li
     class="pf-v5-c-progress-stepper__step pf-m-pending"
+    role="listitem"
     aria-label="pending step,"
   >
     <div class="pf-v5-c-progress-stepper__step-connector">
@@ -439,6 +463,7 @@ cssPrefix: pf-v5-c-progress-stepper
 >
   <li
     class="pf-v5-c-progress-stepper__step pf-m-success"
+    role="listitem"
     aria-label="completed step,"
   >
     <div class="pf-v5-c-progress-stepper__step-connector">
@@ -455,6 +480,7 @@ cssPrefix: pf-v5-c-progress-stepper
   </li>
   <li
     class="pf-v5-c-progress-stepper__step pf-m-current pf-m-info"
+    role="listitem"
     aria-label="current step,in process step,"
   >
     <div class="pf-v5-c-progress-stepper__step-connector">
@@ -471,6 +497,7 @@ cssPrefix: pf-v5-c-progress-stepper
   </li>
   <li
     class="pf-v5-c-progress-stepper__step pf-m-pending"
+    role="listitem"
     aria-label="pending step,"
   >
     <div class="pf-v5-c-progress-stepper__step-connector">
@@ -496,6 +523,7 @@ cssPrefix: pf-v5-c-progress-stepper
 >
   <li
     class="pf-v5-c-progress-stepper__step pf-m-success"
+    role="listitem"
     aria-label="completed step,"
   >
     <div class="pf-v5-c-progress-stepper__step-connector">
@@ -512,6 +540,7 @@ cssPrefix: pf-v5-c-progress-stepper
   </li>
   <li
     class="pf-v5-c-progress-stepper__step pf-m-current pf-m-info"
+    role="listitem"
     aria-label="current step,in process step,"
   >
     <div class="pf-v5-c-progress-stepper__step-connector">
@@ -528,6 +557,7 @@ cssPrefix: pf-v5-c-progress-stepper
   </li>
   <li
     class="pf-v5-c-progress-stepper__step pf-m-pending"
+    role="listitem"
     aria-label="pending step,"
   >
     <div class="pf-v5-c-progress-stepper__step-connector">
@@ -550,6 +580,7 @@ cssPrefix: pf-v5-c-progress-stepper
 <ol class="pf-v5-c-progress-stepper pf-m-center pf-m-compact" role="list">
   <li
     class="pf-v5-c-progress-stepper__step pf-m-success"
+    role="listitem"
     aria-label="completed step,"
   >
     <div class="pf-v5-c-progress-stepper__step-connector">
@@ -566,6 +597,7 @@ cssPrefix: pf-v5-c-progress-stepper
   </li>
   <li
     class="pf-v5-c-progress-stepper__step pf-m-current pf-m-info"
+    role="listitem"
     aria-label="current step,in process step,"
   >
     <div class="pf-v5-c-progress-stepper__step-connector">
@@ -582,6 +614,7 @@ cssPrefix: pf-v5-c-progress-stepper
   </li>
   <li
     class="pf-v5-c-progress-stepper__step pf-m-pending"
+    role="listitem"
     aria-label="pending step,"
   >
     <div class="pf-v5-c-progress-stepper__step-connector">
@@ -604,6 +637,7 @@ cssPrefix: pf-v5-c-progress-stepper
 <ol class="pf-v5-c-progress-stepper" role="list">
   <li
     class="pf-v5-c-progress-stepper__step pf-m-success"
+    role="listitem"
     aria-label="completed step,"
   >
     <div class="pf-v5-c-progress-stepper__step-connector">
@@ -617,6 +651,7 @@ cssPrefix: pf-v5-c-progress-stepper
   </li>
   <li
     class="pf-v5-c-progress-stepper__step pf-m-success"
+    role="listitem"
     aria-label="completed step,"
   >
     <div class="pf-v5-c-progress-stepper__step-connector">
@@ -630,6 +665,7 @@ cssPrefix: pf-v5-c-progress-stepper
   </li>
   <li
     class="pf-v5-c-progress-stepper__step pf-m-warning"
+    role="listitem"
     aria-label="step with issue,"
   >
     <div class="pf-v5-c-progress-stepper__step-connector">
@@ -643,6 +679,7 @@ cssPrefix: pf-v5-c-progress-stepper
   </li>
   <li
     class="pf-v5-c-progress-stepper__step pf-m-current pf-m-info"
+    role="listitem"
     aria-label="current step,in process step,"
   >
     <div class="pf-v5-c-progress-stepper__step-connector">
@@ -656,6 +693,7 @@ cssPrefix: pf-v5-c-progress-stepper
   </li>
   <li
     class="pf-v5-c-progress-stepper__step pf-m-pending"
+    role="listitem"
     aria-label="pending step,"
   >
     <div class="pf-v5-c-progress-stepper__step-connector">
@@ -675,6 +713,7 @@ cssPrefix: pf-v5-c-progress-stepper
 <ol class="pf-v5-c-progress-stepper" role="list">
   <li
     class="pf-v5-c-progress-stepper__step pf-m-success"
+    role="listitem"
     aria-label="completed step,"
   >
     <div class="pf-v5-c-progress-stepper__step-connector">
@@ -688,6 +727,7 @@ cssPrefix: pf-v5-c-progress-stepper
   </li>
   <li
     class="pf-v5-c-progress-stepper__step pf-m-success"
+    role="listitem"
     aria-label="completed step,"
   >
     <div class="pf-v5-c-progress-stepper__step-connector">
@@ -701,6 +741,7 @@ cssPrefix: pf-v5-c-progress-stepper
   </li>
   <li
     class="pf-v5-c-progress-stepper__step pf-m-success"
+    role="listitem"
     aria-label="completed step,"
   >
     <div class="pf-v5-c-progress-stepper__step-connector">
@@ -714,6 +755,7 @@ cssPrefix: pf-v5-c-progress-stepper
   </li>
   <li
     class="pf-v5-c-progress-stepper__step pf-m-current pf-m-danger"
+    role="listitem"
     aria-label="current step,step with failure,"
   >
     <div class="pf-v5-c-progress-stepper__step-connector">
@@ -727,6 +769,7 @@ cssPrefix: pf-v5-c-progress-stepper
   </li>
   <li
     class="pf-v5-c-progress-stepper__step pf-m-pending"
+    role="listitem"
     aria-label="pending step,"
   >
     <div class="pf-v5-c-progress-stepper__step-connector">
@@ -746,6 +789,7 @@ cssPrefix: pf-v5-c-progress-stepper
 <ol class="pf-v5-c-progress-stepper" role="list">
   <li
     class="pf-v5-c-progress-stepper__step pf-m-success"
+    role="listitem"
     aria-label="completed step,"
   >
     <div class="pf-v5-c-progress-stepper__step-connector">
@@ -759,6 +803,7 @@ cssPrefix: pf-v5-c-progress-stepper
   </li>
   <li
     class="pf-v5-c-progress-stepper__step pf-m-current"
+    role="listitem"
     aria-label="current step,in process step,"
   >
     <div class="pf-v5-c-progress-stepper__step-connector">
@@ -772,6 +817,7 @@ cssPrefix: pf-v5-c-progress-stepper
   </li>
   <li
     class="pf-v5-c-progress-stepper__step pf-m-pending"
+    role="listitem"
     aria-label="pending step,"
   >
     <div class="pf-v5-c-progress-stepper__step-connector">
@@ -793,6 +839,7 @@ cssPrefix: pf-v5-c-progress-stepper
 <ol class="pf-v5-c-progress-stepper" role="list">
   <li
     class="pf-v5-c-progress-stepper__step pf-m-success"
+    role="listitem"
     aria-label="completed step,"
   >
     <div class="pf-v5-c-progress-stepper__step-connector">
@@ -809,6 +856,7 @@ cssPrefix: pf-v5-c-progress-stepper
   </li>
   <li
     class="pf-v5-c-progress-stepper__step pf-m-danger"
+    role="listitem"
     aria-label="step with failure,"
   >
     <div class="pf-v5-c-progress-stepper__step-connector">
@@ -825,6 +873,7 @@ cssPrefix: pf-v5-c-progress-stepper
   </li>
   <li
     class="pf-v5-c-progress-stepper__step pf-m-current pf-m-info"
+    role="listitem"
     aria-label="current step,in process step,"
   >
     <div class="pf-v5-c-progress-stepper__step-connector">
@@ -841,6 +890,7 @@ cssPrefix: pf-v5-c-progress-stepper
   </li>
   <li
     class="pf-v5-c-progress-stepper__step pf-m-pending"
+    role="listitem"
     aria-label="pending step,"
   >
     <div class="pf-v5-c-progress-stepper__step-connector">

package/docs/components/Select/deprecated/Select.css

@@ -30,7 +30,8 @@
 }
 
 #ws-html-deprecated-c-select-multi-with-typeahead-chip-group-expanded,
-#ws-html-deprecated-c-select-menu-footer {
+#ws-html-deprecated-c-select-menu-footer,
+#ws-html-deprecated-c-select-checkbox-item-description {
   min-height: 365px;
 }
 
@@ -46,8 +47,7 @@
   min-height: 120px;
 }
 
-#ws-html-deprecated-c-select-item-description,
-#ws-html-deprecated-c-select-checkbox-item-description {
+#ws-html-deprecated-c-select-item-description {
   min-height: 400px;
 }
 

package/docs/components/Select/deprecated/Select.md

@@ -533,6 +533,7 @@ The single select should be used when the user is selecting an option from a lis
           type="text"
           id="select-single-typeahead-typeahead"
           aria-label="Type to filter"
+          value
           placeholder="Choose a state"
         />
       </span>
@@ -602,7 +603,7 @@ The single select should be used when the user is selecting an option from a lis
 
 ```html
 <div class="pf-v5-c-select pf-m-expanded">
-  <span id="select-single-typeahead-expanded-label" hidden>New</span>
+  <span id="select-single-typeahead-expanded-label" hidden>Choose a state</span>
 
   <div class="pf-v5-c-select__toggle pf-m-typeahead">
     <div class="pf-v5-c-select__toggle-wrapper">
@@ -611,7 +612,8 @@ The single select should be used when the user is selecting an option from a lis
           type="text"
           id="select-single-typeahead-expanded-typeahead"
           aria-label="Type to filter"
-          placeholder="New"
+          value="New"
+          placeholder="Choose a state"
         />
       </span>
     </div>
@@ -677,7 +679,10 @@ The single select should be used when the user is selecting an option from a lis
 
 ```html
 <div class="pf-v5-c-select pf-m-expanded">
-  <span id="select-single-typeahead-expanded-selected-label" hidden>New Mexico</span>
+  <span
+    id="select-single-typeahead-expanded-selected-label"
+    hidden
+  >Choose a state</span>
 
   <div class="pf-v5-c-select__toggle pf-m-typeahead">
     <div class="pf-v5-c-select__toggle-wrapper">
@@ -686,7 +691,8 @@ The single select should be used when the user is selecting an option from a lis
           type="text"
           id="select-single-typeahead-expanded-selected-typeahead"
           aria-label="Type to filter"
-          placeholder="New Mexico"
+          value="New Mexico"
+          placeholder="Choose a state"
         />
       </span>
     </div>
@@ -962,6 +968,7 @@ The single select typeahead should be used when the user is selecting one option
           type="text"
           id="select-multi-typeahead-typeahead"
           aria-label="Type to filter"
+          value
           placeholder="Choose states"
         />
       </span>
@@ -1022,7 +1029,7 @@ The single select typeahead should be used when the user is selecting one option
 
   <div class="pf-v5-c-select__toggle pf-m-typeahead">
     <div class="pf-v5-c-select__toggle-wrapper">
-      <div class="pf-v5-c-chip-group">
+      <div class="pf-v5-c-chip-group" role="group">
         <div class="pf-v5-c-chip-group__main">
           <ul
             class="pf-v5-c-chip-group__list"
@@ -1142,6 +1149,7 @@ The single select typeahead should be used when the user is selecting one option
           type="text"
           id="select-multi-typeahead-expanded-typeahead"
           aria-label="Type to filter"
+          value
           placeholder="Choose states"
         />
       </span>
@@ -1204,11 +1212,11 @@ The single select typeahead should be used when the user is selecting one option
 
 ```html
 <div class="pf-v5-c-select pf-m-expanded">
-  <span id="select-multi-typeahead-expanded-selected-label" hidden>New</span>
+  <span id="select-multi-typeahead-expanded-selected-label" hidden>Choose states</span>
 
   <div class="pf-v5-c-select__toggle pf-m-typeahead">
     <div class="pf-v5-c-select__toggle-wrapper">
-      <div class="pf-v5-c-chip-group">
+      <div class="pf-v5-c-chip-group" role="group">
         <div class="pf-v5-c-chip-group__main">
           <ul
             class="pf-v5-c-chip-group__list"
@@ -1293,7 +1301,8 @@ The single select typeahead should be used when the user is selecting one option
           type="text"
           id="select-multi-typeahead-expanded-selected-typeahead"
           aria-label="Type to filter"
-          placeholder="New"
+          value="New"
+          placeholder="Choose states"
         />
       </span>
     </div>
@@ -1350,7 +1359,7 @@ The single select typeahead should be used when the user is selecting one option
 
   <div class="pf-v5-c-select__toggle pf-m-typeahead">
     <div class="pf-v5-c-select__toggle-wrapper">
-      <div class="pf-v5-c-chip-group">
+      <div class="pf-v5-c-chip-group" role="group">
         <div class="pf-v5-c-chip-group__main">
           <ul
             class="pf-v5-c-chip-group__list"
@@ -1564,7 +1573,7 @@ The multiselect should be used when the user is selecting multiple items from a
 
 ```html
 <div class="pf-v5-c-select">
-  <span id="select-checkbox-label" hidden>Choose one</span>
+  <span id="select-checkbox-label" hidden>Choose many</span>
 
   <button
     class="pf-v5-c-select__toggle"
@@ -1663,7 +1672,7 @@ The multiselect should be used when the user is selecting multiple items from a
 
 ```html
 <div class="pf-v5-c-select pf-m-expanded">
-  <span id="select-checkbox-expanded-label" hidden>Choose one</span>
+  <span id="select-checkbox-expanded-label" hidden>Choose many</span>
 
   <button
     class="pf-v5-c-select__toggle"
@@ -1761,7 +1770,7 @@ The multiselect should be used when the user is selecting multiple items from a
 
 ```html
 <div class="pf-v5-c-select pf-m-expanded">
-  <span id="select-checkbox-expanded-selected-label" hidden>Choose one</span>
+  <span id="select-checkbox-expanded-selected-label" hidden>Choose many</span>
 
   <button
     class="pf-v5-c-select__toggle"
@@ -1924,7 +1933,7 @@ The multiselect should be used when the user is selecting multiple items from a
   <span
     id="select-checkbox-expanded-selected-filter-example-label"
     hidden
-  >Choose one</span>
+  >Choose many</span>
 
   <button
     class="pf-v5-c-select__toggle"
@@ -2103,7 +2112,7 @@ The multiselect should be used when the user is selecting multiple items from a
 
 ```html
 <div class="pf-v5-c-select pf-m-expanded">
-  <span id="select-checkbox-without-badge-label" hidden>Choose one</span>
+  <span id="select-checkbox-without-badge-label" hidden>Choose many</span>
 
   <button
     class="pf-v5-c-select__toggle"
@@ -2201,7 +2210,7 @@ The multiselect should be used when the user is selecting multiple items from a
 
 ```html
 <div class="pf-v5-c-select pf-m-expanded">
-  <span id="select-checkbox-counts-label" hidden>Choose one</span>
+  <span id="select-checkbox-counts-label" hidden>Choose many</span>
 
   <button
     class="pf-v5-c-select__toggle"
@@ -2630,18 +2639,6 @@ The plain select variation should be used when you do not want a border applied
     <li role="presentation">
       <button class="pf-v5-c-select__menu-item" role="option">Menu item</button>
     </li>
-    <li role="presentation">
-      <button
-        class="pf-v5-c-select__menu-item pf-m-selected"
-        role="option"
-        aria-selected="true"
-      >
-        Menu item selected
-        <span class="pf-v5-c-select__menu-item-icon">
-          <i class="fas fa-check" aria-hidden="true"></i>
-        </span>
-      </button>
-    </li>
     <li role="presentation">
       <button class="pf-v5-c-select__menu-item pf-m-description" role="option">
         <span class="pf-v5-c-select__menu-item-main">Menu item description</span>
@@ -2686,19 +2683,8 @@ The plain select variation should be used when you do not want a border applied
       </button>
     </li>
     <li role="presentation">
-      <button
-        class="pf-v5-c-select__menu-item pf-m-selected pf-m-description"
-        role="option"
-        aria-selected="true"
-      >
-        <span class="pf-v5-c-select__menu-item-main">
-          Menu item long description
-          <span
-            class="pf-v5-c-select__menu-item-icon"
-          >
-            <i class="fas fa-check" aria-hidden="true"></i>
-          </span>
-        </span>
+      <button class="pf-v5-c-select__menu-item pf-m-description" role="option">
+        <span class="pf-v5-c-select__menu-item-main">Menu item long description</span>
         <span
           class="pf-v5-c-select__menu-item-description"
         >This is a really long description that describes the menu item. This is a really long description that describes the menu item.</span>
@@ -2713,7 +2699,7 @@ The plain select variation should be used when you do not want a border applied
 
 ```html
 <div class="pf-v5-c-select pf-m-expanded">
-  <span id="select-checkbox-description-label" hidden>Choose one</span>
+  <span id="select-checkbox-description-label" hidden>Choose many</span>
 
   <button
     class="pf-v5-c-select__toggle"
@@ -3178,20 +3164,22 @@ The plain select variation should be used when you do not want a border applied
       <button class="pf-v5-c-select__menu-item" role="option">Needs maintenance</button>
     </li>
     <li role="presentation" class="pf-v5-c-select__list-item pf-m-loading">
-      <svg
-        class="pf-v5-c-spinner pf-m-lg"
-        role="progressbar"
-        viewBox="0 0 100 100"
-        aria-label="Loading items"
-      >
-        <circle
-          class="pf-v5-c-spinner__path"
-          cx="50"
-          cy="50"
-          r="45"
-          fill="none"
-        />
-      </svg>
+      <button class="pf-v5-c-select__menu-item" role="option">
+        <svg
+          class="pf-v5-c-spinner pf-m-lg"
+          role="progressbar"
+          viewBox="0 0 100 100"
+          aria-label="Loading items"
+        >
+          <circle
+            class="pf-v5-c-spinner__path"
+            cx="50"
+            cy="50"
+            r="45"
+            fill="none"
+          />
+        </svg>
+      </button>
     </li>
   </ul>
 </div>

package/docs/components/Table/examples/Table.css

@@ -5,8 +5,8 @@
 
 #ws-core-c-table-th-truncation .pf-v5-c-tooltip {
   position: absolute;
-  left: 440px;
-  top: -18px;
+ inset-inline-start: 440px;
+ inset-block-start: -18px;
 }
 
 #ws-core-c-table-sticky-header .ws-preview-html {