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

package/src/components/Panel/PanelMain.tsx

@@ -19,7 +19,7 @@ export const PanelMain: React.FunctionComponent<PanelMainProps> = ({
 }: PanelMainProps) => (
   <div
     className={css(styles.panelMain, className)}
-    style={{ '--pf-c-panel__main--MaxHeight': maxHeight } as React.CSSProperties}
+    style={{ '--pf-v5-c-panel__main--MaxHeight': maxHeight } as React.CSSProperties}
     {...props}
   >
     {children}

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

@@ -22,12 +22,12 @@ test('Renders children', () => {
 
 test('Renders with the class pf-c-panel', () => {
   render(<Panel>Test</Panel>);
-  expect(screen.getByText('Test')).toHaveClass('pf-c-panel');
+  expect(screen.getByText('Test')).toHaveClass('pf-v5-c-panel');
 });
 
 test('Renders with only the class pf-c-panel by default', () => {
   render(<Panel>Test</Panel>);
-  expect(screen.getByText('Test')).toHaveClass('pf-c-panel', { exact: true });
+  expect(screen.getByText('Test')).toHaveClass('pf-v5-c-panel', { exact: true });
 });
 
 test('Renders with custom class name when className prop is passed', () => {
@@ -57,7 +57,7 @@ test('Renders with ref', async () => {
   const BasicPanel = () => {
     const [lastClickWasInPanel, setLastClickWasInPanel] = React.useState(false);
 
-    const handleClick = event => {
+    const handleClick = (event) => {
       if (panelRef.current && panelRef.current.contains(event.target)) {
         setLastClickWasInPanel(true);
       } else {

package/src/components/Panel/__tests__/PanelFooter.test.tsx

@@ -18,12 +18,12 @@ test('Renders children', () => {
 
 test('Renders with the class pf-c-panel__footer', () => {
   render(<PanelFooter>Test</PanelFooter>);
-  expect(screen.getByText('Test')).toHaveClass('pf-c-panel__footer');
+  expect(screen.getByText('Test')).toHaveClass('pf-v5-c-panel__footer');
 });
 
 test('Renders with only the class pf-c-panel__footer by default', () => {
   render(<PanelFooter>Test</PanelFooter>);
-  expect(screen.getByText('Test')).toHaveClass('pf-c-panel__footer', { exact: true });
+  expect(screen.getByText('Test')).toHaveClass('pf-v5-c-panel__footer', { exact: true });
 });
 
 test('Renders with custom class name when className prop is passed', () => {

package/src/components/Panel/__tests__/PanelHeader.test.tsx

@@ -18,12 +18,12 @@ test('Renders children', () => {
 
 test('Renders with the class pf-c-panel__header', () => {
   render(<PanelHeader>Test</PanelHeader>);
-  expect(screen.getByText('Test')).toHaveClass('pf-c-panel__header');
+  expect(screen.getByText('Test')).toHaveClass('pf-v5-c-panel__header');
 });
 
 test('Renders with only the class pf-c-panel__header by default', () => {
   render(<PanelHeader>Test</PanelHeader>);
-  expect(screen.getByText('Test')).toHaveClass('pf-c-panel__header', { exact: true });
+  expect(screen.getByText('Test')).toHaveClass('pf-v5-c-panel__header', { exact: true });
 });
 
 test('Renders with custom class name when className prop is passed', () => {

package/src/components/Panel/__tests__/PanelMain.test.tsx

@@ -18,12 +18,12 @@ test('Renders children', () => {
 
 test('Renders with the class pf-c-panel__main', () => {
   render(<PanelMain>Test</PanelMain>);
-  expect(screen.getByText('Test')).toHaveClass('pf-c-panel__main');
+  expect(screen.getByText('Test')).toHaveClass('pf-v5-c-panel__main');
 });
 
 test('Renders with only the class pf-c-panel__main by default', () => {
   render(<PanelMain>Test</PanelMain>);
-  expect(screen.getByText('Test')).toHaveClass('pf-c-panel__main', { exact: true });
+  expect(screen.getByText('Test')).toHaveClass('pf-v5-c-panel__main', { exact: true });
 });
 
 test('Renders with custom class name when className prop is passed', () => {
@@ -34,7 +34,7 @@ test('Renders with custom class name when className prop is passed', () => {
 test('Renders with custom max height name when maxHeight prop is passed', () => {
   render(<PanelMain maxHeight="100px">Test</PanelMain>);
   const styles = getComputedStyle(screen.getByText('Test'));
-  expect(styles.getPropertyValue('--pf-c-panel__main--MaxHeight')).toBe('100px');
+  expect(styles.getPropertyValue('--pf-v5-c-panel__main--MaxHeight')).toBe('100px');
 });
 
 test('Renders with the inherited element props spread to the component', () => {

package/src/components/Panel/__tests__/PanelMainBody.test.tsx

@@ -18,12 +18,12 @@ test('Renders children', () => {
 
 test('Renders with the class pf-c-panel__main-body', () => {
   render(<PanelMainBody>Test</PanelMainBody>);
-  expect(screen.getByText('Test')).toHaveClass('pf-c-panel__main-body');
+  expect(screen.getByText('Test')).toHaveClass('pf-v5-c-panel__main-body');
 });
 
 test('Renders with only the class pf-c-panel__main-body by default', () => {
   render(<PanelMainBody>Test</PanelMainBody>);
-  expect(screen.getByText('Test')).toHaveClass('pf-c-panel__main-body', { exact: true });
+  expect(screen.getByText('Test')).toHaveClass('pf-v5-c-panel__main-body', { exact: true });
 });
 
 test('Renders with custom class name when className prop is passed', () => {

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

@@ -3,10 +3,9 @@
 exports[`Matches the snapshot 1`] = `
 <DocumentFragment>
   <div
-    class="pf-c-panel"
+    class="pf-v5-c-panel"
   >
     Test
   </div>
 </DocumentFragment>
 `;
-

package/src/components/Panel/__tests__/__snapshots__/PanelFooter.test.tsx.snap

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

package/src/components/Panel/__tests__/__snapshots__/PanelHeader.test.tsx.snap

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

package/src/components/Panel/__tests__/__snapshots__/PanelMain.test.tsx.snap

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

package/src/components/Panel/__tests__/__snapshots__/PanelMainBody.test.tsx.snap

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

package/src/components/Popover/PopoverHeader.tsx

@@ -36,7 +36,7 @@ export const PopoverHeader: React.FunctionComponent<PopoverHeaderProps> = ({
       {icon && <PopoverHeaderIcon>{icon}</PopoverHeaderIcon>}
       <PopoverHeaderText headingLevel={titleHeadingLevel}>
         {alertSeverityVariant && alertSeverityScreenReaderText && (
-          <span className="pf-u-screen-reader">{alertSeverityScreenReaderText}</span>
+          <span className="pf-v5-u-screen-reader">{alertSeverityScreenReaderText}</span>
         )}
         {children}
       </PopoverHeaderText>

package/src/components/Popover/__tests__/Generated/__snapshots__/PopoverArrow.test.tsx.snap

@@ -3,7 +3,7 @@
 exports[`PopoverArrow should match snapshot (auto-generated) 1`] = `
 <DocumentFragment>
   <div
-    class="pf-c-popover__arrow ''"
+    class="pf-v5-c-popover__arrow ''"
   />
 </DocumentFragment>
 `;

package/src/components/Popover/__tests__/Generated/__snapshots__/PopoverBody.test.tsx.snap

@@ -3,7 +3,7 @@
 exports[`PopoverBody should match snapshot (auto-generated) 1`] = `
 <DocumentFragment>
   <div
-    class="pf-c-popover__body"
+    class="pf-v5-c-popover__body"
     id="string"
   >
     <div>

package/src/components/Popover/__tests__/Generated/__snapshots__/PopoverCloseButton.test.tsx.snap

@@ -3,12 +3,12 @@
 exports[`PopoverCloseButton should match snapshot (auto-generated) 1`] = `
 <DocumentFragment>
   <div
-    class="pf-c-popover__close"
+    class="pf-v5-c-popover__close"
   >
     <button
       aria-disabled="false"
       aria-label="string"
-      class="pf-c-button pf-m-plain"
+      class="pf-v5-c-button pf-m-plain"
       data-ouia-component-id="OUIA-Generated-Button-plain-1"
       data-ouia-component-type="PF4/Button"
       data-ouia-safe="true"
@@ -17,7 +17,7 @@ exports[`PopoverCloseButton should match snapshot (auto-generated) 1`] = `
     >
       <svg
         aria-hidden="true"
-        class="pf-svg"
+        class="pf-v5-svg"
         fill="currentColor"
         role="img"
         viewBox="0 0 352 512"

package/src/components/Popover/__tests__/Generated/__snapshots__/PopoverContent.test.tsx.snap

@@ -3,7 +3,7 @@
 exports[`PopoverContent should match snapshot (auto-generated) 1`] = `
 <DocumentFragment>
   <div
-    class="pf-c-popover__content null"
+    class="pf-v5-c-popover__content null"
   >
     <div>
       ReactNode

package/src/components/Popover/__tests__/Generated/__snapshots__/PopoverDialog.test.tsx.snap

@@ -4,7 +4,7 @@ exports[`PopoverDialog should match snapshot (auto-generated) 1`] = `
 <DocumentFragment>
   <div
     aria-modal="true"
-    class="pf-c-popover pf-m-top null"
+    class="pf-v5-c-popover pf-m-top null"
     role="dialog"
   >
     ReactNode

package/src/components/Popover/__tests__/Generated/__snapshots__/PopoverFooter.test.tsx.snap

@@ -3,7 +3,7 @@
 exports[`PopoverFooter should match snapshot (auto-generated) 1`] = `
 <DocumentFragment>
   <footer
-    class="pf-c-popover__footer ''"
+    class="pf-v5-c-popover__footer ''"
   >
     <div>
       ReactNode

package/src/components/Popover/__tests__/Generated/__snapshots__/PopoverHeader.test.tsx.snap

@@ -3,14 +3,14 @@
 exports[`PopoverHeader should match snapshot (auto-generated) 1`] = `
 <DocumentFragment>
   <header
-    class="pf-c-popover__header"
+    class="pf-v5-c-popover__header"
   >
     <div
-      class="pf-c-popover__title"
+      class="pf-v5-c-popover__title"
       id="string"
     >
       <h6
-        class="pf-c-popover__title-text"
+        class="pf-v5-c-popover__title-text"
       >
         <div>
           ReactNode

package/src/components/Progress/__tests__/Generated/__snapshots__/ProgressBar.test.tsx.snap

@@ -3,14 +3,14 @@
 exports[`ProgressBar should match snapshot (auto-generated) 1`] = `
 <DocumentFragment>
   <div
-    class="pf-c-progress__bar ''"
+    class="pf-v5-c-progress__bar ''"
   >
     <div
-      class="pf-c-progress__indicator"
+      class="pf-v5-c-progress__indicator"
       style="width: 42%;"
     >
       <span
-        class="pf-c-progress__measure"
+        class="pf-v5-c-progress__measure"
       >
         ReactNode
       </span>

package/src/components/Progress/__tests__/Generated/__snapshots__/ProgressContainer.test.tsx.snap

@@ -4,26 +4,26 @@ exports[`ProgressContainer should match snapshot (auto-generated) 1`] = `
 <DocumentFragment>
   <div
     aria-hidden="true"
-    class="pf-c-progress__description"
+    class="pf-v5-c-progress__description"
     id="string-description"
   >
     ''
   </div>
   <div
     aria-hidden="true"
-    class="pf-c-progress__status"
+    class="pf-v5-c-progress__status"
   >
     <span
-      class="pf-c-progress__measure"
+      class="pf-v5-c-progress__measure"
     >
       42%
     </span>
     <span
-      class="pf-c-progress__status-icon"
+      class="pf-v5-c-progress__status-icon"
     >
       <svg
         aria-hidden="true"
-        class="pf-svg"
+        class="pf-v5-svg"
         fill="currentColor"
         role="img"
         viewBox="0 0 512 512"
@@ -35,15 +35,15 @@ exports[`ProgressContainer should match snapshot (auto-generated) 1`] = `
     </span>
   </div>
   <div
-    class="pf-c-progress__bar"
+    class="pf-v5-c-progress__bar"
     role="progressbar"
   >
     <div
-      class="pf-c-progress__indicator"
+      class="pf-v5-c-progress__indicator"
       style="width: 42%;"
     >
       <span
-        class="pf-c-progress__measure"
+        class="pf-v5-c-progress__measure"
       />
     </div>
   </div>

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

@@ -20,7 +20,7 @@ test('Renders children', () => {
 test('Renders with class pf-c-progress__helper-text on the div containing the helper text component', () => {
   render(<ProgressHelperText>Test</ProgressHelperText>);
 
-  expect(screen.getByText('Test')).toHaveClass('pf-c-progress__helper-text');
+  expect(screen.getByText('Test')).toHaveClass('pf-v5-c-progress__helper-text');
 });
 
 test('Renders with inherited element props spread to the component', () => {