@syncfusion/ej2-dropdowns 21.2.8 → 22.1.34

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 (162) hide show
  1. package/.eslintrc.json +1 -0
  2. package/CHANGELOG.md +35 -6
  3. package/README.md +201 -103
  4. package/dist/ej2-dropdowns.min.js +2 -2
  5. package/dist/ej2-dropdowns.umd.min.js +2 -2
  6. package/dist/ej2-dropdowns.umd.min.js.map +1 -1
  7. package/dist/es6/ej2-dropdowns.es2015.js +158 -41
  8. package/dist/es6/ej2-dropdowns.es2015.js.map +1 -1
  9. package/dist/es6/ej2-dropdowns.es5.js +158 -41
  10. package/dist/es6/ej2-dropdowns.es5.js.map +1 -1
  11. package/dist/global/ej2-dropdowns.min.js +2 -2
  12. package/dist/global/ej2-dropdowns.min.js.map +1 -1
  13. package/dist/global/index.d.ts +1 -1
  14. package/package.json +11 -11
  15. package/src/auto-complete/auto-complete-model.d.ts +2 -1
  16. package/src/auto-complete/auto-complete.d.ts +2 -1
  17. package/src/auto-complete/auto-complete.js +1 -1
  18. package/src/combo-box/combo-box-model.d.ts +6 -3
  19. package/src/combo-box/combo-box.d.ts +6 -3
  20. package/src/drop-down-base/drop-down-base-model.d.ts +8 -4
  21. package/src/drop-down-base/drop-down-base.d.ts +8 -4
  22. package/src/drop-down-base/drop-down-base.js +21 -7
  23. package/src/drop-down-list/drop-down-list-model.d.ts +6 -3
  24. package/src/drop-down-list/drop-down-list.d.ts +6 -3
  25. package/src/drop-down-list/drop-down-list.js +23 -14
  26. package/src/drop-down-tree/drop-down-tree-model.d.ts +21 -6
  27. package/src/drop-down-tree/drop-down-tree.d.ts +55 -62
  28. package/src/drop-down-tree/drop-down-tree.js +1 -1
  29. package/src/list-box/list-box.d.ts +15 -0
  30. package/src/list-box/list-box.js +53 -3
  31. package/src/mention/mention-model.d.ts +4 -2
  32. package/src/mention/mention.d.ts +4 -2
  33. package/src/multi-select/multi-select-model.d.ts +15 -8
  34. package/src/multi-select/multi-select.d.ts +15 -7
  35. package/src/multi-select/multi-select.js +59 -15
  36. package/styles/auto-complete/_material3-dark-definition.scss +1 -0
  37. package/styles/auto-complete/_material3-definition.scss +2 -0
  38. package/styles/auto-complete/material3-dark.css +198 -0
  39. package/styles/auto-complete/material3-dark.scss +5 -0
  40. package/styles/auto-complete/material3.css +254 -0
  41. package/styles/auto-complete/material3.scss +5 -0
  42. package/styles/bootstrap-dark.css +212 -100
  43. package/styles/bootstrap.css +214 -101
  44. package/styles/bootstrap4.css +214 -101
  45. package/styles/bootstrap5-dark.css +212 -100
  46. package/styles/bootstrap5.css +212 -100
  47. package/styles/combo-box/_material3-dark-definition.scss +1 -0
  48. package/styles/combo-box/_material3-definition.scss +2 -0
  49. package/styles/combo-box/material3-dark.css +198 -0
  50. package/styles/combo-box/material3-dark.scss +5 -0
  51. package/styles/combo-box/material3.css +254 -0
  52. package/styles/combo-box/material3.scss +5 -0
  53. package/styles/drop-down-base/_layout.scss +3 -1
  54. package/styles/drop-down-base/_material3-dark-definition.scss +1 -0
  55. package/styles/drop-down-base/_material3-definition.scss +87 -0
  56. package/styles/drop-down-base/_theme.scss +10 -0
  57. package/styles/drop-down-base/bootstrap-dark.css +4 -0
  58. package/styles/drop-down-base/bootstrap.css +4 -0
  59. package/styles/drop-down-base/bootstrap4.css +4 -0
  60. package/styles/drop-down-base/bootstrap5-dark.css +4 -0
  61. package/styles/drop-down-base/bootstrap5.css +4 -0
  62. package/styles/drop-down-base/fabric-dark.css +4 -0
  63. package/styles/drop-down-base/fabric.css +4 -0
  64. package/styles/drop-down-base/fluent-dark.css +4 -0
  65. package/styles/drop-down-base/fluent.css +4 -0
  66. package/styles/drop-down-base/highcontrast-light.css +4 -0
  67. package/styles/drop-down-base/highcontrast.css +4 -0
  68. package/styles/drop-down-base/material-dark.css +4 -0
  69. package/styles/drop-down-base/material.css +4 -0
  70. package/styles/drop-down-base/material3-dark.css +439 -0
  71. package/styles/drop-down-base/material3-dark.scss +4 -0
  72. package/styles/drop-down-base/material3.css +495 -0
  73. package/styles/drop-down-base/material3.scss +4 -0
  74. package/styles/drop-down-base/tailwind-dark.css +4 -0
  75. package/styles/drop-down-base/tailwind.css +4 -0
  76. package/styles/drop-down-list/_layout.scss +15 -1
  77. package/styles/drop-down-list/_material3-dark-definition.scss +1 -0
  78. package/styles/drop-down-list/_material3-definition.scss +180 -0
  79. package/styles/drop-down-list/icons/_material3-dark.scss +1 -0
  80. package/styles/drop-down-list/material3-dark.css +503 -0
  81. package/styles/drop-down-list/material3-dark.scss +9 -0
  82. package/styles/drop-down-list/material3.css +559 -0
  83. package/styles/drop-down-list/material3.scss +9 -0
  84. package/styles/drop-down-tree/_layout.scss +13 -7
  85. package/styles/drop-down-tree/_material3-dark-definition.scss +1 -0
  86. package/styles/drop-down-tree/_material3-definition.scss +76 -0
  87. package/styles/drop-down-tree/_theme.scss +14 -2
  88. package/styles/drop-down-tree/icons/_material3-dark.scss +1 -0
  89. package/styles/drop-down-tree/icons/_material3.scss +1 -1
  90. package/styles/drop-down-tree/material3-dark.css +466 -0
  91. package/styles/drop-down-tree/material3-dark.scss +10 -0
  92. package/styles/drop-down-tree/material3.css +522 -0
  93. package/styles/drop-down-tree/material3.scss +10 -0
  94. package/styles/fabric-dark.css +212 -100
  95. package/styles/fabric.css +214 -101
  96. package/styles/fluent-dark.css +214 -101
  97. package/styles/fluent.css +214 -101
  98. package/styles/highcontrast-light.css +212 -100
  99. package/styles/highcontrast.css +214 -101
  100. package/styles/list-box/_layout.scss +17 -3
  101. package/styles/list-box/_material3-dark-definition.scss +1 -0
  102. package/styles/list-box/_material3-definition.scss +117 -0
  103. package/styles/list-box/_theme.scss +2 -1
  104. package/styles/list-box/bootstrap-dark.css +207 -99
  105. package/styles/list-box/bootstrap.css +209 -100
  106. package/styles/list-box/bootstrap4.css +209 -100
  107. package/styles/list-box/bootstrap5-dark.css +207 -99
  108. package/styles/list-box/bootstrap5.css +207 -99
  109. package/styles/list-box/fabric-dark.css +207 -99
  110. package/styles/list-box/fabric.css +209 -100
  111. package/styles/list-box/fluent-dark.css +209 -100
  112. package/styles/list-box/fluent.css +209 -100
  113. package/styles/list-box/highcontrast-light.css +207 -99
  114. package/styles/list-box/highcontrast.css +209 -100
  115. package/styles/list-box/icons/_material3-dark.scss +1 -0
  116. package/styles/list-box/material-dark.css +207 -99
  117. package/styles/list-box/material.css +209 -100
  118. package/styles/list-box/material3-dark.css +956 -0
  119. package/styles/list-box/material3-dark.scss +6 -0
  120. package/styles/list-box/material3.css +1012 -0
  121. package/styles/list-box/material3.scss +6 -0
  122. package/styles/list-box/tailwind-dark.css +209 -100
  123. package/styles/list-box/tailwind.css +209 -100
  124. package/styles/material-dark.css +212 -100
  125. package/styles/material.css +214 -101
  126. package/styles/material3-dark.css +4664 -0
  127. package/styles/material3-dark.scss +10 -0
  128. package/styles/material3.css +4720 -0
  129. package/styles/material3.scss +10 -0
  130. package/styles/mention/_material3-dark-definition.scss +1 -0
  131. package/styles/mention/_material3-definition.scss +1 -0
  132. package/styles/mention/material3-dark.css +87 -0
  133. package/styles/mention/material3-dark.scss +7 -0
  134. package/styles/mention/material3.css +143 -0
  135. package/styles/mention/material3.scss +7 -0
  136. package/styles/multi-select/_layout.scss +160 -7
  137. package/styles/multi-select/_material3-dark-definition.scss +1 -0
  138. package/styles/multi-select/_material3-definition.scss +246 -0
  139. package/styles/multi-select/_theme.scss +6 -0
  140. package/styles/multi-select/bootstrap-dark.css +1 -1
  141. package/styles/multi-select/bootstrap.css +1 -1
  142. package/styles/multi-select/bootstrap4.css +1 -1
  143. package/styles/multi-select/bootstrap5-dark.css +1 -1
  144. package/styles/multi-select/bootstrap5.css +1 -1
  145. package/styles/multi-select/fabric-dark.css +1 -1
  146. package/styles/multi-select/fabric.css +1 -1
  147. package/styles/multi-select/fluent-dark.css +1 -1
  148. package/styles/multi-select/fluent.css +1 -1
  149. package/styles/multi-select/highcontrast-light.css +1 -1
  150. package/styles/multi-select/highcontrast.css +1 -1
  151. package/styles/multi-select/icons/_material3-dark.scss +1 -0
  152. package/styles/multi-select/icons/_material3.scss +3 -4
  153. package/styles/multi-select/material-dark.css +1 -1
  154. package/styles/multi-select/material.css +1 -1
  155. package/styles/multi-select/material3-dark.css +2547 -0
  156. package/styles/multi-select/material3-dark.scss +10 -0
  157. package/styles/multi-select/material3.css +2603 -0
  158. package/styles/multi-select/material3.scss +10 -0
  159. package/styles/multi-select/tailwind-dark.css +1 -1
  160. package/styles/multi-select/tailwind.css +1 -1
  161. package/styles/tailwind-dark.css +214 -101
  162. package/styles/tailwind.css +214 -101
