How to preserve the focus order when fields are rendered conditionally?

[cflorez-nex]

I'm having the issue mentioned in this thread: https://github.com/orgs/react-hook-form/discussions/7523?sort=new

when I render inputs conditionally, the focus order is not preserved, in the following stackblitz you could see the error, to reproduce it you could follow these steps:

1. press submit button
2. the field firstname will be focused
3. fill the firstname input
4. press the add details checkbox, two new fields will be rendered gender and dateOfBirth
5. press again the submit button
6. the focus will be done into the lastname field instead of the gender input

What I expect is, the focus respect the UI input order.

@bluebill1049 @Moshyfawn could you shed some light here :)