autocomplete is off but input field adding value automatically[ReactJs]

We have a ReactJs web application and we are taking some data through of input field but the problem is sometimes this field fills data automatically

For more specification, this problem happens when we are using Oppo and Redmi(OS) but for other OS it's working as normal

For more clear understanding, we made a video using Redmi mobile phone, and here is the video link, Please have a look at the video from the link. https://drive.google.com/file/d/1yo03CjqeV9iFXgtSH-ff7zgH1hJq60BY/view?usp=sharing

Here is the input field code

// Formik Field
<Field name={name}>
  {({ field }: any) => {
    return (
      <input
        {...rest}
        {...field}
        id={name}
        type="text"
        autoComplete="off" // we use before off= boolean
        value={values.data}
        placeholder="Input data"
        className={`appoint-input-box ${errors && touched ? " error-red-400" : null}`}
        onChange={async (event) => {
          handleFiend(event);
          setFieldValue("data", event.value.toLowerCase());
        }}
      />
    );
  }}
</Field>

As we said before, this is a ReactJs web app but for form handling we use Formik and this is a text-type input field also this form is a child form, it has a parent form as a controller.

Now we have autoComplete="off" but before we use boolean and top label form we also use the same.

We are hoping, that the provided information is describing properly the exact issue. If someone expert can guide us on what to do then it's will really pleasure

Thanks
Internazionaleauto