@syncfusion/ej2-dropdowns 22.2.12 → 23.1.38

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 (264) hide show
  1. package/.eslintrc.json +260 -0
  2. package/CHANGELOG.md +4 -209
  3. package/dist/ej2-dropdowns.min.js +3 -3
  4. package/dist/ej2-dropdowns.umd.min.js +3 -3
  5. package/dist/ej2-dropdowns.umd.min.js.map +1 -1
  6. package/dist/es6/ej2-dropdowns.es2015.js +1149 -70
  7. package/dist/es6/ej2-dropdowns.es2015.js.map +1 -1
  8. package/dist/es6/ej2-dropdowns.es5.js +1203 -66
  9. package/dist/es6/ej2-dropdowns.es5.js.map +1 -1
  10. package/dist/global/ej2-dropdowns.min.js +3 -3
  11. package/dist/global/ej2-dropdowns.min.js.map +1 -1
  12. package/dist/global/index.d.ts +2 -2
  13. package/package.json +13 -12
  14. package/src/auto-complete/auto-complete.js +40 -2
  15. package/src/combo-box/combo-box.js +9 -3
  16. package/src/common/index.d.ts +2 -0
  17. package/src/common/index.js +1 -0
  18. package/src/common/interface.d.ts +76 -0
  19. package/src/common/interface.js +1 -0
  20. package/src/common/virtual-scroll.d.ts +62 -0
  21. package/src/common/virtual-scroll.js +379 -0
  22. package/src/drop-down-base/drop-down-base.d.ts +10 -4
  23. package/src/drop-down-base/drop-down-base.js +72 -8
  24. package/src/drop-down-list/drop-down-list-model.d.ts +8 -1
  25. package/src/drop-down-list/drop-down-list.d.ts +56 -1
  26. package/src/drop-down-list/drop-down-list.js +661 -40
  27. package/src/drop-down-list/index.d.ts +1 -0
  28. package/src/drop-down-list/index.js +1 -0
  29. package/src/drop-down-tree/drop-down-tree.d.ts +1 -1
  30. package/src/global.js +3 -0
  31. package/src/mention/mention.js +8 -1
  32. package/src/multi-select/checkbox-selection.js +1 -1
  33. package/src/multi-select/multi-select.d.ts +1 -0
  34. package/src/multi-select/multi-select.js +36 -9
  35. package/styles/auto-complete/bootstrap-dark.scss +1 -1
  36. package/styles/auto-complete/bootstrap.scss +1 -1
  37. package/styles/auto-complete/bootstrap4.scss +1 -1
  38. package/styles/auto-complete/bootstrap5-dark.scss +1 -1
  39. package/styles/auto-complete/bootstrap5.scss +1 -1
  40. package/styles/auto-complete/fabric-dark.scss +1 -1
  41. package/styles/auto-complete/fabric.scss +1 -1
  42. package/styles/auto-complete/fluent-dark.scss +1 -1
  43. package/styles/auto-complete/fluent.scss +1 -1
  44. package/styles/auto-complete/highcontrast-light.scss +1 -1
  45. package/styles/auto-complete/highcontrast.scss +1 -1
  46. package/styles/auto-complete/material-dark.css +0 -1
  47. package/styles/auto-complete/material-dark.scss +1 -1
  48. package/styles/auto-complete/material.css +0 -1
  49. package/styles/auto-complete/material.scss +1 -1
  50. package/styles/auto-complete/material3-dark.css +0 -1
  51. package/styles/auto-complete/material3-dark.scss +1 -1
  52. package/styles/auto-complete/material3.css +0 -1
  53. package/styles/auto-complete/material3.scss +1 -1
  54. package/styles/auto-complete/tailwind-dark.css +0 -1
  55. package/styles/auto-complete/tailwind-dark.scss +1 -1
  56. package/styles/auto-complete/tailwind.css +0 -1
  57. package/styles/auto-complete/tailwind.scss +1 -1
  58. package/styles/bootstrap-dark.css +70 -15
  59. package/styles/bootstrap.css +70 -15
  60. package/styles/bootstrap4.css +71 -16
  61. package/styles/bootstrap5-dark.css +71 -16
  62. package/styles/bootstrap5.css +71 -16
  63. package/styles/combo-box/bootstrap-dark.scss +1 -1
  64. package/styles/combo-box/bootstrap.scss +1 -1
  65. package/styles/combo-box/bootstrap4.scss +1 -1
  66. package/styles/combo-box/bootstrap5-dark.scss +1 -1
  67. package/styles/combo-box/bootstrap5.scss +1 -1
  68. package/styles/combo-box/fabric-dark.scss +1 -1
  69. package/styles/combo-box/fabric.scss +1 -1
  70. package/styles/combo-box/fluent-dark.scss +1 -1
  71. package/styles/combo-box/fluent.scss +1 -1
  72. package/styles/combo-box/highcontrast-light.scss +1 -1
  73. package/styles/combo-box/highcontrast.scss +1 -1
  74. package/styles/combo-box/material-dark.css +0 -1
  75. package/styles/combo-box/material-dark.scss +1 -1
  76. package/styles/combo-box/material.css +0 -1
  77. package/styles/combo-box/material.scss +1 -1
  78. package/styles/combo-box/material3-dark.css +0 -1
  79. package/styles/combo-box/material3-dark.scss +1 -1
  80. package/styles/combo-box/material3.css +0 -1
  81. package/styles/combo-box/material3.scss +1 -1
  82. package/styles/combo-box/tailwind-dark.css +0 -1
  83. package/styles/combo-box/tailwind-dark.scss +1 -1
  84. package/styles/combo-box/tailwind.css +0 -1
  85. package/styles/combo-box/tailwind.scss +1 -1
  86. package/styles/drop-down-base/bootstrap-dark.scss +1 -1
  87. package/styles/drop-down-base/bootstrap.scss +1 -1
  88. package/styles/drop-down-base/bootstrap4.scss +1 -1
  89. package/styles/drop-down-base/bootstrap5-dark.scss +1 -1
  90. package/styles/drop-down-base/bootstrap5.scss +1 -1
  91. package/styles/drop-down-base/fabric-dark.scss +1 -1
  92. package/styles/drop-down-base/fabric.scss +1 -1
  93. package/styles/drop-down-base/fluent-dark.scss +1 -1
  94. package/styles/drop-down-base/fluent.scss +1 -1
  95. package/styles/drop-down-base/highcontrast-light.scss +1 -1
  96. package/styles/drop-down-base/highcontrast.scss +1 -1
  97. package/styles/drop-down-base/material-dark.css +0 -1
  98. package/styles/drop-down-base/material-dark.scss +1 -1
  99. package/styles/drop-down-base/material.css +0 -1
  100. package/styles/drop-down-base/material.scss +1 -1
  101. package/styles/drop-down-base/material3-dark.css +0 -1
  102. package/styles/drop-down-base/material3-dark.scss +1 -1
  103. package/styles/drop-down-base/material3.css +0 -1
  104. package/styles/drop-down-base/material3.scss +1 -1
  105. package/styles/drop-down-base/tailwind-dark.css +0 -1
  106. package/styles/drop-down-base/tailwind-dark.scss +1 -1
  107. package/styles/drop-down-base/tailwind.css +0 -1
  108. package/styles/drop-down-base/tailwind.scss +1 -1
  109. package/styles/drop-down-list/bootstrap-dark.scss +2 -1
  110. package/styles/drop-down-list/bootstrap.scss +2 -1
  111. package/styles/drop-down-list/bootstrap4.scss +2 -1
  112. package/styles/drop-down-list/bootstrap5-dark.scss +2 -1
  113. package/styles/drop-down-list/bootstrap5.scss +2 -1
  114. package/styles/drop-down-list/fabric-dark.scss +2 -1
  115. package/styles/drop-down-list/fabric.scss +2 -1
  116. package/styles/drop-down-list/fluent-dark.scss +2 -1
  117. package/styles/drop-down-list/fluent.scss +2 -1
  118. package/styles/drop-down-list/highcontrast-light.scss +2 -1
  119. package/styles/drop-down-list/highcontrast.scss +2 -1
  120. package/styles/drop-down-list/material-dark.css +0 -1
  121. package/styles/drop-down-list/material-dark.scss +2 -1
  122. package/styles/drop-down-list/material.css +0 -1
  123. package/styles/drop-down-list/material.scss +2 -1
  124. package/styles/drop-down-list/material3-dark.css +0 -1
  125. package/styles/drop-down-list/material3-dark.scss +2 -1
  126. package/styles/drop-down-list/material3.css +0 -1
  127. package/styles/drop-down-list/material3.scss +2 -1
  128. package/styles/drop-down-list/tailwind-dark.css +0 -1
  129. package/styles/drop-down-list/tailwind-dark.scss +2 -1
  130. package/styles/drop-down-list/tailwind.css +0 -1
  131. package/styles/drop-down-list/tailwind.scss +2 -1
  132. package/styles/drop-down-tree/bootstrap-dark.scss +1 -1
  133. package/styles/drop-down-tree/bootstrap.scss +1 -1
  134. package/styles/drop-down-tree/bootstrap4.scss +1 -1
  135. package/styles/drop-down-tree/bootstrap5-dark.scss +1 -1
  136. package/styles/drop-down-tree/bootstrap5.scss +1 -1
  137. package/styles/drop-down-tree/fabric-dark.scss +1 -1
  138. package/styles/drop-down-tree/fabric.scss +1 -1
  139. package/styles/drop-down-tree/fluent-dark.scss +1 -1
  140. package/styles/drop-down-tree/fluent.scss +1 -1
  141. package/styles/drop-down-tree/highcontrast-light.scss +1 -1
  142. package/styles/drop-down-tree/highcontrast.scss +1 -1
  143. package/styles/drop-down-tree/material-dark.css +0 -1
  144. package/styles/drop-down-tree/material-dark.scss +1 -1
  145. package/styles/drop-down-tree/material.css +0 -1
  146. package/styles/drop-down-tree/material.scss +1 -1
  147. package/styles/drop-down-tree/material3-dark.css +0 -1
  148. package/styles/drop-down-tree/material3-dark.scss +1 -1
  149. package/styles/drop-down-tree/material3.css +0 -1
  150. package/styles/drop-down-tree/material3.scss +1 -1
  151. package/styles/drop-down-tree/tailwind-dark.css +0 -1
  152. package/styles/drop-down-tree/tailwind-dark.scss +1 -1
  153. package/styles/drop-down-tree/tailwind.css +0 -1
  154. package/styles/drop-down-tree/tailwind.scss +1 -1
  155. package/styles/fabric-dark.css +70 -15
  156. package/styles/fabric.css +70 -15
  157. package/styles/fluent-dark.css +71 -16
  158. package/styles/fluent.css +71 -16
  159. package/styles/highcontrast-light.css +70 -15
  160. package/styles/highcontrast.css +70 -15
  161. package/styles/list-box/_bootstrap-dark-definition.scss +6 -2
  162. package/styles/list-box/_bootstrap-definition.scss +7 -3
  163. package/styles/list-box/_bootstrap4-definition.scss +10 -6
  164. package/styles/list-box/_bootstrap5-definition.scss +6 -4
  165. package/styles/list-box/_fabric-dark-definition.scss +6 -2
  166. package/styles/list-box/_fabric-definition.scss +6 -2
  167. package/styles/list-box/_fluent-definition.scss +10 -8
  168. package/styles/list-box/_highcontrast-definition.scss +6 -2
  169. package/styles/list-box/_highcontrast-light-definition.scss +6 -2
  170. package/styles/list-box/_layout.scss +0 -6
  171. package/styles/list-box/_material-dark-definition.scss +8 -4
  172. package/styles/list-box/_material-definition.scss +8 -4
  173. package/styles/list-box/_material3-definition.scss +10 -8
  174. package/styles/list-box/_tailwind-definition.scss +9 -7
  175. package/styles/list-box/_theme.scss +72 -7
  176. package/styles/list-box/bootstrap-dark.css +70 -15
  177. package/styles/list-box/bootstrap-dark.scss +1 -1
  178. package/styles/list-box/bootstrap.css +70 -15
  179. package/styles/list-box/bootstrap.scss +1 -1
  180. package/styles/list-box/bootstrap4.css +71 -16
  181. package/styles/list-box/bootstrap4.scss +1 -1
  182. package/styles/list-box/bootstrap5-dark.css +71 -16
  183. package/styles/list-box/bootstrap5-dark.scss +1 -1
  184. package/styles/list-box/bootstrap5.css +71 -16
  185. package/styles/list-box/bootstrap5.scss +1 -1
  186. package/styles/list-box/fabric-dark.css +70 -15
  187. package/styles/list-box/fabric-dark.scss +1 -1
  188. package/styles/list-box/fabric.css +70 -15
  189. package/styles/list-box/fabric.scss +1 -1
  190. package/styles/list-box/fluent-dark.css +71 -16
  191. package/styles/list-box/fluent-dark.scss +1 -1
  192. package/styles/list-box/fluent.css +71 -16
  193. package/styles/list-box/fluent.scss +1 -1
  194. package/styles/list-box/highcontrast-light.css +70 -15
  195. package/styles/list-box/highcontrast-light.scss +1 -1
  196. package/styles/list-box/highcontrast.css +70 -15
  197. package/styles/list-box/highcontrast.scss +1 -1
  198. package/styles/list-box/material-dark.css +71 -17
  199. package/styles/list-box/material-dark.scss +1 -1
  200. package/styles/list-box/material.css +71 -17
  201. package/styles/list-box/material.scss +1 -1
  202. package/styles/list-box/material3-dark.css +71 -17
  203. package/styles/list-box/material3-dark.scss +1 -1
  204. package/styles/list-box/material3.css +71 -17
  205. package/styles/list-box/material3.scss +1 -1
  206. package/styles/list-box/tailwind-dark.css +71 -17
  207. package/styles/list-box/tailwind-dark.scss +1 -1
  208. package/styles/list-box/tailwind.css +71 -17
  209. package/styles/list-box/tailwind.scss +1 -1
  210. package/styles/material-dark.css +71 -17
  211. package/styles/material.css +71 -17
  212. package/styles/material3-dark.css +71 -17
  213. package/styles/material3-dark.scss +1 -1
  214. package/styles/material3.css +71 -17
  215. package/styles/material3.scss +1 -1
  216. package/styles/mention/bootstrap-dark.scss +1 -1
  217. package/styles/mention/bootstrap.scss +1 -1
  218. package/styles/mention/bootstrap4.scss +1 -1
  219. package/styles/mention/bootstrap5-dark.scss +1 -1
  220. package/styles/mention/bootstrap5.scss +1 -1
  221. package/styles/mention/fabric-dark.scss +1 -1
  222. package/styles/mention/fabric.scss +1 -1
  223. package/styles/mention/fluent-dark.scss +1 -1
  224. package/styles/mention/fluent.scss +1 -1
  225. package/styles/mention/highcontrast-light.scss +1 -1
  226. package/styles/mention/highcontrast.scss +1 -1
  227. package/styles/mention/material-dark.css +0 -1
  228. package/styles/mention/material-dark.scss +1 -1
  229. package/styles/mention/material.css +0 -1
  230. package/styles/mention/material.scss +1 -1
  231. package/styles/mention/material3-dark.css +0 -1
  232. package/styles/mention/material3-dark.scss +1 -1
  233. package/styles/mention/material3.css +0 -1
  234. package/styles/mention/material3.scss +1 -1
  235. package/styles/mention/tailwind-dark.css +0 -1
  236. package/styles/mention/tailwind-dark.scss +1 -1
  237. package/styles/mention/tailwind.css +0 -1
  238. package/styles/mention/tailwind.scss +1 -1
  239. package/styles/multi-select/bootstrap-dark.scss +1 -1
  240. package/styles/multi-select/bootstrap.scss +1 -1
  241. package/styles/multi-select/bootstrap4.scss +1 -1
  242. package/styles/multi-select/bootstrap5-dark.scss +1 -1
  243. package/styles/multi-select/bootstrap5.scss +1 -1
  244. package/styles/multi-select/fabric-dark.scss +1 -1
  245. package/styles/multi-select/fabric.scss +1 -1
  246. package/styles/multi-select/fluent-dark.scss +1 -1
  247. package/styles/multi-select/fluent.scss +1 -1
  248. package/styles/multi-select/highcontrast-light.scss +1 -1
  249. package/styles/multi-select/highcontrast.scss +1 -1
  250. package/styles/multi-select/material-dark.css +0 -1
  251. package/styles/multi-select/material-dark.scss +1 -1
  252. package/styles/multi-select/material.css +0 -1
  253. package/styles/multi-select/material.scss +1 -1
  254. package/styles/multi-select/material3-dark.css +0 -1
  255. package/styles/multi-select/material3-dark.scss +1 -1
  256. package/styles/multi-select/material3.css +0 -1
  257. package/styles/multi-select/material3.scss +1 -1
  258. package/styles/multi-select/tailwind-dark.css +0 -1
  259. package/styles/multi-select/tailwind-dark.scss +1 -1
  260. package/styles/multi-select/tailwind.css +0 -1
  261. package/styles/multi-select/tailwind.scss +1 -1
  262. package/styles/tailwind-dark.css +71 -24
  263. package/styles/tailwind.css +71 -24
  264. package/tslint.json +111 -0