@@ -375,6 +375,10 @@
375
375
  color: #dadada;
376
376
  }
377
377
 
378
+ .e-selectall-parent.e-item-focus {
379
+ background-color: #414040;
380
+ }
381
+
378
382
  /* stylelint-disable property-no-vendor-prefix */
379
383
  /* stylelint-disable property-no-vendor-prefix */
380
384
  @keyframes material-spinner-rotate {
@@ -1465,8 +1469,8 @@ ejs-dropdownlist {
1465
1469
  margin-top: -3em;
1466
1470
  position: absolute;
1467
1471
  right: 0;
1468
- top: 100%;
1469
1472
  width: auto;
1473
+ top: 100%;
1470
1474
  }
1471
1475
 
1472
1476
  .e-multiselect .e-down-icon .e-chips-close.e-close-hooker,
@@ -2418,7 +2422,8 @@ ejs-multiselect {
2418
2422
 
2419
2423
  /* stylelint-disable property-no-vendor-prefix */
2420
2424
  .e-listbox-wrapper,
2421
- .e-listbox-container {
2425
+ .e-listbox-container,
2426
+ .e-listboxtool-wrapper {
2422
2427
  -webkit-overflow-scrolling: touch;
2423
2428
  box-sizing: border-box;
2424
2429
  cursor: pointer;
@@ -2430,20 +2435,24 @@ ejs-multiselect {
2430
2435
  width: 100%;
2431
2436
  }
2432
2437
  .e-listbox-wrapper *,
2433
- .e-listbox-container * {
2438
+ .e-listbox-container *,
2439
+ .e-listboxtool-wrapper * {
2434
2440
  box-sizing: border-box;
2435
2441
  }
2436
2442
  .e-listbox-wrapper:focus,
2437
- .e-listbox-container:focus {
2443
+ .e-listbox-container:focus,
2444
+ .e-listboxtool-wrapper:focus {
2438
2445
  outline: none;
2439
2446
  }
2440
2447
  .e-listbox-wrapper.e-disabled,
2441
- .e-listbox-container.e-disabled {
2448
+ .e-listbox-container.e-disabled,
2449
+ .e-listboxtool-wrapper.e-disabled {
2442
2450
  cursor: default;
2443
2451
  pointer-events: none;
2444
2452
  }
2445
2453
  .e-listbox-wrapper:not(.e-list-template) .e-list-nrt,
2446
- .e-listbox-container:not(.e-list-template) .e-list-nrt {
2454
+ .e-listbox-container:not(.e-list-template) .e-list-nrt,
2455
+ .e-listboxtool-wrapper:not(.e-list-template) .e-list-nrt {
2447
2456
  text-align: center;
2448
2457
  }
2449
2458
  .e-listbox-wrapper:not(.e-list-template) .e-list-item,
@@ -2451,53 +2460,66 @@ ejs-multiselect {
2451
2460
  .e-listbox-wrapper .e-selectall-parent,
2452
2461
  .e-listbox-container:not(.e-list-template) .e-list-item,
2453
2462
  .e-listbox-container .e-list-nrt,
2454
- .e-listbox-container .e-selectall-parent {
2463
+ .e-listbox-container .e-selectall-parent,
2464
+ .e-listboxtool-wrapper:not(.e-list-template) .e-list-item,
2465
+ .e-listboxtool-wrapper .e-list-nrt,
2466
+ .e-listboxtool-wrapper .e-selectall-parent {
2455
2467
  height: 36px;
2456
2468
  line-height: 1;
2457
2469
  padding: 10px 16px;
2458
2470
  position: relative;
2459
2471
  }
2460
2472
  .e-listbox-wrapper.e-filter-list,
2461
- .e-listbox-container.e-filter-list {
2473
+ .e-listbox-container.e-filter-list,
2474
+ .e-listboxtool-wrapper.e-filter-list {
2462
2475
  overflow: inherit;
2463
2476
  }
2464
2477
  .e-listbox-wrapper .e-list-parent,
2465
- .e-listbox-container .e-list-parent {
2478
+ .e-listbox-container .e-list-parent,
2479
+ .e-listboxtool-wrapper .e-list-parent {
2466
2480
  height: 100%;
2467
2481
  min-height: 36px;
2468
2482
  }
2469
2483
  .e-listbox-wrapper .e-list-item,
2470
- .e-listbox-container .e-list-item {
2484
+ .e-listbox-container .e-list-item,
2485
+ .e-listboxtool-wrapper .e-list-item {
2471
2486
  border-bottom: 0 solid;
2472
2487
  outline: none;
2473
2488
  }
2474
2489
  .e-listbox-wrapper .e-list-item.e-disabled,
2475
- .e-listbox-container .e-list-item.e-disabled {
2490
+ .e-listbox-container .e-list-item.e-disabled,
2491
+ .e-listboxtool-wrapper .e-list-item.e-disabled {
2476
2492
  pointer-events: none;
2477
2493
  }
2478
2494
  .e-listbox-wrapper .e-disable,
2479
- .e-listbox-container .e-disable {
2495
+ .e-listbox-container .e-disable,
2496
+ .e-listboxtool-wrapper .e-disable {
2480
2497
  opacity: 0.7;
2481
2498
  }
2482
2499
  .e-listbox-wrapper .e-list-parent,
2483
- .e-listbox-container .e-list-parent {
2500
+ .e-listbox-container .e-list-parent,
2501
+ .e-listboxtool-wrapper .e-list-parent {
2484
2502
  margin: 0;
2485
2503
  padding: 0;
2486
2504
  }
2487
2505
  .e-listbox-wrapper .e-list-header .e-text.header,
2488
- .e-listbox-container .e-list-header .e-text.header {
2506
+ .e-listbox-container .e-list-header .e-text.header,
2507
+ .e-listboxtool-wrapper .e-list-header .e-text.header {
2489
2508
  display: none;
2490
2509
  }
2491
2510
  .e-listbox-wrapper .e-icon-back,
2492
- .e-listbox-container .e-icon-back {
2511
+ .e-listbox-container .e-icon-back,
2512
+ .e-listboxtool-wrapper .e-icon-back {
2493
2513
  margin-top: 2px;
2494
2514
  }
2495
2515
  .e-listbox-wrapper .e-list-header .e-headertemplate-text.nested-header,
2496
- .e-listbox-container .e-list-header .e-headertemplate-text.nested-header {
2516
+ .e-listbox-container .e-list-header .e-headertemplate-text.nested-header,
2517
+ .e-listboxtool-wrapper .e-list-header .e-headertemplate-text.nested-header {
2497
2518
  display: none;
2498
2519
  }
2499
2520
  .e-listbox-wrapper .e-list-header,
2500
- .e-listbox-container .e-list-header {
2521
+ .e-listbox-container .e-list-header,
2522
+ .e-listboxtool-wrapper .e-list-header {
2501
2523
  -ms-flex-align: center;
2502
2524
  align-items: center;
2503
2525
  border-bottom: 1px solid;
@@ -2508,21 +2530,25 @@ ejs-multiselect {
2508
2530
  padding: 0 16px;
2509
2531
  }
2510
2532
  .e-listbox-wrapper .e-has-header > .e-view,
2511
- .e-listbox-container .e-has-header > .e-view {
2533
+ .e-listbox-container .e-has-header > .e-view,
2534
+ .e-listboxtool-wrapper .e-has-header > .e-view {
2512
2535
  top: 45px;
2513
2536
  }
2514
2537
  .e-listbox-wrapper .e-but-back,
2515
- .e-listbox-container .e-but-back {
2538
+ .e-listbox-container .e-but-back,
2539
+ .e-listboxtool-wrapper .e-but-back {
2516
2540
  cursor: pointer;
2517
2541
  padding-right: 20px;
2518
2542
  }
2519
2543
  .e-listbox-wrapper .e-list-group-item:first-child,
2520
- .e-listbox-container .e-list-group-item:first-child {
2544
+ .e-listbox-container .e-list-group-item:first-child,
2545
+ .e-listboxtool-wrapper .e-list-group-item:first-child {
2521
2546
  border: 0;
2522
2547
  border-bottom: 0 solid transparent;
2523
2548
  }
2524
2549
  .e-listbox-wrapper .e-list-group-item,
2525
- .e-listbox-container .e-list-group-item {
2550
+ .e-listbox-container .e-list-group-item,
2551
+ .e-listboxtool-wrapper .e-list-group-item {
2526
2552
  border-bottom: 0 solid transparent;
2527
2553
  border-top: 1px solid;
2528
2554
  font-weight: 600;
@@ -2531,7 +2557,8 @@ ejs-multiselect {
2531
2557
  padding: 10px 16px;
2532
2558
  }
2533
2559
  .e-listbox-wrapper .e-icon-collapsible,
2534
- .e-listbox-container .e-icon-collapsible {
2560
+ .e-listbox-container .e-icon-collapsible,
2561
+ .e-listboxtool-wrapper .e-icon-collapsible {
2535
2562
  cursor: pointer;
2536
2563
  font-size: 12px;
2537
2564
  position: absolute;
@@ -2540,42 +2567,51 @@ ejs-multiselect {
2540
2567
  transform: translateY(-50%);
2541
2568
  }
2542
2569
  .e-listbox-wrapper .e-text-content,
2543
- .e-listbox-container .e-text-content {
2570
+ .e-listbox-container .e-text-content,
2571
+ .e-listboxtool-wrapper .e-text-content {
2544
2572
  height: 100%;
2545
2573
  position: relative;
2546
2574
  vertical-align: middle;
2547
2575
  }
2548
2576
  .e-listbox-wrapper .e-text-content *,
2549
- .e-listbox-container .e-text-content * {
2577
+ .e-listbox-container .e-text-content *,
2578
+ .e-listboxtool-wrapper .e-text-content * {
2550
2579
  display: inline-block;
2551
2580
  vertical-align: middle;
2552
2581
  }
2553
2582
  .e-listbox-wrapper .e-text-content.e-checkbox .e-list-text,
2554
- .e-listbox-container .e-text-content.e-checkbox .e-list-text {
2583
+ .e-listbox-container .e-text-content.e-checkbox .e-list-text,
2584
+ .e-listboxtool-wrapper .e-text-content.e-checkbox .e-list-text {
2555
2585
  width: calc(100% - 40px);
2556
2586
  }
2557
2587
  .e-listbox-wrapper .e-text-content.e-checkbox.e-checkbox-left .e-list-icon + .e-list-text,
2558
- .e-listbox-container .e-text-content.e-checkbox.e-checkbox-left .e-list-icon + .e-list-text {
2588
+ .e-listbox-container .e-text-content.e-checkbox.e-checkbox-left .e-list-icon + .e-list-text,
2589
+ .e-listboxtool-wrapper .e-text-content.e-checkbox.e-checkbox-left .e-list-icon + .e-list-text {
2559
2590
  width: calc(100% - 90px);
2560
2591
  }
2561
2592
  .e-listbox-wrapper .e-text-content.e-checkbox.e-checkbox-right .e-list-icon + .e-list-text,
2562
- .e-listbox-container .e-text-content.e-checkbox.e-checkbox-right .e-list-icon + .e-list-text {
2593
+ .e-listbox-container .e-text-content.e-checkbox.e-checkbox-right .e-list-icon + .e-list-text,
2594
+ .e-listboxtool-wrapper .e-text-content.e-checkbox.e-checkbox-right .e-list-icon + .e-list-text {
2563
2595
  width: calc(100% - 80px);
2564
2596
  }
2565
2597
  .e-listbox-wrapper .e-list-item.e-checklist.e-has-child .e-text-content.e-checkbox.e-checkbox-right .e-list-icon + .e-list-text,
2566
- .e-listbox-container .e-list-item.e-checklist.e-has-child .e-text-content.e-checkbox.e-checkbox-right .e-list-icon + .e-list-text {
2598
+ .e-listbox-container .e-list-item.e-checklist.e-has-child .e-text-content.e-checkbox.e-checkbox-right .e-list-icon + .e-list-text,
2599
+ .e-listboxtool-wrapper .e-list-item.e-checklist.e-has-child .e-text-content.e-checkbox.e-checkbox-right .e-list-icon + .e-list-text {
2567
2600
  width: calc(100% - 92px);
2568
2601
  }
2569
2602
  .e-listbox-wrapper .e-checkbox .e-checkbox-left,
2570
- .e-listbox-container .e-checkbox .e-checkbox-left {
2603
+ .e-listbox-container .e-checkbox .e-checkbox-left,
2604
+ .e-listboxtool-wrapper .e-checkbox .e-checkbox-left {
2571
2605
  margin: -2px 10px 0 0;
2572
2606
  }
2573
2607
  .e-listbox-wrapper .e-checkbox .e-checkbox-right,
2574
- .e-listbox-container .e-checkbox .e-checkbox-right {
2608
+ .e-listbox-container .e-checkbox .e-checkbox-right,
2609
+ .e-listboxtool-wrapper .e-checkbox .e-checkbox-right {
2575
2610
  margin: -2px 0 0 10px;
2576
2611
  }
2577
2612
  .e-listbox-wrapper .e-list-text,
2578
- .e-listbox-container .e-list-text {
2613
+ .e-listbox-container .e-list-text,
2614
+ .e-listboxtool-wrapper .e-list-text {
2579
2615
  cursor: pointer;
2580
2616
  display: inline-block;
2581
2617
  overflow: hidden;
@@ -2585,107 +2621,129 @@ ejs-multiselect {
2585
2621
  width: 100%;
2586
2622
  }
2587
2623
  .e-listbox-wrapper .e-list-icon + .e-list-text,
2588
- .e-listbox-container .e-list-icon + .e-list-text {
2624
+ .e-listbox-container .e-list-icon + .e-list-text,
2625
+ .e-listboxtool-wrapper .e-list-icon + .e-list-text {
2589
2626
  width: calc(100% - 60px);
2590
2627
  }
2591
2628
  .e-listbox-wrapper .e-icon-wrapper .e-list-text,
2592
- .e-listbox-container .e-icon-wrapper .e-list-text {
2629
+ .e-listbox-container .e-icon-wrapper .e-list-text,
2630
+ .e-listboxtool-wrapper .e-icon-wrapper .e-list-text {
2593
2631
  width: calc(100% - 60px);
2594
2632
  }
2595
2633
  .e-listbox-wrapper .e-icon-wrapper.e-text-content.e-checkbox .e-list-text,
2596
- .e-listbox-container .e-icon-wrapper.e-text-content.e-checkbox .e-list-text {
2634
+ .e-listbox-container .e-icon-wrapper.e-text-content.e-checkbox .e-list-text,
2635
+ .e-listboxtool-wrapper .e-icon-wrapper.e-text-content.e-checkbox .e-list-text {
2597
2636
  width: calc(100% - 60px);
2598
2637
  }
2599
2638
  .e-listbox-wrapper .e-list-icon,
2600
- .e-listbox-container .e-list-icon {
2639
+ .e-listbox-container .e-list-icon,
2640
+ .e-listboxtool-wrapper .e-list-icon {
2601
2641
  height: 30px;
2602
2642
  margin-right: 16px;
2603
2643
  width: 30px;
2604
2644
  }
2605
2645
  .e-listbox-wrapper .e-content,
2606
- .e-listbox-container .e-content {
2646
+ .e-listbox-container .e-content,
2647
+ .e-listboxtool-wrapper .e-content {
2607
2648
  overflow: hidden;
2608
2649
  position: relative;
2609
2650
  }
2610
2651
  .e-listbox-wrapper .e-list-header .e-text,
2611
- .e-listbox-container .e-list-header .e-text {
2652
+ .e-listbox-container .e-list-header .e-text,
2653
+ .e-listboxtool-wrapper .e-list-header .e-text {
2612
2654
  cursor: pointer;
2613
2655
  text-indent: 0;
2614
2656
  }
2615
2657
  .e-listbox-wrapper .e-text .e-headertext,
2616
- .e-listbox-container .e-text .e-headertext {
2658
+ .e-listbox-container .e-text .e-headertext,
2659
+ .e-listboxtool-wrapper .e-text .e-headertext {
2617
2660
  display: inline-block;
2618
2661
  line-height: 0;
2619
2662
  }
2620
2663
  .e-listbox-wrapper.e-rtl,
2621
- .e-listbox-container.e-rtl {
2664
+ .e-listbox-container.e-rtl,
2665
+ .e-listboxtool-wrapper.e-rtl {
2622
2666
  direction: rtl;
2623
2667
  }
2624
2668
  .e-listbox-wrapper.e-rtl .e-list-icon,
2625
- .e-listbox-container.e-rtl .e-list-icon {
2669
+ .e-listbox-container.e-rtl .e-list-icon,
2670
+ .e-listboxtool-wrapper.e-rtl .e-list-icon {
2626
2671
  margin-left: 16px;
2627
2672
  margin-right: 0;
2628
2673
  }
2629
2674
  .e-listbox-wrapper.e-rtl .e-icon-collapsible,
2630
- .e-listbox-container.e-rtl .e-icon-collapsible {
2675
+ .e-listbox-container.e-rtl .e-icon-collapsible,
2676
+ .e-listboxtool-wrapper.e-rtl .e-icon-collapsible {
2631
2677
  left: 0%;
2632
2678
  right: initial;
2633
2679
  top: 50%;
2634
2680
  transform: translateY(-50%) rotate(180deg);
2635
2681
  }
2636
2682
  .e-listbox-wrapper.e-rtl .e-list-header .e-text,
2637
- .e-listbox-container.e-rtl .e-list-header .e-text {
2683
+ .e-listbox-container.e-rtl .e-list-header .e-text,
2684
+ .e-listboxtool-wrapper.e-rtl .e-list-header .e-text {
2638
2685
  cursor: pointer;
2639
2686
  }
2640
2687
  .e-listbox-wrapper.e-rtl .e-but-back,
2641
- .e-listbox-container.e-rtl .e-but-back {
2688
+ .e-listbox-container.e-rtl .e-but-back,
2689
+ .e-listboxtool-wrapper.e-rtl .e-but-back {
2642
2690
  transform: rotate(180deg);
2643
2691
  }
2644
2692
  .e-listbox-wrapper.e-rtl .e-icon-back,
2645
- .e-listbox-container.e-rtl .e-icon-back {
2693
+ .e-listbox-container.e-rtl .e-icon-back,
2694
+ .e-listboxtool-wrapper.e-rtl .e-icon-back {
2646
2695
  margin-top: 1px;
2647
2696
  }
2648
2697
  .e-listbox-wrapper.e-rtl .e-checkbox .e-checkbox-left,
2649
- .e-listbox-container.e-rtl .e-checkbox .e-checkbox-left {
2698
+ .e-listbox-container.e-rtl .e-checkbox .e-checkbox-left,
2699
+ .e-listboxtool-wrapper.e-rtl .e-checkbox .e-checkbox-left {
2650
2700
  margin: -2px 0 0 10px;
2651
2701
  }
2652
2702
  .e-listbox-wrapper.e-rtl .e-checkbox .e-checkbox-right,
2653
- .e-listbox-container.e-rtl .e-checkbox .e-checkbox-right {
2703
+ .e-listbox-container.e-rtl .e-checkbox .e-checkbox-right,
2704
+ .e-listboxtool-wrapper.e-rtl .e-checkbox .e-checkbox-right {
2654
2705
  margin: -2px 10px 0 0;
2655
2706
  }
2656
2707
  .e-listbox-wrapper.e-rtl .e-checkbox-wrapper,
2657
- .e-listbox-container.e-rtl .e-checkbox-wrapper {
2708
+ .e-listbox-container.e-rtl .e-checkbox-wrapper,
2709
+ .e-listboxtool-wrapper.e-rtl .e-checkbox-wrapper {
2658
2710
  margin: -2px 0 0 10px;
2659
2711
  }
2660
2712
  .e-listbox-wrapper .e-checkbox-wrapper,
2661
- .e-listbox-container .e-checkbox-wrapper {
2713
+ .e-listbox-container .e-checkbox-wrapper,
2714
+ .e-listboxtool-wrapper .e-checkbox-wrapper {
2662
2715
  margin: -2px 10px 0 0;
2663
2716
  text-indent: 0;
2664
2717
  vertical-align: middle;
2665
2718
  }
2666
2719
  .e-listbox-wrapper.e-checkbox-right .e-checkbox-wrapper,
2667
- .e-listbox-container.e-checkbox-right .e-checkbox-wrapper {
2720
+ .e-listbox-container.e-checkbox-right .e-checkbox-wrapper,
2721
+ .e-listboxtool-wrapper.e-checkbox-right .e-checkbox-wrapper {
2668
2722
  position: absolute;
2669
2723
  right: 0;
2670
2724
  top: 30%;
2671
2725
  }
2672
2726
  .e-listbox-wrapper .e-input-group,
2673
- .e-listbox-container .e-input-group {
2727
+ .e-listbox-container .e-input-group,
2728
+ .e-listboxtool-wrapper .e-input-group {
2674
2729
  padding: 4px 8px;
2675
2730
  }
2676
2731
  .e-listbox-wrapper .e-input-focus,
2677
- .e-listbox-container .e-input-focus {
2732
+ .e-listbox-container .e-input-focus,
2733
+ .e-listboxtool-wrapper .e-input-focus {
2678
2734
  padding: 4px 4px 4px 8px;
2679
2735
  }
2680
2736
  .e-listbox-wrapper .e-hidden-select,
2681
- .e-listbox-container .e-hidden-select {
2737
+ .e-listbox-container .e-hidden-select,
2738
+ .e-listboxtool-wrapper .e-hidden-select {
2682
2739
  height: 1px;
2683
2740
  opacity: 0;
2684
2741
  position: absolute;
2685
2742
  width: 100%;
2686
2743
  }
2687
2744
  .e-listbox-wrapper .e-placeholder,
2688
- .e-listbox-container .e-placeholder {
2745
+ .e-listbox-container .e-placeholder,
2746
+ .e-listboxtool-wrapper .e-placeholder {
2689
2747
  background-color: #0074cc;
2690
2748
  display: block;
2691
2749
  height: 1px;
@@ -2707,24 +2765,29 @@ ejs-listbox {
2707
2765
  }
2708
2766
 
2709
2767
  .e-listbox-wrapper.e-sortableclone,
2710
- .e-listbox-container.e-sortableclone {
2768
+ .e-listbox-container.e-sortableclone,
2769
+ .e-listboxtool-wrapper.e-sortableclone {
2711
2770
  border-width: 0;
2712
2771
  overflow: visible;
2713
2772
  }
2714
2773
  .e-listbox-wrapper.e-sortableclone .e-list-item,
2715
- .e-listbox-container.e-sortableclone .e-list-item {
2774
+ .e-listbox-container.e-sortableclone .e-list-item,
2775
+ .e-listboxtool-wrapper.e-sortableclone .e-list-item {
2716
2776
  list-style-type: none;
2717
2777
  }
2718
2778
  .e-listbox-wrapper.e-sortableclone .e-ripple,
2719
- .e-listbox-container.e-sortableclone .e-ripple {
2779
+ .e-listbox-container.e-sortableclone .e-ripple,
2780
+ .e-listboxtool-wrapper.e-sortableclone .e-ripple {
2720
2781
  overflow: visible;
2721
2782
  }
2722
2783
  .e-listbox-wrapper.e-sortableclone .e-ripple .e-ripple-element,
2723
- .e-listbox-container.e-sortableclone .e-ripple .e-ripple-element {
2784
+ .e-listbox-container.e-sortableclone .e-ripple .e-ripple-element,
2785
+ .e-listboxtool-wrapper.e-sortableclone .e-ripple .e-ripple-element {
2724
2786
  display: none;
2725
2787
  }
2726
2788
  .e-listbox-wrapper.e-sortableclone .e-list-badge,
2727
- .e-listbox-container.e-sortableclone .e-list-badge {
2789
+ .e-listbox-container.e-sortableclone .e-list-badge,
2790
+ .e-listboxtool-wrapper.e-sortableclone .e-list-badge {
2728
2791
  -ms-flex-align: center;
2729
2792
  align-items: center;
2730
2793
  background-color: #0074cc;
@@ -2743,6 +2806,10 @@ ejs-listbox {
2743
2806
  width: 22px;
2744
2807
  }
2745
2808
 
2809
+ .e-listboxtool-wrapper.e-sortableclone {
2810
+ display: block;
2811
+ }
2812
+
2746
2813
  .e-listboxtool-wrapper,
2747
2814
  .e-listboxtool-container {
2748
2815
  cursor: pointer;
@@ -2918,12 +2985,14 @@ ejs-listbox {
2918
2985
  }
2919
2986
 
2920
2987
  .e-listbox-wrapper,
2921
- .e-listbox-container {
2988
+ .e-listbox-container,
2989
+ .e-listboxtool-wrapper {
2922
2990
  font-family: "Segoe UI", "GeezaPro", "DejaVu Serif", sans-serif, "-apple-system", "BlinkMacSystemFont";
2923
2991
  font-size: 13px;
2924
2992
  }
2925
2993
  .e-listbox-wrapper .e-list-header,
2926
- .e-listbox-container .e-list-header {
2994
+ .e-listbox-container .e-list-header,
2995
+ .e-listboxtool-wrapper .e-list-header {
2927
2996
  background-color: #201f1f;
2928
2997
  border-color: #414040;
2929
2998
  color: #dadada;
@@ -2931,27 +3000,32 @@ ejs-listbox {
2931
3000
  }
2932
3001
 
2933
3002
  .e-listbox-wrapper.e-filter-list .e-list-parent,
2934
- .e-listbox-container.e-filter-list .e-list-parent {
3003
+ .e-listbox-container.e-filter-list .e-list-parent,
3004
+ .e-listboxtool-wrapper.e-filter-list .e-list-parent {
2935
3005
  height: calc(100% - 51px);
2936
3006
  }
2937
3007
 
2938
3008
  .e-listbox-wrapper.e-filter-list .e-selectall-parent + .e-list-parent,
2939
- .e-listbox-container.e-filter-list .e-selectall-parent + .e-list-parent {
3009
+ .e-listbox-container.e-filter-list .e-selectall-parent + .e-list-parent,
3010
+ .e-listboxtool-wrapper.e-filter-list .e-selectall-parent + .e-list-parent {
2940
3011
  height: calc(100% - 87px);
2941
3012
  }
2942
3013
 
2943
3014
  .e-listbox-wrapper .e-selectall-parent + .e-list-parent,
2944
- .e-listbox-container .e-selectall-parent + .e-list-parent {
3015
+ .e-listbox-container .e-selectall-parent + .e-list-parent,
3016
+ .e-listboxtool-wrapper .e-selectall-parent + .e-list-parent {
2945
3017
  height: calc(100% - 36px);
2946
3018
  }
2947
3019
 
2948
3020
  .e-listbox-wrapper .e-icons,
2949
- .e-listbox-container .e-icons {
3021
+ .e-listbox-container .e-icons,
3022
+ .e-listboxtool-wrapper .e-icons {
2950
3023
  color: #dadada;
2951
3024
  }
2952
3025
 
2953
3026
  .e-listbox-wrapper .e-list-item,
2954
- .e-listbox-container .e-list-item {
3027
+ .e-listbox-container .e-list-item,
3028
+ .e-listboxtool-wrapper .e-list-item {
2955
3029
  background-color: inherit;
2956
3030
  border-bottom: 0 solid transparent;
2957
3031
  border-left: 0 solid transparent;
@@ -2962,41 +3036,50 @@ ejs-listbox {
2962
3036
 
2963
3037
  .e-listbox-wrapper .e-list-item:hover:not(.e-selected):not(.e-disabled), .e-listbox-wrapper .e-list-item:hover.e-selected.e-checklist:not(.e-disabled),
2964
3038
  .e-listbox-container .e-list-item:hover:not(.e-selected):not(.e-disabled),
2965
- .e-listbox-container .e-list-item:hover.e-selected.e-checklist:not(.e-disabled) {
3039
+ .e-listbox-container .e-list-item:hover.e-selected.e-checklist:not(.e-disabled),
3040
+ .e-listboxtool-wrapper .e-list-item:hover:not(.e-selected):not(.e-disabled),
3041
+ .e-listboxtool-wrapper .e-list-item:hover.e-selected.e-checklist:not(.e-disabled) {
2966
3042
  background-color: #414040;
2967
3043
  border-color: transparent;
2968
3044
  color: #dadada;
2969
3045
  }
2970
3046
 
2971
3047
  .e-listbox-wrapper .e-list-item.e-selected,
2972
- .e-listbox-container .e-list-item.e-selected {
3048
+ .e-listbox-container .e-list-item.e-selected,
3049
+ .e-listboxtool-wrapper .e-list-item.e-selected {
2973
3050
  background-color: #514f4f;
2974
3051
  color: #fff;
2975
3052
  }
2976
3053
 
2977
3054
  .e-listbox-wrapper .e-list-item.e-selected.e-checklist,
2978
- .e-listbox-container .e-list-item.e-selected.e-checklist {
3055
+ .e-listbox-container .e-list-item.e-selected.e-checklist,
3056
+ .e-listboxtool-wrapper .e-list-item.e-selected.e-checklist {
2979
3057
  background-color: inherit;
2980
3058
  color: #dadada;
2981
3059
  }
2982
3060
 
2983
3061
  .e-listbox-wrapper .e-list-item.e-focused, .e-listbox-wrapper .e-list-item.e-focused.e-selected.e-checklist,
2984
3062
  .e-listbox-container .e-list-item.e-focused,
2985
- .e-listbox-container .e-list-item.e-focused.e-selected.e-checklist {
3063
+ .e-listbox-container .e-list-item.e-focused.e-selected.e-checklist,
3064
+ .e-listboxtool-wrapper .e-list-item.e-focused,
3065
+ .e-listboxtool-wrapper .e-list-item.e-focused.e-selected.e-checklist {
2986
3066
  background-color: #514f4f;
2987
3067
  color: #fff;
2988
3068
  }
2989
3069
 
2990
3070
  .e-listbox-wrapper .e-list-item.e-focused .e-checkbox-wrapper .e-frame.e-check, .e-listbox-wrapper .e-list-item.e-focused .e-css.e-checkbox-wrapper .e-frame.e-check,
2991
3071
  .e-listbox-container .e-list-item.e-focused .e-checkbox-wrapper .e-frame.e-check,
2992
- .e-listbox-container .e-list-item.e-focused .e-css.e-checkbox-wrapper .e-frame.e-check {
3072
+ .e-listbox-container .e-list-item.e-focused .e-css.e-checkbox-wrapper .e-frame.e-check,
3073
+ .e-listboxtool-wrapper .e-list-item.e-focused .e-checkbox-wrapper .e-frame.e-check,
3074
+ .e-listboxtool-wrapper .e-list-item.e-focused .e-css.e-checkbox-wrapper .e-frame.e-check {
2993
3075
  background-color: #0074cc;
2994
3076
  border-color: #0074cc;
2995
3077
  color: #fff;
2996
3078
  }
2997
3079
 
2998
3080
  .e-listbox-wrapper .e-list-group-item,
2999
- .e-listbox-container .e-list-group-item {
3081
+ .e-listbox-container .e-list-group-item,
3082
+ .e-listboxtool-wrapper .e-list-group-item {
3000
3083
  background-color: #201f1f;
3001
3084
  border-color: #414040;
3002
3085
  color: #38a9ff;
@@ -3004,32 +3087,38 @@ ejs-listbox {
3004
3087
  }
3005
3088
 
3006
3089
  .e-listbox-wrapper .e-selectall-parent,
3007
- .e-listbox-container .e-selectall-parent {
3090
+ .e-listbox-container .e-selectall-parent,
3091
+ .e-listboxtool-wrapper .e-selectall-parent {
3008
3092
  background-color: inherit;
3009
3093
  border-bottom: 1px solid #414040;
3010
3094
  color: #dadada;
3011
3095
  }
3012
3096
 
3013
3097
  .e-listbox-wrapper .e-sortableclone.e-ripple .e-ripple-element,
3014
- .e-listbox-container .e-sortableclone.e-ripple .e-ripple-element {
3098
+ .e-listbox-container .e-sortableclone.e-ripple .e-ripple-element,
3099
+ .e-listboxtool-wrapper .e-sortableclone.e-ripple .e-ripple-element {
3015
3100
  background-color: transparent;
3016
3101
  }
3017
3102
 
3018
3103
  .e-listbox-wrapper.e-list-template .e-list-wrapper,
3019
- .e-listbox-container.e-list-template .e-list-wrapper {
3104
+ .e-listbox-container.e-list-template .e-list-wrapper,
3105
+ .e-listboxtool-wrapper.e-list-template .e-list-wrapper {
3020
3106
  height: inherit;
3021
3107
  position: relative;
3022
3108
  }
3023
3109
  .e-listbox-wrapper.e-list-template .e-list-wrapper:not(.e-list-multi-line),
3024
- .e-listbox-container.e-list-template .e-list-wrapper:not(.e-list-multi-line) {
3110
+ .e-listbox-container.e-list-template .e-list-wrapper:not(.e-list-multi-line),
3111
+ .e-listboxtool-wrapper.e-list-template .e-list-wrapper:not(.e-list-multi-line) {
3025
3112
  padding: 0.6153em 0.923em;
3026
3113
  }
3027
3114
  .e-listbox-wrapper.e-list-template .e-list-wrapper.e-list-multi-line,
3028
- .e-listbox-container.e-list-template .e-list-wrapper.e-list-multi-line {
3115
+ .e-listbox-container.e-list-template .e-list-wrapper.e-list-multi-line,
3116
+ .e-listboxtool-wrapper.e-list-template .e-list-wrapper.e-list-multi-line {
3029
3117
  padding: 0.6153em 0.923em;
3030
3118
  }
3031
3119
  .e-listbox-wrapper.e-list-template .e-list-wrapper.e-list-multi-line .e-list-item-header,
3032
- .e-listbox-container.e-list-template .e-list-wrapper.e-list-multi-line .e-list-item-header {
3120
+ .e-listbox-container.e-list-template .e-list-wrapper.e-list-multi-line .e-list-item-header,
3121
+ .e-listboxtool-wrapper.e-list-template .e-list-wrapper.e-list-multi-line .e-list-item-header {
3033
3122
  color: #dadada;
3034
3123
  display: block;
3035
3124
  font-size: 13px;
@@ -3041,7 +3130,8 @@ ejs-listbox {
3041
3130
  white-space: nowrap;
3042
3131
  }
3043
3132
  .e-listbox-wrapper.e-list-template .e-list-wrapper.e-list-multi-line .e-list-content,
3044
- .e-listbox-container.e-list-template .e-list-wrapper.e-list-multi-line .e-list-content {
3133
+ .e-listbox-container.e-list-template .e-list-wrapper.e-list-multi-line .e-list-content,
3134
+ .e-listboxtool-wrapper.e-list-template .e-list-wrapper.e-list-multi-line .e-list-content {
3045
3135
  color: #dadada;
3046
3136
  display: block;
3047
3137
  font-size: 13px;
@@ -3050,13 +3140,15 @@ ejs-listbox {
3050
3140
  word-wrap: break-word;
3051
3141
  }
3052
3142
  .e-listbox-wrapper.e-list-template .e-list-wrapper.e-list-multi-line .e-list-content:not(.e-text-overflow),
3053
- .e-listbox-container.e-list-template .e-list-wrapper.e-list-multi-line .e-list-content:not(.e-text-overflow) {
3143
+ .e-listbox-container.e-list-template .e-list-wrapper.e-list-multi-line .e-list-content:not(.e-text-overflow),
3144
+ .e-listboxtool-wrapper.e-list-template .e-list-wrapper.e-list-multi-line .e-list-content:not(.e-text-overflow) {
3054
3145
  overflow: hidden;
3055
3146
  text-overflow: ellipsis;
3056
3147
  white-space: nowrap;
3057
3148
  }
3058
3149
  .e-listbox-wrapper.e-list-template .e-list-wrapper.e-list-avatar .e-avatar,
3059
- .e-listbox-container.e-list-template .e-list-wrapper.e-list-avatar .e-avatar {
3150
+ .e-listbox-container.e-list-template .e-list-wrapper.e-list-avatar .e-avatar,
3151
+ .e-listboxtool-wrapper.e-list-template .e-list-wrapper.e-list-avatar .e-avatar {
3060
3152
  height: 3.0769em;
3061
3153
  left: 0.923em;
3062
3154
  position: absolute;
@@ -3064,17 +3156,20 @@ ejs-listbox {
3064
3156
  width: 3.0769em;
3065
3157
  }
3066
3158
  .e-listbox-wrapper.e-list-template .e-list-wrapper.e-list-avatar:not(.e-list-badge),
3067
- .e-listbox-container.e-list-template .e-list-wrapper.e-list-avatar:not(.e-list-badge) {
3159
+ .e-listbox-container.e-list-template .e-list-wrapper.e-list-avatar:not(.e-list-badge),
3160
+ .e-listboxtool-wrapper.e-list-template .e-list-wrapper.e-list-avatar:not(.e-list-badge) {
3068
3161
  padding-left: 4.923em;
3069
3162
  padding-right: 0.923em;
3070
3163
  }
3071
3164
  .e-listbox-wrapper.e-list-template .e-list-wrapper.e-list-avatar-right:not(.e-list-badge),
3072
- .e-listbox-container.e-list-template .e-list-wrapper.e-list-avatar-right:not(.e-list-badge) {
3165
+ .e-listbox-container.e-list-template .e-list-wrapper.e-list-avatar-right:not(.e-list-badge),
3166
+ .e-listboxtool-wrapper.e-list-template .e-list-wrapper.e-list-avatar-right:not(.e-list-badge) {
3073
3167
  padding-left: 0.923em;
3074
3168
  padding-right: 4.923em;
3075
3169
  }
3076
3170
  .e-listbox-wrapper.e-list-template .e-list-wrapper.e-list-avatar-right:not(.e-list-badge) .e-avatar,
3077
- .e-listbox-container.e-list-template .e-list-wrapper.e-list-avatar-right:not(.e-list-badge) .e-avatar {
3171
+ .e-listbox-container.e-list-template .e-list-wrapper.e-list-avatar-right:not(.e-list-badge) .e-avatar,
3172
+ .e-listboxtool-wrapper.e-list-template .e-list-wrapper.e-list-avatar-right:not(.e-list-badge) .e-avatar {
3078
3173
  height: 3.0769em;
3079
3174
  position: absolute;
3080
3175
  right: 0.923em;
@@ -3082,15 +3177,18 @@ ejs-listbox {
3082
3177
  width: 3.0769em;
3083
3178
  }
3084
3179
  .e-listbox-wrapper.e-list-template .e-list-wrapper.e-list-multi-line.e-list-avatar .e-avatar,
3085
- .e-listbox-container.e-list-template .e-list-wrapper.e-list-multi-line.e-list-avatar .e-avatar {
3180
+ .e-listbox-container.e-list-template .e-list-wrapper.e-list-multi-line.e-list-avatar .e-avatar,
3181
+ .e-listboxtool-wrapper.e-list-template .e-list-wrapper.e-list-multi-line.e-list-avatar .e-avatar {
3086
3182
  top: 0.6153em;
3087
3183
  }
3088
3184
  .e-listbox-wrapper.e-list-template .e-list-wrapper.e-list-multi-line.e-list-avatar-right:not(.e-list-badge) .e-avatar,
3089
- .e-listbox-container.e-list-template .e-list-wrapper.e-list-multi-line.e-list-avatar-right:not(.e-list-badge) .e-avatar {
3185
+ .e-listbox-container.e-list-template .e-list-wrapper.e-list-multi-line.e-list-avatar-right:not(.e-list-badge) .e-avatar,
3186
+ .e-listboxtool-wrapper.e-list-template .e-list-wrapper.e-list-multi-line.e-list-avatar-right:not(.e-list-badge) .e-avatar {
3090
3187
  top: 0.6153em;
3091
3188
  }
3092
3189
  .e-listbox-wrapper.e-list-template .e-list-wrapper.e-list-badge .e-badge,
3093
- .e-listbox-container.e-list-template .e-list-wrapper.e-list-badge .e-badge {
3190
+ .e-listbox-container.e-list-template .e-list-wrapper.e-list-badge .e-badge,
3191
+ .e-listboxtool-wrapper.e-list-template .e-list-wrapper.e-list-badge .e-badge {
3094
3192
  font-size: 13px;
3095
3193
  height: 1.5384em;
3096
3194
  line-height: 1.3384em;
@@ -3102,17 +3200,20 @@ ejs-listbox {
3102
3200
  width: 1.5384em;
3103
3201
  }
3104
3202
  .e-listbox-wrapper.e-list-template .e-list-wrapper.e-list-badge.e-list-avatar,
3105
- .e-listbox-container.e-list-template .e-list-wrapper.e-list-badge.e-list-avatar {
3203
+ .e-listbox-container.e-list-template .e-list-wrapper.e-list-badge.e-list-avatar,
3204
+ .e-listboxtool-wrapper.e-list-template .e-list-wrapper.e-list-badge.e-list-avatar {
3106
3205
  padding-left: 4.923em;
3107
3206
  padding-right: 3.3846em;
3108
3207
  }
3109
3208
  .e-listbox-wrapper.e-list-template .e-list-wrapper.e-list-badge:not(.e-list-avatar),
3110
- .e-listbox-container.e-list-template .e-list-wrapper.e-list-badge:not(.e-list-avatar) {
3209
+ .e-listbox-container.e-list-template .e-list-wrapper.e-list-badge:not(.e-list-avatar),
3210
+ .e-listboxtool-wrapper.e-list-template .e-list-wrapper.e-list-badge:not(.e-list-avatar) {
3111
3211
  padding-left: 0.923em;
3112
3212
  padding-right: 3.3846em;
3113
3213
  }
3114
3214
  .e-listbox-wrapper.e-list-template .e-list-wrapper:not(.e-list-multi-line) .e-list-content,
3115
- .e-listbox-container.e-list-template .e-list-wrapper:not(.e-list-multi-line) .e-list-content {
3215
+ .e-listbox-container.e-list-template .e-list-wrapper:not(.e-list-multi-line) .e-list-content,
3216
+ .e-listboxtool-wrapper.e-list-template .e-list-wrapper:not(.e-list-multi-line) .e-list-content {
3116
3217
  display: block;
3117
3218
  margin: 0;
3118
3219
  overflow: hidden;
@@ -3121,53 +3222,64 @@ ejs-listbox {
3121
3222
  white-space: nowrap;
3122
3223
  }
3123
3224
  .e-listbox-wrapper.e-list-template .e-list-item.e-list-item:hover .e-list-item-header,
3124
- .e-listbox-container.e-list-template .e-list-item.e-list-item:hover .e-list-item-header {
3225
+ .e-listbox-container.e-list-template .e-list-item.e-list-item:hover .e-list-item-header,
3226
+ .e-listboxtool-wrapper.e-list-template .e-list-item.e-list-item:hover .e-list-item-header {
3125
3227
  color: #dadada;
3126
3228
  }
3127
3229
  .e-listbox-wrapper.e-list-template .e-list-item.e-list-item:hover .e-list-content,
3128
- .e-listbox-container.e-list-template .e-list-item.e-list-item:hover .e-list-content {
3230
+ .e-listbox-container.e-list-template .e-list-item.e-list-item:hover .e-list-content,
3231
+ .e-listboxtool-wrapper.e-list-template .e-list-item.e-list-item:hover .e-list-content {
3129
3232
  color: #dadada;
3130
3233
  }
3131
3234
  .e-listbox-wrapper.e-list-template .e-list-item.e-selected .e-list-item-header,
3132
- .e-listbox-container.e-list-template .e-list-item.e-selected .e-list-item-header {
3235
+ .e-listbox-container.e-list-template .e-list-item.e-selected .e-list-item-header,
3236
+ .e-listboxtool-wrapper.e-list-template .e-list-item.e-selected .e-list-item-header {
3133
3237
  color: #fff;
3134
3238
  }
3135
3239
  .e-listbox-wrapper.e-list-template .e-list-item.e-selected .e-list-content,
3136
- .e-listbox-container.e-list-template .e-list-item.e-selected .e-list-content {
3240
+ .e-listbox-container.e-list-template .e-list-item.e-selected .e-list-content,
3241
+ .e-listboxtool-wrapper.e-list-template .e-list-item.e-selected .e-list-content {
3137
3242
  color: #fff;
3138
3243
  }
3139
3244
  .e-listbox-wrapper.e-rtl.e-list-template .e-list-wrapper.e-list-avatar .e-avatar,
3140
- .e-listbox-container.e-rtl.e-list-template .e-list-wrapper.e-list-avatar .e-avatar {
3245
+ .e-listbox-container.e-rtl.e-list-template .e-list-wrapper.e-list-avatar .e-avatar,
3246
+ .e-listboxtool-wrapper.e-rtl.e-list-template .e-list-wrapper.e-list-avatar .e-avatar {
3141
3247
  left: inherit;
3142
3248
  right: 0.923em;
3143
3249
  }
3144
3250
  .e-listbox-wrapper.e-rtl.e-list-template .e-list-wrapper.e-list-avatar:not(.e-list-badge),
3145
- .e-listbox-container.e-rtl.e-list-template .e-list-wrapper.e-list-avatar:not(.e-list-badge) {
3251
+ .e-listbox-container.e-rtl.e-list-template .e-list-wrapper.e-list-avatar:not(.e-list-badge),
3252
+ .e-listboxtool-wrapper.e-rtl.e-list-template .e-list-wrapper.e-list-avatar:not(.e-list-badge) {
3146
3253
  padding-left: 0.923em;
3147
3254
  padding-right: 4.923em;
3148
3255
  }
3149
3256
  .e-listbox-wrapper.e-rtl.e-list-template .e-list-wrapper.e-list-avatar-right:not(.e-list-badge),
3150
- .e-listbox-container.e-rtl.e-list-template .e-list-wrapper.e-list-avatar-right:not(.e-list-badge) {
3257
+ .e-listbox-container.e-rtl.e-list-template .e-list-wrapper.e-list-avatar-right:not(.e-list-badge),
3258
+ .e-listboxtool-wrapper.e-rtl.e-list-template .e-list-wrapper.e-list-avatar-right:not(.e-list-badge) {
3151
3259
  padding-left: 4.923em;
3152
3260
  padding-right: 0.923em;
3153
3261
  }
3154
3262
  .e-listbox-wrapper.e-rtl.e-list-template .e-list-wrapper.e-list-avatar-right:not(.e-list-badge) .e-avatar,
3155
- .e-listbox-container.e-rtl.e-list-template .e-list-wrapper.e-list-avatar-right:not(.e-list-badge) .e-avatar {
3263
+ .e-listbox-container.e-rtl.e-list-template .e-list-wrapper.e-list-avatar-right:not(.e-list-badge) .e-avatar,
3264
+ .e-listboxtool-wrapper.e-rtl.e-list-template .e-list-wrapper.e-list-avatar-right:not(.e-list-badge) .e-avatar {
3156
3265
  left: 0.923em;
3157
3266
  right: inherit;
3158
3267
  }
3159
3268
  .e-listbox-wrapper.e-rtl.e-list-template .e-list-wrapper.e-list-badge .e-badge,
3160
- .e-listbox-container.e-rtl.e-list-template .e-list-wrapper.e-list-badge .e-badge {
3269
+ .e-listbox-container.e-rtl.e-list-template .e-list-wrapper.e-list-badge .e-badge,
3270
+ .e-listboxtool-wrapper.e-rtl.e-list-template .e-list-wrapper.e-list-badge .e-badge {
3161
3271
  left: 0.923em;
3162
3272
  right: inherit;
3163
3273
  }
3164
3274
  .e-listbox-wrapper.e-rtl.e-list-template .e-list-wrapper.e-list-badge.e-list-avatar,
3165
- .e-listbox-container.e-rtl.e-list-template .e-list-wrapper.e-list-badge.e-list-avatar {
3275
+ .e-listbox-container.e-rtl.e-list-template .e-list-wrapper.e-list-badge.e-list-avatar,
3276
+ .e-listboxtool-wrapper.e-rtl.e-list-template .e-list-wrapper.e-list-badge.e-list-avatar {
3166
3277
  padding-left: 3.3846em;
3167
3278
  padding-right: 4.923em;
3168
3279
  }
3169
3280
  .e-listbox-wrapper.e-rtl.e-list-template .e-list-wrapper.e-list-badge:not(.e-list-avatar),
3170
- .e-listbox-container.e-rtl.e-list-template .e-list-wrapper.e-list-badge:not(.e-list-avatar) {
3281
+ .e-listbox-container.e-rtl.e-list-template .e-list-wrapper.e-list-badge:not(.e-list-avatar),
3282
+ .e-listboxtool-wrapper.e-rtl.e-list-template .e-list-wrapper.e-list-badge:not(.e-list-avatar) {
3171
3283
  padding-left: 3.3846em;
3172
3284
  padding-right: 0.923em;
3173
3285
  }