Here is the UI of a React app I am working on:

Currently UI is made as a single giant layout.

I want to break each step to be its separate component. As you can see each component would have somewhat different layout. Now I want to make is such that we would get numbering "Step 1:", "Step 2:" algorithmically (currently those are hardcoded strings).

I was thinking about using high-order components for this purpose, but wasn't sure if I would require them to share context or something to get the numeration correct.

Any ideas how such thing could be achieved?

Again, I will provide the layout as a separate component, step caption as a string, but the part Step #: should be added during render.