reach-hook-form несколько форм с общими полями
Есть форма регистрации, представленная одной визуальной формой. На ней радиобоксами выбирается роль регистрации (3 роли). Переключая радиобоксы роли, меняются поля в форме, но есть общие поля, такие как ФИО и эмейл. Присутствует валидация полей. Программно это три разных формы, которые я зарегистрировал в одну RHF-форму.
Суть проблемы заключается в том, что когда я пытаюсь подтвердить форму, он, разумеется, цепляет поля с сокрытых форм и жалуется что они не заполнены. Если разделить это на регистрацию 3 разных RHF-форм, то поля ФИО перестанут быть связаны. (логично, что если ввести ФИО на одной форме и сменить роль, то ФИО не должен пропасть).
Вопрос: Какой есть graceful способ сделать что бы формы независимо от друг друга валидировались, но при этом были связаны с собой общими полями. Слышал про переопределение validate, но имхо кажется таким себе способом, и хотелось бы узнать об альтернативных способах.
Код которым сейчас генерируется форма:
role.fields.map((field, index) => {
return (
<>
<ScInput
{...register(field["id"], field["validation-options"])}
placeholder={field["placeholder-text"]}
aria-invalid={errors[field["id"]] ? 'true' : 'false'}
/>
<span style={{"color": "red","font-size": "0.8em", "min-height" : "0.8em"}} >{errors[field["id"]] ? field["validation-error-text"] : ""}</span>
</>
)
})