@syncfusion/ej2-angular-inputs 20.2.43-ngcc → 20.2.44

package/styles/material.css

@@ -9,6 +9,7 @@
   border-color: #e0e0e0;
 }
 
+/* stylelint-disable property-no-vendor-prefix */
 @keyframes e-input-ripple {
   100% {
     opacity: 0;
@@ -91,14 +92,14 @@ textarea.e-input,
 .e-input-group.e-control-wrapper {
   font-family: "Roboto", "Segoe UI", "GeezaPro", "DejaVu Serif", "sans-serif", "-apple-system", "BlinkMacSystemFont";
   font-size: 13px;
-  font-weight: 400;
+  font-weight: normal;
 }
 
 .e-input-group.e-disabled,
 .e-input-group.e-control-wrapper.e-disabled {
   font-family: "Roboto", "Segoe UI", "GeezaPro", "DejaVu Serif", "sans-serif", "-apple-system", "BlinkMacSystemFont";
   font-size: 13px;
-  font-weight: 400;
+  font-weight: normal;
 }
 
 .e-input-group input.e-input,
@@ -274,6 +275,7 @@ textarea.e-input.e-bigger,
   text-align: center;
 }
 
+/* stylelint-disable property-no-vendor-prefix */
 .e-input-group.e-float-icon-left > .e-input-group-icon,
 .e-float-input.e-input-group.e-float-icon-left > .e-input-group-icon,
 .e-input-group.e-control-wrapper.e-float-icon-left > .e-input-group-icon,
@@ -629,7 +631,7 @@ label.e-float-text,
 .e-float-input.e-control-wrapper:not(.e-input-focus) input:not(:focus):valid ~ label.e-float-text.e-label-bottom {
   font-size: 13px;
   font-style: normal;
-  font-weight: 400;
+  font-weight: normal;
   left: 0;
   overflow: hidden;
   padding-left: 0;
@@ -1152,7 +1154,7 @@ label.e-float-text,
 .e-float-input.e-input-group.e-control-wrapper.e-disabled {
   font-family: "Roboto", "Segoe UI", "GeezaPro", "DejaVu Serif", "sans-serif", "-apple-system", "BlinkMacSystemFont";
   font-size: 13px;
-  font-weight: 400;
+  font-weight: normal;
 }
 
 .e-float-input input,
@@ -1349,7 +1351,7 @@ label.e-float-text,
 .e-small .e-float-input.e-control-wrapper:not(.e-error):not(.e-input-focus) input:not(:focus):valid ~ label.e-float-text.e-label-bottom,
 .e-float-input.e-control-wrapper.e-small.e-bigger:not(.e-error):not(.e-input-focus) input:not(:focus):valid ~ label.e-float-text.e-label-bottom,
 .e-bigger .e-float-input.e-control-wrapper.e-small:not(.e-error):not(.e-input-focus) input:not(:focus):valid ~ label.e-float-text.e-label-bottom {
-  font-weight: 400;
+  font-weight: normal;
 }
 
 .e-float-input:not(.e-error) textarea:not(:focus):valid ~ label.e-float-text.e-label-bottom,
@@ -1368,7 +1370,7 @@ label.e-float-text,
 .e-small .e-float-input.e-control-wrapper:not(.e-error) textarea:not(:focus):valid ~ label.e-float-text.e-label-bottom,
 .e-float-input.e-control-wrapper.e-small.e-bigger:not(.e-error) textarea:not(:focus):valid ~ label.e-float-text.e-label-bottom,
 .e-bigger .e-float-input.e-control-wrapper.e-small:not(.e-error) textarea:not(:focus):valid ~ label.e-float-text.e-label-bottom {
-  font-weight: 400;
+  font-weight: normal;
 }
 
 .e-float-input:not(.e-input-group) .e-float-line::before,
@@ -1438,6 +1440,7 @@ label.e-float-text,
   transform-origin: right top;
 }
 
+/* stylelint-disable selector-max-empty-lines */
 .e-float-input.e-rtl:not(.e-input-focus) label.e-float-text.e-label-bottom,
 .e-rtl .e-float-input:not(.e-input-focus) label.e-float-text.e-label-bottom,
 .e-float-input.e-rtl.e-control-wrapper:not(.e-input-focus) label.e-float-text.e-label-bottom,
@@ -1534,6 +1537,7 @@ label.e-float-text,
   padding-right: 0;
 }
 
