@syncfusion/ej2-dropdowns 18.1.57 → 18.2.44-4569

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 (183) hide show
  1. package/.eslintrc.json +244 -0
  2. package/CHANGELOG.md +1524 -1514
  3. package/README.md +118 -118
  4. package/dist/ej2-dropdowns.umd.min.js +1 -10
  5. package/dist/ej2-dropdowns.umd.min.js.map +1 -1
  6. package/dist/es6/ej2-dropdowns.es2015.js +198 -126
  7. package/dist/es6/ej2-dropdowns.es2015.js.map +1 -1
  8. package/dist/es6/ej2-dropdowns.es5.js +290 -217
  9. package/dist/es6/ej2-dropdowns.es5.js.map +1 -1
  10. package/dist/global/ej2-dropdowns.min.js +1 -10
  11. package/dist/global/ej2-dropdowns.min.js.map +1 -1
  12. package/dist/global/index.d.ts +0 -9
  13. package/dist/ts/auto-complete/auto-complete.ts +527 -0
  14. package/dist/ts/combo-box/combo-box.ts +957 -0
  15. package/dist/ts/common/highlight-search.ts +47 -0
  16. package/dist/ts/common/incremental-search.ts +81 -0
  17. package/dist/ts/drop-down-base/drop-down-base.ts +1572 -0
  18. package/dist/ts/drop-down-list/drop-down-list.ts +2993 -0
  19. package/dist/ts/drop-down-tree/drop-down-tree.ts +3066 -0
  20. package/dist/ts/list-box/list-box.ts +2317 -0
  21. package/dist/ts/multi-select/checkbox-selection.ts +528 -0
  22. package/dist/ts/multi-select/float-label.ts +155 -0
  23. package/dist/ts/multi-select/interface.ts +66 -0
  24. package/dist/ts/multi-select/multi-select.ts +4216 -0
  25. package/helpers/e2e/index.js +3 -3
  26. package/license +2 -2
  27. package/package.json +77 -77
  28. package/src/auto-complete/auto-complete-model.d.ts +179 -179
  29. package/src/auto-complete/auto-complete.d.ts +12 -12
  30. package/src/auto-complete/auto-complete.js +21 -21
  31. package/src/combo-box/combo-box-model.d.ts +212 -212
  32. package/src/combo-box/combo-box.d.ts +27 -27
  33. package/src/combo-box/combo-box.js +29 -29
  34. package/src/common/incremental-search.d.ts +1 -1
  35. package/src/common/incremental-search.js +4 -2
  36. package/src/drop-down-base/drop-down-base-model.d.ts +191 -191
  37. package/src/drop-down-base/drop-down-base.d.ts +17 -17
  38. package/src/drop-down-base/drop-down-base.js +20 -20
  39. package/src/drop-down-list/drop-down-list-model.d.ts +222 -222
  40. package/src/drop-down-list/drop-down-list.d.ts +3 -2
  41. package/src/drop-down-list/drop-down-list.js +43 -30
  42. package/src/drop-down-tree/drop-down-tree-model.d.ts +344 -344
  43. package/src/drop-down-tree/drop-down-tree.js +32 -26
  44. package/src/list-box/index.d.ts +1 -0
  45. package/src/list-box/index.js +1 -0
  46. package/src/list-box/list-box-model.d.ts +156 -156
  47. package/src/list-box/list-box.d.ts +2 -2
  48. package/src/list-box/list-box.js +57 -59
  49. package/src/multi-select/index.d.ts +1 -0
  50. package/src/multi-select/index.js +1 -0
  51. package/src/multi-select/multi-select-model.d.ts +452 -452
  52. package/src/multi-select/multi-select.d.ts +2 -0
  53. package/src/multi-select/multi-select.js +98 -43
  54. package/styles/_all.scss +3 -3
  55. package/styles/auto-complete/_bootstrap-dark-definition.scss +3 -3
  56. package/styles/auto-complete/_bootstrap4-definition.scss +11 -11
  57. package/styles/auto-complete/_fabric-dark-definition.scss +2 -2
  58. package/styles/auto-complete/_highcontrast-light-definition.scss +2 -2
  59. package/styles/auto-complete/_material-dark-definition.scss +2 -2
  60. package/styles/bootstrap-dark.css +67 -61
  61. package/styles/bootstrap.css +69 -63
  62. package/styles/bootstrap4.css +81 -61
  63. package/styles/combo-box/_bootstrap-dark-definition.scss +2 -2
  64. package/styles/combo-box/_bootstrap4-definition.scss +11 -11
  65. package/styles/combo-box/_fabric-dark-definition.scss +2 -2
  66. package/styles/combo-box/_highcontrast-light-definition.scss +3 -3
  67. package/styles/combo-box/_material-dark-definition.scss +2 -2
  68. package/styles/drop-down-base/_all.scss +2 -2
  69. package/styles/drop-down-base/_bootstrap-dark-definition.scss +64 -64
  70. package/styles/drop-down-base/_bootstrap-definition.scss +64 -64
  71. package/styles/drop-down-base/_bootstrap4-definition.scss +78 -78
  72. package/styles/drop-down-base/_definition.scss +23 -23
  73. package/styles/drop-down-base/_fabric-dark-definition.scss +68 -68
  74. package/styles/drop-down-base/_fabric-definition.scss +66 -66
  75. package/styles/drop-down-base/_highcontrast-definition.scss +82 -82
  76. package/styles/drop-down-base/_highcontrast-light-definition.scss +81 -81
  77. package/styles/drop-down-base/_layout.scss +108 -108
  78. package/styles/drop-down-base/_material-dark-definition.scss +67 -67
  79. package/styles/drop-down-base/_material-definition.scss +65 -65
  80. package/styles/drop-down-base/_theme.scss +242 -242
  81. package/styles/drop-down-list/_all.scss +2 -2
  82. package/styles/drop-down-list/_bootstrap-dark-definition.scss +157 -157
  83. package/styles/drop-down-list/_bootstrap-definition.scss +156 -156
  84. package/styles/drop-down-list/_bootstrap4-definition.scss +184 -184
  85. package/styles/drop-down-list/_fabric-dark-definition.scss +127 -127
  86. package/styles/drop-down-list/_fabric-definition.scss +122 -122
  87. package/styles/drop-down-list/_highcontrast-definition.scss +131 -131
  88. package/styles/drop-down-list/_highcontrast-light-definition.scss +133 -133
  89. package/styles/drop-down-list/_layout.scss +218 -218
  90. package/styles/drop-down-list/_material-dark-definition.scss +143 -143
  91. package/styles/drop-down-list/_material-definition.scss +166 -166
  92. package/styles/drop-down-list/_theme.scss +10 -10
  93. package/styles/drop-down-list/icons/_bootstrap-dark.scss +14 -14
  94. package/styles/drop-down-list/icons/_bootstrap.scss +14 -14
  95. package/styles/drop-down-list/icons/_bootstrap4.scss +14 -14
  96. package/styles/drop-down-list/icons/_fabric-dark.scss +14 -14
  97. package/styles/drop-down-list/icons/_fabric.scss +14 -14
  98. package/styles/drop-down-list/icons/_highcontrast-light.scss +14 -14
  99. package/styles/drop-down-list/icons/_highcontrast.scss +14 -14
  100. package/styles/drop-down-list/icons/_material-dark.scss +14 -14
  101. package/styles/drop-down-list/icons/_material.scss +14 -14
  102. package/styles/drop-down-list/material.css +9 -0
  103. package/styles/drop-down-tree/_all.scss +2 -2
  104. package/styles/drop-down-tree/_bootstrap-dark-definition.scss +62 -49
  105. package/styles/drop-down-tree/_bootstrap-definition.scss +62 -49
  106. package/styles/drop-down-tree/_bootstrap4-definition.scss +63 -50
  107. package/styles/drop-down-tree/_fabric-dark-definition.scss +63 -49
  108. package/styles/drop-down-tree/_fabric-definition.scss +63 -49
  109. package/styles/drop-down-tree/_highcontrast-definition.scss +63 -49
  110. package/styles/drop-down-tree/_highcontrast-light-definition.scss +63 -49
  111. package/styles/drop-down-tree/_layout.scss +437 -398
  112. package/styles/drop-down-tree/_material-dark-definition.scss +61 -54
  113. package/styles/drop-down-tree/_material-definition.scss +61 -54
  114. package/styles/drop-down-tree/_theme.scss +68 -63
  115. package/styles/drop-down-tree/bootstrap-dark.css +67 -61
  116. package/styles/drop-down-tree/bootstrap.css +69 -63
  117. package/styles/drop-down-tree/bootstrap4.css +81 -61
  118. package/styles/drop-down-tree/fabric-dark.css +71 -63
  119. package/styles/drop-down-tree/fabric.css +71 -63
  120. package/styles/drop-down-tree/highcontrast-light.css +71 -63
  121. package/styles/drop-down-tree/highcontrast.css +75 -63
  122. package/styles/drop-down-tree/icons/_bootstrap-dark.scss +11 -11
  123. package/styles/drop-down-tree/icons/_bootstrap.scss +11 -11
  124. package/styles/drop-down-tree/icons/_bootstrap4.scss +11 -11
  125. package/styles/drop-down-tree/icons/_fabric-dark.scss +11 -11
  126. package/styles/drop-down-tree/icons/_fabric.scss +11 -11
  127. package/styles/drop-down-tree/icons/_highcontrast-light.scss +11 -11
  128. package/styles/drop-down-tree/icons/_highcontrast.scss +11 -11
  129. package/styles/drop-down-tree/icons/_material-dark.scss +11 -11
  130. package/styles/drop-down-tree/icons/_material.scss +11 -11
  131. package/styles/drop-down-tree/material-dark.css +76 -85
  132. package/styles/drop-down-tree/material.css +93 -85
  133. package/styles/fabric-dark.css +71 -63
  134. package/styles/fabric.css +71 -63
  135. package/styles/highcontrast-light.css +71 -63
  136. package/styles/highcontrast.css +75 -63
  137. package/styles/list-box/_all.scss +2 -2
  138. package/styles/list-box/_bootstrap-dark-definition.scss +118 -118
  139. package/styles/list-box/_bootstrap-definition.scss +112 -112
  140. package/styles/list-box/_bootstrap4-definition.scss +118 -118
  141. package/styles/list-box/_fabric-dark-definition.scss +118 -118
  142. package/styles/list-box/_fabric-definition.scss +112 -112
  143. package/styles/list-box/_highcontrast-definition.scss +112 -112
  144. package/styles/list-box/_highcontrast-light-definition.scss +118 -118
  145. package/styles/list-box/_layout.scss +458 -458
  146. package/styles/list-box/_material-dark-definition.scss +118 -118
  147. package/styles/list-box/_material-definition.scss +112 -112
  148. package/styles/list-box/_theme.scss +273 -273
  149. package/styles/list-box/icons/_bootstrap-dark.scss +25 -25
  150. package/styles/list-box/icons/_bootstrap.scss +25 -25
  151. package/styles/list-box/icons/_bootstrap4.scss +25 -25
  152. package/styles/list-box/icons/_fabric-dark.scss +25 -25
  153. package/styles/list-box/icons/_fabric.scss +25 -25
  154. package/styles/list-box/icons/_highcontrast-light.scss +25 -25
  155. package/styles/list-box/icons/_highcontrast.scss +25 -25
  156. package/styles/list-box/icons/_material-dark.scss +25 -25
  157. package/styles/list-box/icons/_material.scss +25 -25
  158. package/styles/list-box/material-dark.css +4 -4
  159. package/styles/list-box/material.css +4 -4
  160. package/styles/material-dark.css +80 -89
  161. package/styles/material.css +115 -89
  162. package/styles/multi-select/_all.scss +2 -2
  163. package/styles/multi-select/_bootstrap-dark-definition.scss +171 -171
  164. package/styles/multi-select/_bootstrap-definition.scss +166 -166
  165. package/styles/multi-select/_bootstrap4-definition.scss +233 -233
  166. package/styles/multi-select/_fabric-dark-definition.scss +170 -170
  167. package/styles/multi-select/_fabric-definition.scss +167 -167
  168. package/styles/multi-select/_highcontrast-definition.scss +257 -257
  169. package/styles/multi-select/_highcontrast-light-definition.scss +258 -258
  170. package/styles/multi-select/_layout.scss +1153 -1153
  171. package/styles/multi-select/_material-dark-definition.scss +186 -186
  172. package/styles/multi-select/_material-definition.scss +191 -191
  173. package/styles/multi-select/_theme.scss +384 -384
  174. package/styles/multi-select/icons/_bootstrap-dark.scss +26 -26
  175. package/styles/multi-select/icons/_bootstrap.scss +26 -26
  176. package/styles/multi-select/icons/_bootstrap4.scss +37 -37
  177. package/styles/multi-select/icons/_fabric-dark.scss +26 -26
  178. package/styles/multi-select/icons/_fabric.scss +26 -26
  179. package/styles/multi-select/icons/_highcontrast-light.scss +26 -26
  180. package/styles/multi-select/icons/_highcontrast.scss +26 -26
  181. package/styles/multi-select/icons/_material-dark.scss +26 -26
  182. package/styles/multi-select/icons/_material.scss +324 -324
  183. package/styles/multi-select/material.css +9 -0
