From 12174a1f9666b36e1d6daba5c75a8f0feb3c3ee7 Mon Sep 17 00:00:00 2001
From: melloware <mellowaredev@gmail.com>
Date: Sun, 9 Jul 2023 10:46:01 -0400
Subject: [PATCH] Fix #4113: Calendar showMonthAfterYear locale option

---
 components/lib/calendar/Calendar.vue | 80 +++++++++++++++++++---------
 components/lib/config/PrimeVue.d.ts  |  1 +
 components/lib/config/PrimeVue.js    |  1 +
 3 files changed, 58 insertions(+), 24 deletions(-)

diff --git a/components/lib/calendar/Calendar.vue b/components/lib/calendar/Calendar.vue
index e261c13e8..2004ff2c8 100755
--- a/components/lib/calendar/Calendar.vue
+++ b/components/lib/calendar/Calendar.vue
@@ -85,30 +85,62 @@
                                         </slot>
                                     </button>
                                     <div :class="cx('title')" v-bind="ptm('title')">
-                                        <button
-                                            v-if="currentView === 'date'"
-                                            type="button"
-                                            @click="switchToMonthView"
-                                            @keydown="onContainerButtonKeydown"
-                                            :class="cx('monthTitle')"
-                                            :disabled="switchViewButtonDisabled"
-                                            :aria-label="$primevue.config.locale.chooseMonth"
-                                            v-bind="ptm('monthTitle')"
-                                        >
-                                            {{ getMonthName(month.month) }}
-                                        </button>
-                                        <button
-                                            v-if="currentView !== 'year'"
-                                            type="button"
-                                            @click="switchToYearView"
-                                            @keydown="onContainerButtonKeydown"
-                                            :class="cx('yearTitle')"
-                                            :disabled="switchViewButtonDisabled"
-                                            :aria-label="$primevue.config.locale.chooseYear"
-                                            v-bind="ptm('yearTitle')"
-                                        >
-                                            {{ getYear(month) }}
-                                        </button>
+                                        <span v-if="$primevue.config.locale.showMonthAfterYear">
+                                            <button
+                                                v-if="currentView !== 'year'"
+                                                type="button"
+                                                @click="switchToYearView"
+                                                @keydown="onContainerButtonKeydown"
+                                                :class="cx('yearTitle')"
+                                                :disabled="switchViewButtonDisabled"
+                                                :aria-label="$primevue.config.locale.chooseYear"
+                                                v-bind="ptm('yearTitle')"
+                                                data-pc-group-section="view"
+                                            >
+                                                {{ getYear(month) }}
+                                            </button>
+                                            <button
+                                                v-if="currentView === 'date'"
+                                                type="button"
+                                                @click="switchToMonthView"
+                                                @keydown="onContainerButtonKeydown"
+                                                :class="cx('monthTitle')"
+                                                :disabled="switchViewButtonDisabled"
+                                                :aria-label="$primevue.config.locale.chooseMonth"
+                                                v-bind="ptm('monthTitle')"
+                                                data-pc-group-section="view"
+                                            >
+                                                {{ getMonthName(month.month) }}
+                                            </button>
+                                        </span>
+                                        <span v-else>
+                                            <button
+                                                v-if="currentView === 'date'"
+                                                type="button"
+                                                @click="switchToMonthView"
+                                                @keydown="onContainerButtonKeydown"
+                                                :class="cx('monthTitle')"
+                                                :disabled="switchViewButtonDisabled"
+                                                :aria-label="$primevue.config.locale.chooseMonth"
+                                                v-bind="ptm('monthTitle')"
+                                                data-pc-group-section="view"
+                                            >
+                                                {{ getMonthName(month.month) }}
+                                            </button>
+                                            <button
+                                                v-if="currentView !== 'year'"
+                                                type="button"
+                                                @click="switchToYearView"
+                                                @keydown="onContainerButtonKeydown"
+                                                :class="cx('yearTitle')"
+                                                :disabled="switchViewButtonDisabled"
+                                                :aria-label="$primevue.config.locale.chooseYear"
+                                                v-bind="ptm('yearTitle')"
+                                                data-pc-group-section="view"
+                                            >
+                                                {{ getYear(month) }}
+                                            </button>
+                                        </span>
                                         <span v-if="currentView === 'year'" :class="cx('decadeTitle')" v-bind="ptm('decadeTitle')">
                                             <slot name="decade" :years="yearPickerValues"> {{ yearPickerValues[0].value }} - {{ yearPickerValues[yearPickerValues.length - 1].value }} </slot>
                                         </span>
diff --git a/components/lib/config/PrimeVue.d.ts b/components/lib/config/PrimeVue.d.ts
index f8d8ee470..e0af93df8 100644
--- a/components/lib/config/PrimeVue.d.ts
+++ b/components/lib/config/PrimeVue.d.ts
@@ -303,6 +303,7 @@ interface PrimeVueLocaleOptions {
     today?: string;
     weekHeader?: string;
     firstDayOfWeek?: number;
+    showMonthAfterYear?: boolean;
     dateFormat?: string;
     weak?: string;
     medium?: string;
diff --git a/components/lib/config/PrimeVue.js b/components/lib/config/PrimeVue.js
index 078b401b0..c4bcd9172 100644
--- a/components/lib/config/PrimeVue.js
+++ b/components/lib/config/PrimeVue.js
@@ -58,6 +58,7 @@ export const defaultOptions = {
         today: 'Today',
         weekHeader: 'Wk',
         firstDayOfWeek: 0,
+        showMonthAfterYear: false,
         dateFormat: 'mm/dd/yy',
         weak: 'Weak',
         medium: 'Medium',