@syncfusion/ej2-inputs 31.1.23 → 31.2.4

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

@@ -1277,6 +1277,7 @@ var NumericTextBox = /** @__PURE__ @class */ (function (_super) {
             if (!isNullOrUndefined(closest(this.element, 'fieldset')) && closest(this.element, 'fieldset').disabled) {
                 this.enabled = false;
             }
+            this.updateFloatLabelOverflowWidth();
             this.renderComplete();
         }
     };
@@ -2059,6 +2060,12 @@ var NumericTextBox = /** @__PURE__ @class */ (function (_super) {
             return;
         }
         this.isFocused = true;
+        if (this.floatLabelType !== 'Never' && this.inputWrapper && this.inputWrapper.container) {
+            var label = this.inputWrapper.container.querySelector('.e-float-text');
+            if (label) {
+                label.removeAttribute('style');
+            }
+        }
         this.prevValue = this.value;
         if ((this.value || this.value === 0)) {
             var formatValue_1 = this.formatNumber();
@@ -2115,6 +2122,7 @@ var NumericTextBox = /** @__PURE__ @class */ (function (_super) {
                 EventHandler.remove(this.element, 'mousewheel DOMMouseScroll', this.mouseWheel);
             }
         }
+        this.updateFloatLabelOverflowWidth();
         var formElement = closest(this.element, 'form');
         if (formElement) {
             var element = this.element.nextElementSibling;
@@ -2477,6 +2485,24 @@ var NumericTextBox = /** @__PURE__ @class */ (function (_super) {
             detach(this.spinDown);
         }
     };
+    NumericTextBox.prototype.getRightIconsWidth = function () {
+        var container = this.inputWrapper.container;
+        var width = 0;
+        var iconSelectors = '.e-input-group-icon, .e-clear-icon';
+        var icons = container.querySelectorAll(iconSelectors);
+        for (var index = 0; index < icons.length; index++) {
+            width += icons[index].offsetWidth;
+        }
+        return width;
+    };
+    NumericTextBox.prototype.updateFloatLabelOverflowWidth = function () {
+        var container = this.inputWrapper.container;
+        var label = container.querySelector('.e-float-text-overflow') || container.querySelector('.e-float-text');
+        var calculateWidth = (container.clientWidth - this.getRightIconsWidth());
+        if (label && calculateWidth) {
+            label.style.width = calculateWidth + 'px';
+        }
+    };
     /**
      * Gets the component name
      *
@@ -2851,6 +2877,12 @@ function maskInputFocusHandler(event) {
     if (!this.isClicked) {
         triggerFocus.call(this, eventArgs, inputElement);
     }
+    if (this.floatLabelType !== 'Never' && this.inputObj && this.inputObj.container) {
+        var label = this.inputObj.container.querySelector('.e-float-text');
+        if (label) {
+            label.removeAttribute('style');
+        }
+    }
     if (this.mask) {
         if (!(!(modelValue === null || modelValue === '') || this.floatLabelType === 'Always' ||
             this.placeholder === null || this.placeholder === '')) {
@@ -2952,6 +2984,7 @@ function maskInputBlurHandler(event) {
         container: !isNullOrUndefined(this.inputObj) ? this.inputObj.container : this.inputObj
     };
     this.trigger('blur', this.blurEventArgs);
+    this.updateFloatLabelOverflowWidth();
     if (this.mask) {
         this.isFocus = false;
         if (this.placeholder && this.element.value === this.promptMask && this.floatLabelType !== 'Always') {
@@ -3883,6 +3916,7 @@ var MaskedTextBox = /** @__PURE__ @class */ (function (_super) {
             if (!this.element.hasAttribute('aria-labelledby') && !this.element.hasAttribute('placeholder') && !this.element.hasAttribute('aria-label')) {
                 this.element.setAttribute('aria-label', 'maskedtextbox');
             }
+            this.updateFloatLabelOverflowWidth();
             this.renderComplete();
         }
     };
@@ -4159,6 +4193,24 @@ var MaskedTextBox = /** @__PURE__ @class */ (function (_super) {
             removeClass([this.inputObj.container], [MASKINPUT_FOCUS]);
         }
     };
+    MaskedTextBox.prototype.getRightIconsWidth = function () {
+        var container = this.inputObj.container;
+        var width = 0;
+        var iconSelectors = '.e-input-group-icon, .e-clear-icon';
+        var icons = container.querySelectorAll(iconSelectors);
+        for (var index = 0; index < icons.length; index++) {
+            width += icons[index].offsetWidth;
+        }
+        return width;
+    };
+    MaskedTextBox.prototype.updateFloatLabelOverflowWidth = function () {
+        var container = this.inputObj.container;
+        var label = container.querySelector('.e-float-text-overflow') || container.querySelector('.e-float-text');
+        var calculateWidth = (container.clientWidth - this.getRightIconsWidth());
+        if (label && calculateWidth) {
+            label.style.width = calculateWidth + 'px';
+        }
+    };
     /**
      * Removes the component from the DOM and detaches all its related event handlers.
      * Also it maintains the initial input element from the DOM.
@@ -9516,6 +9568,12 @@ var Uploader = /** @__PURE__ @class */ (function (_super) {
         if (!this.enabled) {
             return;
         }
+        if (!this.multiple && this.getFilesData().length > 0) {
+            var selectedFile = this.getSelectedFiles(0);
+            if (selectedFile) {
+                this.remove(selectedFile, false, false, true, null);
+            }
+        }
         var targetFiles;
         /* istanbul ignore next */
         if (args.type === 'drop') {
@@ -10268,7 +10326,7 @@ var Uploader = /** @__PURE__ @class */ (function (_super) {
         var progressbarWrapper = this.createElement('span', { className: PROGRESS_WRAPPER });
         var progressBar = this.createElement('progressbar', { className: PROGRESSBAR, attrs: { value: '0', max: '100' } });
         var progressbarInnerWrapper = this.createElement('span', { className: PROGRESS_INNER_WRAPPER });
-        progressBar.setAttribute('style', 'width: 0%');
+        progressBar.style.width = '0%';
         var progressbarText = this.createElement('span', { className: PROGRESSBAR_TEXT });
         progressbarText.textContent = '0%';
         progressbarInnerWrapper.appendChild(progressBar);
@@ -10291,7 +10349,7 @@ var Uploader = /** @__PURE__ @class */ (function (_super) {
         }
     };
     Uploader.prototype.changeProgressValue = function (li, progressValue) {
-        li.querySelector('.' + PROGRESSBAR).setAttribute('style', 'width:' + progressValue);
+        li.querySelector('.' + PROGRESSBAR).style.width = progressValue;
         li.querySelector('.' + PROGRESSBAR_TEXT).textContent = progressValue;
     };
     Uploader.prototype.uploadInProgress = function (e, files, customUI, request) {
@@ -14968,6 +15026,7 @@ var TextArea = /** @__PURE__ @class */ (function (_super) {
         this.element.defaultValue = this.element.value;
         Input.setWidth(this.width, this.textareaWrapper.container);
         this.setWrapperWidth();
+        this.updateFloatLabelOverflowWidth();
         this.renderComplete();
     };
     TextArea.prototype.getModuleName = function () {
@@ -15075,6 +15134,12 @@ var TextArea = /** @__PURE__ @class */ (function (_super) {
             event: args,
             value: this.value
         };
+        if (this.floatLabelType !== 'Never' && this.textareaWrapper && this.textareaWrapper.container) {
+            var label = this.textareaWrapper.container.querySelector('.e-float-text');
+            if (label) {
+                label.removeAttribute('style');
+            }
+        }
         this.trigger('focus', eventArgs);
     };
     TextArea.prototype.focusOutHandler = function (args) {
@@ -15087,6 +15152,7 @@ var TextArea = /** @__PURE__ @class */ (function (_super) {
             event: args,
             value: this.value
         };
+        this.updateFloatLabelOverflowWidth();
         this.trigger('blur', eventArgs);
     };
     TextArea.prototype.keydownHandler = function (args) {
@@ -15334,6 +15400,24 @@ var TextArea = /** @__PURE__ @class */ (function (_super) {
     TextArea.prototype.getCurrentResizeClass = function (resizeMode) {
         return resizeMode === 'None' ? RESIZE_NONE : (resizeMode === 'Both' ? RESIZE_XY : resizeMode === 'Horizontal' ? RESIZE_X : RESIZE_Y);
     };
+    TextArea.prototype.getRightIconsWidth = function () {
+        var container = this.textareaWrapper.container;
+        var width = 0;
+        var iconSelectors = '.e-input-group-icon, .e-clear-icon';
+        var icons = container.querySelectorAll(iconSelectors);
+        for (var index = 0; index < icons.length; index++) {
+            width += icons[index].offsetWidth;
+        }
+        return width;
+    };
+    TextArea.prototype.updateFloatLabelOverflowWidth = function () {
+        var container = this.textareaWrapper.container;
+        var label = container.querySelector('.e-float-text-overflow') || container.querySelector('.e-float-text');
+        var calculateWidth = (container.clientWidth - this.getRightIconsWidth());
+        if (label && calculateWidth) {
+            label.style.width = calculateWidth + 'px';
+        }
+    };
     __decorate$7([
         Property(false)
     ], TextArea.prototype, "readonly", void 0);