How to forgo v-autocomplete dropdown list event when appended icon is clicked

Question

I have an icon I append into a v-autocomplete to hide some columns in a datatable. The v-autocomplete is a filter so I would like the user to be able to type in it and select options just not when the user clicks the icon since that has its own purpose. I would put the icon outside the select but it look better appended inside it. So is there a way to make it so clicking the icon only enables the click event and does not active the dropdown?

My template is as follows:

              <v-autocomplete
                class="my-5"
                v-for="(header,index) in headers"
                :key="index"
                clearable
                chips
                :label="header.title"
                :items="['California', 'Colorado', 'Florida', 'Georgia', 'Texas', 'Wyoming']"
                multiple
                density="compact"
                variant="outlined"
                hide-details
                single-line
                flat
              >
                <template v-slot:append-inner>
                  <v-btn @click="header.visible = !header.visible" flat variant="plain" size="small" :icon="header.visible ? 'mdi-eye' : 'mdi-eye-off'"/>
                </template>
              </v-autocomplete>