@@ -116,7 +116,11 @@ $listbox-filter-small-height: calc(100% - 46px) !default;
116
116
  $listbox-filter-bigger-small-height: calc(100% - 54px) !default;
117
117
  $listbox-select-height: calc(100% - 40px) !default;
118
118
  $listbox-select-bigger-height: calc(100% - 48px) !default;
119
- $listbox-filterselect-height: calc(100% - 92px) !default;
120
- $listbox-filterselect-bigger-height: calc(100% - 106px) !default;
119
+ $listbox-filterselect-height: calc(100% - 40px) !default;
120
+ $listbox-filterselect-bigger-height: calc(100% - 48px) !default;
121
+ $listbox-mat-filter-height: calc(100% - 51px) !default;
122
+ $listbox-mat-filter-bigger-height: calc(100% - 58px) !default;
121
123
  $listbox-filter-height: calc(100% - 52px) !default;
122
124
  $listbox-filter-bigger-height: calc(100% - 58px) !default;
125
+ $listbox-ej2-filterselect-height: calc(100% - 91.5px) !default;
126
+ $listbox-ej2-filterselect-bigger-height: calc(100% - 106px) !default;
@@ -108,8 +108,12 @@ $select-all-border-color: $grey-e6 !default;
108
108
  $listbox-filter-small-height: calc(100% - 46px) !default;
