@syncfusion/ej2-dropdowns 26.2.8 → 26.2.9

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 (106) hide show
  1. package/dist/ej2-dropdowns.min.js +2 -2
  2. package/dist/ej2-dropdowns.umd.min.js +2 -2
  3. package/dist/ej2-dropdowns.umd.min.js.map +1 -1
  4. package/dist/es6/ej2-dropdowns.es2015.js +29 -21
  5. package/dist/es6/ej2-dropdowns.es2015.js.map +1 -1
  6. package/dist/es6/ej2-dropdowns.es5.js +29 -21
  7. package/dist/es6/ej2-dropdowns.es5.js.map +1 -1
  8. package/dist/global/ej2-dropdowns.min.js +2 -2
  9. package/dist/global/ej2-dropdowns.min.js.map +1 -1
  10. package/dist/global/index.d.ts +1 -1
  11. package/package.json +6 -6
  12. package/src/common/virtual-scroll.js +5 -7
  13. package/src/drop-down-base/drop-down-base.js +10 -5
  14. package/src/drop-down-list/drop-down-list.js +4 -1
  15. package/src/list-box/list-box.js +6 -6
  16. package/src/multi-select/multi-select.js +4 -2
  17. package/styles/auto-complete/fluent2.css +3 -1031
  18. package/styles/auto-complete/material3-dark.css +1 -54
  19. package/styles/auto-complete/material3.css +2 -109
  20. package/styles/bootstrap-dark.css +9 -0
  21. package/styles/bootstrap.css +9 -0
  22. package/styles/bootstrap4.css +9 -0
  23. package/styles/bootstrap5-dark.css +9 -0
  24. package/styles/bootstrap5.css +9 -0
  25. package/styles/combo-box/fluent2.css +3 -1031
  26. package/styles/combo-box/material3-dark.css +1 -54
  27. package/styles/combo-box/material3.css +2 -109
  28. package/styles/drop-down-base/_theme.scss +2 -0
  29. package/styles/drop-down-base/bootstrap-dark.css +2 -0
  30. package/styles/drop-down-base/bootstrap.css +2 -0
  31. package/styles/drop-down-base/bootstrap4.css +2 -0
  32. package/styles/drop-down-base/bootstrap5-dark.css +2 -0
  33. package/styles/drop-down-base/bootstrap5.css +2 -0
  34. package/styles/drop-down-base/fabric-dark.css +2 -0
  35. package/styles/drop-down-base/fabric.css +2 -0
  36. package/styles/drop-down-base/fluent-dark.css +2 -0
  37. package/styles/drop-down-base/fluent.css +2 -0
  38. package/styles/drop-down-base/fluent2.css +7 -1033
  39. package/styles/drop-down-base/highcontrast-light.css +2 -0
  40. package/styles/drop-down-base/highcontrast.css +2 -0
  41. package/styles/drop-down-base/material-dark.css +2 -0
  42. package/styles/drop-down-base/material.css +2 -0
  43. package/styles/drop-down-base/material3-dark.css +3 -54
  44. package/styles/drop-down-base/material3.css +5 -110
  45. package/styles/drop-down-base/tailwind-dark.css +2 -0
  46. package/styles/drop-down-base/tailwind.css +2 -0
  47. package/styles/drop-down-list/fluent2.css +5 -1033
  48. package/styles/drop-down-list/material3-dark.css +1 -54
  49. package/styles/drop-down-list/material3.css +3 -110
  50. package/styles/drop-down-tree/fluent2.css +3 -1031
  51. package/styles/drop-down-tree/material3-dark.css +1 -54
  52. package/styles/drop-down-tree/material3.css +2 -109
  53. package/styles/fabric-dark.css +9 -0
  54. package/styles/fabric.css +9 -0
  55. package/styles/fluent-dark.css +9 -0
  56. package/styles/fluent.css +9 -0
  57. package/styles/fluent2.css +14 -1033
  58. package/styles/highcontrast-light.css +9 -0
  59. package/styles/highcontrast.css +9 -0
  60. package/styles/list-box/_layout.scss +6 -0
  61. package/styles/list-box/bootstrap-dark.css +6 -0
  62. package/styles/list-box/bootstrap.css +6 -0
  63. package/styles/list-box/bootstrap4.css +6 -0
  64. package/styles/list-box/bootstrap5-dark.css +6 -0
  65. package/styles/list-box/bootstrap5.css +6 -0
  66. package/styles/list-box/fabric-dark.css +6 -0
  67. package/styles/list-box/fabric.css +6 -0
  68. package/styles/list-box/fluent-dark.css +6 -0
  69. package/styles/list-box/fluent.css +6 -0
  70. package/styles/list-box/fluent2.css +9 -1031
  71. package/styles/list-box/highcontrast-light.css +6 -0
  72. package/styles/list-box/highcontrast.css +6 -0
  73. package/styles/list-box/material-dark.css +6 -0
  74. package/styles/list-box/material.css +6 -0
  75. package/styles/list-box/material3-dark.css +7 -54
  76. package/styles/list-box/material3.css +8 -109
  77. package/styles/list-box/tailwind-dark.css +6 -0
  78. package/styles/list-box/tailwind.css +6 -0
  79. package/styles/material-dark.css +9 -0
  80. package/styles/material.css +9 -0
  81. package/styles/material3-dark.css +10 -54
  82. package/styles/material3.css +12 -110
  83. package/styles/mention/fluent2.css +3 -1031
  84. package/styles/mention/material3-dark.css +1 -54
  85. package/styles/mention/material3.css +2 -109
  86. package/styles/multi-select/_layout.scss +1 -0
  87. package/styles/multi-select/bootstrap-dark.css +1 -0
  88. package/styles/multi-select/bootstrap.css +1 -0
  89. package/styles/multi-select/bootstrap4.css +1 -0
  90. package/styles/multi-select/bootstrap5-dark.css +1 -0
  91. package/styles/multi-select/bootstrap5.css +1 -0
  92. package/styles/multi-select/fabric-dark.css +1 -0
  93. package/styles/multi-select/fabric.css +1 -0
  94. package/styles/multi-select/fluent-dark.css +1 -0
  95. package/styles/multi-select/fluent.css +1 -0
  96. package/styles/multi-select/fluent2.css +6 -1033
  97. package/styles/multi-select/highcontrast-light.css +1 -0
  98. package/styles/multi-select/highcontrast.css +1 -0
  99. package/styles/multi-select/material-dark.css +1 -0
  100. package/styles/multi-select/material.css +1 -0
  101. package/styles/multi-select/material3-dark.css +2 -54
  102. package/styles/multi-select/material3.css +4 -110
  103. package/styles/multi-select/tailwind-dark.css +1 -0
  104. package/styles/multi-select/tailwind.css +1 -0
  105. package/styles/tailwind-dark.css +9 -0
  106. package/styles/tailwind.css +9 -0
