Wizard steps switch from invalid -> valid -> invalid

[andrewanderson58]

Hello,

So I have been playing around with the wizard and I want to have forms on each step and only allow (next/finish) when the form is valid.

Right now I am doing the following. Calling the checkStepValidity when all fields are populated. But not sure how I could toggle it back to invalid if a field is completed but then erased.

  useEffect(() => {
    if (
      patient.firstName?.length > 0
    ) {
       wizardRef.current?.checkStepValidity(0);
    } else {
      // set step to invalid
    }
  }, [patient]);

Is there currently any way to do this or could you recommend a better way?