React "Wizard" - how do call child component method when switching "steps"

Question

I have created a wizard using the Tabs component in the IBM Carbon Design UI/UX framework. Each step in the wizard is a separate child component. This is so that the complex logic in each step doesn't complicate the overall wizard. You can find a copy of the setup linked below:

https://codesandbox.io/s/autumn-shadow-78cj8r?file=/index.js

One of the issues I am running into has to do with triggering a method when the wizard changes steps. When the wizard switches to the next or previous Step, I want to trigger that Step's onFocus() method. The thought here is that each step has its own onFocus() method so that, within that Step, I can do whatever AJAX and business logic is needed when the user switches to that step.

I've seen countless examples of passing the props down from the parent to the child, then using those props to dispatch an event back to the parent. In this situation, I need the parent to trigger a child's method.

I'm trying to create a reusable Wizard component/pattern here which I can apply and use with other wizards I will need to build in the future. As such, any feedback to help me build something reusable would be much appreciated. Even if that means I need to refactor the setup.

At this point, I'm up for any suggestions on how I can trigger the step's onFocus() method.