Controlled-components-snippet2.js

function myComponent(selector,label,value,onChange){
  let element = document.querySelector(selector);
  element.innerHTML=```
    <div class="my-element">
        <label>${label}</label>
        <input></input>
    </div>
  ```
  let input = element.querySelector('input'); 
  input.value = value;
  input.addEventListener('keydown', e=>{
      e.preventDefault(); //stops the input from accepting the change
      input.value = onChange(input.value + e.key);
  });
}