109
109
  $listbox-filter-bigger-small-height: calc(100% - 54px) !default;
110
110
  $listbox-select-height: calc(100% - 40px) !default;
111
- $listbox-select-bigger-height: calc(100% - 48px) !default;
112
- $listbox-filterselect-height: calc(100% - 92px) !default;
113
- $listbox-filterselect-bigger-height: calc(100% - 106px) !default;
111
+ $listbox-select-bigger-height: calc(100% - 40px) !default;
112
+ $listbox-filterselect-height: calc(100% - 40px) !default;
113
+ $listbox-filterselect-bigger-height: calc(100% - 48px) !default;
114
+ $listbox-mat-filter-height: calc(100% - 51px) !default;
115
+ $listbox-mat-filter-bigger-height: calc(100% - 58px) !default;
114
116
  $listbox-filter-height: calc(100% - 52px) !default;
115
117
  $listbox-filter-bigger-height: calc(100% - 58px) !default;
118
+ $listbox-ej2-filterselect-height: calc(100% - 91.5px) !default;
119
+ $listbox-ej2-filterselect-bigger-height: calc(100% - 106px) !default;
@@ -110,11 +110,15 @@ $badge-bgcolor: $primary !default;
110
110
 
111
111
  $select-all-border-color: rgba($black, .15);
