feat(ui5-daterange-picker): initial implementation (#1785)

Author: tsanislavgatev

packages/main/bundle.esm.js

@@ -40,6 +40,7 @@ import Carousel from "./dist/Carousel.js";
 import CheckBox from "./dist/CheckBox.js";
 import ComboBox from "./dist/ComboBox.js";
 import DatePicker from "./dist/DatePicker.js";
+import DateRangePicker from "./dist/DateRangePicker.js";
 import DateTimePicker from "./dist/DateTimePicker.js";
 import DurationPicker from "./dist/DurationPicker.js";
 import Dialog from "./dist/Dialog.js";

packages/main/src/DatePicker.js

@@ -401,7 +401,7 @@ class DatePicker extends UI5Element {
 			this.maxDate = null;
 			console.warn(`In order for the "maxDate" property to have effect, you should enter valid date format`); // eslint-disable-line
 		}
-		if (this.isValid(this.value) && this.isInValidRange(this._getTimeStampFromString(this.value))) {
+		if (this._checkValueValidity(this.value)) {
 			this._changeCalendarSelection();
 		} else {
 			this._calendar.selectedDates = [];
@@ -462,10 +462,9 @@ class DatePicker extends UI5Element {
 	_handleInputChange() {
 		let nextValue = this._getInput().getInputValue();
 		const emptyValue = nextValue === "";
-		const isValid = emptyValue || this.isValid(nextValue);
-		const isInValidRange = this.isInValidRange(this._getTimeStampFromString(nextValue));
+		const isValid = emptyValue || this._checkValueValidity(nextValue);
 
-		if (isValid && isInValidRange) {
+		if (isValid) {
 			nextValue = this.normalizeValue(nextValue);
 			this.valueState = ValueState.None;
 		} else {
@@ -482,12 +481,16 @@ class DatePicker extends UI5Element {
 	_handleInputLiveChange() {
 		const nextValue = this._getInput().getInputValue();
 		const emptyValue = nextValue === "";
-		const isValid = emptyValue || (this.isValid(nextValue) && this.isInValidRange(this._getTimeStampFromString(nextValue)));
+		const isValid = emptyValue || this._checkValueValidity(nextValue);
 
 		this.value = nextValue;
 		this.fireEvent("input", { value: nextValue, valid: isValid });
 	}
 
+	_checkValueValidity(value) {
+		return this.isValid(value) && this.isInValidRange(this._getTimeStampFromString(value));
+	}
+
 	_click(event) {
 		if (isPhone()) {
 			this.responsivePopover.open(this);

packages/main/src/DateRangePicker.hbs

@@ -0,0 +1 @@
+{{>include "./DatePicker.hbs"}}