title: unable to show error and error message on MUI datepicker
body: <p>I'm using react material-ui (MUI)</p>
  <p>I want to show an error on some condition that will calculate on the backend.</p>
  <p>I used MUI-datepicker but I can't show error</p>
  <pre><code>import * as React from 'react';
  import TextField from '@mui/material/TextField';
  import AdapterDateFns from '@mui/lab/AdapterDateFns';
  import LocalizationProvider from '@mui/lab/LocalizationProvider';
  import DatePicker from '@mui/lab/DatePicker';
  
  const PickupDatePickerComponent = (props) =&gt; {
  
    const [value, setValue] = React.useState(null);
  
    const handleChange = (newValue)=&gt;{
      setValue(newValue);
    }
  
    const todayDate = new Date();
  
    return (
      &lt;LocalizationProvider style={{ width:&quot;100%&quot;}} dateAdapter={AdapterDateFns}&gt;
        &lt;DatePicker
          label=&quot;example&quot;
          value={value}
          onChange={handleChange}
          minDate={todayDate}
          renderInput={(params) =&gt; &lt;TextField 
            error
            helperText=&quot;Your error message&quot; 
            {...params} sx={{ width:&quot;100%&quot; }} 
          /&gt;}
          onError={true}
          error
          helperText=&quot;Your error message&quot;
        /&gt;
      &lt;/LocalizationProvider&gt;
    );
  }
  
  export default PickupDatePickerComponent
  
  </code></pre>
  <p>the <code>error</code> property is not working not in <code>&lt;Input/&gt;</code> nor in <code>&lt;DatePicker/&gt;</code> so the border won't be red... (like normal errors)</p>