title: Input is loosing focus on hooks update
body: <p>I'm new to reactjs and I'm trying read data from input. Problem is when I type a sign, my input loose focus. But only when all logic is inside function. 
  When Input with button and logic is in different file - it's working. I don't really know why...</p>
  
  <p>I have created separate file with same code and import it to sollution - it's ok.
  I have tried with onChange={handleChange} - lost focus as well.</p>
  
  <pre><code>export default function MyInput(){
  const [citySearch, updateCitySearch] = useState();
  
  function searchCityClick(){
     alert(citySearch);
  }
  const SearchComponent = ()=&gt; (
      &lt;div&gt; 
          &lt;input 
          value={citySearch}
          onChange={(e) =&gt; updateCitySearch(e.target.value)}/&gt;
          &lt;Button variant="contained" color="primary" onClick={searchCityClick}&gt;
              Search
          &lt;/Button&gt;
      &lt;/div&gt;
  
  );
  return(
      &lt;div&gt;
          &lt;div&gt;
              &lt;SearchComponent /&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  )}
  </code></pre>