@syncfusion/ej2-dropdowns 20.1.59 → 20.2.36

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 (95) hide show
  1. package/CHANGELOG.md +1 -61
  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 +106 -100
  5. package/dist/es6/ej2-dropdowns.es2015.js.map +1 -1
  6. package/dist/es6/ej2-dropdowns.es5.js +69 -63
  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/helpers/e2e/autocomplete.js +59 -43
  12. package/helpers/e2e/combobox.js +62 -46
  13. package/helpers/e2e/dropdownlist.js +71 -55
  14. package/helpers/e2e/index.js +11 -9
  15. package/helpers/e2e/listboxHelper.js +55 -38
  16. package/helpers/e2e/multiselect.js +104 -88
  17. package/package.json +11 -11
  18. package/src/common/incremental-search.js +1 -1
  19. package/src/drop-down-base/drop-down-base-model.d.ts +1 -1
  20. package/src/drop-down-base/drop-down-base.d.ts +5 -1
  21. package/src/drop-down-base/drop-down-base.js +3 -5
  22. package/src/drop-down-list/drop-down-list.js +12 -14
  23. package/src/drop-down-tree/drop-down-tree-model.d.ts +2 -2
  24. package/src/drop-down-tree/drop-down-tree.js +5 -5
  25. package/src/list-box/list-box.d.ts +1 -0
  26. package/src/list-box/list-box.js +22 -13
  27. package/src/multi-select/multi-select-model.d.ts +1 -1
  28. package/src/multi-select/multi-select.d.ts +2 -1
  29. package/src/multi-select/multi-select.js +26 -25
  30. package/styles/auto-complete/_fusionnew-definition.scss +2 -0
  31. package/styles/auto-complete/_material3-definition.scss +2 -0
  32. package/styles/bootstrap-dark.css +38 -2
  33. package/styles/bootstrap.css +38 -2
  34. package/styles/bootstrap4.css +38 -2
  35. package/styles/bootstrap5-dark.css +38 -2
  36. package/styles/bootstrap5.css +38 -2
  37. package/styles/combo-box/_fusionnew-definition.scss +2 -0
  38. package/styles/combo-box/_material3-definition.scss +2 -0
  39. package/styles/drop-down-base/_fusionnew-definition.scss +111 -0
  40. package/styles/drop-down-base/_material3-definition.scss +111 -0
  41. package/styles/drop-down-list/_fusionnew-definition.scss +201 -0
  42. package/styles/drop-down-list/_material3-definition.scss +201 -0
  43. package/styles/drop-down-list/icons/_fusionnew.scss +14 -0
  44. package/styles/drop-down-list/icons/_material3.scss +14 -0
  45. package/styles/drop-down-tree/_fusionnew-definition.scss +60 -0
  46. package/styles/drop-down-tree/_material3-definition.scss +60 -0
  47. package/styles/drop-down-tree/icons/_fusionnew.scss +11 -0
  48. package/styles/drop-down-tree/icons/_material3.scss +11 -0
  49. package/styles/fabric-dark.css +38 -2
  50. package/styles/fabric.css +38 -2
  51. package/styles/fluent-dark.css +38 -2
  52. package/styles/fluent.css +38 -2
  53. package/styles/highcontrast-light.css +38 -2
  54. package/styles/highcontrast.css +38 -2
  55. package/styles/list-box/_bootstrap-dark-definition.scss +5 -1
  56. package/styles/list-box/_bootstrap-definition.scss +5 -1
  57. package/styles/list-box/_bootstrap4-definition.scss +5 -1
  58. package/styles/list-box/_bootstrap5-definition.scss +7 -0
  59. package/styles/list-box/_fabric-dark-definition.scss +5 -1
  60. package/styles/list-box/_fabric-definition.scss +5 -1
  61. package/styles/list-box/_fluent-definition.scss +7 -0
  62. package/styles/list-box/_fusionnew-definition.scss +113 -0
  63. package/styles/list-box/_highcontrast-definition.scss +5 -1
  64. package/styles/list-box/_highcontrast-light-definition.scss +5 -1
  65. package/styles/list-box/_layout.scss +36 -1
  66. package/styles/list-box/_material-dark-definition.scss +6 -2
  67. package/styles/list-box/_material-definition.scss +6 -2
  68. package/styles/list-box/_material3-definition.scss +119 -0
  69. package/styles/list-box/_tailwind-definition.scss +6 -0
  70. package/styles/list-box/_theme.scss +19 -0
  71. package/styles/list-box/bootstrap-dark.css +28 -2
  72. package/styles/list-box/bootstrap.css +38 -2
  73. package/styles/list-box/bootstrap4.css +38 -2
  74. package/styles/list-box/bootstrap5-dark.css +38 -2
  75. package/styles/list-box/bootstrap5.css +38 -2
  76. package/styles/list-box/fabric-dark.css +28 -2
  77. package/styles/list-box/fabric.css +38 -2
  78. package/styles/list-box/fluent-dark.css +38 -2
  79. package/styles/list-box/fluent.css +38 -2
  80. package/styles/list-box/highcontrast-light.css +28 -2
  81. package/styles/list-box/highcontrast.css +38 -2
  82. package/styles/list-box/icons/_fusionnew.scss +25 -0
  83. package/styles/list-box/icons/_material3.scss +25 -0
  84. package/styles/list-box/material-dark.css +30 -4
  85. package/styles/list-box/material.css +40 -4
  86. package/styles/list-box/tailwind-dark.css +38 -2
  87. package/styles/list-box/tailwind.css +38 -2
  88. package/styles/material-dark.css +40 -4
  89. package/styles/material.css +40 -4
  90. package/styles/multi-select/_fusionnew-definition.scss +219 -0
  91. package/styles/multi-select/_material3-definition.scss +219 -0
  92. package/styles/multi-select/icons/_fusionnew.scss +27 -0
  93. package/styles/multi-select/icons/_material3.scss +27 -0
  94. package/styles/tailwind-dark.css +38 -2
  95. package/styles/tailwind.css +38 -2
