@syncfusion/ej2-inputs 27.2.4 → 28.1.33

package/styles/input/tailwind3.scss

@@ -0,0 +1,5 @@
+@import 'ej2-base/styles/definition/tailwind3.scss';
+@import 'tailwind3-definition.scss';
+@import 'icons/tailwind3.scss';
+@import 'all.scss';
+@import 'bigger.scss';

package/styles/maskedtextbox/_tailwind3-definition.scss

@@ -0,0 +1,7 @@
+$mask-font-family: $font-family !default;
+$mask-font-size: $text-sm !default;
+$mask-bigger-font-size: $text-base !default;
+
+// color
+
+$mask-error-color: $danger !default;

package/styles/maskedtextbox/bds.css

@@ -0,0 +1,180 @@
+
+
+
+
+/* stylelint-disable property-no-vendor-prefix */
+/* stylelint-disable */
+.e-input:focus:not(.e-success):not(.e-warning).e-error,
+.e-float-input:not(.e-success):not(.e-warning).e-error:not(.e-input-group) input:focus,
+.e-float-input:not(.e-success):not(.e-warning).e-error:not(.e-input-group) textarea:focus,
+.e-float-input.e-control-wrapper:not(.e-success):not(.e-warning).e-error:not(.e-input-group) input:focus,
+.e-float-input.e-control-wrapper:not(.e-success):not(.e-warning).e-error:not(.e-input-group) textarea:focus,
+.e-float-input:not(.e-success):not(.e-warning).e-error:not(.e-input-group).e-input-focus input,
+.e-float-input.e-control-wrapper:not(.e-success):not(.e-warning).e-error:not(.e-input-group).e-input-focus input {
+  -webkit-box-shadow: 0 1px 2px 0 rgba(16, 24, 40, 0.05), 0 0 0 4px rgba(240, 68, 55, 0.24) !important;
+  box-shadow: 0 1px 2px 0 rgba(16, 24, 40, 0.05), 0 0 0 4px rgba(240, 68, 55, 0.24) !important;
+}
+
+.e-input:focus:not(.e-error):not(.e-warning).e-success,
+.e-float-input:not(.e-error):not(.e-warning).e-success:not(.e-input-group) input:focus,
+.e-float-input:not(.e-error):not(.e-warning).e-success:not(.e-input-group) textarea:focus,
+.e-float-input.e-control-wrapper:not(.e-error):not(.e-warning).e-success:not(.e-input-group) input:focus,
+.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 1px 2px 0 rgba(16, 24, 40, 0.05), 0 0 0 4px rgba(23, 177, 105, 0.24) !important;
+  box-shadow: 0 1px 2px 0 rgba(16, 24, 40, 0.05), 0 0 0 4px rgba(23, 177, 105, 0.24) !important;
+}
+
+.e-input:focus:not(.e-success):not(.e-error).e-warning,
+.e-float-input:not(.e-success):not(.e-error).e-warning:not(.e-input-group) input:focus,
+.e-float-input:not(.e-success):not(.e-error).e-warning:not(.e-input-group) textarea:focus,
+.e-float-input.e-control-wrapper:not(.e-success):not(.e-error).e-warning:not(.e-input-group) input:focus,
+.e-float-input.e-control-wrapper:not(.e-success):not(.e-error).e-warning:not(.e-input-group) textarea:focus,
+.e-float-input:not(.e-success):not(.e-error).e-warning:not(.e-input-group).e-input-focus input,
+.e-float-input.e-control-wrapper:not(.e-success):not(.e-error).e-warning:not(.e-input-group).e-input-focus input {
+  -webkit-box-shadow: 0 1px 2px 0 rgba(16, 24, 40, 0.05), 0 0 0 4px rgba(247, 143, 8, 0.24) !important;
+  box-shadow: 0 1px 2px 0 rgba(16, 24, 40, 0.05), 0 0 0 4px rgba(247, 143, 8, 0.24) !important;
+}
+
+.e-input-group.e-input-focus:not(.e-success):not(.e-warning).e-error,
+.e-input-group.e-control-wrapper.e-input-focus:not(.e-success):not(.e-warning).e-error {
+  -webkit-box-shadow: 0 1px 2px 0 rgba(16, 24, 40, 0.05), 0 0 0 4px rgba(240, 68, 55, 0.24) !important;
+  box-shadow: 0 1px 2px 0 rgba(16, 24, 40, 0.05), 0 0 0 4px rgba(240, 68, 55, 0.24) !important;
+}
+
+.e-input-group.e-input-focus:not(.e-error):not(.e-warning).e-success,
+.e-input-group.e-control-wrapper.e-input-focus:not(.e-error):not(.e-warning).e-success {
+  -webkit-box-shadow: 0 1px 2px 0 rgba(16, 24, 40, 0.05), 0 0 0 4px rgba(23, 177, 105, 0.24) !important;
+  box-shadow: 0 1px 2px 0 rgba(16, 24, 40, 0.05), 0 0 0 4px rgba(23, 177, 105, 0.24) !important;
+}
+
+.e-input-group.e-input-focus:not(.e-success):not(.e-error).e-warning,
+.e-input-group.e-control-wrapper.e-input-focus:not(.e-success):not(.e-error).e-warning {
+  -webkit-box-shadow: 0 1px 2px 0 rgba(16, 24, 40, 0.05), 0 0 0 4px rgba(247, 143, 8, 0.24) !important;
+  box-shadow: 0 1px 2px 0 rgba(16, 24, 40, 0.05), 0 0 0 4px rgba(247, 143, 8, 0.24) !important;
+}
+
+.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 1px 2px 0 rgba(16, 24, 40, 0.05), 0 0 0 4px rgba(240, 68, 55, 0.24) !important;
+  box-shadow: 0 1px 2px 0 rgba(16, 24, 40, 0.05), 0 0 0 4px rgba(240, 68, 55, 0.24) !important;
+}
+
+.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 1px 2px 0 rgba(16, 24, 40, 0.05), 0 0 0 4px rgba(23, 177, 105, 0.24) !important;
+  box-shadow: 0 1px 2px 0 rgba(16, 24, 40, 0.05), 0 0 0 4px rgba(23, 177, 105, 0.24) !important;
+}
+
+.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 1px 2px 0 rgba(16, 24, 40, 0.05), 0 0 0 4px rgba(247, 143, 8, 0.24) !important;
+  box-shadow: 0 1px 2px 0 rgba(16, 24, 40, 0.05), 0 0 0 4px rgba(247, 143, 8, 0.24) !important;
+}
+
+.e-float-input.e-error label.e-float-text,
+.e-float-input.e-control-wrapper.e-error label.e-float-text,
+.e-float-input.e-error input:focus ~ label.e-float-text,
+.e-float-input.e-control-wrapper.e-error input:focus ~ label.e-float-text,
+.e-float-input.e-error.e-input-focus input ~ label.e-float-text,
+.e-float-input.e-control-wrapper.e-error.e-input-focus input ~ label.e-float-text,
+.e-float-input.e-error textarea:focus ~ label.e-float-text,
+.e-float-input.e-control-wrapper.e-error textarea:focus ~ label.e-float-text {
+  color: var(--color-sf-utility-danger) !important;
+}
+
+.e-outline.e-float-input.e-error.e-input-focus input:focus ~ label.e-float-text,
+.e-outline.e-float-input.e-input-group.e-error.e-valid-input label.e-label-top.e-float-text,
+.e-outline.e-float-input.e-bigger.e-error.e-input-focus input:focus ~ label.e-float-text,
+.e-bigger .e-outline.e-float-input.e-error.e-input-focus input:focus ~ label.e-float-text,
+.e-outline.e-float-input.e-small.e-error.e-input-focus input:focus ~ label.e-float-text,
+.e-small .e-outline.e-float-input.e-error input:focus ~ label.e-float-text,
+.e-outline.e-float-input.e-small.e-bigger.e-error input:focus ~ label.e-float-text,
+.e-bigger .e-outline.e-float-input.e-small:not(.e-error) input:focus ~ label.e-float-text,
+.e-outline.e-float-input.e-error textarea:focus ~ label.e-float-text,
+.e-outline.e-float-input.e-bigger.e-error textarea:focus ~ label.e-float-text,
+.e-bigger .e-outline.e-float-input.e-error textarea:focus ~ label.e-float-text,
+.e-outline.e-float-input.e-small.e-error textarea:focus ~ label.e-float-text,
+.e-small .e-outline.e-float-input.e-error textarea:focus ~ label.e-float-text,
+.e-outline.e-float-input.e-small.e-bigger.e-error textarea:focus ~ label.e-float-text,
+.e-bigger .e-outline.e-float-input.e-small.e-error textarea:focus ~ label.e-float-text,
+.e-outline.e-float-input.e-control-wrapper.e-error input:focus ~ label.e-float-text,
+.e-outline.e-float-input.e-control-wrapper.e-bigger.e-error input:focus ~ label.e-float-text,
+.e-bigger .e-outline.e-float-input.e-control-wrapper.e-error input:focus ~ label.e-float-text,
+.e-outline.e-float-input.e-control-wrapper.e-small.e-error input:focus ~ label.e-float-text,
+.e-small .e-outline.e-float-input.e-control-wrapper.e-error input:focus ~ label.e-float-text,
+.e-outline.e-float-input.e-control-wrapper.e-small.e-bigger.e-error input:focus ~ label.e-float-text,
+.e-bigger .e-outline.e-float-input.e-control-wrapper.e-small.e-error input:focus ~ label.e-float-text,
+.e-outline.e-float-input.e-control-wrapper.e-error textarea:focus ~ label.e-float-text,
+.e-outline.e-float-input.e-control-wrapper.e-bigger.e-error textarea:focus ~ label.e-float-text,
+.e-bigger .e-outline.e-float-input.e-control-wrapper.e-error textarea:focus ~ label.e-float-text,
+.e-outline.e-float-input.e-control-wrapper.e-small.e-error textarea:focus ~ label.e-float-text,
+.e-small .e-outline.e-float-input.e-control-wrapper.e-error textarea:focus ~ label.e-float-text,
+.e-outline.e-float-input.e-control-wrapper.e-small.e-bigger.e-error textarea:focus ~ label.e-float-text,
+.e-bigger .e-outline.e-float-input.e-control-wrapper.e-small.e-error textarea:focus ~ label.e-float-text,
+.e-outline.e-float-input.e-error label.e-float-text.e-label-top,
+.e-outline.e-float-input.e-input-group.e-error label.e-float-text.e-label-top,
+.e-outline.e-float-input.e-control-wrapper.e-error label.e-float-text.e-label-top,
+.e-outline.e-float-input.e-valid-input.e-error:not(.e-input-focus) input:valid ~ label.e-float-text.e-label-top,
+.e-outline.e-float-input.e-control-wrapper.e-valid-input.e-error:not(.e-input-focus) input:focus ~ label.e-float-text.e-label-top,
+.e-outline.e-float-input.e-valid-input.e-error:not(.e-input-focus) textarea:valid ~ label.e-float-text.e-label-top,
+.e-outline.e-float-input.e-control-wrapper.e-valid-input.e-error:not(.e-input-focus) textarea:focus ~ label.e-float-text.e-label-top,
+.e-outline.e-float-input.e-error.e-input-focus input ~ label.e-float-text,
+.e-outline.e-float-input.e-bigger.e-error.e-input-focus input ~ label.e-float-text,
+.e-bigger .e-outline.e-float-input.e-error.e-input-focus input ~ label.e-float-text,
+.e-outline.e-float-input.e-small.e-error.e-input-focus input ~ label.e-float-text,
+.e-small .e-outline.e-float-input.e-error.e-input-focus input ~ label.e-float-text,
+.e-outline.e-float-input.e-small.e-bigger.e-error.e-input-focus input ~ label.e-float-text,
+.e-bigger .e-outline.e-float-input.e-small:not(.e-error).e-input-focus input ~ label.e-float-text,
+.e-outline.e-float-input.e-control-wrapper.e-error.e-input-focus input ~ label.e-float-text,
+.e-outline.e-float-input.e-control-wrapper.e-bigger.e-error.e-input-focus input ~ label.e-float-text,
+.e-bigger .e-outline.e-float-input.e-control-wrapper.e-error.e-input-focus input ~ label.e-float-text,
+.e-outline.e-float-input.e-control-wrapper.e-small.e-error.e-input-focus input ~ label.e-float-text,
+.e-small .e-outline.e-float-input.e-control-wrapper.e-error.e-input-focus input ~ label.e-float-text,
+.e-outline.e-float-input.e-control-wrapper.e-small.e-bigger.e-error.e-input-focus input ~ label.e-float-text,
+.e-bigger .e-outline.e-float-input.e-control-wrapper.e-small.e-error.e-input-focus input ~ label.e-float-text {
+  color: var(--color-sf-utility-danger) !important;
+}
+
+.e-filled.e-float-input.e-error label.e-float-text,
+.e-filled.e-float-input.e-control-wrapper.e-error label.e-float-text,
+.e-filled.e-float-input.e-error input:focus ~ label.e-float-text,
+.e-filled.e-float-input.e-control-wrapper.e-error input:focus ~ label.e-float-text,
+.e-filled.e-float-input.e-error textarea:focus ~ label.e-float-text,
+.e-filled.e-float-input.e-control-wrapper.e-error textarea:focus ~ label.e-float-text,
+.e-filled.e-float-input.e-error.e-input-focus input ~ label.e-float-text,
+.e-filled.e-float-input.e-control-wrapper.e-error.e-input-focus input ~ label.e-float-text {
+  color: var(--color-sf-utility-danger) !important;
+}
+
+/*! maskedtextbox layout */
+.e-control-wrapper.e-mask .e-maskedtextbox {
+  font-family: "Inter";
+  font-size: 14px;
+}
+
+.e-content-placeholder.e-mask.e-placeholder-mask {
+  background-size: 300px 33px;
+  min-height: 33px;
+}
+
+/*! maskedtextbox theme */
+.e-control-wrapper.e-mask.e-error .e-maskedtextbox,
+.e-utility-mask.e-error {
+  color: var(--color-sf-utility-danger);
+}
+
+.e-bigger .e-control-wrapper.e-mask .e-maskedtextbox {
+  font-size: 16px;
+}
+
+.e-control-wrapper.e-mask.e-bigger .e-maskedtextbox {
+  font-size: 16px;
+}
+
+.e-bigger .e-content-placeholder.e-mask.e-placeholder-mask,
+.e-bigger.e-content-placeholder.e-mask.e-placeholder-mask {
+  background-size: 300px 40px;
+  min-height: 40px;
+}

