@patternfly/react-core 6.5.0-prerelease.47 → 6.5.0-prerelease.49

package/src/components/Popover/examples/PopoverAlert.tsx

@@ -1,20 +1,20 @@
 import { useState } from 'react';
 import { Popover, Button } from '@patternfly/react-core';
-import BellIcon from '@patternfly/react-icons/dist/esm/icons/bell-icon';
-import InfoCircleIcon from '@patternfly/react-icons/dist/esm/icons/info-circle-icon';
-import CheckCircleIcon from '@patternfly/react-icons/dist/esm/icons/check-circle-icon';
-import ExclamationTriangleIcon from '@patternfly/react-icons/dist/esm/icons/exclamation-triangle-icon';
-import ExclamationCircleIcon from '@patternfly/react-icons/dist/esm/icons/exclamation-circle-icon';
+import RhUiNotificationFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-notification-fill-icon';
+import RhUiInformationFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-information-fill-icon';
+import RhUiCheckCircleFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-check-circle-fill-icon';
+import RhUiWarningFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-warning-fill-icon';
+import RhUiErrorFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-error-fill-icon';
 
 export const AlertPopover: React.FunctionComponent = () => {
   const [alertSeverityVariant, setAlertSeverityVariant] = useState('default');
 
   const alertIcons = {
-    custom: <BellIcon />,
-    info: <InfoCircleIcon />,
-    success: <CheckCircleIcon />,
-    warning: <ExclamationTriangleIcon />,
-    danger: <ExclamationCircleIcon />
+    custom: <RhUiNotificationFillIcon />,
+    info: <RhUiInformationFillIcon />,
+    success: <RhUiCheckCircleFillIcon />,
+    warning: <RhUiWarningFillIcon />,
+    danger: <RhUiErrorFillIcon />
   };
 
   return (

package/src/components/Progress/ProgressContainer.tsx

@@ -2,9 +2,9 @@ import { Fragment, useState, useRef, useEffect } from 'react';
 import progressStyle from '@patternfly/react-styles/css/components/Progress/progress';
 import { css } from '@patternfly/react-styles';
 import { Tooltip, TooltipPosition } from '../Tooltip';
-import CheckCircleIcon from '@patternfly/react-icons/dist/esm/icons/check-circle-icon';
-import ExclamationCircleIcon from '@patternfly/react-icons/dist/esm/icons/exclamation-circle-icon';
-import ExclamationTriangleIcon from '@patternfly/react-icons/dist/esm/icons/exclamation-triangle-icon';
+import RhUiCheckCircleFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-check-circle-fill-icon';
+import RhUiErrorFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-error-fill-icon';
+import RhUiWarningFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-warning-fill-icon';
 import { AriaProps, ProgressBar } from './ProgressBar';
 import { ProgressHelperText } from './ProgressHelperText';
 
@@ -63,9 +63,9 @@ export interface ProgressContainerProps extends Omit<React.HTMLProps<HTMLDivElem
 }
 
 const variantToIcon = {
-  danger: ExclamationCircleIcon,
-  success: CheckCircleIcon,
-  warning: ExclamationTriangleIcon
+  danger: RhUiErrorFillIcon,
+  success: RhUiCheckCircleFillIcon,
+  warning: RhUiWarningFillIcon
 };
 
 export const ProgressContainer: React.FunctionComponent<ProgressContainerProps> = ({

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

@@ -27,24 +27,12 @@ exports[`ProgressContainer should match snapshot (auto-generated) 1`] = `
         fill="currentColor"
         height="1em"
         role="img"
+        viewBox="0 0 32 32"
         width="1em"
       >
-        <svg
-          class="pf-v6-icon-default"
-          viewBox="0 0 512 512"
-        >
-          <path
-            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>
-        <svg
-          class="pf-v6-icon-rh-ui"
-          viewBox="0 0 32 32"
-        >
-          <path
-            d="M14.75 16V9a1.25 1.25 0 0 1 2.5 0v7a1.25 1.25 0 0 1-2.5 0ZM31 16c0 8.271-6.729 15-15 15S1 24.271 1 16 7.729 1 16 1s15 6.729 15 15Zm-2 0c0-7.168-5.832-13-13-13S3 8.832 3 16s5.832 13 13 13 13-5.832 13-13Zm-13 4.261a1.75 1.75 0 1 0 .001 3.501A1.75 1.75 0 0 0 16 20.261Z"
-          />
-        </svg>
+        <path
+          d="M16 1C7.729 1 1 7.729 1 16s6.729 15 15 15 15-6.729 15-15S24.271 1 16 1Zm-1.5 8a1.5 1.5 0 1 1 3 0v7a1.5 1.5 0 1 1-3 0V9ZM16 25.001a2 2 0 1 1-.001-3.999A2 2 0 0 1 16 25.001Z"
+        />
       </svg>
     </span>
   </div>

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

@@ -294,24 +294,12 @@ exports[`Progress variant danger 1`] = `
           fill="currentColor"
           height="1em"
           role="img"
+          viewBox="0 0 32 32"
           width="1em"
         >
-          <svg
-            class="pf-v6-icon-default"
-            viewBox="0 0 512 512"
-          >
-            <path
-              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>
-          <svg
-            class="pf-v6-icon-rh-ui"
-            viewBox="0 0 32 32"
-          >
-            <path
-              d="M14.75 16V9a1.25 1.25 0 0 1 2.5 0v7a1.25 1.25 0 0 1-2.5 0ZM31 16c0 8.271-6.729 15-15 15S1 24.271 1 16 7.729 1 16 1s15 6.729 15 15Zm-2 0c0-7.168-5.832-13-13-13S3 8.832 3 16s5.832 13 13 13 13-5.832 13-13Zm-13 4.261a1.75 1.75 0 1 0 .001 3.501A1.75 1.75 0 0 0 16 20.261Z"
-            />
-          </svg>
+          <path
+            d="M16 1C7.729 1 1 7.729 1 16s6.729 15 15 15 15-6.729 15-15S24.271 1 16 1Zm-1.5 8a1.5 1.5 0 1 1 3 0v7a1.5 1.5 0 1 1-3 0V9ZM16 25.001a2 2 0 1 1-.001-3.999A2 2 0 0 1 16 25.001Z"
+          />
         </svg>
       </span>
     </div>
@@ -359,24 +347,12 @@ exports[`Progress variant success 1`] = `
           fill="currentColor"
           height="1em"
           role="img"
+          viewBox="0 0 32 32"
           width="1em"
         >
-          <svg
-            class="pf-v6-icon-default"
-            viewBox="0 0 512 512"
-          >
-            <path
-              d="M504 256c0 136.967-111.033 248-248 248S8 392.967 8 256 119.033 8 256 8s248 111.033 248 248zM227.314 387.314l184-184c6.248-6.248 6.248-16.379 0-22.627l-22.627-22.627c-6.248-6.249-16.379-6.249-22.628 0L216 308.118l-70.059-70.059c-6.248-6.248-16.379-6.248-22.628 0l-22.627 22.627c-6.248 6.248-6.248 16.379 0 22.627l104 104c6.249 6.249 16.379 6.249 22.628.001z"
-            />
-          </svg>
-          <svg
-            class="pf-v6-icon-rh-ui"
-            viewBox="0 0 32 32"
-          >
-            <path
-              d="M16 1C7.729 1 1 7.729 1 16s6.729 15 15 15 15-6.729 15-15S24.271 1 16 1Zm0 28C8.832 29 3 23.168 3 16S8.832 3 16 3s13 5.832 13 13-5.832 13-13 13Zm7.707-17.707a.999.999 0 0 1 0 1.414l-8.646 8.646c-.292.292-.676.438-1.061.438s-.768-.146-1.061-.438l-4.646-4.646a.999.999 0 1 1 1.414-1.414L14 19.586l8.293-8.293a.999.999 0 0 1 1.414 0Z"
-            />
-          </svg>
+          <path
+            d="M16 1C7.729 1 1 7.729 1 16s6.729 15 15 15 15-6.729 15-15S24.271 1 16 1Zm7.795 11.795-8.646 8.646c-.317.317-.733.475-1.149.475s-.832-.158-1.149-.475l-4.646-4.646a1.126 1.126 0 0 1 1.591-1.591l4.205 4.205 8.205-8.205a1.126 1.126 0 0 1 1.591 1.591Z"
+          />
         </svg>
       </span>
     </div>
@@ -424,24 +400,12 @@ exports[`Progress variant warning 1`] = `
           fill="currentColor"
           height="1em"
           role="img"
+          viewBox="0 0 32 32"
           width="1em"
         >
-          <svg
-            class="pf-v6-icon-default"
-            viewBox="0 0 576 512"
-          >
-            <path
-              d="M569.517 440.013C587.975 472.007 564.806 512 527.94 512H48.054c-36.937 0-59.999-40.055-41.577-71.987L246.423 23.985c18.467-32.009 64.72-31.951 83.154 0l239.94 416.028zM288 354c-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>
-          <svg
-            class="pf-v6-icon-rh-ui"
-            viewBox="0 0 32 32"
-          >
-            <path
-              d="M31.461 27.771 17.3 2.301a1.499 1.499 0 0 0-2.623 0L.517 27.771c-.261.469-.255 1.025.018 1.489s.756.74 1.294.74h28.322c.537 0 1.021-.276 1.293-.74a1.49 1.49 0 0 0 .018-1.489ZM2.678 28l13.31-23.942L29.3 28H2.678ZM16 11.75c.69 0 1.25.56 1.25 1.25v5a1.25 1.25 0 0 1-2.5 0v-5c0-.69.56-1.25 1.25-1.25Zm1.75 12.261a1.75 1.75 0 1 1-3.501-.001 1.75 1.75 0 0 1 3.501.001Z"
-            />
-          </svg>
+          <path
+            d="m31.874 28.514-15.011-27a1.001 1.001 0 0 0-1.748 0l-15.011 27A1 1 0 0 0 .978 30H31a1 1 0 0 0 .874-1.486ZM14.5 12a1.5 1.5 0 0 1 3 0v5a1.5 1.5 0 0 1-3 0v-5ZM16 26.001a2 2 0 1 1-.001-3.999A2 2 0 0 1 16 26.001Z"
+          />
         </svg>
       </span>
     </div>

package/src/components/ProgressStepper/ProgressStep.tsx

@@ -1,10 +1,10 @@
 import { useRef } from 'react';
 import styles from '@patternfly/react-styles/css/components/ProgressStepper/progress-stepper';
 import { css } from '@patternfly/react-styles';
-import CheckCircleIcon from '@patternfly/react-icons/dist/esm/icons/check-circle-icon';
+import RhUiCheckCircleFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-check-circle-fill-icon';
 import ResourcesFullIcon from '@patternfly/react-icons/dist/esm/icons/resources-full-icon';
-import ExclamationTriangleIcon from '@patternfly/react-icons/dist/esm/icons/exclamation-triangle-icon';
-import ExclamationCircleIcon from '@patternfly/react-icons/dist/esm/icons/exclamation-circle-icon';
+import RhUiWarningFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-warning-fill-icon';
+import RhUiErrorFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-error-fill-icon';
 
 export enum ProgressStepVariant {
   default = 'default',
@@ -43,10 +43,10 @@ export interface ProgressStepProps extends React.DetailedHTMLProps<
 const variantIcons = {
   default: undefined as any,
   pending: undefined as any,
-  success: <CheckCircleIcon />,
+  success: <RhUiCheckCircleFillIcon />,
   info: <ResourcesFullIcon />,
-  warning: <ExclamationTriangleIcon />,
-  danger: <ExclamationCircleIcon />
+  warning: <RhUiWarningFillIcon />,
+  danger: <RhUiErrorFillIcon />
 };
 
 const variantStyle = {

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

@@ -3,10 +3,10 @@ import { ProgressStep, ProgressStepVariant } from '../ProgressStep';
 import { capitalize } from '../../../helpers';
 import styles from '@patternfly/react-styles/css/components/ProgressStepper/progress-stepper';
 
-jest.mock('@patternfly/react-icons/dist/esm/icons/check-circle-icon', () => () => 'Success icon mock');
+jest.mock('@patternfly/react-icons/dist/esm/icons/rh-ui-check-circle-fill-icon', () => () => 'Success icon mock');
 jest.mock('@patternfly/react-icons/dist/esm/icons/resources-full-icon', () => () => 'Info icon mock');
-jest.mock('@patternfly/react-icons/dist/esm/icons/exclamation-triangle-icon', () => () => 'Warning icon mock');
-jest.mock('@patternfly/react-icons/dist/esm/icons/exclamation-circle-icon', () => () => 'Danger icon mock');
+jest.mock('@patternfly/react-icons/dist/esm/icons/rh-ui-warning-fill-icon', () => () => 'Warning icon mock');
+jest.mock('@patternfly/react-icons/dist/esm/icons/rh-ui-error-fill-icon', () => () => 'Danger icon mock');
 
 test('Renders without children', () => {
   render(

package/src/components/Select/examples/Select.md

@@ -10,7 +10,7 @@ ouia: true
 
 import { Fragment, useEffect, useRef, useState } from 'react';
 import RhMicronsCloseIcon from '@patternfly/react-icons/dist/esm/icons/rh-microns-close-icon';
-import BellIcon from '@patternfly/react-icons/dist/esm/icons/bell-icon';
+import RhUiNotificationFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-notification-fill-icon';
 
 ## Examples
 

package/src/components/Select/examples/SelectOptionVariations.tsx

@@ -1,6 +1,6 @@
 import { useState } from 'react';
 import { Select, SelectOption, SelectList, MenuToggle, MenuToggleElement } from '@patternfly/react-core';
-import BellIcon from '@patternfly/react-icons/dist/esm/icons/bell-icon';
+import RhUiNotificationFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-notification-fill-icon';
 
 export const SelectOptionVariations: React.FunctionComponent = () => {
   const [isOpen, setIsOpen] = useState(false);
@@ -57,7 +57,7 @@ export const SelectOptionVariations: React.FunctionComponent = () => {
         >
           Option with link
         </SelectOption>
-        <SelectOption value="Option with icon" icon={<BellIcon />}>
+        <SelectOption value="Option with icon" icon={<RhUiNotificationFillIcon />}>
           Option with icon
         </SelectOption>
         <SelectOption value="Disabled option" isDisabled>

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

@@ -64,24 +64,12 @@ exports[`TextInput invalid text input 1`] = `
           fill="currentColor"
           height="1em"
           role="img"
+          viewBox="0 0 32 32"
           width="1em"
         >
-          <svg
-            class="pf-v6-icon-default"
-            viewBox="0 0 512 512"
-          >
-            <path
-              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>
-          <svg
-            class="pf-v6-icon-rh-ui"
-            viewBox="0 0 32 32"
-          >
-            <path
-              d="M14.75 16V9a1.25 1.25 0 0 1 2.5 0v7a1.25 1.25 0 0 1-2.5 0ZM31 16c0 8.271-6.729 15-15 15S1 24.271 1 16 7.729 1 16 1s15 6.729 15 15Zm-2 0c0-7.168-5.832-13-13-13S3 8.832 3 16s5.832 13 13 13 13-5.832 13-13Zm-13 4.261a1.75 1.75 0 1 0 .001 3.501A1.75 1.75 0 0 0 16 20.261Z"
-            />
-          </svg>
+          <path
+            d="M16 1C7.729 1 1 7.729 1 16s6.729 15 15 15 15-6.729 15-15S24.271 1 16 1Zm-1.5 8a1.5 1.5 0 1 1 3 0v7a1.5 1.5 0 1 1-3 0V9ZM16 25.001a2 2 0 1 1-.001-3.999A2 2 0 0 1 16 25.001Z"
+          />
         </svg>
       </span>
     </span>
@@ -171,24 +159,12 @@ exports[`TextInput validated text input error 1`] = `
           fill="currentColor"
           height="1em"
           role="img"
+          viewBox="0 0 32 32"
           width="1em"
         >
-          <svg
-            class="pf-v6-icon-default"
-            viewBox="0 0 512 512"
-          >
-            <path
-              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>
-          <svg
-            class="pf-v6-icon-rh-ui"
-            viewBox="0 0 32 32"
-          >
-            <path
-              d="M14.75 16V9a1.25 1.25 0 0 1 2.5 0v7a1.25 1.25 0 0 1-2.5 0ZM31 16c0 8.271-6.729 15-15 15S1 24.271 1 16 7.729 1 16 1s15 6.729 15 15Zm-2 0c0-7.168-5.832-13-13-13S3 8.832 3 16s5.832 13 13 13 13-5.832 13-13Zm-13 4.261a1.75 1.75 0 1 0 .001 3.501A1.75 1.75 0 0 0 16 20.261Z"
-            />
-          </svg>
+          <path
+            d="M16 1C7.729 1 1 7.729 1 16s6.729 15 15 15 15-6.729 15-15S24.271 1 16 1Zm-1.5 8a1.5 1.5 0 1 1 3 0v7a1.5 1.5 0 1 1-3 0V9ZM16 25.001a2 2 0 1 1-.001-3.999A2 2 0 0 1 16 25.001Z"
+          />
         </svg>
       </span>
     </span>

package/src/components/Wizard/Wizard.tsx

@@ -59,6 +59,10 @@ export interface WizardProps extends React.HTMLProps<HTMLDivElement> {
    * are called.
    */
   shouldFocusContent?: boolean;
+  /** Adds plain styling to the wizard. */
+  isPlain?: boolean;
+  /** @beta Prevents the wizard from automatically applying plain styling when glass theme is enabled. */
+  isNoPlainOnGlass?: boolean;
 }
 
 export const Wizard = ({
@@ -77,6 +81,8 @@ export const Wizard = ({
   onSave,
   onClose,
   shouldFocusContent = true,
+  isPlain = false,
+  isNoPlainOnGlass = false,
   ...wrapperProps
 }: WizardProps) => {
   const [activeStepIndex, setActiveStepIndex] = useState(startIndex);
@@ -181,7 +187,12 @@ export const Wizard = ({
       mainWrapperRef={wrapperRef}
     >
       <div
-        className={css(styles.wizard, className)}
+        className={css(
+          styles.wizard,
+          isPlain && styles.modifiers.plain,
+          isNoPlainOnGlass && styles.modifiers.noPlainOnGlass,
+          className
+        )}
         style={{
           ...(height ? { [wizardHeightToken.name]: typeof height === 'number' ? `${height}px` : height } : {}),
           ...(width ? { width } : {})

package/src/components/Wizard/WizardNavItem.tsx

@@ -2,9 +2,9 @@ import { useEffect, useState } from 'react';
 import { css } from '@patternfly/react-styles';
 import styles from '@patternfly/react-styles/css/components/Wizard/wizard';
 import RhMicronsCaretDownIcon from '@patternfly/react-icons/dist/esm/icons/rh-microns-caret-down-icon';
-import ExclamationCircleIcon from '@patternfly/react-icons/dist/esm/icons/exclamation-circle-icon';
-import CheckCircleIcon from '@patternfly/react-icons/dist/esm/icons/check-circle-icon';
-import ExclamationTriangleIcon from '@patternfly/react-icons/dist/esm/icons/exclamation-triangle-icon';
+import RhUiErrorFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-error-fill-icon';
+import RhUiCheckCircleFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-check-circle-fill-icon';
+import RhUiWarningFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-warning-fill-icon';
 
 import { OUIAProps, useOUIAProps } from '../../helpers';
 import { WizardNavItemStatus } from './types';
@@ -109,9 +109,9 @@ export const WizardNavItem = ({
           <>
             <span className="pf-v6-screen-reader">, {status}</span>
             <span className={css(styles.wizardNavLinkStatusIcon)}>
-              {status === WizardNavItemStatus.Error && <ExclamationCircleIcon />}
-              {status === WizardNavItemStatus.Success && <CheckCircleIcon />}
-              {status === WizardNavItemStatus.Warning && <ExclamationTriangleIcon />}
+              {status === WizardNavItemStatus.Error && <RhUiErrorFillIcon />}
+              {status === WizardNavItemStatus.Success && <RhUiCheckCircleFillIcon />}
+              {status === WizardNavItemStatus.Warning && <RhUiWarningFillIcon />}
             </span>
           </>
         )}

package/src/components/Wizard/WizardToggle.tsx

@@ -3,8 +3,8 @@ import { css } from '@patternfly/react-styles';
 import styles from '@patternfly/react-styles/css/components/Wizard/wizard';
 import RhMicronsCaretRightIcon from '@patternfly/react-icons/dist/esm/icons/rh-microns-caret-right-icon';
 import CaretDownIcon from '@patternfly/react-icons/dist/esm/icons/caret-down-icon';
-import ExclamationCircleIcon from '@patternfly/react-icons/dist/esm/icons/exclamation-circle-icon';
-import CheckCircleIcon from '@patternfly/react-icons/dist/esm/icons/check-circle-icon';
+import RhUiErrorFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-error-fill-icon';
+import RhUiCheckCircleFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-check-circle-fill-icon';
 
 import { KeyTypes } from '../../helpers/constants';
 import { WizardStepType, isWizardSubStep } from './types';
@@ -100,12 +100,12 @@ export const WizardToggle = ({
           >
             {isActiveStepStatus === 'error' && (
               <span className={css(styles.wizardToggleStatusIcon)}>
-                <ExclamationCircleIcon />
+                <RhUiErrorFillIcon />
               </span>
             )}
             {isActiveStepStatus === 'success' && (
               <span className={css(styles.wizardToggleStatusIcon)}>
-                <CheckCircleIcon />
+                <RhUiCheckCircleFillIcon />
               </span>
             )}
             {isActiveStepStatus !== 'success' && isActiveStepStatus !== 'error' && (

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

@@ -2,6 +2,7 @@ import { render, screen } from '@testing-library/react';
 import userEvent from '@testing-library/user-event';
 
 import { Wizard, WizardFooterProps, WizardStep, WizardNavProps, WizardStepChangeScope } from '../';
+import styles from '@patternfly/react-styles/css/components/Wizard/wizard';
 
 test('renders step when child is of type WizardStep', () => {
   render(
@@ -666,3 +667,23 @@ test('clicking parent step navigates to first visible sub-step when first sub-st
     WizardStepChangeScope.Nav
   );
 });
+
+test(`Renders with ${styles.modifiers.plain} class when isPlain is true`, () => {
+  render(
+    <Wizard isPlain data-testid="wizard-plain">
+      <WizardStep id="test-step" name="Test step" />
+    </Wizard>
+  );
+
+  expect(screen.getByTestId('wizard-plain')).toHaveClass(styles.modifiers.plain);
+});
+
+test(`Renders with ${styles.modifiers.noPlainOnGlass} class when isNoPlainOnGlass is true`, () => {
+  render(
+    <Wizard isNoPlainOnGlass data-testid="wizard-no-plain">
+      <WizardStep id="test-step" name="Test step" />
+    </Wizard>
+  );
+
+  expect(screen.getByTestId('wizard-no-plain')).toHaveClass(styles.modifiers.noPlainOnGlass);
+});

package/src/components/Wizard/examples/Wizard.md

@@ -63,6 +63,12 @@ import layout from '@patternfly/react-styles/css/layouts/Bullseye/bullseye';
 
 ```
 
+### Plain
+
+```ts file="./WizardPlain.tsx"
+
+```
+
 ### Focus content on next/back
 
 To focus the main content element of the `Wizard`, pass in the `shouldFocusContent` property. It is recommended that this is passed in so that users can navigate through a `WizardStep` content in order.

package/src/components/Wizard/examples/WizardPlain.tsx

@@ -0,0 +1,15 @@
+import { Wizard, WizardStep } from '@patternfly/react-core';
+
+export const WizardPlain: React.FunctionComponent = () => (
+  <Wizard height={400} title="Plain wizard" isPlain>
+    <WizardStep name="Step 1" id="plain-first-step">
+      <p>Step 1 content</p>
+    </WizardStep>
+    <WizardStep name="Step 2" id="plain-second-step">
+      <p>Step 2 content</p>
+    </WizardStep>
+    <WizardStep name="Review" id="plain-review-step" footer={{ nextButtonText: 'Finish' }}>
+      <p>Review step content</p>
+    </WizardStep>
+  </Wizard>
+);

package/src/demos/Button/Button.md

@@ -4,7 +4,7 @@ section: components
 ---
 
 import { useState } from 'react';
-import CheckCircleIcon from '@patternfly/react-icons/dist/esm/icons/check-circle-icon';
+import RhUiCheckCircleFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-check-circle-fill-icon';
 
 ## Demos 
 

package/src/demos/Button/examples/ButtonProgress.tsx

@@ -1,6 +1,6 @@
 import { useState } from 'react';
 import { Form, FormGroup, ActionGroup, TextInput, Button } from '@patternfly/react-core';
-import CheckCircleIcon from '@patternfly/react-icons/dist/esm/icons/check-circle-icon';
+import RhUiCheckCircleFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-check-circle-fill-icon';
 
 export const ButtonProgress: React.FunctionComponent = () => {
   const [loginState, setLoginState] = useState<'notLoggedIn' | 'loading' | 'loggedIn'>('notLoggedIn');
@@ -41,7 +41,7 @@ export const ButtonProgress: React.FunctionComponent = () => {
               : null
           }
           isLoading={loginState === 'loading'}
-          icon={loginState === 'loggedIn' ? <CheckCircleIcon /> : null}
+          icon={loginState === 'loggedIn' ? <RhUiCheckCircleFillIcon /> : null}
           spinnerAriaValueText="Loading..."
         >
           {loginState === 'notLoggedIn' && 'Link account and log in'}

package/src/demos/CardDemos.md

@@ -2,12 +2,13 @@
 id: Card
 section: components
 ---
+
 import { Fragment, useState } from 'react';
 import EllipsisVIcon from '@patternfly/react-icons/dist/esm/icons/ellipsis-v-icon';
-import InfoCircleIcon from '@patternfly/react-icons/dist/js/icons/info-circle-icon';
+import RhUiInformationFillIcon from '@patternfly/react-icons/dist/js/icons/rh-ui-information-fill-icon';
 import ArrowRightIcon from '@patternfly/react-icons/dist/js/icons/arrow-right-icon';
 import ExternalLinkAltIcon from '@patternfly/react-icons/dist/js/icons/external-link-alt-icon';
-import { CheckCircleIcon, ExclamationCircleIcon, ExclamationTriangleIcon, BellIcon } from '@patternfly/react-icons';
+import { RhUiCheckCircleFillIcon, RhUiErrorFillIcon, RhUiWarningFillIcon, RhUiNotificationFillIcon } from '@patternfly/react-icons';
 import { Table, Thead, Tbody, Tr, Th, Td, ExpandableRowContent } from '@patternfly/react-table';
 import { Chart, ChartAxis, ChartGroup, ChartVoronoiContainer, ChartStack, ChartBar, ChartTooltip, ChartDonutThreshold, ChartDonutUtilization, ChartArea, ChartContainer, ChartLabel } from '@patternfly/react-charts/victory';
 import chart_color_yellow_100 from '@patternfly/react-tokens/dist/esm/chart_color_yellow_100';

package/src/demos/CustomMenus/CustomMenus.md

@@ -15,7 +15,7 @@ import LayerGroupIcon from '@patternfly/react-icons/dist/esm/icons/layer-group-i
 import CubeIcon from '@patternfly/react-icons/dist/esm/icons/cube-icon';
 import BarsIcon from '@patternfly/react-icons/dist/esm/icons/bars-icon';
 import ClipboardIcon from '@patternfly/react-icons/dist/esm/icons/clipboard-icon';
-import BellIcon from '@patternfly/react-icons/dist/esm/icons/bell-icon';
+import RhUiNotificationFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-notification-fill-icon';
 import ThIcon from '@patternfly/react-icons/dist/esm/icons/th-icon';
 import brandImg from '../assets/PF-IconLogo.svg';
 import SearchIcon from '@patternfly/react-icons/dist/esm/icons/search-icon';

package/src/demos/CustomMenus/examples/ActionsMenuDemo.tsx

@@ -3,7 +3,7 @@ import { MenuToggle, MenuItemAction, Select, SelectGroup, SelectList, SelectOpti
 import BarsIcon from '@patternfly/react-icons/dist/esm/icons/bars-icon';
 import ClipboardIcon from '@patternfly/react-icons/dist/esm/icons/clipboard-icon';
 import CodeBranchIcon from '@patternfly/react-icons/dist/esm/icons/code-branch-icon';
-import BellIcon from '@patternfly/react-icons/dist/esm/icons/bell-icon';
+import RhUiNotificationFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-notification-fill-icon';
 
 export const ActionsMenuDemo: React.FunctionComponent = () => {
   const [isOpen, setIsOpen] = useState<boolean>(false);
@@ -61,7 +61,7 @@ export const ActionsMenuDemo: React.FunctionComponent = () => {
           <SelectOption
             isDisabled
             isSelected={selectedItems.includes(1)}
-            actions={<MenuItemAction icon={<BellIcon />} actionId="alert" aria-label="Alert" />}
+            actions={<MenuItemAction icon={<RhUiNotificationFillIcon />} actionId="alert" aria-label="Alert" />}
             description="This is a description"
             value={1}
           >

package/src/demos/DataList/examples/DataListBasic.tsx

@@ -27,9 +27,9 @@ import { DashboardWrapper } from '@patternfly/react-core/dist/js/demos/Dashboard
 import CodeBranchIcon from '@patternfly/react-icons/dist/esm/icons/code-branch-icon';
 import CodeIcon from '@patternfly/react-icons/dist/esm/icons/code-icon';
 import CubeIcon from '@patternfly/react-icons/dist/esm/icons/cube-icon';
-import ExclamationTriangleIcon from '@patternfly/react-icons/dist/esm/icons/exclamation-triangle-icon';
-import CheckCircleIcon from '@patternfly/react-icons/dist/esm/icons/check-circle-icon';
-import ExclamationCircleIcon from '@patternfly/react-icons/dist/esm/icons/exclamation-circle-icon';
+import RhUiWarningFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-warning-fill-icon';
+import RhUiCheckCircleFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-check-circle-fill-icon';
+import RhUiErrorFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-error-fill-icon';
 
 export const DataListBasic: React.FunctionComponent = () => {
   const renderPagination = () => <Pagination itemCount={5} page={1} variant="top" isCompact />;
@@ -169,20 +169,20 @@ export const DataListBasic: React.FunctionComponent = () => {
                             </FlexItem>
                             <FlexItem>
                               <Icon status="success">
-                                <CheckCircleIcon />
+                                <RhUiCheckCircleFillIcon />
                               </Icon>
                               11
                               <span className="pf-v6-screen-reader">Completed</span>
                             </FlexItem>
                             <FlexItem>
                               <Icon status="warning">
-                                <ExclamationTriangleIcon />
+                                <RhUiWarningFillIcon />
                               </Icon>
                               4 <span className="pf-v6-screen-reader">Warnings</span>
                             </FlexItem>
                             <FlexItem>
                               <Icon status="danger">
-                                <ExclamationCircleIcon />
+                                <RhUiErrorFillIcon />
                               </Icon>
                               1 <span className="pf-v6-screen-reader">Error</span>
                             </FlexItem>
@@ -319,19 +319,19 @@ export const DataListBasic: React.FunctionComponent = () => {
                             </FlexItem>
                             <FlexItem>
                               <Icon status="success">
-                                <CheckCircleIcon />
+                                <RhUiCheckCircleFillIcon />
                               </Icon>
                               11 <span className="pf-v6-screen-reader">Completed</span>
                             </FlexItem>
                             <FlexItem>
                               <Icon status="warning">
-                                <ExclamationTriangleIcon />
+                                <RhUiWarningFillIcon />
                               </Icon>
                               4 <span className="pf-v6-screen-reader">Warnings</span>
                             </FlexItem>
                             <FlexItem>
                               <Icon status="danger">
-                                <ExclamationCircleIcon />
+                                <RhUiErrorFillIcon />
                               </Icon>
                               1 <span className="pf-v6-screen-reader">Error</span>
                             </FlexItem>

package/src/demos/DataListDemo.md

@@ -13,9 +13,9 @@ import { css } from '@patternfly/react-styles';
 
 import CodeIcon from '@patternfly/react-icons/dist/esm/icons/code-icon';
 import CubeIcon from '@patternfly/react-icons/dist/esm/icons/cube-icon';
-import ExclamationTriangleIcon from '@patternfly/react-icons/dist/esm/icons/exclamation-triangle-icon';
-import CheckCircleIcon from '@patternfly/react-icons/dist/esm/icons/check-circle-icon';
-import ExclamationCircleIcon from '@patternfly/react-icons/dist/esm/icons/exclamation-circle-icon';
+import RhUiWarningFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-warning-fill-icon';
+import RhUiCheckCircleFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-check-circle-fill-icon';
+import RhUiErrorFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-error-fill-icon';
 import { DashboardWrapper } from '@patternfly/react-core/dist/js/demos/DashboardWrapper';
 import { rows } from '@patternfly/react-core/dist/esm/demos/sampleData';