Found a solution https://codesandbox.io/p/sandbox/festive-davinci-knwn5r

Had to de-structure the register function of react hook form and pass the ref and props separately

 const { ref, ...inputProps } = register(name);

 <Component inputRef={ref} {...inputProps} {...props} />