@@ -1,57 +1,4 @@
1
- :root {
2
- --color-sf-black: 0, 0, 0;
3
- --color-sf-white: 255, 255, 255;
4
- --color-sf-primary: 208, 188, 255;
5
- --color-sf-primary-container: 79, 55, 139;
6
- --color-sf-secondary: 204, 194, 220;
7
- --color-sf-secondary-container: 74, 68, 88;
8
- --color-sf-tertiary: 239, 184, 200;
9
- --color-sf-tertiary-container: 99, 59, 72;
10
- --color-sf-surface: 28, 27, 31;
11
- --color-sf-surface-variant: 73, 69, 79;
12
- --color-sf-background: var(--color-sf-surface);
13
- --color-sf-on-primary: 55, 30, 115;
14
- --color-sf-on-primary-container: 234, 221, 255;
15
- --color-sf-on-secondary: 51, 45, 65;
16
- --color-sf-on-secondary-container: 232, 222, 248;
17
- --color-sf-on-tertiary: 73, 37, 50;
18
- --color-sf-on-tertiary-containe: 255, 216, 228;
19
- --color-sf-on-surface: 230, 225, 229;
20
- --color-sf-on-surface-variant: 202, 196, 208;
21
- --color-sf-on-background: 230, 225, 229;
22
- --color-sf-outline: 147, 143, 153;
23
- --color-sf-outline-variant: 68, 71, 70;
24
- --color-sf-shadow: 0, 0, 0;
25
- --color-sf-surface-tint-color: 208, 188, 255;
26
- --color-sf-inverse-surface: 230, 225, 229;
27
- --color-sf-inverse-on-surface: 49, 48, 51;
28
- --color-sf-inverse-primary: 103, 80, 164;
29
- --color-sf-scrim: 0, 0, 0;
30
- --color-sf-error: 242, 184, 181;
31
- --color-sf-error-container: 140, 29, 24;
32
- --color-sf-on-error: 96, 20, 16;
33
- --color-sf-on-error-container: 249, 222, 220;
34
- --color-sf-success: 83, 202, 23;
35
- --color-sf-success-container: 22, 62, 2;
36
- --color-sf-on-success: 13, 39, 0;
37
- --color-sf-on-success-container: 183, 250, 150;
38
- --color-sf-info: 71, 172, 251;
39
- --color-sf-info-container: 0, 67, 120;
40
- --color-sf-on-info: 0, 51, 91;
41
- --color-sf-on-info-container: 173, 219, 255;
42
- --color-sf-warning: 245, 180, 130;
43
- --color-sf-warning-container: 123, 65, 0;
44
- --color-sf-on-warning: 99, 52, 0;
45
- --color-sf-on-warning-container: 255, 220, 193;
46
- --color-sf-spreadsheet-gridline: 231, 224, 236;
47
- --color-sf-shadow-focus-ring1: 0 0 0 1px #000, 0 0 0 3px #fff;
48
- --color-sf-success-text: 0, 0, 0;
49
- --color-sf-warning-text: 0, 0, 0;
50
- --color-sf-info-text: 0, 0, 0;
51
- --color-sf-danger-text: 0, 0, 0;
52
- --color-sf-diagram-palette-background: var(--color-sf-inverse-surface);
53
- --color-sf-content-text-color-alt2: var(--color-sf-on-secondary);
54
- }
1
+
55
2
 
