From c26227ab67fa386cc6435c7e94ae243a80d6fcbe Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Jacob=20M=C3=BCller?= <jacob.mueller.elz@gmail.com>
Date: Tue, 8 Dec 2020 22:53:28 +0100
Subject: [PATCH] fix(b-form-datepicker): `valueAsDate` prop handling

---
 .../form-datepicker/form-datepicker.js        | 34 ++++++++++++-------
 1 file changed, 22 insertions(+), 12 deletions(-)

diff --git a/src/components/form-datepicker/form-datepicker.js b/src/components/form-datepicker/form-datepicker.js
index f8f7b120f17..9c211740cfc 100644
--- a/src/components/form-datepicker/form-datepicker.js
+++ b/src/components/form-datepicker/form-datepicker.js
@@ -25,10 +25,7 @@ const {
   props: modelProps,
   prop: MODEL_PROP_NAME,
   event: MODEL_EVENT_NAME
-} = makeModelMixin('value', {
-  type: PROP_TYPE_STRING,
-  defaultValue: ''
-})
+} = makeModelMixin('value', { type: PROP_TYPE_DATE_STRING })
 
 // --- Props ---
 
@@ -220,7 +217,11 @@ export const BFormDatepicker = /*#__PURE__*/ Vue.extend({
         h(
           BButton,
           {
-            props: { size: 'sm', disabled: disabled || readonly, variant: this.todayButtonVariant },
+            props: {
+              disabled: disabled || readonly,
+              size: 'sm',
+              variant: this.todayButtonVariant
+            },
             attrs: { 'aria-label': label || null },
             on: { click: this.onTodayButton }
           },
@@ -235,7 +236,11 @@ export const BFormDatepicker = /*#__PURE__*/ Vue.extend({
         h(
           BButton,
           {
-            props: { size: 'sm', disabled: disabled || readonly, variant: this.resetButtonVariant },
+            props: {
+              disabled: disabled || readonly,
+              size: 'sm',
+              variant: this.resetButtonVariant
+            },
             attrs: { 'aria-label': label || null },
             on: { click: this.onResetButton }
           },
@@ -250,7 +255,11 @@ export const BFormDatepicker = /*#__PURE__*/ Vue.extend({
         h(
           BButton,
           {
-            props: { size: 'sm', disabled, variant: this.closeButtonVariant },
+            props: {
+              disabled,
+              size: 'sm',
+              variant: this.closeButtonVariant
+            },
             attrs: { 'aria-label': label || null },
             on: { click: this.onCloseButton }
           },
@@ -281,8 +290,9 @@ export const BFormDatepicker = /*#__PURE__*/ Vue.extend({
         staticClass: 'b-form-date-calendar w-100',
         props: {
           ...pluckProps(calendarProps, $props),
-          value: localYMD,
           hidden: !this.isVisible,
+          value: localYMD,
+          valueAsDate: false,
           width: this.calendarWidth
         },
         on: {
@@ -311,13 +321,13 @@ export const BFormDatepicker = /*#__PURE__*/ Vue.extend({
         staticClass: 'b-form-datepicker',
         props: {
           ...pluckProps(formBtnLabelControlProps, $props),
-          id: this.safeId(),
-          value: localYMD,
           formattedValue: localYMD ? this.formattedValue : '',
+          id: this.safeId(),
+          lang: this.computedLang,
+          menuClass: [{ 'bg-dark': dark, 'text-light': dark }, this.menuClass],
           placeholder,
           rtl: this.isRTL,
-          lang: this.computedLang,
-          menuClass: [{ 'bg-dark': dark, 'text-light': dark }, this.menuClass]
+          value: localYMD
         },
         on: {
           show: this.onShow,