@syncfusion/ej2-calendars 22.2.11 → 23.1.36

package/dist/es6/ej2-calendars.es2015.js

@@ -1454,6 +1454,7 @@ let CalendarBase = class CalendarBase extends Component {
         }
         this.todayElement = null;
         this.tableBodyElement = null;
+        this.todayButtonEvent = null;
         this.renderDayCellArgs = null;
         this.headerElement = null;
         this.nextIcon = null;
@@ -2397,6 +2398,7 @@ let Calendar = class Calendar extends CalendarBase {
     destroy() {
         super.destroy();
         if (this.getModuleName() === 'calendar') {
+            this.changedArgs = null;
             const form = closest(this.element, 'form');
             if (form) {
                 EventHandler.remove(form, 'reset', this.formResetHandler.bind(this));
@@ -3206,6 +3208,7 @@ let DatePicker = class DatePicker extends Calendar {
         this.moduleName = this.getModuleName();
         this.isFocused = false;
         this.isBlur = false;
+        this.isKeyAction = false;
         this.datepickerOptions = options;
     }
     /**
@@ -3533,6 +3536,7 @@ let DatePicker = class DatePicker extends Calendar {
         EventHandler.add(this.inputElement, 'mouseup', this.mouseUpHandler, this);
         EventHandler.add(this.inputElement, 'focus', this.inputFocusHandler, this);
         EventHandler.add(this.inputElement, 'blur', this.inputBlurHandler, this);
+        EventHandler.add(this.inputElement, 'keyup', this.keyupHandler, this);
         if (this.enableMask) {
             EventHandler.add(this.inputElement, 'keydown', this.keydownHandler, this);
         }
@@ -3583,6 +3587,7 @@ let DatePicker = class DatePicker extends Calendar {
         EventHandler.remove(this.inputElement, 'focus', this.inputFocusHandler);
         EventHandler.remove(this.inputElement, 'blur', this.inputBlurHandler);
         EventHandler.remove(this.inputElement, 'change', this.inputChangeHandler);
+        EventHandler.remove(this.inputElement, 'keyup', this.keyupHandler);
         if (this.enableMask) {
             EventHandler.remove(this.inputElement, 'keydown', this.keydownHandler);
         }
@@ -4271,12 +4276,16 @@ let DatePicker = class DatePicker extends Calendar {
                 this.isInteracted = true;
             }
         }
+        this.isKeyAction = false;
     }
     navigatedEvent() {
         this.trigger('navigated', this.navigatedArgs);
     }
+    keyupHandler(e) {
+        this.isKeyAction = (this.inputElement.value !== this.previousElementValue) ? true : false;
+    }
     changeEvent(event) {
-        if (!this.isIconClicked && !this.isBlur) {
+        if (!this.isIconClicked && !(this.isBlur || this.isKeyAction)) {
             this.selectCalendar(event);
         }
         if (((this.previousDate && this.previousDate.valueOf()) !== (this.value && this.value.valueOf()))) {
@@ -4296,6 +4305,7 @@ let DatePicker = class DatePicker extends Calendar {
         else if (event) {
             this.hide(event);
         }
+        this.isKeyAction = false;
     }
     requiredModules() {
         const modules = [];
@@ -5304,6 +5314,7 @@ let DateRangePicker = class DateRangePicker extends CalendarBase {
         this.invalidValueString = null;
         this.isAngular = false;
         this.preventChange = false;
+        this.isKeyPressed = false;
         this.dateRangeOptions = options;
     }
     /**
@@ -5654,6 +5665,7 @@ let DateRangePicker = class DateRangePicker extends CalendarBase {
         EventHandler.add(this.inputElement, 'focus', this.inputFocusHandler, this);
         EventHandler.add(this.inputElement, 'blur', this.inputBlurHandler, this);
         EventHandler.add(this.inputElement, 'change', this.inputChangeHandler, this);
+        EventHandler.add(this.inputElement, 'keyup', this.keyupHandler, this);
         if (this.showClearButton && this.inputWrapper.clearButton) {
             EventHandler.add(this.inputWrapper.clearButton, 'mousedown', this.resetHandler, this);
         }
@@ -5680,6 +5692,7 @@ let DateRangePicker = class DateRangePicker extends CalendarBase {
         EventHandler.remove(this.inputElement, 'blur', this.inputBlurHandler);
         EventHandler.remove(this.inputElement, 'focus', this.inputFocusHandler);
         EventHandler.remove(this.inputElement, 'change', this.inputChangeHandler);
+        EventHandler.remove(this.inputElement, 'keyup', this.keyupHandler);
         if (this.showClearButton && this.inputWrapper.clearButton) {
             EventHandler.remove(this.inputWrapper.clearButton, 'mousedown touchstart', this.resetHandler);
         }
@@ -5828,7 +5841,9 @@ let DateRangePicker = class DateRangePicker extends CalendarBase {
             this.show(null, e);
             if (!this.isMobile) {
                 if (!isNullOrUndefined(this.leftCalendar)) {
+                    this.isRangeIconClicked = false;
                     this.calendarFocus();
+                    this.isRangeIconClicked = true;
                 }
             }
             addClass([this.inputWrapper.container], [INPUTFOCUS$1]);
@@ -6990,11 +7005,16 @@ let DateRangePicker = class DateRangePicker extends CalendarBase {
         if (event) {
             leftCalendar = closest(event.target, '.' + LEFTCALENDER);
         }
-        if (event && isNullOrUndefined(leftCalendar)) {
-            rightCalendar = event && closest(event.target, '.' + RIGHTCALENDER);
+        if (!isNullOrUndefined(leftCalendar)) {
+            this.leftCalendar.children[1].firstElementChild.focus();
         }
-        if (!isNullOrUndefined(leftCalendar) || !isNullOrUndefined(rightCalendar)) {
-            this.inputWrapper.container.focus();
+        else {
+            if (event) {
+                rightCalendar = event && closest(event.target, '.' + RIGHTCALENDER);
+            }
+            if (!isNullOrUndefined(rightCalendar)) {
+                this.rightCalendar.children[1].firstElementChild.focus();
+            }
         }
         addClass([ele], SELECTED$3);
         this.calendarIconEvent();
@@ -7889,6 +7909,9 @@ let DateRangePicker = class DateRangePicker extends CalendarBase {
             this.startButton.element.classList.add(ACTIVE$1);
         }
     }
+    keyupHandler(e) {
+        this.isKeyPressed = (this.inputElement.value !== this.previousEleValue) ? true : false;
+    }
     applyFunction(eve) {
         let isValueChanged = false;
         if (eve.type !== 'touchstart') {
@@ -7914,7 +7937,10 @@ let DateRangePicker = class DateRangePicker extends CalendarBase {
             this.previousStartValue = new Date(+this.startValue);
             this.previousEndValue = new Date(+this.endValue);
             this.previousEleValue = this.inputElement.value;
-            Input.setValue(this.rangeArgs(eve).text, this.inputElement, this.floatLabelType, this.showClearButton);
+            if (!this.isKeyPressed) {
+                Input.setValue(this.rangeArgs(eve).text, this.inputElement, this.floatLabelType, this.showClearButton);
+            }
+            this.isKeyPressed = false;
             if (+this.initStartDate !== +this.startValue || +this.initEndDate !== +this.endValue) {
                 isValueChanged = true;
             }
@@ -8225,7 +8251,8 @@ let DateRangePicker = class DateRangePicker extends CalendarBase {
                     EventHandler.remove(document, 'keydown', this.popupCloseHandler);
                 }
             }, targetExitViewport: () => {
-                if (!Browser.isDevice) {
+                let popupEle = this.popupObj && this.popupObj.element;
+                if (!Browser.isDevice && popupEle && popupEle.getBoundingClientRect().height < popupEle.parentElement.getBoundingClientRect().height) {
                     this.hide();
                 }
             }
@@ -10694,7 +10721,7 @@ let TimePicker = class TimePicker extends Component {
     }
     inputHandler(event) {
         if (!this.readonly && this.enabled) {
-            if (!((event.action == 'right' || event.action == 'left' || event.action == 'tab') || ((event.action == 'home' || event.action == 'end') && !this.isPopupOpen()))) {
+            if (!((event.action == 'right' || event.action == 'left' || event.action == 'tab') || ((event.action == 'home' || event.action == 'end' || event.action == 'up' || event.action == 'down') && !this.isPopupOpen() && !this.enableMask))) {
                 event.preventDefault();
             }
             switch (event.action) {
@@ -11495,7 +11522,9 @@ let TimePicker = class TimePicker extends Component {
         this.isNavigate = true;
         this.setHover(this.selectedElement, NAVIGATION);
         this.setActiveDescendant();
-        this.selectInputText();
+        if (this.enableMask) {
+            this.selectInputText();
+        }
         if (this.isPopupOpen() && this.selectedElement !== null && (!event || event.type !== 'click')) {
             this.setScrollPosition();
         }
@@ -12835,7 +12864,7 @@ let DateTimePicker = class DateTimePicker extends DatePicker {
             if (!this.preventArgs.cancel && !this.readonly) {
                 const openAnimation = {
                     name: 'FadeIn',
-                    duration: ANIMATIONDURATION$1
+                    duration: ANIMATIONDURATION$1,
                 };
                 if (this.zIndex === 1000) {
                     this.popupObject.show(new Animation(openAnimation), this.element);