@syncfusion/ej2-dropdowns 24.2.8 → 25.1.35

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 (110) hide show
  1. package/CHANGELOG.md +23 -150
  2. package/dist/ej2-dropdowns.min.js +2 -2
  3. package/dist/ej2-dropdowns.umd.min.js +2 -2
  4. package/dist/ej2-dropdowns.umd.min.js.map +1 -1
  5. package/dist/es6/ej2-dropdowns.es2015.js +2049 -528
  6. package/dist/es6/ej2-dropdowns.es2015.js.map +1 -1
  7. package/dist/es6/ej2-dropdowns.es5.js +2072 -533
  8. package/dist/es6/ej2-dropdowns.es5.js.map +1 -1
  9. package/dist/global/ej2-dropdowns.min.js +2 -2
  10. package/dist/global/ej2-dropdowns.min.js.map +1 -1
  11. package/dist/global/index.d.ts +1 -1
  12. package/package.json +13 -13
  13. package/src/auto-complete/auto-complete-model.d.ts +3 -1
  14. package/src/auto-complete/auto-complete.d.ts +2 -0
  15. package/src/auto-complete/auto-complete.js +51 -6
  16. package/src/combo-box/combo-box-model.d.ts +11 -2
  17. package/src/combo-box/combo-box.d.ts +10 -2
  18. package/src/combo-box/combo-box.js +75 -16
  19. package/src/common/interface.d.ts +32 -0
  20. package/src/common/virtual-scroll.d.ts +1 -3
  21. package/src/common/virtual-scroll.js +157 -27
  22. package/src/drop-down-base/drop-down-base-model.d.ts +1 -1
  23. package/src/drop-down-base/drop-down-base.d.ts +65 -5
  24. package/src/drop-down-base/drop-down-base.js +242 -25
  25. package/src/drop-down-list/drop-down-list-model.d.ts +10 -1
  26. package/src/drop-down-list/drop-down-list.d.ts +16 -51
  27. package/src/drop-down-list/drop-down-list.js +180 -217
  28. package/src/drop-down-tree/drop-down-tree-model.d.ts +16 -12
  29. package/src/drop-down-tree/drop-down-tree.d.ts +13 -3
  30. package/src/drop-down-tree/drop-down-tree.js +55 -49
  31. package/src/global.js +1 -1
  32. package/src/list-box/list-box.js +9 -4
  33. package/src/mention/mention.d.ts +2 -0
  34. package/src/mention/mention.js +21 -9
  35. package/src/multi-select/checkbox-selection.js +8 -2
  36. package/src/multi-select/float-label.d.ts +5 -5
  37. package/src/multi-select/index.d.ts +1 -0
  38. package/src/multi-select/index.js +1 -0
  39. package/src/multi-select/interface.d.ts +1 -0
  40. package/src/multi-select/multi-select-model.d.ts +17 -2
  41. package/src/multi-select/multi-select.d.ts +34 -4
  42. package/src/multi-select/multi-select.js +1271 -173
  43. package/styles/auto-complete/_bds-definition.scss +2 -0
  44. package/styles/bootstrap-dark.css +8 -2
  45. package/styles/bootstrap.css +8 -2
  46. package/styles/bootstrap4.css +3 -2
  47. package/styles/bootstrap5-dark.css +3 -2
  48. package/styles/bootstrap5.css +3 -2
  49. package/styles/combo-box/_bds-definition.scss +2 -0
  50. package/styles/drop-down-base/_bds-definition.scss +134 -0
  51. package/styles/drop-down-list/_bds-definition.scss +134 -0
  52. package/styles/drop-down-list/_layout.scss +1 -1
  53. package/styles/drop-down-list/bootstrap-dark.css +1 -1
  54. package/styles/drop-down-list/bootstrap.css +1 -1
  55. package/styles/drop-down-list/bootstrap4.css +1 -1
  56. package/styles/drop-down-list/bootstrap5-dark.css +1 -1
  57. package/styles/drop-down-list/bootstrap5.css +1 -1
  58. package/styles/drop-down-list/fabric-dark.css +1 -1
  59. package/styles/drop-down-list/fabric.css +1 -1
  60. package/styles/drop-down-list/fluent-dark.css +1 -1
  61. package/styles/drop-down-list/fluent.css +1 -1
  62. package/styles/drop-down-list/highcontrast-light.css +1 -1
  63. package/styles/drop-down-list/highcontrast.css +1 -1
  64. package/styles/drop-down-list/icons/_bds.scss +14 -0
  65. package/styles/drop-down-list/material-dark.css +1 -1
  66. package/styles/drop-down-list/material.css +1 -1
  67. package/styles/drop-down-list/material3-dark.css +1 -1
  68. package/styles/drop-down-list/material3.css +1 -1
  69. package/styles/drop-down-list/tailwind-dark.css +1 -1
  70. package/styles/drop-down-list/tailwind.css +1 -1
  71. package/styles/drop-down-tree/_bds-definition.scss +61 -0
  72. package/styles/drop-down-tree/icons/_bds.scss +11 -0
  73. package/styles/fabric-dark.css +4 -2
  74. package/styles/fabric.css +4 -2
  75. package/styles/fluent-dark.css +8 -2
  76. package/styles/fluent.css +8 -2
  77. package/styles/highcontrast-light.css +4 -2
  78. package/styles/highcontrast.css +4 -2
  79. package/styles/list-box/_bds-definition.scss +136 -0
  80. package/styles/list-box/icons/_bds.scss +25 -0
  81. package/styles/material-dark.css +3 -2
  82. package/styles/material.css +3 -2
  83. package/styles/material3-dark.css +3 -2
  84. package/styles/material3.css +3 -2
  85. package/styles/mention/_bds-definition.scss +1 -0
  86. package/styles/multi-select/_bds-definition.scss +235 -0
  87. package/styles/multi-select/_bootstrap-dark-definition.scss +4 -0
  88. package/styles/multi-select/_bootstrap-definition.scss +4 -0
  89. package/styles/multi-select/_fluent-definition.scss +5 -0
  90. package/styles/multi-select/_layout.scss +8 -1
  91. package/styles/multi-select/bootstrap-dark.css +7 -1
  92. package/styles/multi-select/bootstrap.css +7 -1
  93. package/styles/multi-select/bootstrap4.css +2 -1
  94. package/styles/multi-select/bootstrap5-dark.css +2 -1
  95. package/styles/multi-select/bootstrap5.css +2 -1
  96. package/styles/multi-select/fabric-dark.css +3 -1
  97. package/styles/multi-select/fabric.css +3 -1
  98. package/styles/multi-select/fluent-dark.css +7 -1
  99. package/styles/multi-select/fluent.css +7 -1
  100. package/styles/multi-select/highcontrast-light.css +3 -1
  101. package/styles/multi-select/highcontrast.css +3 -1
  102. package/styles/multi-select/icons/_bds.scss +26 -0
  103. package/styles/multi-select/material-dark.css +2 -1
  104. package/styles/multi-select/material.css +2 -1
  105. package/styles/multi-select/material3-dark.css +2 -1
  106. package/styles/multi-select/material3.css +2 -1
  107. package/styles/multi-select/tailwind-dark.css +2 -1
  108. package/styles/multi-select/tailwind.css +2 -1
  109. package/styles/tailwind-dark.css +3 -2
  110. package/styles/tailwind.css +3 -2
