Changing `locale` does not update input text automatically

[odzhychko]

Describe the bug

When the locale props changes, the input text only updates after the date picker is focused.
(Maybe not a bug, but a new feature.)

To Reproduce

<script setup lang="ts">
import { ref, computed } from 'vue';
import { VueDatePicker } from '@vuepic/vue-datepicker';
import '@vuepic/vue-datepicker/dist/main.css';
import { enUS, de } from 'date-fns/locale';

const locales = [enUS, de];
const locale = ref(enUS);
const date = ref(new Date());
</script>

<template>
  <div>
    <select v-model="locale">
      <option v-for="locale in locales" :key="locale.code" :value="locale">
        {{ locale.code }}
      </option>
    </select>
    <div>
      <VueDatePicker
        v-model="date"
        :locale
        :formats="{ input: 'dd LLLL yyyy HH:mm' }"
      />
    </div>
  </div>
</template>

Steps to reproduce the behavior:

1. Use dropdown to change the locale from "en-US" to "de".
2. See input text not changing.
3. Click on the date picker.
4. See input text updating.

Expected behavior

The input text should update directly after the locale changed.

Screenshots

Screencast.From.2026-06-23.07-39-45.mp4

Desktop & mobile (please complete the following information):

• Chromium 149 (Desktop)
• Firefox 152 (Desktop)
• Others I have not tested

Version

• The example above was reproduced with v14.0.0
• Similar behavior was observed in v11.0.3

Workaround

Add derive a key from the locale to rerender the component when the locale changes.

<VueDatePicker
  :key="locale.code"
  v-model="date"
  :locale
  :formats="{ input: 'dd LLLL yyyy HH:mm' }"
/>