@patternfly/react-core 5.0.0-alpha.90 → 5.0.0-alpha.92

package/src/components/Progress/__tests__/__snapshots__/ProgressHelperText.test.tsx.snap

@@ -3,7 +3,7 @@
 exports[`Matches the snapshot 1`] = `
 <DocumentFragment>
   <div
-    class="pf-c-progress__helper-text"
+    class="pf-v5-c-progress__helper-text"
   >
     test
   </div>

package/src/components/ProgressStepper/__tests__/ProgressStep.test.tsx

@@ -25,7 +25,7 @@ test('Renders children', () => {
 
 test('Renders with class pf-c-progress-stepper__step on the containing li element', () => {
   render(<ProgressStep>Test</ProgressStep>);
-  expect(screen.getByRole('listitem')).toHaveClass('pf-c-progress-stepper__step');
+  expect(screen.getByRole('listitem')).toHaveClass('pf-v5-c-progress-stepper__step');
 });
 
 test('Renders with custom class name on the containing li element when className prop is provided', () => {
@@ -33,14 +33,14 @@ test('Renders with custom class name on the containing li element when className
   expect(screen.getByRole('listitem')).toHaveClass('custom-class');
 });
 
-['default', undefined].forEach(variant => {
+['default', undefined].forEach((variant) => {
   test(`Renders with no additional classes when variant=${variant} on containing li element`, () => {
     render(<ProgressStep variant={`${variant as ProgressStepVariant}`}>Test</ProgressStep>);
-    expect(screen.getByRole('listitem')).toHaveClass('pf-c-progress-stepper__step', { exact: true });
+    expect(screen.getByRole('listitem')).toHaveClass('pf-v5-c-progress-stepper__step', { exact: true });
   });
 });
 
-['success', 'info', 'warning', 'danger'].forEach(variant => {
+['success', 'info', 'warning', 'danger'].forEach((variant) => {
   test(`Does not render with class pf-m-${variant} by default on containing li element`, () => {
     render(<ProgressStep>Test</ProgressStep>);
     expect(screen.getByRole('listitem')).not.toHaveClass(`pf-m-${variant}`);
@@ -79,7 +79,7 @@ test('Renders the element passed via the icon prop', () => {
 
 test('Renders the icon element inside span element with class pf-c-progress-stepper__step-icon', () => {
   render(<ProgressStep icon="Custom Icon">Test</ProgressStep>);
-  expect(screen.getByText('Custom Icon')).toHaveClass('pf-c-progress-stepper__step-icon');
+  expect(screen.getByText('Custom Icon')).toHaveClass('pf-v5-c-progress-stepper__step-icon');
 });
 
 test('Does not render with class pf-m-current by default on containing li element', () => {
@@ -114,12 +114,12 @@ test('Renders the element passed via the description prop', () => {
 
 test('Renders the description element inside div element with class pf-c-progress-stepper__step-description', () => {
   render(<ProgressStep description="Description">Test</ProgressStep>);
-  expect(screen.getByText('Description')).toHaveClass('pf-c-progress-stepper__step-description');
+  expect(screen.getByText('Description')).toHaveClass('pf-v5-c-progress-stepper__step-description');
 });
 
 test('Renders children inside class pf-c-progress-stepper__step-title', () => {
   render(<ProgressStep>Test</ProgressStep>);
-  expect(screen.getByText('Test')).toHaveClass('pf-c-progress-stepper__step-title');
+  expect(screen.getByText('Test')).toHaveClass('pf-v5-c-progress-stepper__step-title');
 });
 
 test('Renders Component element as div by default', () => {
@@ -149,7 +149,7 @@ test('Does not renders with aria-labelledBy by default on Component element', ()
 
 test('Renders with an accessible name that matches children', () => {
   render(
-    <ProgressStep popoverRender={stepRef => <div>Popover content</div>} id="test-id" titleId="title-id">
+    <ProgressStep popoverRender={(stepRef) => <div>Popover content</div>} id="test-id" titleId="title-id">
       Test
     </ProgressStep>
   );

package/src/components/ProgressStepper/__tests__/ProgressStepper.test.tsx

@@ -18,12 +18,12 @@ test('Renders children', () => {
 
 test('Renders with only class name pf-c-progress-stepper by default', () => {
   render(<ProgressStepper>Test</ProgressStepper>);
-  expect(screen.getByRole('list')).toHaveClass('pf-c-progress-stepper', { exact: true });
+  expect(screen.getByRole('list')).toHaveClass('pf-v5-c-progress-stepper', { exact: true });
 });
 
 test('Renders with class name pf-c-progress-stepper', () => {
   render(<ProgressStepper>Test</ProgressStepper>);
-  expect(screen.getByRole('list')).toHaveClass('pf-c-progress-stepper');
+  expect(screen.getByRole('list')).toHaveClass('pf-v5-c-progress-stepper');
 });
 
 test('Renders with custom class name when className prop is provided', () => {

package/src/components/ProgressStepper/__tests__/__snapshots__/ProgressStep.test.tsx.snap

@@ -3,21 +3,21 @@
 exports[`Matches snapshot 1`] = `
 <DocumentFragment>
   <li
