@syncfusion/ej2-inputs 30.1.37 → 30.1.40

package/dist/global/index.d.ts

@@ -1,6 +1,6 @@
 /*!
 *  filename: index.d.ts
-*  version : 30.1.37
+*  version : 30.1.40
 *  Copyright Syncfusion Inc. 2001 - 2024. 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": "30.1.37",
+  "version": "30.1.40",
   "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": "~30.1.37",
+    "@syncfusion/ej2-base": "~30.1.38",
     "@syncfusion/ej2-buttons": "~30.1.37",
-    "@syncfusion/ej2-popups": "~30.1.37",
-    "@syncfusion/ej2-splitbuttons": "~30.1.37"
+    "@syncfusion/ej2-popups": "~30.1.40",
+    "@syncfusion/ej2-splitbuttons": "~30.1.39"
   },
   "devDependencies": {},
   "keywords": [

package/src/input/input.js

@@ -493,14 +493,26 @@ export var Input;
         return container;
     }
     function encodePlaceHolder(placeholder) {
-        var result = '';
-        if (!isNullOrUndefined(placeholder) && placeholder !== '') {
-            var spanEle = document.createElement('span');
-            spanEle.innerHTML = '<input  placeholder="' + placeholder + '"/>';
-            var hiddenInput = (spanEle.children[0]);
-            result = hiddenInput.placeholder;
+        if (placeholder == null || placeholder === '') {
+            return '';
         }
-        return result;
+        var decoded = decodeHtmlEntities(placeholder);
+        return decoded;
+    }
+    function decodeHtmlEntities(str) {
+        var entityMap = {
+            '&amp;': '&',
+            // eslint-disable-next-line quotes
+            '&quot;': '"',
+            // eslint-disable-next-line quotes
+            '&#39;': "'",
+            '&lt;': '<',
+            '&gt;': '>',
+            '&eacute;': 'é' // tslint:disable-line:comma-dangle
+        };
+        // tslint:disable-next-line:typedef
+        // tslint-disable-next-line security/detect-object-injection
+        return str.replace(/&[a-zA-Z#0-9]+;/g, function (entity) { return entityMap[entity] || entity; });
     }
     /**
      * Sets the value to the input element.

package/src/numerictextbox/numerictextbox.js

@@ -674,7 +674,8 @@ var NumericTextBox = /** @class */ (function (_super) {
         /* istanbul ignore next */
         if (this.isAngular
             && this.element.value !== getValue('decimal', getNumericObject(this.locale))
-            && this.element.value !== getValue('minusSign', getNumericObject(this.locale))) {
+            && this.element.value !== getValue('minusSign', getNumericObject(this.locale))
+            && this.numericRegex().test(this.element.value)) {
             var parsedValue = this.instance.getNumberParser({ format: 'n' })(this.element.value);
             parsedValue = isNaN(parsedValue) ? null : parsedValue;
             numerictextboxObj.localChange({ value: parsedValue });

package/styles/bootstrap5.3-lite.css

@@ -2103,7 +2103,7 @@ textarea.e-input,
 .e-float-input.e-control-wrapper input[readonly],
 .e-float-input textarea[readonly],
 .e-float-input.e-control-wrapper textarea[readonly] {
-  background: var(--color-sf-content-bg-color-alt2);
+  background: var(--color-sf-content-bg-color);
   color: var(--color-sf-content-text-color);
 }
 
@@ -2112,7 +2112,7 @@ textarea.e-input,
 .e-float-input input[readonly] ~ span.e-input-group-icon,
 .e-float-input.e-control-wrapper input[readonly] ~ span.e-input-group-icon,
 .e-float-input.e-control-wrapper input[readonly] ~ span.e-clear-icon {
-  background: var(--color-sf-content-bg-color-alt2);
+  background: var(--color-sf-content-bg-color);
   color: var(--color-sf-icon-color);
 }
 

package/styles/bootstrap5.3.css

@@ -2103,7 +2103,7 @@ textarea.e-input,
 .e-float-input.e-control-wrapper input[readonly],
 .e-float-input textarea[readonly],
 .e-float-input.e-control-wrapper textarea[readonly] {
-  background: var(--color-sf-content-bg-color-alt2);
+  background: var(--color-sf-content-bg-color);
   color: var(--color-sf-content-text-color);
 }
 
@@ -2112,7 +2112,7 @@ textarea.e-input,
 .e-float-input input[readonly] ~ span.e-input-group-icon,
 .e-float-input.e-control-wrapper input[readonly] ~ span.e-input-group-icon,
 .e-float-input.e-control-wrapper input[readonly] ~ span.e-clear-icon {
-  background: var(--color-sf-content-bg-color-alt2);
+  background: var(--color-sf-content-bg-color);
   color: var(--color-sf-icon-color);
 }
 

package/styles/fluent2-lite.css

@@ -7217,16 +7217,16 @@ body.e-colorpicker-overflow {
   -webkit-text-stroke: 1px var(--color-sf-rating-selected-color);
 }
 .e-rating-container .e-rating-item-container.e-selected-value .e-rating-icon {
-  -webkit-text-stroke: 1px var(--color-sf-rating-selected-hover-color:);
+  -webkit-text-stroke: 1px var(--color-sf-rating-selected-hover-color);
 }
 .e-rating-container .e-rating-item-list:hover .e-rating-item-container.e-rating-selected .e-rating-icon, .e-rating-container .e-rating-item-list:hover .e-rating-item-container.e-rating-intermediate .e-rating-icon {
-  background: -webkit-gradient(linear, left top, right top, from(var(--color-sf-rating-selected-hover-color:)), to(transparent));
-  background: linear-gradient(to right, var(--color-sf-rating-selected-hover-color:) var(--rating-value), transparent var(--rating-value));
+  background: -webkit-gradient(linear, left top, right top, from(var(--color-sf-rating-selected-hover-color)), to(transparent));
+  background: linear-gradient(to right, var(--color-sf-rating-selected-hover-color) var(--rating-value), transparent var(--rating-value));
   background-clip: text;
   /* stylelint-disable property-no-vendor-prefix */
   -webkit-background-clip: text;
   /* stylelint-enable property-no-vendor-prefix */
-  -webkit-text-stroke: 1px var(--color-sf-rating-selected-hover-color:);
+  -webkit-text-stroke: 1px var(--color-sf-rating-selected-hover-color);
 }
 .e-rating-container .e-rating-item-list .e-rating-item-container.e-rating-selected:active .e-rating-icon, .e-rating-container .e-rating-item-list .e-rating-item-container.e-rating-intermediate:active .e-rating-icon {
   background: -webkit-gradient(linear, left top, right top, from(var(--color-sf-rating-selected-color)), to(transparent));
@@ -7246,8 +7246,8 @@ body.e-colorpicker-overflow {
   /* stylelint-enable property-no-vendor-prefix */
 }
 .e-rating-container.e-rtl .e-rating-item-list:hover .e-rating-item-container.e-rating-selected .e-rating-icon, .e-rating-container.e-rtl .e-rating-item-list:hover .e-rating-item-container.e-rating-intermediate .e-rating-icon {
-  background: -webkit-gradient(linear, right top, left top, from(var(--color-sf-rating-selected-hover-color:)), to(transparent));
-  background: linear-gradient(to left, var(--color-sf-rating-selected-hover-color:) var(--rating-value), transparent var(--rating-value));
+  background: -webkit-gradient(linear, right top, left top, from(var(--color-sf-rating-selected-hover-color)), to(transparent));
+  background: linear-gradient(to left, var(--color-sf-rating-selected-hover-color) var(--rating-value), transparent var(--rating-value));
   background-clip: text;
   /* stylelint-disable property-no-vendor-prefix */
   -webkit-background-clip: text;

package/styles/fluent2.css

@@ -12180,16 +12180,16 @@ body.e-colorpicker-overflow {
   -webkit-text-stroke: 1px var(--color-sf-rating-selected-color);
 }
 .e-rating-container .e-rating-item-container.e-selected-value .e-rating-icon {
-  -webkit-text-stroke: 1px var(--color-sf-rating-selected-hover-color:);
+  -webkit-text-stroke: 1px var(--color-sf-rating-selected-hover-color);
 }
 .e-rating-container .e-rating-item-list:hover .e-rating-item-container.e-rating-selected .e-rating-icon, .e-rating-container .e-rating-item-list:hover .e-rating-item-container.e-rating-intermediate .e-rating-icon {
-  background: -webkit-gradient(linear, left top, right top, from(var(--color-sf-rating-selected-hover-color:)), to(transparent));
-  background: linear-gradient(to right, var(--color-sf-rating-selected-hover-color:) var(--rating-value), transparent var(--rating-value));
+  background: -webkit-gradient(linear, left top, right top, from(var(--color-sf-rating-selected-hover-color)), to(transparent));
+  background: linear-gradient(to right, var(--color-sf-rating-selected-hover-color) var(--rating-value), transparent var(--rating-value));
   background-clip: text;
   /* stylelint-disable property-no-vendor-prefix */
   -webkit-background-clip: text;
   /* stylelint-enable property-no-vendor-prefix */
-  -webkit-text-stroke: 1px var(--color-sf-rating-selected-hover-color:);
+  -webkit-text-stroke: 1px var(--color-sf-rating-selected-hover-color);
 }
 .e-rating-container .e-rating-item-list .e-rating-item-container.e-rating-selected:active .e-rating-icon, .e-rating-container .e-rating-item-list .e-rating-item-container.e-rating-intermediate:active .e-rating-icon {
   background: -webkit-gradient(linear, left top, right top, from(var(--color-sf-rating-selected-color)), to(transparent));
@@ -12209,8 +12209,8 @@ body.e-colorpicker-overflow {
   /* stylelint-enable property-no-vendor-prefix */
 }
 .e-rating-container.e-rtl .e-rating-item-list:hover .e-rating-item-container.e-rating-selected .e-rating-icon, .e-rating-container.e-rtl .e-rating-item-list:hover .e-rating-item-container.e-rating-intermediate .e-rating-icon {
-  background: -webkit-gradient(linear, right top, left top, from(var(--color-sf-rating-selected-hover-color:)), to(transparent));
-  background: linear-gradient(to left, var(--color-sf-rating-selected-hover-color:) var(--rating-value), transparent var(--rating-value));
+  background: -webkit-gradient(linear, right top, left top, from(var(--color-sf-rating-selected-hover-color)), to(transparent));
+  background: linear-gradient(to left, var(--color-sf-rating-selected-hover-color) var(--rating-value), transparent var(--rating-value));
   background-clip: text;
   /* stylelint-disable property-no-vendor-prefix */
   -webkit-background-clip: text;

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

@@ -237,7 +237,7 @@ $float-label-disbale-font-color: $content-text-color-alt3 !default;
 $input-placeholder-color: $placeholder-text-color !default;
 $input-group-disabled-color: $icon-color-disabled !default;
 $input-group-hovered-color: $close-icon-color-hover !default;
-$input-readonly-bg-color: $content-bg-color-alt2 !default;
+$input-readonly-bg-color: $content-bg-color !default;
 $input-readonly-color: $content-text-color !default;
 $input-icon-shadow: inset  0 3px 5px rgba(0, 0, 0, .125) !default;
 $input-border-shadow: 0 0 0 3px rgba($primary-light, .25) !default;

package/styles/input/bootstrap5.3.css

@@ -2093,7 +2093,7 @@ textarea.e-input,
 .e-float-input.e-control-wrapper input[readonly],
 .e-float-input textarea[readonly],
 .e-float-input.e-control-wrapper textarea[readonly] {
-  background: var(--color-sf-content-bg-color-alt2);
+  background: var(--color-sf-content-bg-color);
   color: var(--color-sf-content-text-color);
 }
 
@@ -2102,7 +2102,7 @@ textarea.e-input,
 .e-float-input input[readonly] ~ span.e-input-group-icon,
 .e-float-input.e-control-wrapper input[readonly] ~ span.e-input-group-icon,
 .e-float-input.e-control-wrapper input[readonly] ~ span.e-clear-icon {
-  background: var(--color-sf-content-bg-color-alt2);
+  background: var(--color-sf-content-bg-color);
   color: var(--color-sf-icon-color);
 }
 

package/styles/rating/fluent2.css

@@ -200,16 +200,16 @@
   -webkit-text-stroke: 1px var(--color-sf-rating-selected-color);
 }
 .e-rating-container .e-rating-item-container.e-selected-value .e-rating-icon {
-  -webkit-text-stroke: 1px var(--color-sf-rating-selected-hover-color:);
+  -webkit-text-stroke: 1px var(--color-sf-rating-selected-hover-color);
 }
 .e-rating-container .e-rating-item-list:hover .e-rating-item-container.e-rating-selected .e-rating-icon, .e-rating-container .e-rating-item-list:hover .e-rating-item-container.e-rating-intermediate .e-rating-icon {
-  background: -webkit-gradient(linear, left top, right top, from(var(--color-sf-rating-selected-hover-color:)), to(transparent));
-  background: linear-gradient(to right, var(--color-sf-rating-selected-hover-color:) var(--rating-value), transparent var(--rating-value));
+  background: -webkit-gradient(linear, left top, right top, from(var(--color-sf-rating-selected-hover-color)), to(transparent));
+  background: linear-gradient(to right, var(--color-sf-rating-selected-hover-color) var(--rating-value), transparent var(--rating-value));
   background-clip: text;
   /* stylelint-disable property-no-vendor-prefix */
   -webkit-background-clip: text;
   /* stylelint-enable property-no-vendor-prefix */
-  -webkit-text-stroke: 1px var(--color-sf-rating-selected-hover-color:);
+  -webkit-text-stroke: 1px var(--color-sf-rating-selected-hover-color);
 }
 .e-rating-container .e-rating-item-list .e-rating-item-container.e-rating-selected:active .e-rating-icon, .e-rating-container .e-rating-item-list .e-rating-item-container.e-rating-intermediate:active .e-rating-icon {
   background: -webkit-gradient(linear, left top, right top, from(var(--color-sf-rating-selected-color)), to(transparent));
@@ -229,8 +229,8 @@
   /* stylelint-enable property-no-vendor-prefix */
 }
 .e-rating-container.e-rtl .e-rating-item-list:hover .e-rating-item-container.e-rating-selected .e-rating-icon, .e-rating-container.e-rtl .e-rating-item-list:hover .e-rating-item-container.e-rating-intermediate .e-rating-icon {
-  background: -webkit-gradient(linear, right top, left top, from(var(--color-sf-rating-selected-hover-color:)), to(transparent));
-  background: linear-gradient(to left, var(--color-sf-rating-selected-hover-color:) var(--rating-value), transparent var(--rating-value));
+  background: -webkit-gradient(linear, right top, left top, from(var(--color-sf-rating-selected-hover-color)), to(transparent));
+  background: linear-gradient(to left, var(--color-sf-rating-selected-hover-color) var(--rating-value), transparent var(--rating-value));
   background-clip: text;
   /* stylelint-disable property-no-vendor-prefix */
   -webkit-background-clip: text;

package/styles/slider/_tailwind3-definition.scss

@@ -14,7 +14,7 @@ $slider-tooltip-padding: 2px 4px !default;
 $tick-after-height: 6px !default;
 $tick-after-top: -10px !default;
 $largetick-before-top: -10px !default;
-$largetick-before-height: 10px !default;
+$largetick-before-height: 7px !default;
 $largetick-after-height: 10px !default;
 $largetick-after-top: 5px !default;
 $tick-before-height: 6px !default;

package/styles/slider/tailwind3.css

@@ -232,7 +232,7 @@
   top: -10px;
 }
 .e-control-wrapper.e-slider-container .e-tick-before.e-scale.e-h-scale .e-large {
-  height: 10px;
+  height: 7px;
   top: -10px;
 }
 .e-control-wrapper.e-slider-container .e-tick-before.e-scale.e-v-scale .e-tick {
@@ -240,7 +240,7 @@
   left: 5px;
 }
 .e-control-wrapper.e-slider-container .e-tick-before.e-scale.e-v-scale .e-large {
-  width: 10px;
+  width: 7px;
   left: 1px;
 }
 .e-control-wrapper.e-slider-container .e-tick-after.e-scale.e-h-scale .e-tick {

package/styles/tailwind3-lite.css

@@ -5115,7 +5115,7 @@ textarea.e-filled.e-disabled.e-input::-webkit-input-placeholder,
   top: -10px;
 }
 .e-control-wrapper.e-slider-container .e-tick-before.e-scale.e-h-scale .e-large {
-  height: 10px;
+  height: 7px;
   top: -10px;
 }
 .e-control-wrapper.e-slider-container .e-tick-before.e-scale.e-v-scale .e-tick {
@@ -5123,7 +5123,7 @@ textarea.e-filled.e-disabled.e-input::-webkit-input-placeholder,
   left: 5px;
 }
 .e-control-wrapper.e-slider-container .e-tick-before.e-scale.e-v-scale .e-large {
-  width: 10px;
+  width: 7px;
   left: 1px;
 }
 .e-control-wrapper.e-slider-container .e-tick-after.e-scale.e-h-scale .e-tick {

package/styles/tailwind3.css

@@ -9246,7 +9246,7 @@ input.e-input.e-bigger.e-small,
   top: -10px;
 }
 .e-control-wrapper.e-slider-container .e-tick-before.e-scale.e-h-scale .e-large {
-  height: 10px;
+  height: 7px;
   top: -10px;
 }
 .e-control-wrapper.e-slider-container .e-tick-before.e-scale.e-v-scale .e-tick {
@@ -9254,7 +9254,7 @@ input.e-input.e-bigger.e-small,
   left: 5px;
 }
 .e-control-wrapper.e-slider-container .e-tick-before.e-scale.e-v-scale .e-large {
-  width: 10px;
+  width: 7px;
   left: 1px;
 }
 .e-control-wrapper.e-slider-container .e-tick-after.e-scale.e-h-scale .e-tick {