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>
        </>
    )
})

Ответы (0 шт):