package/styles/list-box/bootstrap5-dark.css CHANGED
@@ -77,6 +77,10 @@
77
77
  .e-listbox-container * {
78
78
  box-sizing: border-box;
79
79
  }
80
+ .e-listbox-wrapper.e-listboxtool-container .e-list-wrap,
81
+ .e-listbox-container.e-listboxtool-container .e-list-wrap {
82
+ width: 84% !important;
83
+ }
80
84
  .e-listbox-wrapper:focus,
81
85
  .e-listbox-container:focus {
82
86
  outline: none;
@@ -307,8 +311,8 @@
307
311
  text-indent: 0;
308
312
  vertical-align: middle;
309
313
  }
310
- .e-listbox-wrapper.e-right .e-checkbox-wrapper,
311
- .e-listbox-container.e-right .e-checkbox-wrapper {
314
+ .e-listbox-wrapper.e-checkbox-right .e-checkbox-wrapper,
315
+ .e-listbox-container.e-checkbox-right .e-checkbox-wrapper {
312
316
  position: absolute;
313
317
  right: 0;
314
318
  top: 30%;
@@ -427,6 +431,12 @@ ejs-listbox {
427
431
  list-style-type: none;
428
432
  margin-bottom: 10px;
429
433
  }
434
+ .e-listboxtool-wrapper.e-checkbox-right .e-checkbox-wrapper,
435
+ .e-listboxtool-container.e-checkbox-right .e-checkbox-wrapper {
436
+ position: absolute;
437
+ right: 0;
438
+ top: 30%;
439
+ }
430
440
 
431
441
  .e-rtl.e-listboxtool-wrapper.e-right .e-listbox-tool,
432
442
  .e-rtl.e-listboxtool-container.e-right .e-listbox-tool {
@@ -437,6 +447,12 @@ ejs-listbox {
437
447
  margin-left: 15px;
438
448
  }
439
449
 
450
+ .e-bigger .e-listbox-wrapper.e-listboxtool-container .e-list-wrap,
451
+ .e-listbox-wrapper.e-bigger.e-listboxtool-container .e-list-wrap,
452
+ .e-bigger .e-listbox-container.e-listboxtool-container .e-list-wrap,
453
+ .e-listbox-container.e-bigger.e-listboxtool-container .e-list-wrap {
454
+ width: 80% !important;
455
+ }
440
456
  .e-bigger .e-listbox-wrapper .e-list-item,
441
457
  .e-listbox-wrapper.e-bigger .e-list-item,
442
458
  .e-bigger .e-listbox-container .e-list-item,
@@ -534,6 +550,16 @@ ejs-listbox {
534
550
  height: calc(100% - 55px);
535
551
  }
536
552
 
553
+ .e-bigger .e-listbox-wrapper.e-filter-list .e-selectall-parent + .e-list-parent,
554
+ .e-bigger .e-listbox-container.e-filter-list .e-selectall-parent + .e-list-parent {
555
+ height: calc(100% - 96px);
556
+ }
557
+
558
+ .e-bigger .e-listbox-wrapper .e-selectall-parent + .e-list-parent,
559
+ .e-bigger .e-listbox-container .e-selectall-parent + .e-list-parent {
560
+ height: calc(100% - 40px);
561
+ }
562
+
537
563
  .e-small.e-bigger .e-listbox-wrapper.e-filter-list .e-list-parent,
538
564
  .e-small.e-bigger .e-listbox-container.e-filter-list .e-list-parent {
539
565
  height: calc(100% - 45px);
@@ -563,6 +589,16 @@ ejs-listbox {
563
589
  height: calc(100% - 47px);
564
590
  }
565
591
 
592
+ .e-listbox-wrapper.e-filter-list .e-selectall-parent + .e-list-parent,
593
+ .e-listbox-container.e-filter-list .e-selectall-parent + .e-list-parent {
594
+ height: calc(100% - 86px);
595
+ }
596
+
597
+ .e-listbox-wrapper .e-selectall-parent + .e-list-parent,
598
+ .e-listbox-container .e-selectall-parent + .e-list-parent {
599
+ height: calc(100% - 36px);
600
+ }
601
+
566
602
  .e-listbox-wrapper .e-list-item,
567
603
  .e-listbox-container .e-list-item {
568
604
  background-color: transparent;
package/styles/list-box/bootstrap5.css CHANGED
@@ -77,6 +77,10 @@
77
77
  .e-listbox-container * {
78
78
  box-sizing: border-box;
79
79
  }
80
+ .e-listbox-wrapper.e-listboxtool-container .e-list-wrap,
81
+ .e-listbox-container.e-listboxtool-container .e-list-wrap {
82
+ width: 84% !important;
83
+ }
80
84
  .e-listbox-wrapper:focus,
81
85
  .e-listbox-container:focus {
82
86
  outline: none;
@@ -307,8 +311,8 @@
307
311
  text-indent: 0;
308
312
  vertical-align: middle;
309
313
  }
310
- .e-listbox-wrapper.e-right .e-checkbox-wrapper,
311
- .e-listbox-container.e-right .e-checkbox-wrapper {
314
+ .e-listbox-wrapper.e-checkbox-right .e-checkbox-wrapper,
315
+ .e-listbox-container.e-checkbox-right .e-checkbox-wrapper {
312
316
  position: absolute;
313
317
  right: 0;
314
318
  top: 30%;
@@ -427,6 +431,12 @@ ejs-listbox {
427
431
  list-style-type: none;
428
432
  margin-bottom: 10px;
429
433
  }
434
+ .e-listboxtool-wrapper.e-checkbox-right .e-checkbox-wrapper,
435
+ .e-listboxtool-container.e-checkbox-right .e-checkbox-wrapper {
436
+ position: absolute;
437
+ right: 0;
438
+ top: 30%;
439
+ }
430
440
 
431
441
  .e-rtl.e-listboxtool-wrapper.e-right .e-listbox-tool,
432
442
  .e-rtl.e-listboxtool-container.e-right .e-listbox-tool {
@@ -437,6 +447,12 @@ ejs-listbox {
437
447
  margin-left: 15px;
438
448
  }
439
449
 
450
+ .e-bigger .e-listbox-wrapper.e-listboxtool-container .e-list-wrap,
451
+ .e-listbox-wrapper.e-bigger.e-listboxtool-container .e-list-wrap,
452
+ .e-bigger .e-listbox-container.e-listboxtool-container .e-list-wrap,
453
+ .e-listbox-container.e-bigger.e-listboxtool-container .e-list-wrap {
454
+ width: 80% !important;
455
+ }
440
456
  .e-bigger .e-listbox-wrapper .e-list-item,
441
457
  .e-listbox-wrapper.e-bigger .e-list-item,
442
458
  .e-bigger .e-listbox-container .e-list-item,
@@ -534,6 +550,16 @@ ejs-listbox {
534
550
  height: calc(100% - 55px);
535
551
  }
536
552
 
553
+ .e-bigger .e-listbox-wrapper.e-filter-list .e-selectall-parent + .e-list-parent,
554
+ .e-bigger .e-listbox-container.e-filter-list .e-selectall-parent + .e-list-parent {
555
+ height: calc(100% - 96px);
556
+ }
557
+
558
+ .e-bigger .e-listbox-wrapper .e-selectall-parent + .e-list-parent,
559
+ .e-bigger .e-listbox-container .e-selectall-parent + .e-list-parent {
560
+ height: calc(100% - 40px);
561
+ }
562
+
537
563
  .e-small.e-bigger .e-listbox-wrapper.e-filter-list .e-list-parent,
538
564
  .e-small.e-bigger .e-listbox-container.e-filter-list .e-list-parent {
539
565
  height: calc(100% - 45px);
@@ -563,6 +589,16 @@ ejs-listbox {
563
589
  height: calc(100% - 47px);
564
590
  }
565
591
 
592
+ .e-listbox-wrapper.e-filter-list .e-selectall-parent + .e-list-parent,
593
+ .e-listbox-container.e-filter-list .e-selectall-parent + .e-list-parent {
594
+ height: calc(100% - 86px);
595
+ }
596
+
597
+ .e-listbox-wrapper .e-selectall-parent + .e-list-parent,
598
+ .e-listbox-container .e-selectall-parent + .e-list-parent {
599
+ height: calc(100% - 36px);
600
+ }
601
+
566
602
  .e-listbox-wrapper .e-list-item,
567
603
  .e-listbox-container .e-list-item {
568
604
  background-color: transparent;
package/styles/list-box/fabric-dark.css CHANGED
@@ -281,8 +281,8 @@
281
281
  text-indent: 0;
282
282
  vertical-align: middle;
283
283
  }
284
- .e-listbox-wrapper.e-right .e-checkbox-wrapper,
285
- .e-listbox-container.e-right .e-checkbox-wrapper {
284
+ .e-listbox-wrapper.e-checkbox-right .e-checkbox-wrapper,
285
+ .e-listbox-container.e-checkbox-right .e-checkbox-wrapper {
286
286
  position: absolute;
287
287
  right: 0;
288
288
  top: 30%;
@@ -401,6 +401,12 @@ ejs-listbox {
401
401
  list-style-type: none;
402
402
  margin-bottom: 10px;
403
403
  }
404
+ .e-listboxtool-wrapper.e-checkbox-right .e-checkbox-wrapper,
405
+ .e-listboxtool-container.e-checkbox-right .e-checkbox-wrapper {
406
+ position: absolute;
407
+ right: 0;
408
+ top: 30%;
409
+ }
404
410
 
405
411
  .e-rtl.e-listboxtool-wrapper.e-right .e-listbox-tool,
406
412
  .e-rtl.e-listboxtool-container.e-right .e-listbox-tool {
@@ -508,6 +514,16 @@ ejs-listbox {
508
514
  height: calc(100% - 59px);
509
515
  }
510
516
 
517
+ .e-bigger .e-listbox-wrapper.e-filter-list .e-selectall-parent + .e-list-parent,
518
+ .e-bigger .e-listbox-container.e-filter-list .e-selectall-parent + .e-list-parent {
519
+ height: calc(100% - 104px);
520
+ }
521
+
522
+ .e-bigger .e-listbox-wrapper .e-selectall-parent + .e-list-parent,
523
+ .e-bigger .e-listbox-container .e-selectall-parent + .e-list-parent {
524
+ height: calc(100% - 45px);
525
+ }
526
+
511
527
  .e-small.e-bigger .e-listbox-wrapper.e-filter-list .e-list-parent,
512
528
  .e-small.e-bigger .e-listbox-container.e-filter-list .e-list-parent {
513
529
  height: calc(100% - 55px);
@@ -537,6 +553,16 @@ ejs-listbox {
537
553
  height: calc(100% - 51px);
538
554
  }
539
555
 
556
+ .e-listbox-wrapper.e-filter-list .e-selectall-parent + .e-list-parent,
557
+ .e-listbox-container.e-filter-list .e-selectall-parent + .e-list-parent {
558
+ height: calc(100% - 87px);
559
+ }
560
+
561
+ .e-listbox-wrapper .e-selectall-parent + .e-list-parent,
562
+ .e-listbox-container .e-selectall-parent + .e-list-parent {
563
+ height: calc(100% - 36px);
564
+ }
565
+
540
566
  .e-listbox-wrapper .e-icons,
541
567
  .e-listbox-container .e-icons {
542
568
  color: #dadada;
package/styles/list-box/fabric.css CHANGED
@@ -51,6 +51,10 @@
51
51
  .e-listbox-container * {
52
52
  box-sizing: border-box;
53
53
  }
54
+ .e-listbox-wrapper.e-listboxtool-container .e-list-wrap,
55
+ .e-listbox-container.e-listboxtool-container .e-list-wrap {
56
+ width: 86% !important;
57
+ }
54
58
  .e-listbox-wrapper:focus,
55
59
  .e-listbox-container:focus {
56
60
  outline: none;
@@ -281,8 +285,8 @@
281
285
  text-indent: 0;
282
286
  vertical-align: middle;
283
287
  }
284
- .e-listbox-wrapper.e-right .e-checkbox-wrapper,
285
- .e-listbox-container.e-right .e-checkbox-wrapper {
288
+ .e-listbox-wrapper.e-checkbox-right .e-checkbox-wrapper,
289
+ .e-listbox-container.e-checkbox-right .e-checkbox-wrapper {
286
290
  position: absolute;
287
291
  right: 0;
288
292
  top: 30%;
@@ -401,6 +405,12 @@ ejs-listbox {
401
405
  list-style-type: none;
402
406
  margin-bottom: 10px;
403
407
  }
408
+ .e-listboxtool-wrapper.e-checkbox-right .e-checkbox-wrapper,
409
+ .e-listboxtool-container.e-checkbox-right .e-checkbox-wrapper {
410
+ position: absolute;
411
+ right: 0;
412
+ top: 30%;
413
+ }
404
414
 
405
415
  .e-rtl.e-listboxtool-wrapper.e-right .e-listbox-tool,
406
416
  .e-rtl.e-listboxtool-container.e-right .e-listbox-tool {
@@ -411,6 +421,12 @@ ejs-listbox {
411
421
  margin-left: 15px;
412
422
  }
413
423
 
424
+ .e-bigger .e-listbox-wrapper.e-listboxtool-container .e-list-wrap,
425
+ .e-listbox-wrapper.e-bigger.e-listboxtool-container .e-list-wrap,
426
+ .e-bigger .e-listbox-container.e-listboxtool-container .e-list-wrap,
427
+ .e-listbox-container.e-bigger.e-listboxtool-container .e-list-wrap {
428
+ width: 83% !important;
429
+ }
414
430
  .e-bigger .e-listbox-wrapper .e-list-item,
415
431
  .e-listbox-wrapper.e-bigger .e-list-item,
416
432
  .e-bigger .e-listbox-container .e-list-item,
@@ -508,6 +524,16 @@ ejs-listbox {
508
524
  height: calc(100% - 59px);
509
525
  }
510
526
 
527
+ .e-bigger .e-listbox-wrapper.e-filter-list .e-selectall-parent + .e-list-parent,
528
+ .e-bigger .e-listbox-container.e-filter-list .e-selectall-parent + .e-list-parent {
529
+ height: calc(100% - 104px);
530
+ }
531
+
532
+ .e-bigger .e-listbox-wrapper .e-selectall-parent + .e-list-parent,
533
+ .e-bigger .e-listbox-container .e-selectall-parent + .e-list-parent {
534
+ height: calc(100% - 45px);
535
+ }
536
+
511
537
  .e-small.e-bigger .e-listbox-wrapper.e-filter-list .e-list-parent,
512
538
  .e-small.e-bigger .e-listbox-container.e-filter-list .e-list-parent {
513
539
  height: calc(100% - 55px);
@@ -537,6 +563,16 @@ ejs-listbox {
537
563
  height: calc(100% - 51px);
538
564
  }
539
565
 
566
+ .e-listbox-wrapper.e-filter-list .e-selectall-parent + .e-list-parent,
567
+ .e-listbox-container.e-filter-list .e-selectall-parent + .e-list-parent {
568
+ height: calc(100% - 87px);
569
+ }
570
+
571
+ .e-listbox-wrapper .e-selectall-parent + .e-list-parent,
572
+ .e-listbox-container .e-selectall-parent + .e-list-parent {
573
+ height: calc(100% - 36px);
574
+ }
575
+
540
576
  .e-listbox-wrapper .e-icons,
541
577
  .e-listbox-container .e-icons {
542
578
  color: #333;
package/styles/list-box/fluent-dark.css CHANGED
@@ -77,6 +77,10 @@
77
77
  .e-listbox-container * {
78
78
  box-sizing: border-box;
79
79
  }
80
+ .e-listbox-wrapper.e-listboxtool-container .e-list-wrap,
81
+ .e-listbox-container.e-listboxtool-container .e-list-wrap {
82
+ width: 84% !important;
83
+ }
80
84
  .e-listbox-wrapper:focus,
81
85
  .e-listbox-container:focus {
82
86
  outline: none;
@@ -307,8 +311,8 @@
307
311
  text-indent: 0;
308
312
  vertical-align: middle;
309
313
  }
310
- .e-listbox-wrapper.e-right .e-checkbox-wrapper,
311
- .e-listbox-container.e-right .e-checkbox-wrapper {
314
+ .e-listbox-wrapper.e-checkbox-right .e-checkbox-wrapper,
315
+ .e-listbox-container.e-checkbox-right .e-checkbox-wrapper {
312
316
  position: absolute;
313
317
  right: 0;
314
318
  top: 30%;
@@ -427,6 +431,12 @@ ejs-listbox {
427
431
  list-style-type: none;
428
432
  margin-bottom: 10px;
429
433
  }
434
+ .e-listboxtool-wrapper.e-checkbox-right .e-checkbox-wrapper,
435
+ .e-listboxtool-container.e-checkbox-right .e-checkbox-wrapper {
436
+ position: absolute;
437
+ right: 0;
438
+ top: 30%;
439
+ }
430
440
 
431
441
  .e-rtl.e-listboxtool-wrapper.e-right .e-listbox-tool,
432
442
  .e-rtl.e-listboxtool-container.e-right .e-listbox-tool {
@@ -437,6 +447,12 @@ ejs-listbox {
437
447
  margin-left: 15px;
438
448
  }
439
449
 
450
+ .e-bigger .e-listbox-wrapper.e-listboxtool-container .e-list-wrap,
451
+ .e-listbox-wrapper.e-bigger.e-listboxtool-container .e-list-wrap,
452
+ .e-bigger .e-listbox-container.e-listboxtool-container .e-list-wrap,
453
+ .e-listbox-container.e-bigger.e-listboxtool-container .e-list-wrap {
454
+ width: 80% !important;
455
+ }
440
456
  .e-bigger .e-listbox-wrapper .e-list-item,
441
457
  .e-listbox-wrapper.e-bigger .e-list-item,
442
458
  .e-bigger .e-listbox-container .e-list-item,
@@ -534,6 +550,16 @@ ejs-listbox {
534
550
  height: calc(100% - 55px);
535
551
  }
536
552
 
553
+ .e-bigger .e-listbox-wrapper.e-filter-list .e-selectall-parent + .e-list-parent,
554
+ .e-bigger .e-listbox-container.e-filter-list .e-selectall-parent + .e-list-parent {
555
+ height: calc(100% - 113px);
556
+ }
557
+
558
+ .e-bigger .e-listbox-wrapper .e-selectall-parent + .e-list-parent,
559
+ .e-bigger .e-listbox-container .e-selectall-parent + .e-list-parent {
560
+ height: calc(100% - 48px);
561
+ }
562
+
537
563
  .e-small.e-bigger .e-listbox-wrapper.e-filter-list .e-list-parent,
538
564
  .e-small.e-bigger .e-listbox-container.e-filter-list .e-list-parent {
539
565
  height: calc(100% - 45px);
@@ -563,6 +589,16 @@ ejs-listbox {
563
589
  height: calc(100% - 47px);
564
590
  }
565
591
 
592
+ .e-listbox-wrapper.e-filter-list .e-selectall-parent + .e-list-parent,
593
+ .e-listbox-container.e-filter-list .e-selectall-parent + .e-list-parent {
594
+ height: calc(100% - 93px);
595
+ }
596
+
597
+ .e-listbox-wrapper .e-selectall-parent + .e-list-parent,
598
+ .e-listbox-container .e-selectall-parent + .e-list-parent {
599
+ height: calc(100% - 36px);
600
+ }
601
+
566
602
  .e-listbox-wrapper .e-icons,
567
603
  .e-listbox-container .e-icons {
568
604
  color: #a19f9d;
package/styles/list-box/fluent.css CHANGED
@@ -77,6 +77,10 @@
77
77
  .e-listbox-container * {
78
78
  box-sizing: border-box;
79
79
  }
80
+ .e-listbox-wrapper.e-listboxtool-container .e-list-wrap,
81
+ .e-listbox-container.e-listboxtool-container .e-list-wrap {
82
+ width: 84% !important;
83
+ }
80
84
  .e-listbox-wrapper:focus,
81
85
  .e-listbox-container:focus {
82
86
  outline: none;
@@ -307,8 +311,8 @@
307
311
  text-indent: 0;
308
312
  vertical-align: middle;
309
313
  }
310
- .e-listbox-wrapper.e-right .e-checkbox-wrapper,
311
- .e-listbox-container.e-right .e-checkbox-wrapper {
314
+ .e-listbox-wrapper.e-checkbox-right .e-checkbox-wrapper,
315
+ .e-listbox-container.e-checkbox-right .e-checkbox-wrapper {
312
316
  position: absolute;
313
317
  right: 0;
314
318
  top: 30%;
@@ -427,6 +431,12 @@ ejs-listbox {
427
431
  list-style-type: none;
428
432
  margin-bottom: 10px;
429
433
  }
434
+ .e-listboxtool-wrapper.e-checkbox-right .e-checkbox-wrapper,
435
+ .e-listboxtool-container.e-checkbox-right .e-checkbox-wrapper {
436
+ position: absolute;
437
+ right: 0;
438
+ top: 30%;
439
+ }
430
440
 
431
441
  .e-rtl.e-listboxtool-wrapper.e-right .e-listbox-tool,
432
442
  .e-rtl.e-listboxtool-container.e-right .e-listbox-tool {
@@ -437,6 +447,12 @@ ejs-listbox {
437
447
  margin-left: 15px;
438
448
  }
439
449
 
450
+ .e-bigger .e-listbox-wrapper.e-listboxtool-container .e-list-wrap,
451
+ .e-listbox-wrapper.e-bigger.e-listboxtool-container .e-list-wrap,
452
+ .e-bigger .e-listbox-container.e-listboxtool-container .e-list-wrap,
453
+ .e-listbox-container.e-bigger.e-listboxtool-container .e-list-wrap {
454
+ width: 80% !important;
455
+ }
440
456
  .e-bigger .e-listbox-wrapper .e-list-item,
441
457
  .e-listbox-wrapper.e-bigger .e-list-item,
442
458
  .e-bigger .e-listbox-container .e-list-item,
@@ -534,6 +550,16 @@ ejs-listbox {
534
550
  height: calc(100% - 55px);
535
551
  }
536
552
 
553
+ .e-bigger .e-listbox-wrapper.e-filter-list .e-selectall-parent + .e-list-parent,
554
+ .e-bigger .e-listbox-container.e-filter-list .e-selectall-parent + .e-list-parent {
555
+ height: calc(100% - 113px);
556
+ }
557
+
558
+ .e-bigger .e-listbox-wrapper .e-selectall-parent + .e-list-parent,
559
+ .e-bigger .e-listbox-container .e-selectall-parent + .e-list-parent {
560
+ height: calc(100% - 48px);
561
+ }
562
+
537
563
  .e-small.e-bigger .e-listbox-wrapper.e-filter-list .e-list-parent,
538
564
  .e-small.e-bigger .e-listbox-container.e-filter-list .e-list-parent {
539
565
  height: calc(100% - 45px);
@@ -563,6 +589,16 @@ ejs-listbox {
563
589
  height: calc(100% - 47px);
564
590
  }
565
591
 
592
+ .e-listbox-wrapper.e-filter-list .e-selectall-parent + .e-list-parent,
593
+ .e-listbox-container.e-filter-list .e-selectall-parent + .e-list-parent {
594
+ height: calc(100% - 93px);
595
+ }
596
+
597
+ .e-listbox-wrapper .e-selectall-parent + .e-list-parent,
598
+ .e-listbox-container .e-selectall-parent + .e-list-parent {
599
+ height: calc(100% - 36px);
600
+ }
601
+
566
602
  .e-listbox-wrapper .e-icons,
567
603
  .e-listbox-container .e-icons {
568
604
  color: #605e5c;
package/styles/list-box/highcontrast-light.css CHANGED
@@ -295,8 +295,8 @@
295
295
  text-indent: 0;
296
296
  vertical-align: middle;
297
297
  }
298
- .e-listbox-wrapper.e-right .e-checkbox-wrapper,
299
- .e-listbox-container.e-right .e-checkbox-wrapper {
298
+ .e-listbox-wrapper.e-checkbox-right .e-checkbox-wrapper,
299
+ .e-listbox-container.e-checkbox-right .e-checkbox-wrapper {
300
300
  position: absolute;
301
301
  right: 0;
302
302
  top: 30%;
@@ -415,6 +415,12 @@ ejs-listbox {
415
415
  list-style-type: none;
416
416
  margin-bottom: 10px;
417
417
  }
418
+ .e-listboxtool-wrapper.e-checkbox-right .e-checkbox-wrapper,
419
+ .e-listboxtool-container.e-checkbox-right .e-checkbox-wrapper {
420
+ position: absolute;
421
+ right: 0;
422
+ top: 30%;
423
+ }
418
424
 
419
425
  .e-rtl.e-listboxtool-wrapper.e-right .e-listbox-tool,
420
426
  .e-rtl.e-listboxtool-container.e-right .e-listbox-tool {
@@ -522,6 +528,16 @@ ejs-listbox {
522
528
  height: calc(100% - 59px);
523
529
  }
524
530
 
531
+ .e-bigger .e-listbox-wrapper.e-filter-list .e-selectall-parent + .e-list-parent,
532
+ .e-bigger .e-listbox-container.e-filter-list .e-selectall-parent + .e-list-parent {
533
+ height: calc(100% - 104px);
534
+ }
535
+
536
+ .e-bigger .e-listbox-wrapper .e-selectall-parent + .e-list-parent,
537
+ .e-bigger .e-listbox-container .e-selectall-parent + .e-list-parent {
538
+ height: calc(100% - 45px);
539
+ }
540
+
525
541
  .e-small.e-bigger .e-listbox-wrapper.e-filter-list .e-list-parent,
526
542
  .e-small.e-bigger .e-listbox-container.e-filter-list .e-list-parent {
527
543
  height: calc(100% - 55px);
@@ -551,6 +567,16 @@ ejs-listbox {
551
567
  height: calc(100% - 51px);
552
568
  }
553
569
 
570
+ .e-listbox-wrapper.e-filter-list .e-selectall-parent + .e-list-parent,
571
+ .e-listbox-container.e-filter-list .e-selectall-parent + .e-list-parent {
572
+ height: calc(100% - 87px);
573
+ }
574
+
575
+ .e-listbox-wrapper .e-selectall-parent + .e-list-parent,
576
+ .e-listbox-container .e-selectall-parent + .e-list-parent {
577
+ height: calc(100% - 36px);
578
+ }
579
+
554
580
  .e-listbox-wrapper .e-icons,
555
581
  .e-listbox-container .e-icons {
556
582
  color: #000;
package/styles/list-box/highcontrast.css CHANGED
@@ -65,6 +65,10 @@
65
65
  .e-listbox-container * {
66
66
  box-sizing: border-box;
67
67
  }
68
+ .e-listbox-wrapper.e-listboxtool-container .e-list-wrap,
69
+ .e-listbox-container.e-listboxtool-container .e-list-wrap {
70
+ width: 87% !important;
71
+ }
68
72
  .e-listbox-wrapper:focus,
69
73
  .e-listbox-container:focus {
70
74
  outline: none;
@@ -295,8 +299,8 @@
295
299
  text-indent: 0;
296
300
  vertical-align: middle;
297
301
  }
298
- .e-listbox-wrapper.e-right .e-checkbox-wrapper,
299
- .e-listbox-container.e-right .e-checkbox-wrapper {
302
+ .e-listbox-wrapper.e-checkbox-right .e-checkbox-wrapper,
303
+ .e-listbox-container.e-checkbox-right .e-checkbox-wrapper {
300
304
  position: absolute;
301
305
  right: 0;
302
306
  top: 30%;
@@ -415,6 +419,12 @@ ejs-listbox {
415
419
  list-style-type: none;
416
420
  margin-bottom: 10px;
417
421
  }
422
+ .e-listboxtool-wrapper.e-checkbox-right .e-checkbox-wrapper,
423
+ .e-listboxtool-container.e-checkbox-right .e-checkbox-wrapper {
424
+ position: absolute;
425
+ right: 0;
426
+ top: 30%;
427
+ }
418
428
 
419
429
  .e-rtl.e-listboxtool-wrapper.e-right .e-listbox-tool,
420
430
  .e-rtl.e-listboxtool-container.e-right .e-listbox-tool {
@@ -425,6 +435,12 @@ ejs-listbox {
425
435
  margin-left: 15px;
426
436
  }
427
437
 
438
+ .e-bigger .e-listbox-wrapper.e-listboxtool-container .e-list-wrap,
439
+ .e-listbox-wrapper.e-bigger.e-listboxtool-container .e-list-wrap,
440
+ .e-bigger .e-listbox-container.e-listboxtool-container .e-list-wrap,
441
+ .e-listbox-container.e-bigger.e-listboxtool-container .e-list-wrap {
442
+ width: 83% !important;
443
+ }
428
444
  .e-bigger .e-listbox-wrapper .e-list-item,
429
445
  .e-listbox-wrapper.e-bigger .e-list-item,
430
446
  .e-bigger .e-listbox-container .e-list-item,
@@ -522,6 +538,16 @@ ejs-listbox {
522
538
  height: calc(100% - 59px);
523
539
  }
524
540
 
541
+ .e-bigger .e-listbox-wrapper.e-filter-list .e-selectall-parent + .e-list-parent,
542
+ .e-bigger .e-listbox-container.e-filter-list .e-selectall-parent + .e-list-parent {
543
+ height: calc(100% - 104px);
544
+ }
545
+
546
+ .e-bigger .e-listbox-wrapper .e-selectall-parent + .e-list-parent,
547
+ .e-bigger .e-listbox-container .e-selectall-parent + .e-list-parent {
548
+ height: calc(100% - 45px);
549
+ }
550
+
525
551
  .e-small.e-bigger .e-listbox-wrapper.e-filter-list .e-list-parent,
526
552
  .e-small.e-bigger .e-listbox-container.e-filter-list .e-list-parent {
527
553
  height: calc(100% - 55px);
@@ -551,6 +577,16 @@ ejs-listbox {
551
577
  height: calc(100% - 51px);
552
578
  }
553
579
 
580
+ .e-listbox-wrapper.e-filter-list .e-selectall-parent + .e-list-parent,
581
+ .e-listbox-container.e-filter-list .e-selectall-parent + .e-list-parent {
582
+ height: calc(100% - 87px);
583
+ }
584
+
585
+ .e-listbox-wrapper .e-selectall-parent + .e-list-parent,
586
+ .e-listbox-container .e-selectall-parent + .e-list-parent {
587
+ height: calc(100% - 36px);
588
+ }
589
+
554
590
  .e-listbox-wrapper .e-icons,
555
591
  .e-listbox-container .e-icons {
556
592
  color: #fff;
package/styles/list-box/icons/_fusionnew.scss ADDED
@@ -0,0 +1,25 @@
1
+ @include export-module('list-box-fusionnew-icons') {
2
+ .e-listbox-tool .e-moveup::before {
3
+ content: '\e776';
4
+ }
5
+
6
+ .e-listbox-tool .e-movedown::before {
7
+ content: '\e729';
8
+ }
9
+
10
+ .e-listbox-tool .e-moveto::before {
11
+ content: '\e748';
12
+ }
13
+
14
+ .e-listbox-tool .e-movefrom::before {
15
+ content: '\e765';
16
+ }
17
+
18
+ .e-listbox-tool .e-moveallto::before {
19
+ content: '\e7a9';
20
+ }
21
+
22
+ .e-listbox-tool .e-moveallfrom::before {
23
+ content: '\e744';
24
+ }
25
+ }
package/styles/list-box/icons/_material3.scss ADDED
@@ -0,0 +1,25 @@
1
+ @include export-module('list-box-material3-icons') {
2
+ .e-listbox-tool .e-moveup::before {
3
+ content: '\e776';
4
+ }
5
+
6
+ .e-listbox-tool .e-movedown::before {
7
+ content: '\e729';
8
+ }
9
+
10
+ .e-listbox-tool .e-moveto::before {
11
+ content: '\e748';
12
+ }
13
+
14
+ .e-listbox-tool .e-movefrom::before {
15
+ content: '\e765';
16
+ }
17
+
18
+ .e-listbox-tool .e-moveallto::before {
19
+ content: '\e7a9';
20
+ }
21
+
22
+ .e-listbox-tool .e-moveallfrom::before {
23
+ content: '\e744';
24
+ }
25
+ }