diff --git a/packages/react-core/src/components/Wizard/examples/Wizard.md b/packages/react-core/src/components/Wizard/examples/Wizard.md
index 027987b3e34..377c4969894 100644
--- a/packages/react-core/src/components/Wizard/examples/Wizard.md
+++ b/packages/react-core/src/components/Wizard/examples/Wizard.md
@@ -133,8 +133,10 @@ class IncrementallyEnabledStepsWizard extends React.Component {
       stepIdReached: 1
     };
     this.onNext = ({ id }) => {
+      const [, orderIndex] = id.split('-');
+
       this.setState({
-        stepIdReached: this.state.stepIdReached < id ? id : this.state.stepIdReached
+        stepIdReached: this.state.stepIdReached < orderIndex ? orderIndex : this.state.stepIdReached
       });
     };
     this.closeWizard = () => {
@@ -146,27 +148,27 @@ class IncrementallyEnabledStepsWizard extends React.Component {
     const { stepIdReached } = this.state;
 
     const steps = [
-      { id: 'incrementally-enabled-1', name: 'First step', component: <p>Step 1 content</p> },
+      { id: 'incrementallyEnabled-1', name: 'First step', component: <p>Step 1 content</p> },
       {
-        id: 'incrementally-enabled-2',
+        id: 'incrementallyEnabled-2',
         name: 'Second step',
         component: <p>Step 2 content</p>,
         canJumpTo: stepIdReached >= 2
       },
       {
-        id: 'incrementally-enabled-3',
+        id: 'incrementallyEnabled-3',
         name: 'Third step',
         component: <p>Step 3 content</p>,
         canJumpTo: stepIdReached >= 3
       },
       {
-        id: 'incrementally-enabled-4',
+        id: 'incrementallyEnabled-4',
         name: 'Fourth step',
         component: <p>Step 4 content</p>,
         canJumpTo: stepIdReached >= 4
       },
       {
-        id: 'incrementally-enabled-5',
+        id: 'incrementallyEnabled-5',
         name: 'Review',
         component: <p>Review step content</p>,
         nextButtonText: 'Finish',
@@ -311,8 +313,10 @@ class ValidationWizard extends React.Component {
 
     this.onNext = ({ id, name }, { prevId, prevName }) => {
       console.log(`current id: ${id}, current name: ${name}, previous id: ${prevId}, previous name: ${prevName}`);
+      const [, orderIndex] = id.split('-');
+
       this.setState({
-        stepIdReached: this.state.stepIdReached < id ? id : this.state.stepIdReached
+        stepIdReached: this.state.stepIdReached < orderIndex ? orderIndex : this.state.stepIdReached
       });
       this.areAllStepsValid();
     };
@@ -812,10 +816,10 @@ class GetCurrentStepWizard extends React.Component {
       step: 1
     };
     this.onCurrentStepChanged = ({ id }) => {
-        this.setState({
-            step: id
-        });
-    }
+      this.setState({
+        step: id
+      });
+    };
     this.closeWizard = () => {
       console.log('close wizard');
     };
diff --git a/packages/react-core/src/next/components/Wizard/Wizard.tsx b/packages/react-core/src/next/components/Wizard/Wizard.tsx
index 8034ab498bb..337ec12b536 100644
--- a/packages/react-core/src/next/components/Wizard/Wizard.tsx
+++ b/packages/react-core/src/next/components/Wizard/Wizard.tsx
@@ -42,8 +42,6 @@ export interface WizardProps extends React.HTMLProps<HTMLDivElement> {
   height?: number | string;
   /** Disables navigation items that haven't been visited. Defaults to false */
   isStepVisitRequired?: boolean;
-  /** Flag to unmount inactive steps instead of hiding. Defaults to true */
-  hasUnmountedSteps?: boolean;
   /** Callback function when a step in the navigation is clicked */
   onNavByIndex?: WizardNavStepFunction;
   /** Callback function after next button is clicked */
@@ -66,7 +64,6 @@ export const Wizard = ({
   nav,
   startIndex = 1,
   isStepVisitRequired = false,
-  hasUnmountedSteps = true,
   onNavByIndex,
   onNext,
   onBack,
@@ -74,42 +71,37 @@ export const Wizard = ({
   onClose,
   ...wrapperProps
 }: WizardProps) => {
-  const [currentStepIndex, setCurrentStepIndex] = React.useState(startIndex);
+  const [activeStepIndex, setActiveStepIndex] = React.useState(startIndex);
   const initialSteps = buildSteps(children);
 
   const goToNextStep = (steps: WizardControlStep[] = initialSteps) => {
-    const newStepIndex =
-      steps.findIndex((step, index) => index + 1 > currentStepIndex && !step.isHidden && !isWizardParentStep(step)) + 1;
+    const newStepIndex = steps.find(step => step.index > activeStepIndex && !step.isHidden && !isWizardParentStep(step))
+      ?.index;
 
-    if (currentStepIndex >= steps.length || !newStepIndex) {
+    if (activeStepIndex >= steps.length || !newStepIndex) {
       return onSave ? onSave() : onClose?.();
     }
 
-    const currStep = isWizardParentStep(steps[currentStepIndex])
-      ? steps[currentStepIndex + 1]
-      : steps[currentStepIndex];
-    const prevStep = steps[currentStepIndex - 1];
-
-    setCurrentStepIndex(newStepIndex);
+    const currStep = isWizardParentStep(steps[activeStepIndex]) ? steps[activeStepIndex + 1] : steps[activeStepIndex];
+    const prevStep = steps[activeStepIndex - 1];
 
-    return onNext?.(normalizeNavStep(currStep, steps), normalizeNavStep(prevStep, steps));
+    setActiveStepIndex(newStepIndex);
+    return onNext?.(normalizeNavStep(currStep), normalizeNavStep(prevStep));
   };
 
   const goToPrevStep = (steps: WizardControlStep[] = initialSteps) => {
     const newStepIndex =
       findLastIndex(
         steps,
-        (step: WizardControlStep, index: number) =>
-          index + 1 < currentStepIndex && !step.isHidden && !isWizardParentStep(step)
+        (step: WizardControlStep) => step.index < activeStepIndex && !step.isHidden && !isWizardParentStep(step)
       ) + 1;
-    const currStep = isWizardParentStep(steps[currentStepIndex - 2])
-      ? steps[currentStepIndex - 3]
-      : steps[currentStepIndex - 2];
-    const prevStep = steps[currentStepIndex - 1];
-
-    setCurrentStepIndex(newStepIndex);
+    const currStep = isWizardParentStep(steps[activeStepIndex - 2])
+      ? steps[activeStepIndex - 3]
+      : steps[activeStepIndex - 2];
+    const prevStep = steps[activeStepIndex - 1];
 
-    return onBack?.(normalizeNavStep(currStep, steps), normalizeNavStep(prevStep, steps));
+    setActiveStepIndex(newStepIndex);
+    return onBack?.(normalizeNavStep(currStep), normalizeNavStep(prevStep));
   };
 
   const goToStepByIndex = (steps: WizardControlStep[] = initialSteps, index: number) => {
@@ -120,46 +112,40 @@ export const Wizard = ({
       index = 1;
     } else if (index > lastStepIndex) {
       index = lastStepIndex;
-    } else if (steps[index - 1].isHidden) {
-      // eslint-disable-next-line no-console
-      console.error('Wizard: Unable to navigate to hidden step.');
     }
 
     const currStep = steps[index - 1];
-    const prevStep = steps[currentStepIndex - 1];
-    setCurrentStepIndex(index);
+    const prevStep = steps[activeStepIndex - 1];
 
-    return onNavByIndex?.(normalizeNavStep(currStep, steps), normalizeNavStep(prevStep, steps));
+    setActiveStepIndex(index);
+    return onNavByIndex?.(normalizeNavStep(currStep), normalizeNavStep(prevStep));
   };
 
   const goToStepById = (steps: WizardControlStep[] = initialSteps, id: number | string) => {
-    const stepIndex = steps.findIndex(step => step.id === id) + 1;
+    const step = steps.find(step => step.id === id);
+    const stepIndex = step?.index;
+    const lastStepIndex = steps.length + 1;
 
-    if (stepIndex > 0 && stepIndex < steps.length + 1 && !steps[stepIndex].isHidden) {
-      setCurrentStepIndex(stepIndex);
-    } else {
-      // eslint-disable-next-line no-console
-      console.error(`Wizard: Unable to navigate to step with id: ${id}.`);
+    if (stepIndex > 0 && stepIndex < lastStepIndex && !step.isHidden) {
+      setActiveStepIndex(stepIndex);
     }
   };
 
   const goToStepByName = (steps: WizardControlStep[] = initialSteps, name: string) => {
-    const stepIndex = initialSteps.findIndex(step => step.name === name) + 1;
+    const step = steps.find(step => step.name === name);
+    const stepIndex = step?.index;
+    const lastStepIndex = steps.length + 1;
 
-    if (stepIndex > 0 && stepIndex < steps.length + 1 && !steps[stepIndex].isHidden) {
-      setCurrentStepIndex(stepIndex);
-    } else {
-      // eslint-disable-next-line no-console
-      console.error(`Wizard: Unable to navigate to step with name: ${name}.`);
+    if (stepIndex > 0 && stepIndex < lastStepIndex && !step.isHidden) {
+      setActiveStepIndex(stepIndex);
     }
   };
 
   return (
     <WizardContextProvider
       steps={initialSteps}
-      currentStepIndex={currentStepIndex}
+      activeStepIndex={activeStepIndex}
       footer={footer}
-      isStepVisitRequired={isStepVisitRequired}
       onNext={goToNextStep}
       onBack={goToPrevStep}
       onClose={onClose}
@@ -176,37 +162,32 @@ export const Wizard = ({
         {...wrapperProps}
       >
         {header}
-        <WizardInternal nav={nav} hasUnmountedSteps={hasUnmountedSteps} isStepVisitRequired={isStepVisitRequired} />
+        <WizardInternal nav={nav} isStepVisitRequired={isStepVisitRequired} />
       </div>
     </WizardContextProvider>
   );
 };
 
-const WizardInternal = ({
-  nav,
-  hasUnmountedSteps,
-  isStepVisitRequired
-}: Pick<WizardProps, 'nav' | 'hasUnmountedSteps' | 'isStepVisitRequired'>) => {
-  const { currentStep, steps, footer, goToStepByIndex } = useWizardContext();
+const WizardInternal = ({ nav, isStepVisitRequired }: Pick<WizardProps, 'nav' | 'isStepVisitRequired'>) => {
+  const { activeStep, steps, footer, goToStepByIndex } = useWizardContext();
   const [isNavExpanded, setIsNavExpanded] = React.useState(false);
 
   const wizardNav = React.useMemo(() => {
     if (isCustomWizardNav(nav)) {
-      return typeof nav === 'function' ? nav(isNavExpanded, steps, currentStep, goToStepByIndex) : nav;
+      return typeof nav === 'function' ? nav(isNavExpanded, steps, activeStep, goToStepByIndex) : nav;
     }
 
     return <WizardNavInternal nav={nav} isNavExpanded={isNavExpanded} isStepVisitRequired={isStepVisitRequired} />;
-  }, [currentStep, isStepVisitRequired, goToStepByIndex, isNavExpanded, nav, steps]);
+  }, [activeStep, isStepVisitRequired, goToStepByIndex, isNavExpanded, nav, steps]);
 
   return (
     <WizardToggle
       nav={wizardNav}
       footer={footer}
       steps={steps}
-      currentStep={currentStep}
+      activeStep={activeStep}
       isNavExpanded={isNavExpanded}
       toggleNavExpanded={() => setIsNavExpanded(prevIsExpanded => !prevIsExpanded)}
-      hasUnmountedSteps={hasUnmountedSteps}
     />
   );
 };
diff --git a/packages/react-core/src/next/components/Wizard/WizardBody.tsx b/packages/react-core/src/next/components/Wizard/WizardBody.tsx
index 872851d1c46..ab0362bb02b 100644
--- a/packages/react-core/src/next/components/Wizard/WizardBody.tsx
+++ b/packages/react-core/src/next/components/Wizard/WizardBody.tsx
@@ -10,7 +10,7 @@ import { css } from '@patternfly/react-styles';
 export interface WizardBodyProps {
   children: React.ReactNode | React.ReactNode[];
   /** Set to true to remove the default body padding */
-  hasNoBodyPadding?: boolean;
+  hasNoPadding?: boolean;
   /** An aria-label to use for the wrapper element */
   'aria-label'?: string;
   /** Sets the aria-labelledby attribute for the wrapper element */
@@ -21,13 +21,13 @@ export interface WizardBodyProps {
 
 export const WizardBody = ({
   children,
-  hasNoBodyPadding = false,
+  hasNoPadding = false,
   'aria-label': ariaLabel,
   'aria-labelledby': ariaLabelledBy,
   component: WrapperComponent = 'div'
 }: WizardBodyProps) => (
   <WrapperComponent aria-label={ariaLabel} aria-labelledby={ariaLabelledBy} className={css(styles.wizardMain)}>
-    <div className={css(styles.wizardMainBody, hasNoBodyPadding && styles.modifiers.noPadding)}>{children}</div>
+    <div className={css(styles.wizardMainBody, hasNoPadding && styles.modifiers.noPadding)}>{children}</div>
   </WrapperComponent>
 );
 
diff --git a/packages/react-core/src/next/components/Wizard/WizardContext.tsx b/packages/react-core/src/next/components/Wizard/WizardContext.tsx
index 8e9c25de173..c3f7cd88dc5 100644
--- a/packages/react-core/src/next/components/Wizard/WizardContext.tsx
+++ b/packages/react-core/src/next/components/Wizard/WizardContext.tsx
@@ -1,16 +1,14 @@
 import React from 'react';
 
-import { isCustomWizardFooter, isWizardParentStep, WizardControlStep, WizardFooterType } from './types';
-import { getCurrentStep } from './utils';
+import { isCustomWizardFooter, WizardControlStep, WizardFooterType } from './types';
+import { getActiveStep } from './utils';
 import { WizardFooter, WizardFooterProps } from './WizardFooter';
 
 export interface WizardContextProps {
   /** List of steps */
   steps: WizardControlStep[];
   /** Current step */
-  currentStep: WizardControlStep;
-  /** Current step index */
-  currentStepIndex: number;
+  activeStep: WizardControlStep;
   /** Footer element */
   footer: React.ReactElement;
   /** Navigate to the next step */
@@ -31,17 +29,14 @@ export interface WizardContextProps {
   getStep: (stepId: number | string) => WizardControlStep;
   /** Set step by ID */
   setStep: (step: Pick<WizardControlStep, 'id'> & Partial<WizardControlStep>) => void;
-  /** Toggle step visibility by ID */
-  toggleStep: (stepId: number | string, isHidden: boolean) => void;
 }
 
 export const WizardContext = React.createContext({} as WizardContextProps);
 
 export interface WizardContextProviderProps {
   steps: WizardControlStep[];
-  currentStepIndex: number;
+  activeStepIndex: number;
   footer: WizardFooterType;
-  isStepVisitRequired: boolean;
   children: React.ReactElement;
   onNext(steps: WizardControlStep[]): void;
   onBack(steps: WizardControlStep[]): void;
@@ -54,8 +49,7 @@ export interface WizardContextProviderProps {
 export const WizardContextProvider: React.FunctionComponent<WizardContextProviderProps> = ({
   steps: initialSteps,
   footer: initialFooter,
-  currentStepIndex,
-  isStepVisitRequired,
+  activeStepIndex,
   children,
   onNext,
   onBack,
@@ -64,43 +58,58 @@ export const WizardContextProvider: React.FunctionComponent<WizardContextProvide
   goToStepByName,
   goToStepByIndex
 }) => {
-  const [steps, setSteps] = React.useState(initialSteps);
+  const [currentSteps, setCurrentSteps] = React.useState(initialSteps);
   const [currentFooter, setCurrentFooter] = React.useState(
     typeof initialFooter !== 'function' ? initialFooter : undefined
   );
-  const currentStep = getCurrentStep(steps, currentStepIndex);
+
+  // Combined initial and current state steps
+  const steps = React.useMemo(
+    () =>
+      currentSteps.map((currentStepProps, index) => {
+        // eslint-disable-next-line @typescript-eslint/no-unused-vars
+        const { isVisited, ...initialStepProps } = initialSteps[index];
+
+        return {
+          ...currentStepProps,
+          ...initialStepProps
+        };
+      }),
+    [initialSteps, currentSteps]
+  );
+  const activeStep = getActiveStep(steps, activeStepIndex);
 
   const goToNextStep = React.useCallback(() => onNext(steps), [onNext, steps]);
   const goToPrevStep = React.useCallback(() => onBack(steps), [onBack, steps]);
 
   const footer = React.useMemo(() => {
-    const wizardFooter = currentFooter || initialFooter;
+    const wizardFooter = activeStep?.footer || currentFooter || initialFooter;
 
     if (isCustomWizardFooter(wizardFooter)) {
       const customFooter = wizardFooter;
 
       return typeof customFooter === 'function'
-        ? customFooter(currentStep, goToNextStep, goToPrevStep, onClose)
+        ? customFooter(activeStep, goToNextStep, goToPrevStep, onClose)
         : customFooter;
     }
 
     return (
       <WizardFooter
-        currentStep={currentStep}
+        activeStep={activeStep}
         onNext={goToNextStep}
         onBack={goToPrevStep}
         onClose={onClose}
-        isBackDisabled={currentStep?.id === steps[0]?.id}
+        isBackDisabled={activeStep?.id === steps[0]?.id}
         {...wizardFooter}
       />
     );
-  }, [currentFooter, initialFooter, currentStep, goToNextStep, goToPrevStep, onClose, steps]);
+  }, [currentFooter, initialFooter, activeStep, goToNextStep, goToPrevStep, onClose, steps]);
 
   const getStep = React.useCallback((stepId: string | number) => steps.find(step => step.id === stepId), [steps]);
 
   const setStep = React.useCallback(
     (step: Pick<WizardControlStep, 'id'> & Partial<WizardControlStep>) =>
-      setSteps(prevSteps =>
+      setCurrentSteps(prevSteps =>
         prevSteps.map(prevStep => {
           if (prevStep.id === step.id) {
             return { ...prevStep, ...step };
@@ -112,56 +121,15 @@ export const WizardContextProvider: React.FunctionComponent<WizardContextProvide
     []
   );
 
-  const toggleStep = React.useCallback(
-    (stepId: string | number, isHidden: boolean) =>
-      setSteps(prevSteps => {
-        let stepToHide: WizardControlStep;
-
-        return prevSteps.map(prevStep => {
-          if (prevStep.id === stepId) {
-            // Don't hide the currently active step or its parent (if a sub-step).
-            if (
-              isHidden &&
-              (currentStep.id === prevStep.id ||
-                (isWizardParentStep(prevStep) && prevStep.subStepIds.includes(currentStep.id)))
-            ) {
-              // eslint-disable-next-line no-console
-              console.error('Wizard: Unable to hide the current step or its parent.');
-              return prevStep;
-            }
-
-            stepToHide = { ...prevStep, isHidden };
-            return stepToHide;
-          }
-
-          // When isStepVisitRequired is enabled, if the step was previously hidden and not visited yet,
-          // when it is shown, all steps beyond it should be disabled to ensure it is visited.
-          if (
-            isStepVisitRequired &&
-            stepToHide?.isHidden === false &&
-            !stepToHide?.isVisited &&
-            prevSteps.indexOf(stepToHide) < prevSteps.indexOf(prevStep)
-          ) {
-            return { ...prevStep, isVisited: false };
-          }
-
-          return prevStep;
-        });
-      }),
-    [currentStep.id, isStepVisitRequired]
-  );
-
   return (
     <WizardContext.Provider
       value={{
         steps,
-        currentStep,
-        currentStepIndex,
+        activeStep,
         footer,
         onClose,
         getStep,
         setStep,
-        toggleStep,
         setFooter: setCurrentFooter,
         onNext: goToNextStep,
         onBack: goToPrevStep,
diff --git a/packages/react-core/src/next/components/Wizard/WizardFooter.tsx b/packages/react-core/src/next/components/Wizard/WizardFooter.tsx
index 46048c60bfd..4c0840a7510 100644
--- a/packages/react-core/src/next/components/Wizard/WizardFooter.tsx
+++ b/packages/react-core/src/next/components/Wizard/WizardFooter.tsx
@@ -11,8 +11,8 @@ import { isCustomWizardFooter, WizardControlStep, WizardNavStepFunction } from '
  */
 
 export interface WizardFooterProps {
-  /** The current step */
-  currentStep: WizardControlStep;
+  /** The active step */
+  activeStep: WizardControlStep;
   /** Next button callback */
   onNext: () => WizardNavStepFunction | void;
   /** Back button callback */
@@ -43,9 +43,9 @@ export const WizardFooterWrapper = ({ children }: WizardFooterWrapperProps) => (
   <footer className={css(styles.wizardFooter)}>{children}</footer>
 );
 
-export const WizardFooter = ({ currentStep, ...internalProps }: WizardFooterProps) => {
-  const currentStepFooter = !isCustomWizardFooter(currentStep.footer) && currentStep.footer;
-  return <InternalWizardFooter {...internalProps} {...currentStepFooter} />;
+export const WizardFooter = ({ activeStep, ...internalProps }: WizardFooterProps) => {
+  const activeStepFooter = !isCustomWizardFooter(activeStep.footer) && activeStep.footer;
+  return <InternalWizardFooter {...internalProps} {...activeStepFooter} />;
 };
 
 const InternalWizardFooter = ({
@@ -59,7 +59,7 @@ const InternalWizardFooter = ({
   nextButtonText = 'Next',
   backButtonText = 'Back',
   cancelButtonText = 'Cancel'
-}: Omit<WizardFooterProps, 'currentStep'>) => (
+}: Omit<WizardFooterProps, 'activeStep'>) => (
   <WizardFooterWrapper>
     <Button variant={ButtonVariant.primary} type="submit" onClick={onNext} isDisabled={isNextDisabled}>
       {nextButtonText}
diff --git a/packages/react-core/src/next/components/Wizard/WizardNavInternal.tsx b/packages/react-core/src/next/components/Wizard/WizardNavInternal.tsx
index 10085b03179..85972db6988 100644
--- a/packages/react-core/src/next/components/Wizard/WizardNavInternal.tsx
+++ b/packages/react-core/src/next/components/Wizard/WizardNavInternal.tsx
@@ -17,7 +17,7 @@ interface WizardNavInternalProps extends Pick<WizardProps, 'isStepVisitRequired'
 }
 
 export const WizardNavInternal = ({ nav, isStepVisitRequired, isNavExpanded }: WizardNavInternalProps) => {
-  const { currentStep, steps, goToStepByIndex } = useWizardContext();
+  const { activeStep, steps, goToStepByIndex } = useWizardContext();
 
   const wizardNavProps: WizardNavProps = {
     isExpanded: isNavExpanded,
@@ -29,27 +29,28 @@ export const WizardNavInternal = ({ nav, isStepVisitRequired, isNavExpanded }: W
 
   return (
     <WizardNav {...wizardNavProps}>
-      {steps.map((step, index) => {
-        const stepIndex = index + 1;
+      {steps.map((step, stepIndex) => {
+        const hasVisitedNextStep = steps.some(step => step.index > stepIndex + 1 && step.isVisited);
+        const isStepDisabled = step.isDisabled || (isStepVisitRequired && !step.isVisited && !hasVisitedNextStep);
         const customStepNavItem = isCustomWizardNavItem(step.navItem) && (
           <React.Fragment key={step.id}>
-            {typeof step.navItem === 'function'
-              ? step.navItem(step, currentStep, steps, goToStepByIndex)
-              : step.navItem}
+            {typeof step.navItem === 'function' ? step.navItem(step, activeStep, steps, goToStepByIndex) : step.navItem}
           </React.Fragment>
         );
 
         if (isWizardParentStep(step) && !step.isHidden) {
-          let firstSubStepIndex;
+          let firstSubStepIndex: number;
           let hasActiveChild = false;
 
           const subNavItems = step.subStepIds?.map((subStepId, subStepIndex) => {
             const subStep = steps.find(step => step.id === subStepId);
-            const subStepOrderIndex = steps.indexOf(subStep) + 1;
+            const hasVisitedNextStep = steps.some(step => step.index > subStep.index && step.isVisited);
+            const isSubStepDisabled =
+              subStep.isDisabled || (isStepVisitRequired && !subStep.isVisited && !hasVisitedNextStep);
             const customSubStepNavItem = isCustomWizardNavItem(subStep.navItem) && (
               <React.Fragment key={subStep.id}>
                 {typeof subStep.navItem === 'function'
-                  ? subStep.navItem(subStep, currentStep, steps, goToStepByIndex)
+                  ? subStep.navItem(subStep, activeStep, steps, goToStepByIndex)
                   : subStep.navItem}
               </React.Fragment>
             );
@@ -61,11 +62,11 @@ export const WizardNavInternal = ({ nav, isStepVisitRequired, isNavExpanded }: W
 
             // Store the first sub-step index so that when its parent is clicked, the first sub-step is focused
             if (subStepIndex === 0) {
-              firstSubStepIndex = subStepOrderIndex;
+              firstSubStepIndex = subStep.index;
             }
 
             // When a sub-step is active, use this flag to set the parent step as active (isCurrent)
-            if (currentStep?.id === subStep.id) {
+            if (activeStep?.id === subStep.id) {
               hasActiveChild = true;
             }
 
@@ -75,10 +76,10 @@ export const WizardNavInternal = ({ nav, isStepVisitRequired, isNavExpanded }: W
                   key={subStep.id}
                   id={subStep.id}
                   content={subStep.name}
-                  isCurrent={currentStep?.id === subStep.id}
-                  isDisabled={subStep.isDisabled || (isStepVisitRequired && !subStep.isVisited)}
+                  isCurrent={activeStep?.id === subStep.id}
+                  isDisabled={isSubStepDisabled}
                   isVisited={subStep.isVisited}
-                  stepIndex={subStepOrderIndex}
+                  stepIndex={subStep.index}
                   onNavItemClick={goToStepByIndex}
                   status={subStep.status}
                   {...subStep.navItem}
@@ -120,10 +121,10 @@ export const WizardNavInternal = ({ nav, isStepVisitRequired, isNavExpanded }: W
                 key={step.id}
                 id={step.id}
                 content={step.name}
-                isCurrent={currentStep?.id === step.id}
-                isDisabled={step.isDisabled || (isStepVisitRequired && !step.isVisited)}
+                isCurrent={activeStep?.id === step.id}
+                isDisabled={isStepDisabled}
                 isVisited={step.isVisited}
-                stepIndex={stepIndex}
+                stepIndex={step.index}
                 onNavItemClick={goToStepByIndex}
                 status={step.status}
                 {...step.navItem}
diff --git a/packages/react-core/src/next/components/Wizard/WizardStep.tsx b/packages/react-core/src/next/components/Wizard/WizardStep.tsx
index 052cf31ccd3..dee2fe12ac8 100644
--- a/packages/react-core/src/next/components/Wizard/WizardStep.tsx
+++ b/packages/react-core/src/next/components/Wizard/WizardStep.tsx
@@ -1,8 +1,7 @@
 import React from 'react';
 
 import { WizardNavItemType } from './types';
-import { WizardBody, WizardBodyProps } from './WizardBody';
-import { useWizardFooter } from './hooks/useWizardFooter';
+import { WizardBodyProps } from './WizardBody';
 import { useWizardContext } from './WizardContext';
 import { WizardFooterProps } from './WizardFooter';
 
@@ -23,8 +22,6 @@ export interface WizardStepProps {
   steps?: React.ReactElement<WizardStepProps>[];
   /** Flag to disable the step's navigation item */
   isDisabled?: boolean;
-  /** Flag to represent whether the step has been visited (navigated to) */
-  isVisited?: boolean;
   /** Flag to determine whether the step is hidden */
   isHidden?: boolean;
   /** Replaces the step's navigation item or its properties. */
@@ -35,34 +32,26 @@ export interface WizardStepProps {
   status?: 'default' | 'error';
 }
 
-export const WizardStep = ({ children, body, id, footer, isHidden, isDisabled, navItem, status }: WizardStepProps) => {
-  const { currentStep, setStep, toggleStep } = useWizardContext();
+export const WizardStep = ({ children, steps: _subSteps, ...props }: WizardStepProps) => {
+  const { activeStep, setStep } = useWizardContext();
+  const { id, name, body, isDisabled, isHidden, navItem, footer, status } = props;
 
-  useWizardFooter(footer, id);
-
-  // Update the controlled step when a change is detected with select properties
-  React.useEffect(() => {
-    if (currentStep?.id === id && (isDisabled || navItem || status || !currentStep?.isVisited)) {
-      setStep({
-        id,
-        ...(isDisabled && { isDisabled }),
-        ...(navItem && { navItem }),
-        ...(status && { status }),
-        // When the current step is active and isn't visited, set as isVisited
-        ...(!currentStep?.isVisited && { isVisited: true })
-      });
-    }
-  }, [id, setStep, currentStep?.id, isDisabled, navItem, status, currentStep?.isVisited]);
-
-  // Toggle visibility when the isHidden flag updates.
-  // Wizard's hasUnmountedSteps prop must be set to false for visibility changes to take effect.
+  // Update step in context when props change or when the step is active has yet to be marked as visited.
   React.useEffect(() => {
-    if (isHidden !== undefined) {
-      toggleStep(id, isHidden);
-    }
-  }, [toggleStep, id, isHidden]);
-
-  return body || body === undefined ? <WizardBody {...body}>{children}</WizardBody> : <>{children}</>;
+    setStep({
+      id,
+      name,
+      ...(body && { body }),
+      ...(isDisabled && { isDisabled }),
+      ...(isHidden && { isHidden }),
+      ...(navItem && { navItem }),
+      ...(footer && { footer }),
+      ...(status && { status }),
+      ...(id === activeStep?.id && !activeStep?.isVisited && { isVisited: true })
+    });
+  }, [body, footer, id, isDisabled, isHidden, name, navItem, status, activeStep?.id, activeStep?.isVisited, setStep]);
+
+  return <>{children}</>;
 };
 
 WizardStep.displayName = 'WizardStep';
diff --git a/packages/react-core/src/next/components/Wizard/WizardToggle.tsx b/packages/react-core/src/next/components/Wizard/WizardToggle.tsx
index 341845e29b2..7a535b4813c 100644
--- a/packages/react-core/src/next/components/Wizard/WizardToggle.tsx
+++ b/packages/react-core/src/next/components/Wizard/WizardToggle.tsx
@@ -6,7 +6,7 @@ import AngleRightIcon from '@patternfly/react-icons/dist/esm/icons/angle-right-i
 import CaretDownIcon from '@patternfly/react-icons/dist/esm/icons/caret-down-icon';
 
 import { KeyTypes } from '../../../helpers/constants';
-import { WizardNavProps } from '../Wizard';
+import { WizardNavProps, WizardBody, WizardStep, WizardStepProps } from '../Wizard';
 import { WizardControlStep, isWizardSubStep } from './types';
 
 /**
@@ -17,15 +17,13 @@ export interface WizardToggleProps {
   /** List of steps and/or sub-steps */
   steps: WizardControlStep[];
   /** The current step */
-  currentStep: WizardControlStep;
+  activeStep: WizardControlStep;
   /** Wizard footer */
   footer: React.ReactElement;
   /** Wizard navigation */
   nav: React.ReactElement<WizardNavProps>;
   /** The expandable dropdown button's aria-label */
   'aria-label'?: string;
-  /** Flag to unmount inactive steps instead of hiding. Defaults to true */
-  hasUnmountedSteps?: boolean;
   /** Flag to determine whether the dropdown navigation is expanded */
   isNavExpanded?: boolean;
   /** Callback to expand or collapse the dropdown navigation */
@@ -34,25 +32,24 @@ export interface WizardToggleProps {
 
 export const WizardToggle = ({
   steps,
-  currentStep,
+  activeStep,
   footer,
   nav,
   isNavExpanded,
   toggleNavExpanded,
-  hasUnmountedSteps = true,
   'aria-label': ariaLabel = 'Wizard toggle'
 }: WizardToggleProps) => {
-  const isActiveSubStep = isWizardSubStep(currentStep);
+  const isActiveSubStep = isWizardSubStep(activeStep);
   const nonSubSteps = steps.filter(step => !isWizardSubStep(step));
   const wizardToggleIndex =
     nonSubSteps.indexOf(
-      isWizardSubStep(currentStep) ? steps.find(step => step.id === currentStep.parentId) : currentStep
+      isWizardSubStep(activeStep) ? steps.find(step => step.id === activeStep.parentId) : activeStep
     ) + 1;
 
   const handleKeyClicks = React.useCallback(
     (event: KeyboardEvent): void => {
       if (isNavExpanded && event.key === KeyTypes.Escape) {
-        toggleNavExpanded();
+        toggleNavExpanded?.();
       }
     },
     [isNavExpanded, toggleNavExpanded]
@@ -68,20 +65,21 @@ export const WizardToggle = ({
     };
   }, [handleKeyClicks]);
 
-  // Only render the current step when hasUnmountedSteps is true
-  const bodyContent = hasUnmountedSteps
-    ? currentStep?.component
-    : steps.map(step => {
-        if (currentStep?.name === step.name) {
-          return step.component;
-        }
+  const bodyContent = steps.map(step => {
+    const props: WizardStepProps = step.component?.props || {};
+    const { children, body, ...propsWithoutChildren } = props;
 
-        return (
-          <div key={step.id} style={{ display: 'none' }}>
-            {step.component}
-          </div>
-        );
-      });
+    return (
+      <React.Fragment key={step.id}>
+        {activeStep?.name === step.name &&
+          (body || body === undefined ? <WizardBody {...body}>{children}</WizardBody> : children)}
+
+        <div key={step.id} style={{ display: 'none' }}>
+          <WizardStep {...propsWithoutChildren} />
+        </div>
+      </React.Fragment>
+    );
+  });
 
   return (
     <>
@@ -93,10 +91,10 @@ export const WizardToggle = ({
       >
         <span className={css(styles.wizardToggleList)}>
           <span className={css(styles.wizardToggleListItem)}>
-            <span className={css(styles.wizardToggleNum)}>{wizardToggleIndex}</span> {currentStep?.name}
+            <span className={css(styles.wizardToggleNum)}>{wizardToggleIndex}</span> {activeStep?.name}
             {isActiveSubStep && <AngleRightIcon className={css(styles.wizardToggleSeparator)} aria-hidden="true" />}
           </span>
-          {isActiveSubStep && <span className={css(styles.wizardToggleListItem)}>{currentStep?.name}</span>}
+          {isActiveSubStep && <span className={css(styles.wizardToggleListItem)}>{activeStep?.name}</span>}
         </span>
 
         <span className={css(styles.wizardToggleIcon)}>
diff --git a/packages/react-core/src/next/components/Wizard/__tests__/Wizard.test.tsx b/packages/react-core/src/next/components/Wizard/__tests__/Wizard.test.tsx
index 8b7f5157af0..49a9fade4de 100644
--- a/packages/react-core/src/next/components/Wizard/__tests__/Wizard.test.tsx
+++ b/packages/react-core/src/next/components/Wizard/__tests__/Wizard.test.tsx
@@ -111,7 +111,7 @@ test('renders default nav with custom props', () => {
 
   expect(navElement).toBeVisible();
   expect(navElement).toHaveAttribute('aria-labelledby', 'wizard-id');
-  expect(screen.getByRole('button', { name: 'Test step 1' }).parentElement).toHaveClass('pf-m-expandable');
+  expect(screen.getByRole('button', { name: 'Test step 1, visited' }).parentElement).toHaveClass('pf-m-expandable');
   expect(screen.getByRole('button', { name: 'Test step 2' })).toHaveAttribute('disabled');
 });
 
@@ -297,23 +297,3 @@ test('unmounts inactive steps by default', async () => {
   expect(screen.queryByText('Step 1 content')).toBeNull();
   expect(screen.getByText('Step 2 content')).toBeVisible();
 });
-
-test('keeps inactive steps mounted when hasUnmountedSteps is enabled', async () => {
-  const user = userEvent.setup();
-
-  render(
-    <Wizard hasUnmountedSteps={false}>
-      <WizardStep id="step-1" name="Test step 1">
-        Step 1 content
-      </WizardStep>
-      <WizardStep id="step-2" name="Test step 2">
-        Step 2 content
-      </WizardStep>
-    </Wizard>
-  );
-
-  await user.click(screen.getByRole('button', { name: 'Test step 2' }));
-
-  expect(screen.getByText('Step 1 content')).toBeInTheDocument();
-  expect(screen.getByText('Step 2 content')).toBeVisible();
-});
diff --git a/packages/react-core/src/next/components/Wizard/__tests__/WizardBody.test.tsx b/packages/react-core/src/next/components/Wizard/__tests__/WizardBody.test.tsx
index 61b1cdfd1e7..50ca3355675 100644
--- a/packages/react-core/src/next/components/Wizard/__tests__/WizardBody.test.tsx
+++ b/packages/react-core/src/next/components/Wizard/__tests__/WizardBody.test.tsx
@@ -15,8 +15,8 @@ test('has no padding className when hasNoBodyPadding is not specified', () => {
   expect(screen.getByText('content')).not.toHaveClass('pf-m-no-padding');
 });
 
-test('has padding className when hasNoBodyPadding is specified', () => {
-  render(<WizardBody hasNoBodyPadding>content</WizardBody>);
+test('has padding className when hasNoPadding is specified', () => {
+  render(<WizardBody hasNoPadding>content</WizardBody>);
   expect(screen.getByText('content')).toHaveClass('pf-m-no-padding');
 });
 
diff --git a/packages/react-core/src/next/components/Wizard/__tests__/WizardFooter.test.tsx b/packages/react-core/src/next/components/Wizard/__tests__/WizardFooter.test.tsx
index d5f9b819006..6b923e4d1e7 100644
--- a/packages/react-core/src/next/components/Wizard/__tests__/WizardFooter.test.tsx
+++ b/packages/react-core/src/next/components/Wizard/__tests__/WizardFooter.test.tsx
@@ -6,7 +6,7 @@ import userEvent from '@testing-library/user-event';
 import { WizardFooter, WizardFooterProps } from '../WizardFooter';
 
 const defaultProps: WizardFooterProps = {
-  currentStep: { name: 'Step name', id: 'some-id' },
+  activeStep: { name: 'Step name', id: 'some-id', index: 1 },
   onNext: jest.fn(),
   onBack: jest.fn(),
   onClose: jest.fn()
@@ -70,19 +70,19 @@ test('has disabled back button when isBackDisabled is enabled', () => {
   expect(screen.getByRole('button', { name: 'Back' })).toHaveAttribute('disabled');
 });
 
-test('uses currentStep footer properties when specified', () => {
+test('uses activeStep footer properties when specified', () => {
   render(
-    <WizardFooter {...defaultProps} currentStep={{ ...defaultProps.currentStep, footer: { isBackHidden: true } }} />
+    <WizardFooter {...defaultProps} activeStep={{ ...defaultProps.activeStep, footer: { isBackHidden: true } }} />
   );
   expect(screen.queryByRole('button', { name: 'Back' })).toBeNull();
 });
 
-test(`currentStep footer properties take precendence over WizardFooter's`, () => {
+test(`activeStep footer properties take precendence over WizardFooter's`, () => {
   render(
     <WizardFooter
       {...defaultProps}
       nextButtonText="Footer next"
-      currentStep={{ ...defaultProps.currentStep, footer: { nextButtonText: 'Active step next' } }}
+      activeStep={{ ...defaultProps.activeStep, footer: { nextButtonText: 'Active step next' } }}
     />
   );
   expect(screen.queryByRole('button', { name: 'Footer next' })).toBeNull();
diff --git a/packages/react-core/src/next/components/Wizard/__tests__/WizardStep.test.tsx b/packages/react-core/src/next/components/Wizard/__tests__/WizardStep.test.tsx
index c99eb78ac48..2cef9e4b1d8 100644
--- a/packages/react-core/src/next/components/Wizard/__tests__/WizardStep.test.tsx
+++ b/packages/react-core/src/next/components/Wizard/__tests__/WizardStep.test.tsx
@@ -2,20 +2,27 @@ import React from 'react';
 
 import { render, screen } from '@testing-library/react';
 
-import { WizardStep } from '../WizardStep';
-import * as useWizardFooter from '../hooks/useWizardFooter';
+import { WizardStep, WizardStepProps } from '../WizardStep';
 import * as WizardContext from '../WizardContext';
-import { WizardStepProps } from '..';
+import { WizardControlStep } from '..';
 
-const testStep: WizardStepProps = {
+const testStepProps: WizardStepProps = {
   id: 'test-step',
   name: 'Test step',
   footer: <>Step footer</>
 };
+
+const testStep: WizardControlStep = {
+  ...testStepProps,
+  index: 1
+};
+
+const setStep = jest.fn();
+
 const wizardContext: WizardContext.WizardContextProps = {
+  setStep,
   steps: [testStep],
-  currentStep: testStep,
-  currentStepIndex: 1,
+  activeStep: testStep,
   footer: <>Wizard footer</>,
   onNext: jest.fn(),
   onBack: jest.fn(),
@@ -25,11 +32,14 @@ const wizardContext: WizardContext.WizardContextProps = {
   goToStepByIndex: jest.fn(),
   setFooter: jest.fn(),
   getStep: jest.fn(),
-  setStep: jest.fn(),
-  toggleStep: jest.fn()
+  setSteps: jest.fn()
 };
+
 const useWizardContextSpy = jest.spyOn(WizardContext, 'useWizardContext');
-const useWizardFooterSpy = jest.spyOn(useWizardFooter, 'useWizardFooter');
+
+beforeEach(() => {
+  useWizardContextSpy.mockReturnValue(wizardContext);
+});
 
 test('renders without children', () => {
   const { container } = render(<WizardStep id="test-step" name="Test step" />);
@@ -51,83 +61,19 @@ test('excludes WizardBody when body is set to null', () => {
   expect(screen.queryByRole('main')).toBeNull();
 });
 
-test('uses body props for WizardBody when passed', () => {
-  render(
-    <WizardStep id="test-step" name="Test step" body={{ 'aria-label': 'Some label' }}>
-      content
-    </WizardStep>
-  );
-
-  expect(screen.getByLabelText('Some label')).toBeVisible();
-});
-
-test('calls useWizardFooter', () => {
-  useWizardContextSpy.mockReturnValueOnce(wizardContext);
-
-  render(<WizardStep {...testStep}>content</WizardStep>);
-  expect(useWizardFooterSpy).toHaveBeenCalledWith(testStep.footer, 'test-step');
-});
-
 test('updates "isDisabled" in context when the value changes', () => {
-  const setStep = jest.fn();
-  useWizardContextSpy.mockReturnValueOnce({ ...wizardContext, setStep });
-
   render(<WizardStep {...testStep} isDisabled />);
-
-  expect(setStep).toHaveBeenCalledWith({ id: testStep.id, isDisabled: true, isVisited: true });
+  expect(setStep).toHaveBeenCalledWith({ ...testStepProps, isDisabled: true, isVisited: true });
 });
 
 test('updates "navItem" in context when the value changes', () => {
-  const setStep = jest.fn();
   const testNavItem = <>Some nav item</>;
-  useWizardContextSpy.mockReturnValueOnce({ ...wizardContext, setStep });
-
   render(<WizardStep {...testStep} navItem={testNavItem} />);
 
-  expect(setStep).toHaveBeenCalledWith({ id: testStep.id, navItem: testNavItem, isVisited: true });
+  expect(setStep).toHaveBeenCalledWith({ ...testStepProps, navItem: testNavItem, isVisited: true });
 });
 
 test('updates "status" in context when the value changes', () => {
-  const setStep = jest.fn();
-  useWizardContextSpy.mockReturnValueOnce({ ...wizardContext, setStep });
-
   render(<WizardStep {...testStep} status="error" />);
-
-  expect(setStep).toHaveBeenCalledWith({ id: testStep.id, status: 'error', isVisited: true });
-});
-
-test('calls "toggleStep" when isHidden value changes and the previous value was not undefined', () => {
-  const toggleStep = jest.fn();
-  useWizardContextSpy.mockReturnValueOnce({ ...wizardContext, toggleStep });
-
-  render(<WizardStep {...testStep} isHidden />);
-
-  expect(toggleStep).toHaveBeenCalledWith(testStep.id, true);
-});
-
-test('does not call "toggleStep" when isHidden value changes and was previously undefined', () => {
-  const toggleStep = jest.fn();
-  useWizardContextSpy.mockReturnValueOnce({
-    ...wizardContext,
-    toggleStep
-  });
-
-  render(<WizardStep {...testStep} isHidden={undefined} />);
-
-  expect(toggleStep).not.toHaveBeenCalled();
-});
-
-test('does not update "isVisited" value in context when the step was previously visited', () => {
-  const setStep = jest.fn();
-  const visitedTestStep = { ...testStep, isVisited: true };
-  useWizardContextSpy.mockReturnValueOnce({
-    ...wizardContext,
-    currentStep: visitedTestStep,
-    steps: [visitedTestStep],
-    setStep
-  });
-
-  render(<WizardStep {...visitedTestStep} />);
-
-  expect(setStep).not.toHaveBeenCalled();
+  expect(setStep).toHaveBeenCalledWith({ ...testStepProps, status: 'error', isVisited: true });
 });
diff --git a/packages/react-core/src/next/components/Wizard/__tests__/WizardToggle.test.tsx b/packages/react-core/src/next/components/Wizard/__tests__/WizardToggle.test.tsx
index 10169c3b9a5..970904ec8d8 100644
--- a/packages/react-core/src/next/components/Wizard/__tests__/WizardToggle.test.tsx
+++ b/packages/react-core/src/next/components/Wizard/__tests__/WizardToggle.test.tsx
@@ -5,20 +5,23 @@ import userEvent from '@testing-library/user-event';
 
 import { KeyTypes } from '../../../../helpers';
 import { WizardToggle, WizardToggleProps } from '../WizardToggle';
+import { WizardControlStep } from '../types';
 
-const steps = [
-  { id: 'id-1', name: 'First step', component: <>First step content</> },
-  { id: 'id-2', name: 'Second step', component: <>Second step content</> }
+const steps: WizardControlStep[] = [
+  { id: 'id-1', name: 'First step', index: 1, component: <>First step content</> },
+  { id: 'id-2', name: 'Second step', index: 2, component: <>Second step content</> }
 ];
 
 const defaultProps: WizardToggleProps = {
   steps,
-  currentStep: steps[0],
+  activeStep: steps[0],
   footer: <div>Some footer</div>,
   nav: <div>Some nav</div>,
   'aria-label': 'Some label'
 };
 
+jest.mock('../WizardStep', () => ({ WizardStep: () => <div>step stub</div> }));
+
 test('renders provided footer, nav, and current step content', () => {
   render(<WizardToggle {...defaultProps} />);
 
@@ -58,13 +61,6 @@ test('renders only the active step content by default', async () => {
   expect(screen.queryByText('Second step content')).toBeNull;
 });
 
-test('renders all step content when hasUnmountedSteps is false', async () => {
-  render(<WizardToggle {...defaultProps} hasUnmountedSteps={false} />);
-
-  expect(screen.getByText('First step content')).toBeInTheDocument();
-  expect(screen.getByText('Second step content')).toBeInTheDocument();
-});
-
 test('has expanded properties when the toggle dropdown button is clicked', async () => {
   const user = userEvent.setup();
 
diff --git a/packages/react-core/src/next/components/Wizard/__tests__/utils.test.tsx b/packages/react-core/src/next/components/Wizard/__tests__/utils.test.tsx
index 97b14ccf893..d211c681808 100644
--- a/packages/react-core/src/next/components/Wizard/__tests__/utils.test.tsx
+++ b/packages/react-core/src/next/components/Wizard/__tests__/utils.test.tsx
@@ -9,7 +9,7 @@ describe('buildSteps', () => {
     try {
       buildSteps(<div />);
     } catch (error) {
-      expect(error.message).toEqual('Wizard only accepts children of type WizardStep');
+      expect(error.message).toEqual('Wizard only accepts children with required WizardStepProps.');
     }
   });
 
@@ -17,7 +17,7 @@ describe('buildSteps', () => {
     try {
       buildSteps('test' as any);
     } catch (error) {
-      expect(error.message).toEqual('Wizard only accepts children of type WizardStep');
+      expect(error.message).toEqual('Wizard only accepts children with required WizardStepProps.');
     }
   });
 
@@ -57,7 +57,7 @@ describe('buildSteps', () => {
         ]}
       />
     );
-    const [subStep, customSubStep, parentStep] = buildSteps(component);
+    const [parentStep, subStep, customSubStep] = buildSteps(component);
 
     expect((subStep as WizardSubStep).parentId).toEqual('step-1');
     expect((customSubStep as WizardSubStep).parentId).toEqual('step-1');
diff --git a/packages/react-core/src/next/components/Wizard/examples/Wizard.md b/packages/react-core/src/next/components/Wizard/examples/Wizard.md
index 4ea9cccb064..bf1b3533dbc 100644
--- a/packages/react-core/src/next/components/Wizard/examples/Wizard.md
+++ b/packages/react-core/src/next/components/Wizard/examples/Wizard.md
@@ -68,7 +68,7 @@ The `Wizard`'s `nav` property can be used to build your own navigation.
 export type CustomWizardNavFunction = (
   isExpanded: boolean,
   steps: WizardControlStep[],
-  currentStep: WizardControlStep,
+  activeStep: WizardControlStep,
   goToStepByIndex: (index: number) => void
 ) => React.ReactElement<WizardNavProps>;
 
@@ -110,7 +110,7 @@ The `WizardStep`'s `navItem` property can be used to build your own nav item for
 /** Callback for the Wizard's 'navItem' property. Returns element which replaces the WizardStep's default navItem. */
 export type CustomWizardNavItemFunction = (
   step: WizardControlStep,
-  currentStep: WizardControlStep,
+  activeStep: WizardControlStep,
   steps: WizardControlStep[],
   goToStepByIndex: (index: number) => void
 ) => React.ReactElement<WizardNavItemProps>;
@@ -129,8 +129,8 @@ Used to access any property of [WizardContext](#wizardcontextprops):
 import { useWizardContext } from '@patternfly/react-core/next';
 
 const StepContent = () => {
-  const { currentStep } = useWizardContext();
-  return <>This is the current step: {currentStep}</>;
+  const { activeStep } = useWizardContext();
+  return <>This is the current step: {activeStep}</>;
 }
 ```
 
diff --git a/packages/react-core/src/next/components/Wizard/examples/WizardCustomNav.tsx b/packages/react-core/src/next/components/Wizard/examples/WizardCustomNav.tsx
index 06f5e4db61a..d6e96379c8f 100644
--- a/packages/react-core/src/next/components/Wizard/examples/WizardCustomNav.tsx
+++ b/packages/react-core/src/next/components/Wizard/examples/WizardCustomNav.tsx
@@ -12,18 +12,18 @@ export const WizardCustomNav: React.FunctionComponent = () => {
   const nav: CustomWizardNavFunction = (
     isExpanded: boolean,
     steps: WizardControlStep[],
-    currentStep: WizardControlStep,
+    activeStep: WizardControlStep,
     goToStepByIndex: (index: number) => void
   ) => (
     <WizardNav isExpanded={isExpanded}>
-      {steps.map((step, index) => (
+      {steps.map(step => (
         <WizardNavItem
           key={step.id}
           id={step.id}
           content={step.name}
-          isCurrent={currentStep.id === step.id}
+          isCurrent={activeStep.id === step.id}
           isDisabled={step.isDisabled}
-          stepIndex={index + 1}
+          stepIndex={step.index}
           onNavItemClick={goToStepByIndex}
         />
       ))}
diff --git a/packages/react-core/src/next/components/Wizard/examples/WizardKitchenSink.tsx b/packages/react-core/src/next/components/Wizard/examples/WizardKitchenSink.tsx
index 356b892a823..4bd84af6761 100644
--- a/packages/react-core/src/next/components/Wizard/examples/WizardKitchenSink.tsx
+++ b/packages/react-core/src/next/components/Wizard/examples/WizardKitchenSink.tsx
@@ -19,14 +19,11 @@ import {
   WizardStep,
   WizardBody,
   WizardFooter,
-  WizardStepProps,
   useWizardContext,
-  WizardNavStepFunction,
-  WizardNavStepData,
-  WizardNavItem,
   WizardHeader,
   WizardFooterWrapper,
-  WizardNavItemType
+  WizardNavStepFunction,
+  WizardNavStepData
 } from '@patternfly/react-core/next';
 
 const StepId = {
@@ -45,30 +42,34 @@ interface SomeContextProps {
   setIsToggleStepChecked(isHidden: boolean): void;
   setErrorMessage(error: string | undefined): void;
 }
+type SomeContextRenderProps = Pick<SomeContextProps, 'isToggleStepChecked' | 'errorMessage'>;
+interface SomeContextProviderProps {
+  children: (context: SomeContextRenderProps) => React.ReactElement;
+}
 
 const SomeContext = React.createContext({} as SomeContextProps);
 
-const SomeContextProvider = ({ children }) => {
+const SomeContextProvider = ({ children }: SomeContextProviderProps) => {
   const [isToggleStepChecked, setIsToggleStepChecked] = React.useState(false);
   const [errorMessage, setErrorMessage] = React.useState<string>();
 
   return (
     <SomeContext.Provider value={{ isToggleStepChecked, errorMessage, setIsToggleStepChecked, setErrorMessage }}>
-      {children}
+      {children({ isToggleStepChecked, errorMessage })}
     </SomeContext.Provider>
   );
 };
 
 const CustomWizardFooter = () => {
-  const { currentStep, currentStepIndex, onNext, onBack, onClose } = useWizardContext();
+  const { activeStep, onNext, onBack, onClose } = useWizardContext();
 
   return (
     <WizardFooter
-      currentStep={currentStep}
+      activeStep={activeStep}
       onNext={onNext}
       onBack={onBack}
       onClose={onClose}
-      isBackDisabled={currentStepIndex === 1}
+      isBackDisabled={activeStep.index === 1}
     />
   );
 };
@@ -108,7 +109,7 @@ const StepContentWithDrawer = () => {
   );
 };
 
-const StepWithCustomFooter = (props: WizardStepProps) => {
+const CustomStepThreeFooter = () => {
   const { onNext: goToNextStep, onBack, onClose } = useWizardContext();
   const [isLoading, setIsLoading] = React.useState(false);
 
@@ -120,51 +121,26 @@ const StepWithCustomFooter = (props: WizardStepProps) => {
     goToStep();
   }
 
-  const footer = React.useMemo(
-    () => (
-      <WizardFooterWrapper>
-        <Button variant="primary" onClick={() => onNext(goToNextStep)} isLoading={isLoading} isDisabled={isLoading}>
-          Async Next
-        </Button>
-        <Button variant="secondary" onClick={onBack}>
-          Back
-        </Button>
-        <Button variant="link" onClick={onClose}>
-          Cancel
-        </Button>
-      </WizardFooterWrapper>
-    ),
-    [goToNextStep, isLoading, onBack, onClose]
-  );
-
   return (
-    <WizardStep {...props} footer={footer}>
-      Step 3 content w/ custom async footer
-    </WizardStep>
+    <WizardFooterWrapper>
+      <Button variant="primary" onClick={() => onNext(goToNextStep)} isLoading={isLoading} isDisabled={isLoading}>
+        Async Next
+      </Button>
+      <Button variant="secondary" onClick={onBack} isDisabled={isLoading}>
+        Back
+      </Button>
+      <Button variant="link" onClick={onClose} isDisabled={isLoading}>
+        Cancel
+      </Button>
+    </WizardFooterWrapper>
   );
 };
 
-const StepWithContextActions = (props: WizardStepProps) => {
+const StepContentWithActions = () => {
   const { isToggleStepChecked, errorMessage, setIsToggleStepChecked, setErrorMessage } = React.useContext(SomeContext);
 
-  const navItem: WizardNavItemType = React.useCallback(
-    (step, currentStep, steps, goToStepByIndex) => (
-      <WizardNavItem
-        id={step.id}
-        content={step.name}
-        isCurrent={currentStep.id === step.id}
-        stepIndex={steps.indexOf(step) + 1}
-        isDisabled={step.isDisabled || !step.isVisited}
-        isVisited={step.isVisited}
-        onNavItemClick={goToStepByIndex}
-        status={errorMessage ? 'error' : 'default'}
-      />
-    ),
-    [errorMessage]
-  );
-
   return (
-    <WizardStep {...props} navItem={navItem}>
+    <>
       <Checkbox
         label="Give this step an error status"
         isChecked={!!errorMessage}
@@ -179,50 +155,63 @@ const StepWithContextActions = (props: WizardStepProps) => {
         id="toggle-hide-step-checkbox"
         name="Toggle Hide Step Checkbox"
       />
-    </WizardStep>
+    </>
   );
 };
 
-const StepToHide = (props: WizardStepProps) => {
-  const { isToggleStepChecked } = React.useContext(SomeContext);
-  return <WizardStep {...props} isHidden={isToggleStepChecked} />;
-};
-
 export const WizardKitchenSink: React.FunctionComponent = () => {
   const onNext: WizardNavStepFunction = (_currentStep: WizardNavStepData, _previousStep: WizardNavStepData) => {};
 
   return (
     <SomeContextProvider>
-      <Wizard
-        height={400}
-        header={<WizardHeader title="You're a wizard, Harry" closeButtonAriaLabel="Close header" />}
-        footer={<CustomWizardFooter />}
-        isStepVisitRequired
-        onNext={onNext}
-        hasUnmountedSteps={false}
-      >
-        <WizardStep id={StepId.StepOne} name="Step 1" body={null} status="error">
-          <StepContentWithDrawer />
-        </WizardStep>
-        <WizardStep
-          id={StepId.StepTwo}
-          name="Step 2"
-          steps={[
-            <StepWithContextActions id={StepId.StepTwoSubOne} key={StepId.StepTwoSubOne} name="Substep 1" />,
-            <StepToHide id={StepId.StepTwoSubTwo} key={StepId.StepTwoSubTwo} name="Substep 2">
-              Substep 2 content
-            </StepToHide>
-          ]}
-        />
-        <StepWithCustomFooter
-          id={StepId.StepThree}
-          name="Step 3"
-          navItem={{ content: <span style={{ color: 'var(--pf-global--default-color--200)' }}>Custom item</span> }}
-        />
-        <WizardStep id={StepId.ReviewStep} name="Review" footer={{ nextButtonText: 'Submit' }}>
-          Review step content
-        </WizardStep>
-      </Wizard>
+      {({ isToggleStepChecked, errorMessage }) => (
+        <Wizard
+          height={400}
+          header={<WizardHeader title="You're a wizard, Harry" closeButtonAriaLabel="Close header" />}
+          footer={<CustomWizardFooter />}
+          onNext={onNext}
+          isStepVisitRequired
+        >
+          <WizardStep id={StepId.StepOne} name="Step 1" body={null} status="error">
+            <StepContentWithDrawer />
+          </WizardStep>
+          <WizardStep
+            id={StepId.StepTwo}
+            name="Step 2"
+            steps={[
+              <WizardStep
+                status={errorMessage ? 'error' : 'default'}
+                id={StepId.StepTwoSubOne}
+                key={StepId.StepTwoSubOne}
+                name="Substep 1"
+              >
+                <StepContentWithActions />
+              </WizardStep>,
+              <WizardStep
+                id={StepId.StepTwoSubTwo}
+                key={StepId.StepTwoSubTwo}
+                name="Substep 2"
+                isHidden={isToggleStepChecked}
+              >
+                Substep 2 content
+              </WizardStep>
+            ]}
+          />
+          <WizardStep
+            id={StepId.StepThree}
+            name="Step 3"
+            navItem={{
+              content: <span style={{ color: 'var(--pf-global--default-color--200)' }}>Custom item</span>
+            }}
+            footer={<CustomStepThreeFooter />}
+          >
+            Step 3 content w/ custom async footer
+          </WizardStep>
+          <WizardStep id={StepId.ReviewStep} name="Review" footer={{ nextButtonText: 'Submit' }}>
+            Review step content
+          </WizardStep>
+        </Wizard>
+      )}
     </SomeContextProvider>
   );
 };
diff --git a/packages/react-core/src/next/components/Wizard/hooks/__tests__/useWizardFooter.test.tsx b/packages/react-core/src/next/components/Wizard/hooks/__tests__/useWizardFooter.test.tsx
index cba661c66d9..f8dde2dae05 100644
--- a/packages/react-core/src/next/components/Wizard/hooks/__tests__/useWizardFooter.test.tsx
+++ b/packages/react-core/src/next/components/Wizard/hooks/__tests__/useWizardFooter.test.tsx
@@ -16,15 +16,15 @@ test('sets the footer when one is provided without a stepId', () => {
   expect(setFooter).toHaveBeenCalledWith(customFooter);
 });
 
-test(`sets the footer when the provided stepId matches the currentStep's id`, () => {
-  useWizardContextSpy.mockReturnValueOnce({ setFooter, currentStep: { id: 'curr-step-id' } } as any);
+test(`sets the footer when the provided stepId matches the activeStep's id`, () => {
+  useWizardContextSpy.mockReturnValueOnce({ setFooter, activeStep: { id: 'curr-step-id' } } as any);
 
   renderHook(() => useWizardFooter(customFooter, 'curr-step-id'));
   expect(setFooter).toHaveBeenCalledWith(customFooter);
 });
 
-test(`does not set the footer when the provided stepId does not match the currentStep's id`, () => {
-  useWizardContextSpy.mockReturnValueOnce({ setFooter, currentStep: { id: 'curr-step-id' } } as any);
+test(`does not set the footer when the provided stepId does not match the activeStep's id`, () => {
+  useWizardContextSpy.mockReturnValueOnce({ setFooter, activeStep: { id: 'curr-step-id' } } as any);
 
   renderHook(() => useWizardFooter(customFooter, 'some-other-step-id'));
   expect(setFooter).not.toHaveBeenCalled();
diff --git a/packages/react-core/src/next/components/Wizard/hooks/useWizardFooter.tsx b/packages/react-core/src/next/components/Wizard/hooks/useWizardFooter.tsx
index 56a49afd9ea..f41b4e0d82b 100644
--- a/packages/react-core/src/next/components/Wizard/hooks/useWizardFooter.tsx
+++ b/packages/react-core/src/next/components/Wizard/hooks/useWizardFooter.tsx
@@ -9,10 +9,10 @@ import { WizardFooterProps } from '../WizardFooter';
  * @param stepId
  */
 export const useWizardFooter = (footer: React.ReactElement | Partial<WizardFooterProps>, stepId?: string | number) => {
-  const { currentStep, setFooter } = useWizardContext();
+  const { activeStep, setFooter } = useWizardContext();
 
   React.useEffect(() => {
-    if (footer && (!stepId || currentStep?.id === stepId)) {
+    if (footer && (!stepId || activeStep?.id === stepId)) {
       setFooter(footer);
 
       // Reset the footer on unmount.
@@ -20,5 +20,5 @@ export const useWizardFooter = (footer: React.ReactElement | Partial<WizardFoote
         setFooter(null);
       };
     }
-  }, [currentStep, footer, setFooter, stepId]);
+  }, [activeStep, footer, setFooter, stepId]);
 };
diff --git a/packages/react-core/src/next/components/Wizard/types.tsx b/packages/react-core/src/next/components/Wizard/types.tsx
index 6cd2c5294fe..1715744f4c0 100644
--- a/packages/react-core/src/next/components/Wizard/types.tsx
+++ b/packages/react-core/src/next/components/Wizard/types.tsx
@@ -7,6 +7,8 @@ export interface WizardBasicStep {
   name: React.ReactNode;
   /** Unique identifier */
   id: string | number;
+  /** Order index of step (starts at 1) */
+  index: number;
   /** Flag to disable the step's navigation item */
   isDisabled?: boolean;
   /** Flag to represent whether the step has been visited (navigated to) */
@@ -64,21 +66,21 @@ export type WizardNavItemType = Partial<WizardNavItemProps> | CustomWizardNavIte
 export type CustomWizardNavFunction = (
   isExpanded: boolean,
   steps: WizardControlStep[],
-  currentStep: WizardControlStep,
+  activeStep: WizardControlStep,
   goToStepByIndex: (index: number) => void
 ) => React.ReactElement<WizardNavProps>;
 
 /** Callback for the Wizard's 'navItem' property. Returns element which replaces the WizardStep's default navigation item. */
 export type CustomWizardNavItemFunction = (
   step: WizardControlStep,
-  currentStep: WizardControlStep,
+  activeStep: WizardControlStep,
   steps: WizardControlStep[],
   goToStepByIndex: (index: number) => void
 ) => React.ReactElement<WizardNavItemProps>;
 
 /** Callback for the Wizard's 'footer' property. Returns element which replaces the Wizard's default footer. */
 export type CustomWizardFooterFunction = (
-  currentStep: WizardControlStep,
+  activeStep: WizardControlStep,
   onNext: () => void,
   onBack: () => void,
   onClose: () => void
diff --git a/packages/react-core/src/next/components/Wizard/utils.ts b/packages/react-core/src/next/components/Wizard/utils.ts
index ede2574412c..109523349f3 100644
--- a/packages/react-core/src/next/components/Wizard/utils.ts
+++ b/packages/react-core/src/next/components/Wizard/utils.ts
@@ -9,27 +9,37 @@ import { WizardStep, WizardStepProps } from './WizardStep';
  * @returns WizardControlStep[]
  */
 export const buildSteps = (children: React.ReactElement<WizardStepProps> | React.ReactElement<WizardStepProps>[]) =>
-  React.Children.toArray(children).reduce((acc: WizardControlStep[], child: React.ReactChild | React.ReactFragment) => {
+  React.Children.toArray(children).reduce((acc: WizardControlStep[], child: React.ReactNode) => {
     if (isWizardStep(child)) {
-      const { steps: subSteps, id } = child.props;
-
-      acc.push({
-        component: child,
-        ...normalizeStep(child.props),
-        ...(subSteps && {
-          subStepIds: subSteps?.map(subStep => {
-            acc.push({
-              ...normalizeStep(subStep.props),
-              component: subStep,
-              parentId: id
-            });
-
-            return subStep.props.id;
-          })
-        })
-      });
+      const { steps: subSteps, id, isHidden, isDisabled } = child.props;
+      const subControlledSteps: WizardControlStep[] = [];
+      const stepIndex = acc.length + 1;
+
+      acc.push(
+        {
+          index: stepIndex,
+          component: child,
+          ...(stepIndex === 1 && { isVisited: true }),
+          ...(subSteps && {
+            subStepIds: subSteps?.map((subStep, subStepIndex) => {
+              subControlledSteps.push({
+                isHidden,
+                isDisabled,
+                component: subStep,
+                parentId: id,
+                index: stepIndex + subStepIndex + 1,
+                ...normalizeStep(subStep.props)
+              });
+
+              return subStep.props.id;
+            })
+          }),
+          ...normalizeStep(child.props)
+        },
+        ...subControlledSteps
+      );
     } else {
-      throw new Error('Wizard only accepts children of type WizardStep');
+      throw new Error('Wizard only accepts children with required WizardStepProps.');
     }
 
     return acc;
@@ -45,14 +55,14 @@ export function isWizardStep(
 }
 
 // eslint-disable-next-line @typescript-eslint/no-unused-vars
-export const normalizeStep = ({ children, steps, body, ...controlStep }: WizardStepProps): WizardControlStep =>
+export const normalizeStep = ({ children, steps, ...controlStep }: WizardStepProps): Omit<WizardControlStep, 'index'> =>
   controlStep;
 
-export const normalizeNavStep = (navStep: WizardControlStep, steps: WizardControlStep[]): WizardNavStepData => ({
+export const normalizeNavStep = (navStep: WizardControlStep): WizardNavStepData => ({
   id: navStep.id,
-  name: navStep.name.toString(),
-  index: steps.indexOf(navStep) + 1
+  index: navStep.index,
+  name: navStep.name.toString()
 });
 
-export const getCurrentStep = (steps: WizardControlStep[], currentStepIndex: number) =>
-  steps.find((_, index) => index + 1 === currentStepIndex);
+export const getActiveStep = (steps: WizardControlStep[], activeStepIndex: number) =>
+  steps.find(step => step.index === activeStepIndex);