112
112
 
113
- $listbox-filter-small-height: calc(100% - 32px) !default;
114
- $listbox-filter-bigger-small-height: calc(100% - 44px) !default;
113
+ $listbox-filter-small-height: calc(100% - 43px) !default;
114
+ $listbox-filter-bigger-small-height: calc(100% - 56px) !default;
115
115
  $listbox-select-height: calc(100% - 40px) !default;
116
116
  $listbox-select-bigger-height: calc(100% - 50px) !default;
117
- $listbox-filterselect-height: calc(100% - 79px) !default;
118
- $listbox-filterselect-bigger-height: calc(100% - 96px) !default;
119
- $listbox-filter-height: calc(100% - 39px) !default;
120
- $listbox-filter-bigger-height: calc(100% - 46px) !default;
117
+ $listbox-filterselect-height: calc(100% - 41px) !default;
118
+ $listbox-filterselect-bigger-height: calc(100% - 50px) !default;
119
+ $listbox-mat-filter-height: calc(100% - 50px) !default;
120
+ $listbox-mat-filter-bigger-height: calc(100% - 58px) !default;
121
+ $listbox-filter-height: calc(100% - 51px) !default;
122
+ $listbox-filter-bigger-height: calc(100% - 59px) !default;
123
+ $listbox-ej2-filterselect-height: calc(100% - 90.5px) !default;
124
+ $listbox-ej2-filterselect-bigger-height: calc(100% - 108px) !default;
@@ -68,10 +68,8 @@ $listbox-template-multiline-header-font-size: $text-sm !default;
68
68
  $listbox-template-multiline-padding: 4px !default;
69
69
  $listbox-template-multiline-content-font-size: $text-sm !default;
70
70
  $listbox-template-multiline-avatar-top: 0 !default;
71
- $listbox-filter-height: calc(100% - 47px) !default;
72
71
  $listbox-filter-small-height: calc(100% - 45px) !default;
73
72
  $listbox-filter-bigger-small-height: calc(100% - 45px) !default;
74
- $listbox-filter-bigger-height: calc(100% - 55px) !default;
75
73
  $listbox-item-height: 36px !default;
76
74
 
77
75
  $listbox-border-color: $border-light;
@@ -112,7 +110,11 @@ $listbox-template-multiline-content-color: $content-text-color-alt2 !default;
112
110
 
113
111
  $listbox-select-height: calc(100% - 36px) !default;
114
112
  $listbox-select-bigger-height: calc(100% - 40px) !default;
115
- $listbox-filterselect-height: calc(100% - 86px) !default;
116
- $listbox-filterselect-bigger-height: calc(100% - 96px) !default;
113
+ $listbox-filterselect-height: calc(100% - 36px) !default;
114
+ $listbox-filterselect-bigger-height: calc(100% - 48px) !default;
115
+ $listbox-mat-filter-height: calc(100% - 50px) !default;
116
+ $listbox-mat-filter-bigger-height: calc(100% - 55px) !default;
117
117
  $listbox-filter-height: calc(100% - 50px) !default;
118
118
  $listbox-filter-bigger-height: calc(100% - 56px) !default;
119
+ $listbox-ej2-filterselect-height: calc(100% - 86px) !default;
120
+ $listbox-ej2-filterselect-bigger-height: calc(100% - 104px) !default;
@@ -116,7 +116,11 @@ $listbox-filter-small-height: calc(100% - 45px) !default;
116
116
  $listbox-filter-bigger-small-height: calc(100% - 55px) !default;
117
117
  $listbox-select-height: calc(100% - 36px) !default;
118
118
  $listbox-select-bigger-height: calc(100% - 45px) !default;
119
- $listbox-filterselect-height: calc(100% - 87px) !default;
120
- $listbox-filterselect-bigger-height: calc(100% - 104px) !default;
119
+ $listbox-filterselect-height: calc(100% - 36px) !default;
120
+ $listbox-filterselect-bigger-height: calc(100% - 45px) !default;
121
+ $listbox-mat-filter-height: calc(100% - 50px) !default;
122
+ $listbox-mat-filter-bigger-height: calc(100% - 58px) !default;
121
123
  $listbox-filter-height: calc(100% - 51px) !default;
122
124
  $listbox-filter-bigger-height: calc(100% - 59px) !default;
125
+ $listbox-ej2-filterselect-height: calc(100% - 87px) !default;
126
+ $listbox-ej2-filterselect-bigger-height: calc(100% - 104px) !default;
@@ -109,7 +109,11 @@ $listbox-filter-small-height: calc(100% - 45px) !default;
109
109
  $listbox-filter-bigger-small-height: calc(100% - 55px) !default;
110
110
  $listbox-select-height: calc(100% - 36px) !default;
111
111
  $listbox-select-bigger-height: calc(100% - 45px) !default;
112
- $listbox-filterselect-height: calc(100% - 87px) !default;
113
- $listbox-filterselect-bigger-height: calc(100% - 104px) !default;
112
+ $listbox-filterselect-height: calc(100% - 36px) !default;
113
+ $listbox-filterselect-bigger-height: calc(100% - 45px) !default;
114
+ $listbox-mat-filter-height: calc(100% - 50px) !default;
115
+ $listbox-mat-filter-bigger-height: calc(100% - 58px) !default;
114
116
  $listbox-filter-height: calc(100% - 51px) !default;
