@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
  .e-ddl.e-control-wrapper .e-ddl-icon::before {
57
4
  -webkit-transform: rotate(0deg);
@@ -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
  .e-ddl.e-control-wrapper .e-ddl-icon::before {
113
6
  -webkit-transform: rotate(0deg);
@@ -206,6 +206,8 @@
206
206
  min-height: 26px;
207
207
  padding-left: 20px;
208
208
  padding-right: 20px;
209
+ overflow: hidden;
210
+ text-overflow: ellipsis;
209
211
  background-color: #2a2a2a;
210
212
  }
211
213
 
@@ -1832,6 +1834,7 @@ ejs-dropdownlist {
1832
1834
  display: block;
1833
1835
  line-height: 26px;
1834
1836
  overflow: hidden;
1837
+ text-overflow: ellipsis;
1835
1838
  padding-right: 20px;
1836
1839
  position: relative;
1837
1840
  text-indent: 21px;
@@ -3023,6 +3026,12 @@ ejs-listbox {
3023
3026
  position: relative;
3024
3027
  }
3025
3028
 
3029
+ .e-listbox-wrapper:not(.e-list-template) .e-list-parent li {
3030
+ overflow: hidden;
3031
+ white-space: nowrap;
3032
+ text-overflow: ellipsis;
3033
+ }
3034
+
3026
3035
  .e-small .e-listbox-wrapper.e-filter-list .e-list-parent,
3027
3036
  .e-small .e-listbox-container.e-filter-list .e-list-parent {
3028
3037
  height: calc(100% - 46px) !important; /* stylelint-disable-line declaration-no-important */
@@ -206,6 +206,8 @@
206
206
  min-height: 26px;
207
207
  padding-left: 20px;
208
208
  padding-right: 20px;
209
+ overflow: hidden;
210
+ text-overflow: ellipsis;
209
211
  background-color: #fff;
210
212
  }
211
213
 
@@ -1826,6 +1828,7 @@ ejs-dropdownlist {
1826
1828
  display: block;
1827
1829
  line-height: 26px;
1828
1830
  overflow: hidden;
1831
+ text-overflow: ellipsis;
1829
1832
  padding-right: 20px;
1830
1833
  position: relative;
1831
1834
  text-indent: 21px;
@@ -3028,6 +3031,12 @@ ejs-listbox {
3028
3031
  position: relative;
3029
3032
  }
3030
3033
 
3034
+ .e-listbox-wrapper:not(.e-list-template) .e-list-parent li {
3035
+ overflow: hidden;
3036
+ white-space: nowrap;
3037
+ text-overflow: ellipsis;
3038
+ }
3039
+
3031
3040
  .e-small .e-listbox-wrapper.e-filter-list .e-list-parent,
3032
3041
  .e-small .e-listbox-container.e-filter-list .e-list-parent {
3033
3042
  height: calc(100% - 46px) !important; /* stylelint-disable-line declaration-no-important */
@@ -216,6 +216,8 @@
216
216
  min-height: 26px;
217
217
  padding-left: 20px;
218
218
  padding-right: 24px;
219
+ overflow: hidden;
220
+ text-overflow: ellipsis;
219
221
  background-color: #fff;
220
222
  }
221
223
 
@@ -1999,6 +2001,7 @@ ejs-dropdownlist {
1999
2001
  display: block;
2000
2002
  line-height: 26px;
2001
2003
  overflow: hidden;
2004
+ text-overflow: ellipsis;
2002
2005
  padding-right: 24px;
2003
2006
  position: relative;
2004
2007
  text-indent: 21px;
@@ -3276,6 +3279,12 @@ ejs-listbox {
3276
3279
  position: relative;
3277
3280
  }
3278
3281
 
3282
+ .e-listbox-wrapper:not(.e-list-template) .e-list-parent li {
3283
+ overflow: hidden;
3284
+ white-space: nowrap;
3285
+ text-overflow: ellipsis;
3286
+ }
3287
+
3279
3288
  .e-small .e-listbox-wrapper.e-filter-list .e-list-parent,
3280
3289
  .e-small .e-listbox-container.e-filter-list .e-list-parent {
3281
3290
  height: calc(100% - 43px) !important; /* stylelint-disable-line declaration-no-important */
@@ -233,6 +233,8 @@
233
233
  min-height: 30px;
234
234
  padding-left: 12px;
235
235
  padding-right: 16px;
236
+ overflow: hidden;
237
+ text-overflow: ellipsis;
236
238
  background-color: #343a40;
237
239
  }
238
240
 
@@ -1995,6 +1997,7 @@ ejs-dropdownlist {
1995
1997
  display: block;
1996
1998
  line-height: 36px;
1997
1999
  overflow: hidden;
2000
+ text-overflow: ellipsis;
1998
2001
  padding-right: 16px;
1999
2002
  position: relative;
2000
2003
  text-indent: 12px;
@@ -3194,6 +3197,12 @@ ejs-listbox {
3194
3197
  position: relative;
3195
3198
  }
3196
3199
 
3200
+ .e-listbox-wrapper:not(.e-list-template) .e-list-parent li {
3201
+ overflow: hidden;
3202
+ white-space: nowrap;
3203
+ text-overflow: ellipsis;
3204
+ }
3205
+
3197
3206
  .e-small .e-listbox-wrapper.e-filter-list .e-list-parent,
3198
3207
  .e-small .e-listbox-container.e-filter-list .e-list-parent {
3199
3208
  height: calc(100% - 45px) !important; /* stylelint-disable-line declaration-no-important */
@@ -233,6 +233,8 @@
233
233
  min-height: 30px;
234
234
  padding-left: 12px;
235
235
  padding-right: 16px;
236
+ overflow: hidden;
237
+ text-overflow: ellipsis;
236
238
  background-color: #fff;
237
239
  }
238
240
 
@@ -1995,6 +1997,7 @@ ejs-dropdownlist {
1995
1997
  display: block;
1996
1998
  line-height: 36px;
1997
1999
  overflow: hidden;
2000
+ text-overflow: ellipsis;
1998
2001
  padding-right: 16px;
1999
2002
  position: relative;
2000
2003
  text-indent: 12px;
@@ -3194,6 +3197,12 @@ ejs-listbox {
3194
3197
  position: relative;
3195
3198
  }
3196
3199
 
3200
+ .e-listbox-wrapper:not(.e-list-template) .e-list-parent li {
3201
+ overflow: hidden;
3202
+ white-space: nowrap;
3203
+ text-overflow: ellipsis;
3204
+ }
3205
+
3197
3206
  .e-small .e-listbox-wrapper.e-filter-list .e-list-parent,
3198
3207
  .e-small .e-listbox-container.e-filter-list .e-list-parent {
3199
3208
  height: calc(100% - 45px) !important; /* stylelint-disable-line declaration-no-important */