package/styles/maskedtextbox/bds.scss

@@ -0,0 +1,5 @@
+@import 'ej2-base/styles/definition/bds.scss';
+@import '../input/bds-definition.scss';
+@import 'bds-definition.scss';
+@import 'all.scss';
+@import 'bigger.scss';

package/styles/maskedtextbox/fluent2.css

@@ -186,7 +186,7 @@
 
 /*! maskedtextbox layout */
 .e-control-wrapper.e-mask .e-maskedtextbox {
-  font-family: "Segoe UI", -apple-system, blinkMacSystemfont, "Roboto", "Helvetica Neue", sans-serif;
+  font-family: "Segoe UI", -apple-system, BlinkMacSystemFont, "Roboto", "Helvetica Neue", sans-serif;
   font-size: 14px;
 }
 

package/styles/maskedtextbox/tailwind3.css

@@ -0,0 +1,47 @@
+
+
+
+
+/* stylelint-disable property-no-vendor-prefix */
+/* stylelint-disable */
+.e-filled.e-float-input.e-error label.e-float-text,
+.e-filled.e-float-input.e-control-wrapper.e-error label.e-float-text,
+.e-filled.e-float-input.e-error input:focus ~ label.e-float-text,
+.e-filled.e-float-input.e-control-wrapper.e-error input:focus ~ label.e-float-text,
+.e-filled.e-float-input.e-error textarea:focus ~ label.e-float-text,
+.e-filled.e-float-input.e-control-wrapper.e-error textarea:focus ~ label.e-float-text,
+.e-filled.e-float-input.e-error.e-input-focus input ~ label.e-float-text,
+.e-filled.e-float-input.e-control-wrapper.e-error.e-input-focus input ~ label.e-float-text {
+  color: var(--color-sf-danger) !important;
+}
+
+/*! 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-size: 14px;
+}
+
+.e-content-placeholder.e-mask.e-placeholder-mask {
+  background-size: 300px 33px;
+  min-height: 33px;
+}
+
+/*! maskedtextbox theme */
+.e-control-wrapper.e-mask.e-error .e-maskedtextbox,
+.e-utility-mask.e-error {
+  color: var(--color-sf-danger);
+}
+
+.e-bigger .e-control-wrapper.e-mask .e-maskedtextbox {
+  font-size: 16px;
+}
+
+.e-control-wrapper.e-mask.e-bigger .e-maskedtextbox {
+  font-size: 16px;
+}
+
+.e-bigger .e-content-placeholder.e-mask.e-placeholder-mask,
+.e-bigger.e-content-placeholder.e-mask.e-placeholder-mask {
+  background-size: 300px 40px;
+  min-height: 40px;
+}