package/styles/multi-select/bootstrap-dark.css CHANGED
@@ -62,6 +62,10 @@
62
62
  color: #fff;
63
63
  }
64
64
 
65
+ .e-bigger.e-multiselect.e-control-container .e-multi-select-wrapper .e-clear-icon {
66
+ margin-top: -3.2em;
67
+ }
68
+
65
69
  .e-multiselect.e-input-group .e-ddl-icon::before {
66
70
  content: "\e969";
67
71
  font-family: "e-icons";
@@ -362,8 +366,10 @@
362
366
  margin-top: -4em;
363
367
  }
364
368
 
365
- .e-bigger .e-multiselect.e-control-container .e-multi-select-wrapper .e-clear-icon {
369
+ .e-bigger .e-multiselect.e-control-container .e-multi-select-wrapper .e-clear-icon,
370
+ .e-bigger.e-multiselect.e-control-container .e-multi-select-wrapper .e-clear-icon {
366
371
  margin-top: -4em;
372
+ margin-top: -3.7em;
367
373
  }
368
374
 
369
375
  .e-multi-select-wrapper input[type=text] {
package/styles/multi-select/bootstrap.css CHANGED
@@ -55,6 +55,10 @@
55
55
  width: 40px;
56
56
  }
57
57
 
58
+ .e-bigger.e-multiselect.e-control-container .e-multi-select-wrapper .e-clear-icon {
59
+ margin-top: -3.2em;
60
+ }
61
+
58
62
  .e-multiselect.e-input-group .e-ddl-icon::before {
59
63
  content: "\e969";
60
64
  font-family: "e-icons";
@@ -355,8 +359,10 @@
355
359
  margin-top: -4em;
356
360
  }
357
361
 
358
- .e-bigger .e-multiselect.e-control-container .e-multi-select-wrapper .e-clear-icon {
362
+ .e-bigger .e-multiselect.e-control-container .e-multi-select-wrapper .e-clear-icon,
363
+ .e-bigger.e-multiselect.e-control-container .e-multi-select-wrapper .e-clear-icon {
359
364
  margin-top: -4em;
365
+ margin-top: -3.7em;
360
366
  }
361
367
 
362
368
  .e-multi-select-wrapper input[type=text] {
package/styles/multi-select/bootstrap4.css CHANGED
@@ -447,7 +447,8 @@
447
447
  margin-top: -3.5em;
448
448
  }
449
449
 
450
- .e-bigger .e-multiselect.e-control-container .e-multi-select-wrapper .e-clear-icon {
450
+ .e-bigger .e-multiselect.e-control-container .e-multi-select-wrapper .e-clear-icon,
451
+ .e-bigger.e-multiselect.e-control-container .e-multi-select-wrapper .e-clear-icon {
451
452
  margin-top: -3.5em;
452
453
  }
453
454
 
package/styles/multi-select/bootstrap5-dark.css CHANGED
@@ -417,7 +417,8 @@
417
417
  margin-top: -2.25em;
418
418
  }
419
419
 
420
- .e-bigger .e-multiselect.e-control-container .e-multi-select-wrapper .e-clear-icon {
420
+ .e-bigger .e-multiselect.e-control-container .e-multi-select-wrapper .e-clear-icon,
421
+ .e-bigger.e-multiselect.e-control-container .e-multi-select-wrapper .e-clear-icon {
421
422
  margin-top: -2.25em;
422
423
  margin-top: -2.15em;
423
424
  }
package/styles/multi-select/bootstrap5.css CHANGED
@@ -417,7 +417,8 @@
417
417
  margin-top: -2.25em;
418
418
  }
419
419
 
420
- .e-bigger .e-multiselect.e-control-container .e-multi-select-wrapper .e-clear-icon {
420
+ .e-bigger .e-multiselect.e-control-container .e-multi-select-wrapper .e-clear-icon,
421
+ .e-bigger.e-multiselect.e-control-container .e-multi-select-wrapper .e-clear-icon {
421
422
  margin-top: -2.25em;
422
423
  margin-top: -2.15em;
423
424
  }
package/styles/multi-select/fabric-dark.css CHANGED
@@ -355,8 +355,10 @@
355
355
  margin-top: -3.5em;
356
356
  }
357
357
 
358
- .e-bigger .e-multiselect.e-control-container .e-multi-select-wrapper .e-clear-icon {
358
+ .e-bigger .e-multiselect.e-control-container .e-multi-select-wrapper .e-clear-icon,
359
+ .e-bigger.e-multiselect.e-control-container .e-multi-select-wrapper .e-clear-icon {
359
360
  margin-top: -3.5em;
361
+ margin-top: -3.2em;
360
362
  }
361
363
 
362
364
  .e-multi-select-wrapper input[type=text] {
package/styles/multi-select/fabric.css CHANGED
@@ -350,8 +350,10 @@
350
350
  margin-top: -3.5em;
351
351
  }
352
352
 
353
- .e-bigger .e-multiselect.e-control-container .e-multi-select-wrapper .e-clear-icon {
353
+ .e-bigger .e-multiselect.e-control-container .e-multi-select-wrapper .e-clear-icon,
354
+ .e-bigger.e-multiselect.e-control-container .e-multi-select-wrapper .e-clear-icon {
354
355
  margin-top: -3.5em;
356
+ margin-top: -3.2em;
355
357
  }
356
358
 
357
359
  .e-multi-select-wrapper input[type=text] {
package/styles/multi-select/fluent-dark.css CHANGED
@@ -92,6 +92,11 @@
92
92
  border-left-width: 0;
93
93
  }
94
94
 
95
+ .e-bigger .e-multiselect.e-control-container .e-multi-select-wrapper.e-down-icon .e-clear-icon,
96
+ .e-bigger.e-multiselect.e-control-container .e-multi-select-wrapper.e-down-icon .e-clear-icon {
97
+ margin-top: -1.5em;
98
+ }
99
+
95
100
  .e-multiselect.e-input-group .e-ddl-icon::before {
96
101
  content: "\e729";
97
102
  font-family: "e-icons";
@@ -457,7 +462,8 @@
457
462
  font-size: 14px;
458
463
  }
459
464
 
460
- .e-bigger .e-multiselect.e-control-container .e-multi-select-wrapper .e-clear-icon {
465
+ .e-bigger .e-multiselect.e-control-container .e-multi-select-wrapper .e-clear-icon,
466
+ .e-bigger.e-multiselect.e-control-container .e-multi-select-wrapper .e-clear-icon {
461
467
  margin-top: -2.7em;
462
468
  margin-top: -2.25em;
463
469
  }
package/styles/multi-select/fluent.css CHANGED
@@ -92,6 +92,11 @@
92
92
  border-left-width: 0;
93
93
  }
94
94
 
95
+ .e-bigger .e-multiselect.e-control-container .e-multi-select-wrapper.e-down-icon .e-clear-icon,
96
+ .e-bigger.e-multiselect.e-control-container .e-multi-select-wrapper.e-down-icon .e-clear-icon {
97
+ margin-top: -1.5em;
98
+ }
99
+
95
100
  .e-multiselect.e-input-group .e-ddl-icon::before {
96
101
  content: "\e729";
97
102
  font-family: "e-icons";
@@ -457,7 +462,8 @@
457
462
  font-size: 14px;
458
463
  }
459
464
 
460
- .e-bigger .e-multiselect.e-control-container .e-multi-select-wrapper .e-clear-icon {
465
+ .e-bigger .e-multiselect.e-control-container .e-multi-select-wrapper .e-clear-icon,
466
+ .e-bigger.e-multiselect.e-control-container .e-multi-select-wrapper .e-clear-icon {
461
467
  margin-top: -2.7em;
462
468
  margin-top: -2.25em;
463
469
  }
package/styles/multi-select/highcontrast-light.css CHANGED
@@ -462,8 +462,10 @@
462
462
  margin-top: -3.5em;
463
463
  }
464
464
 
465
- .e-bigger .e-multiselect.e-control-container .e-multi-select-wrapper .e-clear-icon {
465
+ .e-bigger .e-multiselect.e-control-container .e-multi-select-wrapper .e-clear-icon,
466
+ .e-bigger.e-multiselect.e-control-container .e-multi-select-wrapper .e-clear-icon {
466
467
  margin-top: -3.5em;
468
+ margin-top: -3.2em;
467
469
  }
468
470
 
469
471
  .e-multi-select-wrapper input[type=text] {
package/styles/multi-select/highcontrast.css CHANGED
@@ -469,8 +469,10 @@
469
469
  margin-top: -3.5em;
470
470
  }
471
471
 
472
- .e-bigger .e-multiselect.e-control-container .e-multi-select-wrapper .e-clear-icon {
472
+ .e-bigger .e-multiselect.e-control-container .e-multi-select-wrapper .e-clear-icon,
473
+ .e-bigger.e-multiselect.e-control-container .e-multi-select-wrapper .e-clear-icon {
473
474
  margin-top: -3.5em;
475
+ margin-top: -3.2em;
474
476
  }
475
477
 
476
478
  .e-multi-select-wrapper input[type=text] {
package/styles/multi-select/icons/_bds.scss ADDED
@@ -0,0 +1,26 @@
1
+ @include export-module('multiselect-bds-icons') {
2
+ .e-multiselect.e-input-group .e-ddl-icon::before {
3
+ content: '\e729';
4
+ font-family: 'e-icons';
5
+ }
6
+
7
+ .e-multi-select-wrapper .e-chips .e-chips-close::before {
8
+ content: '\e7e7';
9
+ cursor: pointer;
10
+ left: $ddl-chip-close-left;
11
+ position: relative;
12
+ top: $ddl-chip-close-top;
13
+ }
14
+
15
+ .e-multi-select-wrapper .e-close-hooker::before {
16
+ content: '\e7e7';
17
+ cursor: pointer;
18
+ left: $ddl-overall-close-left;
19
+ position: relative;
20
+ top: $ddl-overall-close-top;
21
+ }
22
+
23
+ .e-multiselect.e-input-group .e-ddl-disable-icon::before {
24
+ content: '';
25
+ }
26
+ }
package/styles/multi-select/material-dark.css CHANGED
@@ -895,7 +895,8 @@
895
895
  margin-top: -3em;
896
896
  }
897
897
 
898
- .e-bigger .e-multiselect.e-control-container .e-multi-select-wrapper .e-clear-icon {
898
+ .e-bigger .e-multiselect.e-control-container .e-multi-select-wrapper .e-clear-icon,
899
+ .e-bigger.e-multiselect.e-control-container .e-multi-select-wrapper .e-clear-icon {
899
900
  margin-top: -3em;
900
901
  }
901
902
 
package/styles/multi-select/material.css CHANGED
@@ -903,7 +903,8 @@
903
903
  margin-top: -3em;
904
904
  }
905
905
 
906
- .e-bigger .e-multiselect.e-control-container .e-multi-select-wrapper .e-clear-icon {
906
+ .e-bigger .e-multiselect.e-control-container .e-multi-select-wrapper .e-clear-icon,
907
+ .e-bigger.e-multiselect.e-control-container .e-multi-select-wrapper .e-clear-icon {
907
908
  margin-top: -3em;
908
909
  }
909
910
 
package/styles/multi-select/material3-dark.css CHANGED
@@ -995,7 +995,8 @@
995
995
  height: 38px;
996
996
  }
997
997
 
998
- .e-bigger .e-multiselect.e-control-container .e-multi-select-wrapper .e-clear-icon {
998
+ .e-bigger .e-multiselect.e-control-container .e-multi-select-wrapper .e-clear-icon,
999
+ .e-bigger.e-multiselect.e-control-container .e-multi-select-wrapper .e-clear-icon {
999
1000
  margin-top: -2.5em;
1000
1001
  }
1001
1002
 
package/styles/multi-select/material3.css CHANGED
@@ -1051,7 +1051,8 @@
1051
1051
  height: 38px;
1052
1052
  }
1053
1053
 
1054
- .e-bigger .e-multiselect.e-control-container .e-multi-select-wrapper .e-clear-icon {
1054
+ .e-bigger .e-multiselect.e-control-container .e-multi-select-wrapper .e-clear-icon,
1055
+ .e-bigger.e-multiselect.e-control-container .e-multi-select-wrapper .e-clear-icon {
1055
1056
  margin-top: -2.5em;
1056
1057
  }
1057
1058
 
package/styles/multi-select/tailwind-dark.css CHANGED
@@ -408,7 +408,8 @@
408
408
  width: 40px;
409
409
  }
410
410
 
411
- .e-bigger .e-multiselect.e-control-container .e-multi-select-wrapper .e-clear-icon {
411
+ .e-bigger .e-multiselect.e-control-container .e-multi-select-wrapper .e-clear-icon,
412
+ .e-bigger.e-multiselect.e-control-container .e-multi-select-wrapper .e-clear-icon {
412
413
  margin-top: -1.62em;
413
414
  height: 36px;
414
415
  margin-top: -2em;
package/styles/multi-select/tailwind.css CHANGED
@@ -408,7 +408,8 @@
408
408
  width: 40px;
409
409
  }
410
410
 
411
- .e-bigger .e-multiselect.e-control-container .e-multi-select-wrapper .e-clear-icon {
411
+ .e-bigger .e-multiselect.e-control-container .e-multi-select-wrapper .e-clear-icon,
412
+ .e-bigger.e-multiselect.e-control-container .e-multi-select-wrapper .e-clear-icon {
412
413
  margin-top: -1.62em;
413
414
  height: 36px;
414
415
  margin-top: -2em;
package/styles/tailwind-dark.css CHANGED
@@ -615,7 +615,7 @@
615
615
  .e-bigger.e-ddl.e-popup .e-list-item {
616
616
  font-size: 16px;
617
617
  }
618
- .e-popup.e-ddl-device.e-popup-close {
618
+ .e-popup.e-wide-popup.e-ddl-device.e-popup-close {
619
619
  display: block;
620
620
  visibility: hidden;
621
621
  }
@@ -1665,7 +1665,8 @@ ejs-dropdownlist {
1665
1665
  width: 40px;
1666
1666
  }
1667
1667
 
1668
- .e-bigger .e-multiselect.e-control-container .e-multi-select-wrapper .e-clear-icon {
1668
+ .e-bigger .e-multiselect.e-control-container .e-multi-select-wrapper .e-clear-icon,
1669
+ .e-bigger.e-multiselect.e-control-container .e-multi-select-wrapper .e-clear-icon {
1669
1670
  margin-top: -1.62em;
1670
1671
  height: 36px;
1671
1672
  margin-top: -2em;
package/styles/tailwind.css CHANGED
@@ -615,7 +615,7 @@
615
615
  .e-bigger.e-ddl.e-popup .e-list-item {
616
616
  font-size: 16px;
617
617
  }
618
- .e-popup.e-ddl-device.e-popup-close {
618
+ .e-popup.e-wide-popup.e-ddl-device.e-popup-close {
619
619
  display: block;
620
620
  visibility: hidden;
621
621
  }
@@ -1665,7 +1665,8 @@ ejs-dropdownlist {
1665
1665
  width: 40px;
1666
1666
  }
1667
1667
 
1668
- .e-bigger .e-multiselect.e-control-container .e-multi-select-wrapper .e-clear-icon {
1668
+ .e-bigger .e-multiselect.e-control-container .e-multi-select-wrapper .e-clear-icon,
1669
+ .e-bigger.e-multiselect.e-control-container .e-multi-select-wrapper .e-clear-icon {
1669
1670
  margin-top: -1.62em;
1670
1671
  height: 36px;
1671
1672
  margin-top: -2em;