@syncfusion/ej2-calendars 23.1.40 → 23.2.4

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

@@ -3346,7 +3346,7 @@ let DatePicker = class DatePicker extends Calendar {
             this.inputElement.setAttribute('aria-disabled', 'false');
             this.inputElement.setAttribute('tabindex', this.tabIndex);
         }
-        Input.addAttributes({ 'aria-label': 'select' }, this.inputWrapper.buttons[0]);
+        Input.addAttributes({ 'aria-label': 'select', 'role': 'button' }, this.inputWrapper.buttons[0]);
         addClass([this.inputWrapper.container], DATEWRAPPER);
     }
     updateInput(isDynamic = false, isBlur = false) {
@@ -3535,7 +3535,7 @@ let DatePicker = class DatePicker extends Calendar {
         }
     }
     bindEvents() {
-        EventHandler.add(this.inputWrapper.buttons[0], 'mousedown touchstart', this.dateIconHandler, this);
+        EventHandler.add(this.inputWrapper.buttons[0], 'mousedown', this.dateIconHandler, this);
         EventHandler.add(this.inputElement, 'mouseup', this.mouseUpHandler, this);
         EventHandler.add(this.inputElement, 'focus', this.inputFocusHandler, this);
         EventHandler.add(this.inputElement, 'blur', this.inputBlurHandler, this);
@@ -3584,7 +3584,7 @@ let DatePicker = class DatePicker extends Calendar {
     }
     unBindEvents() {
         if (!isNullOrUndefined(this.inputWrapper)) {
-            EventHandler.remove(this.inputWrapper.buttons[0], 'mousedown touchstart', this.dateIconHandler);
+            EventHandler.remove(this.inputWrapper.buttons[0], 'mousedown', this.dateIconHandler);
         }
         EventHandler.remove(this.inputElement, 'mouseup', this.mouseUpHandler);
         EventHandler.remove(this.inputElement, 'focus', this.inputFocusHandler);
@@ -3873,7 +3873,8 @@ let DatePicker = class DatePicker extends Calendar {
         const target = e.target;
         if (!(closest(target, '.e-datepicker.e-popup-wrapper')) && !isNullOrUndefined(this.inputWrapper)
             && !(closest(target, '.' + INPUTCONTAINER) === this.inputWrapper.container)
-            && (!target.classList.contains('e-day'))) {
+            && (!target.classList.contains('e-day'))
+            && (!target.classList.contains('e-dlg-overlay'))) {
             this.hide(e);
             this.focusOut();
         }
@@ -4455,6 +4456,11 @@ let DatePicker = class DatePicker extends Calendar {
                 }
                 EventHandler.add(document, 'mousedown touchstart', this.documentHandler, this);
             });
+            if (Browser.isDevice) {
+                var dlgOverlay = this.createElement('div', { className: 'e-dlg-overlay' });
+                dlgOverlay.style.zIndex = (this.zIndex - 1).toString();
+                this.mobilePopupWrapper.appendChild(dlgOverlay);
+            }
         }
     }
     /**
@@ -8552,7 +8558,7 @@ let DateRangePicker = class DateRangePicker extends CalendarBase {
             (!isNullOrUndefined(this.targetElement) && !(target === this.targetElement))) &&
             !(closest(target, '[id="' + this.popupWrapper.id + '"]'))
             && !(closest(target, '.' + INPUTCONTAINER$1) === this.inputWrapper.container)
-            && !(closest(target, '.e-daterangepicker.e-popup') && (!target.classList.contains('e-day')))) {
+            && !(closest(target, '.e-daterangepicker.e-popup') && (!target.classList.contains('e-day'))) && (!target.classList.contains('e-dlg-overlay'))) {
             this.preventBlur = false;
             if (this.isPopupOpen() && document.body.contains(this.popupObj.element)) {
                 this.applyFunction(e);
@@ -9204,6 +9210,11 @@ let DateRangePicker = class DateRangePicker extends CalendarBase {
                         this.isMobile || Browser.isDevice);
                     }
                 });
+                if (Browser.isDevice) {
+                    var dlgOverlay = this.createElement('div', { className: 'e-dlg-overlay' });
+                    dlgOverlay.style.zIndex = (this.zIndex - 1).toString();
+                    this.mobileRangePopupWrap.appendChild(dlgOverlay);
+                }
             }
         }
     }
@@ -11735,7 +11746,8 @@ let TimePicker = class TimePicker extends Component {
         if (!(closest(target, '[id="' + this.popupObj.element.id + '"]')) && target !== this.inputElement
             && target !== (this.inputWrapper && this.inputWrapper.buttons[0]) &&
             target !== (this.inputWrapper && this.inputWrapper.clearButton) &&
-            target !== (this.inputWrapper && this.inputWrapper.container)) {
+            target !== (this.inputWrapper && this.inputWrapper.container)
+            && (!target.classList.contains('e-dlg-overlay'))) {
             if (this.isPopupOpen()) {
                 this.hide();
                 this.focusOut();
@@ -11947,6 +11959,11 @@ let TimePicker = class TimePicker extends Component {
                     this.popupObj = null;
                 }
             });
+            if (Browser.isDevice) {
+                var dlgOverlay = this.createElement('div', { className: 'e-dlg-overlay' });
+                dlgOverlay.style.zIndex = (this.zIndex - 1).toString();
+                this.mobileTimePopupWrap.appendChild(dlgOverlay);
+            }
         }
     }
     /* eslint-enable valid-jsdoc, jsdoc/require-param */
@@ -12858,6 +12875,11 @@ let DateTimePicker = class DateTimePicker extends DatePicker {
                 if (Browser.isDevice && this.fullScreenMode) {
                     this.dateTimeWrapper.style.left = '0px';
                 }
+                if (Browser.isDevice) {
+                    var dlgOverlay = this.createElement('div', { className: 'e-dlg-overlay' });
+                    dlgOverlay.style.zIndex = (this.zIndex - 1).toString();
+                    this.timeModal.appendChild(dlgOverlay);
+                }
             }
         }
     }
@@ -12895,7 +12917,7 @@ let DateTimePicker = class DateTimePicker extends DatePicker {
             event.preventDefault();
         }
         if (!(closest(target, '[id="' + (this.popupObject && this.popupObject.element.id + '"]'))) && target !== this.inputElement
-            && target !== this.timeIcon && !isNullOrUndefined(this.inputWrapper) && target !== this.inputWrapper.container) {
+            && target !== this.timeIcon && !isNullOrUndefined(this.inputWrapper) && target !== this.inputWrapper.container && !target.classList.contains('e-dlg-overlay')) {
             if (this.isTimePopupOpen()) {
                 this.hide(event);
                 this.focusOut();