You can create a controlled input component by using state to manage the value of the input field and an event handler to update the state when the input changes.

import React, { useState } from 'react';

function ControlledInput() {
    const [inputValue, setInputValue] = useState('');

    const handleChange = (event) => {
        setInputValue(event.target.value);
    };

    return (
        <input 
            type="text" 
            value={inputValue} 
            onChange={handleChange} 
            placeholder="Type something..." 
        />
    );
}

export default ControlledInput;

Edited