-    class="pf-c-progress-stepper__step"
+    class="pf-v5-c-progress-stepper__step"
     role="listitem"
   >
     <div
-      class="pf-c-progress-stepper__step-connector"
+      class="pf-v5-c-progress-stepper__step-connector"
     >
       <span
-        class="pf-c-progress-stepper__step-icon"
+        class="pf-v5-c-progress-stepper__step-icon"
       />
     </div>
     <div
-      class="pf-c-progress-stepper__step-main"
+      class="pf-v5-c-progress-stepper__step-main"
     >
       <div
-        class="pf-c-progress-stepper__step-title"
+        class="pf-v5-c-progress-stepper__step-title"
       >
         Test
       </div>

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

@@ -3,7 +3,7 @@
 exports[`Matches the snapshot 1`] = `
 <DocumentFragment>
   <ol
-    class="pf-c-progress-stepper"
+    class="pf-v5-c-progress-stepper"
     role="list"
   >
     Test

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

@@ -3,13 +3,13 @@
 exports[`Radio controlled 1`] = `
 <DocumentFragment>
   <div
-    class="pf-c-radio pf-m-standalone"
+    class="pf-v5-c-radio pf-m-standalone"
   >
     <input
       aria-invalid="false"
       aria-label="check"
       checked=""
-      class="pf-c-radio__input"
+      class="pf-v5-c-radio__input"
       data-ouia-component-id="OUIA-Generated-Radio-1"
       data-ouia-component-type="PF4/Radio"
       data-ouia-safe="true"
@@ -24,12 +24,12 @@ exports[`Radio controlled 1`] = `
 exports[`Radio isDisabled 1`] = `
 <DocumentFragment>
   <div
-    class="pf-c-radio pf-m-standalone"
+    class="pf-v5-c-radio pf-m-standalone"
   >
     <input
       aria-invalid="false"
       aria-label="check"
-      class="pf-c-radio__input"
+      class="pf-v5-c-radio__input"
       data-ouia-component-id="OUIA-Generated-Radio-3"
       data-ouia-component-type="PF4/Radio"
       data-ouia-safe="true"
@@ -45,17 +45,17 @@ exports[`Radio isDisabled 1`] = `
 exports[`Radio isLabelBeforeButton 1`] = `
 <DocumentFragment>
   <div
-    class="pf-c-radio"
+    class="pf-v5-c-radio"
   >
     <label
-      class="pf-c-radio__label"
+      class="pf-v5-c-radio__label"
       for="check"
     >
       Radio label
     </label>
     <input
       aria-invalid="false"
-      class="pf-c-radio__input"
+      class="pf-v5-c-radio__input"
       data-ouia-component-id="OUIA-Generated-Radio-4"
       data-ouia-component-type="PF4/Radio"
       data-ouia-safe="true"
@@ -70,12 +70,12 @@ exports[`Radio isLabelBeforeButton 1`] = `
 exports[`Radio isLabelWrapped 1`] = `
 <DocumentFragment>
   <label
-    class="pf-c-radio"
+    class="pf-v5-c-radio"
     for="check"
   >
     <input
       aria-invalid="false"
-      class="pf-c-radio__input"
+      class="pf-v5-c-radio__input"
       data-ouia-component-id="OUIA-Generated-Radio-5"
       data-ouia-component-type="PF4/Radio"
       data-ouia-safe="true"
@@ -84,7 +84,7 @@ exports[`Radio isLabelWrapped 1`] = `
       type="radio"
     />
     <span
-      class="pf-c-radio__label"
+      class="pf-v5-c-radio__label"
     >
       Radio label
     </span>
@@ -95,12 +95,12 @@ exports[`Radio isLabelWrapped 1`] = `
 exports[`Radio label is function 1`] = `
 <DocumentFragment>
   <div
-    class="pf-c-radio"
+    class="pf-v5-c-radio"
   >
     <input
       aria-invalid="false"
       checked=""
-      class="pf-c-radio__input"
+      class="pf-v5-c-radio__input"
       data-ouia-component-id="OUIA-Generated-Radio-7"
       data-ouia-component-type="PF4/Radio"
       data-ouia-safe="true"
@@ -109,7 +109,7 @@ exports[`Radio label is function 1`] = `
       type="radio"
     />
     <label
-      class="pf-c-radio__label"
+      class="pf-v5-c-radio__label"
       for="check"
     >
       <h1>
@@ -123,12 +123,12 @@ exports[`Radio label is function 1`] = `
 exports[`Radio label is node 1`] = `
 <DocumentFragment>
   <div
-    class="pf-c-radio"
+    class="pf-v5-c-radio"
   >
     <input
       aria-invalid="false"
       checked=""
-      class="pf-c-radio__input"
+      class="pf-v5-c-radio__input"
       data-ouia-component-id="OUIA-Generated-Radio-8"
       data-ouia-component-type="PF4/Radio"
       data-ouia-safe="true"