115
117
  $listbox-filter-bigger-height: calc(100% - 59px) !default;
118
+ $listbox-ej2-filterselect-height: calc(100% - 87px) !default;
119
+ $listbox-ej2-filterselect-bigger-height: calc(100% - 104px) !default;
@@ -68,10 +68,8 @@ $listbox-template-multiline-header-font-size: $text-sm !default;
68
68
  $listbox-template-multiline-padding: 4px !default;
69
69
  $listbox-template-multiline-content-font-size: $text-sm !default;
70
70
  $listbox-template-multiline-avatar-top: 0 !default;
71
- $listbox-filter-height: calc(100% - 47px) !default;
72
- $listbox-filter-small-height: calc(100% - 45px) !default;
73
- $listbox-filter-bigger-small-height: calc(100% - 45px) !default;
74
- $listbox-filter-bigger-height: calc(100% - 55px) !default;
71
+ $listbox-filter-small-height: calc(100% - 50px) !default;
72
+ $listbox-filter-bigger-small-height: calc(100% - 59px) !default;
75
73
  $listbox-item-height: 36px !default;
76
74
 
77
75
  $listbox-border-color: $border-light;
@@ -112,7 +110,11 @@ $listbox-template-multiline-content-color: $content-text-color-alt2 !default;
112
110
 
113
111
  $listbox-select-height: calc(100% - 36px) !default;
114
112
  $listbox-select-bigger-height: calc(100% - 48px) !default;
115
- $listbox-filterselect-height: calc(100% - 93px) !default;
116
- $listbox-filterselect-bigger-height: calc(100% - 113px) !default;
117
- $listbox-filter-height: calc(100% - 57px) !default;
118
- $listbox-filter-bigger-height: calc(100% - 65px) !default;
113
+ $listbox-filterselect-height: calc(100% - 36px) !default;
114
+ $listbox-filterselect-bigger-height: calc(100% - 48px) !default;
115
+ $listbox-mat-filter-height: calc(100% - 56px) !default;
116
+ $listbox-mat-filter-bigger-height: calc(100% - 64px) !default;
117
+ $listbox-filter-height: calc(100% - 56px) !default;
118
+ $listbox-filter-bigger-height: calc(100% - 64px) !default;
119
+ $listbox-ej2-filterselect-height: calc(100% - 93px) !default;
120
+ $listbox-ej2-filterselect-bigger-height: calc(100% - 113px) !default;
@@ -109,7 +109,11 @@ $listbox-filter-small-height: calc(100% - 45px) !default;
109
109
  $listbox-filter-bigger-small-height: calc(100% - 55px) !default;
110
110
  $listbox-select-height: calc(100% - 36px) !default;
111
111
  $listbox-select-bigger-height: calc(100% - 45px) !default;
112
- $listbox-filterselect-height: calc(100% - 87px) !default;
113
- $listbox-filterselect-bigger-height: calc(100% - 104px) !default;
112
+ $listbox-filterselect-height: calc(100% - 36px) !default;
113
+ $listbox-filterselect-bigger-height: calc(100% - 45px) !default;
114
+ $listbox-mat-filter-height: calc(100% - 50px) !default;
115
+ $listbox-mat-filter-bigger-height: calc(100% - 58px) !default;
114
116
  $listbox-filter-height: calc(100% - 51px) !default;
115
117
  $listbox-filter-bigger-height: calc(100% - 59px) !default;
118
+ $listbox-ej2-filterselect-height: calc(100% - 87px) !default;
119
+ $listbox-ej2-filterselect-bigger-height: calc(100% - 104px) !default;
@@ -116,7 +116,11 @@ $listbox-filter-small-height: calc(100% - 45px) !default;
116
116
  $listbox-filter-bigger-small-height: calc(100% - 55px) !default;
117
117
  $listbox-select-height: calc(100% - 36px) !default;
118
118
  $listbox-select-bigger-height: calc(100% - 45px) !default;
119
- $listbox-filterselect-height: calc(100% - 87px) !default;
120
- $listbox-filterselect-bigger-height: calc(100% - 104px) !default;
119
+ $listbox-filterselect-height: calc(100% - 36px) !default;
120
+ $listbox-filterselect-bigger-height: calc(100% - 45px) !default;
121
+ $listbox-mat-filter-height: calc(100% - 50px) !default;
122
+ $listbox-mat-filter-bigger-height: calc(100% - 58px) !default;
121
123
  $listbox-filter-height: calc(100% - 51px) !default;
122
124
  $listbox-filter-bigger-height: calc(100% - 59px) !default;
125
+ $listbox-ej2-filterselect-height: calc(100% - 87px) !default;
126
+ $listbox-ej2-filterselect-bigger-height: calc(100% - 104px) !default;
@@ -57,10 +57,6 @@
57
57
  position: relative;
58
58
  }
59
59
 
