Реализуйте inputRef prop с пользовательским интерфейсом TextField для пользовательского интерфейса.

Question

Я пытаюсь подключить Material UI TextField со своим компонентом ввода. Код, использующий TextField, выглядит следующим образом:

<Autocomplete
  id="inputData"
  options={inputData}
  getOptionLabel={option => option.text}
  renderInput={params => (
    <TextField
      {...params}
      label="inputData"
      InputProps={{
        inputComponent: () => <Input name="inputData" />
      }}
    />
  )}
/>

, а код компонента Input прост:

const Input = () => <input />

Это станет более сложным но сейчас я хотел бы заставить этот простой код работать. Я получаю ошибку: inputRef.current is null, которая, вероятно, вызвана отсутствием реализации интерфейса InputElement в компоненте Input. Пожалуйста, смотрите интерфейс материалов docs ниже фрагмента кода для информации об интерфейсе InputElement. Другими словами, мой Input компонент не обрабатывает inputRef реквизиты материала.

Как правильно интегрировать пользовательский Input компонент с пользовательским интерфейсом TextField?

Вот песочница: https://codesandbox.io/s/fervent-bash-pxqq0.