Vuepic / vue-datepicker

Datepicker component for Vue 3
https://vue3datepicker.com
MIT License
1.4k stars 137 forks source link

Incorrect month formatting #881

Closed exi66 closed 1 month ago

exi66 commented 2 months ago

Describe the bug Month string uses incorrect formatting from date-fns. Currently, to display the month in month-picker, number-dependent formatting is used, so the line with months looks as if it actually contains the first day of the month, which is incorrect.

To Reproduce

<script lang="ts" setup>
    import { ref } from 'vue';
    import Datepicker from '../src/VueDatePicker/VueDatePicker.vue';
    import { ru } from 'date-fns/locale';

    const selectedMonth = ref();
</script>

<template>
    <!-- Example -->
    <div class="wrapper">
        <Datepicker v-model="selectedMonth" month-picker :format-locale="ru" placeholder="Select Date" />
    </div>
    <!--
        inside the interface May (май in russia) look like this
        ----
        мая
        ----
        but the correct way should be:
        ----
        май
        ----
    -->
</template>

<style lang="scss">
    @import 'src/VueDatePicker/style/main';
    .wrapper {
        padding: 200px;
    }
</style>

Expected behavior data-fns has the correct Month Format (Standalone) value, which looks like LLL or LLLL. https://date-fns.org/v2.16.1/docs/format

Desktop & mobile (please complete the following information):

Jasenkoo commented 2 months ago

I will keep it open for now, until the new version. Tnx for the PR