@syncfusion/ej2-inputs 20.4.42 → 20.4.51

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

@@ -424,8 +424,8 @@ var Input;
      * @param {any} element - Input element which is need to add.
      * @param {HTMLElement} container - The parent element which is need to get the label span to calculate width
      */
-    function calculateWidth(element, container) {
-        let elementWidth = element.clientWidth - parseInt(getComputedStyle(element, null).getPropertyValue('padding-left'));
+    function calculateWidth(element, container, moduleName) {
+        let elementWidth = moduleName === 'multiselect' ? element : element.clientWidth - parseInt(getComputedStyle(element, null).getPropertyValue('padding-left'));
         if (!isNullOrUndefined(container.getElementsByClassName('e-float-text-content')[0])) {
             if (container.getElementsByClassName('e-float-text-content')[0].classList.contains('e-float-text-overflow')) {
                 container.getElementsByClassName('e-float-text-content')[0].classList.remove('e-float-text-overflow');
@@ -7903,7 +7903,12 @@ let Uploader = class Uploader extends Component {
             const inputElement = this.createElement('input', { attrs: { type: 'file' } });
             let index = 0;
             for (index; index < this.element.attributes.length; index++) {
-                inputElement.setAttribute(this.element.attributes[index].nodeName, this.element.attributes[index].nodeValue);
+                if (this.element.attributes[index].nodeName !== 'id') {
+                    inputElement.setAttribute(this.element.attributes[index].nodeName, this.element.attributes[index].nodeValue);
+                }
+                else if (this.element.attributes[index].nodeName === 'id') {
+                    inputElement.setAttribute(this.element.attributes[index].nodeName, getUniqueID('uploader'));
+                }
                 inputElement.innerHTML = this.element.innerHTML;
             }
             if (!inputElement.hasAttribute('name')) {
@@ -14260,6 +14265,7 @@ class SignatureBase extends Component {
      * @returns {void}.
      */
     draw(text, fontFamily, fontSize) {
+        const args = { actionName: 'draw-text' };
         this.canvasContext.clearRect(0, 0, this.canvasContext.canvas.width, this.canvasContext.canvas.height);
         fontFamily = fontFamily || 'Arial';
         fontSize = fontSize || 30;
@@ -14269,6 +14275,7 @@ class SignatureBase extends Component {
         this.canvasContext.fillText(text, this.element.width / 2, this.element.height / 2);
         this.updateSnapCollection();
         this.isSignatureEmpty = false;
+        this.trigger('change', args);
     }
     /**
      * To load the signature with the given base 64 string, height and width.
@@ -14951,7 +14958,7 @@ let Rating = class Rating extends Component {
         if (this.showTooltip) {
             this.tooltipObj = new Tooltip({
                 target: '.e-rating-item-container', windowCollision: true,
-                opensOn: 'Custom', cssClass: 'e-rating-tooltip'
+                opensOn: 'Custom', cssClass: this.cssClass ? ('e-rating-tooltip ' + this.cssClass) : 'e-rating-tooltip'
             });
             this.tooltipObj.appendTo(this.ratingItemList);
         }
@@ -14982,14 +14989,14 @@ let Rating = class Rating extends Component {
             currentValue = 0;
         }
         else {
-            currentValue = (this.precision === PrecisionType.Full) ? Math.round(currentValue) :
+            currentValue = ((this.precision === PrecisionType.Full) || this.enableSingleSelection) ? Math.round(currentValue) :
                 (this.precision === PrecisionType.Half) ? (Math.round(currentValue * 2) / 2) :
                     (this.precision === PrecisionType.Quarter) ? (Math.round(currentValue * 4) / 4) : (Math.round(currentValue * 10) / 10);
         }
         return currentValue;
     }
     getRatingValue(value, i) {
-        return (this.enableSingleSelection && this.precision === PrecisionType.Full) ? ((value === i + 1) ? 1 : 0) :
+        return (this.enableSingleSelection) ? (((value > i) && (value <= i + 1)) ? 1 : 0) :
             (value >= i + 1) ? 1 : ((value < i) ? 0 : (value - i));
     }
     updateItemValue() {
@@ -15143,6 +15150,11 @@ let Rating = class Rating extends Component {
             this.updateResetButton();
         }
     }
+    updateValueChange(e, val, isInteracted = true) {
+        this.triggerChange(e, val, isInteracted);
+        this.updateItemValue();
+        this.updateLabel();
+    }
     triggerChange(e, val, isInteracted = true) {
         val = this.validateValue(val);
         this.currentValue = val;
@@ -15196,7 +15208,7 @@ let Rating = class Rating extends Component {
     }
     calculateCurrentValue(index, args) {
         let currentValue = index;
-        if (this.precision !== PrecisionType.Full) {
+        if (!(this.enableSingleSelection || (this.precision === PrecisionType.Full))) {
             currentValue = args.offsetX / this.itemElements[index - 1].clientWidth;
             currentValue = (this.enableRtl) ? (1 - currentValue) : currentValue;
             if (this.precision === PrecisionType.Quarter) {
@@ -15218,9 +15230,7 @@ let Rating = class Rating extends Component {
         this.resetClicked(null, false);
     }
     resetClicked(e, isInteracted = true) {
-        this.triggerChange(e, this.min, isInteracted);
-        this.updateItemValue();
-        this.updateLabel();
+        this.updateValueChange(e, this.min, isInteracted);
         this.updateResetButton();
     }
     wireKeyboardEvent() {
@@ -15260,12 +15270,11 @@ let Rating = class Rating extends Component {
     }
     handleNavigation(e, isIncrease) {
         if ((!isIncrease && (this.value > this.min)) || (isIncrease && (this.value < this.itemsCount))) {
-            let currentValue = (this.precision === PrecisionType.Full) ? 1 : (this.precision === PrecisionType.Half) ? 0.5 :
-                (this.precision === PrecisionType.Quarter) ? 0.25 : Math.round(0.1 * 10) / 10;
+            let currentValue = (this.precision === PrecisionType.Full || this.enableSingleSelection) ? 1 :
+                (this.precision === PrecisionType.Half) ? 0.5 : (this.precision === PrecisionType.Quarter) ? 0.25 :
+                    Math.round(0.1 * 10) / 10;
             currentValue = isIncrease ? this.value + currentValue : this.value - currentValue;
-            this.triggerChange(e, (currentValue));
-            this.updateItemValue();
-            this.updateLabel();
+            this.updateValueChange(e, (currentValue));
             if (this.allowReset) {
                 this.updateResetButton();
             }
@@ -15343,9 +15352,7 @@ let Rating = class Rating extends Component {
         for (const prop of Object.keys(newProp)) {
             switch (prop) {
                 case 'value':
-                    this.triggerChange(null, (this.value > this.min) ? this.value : this.min, false);
-                    this.updateItemValue();
-                    this.updateLabel();
+                    this.updateValueChange(null, (this.value > this.min) ? this.value : this.min, false);
                     break;
                 case 'min':
                     this.updateMinValue();
@@ -15377,6 +15384,9 @@ let Rating = class Rating extends Component {
                     if (newProp.cssClass) {
                         addClass([this.wrapper], newProp.cssClass.split(' '));
                     }
+                    if (this.tooltipObj) {
+                        this.tooltipObj.setProperties({ cssClass: this.cssClass ? ('e-rating-tooltip ' + this.cssClass) : 'e-rating-tooltip' });
+                    }
                     break;
                 case 'labelPosition':
                     this.updateLabelPosition();
@@ -15389,7 +15399,8 @@ let Rating = class Rating extends Component {
                     this.updateLabel();
                     break;
                 case 'enableSingleSelection':
-                    this.updateItemValue();
+                    //To validate the value against single selection and update the items, label + trigger change event if value changed
+                    this.updateValueChange(null, this.currentValue, false);
                     break;
                 case 'enableAnimation':
                     this.wrapper.classList[this.enableAnimation ? 'add' : 'remove'](ANIMATION);