60
- &.e-filter-list {
61
- overflow: inherit;
62
- }
63
-
64
60
  .e-list-parent {
65
61
  height: 100%;
66
62
  min-height: $listbox-item-height;
@@ -314,8 +310,6 @@
314
310
  .e-listbox-wrapper {
315
311
 
316
312
  &.e-filter-list {
317
- overflow: inherit;
318
-
319
313
  & .e-list-parent {
320
314
  overflow: auto;
321
315
  }
@@ -116,7 +116,11 @@ $listbox-filter-small-height: calc(100% - 45px) !default;
116
116
  $listbox-filter-bigger-small-height: calc(100% - 45px) !default;
117
117
  $listbox-select-height: calc(100% - 36px) !default;
118
118
  $listbox-select-bigger-height: calc(100% - 48px) !default;
119
- $listbox-filterselect-height: calc(100% - 79px) !default;
120
- $listbox-filterselect-bigger-height: calc(100% - 98px) !default;
121
- $listbox-filter-height: calc(100% - 43px) !default;
122
- $listbox-filter-bigger-height: calc(100% - 50px) !default;
119
+ $listbox-filterselect-height: calc(100% - 36px) !default;
120
+ $listbox-filterselect-bigger-height: calc(100% - 48px) !default;
121
+ $listbox-mat-filter-height: calc(100% - 43px) !default;
122
+ $listbox-mat-filter-bigger-height: calc(100% - 50px) !default;
123
+ $listbox-filter-height: calc(100% - 48px) !default;
124
+ $listbox-filter-bigger-height: calc(100% - 55px) !default;
125
+ $listbox-ej2-filterselect-height: calc(100% - 83px) !default;
126
+ $listbox-ej2-filterselect-bigger-height: calc(100% - 103px) !default;
@@ -109,7 +109,11 @@ $listbox-filter-small-height: calc(100% - 45px) !default;
109
109
  $listbox-filter-bigger-small-height: calc(100% - 45px) !default;
110
110
  $listbox-select-height: calc(100% - 36px) !default;
111
111
  $listbox-select-bigger-height: calc(100% - 48px) !default;
112
- $listbox-filterselect-height: calc(100% - 79px) !default;
113
- $listbox-filterselect-bigger-height: calc(100% - 98px) !default;
114
- $listbox-filter-height: calc(100% - 43px) !default;
115
- $listbox-filter-bigger-height: calc(100% - 50px) !default;
112
+ $listbox-filterselect-height: calc(100% - 36px) !default;
113
+ $listbox-filterselect-bigger-height: calc(100% - 48px) !default;
114
+ $listbox-mat-filter-height: calc(100% - 43px) !default;
115
+ $listbox-mat-filter-bigger-height: calc(100% - 50px) !default;
116
+ $listbox-filter-height: calc(100% - 48px) !default;
117
+ $listbox-filter-bigger-height: calc(100% - 55px) !default;
118
+ $listbox-ej2-filterselect-height: calc(100% - 83px) !default;
119
+ $listbox-ej2-filterselect-bigger-height: calc(100% - 103px) !default;
@@ -68,10 +68,8 @@ $listbox-template-multiline-header-font-size: $text-sm !default;
68
68
  $listbox-template-multiline-padding: 4px !default;
69
69
  $listbox-template-multiline-content-font-size: $text-sm !default;
70
70
  $listbox-template-multiline-avatar-top: 0 !default;
71
- $listbox-filter-height: calc(100% - 47px) !default;
72
- $listbox-filter-small-height: calc(100% - 45px) !default;
73
- $listbox-filter-bigger-small-height: calc(100% - 45px) !default;
74
- $listbox-filter-bigger-height: calc(100% - 55px) !default;
71
+ $listbox-filter-small-height: calc(100% - 35px) !default;
72
+ $listbox-filter-bigger-small-height: calc(100% - 37px) !default;
75
73
  $listbox-item-height: 40px !default;
76
74
 
77
75
  $listbox-border-color: rgba($border-light);
@@ -111,7 +109,11 @@ $listbox-template-multiline-header-color: rgba($content-text-color) !default;
111
109
  $listbox-template-multiline-content-color: rgba($content-text-color-alt2) !default;
112
110
  $listbox-select-height: calc(100% - 36px) !default;
113
111
  $listbox-select-bigger-height: calc(100% - 48px) !default;
114
- $listbox-filterselect-height: calc(100% - 79px) !default;
115
- $listbox-filterselect-bigger-height: calc(100% - 98px) !default;
116
- $listbox-filter-height: calc(100% - 43px) !default;
117
- $listbox-filter-bigger-height: calc(100% - 50px) !default;
112
+ $listbox-filterselect-height: calc(100% - 40px) !default;
113
+ $listbox-filterselect-bigger-height: calc(100% - 48px) !default;
114
+ $listbox-mat-filter-height: calc(100% - ($listbox-item-height - 4px)) !default;
115
+ $listbox-mat-filter-bigger-height: calc(100% - ($listbox-touch-item-height - 4px)) !default;
116
+ $listbox-filter-height: calc(100% - 36px) !default;
117
+ $listbox-filter-bigger-height: calc(100% - 44px) !default;
118
+ $listbox-ej2-filterselect-height: calc(100% - 76px) !default;
119
+ $listbox-ej2-filterselect-bigger-height: calc(100% - 92px) !default;
@@ -69,10 +69,8 @@ $listbox-template-multiline-header-font-size: $text-sm !default;
69
69
  $listbox-template-multiline-padding: 4px !default;
70
70
  $listbox-template-multiline-content-font-size: $text-sm !default;
71
71
  $listbox-template-multiline-avatar-top: 0 !default;
72
- $listbox-filter-height: calc(100% - 47px) !default;
73
72
  $listbox-filter-small-height: calc(100% - 45px) !default;
74
- $listbox-filter-bigger-small-height: calc(100% - 45px) !default;
75
- $listbox-filter-bigger-height: calc(100% - 55px) !default;
73
+ $listbox-filter-bigger-small-height: calc(100% - 53px) !default;
76
74
 
77
75
  $listbox-border-color: $border-light;
78
76
  $badge-color: $primary-text-color !default;
@@ -111,7 +109,11 @@ $listbox-template-multiline-header-color: $content-text-color !default;
111
109
  $listbox-template-multiline-content-color: $content-text-color-alt2 !default;
112
110
  $listbox-select-height: calc(100% - 38px) !default;
113
111
  $listbox-select-bigger-height: calc(100% - 48px) !default;
114
- $listbox-filterselect-height: calc(100% - 76px) !default;
115
- $listbox-filterselect-bigger-height: calc(100% - 94px) !default;
116
- $listbox-filter-height: calc(100% - 38px) !default;
117
- $listbox-filter-bigger-height: calc(100% - 46px) !default;
112
+ $listbox-filterselect-height: calc(100% - 38px) !default;
113
+ $listbox-filterselect-bigger-height: calc(100% - 47px) !default;
114
+ $listbox-mat-filter-height: calc(100% - 50px) !default;
115
+ $listbox-mat-filter-bigger-height: calc(100% - 58px) !default;
116
+ $listbox-filter-height: calc(100% - 50px) !default;
117
+ $listbox-filter-bigger-height: calc(100% - 58px) !default;
118
+ $listbox-ej2-filterselect-height: calc(100% - 87.5px) !default;
119
+ $listbox-ej2-filterselect-bigger-height: calc(100% - 106px) !default;
@@ -1,27 +1,64 @@
1
1
  @include export-module('listbox-theme') {
2
2
  .e-small .e-listbox-wrapper.e-filter-list .e-list-parent,
3
3
  .e-small .e-listbox-container.e-filter-list .e-list-parent {
4
- height: $listbox-filter-small-height;
4
+ height: $listbox-filter-small-height !important; /* stylelint-disable-line declaration-no-important */
5
+ }
6
+
7
+ .e-bigger .e-listbox-wrapper.e-filter-list:not(.e-listbox-container) .e-list-parent {
8
+ height: $listbox-filter-bigger-height !important; /* stylelint-disable-line declaration-no-important */
9
+ }
10
+ .e-bigger .e-listbox-container.e-filter-list .e-list-wrap {
11
+ height: $listbox-mat-filter-bigger-height !important; /* stylelint-disable-line declaration-no-important */
5
12
  }
6
13
 
7
- .e-bigger .e-listbox-wrapper.e-filter-list .e-list-parent,
8
14
  .e-bigger .e-listbox-container.e-filter-list .e-list-parent {
9
- height: $listbox-filter-bigger-height;
15
+ height: 100%;
10
16
  }
11
17
 
12
18
  .e-bigger .e-listbox-wrapper.e-filter-list .e-selectall-parent + .e-list-parent,
13
19
  .e-bigger .e-listbox-container.e-filter-list .e-selectall-parent + .e-list-parent {
14
- height: $listbox-filterselect-bigger-height;
20
+ height: $listbox-filterselect-bigger-height !important; /* stylelint-disable-line declaration-no-important */
21
+ }
22
+
23
+ .e-listbox-container.e-filter-list .e-selectall-parent + .e-list-parent {
24
+ height: $listbox-filterselect-bigger-height !important; /* stylelint-disable-line declaration-no-important */
25
+ }
26
+
27
+ .e-listbox-wrapper.e-filter-list:not(.e-listbox-container) .e-list-parent {
28
+ height: $listbox-filter-height !important; /* stylelint-disable-line declaration-no-important */
29
+ }
30
+
31
+ .e-bigger .e-listbox-wrapper.e-filter-list:not(.e-listbox-container) .e-list-parent {
32
+ height: $listbox-filter-bigger-height !important; /* stylelint-disable-line declaration-no-important */
33
+ }
34
+ .e-bigger .e-listbox-container.e-filter-list .e-selectall-parent + .e-list-parent {
35
+ height: 100%;
15
36
  }
16
37
 
17
38
  .e-bigger .e-listbox-wrapper .e-selectall-parent + .e-list-parent,
39
+ .e-bigger .e-listbox-container .e-selectall-parent + .e-list-wrap {
40
+ height: $listbox-select-bigger-height !important; /* stylelint-disable-line declaration-no-important */
41
+ }
42
+
18
43
  .e-bigger .e-listbox-container .e-selectall-parent + .e-list-parent {
19
- height: $listbox-select-bigger-height;
44
+ height: 100%;
20
45
  }
21
46
 
22
47
  .e-small.e-bigger .e-listbox-wrapper.e-filter-list .e-list-parent,
48
+ .e-small.e-bigger .e-listbox-container.e-filter-list .e-list-wrap {
49
+ height: $listbox-filter-bigger-small-height !important; /* stylelint-disable-line declaration-no-important */
50
+ }
51
+
52
+ .e-listbox-wrapper.e-filter-list:not(.e-listbox-container) .e-selectall-parent + .e-hidden-select + .e-listbox + .e-list-parent {
53
+ height: $listbox-ej2-filterselect-height !important;/* stylelint-disable-line declaration-no-important */
54
+ }
55
+
56
+ .e-bigger .e-listbox-wrapper.e-filter-list:not(.e-listbox-container) .e-selectall-parent + .e-hidden-select + .e-listbox + .e-list-parent {
57
+ height: $listbox-ej2-filterselect-bigger-height !important;/* stylelint-disable-line declaration-no-important */
58
+ }
59
+
23
60
  .e-small.e-bigger .e-listbox-container.e-filter-list .e-list-parent {
24
- height: $listbox-filter-bigger-small-height;
61
+ height: 100%;
25
62
  }
26
63
 
27
64
  .e-listbox-wrapper,
@@ -62,7 +99,7 @@
62
99
  }
63
100
 
64
101
  &.e-filter-list .e-selectall-parent + .e-list-parent {
65
- height: $listbox-filterselect-height;
102
+ height: $listbox-filterselect-height !important; /* stylelint-disable-line declaration-no-important */
66
103
  }
67
104
 
68
105
  & .e-selectall-parent + .e-list-parent {
@@ -314,4 +351,32 @@
314
351
  }
315
352
  }
316
353
  }
354
+
355
+ .e-listbox-container {
356
+ @at-root {
357
+ &.e-filter-list .e-list-parent {
358
+ height: 100%;
359
+ }
360
+
361
+ &.e-filter-list .e-selectall-parent + .e-list-parent {
362
+ height: 100%;
363
+ }
364
+
365
+ & .e-selectall-parent + .e-list-parent {
366
+ height: 100%;
367
+ }
368
+
369
+ &.e-filter-list .e-list-wrap {
370
+ height: $listbox-mat-filter-height !important; /* stylelint-disable-line declaration-no-important */
371
+ }
372
+
373
+ &.e-filter-list .e-selectall-parent + .e-list-wrap {
374
+ height: $listbox-filterselect-height !important; /* stylelint-disable-line declaration-no-important */
375
+ }
376
+
377
+ & .e-selectall-parent + .e-list-wrap {
378
+ height: $listbox-select-height !important; /* stylelint-disable-line declaration-no-important */
379
+ }
380
+ }
381
+ }
317
382
  }
