Change state of something from another class with a button

I am new to React and have had some hard time to understand the concept of states.

Down below I export a stepper from MUI. I use state

export default function CustomizedSteppers() {
  const steps = ['Zoninfo', 'Betalsätt', 'Börja ladda'];
 const [activeStep, setActiveStep] = React.useState(0);
  const handleNext = () => {
      setActiveStep((activeStep+1));
    };

 

 return (
  //...
  //Stepper stuff...
  //...

  <Button variant="contained" onClick={handleNext}>Hello 
  World</Button>

  
</Stack>

 );
}

I now want to split this code so that I can setActiveStep from another component.

Meaning, I want to put the button outside of this component and put it in another class, but still allow that button to change the value of activeStep - by accessing the method handleNext on click on a button outside this class. How do I manage to do this?