sagalbot / vue-select

Everything you wish the HTML <select> element could do, wrapped up into a lightweight, extensible Vue component.
https://vue-select.org
MIT License
4.62k stars 1.33k forks source link

Modal with v-select doesn't close on ESC if an item is selected #1685

Open kreut opened 1 year ago

kreut commented 1 year ago

Please respect maintainers time by filling in these sections. Your issue will likely be closed without this information.

Describe the bug When the select is in a modal, the ESC doesn't work to close the modal after an item is selected; it does work if I select something, then clear it out, then hit ESC.

Reproduction Link https://youtu.be/wdrC08VSkNA

Steps To Reproduce Created a modal with the select feature

Expected behavior I expected to be able to click on the ESC to close the modal even after making a selection.

Screenshots

<b-modal
      id="modal-import-course"
      ref="modal"
      title="Import Course"
      size="lg"
    >
      <div id="course_to_import">
        <v-select
          id="course-to-import"
          v-model="courseToImport"
          class="mb-2"
          :options="formattedImportableCourses"
          placeholder="Enter a course or instructor name"
          @input="checkIfAlpha($event)"
        />
      </div>
        <b-button
          size="sm"
          class="float-right"
          @click="$bvModal.hide('modal-import-course')"
        >
          Cancel
        </b-button>
        <b-button
          variant="primary"
          size="sm"
          class="float-right"
          :disabled="disableYesImportCourse || processingImportCourse"
          @click="handleImportCourse"
        >
          Yes, import course!
        </b-button>
      </template>
    </b-modal>