<script setup lang="ts">
  import { ref } from 'vue'
  import VueTailwindDatepicker from 'vue-tailwind-datepicker'

  const dateValue = ref('')
  const formatter = ref({
    date: 'DD MMM YYYY',
    month: 'MMM'
  })
</script>

<template>
  <vue-tailwind-datepicker 
    input-classes="w-full px-4 py-2 text-sm leading-6 placeholder:text-gray-400 text-gray-900 border-0 border-transparent rounded-lg outline-0 bg-gray-200 focus:outline-0 focus:border-0 focus:ring-0"
    v-model="dateValue"
    :formatter="formatter"
    separator="   s/d   "
    :shortcuts="false"
    :auto-apply="false"
  />
</template>