@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
@@ -786,6 +786,7 @@
786
786
  display: block;
787
787
  line-height: 36px;
788
788
  overflow: hidden;
789
+ text-overflow: ellipsis;
789
790
  padding-right: 16px;
790
791
  position: relative;
791
792
  text-indent: 11px;
@@ -793,6 +793,7 @@
793
793
  display: block;
794
794
  line-height: 36px;
795
795
  overflow: hidden;
796
+ text-overflow: ellipsis;
796
797
  padding-right: 16px;
797
798
  position: relative;
798
799
  text-indent: 11px;
@@ -1245,6 +1245,7 @@
1245
1245
  display: block;
1246
1246
  line-height: 36px;
1247
1247
  overflow: hidden;
1248
+ text-overflow: ellipsis;
1248
1249
  padding-right: 16px;
1249
1250
  position: relative;
1250
1251
  text-indent: 17px;
@@ -1265,6 +1265,7 @@
1265
1265
  display: block;
1266
1266
  line-height: 36px;
1267
1267
  overflow: hidden;
1268
+ text-overflow: ellipsis;
1268
1269
  padding-right: 16px;
1269
1270
  position: relative;
1270
1271
  text-indent: 17px;
@@ -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 {
@@ -1361,6 +1308,7 @@
1361
1308
  display: block;
1362
1309
  line-height: 36px;
1363
1310
  overflow: hidden;
1311
+ text-overflow: ellipsis;
1364
1312
  padding-right: 16px;
1365
1313
  position: relative;
1366
1314
  text-indent: 17px;
@@ -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
-
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
- }
1
+
2
+
3
+
111
4
 
112
5
  /* stylelint-disable property-no-vendor-prefix */
113
6
  @-webkit-keyframes e-input-ripple {
@@ -1417,6 +1310,7 @@
1417
1310
  display: block;
1418
1311
  line-height: 36px;
1419
1312
  overflow: hidden;
1313
+ text-overflow: ellipsis;
1420
1314
  padding-right: 16px;
1421
1315
  position: relative;
1422
1316
  text-indent: 17px;
@@ -717,6 +717,7 @@
717
717
  display: block;
718
718
  line-height: 30px;
719
719
  overflow: hidden;
720
+ text-overflow: ellipsis;
720
721
  padding-right: 16px;
721
722
  position: relative;
722
723
  text-indent: 12px;
@@ -717,6 +717,7 @@
717
717
  display: block;
718
718
  line-height: 30px;
719
719
  overflow: hidden;
720
+ text-overflow: ellipsis;
720
721
  padding-right: 16px;
721
722
  position: relative;
722
723
  text-indent: 12px;
@@ -311,6 +311,8 @@
311
311
  min-height: 30px;
312
312
  padding-left: 12px;
313
313
  padding-right: 16px;
314
+ overflow: hidden;
315
+ text-overflow: ellipsis;
314
316
  background-color: #374151;
315
317
  }
316
318
 
@@ -1981,6 +1983,7 @@ ejs-dropdownlist {
1981
1983
  display: block;
1982
1984
  line-height: 30px;
1983
1985
  overflow: hidden;
1986
+ text-overflow: ellipsis;
1984
1987
  padding-right: 16px;
1985
1988
  position: relative;
1986
1989
  text-indent: 12px;
@@ -3200,6 +3203,12 @@ ejs-listbox {
3200
3203
  position: relative;
3201
3204
  }
3202
3205
 
3206
+ .e-listbox-wrapper:not(.e-list-template) .e-list-parent li {
3207
+ overflow: hidden;
3208
+ white-space: nowrap;
3209
+ text-overflow: ellipsis;
3210
+ }
3211
+
3203
3212
  .e-small .e-listbox-wrapper.e-filter-list .e-list-parent,
3204
3213
  .e-small .e-listbox-container.e-filter-list .e-list-parent {
3205
3214
  height: calc(100% - 45px) !important; /* stylelint-disable-line declaration-no-important */
@@ -311,6 +311,8 @@
311
311
  min-height: 30px;
312
312
  padding-left: 12px;
313
313
  padding-right: 16px;
314
+ overflow: hidden;
315
+ text-overflow: ellipsis;
314
316
  background-color: #fff;
315
317
  }
316
318
 
@@ -1981,6 +1983,7 @@ ejs-dropdownlist {
1981
1983
  display: block;
1982
1984
  line-height: 30px;
1983
1985
  overflow: hidden;
1986
+ text-overflow: ellipsis;
1984
1987
  padding-right: 16px;
1985
1988
  position: relative;
1986
1989
  text-indent: 12px;
@@ -3200,6 +3203,12 @@ ejs-listbox {
3200
3203
  position: relative;
3201
3204
  }
3202
3205
 
3206
+ .e-listbox-wrapper:not(.e-list-template) .e-list-parent li {
3207
+ overflow: hidden;
3208
+ white-space: nowrap;
3209
+ text-overflow: ellipsis;
3210
+ }
3211
+
3203
3212
  .e-small .e-listbox-wrapper.e-filter-list .e-list-parent,
3204
3213
  .e-small .e-listbox-container.e-filter-list .e-list-parent {
3205
3214
  height: calc(100% - 45px) !important; /* stylelint-disable-line declaration-no-important */