Set directive v-ripple component

[MaximeStl]

Hi, thanks for this directive.
How can y set v-ripple on component before define it globally ?

I have a b-btn like this :

And i want to set v-ripple directive for all my buttons so after it should be :

My libs configuration for v-ripple is :
import Ripple from 'vue-ripple-directive'

Ripple.color = 'rgba(255, 255, 255, 0.35)'
Ripple.zIndex = 55

export default Ripple

And before set BButton globaly i do that :
import Vue from 'vue'
import {
BVConfigPlugin,
BSidebar,
BOverlay,
BTable,
BButton,
BFormDatepicker,
BRow,
BCol,
} from 'bootstrap-vue'
import Ripple from './vue-ripple-directive'
import i18n from '@/libs/i18n'

Vue.use(BVConfigPlugin, {
BSidebar: {
backdrop: true,
bgVariant: 'white',
lazy: true,
noHeader: true,
right: true,
shadow: true,
sidebarClass: 'sidebar-lg',
},
BOverlay: {
rounded: true,
spinnerSmall: true,
spinnerVariant: 'primary',
},
BTable: {
// emptyText: i18n.t('common.no_record_found'),
responsive: true,
showEmpty: true,
hover: true,
},
BButton: { variant: 'primary' },
BFormDatepicker: {
// locale: i18n.locale,
dateFormatOptions: {
year: 'numeric',
month: 'short',
day: '2-digit',
weekday: 'short',
},
menuClass: 'w-100',
calendarWidth: '100%',
},
BRow,
})

BButton.directive('ripple', Ripple)

Vue.component('BSidebar', BSidebar)
Vue.component('BOverlay', BOverlay)
Vue.component('BTable', BTable)
Vue.component('BButton', BButton)
Vue.component('BFormDatepicker', BFormDatepicker)
Vue.component('BRow', BRow)
Vue.component('BCol', BCol)

But it's not work...

Can you help me ?