I'm implementing a component Autocomplete using Material UI library.

But there's a problem - I'm not sure how to pass value and onChange properly, because I have a custom implementation of TextField that requires value and onChange as well. Should I pass value and onChange twice - to Autocomplete and TextField? Or maybe there's a better solution? Would appreciate any help!
Here's my code:

import { Autocomplete as MuiAutocomplete } from '@material-ui/lab'

import { FormControl } from 'components/_helpers/FormControl'

import { useStyles } from 'components/Select/styles'

import { Props as TextFieldProps, TextField } from 'components/TextField'



export type Props = Omit<TextFieldProps, 'children'> & {

  options: Array<any>

  value: string

  onChange: (value: string) => void



  disabled?: boolean

}



export const Autocomplete = (props: Props) => {

  const classes = useStyles()



  return (

    <FormControl

      label={props.label}

      error={props.error}

      helperText={props.helperText}

    >

      <MuiAutocomplete

        options={props.options}

        // value={props.value}

        // onChange={event =>

        //   props.onChange((event.target as HTMLInputElement).value as string)

        // }

        classes={{

          option: classes.menuItem,

        }}

        disabled={props.disabled}

        getOptionLabel={option => option.label}

        renderInput={params => (

          <TextField

            {...params}

            placeholder={props.placeholder}

            value={props.value}

            onChange={props.onChange}

          />

        )}

        renderOption={option => {

          return <Typography>{option.label}</Typography>

        }}

      />

    </FormControl>

  )

}```