React Hook Form in Relationships

Question

I am using the react hook form to get the form data. I got it with login data, but now I need to get the data for a signup form. The problem is the API asks some relationships like below:

"endereco": {
    "rua": "Rua das Rosas",
    "numero": "435",
    "cep": 13835060,
    "cidade": "Recife",
    "estado": "PE"
}

and

"entidades": {
    "orixas": "Ogum",
    "caboclo_de_pena": ["Pena Branca"],
    "caboclo_boiadeiro": ["Rompe Mato"],
    "preto_velho": ["Maria Redonda"],
    "encantados": ["Saci"],
    "povo_de_esquerda": ["Trancar Rua das Almas"],
    "criancas": ["Pedrinho"],
    "odu_da_testa": "Iansã",
    "odu_da_nuca": "Ogum",
    "odu_do_nascimento": "Oxóssi",
    "odu_adjunto": "Oxum",
    "odu_negativo": "Nanã",
    "odu_positivo": "Omulu"
}

Can anyone help how does this works when I have to create an input for endereco.rua and for the array in entidades.criancas?

return createPortal (
        <div className="registerModalContainer">
            <div ref={ref} className="registerModal">
                <h2 className="heading">Cadastrar</h2>
                <form onSubmit={handleSubmit(signIn, onError)}>
                            <div>
                                <label htmlFor="password">Senha</label>
                                <input type="password" placeholder="Digite sua senha" id="password" {...register("password")} />
                            </div>
                    
                    <button className="login-button" type="submit">Cadastrar</button>
                </form>
                
            </div>
        </div>,
        document.body
    )