From c2ca42812feeb0ea755bee3dc24791773e5bb439 Mon Sep 17 00:00:00 2001
From: Ignacio Tampe Palma <thenachotp@gmail.com>
Date: Mon, 11 Feb 2019 13:02:24 -0300
Subject: [PATCH 1/4] Fixing error with UTC not being handled correctly

---
 src/components/Datepicker.vue | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/src/components/Datepicker.vue b/src/components/Datepicker.vue
index 67055bef..4fe43976 100644
--- a/src/components/Datepicker.vue
+++ b/src/components/Datepicker.vue
@@ -328,6 +328,9 @@ export default {
      */
     setDate (timestamp) {
       const date = new Date(timestamp)
+      if (this.useUtc) {
+        date = new Date(Date.UTC(date.getUTCFullYear(), date.getUTCMonth(), date.getUTCDate()))
+      }
       this.selectedDate = date
       this.setPageDate(date)
       this.$emit('selected', date)

From 306561f7247822f5c8b3d3e395e6d0a6b3e60e94 Mon Sep 17 00:00:00 2001
From: Ignacio Tampe Palma <thenachotp@gmail.com>
Date: Mon, 11 Feb 2019 13:09:55 -0300
Subject: [PATCH 2/4] Fixed mistake on trying to write const var

---
 src/components/Datepicker.vue | 305 ++++++++++++++++++----------------
 1 file changed, 158 insertions(+), 147 deletions(-)

diff --git a/src/components/Datepicker.vue b/src/components/Datepicker.vue
index 4fe43976..1ed6f8cf 100644
--- a/src/components/Datepicker.vue
+++ b/src/components/Datepicker.vue
@@ -25,11 +25,11 @@
       @showCalendar="showCalendar"
       @closeCalendar="close"
       @typedDate="setTypedDate"
-      @clearDate="clearDate">
+      @clearDate="clearDate"
+    >
       <slot name="afterDateInput" slot="afterDateInput"></slot>
     </date-input>
 
-
     <!-- Day View -->
     <picker-day
       v-if="allowedToShowView('day')"
@@ -51,7 +51,8 @@
       @changedMonth="handleChangedMonthFromDayPicker"
       @selectDate="selectDate"
       @showMonthCalendar="showMonthCalendar"
-      @selectedDisabled="selectDisabledDate">
+      @selectedDisabled="selectDisabledDate"
+    >
       <slot name="beforeCalendarHeader" slot="beforeCalendarHeader"></slot>
     </picker-day>
 
@@ -70,7 +71,8 @@
       :use-utc="useUtc"
       @selectMonth="selectMonth"
       @showYearCalendar="showYearCalendar"
-      @changedYear="setPageDate">
+      @changedYear="setPageDate"
+    >
       <slot name="beforeCalendarHeader" slot="beforeCalendarHeader"></slot>
     </picker-month>
 
@@ -88,18 +90,19 @@
       :isRtl="isRtl"
       :use-utc="useUtc"
       @selectYear="selectYear"
-      @changedDecade="setPageDate">
+      @changedDecade="setPageDate"
+    >
       <slot name="beforeCalendarHeader" slot="beforeCalendarHeader"></slot>
     </picker-year>
   </div>
 </template>
 <script>
-import en from '../locale/translations/en'
-import DateInput from './DateInput.vue'
-import PickerDay from './PickerDay.vue'
-import PickerMonth from './PickerMonth.vue'
-import PickerYear from './PickerYear.vue'
-import utils, { makeDateUtils } from '../utils/DateUtils'
+import en from "../locale/translations/en";
+import DateInput from "./DateInput.vue";
+import PickerDay from "./PickerDay.vue";
+import PickerMonth from "./PickerMonth.vue";
+import PickerYear from "./PickerYear.vue";
+import utils, { makeDateUtils } from "../utils/DateUtils";
 export default {
   components: {
     DateInput,
@@ -116,7 +119,7 @@ export default {
     id: String,
     format: {
       type: [String, Function],
-      default: 'dd MMM yyyy'
+      default: "dd MMM yyyy"
     },
     language: {
       type: Object,
@@ -148,17 +151,17 @@ export default {
     useUtc: Boolean,
     minimumView: {
       type: String,
-      default: 'day'
+      default: "day"
     },
     maximumView: {
       type: String,
-      default: 'year'
+      default: "year"
     }
   },
-  data () {
-    const startDate = this.openDate ? new Date(this.openDate) : new Date()
-    const constructedDateUtils = makeDateUtils(this.useUtc)
-    const pageTimestamp = constructedDateUtils.setDate(startDate, 1)
+  data() {
+    const startDate = this.openDate ? new Date(this.openDate) : new Date();
+    const constructedDateUtils = makeDateUtils(this.useUtc);
+    const pageTimestamp = constructedDateUtils.setDate(startDate, 1);
     return {
       /*
        * Vue cannot observe changes to a Date Object so date must be stored as a timestamp
@@ -184,48 +187,48 @@ export default {
       calendarHeight: 0,
       resetTypedDate: new Date(),
       utils: constructedDateUtils
-    }
+    };
   },
   watch: {
-    value (value) {
-      this.setValue(value)
+    value(value) {
+      this.setValue(value);
     },
-    openDate () {
-      this.setPageDate()
+    openDate() {
+      this.setPageDate();
     },
-    initialView () {
-      this.setInitialView()
+    initialView() {
+      this.setInitialView();
     }
   },
   computed: {
-    computedInitialView () {
+    computedInitialView() {
       if (!this.initialView) {
-        return this.minimumView
+        return this.minimumView;
       }
 
-      return this.initialView
+      return this.initialView;
     },
-    pageDate () {
-      return new Date(this.pageTimestamp)
+    pageDate() {
+      return new Date(this.pageTimestamp);
     },
 
-    translation () {
-      return this.language
+    translation() {
+      return this.language;
     },
 
-    calendarStyle () {
+    calendarStyle() {
       return {
-        position: this.isInline ? 'static' : undefined
-      }
+        position: this.isInline ? "static" : undefined
+      };
     },
-    isOpen () {
-      return this.showDayView || this.showMonthView || this.showYearView
+    isOpen() {
+      return this.showDayView || this.showMonthView || this.showYearView;
     },
-    isInline () {
-      return !!this.inline
+    isInline() {
+      return !!this.inline;
     },
-    isRtl () {
-      return this.translation.rtl === true
+    isRtl() {
+      return this.translation.rtl === true;
     }
   },
   methods: {
@@ -233,44 +236,50 @@ export default {
      * Called in the event that the user navigates to date pages and
      * closes the picker without selecting a date.
      */
-    resetDefaultPageDate () {
+    resetDefaultPageDate() {
       if (this.selectedDate === null) {
-        this.setPageDate()
-        return
+        this.setPageDate();
+        return;
       }
-      this.setPageDate(this.selectedDate)
+      this.setPageDate(this.selectedDate);
     },
     /**
      * Effectively a toggle to show/hide the calendar
      * @return {mixed}
      */
-    showCalendar () {
+    showCalendar() {
       if (this.disabled || this.isInline) {
-        return false
+        return false;
       }
       if (this.isOpen) {
-        return this.close(true)
+        return this.close(true);
       }
-      this.setInitialView()
+      this.setInitialView();
     },
     /**
      * Sets the initial picker page view: day, month or year
      */
-    setInitialView () {
-      const initialView = this.computedInitialView
+    setInitialView() {
+      const initialView = this.computedInitialView;
       if (!this.allowedToShowView(initialView)) {
-        throw new Error(`initialView '${this.initialView}' cannot be rendered based on minimum '${this.minimumView}' and maximum '${this.maximumView}'`)
+        throw new Error(
+          `initialView '${
+            this.initialView
+          }' cannot be rendered based on minimum '${
+            this.minimumView
+          }' and maximum '${this.maximumView}'`
+        );
       }
       switch (initialView) {
-        case 'year':
-          this.showYearCalendar()
-          break
-        case 'month':
-          this.showMonthCalendar()
-          break
+        case "year":
+          this.showYearCalendar();
+          break;
+        case "month":
+          this.showMonthCalendar();
+          break;
         default:
-          this.showDayCalendar()
-          break
+          this.showDayCalendar();
+          break;
       }
     },
     /**
@@ -278,191 +287,193 @@ export default {
      * @param {String} view
      * @return {Boolean}
      */
-    allowedToShowView (view) {
-      const views = ['day', 'month', 'year']
-      const minimumViewIndex = views.indexOf(this.minimumView)
-      const maximumViewIndex = views.indexOf(this.maximumView)
-      const viewIndex = views.indexOf(view)
+    allowedToShowView(view) {
+      const views = ["day", "month", "year"];
+      const minimumViewIndex = views.indexOf(this.minimumView);
+      const maximumViewIndex = views.indexOf(this.maximumView);
+      const viewIndex = views.indexOf(view);
 
-      return viewIndex >= minimumViewIndex && viewIndex <= maximumViewIndex
+      return viewIndex >= minimumViewIndex && viewIndex <= maximumViewIndex;
     },
     /**
      * Show the day picker
      * @return {Boolean}
      */
-    showDayCalendar () {
-      if (!this.allowedToShowView('day')) {
-        return false
+    showDayCalendar() {
+      if (!this.allowedToShowView("day")) {
+        return false;
       }
-      this.close()
-      this.showDayView = true
-      return true
+      this.close();
+      this.showDayView = true;
+      return true;
     },
     /**
      * Show the month picker
      * @return {Boolean}
      */
-    showMonthCalendar () {
-      if (!this.allowedToShowView('month')) {
-        return false
+    showMonthCalendar() {
+      if (!this.allowedToShowView("month")) {
+        return false;
       }
-      this.close()
-      this.showMonthView = true
-      return true
+      this.close();
+      this.showMonthView = true;
+      return true;
     },
     /**
      * Show the year picker
      * @return {Boolean}
      */
-    showYearCalendar () {
-      if (!this.allowedToShowView('year')) {
-        return false
+    showYearCalendar() {
+      if (!this.allowedToShowView("year")) {
+        return false;
       }
-      this.close()
-      this.showYearView = true
-      return true
+      this.close();
+      this.showYearView = true;
+      return true;
     },
     /**
      * Set the selected date
      * @param {Number} timestamp
      */
-    setDate (timestamp) {
-      const date = new Date(timestamp)
+    setDate(timestamp) {
       if (this.useUtc) {
-        date = new Date(Date.UTC(date.getUTCFullYear(), date.getUTCMonth(), date.getUTCDate()))
+        const date = new Date(
+          Date.UTC(date.getUTCFullYear(), date.getUTCMonth(), date.getUTCDate())
+        );
+      } else {
+        const date = new Date(timestamp);
       }
-      this.selectedDate = date
-      this.setPageDate(date)
-      this.$emit('selected', date)
-      this.$emit('input', date)
+      this.selectedDate = date;
+      this.setPageDate(date);
+      this.$emit("selected", date);
+      this.$emit("input", date);
     },
     /**
      * Clear the selected date
      */
-    clearDate () {
-      this.selectedDate = null
-      this.setPageDate()
-      this.$emit('selected', null)
-      this.$emit('input', null)
-      this.$emit('cleared')
+    clearDate() {
+      this.selectedDate = null;
+      this.setPageDate();
+      this.$emit("selected", null);
+      this.$emit("input", null);
+      this.$emit("cleared");
     },
     /**
      * @param {Object} date
      */
-    selectDate (date) {
-      this.setDate(date.timestamp)
+    selectDate(date) {
+      this.setDate(date.timestamp);
       if (!this.isInline) {
-        this.close(true)
+        this.close(true);
       }
-      this.resetTypedDate = new Date()
+      this.resetTypedDate = new Date();
     },
     /**
      * @param {Object} date
      */
-    selectDisabledDate (date) {
-      this.$emit('selectedDisabled', date)
+    selectDisabledDate(date) {
+      this.$emit("selectedDisabled", date);
     },
     /**
      * @param {Object} month
      */
-    selectMonth (month) {
-      const date = new Date(month.timestamp)
-      if (this.allowedToShowView('day')) {
-        this.setPageDate(date)
-        this.$emit('changedMonth', month)
-        this.showDayCalendar()
+    selectMonth(month) {
+      const date = new Date(month.timestamp);
+      if (this.allowedToShowView("day")) {
+        this.setPageDate(date);
+        this.$emit("changedMonth", month);
+        this.showDayCalendar();
       } else {
-        this.selectDate(month)
+        this.selectDate(month);
       }
     },
     /**
      * @param {Object} year
      */
-    selectYear (year) {
-      const date = new Date(year.timestamp)
-      if (this.allowedToShowView('month')) {
-        this.setPageDate(date)
-        this.$emit('changedYear', year)
-        this.showMonthCalendar()
+    selectYear(year) {
+      const date = new Date(year.timestamp);
+      if (this.allowedToShowView("month")) {
+        this.setPageDate(date);
+        this.$emit("changedYear", year);
+        this.showMonthCalendar();
       } else {
-        this.selectDate(year)
+        this.selectDate(year);
       }
     },
     /**
      * Set the datepicker value
      * @param {Date|String|Number|null} date
      */
-    setValue (date) {
-      if (typeof date === 'string' || typeof date === 'number') {
-        let parsed = new Date(date)
-        date = isNaN(parsed.valueOf()) ? null : parsed
+    setValue(date) {
+      if (typeof date === "string" || typeof date === "number") {
+        let parsed = new Date(date);
+        date = isNaN(parsed.valueOf()) ? null : parsed;
       }
       if (!date) {
-        this.setPageDate()
-        this.selectedDate = null
-        return
+        this.setPageDate();
+        this.selectedDate = null;
+        return;
       }
-      this.selectedDate = date
-      this.setPageDate(date)
+      this.selectedDate = date;
+      this.setPageDate(date);
     },
     /**
      * Sets the date that the calendar should open on
      */
-    setPageDate (date) {
+    setPageDate(date) {
       if (!date) {
         if (this.openDate) {
-          date = new Date(this.openDate)
+          date = new Date(this.openDate);
         } else {
-          date = new Date()
+          date = new Date();
         }
       }
-      this.pageTimestamp = this.utils.setDate(new Date(date), 1)
+      this.pageTimestamp = this.utils.setDate(new Date(date), 1);
     },
     /**
      * Handles a month change from the day picker
      */
-    handleChangedMonthFromDayPicker (date) {
-      this.setPageDate(date)
-      this.$emit('changedMonth', date)
+    handleChangedMonthFromDayPicker(date) {
+      this.setPageDate(date);
+      this.$emit("changedMonth", date);
     },
     /**
      * Set the date from a typedDate event
      */
-    setTypedDate (date) {
-      this.setDate(date.getTime())
+    setTypedDate(date) {
+      this.setDate(date.getTime());
     },
     /**
      * Close all calendar layers
      * @param {Boolean} emitEvent - emit close event
      */
-    close (emitEvent) {
-      this.showDayView = this.showMonthView = this.showYearView = false
+    close(emitEvent) {
+      this.showDayView = this.showMonthView = this.showYearView = false;
       if (!this.isInline) {
         if (emitEvent) {
-          this.$emit('closed')
+          this.$emit("closed");
         }
-        document.removeEventListener('click', this.clickOutside, false)
+        document.removeEventListener("click", this.clickOutside, false);
       }
     },
     /**
      * Initiate the component
      */
-    init () {
+    init() {
       if (this.value) {
-        this.setValue(this.value)
+        this.setValue(this.value);
       }
       if (this.isInline) {
-        this.setInitialView()
+        this.setInitialView();
       }
     }
   },
-  mounted () {
-    this.init()
+  mounted() {
+    this.init();
   }
-}
+};
 // eslint-disable-next-line
-;
 </script>
 <style lang="stylus">
-@import '../styles/style'
+@import '../styles/style';
 </style>

From 12e6b4b68a2fc447aa321c24f0ddbdf29643d319 Mon Sep 17 00:00:00 2001
From: Ignacio Tampe Palma <thenachotp@gmail.com>
Date: Mon, 11 Feb 2019 13:16:20 -0300
Subject: [PATCH 3/4] Fix again

---
 src/components/Datepicker.vue | 10 ++++------
 1 file changed, 4 insertions(+), 6 deletions(-)

diff --git a/src/components/Datepicker.vue b/src/components/Datepicker.vue
index 1ed6f8cf..7a01ea17 100644
--- a/src/components/Datepicker.vue
+++ b/src/components/Datepicker.vue
@@ -336,13 +336,11 @@ export default {
      * @param {Number} timestamp
      */
     setDate(timestamp) {
+      var date = new Date(timestamp);
       if (this.useUtc) {
-        const date = new Date(
-          Date.UTC(date.getUTCFullYear(), date.getUTCMonth(), date.getUTCDate())
-        );
-      } else {
-        const date = new Date(timestamp);
-      }
+        date = new Date(Date.UTC(date.getUTCFullYear(), date.getUTCMonth(), date.getUTCDate())
+      );
+
       this.selectedDate = date;
       this.setPageDate(date);
       this.$emit("selected", date);

From 3463533c90f61ee5471e28ce516659366d2b63ff Mon Sep 17 00:00:00 2001
From: Ignacio Tampe Palma <thenachotp@gmail.com>
Date: Mon, 11 Feb 2019 13:18:36 -0300
Subject: [PATCH 4/4] Fix again

---
 src/components/Datepicker.vue | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/components/Datepicker.vue b/src/components/Datepicker.vue
index 7a01ea17..0eaf0d99 100644
--- a/src/components/Datepicker.vue
+++ b/src/components/Datepicker.vue
@@ -338,8 +338,8 @@ export default {
     setDate(timestamp) {
       var date = new Date(timestamp);
       if (this.useUtc) {
-        date = new Date(Date.UTC(date.getUTCFullYear(), date.getUTCMonth(), date.getUTCDate())
-      );
+        date = new Date(Date.UTC(date.getUTCFullYear(), date.getUTCMonth(), date.getUTCDate()))
+      }
 
       this.selectedDate = date;
       this.setPageDate(date);