title: Set max height and make scrollable text field
body: <p>I have implemented MUI auto complete component with a textfield to display all selected items. However the height of the text field increases and I would like to set a max height to it. I tried to pass maxRows prop to textfield but it has no effect. Please find my code and screenshot of the issue bellow.</p>
  <pre><code>// Component for select input which can be filtered through text input
  export default function FormSearchInput( props ) {
    const classes = FormStyle();
    const icon = &lt;CheckBoxOutlineBlankIcon fontSize=&quot;small&quot; /&gt;;
    const checkedIcon = &lt;CheckBoxIcon fontSize=&quot;small&quot; /&gt;;
    return (
      &lt;Grid item xs = {props.xs} className = {classes.formItem}&gt;
      &lt;Autocomplete
        multiple
        id = &quot;checkboxes-tags-demo&quot;
        options = {props.options}
        disableCloseOnSelect
        getOptionLabel = {( option ) =&gt; option}
        defaultValue = {props.selectedOptions}
        renderOption = {( option, {selected} ) =&gt; (
        &lt;React.Fragment&gt;
        &lt;Checkbox
          icon = {icon}
          checkedIcon = {checkedIcon}
          style = {{ marginRight: 8 }}
          checked = {selected}
          onChange = {props.onChange( option, selected )}
        /&gt;
          {option}
        &lt;/React.Fragment&gt;
      )}
      renderInput = {( params ) =&gt; {
        return &lt;TextField {...params} multiline rowsMax = {2} variant = &quot;outlined&quot; label = {props.label}/&gt;
      }}
      /&gt;
    &lt;/Grid&gt;
    )
  }
  </code></pre>
  <p>Issue (textfield should only be 2 rows height):
  <a href="https://i.stack.imgur.com/cTHgo.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/cTHgo.png" alt="textfield rowsmax not applying" /></a></p>