How to prevent MUI Autocomplete from closing when its input looses focus

I have a MUI autocomplete with a a list of items and an edit icon next to each one which rerenders the option as a textfield to allow changing the name of the option but when I click inside textfield the dropdonwn closes.

I tried using autoFocus on the textfield but that makes the dropdown close as soon as I click the edit icon

It seems that whenever the autocomplete input looses focus it closes, is there any way to prevent this?

const [isEdit, SetIsEdit] = useState(false);
const [name, SetName] = useState('Blue');

<Autocomplete
      options={data}
      value={val}
      onChange={(e, val)=> {handleChange(e, val)}}
      filterSelectedOptions

      // --------------- OPTION RENDER ---------------

      renderOption={(props, option) => {

        isEdit ?
        <Box {...props}>
        <Textfield value={name} onChange={()=>{setName(e.target.value)}}/>
        <DoneIcon onClick={()=>{setIsEdit(false)}}/>
        </Box>
        :
        <Box {...props}>
        <Typography>{option.label}</Typography>
        <EditIcon onClick={()=>{setIsEdit(true)}}/>
         </Box>
      }}
    />
  );
}