refactor(Calendar, DatePicker, DateRangePicker, TimePicker): prevents changing the time when the day is changed

Author: mrholek

js/src/calendar.js

@@ -29,7 +29,8 @@ import {
   isToday,
   isYearDisabled,
   isYearInRange,
-  isYearSelected
+  isYearSelected,
+  setTimeFromDate
 } from './util/calendar.js'
 
 /**
@@ -342,10 +343,10 @@ class Calendar extends BaseComponent {
       return
     }
 
-    this._hoverDate = date
+    this._hoverDate = setTimeFromDate(date, this._selectEndDate ? this._endDate : this._startDate)
 
     EventHandler.trigger(this._element, EVENT_CELL_HOVER, {
-      date: getDateBySelectionType(date, this._config.selectionType)
+      date: getDateBySelectionType(this._hoverDate, this._config.selectionType)
     })
 
     this._updateClassNamesAndAriaLabels()
@@ -483,14 +484,14 @@ class Calendar extends BaseComponent {
   }
 
   _setEndDate(date) {
-    this._endDate = date
+    this._endDate = setTimeFromDate(date, this._endDate)
     EventHandler.trigger(this._element, EVENT_END_DATE_CHANGE, {
       date: getDateBySelectionType(this._endDate, this._config.selectionType)
     })
   }
 
   _setStartDate(date) {
-    this._startDate = date
+    this._startDate = setTimeFromDate(date, this._startDate)
     EventHandler.trigger(this._element, EVENT_START_DATE_CHANGE, {
       date: getDateBySelectionType(this._startDate, this._config.selectionType)
     })

js/src/time-picker.js

@@ -256,6 +256,7 @@ class TimePicker extends BaseComponent {
       'am'
     this._timePickerBody.innerHTML = ''
     this._createTimePickerSelection()
+    this._setUpSelects()
   }
 
   // Private

js/src/util/calendar.js

@@ -637,3 +637,26 @@ export const removeTimeFromDate = date => {
   clearedDate.setHours(0, 0, 0, 0)
   return clearedDate
 }
+
+/**
+ * Copies the time (hours, minutes, seconds, milliseconds) from one Date to another.
+ *
+ * @param {Date} target - The date whose time will be updated.
+ * @param {Date} source - The date to copy the time from.
+ * @returns {Date} A new Date instance with the date from `target` and time from `source`.
+ */
+export const setTimeFromDate = (target, source) => {
+  if (!(source instanceof Date)) {
+    return target
+  }
+
+  const result = new Date(target) // create a copy to avoid mutation
+  result.setHours(
+    source.getHours(),
+    source.getMinutes(),
+    source.getSeconds(),
+    source.getMilliseconds()
+  )
+
+  return result
+}