@syncfusion/ej2-dropdowns 28.2.12 → 29.1.37

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 (137) hide show
  1. package/README.md +1 -1
  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 +135 -67
  6. package/dist/es6/ej2-dropdowns.es2015.js.map +1 -1
  7. package/dist/es6/ej2-dropdowns.es5.js +134 -66
  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.js +4 -3
  14. package/src/combo-box/combo-box.js +7 -2
  15. package/src/drop-down-list/drop-down-list.js +37 -23
  16. package/src/drop-down-tree/drop-down-tree-model.d.ts +1 -1
  17. package/src/drop-down-tree/drop-down-tree.d.ts +1 -1
  18. package/src/drop-down-tree/drop-down-tree.js +6 -4
  19. package/src/list-box/list-box.js +8 -2
  20. package/src/mention/mention-model.d.ts +8 -0
  21. package/src/mention/mention.d.ts +7 -0
  22. package/src/mention/mention.js +27 -7
  23. package/src/multi-select/multi-select.js +45 -25
  24. package/styles/bds-lite.css +7 -0
  25. package/styles/bds.css +7 -0
  26. package/styles/bootstrap-dark-lite.css +11 -4
  27. package/styles/bootstrap-dark.css +11 -4
  28. package/styles/bootstrap-lite.css +7 -0
  29. package/styles/bootstrap.css +7 -0
  30. package/styles/bootstrap4-lite.css +18 -11
  31. package/styles/bootstrap4.css +18 -11
  32. package/styles/bootstrap5-dark-lite.css +38 -31
  33. package/styles/bootstrap5-dark.css +38 -31
  34. package/styles/bootstrap5-lite.css +9 -2
  35. package/styles/bootstrap5.3-lite.css +12 -4
  36. package/styles/bootstrap5.3.css +12 -4
  37. package/styles/bootstrap5.css +9 -2
  38. package/styles/drop-down-base/_bootstrap-dark-definition.scss +3 -1
  39. package/styles/drop-down-base/_bootstrap4-definition.scss +3 -1
  40. package/styles/drop-down-base/bootstrap-dark.css +2 -2
  41. package/styles/drop-down-base/bootstrap4.css +5 -5
  42. package/styles/drop-down-base/bootstrap5-dark.css +13 -13
  43. package/styles/drop-down-base/fabric-dark.css +2 -2
  44. package/styles/drop-down-base/fabric.css +2 -2
  45. package/styles/drop-down-list/_layout.scss +1 -1
  46. package/styles/drop-down-list/bootstrap5-dark.css +2 -2
  47. package/styles/drop-down-tree/_bds-definition.scss +0 -1
  48. package/styles/drop-down-tree/_bigger.scss +5 -0
  49. package/styles/drop-down-tree/_bootstrap4-definition.scss +5 -3
  50. package/styles/drop-down-tree/_layout.scss +5 -1
  51. package/styles/drop-down-tree/_material-definition.scss +4 -2
  52. package/styles/drop-down-tree/bds.css +3 -0
  53. package/styles/drop-down-tree/bootstrap-dark.css +3 -0
  54. package/styles/drop-down-tree/bootstrap.css +3 -0
  55. package/styles/drop-down-tree/bootstrap4.css +4 -1
  56. package/styles/drop-down-tree/bootstrap5-dark.css +9 -6
  57. package/styles/drop-down-tree/bootstrap5.3.css +3 -3
  58. package/styles/drop-down-tree/bootstrap5.css +3 -0
  59. package/styles/drop-down-tree/fabric-dark.css +3 -0
  60. package/styles/drop-down-tree/fabric.css +3 -0
  61. package/styles/drop-down-tree/fluent-dark.css +3 -0
  62. package/styles/drop-down-tree/fluent.css +3 -0
  63. package/styles/drop-down-tree/fluent2.css +9 -0
  64. package/styles/drop-down-tree/highcontrast-light.css +3 -0
  65. package/styles/drop-down-tree/highcontrast.css +3 -0
  66. package/styles/drop-down-tree/material-dark.css +3 -0
  67. package/styles/drop-down-tree/material.css +4 -1
  68. package/styles/drop-down-tree/material3-dark.css +3 -0
  69. package/styles/drop-down-tree/material3.css +3 -0
  70. package/styles/drop-down-tree/tailwind-dark.css +5 -2
  71. package/styles/drop-down-tree/tailwind.css +3 -0
  72. package/styles/drop-down-tree/tailwind3.css +3 -0
  73. package/styles/fabric-dark-lite.css +10 -3
  74. package/styles/fabric-dark.css +10 -3
  75. package/styles/fabric-lite.css +14 -7
  76. package/styles/fabric.css +14 -7
  77. package/styles/fluent-dark-lite.css +7 -0
  78. package/styles/fluent-dark.css +7 -0
  79. package/styles/fluent-lite.css +7 -0
  80. package/styles/fluent.css +7 -0
  81. package/styles/fluent2-lite.css +12 -1
  82. package/styles/fluent2.css +18 -1
  83. package/styles/highcontrast-light-lite.css +7 -0
  84. package/styles/highcontrast-light.css +7 -0
  85. package/styles/highcontrast-lite.css +7 -0
  86. package/styles/highcontrast.css +7 -0
  87. package/styles/list-box/_bootstrap-dark-definition.scss +3 -1
  88. package/styles/list-box/_bootstrap4-definition.scss +3 -1
  89. package/styles/list-box/_layout.scss +7 -3
  90. package/styles/list-box/bootstrap-dark.css +1 -1
  91. package/styles/list-box/bootstrap4.css +1 -1
  92. package/styles/list-box/bootstrap5-dark.css +3 -3
  93. package/styles/list-box/bootstrap5.3.css +5 -1
  94. package/styles/list-box/fabric-dark.css +1 -1
  95. package/styles/list-box/fabric.css +1 -1
  96. package/styles/list-box/fluent2.css +5 -1
  97. package/styles/list-box/tailwind3.css +6 -2
  98. package/styles/material-dark-lite.css +9 -2
  99. package/styles/material-dark.css +9 -2
  100. package/styles/material-lite.css +13 -6
  101. package/styles/material.css +13 -6
  102. package/styles/material3-dark-lite.css +9 -2
  103. package/styles/material3-dark.css +9 -2
  104. package/styles/material3-lite.css +9 -2
  105. package/styles/material3.css +9 -2
  106. package/styles/multi-select/_bootstrap4-definition.scss +5 -3
  107. package/styles/multi-select/_layout.scss +3 -0
  108. package/styles/multi-select/_material-dark-definition.scss +4 -2
  109. package/styles/multi-select/_material-definition.scss +7 -5
  110. package/styles/multi-select/_material3-definition.scss +4 -2
  111. package/styles/multi-select/bds.css +4 -0
  112. package/styles/multi-select/bootstrap-dark.css +5 -1
  113. package/styles/multi-select/bootstrap.css +4 -0
  114. package/styles/multi-select/bootstrap4.css +8 -4
  115. package/styles/multi-select/bootstrap5-dark.css +11 -7
  116. package/styles/multi-select/bootstrap5.3.css +4 -0
  117. package/styles/multi-select/bootstrap5.css +6 -2
  118. package/styles/multi-select/fabric-dark.css +4 -0
  119. package/styles/multi-select/fabric.css +8 -4
  120. package/styles/multi-select/fluent-dark.css +4 -0
  121. package/styles/multi-select/fluent.css +4 -0
  122. package/styles/multi-select/fluent2.css +4 -0
  123. package/styles/multi-select/highcontrast-light.css +4 -0
  124. package/styles/multi-select/highcontrast.css +4 -0
  125. package/styles/multi-select/material-dark.css +6 -2
  126. package/styles/multi-select/material.css +9 -5
  127. package/styles/multi-select/material3-dark.css +6 -2
  128. package/styles/multi-select/material3.css +6 -2
  129. package/styles/multi-select/tailwind-dark.css +4 -0
  130. package/styles/multi-select/tailwind.css +4 -0
  131. package/styles/multi-select/tailwind3.css +4 -0
  132. package/styles/tailwind-dark-lite.css +9 -2
  133. package/styles/tailwind-dark.css +9 -2
  134. package/styles/tailwind-lite.css +7 -0
  135. package/styles/tailwind.css +7 -0
  136. package/styles/tailwind3-lite.css +13 -2
  137. package/styles/tailwind3.css +13 -2