@@ -137,7 +137,7 @@ exports[`Radio label is node 1`] = `
       type="radio"
     />
     <label
-      class="pf-c-radio__label"
+      class="pf-v5-c-radio__label"
       for="check"
     >
       <h1>
@@ -151,12 +151,12 @@ exports[`Radio label is node 1`] = `
 exports[`Radio label is string 1`] = `
 <DocumentFragment>
   <div
-    class="pf-c-radio"
+    class="pf-v5-c-radio"
   >
     <input
       aria-invalid="false"
       checked=""
-      class="pf-c-radio__input"
+      class="pf-v5-c-radio__input"
       data-ouia-component-id="OUIA-Generated-Radio-6"
       data-ouia-component-type="PF4/Radio"
       data-ouia-safe="true"
@@ -165,7 +165,7 @@ exports[`Radio label is string 1`] = `
       type="radio"
     />
     <label
-      class="pf-c-radio__label"
+      class="pf-v5-c-radio__label"
       for="check"
     >
       Label
@@ -177,13 +177,13 @@ exports[`Radio label is string 1`] = `
 exports[`Radio passing HTML attribute 1`] = `
 <DocumentFragment>
   <div
-    class="pf-c-radio"
+    class="pf-v5-c-radio"
   >
     <input
       aria-invalid="false"
       aria-labelledby="labelId"
       checked=""
-      class="pf-c-radio__input"
+      class="pf-v5-c-radio__input"
       data-ouia-component-id="OUIA-Generated-Radio-10"
       data-ouia-component-type="PF4/Radio"
       data-ouia-safe="true"
@@ -192,7 +192,7 @@ exports[`Radio passing HTML attribute 1`] = `
       type="radio"
     />
     <label
-      class="pf-c-radio__label"
+      class="pf-v5-c-radio__label"
       for="check"
     >
       label
@@ -204,12 +204,12 @@ exports[`Radio passing HTML attribute 1`] = `
 exports[`Radio passing class 1`] = `
 <DocumentFragment>
   <div
-    class="pf-c-radio class-123"
+    class="pf-v5-c-radio class-123"
   >
     <input
       aria-invalid="false"
       checked=""
-      class="pf-c-radio__input"
+      class="pf-v5-c-radio__input"
       data-ouia-component-id="OUIA-Generated-Radio-9"
       data-ouia-component-type="PF4/Radio"
       data-ouia-safe="true"
@@ -218,7 +218,7 @@ exports[`Radio passing class 1`] = `
       type="radio"
     />
     <label
-      class="pf-c-radio__label"
+      class="pf-v5-c-radio__label"
       for="check"
     >
       label
@@ -230,12 +230,12 @@ exports[`Radio passing class 1`] = `
 exports[`Radio uncontrolled 1`] = `
 <DocumentFragment>
   <div
-    class="pf-c-radio pf-m-standalone"
+    class="pf-v5-c-radio pf-m-standalone"
   >
     <input
       aria-invalid="false"
       aria-label="check"
-      class="pf-c-radio__input"
+      class="pf-v5-c-radio__input"
       data-ouia-component-id="OUIA-Generated-Radio-2"
       data-ouia-component-type="PF4/Radio"
       data-ouia-safe="true"

package/src/components/SearchInput/SearchInput.tsx

@@ -297,7 +297,7 @@ const SearchInputBase: React.FunctionComponent<SearchInputProps> = ({
         <TextInputGroupUtilities>
           {resultsCount && <Badge isRead>{resultsCount}</Badge>}
           {!!onNextClick && !!onPreviousClick && (
-            <div className="pf-c-text-input-group__group">
+            <div className="pf-v5-c-text-input-group__group">
               <Button
                 variant={ButtonVariant.plain}
                 aria-label={previousNavigationButtonAriaLabel}

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

@@ -30,7 +30,7 @@ describe('SearchInput', () => {
 
   test('result count', () => {
     render(<SearchInput {...props} resultsCount={3} aria-label="simple text input" data-testid="test-id" />);
-    expect(screen.getByTestId('test-id').querySelector('.pf-c-badge')).toBeInTheDocument();
+    expect(screen.getByTestId('test-id').querySelector('.pf-v5-c-badge')).toBeInTheDocument();
   });
 
   test('renders search input in strict mode', async () => {
@@ -64,8 +64,8 @@ describe('SearchInput', () => {
     render(<SearchInput {...props} resultsCount="3 / 7" aria-label="simple text input" data-testid="test-id" />);
 
     const input = screen.getByTestId('test-id');
-    expect(input.querySelector('.pf-c-text-input-group__group')).toBeInTheDocument();
-    expect(input.querySelector('.pf-c-badge')).toBeInTheDocument();
+    expect(input.querySelector('.pf-v5-c-text-input-group__group')).toBeInTheDocument();
+    expect(input.querySelector('.pf-v5-c-badge')).toBeInTheDocument();
 
     await user.click(screen.getByRole('button', { name: 'Previous' }));
     expect(props.onPreviousClick).toHaveBeenCalled();