How to implement react hook form using a inputbox component in react?

Question

I'm using a custom component with my inputbox in react, the problem is how can I implement the {...register('field name')}? I tried to use ref={register} but there's an error because I'm using react hook form 7, this is applicable only on react hook form 6. Thanks!

<Inputbox
                      type='text'
                      placeholder='Email'
                      id='email'
                      name='email'
                      className={`w-full font-QuickSand font-semibold text-sm ${
                        errors.email
                          ? 'bg-danger bg-opacity-10 border-danger focus:border-danger'
                          : ''
                      } pl-11 pt-4 pr-4 pb-4 border transition duration-600 ease-in-out focus:border-primary focus:outline-none`}
                      value={userInfo.email}
                      {...register('email')} <-- this is not working
                      onChange={handleOnChange}
                    />