@@ -731,13 +731,13 @@ ejs-dropdownlist {
731
731
  outline: none;
732
732
  }
733
733
 
734
- .e-ddt.e-icon-anim .e-ddt-icon::before {
735
- transform: rotate(180deg);
734
+ .e-ddt .e-ddt-icon::before {
735
+ transform: rotate(0deg);
736
736
  transition: transform 300ms ease;
737
737
  }
738
738
 
739
- .e-ddt .e-ddt-icon::before {
740
- transform: rotate(0deg);
739
+ .e-ddt.e-icon-anim .e-ddt-icon::before {
740
+ transform: rotate(180deg);
741
741
  transition: transform 300ms ease;
742
742
  }
743
743
 
@@ -760,10 +760,6 @@ ejs-dropdownlist {
760
760
  display: none;
761
761
  }
762
762
 
763
- .e-ddt.e-input-group.e-control-wrapper.e-input-focus input ~ label.e-float-text, .e-ddt.e-float-input.e-control-wrapper.e-input-focus input ~ label.e-float-text {
764
- top: 16px;
765
- }
766
-
767
763
  .e-ddt.e-input-group.e-control-wrapper.e-show-chip .e-clear-icon, .e-ddt.e-float-input.e-control-wrapper.e-show-chip .e-clear-icon {
768
764
  bottom: 0;
769
765
  position: absolute;
@@ -792,27 +788,30 @@ ejs-dropdownlist {
792
788
  }
793
789
 
794
790
  .e-ddt .e-chips-wrapper .e-chips-close {
795
- line-height: 30px;
796
- min-height: 30px;
791
+ line-height: 24px;
792
+ min-height: 28px;
797
793
  min-width: 30px;
798
794
  text-align: center;
799
795
  }
800
796
 
801
797
  .e-ddt .e-chips-wrapper .e-chips-close::before {
802
798
  font-size: 10px;
799
+ vertical-align: middle;
803
800
  }
804
801
 
805
802
  .e-ddt .e-chips-wrapper .e-chips {
806
803
  -ms-flex-align: center;
807
804
  align-items: center;
805
+ border-radius: 4px;
806
+ box-sizing: border-box;
808
807
  display: -ms-inline-flexbox;
809
808
  display: inline-flex;
810
809
  float: left;
811
810
  height: 28px;
812
811
  margin: 2px 1px;
813
- max-width: 100%;
812
+ max-width: calc(100% - 2px);
814
813
  overflow: hidden;
815
- padding: 0 0 0 10px;
814
+ padding: 0;
816
815
  text-overflow: ellipsis;
817
816
  white-space: nowrap;
818
817
  }
@@ -820,22 +819,25 @@ ejs-dropdownlist {
820
819
  .e-ddt .e-chips-wrapper .e-chips > .e-chipcontent {
821
820
  max-width: 100%;
822
821
  overflow: hidden;
823
- padding: 0 10px 0 0;
822
+ padding: 0 10px 0 10px;
824
823
  text-indent: 0;
825
824
  text-overflow: ellipsis;
826
825
  white-space: nowrap;
827
826
  }
828
827
 
829
- .e-ddt.e-show-clear.e-show-dd-icon .e-chips-wrapper .e-chips-collection .e-chips:last-child {
830
- margin-right: 64px;
828
+ .e-ddt.e-show-dd-icon .e-chips-wrapper .e-chips:last-child {
829
+ margin-right: 32px;
830
+ max-width: calc(100% - 33px);
831
831
  }
832
832
 
833
- .e-ddt.e-show-clear .e-chips-wrapper .e-chips-collection .e-chips:last-child {
833
+ .e-ddt.e-show-clear .e-chips-wrapper .e-chips:last-child {
834
834
  margin-right: 32px;
835
+ max-width: calc(100% - 33px);
835
836
  }
836
837
 
837
- .e-ddt.e-show-dd-icon .e-chips-wrapper .e-chips-collection .e-chips:last-child {
838
- margin-right: 32px;
838
+ .e-ddt.e-show-clear.e-show-dd-icon .e-chips-wrapper .e-chips:last-child {
839
+ margin-right: 64px;
840
+ max-width: calc(100% - 65px);
839
841
  }
840
842
 
841
843
  .e-ddt input[readonly],
@@ -851,9 +853,8 @@ ejs-dropdownlist {
851
853
  }
852
854
 
853
855
  .e-ddt.e-popup {
854
- border: 1px solid;
856
+ border: 1px solid #ccc;
855
857
  box-shadow: 0 5px 5px -3px rgba(0, 0, 0, 0.2), 0 8px 10px 0px rgba(0, 0, 0, 0.14), 0 3px 14px 0px rgba(0, 0, 0, 0.12);
856
- margin-top: 2px;
857
858
  position: absolute;
858
859
  }
859
860
 
@@ -864,7 +865,7 @@ ejs-dropdownlist {
864
865
  line-height: 36px;
865
866
  overflow: hidden;
866
867
  position: relative;
867
- text-indent: 39px;
868
+ text-indent: 38px;
868
869
  white-space: nowrap;
869
870
  width: 100%;
870
871
  }
@@ -874,7 +875,6 @@ ejs-dropdownlist {
874
875
  }
875
876
 
876
877
  .e-ddt.e-popup .e-selectall-parent .e-checkbox-wrapper {
877
- margin-right: 10px;
878
878
  position: relative;
879
879
  text-indent: 0;
880
880
  }
@@ -882,10 +882,27 @@ ejs-dropdownlist {
882
882
  .e-ddt.e-popup .e-selectall-parent .e-all-text {
883
883
  font-family: inherit;
884
884
  font-size: 14px;
885
+ margin: 10px;
886
+ }
887
+
888
+ .e-ddt.e-popup .e-filter-wrap .e-input,
889
+ .e-ddt.e-popup .e-filter-wrap .e-input:focus {
890
+ padding: 0 12px;
891
+ }
892
+
893
+ .e-ddt.e-popup .e-filter-wrap {
894
+ border: none;
895
+ border-top-width: 0;
896
+ display: block;
897
+ padding: 5px 8px;
898
+ }
899
+
900
+ .e-ddt.e-popup .e-filter-wrap {
901
+ border-bottom: 1px solid #ccc;
885
902
  }
886
903
 
887
904
  .e-ddt.e-popup .e-filter-wrap .e-input-group {
888
- padding: 0 10px;
905
+ margin-bottom: 0;
889
906
  }
890
907
 
891
908
  .e-ddt.e-popup .e-popup-content {
@@ -948,29 +965,26 @@ ejs-dropdownlist {
948
965
 
949
966
  .e-ddt.e-rtl .e-chips-wrapper .e-chips {
950
967
  float: right;
951
- padding: 0 10px 0 0;
952
968
  }
953
969
 
954
- .e-ddt.e-rtl .e-chips-wrapper .e-chips > .e-chipcontent {
955
- padding: 0 0 0 10px;
956
- }
957
-
958
- .e-ddt.e-rtl.e-show-clear.e-show-dd-icon .e-chips-wrapper .e-chips-collection .e-chips:last-child {
959
- margin-left: 64px;
970
+ .e-ddt.e-rtl.e-show-dd-icon .e-chips-wrapper .e-chips:last-child {
971
+ margin-left: 32px;
960
972
  margin-right: 1px;
961
973
  }
962
974
 
963
- .e-ddt.e-rtl.e-show-clear .e-chips-wrapper .e-chips-collection .e-chips:last-child {
975
+ .e-ddt.e-rtl.e-show-clear .e-chips-wrapper .e-chips:last-child {
964
976
  margin-left: 32px;
965
977
  margin-right: 1px;
966
978
  }
967
979
 
968
- .e-ddt.e-rtl.e-show-dd-icon .e-chips-wrapper .e-chips-collection .e-chips:last-child {
969
- margin-left: 32px;
980
+ .e-ddt.e-rtl.e-show-clear.e-show-dd-icon .e-chips-wrapper .e-chips:last-child {
981
+ margin-left: 64px;
970
982
  margin-right: 1px;
971
983
  }
972
984
 
973
- .e-ddt.e-rtl.e-input-group.e-control-wrapper.e-show-chip .e-clear-icon, .e-ddt.e-rtl.e-float-input.e-control-wrapper.e-show-chip .e-clear-icon {
985
+ .e-ddt.e-rtl.e-input-group.e-control-wrapper.e-show-chip .e-clear-icon,
986
+ .e-ddt.e-rtl.e-input-group.e-control-wrapper.e-show-chip .e-ddt-icon, .e-ddt.e-rtl.e-float-input.e-control-wrapper.e-show-chip .e-clear-icon,
987
+ .e-ddt.e-rtl.e-float-input.e-control-wrapper.e-show-chip .e-ddt-icon {
974
988
  left: 0;
975
989
  right: auto;
976
990
  }
@@ -979,16 +993,6 @@ ejs-dropdownlist {
979
993
  left: 32px;
980
994
  }
981
995
 
982
- .e-ddt.e-rtl.e-input-group.e-control-wrapper.e-show-chip .e-ddt-icon, .e-ddt.e-rtl.e-float-input.e-control-wrapper.e-show-chip .e-ddt-icon {
983
- left: 0;
984
- right: auto;
985
- }
986
-
987
- .e-ddt.e-rtl.e-popup .e-selectall-parent .e-checkbox-wrapper {
988
- margin-left: 10px;
989
- margin-right: 0;
990
- }
991
-
992
996
  .e-ddt.e-rtl.e-popup .e-treeview .e-list-item .e-ul {
993
997
  padding: 0 14px 0 0;
994
998
  }
@@ -1016,24 +1020,27 @@ ejs-dropdownlist {
1016
1020
  min-height: 38px;
1017
1021
  }
1018
1022
 
1019
- .e-bigger .e-ddt.e-show-clear.e-show-dd-icon .e-chips-wrapper .e-chips-collection .e-chips:last-child,
1020
- .e-ddt.e-bigger.e-show-clear.e-show-dd-icon .e-chips-wrapper .e-chips-collection .e-chips:last-child {
1021
- margin-right: 76px;
1023
+ .e-bigger .e-ddt.e-show-dd-icon .e-chips-wrapper .e-chips:last-child,
1024
+ .e-ddt.e-bigger.e-show-dd-icon .e-chips-wrapper .e-chips:last-child {
1025
+ margin-right: 38px;
1026
+ max-width: calc(100% - 39px);
1022
1027
  }
1023
1028
 
1024
- .e-bigger .e-ddt.e-show-clear .e-chips-wrapper .e-chips-collection .e-chips:last-child,
1025
- .e-ddt.e-bigger.e-show-clear .e-chips-wrapper .e-chips-collection .e-chips:last-child {
1029
+ .e-bigger .e-ddt.e-show-clear .e-chips-wrapper .e-chips:last-child,
1030
+ .e-ddt.e-bigger.e-show-clear .e-chips-wrapper .e-chips:last-child {
1026
1031
  margin-right: 38px;
1032
+ max-width: calc(100% - 39px);
1027
1033
  }
1028
1034
 
1029
- .e-bigger .e-ddt.e-show-dd-icon .e-chips-wrapper .e-chips-collection .e-chips:last-child,
1030
- .e-ddt.e-bigger.e-show-dd-icon .e-chips-wrapper .e-chips-collection .e-chips:last-child {
1031
- margin-right: 38px;
1035
+ .e-bigger .e-ddt.e-show-clear.e-show-dd-icon .e-chips-wrapper .e-chips:last-child,
1036
+ .e-ddt.e-bigger.e-show-clear.e-show-dd-icon .e-chips-wrapper .e-chips:last-child {
1037
+ margin-right: 76px;
1038
+ max-width: calc(100% - 77px);
1032
1039
  }
1033
1040
 
1034
1041
  .e-bigger .e-ddt.e-popup .e-selectall-parent,
1035
1042
  .e-ddt.e-bigger.e-popup .e-selectall-parent {
1036
- text-indent: 44px;
1043
+ text-indent: 43px;
1037
1044
  }
1038
1045
 
1039
1046
  .e-bigger .e-ddt.e-popup .e-treeview .e-fullrow,
@@ -1041,21 +1048,21 @@ ejs-dropdownlist {
1041
1048
  height: 44px;
1042
1049
  }
1043
1050
 
1044
- .e-bigger .e-ddt.e-rtl.e-show-clear.e-show-dd-icon .e-chips-wrapper .e-chips-collection .e-chips:last-child,
1045
- .e-ddt.e-bigger.e-rtl.e-show-clear.e-show-dd-icon .e-chips-wrapper .e-chips-collection .e-chips:last-child {
1046
- margin-left: 76px;
1051
+ .e-bigger .e-ddt.e-rtl.e-show-dd-icon .e-chips-wrapper .e-chips:last-child,
1052
+ .e-ddt.e-bigger.e-rtl.e-show-dd-icon .e-chips-wrapper .e-chips:last-child {
1053
+ margin-left: 38px;
1047
1054
  margin-right: 1px;
1048
1055
  }
1049
1056
 
1050
- .e-bigger .e-ddt.e-rtl.e-show-clear .e-chips-wrapper .e-chips-collection .e-chips:last-child,
1051
- .e-ddt.e-bigger.e-rtl.e-show-clear .e-chips-wrapper .e-chips-collection .e-chips:last-child {
1057
+ .e-bigger .e-ddt.e-rtl.e-show-clear .e-chips-wrapper .e-chips:last-child,
1058
+ .e-ddt.e-bigger.e-rtl.e-show-clear .e-chips-wrapper .e-chips:last-child {
1052
1059
  margin-left: 38px;
1053
1060
  margin-right: 1px;
1054
1061
  }
1055
1062
 
1056
- .e-bigger .e-ddt.e-rtl.e-show-dd-icon .e-chips-wrapper .e-chips-collection .e-chips:last-child,
1057
- .e-ddt.e-bigger.e-rtl.e-show-dd-icon .e-chips-wrapper .e-chips-collection .e-chips:last-child {
1058
- margin-left: 38px;
1063
+ .e-bigger .e-ddt.e-rtl.e-show-clear.e-show-dd-icon .e-chips-wrapper .e-chips:last-child,
1064
+ .e-ddt.e-bigger.e-rtl.e-show-clear.e-show-dd-icon .e-chips-wrapper .e-chips:last-child {
1065
+ margin-left: 76px;
1059
1066
  margin-right: 1px;
1060
1067
  }
1061
1068
 
@@ -1067,7 +1074,6 @@ ejs-dropdownlist {
1067
1074
 
1068
1075
  .e-ddt .e-chips {
1069
1076
  background-color: #e6e6e6;
1070
- border-radius: 4px;
1071
1077
  }
1072
1078
 
1073
1079
  .e-ddt .e-chips .e-chips-close::before {
@@ -1100,7 +1106,7 @@ ejs-dropdownlist {
1100
1106
  }
1101
1107
 
1102
1108
  .e-ddt.e-popup .e-selectall-parent {
1103
- border-bottom: 1px solid #e6e6e6;
1109
+ border-bottom-color: #e6e6e6;
1104
1110
  }
1105
1111
 
1106
1112
  .e-ddt.e-popup .e-selectall-parent .e-all-text {
@@ -775,13 +775,13 @@ ejs-dropdownlist {
775
775
  outline: none;
776
776
  }
777
777
 
778
- .e-ddt.e-icon-anim .e-ddt-icon::before {
779
- transform: rotate(180deg);
778
+ .e-ddt .e-ddt-icon::before {
779
+ transform: rotate(0deg);
780
780
  transition: transform 300ms ease;
781
781
  }
782
782
 
783
- .e-ddt .e-ddt-icon::before {
784
- transform: rotate(0deg);
783
+ .e-ddt.e-icon-anim .e-ddt-icon::before {
784
+ transform: rotate(180deg);
785
785
  transition: transform 300ms ease;
786
786
  }
787
787
 
@@ -805,10 +805,6 @@ ejs-dropdownlist {
805
805
  display: none;
806
806
  }
807
807
 
808
- .e-ddt.e-input-group.e-control-wrapper.e-input-focus input ~ label.e-float-text, .e-ddt.e-float-input.e-control-wrapper.e-input-focus input ~ label.e-float-text {
809
- top: 14px;
810
- }
811
-
812
808
  .e-ddt.e-input-group.e-control-wrapper.e-show-chip .e-clear-icon, .e-ddt.e-float-input.e-control-wrapper.e-show-chip .e-clear-icon {
813
809
  bottom: 0;
814
810
  position: absolute;
@@ -845,19 +841,22 @@ ejs-dropdownlist {
845
841
 
846
842
  .e-ddt .e-chips-wrapper .e-chips-close::before {
847
843
  font-size: 8px;
844
+ vertical-align: middle;
848
845
  }
849
846
 
850
847
  .e-ddt .e-chips-wrapper .e-chips {
851
848
  -ms-flex-align: center;
852
849
  align-items: center;
850
+ border-radius: 4px;
851
+ box-sizing: border-box;
853
852
  display: -ms-inline-flexbox;
854
853
  display: inline-flex;
855
854
  float: left;
856
855
  height: 25px;
857
856
  margin: 2px 1px;
858
- max-width: 100%;
857
+ max-width: calc(100% - 2px);
859
858
  overflow: hidden;
860
- padding: 0 0 0 8px;
859
+ padding: 0;
861
860
  text-overflow: ellipsis;
862
861
  white-space: nowrap;
863
862
  }
@@ -865,22 +864,25 @@ ejs-dropdownlist {
865
864
  .e-ddt .e-chips-wrapper .e-chips > .e-chipcontent {
866
865
  max-width: 100%;
867
866
  overflow: hidden;
868
- padding: 0 8px 0 0;
867
+ padding: 0 8px 0 8px;
869
868
  text-indent: 0;
870
869
  text-overflow: ellipsis;
871
870
  white-space: nowrap;
872
871
  }
873
872
 
874
- .e-ddt.e-show-clear.e-show-dd-icon .e-chips-wrapper .e-chips-collection .e-chips:last-child {
875
- margin-right: 48px;
873
+ .e-ddt.e-show-dd-icon .e-chips-wrapper .e-chips:last-child {
874
+ margin-right: 23px;
875
+ max-width: calc(100% - 24px);
876
876
  }
877
877
 
878
- .e-ddt.e-show-clear .e-chips-wrapper .e-chips-collection .e-chips:last-child {
878
+ .e-ddt.e-show-clear .e-chips-wrapper .e-chips:last-child {
879
879
  margin-right: 24px;
880
+ max-width: calc(100% - 25px);
880
881
  }
881
882
 
882
- .e-ddt.e-show-dd-icon .e-chips-wrapper .e-chips-collection .e-chips:last-child {
883
- margin-right: 23px;
883
+ .e-ddt.e-show-clear.e-show-dd-icon .e-chips-wrapper .e-chips:last-child {
884
+ margin-right: 48px;
885
+ max-width: calc(100% - 48px);
884
886
  }
885
887
 
886
888
  .e-ddt input[readonly],
@@ -896,9 +898,9 @@ ejs-dropdownlist {
896
898
  }
897
899
 
898
900
  .e-ddt.e-popup {
899
- border: 1px solid;
901
+ border: 1px solid rgba(0, 0, 0, 0.15);
902
+ border-radius: 4px;
900
903
  box-shadow: 0 5px 5px -3px rgba(0, 0, 0, 0.2), 0 8px 10px 0px rgba(0, 0, 0, 0.14), 0 3px 14px 0px rgba(0, 0, 0, 0.12);
901
- margin-top: 2px;
902
904
  position: absolute;
903
905
  }
904
906
 
@@ -909,7 +911,7 @@ ejs-dropdownlist {
909
911
  line-height: 36px;
910
912
  overflow: hidden;
911
913
  position: relative;
912
- text-indent: 39px;
914
+ text-indent: 38px;
913
915
  white-space: nowrap;
914
916
  width: 100%;
915
917
  }
@@ -919,7 +921,6 @@ ejs-dropdownlist {
919
921
  }
920
922
 
921
923
  .e-ddt.e-popup .e-selectall-parent .e-checkbox-wrapper {
922
- margin-right: 10px;
923
924
  position: relative;
924
925
  text-indent: 0;
925
926
  }
@@ -927,10 +928,28 @@ ejs-dropdownlist {
927
928
  .e-ddt.e-popup .e-selectall-parent .e-all-text {
928
929
  font-family: inherit;
929
930
  font-size: 14px;
931
+ margin: 10px;
932
+ }
933
+
934
+ .e-ddt.e-popup .e-filter-wrap .e-input,
935
+ .e-ddt.e-popup .e-filter-wrap .e-input:focus {
936
+ padding: 0 20px;
937
+ }
938
+
939
+ .e-ddt.e-popup .e-filter-wrap {
940
+ border: rgba(0, 0, 0, 0.12);
941
+ border-top-width: 0;
942
+ display: block;
943
+ padding: 0;
944
+ }
945
+
946
+ .e-ddt.e-popup .e-filter-wrap {
947
+ background: rgba(0, 0, 0, 0.03);
930
948
  }
931
949
 
932
950
  .e-ddt.e-popup .e-filter-wrap .e-input-group {
933
- padding: 0 10px;
951
+ margin-bottom: 0;
952
+ background: rgba(0, 0, 0, 0.03);
934
953
  }
935
954
 
936
955
  .e-ddt.e-popup .e-popup-content {
@@ -993,29 +1012,26 @@ ejs-dropdownlist {
993
1012
 
994
1013
  .e-ddt.e-rtl .e-chips-wrapper .e-chips {
995
1014
  float: right;
996
- padding: 0 8px 0 0;
997
- }
998
-
999
- .e-ddt.e-rtl .e-chips-wrapper .e-chips > .e-chipcontent {
1000
- padding: 0 0 0 8px;
1001
1015
  }
1002
1016
 
1003
- .e-ddt.e-rtl.e-show-clear.e-show-dd-icon .e-chips-wrapper .e-chips-collection .e-chips:last-child {
1004
- margin-left: 48px;
1017
+ .e-ddt.e-rtl.e-show-dd-icon .e-chips-wrapper .e-chips:last-child {
1018
+ margin-left: 23px;
1005
1019
  margin-right: 1px;
1006
1020
  }
1007
1021
 
1008
- .e-ddt.e-rtl.e-show-clear .e-chips-wrapper .e-chips-collection .e-chips:last-child {
1022
+ .e-ddt.e-rtl.e-show-clear .e-chips-wrapper .e-chips:last-child {
1009
1023
  margin-left: 24px;
1010
1024
  margin-right: 1px;
1011
1025
  }
1012
1026
 
1013
- .e-ddt.e-rtl.e-show-dd-icon .e-chips-wrapper .e-chips-collection .e-chips:last-child {
1014
- margin-left: 23px;
1027
+ .e-ddt.e-rtl.e-show-clear.e-show-dd-icon .e-chips-wrapper .e-chips:last-child {
1028
+ margin-left: 48px;
1015
1029
  margin-right: 1px;
1016
1030
  }
1017
1031
 
1018
- .e-ddt.e-rtl.e-input-group.e-control-wrapper.e-show-chip .e-clear-icon, .e-ddt.e-rtl.e-float-input.e-control-wrapper.e-show-chip .e-clear-icon {
1032
+ .e-ddt.e-rtl.e-input-group.e-control-wrapper.e-show-chip .e-clear-icon,
1033
+ .e-ddt.e-rtl.e-input-group.e-control-wrapper.e-show-chip .e-ddt-icon, .e-ddt.e-rtl.e-float-input.e-control-wrapper.e-show-chip .e-clear-icon,
1034
+ .e-ddt.e-rtl.e-float-input.e-control-wrapper.e-show-chip .e-ddt-icon {
1019
1035
  left: 0;
1020
1036
  right: auto;
1021
1037
  }
@@ -1024,16 +1040,6 @@ ejs-dropdownlist {
1024
1040
  left: 23px;
1025
1041
  }
1026
1042
 
1027
- .e-ddt.e-rtl.e-input-group.e-control-wrapper.e-show-chip .e-ddt-icon, .e-ddt.e-rtl.e-float-input.e-control-wrapper.e-show-chip .e-ddt-icon {
1028
- left: 0;
1029
- right: auto;
1030
- }
1031
-
1032
- .e-ddt.e-rtl.e-popup .e-selectall-parent .e-checkbox-wrapper {
1033
- margin-left: 10px;
1034
- margin-right: 0;
1035
- }
1036
-
1037
1043
  .e-ddt.e-rtl.e-popup .e-treeview .e-list-item .e-ul {
1038
1044
  padding: 0 14px 0 0;
1039
1045
  }
@@ -1067,24 +1073,39 @@ ejs-dropdownlist {
1067
1073
  min-height: 36px;
1068
1074
  }
1069
1075
 
1070
- .e-bigger .e-ddt.e-show-clear.e-show-dd-icon .e-chips-wrapper .e-chips-collection .e-chips:last-child,
1071
- .e-ddt.e-bigger.e-show-clear.e-show-dd-icon .e-chips-wrapper .e-chips-collection .e-chips:last-child {
1072
- margin-right: 68px;
1076
+ .e-bigger .e-ddt .e-chips-wrapper .e-chips-close,
1077
+ .e-ddt.e-bigger .e-chips-wrapper .e-chips-close {
1078
+ line-height: 27px;
1079
+ min-height: 30px;
1080
+ min-width: 30px;
1073
1081
  }
1074
1082
 
1075
- .e-bigger .e-ddt.e-show-clear .e-chips-wrapper .e-chips-collection .e-chips:last-child,
1076
- .e-ddt.e-bigger.e-show-clear .e-chips-wrapper .e-chips-collection .e-chips:last-child {
1077
- margin-right: 35px;
1083
+ .e-bigger .e-ddt .e-chips-wrapper .e-chips-close::before,
1084
+ .e-ddt.e-bigger .e-chips-wrapper .e-chips-close::before {
1085
+ font-size: 10px;
1078
1086
  }
1079
1087
 
1080
- .e-bigger .e-ddt.e-show-dd-icon .e-chips-wrapper .e-chips-collection .e-chips:last-child,
1081
- .e-ddt.e-bigger.e-show-dd-icon .e-chips-wrapper .e-chips-collection .e-chips:last-child {
1088
+ .e-bigger .e-ddt.e-show-dd-icon .e-chips-wrapper .e-chips:last-child,
1089
+ .e-ddt.e-bigger.e-show-dd-icon .e-chips-wrapper .e-chips:last-child {
1082
1090
  margin-right: 32px;
1091
+ max-width: calc(100% - 34px);
1092
+ }
1093
+
1094
+ .e-bigger .e-ddt.e-show-clear .e-chips-wrapper .e-chips:last-child,
1095
+ .e-ddt.e-bigger.e-show-clear .e-chips-wrapper .e-chips:last-child {
1096
+ margin-right: 35px;
1097
+ max-width: calc(100% - 35px);
1098
+ }
1099
+
1100
+ .e-bigger .e-ddt.e-show-clear.e-show-dd-icon .e-chips-wrapper .e-chips:last-child,
1101
+ .e-ddt.e-bigger.e-show-clear.e-show-dd-icon .e-chips-wrapper .e-chips:last-child {
1102
+ margin-right: 68px;
1103
+ max-width: calc(100% - 68px);
1083
1104
  }
1084
1105
 
1085
1106
  .e-bigger .e-ddt.e-popup .e-selectall-parent,
1086
1107
  .e-ddt.e-bigger.e-popup .e-selectall-parent {
1087
- text-indent: 44px;
1108
+ text-indent: 43px;
1088
1109
  }
1089
1110
 
1090
1111
  .e-bigger .e-ddt.e-popup .e-treeview .e-fullrow,
@@ -1092,21 +1113,21 @@ ejs-dropdownlist {
1092
1113
  height: 44px;
1093
1114
  }
1094
1115
 
1095
- .e-bigger .e-ddt.e-rtl.e-show-clear.e-show-dd-icon .e-chips-wrapper .e-chips-collection .e-chips:last-child,
1096
- .e-ddt.e-bigger.e-rtl.e-show-clear.e-show-dd-icon .e-chips-wrapper .e-chips-collection .e-chips:last-child {
1097
- margin-left: 68px;
1116
+ .e-bigger .e-ddt.e-rtl.e-show-dd-icon .e-chips-wrapper .e-chips:last-child,
1117
+ .e-ddt.e-bigger.e-rtl.e-show-dd-icon .e-chips-wrapper .e-chips:last-child {
1118
+ margin-left: 32px;
1098
1119
  margin-right: 1px;
1099
1120
  }
1100
1121
 
1101
- .e-bigger .e-ddt.e-rtl.e-show-clear .e-chips-wrapper .e-chips-collection .e-chips:last-child,
1102
- .e-ddt.e-bigger.e-rtl.e-show-clear .e-chips-wrapper .e-chips-collection .e-chips:last-child {
1122
+ .e-bigger .e-ddt.e-rtl.e-show-clear .e-chips-wrapper .e-chips:last-child,
1123
+ .e-ddt.e-bigger.e-rtl.e-show-clear .e-chips-wrapper .e-chips:last-child {
1103
1124
  margin-left: 35px;
1104
1125
  margin-right: 1px;
1105
1126
  }
1106
1127
 
1107
- .e-bigger .e-ddt.e-rtl.e-show-dd-icon .e-chips-wrapper .e-chips-collection .e-chips:last-child,
1108
- .e-ddt.e-bigger.e-rtl.e-show-dd-icon .e-chips-wrapper .e-chips-collection .e-chips:last-child {
1109
- margin-left: 32px;
1128
+ .e-bigger .e-ddt.e-rtl.e-show-clear.e-show-dd-icon .e-chips-wrapper .e-chips:last-child,
1129
+ .e-ddt.e-bigger.e-rtl.e-show-clear.e-show-dd-icon .e-chips-wrapper .e-chips:last-child {
1130
+ margin-left: 68px;
1110
1131
  margin-right: 1px;
1111
1132
  }
1112
1133
 
@@ -1118,7 +1139,6 @@ ejs-dropdownlist {
1118
1139
 
1119
1140
  .e-ddt .e-chips {
1120
1141
  background-color: #6c757d;
1121
- border-radius: 4px;
1122
1142
  }
1123
1143
 
1124
1144
  .e-ddt .e-chips .e-chips-close::before {
@@ -1156,7 +1176,7 @@ ejs-dropdownlist {
1156
1176
  }
1157
1177
 
1158
1178
  .e-ddt.e-popup .e-selectall-parent {
1159
- border-bottom: 1px solid #212529;
1179
+ border-bottom-color: rgba(0, 0, 0, 0.15);
1160
1180
  }
1161
1181
 
1162
1182
  .e-ddt.e-popup .e-selectall-parent .e-all-text {
@@ -1,2 +1,2 @@
1
- //default
2
- //enddefault
1
+ //default
2
+ //enddefault
@@ -1,11 +1,11 @@
1
- //default
2
-
3
- .e-input-group.e-ddl .e-control.e-combobox~.e-ddl-icon {
4
- font-size: 8px;
5
- }
6
-
7
- .e-bigger .e-input-group.e-ddl .e-control.e-combobox~.e-ddl-icon {
8
- font-size: 10px;
9
- }
10
-
11
- //enddefault
1
+ //default
2
+
3
+ .e-input-group.e-ddl .e-control.e-combobox~.e-ddl-icon {
4
+ font-size: 8px;
5
+ }
6
+
7
+ .e-bigger .e-input-group.e-ddl .e-control.e-combobox~.e-ddl-icon {
8
+ font-size: 10px;
9
+ }
10
+
11
+ //enddefault
@@ -1,2 +1,2 @@
1
- //default
2
- //enddefault
1
+ //default
2
+ //enddefault
@@ -1,3 +1,3 @@
1
- //default
2
- //undefined
3
- //enddefault
1
+ //default
2
+ //undefined
3
+ //enddefault
@@ -1,2 +1,2 @@
1
- //default
2
- //enddefault
1
+ //default
2
+ //enddefault
@@ -1,2 +1,2 @@
1
- @import 'layout.scss';
2
- @import 'theme.scss';
1
+ @import 'layout.scss';
2
+ @import 'theme.scss';