@syncfusion/ej2-react-inputs 19.2.48 → 19.3.43

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (71) hide show
  1. package/CHANGELOG.md +10 -0
  2. package/dist/ej2-react-inputs.umd.min.js +1 -1
  3. package/package.json +8 -8
  4. package/styles/bootstrap-dark.css +14 -6
  5. package/styles/bootstrap.css +14 -6
  6. package/styles/bootstrap4.css +22 -12
  7. package/styles/bootstrap5-dark.css +7548 -0
  8. package/styles/bootstrap5-dark.scss +7 -0
  9. package/styles/bootstrap5.css +7548 -0
  10. package/styles/bootstrap5.scss +7 -0
  11. package/styles/color-picker/bootstrap5-dark.css +964 -0
  12. package/styles/color-picker/bootstrap5-dark.scss +1 -0
  13. package/styles/color-picker/bootstrap5.css +964 -0
  14. package/styles/color-picker/bootstrap5.scss +1 -0
  15. package/styles/fabric-dark.css +15 -7
  16. package/styles/fabric.css +15 -7
  17. package/styles/highcontrast-light.css +15 -7
  18. package/styles/highcontrast.css +16 -8
  19. package/styles/input/bootstrap-dark.css +12 -3
  20. package/styles/input/bootstrap.css +12 -3
  21. package/styles/input/bootstrap4.css +15 -3
  22. package/styles/input/bootstrap5-dark.css +4670 -0
  23. package/styles/input/bootstrap5-dark.scss +1 -0
  24. package/styles/input/bootstrap5.css +4670 -0
  25. package/styles/input/bootstrap5.scss +1 -0
  26. package/styles/input/fabric-dark.css +12 -3
  27. package/styles/input/fabric.css +13 -4
  28. package/styles/input/highcontrast-light.css +12 -3
  29. package/styles/input/highcontrast.css +13 -4
  30. package/styles/input/material-dark.css +2320 -201
  31. package/styles/input/material.css +12 -3
  32. package/styles/input/tailwind-dark.css +40 -9
  33. package/styles/input/tailwind.css +40 -9
  34. package/styles/maskedtextbox/bootstrap5-dark.css +33 -0
  35. package/styles/maskedtextbox/bootstrap5-dark.scss +1 -0
  36. package/styles/maskedtextbox/bootstrap5.css +33 -0
  37. package/styles/maskedtextbox/bootstrap5.scss +1 -0
  38. package/styles/material-dark.css +2337 -218
  39. package/styles/material.css +14 -5
  40. package/styles/numerictextbox/bootstrap5-dark.css +48 -0
  41. package/styles/numerictextbox/bootstrap5-dark.scss +1 -0
  42. package/styles/numerictextbox/bootstrap5.css +48 -0
  43. package/styles/numerictextbox/bootstrap5.scss +1 -0
  44. package/styles/slider/bootstrap-dark.css +2 -3
  45. package/styles/slider/bootstrap.css +2 -3
  46. package/styles/slider/bootstrap4.css +7 -9
  47. package/styles/slider/bootstrap5-dark.css +749 -0
  48. package/styles/slider/bootstrap5-dark.scss +1 -0
  49. package/styles/slider/bootstrap5.css +749 -0
  50. package/styles/slider/bootstrap5.scss +1 -0
  51. package/styles/slider/fabric-dark.css +3 -4
  52. package/styles/slider/fabric.css +2 -3
  53. package/styles/slider/highcontrast-light.css +3 -4
  54. package/styles/slider/highcontrast.css +3 -4
  55. package/styles/slider/material-dark.css +16 -16
  56. package/styles/slider/material.css +2 -2
  57. package/styles/slider/tailwind-dark.css +9 -8
  58. package/styles/slider/tailwind.css +7 -3
  59. package/styles/tailwind-dark.css +61 -29
  60. package/styles/tailwind.css +59 -24
  61. package/styles/textbox/bootstrap5-dark.css +0 -0
  62. package/styles/textbox/bootstrap5-dark.scss +1 -0
  63. package/styles/textbox/bootstrap5.css +0 -0
  64. package/styles/textbox/bootstrap5.scss +1 -0
  65. package/styles/uploader/bootstrap5-dark.css +1079 -0
  66. package/styles/uploader/bootstrap5-dark.scss +1 -0
  67. package/styles/uploader/bootstrap5.css +1079 -0
  68. package/styles/uploader/bootstrap5.scss +1 -0
  69. package/styles/uploader/material-dark.css +1 -1
  70. package/styles/uploader/tailwind-dark.css +12 -12
  71. package/styles/uploader/tailwind.css +12 -12
