@patternfly/react-core 5.0.0-prerelease.9 → 5.1.0

package/src/components/Pagination/__tests__/__snapshots__/Pagination.test.tsx.snap

@@ -130,7 +130,7 @@ exports[`Pagination API verify inset2xl inset breakpoints 1`] = `
       <div
         class="pf-v5-c-pagination__nav-page-select"
       >
-        <div
+        <span
           class="pf-v5-c-form-control"
         >
           <input
@@ -144,7 +144,7 @@ exports[`Pagination API verify inset2xl inset breakpoints 1`] = `
             type="number"
             value="1"
           />
-        </div>
+        </span>
       </div>
       <div
         class="pf-v5-c-pagination__nav-control"
@@ -338,7 +338,7 @@ exports[`Pagination API verify insetLg inset breakpoints 1`] = `
       <div
         class="pf-v5-c-pagination__nav-page-select"
       >
-        <div
+        <span
           class="pf-v5-c-form-control"
         >
           <input
@@ -352,7 +352,7 @@ exports[`Pagination API verify insetLg inset breakpoints 1`] = `
             type="number"
             value="1"
           />
-        </div>
+        </span>
       </div>
       <div
         class="pf-v5-c-pagination__nav-control"
@@ -546,7 +546,7 @@ exports[`Pagination API verify insetMd inset breakpoints 1`] = `
       <div
         class="pf-v5-c-pagination__nav-page-select"
       >
-        <div
+        <span
           class="pf-v5-c-form-control"
         >
           <input
@@ -560,7 +560,7 @@ exports[`Pagination API verify insetMd inset breakpoints 1`] = `
             type="number"
             value="1"
           />
-        </div>
+        </span>
       </div>
       <div
         class="pf-v5-c-pagination__nav-control"
@@ -754,7 +754,7 @@ exports[`Pagination API verify insetNone inset breakpoints 1`] = `
       <div
         class="pf-v5-c-pagination__nav-page-select"
       >
-        <div
+        <span
           class="pf-v5-c-form-control"
         >
           <input
@@ -768,7 +768,7 @@ exports[`Pagination API verify insetNone inset breakpoints 1`] = `
             type="number"
             value="1"
           />
-        </div>
+        </span>
       </div>
       <div
         class="pf-v5-c-pagination__nav-control"
@@ -962,7 +962,7 @@ exports[`Pagination API verify insetSm inset breakpoints 1`] = `
       <div
         class="pf-v5-c-pagination__nav-page-select"
       >
-        <div
+        <span
           class="pf-v5-c-form-control"
         >
           <input
@@ -976,7 +976,7 @@ exports[`Pagination API verify insetSm inset breakpoints 1`] = `
             type="number"
             value="1"
           />
-        </div>
+        </span>
       </div>
       <div
         class="pf-v5-c-pagination__nav-control"
@@ -1170,7 +1170,7 @@ exports[`Pagination API verify insetXl inset breakpoints 1`] = `
       <div
         class="pf-v5-c-pagination__nav-page-select"
       >
-        <div
+        <span
           class="pf-v5-c-form-control"
         >
           <input
@@ -1184,7 +1184,7 @@ exports[`Pagination API verify insetXl inset breakpoints 1`] = `
             type="number"
             value="1"
           />
-        </div>
+        </span>
       </div>
       <div
         class="pf-v5-c-pagination__nav-control"
@@ -1364,7 +1364,7 @@ exports[`Pagination component render custom pagination toggle 1`] = `
       <div
         class="pf-v5-c-pagination__nav-page-select"
       >
-        <div
+        <span
           class="pf-v5-c-form-control"
         >
           <input
@@ -1378,7 +1378,7 @@ exports[`Pagination component render custom pagination toggle 1`] = `
             type="number"
             value="1"
           />
-        </div>
+        </span>
         <span
           aria-hidden="true"
         >
@@ -1576,7 +1576,7 @@ exports[`Pagination component render custom perPageOptions 1`] = `
       <div
         class="pf-v5-c-pagination__nav-page-select"
       >
-        <div
+        <span
           class="pf-v5-c-form-control"
         >
           <input
@@ -1590,7 +1590,7 @@ exports[`Pagination component render custom perPageOptions 1`] = `
             type="number"
             value="1"
           />
