@syncfusion/ej2-inputs 28.1.33 → 28.1.41

package/dist/global/index.d.ts

@@ -1,6 +1,6 @@
 /*!
 *  filename: index.d.ts
-*  version : 28.1.33
+*  version : 28.1.41
 *  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,8 +1,8 @@
 {
   "_from": "@syncfusion/ej2-inputs@*",
-  "_id": "@syncfusion/ej2-inputs@18.78.15",
+  "_id": "@syncfusion/ej2-inputs@28.1.37",
   "_inBundle": false,
-  "_integrity": "sha512-u19irYb2qOhizRbtcSy8Bgirpw6/yGNoeGoPBNv3lLSkhJuBBnKlbkmQypUc7sK2wzvweVhOhKIfa39Qbc1gzg==",
+  "_integrity": "sha512-xq5ftk/1AS5NTv7Ahsu7g3lvfo+V7VO9Hj+sXwYGAdsBPTBZTUtNU3/Ra2mD6Kz/9u1cG6s/y2Yk9KafBqaCWw==",
   "_location": "/@syncfusion/ej2-inputs",
   "_phantomChildren": {},
   "_requested": {
@@ -40,8 +40,8 @@
     "/@syncfusion/ej2-schedule",
     "/@syncfusion/ej2-vue-inputs"
   ],
-  "_resolved": "https://nexus.syncfusioninternal.com/repository/ej2-release/@syncfusion/ej2-inputs/-/ej2-inputs-18.78.15.tgz",
-  "_shasum": "4b6d3072316a9a70c761474f3f0c076356d40cb2",
+  "_resolved": "https://nexus.syncfusioninternal.com/repository/ej2-hotfix-new/@syncfusion/ej2-inputs/-/ej2-inputs-28.1.37.tgz",
+  "_shasum": "b5b652d54d2e1807a935a0b68977262115e98232",
   "_spec": "@syncfusion/ej2-inputs@*",
   "_where": "/jenkins/workspace/elease-automation_release_28.1.1/packages/included",
   "author": {
@@ -50,9 +50,9 @@
   "bundleDependencies": false,
   "dependencies": {
     "@syncfusion/ej2-base": "~28.1.33",
-    "@syncfusion/ej2-buttons": "~28.1.33",
-    "@syncfusion/ej2-popups": "~28.1.33",
-    "@syncfusion/ej2-splitbuttons": "~28.1.33"
+    "@syncfusion/ej2-buttons": "~28.1.39",
+    "@syncfusion/ej2-popups": "~28.1.39",
+    "@syncfusion/ej2-splitbuttons": "~28.1.41"
   },
   "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.",
@@ -120,7 +120,7 @@
     "url": "https://github.com/syncfusion/ej2-javascript-ui-controls/tree/master/controls/inputs"
   },
   "typings": "index.d.ts",
-  "version": "28.1.33",
+  "version": "28.1.41",
   "sideEffects": false,
   "homepage": "https://www.syncfusion.com/javascript-ui-controls"
 }

package/src/common/signature-base.d.ts

@@ -214,11 +214,13 @@ export declare abstract class SignatureBase extends Component<HTMLCanvasElement>
      */
     saveAsBlob(): Blob;
     /**
-     * To get the signature as Base 64.
+     * Gets the signature as a Base 64 string.
      *
-     * @private
-     * @param {SignatureFileType} type - Specifies the type of the image format.
-     * @returns {string}.
+     * This method is used to retrieve the current signature on the canvas as a Base 64-encoded string, in the specified image format.
+     *
+     * @param {SignatureFileType} [type] - Specifies the type of the image format.
+     * Can be one of 'Png', 'Jpeg', or 'Svg'. If not specified, the default is 'Png'.
+     * @returns {string} - Returns the Base 64 string of the signature in the specified format.
      */
     getSignature(type?: SignatureFileType): string;
     /**

package/src/common/signature-base.js

@@ -199,6 +199,7 @@ var SignatureBase = /** @class */ (function (_super) {
             this.canvasContext.canvas.width = this.element.offsetWidth;
             this.canvasContext.canvas.height = this.element.offsetHeight;
             this.canvasContext.scale(1, 1);
+            this.canvasContext.fillStyle = this.strokeColor;
             var pointSize = (this.minStrokeWidth + this.maxStrokeWidth) / 2;
             for (var i = 0; i < this.signRatioPointsColl.length; i++) {
                 this.arcDraw((this.signRatioPointsColl[i].x * this.canvasContext.canvas.width), (this.signRatioPointsColl[i].y * this.canvasContext.canvas.height), pointSize);
@@ -886,11 +887,13 @@ var SignatureBase = /** @class */ (function (_super) {
         return this.getBlob(this.canvasContext.canvas.toDataURL('image/png'));
     };
     /**
-     * To get the signature as Base 64.
+     * Gets the signature as a Base 64 string.
      *
-     * @private
-     * @param {SignatureFileType} type - Specifies the type of the image format.
-     * @returns {string}.
+     * This method is used to retrieve the current signature on the canvas as a Base 64-encoded string, in the specified image format.
+     *
+     * @param {SignatureFileType} [type] - Specifies the type of the image format.
+     * Can be one of 'Png', 'Jpeg', or 'Svg'. If not specified, the default is 'Png'.
+     * @returns {string} - Returns the Base 64 string of the signature in the specified format.
      */
     SignatureBase.prototype.getSignature = function (type) {
         if (this.saveWithBackground && this.backgroundColor && !this.backgroundImage) {

package/src/uploader/uploader.js

@@ -921,7 +921,7 @@ var Uploader = /** @class */ (function (_super) {
         }
         for (var file = 0; file < item.length; file++) {
             var pasteFile = [].slice.call(item)[file];
-            if ((pasteFile.kind === 'file') || pasteFile.type.match('^image/')) {
+            if (!isNullOrUndefined(pasteFile.getAsFile()) && ((pasteFile.kind === 'file') || pasteFile.type.match('^image/'))) {
                 this.renderSelectedFiles(event, [pasteFile.getAsFile()], false, true);
             }
         }

package/styles/color-picker/_tailwind3-definition.scss

@@ -36,11 +36,11 @@ $cpicker-bigger-slider-handle-radius: 10px !default;
 $cpicker-slider-element-height: 8px !default;
 $cpicker-slider-height: 6px !default;
 $cpicker-slider-handler-box-shadow: 0 0 0 1px rgba($black, 1) !default;
-$cpicker-slider-handle-size: 6px !default;
-$cpicker-slider-handle-top: calc(68% - 8px) !default;
+$cpicker-slider-handle-size: 10px !default;
+$cpicker-slider-handle-top: calc(68% - 10px) !default;
 $cpicker-bigger-slider-height: 12px;
-$cpicker-bigger-slider-handle-size: 6px !default;
-$cpicker-bigger-slider-handle-top: calc(76% - 9px) !default;
+$cpicker-bigger-slider-handle-size: 10px !default;
+$cpicker-bigger-slider-handle-top: calc(76% - 11px) !default;
 $cpicker-input-picker-padding: 5px 8px 14px 9px !default;
 $cpicker-input-palette-padding: 16px 16px !default;
 $cpicker-input-container: 89.8% !default;

package/styles/color-picker/tailwind3.css

@@ -258,9 +258,9 @@ body.e-colorpicker-overflow {
 .e-container .e-slider-preview .e-colorpicker-slider .e-slider-container .e-handle {
   border-radius: 10px;
   cursor: pointer;
-  height: 6px;
-  top: calc(68% - 8px);
-  width: 6px;
+  height: 10px;
+  top: calc(68% - 10px);
+  width: 10px;
 }
 .e-container .e-slider-preview .e-colorpicker-slider .e-slider-container .e-handle.e-handle-active {
   cursor: pointer;
@@ -740,9 +740,9 @@ body.e-colorpicker-overflow {
 }
 .e-bigger .e-container .e-slider-preview .e-colorpicker-slider .e-slider-container .e-handle {
   border-radius: 10px;
-  height: 6px;
-  top: calc(76% - 9px);
-  width: 6px;
+  height: 10px;
+  top: calc(76% - 11px);
+  width: 10px;
 }
 .e-bigger .e-container .e-slider-preview .e-switch-ctrl-btn .e-ctrl-btn {
   width: 90.6%;

package/styles/input/_bigger.scss

@@ -1201,9 +1201,6 @@
     @else {
       padding-left: $input-bigger-text-indent;
     }
-    @if $input-skin-name == 'tailwind3' {
-      padding-right: $input-bigger-text-indent;
-    }
     text-indent: 0;
   }
 

package/styles/input/_layout.scss

@@ -35,7 +35,7 @@
     font-family: $input-font-family;
     font-size: $input-font-size;
     font-weight: normal;
-    @if ($input-skin-name == 'tailwind') {
+    @if ($input-skin-name == 'tailwind' or $input-skin-name == 'tailwind3') {
       font-feature-settings: 'calt' 0;
     }
   }
@@ -3230,7 +3230,7 @@
   .e-outline.e-float-input.e-control-wrapper textarea,
   .e-outline.e-input-group:not(.e-float-icon-left) textarea.e-input:focus,
   .e-outline.e-input-group.e-control-wrapper:not(.e-float-icon-left) textarea.e-input:focus {
-    @if $input-skin-name == 'material' or $input-skin-name == 'Material3' or $input-skin-name == 'tailwind3'{
+    @if $input-skin-name == 'material' or $input-skin-name == 'Material3' or $input-skin-name == 'tailwind3' {
       box-sizing: border-box;
       margin: $outline-textarea-margin-top;
       padding: $zero-value $outline-input-padding-left $outline-input-padding-left;

package/styles/input/_tailwind3-definition.scss

@@ -39,7 +39,7 @@ $input-warning-focus-box-shadow: 0 0 0 1px $warning !default;
 $input-error-focus-box-shadow: 0 0 0 1px $danger !default;
 $input-group-icon-border-radius: 3px !default;
 $input-group-child-border-width: $zero-value !default;
-$input-padding: 0 8px 0 0 !default;
+$input-padding: $zero-value !default;
 $float-input-padding: $zero-value !default;
 $float-label-padding: $text-xxs !default;
 $float-input-wrap-padding-top: $zero-value !default;

package/styles/input/tailwind3.css

@@ -48,7 +48,7 @@ textarea.e-input,
   margin: 0;
   margin-bottom: 0;
   outline: none;
-  padding: 0 8px 0 0;
+  padding: 0;
   text-indent: 8px;
   width: 100%;
 }
@@ -59,9 +59,11 @@ textarea.e-input,
 .e-input-group.e-control-wrapper,
 .e-input-group.e-disabled,
 .e-input-group.e-control-wrapper.e-disabled {
-  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", arial, "Noto Sans", "Liberation Sans", sans-serif, "apple color emoji", "Segoe UI emoji", "Segoe UI Symbol", "Noto color emoji";
+  font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", arial, "Noto Sans", "Liberation Sans", sans-serif, "apple color emoji", "Segoe UI emoji", "Segoe UI Symbol", "Noto color emoji";
   font-size: 14px;
   font-weight: normal;
+  -webkit-font-feature-settings: "calt" 0;
+          font-feature-settings: "calt" 0;
 }
 
 .e-input-group input.e-input,
@@ -180,7 +182,7 @@ textarea.e-input,
 .e-input-group.e-control-wrapper textarea.e-input:focus,
 .e-input-group.e-input-focus input.e-input,
 .e-input-group.e-control-wrapper.e-input-focus input.e-input {
-  padding: 0 8px 0 0;
+  padding: 0;
 }
 
 .e-input-group textarea.e-input:focus,
@@ -638,7 +640,7 @@ label.e-float-text,
 .e-float-input.e-control-wrapper.e-disabled,
 .e-float-input.e-input-group.e-disabled,
 .e-float-input.e-input-group.e-control-wrapper.e-disabled {
-  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", arial, "Noto Sans", "Liberation Sans", sans-serif, "apple color emoji", "Segoe UI emoji", "Segoe UI Symbol", "Noto color emoji";
+  font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", arial, "Noto Sans", "Liberation Sans", sans-serif, "apple color emoji", "Segoe UI emoji", "Segoe UI Symbol", "Noto color emoji";
   font-size: 14px;
   font-weight: normal;
 }
@@ -5794,7 +5796,6 @@ input.e-input.e-bigger,
 .e-bigger .e-float-input.e-control-wrapper.e-input-focus input,
 .e-bigger .e-float-input.e-input-focus input {
   padding-left: 12px;
-  padding-right: 12px;
   text-indent: 0;
 }
 

package/styles/maskedtextbox/tailwind3.css

@@ -17,7 +17,7 @@
 
 /*! maskedtextbox layout */
 .e-control-wrapper.e-mask .e-maskedtextbox {
-  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", arial, "Noto Sans", "Liberation Sans", sans-serif, "apple color emoji", "Segoe UI emoji", "Segoe UI Symbol", "Noto color emoji";
+  font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", arial, "Noto Sans", "Liberation Sans", sans-serif, "apple color emoji", "Segoe UI emoji", "Segoe UI Symbol", "Noto color emoji";
   font-size: 14px;
 }
 

package/styles/signature/_layout.scss

@@ -2,8 +2,7 @@
   .e-signature.e-control {
     border: $signature-border;
     @if $skin-name == 'tailwind3' {
-      box-shadow: $shadow-lg;
-      border-radius: 12px;
+      box-shadow: $shadow-xl;
     }
   }
 }

package/styles/signature/tailwind3.css

@@ -4,9 +4,8 @@
 
 .e-signature.e-control {
   border: 1px solid;
-  -webkit-box-shadow: 0 0 4px 0 rgba(var(--color-sf-black), 0.1), 0 4px 6px -4px rgba(var(--color-sf-black), 0.1), 0 10px 15px -3px rgba(var(--color-sf-black), 0.1);
-          box-shadow: 0 0 4px 0 rgba(var(--color-sf-black), 0.1), 0 4px 6px -4px rgba(var(--color-sf-black), 0.1), 0 10px 15px -3px rgba(var(--color-sf-black), 0.1);
-  border-radius: 12px;
+  -webkit-box-shadow: 0 8px 10px -6px rgba(var(--color-sf-black), 0.1), 0 20px 25px -5px rgba(var(--color-sf-black), 0.1);
+          box-shadow: 0 8px 10px -6px rgba(var(--color-sf-black), 0.1), 0 20px 25px -5px rgba(var(--color-sf-black), 0.1);
 }
 
 .e-signature.e-control {

package/styles/slider/tailwind3.css

@@ -276,7 +276,7 @@
 .e-control-wrapper.e-slider-container .e-scale {
   -webkit-box-sizing: content-box;
           box-sizing: content-box;
-  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", arial, "Noto Sans", "Liberation Sans", sans-serif, "apple color emoji", "Segoe UI emoji", "Segoe UI Symbol", "Noto color emoji";
+  font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", arial, "Noto Sans", "Liberation Sans", sans-serif, "apple color emoji", "Segoe UI emoji", "Segoe UI Symbol", "Noto color emoji";
   height: 28px;
   width: 100%;
   line-height: normal;
@@ -303,7 +303,7 @@
 }
 .e-control-wrapper.e-slider-container .e-scale .e-tick .e-tick-value {
   color: var(--color-sf-content-text-color-alt1);
-  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", arial, "Noto Sans", "Liberation Sans", sans-serif, "apple color emoji", "Segoe UI emoji", "Segoe UI Symbol", "Noto color emoji";
+  font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", arial, "Noto Sans", "Liberation Sans", sans-serif, "apple color emoji", "Segoe UI emoji", "Segoe UI Symbol", "Noto color emoji";
   font-size: 12px;
   outline: none;
   position: absolute;

package/styles/tailwind3-lite.css

@@ -4,9 +4,8 @@
 
 .e-signature.e-control {
   border: 1px solid;
-  -webkit-box-shadow: 0 0 4px 0 rgba(var(--color-sf-black), 0.1), 0 4px 6px -4px rgba(var(--color-sf-black), 0.1), 0 10px 15px -3px rgba(var(--color-sf-black), 0.1);
-          box-shadow: 0 0 4px 0 rgba(var(--color-sf-black), 0.1), 0 4px 6px -4px rgba(var(--color-sf-black), 0.1), 0 10px 15px -3px rgba(var(--color-sf-black), 0.1);
-  border-radius: 12px;
+  -webkit-box-shadow: 0 8px 10px -6px rgba(var(--color-sf-black), 0.1), 0 20px 25px -5px rgba(var(--color-sf-black), 0.1);
+          box-shadow: 0 8px 10px -6px rgba(var(--color-sf-black), 0.1), 0 20px 25px -5px rgba(var(--color-sf-black), 0.1);
 }
 
 .e-signature.e-control {
@@ -61,7 +60,7 @@ textarea.e-input,
   margin: 0;
   margin-bottom: 0;
   outline: none;
-  padding: 0 8px 0 0;
+  padding: 0;
   text-indent: 8px;
   width: 100%;
 }
@@ -72,9 +71,11 @@ textarea.e-input,
 .e-input-group.e-control-wrapper,
 .e-input-group.e-disabled,
 .e-input-group.e-control-wrapper.e-disabled {
-  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", arial, "Noto Sans", "Liberation Sans", sans-serif, "apple color emoji", "Segoe UI emoji", "Segoe UI Symbol", "Noto color emoji";
+  font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", arial, "Noto Sans", "Liberation Sans", sans-serif, "apple color emoji", "Segoe UI emoji", "Segoe UI Symbol", "Noto color emoji";
   font-size: 14px;
   font-weight: normal;
+  -webkit-font-feature-settings: "calt" 0;
+          font-feature-settings: "calt" 0;
 }
 
 .e-input-group input.e-input,
@@ -193,7 +194,7 @@ textarea.e-input,
 .e-input-group.e-control-wrapper textarea.e-input:focus,
 .e-input-group.e-input-focus input.e-input,
 .e-input-group.e-control-wrapper.e-input-focus input.e-input {
-  padding: 0 8px 0 0;
+  padding: 0;
 }
 
 .e-input-group textarea.e-input:focus,
@@ -651,7 +652,7 @@ label.e-float-text,
 .e-float-input.e-control-wrapper.e-disabled,
 .e-float-input.e-input-group.e-disabled,
 .e-float-input.e-input-group.e-control-wrapper.e-disabled {
-  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", arial, "Noto Sans", "Liberation Sans", sans-serif, "apple color emoji", "Segoe UI emoji", "Segoe UI Symbol", "Noto color emoji";
+  font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", arial, "Noto Sans", "Liberation Sans", sans-serif, "apple color emoji", "Segoe UI emoji", "Segoe UI Symbol", "Noto color emoji";
   font-size: 14px;
   font-weight: normal;
 }
@@ -4869,7 +4870,7 @@ textarea.e-filled.e-disabled.e-input::-webkit-input-placeholder,
 
 /*! maskedtextbox layout */
 .e-control-wrapper.e-mask .e-maskedtextbox {
-  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", arial, "Noto Sans", "Liberation Sans", sans-serif, "apple color emoji", "Segoe UI emoji", "Segoe UI Symbol", "Noto color emoji";
+  font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", arial, "Noto Sans", "Liberation Sans", sans-serif, "apple color emoji", "Segoe UI emoji", "Segoe UI Symbol", "Noto color emoji";
   font-size: 14px;
 }
 
@@ -5158,7 +5159,7 @@ textarea.e-filled.e-disabled.e-input::-webkit-input-placeholder,
 .e-control-wrapper.e-slider-container .e-scale {
   -webkit-box-sizing: content-box;
           box-sizing: content-box;
-  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", arial, "Noto Sans", "Liberation Sans", sans-serif, "apple color emoji", "Segoe UI emoji", "Segoe UI Symbol", "Noto color emoji";
+  font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", arial, "Noto Sans", "Liberation Sans", sans-serif, "apple color emoji", "Segoe UI emoji", "Segoe UI Symbol", "Noto color emoji";
   height: 28px;
   width: 100%;
   line-height: normal;
@@ -5185,7 +5186,7 @@ textarea.e-filled.e-disabled.e-input::-webkit-input-placeholder,
 }
 .e-control-wrapper.e-slider-container .e-scale .e-tick .e-tick-value {
   color: var(--color-sf-content-text-color-alt1);
-  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", arial, "Noto Sans", "Liberation Sans", sans-serif, "apple color emoji", "Segoe UI emoji", "Segoe UI Symbol", "Noto color emoji";
+  font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", arial, "Noto Sans", "Liberation Sans", sans-serif, "apple color emoji", "Segoe UI emoji", "Segoe UI Symbol", "Noto color emoji";
   font-size: 12px;
   outline: none;
   position: absolute;
@@ -5424,7 +5425,7 @@ textarea.e-filled.e-disabled.e-input::-webkit-input-placeholder,
   width: 100%;
 }
 .e-upload.e-control-wrapper {
-  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", arial, "Noto Sans", "Liberation Sans", sans-serif, "apple color emoji", "Segoe UI emoji", "Segoe UI Symbol", "Noto color emoji";
+  font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", arial, "Noto Sans", "Liberation Sans", sans-serif, "apple color emoji", "Segoe UI emoji", "Segoe UI Symbol", "Noto color emoji";
 }
 .e-upload .e-hidden-file-input {
   border: 0;
@@ -5643,7 +5644,6 @@ textarea.e-filled.e-disabled.e-input::-webkit-input-placeholder,
 }
 .e-upload .e-file-select-wrap .e-btn, .e-upload .e-upload-actions .e-btn {
   font-family: inherit;
-  color: var(--color-sf-secondary-text-color-focus);
   font-weight: 600;
 }
 .e-upload .e-upload-actions {
@@ -6132,9 +6132,9 @@ body.e-colorpicker-overflow {
 .e-container .e-slider-preview .e-colorpicker-slider .e-slider-container .e-handle {
   border-radius: 10px;
   cursor: pointer;
-  height: 6px;
-  top: calc(68% - 8px);
-  width: 6px;
+  height: 10px;
+  top: calc(68% - 10px);
+  width: 10px;
 }
 .e-container .e-slider-preview .e-colorpicker-slider .e-slider-container .e-handle.e-handle-active {
   cursor: pointer;

package/styles/tailwind3.css

@@ -4,9 +4,8 @@
 
 .e-signature.e-control {
   border: 1px solid;
-  -webkit-box-shadow: 0 0 4px 0 rgba(var(--color-sf-black), 0.1), 0 4px 6px -4px rgba(var(--color-sf-black), 0.1), 0 10px 15px -3px rgba(var(--color-sf-black), 0.1);
-          box-shadow: 0 0 4px 0 rgba(var(--color-sf-black), 0.1), 0 4px 6px -4px rgba(var(--color-sf-black), 0.1), 0 10px 15px -3px rgba(var(--color-sf-black), 0.1);
-  border-radius: 12px;
+  -webkit-box-shadow: 0 8px 10px -6px rgba(var(--color-sf-black), 0.1), 0 20px 25px -5px rgba(var(--color-sf-black), 0.1);
+          box-shadow: 0 8px 10px -6px rgba(var(--color-sf-black), 0.1), 0 20px 25px -5px rgba(var(--color-sf-black), 0.1);
 }
 
 .e-signature.e-control {
@@ -61,7 +60,7 @@ textarea.e-input,
   margin: 0;
   margin-bottom: 0;
   outline: none;
-  padding: 0 8px 0 0;
+  padding: 0;
   text-indent: 8px;
   width: 100%;
 }
@@ -72,9 +71,11 @@ textarea.e-input,
 .e-input-group.e-control-wrapper,
 .e-input-group.e-disabled,
 .e-input-group.e-control-wrapper.e-disabled {
-  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", arial, "Noto Sans", "Liberation Sans", sans-serif, "apple color emoji", "Segoe UI emoji", "Segoe UI Symbol", "Noto color emoji";
+  font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", arial, "Noto Sans", "Liberation Sans", sans-serif, "apple color emoji", "Segoe UI emoji", "Segoe UI Symbol", "Noto color emoji";
   font-size: 14px;
   font-weight: normal;
+  -webkit-font-feature-settings: "calt" 0;
+          font-feature-settings: "calt" 0;
 }
 
 .e-input-group input.e-input,
@@ -193,7 +194,7 @@ textarea.e-input,
 .e-input-group.e-control-wrapper textarea.e-input:focus,
 .e-input-group.e-input-focus input.e-input,
 .e-input-group.e-control-wrapper.e-input-focus input.e-input {
-  padding: 0 8px 0 0;
+  padding: 0;
 }
 
 .e-input-group textarea.e-input:focus,
@@ -651,7 +652,7 @@ label.e-float-text,
 .e-float-input.e-control-wrapper.e-disabled,
 .e-float-input.e-input-group.e-disabled,
 .e-float-input.e-input-group.e-control-wrapper.e-disabled {
-  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", arial, "Noto Sans", "Liberation Sans", sans-serif, "apple color emoji", "Segoe UI emoji", "Segoe UI Symbol", "Noto color emoji";
+  font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", arial, "Noto Sans", "Liberation Sans", sans-serif, "apple color emoji", "Segoe UI emoji", "Segoe UI Symbol", "Noto color emoji";
   font-size: 14px;
   font-weight: normal;
 }
@@ -5807,7 +5808,6 @@ input.e-input.e-bigger,
 .e-bigger .e-float-input.e-control-wrapper.e-input-focus input,
 .e-bigger .e-float-input.e-input-focus input {
   padding-left: 12px;
-  padding-right: 12px;
   text-indent: 0;
 }
 
@@ -8987,7 +8987,7 @@ input.e-input.e-bigger.e-small,
 
 /*! maskedtextbox layout */
 .e-control-wrapper.e-mask .e-maskedtextbox {
-  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", arial, "Noto Sans", "Liberation Sans", sans-serif, "apple color emoji", "Segoe UI emoji", "Segoe UI Symbol", "Noto color emoji";
+  font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", arial, "Noto Sans", "Liberation Sans", sans-serif, "apple color emoji", "Segoe UI emoji", "Segoe UI Symbol", "Noto color emoji";
   font-size: 14px;
 }
 
@@ -9290,7 +9290,7 @@ input.e-input.e-bigger.e-small,
 .e-control-wrapper.e-slider-container .e-scale {
   -webkit-box-sizing: content-box;
           box-sizing: content-box;
-  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", arial, "Noto Sans", "Liberation Sans", sans-serif, "apple color emoji", "Segoe UI emoji", "Segoe UI Symbol", "Noto color emoji";
+  font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", arial, "Noto Sans", "Liberation Sans", sans-serif, "apple color emoji", "Segoe UI emoji", "Segoe UI Symbol", "Noto color emoji";
   height: 28px;
   width: 100%;
   line-height: normal;
@@ -9317,7 +9317,7 @@ input.e-input.e-bigger.e-small,
 }
 .e-control-wrapper.e-slider-container .e-scale .e-tick .e-tick-value {
   color: var(--color-sf-content-text-color-alt1);
-  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", arial, "Noto Sans", "Liberation Sans", sans-serif, "apple color emoji", "Segoe UI emoji", "Segoe UI Symbol", "Noto color emoji";
+  font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", arial, "Noto Sans", "Liberation Sans", sans-serif, "apple color emoji", "Segoe UI emoji", "Segoe UI Symbol", "Noto color emoji";
   font-size: 12px;
   outline: none;
   position: absolute;
@@ -9594,7 +9594,7 @@ input.e-input.e-bigger.e-small,
   width: 100%;
 }
 .e-upload.e-control-wrapper {
-  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", arial, "Noto Sans", "Liberation Sans", sans-serif, "apple color emoji", "Segoe UI emoji", "Segoe UI Symbol", "Noto color emoji";
+  font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", arial, "Noto Sans", "Liberation Sans", sans-serif, "apple color emoji", "Segoe UI emoji", "Segoe UI Symbol", "Noto color emoji";
 }
 .e-upload .e-hidden-file-input {
   border: 0;
@@ -9813,7 +9813,6 @@ input.e-input.e-bigger.e-small,
 }
 .e-upload .e-file-select-wrap .e-btn, .e-upload .e-upload-actions .e-btn {
   font-family: inherit;
-  color: var(--color-sf-secondary-text-color-focus);
   font-weight: 600;
 }
 .e-upload .e-upload-actions {
@@ -10240,7 +10239,7 @@ input.e-input.e-bigger.e-small,
   width: 100%;
 }
 .e-bigger.e-small .e-upload.e-control-wrapper {
-  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", arial, "Noto Sans", "Liberation Sans", sans-serif, "apple color emoji", "Segoe UI emoji", "Segoe UI Symbol", "Noto color emoji";
+  font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", arial, "Noto Sans", "Liberation Sans", sans-serif, "apple color emoji", "Segoe UI emoji", "Segoe UI Symbol", "Noto color emoji";
 }
 .e-bigger.e-small .e-upload .e-hidden-file-input {
   border: 0;
@@ -10792,9 +10791,9 @@ body.e-colorpicker-overflow {
 .e-container .e-slider-preview .e-colorpicker-slider .e-slider-container .e-handle {
   border-radius: 10px;
   cursor: pointer;
-  height: 6px;
-  top: calc(68% - 8px);
-  width: 6px;
+  height: 10px;
+  top: calc(68% - 10px);
+  width: 10px;
 }
 .e-container .e-slider-preview .e-colorpicker-slider .e-slider-container .e-handle.e-handle-active {
   cursor: pointer;
@@ -11274,9 +11273,9 @@ body.e-colorpicker-overflow {
 }
 .e-bigger .e-container .e-slider-preview .e-colorpicker-slider .e-slider-container .e-handle {
   border-radius: 10px;
-  height: 6px;
-  top: calc(76% - 9px);
-  width: 6px;
+  height: 10px;
+  top: calc(76% - 11px);
+  width: 10px;
 }
 .e-bigger .e-container .e-slider-preview .e-switch-ctrl-btn .e-ctrl-btn {
   width: 90.6%;

package/styles/uploader/_layout.scss

@@ -321,7 +321,6 @@
     #{if(&, '&', '*')} .e-upload-actions .e-btn {
       font-family: $upload-font-family;
       @if $skin-name == 'tailwind3' {
-        color: $secondary-text-color-focus;
         font-weight: 600;
       }
     }

package/styles/uploader/tailwind3.css

@@ -80,7 +80,7 @@
   width: 100%;
 }
 .e-upload.e-control-wrapper {
-  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", arial, "Noto Sans", "Liberation Sans", sans-serif, "apple color emoji", "Segoe UI emoji", "Segoe UI Symbol", "Noto color emoji";
+  font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", arial, "Noto Sans", "Liberation Sans", sans-serif, "apple color emoji", "Segoe UI emoji", "Segoe UI Symbol", "Noto color emoji";
 }
 .e-upload .e-hidden-file-input {
   border: 0;
@@ -299,7 +299,6 @@
 }
 .e-upload .e-file-select-wrap .e-btn, .e-upload .e-upload-actions .e-btn {
   font-family: inherit;
-  color: var(--color-sf-secondary-text-color-focus);
   font-weight: 600;
 }
 .e-upload .e-upload-actions {
@@ -726,7 +725,7 @@
   width: 100%;
 }
 .e-bigger.e-small .e-upload.e-control-wrapper {
-  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", arial, "Noto Sans", "Liberation Sans", sans-serif, "apple color emoji", "Segoe UI emoji", "Segoe UI Symbol", "Noto color emoji";
+  font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", arial, "Noto Sans", "Liberation Sans", sans-serif, "apple color emoji", "Segoe UI emoji", "Segoe UI Symbol", "Noto color emoji";
 }
 .e-bigger.e-small .e-upload .e-hidden-file-input {
   border: 0;