Отображение инпута с автоматическим фокусом по нажатию кнопки

Требуется, чтобы после клика на кнопку сразу появлялось текстовое поле и получало фокус. Проверьте, корректно ли реализовано данное поведение, и при необходимости внесите поправки.

import React, { useState, useRef } from 'react';

const ToggleComponent = () => {
    const [showInput, setShowInput] = useState(false);
    const inputElementRef = useRef(null);

    const toggleVisibility = () => {
        setShowInput(prev => !prev);
        if (inputElementRef.current) {
            inputElementRef.current.focus();
        }
    };

    return (
        <>
            <button onClick={toggleVisibility}>Toggle Input</button>
            {showInput && <input ref={inputElementRef} />}
        </>
    );
};

export default ToggleComponent;