Datepicker v-model not reactive when removing date

*Expected behavior*When I assign the v-model of the date picker to an empty string to clear the input, the v-model will change and the component will display nothing.

*Actual behavior*When I assign the v-model of the date picker to an empty string to clear the input, the v-model changes and but display the previous value is still displayed.

Resources (screenshots, code snippets etc.)

<template>
  <div>Current v-model: {{date}}</div>
  <MDBDatepicker 
    v-model="date"
    label="DatePicker"
    format="YYYY-MM-DD"
  />
  <MDBBtn @click="addDate">Add date</MDBBtn>
  <MDBBtn @click="removeDate">Remove date</MDBBtn>
</template>
<script setup>
import { ref } from '@vue/reactivity'
import { MDBDatepicker, MDBBtn } from 'mdb-vue-ui-kit'
const date = ref('')
const addDate = () => {
  date.value = '2000-01-01'
}
const removeDate = () => {
  date.value = ''
}
</script>

Here is a working replication of the issue:

• First click 'Add date' to populate the input field

• Then click 'Removed date' to unpopulate the field.

The v-model will disappear above the input but the input value will stay the same.

Additionally, Vue Dev tools is showing that the modelValue prop and the inputValue ref within the component are not being updated by empty strings.

Another issue I ran into was that disabling DatePicker still allows for the user to click the datepicker modal.