Unable to type in year 'input' when flatpickr is inside bootstrap-vue modal

I’m submitting a … (check one with “x”)

[x] Bug report => search github for a similar issue or PR before submitting
[ ] Feature request
[ ] Other, please describe

Tell about your platform

• nuxt version: 2.14.0
• flatPickr version : 4.6.9
• Vue.js version : 2.x
• Browser name and version : Chrome|Firefox|Edge x.x.x
• This package version : 8.1.6

Current behavior

Normally my Flatpickr input is in a common component which can be used without problems but when the Flatpickr input which is in b-modal (Bootstrap-Vue Modal) has a problem it cannot type in the field (year, hour or minute). when add ‘inline: true’ to config the input field is can type.

Expected behavior

Minimal reproduction of the problem with instructions

[SoldierPePe]

The problem is with tabindex in the bootstrap modal content tag you need to remove the attribute to fix the problem to fix the problem add these lines to App.vue

mounted() {
    this.$root.$on('bv::modal::shown', bvEvent => {
      bvEvent.vueTarget.$refs.content.attributes.removeNamedItem('tabindex')
    })
}

the attribute will be removed every time modal is opened

[ankurk91]

Thanks, I will check in my day.