package/styles/input/material.css CHANGED
@@ -9584,22 +9584,31 @@ textarea.e-input::-webkit-input-placeholder {
9584
9584
  }
9585
9585
 
9586
9586
  .e-input-group.e-success .e-input-group-icon,
9587
+ .e-input-group.e-control-wrapper.e-success .e-input-group-icon {
9588
+ color: rgba(0, 0, 0, 0.54);
9589
+ }
9590
+
9587
9591
  .e-input-group.e-success:not(.e-disabled):not(:active) .e-input-group-icon:hover,
9588
- .e-input-group.e-control-wrapper.e-success .e-input-group-icon,
9589
9592
  .e-input-group.e-control-wrapper.e-success:not(.e-disabled):not(:active) .e-input-group-icon:hover {
9590
9593
  color: rgba(0, 0, 0, 0.54);
9591
9594
  }
9592
9595
 
9593
9596
  .e-input-group.e-warning .e-input-group-icon,
9597
+ .e-input-group.e-control-wrapper.e-warning .e-input-group-icon {
9598
+ color: rgba(0, 0, 0, 0.54);
9599
+ }
9600
+
9594
9601
  .e-input-group.e-warning:not(.e-disabled):not(:active) .e-input-group-icon:hover,
9595
- .e-input-group.e-control-wrapper.e-warning .e-input-group-icon,
9596
9602
  .e-input-group.e-control-wrapper.e-warning:not(.e-disabled):not(:active) .e-input-group-icon:hover {
9597
9603
  color: rgba(0, 0, 0, 0.54);
9598
9604
  }
9599
9605
 
9600
9606
  .e-input-group.e-error .e-input-group-icon,
9607
+ .e-input-group.e-control-wrapper.e-error .e-input-group-icon {
9608
+ color: rgba(0, 0, 0, 0.54);
9609
+ }
9610
+
9601
9611
  .e-input-group.e-error:not(.e-disabled):not(:active) .e-input-group-icon:hover,
9602
- .e-input-group.e-control-wrapper.e-error .e-input-group-icon,
9603
9612
  .e-input-group.e-control-wrapper.e-error:not(.e-disabled):not(:active) .e-input-group-icon:hover {
9604
9613
  color: rgba(0, 0, 0, 0.54);
9605
9614
  }
package/styles/input/tailwind-dark.css CHANGED
@@ -239,6 +239,28 @@ textarea.e-input.e-bigger,
239
239
  border-left-width: 0;
240
240
  }
241
241
 
242
+ .e-input-group .e-input-group-icon:last-child,
243
+ .e-input-group.e-control-wrapper .e-input-group-icon:last-child {
244
+ border-bottom-right-radius: 3px;
245
+ border-top-right-radius: 3px;
246
+ }
247
+
248
+ .e-input-group .e-input-group-icon:first-child,
249
+ .e-input-group.e-control-wrapper .e-input-group-icon:first-child {
250
+ border-bottom-left-radius: 3px;
251
+ border-top-left-radius: 3px;
252
+ }
253
+
254
+ .e-input-group.e-rtl .e-input-group-icon:last-child,
255
+ .e-input-group.e-control-wrapper.e-rtl .e-input-group-icon:last-child,
256
+ .e-rtl .e-input-group .e-input-group-icon:last-child,
257
+ .e-rtl .e-input-group.e-control-wrapper .e-input-group-icon:last-child {
258
+ border-bottom-left-radius: 3px;
259
+ border-bottom-right-radius: 0;
260
+ border-top-left-radius: 3px;
261
+ border-top-right-radius: 0;
262
+ }
263
+
242
264
  .e-input-group.e-bigger .e-input-group-icon,
243
265
  .e-input-group .e-input-group-icon.e-bigger,
244
266
  .e-bigger .e-input-group .e-input-group-icon,
@@ -638,7 +660,7 @@ label.e-float-text,
638
660
  font-size: 12px;
639
661
  font-weight: 500;
640
662
  padding-right: 0;
641
- transform: translate3d(-10px, -33px, 0) scale(1);
663
+ transform: translate3d(-10px, -35px, 0) scale(1);
642
664
  }
643
665
 
644
666
  .e-float-input.e-small input:focus ~ label.e-float-text,
@@ -672,7 +694,7 @@ label.e-float-text,
672
694
  font-size: 12px;
673
695
  font-weight: 500;
674
696
  padding-right: 0;
675
- transform: translate3d(-10px, -32px, 0) scale(1);
697
+ transform: translate3d(-10px, -34px, 0) scale(1);
676
698
  }
