@syncfusion/ej2-inputs 23.2.4 → 24.1.45

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

@@ -29,7 +29,6 @@ var Input;
 (function (Input) {
     let floatType;
     let isBindClearAction = true;
-    let floatLabelElement;
     /**
      * Create a wrapper to input element with multiple span elements and set the basic properties to input based components.
      * ```
@@ -177,7 +176,7 @@ var Input;
             inputObject.container.classList.add(CLASSNAMES.FLOATINPUT);
         }
         const floatLinelement = makeElement('span', { className: CLASSNAMES.FLOATLINE });
-        floatLabelElement = makeElement('label', { className: CLASSNAMES.FLOATTEXT });
+        const floatLabelElement = makeElement('label', { className: CLASSNAMES.FLOATTEXT });
         if (!isNullOrUndefined(args.element.id) && args.element.id !== '') {
             floatLabelElement.id = 'label_' + args.element.id.replace(/ /g, '_');
             attributes(args.element, { 'aria-labelledby': floatLabelElement.id });
@@ -214,11 +213,11 @@ var Input;
         if (args.floatLabelType === 'Auto') {
             // eslint-disable-next-line @typescript-eslint/no-unused-vars
             args.element.addEventListener('input', (event) => {
-                updateLabelState(args.element.value, floatLabelElement, args.element);
+                validateLabel(args.element, args.floatLabelType);
             });
             // eslint-disable-next-line @typescript-eslint/no-unused-vars
             args.element.addEventListener('blur', (event) => {
-                updateLabelState(args.element.value, floatLabelElement);
+                validateLabel(args.element, args.floatLabelType);
             });
         }
         if (!isNullOrUndefined(args.element.getAttribute('id'))) {
@@ -344,7 +343,6 @@ var Input;
     }
     Input.wireClearBtnEvents = wireClearBtnEvents;
     function destroy() {
-        floatLabelElement = null;
         
     }
     Input.destroy = destroy;
@@ -1405,6 +1403,7 @@ let NumericTextBox = class NumericTextBox extends Component {
         this.updateValue(parsedInput, event);
     }
     raiseChangeEvent(event) {
+        this.inputValue = (isNullOrUndefined(this.inputValue) || isNaN(this.inputValue)) ? null : this.inputValue;
         if (this.prevValue !== this.value || this.prevValue !== this.inputValue) {
             const eventArgs = {};
             this.changeEventArgs = { value: this.value, previousValue: this.prevValue, isInteracted: this.isInteract,
@@ -11822,6 +11821,7 @@ let ColorPicker = class ColorPicker extends Component {
             opensOn: 'Custom',
             showTipPointer: false,
             cssClass: 'e-color-picker-tooltip',
+            htmlAttributes: { title: 'tooltip' },
             beforeOpen: (args) => {
                 this.tooltipEle = args.element;
             },
@@ -11831,6 +11831,7 @@ let ColorPicker = class ColorPicker extends Component {
         tooltip.appendTo(this.container);
         tooltip.open(this.container);
         this.tooltipEle.style.zIndex = getZindexPartial(this.tooltipEle).toString();
+        this.tooltipEle.setAttribute('aria-label', 'colorpicker-tooltip');
         select('.e-tip-content', this.tooltipEle).appendChild(this.createElement('div', { className: 'e-tip-transparent' }));
     }
     getTooltipInst() {
@@ -12238,9 +12239,26 @@ let ColorPicker = class ColorPicker extends Component {
         this.firstPaletteFocus();
         this.createInput();
         this.refreshPopupPos();
+        //for image editor popup position refreshing
+        if (this.element.parentElement && this.element.parentElement.parentElement && this.element.parentElement.parentElement.classList.contains('e-ie-ddb-popup')) {
+            this.refreshImageEditorPopupPos();
+        }
+        
         this.wireEvents();
         this.trigger('onModeSwitch', { element: this.container, mode: 'Palette' });
     }
+    //for image editor popup position refreshing
+    refreshImageEditorPopupPos() {
+        if (Browser.isDevice) {
+            const popupEle = this.getPopupEle();
+            popupEle.style.left = formatUnit(0 + pageXOffset);
+            popupEle.style.top = formatUnit(0 + pageYOffset);
+            const btnElem = document.querySelector(`#${this.element.parentElement.parentElement.id.split('-popup')[0]}`);
+            if (btnElem) {
+                popupEle.parentElement.ej2_instances[0].refreshPosition(btnElem);
+            }
+        }
+    }
     refreshPopupPos() {
         if (!this.inline) {
             const popupEle = this.getPopupEle();
@@ -12361,6 +12379,11 @@ let ColorPicker = class ColorPicker extends Component {
         this.getDragHandler().focus();
         this.createInput();
         this.refreshPopupPos();
+        //for image editor popup position refreshing
+        if (this.element.parentElement && this.element.parentElement.parentElement && this.element.parentElement.parentElement.classList.contains('e-ie-ddb-popup')) {
+            this.refreshImageEditorPopupPos();
+        }
+        
         this.wireEvents();
         this.trigger('onModeSwitch', { element: this.container, mode: 'Picker' });
     }
@@ -12373,6 +12396,10 @@ let ColorPicker = class ColorPicker extends Component {
             this.closePopup(e);
             this.splitBtn.element.focus();
         }
+        else if (ele.classList.contains(CANCEL)) {
+            const beforeCloseArgs = { element: this.container, event: e, cancel: false };
+            this.trigger('beforeClose', beforeCloseArgs);
+        }
     }
     paletteKeyDown(e) {
         const target = e.target;
@@ -13938,7 +13965,6 @@ class SignatureBase extends Component {
             this.element.height = this.element.offsetHeight;
             this.element.width = this.element.offsetWidth;
         }
-        this.canvasContext.scale(1, 1);
         this.canvasContext.fillStyle = this.strokeColor;
         this.tempCanvas = this.createElement('canvas', { className: 'e-' + this.getModuleName() + '-temp' });
         this.tempContext = this.tempCanvas.getContext('2d');
@@ -15082,6 +15108,7 @@ let Rating = class Rating extends Component {
             space: 'space'
         };
         this.tooltipOpen = false;
+        this.isTouchSelected = false;
     }
     render() {
         this.initialize();
@@ -15143,6 +15170,11 @@ let Rating = class Rating extends Component {
         EventHandler.add(this.ratingItemList, Browser.touchEndEvent, this.touchEndHandler, this);
     }
     touchMoveHandler(e) {
+        if (!this.isTouchSelected) {
+            this.wrapper.classList.add("e-rating-touch");
+            this.isTouchSelected = true;
+        }
+        this.wrapper.classList.add("e-touch-select");
         const rect = this.ratingItemList.getBoundingClientRect();
         const x = e.touches[0].clientX - rect.x;
         let currValue = (x / rect.width) * this.itemsCount;
@@ -15173,6 +15205,7 @@ let Rating = class Rating extends Component {
     }
     touchEndHandler() {
         this.closeRatingTooltip();
+        this.wrapper.classList.remove("e-touch-select");
     }
     updateTemplateFunction() {
         this.emptyTemplateFunction = this.emptyTemplate ? this.getTemplateString(this.emptyTemplate) : null;
@@ -15447,6 +15480,10 @@ let Rating = class Rating extends Component {
         this.trigger('valueChanged', eventArgs);
     }
     mouseMoveHandler(index, e) {
+        if (this.isTouchSelected) {
+            this.wrapper.classList.remove("e-rating-touch");
+            this.isTouchSelected = false;
+        }
         let currValue = this.calculateCurrentValue(index, e);
         currValue = this.validateValue(currValue);
         const element = this.itemElements[parseInt((index - 1).toString(), 10)];