package/styles/maskedtextbox/tailwind3.scss

@@ -0,0 +1,5 @@
+@import 'ej2-base/styles/definition/tailwind3.scss';
+@import '../input/tailwind3-definition.scss';
+@import 'tailwind3-definition.scss';
+@import 'all.scss';
+@import 'bigger.scss';

package/styles/material-dark-lite.css

@@ -6844,6 +6844,7 @@ textarea.e-filled.e-disabled.e-input::-webkit-input-placeholder,
   overflow: hidden;
   width: 2px;
   left: calc(50% - 1px);
+  border-radius: 4px;
 }
 .e-control-wrapper.e-slider-container.e-vertical.e-small-size.e-slider-btn {
   height: 100%;
@@ -8331,6 +8332,9 @@ body.e-colorpicker-overflow {
 .e-rtl .e-container .e-selected-value .e-float-input input {
   padding-right: 0;
 }
+.e-rtl .e-container .e-selected-value .e-float-input .e-float-text {
+  right: -12px !important; /* stylelint-disable-line declaration-no-important */
+}
 .e-rtl .e-container .e-selected-value .e-value-switch-btn {
   -webkit-transform: rotate(180deg);
           transform: rotate(180deg);

package/styles/material-dark.css

@@ -12247,6 +12247,7 @@ textarea.e-input.e-bigger.e-small.e-outline,
   overflow: hidden;
   width: 2px;
   left: calc(50% - 1px);
+  border-radius: 4px;
 }
 .e-control-wrapper.e-slider-container.e-vertical.e-small-size.e-slider-btn {
   height: 100%;
@@ -14247,6 +14248,9 @@ body.e-colorpicker-overflow {
 .e-rtl .e-container .e-selected-value .e-float-input input {
   padding-right: 0;
 }
+.e-rtl .e-container .e-selected-value .e-float-input .e-float-text {
+  right: -12px !important; /* stylelint-disable-line declaration-no-important */
+}
 .e-rtl .e-container .e-selected-value .e-value-switch-btn {
   -webkit-transform: rotate(180deg);
           transform: rotate(180deg);

package/styles/material-lite.css

@@ -6864,6 +6864,7 @@ textarea.e-filled.e-disabled.e-input::-webkit-input-placeholder,
   overflow: hidden;
   width: 2px;
   left: calc(50% - 1px);
+  border-radius: 4px;
 }
 .e-control-wrapper.e-slider-container.e-vertical.e-small-size.e-slider-btn {
   height: 100%;
@@ -8351,6 +8352,9 @@ body.e-colorpicker-overflow {
 .e-rtl .e-container .e-selected-value .e-float-input input {
   padding-right: 0;
 }
+.e-rtl .e-container .e-selected-value .e-float-input .e-float-text {
+  right: -12px !important; /* stylelint-disable-line declaration-no-important */
+}
 .e-rtl .e-container .e-selected-value .e-value-switch-btn {
   -webkit-transform: rotate(180deg);
           transform: rotate(180deg);

package/styles/material.css

@@ -12267,6 +12267,7 @@ textarea.e-input.e-bigger.e-small.e-outline,
   overflow: hidden;
   width: 2px;
   left: calc(50% - 1px);
+  border-radius: 4px;
 }
 .e-control-wrapper.e-slider-container.e-vertical.e-small-size.e-slider-btn {
   height: 100%;
@@ -14270,6 +14271,9 @@ body.e-colorpicker-overflow {
 .e-rtl .e-container .e-selected-value .e-float-input input {
   padding-right: 0;
 }
+.e-rtl .e-container .e-selected-value .e-float-input .e-float-text {
+  right: -12px !important; /* stylelint-disable-line declaration-no-important */
+}
 .e-rtl .e-container .e-selected-value .e-value-switch-btn {
   -webkit-transform: rotate(180deg);
           transform: rotate(180deg);

package/styles/material3-dark-lite.css

@@ -6657,6 +6657,7 @@ textarea.e-filled.e-disabled.e-input::-webkit-input-placeholder,
   overflow: hidden;
   left: calc(50% - 2px);
   width: 4px;
+  border-radius: 4px;
 }
 .e-control-wrapper.e-slider-container.e-vertical.e-small-size.e-slider-btn {
   height: 100%;
@@ -8217,6 +8218,9 @@ body.e-colorpicker-overflow {
 .e-rtl .e-container .e-selected-value .e-float-input input {
   padding-right: 0;
 }
+.e-rtl .e-container .e-selected-value .e-float-input .e-float-text {
+  right: -12px !important; /* stylelint-disable-line declaration-no-important */
+}
 .e-rtl .e-container .e-selected-value .e-value-switch-btn {
   -webkit-transform: rotate(180deg);
           transform: rotate(180deg);
@@ -9044,10 +9048,10 @@ body.e-colorpicker-overflow {
   }
 }
 .smart-textarea-suggestion-overlay {
-  background-color: #fff;
-  color: rgba(var(--color-sf-on-surface-variant));
-  -webkit-box-shadow: 0 1.25px 4px 0 rgba(0, 0, 0, 0.4);
-          box-shadow: 0 1.25px 4px 0 rgba(0, 0, 0, 0.4);
+  background-color: rgba(var(--color-sf-surface));
+  color: rgba(var(--color-sf-primary));
+  -webkit-box-shadow: 0 1.25px 4px 0 0 1px 3px 0 rgba(0, 0, 0, 0.3), 0 4px 8px 3px rgba(0, 0, 0, 0.15);
+          box-shadow: 0 1.25px 4px 0 0 1px 3px 0 rgba(0, 0, 0, 0.3), 0 4px 8px 3px rgba(0, 0, 0, 0.15);
 }
 
 [data-suggestion-visible]::-moz-selection {

package/styles/material3-dark.css

@@ -12016,6 +12016,7 @@ textarea.e-input.e-bigger.e-small.e-outline,
   overflow: hidden;
   left: calc(50% - 2px);
   width: 4px;
+  border-radius: 4px;
 }
 .e-control-wrapper.e-slider-container.e-vertical.e-small-size.e-slider-btn {
   height: 100%;
@@ -14235,6 +14236,9 @@ body.e-colorpicker-overflow {
 .e-rtl .e-container .e-selected-value .e-float-input input {
   padding-right: 0;
 }
+.e-rtl .e-container .e-selected-value .e-float-input .e-float-text {
+  right: -12px !important; /* stylelint-disable-line declaration-no-important */
+}
 .e-rtl .e-container .e-selected-value .e-value-switch-btn {
   -webkit-transform: rotate(180deg);
           transform: rotate(180deg);
@@ -15425,10 +15429,10 @@ body.e-colorpicker-overflow {
   }
 }
 .smart-textarea-suggestion-overlay {
-  background-color: #fff;
-  color: rgba(var(--color-sf-on-surface-variant));
-  -webkit-box-shadow: 0 1.25px 4px 0 rgba(0, 0, 0, 0.4);
-          box-shadow: 0 1.25px 4px 0 rgba(0, 0, 0, 0.4);
+  background-color: rgba(var(--color-sf-surface));
+  color: rgba(var(--color-sf-primary));
+  -webkit-box-shadow: 0 1.25px 4px 0 0 1px 3px 0 rgba(0, 0, 0, 0.3), 0 4px 8px 3px rgba(0, 0, 0, 0.15);
+          box-shadow: 0 1.25px 4px 0 0 1px 3px 0 rgba(0, 0, 0, 0.3), 0 4px 8px 3px rgba(0, 0, 0, 0.15);
 }
 
 [data-suggestion-visible]::-moz-selection {

package/styles/material3-lite.css

@@ -6659,6 +6659,7 @@ textarea.e-filled.e-disabled.e-input::-webkit-input-placeholder,
   overflow: hidden;
   left: calc(50% - 2px);
   width: 4px;
+  border-radius: 4px;
 }
 .e-control-wrapper.e-slider-container.e-vertical.e-small-size.e-slider-btn {
   height: 100%;
@@ -8219,6 +8220,9 @@ body.e-colorpicker-overflow {
 .e-rtl .e-container .e-selected-value .e-float-input input {
   padding-right: 0;
 }
+.e-rtl .e-container .e-selected-value .e-float-input .e-float-text {
+  right: -12px !important; /* stylelint-disable-line declaration-no-important */
+}
 .e-rtl .e-container .e-selected-value .e-value-switch-btn {
   -webkit-transform: rotate(180deg);
           transform: rotate(180deg);
@@ -9046,10 +9050,10 @@ body.e-colorpicker-overflow {
   }
 }
 .smart-textarea-suggestion-overlay {
-  background-color: #fff;
-  color: rgba(var(--color-sf-on-surface-variant));
-  -webkit-box-shadow: 0 1.25px 4px 0 rgba(0, 0, 0, 0.4);
-          box-shadow: 0 1.25px 4px 0 rgba(0, 0, 0, 0.4);
+  background-color: rgba(var(--color-sf-surface));
+  color: rgba(var(--color-sf-primary));
+  -webkit-box-shadow: 0 1.25px 4px 0 0 1px 3px 0 rgba(0, 0, 0, 0.3), 0 4px 8px 3px rgba(0, 0, 0, 0.15);
+          box-shadow: 0 1.25px 4px 0 0 1px 3px 0 rgba(0, 0, 0, 0.3), 0 4px 8px 3px rgba(0, 0, 0, 0.15);
 }
 
 [data-suggestion-visible]::-moz-selection {

package/styles/material3.css

@@ -12018,6 +12018,7 @@ textarea.e-input.e-bigger.e-small.e-outline,
   overflow: hidden;
   left: calc(50% - 2px);
   width: 4px;
+  border-radius: 4px;
 }
 .e-control-wrapper.e-slider-container.e-vertical.e-small-size.e-slider-btn {
   height: 100%;
@@ -14237,6 +14238,9 @@ body.e-colorpicker-overflow {
 .e-rtl .e-container .e-selected-value .e-float-input input {
   padding-right: 0;
 }
+.e-rtl .e-container .e-selected-value .e-float-input .e-float-text {
+  right: -12px !important; /* stylelint-disable-line declaration-no-important */
+}
 .e-rtl .e-container .e-selected-value .e-value-switch-btn {
   -webkit-transform: rotate(180deg);
           transform: rotate(180deg);
@@ -15427,10 +15431,10 @@ body.e-colorpicker-overflow {
   }
 }
 .smart-textarea-suggestion-overlay {
-  background-color: #fff;
-  color: rgba(var(--color-sf-on-surface-variant));
-  -webkit-box-shadow: 0 1.25px 4px 0 rgba(0, 0, 0, 0.4);
-          box-shadow: 0 1.25px 4px 0 rgba(0, 0, 0, 0.4);
+  background-color: rgba(var(--color-sf-surface));
+  color: rgba(var(--color-sf-primary));
+  -webkit-box-shadow: 0 1.25px 4px 0 0 1px 3px 0 rgba(0, 0, 0, 0.3), 0 4px 8px 3px rgba(0, 0, 0, 0.15);
+          box-shadow: 0 1.25px 4px 0 0 1px 3px 0 rgba(0, 0, 0, 0.3), 0 4px 8px 3px rgba(0, 0, 0, 0.15);
 }
 
 [data-suggestion-visible]::-moz-selection {

package/styles/numerictextbox/_tailwind3-definition.scss

@@ -0,0 +1,3 @@
+$numeric-skin-name: $skin-name !default;
+$numeric-input-icon-size: 14px !default;
+$numeric-input-bigger-icon-size: 18px !default;