677
699
 
678
700
  .e-float-input.e-bigger input:focus ~ label.e-float-text,
@@ -705,7 +727,7 @@ label.e-float-text,
705
727
  .e-bigger .e-float-input.e-control-wrapper.e-input-focus input ~ label.e-float-text {
706
728
  font-weight: 500;
707
729
  padding-right: 0;
708
- transform: translate3d(-10px, -35px, 0) scale(1);
730
+ transform: translate3d(-10px, -37px, 0) scale(1);
709
731
  }
710
732
 
711
733
  .e-float-input.e-bigger.e-small input:focus ~ label.e-float-text,
@@ -1847,7 +1869,7 @@ input.e-input.e-bigger,
1847
1869
  .e-bigger .e-float-input.e-control-wrapper input,
1848
1870
  .e-bigger .e-float-input.e-control-wrapper input.e-input {
1849
1871
  box-sizing: border-box;
1850
- height: 32px;
1872
+ height: 36px;
1851
1873
  }
1852
1874
 
1853
1875
  .e-float-input.e-bigger:not(.e-input-group) input,
@@ -3048,7 +3070,7 @@ textarea.e-input.e-bigger.e-small,
3048
3070
  .e-float-input.e-control-wrapper.e-bigger textarea:not(:focus):valid ~ label.e-float-text.e-label-bottom,
3049
3071
  .e-bigger .e-float-input.e-control-wrapper textarea:not(:focus):valid ~ label.e-float-text.e-label-bottom {
3050
3072
  font-size: 16px;
3051
- top: 18px;
3073
+ top: -11px;
3052
3074
  }
3053
3075
 
3054
3076
  .e-float-input.e-small textarea ~ label.e-float-text,
@@ -3559,7 +3581,7 @@ textarea.e-input,
3559
3581
  .e-bigger textarea.e-input,
3560
3582
  input.e-input.e-bigger,
3561
3583
  textarea.e-input.e-bigger {
3562
- min-height: 32px;
3584
+ min-height: 36px;
3563
3585
  }
3564
3586
 
3565
3587
  .e-filled.e-input-group,
@@ -3963,22 +3985,31 @@ textarea.e-input::-webkit-input-placeholder {
3963
3985
  }
3964
3986
 
3965
3987
  .e-input-group.e-success .e-input-group-icon,
3988
+ .e-input-group.e-control-wrapper.e-success .e-input-group-icon {
3989
+ color: #d1d5db;
3990
+ }
3991
+
3966
3992
  .e-input-group.e-success:not(.e-disabled):not(:active) .e-input-group-icon:hover,
3967
- .e-input-group.e-control-wrapper.e-success .e-input-group-icon,
3968
3993
  .e-input-group.e-control-wrapper.e-success:not(.e-disabled):not(:active) .e-input-group-icon:hover {
3969
3994
  color: #d1d5db;
3970
3995
  }
3971
3996
 
3972
3997
  .e-input-group.e-warning .e-input-group-icon,
3998
+ .e-input-group.e-control-wrapper.e-warning .e-input-group-icon {
3999
+ color: #d1d5db;
4000
+ }
4001
+
3973
4002
  .e-input-group.e-warning:not(.e-disabled):not(:active) .e-input-group-icon:hover,
3974
- .e-input-group.e-control-wrapper.e-warning .e-input-group-icon,
3975
4003
  .e-input-group.e-control-wrapper.e-warning:not(.e-disabled):not(:active) .e-input-group-icon:hover {
3976
4004
  color: #d1d5db;
3977
4005
  }
3978
4006
 
3979
4007
  .e-input-group.e-error .e-input-group-icon,
4008
+ .e-input-group.e-control-wrapper.e-error .e-input-group-icon {
4009
+ color: #d1d5db;
4010
+ }
4011
+
3980
4012
  .e-input-group.e-error:not(.e-disabled):not(:active) .e-input-group-icon:hover,
3981
- .e-input-group.e-control-wrapper.e-error .e-input-group-icon,
3982
4013
  .e-input-group.e-control-wrapper.e-error:not(.e-disabled):not(:active) .e-input-group-icon:hover {
3983
4014
  color: #d1d5db;
3984
4015
  }
package/styles/input/tailwind.css CHANGED
@@ -239,6 +239,28 @@ textarea.e-input.e-bigger,
239
239
  border-left-width: 0;
240
240
  }
241
241
 