-        </div>
+        </span>
         <span
           aria-hidden="true"
         >
@@ -1786,7 +1786,7 @@ exports[`Pagination component render custom start end 1`] = `
       <div
         class="pf-v5-c-pagination__nav-page-select"
       >
-        <div
+        <span
           class="pf-v5-c-form-control"
         >
           <input
@@ -1800,7 +1800,7 @@ exports[`Pagination component render custom start end 1`] = `
             type="number"
             value="1"
           />
-        </div>
+        </span>
         <span
           aria-hidden="true"
         >
@@ -1955,7 +1955,7 @@ exports[`Pagination component render empty per page options 1`] = `
       <div
         class="pf-v5-c-pagination__nav-page-select"
       >
-        <div
+        <span
           class="pf-v5-c-form-control"
         >
           <input
@@ -1969,7 +1969,7 @@ exports[`Pagination component render empty per page options 1`] = `
             type="number"
             value="1"
           />
-        </div>
+        </span>
         <span
           aria-hidden="true"
         >
@@ -2165,7 +2165,7 @@ exports[`Pagination component render last page 1`] = `
       <div
         class="pf-v5-c-pagination__nav-page-select"
       >
-        <div
+        <span
           class="pf-v5-c-form-control"
         >
           <input
@@ -2179,7 +2179,7 @@ exports[`Pagination component render last page 1`] = `
             type="number"
             value="2"
           />
-        </div>
+        </span>
         <span
           aria-hidden="true"
         >
@@ -2379,7 +2379,7 @@ exports[`Pagination component render limited number of pages 1`] = `
       <div
         class="pf-v5-c-pagination__nav-page-select"
       >
-        <div
+        <span
           class="pf-v5-c-form-control pf-m-disabled"
         >
           <input
@@ -2394,7 +2394,7 @@ exports[`Pagination component render limited number of pages 1`] = `
             type="number"
             value="1"
           />
-        </div>
+        </span>
         <span
           aria-hidden="true"
         >
@@ -2582,7 +2582,7 @@ exports[`Pagination component render should render correctly bottom 1`] = `
       <div
         class="pf-v5-c-pagination__nav-page-select"
       >
-        <div
+        <span
           class="pf-v5-c-form-control"
         >
           <input
@@ -2596,7 +2596,7 @@ exports[`Pagination component render should render correctly bottom 1`] = `
             type="number"
             value="1"
           />
-        </div>
+        </span>
         <span
           aria-hidden="true"
         >
@@ -2782,7 +2782,7 @@ exports[`Pagination component render should render correctly bottom sticky 1`] =
       <div
         class="pf-v5-c-pagination__nav-page-select"
       >
-        <div
+        <span
           class="pf-v5-c-form-control"
         >
           <input
@@ -2796,7 +2796,7 @@ exports[`Pagination component render should render correctly bottom sticky 1`] =
             type="number"
             value="1"
           />
-        </div>
+        </span>
         <span
           aria-hidden="true"
         >
@@ -3126,7 +3126,7 @@ exports[`Pagination component render should render correctly disabled 1`] = `
       <div
         class="pf-v5-c-pagination__nav-page-select"
       >
-        <div
+        <span
           class="pf-v5-c-form-control pf-m-disabled"
         >
           <input
@@ -3141,7 +3141,7 @@ exports[`Pagination component render should render correctly disabled 1`] = `
             type="number"
             value="1"
           />
-        </div>
+        </span>
         <span
           aria-hidden="true"
         >
@@ -3341,7 +3341,7 @@ exports[`Pagination component render should render correctly sticky 1`] = `
       <div
         class="pf-v5-c-pagination__nav-page-select"
       >
-        <div
+        <span
           class="pf-v5-c-form-control"
         >
           <input
@@ -3355,7 +3355,7 @@ exports[`Pagination component render should render correctly sticky 1`] = `
             type="number"
             value="1"
           />
-        </div>
+        </span>
         <span
           aria-hidden="true"
         >
@@ -3553,7 +3553,7 @@ exports[`Pagination component render should render correctly top 1`] = `
       <div
         class="pf-v5-c-pagination__nav-page-select"
       >
-        <div
+        <span
           class="pf-v5-c-form-control"
         >
           <input
@@ -3567,7 +3567,7 @@ exports[`Pagination component render should render correctly top 1`] = `
             type="number"
             value="1"
           />