@@ -824,6 +824,9 @@ ejs-dropdownlist {
824
824
  padding: 0 8px;
825
825
  line-height: 30px;
826
826
  }
827
+ .e-ddt .e-overflow.e-show-text.e-input-value:not(.e-icon-hide) {
828
+ display: inline-grid;
829
+ }
827
830
  .e-ddt .e-overflow.e-total-count {
828
831
  -webkit-box-sizing: border-box;
829
832
  box-sizing: border-box;
@@ -1264,6 +1267,10 @@ ejs-dropdownlist {
1264
1267
  .e-multiselect.e-control-container.e-input-group.e-rtl .e-multi-select-wrapper .e-multi-searcher {
1265
1268
  float: right;
1266
1269
  }
1270
+ .e-multiselect.e-control-container.e-rtl .e-multi-select-wrapper.e-delimiter .e-multi-searcher,
1271
+ .e-multiselect.e-control-container.e-input-group.e-rtl .e-multi-select-wrapper.e-delimiter .e-multi-searcher {
1272
+ float: none;
1273
+ }
1267
1274
  .e-multiselect.e-control-container.e-rtl .e-multi-select-wrapper .e-clear-icon,
1268
1275
  .e-multiselect.e-control-container.e-rtl .e-multi-select-wrapper .e-ddl-icon,
1269
1276
  .e-multiselect.e-control-container.e-input-group.e-rtl .e-multi-select-wrapper .e-clear-icon,
@@ -1010,6 +1010,9 @@ ejs-dropdownlist {
1010
1010
  padding: 0 8px;
1011
1011
  line-height: 30px;
1012
1012
  }
1013
+ .e-ddt .e-overflow.e-show-text.e-input-value:not(.e-icon-hide) {
1014
+ display: inline-grid;
1015
+ }
1013
1016
  .e-ddt .e-overflow.e-total-count {
1014
1017
  -webkit-box-sizing: border-box;
1015
1018
  box-sizing: border-box;
@@ -1582,6 +1585,10 @@ ejs-dropdownlist {
1582
1585
  .e-multiselect.e-control-container.e-input-group.e-rtl .e-multi-select-wrapper .e-multi-searcher {
1583
1586
  float: right;
1584
1587
  }
1588
+ .e-multiselect.e-control-container.e-rtl .e-multi-select-wrapper.e-delimiter .e-multi-searcher,
1589
+ .e-multiselect.e-control-container.e-input-group.e-rtl .e-multi-select-wrapper.e-delimiter .e-multi-searcher {
1590
+ float: none;
1591
+ }
1585
1592
  .e-multiselect.e-control-container.e-rtl .e-multi-select-wrapper .e-clear-icon,
1586
1593
  .e-multiselect.e-control-container.e-rtl .e-multi-select-wrapper .e-ddl-icon,
1587
1594
  .e-multiselect.e-control-container.e-input-group.e-rtl .e-multi-select-wrapper .e-clear-icon,
@@ -824,6 +824,9 @@ ejs-dropdownlist {
824
824
  padding: 0 8px;
825
825
  line-height: 30px;
826
826
  }
827
+ .e-ddt .e-overflow.e-show-text.e-input-value:not(.e-icon-hide) {
828
+ display: inline-grid;
829
+ }
827
830
  .e-ddt .e-overflow.e-total-count {
828
831
  -webkit-box-sizing: border-box;
829
832
  box-sizing: border-box;
@@ -1264,6 +1267,10 @@ ejs-dropdownlist {
1264
1267
  .e-multiselect.e-control-container.e-input-group.e-rtl .e-multi-select-wrapper .e-multi-searcher {
1265
1268
  float: right;
1266
1269
  }
1270
+ .e-multiselect.e-control-container.e-rtl .e-multi-select-wrapper.e-delimiter .e-multi-searcher,
1271
+ .e-multiselect.e-control-container.e-input-group.e-rtl .e-multi-select-wrapper.e-delimiter .e-multi-searcher {
1272
+ float: none;
1273
+ }
1267
1274
  .e-multiselect.e-control-container.e-rtl .e-multi-select-wrapper .e-clear-icon,
1268
1275
  .e-multiselect.e-control-container.e-rtl .e-multi-select-wrapper .e-ddl-icon,
1269
1276
  .e-multiselect.e-control-container.e-input-group.e-rtl .e-multi-select-wrapper .e-clear-icon,
package/styles/fluent.css CHANGED
@@ -1010,6 +1010,9 @@ ejs-dropdownlist {
1010
1010
  padding: 0 8px;
1011
1011
  line-height: 30px;
1012
1012
  }
1013
+ .e-ddt .e-overflow.e-show-text.e-input-value:not(.e-icon-hide) {
1014
+ display: inline-grid;
1015
+ }
1013
1016
  .e-ddt .e-overflow.e-total-count {
1014
1017
  -webkit-box-sizing: border-box;
1015
1018
  box-sizing: border-box;
@@ -1582,6 +1585,10 @@ ejs-dropdownlist {
1582
1585
  .e-multiselect.e-control-container.e-input-group.e-rtl .e-multi-select-wrapper .e-multi-searcher {
1583
1586
  float: right;
1584
1587
  }
1588
+ .e-multiselect.e-control-container.e-rtl .e-multi-select-wrapper.e-delimiter .e-multi-searcher,
1589
+ .e-multiselect.e-control-container.e-input-group.e-rtl .e-multi-select-wrapper.e-delimiter .e-multi-searcher {
1590
+ float: none;
1591
+ }
1585
1592
  .e-multiselect.e-control-container.e-rtl .e-multi-select-wrapper .e-clear-icon,
1586
1593
  .e-multiselect.e-control-container.e-rtl .e-multi-select-wrapper .e-ddl-icon,
1587
1594
  .e-multiselect.e-control-container.e-input-group.e-rtl .e-multi-select-wrapper .e-clear-icon,
@@ -1012,6 +1012,9 @@ ejs-dropdownlist {
1012
1012
  .e-ddt .e-overflow.e-show-text {
1013
1013
  padding: 3px 12px;
1014
1014
  }
1015
+ .e-ddt .e-overflow.e-show-text.e-input-value:not(.e-icon-hide) {
1016
+ display: inline-grid;
1017
+ }
1015
1018
  .e-ddt .e-overflow.e-total-count {
1016
1019
  -webkit-box-sizing: border-box;
1017
1020
  box-sizing: border-box;
@@ -1470,6 +1473,10 @@ ejs-dropdownlist {
1470
1473
  .e-multiselect.e-control-container.e-input-group.e-rtl .e-multi-select-wrapper .e-multi-searcher {
1471
1474
  float: right;
1472
1475
  }
1476
+ .e-multiselect.e-control-container.e-rtl .e-multi-select-wrapper.e-delimiter .e-multi-searcher,
1477
+ .e-multiselect.e-control-container.e-input-group.e-rtl .e-multi-select-wrapper.e-delimiter .e-multi-searcher {
1478
+ float: none;
1479
+ }
1473
1480
  .e-multiselect.e-control-container.e-rtl .e-multi-select-wrapper .e-clear-icon,
1474
1481
  .e-multiselect.e-control-container.e-rtl .e-multi-select-wrapper .e-ddl-icon,
1475
1482
  .e-multiselect.e-control-container.e-input-group.e-rtl .e-multi-select-wrapper .e-clear-icon,
@@ -2324,7 +2331,6 @@ ejs-multiselect {
2324
2331
  -ms-user-select: none;
2325
2332
  user-select: none;
2326
2333
  width: 100%;
2327
- border-radius: 4px;
2328
2334
  }
2329
2335
  .e-listbox-wrapper *,
2330
2336
  .e-listbox-container *,
@@ -2332,6 +2338,11 @@ ejs-multiselect {
2332
2338
  -webkit-box-sizing: border-box;
2333
2339
  box-sizing: border-box;
2334
2340
  }
2341
+ .e-listbox-wrapper,
2342
+ .e-listbox-container,
2343
+ .e-listboxtool-wrapper {
2344
+ border-radius: 4px;
2345
+ }
2335
2346
  .e-listbox-wrapper .e-list-wrap:focus-visible, .e-listbox-wrapper:focus,
2336
2347
  .e-listbox-container .e-list-wrap:focus-visible,
2337
2348
  .e-listbox-container:focus,
@@ -1191,6 +1191,9 @@ ejs-dropdownlist {
1191
1191
  .e-ddt .e-overflow.e-show-text {
1192
1192
  padding: 3px 12px;
1193
1193
  }
1194
+ .e-ddt .e-overflow.e-show-text.e-input-value:not(.e-icon-hide) {
1195
+ display: inline-grid;
1196
+ }
1194
1197
  .e-ddt .e-overflow.e-total-count {
1195
1198
  -webkit-box-sizing: border-box;
1196
1199
  box-sizing: border-box;
@@ -1435,12 +1438,18 @@ ejs-dropdownlist {
1435
1438
  .e-ddt.e-bigger.e-input-group.e-control-wrapper .e-clear-icon,
1436
1439
  .e-ddt.e-bigger.e-float-input.e-control-wrapper .e-clear-icon {
1437
1440
  min-height: 24px;
1441
+ padding: 0;
1438
1442
  }
1439
1443
  .e-bigger .e-ddt.e-input-group.e-control-wrapper .e-clear-icon::before, .e-bigger .e-ddt.e-float-input.e-control-wrapper .e-clear-icon::before,
1440
1444
  .e-ddt.e-bigger.e-input-group.e-control-wrapper .e-clear-icon::before,
1441
1445
  .e-ddt.e-bigger.e-float-input.e-control-wrapper .e-clear-icon::before {
1442
1446
  font-size: 18px;
1443
1447
  }
1448
+ .e-bigger .e-ddt.e-show-chip .e-overflow .e-remain.e-wrap-count,
1449
+ .e-ddt.e-bigger.e-show-chip .e-overflow .e-remain.e-wrap-count {
1450
+ padding-top: 9px;
1451
+ padding-bottom: 9px;
1452
+ }
1444
1453
  .e-bigger .e-ddt .e-overflow.e-show-text,
1445
1454
  .e-ddt.e-bigger .e-overflow.e-show-text {
1446
1455
  padding: 7px 16px;
@@ -1746,6 +1755,10 @@ ejs-dropdownlist {
1746
1755
  .e-multiselect.e-control-container.e-input-group.e-rtl .e-multi-select-wrapper .e-multi-searcher {
1747
1756
  float: right;
1748
1757
  }
1758
+ .e-multiselect.e-control-container.e-rtl .e-multi-select-wrapper.e-delimiter .e-multi-searcher,
1759
+ .e-multiselect.e-control-container.e-input-group.e-rtl .e-multi-select-wrapper.e-delimiter .e-multi-searcher {
1760
+ float: none;
1761
+ }
1749
1762
  .e-multiselect.e-control-container.e-rtl .e-multi-select-wrapper .e-clear-icon,
1750
1763
  .e-multiselect.e-control-container.e-rtl .e-multi-select-wrapper .e-ddl-icon,
1751
1764
  .e-multiselect.e-control-container.e-input-group.e-rtl .e-multi-select-wrapper .e-clear-icon,
@@ -2990,7 +3003,6 @@ ejs-multiselect {
2990
3003
  -ms-user-select: none;
2991
3004
  user-select: none;
2992
3005
  width: 100%;
2993
- border-radius: 4px;
2994
3006
  }
2995
3007
  .e-listbox-wrapper *,
2996
3008
  .e-listbox-container *,
@@ -2998,6 +3010,11 @@ ejs-multiselect {
2998
3010
  -webkit-box-sizing: border-box;
2999
3011
  box-sizing: border-box;
3000
3012
  }
3013
+ .e-listbox-wrapper,
3014
+ .e-listbox-container,
3015
+ .e-listboxtool-wrapper {
3016
+ border-radius: 4px;
3017
+ }
3001
3018
  .e-listbox-wrapper .e-list-wrap:focus-visible, .e-listbox-wrapper:focus,
3002
3019
  .e-listbox-container .e-list-wrap:focus-visible,
3003
3020
  .e-listbox-container:focus,
@@ -762,6 +762,9 @@ ejs-dropdownlist {
762
762
  .e-ddt .e-overflow.e-show-text {
763
763
  padding: 6px 10px 0 10px;
764
764
  }
765
+ .e-ddt .e-overflow.e-show-text.e-input-value:not(.e-icon-hide) {
766
+ display: inline-grid;
767
+ }
765
768
  .e-ddt .e-overflow.e-total-count {
766
769
  -webkit-box-sizing: border-box;
767
770
  box-sizing: border-box;
@@ -1264,6 +1267,10 @@ ejs-dropdownlist {
1264
1267
  .e-multiselect.e-control-container.e-input-group.e-rtl .e-multi-select-wrapper .e-multi-searcher {
1265
1268
  float: right;
1266
1269
  }
1270
+ .e-multiselect.e-control-container.e-rtl .e-multi-select-wrapper.e-delimiter .e-multi-searcher,
1271
+ .e-multiselect.e-control-container.e-input-group.e-rtl .e-multi-select-wrapper.e-delimiter .e-multi-searcher {
1272
+ float: none;
1273
+ }
1267
1274
  .e-multiselect.e-control-container.e-rtl .e-multi-select-wrapper .e-clear-icon,
1268
1275
  .e-multiselect.e-control-container.e-rtl .e-multi-select-wrapper .e-ddl-icon,
1269
1276
  .e-multiselect.e-control-container.e-input-group.e-rtl .e-multi-select-wrapper .e-clear-icon,
@@ -927,6 +927,9 @@ ejs-dropdownlist {
927
927
  .e-ddt .e-overflow.e-show-text {
928
928
  padding: 6px 10px 0 10px;
929
929
  }
930
+ .e-ddt .e-overflow.e-show-text.e-input-value:not(.e-icon-hide) {
931
+ display: inline-grid;
932
+ }
930
933
  .e-ddt .e-overflow.e-total-count {
931
934
  -webkit-box-sizing: border-box;
932
935
  box-sizing: border-box;
@@ -1516,6 +1519,10 @@ ejs-dropdownlist {
1516
1519
  .e-multiselect.e-control-container.e-input-group.e-rtl .e-multi-select-wrapper .e-multi-searcher {
1517
1520
  float: right;
1518
1521
  }
1522
+ .e-multiselect.e-control-container.e-rtl .e-multi-select-wrapper.e-delimiter .e-multi-searcher,
1523
+ .e-multiselect.e-control-container.e-input-group.e-rtl .e-multi-select-wrapper.e-delimiter .e-multi-searcher {
1524
+ float: none;
1525
+ }
1519
1526
  .e-multiselect.e-control-container.e-rtl .e-multi-select-wrapper .e-clear-icon,
1520
1527
  .e-multiselect.e-control-container.e-rtl .e-multi-select-wrapper .e-ddl-icon,
1521
1528
  .e-multiselect.e-control-container.e-input-group.e-rtl .e-multi-select-wrapper .e-clear-icon,
@@ -773,6 +773,9 @@ ejs-dropdownlist {
773
773
  .e-ddt .e-overflow.e-show-text {
774
774
  padding: 6px 10px 0 10px;
775
775
  }
776
+ .e-ddt .e-overflow.e-show-text.e-input-value:not(.e-icon-hide) {
777
+ display: inline-grid;
778
+ }
776
779
  .e-ddt .e-overflow.e-total-count {
777
780
  -webkit-box-sizing: border-box;
778
781
  box-sizing: border-box;
@@ -1295,6 +1298,10 @@ ejs-dropdownlist {
1295
1298
  .e-multiselect.e-control-container.e-input-group.e-rtl .e-multi-select-wrapper .e-multi-searcher {
1296
1299
  float: right;
1297
1300
  }
1301
+ .e-multiselect.e-control-container.e-rtl .e-multi-select-wrapper.e-delimiter .e-multi-searcher,
1302
+ .e-multiselect.e-control-container.e-input-group.e-rtl .e-multi-select-wrapper.e-delimiter .e-multi-searcher {
1303
+ float: none;
1304
+ }
1298
1305
  .e-multiselect.e-control-container.e-rtl .e-multi-select-wrapper .e-clear-icon,
1299
1306
  .e-multiselect.e-control-container.e-rtl .e-multi-select-wrapper .e-ddl-icon,
1300
1307
  .e-multiselect.e-control-container.e-input-group.e-rtl .e-multi-select-wrapper .e-clear-icon,
@@ -938,6 +938,9 @@ ejs-dropdownlist {
938
938
  .e-ddt .e-overflow.e-show-text {
939
939
  padding: 6px 10px 0 10px;
940
940
  }
941
+ .e-ddt .e-overflow.e-show-text.e-input-value:not(.e-icon-hide) {
942
+ display: inline-grid;
943
+ }
941
944
  .e-ddt .e-overflow.e-total-count {
942
945
  -webkit-box-sizing: border-box;
943
946
  box-sizing: border-box;
@@ -1547,6 +1550,10 @@ ejs-dropdownlist {
1547
1550
  .e-multiselect.e-control-container.e-input-group.e-rtl .e-multi-select-wrapper .e-multi-searcher {
1548
1551
  float: right;
1549
1552
  }
1553
+ .e-multiselect.e-control-container.e-rtl .e-multi-select-wrapper.e-delimiter .e-multi-searcher,
1554
+ .e-multiselect.e-control-container.e-input-group.e-rtl .e-multi-select-wrapper.e-delimiter .e-multi-searcher {
1555
+ float: none;
1556
+ }
1550
1557
  .e-multiselect.e-control-container.e-rtl .e-multi-select-wrapper .e-clear-icon,
1551
1558
  .e-multiselect.e-control-container.e-rtl .e-multi-select-wrapper .e-ddl-icon,
1552
1559
  .e-multiselect.e-control-container.e-input-group.e-rtl .e-multi-select-wrapper .e-clear-icon,
@@ -1,3 +1,5 @@
1
+ @use 'sass:color';
2
+
1
3
  //default
2
4
  $listbox-font-family: $font-family !default;
3
5
  $listbox-text-color: rgba($grey-dark-font, 1) !default;
@@ -49,7 +51,7 @@ $listbox-header-height: 40px !default;
49
51
  $listbox-header-font-weight: bold !default;
50
52
  $listbox-header-line-height: 1px !default;
51
53
  $listbox-header-padding-bottom: 4px !default;
52
- $listbox-groupheader-text-color: lighten($brand-primary, 15%) !default;
54
+ $listbox-groupheader-text-color: color.adjust($brand-primary, $lightness: 15%) !default;
53
55
  $listbox-groupheader-bg: $grey-base !default;
54
56
  $listbox-groupheader-border: $grey-44 !default;
55
57
  $listbox-groupheader-icon: $grey-dark-font !default;
@@ -1,3 +1,5 @@
1
+ @use 'sass:color';
2
+
1
3
  $listbox-font-family: $font-family !default;
2
4
  $listbox-text-color: rgba($gray-900, 1) !default;
3
5
  $listbox-text-disabled: $gray-600 !default;
@@ -9,7 +11,7 @@ $listbox-icon-back-margin: 0 !default;
9
11
  $listbox-rtl-icon-back-margin: 0 !default;
10
12
  $listbox-background: $content-bg !default;
11
13
  $listbox-line-color: rgba($black, .13) !default;
12
- $listbox-item-hover-bg: darken($gray-100, 5%) !default;
14
+ $listbox-item-hover-bg: color.adjust($gray-100, $lightness: -5%) !default;
13
15
  $listbox-item-height: 40px !default;
14
16
  $listbox-item-line-height: 1.5 !default;
15
17
  $listbox-item-padding: 10px 16px 10px 16px !default;
@@ -16,11 +16,15 @@
16
16
  }
17
17
 
18
18
  @if $skin-name == 'fluent2' or $theme-name == 'bootstrap5.3' or $theme-name == 'bootstrap5.3-dark' {
19
- border-radius: 4px;
19
+ & {
20
+ border-radius: 4px;
21
+ }
20
22
  }
21
23
  @if $skin-name == 'tailwind3' {
22
- font-weight: $font-weight-medium;
23
- border-radius: 6px;
24
+ & {
25
+ font-weight: $font-weight-medium;
26
+ border-radius: 6px;
27
+ }
24
28
  }
25
29
 
26
30
  &.e-listboxtool-container .e-list-wrap {
@@ -584,7 +584,7 @@ ejs-listbox {
584
584
  .e-listboxtool-wrapper .e-list-group-item {
585
585
  background-color: #1a1a1a;
586
586
  border-color: #414141;
587
- color: #3e98ff;
587
+ color: rgb(61.5, 151.8, 255);
588
588
  font-size: 14px;
589
589
  }
590
590
 
@@ -557,7 +557,7 @@ ejs-listbox {
557
557
  .e-listbox-container .e-list-item:hover.e-selected.e-checklist:not(.e-disabled),
558
558
  .e-listboxtool-wrapper .e-list-item:hover:not(.e-selected):not(.e-disabled),
559
559
  .e-listboxtool-wrapper .e-list-item:hover.e-selected.e-checklist:not(.e-disabled) {
560
- background-color: #e9ecef;
560
+ background-color: rgb(233.125, 236.25, 239.375);
561
561
  border-color: transparent;
562
562
  color: #212529;
563
563
  }
@@ -450,7 +450,7 @@ ejs-listbox {
450
450
  }
451
451
  .e-listboxtool-wrapper .e-listbox-tool,
452
452
  .e-listboxtool-container .e-listbox-tool {
453
- border: 1px solid #444c54;
453
+ border: 1px solid rgb(68.0034482759, 75.85, 83.6965517241);
454
454
  overflow: auto;
455
455
  padding: 8px;
456
456
  }
@@ -511,7 +511,7 @@ ejs-listbox {
511
511
  .e-listbox-wrapper,
512
512
  .e-listbox-container:not(.e-listboxtool-container):not(.e-sortableclone),
513
513
  .e-listboxtool-container.e-listbox-container .e-ul {
514
- border: 1px solid #444c54;
514
+ border: 1px solid rgb(68.0034482759, 75.85, 83.6965517241);
515
515
  }
516
516
 
517
517
  .e-listbox-wrapper,
@@ -609,7 +609,7 @@ ejs-listbox {
609
609
  .e-listbox-container .e-selectall-parent,
610
610
  .e-listboxtool-wrapper .e-selectall-parent {
611
611
  background-color: transparent;
612
- border-bottom: 1px solid #444c54;
612
+ border-bottom: 1px solid rgb(68.0034482759, 75.85, 83.6965517241);
613
613
  color: #fff;
614
614
  }
615
615
 
@@ -61,7 +61,6 @@
61
61
  -ms-user-select: none;
62
62
  user-select: none;
63
63
  width: 100%;
64
- border-radius: 4px;
65
64
  }
66
65
  .e-listbox-wrapper *,
67
66
  .e-listbox-container *,
@@ -69,6 +68,11 @@
69
68
  -webkit-box-sizing: border-box;
70
69
  box-sizing: border-box;
71
70
  }
71
+ .e-listbox-wrapper,
72
+ .e-listbox-container,
73
+ .e-listboxtool-wrapper {
74
+ border-radius: 4px;
75
+ }
72
76
  .e-listbox-wrapper.e-listboxtool-container .e-list-wrap,
73
77
  .e-listbox-container.e-listboxtool-container .e-list-wrap,
74
78
  .e-listboxtool-wrapper.e-listboxtool-container .e-list-wrap {
@@ -584,7 +584,7 @@ ejs-listbox {
584
584
  .e-listboxtool-wrapper .e-list-group-item {
585
585
  background-color: #201f1f;
586
586
  border-color: #414040;
587
- color: #38a9ff;
587
+ color: rgb(0, 55.1, 96.9);
588
588
  font-size: 14px;
589
589
  }
590
590
 
@@ -570,7 +570,7 @@ ejs-listbox {
570
570
  .e-listboxtool-wrapper .e-list-item.e-focused,
571
571
  .e-listboxtool-wrapper .e-list-item.e-focused.e-selected.e-checklist,
572
572
  .e-listboxtool-wrapper .e-list-item.e-selected {
573
- background-color: #d1ebff;
573
+ background-color: rgb(208.9, 234.7504672897, 255);
574
574
  color: #333;
575
575
  }
576
576
 
@@ -74,7 +74,6 @@
74
74
  -ms-user-select: none;
75
75
  user-select: none;
76
76
  width: 100%;
77
- border-radius: 4px;
78
77
  }
79
78
  .e-listbox-wrapper *,
80
79
  .e-listbox-container *,
@@ -82,6 +81,11 @@
82
81
  -webkit-box-sizing: border-box;
83
82
  box-sizing: border-box;
84
83
  }
84
+ .e-listbox-wrapper,
85
+ .e-listbox-container,
86
+ .e-listboxtool-wrapper {
87
+ border-radius: 4px;
88
+ }
85
89
  .e-listbox-wrapper .e-list-wrap:focus-visible, .e-listbox-wrapper:focus,
86
90
  .e-listbox-container .e-list-wrap:focus-visible,
87
91
  .e-listbox-container:focus,
@@ -61,8 +61,6 @@
61
61
  -ms-user-select: none;
62
62
  user-select: none;
63
63
  width: 100%;
64
- font-weight: 500;
65
- border-radius: 6px;
66
64
  }
67
65
  .e-listbox-wrapper *,
68
66
  .e-listbox-container *,
@@ -70,6 +68,12 @@
70
68
  -webkit-box-sizing: border-box;
71
69
  box-sizing: border-box;
72
70
  }
71
+ .e-listbox-wrapper,
72
+ .e-listbox-container,
73
+ .e-listboxtool-wrapper {
74
+ font-weight: 500;
75
+ border-radius: 6px;
76
+ }
73
77
  .e-listbox-wrapper .e-list-wrap:focus-visible, .e-listbox-wrapper:focus,
74
78
  .e-listbox-container .e-list-wrap:focus-visible,
75
79
  .e-listbox-container:focus,
@@ -908,6 +908,9 @@ ejs-dropdownlist {
908
908
  .e-ddt .e-overflow.e-show-text {
909
909
  padding: 6px 0 0 0;
910
910
  }
911
+ .e-ddt .e-overflow.e-show-text.e-input-value:not(.e-icon-hide) {
912
+ display: inline-grid;
913
+ }
911
914
  .e-ddt .e-overflow.e-total-count {
912
915
  -webkit-box-sizing: border-box;
913
916
  box-sizing: border-box;
@@ -1618,6 +1621,10 @@ ejs-dropdownlist {
1618
1621
  .e-multiselect.e-control-container.e-input-group.e-rtl .e-multi-select-wrapper .e-multi-searcher {
1619
1622
  float: right;
1620
1623
  }
1624
+ .e-multiselect.e-control-container.e-rtl .e-multi-select-wrapper.e-delimiter .e-multi-searcher,
1625
+ .e-multiselect.e-control-container.e-input-group.e-rtl .e-multi-select-wrapper.e-delimiter .e-multi-searcher {
1626
+ float: none;
1627
+ }
1621
1628
  .e-multiselect.e-control-container.e-rtl .e-multi-select-wrapper .e-clear-icon,
1622
1629
  .e-multiselect.e-control-container.e-rtl .e-multi-select-wrapper .e-ddl-icon,
1623
1630
  .e-multiselect.e-control-container.e-input-group.e-rtl .e-multi-select-wrapper .e-clear-icon,
@@ -2697,12 +2704,12 @@ ejs-multiselect {
2697
2704
 
2698
2705
  .e-multiselect.e-outline .e-multi-select-wrapper .e-chips.e-chip-selected,
2699
2706
  .e-multiselect.e-filled .e-multi-select-wrapper .e-chips.e-chip-selected {
2700
- background-color: #c7c7c7;
2707
+ background-color: rgb(198.5, 198.5, 198.5);
2701
2708
  }
2702
2709
 
2703
2710
  .e-multiselect.e-outline .e-multi-select-wrapper .e-chips.e-chip-selected:hover,
2704
2711
  .e-multiselect.e-filled .e-multi-select-wrapper .e-chips.e-chip-selected:hover {
2705
- background-color: #c7c7c7;
2712
+ background-color: rgb(198.5, 198.5, 198.5);
2706
2713
  }
2707
2714
 
2708
2715
  .e-multiselect.e-outline .e-multi-select-wrapper .e-chips.e-chip-selected > .e-chipcontent,
@@ -1068,6 +1068,9 @@ ejs-dropdownlist {
1068
1068
  .e-ddt .e-overflow.e-show-text {
1069
1069
  padding: 6px 0 0 0;
1070
1070
  }
1071
+ .e-ddt .e-overflow.e-show-text.e-input-value:not(.e-icon-hide) {
1072
+ display: inline-grid;
1073
+ }
1071
1074
  .e-ddt .e-overflow.e-total-count {
1072
1075
  -webkit-box-sizing: border-box;
1073
1076
  box-sizing: border-box;
@@ -2039,6 +2042,10 @@ ejs-dropdownlist {
2039
2042
  .e-multiselect.e-control-container.e-input-group.e-rtl .e-multi-select-wrapper .e-multi-searcher {
2040
2043
  float: right;
2041
2044
  }
2045
+ .e-multiselect.e-control-container.e-rtl .e-multi-select-wrapper.e-delimiter .e-multi-searcher,
2046
+ .e-multiselect.e-control-container.e-input-group.e-rtl .e-multi-select-wrapper.e-delimiter .e-multi-searcher {
2047
+ float: none;
2048
+ }
2042
2049
  .e-multiselect.e-control-container.e-rtl .e-multi-select-wrapper .e-clear-icon,
2043
2050
  .e-multiselect.e-control-container.e-rtl .e-multi-select-wrapper .e-ddl-icon,
2044
2051
  .e-multiselect.e-control-container.e-input-group.e-rtl .e-multi-select-wrapper .e-clear-icon,
@@ -3118,12 +3125,12 @@ ejs-multiselect {
3118
3125
 
3119
3126
  .e-multiselect.e-outline .e-multi-select-wrapper .e-chips.e-chip-selected,
3120
3127
  .e-multiselect.e-filled .e-multi-select-wrapper .e-chips.e-chip-selected {
3121
- background-color: #c7c7c7;
3128
+ background-color: rgb(198.5, 198.5, 198.5);
3122
3129
  }
3123
3130
 
3124
3131
  .e-multiselect.e-outline .e-multi-select-wrapper .e-chips.e-chip-selected:hover,
3125
3132
  .e-multiselect.e-filled .e-multi-select-wrapper .e-chips.e-chip-selected:hover {
3126
- background-color: #c7c7c7;
3133
+ background-color: rgb(198.5, 198.5, 198.5);
3127
3134
  }
3128
3135
 
3129
3136
  .e-multiselect.e-outline .e-multi-select-wrapper .e-chips.e-chip-selected > .e-chipcontent,
@@ -927,6 +927,9 @@ ejs-dropdownlist {
927
927
  .e-ddt .e-overflow.e-show-text {
928
928
  padding: 6px 0 0 0;
929
929
  }
930
+ .e-ddt .e-overflow.e-show-text.e-input-value:not(.e-icon-hide) {
931
+ display: inline-grid;
932
+ }
930
933
  .e-ddt .e-overflow.e-total-count {
931
934
  -webkit-box-sizing: border-box;
932
935
  box-sizing: border-box;
@@ -1177,7 +1180,7 @@ ejs-dropdownlist {
1177
1180
  color: rgba(0, 0, 0, 0.87);
1178
1181
  }
1179
1182
  .e-ddt.e-filled .e-chips {
1180
- background-color: #cecece;
1183
+ background-color: rgb(206.15, 206.15, 206.15);
1181
1184
  }
1182
1185
  .e-ddt .e-overflow .e-remain {
1183
1186
  color: rgba(0, 0, 0, 0.54);
@@ -1640,6 +1643,10 @@ ejs-dropdownlist {
1640
1643
  .e-multiselect.e-control-container.e-input-group.e-rtl .e-multi-select-wrapper .e-multi-searcher {
1641
1644
  float: right;
1642
1645
  }
1646
+ .e-multiselect.e-control-container.e-rtl .e-multi-select-wrapper.e-delimiter .e-multi-searcher,
1647
+ .e-multiselect.e-control-container.e-input-group.e-rtl .e-multi-select-wrapper.e-delimiter .e-multi-searcher {
1648
+ float: none;
1649
+ }
1643
1650
  .e-multiselect.e-control-container.e-rtl .e-multi-select-wrapper .e-clear-icon,
1644
1651
  .e-multiselect.e-control-container.e-rtl .e-multi-select-wrapper .e-ddl-icon,
1645
1652
  .e-multiselect.e-control-container.e-input-group.e-rtl .e-multi-select-wrapper .e-clear-icon,
@@ -2701,25 +2708,25 @@ ejs-multiselect {
2701
2708
  }
2702
2709
 
2703
2710
  .e-multiselect.e-filled .e-multi-select-wrapper .e-chips {
2704
- background-color: #cecece;
2711
+ background-color: rgb(206.15, 206.15, 206.15);
2705
2712
  }
2706
2713
 
2707
2714
  .e-multiselect.e-outline .e-multi-select-wrapper .e-chips:hover {
2708
- background-color: #d6d6d6;
2715
+ background-color: rgb(213.8, 213.8, 213.8);
2709
2716
  }
2710
2717
 
2711
2718
  .e-multiselect.e-filled .e-multi-select-wrapper .e-chips:hover {
2712
- background-color: #cecece;
2719
+ background-color: rgb(206.15, 206.15, 206.15);
2713
2720
  }
2714
2721
 
2715
2722
  .e-multiselect.e-outline .e-multi-select-wrapper .e-chips.e-chip-selected,
2716
2723
  .e-multiselect.e-filled .e-multi-select-wrapper .e-chips.e-chip-selected {
2717
- background-color: #c7c7c7;
2724
+ background-color: rgb(198.5, 198.5, 198.5);
2718
2725
  }
2719
2726
 
2720
2727
  .e-multiselect.e-outline .e-multi-select-wrapper .e-chips.e-chip-selected:hover,
2721
2728
  .e-multiselect.e-filled .e-multi-select-wrapper .e-chips.e-chip-selected:hover {
2722
- background-color: #c7c7c7;
2729
+ background-color: rgb(198.5, 198.5, 198.5);
2723
2730
  }
2724
2731
 
2725
2732
  .e-multiselect.e-outline .e-multi-select-wrapper .e-chips.e-chip-selected > .e-chipcontent,
@@ -1108,6 +1108,9 @@ ejs-dropdownlist {
1108
1108
  .e-ddt .e-overflow.e-show-text {
1109
1109
  padding: 6px 0 0 0;
1110
1110
  }
1111
+ .e-ddt .e-overflow.e-show-text.e-input-value:not(.e-icon-hide) {
1112
+ display: inline-grid;
1113
+ }
1111
1114
  .e-ddt .e-overflow.e-total-count {
1112
1115
  -webkit-box-sizing: border-box;
1113
1116
  box-sizing: border-box;
@@ -1358,7 +1361,7 @@ ejs-dropdownlist {
1358
1361
  color: rgba(0, 0, 0, 0.87);
1359
1362
  }
1360
1363
  .e-ddt.e-filled .e-chips {
1361
- background-color: #cecece;
1364
+ background-color: rgb(206.15, 206.15, 206.15);
1362
1365
  }
1363
1366
  .e-ddt .e-overflow .e-remain {
1364
1367
  color: rgba(0, 0, 0, 0.54);
@@ -2082,6 +2085,10 @@ ejs-dropdownlist {
2082
2085
  .e-multiselect.e-control-container.e-input-group.e-rtl .e-multi-select-wrapper .e-multi-searcher {
2083
2086
  float: right;
2084
2087
  }
2088
+ .e-multiselect.e-control-container.e-rtl .e-multi-select-wrapper.e-delimiter .e-multi-searcher,
2089
+ .e-multiselect.e-control-container.e-input-group.e-rtl .e-multi-select-wrapper.e-delimiter .e-multi-searcher {
2090
+ float: none;
2091
+ }
2085
2092
  .e-multiselect.e-control-container.e-rtl .e-multi-select-wrapper .e-clear-icon,
2086
2093
  .e-multiselect.e-control-container.e-rtl .e-multi-select-wrapper .e-ddl-icon,
2087
2094
  .e-multiselect.e-control-container.e-input-group.e-rtl .e-multi-select-wrapper .e-clear-icon,
@@ -3143,25 +3150,25 @@ ejs-multiselect {
3143
3150
  }
3144
3151
 
3145
3152
  .e-multiselect.e-filled .e-multi-select-wrapper .e-chips {
3146
- background-color: #cecece;
3153
+ background-color: rgb(206.15, 206.15, 206.15);
3147
3154
  }
3148
3155
 
3149
3156
  .e-multiselect.e-outline .e-multi-select-wrapper .e-chips:hover {
3150
- background-color: #d6d6d6;
3157
+ background-color: rgb(213.8, 213.8, 213.8);
3151
3158
  }
3152
3159
 
3153
3160
  .e-multiselect.e-filled .e-multi-select-wrapper .e-chips:hover {
3154
- background-color: #cecece;
3161
+ background-color: rgb(206.15, 206.15, 206.15);
3155
3162
  }
3156
3163
 
3157
3164
  .e-multiselect.e-outline .e-multi-select-wrapper .e-chips.e-chip-selected,
3158
3165
  .e-multiselect.e-filled .e-multi-select-wrapper .e-chips.e-chip-selected {
3159
- background-color: #c7c7c7;
3166
+ background-color: rgb(198.5, 198.5, 198.5);
3160
3167
  }
3161
3168
 
3162
3169
  .e-multiselect.e-outline .e-multi-select-wrapper .e-chips.e-chip-selected:hover,
3163
3170
  .e-multiselect.e-filled .e-multi-select-wrapper .e-chips.e-chip-selected:hover {
3164
- background-color: #c7c7c7;
3171
+ background-color: rgb(198.5, 198.5, 198.5);
3165
3172
  }
3166
3173
 
3167
3174
  .e-multiselect.e-outline .e-multi-select-wrapper .e-chips.e-chip-selected > .e-chipcontent,