@@ -84,11 +84,6 @@
84
84
  padding: 13px 16px;
85
85
  position: relative;
86
86
  }
87
- .e-listbox-wrapper.e-filter-list,
88
- .e-listbox-container.e-filter-list,
89
- .e-listboxtool-wrapper.e-filter-list {
90
- overflow: inherit;
91
- }
92
87
  .e-listbox-wrapper .e-list-parent,
93
88
  .e-listbox-container .e-list-parent,
94
89
  .e-listboxtool-wrapper .e-list-parent {
@@ -372,9 +367,6 @@ ejs-listbox {
372
367
  overflow: auto;
373
368
  }
374
369
 
375
- .e-listbox-wrapper.e-filter-list {
376
- overflow: inherit;
377
- }
378
370
  .e-listbox-wrapper.e-filter-list .e-list-parent {
379
371
  overflow: auto;
380
372
  }
@@ -570,27 +562,66 @@ ejs-listbox {
570
562
  }
571
563
  .e-small .e-listbox-wrapper.e-filter-list .e-list-parent,
572
564
  .e-small .e-listbox-container.e-filter-list .e-list-parent {
573
- height: calc(100% - 46px);
565
+ height: calc(100% - 46px) !important; /* stylelint-disable-line declaration-no-important */
566
+ }
567
+
568
+ .e-bigger .e-listbox-wrapper.e-filter-list:not(.e-listbox-container) .e-list-parent {
569
+ height: calc(100% - 58px) !important; /* stylelint-disable-line declaration-no-important */
570
+ }
571
+
572
+ .e-bigger .e-listbox-container.e-filter-list .e-list-wrap {
573
+ height: calc(100% - 58px) !important; /* stylelint-disable-line declaration-no-important */
574
574
  }
575
575
 
576
- .e-bigger .e-listbox-wrapper.e-filter-list .e-list-parent,
577
576
  .e-bigger .e-listbox-container.e-filter-list .e-list-parent {
578
- height: calc(100% - 58px);
577
+ height: 100%;
579
578
  }
580
579
 
581
580
  .e-bigger .e-listbox-wrapper.e-filter-list .e-selectall-parent + .e-list-parent,
582
581
  .e-bigger .e-listbox-container.e-filter-list .e-selectall-parent + .e-list-parent {
583
- height: calc(100% - 106px);
582
+ height: calc(100% - 48px) !important; /* stylelint-disable-line declaration-no-important */
583
+ }
584
+
585
+ .e-listbox-container.e-filter-list .e-selectall-parent + .e-list-parent {
586
+ height: calc(100% - 48px) !important; /* stylelint-disable-line declaration-no-important */
587
+ }
588
+
589
+ .e-listbox-wrapper.e-filter-list:not(.e-listbox-container) .e-list-parent {
590
+ height: calc(100% - 52px) !important; /* stylelint-disable-line declaration-no-important */
591
+ }
592
+
593
+ .e-bigger .e-listbox-wrapper.e-filter-list:not(.e-listbox-container) .e-list-parent {
594
+ height: calc(100% - 58px) !important; /* stylelint-disable-line declaration-no-important */
595
+ }
596
+
597
+ .e-bigger .e-listbox-container.e-filter-list .e-selectall-parent + .e-list-parent {
598
+ height: 100%;
584
599
  }
585
600
 
586
601
  .e-bigger .e-listbox-wrapper .e-selectall-parent + .e-list-parent,
602
+ .e-bigger .e-listbox-container .e-selectall-parent + .e-list-wrap {
603
+ height: calc(100% - 48px) !important; /* stylelint-disable-line declaration-no-important */
604
+ }
605
+
587
606
  .e-bigger .e-listbox-container .e-selectall-parent + .e-list-parent {
588
- height: calc(100% - 48px);
607
+ height: 100%;
589
608
  }
590
609
 
591
610
  .e-small.e-bigger .e-listbox-wrapper.e-filter-list .e-list-parent,
611
+ .e-small.e-bigger .e-listbox-container.e-filter-list .e-list-wrap {
612
+ height: calc(100% - 54px) !important; /* stylelint-disable-line declaration-no-important */
613
+ }
614
+
615
+ .e-listbox-wrapper.e-filter-list:not(.e-listbox-container) .e-selectall-parent + .e-hidden-select + .e-listbox + .e-list-parent {
616
+ height: calc(100% - 91.5px) !important; /* stylelint-disable-line declaration-no-important */
617
+ }
618
+
619
+ .e-bigger .e-listbox-wrapper.e-filter-list:not(.e-listbox-container) .e-selectall-parent + .e-hidden-select + .e-listbox + .e-list-parent {
620
+ height: calc(100% - 106px) !important; /* stylelint-disable-line declaration-no-important */
621
+ }
622
+
592
623
  .e-small.e-bigger .e-listbox-container.e-filter-list .e-list-parent {
593
- height: calc(100% - 54px);
624
+ height: 100%;
594
625
  }
595
626
 
596
627
  .e-listbox-wrapper,
@@ -623,7 +654,7 @@ ejs-listbox {
623
654
  .e-listbox-wrapper.e-filter-list .e-selectall-parent + .e-list-parent,
624
655
  .e-listbox-container.e-filter-list .e-selectall-parent + .e-list-parent,
625
656
  .e-listboxtool-wrapper.e-filter-list .e-selectall-parent + .e-list-parent {
626
- height: calc(100% - 92px);
657
+ height: calc(100% - 40px) !important; /* stylelint-disable-line declaration-no-important */
627
658
  }
628
659
 
629
660
  .e-listbox-wrapper .e-selectall-parent + .e-list-parent,
@@ -897,4 +928,28 @@ ejs-listbox {
897
928
  .e-listboxtool-wrapper.e-rtl.e-list-template .e-list-wrapper.e-list-badge:not(.e-list-avatar) {
898
929
  padding-left: 3.9285em;
899
930
  padding-right: 1.0714em;
931
+ }
932
+
933
+ .e-listbox-container.e-filter-list .e-list-parent {
934
+ height: 100%;
935
+ }
936
+
937
+ .e-listbox-container.e-filter-list .e-selectall-parent + .e-list-parent {
938
+ height: 100%;
939
+ }
940
+
941
+ .e-listbox-container .e-selectall-parent + .e-list-parent {
942
+ height: 100%;
943
+ }
944
+
945
+ .e-listbox-container.e-filter-list .e-list-wrap {
946
+ height: calc(100% - 51px) !important; /* stylelint-disable-line declaration-no-important */
947
+ }
948
+
949
+ .e-listbox-container.e-filter-list .e-selectall-parent + .e-list-wrap {
950
+ height: calc(100% - 40px) !important; /* stylelint-disable-line declaration-no-important */
951
+ }
952
+
953
+ .e-listbox-container .e-selectall-parent + .e-list-wrap {
954
+ height: calc(100% - 40px) !important; /* stylelint-disable-line declaration-no-important */
900
955
  }
@@ -1,4 +1,4 @@
1
- @import 'ej2-base/styles/bootstrap-dark-definition.scss';
1
+ @import 'ej2-base/styles/definition/bootstrap-dark.scss';
2
2
  @import '../drop-down-base/bootstrap-dark-definition.scss';
3
3
  @import 'bootstrap-dark-definition.scss';
4
4
  @import 'icons/bootstrap-dark.scss';