title: material-ui Autocomplete accept custom values
body: <p>I have this autocomplete drop down box.</p>
  
  <p>If I select values other than in the drop down, how do i accept the autocomplete drop down box to take in the custom value. In this example, bar and bat values are in drop down.</p>
  
  <p>How do i accept bag to be accepted as input value?</p>
  
  <p>my code is at : <a href="https://codesandbox.io/s/material-demo-8scos" rel="nofollow noreferrer">https://codesandbox.io/s/material-demo-8scos</a></p>
  
  <pre><code>export default function ComboBox() {
      return (
      &lt;Autocomplete
          id="combo-box-demo"
         options={top100Films}
         getOptionLabel={option =&gt; option.title}
         style={{ width: 300 }}
         renderInput={params =&gt; (
             &lt;TextField {...params} label="Combo box" variant="outlined" /&gt;
         )}
      /&gt;
    );
  }
  
  const top100Films = [
    { title: "bar", year: 1994 },
    { title: "bat", year: 1972 }
  ];
  </code></pre>
  
  <p><a href="https://codesandbox.io/s/material-demo-ytrt4" rel="nofollow noreferrer">https://codesandbox.io/s/material-demo-ytrt4</a></p>