242
+ .e-input-group .e-input-group-icon:last-child,
243
+ .e-input-group.e-control-wrapper .e-input-group-icon:last-child {
244
+ border-bottom-right-radius: 3px;
245
+ border-top-right-radius: 3px;
246
+ }
247
+
248
+ .e-input-group .e-input-group-icon:first-child,
249
+ .e-input-group.e-control-wrapper .e-input-group-icon:first-child {
250
+ border-bottom-left-radius: 3px;
251
+ border-top-left-radius: 3px;
252
+ }
253
+
254
+ .e-input-group.e-rtl .e-input-group-icon:last-child,
255
+ .e-input-group.e-control-wrapper.e-rtl .e-input-group-icon:last-child,
256
+ .e-rtl .e-input-group .e-input-group-icon:last-child,
257
+ .e-rtl .e-input-group.e-control-wrapper .e-input-group-icon:last-child {
258
+ border-bottom-left-radius: 3px;
259
+ border-bottom-right-radius: 0;
260
+ border-top-left-radius: 3px;
261
+ border-top-right-radius: 0;
262
+ }
263
+
242
264
  .e-input-group.e-bigger .e-input-group-icon,
243
265
  .e-input-group .e-input-group-icon.e-bigger,
244
266
  .e-bigger .e-input-group .e-input-group-icon,
@@ -638,7 +660,7 @@ label.e-float-text,
638
660
  font-size: 12px;
639
661
  font-weight: 500;
640
662
  padding-right: 0;
641
- transform: translate3d(-10px, -33px, 0) scale(1);
663
+ transform: translate3d(-10px, -35px, 0) scale(1);
642
664
  }
643
665
 
644
666
  .e-float-input.e-small input:focus ~ label.e-float-text,
@@ -672,7 +694,7 @@ label.e-float-text,
672
694
  font-size: 12px;
673
695
  font-weight: 500;
674
696
  padding-right: 0;
675
- transform: translate3d(-10px, -32px, 0) scale(1);
697
+ transform: translate3d(-10px, -34px, 0) scale(1);
676
698
  }
677
699
 
678
700
  .e-float-input.e-bigger input:focus ~ label.e-float-text,
@@ -705,7 +727,7 @@ label.e-float-text,
705
727
  .e-bigger .e-float-input.e-control-wrapper.e-input-focus input ~ label.e-float-text {
706
728
  font-weight: 500;
707
729
  padding-right: 0;
708
- transform: translate3d(-10px, -35px, 0) scale(1);
730
+ transform: translate3d(-10px, -37px, 0) scale(1);
709
731
  }
710
732
 
711
733
  .e-float-input.e-bigger.e-small input:focus ~ label.e-float-text,
@@ -1847,7 +1869,7 @@ input.e-input.e-bigger,
1847
1869
  .e-bigger .e-float-input.e-control-wrapper input,
1848
1870
  .e-bigger .e-float-input.e-control-wrapper input.e-input {
1849
1871
  box-sizing: border-box;
1850
- height: 32px;
1872
+ height: 36px;
1851
1873
  }
1852
1874
 
1853
1875
  .e-float-input.e-bigger:not(.e-input-group) input,
@@ -3048,7 +3070,7 @@ textarea.e-input.e-bigger.e-small,
3048
3070
  .e-float-input.e-control-wrapper.e-bigger textarea:not(:focus):valid ~ label.e-float-text.e-label-bottom,
3049
3071
  .e-bigger .e-float-input.e-control-wrapper textarea:not(:focus):valid ~ label.e-float-text.e-label-bottom {
3050
3072
  font-size: 16px;
3051
- top: 18px;
3073
+ top: -11px;
3052
3074
  }
3053
3075
 
3054
3076
  .e-float-input.e-small textarea ~ label.e-float-text,
@@ -3559,7 +3581,7 @@ textarea.e-input,
3559
3581
  .e-bigger textarea.e-input,
3560
3582
  input.e-input.e-bigger,
3561
3583
  textarea.e-input.e-bigger {
3562
- min-height: 32px;
3584
+ min-height: 36px;
3563
3585
  }
3564
3586
 
3565
3587
  .e-filled.e-input-group,
@@ -3963,22 +3985,31 @@ textarea.e-input::-webkit-input-placeholder {
3963
3985
  }
3964
3986
 
3965
3987
  .e-input-group.e-success .e-input-group-icon,
3988
+ .e-input-group.e-control-wrapper.e-success .e-input-group-icon {
3989
+ color: #6b7280;
3990
+ }
3991
+
3966
3992
  .e-input-group.e-success:not(.e-disabled):not(:active) .e-input-group-icon:hover,