-        </div>
+        </span>
         <span
           aria-hidden="true"
         >
@@ -3765,7 +3765,7 @@ exports[`Pagination component render titles 1`] = `
       <div
         class="pf-v5-c-pagination__nav-page-select"
       >
-        <div
+        <span
           class="pf-v5-c-form-control"
         >
           <input
@@ -3779,7 +3779,7 @@ exports[`Pagination component render titles 1`] = `
             type="number"
             value="1"
           />
-        </div>
+        </span>
         <span
           aria-hidden="true"
         >
@@ -3977,7 +3977,7 @@ exports[`Pagination component render up drop direction 1`] = `
       <div
         class="pf-v5-c-pagination__nav-page-select"
       >
-        <div
+        <span
           class="pf-v5-c-form-control"
         >
           <input
@@ -3991,7 +3991,7 @@ exports[`Pagination component render up drop direction 1`] = `
             type="number"
             value="1"
           />
-        </div>
+        </span>
         <span
           aria-hidden="true"
         >
@@ -4189,7 +4189,7 @@ exports[`Pagination component render zero results 1`] = `
       <div
         class="pf-v5-c-pagination__nav-page-select"
       >
-        <div
+        <span
           class="pf-v5-c-form-control pf-m-disabled"
         >
           <input
@@ -4204,7 +4204,7 @@ exports[`Pagination component render zero results 1`] = `
             type="number"
             value="0"
           />
-        </div>
+        </span>
         <span
           aria-hidden="true"
         >

package/src/components/Popover/Popover.tsx

