Auto Fill Values from API

Using React, Formik to send a form. I have some inputs that populate from Address autocomplete API(CanadaPost). Because I do not finish typing all the characters and the API suggest some options for me, I just click the suggestions from the API. These options populate the remaining Input fields.

The problem is when the form is sent, the state is not captured. It only captures what I typed in the input field. How do I let Formik capture the remaining characters?

Input Fields are address1,address2, city, zip code, state, and country. For Example On adddress1, I start typing 8303, it will give me suggestions of addresses starting with 8303 then I will choose the correct one which then populates the correct data and pass them to the remaining input fields. The problem is Formik does not capture the states because the fields were not touched and the onChange event does not see. The irony is when I autofill from my own data from the browser, it sees the changes.

<Formik
initialValues = {{
"firstName": "",
address1: ""
address2: "",
city: "", 
zipCode: "",
state: "",
country: "",
}}
 onSubmit={(values, { setSubmitting, resetForm }) => {
 setTimeout(() => {
alert(JSON.stringify(values, null, 2));
setSubmitting(false);
}, 2000);
resetForm();
}}
  validationSchema={validateSchema}
>

-- Form---

           <label htmlFor="" className="relative block">
                  <span className="my-3">Address 1</span>
                  <input
                    type="text"
                    name="address1"
                    onChange={handleChange}
                    onBlur={handleBlur}
                    value={values.address1}
                  />
              
                    </div>
                  )}
                </label>
                  <label htmlFor="" className="relative block">
                  <span className="my-3">city</span>
                  <input
                    type="text"
                    name="city"
                    onChange={handleChange}
                    onBlur={handleBlur}
                    value={values.city}
                  />
                    </div>
                  )}
                </label>