flowbite-datepicker.vue

Example component
I had to use vanilla js to init the datepicker and pass some options.

<script setup>
function onChangeDate(e) {
  weightTrackingForm.date = e.target.value
}

onMounted(() => {
  const datepickerEl = document.getElementById('weight-datepicker')

  const dp = new Datepicker(datepickerEl, {
    autohide: true,
    todayBtn: true,
    // clearBtn: true,
    updateOnBlur: true,
    todayBtnMode: 1,
    todayHighlight: true,
    buttonClass: 'text-black bg-yellow hover:bg-black hover:text-white outline-black focus:ring-4 focus:ring-yellow',
  })
})  
</script>

<template>
<input
    id="weight-datepicker" ref="datepicker" type="text"
    class="pr-10 p-2.5 bg-white border border-gainsboro text-sm rounded-md block w-full hover:shadow-input focus:ring-blue focus:border-blue"
    placeholder="Select date" @changeDate="onChangeDate"
    @blur="v$_weight.date.$touch()"
  >
</template>

If your datepicker has broken styles you have to import the flowbite css via cdn in the app.blade.php (I'm using Laravel in my case)
<link href="https://cdnjs.cloudflare.com/ajax/libs/flowbite/1.8.1/flowbite.min.css" rel="stylesheet" />