React - iOS клавиатура имеет неправильную высоту при начальном фокусе ввода

Question

Контекст:

У меня есть приложение React с календарным листом, в котором есть текст. Когда пользователь нажимает на текст (на iPhone), открывается поле ввода <textarea>. В этом текстовом поле есть focus() (см. Код), поэтому пользователь может начать вводить текст сразу после нажатия на текст календаря.

Проблема:

Когда пользователь нажимает в тексте клавиатура iOS имеет неправильную высоту и обрезает поле textarea (см. снимок экрана).

Только когда пользователь нажимает кнопку «Готово», чтобы закрыть клавиатуру, а затем снова щелкает текстовое поле ... Затем он устанавливает правильную высоту для клавиатуры, и ввод текстового поля виден.

Я попытался использовать inputMode как атрибут, однако это не позволяет клавиатуре полностью всплывать (что я не хочу). Также не сработало использование других предлагаемых решений, таких как blur() или onfocus.

Вот соответствующий код:

        useEffect((): void => {
            if (isInputActive && textAreaRef.current) {
                textAreaRef.current.focus();
                textAreaRef.current.click();
                textAreaRef.current.scrollTop = textAreaRef.current.scrollHeight;
            }
        }, [textAreaRef, isInputActive]);

Снимок экрана :