How to properly decorate text in an input field using React hooks?

Question

JavaScript

Let's say we have a design for an input field like this.

Normally, we would just use input value with the useState hook:

let { value, setValue } = useState("");
const handleChange = (e) => { setValue(e.target.value);  }
<input value={value} onChange={handleChange} />

But in design, decorative spaces and a prefix are added to the value entered by the user. How to make such an input correctly?