@syncfusion/ej2-inputs 26.1.41 → 26.2.4

package/dist/global/index.d.ts

@@ -1,6 +1,6 @@
 /*!
 *  filename: index.d.ts
-*  version : 26.1.41
+*  version : 26.2.4
 *  Copyright Syncfusion Inc. 2001 - 2023. 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/hotfix/26.1.35_Vol2.txt

@@ -0,0 +1 @@
+hotfix/26.1.35_Vol2

package/package.json

@@ -1,8 +1,8 @@
 {
   "_from": "@syncfusion/ej2-inputs@*",
-  "_id": "@syncfusion/ej2-inputs@26.1.40",
+  "_id": "@syncfusion/ej2-inputs@26.1.42",
   "_inBundle": false,
-  "_integrity": "sha512-KaNx6fmmtXQCaVBAO/gkzVBI6GFjrKVk2yJTT9+QGP6r94OSVNhhgqrgSfOCPU/ifrD3FoSa2NSCysPwsvefUg==",
+  "_integrity": "sha512-JYy4S63Ez0EA7tFa7yfJIwxQnE/WQVLMoj/1aIvz1/iXC5NV/lBVmr+hlKZo7jnlJHlbU7B5SZ4ZG2PN7dGPxw==",
   "_location": "/@syncfusion/ej2-inputs",
   "_phantomChildren": {},
   "_requested": {
@@ -39,8 +39,8 @@
     "/@syncfusion/ej2-schedule",
     "/@syncfusion/ej2-vue-inputs"
   ],
-  "_resolved": "https://nexus.syncfusioninternal.com/repository/ej2-hotfix-new/@syncfusion/ej2-inputs/-/ej2-inputs-26.1.40.tgz",
-  "_shasum": "212812143e561c5383ba6a4f1afb31ab106b1979",
+  "_resolved": "https://nexus.syncfusioninternal.com/repository/ej2-hotfix-new/@syncfusion/ej2-inputs/-/ej2-inputs-26.1.42.tgz",
+  "_shasum": "92adcd67cb02cd23cd33caef14aa194966eeb845",
   "_spec": "@syncfusion/ej2-inputs@*",
   "_where": "/jenkins/workspace/elease-automation_release_26.1.1/packages/included",
   "author": {
@@ -48,10 +48,10 @@
   },
   "bundleDependencies": false,
   "dependencies": {
-    "@syncfusion/ej2-base": "~26.1.37",
-    "@syncfusion/ej2-buttons": "~26.1.40",
-    "@syncfusion/ej2-popups": "~26.1.41",
-    "@syncfusion/ej2-splitbuttons": "~26.1.35"
+    "@syncfusion/ej2-base": "~26.2.4",
+    "@syncfusion/ej2-buttons": "~26.2.4",
+    "@syncfusion/ej2-popups": "~26.2.4",
+    "@syncfusion/ej2-splitbuttons": "~26.2.4"
   },
   "deprecated": false,
   "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.",
@@ -119,7 +119,7 @@
     "url": "https://github.com/syncfusion/ej2-javascript-ui-controls/tree/master/controls/inputs"
   },
   "typings": "index.d.ts",
-  "version": "26.1.41",
+  "version": "26.2.4",
   "sideEffects": false,
   "homepage": "https://www.syncfusion.com/javascript-ui-controls"
 }

package/src/textbox/textbox.js

@@ -337,7 +337,7 @@ var TextBox = /** @class */ (function (_super) {
         if (!isNullOrUndefined(closest(this.element, 'fieldset')) && closest(this.element, 'fieldset').disabled) {
             this.enabled = false;
         }
-        if (!this.element.hasAttribute('aria-labelledby') && !this.element.hasAttribute('placeholder')) {
+        if (!this.element.hasAttribute('aria-labelledby') && !this.element.hasAttribute('placeholder') && !this.element.hasAttribute('aria-label')) {
             this.element.setAttribute('aria-label', 'textbox');
         }
         this.renderComplete();

package/styles/bootstrap-dark.css

@@ -2055,7 +2055,11 @@ input.e-input,
 .e-input-group.e-input-focus input.e-input,
 .e-input-group.e-control-wrapper.e-input-focus input.e-input,
 .e-float-input.e-control-wrapper.e-input-focus input,
-.e-float-input.e-input-focus input,
+.e-float-input.e-input-focus input {
+  padding-left: 12px;
+  text-indent: 0;
+}
+
 textarea.e-input,
 .e-input-group textarea.e-input,
 .e-input-group textarea,
@@ -7361,7 +7365,7 @@ body.e-colorpicker-overflow {
   color: #767676;
 }
 .e-otpinput.e-outline .e-otp-input-field {
-  border: 2px solid #767676;
+  border: 1px solid #767676;
 }
 .e-otpinput.e-outline .e-otp-input-field, .e-otpinput.e-underlined .e-otp-input-field, .e-otpinput.e-filled .e-otp-input-field {
   border-bottom: 2px solid #767676;

package/styles/bootstrap.css

@@ -2055,7 +2055,11 @@ input.e-input,
 .e-input-group.e-input-focus input.e-input,
 .e-input-group.e-control-wrapper.e-input-focus input.e-input,
 .e-float-input.e-control-wrapper.e-input-focus input,
-.e-float-input.e-input-focus input,
+.e-float-input.e-input-focus input {
+  padding-left: 12px;
+  text-indent: 0;
+}
+
 textarea.e-input,
 .e-input-group textarea.e-input,
 .e-input-group textarea,
@@ -7343,7 +7347,7 @@ body.e-colorpicker-overflow {
   color: #ccc;
 }
 .e-otpinput.e-outline .e-otp-input-field {
-  border: 2px solid #ccc;
+  border: 1px solid #ccc;
 }
 .e-otpinput.e-outline .e-otp-input-field, .e-otpinput.e-underlined .e-otp-input-field, .e-otpinput.e-filled .e-otp-input-field {
   border-bottom: 2px solid #ccc;

package/styles/bootstrap4.css

@@ -2055,7 +2055,11 @@ input.e-input,
 .e-input-group.e-input-focus input.e-input,
 .e-input-group.e-control-wrapper.e-input-focus input.e-input,
 .e-float-input.e-control-wrapper.e-input-focus input,
-.e-float-input.e-input-focus input,
+.e-float-input.e-input-focus input {
+  padding-left: 8px;
+  text-indent: 0;
+}
+
 textarea.e-input,
 .e-input-group textarea.e-input,
 .e-input-group textarea,
@@ -7501,7 +7505,7 @@ body.e-colorpicker-overflow {
   color: #ced4da;
 }
 .e-otpinput.e-outline .e-otp-input-field {
-  border: 2px solid #ced4da;
+  border: 1px solid #ced4da;
 }
 .e-otpinput.e-outline .e-otp-input-field, .e-otpinput.e-underlined .e-otp-input-field, .e-otpinput.e-filled .e-otp-input-field {
   border-bottom: 2px solid #ced4da;

package/styles/bootstrap5-dark.css

@@ -2144,7 +2144,11 @@ input.e-input,
 .e-input-group.e-input-focus input.e-input,
 .e-input-group.e-control-wrapper.e-input-focus input.e-input,
 .e-float-input.e-control-wrapper.e-input-focus input,
-.e-float-input.e-input-focus input,
+.e-float-input.e-input-focus input {
+  padding-left: 8px;
+  text-indent: 0;
+}
+
 textarea.e-input,
 .e-input-group textarea.e-input,
 .e-input-group textarea,
@@ -7665,7 +7669,7 @@ body.e-colorpicker-overflow {
   color: #6c757d;
 }
 .e-otpinput.e-outline .e-otp-input-field {
-  border: 2px solid #6c757d;
+  border: 1px solid #6c757d;
 }
 .e-otpinput.e-outline .e-otp-input-field, .e-otpinput.e-underlined .e-otp-input-field, .e-otpinput.e-filled .e-otp-input-field {
   border-bottom: 2px solid #6c757d;

package/styles/bootstrap5.css

@@ -2144,7 +2144,11 @@ input.e-input,
 .e-input-group.e-input-focus input.e-input,
 .e-input-group.e-control-wrapper.e-input-focus input.e-input,
 .e-float-input.e-control-wrapper.e-input-focus input,
-.e-float-input.e-input-focus input,
+.e-float-input.e-input-focus input {
+  padding-left: 8px;
+  text-indent: 0;
+}
+
 textarea.e-input,
 .e-input-group textarea.e-input,
 .e-input-group textarea,
@@ -7665,7 +7669,7 @@ body.e-colorpicker-overflow {
   color: #ced4da;
 }
 .e-otpinput.e-outline .e-otp-input-field {
-  border: 2px solid #ced4da;
+  border: 1px solid #ced4da;
 }
 .e-otpinput.e-outline .e-otp-input-field, .e-otpinput.e-underlined .e-otp-input-field, .e-otpinput.e-filled .e-otp-input-field {
   border-bottom: 2px solid #ced4da;

package/styles/fabric-dark.css

@@ -2016,7 +2016,11 @@ input.e-input,
 .e-input-group.e-input-focus input.e-input,
 .e-input-group.e-control-wrapper.e-input-focus input.e-input,
 .e-float-input.e-control-wrapper.e-input-focus input,
-.e-float-input.e-input-focus input,
+.e-float-input.e-input-focus input {
+  padding-left: 10px;
+  text-indent: 0;
+}
+
 textarea.e-input,
 .e-input-group textarea.e-input,
 .e-input-group textarea,
@@ -7307,7 +7311,7 @@ body.e-colorpicker-overflow {
   color: #9a9a9a;
 }
 .e-otpinput.e-outline .e-otp-input-field {
-  border: 2px solid #9a9a9a;
+  border: 1px solid #9a9a9a;
 }
 .e-otpinput.e-outline .e-otp-input-field, .e-otpinput.e-underlined .e-otp-input-field, .e-otpinput.e-filled .e-otp-input-field {
   border-bottom: 2px solid #9a9a9a;

package/styles/fabric.css

@@ -2016,7 +2016,11 @@ input.e-input,
 .e-input-group.e-input-focus input.e-input,
 .e-input-group.e-control-wrapper.e-input-focus input.e-input,
 .e-float-input.e-control-wrapper.e-input-focus input,
-.e-float-input.e-input-focus input,
+.e-float-input.e-input-focus input {
+  padding-left: 10px;
+  text-indent: 0;
+}
+
 textarea.e-input,
 .e-input-group textarea.e-input,
 .e-input-group textarea,
@@ -7312,7 +7316,7 @@ body.e-colorpicker-overflow {
   color: #c8c8c8;
 }
 .e-otpinput.e-outline .e-otp-input-field {
-  border: 2px solid #c8c8c8;
+  border: 1px solid #c8c8c8;
 }
 .e-otpinput.e-outline .e-otp-input-field, .e-otpinput.e-underlined .e-otp-input-field, .e-otpinput.e-filled .e-otp-input-field {
   border-bottom: 2px solid #c8c8c8;

package/styles/fluent-dark.css

@@ -1985,7 +1985,11 @@ input.e-input,
 .e-input-group.e-input-focus input.e-input,
 .e-input-group.e-control-wrapper.e-input-focus input.e-input,
 .e-float-input.e-control-wrapper.e-input-focus input,
-.e-float-input.e-input-focus input,
+.e-float-input.e-input-focus input {
+  padding-left: 8px;
+  text-indent: 0;
+}
+
 textarea.e-input,
 .e-input-group textarea.e-input,
 .e-input-group textarea,
@@ -3922,9 +3926,11 @@ textarea.e-input::selection,
 
 .e-input-group.e-input-focus:not(.e-success):not(.e-warning):not(.e-error),
 .e-input-group.e-control-wrapper.e-input-focus:not(.e-success):not(.e-warning):not(.e-error) {
+  border-color: #0078d4;
   border-color: #0078d4;
   border-radius: 2px;
-  border-width: 2px;
+  -webkit-box-shadow: 0 0 0 1px #0078d4;
+          box-shadow: 0 0 0 1px #0078d4;
 }
 
 .e-input-group.e-input-focus:not(.e-error):not(.e-warning).e-success,
@@ -7457,7 +7463,7 @@ body.e-colorpicker-overflow {
   color: #a19f9d;
 }
 .e-otpinput.e-outline .e-otp-input-field {
-  border: 2px solid #a19f9d;
+  border: 1px solid #a19f9d;
 }
 .e-otpinput.e-outline .e-otp-input-field, .e-otpinput.e-underlined .e-otp-input-field, .e-otpinput.e-filled .e-otp-input-field {
   border-bottom: 2px solid #a19f9d;

package/styles/fluent.css

@@ -1985,7 +1985,11 @@ input.e-input,
 .e-input-group.e-input-focus input.e-input,
 .e-input-group.e-control-wrapper.e-input-focus input.e-input,
 .e-float-input.e-control-wrapper.e-input-focus input,
-.e-float-input.e-input-focus input,
+.e-float-input.e-input-focus input {
+  padding-left: 8px;
+  text-indent: 0;
+}
+
 textarea.e-input,
 .e-input-group textarea.e-input,
 .e-input-group textarea,
@@ -3922,9 +3926,11 @@ textarea.e-input::selection,
 
 .e-input-group.e-input-focus:not(.e-success):not(.e-warning):not(.e-error),
 .e-input-group.e-control-wrapper.e-input-focus:not(.e-success):not(.e-warning):not(.e-error) {
+  border-color: #0078d4;
   border-color: #0078d4;
   border-radius: 2px;
-  border-width: 2px;
+  -webkit-box-shadow: 0 0 0 1px #0078d4;
+          box-shadow: 0 0 0 1px #0078d4;
 }
 
 .e-input-group.e-input-focus:not(.e-error):not(.e-warning).e-success,
@@ -7457,7 +7463,7 @@ body.e-colorpicker-overflow {
   color: #605e5c;
 }
 .e-otpinput.e-outline .e-otp-input-field {
-  border: 2px solid #605e5c;
+  border: 1px solid #605e5c;
 }
 .e-otpinput.e-outline .e-otp-input-field, .e-otpinput.e-underlined .e-otp-input-field, .e-otpinput.e-filled .e-otp-input-field {
   border-bottom: 2px solid #605e5c;

package/styles/fluent2.css

@@ -3538,7 +3538,11 @@ input.e-input,
 .e-input-group.e-input-focus input.e-input,
 .e-input-group.e-control-wrapper.e-input-focus input.e-input,
 .e-float-input.e-control-wrapper.e-input-focus input,
-.e-float-input.e-input-focus input,
+.e-float-input.e-input-focus input {
+  padding-left: 8px;
+  text-indent: 0;
+}
+
 textarea.e-input,
 .e-input-group textarea.e-input,
 .e-input-group textarea,
@@ -3552,7 +3556,7 @@ textarea.e-input,
 .e-input-group.e-control-wrapper textarea.e-input:focus,
 .e-float-input.e-control-wrapper textarea:focus,
 .e-float-input textarea:focus {
-  padding-left: 8px;
+  padding-left: 12px;
   text-indent: 0;
 }
 
@@ -3874,7 +3878,7 @@ textarea.e-input.e-bigger,
 .e-bigger .e-input-group.e-control-wrapper textarea.e-input:focus,
 .e-bigger .e-float-input.e-control-wrapper textarea:focus,
 .e-bigger .e-float-input textarea:focus {
-  padding-left: 7px;
+  padding: 6px 12px 6px 16px;
   text-indent: 0;
 }
 
@@ -4555,18 +4559,18 @@ textarea.e-input.e-bigger.e-small,
   min-height: 22px;
 }
 
-.e-input-group:hover:not(.e-disabled):not(.e-float-icon-left),
-.e-input-group.e-control-wrapper:hover:not(.e-disabled):not(.e-float-icon-left),
-.e-float-input:hover:not(.e-disabled):not(.e-float-icon-left),
-.e-float-input:hover:not(.e-input-group):not(.e-disabled) input:not([disabled]),
-.e-float-input:hover:not(.e-input-group):not(.e-disabled) textarea:not([disabled]),
-.e-float-input:hover:not(.e-input-group):not(.e-disabled) input:not([disabled]),
-.e-float-input:hover:not(.e-input-group):not(.e-disabled) textarea:not([disabled]),
-.e-float-input.e-control-wrapper:hover:not(.e-disabled):not(.e-float-icon-left),
-.e-float-input.e-control-wrapper:hover:not(.e-input-group):not(.e-disabled) input:not([disabled]),
-.e-float-input.e-control-wrapper:hover:not(.e-input-group):not(.e-disabled) textarea:not([disabled]),
-.e-float-input.e-control-wrapper:hover:not(.e-input-group):not(.e-disabled) input:not([disabled]),
-.e-float-input.e-control-wrapper:hover:not(.e-input-group):not(.e-disabled) textarea:not([disabled]) {
+.e-input-group:hover:not(.e-disabled):not(.e-success):not(.e-warning):not(.e-error):not(.e-float-icon-left),
+.e-input-group.e-control-wrapper:hover:not(.e-disabled):not(.e-success):not(.e-warning):not(.e-error):not(.e-float-icon-left),
+.e-float-input:hover:not(.e-disabled):not(.e-success):not(.e-warning):not(.e-error):not(.e-float-icon-left),
+.e-float-input:hover:not(.e-input-group):not(.e-disabled):not(.e-success):not(.e-warning):not(.e-error) input:not([disabled]),
+.e-float-input:hover:not(.e-input-group):not(.e-disabled):not(.e-success):not(.e-warning):not(.e-error) textarea:not([disabled]),
+.e-float-input:hover:not(.e-input-group):not(.e-disabled):not(.e-success):not(.e-warning):not(.e-error) input:not([disabled]),
+.e-float-input:hover:not(.e-input-group):not(.e-disabled):not(.e-success):not(.e-warning):not(.e-error) textarea:not([disabled]),
+.e-float-input.e-control-wrapper:hover:not(.e-disabled):not(.e-success):not(.e-warning):not(.e-error):not(.e-float-icon-left),
+.e-float-input.e-control-wrapper:hover:not(.e-input-group):not(.e-disabled):not(.e-success):not(.e-warning):not(.e-error) input:not([disabled]),
+.e-float-input.e-control-wrapper:hover:not(.e-input-group):not(.e-disabled):not(.e-success):not(.e-warning):not(.e-error) textarea:not([disabled]),
+.e-float-input.e-control-wrapper:hover:not(.e-input-group):not(.e-disabled):not(.e-success):not(.e-warning):not(.e-error) input:not([disabled]),
+.e-float-input.e-control-wrapper:hover:not(.e-input-group):not(.e-disabled):not(.e-success):not(.e-warning):not(.e-error) textarea:not([disabled]) {
   border-bottom-width: 1px;
   border-color: var(--color-sf-border-dark);
 }
@@ -8413,7 +8417,7 @@ textarea.e-input::selection,
   border-color: var(--color-sf-border-alt);
 }
 
-.e-bigger .e-input:focus:not(.e-success):not(.e-warning):not(.e-error) {
+.e-bigger .e-input:focus:not(.e-success):not(.e-warning):not(.e-error):not(.e-textarea) {
   padding-bottom: 0;
 }
 
@@ -8429,6 +8433,16 @@ textarea.e-input::selection,
   border-bottom-width: 2px;
 }
 
+textarea.e-input:focus:not(.e-success):not(.e-warning):not(.e-error) {
+  border-bottom-color: var(--color-sf-primary);
+  padding-bottom: 4px;
+  border-bottom-width: 0;
+}
+
+.e-bigger textarea.e-input:focus:not(.e-success):not(.e-warning):not(.e-error) {
+  padding-bottom: 6px;
+}
+
 .e-input-group:not(.e-success):not(.e-warning):not(.e-error) input.e-input:focus,
 .e-input-group.e-control-wrapper:not(.e-success):not(.e-warning):not(.e-error) input.e-input:focus,
 .e-input-group:not(.e-success):not(.e-warning):not(.e-error).e-input-focus input.e-input,
@@ -13340,7 +13354,7 @@ body.e-colorpicker-overflow {
   color: var(--color-sf-border);
 }
 .e-otpinput.e-outline .e-otp-input-field {
-  border: 2px solid var(--color-sf-border);
+  border: 1px solid var(--color-sf-border);
 }
 .e-otpinput.e-outline .e-otp-input-field, .e-otpinput.e-underlined .e-otp-input-field, .e-otpinput.e-filled .e-otp-input-field {
   border-bottom: 2px solid var(--color-sf-border-alt);

package/styles/highcontrast-light.css

@@ -2082,7 +2082,11 @@ input.e-input,
 .e-input-group.e-input-focus input.e-input,
 .e-input-group.e-control-wrapper.e-input-focus input.e-input,
 .e-float-input.e-control-wrapper.e-input-focus input,
-.e-float-input.e-input-focus input,
+.e-float-input.e-input-focus input {
+  padding-left: 10px;
+  text-indent: 0;
+}
+
 textarea.e-input,
 .e-input-group textarea.e-input,
 .e-input-group textarea,
@@ -7516,7 +7520,7 @@ body.e-colorpicker-overflow {
   color: rgb(121, 116, 126);
 }
 .e-otpinput.e-outline .e-otp-input-field {
-  border: 2px solid rgb(121, 116, 126);
+  border: 1px solid rgb(121, 116, 126);
 }
 .e-otpinput.e-outline .e-otp-input-field, .e-otpinput.e-underlined .e-otp-input-field, .e-otpinput.e-filled .e-otp-input-field {
   border-bottom: 2px solid rgb(121, 116, 126);

package/styles/highcontrast.css

@@ -2082,7 +2082,11 @@ input.e-input,
 .e-input-group.e-input-focus input.e-input,
 .e-input-group.e-control-wrapper.e-input-focus input.e-input,
 .e-float-input.e-control-wrapper.e-input-focus input,
-.e-float-input.e-input-focus input,
+.e-float-input.e-input-focus input {
+  padding-left: 10px;
+  text-indent: 0;
+}
+
 textarea.e-input,
 .e-input-group textarea.e-input,
 .e-input-group textarea,
@@ -7516,7 +7520,7 @@ body.e-colorpicker-overflow {
   color: #fff;
 }
 .e-otpinput.e-outline .e-otp-input-field {
-  border: 2px solid #fff;
+  border: 1px solid #fff;
 }
 .e-otpinput.e-outline .e-otp-input-field, .e-otpinput.e-underlined .e-otp-input-field, .e-otpinput.e-filled .e-otp-input-field {
   border-bottom: 2px solid #fff;

package/styles/input/_layout.scss

@@ -2975,7 +2975,11 @@
   .e-input-group.e-input-focus input.e-input,
   .e-input-group.e-control-wrapper.e-input-focus input.e-input,
   .e-float-input.e-control-wrapper.e-input-focus input,
-  .e-float-input.e-input-focus input,
+  .e-float-input.e-input-focus input {
+    padding-left: $input-text-indent;
+    text-indent: 0;
+  }
+
   textarea.e-input#{$css},
   .e-input-group textarea.e-input,
   .e-input-group textarea,
@@ -2989,7 +2993,12 @@
   .e-input-group.e-control-wrapper textarea.e-input:focus,
   .e-float-input.e-control-wrapper textarea:focus,
   .e-float-input textarea:focus {
-    padding-left: $input-text-indent;
+    @if $input-skin-name == 'fluent2' {
+      padding-left: 12px;
+    }
+    @else {
+      padding-left: $input-text-indent;
+    }
     text-indent: 0;
   }
 
@@ -3316,7 +3325,12 @@
   .e-bigger .e-input-group.e-control-wrapper textarea.e-input:focus,
   .e-bigger .e-float-input.e-control-wrapper textarea:focus,
   .e-bigger .e-float-input textarea:focus {
-    padding-left: $input-bigger-text-indent;
+    @if $input-skin-name == 'fluent2' {
+      padding: $textarea-bigger-padding;
+    }
+    @else {
+      padding-left: $input-bigger-text-indent;
+    }
     text-indent: 0;
   }
 
@@ -4216,18 +4230,18 @@
     }
   }
 
-  .e-input-group:hover:not(.e-disabled):not(.e-float-icon-left),
-  .e-input-group.e-control-wrapper:hover:not(.e-disabled):not(.e-float-icon-left),
-  .e-float-input:hover:not(.e-disabled):not(.e-float-icon-left),
-  .e-float-input:hover:not(.e-input-group):not(.e-disabled) input:not([disabled]),
-  .e-float-input:hover:not(.e-input-group):not(.e-disabled) textarea:not([disabled]),
-  .e-float-input:hover:not(.e-input-group):not(.e-disabled) input:not([disabled]),
-  .e-float-input:hover:not(.e-input-group):not(.e-disabled) textarea:not([disabled]),
-  .e-float-input.e-control-wrapper:hover:not(.e-disabled):not(.e-float-icon-left),
-  .e-float-input.e-control-wrapper:hover:not(.e-input-group):not(.e-disabled) input:not([disabled]),
-  .e-float-input.e-control-wrapper:hover:not(.e-input-group):not(.e-disabled) textarea:not([disabled]),
-  .e-float-input.e-control-wrapper:hover:not(.e-input-group):not(.e-disabled) input:not([disabled]),
-  .e-float-input.e-control-wrapper:hover:not(.e-input-group):not(.e-disabled) textarea:not([disabled]) {
+  .e-input-group:hover:not(.e-disabled):not(.e-success):not(.e-warning):not(.e-error):not(.e-float-icon-left),
+  .e-input-group.e-control-wrapper:hover:not(.e-disabled):not(.e-success):not(.e-warning):not(.e-error):not(.e-float-icon-left),
+  .e-float-input:hover:not(.e-disabled):not(.e-success):not(.e-warning):not(.e-error):not(.e-float-icon-left),
+  .e-float-input:hover:not(.e-input-group):not(.e-disabled):not(.e-success):not(.e-warning):not(.e-error) input:not([disabled]),
+  .e-float-input:hover:not(.e-input-group):not(.e-disabled):not(.e-success):not(.e-warning):not(.e-error) textarea:not([disabled]),
+  .e-float-input:hover:not(.e-input-group):not(.e-disabled):not(.e-success):not(.e-warning):not(.e-error) input:not([disabled]),
+  .e-float-input:hover:not(.e-input-group):not(.e-disabled):not(.e-success):not(.e-warning):not(.e-error) textarea:not([disabled]),
+  .e-float-input.e-control-wrapper:hover:not(.e-disabled):not(.e-success):not(.e-warning):not(.e-error):not(.e-float-icon-left),
+  .e-float-input.e-control-wrapper:hover:not(.e-input-group):not(.e-disabled):not(.e-success):not(.e-warning):not(.e-error) input:not([disabled]),
+  .e-float-input.e-control-wrapper:hover:not(.e-input-group):not(.e-disabled):not(.e-success):not(.e-warning):not(.e-error) textarea:not([disabled]),
+  .e-float-input.e-control-wrapper:hover:not(.e-input-group):not(.e-disabled):not(.e-success):not(.e-warning):not(.e-error) input:not([disabled]),
+  .e-float-input.e-control-wrapper:hover:not(.e-input-group):not(.e-disabled):not(.e-success):not(.e-warning):not(.e-error) textarea:not([disabled]) {
     @if $input-skin-name == 'material' or $input-skin-name == 'Material3' {
       border-bottom-width: $input-group-border-width-hover;
     }

package/styles/input/_theme.scss

@@ -710,7 +710,7 @@
     border-color: $input-box-border-color;
   }
 
-  .e-bigger .e-input#{$css}:focus:not(.e-success):not(.e-warning):not(.e-error) {
+  .e-bigger .e-input#{$css}:focus:not(.e-success):not(.e-warning):not(.e-error):not(.e-textarea) {
     @if $input-skin-name == 'fluent2' {
       padding-bottom: 0;
     }
@@ -745,6 +745,20 @@
     }
   }
 
+  textarea.e-input#{$css}:focus:not(.e-success):not(.e-warning):not(.e-error) {
+    @if $input-skin-name == 'fluent2' {
+      border-bottom-color: $input-active-border-color;
+      padding-bottom: 4px;
+      border-bottom-width: 0;
+    }
+  }
+
+  .e-bigger textarea.e-input#{$css}:focus:not(.e-success):not(.e-warning):not(.e-error) {
+    @if $input-skin-name == 'fluent2' {
+      padding-bottom: 6px;
+    }
+  }
+
   .e-input-group .e-input#{$css}:focus:not(.e-success):not(.e-warning):not(.e-error),
   .e-input-group .e-float-input:not(.e-success):not(.e-warning):not(.e-error):not(.e-input-group) input:focus,
   .e-input-group .e-float-input:not(.e-success):not(.e-warning):not(.e-error):not(.e-input-group) textarea:focus,
@@ -860,15 +874,11 @@
     @if $input-skin-name == 'bootstrap4'  {
       transition: $input-transition-shadow;
     }
-    @if $input-skin-name == 'tailwind' or $input-skin-name == 'bootstrap5' {
+    @if $input-skin-name == 'tailwind' or $input-skin-name == 'bootstrap5' or $input-skin-name == 'FluentUI'  {
       border-color: $input-group-border-color-focus;
       border-radius: $input-groupo-focus-border-radius;
       box-shadow: $input-group-focus-box-shadow;
     }
-    @if $input-skin-name == 'FluentUI' {
-      border-radius: $input-groupo-focus-border-radius;
-      border-width: 2px;
-    }
   }
 
   .e-input-group.e-input-focus:not(.e-error):not(.e-warning).e-success,

package/styles/input/bootstrap-dark.css

@@ -2045,7 +2045,11 @@ input.e-input,
 .e-input-group.e-input-focus input.e-input,
 .e-input-group.e-control-wrapper.e-input-focus input.e-input,
 .e-float-input.e-control-wrapper.e-input-focus input,
-.e-float-input.e-input-focus input,
+.e-float-input.e-input-focus input {
+  padding-left: 12px;
+  text-indent: 0;
+}
+
 textarea.e-input,
 .e-input-group textarea.e-input,
 .e-input-group textarea,

package/styles/input/bootstrap.css

@@ -2045,7 +2045,11 @@ input.e-input,
 .e-input-group.e-input-focus input.e-input,
 .e-input-group.e-control-wrapper.e-input-focus input.e-input,
 .e-float-input.e-control-wrapper.e-input-focus input,
-.e-float-input.e-input-focus input,
+.e-float-input.e-input-focus input {
+  padding-left: 12px;
+  text-indent: 0;
+}
+
 textarea.e-input,
 .e-input-group textarea.e-input,
 .e-input-group textarea,

package/styles/input/bootstrap4.css

@@ -2045,7 +2045,11 @@ input.e-input,
 .e-input-group.e-input-focus input.e-input,
 .e-input-group.e-control-wrapper.e-input-focus input.e-input,
 .e-float-input.e-control-wrapper.e-input-focus input,
-.e-float-input.e-input-focus input,
+.e-float-input.e-input-focus input {
+  padding-left: 8px;
+  text-indent: 0;
+}
+
 textarea.e-input,
 .e-input-group textarea.e-input,
 .e-input-group textarea,

package/styles/input/bootstrap5-dark.css

@@ -2134,7 +2134,11 @@ input.e-input,
 .e-input-group.e-input-focus input.e-input,
 .e-input-group.e-control-wrapper.e-input-focus input.e-input,
 .e-float-input.e-control-wrapper.e-input-focus input,
-.e-float-input.e-input-focus input,
+.e-float-input.e-input-focus input {
+  padding-left: 8px;
+  text-indent: 0;
+}
+
 textarea.e-input,
 .e-input-group textarea.e-input,
 .e-input-group textarea,

package/styles/input/bootstrap5.css

@@ -2134,7 +2134,11 @@ input.e-input,
 .e-input-group.e-input-focus input.e-input,
 .e-input-group.e-control-wrapper.e-input-focus input.e-input,
 .e-float-input.e-control-wrapper.e-input-focus input,
-.e-float-input.e-input-focus input,
+.e-float-input.e-input-focus input {
+  padding-left: 8px;
+  text-indent: 0;
+}
+
 textarea.e-input,
 .e-input-group textarea.e-input,
 .e-input-group textarea,

package/styles/input/fabric-dark.css

@@ -2006,7 +2006,11 @@ input.e-input,
 .e-input-group.e-input-focus input.e-input,
 .e-input-group.e-control-wrapper.e-input-focus input.e-input,
 .e-float-input.e-control-wrapper.e-input-focus input,
-.e-float-input.e-input-focus input,
+.e-float-input.e-input-focus input {
+  padding-left: 10px;
+  text-indent: 0;
+}
+
 textarea.e-input,
 .e-input-group textarea.e-input,
 .e-input-group textarea,

package/styles/input/fabric.css

@@ -2006,7 +2006,11 @@ input.e-input,
 .e-input-group.e-input-focus input.e-input,
 .e-input-group.e-control-wrapper.e-input-focus input.e-input,
 .e-float-input.e-control-wrapper.e-input-focus input,
-.e-float-input.e-input-focus input,
+.e-float-input.e-input-focus input {
+  padding-left: 10px;
+  text-indent: 0;
+}
+
 textarea.e-input,
 .e-input-group textarea.e-input,
 .e-input-group textarea,