@@ -465,7 +465,7 @@ export const Popover: React.FunctionComponent<PopoverProps> = ({
         triggerRef={triggerRef}
         popper={content}
         popperRef={popoverRef}
-        minWidth="revert"
+        minWidth={minWidth}
         appendTo={appendTo}
         isVisible={visible}
         positionModifiers={positionModifiers}

package/src/components/SearchInput/__tests__/__snapshots__/SearchInput.test.tsx.snap

@@ -306,7 +306,7 @@ exports[`SearchInput advanced search with custom attributes 1`] = `
                 <div
                   class="pf-v5-c-form__group-control"
                 >
-                  <div
+                  <span
                     class="pf-v5-c-form-control"
                   >
                     <input
@@ -318,7 +318,7 @@ exports[`SearchInput advanced search with custom attributes 1`] = `
                       type="text"
                       value="player"
                     />
-                  </div>
+                  </span>
                 </div>
               </div>
               <div
@@ -342,7 +342,7 @@ exports[`SearchInput advanced search with custom attributes 1`] = `
                 <div
                   class="pf-v5-c-form__group-control"
                 >
-                  <div
+                  <span
                     class="pf-v5-c-form-control"
                   >
                     <input
@@ -354,7 +354,7 @@ exports[`SearchInput advanced search with custom attributes 1`] = `
                       type="text"
                       value="john"
                     />
-                  </div>
+                  </span>
                 </div>
               </div>
               <div
@@ -378,7 +378,7 @@ exports[`SearchInput advanced search with custom attributes 1`] = `
                 <div
                   class="pf-v5-c-form__group-control"
                 >
-                  <div
+                  <span
                     class="pf-v5-c-form-control"
                   >
                     <input
@@ -390,7 +390,7 @@ exports[`SearchInput advanced search with custom attributes 1`] = `
                       type="text"
                       value=""
                     />
-                  </div>
+                  </span>
                 </div>
               </div>
               <div

package/src/components/Slider/_tests_/__snapshots__/Slider.test.tsx.snap

@@ -56,7 +56,7 @@ exports[`slider renders continuous slider 1`] = `
     <div
       class="pf-v5-c-slider__value"
     >
-      <div
+      <span
         class="pf-v5-c-form-control"
       >
         <input
@@ -68,7 +68,7 @@ exports[`slider renders continuous slider 1`] = `
           type="number"
           value="50"
         />
-      </div>
+      </span>
     </div>
   </div>
 </DocumentFragment>
@@ -250,7 +250,7 @@ exports[`slider renders discrete slider 1`] = `
     <div
       class="pf-v5-c-slider__value"
     >
-      <div
+      <span
         class="pf-v5-c-form-control"
       >
         <input
@@ -262,7 +262,7 @@ exports[`slider renders discrete slider 1`] = `
           type="number"
           value="50"
         />
-      </div>
+      </span>
     </div>
   </div>
 </DocumentFragment>
@@ -422,7 +422,7 @@ exports[`slider renders slider with input 1`] = `
         <div
           class="pf-v5-c-input-group__item pf-m-fill"
         >
-          <div
+          <span
             class="pf-v5-c-form-control"
           >
             <input
@@ -434,7 +434,7 @@ exports[`slider renders slider with input 1`] = `
               type="number"
               value="50"
             />
-          </div>
+          </span>
         </div>
         <div
           class="pf-v5-c-input-group__item pf-m-box"
@@ -501,7 +501,7 @@ exports[`slider renders slider with input above thumb 1`] = `
           <div
             class="pf-v5-c-input-group__item pf-m-fill"
           >
-            <div
+            <span
               class="pf-v5-c-form-control"
             >
               <input
@@ -513,7 +513,7 @@ exports[`slider renders slider with input above thumb 1`] = `
                 type="number"
                 value="50"
               />
-            </div>
+            </span>
           </div>
           <div
             class="pf-v5-c-input-group__item pf-m-box"

package/src/components/TextArea/TextArea.tsx

@@ -123,7 +123,7 @@ export class TextAreaBase extends React.Component<TextAreaProps> {
     const hasStatusIcon = ['success', 'error', 'warning'].includes(validated);
 
     return (
-      <div
+      <span
         className={css(
           styles.formControl,
           readOnlyVariant && styles.modifiers.readonly,
@@ -145,11 +145,11 @@ export class TextAreaBase extends React.Component<TextAreaProps> {
           {...props}
         />
         {hasStatusIcon && (
-          <div className={css(styles.formControlUtilities)}>
+          <span className={css(styles.formControlUtilities)}>
             <FormControlIcon status={validated as 'success' | 'error' | 'warning'} />
-          </div>
+          </span>
         )}
-      </div>
+      </span>
     );
   }
 }

package/src/components/TextArea/__tests__/__snapshots__/TextArea.test.tsx.snap

@@ -2,7 +2,7 @@
 
 exports[`Matches the snapshot 1`] = `
 <DocumentFragment>
-  <div
+  <span
     class="pf-v5-c-form-control pf-m-resize-both pf-m-disabled custom class"
     style="height: 6px;"
   >
@@ -12,6 +12,6 @@ exports[`Matches the snapshot 1`] = `
       disabled=""
       required=""
     />
-  </div>
+  </span>
 </DocumentFragment>
 `;

package/src/components/TextInput/TextInput.tsx

@@ -190,7 +190,7 @@ export class TextInputBase extends React.Component<TextInputProps, TextInputStat
     const hasStatusIcon = ['success', 'error', 'warning'].includes(validated);
 
     return (
-      <div
+      <span
         className={css(
           styles.formControl,
           readOnlyVariant && styles.modifiers.readonly,
@@ -218,12 +218,12 @@ export class TextInputBase extends React.Component<TextInputProps, TextInputStat
           {...getOUIAProps(TextInput.displayName, ouiaId !== undefined ? ouiaId : this.state.ouiaStateId, ouiaSafe)}
         />
         {(customIcon || hasStatusIcon) && (
-          <div className={css(styles.formControlUtilities)}>
+          <span className={css(styles.formControlUtilities)}>
             {customIcon && <FormControlIcon customIcon={customIcon} />}
             {hasStatusIcon && <FormControlIcon status={validated as 'success' | 'error' | 'warning'} />}
-          </div>
+          </span>
         )}
-      </div>
+      </span>
     );
   }
 

package/src/components/TextInput/__tests__/__snapshots__/TextInput.test.tsx.snap

@@ -2,7 +2,7 @@
 
 exports[`TextInput default read only text input 1`] = `
 <DocumentFragment>
-  <div
+  <span
     class="pf-v5-c-form-control pf-m-readonly"
   >
     <input
@@ -15,13 +15,13 @@ exports[`TextInput default read only text input 1`] = `
       type="text"
       value="read only default"
     />
-  </div>
+  </span>
 </DocumentFragment>
 `;
 
 exports[`TextInput disabled text input 1`] = `
 <DocumentFragment>
-  <div
+  <span
     class="pf-v5-c-form-control pf-m-disabled"
   >
     <input
@@ -34,13 +34,13 @@ exports[`TextInput disabled text input 1`] = `
       type="text"
       value=""
     />
-  </div>
+  </span>
 </DocumentFragment>
 `;
 
 exports[`TextInput invalid text input 1`] = `
 <DocumentFragment>
-  <div
+  <span
     class="pf-v5-c-form-control pf-m-error"
   >
     <input
@@ -52,10 +52,10 @@ exports[`TextInput invalid text input 1`] = `
       type="text"
       value="test input"
     />
-    <div
+    <span
       class="pf-v5-c-form-control__utilities"
     >
-      <div
+      <span
         class="pf-v5-c-form-control__icon pf-m-status"
       >
         <svg
@@ -71,15 +71,15 @@ exports[`TextInput invalid text input 1`] = `
             d="M504 256c0 136.997-111.043 248-248 248S8 392.997 8 256C8 119.083 119.043 8 256 8s248 111.083 248 248zm-248 50c-25.405 0-46 20.595-46 46s20.595 46 46 46 46-20.595 46-46-20.595-46-46-46zm-43.673-165.346l7.418 136c.347 6.364 5.609 11.346 11.982 11.346h48.546c6.373 0 11.635-4.982 11.982-11.346l7.418-136c.375-6.874-5.098-12.654-11.982-12.654h-63.383c-6.884 0-12.356 5.78-11.981 12.654z"
           />
         </svg>
-      </div>
-    </div>
-  </div>
+      </span>
+    </span>
+  </span>
 </DocumentFragment>
 `;
 
 exports[`TextInput plain read only text input 1`] = `
 <DocumentFragment>
-  <div
+  <span
     class="pf-v5-c-form-control pf-m-readonly pf-m-plain"
   >
     <input
@@ -92,13 +92,13 @@ exports[`TextInput plain read only text input 1`] = `
       type="text"
       value="read only plain"
     />
-  </div>
+  </span>
 </DocumentFragment>
 `;
 
 exports[`TextInput read only text input using isReadOnly 1`] = `
 <DocumentFragment>
-  <div
+  <span
     class="pf-v5-c-form-control"
   >
     <input
@@ -110,13 +110,13 @@ exports[`TextInput read only text input using isReadOnly 1`] = `
       type="text"
       value="read only"
     />
-  </div>
+  </span>
 </DocumentFragment>
 `;
 
 exports[`TextInput simple text input 1`] = `
 <DocumentFragment>
-  <div
+  <span
     class="pf-v5-c-form-control"
   >
     <input
@@ -128,13 +128,13 @@ exports[`TextInput simple text input 1`] = `
       type="text"
       value="test input"
     />
-  </div>
+  </span>
 </DocumentFragment>
 `;
 
 exports[`TextInput validated text input error 1`] = `
 <DocumentFragment>
-  <div
+  <span
     class="pf-v5-c-form-control pf-m-error"
   >
     <input
@@ -146,10 +146,10 @@ exports[`TextInput validated text input error 1`] = `
       type="text"
       value="test input"
     />
-    <div
+    <span
       class="pf-v5-c-form-control__utilities"
     >
-      <div
+      <span
         class="pf-v5-c-form-control__icon pf-m-status"
       >
         <svg
@@ -165,8 +165,8 @@ exports[`TextInput validated text input error 1`] = `
             d="M504 256c0 136.997-111.043 248-248 248S8 392.997 8 256C8 119.083 119.043 8 256 8s248 111.083 248 248zm-248 50c-25.405 0-46 20.595-46 46s20.595 46 46 46 46-20.595 46-46-20.595-46-46-46zm-43.673-165.346l7.418 136c.347 6.364 5.609 11.346 11.982 11.346h48.546c6.373 0 11.635-4.982 11.982-11.346l7.418-136c.375-6.874-5.098-12.654-11.982-12.654h-63.383c-6.884 0-12.356 5.78-11.981 12.654z"
           />
         </svg>
-      </div>
-    </div>
-  </div>
+      </span>
+    </span>
+  </span>
 </DocumentFragment>
 `;