@syncfusion/ej2-inputs 33.1.44 → 33.1.49

package/dist/global/index.d.ts

@@ -1,6 +1,6 @@
 /*!
 *  filename: index.d.ts
-*  version : 33.1.44
+*  version : 33.1.49
 *  Copyright Syncfusion Inc. 2001 - 2025. All rights reserved.
 *  Use of this code is subject to the terms of our license.
 *  A copy of the current license can be obtained at any time by e-mailing

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@syncfusion/ej2-inputs",
-  "version": "33.1.44",
+  "version": "33.1.49",
   "description": "A package of Essential JS 2 input components such as Textbox, Color-picker, Masked-textbox, Numeric-textbox, Slider, Upload, and Form-validator that is used to get input from the users.",
   "author": "Syncfusion Inc.",
   "license": "SEE LICENSE IN license",
@@ -8,10 +8,10 @@
   "module": "./index.js",
   "es2015": "./dist/es6/ej2-inputs.es5.js",
   "dependencies": {
-    "@syncfusion/ej2-base": "~33.1.44",
-    "@syncfusion/ej2-buttons": "~33.1.44",
+    "@syncfusion/ej2-base": "~33.1.45",
+    "@syncfusion/ej2-buttons": "~33.1.49",
     "@syncfusion/ej2-popups": "~33.1.44",
-    "@syncfusion/ej2-splitbuttons": "~33.1.44"
+    "@syncfusion/ej2-splitbuttons": "~33.1.49"
   },
   "devDependencies": {},
   "keywords": [

package/src/maskedtextbox/maskedtextbox/maskedtextbox.js

@@ -327,13 +327,15 @@ var MaskedTextBox = /** @class */ (function (_super) {
             var prop = _a[_i];
             switch (prop) {
                 case 'value':
-                    setMaskValue.call(this, this.value);
-                    if (this.placeholder && !this.isFocus) {
-                        this.setMaskPlaceholder(false, false);
-                    }
-                    if (this.value === '' && oldProp.value != null) {
-                        this.element.selectionStart = 0;
-                        this.element.selectionEnd = 0;
+                    if (newProp.value !== oldProp.value) {
+                        setMaskValue.call(this, this.value);
+                        if (this.placeholder && !this.isFocus) {
+                            this.setMaskPlaceholder(false, false);
+                        }
+                        if (this.value === '' && oldProp.value != null) {
+                            this.element.selectionStart = 0;
+                            this.element.selectionEnd = 0;
+                        }
                     }
                     break;
                 case 'placeholder':
@@ -594,7 +596,9 @@ var MaskedTextBox = /** @class */ (function (_super) {
         }, this.clearButton);
         this.changeEventArgs = null;
         this.inputObj = null;
-        setValue('ej2_instances', null, this.element);
+        if (this.element.tagName === 'EJS-MASKEDTEXTBOX') {
+            setValue('ej2_instances', null, this.element);
+        }
         _super.prototype.destroy.call(this);
     };
     __decorate([

package/src/numerictextbox/numerictextbox.js

@@ -1293,7 +1293,9 @@ var NumericTextBox = /** @class */ (function (_super) {
             floatLabelType: this.floatLabelType,
             properties: this.properties
         }, this.clearButton);
-        setValue('ej2_instances', null, this.element);
+        if (this.element.tagName === 'EJS-NUMERICTEXTBOX') {
+            setValue('ej2_instances', null, this.element);
+        }
         _super.prototype.destroy.call(this);
     };
     /**

package/src/textarea/textarea.js

@@ -537,7 +537,9 @@ var TextArea = /** @class */ (function (_super) {
             properties: this.properties
         }, this.clearButton);
         this.formElement = null;
-        setValue('ej2_instances', null, this.element);
+        if (this.element.tagName === 'EJS-TEXTAREA' || this.element.tagName === 'EJS-SMARTTEXTAREA') {
+            setValue('ej2_instances', null, this.element);
+        }
         _super.prototype.destroy.call(this);
     };
     TextArea.prototype.focusHandler = function (args) {

package/src/textbox/textbox.js

@@ -145,10 +145,13 @@ var TextBox = /** @class */ (function (_super) {
                     Input.updateCssClass(newProp.cssClass, oldProp.cssClass, this.textboxWrapper.container);
                     break;
                 case 'locale':
-                    this.globalize = new Internationalization(this.locale);
-                    this.l10n.setLocale(this.locale);
-                    this.setProperties({ placeholder: this.l10n.getConstant('placeholder') }, true);
-                    Input.setPlaceholder(this.placeholder, this.respectiveElement);
+                    {
+                        this.globalize = new Internationalization(this.locale);
+                        this.l10n.setLocale(this.locale);
+                        var currentPlaceholder = (this.l10n.getConstant('placeholder') === '' ? this.placeholder : this.l10n.getConstant('placeholder'));
+                        this.setProperties({ placeholder: currentPlaceholder }, true);
+                        Input.setPlaceholder(this.placeholder, this.respectiveElement);
+                    }
                     break;
                 case 'prependTemplate':
                     this.updatePrependTemplate();
@@ -695,7 +698,9 @@ var TextBox = /** @class */ (function (_super) {
             floatLabelType: this.floatLabelType,
             properties: this.properties
         }, this.clearButton);
-        setValue('ej2_instances', null, this.element);
+        if (this.element.tagName === 'EJS-TEXTBOX') {
+            setValue('ej2_instances', null, this.element);
+        }
         _super.prototype.destroy.call(this);
     };
     /**

package/src/uploader/uploader.js

@@ -370,7 +370,12 @@ var Uploader = /** @class */ (function (_super) {
             }
         }
         if (isNullOrUndefined(this.element.getAttribute('name'))) {
-            this.element.setAttribute('name', this.element.getAttribute('id'));
+            if (!isNullOrUndefined(this.element.getAttribute('id')) && this.element.getAttribute('id') !== '') {
+                this.element.setAttribute('name', this.element.getAttribute('id'));
+            }
+            else {
+                this.element.setAttribute('name', 'UploadFiles');
+            }
         }
         if (!this.element.hasAttribute('type')) {
             this.element.setAttribute('type', 'file');
@@ -3068,7 +3073,9 @@ var Uploader = /** @class */ (function (_super) {
         this.keyboardModule = null;
         this.clearButton = null;
         this.uploadButton = null;
-        setValue('ej2_instances', null, this.element);
+        if (this.element.tagName === 'EJS-UPLOADER') {
+            setValue('ej2_instances', null, this.element);
+        }
         _super.prototype.destroy.call(this);
     };
     /**

package/styles/bootstrap5.3-lite.css

@@ -2850,8 +2850,8 @@ textarea.e-input::selection,
 .e-input-group.e-control-wrapper.e-input-focus:not(.e-success):not(.e-warning).e-error,
 .e-input-group:not(.e-disabled):active:not(.e-success):not(.e-warning).e-error,
 .e-input-group.e-control-wrapper:not(.e-disabled):active:not(.e-success):not(.e-warning).e-error {
-  -webkit-box-shadow: 0 0 0 4px rgba(from var(--color-sf-danger) r g b/0.25);
-  box-shadow: 0 0 0 4px rgba(from var(--color-sf-danger) r g b/0.25);
+  -webkit-box-shadow: 0 0 0 4px rgba(var(--color-sf-danger-shadow), 0.25);
+  box-shadow: 0 0 0 4px rgba(var(--color-sf-danger-shadow), 0.25);
 }
 
 .e-input:focus:not(.e-error):not(.e-warning).e-success,
@@ -2861,8 +2861,8 @@ textarea.e-input::selection,
 .e-float-input.e-control-wrapper:not(.e-error):not(.e-warning).e-success:not(.e-input-group) textarea:focus,
 .e-float-input:not(.e-error):not(.e-warning).e-success:not(.e-input-group).e-input-focus input,
 .e-float-input.e-control-wrapper:not(.e-error):not(.e-warning).e-success:not(.e-input-group).e-input-focus input {
-  -webkit-box-shadow: 0 0 0 4px rgba(from var(--color-sf-success) r g b/0.25);
-  box-shadow: 0 0 0 4px rgba(from var(--color-sf-success) r g b/0.25);
+  -webkit-box-shadow: 0 0 0 4px rgba(var(--color-sf-success-shadow), 0.25);
+  box-shadow: 0 0 0 4px rgba(var(--color-sf-success-shadow), 0.25);
 }
 
 .e-input:focus:not(.e-success):not(.e-error).e-warning,
@@ -2876,8 +2876,8 @@ textarea.e-input::selection,
 .e-input-group.e-control-wrapper.e-input-focus:not(.e-success):not(.e-error).e-warning,
 .e-input-group:not(.e-disabled):active:not(.e-success):not(.e-error).e-warning,
 .e-input-group.e-control-wrapper:not(.e-disabled):active:not(.e-success):not(.e-error).e-warning {
-  -webkit-box-shadow: 0 0 0 4px rgba(from var(--color-sf-warning) r g b/0.25);
-  box-shadow: 0 0 0 4px rgba(from var(--color-sf-warning) r g b/0.25);
+  -webkit-box-shadow: 0 0 0 4px rgba(var(--color-sf-warning-shadow), 0.25);
+  box-shadow: 0 0 0 4px rgba(var(--color-sf-warning-shadow), 0.25);
 }
 
 .e-input-group:not(.e-success):not(.e-warning):not(.e-error) input.e-input:focus,
@@ -2902,8 +2902,8 @@ textarea.e-input::selection,
 .e-input-group.e-control-wrapper.e-input-focus:not(.e-error):not(.e-warning).e-success,
 .e-input-group:not(.e-disabled):active:not(.e-error):not(.e-warning).e-success,
 .e-input-group.e-control-wrapper:not(.e-disabled):active:not(.e-error):not(.e-warning).e-success {
-  -webkit-box-shadow: 0 0 0 4px rgba(from var(--color-sf-success) r g b/0.25);
-  box-shadow: 0 0 0 4px rgba(from var(--color-sf-success) r g b/0.25);
+  -webkit-box-shadow: 0 0 0 4px rgba(var(--color-sf-success-shadow), 0.25);
+  box-shadow: 0 0 0 4px rgba(var(--color-sf-success-shadow), 0.25);
 }
 
 .e-input-group:not(.e-success):not(.e-warning):not(.e-error),

package/styles/bootstrap5.3.css

@@ -2850,8 +2850,8 @@ textarea.e-input::selection,
 .e-input-group.e-control-wrapper.e-input-focus:not(.e-success):not(.e-warning).e-error,
 .e-input-group:not(.e-disabled):active:not(.e-success):not(.e-warning).e-error,
 .e-input-group.e-control-wrapper:not(.e-disabled):active:not(.e-success):not(.e-warning).e-error {
-  -webkit-box-shadow: 0 0 0 4px rgba(from var(--color-sf-danger) r g b/0.25);
-  box-shadow: 0 0 0 4px rgba(from var(--color-sf-danger) r g b/0.25);
+  -webkit-box-shadow: 0 0 0 4px rgba(var(--color-sf-danger-shadow), 0.25);
+  box-shadow: 0 0 0 4px rgba(var(--color-sf-danger-shadow), 0.25);
 }
 
 .e-input:focus:not(.e-error):not(.e-warning).e-success,
@@ -2861,8 +2861,8 @@ textarea.e-input::selection,
 .e-float-input.e-control-wrapper:not(.e-error):not(.e-warning).e-success:not(.e-input-group) textarea:focus,
 .e-float-input:not(.e-error):not(.e-warning).e-success:not(.e-input-group).e-input-focus input,
 .e-float-input.e-control-wrapper:not(.e-error):not(.e-warning).e-success:not(.e-input-group).e-input-focus input {
-  -webkit-box-shadow: 0 0 0 4px rgba(from var(--color-sf-success) r g b/0.25);
-  box-shadow: 0 0 0 4px rgba(from var(--color-sf-success) r g b/0.25);
+  -webkit-box-shadow: 0 0 0 4px rgba(var(--color-sf-success-shadow), 0.25);
+  box-shadow: 0 0 0 4px rgba(var(--color-sf-success-shadow), 0.25);
 }
 
 .e-input:focus:not(.e-success):not(.e-error).e-warning,
@@ -2876,8 +2876,8 @@ textarea.e-input::selection,
 .e-input-group.e-control-wrapper.e-input-focus:not(.e-success):not(.e-error).e-warning,
 .e-input-group:not(.e-disabled):active:not(.e-success):not(.e-error).e-warning,
 .e-input-group.e-control-wrapper:not(.e-disabled):active:not(.e-success):not(.e-error).e-warning {
-  -webkit-box-shadow: 0 0 0 4px rgba(from var(--color-sf-warning) r g b/0.25);
-  box-shadow: 0 0 0 4px rgba(from var(--color-sf-warning) r g b/0.25);
+  -webkit-box-shadow: 0 0 0 4px rgba(var(--color-sf-warning-shadow), 0.25);
+  box-shadow: 0 0 0 4px rgba(var(--color-sf-warning-shadow), 0.25);
 }
 
 .e-input-group:not(.e-success):not(.e-warning):not(.e-error) input.e-input:focus,
@@ -2902,8 +2902,8 @@ textarea.e-input::selection,
 .e-input-group.e-control-wrapper.e-input-focus:not(.e-error):not(.e-warning).e-success,
 .e-input-group:not(.e-disabled):active:not(.e-error):not(.e-warning).e-success,
 .e-input-group.e-control-wrapper:not(.e-disabled):active:not(.e-error):not(.e-warning).e-success {
-  -webkit-box-shadow: 0 0 0 4px rgba(from var(--color-sf-success) r g b/0.25);
-  box-shadow: 0 0 0 4px rgba(from var(--color-sf-success) r g b/0.25);
+  -webkit-box-shadow: 0 0 0 4px rgba(var(--color-sf-success-shadow), 0.25);
+  box-shadow: 0 0 0 4px rgba(var(--color-sf-success-shadow), 0.25);
 }
 
 .e-input-group:not(.e-success):not(.e-warning):not(.e-error),

package/styles/input/_bootstrap5.3-definition.scss

@@ -193,9 +193,9 @@ $input-bigger-small-left-child-min-height: $zero-value !default;
 $input-bigger-small-left-child-min-width: $zero-value !default;
 $input-icon-inner-width: $zero-value !default;
 $input-icon-inner-height: $zero-value !default;
-$input-error-border-shadow: 0 0 0 4px rgba(from var(--color-sf-danger) r g b / .25) !default;
-$input-success-border-shadow: 0 0 0 4px rgba(from var(--color-sf-success) r g b / .25) !default;
-$input-warning-border-shadow: 0 0 0 4px rgba(from var(--color-sf-warning) r g b / .25) !default;
+$input-error-border-shadow: 0 0 0 4px rgba($danger-shadow, .25) !default;
+$input-success-border-shadow: 0 0 0 4px rgba($success-shadow, .25) !default;
+$input-warning-border-shadow: 0 0 0 4px rgba($warning-shadow, .25) !default;
 $input-group-border-shadow: $shadow-sm !default;
 
 // color

package/styles/input/bootstrap5.3.css

@@ -2672,8 +2672,8 @@ textarea.e-input::selection,
 .e-input-group.e-control-wrapper.e-input-focus:not(.e-success):not(.e-warning).e-error,
 .e-input-group:not(.e-disabled):active:not(.e-success):not(.e-warning).e-error,
 .e-input-group.e-control-wrapper:not(.e-disabled):active:not(.e-success):not(.e-warning).e-error {
-  -webkit-box-shadow: 0 0 0 4px rgba(from var(--color-sf-danger) r g b/0.25);
-  box-shadow: 0 0 0 4px rgba(from var(--color-sf-danger) r g b/0.25);
+  -webkit-box-shadow: 0 0 0 4px rgba(var(--color-sf-danger-shadow), 0.25);
+  box-shadow: 0 0 0 4px rgba(var(--color-sf-danger-shadow), 0.25);
 }
 
 .e-input:focus:not(.e-error):not(.e-warning).e-success,
@@ -2683,8 +2683,8 @@ textarea.e-input::selection,
 .e-float-input.e-control-wrapper:not(.e-error):not(.e-warning).e-success:not(.e-input-group) textarea:focus,
 .e-float-input:not(.e-error):not(.e-warning).e-success:not(.e-input-group).e-input-focus input,
 .e-float-input.e-control-wrapper:not(.e-error):not(.e-warning).e-success:not(.e-input-group).e-input-focus input {
-  -webkit-box-shadow: 0 0 0 4px rgba(from var(--color-sf-success) r g b/0.25);
-  box-shadow: 0 0 0 4px rgba(from var(--color-sf-success) r g b/0.25);
+  -webkit-box-shadow: 0 0 0 4px rgba(var(--color-sf-success-shadow), 0.25);
+  box-shadow: 0 0 0 4px rgba(var(--color-sf-success-shadow), 0.25);
 }
 
 .e-input:focus:not(.e-success):not(.e-error).e-warning,
@@ -2698,8 +2698,8 @@ textarea.e-input::selection,
 .e-input-group.e-control-wrapper.e-input-focus:not(.e-success):not(.e-error).e-warning,
 .e-input-group:not(.e-disabled):active:not(.e-success):not(.e-error).e-warning,
 .e-input-group.e-control-wrapper:not(.e-disabled):active:not(.e-success):not(.e-error).e-warning {
-  -webkit-box-shadow: 0 0 0 4px rgba(from var(--color-sf-warning) r g b/0.25);
-  box-shadow: 0 0 0 4px rgba(from var(--color-sf-warning) r g b/0.25);
+  -webkit-box-shadow: 0 0 0 4px rgba(var(--color-sf-warning-shadow), 0.25);
+  box-shadow: 0 0 0 4px rgba(var(--color-sf-warning-shadow), 0.25);
 }
 
 .e-input-group:not(.e-success):not(.e-warning):not(.e-error) input.e-input:focus,
@@ -2724,8 +2724,8 @@ textarea.e-input::selection,
 .e-input-group.e-control-wrapper.e-input-focus:not(.e-error):not(.e-warning).e-success,
 .e-input-group:not(.e-disabled):active:not(.e-error):not(.e-warning).e-success,
 .e-input-group.e-control-wrapper:not(.e-disabled):active:not(.e-error):not(.e-warning).e-success {
-  -webkit-box-shadow: 0 0 0 4px rgba(from var(--color-sf-success) r g b/0.25);
-  box-shadow: 0 0 0 4px rgba(from var(--color-sf-success) r g b/0.25);
+  -webkit-box-shadow: 0 0 0 4px rgba(var(--color-sf-success-shadow), 0.25);
+  box-shadow: 0 0 0 4px rgba(var(--color-sf-success-shadow), 0.25);
 }
 
 .e-input-group:not(.e-success):not(.e-warning):not(.e-error),