3967
- .e-input-group.e-control-wrapper.e-success .e-input-group-icon,
3968
3993
  .e-input-group.e-control-wrapper.e-success:not(.e-disabled):not(:active) .e-input-group-icon:hover {
3969
3994
  color: #6b7280;
3970
3995
  }
3971
3996
 
3972
3997
  .e-input-group.e-warning .e-input-group-icon,
3998
+ .e-input-group.e-control-wrapper.e-warning .e-input-group-icon {
3999
+ color: #6b7280;
4000
+ }
4001
+
3973
4002
  .e-input-group.e-warning:not(.e-disabled):not(:active) .e-input-group-icon:hover,
3974
- .e-input-group.e-control-wrapper.e-warning .e-input-group-icon,
3975
4003
  .e-input-group.e-control-wrapper.e-warning:not(.e-disabled):not(:active) .e-input-group-icon:hover {
3976
4004
  color: #6b7280;
3977
4005
  }
3978
4006
 
3979
4007
  .e-input-group.e-error .e-input-group-icon,
4008
+ .e-input-group.e-control-wrapper.e-error .e-input-group-icon {
4009
+ color: #6b7280;
4010
+ }
4011
+
3980
4012
  .e-input-group.e-error:not(.e-disabled):not(:active) .e-input-group-icon:hover,
3981
- .e-input-group.e-control-wrapper.e-error .e-input-group-icon,
3982
4013
  .e-input-group.e-control-wrapper.e-error:not(.e-disabled):not(:active) .e-input-group-icon:hover {
3983
4014
  color: #6b7280;
3984
4015
  }
package/styles/maskedtextbox/bootstrap5-dark.css ADDED
@@ -0,0 +1,33 @@
1
+ /*! maskedtextbox layout */
2
+ .e-control-wrapper.e-mask .e-maskedtextbox {
3
+ 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";
4
+ font-size: 14px;
5
+ }
6
+
7
+ .e-bigger .e-control-wrapper.e-mask .e-maskedtextbox {
8
+ font-size: 16px;
9
+ }
10
+
11
+ .e-control-wrapper.e-mask.e-bigger .e-maskedtextbox {
12
+ font-size: 16px;
13
+ }
14
+
15
+ .e-content-placeholder.e-mask.e-placeholder-mask {
16
+ background-size: 300px 33px;
17
+ min-height: 33px;
18
+ }
19
+
20
+ .e-bigger .e-content-placeholder.e-mask.e-placeholder-mask,
21
+ .e-bigger.e-content-placeholder.e-mask.e-placeholder-mask {
22
+ background-size: 300px 40px;
23
+ min-height: 40px;
24
+ }
25
+
26
+ /*! maskedtextbox theme */
27
+ .e-control-wrapper.e-mask.e-error .e-maskedtextbox {
28
+ color: #e4606d;
29
+ }
30
+
31
+ .e-utility-mask.e-error {
32
+ color: #e4606d;
33
+ }
package/styles/maskedtextbox/bootstrap5-dark.scss ADDED
@@ -0,0 +1 @@
1
+ @import 'ej2-inputs/styles/maskedtextbox/bootstrap5-dark.scss';
package/styles/maskedtextbox/bootstrap5.css ADDED
@@ -0,0 +1,33 @@
1
+ /*! maskedtextbox layout */
2
+ .e-control-wrapper.e-mask .e-maskedtextbox {
3
+ 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";
4
+ font-size: 14px;
5
+ }
6
+
7
+ .e-bigger .e-control-wrapper.e-mask .e-maskedtextbox {
8
+ font-size: 16px;
9
+ }
10
+
11
+ .e-control-wrapper.e-mask.e-bigger .e-maskedtextbox {
12
+ font-size: 16px;
13
+ }
14
+
15
+ .e-content-placeholder.e-mask.e-placeholder-mask {
16
+ background-size: 300px 33px;
17
+ min-height: 33px;
18
+ }
19
+
20
+ .e-bigger .e-content-placeholder.e-mask.e-placeholder-mask,
21
+ .e-bigger.e-content-placeholder.e-mask.e-placeholder-mask {
22
+ background-size: 300px 40px;
23
+ min-height: 40px;
24
+ }
25
+
26
+ /*! maskedtextbox theme */
27
+ .e-control-wrapper.e-mask.e-error .e-maskedtextbox {
28
+ color: #dc3545;
29
+ }
30
+
31
+ .e-utility-mask.e-error {
32
+ color: #dc3545;
33
+ }
package/styles/maskedtextbox/bootstrap5.scss ADDED
@@ -0,0 +1 @@
1
+ @import 'ej2-inputs/styles/maskedtextbox/bootstrap5.scss';