+/* stylelint-enable selector-max-empty-lines */
 .e-input-group.e-corner.e-rtl .e-input:first-child,
 .e-input-group.e-corner.e-rtl .e-input-group-icon:first-child,
 .e-input-group.e-control-wrapper.e-corner.e-rtl .e-input:first-child,
@@ -2067,22 +2071,22 @@ textarea.e-input:-moz-placeholder {
   user-select: none;
 }
 
-.e-input-group input.e-input:-moz-placeholder {
+.e-input-group input.e-input:-moz-placeholder { /* stylelint-disable-line selector-no-vendor-prefix */
   font-style: normal;
   user-select: none;
 }
 
-.e-input-group textarea.e-input:-moz-placeholder {
+.e-input-group textarea.e-input:-moz-placeholder { /* stylelint-disable-line selector-no-vendor-prefix */
   font-style: normal;
   user-select: none;
 }
 
-.e-input-group.e-control-wrapper input.e-input:-moz-placeholder {
+.e-input-group.e-control-wrapper input.e-input:-moz-placeholder { /* stylelint-disable-line selector-no-vendor-prefix */
   font-style: normal;
   user-select: none;
 }
 
-.e-input-group.e-control-wrapper textarea.e-input:-moz-placeholder {
+.e-input-group.e-control-wrapper textarea.e-input:-moz-placeholder { /* stylelint-disable-line selector-no-vendor-prefix */
   font-style: normal;
   user-select: none;
 }
@@ -2092,12 +2096,12 @@ input.e-input:-moz-placeholder {
   user-select: none;
 }
 
-.e-input-group input.e-input:-moz-placeholder {
+.e-input-group input.e-input:-moz-placeholder { /* stylelint-disable-line selector-no-vendor-prefix */
   font-style: normal;
   user-select: none;
 }
 
-.e-input-group.e-control-wrapper input.e-input:-moz-placeholder {
+.e-input-group.e-control-wrapper input.e-input:-moz-placeholder { /* stylelint-disable-line selector-no-vendor-prefix */
   font-style: normal;
   user-select: none;
 }
@@ -3674,7 +3678,7 @@ textarea.e-input.e-bigger.e-small,
 .e-float-input.e-control-wrapper textarea:not(:focus):valid ~ label.e-float-text.e-label-bottom {
   font-size: 13px;
   font-style: normal;
-  font-weight: 400;
+  font-weight: normal;
   left: 0;
   overflow: hidden;
   padding-left: 0;
@@ -4109,6 +4113,33 @@ textarea.e-outline.e-input,
   width: calc(100% - 1px);
 }
 
+.e-outline.e-float-input.e-control-wrapper.e-numeric label.e-float-text.e-label-bottom span.e-float-text-content.e-float-text-overflow {
+  width: calc(100% - 80px);
+}
+
+.e-outline.e-float-input.e-control-wrapper.e-numeric label.e-float-text.e-label-top span.e-float-text-content.e-float-text-overflow,
+.e-outline.e-float-input.e-control-wrapper label.e-float-text.e-label-top span.e-float-text-content.e-float-text-overflow,
+.e-outline.e-float-input.e-control-wrapper label.e-float-text.e-label-bottom span.e-float-text-content.e-float-text-overflow,
+.e-outline.e-float-input.e-control-wrapper.e-static-clear label.e-float-text.e-label-top span.e-float-text-content.e-float-text-overflow,
+.e-outline.e-float-input.e-control-wrapper.e-numeric.e-static-clear label.e-float-text.e-label-top span.e-float-text-content.e-float-text-overflow {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  width: 100%;
+}
+
+.e-outline.e-float-input.e-control-wrapper.e-static-clear label.e-float-text.e-label-bottom span.e-float-text-content.e-float-text-overflow,
+.e-outline.e-float-input.e-control-wrapper label.e-float-text.e-label-bottom span.e-float-text-content.e-float-text-overflow.e-icon {
+  width: calc(100% - 45px);
+}
+
+.e-outline.e-float-input.e-control-wrapper.e-static-clear label.e-float-text.e-label-bottom span.e-float-text-content.e-float-text-overflow.e-icon {
+  width: calc(100% - 75px);
+}
+
+.e-outline.e-float-input.e-control-wrapper.e-numeric.e-static-clear label.e-float-text.e-label-bottom span.e-float-text-content.e-float-text-overflow {
+  width: calc(100% - 110px);
+}
+
 .e-outline.e-float-input.e-input-group:not(.e-float-icon-left).e-input-focus .e-float-line::before,
 .e-outline.e-float-input.e-input-group:not(.e-float-icon-left).e-input-focus .e-float-line::after,
 .e-outline.e-float-input.e-input-group.e-float-icon-left.e-input-focus .e-input-in-wrap .e-float-line::before,
@@ -5880,7 +5911,7 @@ textarea.e-outline,
 .e-outline.e-float-input input:-webkit-autofill ~ label.e-float-text,
 .e-outline.e-float-input.e-control-wrapper.e-autofill input:-webkit-autofill ~ label.e-float-text,
 .e-outline.e-float-input.e-control-wrapper.e-autofill:not(.e-input-focus) input:not(:focus):valid:-webkit-autofill ~ label.e-float-text.e-label-bottom {
-  animation-name: slideTopUp;
+  animation-name: slideTopUp; /* stylelint-disable-line no-unknown-animations */
 }
 
 .e-outline.e-float-input textarea:-webkit-autofill ~ label.e-float-text,
@@ -5895,7 +5926,7 @@ textarea.e-outline,
 .e-bigger.e-outline.e-float-input.e-control-wrapper.e-autofill input:-webkit-autofill ~ label.e-float-text,
 .e-bigger .e-outline.e-float-input.e-control-wrapper.e-autofill:not(.e-input-focus) input:not(:focus):valid:-webkit-autofill ~ label.e-float-text.e-label-bottom,
 .e-bigger.e-outline.e-float-input.e-control-wrapper.e-autofill:not(.e-input-focus) input:not(:focus):valid:-webkit-autofill ~ label.e-float-text.e-label-bottom {
-  animation-name: slideTopUp;
+  animation-name: slideTopUp; /* stylelint-disable-line no-unknown-animations */
 }
 
 .e-bigger .e-outline.e-float-input textarea:-webkit-autofill ~ label.e-float-text,
@@ -5913,7 +5944,7 @@ textarea.e-outline,
 .e-small.e-outline.e-float-input.e-control-wrapper.e-autofill input:-webkit-autofill ~ label.e-float-text,
 .e-small .e-outline.e-float-input.e-control-wrapper.e-autofill:not(.e-input-focus) input:not(:focus):valid:-webkit-autofill ~ label.e-float-text.e-label-bottom,
 .e-small.e-outline.e-float-input.e-control-wrapper.e-autofill:not(.e-input-focus) input:not(:focus):valid:-webkit-autofill ~ label.e-float-text.e-label-bottom {
-  animation-name: slideTopUp;
+  animation-name: slideTopUp; /* stylelint-disable-line no-unknown-animations */
 }
 
 .e-small .e-outline.e-float-input textarea:-webkit-autofill ~ label.e-float-text,
@@ -5935,7 +5966,7 @@ textarea.e-outline,
 .e-small.e-bigger.e-outline.e-float-input.e-control-wrapper.e-autofill:not(.e-input-focus) input:not(:focus):valid:-webkit-autofill ~ label.e-float-text.e-label-bottom,
 .e-bigger .e-small.e-outline.e-float-input.e-control-wrapper.e-autofill:not(.e-input-focus) input:not(:focus):valid:-webkit-autofill ~ label.e-float-text.e-label-bottom,
 .e-small .e-bigger.e-outline.e-float-input.e-control-wrapper.e-autofill:not(.e-input-focus) input:not(:focus):valid:-webkit-autofill ~ label.e-float-text.e-label-bottom {
-  animation-name: slideTopUp;
+  animation-name: slideTopUp; /* stylelint-disable-line no-unknown-animations */
 }
 
 .e-bigger .e-outline.e-float-input.e-small textarea:-webkit-autofill ~ label.e-float-text,
@@ -9193,6 +9224,8 @@ textarea.e-input,
   color: rgba(0, 0, 0, 0.26);
 }
 
+/* stylelint-disable property-no-vendor-prefix */
+/* stylelint-disable selector-no-vendor-prefix */
 .e-input[disabled],
 .e-input-group .e-input[disabled],
 .e-input-group.e-control-wrapper .e-input[disabled],
@@ -12360,6 +12393,8 @@ textarea.e-filled.e-disabled.e-input::-webkit-input-placeholder {
   color: #ffca1c;
 }
 
+/* stylelint-disable-line no-empty-source */
+/* stylelint-disable property-no-vendor-prefix */
 @keyframes e-input-ripple {
   100% {
     opacity: 0;
@@ -12422,6 +12457,7 @@ textarea.e-filled.e-disabled.e-input::-webkit-input-placeholder {
   font-size: 12px;
 }
 
+/* stylelint-disable property-no-vendor-prefix */
 @keyframes e-input-ripple {
   100% {
     opacity: 0;
@@ -12470,6 +12506,8 @@ textarea.e-filled.e-disabled.e-input::-webkit-input-placeholder {
   color: #f44336;
 }
 
+/* stylelint-disable-line no-empty-source */
+/* stylelint-disable property-no-vendor-prefix */
 .e-control-wrapper.e-slider-container.e-material-slider .e-slider .e-handle.e-material-handle {
   cursor: default;
   transition: transform 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
@@ -12486,7 +12524,9 @@ textarea.e-filled.e-disabled.e-input::-webkit-input-placeholder {
   background-color: #e3165b;
   border: 0;
   border-radius: 8px;
+  /* stylelint-disable */
   cursor: grab;
+  /* stylelint-enable */
   opacity: 1;
 }
 .e-slider-tooltip.e-tooltip-wrap.e-popup.e-popup.e-popup-close {
@@ -12513,7 +12553,9 @@ textarea.e-filled.e-disabled.e-input::-webkit-input-placeholder {
   border-right-color: rgba(0, 0, 0, 0.26);
 }
 .e-slider-tooltip.e-tooltip-wrap.e-popup.e-tooltip-active {
+  /* stylelint-disable */
   cursor: grabbing;
+  /* stylelint-enable */
 }
 .e-slider-tooltip.e-tooltip-wrap.e-popup .e-arrow-tip {
   visibility: visible;
@@ -12555,14 +12597,18 @@ textarea.e-filled.e-disabled.e-input::-webkit-input-placeholder {
   border-bottom-right-radius: 0%;
   border-top-left-radius: 50%;
   border-top-right-radius: 50%;
+  /* stylelint-disable */
   cursor: grab;
+  /* stylelint-enable */
   opacity: 1;
 }
 .e-slider-tooltip.e-tooltip-wrap.e-popup.e-tooltip-wrap.e-popup.e-material-default.e-material-tooltip-start {
   background-color: rgba(0, 0, 0, 0.26);
 }
 .e-slider-tooltip.e-tooltip-wrap.e-popup.e-tooltip-wrap.e-popup.e-material-default.e-tooltip-active {
+  /* stylelint-disable */
   cursor: grabbing;
+  /* stylelint-enable */
 }
 .e-slider-tooltip.e-tooltip-wrap.e-popup.e-tooltip-wrap.e-popup.e-material-default .e-arrow-tip {
   visibility: hidden;
@@ -12666,7 +12712,7 @@ textarea.e-filled.e-disabled.e-input::-webkit-input-placeholder {
 }
 .e-control-wrapper.e-slider-container.e-disabled .e-slider .e-handle {
   background: #757575;
-  transform: scale(0.5) !important;
+  transform: scale(0.5) !important; /* stylelint-disable-line declaration-no-important */
 }
 .e-control-wrapper.e-slider-container.e-disabled .e-slider .e-handle.e-handle-first {
   background-color: #757575;
@@ -12878,10 +12924,14 @@ textarea.e-filled.e-disabled.e-input::-webkit-input-placeholder {
   transition: left 300ms ease-out, right 300ms ease-out, bottom 300ms ease-out, transform 300ms ease-out;
   width: 12px;
   z-index: 10;
+  /* stylelint-disable */
   cursor: grab;
+  /* stylelint-enable */
 }
 .e-control-wrapper.e-slider-container .e-slider .e-handle.e-handle-active {
+  /* stylelint-disable */
   cursor: grabbing;
+  /* stylelint-enable */
 }
 .e-control-wrapper.e-slider-container .e-slider .e-handle.e-handle-start {
   background-color: #fff;
@@ -12907,6 +12957,10 @@ textarea.e-filled.e-disabled.e-input::-webkit-input-placeholder {
   width: 32px;
   z-index: -1;
 }
+.e-control-wrapper.e-slider-container .e-slider .e-handle.e-tab-handle {
+  /* stylelint-disable */
+  /* stylelint-enable */
+}
 .e-control-wrapper.e-slider-container .e-slider .e-handle.e-tab-handle.e-handle-start::after {
   background-color: #e0e0e0;
   opacity: 0.38;
@@ -13092,6 +13146,7 @@ textarea.e-filled.e-disabled.e-input::-webkit-input-placeholder {
 .e-control-wrapper.e-slider-container.e-slider-hover .e-handle {
   border-color: #e3165b;
 }
+/* stylelint-disable property-no-vendor-prefix */
 @keyframes e-input-ripple {
   100% {
     opacity: 0;
@@ -13106,6 +13161,8 @@ textarea.e-filled.e-disabled.e-input::-webkit-input-placeholder {
     transform: translate3d(0, 0, 0) scale(1);
   }
 }
+/* stylelint-disable-line no-empty-source */ /* stylelint-disable-line no-empty-source */
+/* stylelint-disable property-no-vendor-prefix */
 @keyframes material-spinner-rotate {
   0% {
     transform: rotate(0deg);
@@ -13910,6 +13967,7 @@ textarea.e-filled.e-disabled.e-input::-webkit-input-placeholder {
   box-shadow: 0 0 0 transparent;
 }
 
+/* stylelint-disable property-no-vendor-prefix */
 @keyframes e-input-ripple {
   100% {
     opacity: 0;
@@ -14002,6 +14060,7 @@ textarea.e-filled.e-disabled.e-input::-webkit-input-placeholder {
   line-height: 0;
 }
 
+/* stylelint-disable property-no-vendor-prefix */
 .e-colorpicker.e-modal, .e-colorpicker.e-hsv-model {
   -webkit-overflow-scrolling: touch;
   height: 100%;

package/styles/numerictextbox/_all.scss

@@ -0,0 +1,2 @@
+@import 'layout.scss';
+@import 'theme.scss';

package/styles/numerictextbox/_bootstrap-dark-definition.scss

@@ -0,0 +1,6 @@
+//default
+$numeric-skin-name: 'bootstrap' !default;
+$numeric-input-icon-size: 12px !default;
+$numeric-input-bigger-icon-size: 14px !default;
+
+//enddefault

package/styles/numerictextbox/_bootstrap-definition.scss

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

package/styles/numerictextbox/_bootstrap4-definition.scss

@@ -0,0 +1,3 @@
+$numeric-skin-name: 'bootstrap4' !default;
+$numeric-input-icon-size: 8px !default;
+$numeric-input-bigger-icon-size: 10px !default;

package/styles/numerictextbox/_bootstrap5-dark-definition.scss

@@ -0,0 +1 @@
+@import './bootstrap5-definition.scss';

package/styles/numerictextbox/_bootstrap5-definition.scss

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

package/styles/numerictextbox/_fabric-dark-definition.scss

@@ -0,0 +1,6 @@
+//default
+$numeric-skin-name: 'fabric' !default;
+$numeric-input-icon-size: 12px !default;
+$numeric-input-bigger-icon-size: 12px !default;
+
+//enddefault

package/styles/numerictextbox/_fabric-definition.scss

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

package/styles/numerictextbox/_fluent-dark-definition.scss

@@ -0,0 +1 @@
+@import './fluent-definition.scss';

package/styles/numerictextbox/_fluent-definition.scss

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

package/styles/numerictextbox/_fusionnew-definition.scss

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

package/styles/numerictextbox/_highcontrast-definition.scss

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

package/styles/numerictextbox/_highcontrast-light-definition.scss

@@ -0,0 +1,6 @@
+//default
+$numeric-skin-name: 'highcontrast' !default;
+$numeric-input-icon-size: 14px !default;
+$numeric-input-bigger-icon-size: 12px !default;
+
+//enddefault

package/styles/numerictextbox/_layout.scss

@@ -0,0 +1,30 @@
+.e-numeric-container {
+  width: 100%;
+}
+
+.e-content-placeholder.e-numeric.e-placeholder-numeric {
+  background-size: 300px 33px;
+  min-height: 33px;
+}
+
+.e-bigger.e-content-placeholder.e-numeric.e-placeholder-numeric,
+.e-bigger .e-content-placeholder.e-numeric.e-placeholder-numeric {
+  background-size: 300px 40px;
+  min-height: 40px;
+}
+
+// Hidden element styles
+.e-float-input.e-input-group.e-control-wrapper.e-numeric .e-numeric-hidden,
+.e-input-group.e-control-wrapper.e-numeric .e-numeric-hidden,
+.e-float-input.e-control-wrapper.e-numeric .e-numeric-hidden,
+.e-float-input.e-input-group.e-control-wrapper.e-numeric.e-input-focus .e-numeric-hidden,
+.e-input-group.e-control-wrapper.e-numeric.e-input-focus .e-numeric-hidden,
+.e-float-input.e-control-wrapper.e-numeric.e-input-focus .e-numeric-hidden {
+  border: 0;
+  height: 0;
+  margin: 0;
+  padding: 0;
+  text-indent: 0;
+  visibility: hidden;
+  width: 0;
+}

package/styles/numerictextbox/_material-dark-definition.scss

@@ -0,0 +1,6 @@
+//default
+$numeric-skin-name: 'material' !default;
+$numeric-input-icon-size: 12px !default;
+$numeric-input-bigger-icon-size: 12px !default;
+
+//enddefault

package/styles/numerictextbox/_material-definition.scss

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

package/styles/numerictextbox/_material3-definition.scss

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

package/styles/numerictextbox/_tailwind-dark-definition.scss

@@ -0,0 +1 @@
+@import './tailwind-definition.scss';

package/styles/numerictextbox/_tailwind-definition.scss

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

package/styles/numerictextbox/_theme.scss

@@ -0,0 +1,39 @@
+@include export-module('numerictextbox-theme') {
+  .e-numeric.e-control-wrapper {
+    #{if(&, '&', '*')}.e-input-group:not(.e-disabled):active:not(.e-success):not(.e-warning):not(.e-error):not(.e-input-focus) {
+      @if $numeric-skin-name == 'bootstrap' {
+        border-color: $input-group-full-border-color;
+        box-shadow: none;
+      }
+    }
+
+    #{if(&, '&', '*')}.e-input-group .e-input-group-icon {
+      font-size: $numeric-input-icon-size;
+    }
+  }
+
+  .e-bigger {
+    #{if(&, '&', '*')} .e-control-wrapper.e-numeric.e-input-group .e-input-group-icon,
+    #{if(&, '&', '*')}.e-control-wrapper.e-numeric.e-input-group .e-input-group-icon {
+      font-size: $numeric-input-bigger-icon-size;
+    }
+  }
+
+  .e-small {
+    #{if(&, '&', '*')} .e-control-wrapper.e-numeric.e-input-group .e-input-group-icon,
+    #{if(&, '&', '*')}.e-control-wrapper.e-numeric.e-input-group .e-input-group-icon {
+      @if ($input-skin-name == 'FluentUI') {
+        font-size: $numeric-input-small-icon-size;
+      }
+    }
+  }
+
+  .e-small.e-bigger .e-control-wrapper.e-numeric.e-input-group .e-input-group-icon,
+  .e-small.e-bigger.e-control-wrapper.e-numeric.e-input-group .e-input-group-icon,
+  .e-small .e-bigger.e-control-wrapper.e-numeric.e-input-group .e-input-group-icon,
+  .e-bigger .e-small.e-control-wrapper.e-numeric.e-input-group .e-input-group-icon {
+    @if ($input-skin-name == 'FluentUI') {
+      font-size: $numeric-input-bigger-small-icon-size;
+    }
+  }
+}

package/styles/numerictextbox/bootstrap-dark.css

@@ -1,3 +1,4 @@
+/* stylelint-disable property-no-vendor-prefix */
 .e-input-group-icon.e-spin-up::before {
   content: "\e834";
   font-family: "e-icons";

package/styles/numerictextbox/bootstrap-dark.scss

@@ -1 +1,5 @@
-@import 'ej2-inputs/styles/numerictextbox/bootstrap-dark.scss';
+@import 'ej2-base/styles/bootstrap-dark-definition.scss';
+@import '../input/bootstrap-dark-definition.scss';
+@import 'bootstrap-dark-definition.scss';
+@import 'icons/bootstrap-dark.scss';
+@import 'all.scss';

package/styles/numerictextbox/bootstrap.css

@@ -1,3 +1,4 @@
+/* stylelint-disable property-no-vendor-prefix */
 .e-input-group-icon.e-spin-up::before {
   content: "\e834";
   font-family: "e-icons";

package/styles/numerictextbox/bootstrap.scss

@@ -1 +1,5 @@
-@import 'ej2-inputs/styles/numerictextbox/bootstrap.scss';
+@import 'ej2-base/styles/bootstrap-definition.scss';
+@import '../input/bootstrap-definition.scss';
+@import 'bootstrap-definition.scss';
+@import 'icons/bootstrap.scss';
+@import 'all.scss';

package/styles/numerictextbox/bootstrap4.css

@@ -1,3 +1,4 @@
+/* stylelint-disable property-no-vendor-prefix */
 .e-input-group-icon.e-spin-up::before {
   content: "\e721";
   font-family: "e-icons";

package/styles/numerictextbox/bootstrap4.scss

@@ -1 +1,5 @@
-@import 'ej2-inputs/styles/numerictextbox/bootstrap4.scss';
+@import 'ej2-base/styles/bootstrap4-definition.scss';
+@import '../input/bootstrap4-definition.scss';
+@import 'bootstrap4-definition.scss';
+@import 'icons/bootstrap4.scss';
+@import 'all.scss';

package/styles/numerictextbox/bootstrap5-dark.css

@@ -1,3 +1,4 @@
+/* stylelint-disable property-no-vendor-prefix */
 .e-input-group-icon.e-spin-up::before {
   content: "\e776";
   font-family: "e-icons";

package/styles/numerictextbox/bootstrap5-dark.scss

@@ -1 +1,5 @@
-@import 'ej2-inputs/styles/numerictextbox/bootstrap5-dark.scss';
+@import 'ej2-base/styles/bootstrap5-dark-definition.scss';
+@import '../input/bootstrap5-dark-definition.scss';
+@import 'bootstrap5-dark-definition.scss';
+@import 'icons/bootstrap5-dark.scss';
+@import 'all.scss';

package/styles/numerictextbox/bootstrap5.css

@@ -1,3 +1,4 @@
+/* stylelint-disable property-no-vendor-prefix */
 .e-input-group-icon.e-spin-up::before {
   content: "\e776";
   font-family: "e-icons";

package/styles/numerictextbox/bootstrap5.scss

@@ -1 +1,5 @@
-@import 'ej2-inputs/styles/numerictextbox/bootstrap5.scss';
+@import 'ej2-base/styles/bootstrap5-definition.scss';
+@import '../input/bootstrap5-definition.scss';
+@import 'bootstrap5-definition.scss';
+@import 'icons/bootstrap5.scss';
+@import 'all.scss';

package/styles/numerictextbox/fabric-dark.css

@@ -1,3 +1,4 @@
+/* stylelint-disable property-no-vendor-prefix */
 .e-input-group-icon.e-spin-up::before {
   content: "\e85e";
   font-family: "e-icons";

package/styles/numerictextbox/fabric-dark.scss

@@ -1 +1,5 @@
-@import 'ej2-inputs/styles/numerictextbox/fabric-dark.scss';
+@import 'ej2-base/styles/fabric-dark-definition.scss';
+@import '../input/fabric-dark-definition.scss';
+@import 'fabric-dark-definition.scss';
+@import 'icons/fabric-dark.scss';
+@import 'all.scss';

package/styles/numerictextbox/fabric.css

@@ -1,3 +1,4 @@
+/* stylelint-disable property-no-vendor-prefix */
 .e-input-group-icon.e-spin-up::before {
   content: "\e85e";
   font-family: "e-icons";

package/styles/numerictextbox/fabric.scss

@@ -1 +1,5 @@
-@import 'ej2-inputs/styles/numerictextbox/fabric.scss';
+@import 'ej2-base/styles/fabric-definition.scss';
+@import '../input/fabric-definition.scss';
+@import 'fabric-definition.scss';
+@import 'icons/fabric.scss';
+@import 'all.scss';

package/styles/numerictextbox/fluent-dark.css

@@ -1,3 +1,4 @@
+/* stylelint-disable property-no-vendor-prefix */
 .e-input-group-icon.e-spin-up::before {
   content: "\e776";
   font-family: "e-icons";

package/styles/numerictextbox/fluent-dark.scss

@@ -1 +1,5 @@
-@import 'ej2-inputs/styles/numerictextbox/fluent-dark.scss';
+@import 'ej2-base/styles/fluent-dark-definition.scss';
+@import '../input/fluent-dark-definition.scss';
+@import 'fluent-dark-definition.scss';
+@import 'icons/fluent-dark.scss';
+@import 'all.scss';

package/styles/numerictextbox/fluent.css

@@ -1,3 +1,4 @@
+/* stylelint-disable property-no-vendor-prefix */
 .e-input-group-icon.e-spin-up::before {
   content: "\e776";
   font-family: "e-icons";

package/styles/numerictextbox/fluent.scss

@@ -1 +1,5 @@
-@import 'ej2-inputs/styles/numerictextbox/fluent.scss';
+@import 'ej2-base/styles/fluent-definition.scss';
+@import '../input/fluent-definition.scss';
+@import 'fluent-definition.scss';
+@import 'icons/fluent.scss';
+@import 'all.scss';

package/styles/numerictextbox/highcontrast-light.css

@@ -1,3 +1,4 @@
+/* stylelint-disable property-no-vendor-prefix */
 .e-input-group-icon.e-spin-up::before {
   content: "\e85e";
   font-family: "e-icons";

package/styles/numerictextbox/highcontrast-light.scss

@@ -1 +1,5 @@
-@import 'ej2-inputs/styles/numerictextbox/highcontrast-light.scss';
+@import 'ej2-base/styles/highcontrast-light-definition.scss';
+@import '../input/highcontrast-light-definition.scss';
+@import 'highcontrast-light-definition.scss';
+@import 'icons/highcontrast-light.scss';
+@import 'all.scss';