56
3
  /* stylelint-disable property-no-vendor-prefix */
57
4
  @-webkit-keyframes e-input-ripple {
@@ -1,113 +1,6 @@
1
- :root {
2
- --color-sf-black: 0, 0, 0;
3
- --color-sf-white: 255, 255, 255;
4
- --color-sf-primary: 103, 80, 164;
5
- --color-sf-primary-container: 234, 221, 255;
6
- --color-sf-secondary: 98, 91, 113;
7
- --color-sf-secondary-container: 232, 222, 248;
8
- --color-sf-tertiary: 125, 82, 96;
9
- --color-sf-tertiary-container: 255, 216, 228;
10
- --color-sf-surface: 255, 255, 255;
11
- --color-sf-surface-variant: 231, 224, 236;
12
- --color-sf-background: var(--color-sf-surface);
13
- --color-sf-on-primary: 255, 255, 255;
14
- --color-sf-on-primary-container: 33, 0, 94;
15
- --color-sf-on-secondary: 255, 255, 255;
16
- --color-sf-on-secondary-container: 30, 25, 43;
17
- --color-sf-on-tertiary: 255, 255, 255;
18
- --color-sf-on-tertiary-containe: 55, 11, 30;
19
- --color-sf-on-surface: 28, 27, 31;
20
- --color-sf-on-surface-variant: 73, 69, 78;
21
- --color-sf-on-background: 28, 27, 31;
22
- --color-sf-outline: 121, 116, 126;
23
- --color-sf-outline-variant: 196, 199, 197;
24
- --color-sf-shadow: 0, 0, 0;
25
- --color-sf-surface-tint-color: 103, 80, 164;
26
- --color-sf-inverse-surface: 49, 48, 51;
27
- --color-sf-inverse-on-surface: 244, 239, 244;
28
- --color-sf-inverse-primary: 208, 188, 255;
29
- --color-sf-scrim: 0, 0, 0;
30
- --color-sf-error: 179, 38, 30;
31
- --color-sf-error-container: 249, 222, 220;
32
- --color-sf-on-error: 255, 250, 250;
33
- --color-sf-on-error-container: 65, 14, 11;
34
- --color-sf-success: 32, 81, 7;
35
- --color-sf-success-container: 209, 255, 186;
36
- --color-sf-on-success: 244, 255, 239;
37
- --color-sf-on-success-container: 13, 39, 0;
38
- --color-sf-info: 1, 87, 155;
39
- --color-sf-info-container: 233, 245, 255;
40
- --color-sf-on-info: 250, 253, 255;
41
- --color-sf-on-info-container: 0, 51, 91;
42
- --color-sf-warning: 145, 76, 0;
43
- --color-sf-warning-container: 254, 236, 222;
44
- --color-sf-on-warning: 255, 255, 255;
45
- --color-sf-on-warning-container: 47, 21, 0;
46
- --color-sf-spreadsheet-gridline: var(--color-sf-surface-variant);
47
- --color-sf-shadow-focus-ring1: 0 0 0 1px rgb(255, 255, 255), 0 0 0 3px rgb(0, 0, 0);
48
- --color-sf-diagram-palette-background: --color-sf-white;
49
- --color-sf-success-text: 255, 255, 255;
50
- --color-sf-warning-text: 255, 255, 255;
51
- --color-sf-danger-text: 255, 255, 255;
52
- --color-sf-info-text: 255, 255, 255;
53
- --color-sf-content-text-color-alt2: var(--color-sf-on-secondary-container);
54
- --color-sf-secondary-bg-color: var(--color-sf-surface);
55
- }
56
1
 
57
- .e-dark-mode {
58
- --color-sf-black: 0, 0, 0;
59
- --color-sf-white: 255, 255, 255;
60
- --color-sf-primary: 208, 188, 255;
61
- --color-sf-primary-container: 79, 55, 139;
62
- --color-sf-secondary: 204, 194, 220;
63
- --color-sf-secondary-container: 74, 68, 88;
64
- --color-sf-tertiary: 239, 184, 200;
65
- --color-sf-tertiary-container: 99, 59, 72;
66
- --color-sf-surface: 28, 27, 31;
67
- --color-sf-surface-variant: 28, 27, 31;
68
- --color-sf-background: var(--color-sf-surface);
69
- --color-sf-on-primary: 55, 30, 115;
70
- --color-sf-on-primary-container: 234, 221, 255;
71
- --color-sf-on-secondary: 51, 45, 65;
72
- --color-sf-on-secondary-container: 232, 222, 248;
73
- --color-sf-on-tertiary: 73, 37, 50;
74
- --color-sf-on-tertiary-containe: 255, 216, 228;
75
- --color-sf-on-surface: 230, 225, 229;
76
- --color-sf-on-surface-variant: 202, 196, 208;
77
- --color-sf-on-background: 230, 225, 229;
78
- --color-sf-outline: 147, 143, 153;
79
- --color-sf-outline-variant: 68, 71, 70;
80
- --color-sf-shadow: 0, 0, 0;
81
- --color-sf-surface-tint-color: 208, 188, 255;
82
- --color-sf-inverse-surface: 230, 225, 229;
83
- --color-sf-inverse-on-surface: 49, 48, 51;
84
- --color-sf-inverse-primary: 103, 80, 164;
85
- --color-sf-scrim: 0, 0, 0;
86
- --color-sf-error: 242, 184, 181;
87
- --color-sf-error-container: 140, 29, 24;
88
- --color-sf-on-error: 96, 20, 16;
89
- --color-sf-on-error-container: 249, 222, 220;
90
- --color-sf-success: 83, 202, 23;
91
- --color-sf-success-container: 22, 62, 2;
92
- --color-sf-on-success: 13, 39, 0;
93
- --color-sf-on-success-container: 183, 250, 150;
94
- --color-sf-info: 71, 172, 251;
95
- --color-sf-info-container: 0, 67, 120;
96
- --color-sf-on-info: 0, 51, 91;
97
- --color-sf-on-info-container: 173, 219, 255;
98
- --color-sf-warning: 245, 180, 130;
99
- --color-sf-warning-container: 123, 65, 0;
100
- --color-sf-on-warning: 99, 52, 0;
101
- --color-sf-on-warning-container: 255, 220, 193;
102
- --color-sf-spreadsheet-gridline: 231, 224, 236;
103
- --color-sf-shadow-focus-ring1: 0 0 0 1px #000, 0 0 0 3px #fff;
104
- --color-sf-success-text: 0, 0, 0;
105
- --color-sf-warning-text: 0, 0, 0;
106
- --color-sf-info-text: 0, 0, 0;
107
- --color-sf-danger-text: 0, 0, 0;
108
- --color-sf-diagram-palette-background: var(--color-sf-inverse-surface);
109
- --color-sf-content-text-color-alt2: var(--color-sf-on-secondary);
110
- }
2
+
3
+
111
4
 
112
5
  /* stylelint-disable property-no-vendor-prefix */
113
6
  @-webkit-keyframes e-input-ripple {
@@ -206,6 +206,8 @@
206
206
  min-height: 36px;
207
207
  padding-left: 10px;
208
208
  padding-right: 16px;
209
+ overflow: hidden;
210
+ text-overflow: ellipsis;
209
211
  background-color: #282727;
210
212
  }
211
213
 
@@ -1806,6 +1808,7 @@ ejs-dropdownlist {
1806
1808
  display: block;
1807
1809
  line-height: 36px;
1808
1810
  overflow: hidden;
1811
+ text-overflow: ellipsis;
1809
1812
  padding-right: 16px;
1810
1813
  position: relative;
1811
1814
  text-indent: 11px;
@@ -2997,6 +3000,12 @@ ejs-listbox {
2997
3000
  position: relative;
2998
3001
  }
2999
3002
 
3003
+ .e-listbox-wrapper:not(.e-list-template) .e-list-parent li {
3004
+ overflow: hidden;
3005
+ white-space: nowrap;
3006
+ text-overflow: ellipsis;
3007
+ }
3008
+
3000
3009
  .e-small .e-listbox-wrapper.e-filter-list .e-list-parent,
3001
3010
  .e-small .e-listbox-container.e-filter-list .e-list-parent {
3002
3011
  height: calc(100% - 45px) !important; /* stylelint-disable-line declaration-no-important */
package/styles/fabric.css CHANGED
@@ -206,6 +206,8 @@
206
206
  min-height: 36px;
207
207
  padding-left: 10px;
208
208
  padding-right: 16px;
209
+ overflow: hidden;
210
+ text-overflow: ellipsis;
209
211
  background-color: #fff;
210
212
  }
211
213
 
@@ -1795,6 +1797,7 @@ ejs-dropdownlist {
1795
1797
  display: block;
1796
1798
  line-height: 36px;
1797
1799
  overflow: hidden;
1800
+ text-overflow: ellipsis;
1798
1801
  padding-right: 16px;
1799
1802
  position: relative;
1800
1803
  text-indent: 11px;
@@ -2997,6 +3000,12 @@ ejs-listbox {
2997
3000
  position: relative;
2998
3001
  }
2999
3002
 
3003
+ .e-listbox-wrapper:not(.e-list-template) .e-list-parent li {
3004
+ overflow: hidden;
3005
+ white-space: nowrap;
3006
+ text-overflow: ellipsis;
3007
+ }
3008
+
3000
3009
  .e-small .e-listbox-wrapper.e-filter-list .e-list-parent,
3001
3010
  .e-small .e-listbox-container.e-filter-list .e-list-parent {
3002
3011
  height: calc(100% - 45px) !important; /* stylelint-disable-line declaration-no-important */
@@ -250,6 +250,8 @@
250
250
  min-height: 36px;
251
251
  padding-left: 12px;
252
252
  padding-right: 16px;
253
+ overflow: hidden;
254
+ text-overflow: ellipsis;
253
255
  background-color: #252423;
254
256
  }
255
257
 
@@ -2003,6 +2005,7 @@ ejs-dropdownlist {
2003
2005
  display: block;
2004
2006
  line-height: 36px;
2005
2007
  overflow: hidden;
2008
+ text-overflow: ellipsis;
2006
2009
  padding-right: 16px;
2007
2010
  position: relative;
2008
2011
  text-indent: 8px;
@@ -3269,6 +3272,12 @@ ejs-listbox {
3269
3272
  position: relative;
3270
3273
  }
3271
3274
 
3275
+ .e-listbox-wrapper:not(.e-list-template) .e-list-parent li {
3276
+ overflow: hidden;
3277
+ white-space: nowrap;
3278
+ text-overflow: ellipsis;
3279
+ }
3280
+
3272
3281
  .e-small .e-listbox-wrapper.e-filter-list .e-list-parent,
3273
3282
  .e-small .e-listbox-container.e-filter-list .e-list-parent {
3274
3283
  height: calc(100% - 50px) !important; /* stylelint-disable-line declaration-no-important */
package/styles/fluent.css CHANGED
@@ -250,6 +250,8 @@
250
250
  min-height: 36px;
251
251
  padding-left: 12px;
252
252
  padding-right: 16px;
253
+ overflow: hidden;
254
+ text-overflow: ellipsis;
253
255
  background-color: #fff;
254
256
  }
255
257
 
@@ -2003,6 +2005,7 @@ ejs-dropdownlist {
2003
2005
  display: block;
2004
2006
  line-height: 36px;
2005
2007
  overflow: hidden;
2008
+ text-overflow: ellipsis;
2006
2009
  padding-right: 16px;
2007
2010
  position: relative;
2008
2011
  text-indent: 8px;
@@ -3269,6 +3272,12 @@ ejs-listbox {
3269
3272
  position: relative;
3270
3273
  }
3271
3274
 
3275
+ .e-listbox-wrapper:not(.e-list-template) .e-list-parent li {
3276
+ overflow: hidden;
3277
+ white-space: nowrap;
3278
+ text-overflow: ellipsis;
3279
+ }
3280
+
3272
3281
  .e-small .e-listbox-wrapper.e-filter-list .e-list-parent,
3273
3282
  .e-small .e-listbox-container.e-filter-list .e-list-parent {
3274
3283
  height: calc(100% - 50px) !important; /* stylelint-disable-line declaration-no-important */