diff --git a/packages/core/src/components/SimpleStepper/SimpleStepper.tsx b/packages/core/src/components/SimpleStepper/SimpleStepper.tsx index bb2c3d640d..75fc1e5e62 100644 --- a/packages/core/src/components/SimpleStepper/SimpleStepper.tsx +++ b/packages/core/src/components/SimpleStepper/SimpleStepper.tsx @@ -13,7 +13,13 @@ * See the License for the specific language governing permissions and * limitations under the License. */ -import React, { Children, isValidElement, FC, useState } from 'react'; +import React, { + Children, + isValidElement, + FC, + useState, + useEffect, +} from 'react'; import { Stepper as MuiStepper } from '@material-ui/core'; type InternalState = { @@ -38,16 +44,22 @@ export const VerticalStepperContext = React.createContext({ export interface StepperProps { elevated?: boolean; onStepChange?: (prevIndex: number, nextIndex: number) => void; + activeStep?: number; } export const SimpleStepper: FC = ({ children, elevated, onStepChange, + activeStep = 0, }) => { - const [stepIndex, setStepIndex] = useState(0); + const [stepIndex, setStepIndex] = useState(activeStep); const [stepHistory, setStepHistory] = useState([0]); + useEffect(() => { + setStepIndex(activeStep); + }, [activeStep]); + const steps: React.ReactNode[] = []; let endStep; Children.forEach(children, child => {